/* Shared launch polish. Keeps the established fruit and botanical artwork. */
html{scroll-padding-top:24px}
body{background:#fffaf3}
.page,.flavors-page,.ritual-page,.konjac-page{overflow:visible}
.skip-link{position:fixed;top:12px;left:12px;z-index:200;padding:12px 18px;background:#0d3b29;color:#fff;transform:translateY(-160%)}
.skip-link:focus{transform:none}
:focus-visible{outline:3px solid #ba4219;outline-offset:4px}
main:focus{outline:none}
.announcement{font-size:12px;letter-spacing:.18em;min-height:32px}
header{min-height:60px}
.menu-toggle{font-size:14px;min-height:44px;min-width:80px}
.hero-copy p{font-size:clamp(16px,1.75vw,21px);letter-spacing:.06em;line-height:1.4}
.hero-cta,.flavor-card a,.konjac-flavor-cta{background:#b94117;font-size:14px;min-height:48px;letter-spacing:.08em}
.hero-cta:hover,.flavor-card a:hover,.konjac-flavor-cta:hover{background:#963312}
.flavor-card h3{color:#9d3915}
.peach-card h3{color:#9c3d41}
.fiber-facts p,.flavor-subtitle,.steps-subtitle{font-size:14px;line-height:1.5;letter-spacing:.1em}
.fact-copy b{font-size:14px}
.konjac-description{font-size:18px;line-height:1.5}
.steps-grid p,.ritual-step-grid p{font-size:16px;line-height:1.45}
.menu-panel{animation:menu-slide-in .25s ease-out both}
.menu-panel.is-closing{animation:menu-slide-out .22s ease-in both}
.menu-panel:not(.is-closing) .menu-panel-top,.menu-panel:not(.is-closing) .menu-eyebrow,.menu-panel:not(.is-closing) .menu-links a,.menu-panel:not(.is-closing) .menu-signoff,.menu-panel:not(.is-closing) .menu-panel-bottom{animation:none}
.menu-panel a{color:#fff9ed}
.menu-panel a:hover,.menu-panel a[aria-current="page"]{color:#ffad64}
.menu-eyebrow,.menu-signoff p,.menu-panel-bottom,.menu-index{font-size:14px;line-height:1.5;letter-spacing:.08em}
.menu-links a{grid-template-columns:1fr;font-size:clamp(28px,5.5vw,68px);letter-spacing:-.04em;overflow-wrap:anywhere}
.menu-index{display:none}
.menu-panel-bottom{flex-wrap:wrap}
@keyframes menu-slide-in{from{transform:translateX(100%)}to{transform:translateX(0)}}
@keyframes menu-slide-out{from{transform:translateX(0)}to{transform:translateX(100%)}}
@media(max-width:700px){
 .announcement{height:32px;font-size:12px;letter-spacing:.12em}
 header{height:60px;padding:0 20px}
 .hero-copy{top:18px;padding:0 12px}
 .hero-copy p{font-size:16px;letter-spacing:.01em;margin-top:10px}
 .hero-cta{width:auto;min-width:190px;bottom:16px}
 .fiber-facts{padding:22px 16px}
 .fact-icon{width:44px;height:44px}
 .fact{gap:8px}
 .fact-copy strong{font-size:38px}
 .fact-copy b{font-size:12px;letter-spacing:.04em}
 .fact-divider{margin:0 14px}
 .konjac-section{grid-template-columns:1fr}
 .konjac-photo{min-height:0;height:auto;aspect-ratio:4/3;background-position:center 55%}
 .konjac-content{padding:28px 24px 34px}
 .konjac-eyebrow{font-size:14px;white-space:normal;letter-spacing:.08em}
 .konjac-content h2{font-size:clamp(40px,10vw,60px);line-height:1.02}
 .konjac-description{font-size:18px;line-height:1.5;max-width:none}
 .flavor-subtitle,.steps-subtitle{padding:0 14px}
 .flavor-card a{font-size:14px;min-height:48px}
 .steps-section{padding:32px 18px 40px}
 .steps-grid{gap:12px}
 .steps-grid p{font-size:16px;line-height:1.4}
 .steps-grid p br,.ritual-step-grid p br{display:none}
 .menu-panel{padding:0 22px}
 .menu-panel-content{padding:28px 0}
 .menu-eyebrow,.menu-signoff p,.menu-panel-bottom{font-size:14px}
 .menu-links a{font-size:clamp(28px,7.5vw,48px);padding:20px 0;grid-template-columns:1fr}
 .menu-panel-bottom span:last-child{display:block}
 .flavors-eyebrow,.detail-eyebrow,.flavor-detail .detail-eyebrow,.ritual-kicker,.konjac-hero-eyebrow,.section-eyebrow,.konjac-kicker,.way-kicker,.way-intro,.konjac-flavor-heading p{font-size:14px;line-height:1.5;letter-spacing:.08em}
 .flavors-hero-copy>p:last-child,.konjac-hero-intro{font-size:16px;line-height:1.5;letter-spacing:.02em}
 .flavor-detail h2{white-space:normal}
 .flavor-detail .detail-facts{font-size:14px;letter-spacing:.04em}
 .flavor-detail .detail-description{font-size:18px;line-height:1.5}
 .konjac-page-hero h1{font-size:clamp(32px,9.5vw,60px);white-space:normal;line-height:1.05}
 .plant-to-jelly{grid-template-columns:1fr}
 .plant-to-jelly-copy{padding:30px 24px}
 .plant-to-jelly h2{font-size:42px;line-height:1.05}
 .plant-to-jelly-copy>p:last-child,.konjac-fiber-intro,.konjac-benefits p,.way-timeline p{font-size:18px;line-height:1.5}
 .plant-to-jelly-image{min-height:0;aspect-ratio:4/3}
 .konjac-benefits{grid-template-columns:1fr;gap:24px}
 .konjac-benefits article,.konjac-benefits article:first-child,.konjac-benefits article:last-child{border:0;padding:0;gap:16px}
 .konjac-benefits h3{font-size:16px}
 .way-timeline article{grid-template-columns:34px 64px minmax(0,1fr);gap:10px;padding:16px 0}
 .way-image{width:64px;height:64px}
 .way-timeline:before{left:16px}
 .ritual-step-grid{gap:12px}
 .ritual-step-grid p{font-size:16px;line-height:1.4}
 .konjac-flavor-cta{font-size:14px;min-height:48px;width:max-content;max-width:90%}
}
@media(max-width:360px){.fact-icon{display:none}.steps-grid,.ritual-step-grid{grid-template-columns:1fr;gap:28px}.step-visual,.ritual-step-photo{max-width:200px;margin:auto}.hero-copy h1{font-size:32px}.hero{min-height:355px}.flavors-hero h1{white-space:normal}.way-timeline article{grid-template-columns:34px minmax(0,1fr)}.way-image{display:none}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}html{scroll-behavior:auto}}
.menu-toggle .menu-icon{background:transparent;max-width:none}
.flavor-detail h2{white-space:normal;overflow-wrap:normal;font-size:clamp(36px,4.6vw,64px);line-height:1.04}
@media(max-width:700px){.flavor-detail h2{font-size:clamp(40px,10vw,62px)}}

/* Plain close icon; keep the button touch target and keyboard focus. */
.menu-close,.menu-close span,.menu-close:hover span{border:0;border-radius:0;background:transparent;box-shadow:none}
.menu-close span,.menu-close:hover span{transform:none;transition:none;font-size:36px}
.menu-close:focus:not(:focus-visible){outline:none}

/* Equal-width ritual columns and circles, with readable short captions. */
.steps-grid,.ritual-step-grid{grid-template-columns:repeat(3,minmax(0,1fr));align-items:start}
.steps-grid article,.ritual-step-grid article{min-width:0}
.step-visual{width:100%;max-width:190px;aspect-ratio:1}
@media(max-width:700px){
 .steps-section{padding:30px 18px 36px}
 .steps-subtitle{font-size:12px;line-height:1.5;letter-spacing:.08em;margin:12px auto 26px;max-width:30em;padding:0}
 .steps-grid{gap:14px}
 .step-visual{max-width:130px}
 .steps-grid p{font-size:14px;line-height:1.45;max-width:10em;margin:0 auto}
 .steps-grid h3{font-size:16px;line-height:1.2;margin:0 0 7px}
 .step-number{width:26px;height:26px;font-size:14px;margin:-8px auto 8px}
}
@media(max-width:360px){.steps-grid,.ritual-step-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.steps-grid p,.ritual-step-grid p{font-size:14px}.steps-section h2{font-size:clamp(25px,8vw,34px)}}

/* Introduce the plant and show each ingredient's role. */
.konjac-content h2{font-size:clamp(38px,4.8vw,64px);line-height:1.04}
.stick-ingredients{margin-top:26px;padding-top:24px;border-top:1px solid #0d3b2926}
.stick-ingredients h3{font-size:14px;line-height:1.4;letter-spacing:.12em;margin:0 0 16px;color:#0d3b29}
.stick-ingredients dl{margin:0;display:grid;gap:16px}
.stick-ingredients dt{font-size:14px;font-weight:800;letter-spacing:.06em;color:#0d3b29;margin-bottom:4px}
.stick-ingredients dd{margin:0;font-size:16px;line-height:1.5;color:#272723}
@media(max-width:700px){.konjac-content{padding:30px 24px 36px}.konjac-content h2{font-size:clamp(36px,9.5vw,58px)}.stick-ingredients{margin-top:24px}.menu-links a{font-size:clamp(26px,7vw,48px)}}

/* Approved compact konjac artwork, uncropped across screen sizes. */
.konjac-section.konjac-compact{display:block;min-height:0;background:#fffaf3}
.konjac-compact-art{display:block;width:100%;height:auto}

/* Plain X in every state, including automatic focus on opening. */
.menu-panel .menu-close,.menu-panel .menu-close:focus,.menu-panel .menu-close:focus-visible,.menu-panel .menu-close:active,.menu-panel .menu-close:hover{outline:none;border:0;box-shadow:none;background:transparent;-webkit-appearance:none;appearance:none;-webkit-tap-highlight-color:transparent}
.menu-panel .menu-close span{outline:none;border:0;box-shadow:none;background:transparent}
.menu-panel .menu-close:focus-visible span{color:#ffad64}

/* Slightly lower the hero action on phones. */
@media(max-width:700px){.hero-cta{bottom:8px}}
