:root {
  --ink: #10221a;
  --forest: #143629;
  --forest-2: #1d4938;
  --moss: #8fa470;
  --lime: #dbe7b0;
  --cream: #f4f0e7;
  --paper: #fbfaf6;
  --coffee: #7a5139;
  --aqua: #59e0ad;
  --sky: #1aa9f0;
  --line: rgba(16, 34, 26, .15);
  --muted: #66736c;
  --white: #ffffff;
  --radius: 22px;
  --shadow: 0 24px 70px rgba(16, 34, 26, .12);
  --container: 1180px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--ink);
  background: var(--paper);
  font-family: "Hiragino Kaku Gothic ProN", "Yu Gothic", "YuGothic", "Noto Sans JP", system-ui, sans-serif;
  line-height: 1.8;
  letter-spacing: .02em;
}
body.nav-open { overflow: hidden; }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }
img, svg { display: block; max-width: 100%; }
code { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: .9em; }

.container { width: min(calc(100% - 48px), var(--container)); margin-inline: auto; }
.section { padding: 112px 0; }
.section-light { background: var(--paper); }
.section-dark { background: var(--forest); color: var(--white); }
.section-ink { background: var(--ink); color: var(--white); }

.skip-link { position: fixed; left: 12px; top: -100px; z-index: 999; background: #fff; color: #000; padding: 8px 14px; border-radius: 10px; }
.skip-link:focus { top: 12px; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }

.site-header { position: fixed; inset: 0 0 auto; z-index: 100; transition: .25s ease; color: #fff; }
.site-header.scrolled { background: rgba(20, 54, 41, .92); backdrop-filter: blur(16px); box-shadow: 0 1px 0 rgba(255,255,255,.1); }
.header-inner { min-height: 84px; display: flex; align-items: center; justify-content: space-between; gap: 28px; }
.brand { display: inline-flex; align-items: center; gap: 10px; font-weight: 850; letter-spacing: .08em; font-size: 1.08rem; }
.brand-image { width: 56px; height: 38px; object-fit: contain; object-position: center; border-radius: 9px; background: #1a271f; border: 1px solid rgba(255,255,255,.22); box-shadow: 0 6px 18px rgba(0,0,0,.15); }
.footer-brand .brand-image { width: 66px; height: 45px; }
.global-nav { display: flex; align-items: center; gap: 30px; font-size: .88rem; font-weight: 700; }
.global-nav a { opacity: .84; transition: .2s; }
.global-nav a:hover { opacity: 1; }
.nav-cta { border: 1px solid rgba(255,255,255,.5); border-radius: 999px; padding: 10px 17px; }
.nav-toggle { display: none; border: 0; background: transparent; padding: 8px; }
.nav-toggle span:not(.sr-only) { display: block; width: 24px; height: 2px; background: #fff; margin: 5px; transition: .2s; }

.hero { min-height: 820px; padding: 160px 0 90px; overflow: hidden; position: relative; }
.hero::after { content: ""; position: absolute; width: 720px; height: 720px; right: -300px; top: -260px; border-radius: 50%; border: 1px solid rgba(255,255,255,.12); }
.hero-grid { display: grid; grid-template-columns: 1.05fr .95fr; align-items: center; gap: 72px; }
.eyebrow { margin: 0 0 18px; font-size: .76rem; line-height: 1.2; font-weight: 850; letter-spacing: .18em; text-transform: uppercase; opacity: .72; }
.hero h1, .section-heading h2, .reserve-copy h2, .contact-band h2 { margin: 0; line-height: 1.22; letter-spacing: -.045em; }
.hero h1 { font-size: clamp(3.2rem, 6.4vw, 6.5rem); font-weight: 850; }
.hero h1 em { color: var(--lime); font-style: normal; }
.hero-lead { max-width: 650px; font-size: 1.1rem; color: rgba(255,255,255,.78); margin: 34px 0 0; }
.hero-signature { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 28px; padding: 10px 14px; border: 1px solid rgba(255,255,255,.15); border-radius: 999px; background: rgba(255,255,255,.06); backdrop-filter: blur(12px); font-size: .78rem; letter-spacing: .08em; font-weight: 850; }
.hero-signature span:first-child { color: var(--aqua); }
.hero-signature span:nth-of-type(2) { color: var(--sky); }
.hero-signature b, .hero-signature i { color: rgba(255,255,255,.42); font-style: normal; }
.hero-signature strong { color: var(--white); }
.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 36px; }
.micro-note { max-width: 670px; margin-top: 32px; color: rgba(255,255,255,.5); font-size: .72rem; }
.button { display: inline-flex; justify-content: center; align-items: center; min-height: 52px; border-radius: 999px; padding: 12px 22px; font-weight: 800; border: 1px solid transparent; transition: transform .2s, background .2s, border-color .2s; }
.button:hover { transform: translateY(-2px); }
.button-primary { background: var(--lime); color: var(--forest); border-color: var(--lime); }
.button-ghost { color: #fff; border-color: rgba(255,255,255,.4); background: transparent; }
.button-light { background: #fff; color: var(--forest); }
.button-secondary { background: transparent; border-color: var(--line); color: var(--ink); }

.hero-visual { min-height: 520px; position: relative; }
.hero-artwork { margin: 0; align-self: center; }
.hero-artwork::before { content: ""; position: absolute; inset: -18px; border: 1px solid rgba(219,231,176,.28); border-radius: 30px; transform: rotate(2deg); }
.hero-artwork img { position: relative; z-index: 1; width: 100%; aspect-ratio: 1.48 / 1; object-fit: cover; border-radius: 24px; box-shadow: 0 34px 90px rgba(0,0,0,.38); border: 1px solid rgba(255,255,255,.14); }
.hero-artwork figcaption { position: absolute; z-index: 2; left: 22px; right: 22px; bottom: 22px; display: flex; justify-content: space-between; align-items: center; gap: 18px; padding: 12px 15px; border-radius: 14px; background: rgba(10,25,18,.76); backdrop-filter: blur(12px); border: 1px solid rgba(255,255,255,.15); }
.hero-artwork figcaption span { font-size: .66rem; letter-spacing: .14em; font-weight: 900; color: rgba(255,255,255,.7); }
.hero-artwork figcaption strong { font-size: .86rem; color: var(--lime); white-space: nowrap; }

.section-heading { margin-bottom: 56px; }
.section-heading h2, .reserve-copy h2, .contact-band h2 { font-size: clamp(2.2rem, 4.7vw, 4.6rem); font-weight: 840; }
.section-heading .section-intro { max-width: 760px; color: var(--muted); }
.split-heading { display: grid; grid-template-columns: 1.2fr .8fr; align-items: end; gap: 80px; }
.split-heading > p { max-width: 480px; margin: 0 0 8px; color: var(--muted); }
.about-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 100px; align-items: start; }
.about-copy .lead { font-size: 1.42rem; font-weight: 730; line-height: 1.75; margin-top: 0; }
.about-copy p:not(.lead) { color: var(--muted); }
.principle-card { background: var(--cream); border-radius: var(--radius); padding: 30px; }
.card-kicker { margin: 0 0 10px; font-size: .72rem; font-weight: 900; letter-spacing: .14em; }
.principle-list { list-style: none; padding: 0; margin: 0; }
.principle-list li { display: grid; grid-template-columns: 56px 1fr; gap: 12px; padding: 18px 0; border-bottom: 1px solid var(--line); }
.principle-list li:last-child { border-bottom: 0; }
.principle-list li > span { color: var(--coffee); font-weight: 900; }
.principle-list strong, .principle-list small { display: block; }
.principle-list small { margin-top: 3px; color: var(--muted); }


/* Bout.AI × Linne.Lab */
.collab-section {
  position: relative;
  overflow: hidden;
  color: #fff;
  background:
    radial-gradient(circle at 10% 20%, rgba(89,224,173,.18), transparent 28%),
    radial-gradient(circle at 88% 8%, rgba(26,169,240,.18), transparent 30%),
    linear-gradient(135deg, #0c1b16 0%, #102b22 54%, #10232a 100%);
}
.collab-section::before {
  content: "";
  position: absolute;
  inset: 0;
  opacity: .12;
  pointer-events: none;
  background-image: linear-gradient(rgba(255,255,255,.1) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.1) 1px, transparent 1px);
  background-size: 64px 64px;
  mask-image: linear-gradient(to bottom, transparent, #000 18%, #000 82%, transparent);
}
.collab-section .container { position: relative; z-index: 1; }
.collab-section .eyebrow { color: var(--aqua); opacity: .9; }
.collab-head { display: grid; grid-template-columns: 1.2fr .8fr; gap: 90px; align-items: end; margin-bottom: 58px; }
.collab-head h2 { margin: 0; font-size: clamp(2.4rem, 4.8vw, 4.8rem); line-height: 1.16; letter-spacing: -.05em; }
.collab-head h2 span:first-child { color: var(--aqua); }
.collab-head h2 span:last-child { color: var(--sky); }
.collab-head > p { margin: 0 0 8px; color: rgba(255,255,255,.64); }
.team-composition { display: grid; grid-template-columns: 1fr 92px 1fr; gap: 20px; align-items: stretch; }
.team-card { position: relative; min-height: 430px; padding: 36px; border: 1px solid rgba(255,255,255,.14); border-radius: 28px; background: rgba(255,255,255,.065); backdrop-filter: blur(18px); overflow: hidden; box-shadow: 0 30px 80px rgba(0,0,0,.22); }
.team-card::after { content: ""; position: absolute; right: -75px; bottom: -90px; width: 250px; height: 250px; border-radius: 50%; filter: blur(2px); opacity: .12; }
.team-card-ai::after { background: var(--aqua); }
.team-card-lab::after { background: var(--sky); }
.team-card-top { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.team-number { font-size: .7rem; font-weight: 900; letter-spacing: .16em; color: rgba(255,255,255,.45); }
.team-tag { display: inline-flex; padding: 7px 10px; border-radius: 999px; border: 1px solid rgba(255,255,255,.14); font-size: .68rem; font-weight: 900; letter-spacing: .12em; }
.team-card-ai .team-tag { color: var(--aqua); background: rgba(89,224,173,.08); }
.team-card-lab .team-tag { color: #7fcef6; background: rgba(26,169,240,.09); }
.team-card h3 { margin: 42px 0 8px; font-size: clamp(2.8rem, 5vw, 5.2rem); line-height: 1; letter-spacing: -.05em; }
.team-card-ai h3 { color: var(--aqua); }
.team-card-lab h3 { color: #60c8fa; }
.team-lead { margin: 0 0 16px !important; color: #fff !important; font-size: 1.2rem; font-weight: 800; }
.team-card > p:not(.team-lead) { max-width: 520px; margin: 0; color: rgba(255,255,255,.66); }
.motion-flow { position: relative; z-index: 1; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 30px; }
.motion-flow span { padding: 8px 11px; border-radius: 10px; background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.1); color: rgba(255,255,255,.84); font-size: .72rem; font-weight: 800; }
.motion-flow i { color: rgba(255,255,255,.3); font-style: normal; }
.team-cross { display: grid; place-content: center; justify-items: center; gap: 7px; }
.team-cross span { display: grid; place-items: center; width: 62px; height: 62px; border-radius: 50%; background: linear-gradient(135deg, var(--aqua), var(--sky)); color: #082017; font-size: 1.9rem; font-weight: 900; box-shadow: 0 16px 45px rgba(26,169,240,.22); }
.team-cross small { writing-mode: vertical-rl; color: rgba(255,255,255,.34); font-size: .58rem; font-weight: 900; letter-spacing: .16em; }
.physical-ai-note { display: grid; grid-template-columns: 220px 1fr; gap: 44px; margin-top: 24px; padding: 26px 30px; border: 1px solid rgba(255,255,255,.12); border-radius: 18px; background: rgba(5,15,12,.32); }
.physical-ai-index { color: var(--aqua); font-size: .68rem; letter-spacing: .16em; font-weight: 900; }
.physical-ai-note strong { display: block; margin-bottom: 4px; font-size: 1.06rem; }
.physical-ai-note p { margin: 0; color: rgba(255,255,255,.62); font-size: .9rem; }
.ecophy-equation { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 14px; margin-top: 44px; padding: 17px 24px; border-radius: 999px; border: 1px solid rgba(255,255,255,.12); color: rgba(255,255,255,.57); font-size: .72rem; letter-spacing: .12em; font-weight: 900; }
.ecophy-equation b { color: rgba(255,255,255,.3); font-size: 1.2rem; }
.ecophy-equation strong { color: #fff; }

.goals-section { background: var(--cream); }
.goal-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.goal-card { background: var(--paper); border: 1px solid rgba(16,34,26,.08); border-radius: var(--radius); padding: 34px; min-height: 320px; display: flex; flex-direction: column; }
.goal-icon { display: grid; place-items: center; width: 54px; height: 54px; border-radius: 50%; background: var(--forest); color: var(--lime); font-size: 1.5rem; }
.goal-card h3 { font-size: 1.3rem; margin: auto 0 10px; }
.goal-card p { color: var(--muted); margin: 0; }

.section-ink .eyebrow { color: var(--lime); }
.word-list { border-top: 1px solid rgba(255,255,255,.18); }
.word-row { display: grid; grid-template-columns: 80px .9fr 1.25fr; gap: 36px; padding: 34px 0; border-bottom: 1px solid rgba(255,255,255,.18); align-items: start; }
.word-index { color: var(--lime); font-weight: 850; }
.word-row h3 { margin: 0; font-size: 1.35rem; }
.word-row h3 span { display: block; font-size: .7rem; margin-top: 4px; letter-spacing: .12em; color: rgba(255,255,255,.52); }
.word-row p { margin: 0; color: rgba(255,255,255,.68); }
.word-row-ai .word-index { color: var(--lime); }
.word-row-ai h3 span { color: rgba(89,224,173,.78); }

.process-grid { display: grid; grid-template-columns: .75fr 1.25fr; gap: 110px; align-items: start; }
.sticky-heading { position: sticky; top: 130px; }
.sticky-heading p:last-child { color: var(--muted); }
.process-steps { border-top: 1px solid var(--line); }
.process-step { display: grid; grid-template-columns: 100px .8fr 1.1fr; gap: 26px; padding: 34px 0; border-bottom: 1px solid var(--line); }
.process-step span { font-size: .72rem; font-weight: 900; letter-spacing: .1em; color: var(--coffee); }
.process-step h3, .process-step p { margin: 0; }
.process-step p { color: var(--muted); }

.timeline-section { background: #eef0e8; }
.timeline { position: relative; }
.timeline::before { content: ""; position: absolute; left: 165px; top: 0; bottom: 0; width: 1px; background: rgba(16,34,26,.16); }
.timeline-item { display: grid; grid-template-columns: 145px 1fr; gap: 50px; padding: 12px 0 44px; position: relative; }
.timeline-item::before { content: ""; position: absolute; left: 159px; top: 20px; width: 13px; height: 13px; background: var(--paper); border: 3px solid var(--forest); border-radius: 50%; }
.timeline-item time { font-size: .76rem; font-weight: 900; letter-spacing: .1em; color: var(--coffee); }
.timeline-item h3 { margin: 0 0 8px; font-size: 1.35rem; }
.timeline-item p { margin: 0; color: var(--muted); }
.timeline-future::before { background: var(--lime); }

.products-section { background: var(--paper); }
.festival-info { display: grid; grid-template-columns: .85fr .85fr .8fr 1.15fr; gap: 1px; margin: -14px 0 38px; overflow: hidden; border-radius: var(--radius); border: 1px solid var(--line); background: var(--line); }
.festival-info-item { background: #fff; padding: 24px 26px; display: grid; gap: 5px; }
.festival-info-item span { font-size: .68rem; font-weight: 900; letter-spacing: .14em; color: var(--coffee); }
.festival-info-item strong { font-size: 1.2rem; line-height: 1.4; }
.festival-info-item strong em { display: inline-flex; margin-left: 6px; padding: 4px 7px; border-radius: 999px; background: var(--forest); color: var(--lime); font-size: .58rem; font-style: normal; letter-spacing: .1em; vertical-align: middle; }
.festival-day { position: relative; overflow: hidden; }
.festival-day::after { content: ""; position: absolute; width: 86px; height: 86px; right: -38px; bottom: -44px; border-radius: 50%; background: rgba(89,224,173,.16); }
.festival-day:nth-child(2)::after { background: rgba(26,169,240,.13); }
.festival-info-item small { color: var(--muted); }
.festival-info-deadline { background: var(--cream); }
.products-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.product-card { border-radius: var(--radius); overflow: hidden; border: 1px solid var(--line); background: #fff; }
.product-visual { aspect-ratio: 4/3; position: relative; overflow: hidden; background: linear-gradient(145deg, #dcd6c7, #f2eee5); display: grid; place-items: center; }
.product-visual::before, .product-visual::after { content: ""; position: absolute; border-radius: 50%; }
.product-visual::before { width: 180px; height: 180px; background: rgba(122,81,57,.18); right: -35px; top: -25px; }
.product-visual::after { width: 130px; height: 130px; border: 1px solid rgba(20,54,41,.3); left: -25px; bottom: -30px; }
.product-placeholder { position: relative; z-index: 1; width: 42%; aspect-ratio: 1; border-radius: 28% 52% 35% 50%; background: var(--forest); box-shadow: 0 20px 50px rgba(16,34,26,.22); transform: rotate(10deg); }
.product-placeholder::after { content: "E"; position: absolute; inset: 0; display: grid; place-items: center; color: var(--lime); font-size: 2.4rem; font-weight: 900; transform: rotate(-10deg); }
.product-body { padding: 24px; }
.product-meta { display: flex; justify-content: space-between; gap: 12px; align-items: center; }
.product-label { font-size: .72rem; letter-spacing: .12em; font-weight: 900; color: var(--coffee); }
.product-price { display: grid; justify-items: end; gap: 3px; line-height: 1.05; }
.product-price strong { font-weight: 900; }
.product-price small { font-size: .62rem; font-weight: 850; letter-spacing: .04em; color: var(--muted); }
.product-card h3 { font-size: 1.35rem; margin: 10px 0 8px; }
.product-card p { color: var(--muted); margin: 0; font-size: .92rem; }
.product-card .button { width: 100%; margin-top: 20px; background: var(--forest); color: #fff; }
.product-note { margin-top: 28px; padding: 22px 26px; border-left: 3px solid var(--coffee); background: var(--cream); }
.product-note p { margin: 4px 0 0; color: var(--muted); }

.reserve-section { background: var(--forest); color: #fff; }
.reserve-grid { display: grid; grid-template-columns: .85fr 1.15fr; gap: 90px; align-items: start; }
.reserve-copy { position: sticky; top: 130px; }
.reserve-copy p:not(.eyebrow) { color: rgba(255,255,255,.67); }
.reserve-event-card { display: grid; gap: 1px; margin-top: 30px; overflow: hidden; border-radius: 16px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.13); }
.reserve-event-card > div { display: grid; grid-template-columns: 110px 1fr; gap: 14px; align-items: center; padding: 13px 15px; background: rgba(255,255,255,.06); }
.reserve-event-card span { font-size: .72rem; font-weight: 850; color: rgba(255,255,255,.6); }
.reserve-event-card strong { font-size: .96rem; }
.reserve-points { display: grid; gap: 10px; margin-top: 24px; font-size: .88rem; color: rgba(255,255,255,.8); }
.reserve-form { background: var(--paper); color: var(--ink); padding: 34px; border-radius: var(--radius); box-shadow: var(--shadow); }
.form-row { display: grid; gap: 16px; margin-bottom: 18px; }
.two-col { grid-template-columns: 1fr 1fr; }
.reserve-form label { display: grid; gap: 7px; font-size: .86rem; font-weight: 750; }
.reserve-form label > span { color: #a2442e; }
.field-help { color: var(--muted); font-size: .72rem; font-weight: 550; line-height: 1.55; }
input, select, textarea { width: 100%; border: 1px solid rgba(16,34,26,.16); border-radius: 12px; background: #fff; color: var(--ink); padding: 13px 14px; outline: none; transition: .2s; }
input:focus, select:focus, textarea:focus { border-color: var(--forest); box-shadow: 0 0 0 3px rgba(20,54,41,.09); }
.privacy-check { grid-template-columns: auto 1fr !important; align-items: start; gap: 10px !important; color: var(--muted); font-weight: 500 !important; }
.privacy-check input { width: 18px; height: 18px; margin-top: 4px; accent-color: var(--forest); }
.form-submit { width: 100%; margin-top: 24px; border: 0; }
.form-status { min-height: 1.4em; margin: 12px 0 0; font-size: .86rem; font-weight: 700; }
.form-footnote { margin: 10px 0 0; color: var(--muted); font-size: .72rem; }

.faq-grid { display: grid; grid-template-columns: .7fr 1.3fr; gap: 80px; }
.faq-list { border-top: 1px solid var(--line); }
details { border-bottom: 1px solid var(--line); padding: 0; }
summary { list-style: none; cursor: pointer; padding: 24px 36px 24px 0; font-weight: 800; position: relative; }
summary::-webkit-details-marker { display: none; }
summary::after { content: "+"; position: absolute; right: 4px; top: 20px; font-size: 1.5rem; font-weight: 400; transition: .2s; }
details[open] summary::after { transform: rotate(45deg); }
details p { margin: 0; padding: 0 45px 26px 0; color: var(--muted); }

.contact-band { padding: 95px 0; background: var(--lime); }
.contact-band-inner { display: grid; grid-template-columns: 1.25fr .75fr; align-items: end; gap: 80px; }
.contact-actions { display: grid; gap: 18px; justify-items: start; }
.text-link { font-weight: 900; border-bottom: 1px solid currentColor; }

.site-footer { background: var(--ink); color: rgba(255,255,255,.7); padding: 66px 0 34px; }
.footer-grid { display: grid; grid-template-columns: 1.2fr .8fr .8fr; gap: 60px; align-items: start; }
.footer-brand { color: #fff; }
.footer-grid nav { display: grid; gap: 8px; }
.footer-grid nav a:hover { color: #fff; }
.footer-meta { text-align: right; }

.confirm-dialog { border: 0; border-radius: 24px; padding: 0; width: min(92vw, 620px); box-shadow: 0 30px 100px rgba(0,0,0,.35); }
.confirm-dialog::backdrop { background: rgba(5,15,10,.7); backdrop-filter: blur(5px); }
.dialog-card { padding: 34px; position: relative; }
.dialog-card h2 { margin: 0 0 24px; font-size: 1.8rem; }
.dialog-close { position: absolute; right: 18px; top: 16px; width: 40px; height: 40px; border: 0; border-radius: 50%; background: var(--cream); font-size: 1.5rem; }
#confirm-list { margin: 0; }
#confirm-list div { display: grid; grid-template-columns: 120px 1fr; gap: 14px; padding: 11px 0; border-bottom: 1px solid var(--line); }
#confirm-list dt { color: var(--muted); }
#confirm-list dd { margin: 0; font-weight: 700; overflow-wrap: anywhere; }
.dialog-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 26px; }
.dialog-note { font-size: .8rem; color: var(--muted); }

.reveal { opacity: 0; transform: translateY(16px); transition: opacity .65s ease, transform .65s ease; }
.reveal.is-visible { opacity: 1; transform: none; }

@media (max-width: 980px) {
  .section { padding: 88px 0; }
  .global-nav { position: fixed; inset: 0; background: var(--forest); display: flex; flex-direction: column; justify-content: center; gap: 24px; font-size: 1.2rem; transform: translateX(100%); transition: transform .3s; }
  body.nav-open .global-nav { transform: translateX(0); }
  .nav-toggle { display: block; position: relative; z-index: 2; }
  body.nav-open .nav-toggle span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
  body.nav-open .nav-toggle span:nth-child(2) { opacity: 0; }
  body.nav-open .nav-toggle span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
  .hero { min-height: auto; }
  .hero-grid, .about-grid, .process-grid, .reserve-grid, .faq-grid, .contact-band-inner, .collab-head { grid-template-columns: 1fr; gap: 60px; }
  .team-composition { grid-template-columns: 1fr; }
  .team-cross { grid-template-columns: auto auto; justify-content: center; }
  .team-cross small { writing-mode: horizontal-tb; }
  .physical-ai-note { grid-template-columns: 1fr; gap: 8px; }
  .hero-visual { min-height: 480px; max-width: 600px; width: 100%; margin-inline: auto; }
  .goal-cards, .products-grid { grid-template-columns: 1fr 1fr; }
  .festival-info { grid-template-columns: 1fr; }
  .split-heading { grid-template-columns: 1fr; gap: 22px; }
  .sticky-heading, .reserve-copy { position: static; }
  .word-row { grid-template-columns: 54px 1fr; }
  .word-row p { grid-column: 2; }
  .process-step { grid-template-columns: 80px 1fr; }
  .process-step p { grid-column: 2; }
  .footer-grid { grid-template-columns: 1fr 1fr; }
  .footer-meta { grid-column: 1 / -1; text-align: left; }
}

@media (max-width: 680px) {
  .container { width: min(calc(100% - 32px), var(--container)); }
  .section { padding: 72px 0; }
  .header-inner { min-height: 72px; }
  .hero { padding-top: 125px; }
  .hero h1 { font-size: clamp(2.65rem, 13vw, 4rem); }
  .hero-lead { font-size: 1rem; }
  .hero-actions { display: grid; }
  .hero-visual { min-height: auto; }
  .hero-artwork figcaption { left: 12px; right: 12px; bottom: 12px; padding: 9px 11px; }
  .hero-artwork figcaption span { display: none; }
  .orbit-a { width: 330px; height: 330px; }
  .orbit-b { width: 220px; height: 220px; }
  .hero-center-mark { width: 86px; height: 86px; font-size: 2.7rem; }
  .material-card { width: 165px; padding: 14px; }
  .material-card-1 { top: 20px; }
  .material-card-2 { top: 130px; }
  .material-card-3 { left: 18px; bottom: 5px; }
  .section-heading { margin-bottom: 38px; }
  .section-heading h2, .reserve-copy h2, .contact-band h2 { font-size: clamp(2rem, 10vw, 3rem); }
  .about-grid { gap: 40px; }
  .team-card { min-height: auto; padding: 28px 22px; }
  .team-card h3 { margin-top: 30px; }
  .ecophy-equation { border-radius: 20px; justify-content: flex-start; }
  .hero-signature { border-radius: 16px; }
  .goal-cards, .products-grid { grid-template-columns: 1fr; }
  .goal-card { min-height: 260px; }
  .word-row { grid-template-columns: 42px 1fr; gap: 14px; }
  .process-step { grid-template-columns: 1fr; gap: 8px; }
  .process-step p { grid-column: 1; }
  .timeline::before { left: 8px; }
  .timeline-item { grid-template-columns: 1fr; gap: 6px; padding-left: 34px; }
  .timeline-item::before { left: 2px; top: 18px; }
  .two-col { grid-template-columns: 1fr; }
  .reserve-form { padding: 24px 18px; }
  .footer-grid { grid-template-columns: 1fr; }
  .footer-meta { grid-column: auto; }
  .dialog-actions { grid-template-columns: 1fr; }
  #confirm-list div { grid-template-columns: 1fr; gap: 0; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
  .reveal { opacity: 1; transform: none; }
}

/* Ecophy reservation / social refinements */
.reservation-badge, .walkin-badge {
  display: inline-flex;
  align-items: center;
  margin-top: 18px;
  padding: 7px 11px;
  border-radius: 999px;
  font-size: .75rem;
  font-weight: 850;
  line-height: 1.3;
}
.reservation-badge { background: var(--cream); color: var(--coffee); border: 1px solid rgba(122,81,57,.24); }
.walkin-badge { background: #eef0e8; color: var(--forest); border: 1px solid rgba(20,54,41,.12); }
.product-card-reservable { box-shadow: 0 18px 50px rgba(16,34,26,.10); }
.instagram-search { margin: 0; font-size: .95rem; }
.instagram-search strong { font-weight: 900; }
.reserve-form input[readonly] { background: #f2f0e9; color: var(--ink); cursor: default; }

.goal-icon {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  width: 72px;
  height: 72px;
  margin-bottom: 22px;
}

.goal-icon-svg {
  width: 54px;
  height: 54px;
  stroke: #a86a3d;
  fill: none;
  stroke-width: 2.4;
  stroke-linecap: round;
  stroke-linejoin: round;
  overflow: visible;
}

/* ===== Timee-inspired bold linear separators (CSS-only) ===== */

/*
  The layout/content is untouched.
  Each section gets a strong linear graphic at its top edge:
  - long diagonal sweep
  - crossing lines
  - architectural zig-zag
*/

/* Keep section content above the divider graphics */
#about,
#teams,
.goals-section,
#words,
#process,
#timeline,
#products,
#reserve,
#faq,
.contact-band{
  position: relative;
  isolation: isolate;
}

#about > .container,
#teams > .container,
.goals-section > .container,
#words > .container,
#process > .container,
#timeline > .container,
#products > .container,
#reserve > .container,
#faq > .container,
.contact-band > .container{
  position: relative;
  z-index: 2;
}

/* Shared divider canvas */
#about::after,
#teams::after,
.goals-section::after,
#words::after,
#process::after,
#timeline::after,
#products::after,
#reserve::after,
#faq::after,
.contact-band::after{
  content: "";
  position: absolute;
  z-index: 1;
  left: 0;
  top: 2px;
  width: 100%;
  height: clamp(86px, 9vw, 138px);
  pointer-events: none;
  background-position: center top;
  background-repeat: no-repeat;
  background-size: 100% 100%;
}

/* 01 / 04 / 07 / 10 : huge diagonal sweep — light sections */
#about::after,
#products::after,
.contact-band::after{
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 150' preserveAspectRatio='none'%3E%3Cpath d='M-40 18 L405 124 L1240 25' fill='none' stroke='%233b281d' stroke-width='19' stroke-linecap='square' stroke-linejoin='miter'/%3E%3Cpath d='M-40 7 L405 113 L1240 14' fill='none' stroke='%237a5139' stroke-width='4' stroke-linecap='square' stroke-linejoin='miter'/%3E%3C/svg%3E");
}

/* Dark section version */
#words::after{
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 150' preserveAspectRatio='none'%3E%3Cpath d='M-40 18 L405 124 L1240 25' fill='none' stroke='%23f6ede2' stroke-width='19' stroke-linecap='square' stroke-linejoin='miter'/%3E%3Cpath d='M-40 7 L405 113 L1240 14' fill='none' stroke='%23ead7bd' stroke-width='4' stroke-linecap='square' stroke-linejoin='miter'/%3E%3C/svg%3E");
}

/* 02 / 05 / 08 : crossing long lines — dark */
#teams::after,
#reserve::after{
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 150' preserveAspectRatio='none'%3E%3Cpath d='M-45 133 L515 20 L1240 123' fill='none' stroke='%23f6ede2' stroke-width='18' stroke-linecap='square'/%3E%3Cpath d='M-45 30 L348 105 L790 24 L1240 96' fill='none' stroke='%23ead7bd' stroke-width='4' stroke-linecap='square' stroke-linejoin='miter'/%3E%3C/svg%3E");
}

/* Light section version */
#process::after{
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 150' preserveAspectRatio='none'%3E%3Cpath d='M-45 133 L515 20 L1240 123' fill='none' stroke='%233b281d' stroke-width='18' stroke-linecap='square'/%3E%3Cpath d='M-45 30 L348 105 L790 24 L1240 96' fill='none' stroke='%23b18a67' stroke-width='4' stroke-linecap='square' stroke-linejoin='miter'/%3E%3C/svg%3E");
}

/* 03 / 06 / 09 : architectural zig-zag */
.goals-section::after,
#timeline::after,
#faq::after{
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 150' preserveAspectRatio='none'%3E%3Cpath d='M-45 31 L230 116 L500 24 L770 122 L1010 48 L1245 101' fill='none' stroke='%233b281d' stroke-width='17' stroke-linecap='square' stroke-linejoin='miter'/%3E%3Cpath d='M-45 20 L230 105 L500 13 L770 111 L1010 37 L1245 90' fill='none' stroke='%237a5139' stroke-width='4' stroke-linecap='square' stroke-linejoin='miter'/%3E%3C/svg%3E");
}

/* Slight depth, without making it look glossy or steampunk */
#about::after,
#teams::after,
.goals-section::after,
#words::after,
#process::after,
#timeline::after,
#products::after,
#reserve::after,
#faq::after,
.contact-band::after{
  filter: drop-shadow(0 6px 0 rgba(16,34,26,.065));
}

/* The divider occupies the original top whitespace, so text positions stay aligned */
@media (max-width: 980px){
  #about::after,
  #teams::after,
  .goals-section::after,
  #words::after,
  #process::after,
  #timeline::after,
  #products::after,
  #reserve::after,
  #faq::after,
  .contact-band::after{
    height: 92px;
  }
}

@media (max-width: 680px){
  #about::after,
  #teams::after,
  .goals-section::after,
  #words::after,
  #process::after,
  #timeline::after,
  #products::after,
  #reserve::after,
  #faq::after,
  .contact-band::after{
    top: 0;
    height: 62px;
    filter: drop-shadow(0 3px 0 rgba(16,34,26,.055));
  }
}

/* ===== Ecophy coffee theme ===== */
:root{
  --ink:#2b1d16;
  --forest:#3b281d;
  --forest-2:#523626;
  --moss:#9b7b5c;
  --lime:#ead7bd;
  --cream:#eee0cf;
  --paper:#f8f1e8;
  --coffee:#7a5139;
  --aqua:#b18a67;
  --sky:#c7a17a;
  --line:rgba(75,48,33,.16);
  --muted:#756258;
  --white:#ffffff;
  --shadow:0 22px 60px rgba(71,43,28,.12);
}

/* Warm coffee-paper background without metallic/steampunk decoration */
body{
  color:var(--ink);
  background:
    radial-gradient(circle at 15% 10%, rgba(122,81,57,.055), transparent 28%),
    radial-gradient(circle at 85% 28%, rgba(199,161,122,.065), transparent 30%),
    var(--paper);
}

.section-light,
.products-section,
.faq-section{
  background:
    linear-gradient(rgba(255,255,255,.16),rgba(255,255,255,.16)),
    var(--paper);
}

.section-dark,
.reserve-section{
  background:
    radial-gradient(circle at 82% 12%, rgba(234,215,189,.07), transparent 26%),
    linear-gradient(135deg,#332118 0%,#422c20 58%,#2e1e17 100%);
}

.section-ink{
  background:
    radial-gradient(circle at 18% 20%, rgba(199,161,122,.08), transparent 28%),
    #2b1d16;
}

.site-header.scrolled{
  background:rgba(55,36,26,.93);
}

.collab-section{
  background:
    radial-gradient(circle at 12% 18%, rgba(199,161,122,.11), transparent 29%),
    radial-gradient(circle at 88% 10%, rgba(234,215,189,.08), transparent 31%),
    linear-gradient(135deg,#2c1d16 0%,#412b20 56%,#302019 100%);
}

.collab-section .eyebrow,
.team-card-ai h3,
.team-card-lab h3,
.team-card-ai .team-tag,
.team-card-lab .team-tag,
.physical-ai-index{
  color:#dfbd96;
}

.team-card-ai::after,
.team-card-lab::after{
  background:#a87957;
}

.goals-section{
  background:#eee0cf;
}

.timeline-section{
  background:#f0e5d8;
}

.contact-band{
  background:#d6b58f;
}

/* Simple, natural cards: no brass plate or metallic treatment */
.principle-card,
.goal-card,
.product-card,
.reserve-form,
.festival-info{
  box-shadow:0 18px 44px rgba(80,51,34,.09);
}

.team-card{
  background:rgba(255,255,255,.055);
  box-shadow:0 26px 70px rgba(20,12,8,.22);
}

.button-primary{
  background:#ead7bd;
  color:#3b281d;
  border-color:#ead7bd;
}

.button-light{
  background:#fffaf4;
  color:#3b281d;
}

.button-secondary{
  border-color:rgba(75,48,33,.22);
  color:#3b281d;
}

.nav-cta{
  border-color:rgba(255,255,255,.46);
}

.hero h1 em{
  color:#ead7bd;
}

.hero-signature span:first-child,
.hero-signature span:nth-of-type(2){
  color:#dfbd96;
}

.hero-artwork::before{
  border-color:rgba(234,215,189,.28);
}

.goal-icon-svg{
  stroke:#8d5d3e;
}

.festival-info-item span,
.product-label,
.process-step span,
.timeline-item time{
  color:#7a5139;
}

.product-card .button{
  background:#3b281d;
}

input:focus,
select:focus,
textarea:focus{
  border-color:#7a5139;
  box-shadow:0 0 0 3px rgba(122,81,57,.09);
}

.privacy-check input{
  accent-color:#7a5139;
}

/* Reservation is intentionally the second section */
.reserve-section{
  position:relative;
}

@media(max-width:680px){
  .section-dark,
  .reserve-section{
    background:
      radial-gradient(circle at 80% 10%,rgba(234,215,189,.06),transparent 24%),
      #37241b;
  }
}

/* ===== Ecophy calm cafe palette ===== */

/*
  Calm café palette:
  espresso / mocha / oat milk / warm wood / soft charcoal.
  Lower saturation, softer contrast, less "designed" and more café-like.
*/
:root{
  --ink:#2f2722;
  --forest:#3a2f29;
  --forest-2:#493a32;
  --moss:#8f7d6d;
  --lime:#ddd0bf;
  --cream:#e9dfd3;
  --paper:#f3eee8;
  --coffee:#6c5142;
  --aqua:#988472;
  --sky:#b49f8b;
  --line:rgba(73,55,45,.14);
  --muted:#766a62;
  --white:#ffffff;
  --shadow:0 18px 48px rgba(61,45,36,.10);
}

/* Overall page — quiet café interior */
body{
  color:var(--ink);
  background:
    radial-gradient(circle at 18% 10%, rgba(108,81,66,.035), transparent 30%),
    radial-gradient(circle at 80% 34%, rgba(180,159,139,.04), transparent 32%),
    linear-gradient(180deg,#f4efe9 0%,#f1ebe4 100%);
}

/* Light areas: oat milk / plaster wall */
.section-light,
.products-section,
.faq-section{
  background:
    linear-gradient(180deg,rgba(255,255,255,.16),rgba(255,255,255,0)),
    #f3eee8;
}

/* Hero / reservation: espresso, not black */
.section-dark,
.reserve-section{
  background:
    radial-gradient(circle at 78% 12%, rgba(221,208,191,.05), transparent 28%),
    linear-gradient(135deg,#332922 0%,#3b2f28 52%,#30261f 100%);
}

/* Keyword section: dark roast */
.section-ink{
  background:
    radial-gradient(circle at 14% 18%, rgba(180,159,139,.055), transparent 30%),
    #302721;
}

/* Header follows the dark roast tone */
.site-header.scrolled{
  background:rgba(52,42,35,.94);
}

/* Team section: café counter / wood tone */
.collab-section{
  background:
    radial-gradient(circle at 12% 16%, rgba(180,159,139,.07), transparent 30%),
    radial-gradient(circle at 86% 12%, rgba(221,208,191,.045), transparent 32%),
    linear-gradient(135deg,#302721 0%,#3d3029 55%,#332923 100%);
}

.collab-section .eyebrow,
.team-card-ai h3,
.team-card-lab h3,
.team-card-ai .team-tag,
.team-card-lab .team-tag,
.physical-ai-index{
  color:#c9b39d;
}

.team-card-ai::after,
.team-card-lab::after{
  background:#88705f;
}

/* Warm neutral sections */
.goals-section{
  background:#e9dfd3;
}

.timeline-section{
  background:#eee7df;
}

.contact-band{
  background:#d7c8b7;
}

/* Cards: off-white / ceramic */
.principle-card,
.goal-card,
.product-card,
.reserve-form,
.festival-info{
  background:#f8f4ef;
  border-color:rgba(90,68,55,.11);
  box-shadow:0 16px 38px rgba(61,45,36,.075);
}

.team-card{
  background:rgba(255,255,255,.045);
  border-color:rgba(255,255,255,.10);
  box-shadow:0 22px 56px rgba(20,14,10,.18);
}

/* Buttons: latte cream + dark coffee */
.button-primary{
  background:#ddd0bf;
  color:#352b25;
  border-color:#ddd0bf;
}

.button-light{
  background:#faf7f2;
  color:#3a2f29;
}

.button-secondary{
  border-color:rgba(73,55,45,.18);
  color:#3a2f29;
}

.product-card .button{
  background:#3a2f29;
}

/* Hero details */
.hero h1 em{
  color:#e1d5c5;
}

.hero-signature span:first-child,
.hero-signature span:nth-of-type(2){
  color:#c7b19b;
}

.hero-artwork::before{
  border-color:rgba(221,208,191,.22);
}

/* Hand-drawn icons remain coffee brown */
.goal-icon-svg{
  stroke:#775947;
}

/* Accent text becomes quiet mocha */
.festival-info-item span,
.product-label,
.process-step span,
.timeline-item time{
  color:#6c5142;
}

/* Forms: warm white, not stark white */
input,
select,
textarea{
  background:#fbf8f4;
  color:#2f2722;
  border-color:rgba(85,65,52,.15);
}

input:focus,
select:focus,
textarea:focus{
  border-color:#7a6252;
  box-shadow:0 0 0 3px rgba(122,98,82,.08);
}

.privacy-check input{
  accent-color:#6c5142;
}

/* Timee-inspired divider colors adapted to the calmer café palette */
#about::after,
#products::after,
.contact-band::after{
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 150' preserveAspectRatio='none'%3E%3Cpath d='M-40 18 L405 124 L1240 25' fill='none' stroke='%233a2f29' stroke-width='19' stroke-linecap='square' stroke-linejoin='miter'/%3E%3Cpath d='M-40 7 L405 113 L1240 14' fill='none' stroke='%236c5142' stroke-width='4' stroke-linecap='square' stroke-linejoin='miter'/%3E%3C/svg%3E");
}

#words::after{
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 150' preserveAspectRatio='none'%3E%3Cpath d='M-40 18 L405 124 L1240 25' fill='none' stroke='%23f3eee8' stroke-width='19' stroke-linecap='square' stroke-linejoin='miter'/%3E%3Cpath d='M-40 7 L405 113 L1240 14' fill='none' stroke='%23c7b19b' stroke-width='4' stroke-linecap='square' stroke-linejoin='miter'/%3E%3C/svg%3E");
}

#teams::after,
#reserve::after{
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 150' preserveAspectRatio='none'%3E%3Cpath d='M-45 133 L515 20 L1240 123' fill='none' stroke='%23f3eee8' stroke-width='18' stroke-linecap='square'/%3E%3Cpath d='M-45 30 L348 105 L790 24 L1240 96' fill='none' stroke='%23c7b19b' stroke-width='4' stroke-linecap='square' stroke-linejoin='miter'/%3E%3C/svg%3E");
}

#process::after{
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 150' preserveAspectRatio='none'%3E%3Cpath d='M-45 133 L515 20 L1240 123' fill='none' stroke='%233a2f29' stroke-width='18' stroke-linecap='square'/%3E%3Cpath d='M-45 30 L348 105 L790 24 L1240 96' fill='none' stroke='%23988472' stroke-width='4' stroke-linecap='square' stroke-linejoin='miter'/%3E%3C/svg%3E");
}

.goals-section::after,
#timeline::after,
#faq::after{
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 150' preserveAspectRatio='none'%3E%3Cpath d='M-45 31 L230 116 L500 24 L770 122 L1010 48 L1245 101' fill='none' stroke='%233a2f29' stroke-width='17' stroke-linecap='square' stroke-linejoin='miter'/%3E%3Cpath d='M-45 20 L230 105 L500 13 L770 111 L1010 37 L1245 90' fill='none' stroke='%236c5142' stroke-width='4' stroke-linecap='square' stroke-linejoin='miter'/%3E%3C/svg%3E");
}

/* Mobile keeps the same quiet roast palette */
@media(max-width:680px){
  .section-dark,
  .reserve-section{
    background:#342a23;
  }

  .section-ink{
    background:#302721;
  }
}

/* ===== Ecophy mobile typography tuning ===== */

/* Keep device text scaling predictable */
html{
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
}

/* Japanese line-breaking defaults */
.hero h1,
.section-heading h2,
.reserve-copy h2,
.contact-band h2,
.collab-head h2,
.team-card h3,
.goal-card h3,
.product-card h3,
.process-step h3,
.timeline-item h3,
.word-row h3{
  word-break:normal;
  line-break:strict;
  overflow-wrap:break-word;
}

/* Modern browsers can choose more natural Japanese phrase breaks */
@supports (word-break:auto-phrase){
  .hero h1,
  .section-heading h2,
  .reserve-copy h2,
  .contact-band h2,
  .collab-head h2{
    word-break:auto-phrase;
  }
}

@media (max-width:680px){

  body{
    font-size:15.5px;
    line-height:1.78;
    letter-spacing:.01em;
  }

  /*
    The desktop <br> tags are useful on wide screens but can cause
    awkward 1–3 character lines on phones, so let the browser wrap them.
  */
  .hero h1 br,
  .section-heading h2 br,
  .reserve-copy h2 br,
  .contact-band h2 br,
  .collab-head h2 br{
    display:none;
  }

  /* Main hero */
  .hero h1{
    max-width:11em;
    margin-right:auto;
    font-size:clamp(2.15rem,10.5vw,3rem);
    line-height:1.10;
    letter-spacing:-.035em;
    text-wrap:balance;
  }

  .hero-lead{
    font-size:.98rem;
    line-height:1.86;
    letter-spacing:.005em;
  }

  .hero-copy .eyebrow{
    font-size:.68rem;
    line-height:1.45;
    letter-spacing:.11em;
  }

  .hero-signature{
    flex-wrap:wrap;
    gap:7px 10px;
    font-size:.86rem;
    line-height:1.45;
  }

  /* Section headings */
  .section-heading h2,
  .reserve-copy h2,
  .contact-band h2,
  .collab-head h2{
    max-width:100%;
    font-size:clamp(1.85rem,8.6vw,2.45rem);
    line-height:1.20;
    letter-spacing:-.028em;
    text-wrap:balance;
  }

  .section-heading .eyebrow,
  .reserve-copy .eyebrow,
  .contact-band .eyebrow{
    font-size:.68rem;
    line-height:1.45;
    letter-spacing:.11em;
  }

  .section-intro,
  .about-copy,
  .collab-head > p,
  .split-heading > p,
  .reserve-copy > p,
  .contact-band p{
    font-size:.96rem;
    line-height:1.82;
  }

  /* Card / item headings */
  .team-card h3,
  .goal-card h3,
  .product-card h3,
  .process-step h3,
  .timeline-item h3{
    font-size:1.18rem;
    line-height:1.38;
    letter-spacing:-.015em;
  }

  .team-card p,
  .goal-card p,
  .product-card p,
  .process-step p,
  .timeline-item p{
    font-size:.93rem;
    line-height:1.78;
  }

  /* Keywords: English subtitle gets its own line */
  .word-row h3{
    font-size:1.08rem;
    line-height:1.42;
    letter-spacing:-.01em;
  }

  .word-row h3 span{
    display:block;
    margin-top:3px;
    font-size:.66rem;
    line-height:1.35;
    letter-spacing:.09em;
  }

  .word-row p{
    font-size:.92rem;
    line-height:1.78;
  }

  /* Prevent cramped labels and dates */
  .festival-info-item strong{
    font-size:1.05rem;
    line-height:1.35;
  }

  .festival-info-item small{
    line-height:1.5;
  }

  .reserve-event-card > div{
    grid-template-columns:88px minmax(0,1fr);
    gap:10px;
  }

  .reserve-event-card strong{
    min-width:0;
    font-size:.9rem;
    line-height:1.5;
    overflow-wrap:break-word;
  }

  .reserve-points{
    font-size:.86rem;
    line-height:1.65;
  }

  /* Let narrow horizontal flows wrap instead of squeezing text */
  .motion-flow,
  .ecophy-equation{
    flex-wrap:wrap;
  }

  .motion-flow{
    gap:7px 9px;
    line-height:1.5;
  }

  /* 16px prevents automatic zoom on many mobile browsers */
  input,
  select,
  textarea{
    font-size:16px;
    line-height:1.45;
  }

  .reserve-form label{
    font-size:.84rem;
    line-height:1.55;
  }

  .field-help,
  .form-footnote{
    line-height:1.65;
  }

  .button{
    font-size:.94rem;
    line-height:1.35;
    white-space:normal;
    text-align:center;
  }

  .footer-grid,
  .footer-meta{
    font-size:.9rem;
    line-height:1.7;
  }
}

/* Extra-narrow phones */
@media (max-width:420px){

  .container{
    width:min(calc(100% - 28px),var(--container));
  }

  .hero h1{
    max-width:100%;
    font-size:clamp(2rem,10.3vw,2.65rem);
    line-height:1.11;
  }

  .section-heading h2,
  .reserve-copy h2,
  .contact-band h2,
  .collab-head h2{
    font-size:clamp(1.72rem,8.25vw,2.12rem);
    line-height:1.22;
  }

  .hero-lead,
  .section-intro,
  .about-copy,
  .collab-head > p,
  .split-heading > p,
  .reserve-copy > p{
    font-size:.94rem;
  }

  .team-card h3,
  .goal-card h3,
  .product-card h3,
  .process-step h3,
  .timeline-item h3{
    font-size:1.12rem;
  }

  .word-row{
    grid-template-columns:36px minmax(0,1fr);
    gap:11px;
  }

  .word-row h3{
    font-size:1.02rem;
  }

  .reserve-event-card > div{
    grid-template-columns:1fr;
    gap:3px;
  }

  .reserve-event-card span{
    font-size:.68rem;
  }
}


/* ===== Ecophy dropdown sections ===== */
.word-tabs,
.process-accordions{
  display:grid;
  gap:10px;
}

.word-tab,
.process-tab{
  margin:0;
  padding:0;
  border:1px solid var(--line);
  border-radius:4px;
  overflow:hidden;
}

.word-tab{
  background:rgba(255,255,255,.035);
  border-color:rgba(255,255,255,.13);
}

.process-tab{
  background:#f8f4ef;
  border-color:rgba(90,68,55,.13);
}

.word-tab summary,
.process-tab summary{
  display:grid;
  grid-template-columns:52px minmax(0,1fr) 34px;
  align-items:center;
  gap:16px;
  padding:20px 22px;
  cursor:pointer;
  list-style:none;
  transition:background .18s ease;
}

.word-tab summary::-webkit-details-marker,
.process-tab summary::-webkit-details-marker{
  display:none;
}

.word-tab summary::after,
.process-tab summary::after{
  content:none!important;
}

.word-tab summary:hover{
  background:rgba(255,255,255,.045);
}

.process-tab summary:hover{
  background:rgba(108,81,66,.035);
}

.accordion-index{
  font-size:.72rem;
  line-height:1;
  letter-spacing:.10em;
  font-weight:900;
  color:var(--coffee);
}

.word-tab .accordion-index{
  color:#c7b19b;
}

.accordion-title{
  min-width:0;
  display:flex;
  align-items:baseline;
  gap:12px;
  flex-wrap:wrap;
}

.accordion-title strong{
  font-size:1.08rem;
  line-height:1.35;
  letter-spacing:-.01em;
}

.accordion-title small{
  font-size:.67rem;
  line-height:1.35;
  letter-spacing:.10em;
  font-weight:850;
  color:var(--muted);
}

.word-tab .accordion-title strong{
  color:#f3eee8;
}

.word-tab .accordion-title small{
  color:rgba(243,238,232,.55);
}

.process-tab .accordion-title{
  display:grid;
  gap:2px;
}

.process-tab .accordion-title small{
  color:var(--coffee);
}

.accordion-toggle{
  justify-self:end;
  font-size:1.45rem;
  line-height:1;
  font-weight:300;
  transition:transform .2s ease;
}

.word-tab .accordion-toggle{
  color:#c7b19b;
}

.process-tab .accordion-toggle{
  color:var(--coffee);
}

.word-tab[open] .accordion-toggle,
.process-tab[open] .accordion-toggle{
  transform:rotate(45deg);
}

.accordion-panel{
  padding:0 22px 22px 90px;
}

.accordion-panel p{
  margin:0;
  max-width:760px;
  line-height:1.82;
}

.word-tab .accordion-panel{
  color:rgba(243,238,232,.72);
}

.process-tab .accordion-panel{
  color:var(--muted);
}

.process-grid-accordion{
  align-items:start;
}

@media(max-width:680px){
  .word-tabs,
  .process-accordions{
    gap:8px;
  }

  .word-tab summary,
  .process-tab summary{
    grid-template-columns:38px minmax(0,1fr) 28px;
    gap:10px;
    padding:17px 15px;
  }

  .accordion-index{
    font-size:.65rem;
  }

  .accordion-title{
    display:grid;
    gap:3px;
  }

  .accordion-title strong{
    font-size:1rem;
    line-height:1.4;
  }

  .accordion-title small{
    font-size:.61rem;
    letter-spacing:.08em;
  }

  .accordion-toggle{
    font-size:1.28rem;
  }

  .accordion-panel{
    padding:0 15px 17px 63px;
  }

  .accordion-panel p{
    font-size:.92rem;
    line-height:1.76;
  }
}


/* ===== Ecophy ochre accent and product image ===== */
:root{
  --ochre:#b6914c;
}

/* one calm ochre accent in the background */
.contact-band{
  background:#c7a06a;
}

/* give the linear dividers a warmer ochre accent */
#about::after,
#products::after,
.contact-band::after,
.goals-section::after,
#timeline::after,
#faq::after,
#process::after,
#teams::after,
#reserve::after,
#words::after{
  filter: drop-shadow(0 6px 0 rgba(24,18,14,.05));
}

.product-visual-keyholder{
  display:grid;
  gap:10px;
}

.product-visual-keyholder img{
  width:100%;
  aspect-ratio: 4 / 3;
  object-fit:cover;
  border-radius:6px;
  display:block;
}

.product-visual-keyholder figcaption{
  font-size:.78rem;
  line-height:1.45;
  color:var(--muted);
}

.product-card-keyholder .product-visual-keyholder{
  margin:12px 0 14px;
}

@media (max-width:680px){
  .product-card-keyholder .product-visual-keyholder{
    margin:10px 0 12px;
  }

  .product-visual-keyholder figcaption{
    font-size:.72rem;
  }
}

/* ===== Fix keyholder product photo visibility ===== */

/* 商品番号03では、既存のダミー画像を完全に消して写真だけを表示 */
.product-card-keyholder .product-placeholder{
  display:none !important;
}

.product-card-keyholder .product-visual::before,
.product-card-keyholder .product-visual::after{
  display:none !important;
}

/* 元の product-visual のサイズを保ちながら写真を全面表示 */
.product-card-keyholder .product-visual{
  position:relative;
  aspect-ratio:4 / 3;
  overflow:hidden;
  display:block !important;
  padding:0 !important;
  background:#e7ddd2;
}

.product-card-keyholder .product-visual img{
  position:absolute;
  inset:0;
  z-index:2;
  width:100% !important;
  height:100% !important;
  max-width:none !important;
  object-fit:cover;
  object-position:center center;
  display:block !important;
  border-radius:0 !important;
}

/* キャプションは画像の外に出さず、商品カード側の説明に任せる */
.product-card-keyholder .product-visual figcaption{
  display:none !important;
}

@media(max-width:680px){
  .product-card-keyholder .product-visual img{
    object-position:center center;
  }
}


/* ===== Keyholder photo centered ===== */
/* 商品番号03の写真を画像枠の中央に固定 */
.product-card-keyholder .product-visual img{
  object-position:center center !important;
}

@media(max-width:680px){
  .product-card-keyholder .product-visual img{
    object-position:center center !important;
  }
}

/* ===== Product card precise alignment ===== */

/* 商品03の写真を、ほかの商品画像と同じくカード上端から開始 */
.product-card-keyholder .product-visual-keyholder{
  margin:0 !important;
}

/* 商品画像の直後から、全カード同じ余白で本文を開始 */
.product-card .product-body{
  padding:24px;
}

/*
  商品名の開始位置は全カードで同じ。
  2行の商品名に合わせて見出し領域だけ高さを確保し、
  説明文の書き出し位置もそろえる。
*/
.product-card h3{
  margin:10px 0 8px;
  min-height:3.1em;
}

/* 説明文には不要な固定高さをつけない */
.product-card p{
  min-height:0 !important;
}

/* 前回の下端揃えは解除し、通常の間隔へ */
.product-body > .reservation-badge,
.product-body > .walkin-badge,
.product-body > .button{
  margin-top:18px;
}

/* スマホは縦1列になるため、余分な見出し高さを解除 */
@media(max-width:680px){
  .product-card h3{
    min-height:0;
  }
}

/* ===== Cupholder product photo + timeline emphasis ===== */

/* 「これまでの歩み」の強調文 */
.timeline-emphasis{
  display:inline-block;
  margin-top:8px;
  font-weight:900;
  color:var(--ink);
}

.timeline-section .timeline-emphasis{
  color:inherit;
}

/* 商品06「カップホルダー」を商品03と同じ画像枠で表示 */
.product-card-cupholder .product-placeholder{
  display:none !important;
}

.product-card-cupholder .product-visual::before,
.product-card-cupholder .product-visual::after{
  display:none !important;
}

.product-card-cupholder .product-visual{
  position:relative;
  aspect-ratio:4 / 3;
  overflow:hidden;
  display:block !important;
  padding:0 !important;
  margin:0 !important;
  background:#e7ddd2;
}

.product-card-cupholder .product-visual img{
  position:absolute;
  inset:0;
  z-index:2;
  width:100% !important;
  height:100% !important;
  max-width:none !important;
  object-fit:cover;
  object-position:center 42%;
  display:block !important;
  border-radius:0 !important;
}

.product-card-cupholder .product-visual figcaption{
  display:none !important;
}

/* 商品03・06とも画像の上に余白を作らない */
.product-card-keyholder .product-visual-keyholder,
.product-card-cupholder .product-visual-cupholder{
  margin:0 !important;
}

@media(max-width:680px){
  .product-card-cupholder .product-visual img{
    object-position:center 42%;
  }

  .timeline-emphasis{
    margin-top:6px;
  }
}

/* ===== Goal dropdown + hero caption removal ===== */

/* Hero image caption removed */
.hero-artwork figcaption{
  display:none !important;
}

/* Goal dropdowns */
.goal-tabs{
  display:grid;
  gap:10px;
}

.goal-tab{
  margin:0;
  padding:0;
  background:#f8f4ef;
  border:1px solid rgba(90,68,55,.13);
  border-radius:6px;
  overflow:hidden;
  box-shadow:0 12px 30px rgba(61,45,36,.055);
}

.goal-tab summary{
  display:grid;
  grid-template-columns:72px minmax(0,1fr) 34px;
  align-items:center;
  gap:18px;
  min-height:92px;
  padding:14px 22px;
  list-style:none;
  cursor:pointer;
  transition:background .18s ease;
}

.goal-tab summary::-webkit-details-marker{
  display:none;
}

.goal-tab summary::after{
  content:none !important;
}

.goal-tab summary:hover{
  background:rgba(108,81,66,.035);
}

.goal-tab .goal-icon{
  width:58px;
  height:58px;
  margin:0;
}

.goal-tab .goal-icon-svg{
  width:50px;
  height:50px;
}

.goal-tab-title{
  min-width:0;
  font-size:1.16rem;
  line-height:1.4;
  font-weight:850;
  letter-spacing:-.015em;
  color:var(--ink);
}

.goal-tab-toggle{
  justify-self:end;
  color:var(--coffee);
  font-size:1.45rem;
  line-height:1;
  font-weight:300;
  transition:transform .2s ease;
}

.goal-tab[open] .goal-tab-toggle{
  transform:rotate(45deg);
}

.goal-tab-panel{
  padding:0 22px 22px 112px;
}

.goal-tab-panel p{
  margin:0;
  max-width:760px;
  color:var(--muted);
  line-height:1.82;
}

@media(max-width:680px){
  .goal-tabs{
    gap:8px;
  }

  .goal-tab summary{
    grid-template-columns:48px minmax(0,1fr) 26px;
    gap:11px;
    min-height:74px;
    padding:12px 15px;
  }

  .goal-tab .goal-icon{
    width:44px;
    height:44px;
  }

  .goal-tab .goal-icon-svg{
    width:40px;
    height:40px;
  }

  .goal-tab-title{
    font-size:1rem;
    line-height:1.45;
  }

  .goal-tab-toggle{
    font-size:1.25rem;
  }

  .goal-tab-panel{
    padding:0 15px 17px 74px;
  }

  .goal-tab-panel p{
    font-size:.92rem;
    line-height:1.76;
  }
}

/* ===== Reservation popup / reordered page refinements ===== */

.hero-artwork img{
  object-fit:cover;
  object-position:center;
}

.reservation-feature{
  position:relative;
  background:#e7dac8;
  color:var(--ink);
  padding:92px 0;
}

.reservation-feature-card{
  display:grid;
  grid-template-columns:minmax(0,1.2fr) minmax(300px,.8fr);
  gap:64px;
  align-items:center;
  padding:44px 48px;
  border:1px solid rgba(74,53,41,.16);
  border-radius:18px;
  background:
    radial-gradient(circle at 92% 12%, rgba(182,145,76,.20), transparent 28%),
    #f5eee6;
  box-shadow:0 24px 60px rgba(61,45,36,.11);
}

.reservation-feature-copy h2{
  margin:14px 0 18px;
  max-width:760px;
  font-size:clamp(2.25rem,4.6vw,4.6rem);
  line-height:1.12;
  letter-spacing:-.045em;
}

.reservation-feature-copy > p:last-child{
  max-width:720px;
  margin:0;
  color:var(--muted);
}

.reservation-feature-badge{
  display:inline-flex;
  align-items:center;
  padding:7px 11px;
  border-radius:999px;
  background:#b6914c;
  color:#fffaf4;
  font-size:.72rem;
  font-weight:900;
  letter-spacing:.08em;
}

.reservation-feature-action{
  display:grid;
  gap:18px;
}

.reservation-feature-meta{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:8px;
}

.reservation-feature-meta > div{
  min-width:0;
  padding:14px 12px;
  border-radius:10px;
  background:#3a2f29;
  color:#fff;
}

.reservation-feature-meta span,
.reservation-feature-meta small{
  display:block;
  font-size:.63rem;
  line-height:1.35;
  letter-spacing:.08em;
  color:rgba(255,255,255,.58);
}

.reservation-feature-meta strong{
  display:block;
  margin:3px 0;
  font-size:1.08rem;
  line-height:1.25;
}

.reservation-open-button{
  width:100%;
  min-height:60px;
  background:#6c5142;
  color:#fff;
  border-color:#6c5142;
  font-size:1rem;
  box-shadow:0 10px 24px rgba(60,43,34,.16);
}

.reservation-open-button:hover{
  background:#584136;
  border-color:#584136;
}

.reservation-feature-note{
  margin:0;
  text-align:center;
  color:var(--muted);
  font-size:.78rem;
}

.reservation-dialog{
  width:min(94vw,980px);
  max-height:92vh;
  padding:0;
  border:0;
  border-radius:18px;
  overflow:auto;
  background:#f3eee8;
  color:var(--ink);
  box-shadow:0 34px 110px rgba(25,17,12,.42);
}

.reservation-dialog::backdrop{
  background:rgba(35,25,19,.72);
  backdrop-filter:blur(7px);
}

.reservation-dialog-shell{
  position:relative;
  padding:36px;
}

.reservation-dialog-close{
  position:sticky;
  z-index:4;
  top:12px;
  float:right;
  width:44px;
  height:44px;
  margin:0 0 6px 16px;
  border:1px solid rgba(73,55,45,.14);
  border-radius:50%;
  background:#fffaf4;
  color:var(--ink);
  font-size:1.6rem;
  line-height:1;
}

.reservation-dialog-head{
  padding:8px 58px 26px 0;
}

.reservation-dialog-head h2{
  margin:0 0 14px;
  font-size:clamp(2rem,4vw,3.4rem);
  line-height:1.15;
  letter-spacing:-.04em;
}

.reservation-dialog-head > p:last-child{
  margin:0;
  color:var(--muted);
}

.reservation-dialog .reserve-form{
  padding:28px;
  border:1px solid rgba(73,55,45,.12);
  border-radius:14px;
  background:#fffaf4;
  box-shadow:none;
}

.product-card-reservable{
  border:2px solid #b6914c;
  box-shadow:0 22px 54px rgba(106,76,47,.14);
}

.product-card-reservable .reservation-badge{
  background:#b6914c;
  color:#fff;
  border-color:#b6914c;
}

.product-card-reservable .button{
  min-height:54px;
  background:#6c5142 !important;
  color:#fff !important;
  border-color:#6c5142 !important;
}

.timeline-emphasis{
  display:inline-block;
  margin-top:8px;
  font-weight:900;
}

.footer-environment-note{
  margin-top:34px;
  padding-top:24px;
  border-top:1px solid rgba(255,255,255,.11);
}

.footer-environment-note p{
  margin:0;
  max-width:900px;
  color:rgba(255,255,255,.46);
  font-size:.72rem;
  line-height:1.7;
}

.hero .micro-note{
  display:none !important;
}

@media(max-width:980px){
  .reservation-feature-card{
    grid-template-columns:1fr;
    gap:34px;
  }

  .reservation-feature-meta{
    max-width:620px;
  }
}

@media(max-width:680px){
  .reservation-feature{
    padding:68px 0;
  }

  .reservation-feature-card{
    gap:28px;
    padding:28px 20px;
    border-radius:14px;
  }

  .reservation-feature-copy h2{
    font-size:clamp(1.9rem,9vw,2.55rem);
    line-height:1.16;
  }

  .reservation-feature-meta{
    grid-template-columns:1fr;
  }

  .reservation-feature-meta > div{
    display:grid;
    grid-template-columns:82px 1fr auto;
    align-items:center;
    gap:8px;
  }

  .reservation-feature-meta span,
  .reservation-feature-meta strong,
  .reservation-feature-meta small{
    margin:0;
  }

  .reservation-dialog{
    width:calc(100vw - 20px);
    max-height:94vh;
    border-radius:14px;
  }

  .reservation-dialog-shell{
    padding:22px 14px 18px;
  }

  .reservation-dialog-head{
    padding:6px 46px 20px 4px;
  }

  .reservation-dialog-head h2{
    font-size:clamp(1.75rem,8.5vw,2.35rem);
  }

  .reservation-dialog .reserve-form{
    padding:20px 14px;
  }

  .reservation-dialog-close{
    top:8px;
    width:40px;
    height:40px;
  }
}


/* Ensure popup contents are immediately visible even while the dialog was closed at page load */
.reservation-dialog .reveal{
  opacity:1 !important;
  transform:none !important;
}

/* ===== Timeline slightly darker ===== */
/* 「これまでの歩み」だけ、ほんの少し濃いカフェベージュへ */
.timeline-section{
  background:#e8dfd5;
}

/* ===== Goals background matches FAQ ===== */
/* 「目指していること」を「よくある質問」と同じ背景色に統一 */
.goals-section{
  background:linear-gradient(rgba(255,255,255,.16),rgba(255,255,255,.16)),
    var(--paper) !important;
}

/* ===== Mobile polish after FAQ removal ===== */

/* FAQ removed: keep surrounding section spacing natural */
#timeline + .contact-band,
.products-section + .collab-section,
.goals-section + #timeline{
  margin-top:0;
}

/* Images: never overflow their containers */
img,
svg{
  max-width:100%;
}

img{
  height:auto;
}

/* Hero image: stable cropping on desktop and mobile */
.hero-artwork{
  overflow:visible;
}

.hero-artwork .hero-main-image{
  display:block;
  width:100%;
  aspect-ratio:1.48 / 1;
  object-fit:cover;
  object-position:center center;
}

/* Japanese headings: avoid awkward character-by-character wrapping */
.hero h1,
.section-heading h2,
.reservation-feature-copy h2,
.collab-head h2,
.contact-band h2,
.timeline-item h3{
  overflow-wrap:normal;
  word-break:normal;
  line-break:strict;
}

@supports (word-break:auto-phrase){
  .hero h1,
  .section-heading h2,
  .reservation-feature-copy h2,
  .collab-head h2,
  .contact-band h2,
  .timeline-item h3{
    word-break:auto-phrase;
  }
}

/* Product cards: keep visual rhythm without forcing odd text heights */
.product-card{
  height:100%;
}

.product-body{
  display:flex;
  flex-direction:column;
}

.product-card h3{
  min-height:0;
}

.product-card p{
  min-height:0 !important;
}

/* Tables / form controls / long text must not overflow on phones */
input,
select,
textarea,
button{
  max-width:100%;
}

.product-card,
.reservation-feature-card,
.goal-tab,
.timeline-item,
.team-card,
.physical-ai-note,
.principle-card{
  min-width:0;
}

/* Tablet */
@media(max-width:980px){
  .hero-grid{
    grid-template-columns:1fr;
    gap:46px;
  }

  .hero-copy{
    max-width:760px;
  }

  .hero-visual{
    width:min(100%,720px);
    margin-inline:auto;
  }

  .products-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .reservation-feature-card{
    grid-template-columns:1fr;
  }

  .collab-head{
    grid-template-columns:1fr;
    gap:24px;
  }
}

/* Smartphone */
@media(max-width:680px){
  html{
    overflow-x:hidden;
  }

  body{
    overflow-x:hidden;
    font-size:15.5px;
  }

  .container{
    width:min(calc(100% - 28px), var(--container));
  }

  .section{
    padding:66px 0;
  }

  /* Header */
  .header-inner{
    min-height:68px;
  }

  .brand{
    gap:8px;
    font-size:.96rem;
  }

  .brand-image{
    width:48px;
    height:34px;
  }

  /* Hero */
  .hero{
    min-height:auto;
    padding:108px 0 64px;
  }

  .hero-grid{
    gap:36px;
  }

  .hero h1{
    font-size:clamp(2.1rem,10.2vw,3rem);
    line-height:1.12;
    letter-spacing:-.035em;
  }

  .hero h1 br{
    display:none;
  }

  .hero-lead{
    margin-top:24px;
    font-size:.96rem;
    line-height:1.84;
  }

  .hero-signature{
    margin-top:22px;
    gap:7px;
    font-size:.7rem;
  }

  .hero-actions{
    display:grid;
    grid-template-columns:1fr;
    gap:10px;
    margin-top:26px;
  }

  .hero-actions .button{
    width:100%;
  }

  .hero-visual{
    width:100%;
    min-height:0;
  }

  .hero-artwork::before{
    inset:-8px;
    border-radius:20px;
  }

  .hero-artwork .hero-main-image{
    aspect-ratio:4 / 3;
    object-position:center center;
    border-radius:18px;
  }

  /* Reservation feature */
  .reservation-feature{
    padding:60px 0;
  }

  .reservation-feature-card{
    padding:24px 18px;
    gap:26px;
  }

  .reservation-feature-copy h2{
    font-size:clamp(1.9rem,8.9vw,2.5rem);
    line-height:1.18;
  }

  .reservation-feature-copy h2 br{
    display:none;
  }

  .reservation-feature-copy > p:last-child{
    font-size:.94rem;
    line-height:1.78;
  }

  .reservation-feature-meta{
    grid-template-columns:1fr;
  }

  .reservation-feature-meta > div{
    display:grid;
    grid-template-columns:72px 1fr auto;
    align-items:center;
    gap:8px;
  }

  .reservation-feature-note{
    text-align:left;
    line-height:1.65;
  }

  /* Standard section headings */
  .section-heading{
    margin-bottom:34px;
  }

  .section-heading h2,
  .collab-head h2,
  .contact-band h2{
    font-size:clamp(1.82rem,8.4vw,2.42rem);
    line-height:1.22;
    letter-spacing:-.035em;
  }

  .section-heading h2 br,
  .collab-head h2 br,
  .contact-band h2 br{
    display:none;
  }

  .split-heading{
    grid-template-columns:1fr;
    gap:18px;
  }

  .split-heading > p{
    margin:0;
  }

  /* About */
  .about-grid{
    grid-template-columns:1fr;
    gap:32px;
  }

  .about-copy .lead{
    font-size:1.12rem;
    line-height:1.7;
  }

  .principle-card{
    padding:22px 18px;
  }

  /* Products */
  .products-grid{
    grid-template-columns:1fr;
    gap:16px;
  }

  .product-visual{
    aspect-ratio:4 / 3;
  }

  .product-body{
    padding:20px 18px;
  }

  .product-meta{
    align-items:flex-start;
  }

  .product-card h3{
    margin:9px 0 7px;
    font-size:1.22rem;
    line-height:1.42;
  }

  .product-card p{
    font-size:.9rem;
    line-height:1.72;
  }

  .festival-info{
    grid-template-columns:1fr;
  }

  /* Team section */
  .team-composition{
    grid-template-columns:1fr;
    gap:20px;
  }

  .team-card{
    min-height:auto;
    padding:24px 18px;
  }

  .team-card h3{
    margin-top:26px;
    font-size:clamp(2.35rem,13vw,3.6rem);
  }

  .team-cross{
    grid-template-columns:auto auto;
    justify-content:center;
  }

  .team-cross small{
    writing-mode:horizontal-tb;
  }

  .physical-ai-note{
    grid-template-columns:1fr;
    gap:8px;
    padding:22px 18px;
  }

  .ecophy-equation{
    justify-content:flex-start;
    border-radius:16px;
    padding:16px;
  }

  /* Goal dropdowns */
  .goal-tab summary{
    grid-template-columns:46px minmax(0,1fr) 24px;
    gap:10px;
    min-height:70px;
    padding:11px 14px;
  }

  .goal-tab .goal-icon{
    width:42px;
    height:42px;
  }

  .goal-tab .goal-icon-svg{
    width:38px;
    height:38px;
  }

  .goal-tab-title{
    font-size:.98rem;
    line-height:1.45;
  }

  .goal-tab-panel{
    padding:0 14px 16px 70px;
  }

  /* Timeline */
  .timeline::before{
    left:7px;
  }

  .timeline-item{
    grid-template-columns:1fr;
    gap:5px;
    padding-left:30px;
  }

  .timeline-item::before{
    left:1px;
    top:17px;
  }

  .timeline-item time{
    font-size:.72rem;
  }

  .timeline-item h3{
    font-size:1.08rem;
    line-height:1.48;
  }

  .timeline-item p{
    font-size:.9rem;
    line-height:1.72;
  }

  .timeline-emphasis{
    margin-top:6px;
  }

  /* Contact/footer */
  .contact-band-inner{
    grid-template-columns:1fr;
    gap:24px;
  }

  .contact-actions{
    align-items:stretch;
  }

  .contact-actions .button{
    width:100%;
  }

  .footer-grid{
    grid-template-columns:1fr;
    gap:24px;
  }

  .footer-brand .brand-image{
    width:58px;
    height:40px;
  }

  .footer-meta{
    text-align:left;
  }

  .footer-environment-note{
    margin-top:24px;
    padding-top:18px;
  }

  .footer-environment-note p{
    font-size:.68rem;
    line-height:1.65;
  }

  /* Dialog */
  .reservation-dialog{
    width:calc(100vw - 16px);
    max-height:95vh;
  }

  .reservation-dialog-shell{
    padding:20px 12px 16px;
  }

  .reservation-dialog-head{
    padding:6px 44px 18px 4px;
  }

  .reservation-dialog-head h2{
    font-size:clamp(1.7rem,8.1vw,2.25rem);
  }

  .reservation-dialog-head h2 br{
    display:none;
  }

  .reservation-dialog .reserve-form{
    padding:18px 12px;
  }

  .two-col{
    grid-template-columns:1fr;
  }

  .reserve-form input,
  .reserve-form select,
  .reserve-form textarea{
    font-size:16px;
  }

  .dialog-actions{
    grid-template-columns:1fr;
  }

  #confirm-list div{
    grid-template-columns:1fr;
    gap:2px;
  }
}

/* Extra-narrow smartphones */
@media(max-width:390px){
  .container{
    width:min(calc(100% - 22px), var(--container));
  }

  .hero h1{
    font-size:clamp(1.95rem,10vw,2.5rem);
  }

  .reservation-feature-copy h2,
  .section-heading h2,
  .collab-head h2,
  .contact-band h2{
    font-size:clamp(1.7rem,8.7vw,2.15rem);
  }

  .reservation-feature-meta > div{
    grid-template-columns:64px minmax(0,1fr);
  }

  .reservation-feature-meta small{
    grid-column:2;
  }

  .goal-tab-panel{
    padding-left:14px;
  }
}

/* ===== Natural mobile heading breaks ===== */

/* Desktop remains visually unchanged */
.mobile-heading-line,
.desktop-line{
  display:inline;
}

/* Smartphone: break headings only at meaningful phrase boundaries */
@media(max-width:680px){
  .smart-mobile-heading .desktop-heading-break{
    display:none !important;
  }

  .smart-mobile-heading .mobile-heading-line{
    display:block;
    width:max-content;
    max-width:100%;
    margin-inline:0;
    white-space:nowrap;
  }

  /* These headings need to fit whole phrases without a third accidental line */
  .hero .smart-mobile-heading{
    font-size:clamp(1.92rem,8vw,2.12rem) !important;
    line-height:1.16 !important;
  }

  .reservation-main-heading{
    font-size:clamp(1.72rem,7.25vw,2rem) !important;
    line-height:1.2 !important;
  }

  .team-main-heading{
    font-size:clamp(1.66rem,7vw,1.98rem) !important;
    line-height:1.24 !important;
  }

  .contact-main-heading{
    font-size:clamp(1.72rem,7.2vw,2rem) !important;
    line-height:1.22 !important;
  }

  /* A little air between intentionally separated lines */
  .smart-mobile-heading .mobile-heading-line + .mobile-heading-line,
  .smart-mobile-heading .desktop-line > .mobile-heading-line + .mobile-heading-line{
    margin-top:.08em;
  }
}

/* Very narrow phones */
@media(max-width:370px){
  .hero .smart-mobile-heading{
    font-size:1.82rem !important;
  }

  .reservation-main-heading{
    font-size:1.62rem !important;
  }

  .team-main-heading{
    font-size:1.54rem !important;
  }

  .contact-main-heading{
    font-size:1.62rem !important;
  }
}


/* ===== Print-name field refinement ===== */
.reserve-form .field-help{
  line-height:1.6;
}

.reserve-form input[name="print_name"]{
  text-transform:uppercase;
  letter-spacing:.08em;
}

/* ===== Mobile reservation/form final polish ===== */

.product-card h3,
.reserve-form label,
.form-footnote,
.field-help,
.reservation-feature-note{
  overflow-wrap:normal;
  word-break:normal;
  line-break:strict;
  text-wrap:pretty;
}

@supports (word-break:auto-phrase){
  .product-card h3,
  .reserve-form label,
  .form-footnote,
  .field-help,
  .reservation-feature-note{
    word-break:auto-phrase;
  }
}

.reserve-form,
.reserve-form .form-row,
.reserve-form label{
  min-width:0;
}

.reserve-form input,
.reserve-form select,
.reserve-form textarea{
  box-sizing:border-box;
  width:100%;
  min-width:0;
}

#product-select{
  width:100%;
  max-width:100%;
}

@media(max-width:680px){

  .reservation-dialog .reserve-form{
    width:100%;
    padding:18px 14px;
  }

  .reserve-form .form-row,
  .reserve-form .form-row.two-col{
    display:grid;
    grid-template-columns:minmax(0,1fr);
    gap:16px;
    width:100%;
  }

  .reserve-form label{
    display:block;
    width:100%;
    font-size:.92rem;
    line-height:1.55;
  }

  .reserve-form input,
  .reserve-form select,
  .reserve-form textarea{
    width:100%;
    max-width:100%;
    margin-top:7px;
    font-size:16px;
    line-height:1.4;
  }

  .reserve-form input,
  .reserve-form select{
    min-height:50px;
  }

  #product-select{
    font-size:15px;
    padding-left:12px;
    padding-right:34px;
  }

  #print-name-row[hidden]{
    display:none !important;
  }

  #print-name-row:not([hidden]){
    display:grid;
  }

  .field-help{
    display:block;
    margin-top:7px;
    font-size:.76rem;
    line-height:1.65;
  }

  .privacy-check{
    display:grid !important;
    grid-template-columns:22px minmax(0,1fr);
    align-items:start;
    gap:10px;
    margin-top:18px;
  }

  .privacy-check input{
    width:18px !important;
    min-height:18px !important;
    height:18px;
    margin:3px 0 0;
  }

  .privacy-check span{
    min-width:0;
    font-size:.84rem;
    line-height:1.65;
  }

  .form-submit{
    width:100%;
    min-height:54px;
    margin-top:20px;
    white-space:normal;
    text-align:center;
  }

  .form-footnote{
    font-size:.7rem;
    line-height:1.7;
  }

  #confirm-list div{
    display:grid;
    grid-template-columns:1fr;
    gap:3px;
    padding:11px 0;
  }

  #confirm-list dt{
    font-size:.72rem;
  }

  #confirm-list dd{
    margin:0;
    min-width:0;
    overflow-wrap:anywhere;
    font-size:.94rem;
    line-height:1.55;
  }

  .dialog-actions{
    display:grid;
    grid-template-columns:1fr;
    gap:10px;
  }

  .dialog-actions .button,
  .dialog-actions button{
    width:100%;
    min-height:50px;
  }

  .product-card h3{
    max-width:100%;
    font-size:1.16rem;
    line-height:1.48;
    letter-spacing:-.015em;
  }

  .product-card .button{
    width:100%;
    white-space:normal;
    text-align:center;
    line-height:1.45;
    padding-inline:14px;
  }

  .reservation-badge,
  .walkin-badge{
    max-width:100%;
    white-space:normal;
    line-height:1.45;
  }
}

@media(max-width:390px){
  .reservation-dialog{
    width:calc(100vw - 12px);
  }

  .reservation-dialog-shell{
    padding-inline:10px;
  }

  .reservation-dialog .reserve-form{
    padding-inline:11px;
  }

  #product-select{
    font-size:14px;
  }

  .product-card h3{
    font-size:1.1rem;
  }

  .form-footnote{
    font-size:.67rem;
  }
}

/* ============================================================
   Multi-item reservation order
   複数商品予約フォーム
   ============================================================ */

/* 飲み物＋キーホルダーセットの注意書き */
.product-caution {
  margin: 14px 0 0 !important;
  min-height: 0 !important;
  padding: 11px 12px;
  border-left: 3px solid var(--ochre);
  border-radius: 0 8px 8px 0;
  background: rgba(182, 145, 76, .10);
  color: #6b5547 !important;
  font-size: .78rem !important;
  line-height: 1.65 !important;
}

.product-caution strong {
  display: block;
  margin-bottom: 2px;
  color: var(--coffee);
  font-size: .68rem;
  letter-spacing: .08em;
}


/* ============================================================
   予約商品の見出し部分
   ============================================================ */

.reservation-order-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
  margin: 8px 0 16px;
  padding-top: 6px;
}

.reservation-order-head h3 {
  margin: 4px 0 5px;
  font-size: 1.28rem;
  line-height: 1.35;
}

.reservation-order-head p {
  margin: 0;
  max-width: 650px;
  color: var(--muted);
  font-size: .82rem;
  line-height: 1.65;
}

.reservation-order-kicker {
  color: var(--coffee);
  font-size: .64rem;
  font-weight: 900;
  letter-spacing: .12em;
}

.reservation-add-item {
  flex: 0 0 auto;
  min-height: 44px;
  white-space: nowrap;
}


/* ============================================================
   商品ごとの予約カード
   ============================================================ */

.reservation-items {
  display: grid;
  gap: 14px;
}

.reservation-item {
  min-width: 0;
  padding: 18px;
  border: 1px solid rgba(73, 55, 45, .14);
  border-radius: 12px;
  background: #f8f4ef;
}

.reservation-item-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 14px;
}

.reservation-item-title {
  font-size: .93rem;
  color: var(--ink);
}

.reservation-item-remove {
  appearance: none;
  padding: 5px 8px;
  border: 0;
  background: transparent;
  color: var(--muted);
  font: inherit;
  font-size: .76rem;
  text-decoration: underline;
  cursor: pointer;
}

.reservation-item-remove:hover {
  color: var(--coffee);
}


/* 商品名と個数 */
.reservation-item-fields {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(110px, .65fr);
  gap: 12px;
}

.reservation-item-fields label,
.reservation-item-print label {
  min-width: 0;
}

.reservation-item-fields select,
.reservation-item-fields input,
.reservation-item-print input {
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
}


/* 印刷名 */
.reservation-item-print {
  margin-top: 12px;
}

.reservation-item-print[hidden] {
  display: none !important;
}


/* 商品ごとの小計 */
.reservation-item-price {
  display: flex;
  align-items: baseline;
  justify-content: flex-end;
  gap: 12px;
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid rgba(73, 55, 45, .10);
}

.reservation-item-price span {
  color: var(--muted);
  font-size: .72rem;
}

.reservation-item-price strong {
  color: var(--coffee);
  font-size: 1.15rem;
}


/* ============================================================
   合計点数・合計金額
   ============================================================ */

.reservation-order-total {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin: 16px 0 22px;
}

.reservation-order-total > div {
  padding: 15px 17px;
  border-radius: 10px;
  background: #3a2f29;
  color: #fff;
}

.reservation-order-total span {
  display: block;
  margin-bottom: 4px;
  color: rgba(255, 255, 255, .58);
  font-size: .64rem;
  font-weight: 900;
  letter-spacing: .08em;
}

.reservation-order-total strong {
  display: block;
  font-size: 1.26rem;
  line-height: 1.3;
}


/* ============================================================
   スマートフォン
   ============================================================ */

@media (max-width: 680px) {

  .reservation-order-head {
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
    align-items: start;
  }

  .reservation-add-item {
    width: 100%;
    white-space: normal;
  }

  .reservation-item {
    padding: 15px 12px;
  }

  .reservation-item-fields {
    grid-template-columns: 1fr;
    gap: 13px;
  }

  .reservation-item-fields select,
  .reservation-item-fields input,
  .reservation-item-print input {
    min-height: 50px;
    font-size: 16px;
  }

  .reservation-item-price {
    justify-content: space-between;
  }

  .reservation-order-total {
    grid-template-columns: 1fr 1fr;
    gap: 8px;
  }

  .reservation-order-total > div {
    padding: 13px 12px;
  }

  .reservation-order-total strong {
    font-size: 1.08rem;
  }

  .product-caution {
    font-size: .76rem !important;
  }

}


/* かなり幅の狭いスマホ */
@media (max-width: 390px) {

  .reservation-order-total {
    grid-template-columns: 1fr;
  }

}


/* ===== Instagram cute gradient button ===== */
.instagram-gradient-button{
  position:relative;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.62) !important;
  background:
    linear-gradient(135deg,#f4a7b8 0%,#e987b0 36%,#c89bd2 68%,#f1bd8d 100%) !important;
  color:#fff !important;
  font-weight:900 !important;
  letter-spacing:.02em;
  box-shadow:
    0 12px 28px rgba(205,123,158,.28),
    inset 0 1px rgba(255,255,255,.28) !important;
  transition:
    transform .18s ease,
    box-shadow .18s ease,
    filter .18s ease;
}

.instagram-gradient-button::before{
  content:"";
  position:absolute;
  inset:-45% auto -45% -30%;
  width:34%;
  background:rgba(255,255,255,.24);
  transform:rotate(18deg);
  transition:left .35s ease;
  pointer-events:none;
}

.instagram-gradient-button:hover{
  transform:translateY(-2px);
  filter:saturate(1.06) brightness(1.03);
  box-shadow:
    0 17px 34px rgba(205,123,158,.34),
    inset 0 1px rgba(255,255,255,.34) !important;
}

.instagram-gradient-button:hover::before{
  left:105%;
}

@media(max-width:680px){
  .instagram-gradient-button{
    width:100%;
    min-height:54px;
    font-size:.96rem;
  }
}


/* ===== Timeline accordion ===== */
/* Native details/summary accordion for 「これまでの歩み」 */
.timeline-accordion{
  display:grid;
  gap:14px;
}

.timeline-accordion::before{
  display:none;
}

.timeline-dropdown{
  display:block;
  padding:0;
  border:1px solid rgba(73,55,45,.13);
  border-radius:14px;
  background:rgba(255,255,255,.34);
  overflow:hidden;
}

.timeline-dropdown::before{
  display:none;
}

.timeline-dropdown summary{
  display:grid;
  grid-template-columns:145px minmax(0,1fr) 28px;
  gap:22px;
  align-items:center;
  min-height:76px;
  padding:17px 20px;
  cursor:pointer;
  list-style:none;
  transition:background .18s ease;
}

.timeline-dropdown summary::-webkit-details-marker{
  display:none;
}

.timeline-dropdown summary:hover{
  background:rgba(255,255,255,.28);
}

.timeline-dropdown summary time{
  margin:0;
  color:var(--coffee);
  font-size:.73rem;
  font-weight:900;
  letter-spacing:.09em;
}

.timeline-summary-title{
  min-width:0;
  color:var(--ink);
  font-size:1.18rem;
  font-weight:800;
  line-height:1.46;
  overflow-wrap:normal;
  word-break:normal;
  line-break:strict;
  text-wrap:pretty;
}

@supports (word-break:auto-phrase){
  .timeline-summary-title{
    word-break:auto-phrase;
  }
}

.timeline-toggle{
  display:grid;
  place-items:center;
  width:28px;
  height:28px;
  border-radius:50%;
  background:rgba(108,81,66,.10);
  color:var(--coffee);
  font-size:1.2rem;
  font-weight:500;
  line-height:1;
  transition:transform .18s ease,background .18s ease;
}

.timeline-dropdown[open] .timeline-toggle{
  transform:rotate(45deg);
  background:rgba(108,81,66,.16);
}

.timeline-panel{
  padding:0 68px 20px 187px;
}

.timeline-panel p{
  margin:0;
  color:var(--muted);
  font-size:.94rem;
  line-height:1.78;
}

.timeline-dropdown[open] summary{
  background:rgba(255,255,255,.24);
}

.timeline-dropdown.timeline-future{
  border-color:rgba(182,145,76,.28);
}

@media(max-width:680px){
  .timeline-accordion{
    gap:10px;
  }

  .timeline-dropdown{
    border-radius:12px;
  }

  .timeline-dropdown summary{
    grid-template-columns:minmax(0,1fr) 26px;
    gap:8px 12px;
    min-height:0;
    padding:15px 14px;
  }

  .timeline-dropdown summary time{
    grid-column:1;
    font-size:.66rem;
  }

  .timeline-summary-title{
    grid-column:1;
    font-size:1rem;
    line-height:1.5;
  }

  .timeline-toggle{
    grid-column:2;
    grid-row:1 / span 2;
    align-self:center;
    width:26px;
    height:26px;
    font-size:1.08rem;
  }

  .timeline-panel{
    padding:0 14px 17px;
  }

  .timeline-panel p{
    font-size:.88rem;
    line-height:1.72;
  }
}


/* ===== Timeline single-plus fix ===== */
.timeline-dropdown summary::after{
  content:none !important;
  display:none !important;
}

.timeline-dropdown summary::marker{
  content:"";
}

.timeline-dropdown summary::-webkit-details-marker{
  display:none !important;
}


/* ===== Hero reservation CTA polish ===== */
.hero-reservation-cta{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  min-height:58px;
  padding:15px 24px;
  border:1px solid rgba(255,255,255,.58) !important;
  border-radius:999px;
  background:
    linear-gradient(135deg,#d86f83 0%,#d987b8 36%,#bd93d3 66%,#e8ab7f 100%) !important;
  color:#fff !important;
  font-weight:950;
  letter-spacing:.015em;
  box-shadow:
    0 14px 34px rgba(184,91,126,.34),
    0 0 0 5px rgba(255,255,255,.055),
    inset 0 1px rgba(255,255,255,.28);
  text-shadow:0 1px 2px rgba(73,38,48,.18);
  transition:
    transform .18s ease,
    box-shadow .18s ease,
    filter .18s ease;
}

.hero-reservation-cta::before{
  content:"";
  position:absolute;
  z-index:-1;
  top:-80%;
  bottom:-80%;
  left:-32%;
  width:25%;
  background:linear-gradient(
    90deg,
    transparent,
    rgba(255,255,255,.38),
    transparent
  );
  transform:rotate(18deg);
  transition:left .42s ease;
}

.hero-reservation-cta:hover{
  transform:translateY(-3px) scale(1.015);
  filter:saturate(1.08) brightness(1.04);
  box-shadow:
    0 20px 42px rgba(184,91,126,.44),
    0 0 0 6px rgba(255,255,255,.08),
    inset 0 1px rgba(255,255,255,.34);
}

.hero-reservation-cta:hover::before{
  left:112%;
}

.hero-reservation-cta:active{
  transform:translateY(-1px) scale(.995);
}

.hero-reservation-cta-label{
  position:relative;
  z-index:1;
}

.hero-reservation-cta-arrow{
  position:relative;
  z-index:1;
  display:inline-grid;
  place-items:center;
  width:28px;
  height:28px;
  flex:0 0 28px;
  border-radius:50%;
  background:rgba(255,255,255,.18);
  font-size:1rem;
  transition:transform .18s ease,background .18s ease;
}

.hero-reservation-cta:hover .hero-reservation-cta-arrow{
  transform:translateX(3px);
  background:rgba(255,255,255,.28);
}

@media(max-width:680px){
  .hero-reservation-cta{
    width:100%;
    min-height:56px;
    padding:14px 17px;
    gap:9px;
    font-size:.94rem;
    line-height:1.4;
    white-space:normal;
  }

  .hero-reservation-cta-arrow{
    width:26px;
    height:26px;
    flex-basis:26px;
  }
}

@media(max-width:390px){
  .hero-reservation-cta{
    font-size:.9rem;
    padding-inline:14px;
  }
}


/* ===== Team card dropdowns ===== */
/* Bout.AI / Linne.Lab:
   team name + tagline remain visible; explanatory content opens below. */
.team-card{
  min-height:auto;
}

.team-details{
  position:relative;
  z-index:2;
  margin-top:28px;
  border-top:1px solid rgba(255,255,255,.12);
}

.team-details summary{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  min-height:58px;
  padding:14px 2px 12px;
  list-style:none;
  cursor:pointer;
  color:rgba(255,255,255,.88);
  font-size:.82rem;
  font-weight:900;
  letter-spacing:.04em;
  transition:color .18s ease;
}

.team-details summary::-webkit-details-marker{
  display:none;
}

.team-details summary::after{
  content:none !important;
  display:none !important;
}

.team-details summary::marker{
  content:"";
}

.team-details summary:hover{
  color:#fff;
}

.team-details-toggle{
  display:grid;
  place-items:center;
  width:31px;
  height:31px;
  flex:0 0 31px;
  border:1px solid rgba(255,255,255,.16);
  border-radius:50%;
  background:rgba(255,255,255,.07);
  color:#dfc7ae;
  font-size:1.18rem;
  font-weight:500;
  line-height:1;
  transition:
    transform .18s ease,
    background .18s ease,
    border-color .18s ease;
}

.team-details[open] .team-details-toggle{
  transform:rotate(45deg);
  background:rgba(255,255,255,.12);
  border-color:rgba(255,255,255,.24);
}

.team-details-panel{
  padding:3px 0 4px;
}

.team-details-panel > p{
  max-width:520px;
  margin:0;
  color:rgba(255,255,255,.66);
  line-height:1.78;
}

.team-details-panel .motion-flow{
  margin-top:24px;
}

/* Keep the two closed cards visually balanced on desktop. */
@media(min-width:981px){
  .team-card{
    align-self:start;
  }
}

/* Smartphone */
@media(max-width:680px){
  .team-card h3{
    margin-bottom:8px;
  }

  .team-lead{
    margin-bottom:0;
    line-height:1.55;
  }

  .team-details{
    margin-top:21px;
  }

  .team-details summary{
    min-height:52px;
    padding:12px 0 10px;
    font-size:.8rem;
  }

  .team-details-toggle{
    width:29px;
    height:29px;
    flex-basis:29px;
  }

  .team-details-panel{
    padding-top:3px;
  }

  .team-details-panel > p{
    font-size:.9rem;
    line-height:1.72;
  }

  .team-details-panel .motion-flow{
    margin-top:18px;
  }
}


/* ===== Team dropdown hard collapse fix ===== */
.team-details:not([open]) > .team-details-panel{
  display:none !important;
}

.team-details[open] > .team-details-panel{
  display:block !important;
}

.team-card > .team-details{
  width:100%;
}

.team-card .team-details-panel > p{
  padding:0 !important;
}


/* ===== Team lead emphasis ===== */
.team-card .team-lead{
  font-size:1.36rem !important;
  line-height:1.5;
}

@media(max-width:680px){
  .team-card .team-lead{
    font-size:1.28rem !important;
    line-height:1.5;
  }
}


/* ===== Mobile final hardening 20261001 ===== */

/* ============================================================
   Final smartphone hardening
   PC/tablet styling remains unchanged.
   ============================================================ */

@media(max-width:680px){

  html,
  body{
    width:100%;
    max-width:100%;
    overflow-x:hidden;
  }

  body{
    font-size:15.5px;
  }

  *,
  *::before,
  *::after{
    box-sizing:border-box;
  }

  img,
  svg,
  video,
  canvas{
    max-width:100%;
    height:auto;
  }

  .container{
    width:min(calc(100% - 24px),var(--container));
    margin-inline:auto;
  }

  .section{
    padding-top:60px;
    padding-bottom:60px;
  }

  /* Any grid/flex child must be allowed to shrink on a phone. */
  .hero-grid > *,
  .about-grid > *,
  .products-grid > *,
  .team-composition > *,
  .collab-head > *,
  .split-heading > *,
  .contact-band-inner > *,
  .footer-grid > *,
  .reservation-feature-card > *,
  .reservation-item,
  .reservation-item-fields > *,
  .team-card,
  .goal-tab,
  .timeline-dropdown{
    min-width:0;
  }

  /* Japanese headings: natural phrase-aware wrapping. */
  .hero h1,
  .section-heading h2,
  .reservation-main-heading,
  .team-main-heading,
  .contact-main-heading,
  .team-card h3,
  .team-card .team-lead,
  .product-card h3,
  .timeline-summary-title,
  .goal-tab-title,
  .reservation-order-head h3,
  .reservation-dialog-head h2{
    max-width:100%;
    overflow-wrap:normal;
    word-break:normal;
    line-break:strict;
    text-wrap:balance;
  }

  @supports (word-break:auto-phrase){
    .hero h1,
    .section-heading h2,
    .reservation-main-heading,
    .team-main-heading,
    .contact-main-heading,
    .team-card h3,
    .team-card .team-lead,
    .product-card h3,
    .timeline-summary-title,
    .goal-tab-title,
    .reservation-order-head h3,
    .reservation-dialog-head h2{
      word-break:auto-phrase;
    }
  }

  /* The explicit phrase spans remain separate lines, but may wrap safely
     on very narrow devices instead of overflowing the viewport. */
  .smart-mobile-heading .mobile-heading-line{
    display:block !important;
    width:auto !important;
    max-width:100% !important;
    white-space:normal !important;
    text-wrap:balance;
  }

  .smart-mobile-heading .desktop-heading-break{
    display:none !important;
  }

  /* Header / navigation */
  .header-inner{
    min-height:66px;
  }

  .global-nav{
    max-width:100%;
  }

  .global-nav a{
    max-width:100%;
    white-space:normal;
  }

  /* Hero */
  .hero{
    min-height:auto;
    padding-top:94px;
    padding-bottom:58px;
  }

  .hero-grid{
    grid-template-columns:minmax(0,1fr) !important;
    gap:32px;
  }

  .hero-copy{
    min-width:0;
  }

  .hero .smart-mobile-heading{
    font-size:clamp(1.88rem,8.2vw,2.2rem) !important;
    line-height:1.17 !important;
    letter-spacing:-.035em;
  }

  .hero-lead{
    font-size:.94rem;
    line-height:1.82;
  }

  .hero-signature{
    flex-wrap:wrap;
    row-gap:7px;
  }

  .hero-actions{
    display:grid;
    grid-template-columns:minmax(0,1fr);
    gap:10px;
  }

  .hero-actions .button{
    width:100%;
    max-width:100%;
    min-height:54px;
    padding-inline:15px;
    white-space:normal;
    text-align:center;
  }

  .hero-reservation-cta{
    display:flex !important;
    width:100% !important;
    max-width:100%;
  }

  .hero-reservation-cta-label{
    min-width:0;
    text-wrap:balance;
  }

  .hero-pick-card{
    width:100% !important;
    max-width:100%;
    grid-template-columns:100px minmax(0,1fr) !important;
    gap:12px !important;
    padding:11px !important;
  }

  .hero-pick-image{
    width:100%;
  }

  .hero-pick-copy{
    min-width:0;
  }

  .hero-pick-copy strong{
    font-size:.98rem !important;
    line-height:1.38 !important;
  }

  .hero-pick-copy p{
    font-size:.71rem !important;
    line-height:1.52 !important;
  }

  .hero-pick-badges{
    flex-wrap:wrap;
  }

  .hero-pick-cta{
    max-width:100%;
    white-space:normal;
  }

  .hero-artwork,
  .hero-artwork .hero-main-image{
    width:100%;
  }

  .hero-artwork .hero-main-image{
    aspect-ratio:4 / 3;
    object-fit:cover;
  }

  /* Reservation feature */
  .reservation-feature-card{
    grid-template-columns:minmax(0,1fr) !important;
    gap:24px;
    padding:22px 16px;
  }

  .reservation-main-heading{
    font-size:clamp(1.62rem,7vw,1.98rem) !important;
    line-height:1.24 !important;
  }

  .reservation-feature-copy > p:last-child,
  .reservation-feature-note{
    font-size:.9rem;
    line-height:1.72;
  }

  .reservation-feature-meta{
    grid-template-columns:minmax(0,1fr) !important;
  }

  .reservation-feature-meta > div{
    grid-template-columns:68px minmax(0,1fr) auto;
    gap:8px;
    min-width:0;
  }

  .reservation-open-button{
    width:100% !important;
    max-width:100%;
    min-height:60px !important;
    padding:14px 15px !important;
    white-space:normal !important;
    text-align:center;
  }

  /* About */
  .about-grid{
    grid-template-columns:minmax(0,1fr) !important;
    gap:28px;
  }

  .about-copy,
  .principle-card{
    min-width:0;
  }

  .about-copy p,
  .principle-card small{
    overflow-wrap:anywhere;
  }

  /* Product section */
  .products-grid{
    grid-template-columns:minmax(0,1fr) !important;
    gap:16px;
  }

  .product-card{
    width:100%;
    min-width:0;
  }

  .product-body{
    padding:19px 16px;
    min-width:0;
  }

  .product-meta{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    flex-wrap:wrap;
    gap:7px 10px !important;
  }

  .product-label{
    white-space:nowrap;
    flex:0 0 auto;
  }

  .product-price{
    margin-left:auto;
    min-width:0;
    text-align:right;
  }

  .product-card h3{
    font-size:1.1rem !important;
    line-height:1.48 !important;
  }

  .product-card p,
  .product-caution{
    font-size:.88rem;
    line-height:1.72 !important;
  }

  .product-card .button,
  .reservation-badge,
  .walkin-badge{
    max-width:100%;
    white-space:normal;
    text-align:center;
  }

  .festival-info{
    grid-template-columns:minmax(0,1fr) !important;
  }

  /* Teams */
  .collab-head{
    grid-template-columns:minmax(0,1fr) !important;
    gap:18px;
  }

  .team-main-heading{
    font-size:clamp(1.55rem,6.8vw,1.9rem) !important;
    line-height:1.3 !important;
  }

  .team-composition{
    grid-template-columns:minmax(0,1fr) !important;
    gap:18px;
  }

  .team-card{
    width:100%;
    padding:22px 16px;
    border-radius:22px;
  }

  .team-card-top{
    gap:10px;
    flex-wrap:wrap;
  }

  .team-card h3{
    margin-top:24px !important;
    font-size:clamp(2.3rem,12.5vw,3.35rem) !important;
    line-height:1.02 !important;
  }

  .team-card .team-lead{
    font-size:1.22rem !important;
    line-height:1.55 !important;
    text-wrap:balance;
  }

  .team-details{
    margin-top:18px;
  }

  .team-details summary{
    min-height:50px;
    gap:10px;
  }

  .team-details-panel > p{
    font-size:.88rem;
    line-height:1.72;
  }

  .motion-flow{
    display:flex;
    flex-wrap:wrap;
    gap:7px 8px;
  }

  .motion-flow span{
    max-width:100%;
    white-space:normal;
  }

  .team-cross{
    grid-template-columns:auto auto;
    justify-content:center;
  }

  .team-cross small{
    writing-mode:horizontal-tb;
  }

  .physical-ai-note{
    grid-template-columns:minmax(0,1fr) !important;
    gap:9px;
    padding:20px 16px;
  }

  .ecophy-equation{
    display:flex;
    flex-wrap:wrap;
    justify-content:flex-start;
    gap:8px;
    padding:15px;
    border-radius:15px;
  }

  /* Goal accordions */
  .goal-tab summary{
    grid-template-columns:42px minmax(0,1fr) 24px !important;
    gap:9px;
    min-height:68px;
    padding:11px 12px;
  }

  .goal-tab-title{
    min-width:0;
    font-size:.96rem;
    line-height:1.5;
  }

  .goal-tab-panel{
    padding:0 12px 15px 62px;
  }

  /* Timeline accordion */
  .timeline-accordion{
    gap:9px;
  }

  .timeline-dropdown summary{
    grid-template-columns:minmax(0,1fr) 27px !important;
    gap:7px 10px;
    padding:14px 12px;
  }

  .timeline-dropdown summary time{
    grid-column:1;
    min-width:0;
    font-size:.65rem;
    letter-spacing:.07em;
  }

  .timeline-summary-title{
    grid-column:1;
    min-width:0;
    font-size:.98rem;
    line-height:1.52;
  }

  .timeline-toggle{
    grid-column:2;
    grid-row:1 / span 2;
    width:27px;
    height:27px;
    align-self:center;
  }

  .timeline-panel{
    padding:0 12px 16px;
  }

  .timeline-panel p{
    font-size:.87rem;
    line-height:1.73;
  }

  /* Contact */
  .contact-band-inner{
    grid-template-columns:minmax(0,1fr) !important;
    gap:22px;
  }

  .contact-main-heading{
    font-size:clamp(1.58rem,7vw,1.95rem) !important;
    line-height:1.28 !important;
  }

  .contact-actions{
    width:100%;
    min-width:0;
    align-items:stretch;
  }

  .contact-actions .button,
  .instagram-gradient-button{
    width:100% !important;
    max-width:100%;
    min-height:54px;
    white-space:normal;
    text-align:center;
  }

  .instagram-search{
    overflow-wrap:anywhere;
  }

  /* Footer */
  .footer-grid{
    grid-template-columns:minmax(0,1fr) !important;
    gap:22px;
  }

  .site-footer nav{
    display:flex;
    flex-wrap:wrap;
    gap:10px 16px;
  }

  /* Reservation dialog / form */
  .reservation-dialog{
    width:calc(100vw - 12px) !important;
    max-width:calc(100vw - 12px) !important;
    max-height:95dvh;
    margin:auto;
  }

  .reservation-dialog-shell{
    width:100%;
    min-width:0;
    padding:18px 10px 14px;
  }

  .reservation-dialog-head{
    padding:5px 38px 16px 3px;
  }

  .reservation-dialog-head h2{
    font-size:clamp(1.5rem,7.2vw,1.95rem) !important;
    line-height:1.25;
  }

  .reservation-dialog .reserve-form{
    width:100%;
    min-width:0;
    padding:16px 10px;
  }

  .reserve-form .form-row,
  .reserve-form .form-row.two-col,
  .reservation-item-fields{
    grid-template-columns:minmax(0,1fr) !important;
    width:100%;
    min-width:0;
  }

  .reserve-form label,
  .reservation-item-fields label,
  .reservation-item-print label{
    min-width:0;
  }

  .reserve-form input,
  .reserve-form select,
  .reserve-form textarea,
  .reservation-item-product,
  .reservation-item-quantity,
  .reservation-item-print-input{
    display:block;
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    font-size:16px !important;
  }

  .reservation-order-head{
    grid-template-columns:minmax(0,1fr) !important;
  }

  .reservation-order-head p{
    overflow-wrap:anywhere;
  }

  .reservation-add-item{
    width:100%;
    white-space:normal;
  }

  .reservation-item{
    padding:14px 11px;
  }

  .reservation-item-head{
    gap:8px;
  }

  .reservation-item-price{
    justify-content:space-between;
  }

  .reservation-order-total{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  #confirm-list div{
    grid-template-columns:minmax(0,1fr) !important;
  }

  #confirm-list dd{
    min-width:0;
    overflow-wrap:anywhere;
  }

  .dialog-actions{
    grid-template-columns:minmax(0,1fr) !important;
  }

  .dialog-actions .button,
  .dialog-actions button{
    width:100%;
    min-height:50px;
    white-space:normal;
  }
}

/* Very narrow smartphones */
@media(max-width:390px){

  .container{
    width:min(calc(100% - 18px),var(--container));
  }

  .section{
    padding-top:54px;
    padding-bottom:54px;
  }

  .hero{
    padding-top:88px;
  }

  .hero .smart-mobile-heading{
    font-size:1.78rem !important;
  }

  .hero-pick-card{
    grid-template-columns:84px minmax(0,1fr) !important;
    gap:10px !important;
    padding:10px !important;
  }

  .hero-pick-copy strong{
    font-size:.9rem !important;
  }

  .hero-pick-copy p{
    font-size:.66rem !important;
  }

  .hero-pick-recommend,
  .hero-pick-limited{
    font-size:.55rem !important;
  }

  .hero-pick-cta{
    font-size:.69rem !important;
    padding-inline:8px !important;
  }

  .reservation-main-heading,
  .contact-main-heading{
    font-size:1.52rem !important;
  }

  .team-main-heading{
    font-size:1.46rem !important;
  }

  .team-card{
    padding:20px 14px;
  }

  .team-card h3{
    font-size:2.35rem !important;
  }

  .team-card .team-lead{
    font-size:1.12rem !important;
  }

  .goal-tab-panel{
    padding-left:12px;
  }

  .reservation-order-total{
    grid-template-columns:minmax(0,1fr);
  }

  .reservation-dialog{
    width:calc(100vw - 8px) !important;
    max-width:calc(100vw - 8px) !important;
  }
}


/* ===== Mobile CTA / reservation polish 20261004 ===== */

/* Featured CTA: make decorative layers unable to intercept taps. */
.hero-pick-card::before,
.hero-pick-card::after,
.hero-pick-heart{
  pointer-events:none !important;
}

.hero-pick-copy{
  position:relative;
  z-index:2;
}

.hero-pick-cta{
  position:relative;
  z-index:4;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  text-decoration:none;
  touch-action:manipulation;
  -webkit-tap-highlight-color:transparent;
  pointer-events:auto !important;
}

.reservation-open-button,
.product-card [data-product][href="#reserve"]{
  touch-action:manipulation;
  -webkit-tap-highlight-color:transparent;
}

/* Smartphone final pass */
@media(max-width:680px){

  .hero-pick-card{
    position:relative;
    isolation:isolate;
    align-items:center;
  }

  .hero-pick-image{
    min-width:0;
    max-width:100%;
  }

  .hero-pick-copy{
    min-width:0;
  }

  .hero-pick-copy strong,
  .hero-pick-copy p{
    max-width:100%;
    word-break:normal;
    overflow-wrap:normal;
    line-break:strict;
    text-wrap:pretty;
  }

  @supports (word-break:auto-phrase){
    .hero-pick-copy strong,
    .hero-pick-copy p{
      word-break:auto-phrase;
    }
  }

  .hero-pick-cta{
    width:100% !important;
    min-width:0;
    min-height:46px !important;
    padding:10px 12px !important;
    font-size:.78rem !important;
    line-height:1.35;
    white-space:normal !important;
    text-align:center;
  }

  .reservation-feature-action{
    min-width:0;
    width:100%;
  }

  .reservation-open-button{
    width:100% !important;
    max-width:100%;
    min-height:62px !important;
    padding:14px 14px !important;
    font-size:.94rem !important;
    line-height:1.45 !important;
    white-space:normal !important;
    text-wrap:balance;
  }

  .reservation-open-button::before{
    margin-right:6px !important;
  }

  .reservation-open-button::after{
    margin-left:6px !important;
  }

  .product-card .button,
  .product-card [data-product][href="#reserve"]{
    width:100%;
    max-width:100%;
    min-height:52px;
    padding:12px 12px;
    font-size:.92rem;
    line-height:1.45;
    white-space:normal !important;
    text-align:center;
    text-wrap:balance;
  }

  .product-visual,
  .product-visual img{
    max-width:100%;
  }

  .product-visual img{
    display:block;
    width:100%;
    height:auto;
    object-fit:cover;
  }

  .reservation-feature-note{
    max-width:100%;
    text-wrap:pretty;
  }

  .reservation-dialog{
    overflow-x:hidden;
  }

  .reservation-dialog-shell,
  .reservation-dialog .reserve-form,
  .reservation-item,
  .reservation-order-head{
    max-width:100%;
    overflow-wrap:anywhere;
  }
}

@media(max-width:390px){

  .hero-pick-card{
    grid-template-columns:82px minmax(0,1fr) !important;
    gap:10px !important;
  }

  .hero-pick-cta{
    min-height:44px !important;
    padding-inline:9px !important;
    font-size:.72rem !important;
  }

  .reservation-open-button{
    font-size:.9rem !important;
    padding-inline:11px !important;
  }

  .product-card .button,
  .product-card [data-product][href="#reserve"]{
    font-size:.88rem !important;
  }
}


/* ===== Product anchor / mobile wording polish 20261004 ===== */

/* Keep the fixed header from covering the products heading after anchor navigation. */
#products{
  scroll-margin-top:96px;
}

@media(max-width:680px){
  #products{
    scroll-margin-top:78px;
  }

  .reservation-main-heading{
    max-width:100%;
    text-wrap:balance;
  }

  .reservation-open-button{
    min-height:56px !important;
    padding:13px 14px !important;
    font-size:.98rem !important;
    line-height:1.4 !important;
    white-space:normal !important;
  }

  .product-card [data-product][href="#reserve"]{
    min-height:50px;
    padding:12px 13px;
    white-space:normal !important;
    text-wrap:balance;
  }

  .hero-pick-cta{
    touch-action:manipulation;
    pointer-events:auto !important;
  }
}

@media(max-width:390px){
  .reservation-main-heading{
    font-size:1.54rem !important;
    line-height:1.24 !important;
  }

  .reservation-open-button{
    font-size:.92rem !important;
  }

  .product-card [data-product][href="#reserve"]{
    font-size:.87rem !important;
  }
}


/* ===== Reservation delete button / mobile polish 20261004 ===== */

/* Added reservation rows: make the remove action obvious and easy to tap. */
.reservation-item{
  position:relative;
}

.reservation-item-head{
  position:relative;
  min-height:38px;
  padding-right:96px;
}

.reservation-item-remove{
  position:absolute;
  top:0;
  right:0;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:76px;
  min-height:36px;
  padding:8px 13px;
  border:1px solid rgba(169,79,74,.34);
  border-radius:999px;
  background:#fff7f3;
  color:#9b493f;
  font:inherit;
  font-size:.84rem;
  font-weight:900;
  line-height:1;
  text-decoration:none;
  cursor:pointer;
  box-shadow:0 5px 12px rgba(112,66,52,.08);
  transition:
    background .18s ease,
    color .18s ease,
    border-color .18s ease,
    transform .18s ease,
    box-shadow .18s ease;
}

.reservation-item-remove::before{
  content:"×";
  margin-right:6px;
  font-size:1rem;
  line-height:1;
}

.reservation-item-remove:hover{
  border-color:rgba(169,79,74,.58);
  background:#f7e9e4;
  color:#7f352f;
  transform:translateY(-1px);
  box-shadow:0 8px 17px rgba(112,66,52,.12);
}

.reservation-item-remove:focus-visible{
  outline:3px solid rgba(197,107,111,.24);
  outline-offset:2px;
}

/* The only item is intentionally not removable. */
.reservation-item-remove[hidden]{
  display:none !important;
}

@media(max-width:680px){

  .reservation-item{
    padding:15px 12px 14px;
    overflow:hidden;
  }

  .reservation-item-head{
    min-height:42px;
    padding-right:88px;
    margin-bottom:12px;
  }

  .reservation-item-title{
    min-width:0;
    font-size:.98rem;
    line-height:1.4;
  }

  .reservation-item-remove{
    top:0;
    right:0;
    min-width:76px;
    min-height:38px;
    padding:8px 11px;
    font-size:.82rem;
    touch-action:manipulation;
    -webkit-tap-highlight-color:transparent;
  }

  .reservation-item-fields{
    grid-template-columns:minmax(0,1fr) !important;
    gap:12px;
  }

  .reservation-item-fields label,
  .reservation-item-print label{
    min-width:0;
    max-width:100%;
  }

  .reservation-item-product,
  .reservation-item-quantity,
  .reservation-item-print-input{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    font-size:16px !important;
  }

  .reservation-item-print-help{
    display:block;
    max-width:100%;
    line-height:1.65;
    overflow-wrap:anywhere;
  }

  .product-card [data-product][href="#reserve"]{
    min-height:52px;
    padding:12px 12px;
    line-height:1.45;
    white-space:normal !important;
    text-wrap:balance;
  }
}

@media(max-width:390px){

  .reservation-item{
    padding-inline:10px;
  }

  .reservation-item-head{
    padding-right:82px;
  }

  .reservation-item-remove{
    min-width:72px;
    min-height:36px;
    padding-inline:9px;
    font-size:.78rem;
  }

  .product-card [data-product][href="#reserve"]{
    font-size:.86rem !important;
  }
}
