/* Decorative surfaces only. Original content geometry and spacing are retained. */
:root{--section-cream:#f5eee3;--section-ink:#35271f;--section-muted:#67594e;--section-arc:clamp(18px,2.5vw,38px)}
.cream-section{position:relative;isolation:isolate;--text:var(--section-ink);--muted:var(--section-muted);--body-copy:var(--section-muted);color:var(--section-ink)}
.section-surface{position:absolute;z-index:-1;pointer-events:none;top:0;bottom:0;left:calc(50% - 50vw);width:100vw;background:var(--section-cream)}
.section-surface::before,.section-surface::after{position:absolute;left:0;width:100%;height:var(--section-arc);background:var(--section-cream);content:none}
.section-surface.start::before{content:"";bottom:calc(100% - 1px);clip-path:ellipse(72% 100% at 50% 100%)}
.section-surface.end::after{content:"";top:calc(100% - 1px);clip-path:ellipse(72% 100% at 50% 0)}
/* A mirrored shallow asymmetric arc prevents a repeated bowl-shaped rhythm. */
.section-surface.reverse.start::before{clip-path:ellipse(100% 100% at 0% 100%)}
.section-surface.reverse.end::after{clip-path:ellipse(100% 100% at 100% 0%)}
.feature-overview .section-surface{bottom:0}
.progress-scene,.pantry-scene{background:none}
.pantry-scene::before{display:none}
.cream-section h2,.cream-section h3,.cream-section .demo-heading{color:var(--section-ink)}
.cream-section p,.cream-section .mini-label,.cream-section .feature li{color:var(--section-muted)}
.cream-section .feature svg,.cream-section .flow-icon,.cream-section .membership-icon{stroke:var(--section-ink);filter:none}
.cream-section .feature li::before{background:var(--section-ink)}
.cream-section .feature+.feature,.cream-section .daily-flow li,.daily-flow li,.guide-intro article,.membership-options article{border-color:#35271f26}
.progress-chart{background:transparent;border-color:#35271f26}
.chart-grid{stroke:#35271f20}
.chart-curve{stroke:#9250dc}
.pantry-demo{background:#fffaf080;border-color:#35271f26;box-shadow:0 24px 65px #35271f0a;backdrop-filter:none;-webkit-backdrop-filter:none}
.pantry-options button{background:transparent;color:var(--section-ink);border-color:#35271f50}
.pantry-options button[aria-pressed="true"]{background:#63358b;color:#fff;border-color:#63358b}
.premium-tag{border-color:#35271f50}
.guide-portrait::before{background:radial-gradient(circle,#c39c6326,transparent 68%);box-shadow:none}

/* One spacing system measured from content, independent of viewport height. */
:root{--scene-space:clamp(88px,7vw,112px)}
.features{padding-bottom:0}
.feature-overview,.progress-scene,.pantry-scene,.daily-flow,.guide-intro,.membership,
.recipes-scene,.download,.burger-stage{
 padding-top:var(--scene-space);padding-bottom:var(--scene-space);
}
.recipes-scene,.download{height:auto;min-height:0;max-height:none}
.cream-section>header>:first-child,.progress-copy>:first-child,.pantry-copy>:first-child,
.burger-copy>:first-child,.stories-heading>:first-child{margin-top:0}
.progress-copy>:last-child,.pantry-copy>:last-child,.burger-copy>:last-child,
.stories-heading>:last-child,.story-detail>:last-child,.story-bottom>p{margin-bottom:0}
/* Let the sandwich determine its composition height, not the browser window. */
.burger-stage{height:auto;min-height:0;max-height:none;align-items:start}
.burger-copy{align-self:start}
.burger-art{position:relative;left:auto;top:auto;width:100%;height:clamp(400px,38vw,550px);--piece:clamp(280px,32vw,480px);--table-contact:88%}
.burger-caption{position:relative;left:auto;right:auto;bottom:auto;grid-column:1/-1;width:100%;margin-top:24px;align-items:center}
/* Keep the portrait behind the same text sequence, without percentage offsets. */
.stories-scene{height:auto;min-height:0;max-height:none;padding:var(--scene-space) 6%;display:flex;flex-direction:column;gap:40px}
.stories-heading,.story-detail,.story-bottom{position:relative;top:auto;left:auto;right:auto;bottom:auto;width:44%;max-width:none;margin:0}
.story-bottom{display:block}
@media(max-width:700px){
 :root{--scene-space:64px}
 .burger-art{height:420px;--piece:clamp(215px,68vw,300px);margin-top:18px}
 .burger-caption{margin-top:14px}
 .stories-scene{padding-inline:24px;gap:24px}
 .stories-heading,.story-detail,.story-bottom{width:100%;text-align:center}
 .story-detail{margin-top:400px}
 .story-photo{top:210px;height:555px}
}
/* Full-bleed decorative layers must not create a horizontal scrollbar. */
html,body{overflow-x:clip}
.cream-section{z-index:2}
/* Keep grid tracks from being widened by nonbreaking Czech text. */
.progress-copy,.pantry-copy,.pantry-result>div,.guide-pair article>div,.recipe-detail{min-width:0}
@media(min-width:701px) and (max-width:1100px){
 :root{--scene-space:80px}
 .guide-pair article{gap:16px}
 .guide-portrait{width:clamp(100px,15vw,150px)}
 .guide-pair h3{font-size:28px}
 .guide-pair p{font-size:15px}
 .recipe-metrics{flex-wrap:wrap;row-gap:16px}
 .burger-art{--piece:clamp(240px,30vw,330px);height:400px}
}
@media(max-width:700px){
 .stories-scene .stories-heading{order:1}
 .stories-scene .story-photos{order:2;position:relative;inset:auto;z-index:0;width:calc(100% + 48px);height:clamp(340px,108vw,460px);margin-inline:-24px;flex:none}
 .stories-scene .story-photo{top:0;height:100%;object-position:90% center}
 .stories-scene .story-detail{order:3;margin-top:0}
 .stories-scene .story-bottom{order:4}
 .stories-scene .story-shade{display:none}
 .stories-scene .story-photo-jan{transform:none}
 .pantry-result{grid-template-columns:minmax(0,38%) minmax(0,1fr)}
 .recipe-metrics{gap:clamp(14px,5vw,28px)}
 .pantry-options{gap:8px}
 .pantry-options button{flex:1 1 auto}
}
@media(max-width:360px){
 .pantry-demo{padding:16px}
 .pantry-result{grid-template-columns:1fr}
 .pantry-result>img{aspect-ratio:1.6;width:100%;max-height:180px}
 .pantry-result h3{font-size:20px}
 .hero .hero-copy #hero-title{font-size:38px}
 .recipe-metrics dd{font-size:25px}
}
@media(orientation:landscape) and (max-height:500px) and (max-width:1100px){
 :root{--scene-space:56px}
 .burger-stage{display:grid;grid-template-columns:44% 56%;gap:0}
 .burger-art{height:330px;margin:0;--piece:clamp(210px,28vw,290px)}
 .burger-caption{flex-direction:row;gap:16px}
}
/* Halve the shared gap between the feature overview and progress section. */
.feature-overview{padding-bottom:calc(var(--scene-space) / 2)}
.progress-scene{padding-top:calc(var(--scene-space) / 2)}
/* Let the sandwich cross the preceding curved surface without clipping.
   Keep only the artwork above the cream layer; the photo stays behind it. */
.burger-stage{overflow:visible;isolation:auto}
.burger-stage::before{z-index:0}
.burger-art{overflow:visible;z-index:3}
.burger-caption{z-index:3}
/* Balance the copy against the full sandwich composition on wider screens. */
@media(min-width:701px){
 .burger-stage>.burger-copy{align-self:center}
}
/* Visible neutral ring on the light guide background; retain green accent. */
.guide-intro .guide-portrait::after{background:conic-gradient(#32c977 0deg 52deg,#b9aa97 52deg 360deg)}
/* Brand-purple line icons on every cream content surface. */
.cream-section .feature svg,.cream-section .flow-icon,.cream-section .membership-icon{stroke:#63358b}
/* Larger mobile artwork with a compact gap below the copy. */
@media(max-width:700px) and (orientation:portrait){
 .burger-stage{padding-top:calc(var(--scene-space) + 32px)}
 .burger-stage .burger-art{--piece:clamp(280px,90vw,420px);margin-top:32px;height:calc(var(--piece) * 1.05)}
}
/* Match the reduced gap between adjacent cream sections. */
.pantry-scene{padding-bottom:calc(var(--scene-space) / 2)}
.daily-flow{padding-top:calc(var(--scene-space) / 2)}
/* Inset mobile portraits and their oversized rings from the screen edges. */
@media(max-width:700px){
 .guide-pair article:nth-child(odd){padding-left:clamp(16px,5vw,28px)}
 .guide-pair article:nth-child(even){padding-right:clamp(16px,5vw,28px)}
}
/* Mirror only the planning scene's photo, never its text or phone. */
.plan-scene::before{transform:scaleX(-1);transform-origin:center}
@media(max-width:700px){
 .plan-scene::before{background-position:left center}
 .plan-copy::before{background:linear-gradient(#352215e6 0%,#352215d9 82%,transparent)}
}
/* Recipe-only retouch: retain wall glow, remove two distracting bokeh dots. */
.recipes-scene::before{
 background:linear-gradient(0deg,var(--bg),#35221555 20%,#35221555 80%,var(--bg)),url('assets/recipes-background-clean.png') center/cover no-repeat;
 transform:scaleX(-1);transform-origin:center;
}
@media(max-width:700px){.recipes-scene::before{background-position:left center}}

/* Store badges precede the contact block in the closing section. */
.download .store-status + .contact-note{margin-top:36px;margin-bottom:24px}

/* Full-screen desktop photo scenes: keep neighboring cream curves outside
   the viewport when a navigation anchor lands on either scene. */
@media(min-width:1101px){
 .burger-scene,.stories-scene{
  scroll-margin-top:calc(0px - var(--nav-height) - 18px - var(--section-arc) - 2px);
 }
 .burger-scene .burger-stage,.stories-scene{
  min-height:calc(100svh + 2 * var(--section-arc) + 4px);
 }
 .burger-scene .burger-stage{align-content:center}
 .stories-scene{justify-content:center}
}
@media(min-width:1101px){
 /* The feature anchor is on its heading; leave room below the menu fade. */
 #co-umi{scroll-margin-top:64px}
 /* Photo starts behind the menu, while the recipe heading stays below it. */
 .recipes-scene{
  scroll-margin-top:calc(0px - var(--nav-height) - 18px - var(--section-arc) - 2px);
  padding-top:calc(var(--nav-height) + var(--section-arc) + 48px);
 }
}
@media(min-width:1101px){
 .download{
  scroll-margin-top:calc(0px - var(--nav-height) - 18px - var(--section-arc) - 2px);
  min-height:calc(100svh + 2 * var(--section-arc) + 4px);
  padding-top:calc(var(--nav-height) + var(--section-arc) + 48px);
 }
}

/* Mobile/tablet anchor landings: the target background fills the header,
   with the preceding decorative curve above the viewport. */
@media(max-width:1100px){
 #pokrok,#co-doma,#pruvodci,#pribeh,#recipes,#download,#chute{
  scroll-margin-top:calc(0px - var(--nav-height) - 18px - var(--section-arc) - 2px);
 }
 #pokrok,#co-doma,#pruvodci,#pribeh,#recipes,#download,
 #chute .burger-stage{
  padding-top:calc(var(--nav-height) + var(--section-arc) + 28px);
 }
 #co-umi{scroll-margin-top:28px}
}

/* Solid warm header with the shallow curved edge from the approved sketch. */
.header{background:#302014;box-shadow:none}
.header::before{content:none;backdrop-filter:none;-webkit-backdrop-filter:none}
.header::after{
 content:"";position:absolute;top:calc(100% - 1px);left:0;right:0;
 height:clamp(7px,0.6vw,12px);z-index:-1;pointer-events:none;
 background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1000 12' preserveAspectRatio='none'%3E%3Cpath fill='%23302014' d='M0 0H1000V12Q500 -10 0 12Z'/%3E%3C/svg%3E") center/100% 100% no-repeat;
 box-shadow:none;filter:none;
}


.burger-copy .eyebrow{text-transform:uppercase}
@media(min-width:701px){.burger-caption{justify-content:flex-end}}
.site-footer .footer-ai-note{max-width:850px;margin:24px auto 0;font-size:inherit;line-height:inherit;color:inherit;opacity:.8;text-wrap:pretty}
.story-detail .story-controls{display:flex;align-items:center}
.story-detail .story-controls h3{margin:0;line-height:1.2;align-self:center}
.story-detail .story-controls button{flex-shrink:0;align-self:center}
/* Lift mobile header controls together within the existing curved band. */
@media(max-width:1100px){
 .header>.brand,.header>.language,.header>.menu-toggle{translate:0 -8px}
}
@media(orientation:landscape) and (max-height:500px){
 .header>.brand,.header>.language,.header>.menu-toggle{translate:0 -4px}
}

.direction-arrow{display:inline-block;width:1em;height:1em;vertical-align:-.12em;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
