/* One continuous stage carries the original bowl from the hero to the collection. */
html,body { min-width:0; }
.hero { height:100svh; min-height:100svh; overflow:hidden; isolation:isolate; background-color:#173128; background-image:url('assets/hero-sea-palm-poster-desktop-20261030.3c30109b504d.webp'); background-size:cover; background-position:95% center; }
.hero-film { position: absolute; inset: 0; z-index: -2; opacity: 1; pointer-events: none; background:url('assets/hero-sea-palm-poster-desktop-20261030.3c30109b504d.webp') 95% center/cover no-repeat; }
.hero-film video { position:absolute; inset:0; display:block; width:100%; height:100%; object-fit:cover; object-position:95% center; filter:none; opacity:0; transition:none; }
.hero.video-ready .hero-film video { opacity:1; }
.hero-film video::-webkit-media-controls { display:none!important; }
.hero-film video::-webkit-media-controls-start-playback-button { display:none!important; }
/* Keep the product clear while giving the left-aligned title enough contrast. */
.hero-shade { position:absolute; inset:0; z-index:-1; pointer-events:none; background:linear-gradient(90deg,#1229238c 0%,#12292350 30%,#12292306 61%,transparent 80%); }
.hero::after { content:''; position:absolute; inset:0; z-index:0; pointer-events:none; opacity:.035; mix-blend-mode:soft-light; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180' viewBox='0 0 180 180'%3E%3Cfilter id='grain'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.82' numOctaves='3' stitchTiles='stitch' seed='4'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Cpath fill='%23fff' filter='url(%23grain)' d='M0 0h180v180H0z'/%3E%3C/svg%3E"); }
.hero-content h1 { text-shadow:0 2px 20px #06101270; }
.hero-content p { color:#fff7e9; text-shadow:0 1px 14px #06101299; }
.signature-reveal { height: 350svh; background: #211a16; }
.signature-stage { height:100svh; min-height:0; background:var(--stage-color,#211a16); isolation:isolate; }
.signature-stage::before { background:radial-gradient(ellipse at 50% 65%,#a77e4a29,transparent 50%); opacity:var(--glow,1); z-index:-1; }
.signature-title { top:12%; width:min(90%,800px); }
.signature-title h2 { font-size:clamp(48px,4.8vw,80px); line-height:.98; }
.signature-title h2 em { color:#c7a577; }
.signature-title p { margin:22px auto 0; font-size:clamp(15px,1.1vw,19px); line-height:1.65; color:#ede5d3bb; }
.signature-product { top:51%; width:min(40vw,660px); z-index:5; pointer-events:none; filter:drop-shadow(0 30px 28px #0c110b55); will-change:transform; }
.signature-product::after { bottom:17%; height:6%; opacity:.45; }
.signature-point { width:23%; max-width:365px; text-align:left; border-top:1px solid #d6c7ab40; padding-top:20px; }
.signature-point h3 { font-size:clamp(27px,2.15vw,38px); margin-bottom:14px; letter-spacing:-.035em; }
.signature-point p { margin:0; max-width:310px; font-size:clamp(14px,.98vw,17px); font-weight:400; line-height:1.7; color:#eee5d5cf; }
.signature-point a { display:inline-block; margin-top:8px; color:#dcc5a3; text-underline-offset:4px; }
.signature-point.point-a { left:7%; top:32%; }
.signature-point.point-b { left:7%; top:76%; }
.signature-point.point-c { left:auto; right:7%; top:32%; }
.signature-point.point-d { left:auto; right:7%; top:76%; }
.signature-ingredient { position:absolute; z-index:4; top:55%; width:clamp(150px,18vw,270px); aspect-ratio:3/2; opacity:0; pointer-events:none; will-change:transform,opacity; }
.signature-ingredient img { display:block; width:100%; height:100%; object-fit:contain; }
.signature-yogurt { left:19%; transform:translate(-50%,-50%) translateX(-50px) rotate(-7deg); filter:drop-shadow(0 14px 16px #0d1815a0) saturate(.82); }
.signature-fruit { left:81%; transform:translate(-50%,-50%) translateX(50px) rotate(6deg); filter:drop-shadow(0 14px 16px #0d1815a0) saturate(.76) brightness(.94); }
.signature-stage .categories { position:absolute; inset:0; padding:0; min-height:0; opacity:1; pointer-events:none; color:var(--ink); }
.signature-stage .categories.available { pointer-events:auto; }
.signature-stage .categories .section-head { position:absolute; top:12%; width:90%; max-width:none; left:5%; margin:0; }
.signature-stage .categories h2 { font-size:clamp(42px,4.7vw,76px); }
.signature-stage .category-grid { position:absolute; inset:0; display:block; max-width:none; }
/* Accepted reference: rectangular photo cards, cream caption bands and ring arrows.
   The existing outer card boxes still own the complete bowl-to-fan scroll path. */
.signature-stage .category-card { --label-height:clamp(64px,4.7vw,80px); --card-radius:18px; position:absolute; left:50%; top:51%; width:21.5%; height:clamp(270px,44svh,510px); border-radius:var(--card-radius); overflow:visible; background:transparent; opacity:0; transform:translate(-50%,-50%) scale(.25); transition:none; box-shadow:none; will-change:transform; }
.signature-stage .category-card::before { content:''; position:absolute; inset:0; border-radius:inherit; background:#f7efdf; box-shadow:0 14px 28px #71552b21; transition:box-shadow .35s; }
.signature-stage .category-card::after { content:none; }
.signature-stage .category-card:hover { border-radius:var(--card-radius); box-shadow:none; }
.signature-stage .category-card:is(:hover,:focus-visible)::before { box-shadow:0 20px 36px #71552b30; }
.signature-stage .category-card:focus-visible { outline:2px solid var(--brand-green,#203b30); outline-offset:6px; }
.signature-stage .category-visual { position:absolute; inset:0 0 var(--label-height); overflow:hidden; border-radius:var(--card-radius) var(--card-radius) 0 0; background:#e9dfcf; }
.signature-stage .category-label { z-index:3; bottom:0; left:20px; right:20px; height:var(--label-height); gap:10px; color:var(--brand-green,#203b30); font-size:clamp(18px,1.55vw,27px); line-height:1.12; opacity:var(--label-reveal,0); }
.signature-stage .category-label em { display:grid; place-items:center; flex:0 0 auto; width:clamp(32px,2.5vw,42px); aspect-ratio:1; border:1.5px solid currentColor; border-radius:50%; font-size:clamp(17px,1.4vw,23px); line-height:1; transition:transform .46s cubic-bezier(.22,1.65,.36,1),background .25s,color .25s; }
.signature-stage .category-card:is(:hover,:focus-visible) .category-label em { transform:translate(2px,-3px) rotate(-6deg); background:var(--brand-green,#203b30); color:#f7efdf; }
.signature-stage .category-image { background-color:#fff; background-size:contain; background-position:center; background-repeat:no-repeat; }
.signature-stage .category-card:nth-child(2) .category-image { background-image:url('assets/category-cups-studio-v3.51f4a7a7d2fa.webp'); }
.signature-stage .category-card:nth-child(3) .category-image { background-image:url('assets/category-cutlery-studio-v3.c66aa3285334.webp'); }
.signature-stage .category-card:nth-child(4) .category-image { background-image:url('assets/category-gifts-studio-v3.a5321b2adf21.webp'); }
.signature-stage .origin-card { --morph:0; aspect-ratio:auto; filter:none; z-index:5; pointer-events:inherit; }
/* The original foreground bowl keeps its descent and card-forming path.
   The new catalogue photograph appears only as the card's photo area forms. */
.signature-stage .origin-card::before { opacity:var(--morph); }
.signature-stage .origin-card .category-visual { bottom:calc(var(--label-height)*var(--morph)); border-radius:calc(var(--card-radius)*var(--morph)) calc(var(--card-radius)*var(--morph)) 0 0; background:transparent; }
.signature-stage .origin-card .category-visual::before { content:''; position:absolute; inset:0; background:#fff; opacity:var(--morph); }
.signature-stage .origin-card .category-visual::after { content:''; position:absolute; inset:0; background:#fff url('assets/category-bowls-studio-v3.04dd67e551be.webp') center/contain no-repeat; opacity:var(--category-photo,0); transition:scale .7s; }
.signature-stage .origin-card .bowl-cutout { position:absolute; inset:0; width:100%; height:100%; object-fit:contain; opacity:calc(1 - var(--category-photo,0)); filter:drop-shadow(0 15px 12px #17211f38) saturate(.9) brightness(calc(1 - var(--morph)*.06)); transition:scale .7s; }
.signature-stage .origin-card:is(:hover,:focus-visible) .bowl-cutout,.signature-stage .origin-card:is(:hover,:focus-visible) .category-visual::after { scale:1.08; }
.signature-stage .category-card:focus-visible .category-image { transform:scale(1.08); }
/* The bowl becomes the first shared breakfast photo as the scroll reveals a gallery. */
.signature-title { top:10%; }
.signature-title h2 { font-size:clamp(42px,4.4vw,70px); line-height:1.13; }
.signature-title p { max-width:670px; }
/* Fit the product between the measured copy and cue, including short laptop
   windows. Animation timing and the final gallery coordinates stay unchanged. */
.signature-stage .signature-ingredient { top:var(--bowl-center,55%); }
.signature-stage .signature-capture-card { top:var(--bowl-center,51%); width:var(--capture-width,min(22vw,320px)); height:var(--capture-height,430px); min-height:0; }
@media (min-width:801px) {
 .signature-title { --section-title-size:clamp(32px,min(4.1vw,7svh),68px); }
}
.signature-stage .share-card { margin:0; --card-radius:5px; --label-height:clamp(56px,4.2vw,70px); }
.signature-stage .share-card::before { background:#f5efe5; box-shadow:0 22px 42px #21150f28; }
.signature-stage .share-card .category-visual { background:#e2d8ca; }
.signature-stage .share-card:not(.origin-card) .category-visual { background:#e2d8ca; }
.signature-stage .share-card.origin-card .category-visual { background:transparent; }
.signature-stage .share-photo { display:block; width:100%; height:100%; object-fit:cover; object-position:center; transition:scale .65s cubic-bezier(.22,.7,.2,1); }
.signature-stage .share-card .category-label { display:flex; align-items:center; gap:8px; font-size:clamp(13px,1vw,18px); white-space:normal; }
.signature-stage .categories.available .share-card { rotate:0deg; translate:0 0; transition:rotate .5s cubic-bezier(.22,.7,.2,1),translate .5s cubic-bezier(.22,.7,.2,1); }
.signature-stage .share-card:nth-child(1) { --hover-upright:1deg; }
.signature-stage .share-card:nth-child(2) { --hover-upright:.5deg; }
.signature-stage .share-card:nth-child(3) { --hover-upright:-.5deg; }
.signature-stage .share-card:nth-child(4) { --hover-upright:-1deg; }
@media (hover:hover) and (pointer:fine) {
 .signature-stage .categories.available .share-card:hover { rotate:var(--hover-upright); translate:0 -2px; }
 .signature-stage .categories.available .share-card:hover .share-photo,
 .signature-stage .categories.available .origin-card:hover .category-visual::after { scale:1.025; }
}
.signature-stage .origin-card .category-visual::before { background:#f5efe5; }
.signature-stage .origin-card .category-visual::after { z-index:4; background:#e8dccb url('assets/share-my-bowl-morning-matched-delivery.6c7110a70ac6.webp') center/cover no-repeat; }
.signature-stage .origin-card .bowl-cutout { z-index:1; transform:scale(1.07); scale:1; transition:none; filter:drop-shadow(0 17px 16px #07110c68) saturate(.94); }
.signature-stage .origin-card:is(:hover,:focus-visible) .bowl-cutout { scale:1; }
.signature-stage .origin-card .bowl-yogurt-state,.signature-stage .origin-card .bowl-fruit-state { position:absolute; inset:0; display:block; width:100%; height:100%; object-fit:contain; pointer-events:none; }
.signature-stage .origin-card .bowl-yogurt-state { z-index:2; opacity:var(--yogurt-opacity,0); clip-path:ellipse(var(--yogurt-radius-x,1%) var(--yogurt-radius-y,1%) at 50% 55%); -webkit-mask-image:radial-gradient(ellipse var(--yogurt-radius-x,1%) var(--yogurt-radius-y,1%) at 50% 55%,#000 97%,transparent 100%); mask-image:radial-gradient(ellipse var(--yogurt-radius-x,1%) var(--yogurt-radius-y,1%) at 50% 55%,#000 97%,transparent 100%); }
.signature-stage .origin-card .bowl-fruit-state { z-index:3; opacity:var(--fruit-opacity,0); transform:scale(.97) translateY(1%); clip-path:ellipse(var(--fruit-radius-x,1%) var(--fruit-radius-y,1%) at 50% 50%); -webkit-mask-image:radial-gradient(ellipse var(--fruit-radius-x,1%) var(--fruit-radius-y,1%) at 50% 50%,#000 97%,transparent 100%); mask-image:radial-gradient(ellipse var(--fruit-radius-x,1%) var(--fruit-radius-y,1%) at 50% 50%,#000 97%,transparent 100%); filter:saturate(.88) brightness(.99); }
.signature-scroll-cue { position:absolute; z-index:6; left:50%; top:84%; display:flex; flex-direction:column; align-items:center; gap:9px; color:#f5ead8; font:600 12px/1.2 var(--font-body); letter-spacing:.08em; opacity:0; transform:translate(-50%,12px); pointer-events:none; }
.scroll-mouse { position:relative; display:block; width:27px; height:43px; border:1.5px solid currentColor; border-radius:16px; }
.scroll-wheel { position:absolute; top:8px; left:50%; width:3px; height:8px; border-radius:2px; background:currentColor; transform:translateX(-50%); animation:signature-scroll-wheel 1.25s ease-in-out infinite; }
@keyframes signature-scroll-wheel { 0%,100% { opacity:.25; transform:translate(-50%,0) } 55% { opacity:1; transform:translate(-50%,10px) } }
.signature-shutter { position:absolute; z-index:6; left:50%; top:84%; display:flex; flex-direction:column; align-items:center; gap:8px; padding:0; border:0; background:transparent; color:#f5ead8; font:600 12px/1.2 var(--font-body); letter-spacing:.08em; opacity:0; transform:translate(-50%,18px); pointer-events:none; }
.shutter-icon { display:grid; place-items:center; width:57px; height:57px; border:2px solid #f5ead8; border-radius:50%; box-shadow:0 6px 25px #0d18147a; }
.shutter-icon::after { content:''; display:block; width:43px; height:43px; border-radius:50%; background:#f5ead8; transition:transform .25s,background .25s; }
.signature-shutter.is-hinting .shutter-icon { animation:signature-shutter-hint .72s cubic-bezier(.2,.75,.22,1) both; }
@keyframes signature-shutter-hint { 0%,100%{transform:translateY(0) scale(1)} 38%{transform:translateY(-11px) scale(1.09)} 68%{transform:translateY(2px) scale(.98)} }
.signature-shutter:hover .shutter-icon::after,.signature-shutter:focus-visible .shutter-icon::after { transform:scale(.86); background:#dcb582; }
.signature-flash { position:absolute; z-index:8; inset:0; background:#fffaf1; opacity:0; pointer-events:none; }
.signature-flash.capture-flash { animation:signature-camera-flash .3s ease-out both; }
@keyframes signature-camera-flash { 0%{opacity:0} 28%{opacity:.42} 100%{opacity:0} }
.signature-capture-card { position:absolute; z-index:7; left:50%; top:51%; display:flex; flex-direction:column; width:min(22vw,320px); height:min(39vw,430px); min-height:300px; padding:10px 10px 0; background:#f5efe5; border-radius:4px; box-shadow:0 24px 62px #100a08a3; opacity:0; transform:translate(-50%,-50%) scale(.72) rotate(-5deg); pointer-events:none; will-change:transform,opacity,width,height; }
.signature-capture-card img { display:block; width:100%; min-height:0; flex:1; object-fit:cover; object-position:center; }
.signature-capture-card>span { display:flex; align-items:center; justify-content:space-between; gap:8px; min-height:var(--capture-label-height,53px); padding-inline:var(--capture-caption-inset,0px); color:#26372d; font:700 clamp(13px,1vw,18px)/1.12 var(--font-heading); letter-spacing:-.025em; }
.signature-capture-card small { flex:0 0 auto; color:#9b8065; font:600 9px/1.2 var(--font-body); letter-spacing:.08em; }
.signature-capture-card.is-popping { animation:signature-photo-pop .52s cubic-bezier(.2,.72,.22,1) both; }
.signature-capture-card.is-settling { transition:opacity .16s ease-out; }
@keyframes signature-photo-pop { 0%{opacity:0;transform:translate(-50%,-50%) scale(.52) rotate(-8deg)} 35%{opacity:1} 100%{opacity:1;transform:translate(-50%,-50%) scale(1) rotate(-3deg)} }
.review-grid { position:relative; display:block; height:330px; overflow:visible; }
.testimonials .review-card { position:absolute; top:20px; left:33.333%; width:33.333%; height:270px; min-height:270px; opacity:0; pointer-events:none; transform:translateX(calc(var(--slot,0)*98%)) translateY(32px) scale(.94); transition:transform .65s cubic-bezier(.22,.65,.28,1),opacity .5s,box-shadow .5s; }
.testimonials.in-view .review-card { opacity:0; transform:translateX(calc(var(--slot,0)*98%)) translateY(12px) scale(.94); }
.testimonials.in-view .review-card.is-visible { opacity:.78; }
.testimonials.in-view .review-card.active { opacity:1; transform:translateX(0) translateY(-10px) scale(1.03); min-height:270px; pointer-events:auto; }
.testimonials.in-view .review-card:nth-child(n) { transition-delay:0s; }
.review-controls { margin-top:6px; }
.story { min-height:660px; }
.story-content { max-width:650px; }
.story h2 { font-size:clamp(49px,5.6vw,86px); }
.story p { margin:24px 0; }
.product-grid { row-gap:45px; }
.product-title-row { display:block; }
.product-card h3 { font-size:clamp(18px,1.4vw,24px); }
.product-rating { display:block; margin-top:9px; }
.product-card .photo img { width:100%; height:100%; object-fit:cover; display:block; border-radius:inherit; }
.product-card .photo:has(img) { background-image:none; }
.product-card .photo { overflow:hidden; }
.product-card .photo img { transition:transform .75s cubic-bezier(.2,.7,.2,1),filter .75s; }
.product-card:is(:hover,:focus-visible) .photo img { transform:scale(1.055); filter:brightness(.94); }
.product-card .photo::after { content:'VIEW PRODUCT ↗'; position:absolute; bottom:18px; right:18px; padding:13px 18px; border-radius:30px; color:var(--ink); background:#fbf6edee; font-size:10px; font-weight:700; letter-spacing:.08em; opacity:0; transform:translateY(12px); transition:opacity .3s,transform .4s; }
.product-card:is(:hover,:focus-visible) .photo::after { opacity:1; transform:none; }
.product-grid.is-animated .product-card { opacity:0; transform:translateY(35px); transition:opacity .7s,transform .8s cubic-bezier(.2,.7,.2,1); transition-delay:var(--entry-delay,0s); }
.product-grid.is-animated .product-card.entered { opacity:1; transform:none; }
/* Reference: 250vh pin, 1.36 → 1 image zoom, two masked line reveals. */
.craft-story { position:relative; height:250svh; background:var(--dark); color:#f7f0e2; }
.craft-stage { position:sticky; top:0; height:100svh; overflow:hidden; isolation:isolate; }
.craft-background { position:absolute; inset:0; background:#16251e center 62%/cover no-repeat; will-change:transform; }
.craft-background.media-ready { background-image:url('assets/brand-story-kiwi-bowl-wide.bb8dad3005bf.webp'); }
.craft-shade { position:absolute; inset:0; background:linear-gradient(180deg,#10231c38 0%,#10231c75 35%,#10231c80 65%,#10231c9c 100%); }
.craft-copy { position:absolute; inset:0; display:flex; flex-direction:column; justify-content:center; align-items:center; text-align:center; padding:56px; }
.craft-kicker { font-size:12px; letter-spacing:.35em; margin:0 0 30px; color:#dfbc8c; }
.craft-copy h2 { font:italic 400 clamp(40px,6.6vw,104px)/1.04 Georgia,serif; letter-spacing:-.005em; margin:0; text-shadow:0 2px 50px #0a0a0a80; }
.craft-line-mask { display:block; overflow:hidden; padding:0 .08em .1em; }
.craft-line { display:block; will-change:transform,opacity; }
.craft-rule { width:72px; height:1px; background:#d3b182; margin:34px 0 0; }
.craft-link { display:inline-flex; align-items:center; gap:25px; margin-top:23px; font-size:11px; letter-spacing:.2em; padding:12px 0; border-bottom:1px solid #f7f0e266; transition:color .25s,border-color .25s; }
.craft-link span { transition:transform .3s; }
.craft-link:hover { color:#dfbc8c; border-color:#dfbc8c; }
.craft-link:hover span { transform:translate(3px,-3px); }
/* The preceding page masks a stationary footer, revealing it as it scrolls away. */
.page { isolation:isolate; }
.site-content { position:relative; z-index:2; background:var(--cream); box-shadow:0 22px 55px #07130e4d; }
.footer.footer-reveal { position:sticky; bottom:0; z-index:0; height:100svh; min-height:720px; display:flex; flex-direction:column; justify-content:flex-end; gap:0; padding:100px 0 30px; overflow:hidden; background:#10231c; color:#f7f0e2; }
.footer-reveal::before { content:''; position:absolute; inset:0; z-index:-1; background:linear-gradient(0deg,#10231c 2%,#10231ce0 48%,#10231c55) center 38%/cover; }
.footer-reveal.media-ready::before { background-image:linear-gradient(0deg,#10231c 2%,#10231ce0 48%,#10231c55),url('assets/official-hero.09082e758d65.webp'); }
.footer-inner { width:86%; max-width:1640px; margin:0 auto; }
.footer-columns { display:grid; grid-template-columns:1.1fr .8fr .9fr; gap:clamp(24px,4vw,80px); padding:80px 0 44px; }
.footer .footer-brand { display:inline-block; font:bold 36px/.85 Georgia,serif; letter-spacing:-.085em; opacity:1; margin:0 0 20px; }
.footer-brand span { display:block; text-align:center; font:700 10px Arial,sans-serif; letter-spacing:.34em; margin-top:12px; }
.footer p { color:#f7f0e2bd; opacity:1; margin:0 0 20px; }
.footer h4 { color:#d3b182; font-size:13px; letter-spacing:.03em; text-transform:none; margin-bottom:22px; }
.footer a { line-height:1.5; opacity:1; }
.footer-socials { display:flex; gap:10px; }
.footer-socials a { width:32px; height:32px; border:1px solid #f7f0e263; border-radius:50%; display:grid; place-items:center; margin:0; }
.footer-socials svg { width:15px; height:15px; fill:none; stroke:currentColor; stroke-width:1.6; }
.footer-newsletter h4 { margin-bottom:12px; }
.footer-newsletter form { display:flex; border:1px solid #f7f0e273; padding:6px; border-radius:40px; gap:8px; margin-top:24px; }
.footer-newsletter input[type=email] { width:100%; min-width:0; background:transparent; border:0; color:inherit; padding:10px 12px; font:13px Arial,sans-serif; }
.footer-newsletter input::placeholder { color:#f7f0e2b3; }
.footer-newsletter button { flex-shrink:0; border:0; border-radius:30px; background:#d3b182; color:#24180f; padding:12px 20px; font-size:12px; font-weight:700; }
.footer .copyright { margin:0; padding:22px 0; border-color:#f7f0e23d; font-size:12px; opacity:.8; align-items:center; gap:20px; }
.footer-legal { display:flex; gap:28px; }
.footer .copyright a { font-size:12px; margin:0; }
.footer-wordmark { width:100%; margin:18px 0 0; text-align:center; white-space:nowrap; font:700 10.7vw/.95 Georgia,serif; letter-spacing:-.065em; background:linear-gradient(#f7f0e24d,#f7f0e2); -webkit-background-clip:text; background-clip:text; color:transparent; }
@media (max-width:800px) {
 .hero { display:flex; flex-direction:column; align-items:stretch; justify-content:center; gap:28px; height:auto; min-height:100svh; padding:98px var(--page-gutter) 42px; background:#245055; }
 .hero-film { position:relative; inset:auto; z-index:0; flex:none; width:100%; aspect-ratio:3/2; height:auto; opacity:1; overflow:hidden; border-radius:8px; box-shadow:0 12px 24px #091d1a26; background-image:url('assets/hero-sea-palm-poster-mobile-20261030.50d169de312b.webp'); background-position:78% center; }
 .hero-film video { object-position:78% center; }
 .hero-content { width:100%; margin:0; }
 .hero h1 { margin:0; }
 .hero .cta { margin-top:24px; }
 .hero::before { display:none; }
 .hero-shade { background:linear-gradient(0deg,#08141245 0%,#08141212 38%,transparent 60%); }
 .signature-reveal { height:340svh; }
 .signature-title { top:11%; }
 .signature-title h2 { font-size:clamp(34px,9.8vw,64px); }
 .signature-title p { font-size:14px; margin-top:16px; }
 .signature-product { top:48%; width:min(70vw,480px); }
 .signature-point { width:40%; padding-top:12px; }
 .signature-point h3 { font-size:22px; margin-bottom:9px; }
 .signature-point p { font-size:12px; line-height:1.55; }
 .signature-point.point-a { top:30%; left:6%; }
 .signature-point.point-c { top:30%; right:6%; left:auto; }
 .signature-point.point-b { top:73%; left:6%; }
 .signature-point.point-d { top:73%; right:6%; left:auto; }
 .signature-ingredient { top:60%; width:clamp(92px,25vw,170px); }
 .signature-yogurt { left:15%; }
 .signature-fruit { left:85%; }
 .signature-shutter { top:67%; font-size:10px; }
 .signature-scroll-cue { top:67%; font-size:10px; }
 .signature-capture-card { top:48%; width:min(54vw,260px); height:min(75vw,350px); min-height:0; padding:7px 7px 0; }
 .signature-capture-card>span { min-height:var(--capture-label-height,42px); font-size:clamp(11px,2.8vw,14px); }
 .signature-capture-card small { display:none; }
 .shutter-icon { width:46px; height:46px; }
 .shutter-icon::after { width:34px; height:34px; }
 .signature-stage .share-card .category-label { font-size:clamp(11px,2.8vw,14px); left:8px; right:8px; }
 .signature-stage .share-card .category-label small { display:none; }
 .signature-stage .categories .section-head { top:12%; }
 .signature-stage .categories h2 { font-size:clamp(35px,8vw,58px); }
 .signature-stage .category-card { --label-height:52px; --card-radius:12px; width:40.5%; height:27.5svh; min-height:0; max-height:none; top:51%; }
 .signature-stage .category-label { font-size:clamp(13px,3.8vw,16px); left:10px; right:10px; bottom:0; gap:5px; white-space:nowrap; }
 .signature-stage .category-label em { width:22px; font-size:15px; border-width:1.25px; }
 .story { min-height:600px; }
 .review-grid { display:block; height:300px; overflow:visible; padding:0; scroll-snap-type:none; }
 .testimonials .review-card { width:84%; left:8%; top:15px; height:255px; min-height:255px; }
 .testimonials.in-view .review-card { transform:translateX(calc(var(--slot,0)*105%)) scale(.94); }
 .testimonials.in-view .review-card.active { min-height:255px; transform:translateX(0) scale(1); }
 .product-grid { row-gap:30px; }
 .product-card h3 { font-size:17px; }
 .product-card .photo::after { right:10px; bottom:10px; padding:10px 12px; font-size:9px; }
 .craft-copy { padding:30px 20px; }
 .craft-copy h2 { font-size:clamp(37px,8.8vw,64px); }
 .craft-background { background-position:center; }
 .craft-background.media-ready { background-image:url('assets/brand-story-kiwi-bowl-mobile.c9b97d366752.webp'); }
 .craft-kicker { font-size:10px; }
 .footer.footer-reveal { position:relative; height:auto; min-height:100svh; padding:85px 0 24px; }
 .footer-columns { grid-template-columns:1fr 1fr; gap:34px 22px; padding:0 0 35px; }
 .footer-columns>div:first-child,.footer-newsletter { grid-column:1/-1; }
 .footer .copyright { display:flex; flex-direction:column; align-items:flex-start; }
 .footer-legal { flex-wrap:wrap; gap:18px; }
 .footer-wordmark { font-size:10.7vw; margin-top:30px; }
}
@media (max-width:600px) {
 .hero-film { aspect-ratio:4/5; }
 .signature-stage .category-card { --label-height:42px; }
 .signature-stage .share-card .category-label { font-size:clamp(10px,2.7vw,13px); line-height:1.15; }
}
@media (max-width:800px) and (max-height:740px) {
 .hero-film { aspect-ratio:3/2; }
 .signature-title p { display:none; }
 .signature-point h3 { font-size:20px; }
 .signature-point p { font-size:11px; }
}
@media (min-width:601px) and (max-width:800px) and (max-height:650px) {
 .hero { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); align-items:center; gap:24px; }
 .hero-film { aspect-ratio:1; }
}
@media (max-width:360px) {
 .signature-stage .category-label { left:8px; right:8px; gap:4px; }
 .signature-stage .category-label em { width:20px; font-size:14px; }
}
@media (prefers-reduced-motion:reduce) {
 .signature-reveal { height:auto; }
 .signature-stage { height:auto; overflow:visible; padding:80px 6% 55px; }
 .signature-title { position:relative; top:auto; left:auto; width:100%; transform:none; opacity:1; }
 .signature-point { position:relative; inset:auto!important; display:inline-block; vertical-align:top; width:46%; margin:28px 1%; opacity:1; transform:none; }
 .signature-ingredient { position:relative; top:auto; left:auto; display:inline-block; vertical-align:middle; width:44%; max-width:220px; margin:0 2% 24px; opacity:1; transform:none!important; }
 .signature-scroll-cue,.signature-shutter,.signature-flash,.signature-capture-card { display:none; }
 .signature-stage .categories { position:relative; inset:auto; padding:0; opacity:1; pointer-events:auto; color:#f8f0e2; }
 .signature-stage .categories .section-head { position:relative; inset:auto; width:100%; }
 .signature-stage .category-grid { position:relative; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
 .signature-stage .category-card { position:relative; inset:auto; width:100%; height:250px; opacity:1; transform:none; }
 .signature-stage .category-card { --label-reveal:1; }
 .signature-stage .origin-card { --morph:1; --category-photo:1; margin:0; }
 .signature-stage .origin-card .bowl-cutout,.signature-stage .origin-card .category-visual::after { scale:none!important; transition:none; }
 .signature-stage .origin-card .bowl-cutout { opacity:0; }
 .signature-stage .origin-card .bowl-fruit-state { opacity:1; }
 .signature-stage .category-label em { transition:none; }
 .footer.footer-reveal { position:relative; height:auto; min-height:0; }
 .product-grid.is-animated .product-card { opacity:1; transform:none; transition:none; }
 .product-card .photo img,.product-card .photo::after { transition:none; transform:none!important; }
 .craft-story { height:100svh; }
 .craft-stage { position:relative; }
 .craft-background,.craft-line { will-change:auto; }
}

/* Locally hosted Montserrat for subtitles, reading and controls.
   Approved Chelsea Market display headings are set in heading-e.css. */
@font-face { font-family:Montserrat; src:url('assets/montserrat-regular.84f3d3275dfb.ttf') format('truetype'); font-style:normal; font-weight:400; font-display:swap; }
@font-face { font-family:Montserrat; src:url('assets/montserrat-medium.cf3c9102e47d.woff2') format('woff2'); font-style:normal; font-weight:500; font-display:swap; }
@font-face { font-family:Montserrat; src:url('assets/montserrat-semibold.cec795a2eca5.woff2') format('woff2'); font-style:normal; font-weight:600; font-display:swap; }
@font-face { font-family:Montserrat; src:url('assets/montserrat-bold.2ede5e0c613d.woff2') format('woff2'); font-style:normal; font-weight:700; font-display:swap; }
:root { --font-body:Montserrat,Arial,sans-serif; --font-heading:Montserrat,Arial,sans-serif; --button-fill:#ffbf4b; --button-hover:#ffa400; --button-ink:#232323; --button-radius:3px; font-family:var(--font-body); }
body,button,input,textarea,select,.review-card blockquote,.footer-newsletter input[type=email],.category-label em { font-family:var(--font-body); }
body { font-weight:500; }
.serif,h1,h2,h3,.section-head h2,.story h2,.products-head h2,.product-card h3,.faq h2,.footer h2,.signature-title h2,.signature-point h3,.craft-copy h2,.signature-stage .category-label,.footer-wordmark { font-family:var(--font-heading); font-weight:700; font-style:normal; letter-spacing:-.025em; }
.hero-content { max-width:720px; }
.hero h1 { font-size:clamp(54px,5.5vw,88px); line-height:1.04; font-style:normal; letter-spacing:-.035em; }
.hero p { font-size:16px; }
.nav-links { font-weight:500; letter-spacing:.06em; }
.brand img,.footer-brand img { display:block; width:200px; height:auto; filter:brightness(0) invert(1); }
/* L wordmark tryout. Use the same alpha in every existing navigation state.
   Size and position account for transparent source padding without stretching
   the selected two-line lettering or changing the original image asset. */
.brand-mark { display:block; background:currentColor; -webkit-mask:url('assets/coconut-bowls-wordmark-l-delivery.1b3b786a33ee.webp') 51.3514% 61.1111%/103.5272% auto no-repeat; mask:url('assets/coconut-bowls-wordmark-l-delivery.1b3b786a33ee.webp') 51.3514% 61.1111%/103.5272% auto no-repeat; }
.nav .brand { display:flex; align-items:center; justify-content:center; min-height:44px; }
.nav .brand .brand-mark { width:184px; height:47.7px; margin:0; }
.footer .footer-brand .brand-mark { width:220px; height:57.04px; margin:0; }
.signature-title h2 { font-size:clamp(44px,4.4vw,72px); line-height:1.04; }
.signature-point h3 { font-size:clamp(25px,1.9vw,34px); line-height:1.12; }
.section-head h2,.products-head h2,.faq h2 { font-size:clamp(38px,4vw,62px); line-height:1.08; }
.story h2 { font-size:clamp(44px,5vw,76px); line-height:1.08; }
.product-card h3 { font-size:clamp(17px,1.25vw,22px); line-height:1.25; letter-spacing:0; }
.craft-copy h2 { font-size:clamp(40px,5.3vw,84px); line-height:1.1; max-width:1250px; }
.craft-kicker { color:#f7f0e2; letter-spacing:.16em; }
.craft-rule { background:#f7f0e299; }
.footer-wordmark { font-size:10.15vw; letter-spacing:-.045em; }
.cta,.text-link,.craft-link,.review-source a,.footer-newsletter button,.product-card .photo::after { display:inline-flex; align-items:center; justify-content:center; gap:22px; min-height:50px; padding:15px 25px; border:1px solid var(--button-fill); border-radius:var(--button-radius); background:var(--button-fill); color:var(--button-ink); font:600 13px/1.35 var(--font-body); letter-spacing:.08em; text-transform:uppercase; text-decoration:none; white-space:normal; text-align:center; transition:background .25s,border-color .25s,color .25s,transform .25s; }
.cta:hover,.craft-link:hover,.footer-newsletter button:hover { background:var(--button-hover); border-color:var(--button-hover); color:var(--button-ink); transform:translateY(-2px); }
.cta.outline { border-color:#f7f0e2b3; background:transparent; color:#fff; }
.text-link,.review-source a { background:transparent; color:var(--ink); border-color:#33251980; }
.cta.outline:hover,.text-link:hover,.review-source a:hover { background:var(--button-fill); border-color:var(--button-fill); color:var(--button-ink); }
.craft-link { margin-top:25px; }
.footer-newsletter form { border-radius:var(--button-radius); padding:5px; }
.footer-newsletter button { padding:13px 18px; min-height:46px; font-size:11px; }
.product-card .photo::after { min-height:42px; padding:12px 16px; font-size:10px; }
.footer .footer-brand { margin-bottom:20px; }
@media (max-width:800px) {
 .brand img { width:155px; }
 .nav .brand .brand-mark { width:136px; height:35.27px; }
 .footer .footer-brand .brand-mark { width:200px; height:51.87px; }
 .hero h1 { font-size:clamp(36px,7.4vw,52px); line-height:1.05; }
 .hero p { font-size:14px; }
 .signature-title h2 { font-size:clamp(31px,8.4vw,56px); }
 .signature-point h3 { font-size:20px; }
 .signature-stage .categories h2 { font-size:clamp(31px,7.5vw,52px); }
 .signature-stage .category-label { font-size:clamp(13px,3.8vw,16px); letter-spacing:0; }
 .section-head h2,.products-head h2,.faq h2 { font-size:clamp(33px,8.4vw,48px); }
 .story h2 { font-size:clamp(38px,9.5vw,56px); }
 .craft-copy h2 { font-size:clamp(30px,7.8vw,58px); }
 .craft-copy { padding:30px 6%; }
 .craft-background { background-position:center; }
 .product-card h3 { font-size:16px; }
 .cta,.text-link,.craft-link,.review-source a { font-size:11px; padding:14px 20px; min-height:46px; }
 .product-card .photo::after { min-height:34px; font-size:9px; padding:10px 12px; }
}

/* A loose, hand-drawn loop echoes the organic rim of a coconut shell. */
.nav-links { gap:36px; font-size:16px; font-weight:600; letter-spacing:.055em; }
.nav-links a { position:relative; display:inline-flex; align-items:center; min-height:44px; padding:8px 2px; }
.nav-links a:hover { opacity:1; }
.nav-swoosh { position:absolute; width:calc(100% + 22px); height:20px; left:-11px; bottom:-4px; overflow:visible; pointer-events:none; color:#ffbf4b; }
.nav-swoosh path { fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; stroke-dasharray:1; stroke-dashoffset:1; transition:stroke-dashoffset .65s cubic-bezier(.2,.65,.25,1); }
.nav-links a:is(:hover,:focus-visible) .nav-swoosh path { stroke-dashoffset:0; }
.icons { gap:22px; }
.icons a { width:44px; height:44px; border-radius:50%; transition:background .25s,color .25s; }
.icons svg { width:25px; height:25px; stroke-width:1.65; }
.icons a:is(:hover,:focus-visible) { color:#ffbf4b; background:#ffffff10; }
/* Individual translate does not overwrite hover transforms or scroll scrubs. */
html.motion-ready .entrance { opacity:0; translate:0 var(--reveal-distance,26px); transition:opacity .8s ease var(--reveal-delay,0s),translate .9s cubic-bezier(.2,.7,.2,1) var(--reveal-delay,0s),background .25s,border-color .25s,color .25s,transform var(--button-duration,.25s) var(--button-ease,ease); }
html.motion-ready .entrance.entered { opacity:1; translate:0 0; }
html.motion-ready .nav .entrance { --reveal-distance:-9px; }
html.motion-ready .announcement.entrance { --reveal-distance:0px; }
html.motion-ready .footer-wordmark.entrance { --reveal-distance:45px; }
@media (max-width:800px) {
 .nav-links { gap:20px; padding:26px 6% 34px; font-size:19px; }
 .nav-links a { min-height:44px; }
 .nav-swoosh { bottom:-2px; }
 .icons { gap:0; }
 .icons svg { width:25px; height:25px; }
 .menu-toggle { min-width:44px; min-height:44px; font-size:29px; padding:0; text-align:left; }
}
@media (prefers-reduced-motion:reduce) {
 html.motion-ready .entrance { opacity:1; translate:none; transition:none; }
 .nav-swoosh path { transition:none; }
}

/* Shared editorial heading system: one statement, one warm-coloured reply. */
:root { --brand-green:#203b30; --heading-warm:#946b45; --page-gutter:clamp(24px,4vw,88px); }
.announcement { background:var(--brand-green); color:#fffaf1; }
.nav { padding-inline:var(--page-gutter); box-shadow:none; }
.nav.solid { background:var(--brand-green); color:#fffaf1; border-color:#fffaf118; box-shadow:none; backdrop-filter:none; }
.nav-links a { padding-inline:0; }
.hero { padding-inline:var(--page-gutter); }
.nav-links.open { background:var(--brand-green); }
.categories .section-head h2,.story h2,.products-head h2,.craft-copy h2,.testimonials .section-head h2 { font-size:clamp(42px,4.1vw,68px); line-height:1.06; letter-spacing:-.03em; }
.categories .section-head h2,.products-head h2,.testimonials .section-head h2 { color:var(--brand-green); }
.categories h2 em,.story h2 em,.products-head h2 em,.craft-copy h2 em,.testimonials h2 em { font-style:normal; color:var(--heading-warm); }
.story h2 em,.craft-copy h2 em { color:#d9b785; }
.categories .section-head p,.products-head p,.testimonials .section-head p { margin:18px 0 0; font-size:15px; line-height:1.65; color:#615b50; opacity:1; }
.categories .section-head p,.testimonials .section-head p { margin-inline:auto; max-width:520px; }
.signature-stage .categories .section-head { top:10%; }
.signature-stage .categories h2 { margin:0; }
.story { padding-inline:var(--page-gutter); }
.craft-copy .craft-kicker { order:0; max-width:520px; font:500 15px/1.65 var(--font-body); letter-spacing:0; margin:20px 0 0; color:#fff8e8d9; }
.craft-rule { margin-top:27px; }
.products { padding:96px var(--page-gutter) 110px; }
.products-head,.product-grid { max-width:2800px; }
.products-head { display:flex; flex-direction:column; align-items:center; gap:19px; margin-bottom:43px; text-align:center; }
.products-head h2 { margin:0; font-size:clamp(44px,4.2vw,68px); line-height:1.06; }
.products-head h2 em { display:block; margin-top:var(--section-subtitle-gap); color:var(--heading-warm); font:700 var(--section-subtitle-size)/1.2 var(--font-heading); letter-spacing:-.02em; }
.products-head .text-link { min-height:0; margin:0; padding:0; border:0; border-radius:0; background:transparent; color:var(--brand-green); font-size:12px; }
.products-head .text-link:hover,.products-head .text-link:focus-visible { border-color:var(--heading-warm); background:transparent; color:var(--heading-warm); }
.product-grid { gap:clamp(16px,1.5vw,28px); align-items:stretch; }
.product-card { display:flex; flex-direction:column; min-width:0; padding:0; border:0; border-radius:10px; overflow:hidden; background:#f7f0e5; transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .3s; }
.product-card:is(:hover,:focus-visible) { transform:translateY(-4px); box-shadow:0 14px 30px #203b3014; }
.product-card .photo { height:auto; aspect-ratio:1/1; border-radius:10px 10px 0 0; background:#e9dfce; overflow:hidden; transform:none; }
.products .product-card .photo { background-image:none; }
.product-card:hover .photo { transform:none; }
.product-card .photo img { width:100%; height:100%; display:block; object-fit:cover; border-radius:0; transition:transform .6s cubic-bezier(.2,.7,.2,1); }
.product-card .photo img.product-hover-image { position:absolute; inset:0; z-index:1; opacity:0; pointer-events:none; transition:opacity .45s ease,transform .6s cubic-bezier(.2,.7,.2,1); }
.product-card:is(:hover,:focus-visible) .photo img { transform:scale(1.025); filter:none; }
.product-card:focus-visible .photo img.product-hover-image { opacity:1; }
@media (hover:hover) and (pointer:fine) {
 .product-card:hover .photo img.product-hover-image { opacity:1; }
}
@media (prefers-reduced-motion:reduce) {
 .product-card .photo img.product-hover-image { transition:none; }
}
.product-card .photo::after { content:none; }
.product-card .stock-badge { position:absolute; top:12px; left:12px; z-index:2; padding:7px 9px; border-radius:3px; background:#f8f2e9ed; color:#514438; font:600 10px/1 var(--font-body); letter-spacing:.04em; }
.product-info { display:flex; flex:1; flex-direction:column; align-items:stretch; gap:8px; padding:20px 18px 18px; text-align:left; }
.product-card h3 { min-height:0; margin:0; color:var(--brand-green); font:500 clamp(15px,1vw,18px)/1.45 var(--font-body); letter-spacing:0; }
.product-price-row { display:flex; flex-direction:row; flex-wrap:wrap; align-items:baseline; gap:7px 10px; margin:0; color:var(--brand-green); font-size:17px; line-height:1.4; font-weight:600; font-variant-numeric:tabular-nums; }
.product-price-row del { color:#817566; font-size:12px; font-weight:500; opacity:1; }
.product-rating { display:flex; align-items:center; gap:9px; margin:1px 0 20px; color:#6e665a; font-size:12px; line-height:1.5; white-space:normal; }
.product-discount { display:inline-block; align-self:center; padding:3px 6px; border-radius:3px; background:#b2783920; color:#86552c; font:600 9px/1.25 var(--font-body); letter-spacing:.03em; white-space:nowrap; }
.product-stars { display:inline-block; background:linear-gradient(to right,#a66b30 var(--rating-fill),#d6c6af var(--rating-fill)); -webkit-background-clip:text; background-clip:text; color:transparent; font-size:15px; letter-spacing:.025em; line-height:1.1; }
.rating-count { color:#807466; }
.product-rating b { margin:0; color:#a26c3b; font-size:16px; letter-spacing:.02em; white-space:nowrap; }
.product-action { display:flex; align-items:center; justify-content:center; gap:22px; min-height:50px; margin-top:auto; padding:15px 25px; border:1px solid var(--button-fill); border-radius:var(--button-radius); background:var(--button-fill); color:var(--button-ink); font:600 13px/1.35 var(--font-body); letter-spacing:.08em; text-align:center; text-transform:uppercase; transition:transform var(--button-duration) var(--button-ease),background .25s,border-color .25s,color .25s; }
.product-action .button-arrow { font-size:17px; line-height:1; }
.product-card:focus-visible .product-action { transform:translateY(-4px) scale(1.018); background:var(--button-hover); border-color:var(--button-hover); color:var(--button-ink); }
.product-card:focus-visible .product-action .button-arrow { transform:translate(3px,-3px); }
.testimonials { padding-top:100px; padding-bottom:90px; }
.testimonials .section-head { max-width:900px; margin-bottom:64px; }
@media (max-width:800px) {
 :root { --page-gutter:20px; }
 .nav-links { padding-inline:var(--page-gutter); }
 .categories .section-head h2,.story h2,.products-head h2,.craft-copy h2,.testimonials .section-head h2 { font-size:clamp(31px,8.2vw,48px); line-height:1.08; }
 .signature-stage .categories .section-head { top:max(88px,10svh); }
 .categories .section-head p { max-width:290px; margin-top:12px; font-size:12px; line-height:1.5; }
 .products { padding-top:74px; padding-bottom:80px; }
 .products-head { gap:16px; margin-bottom:31px; }
 .products-head h2 { font-size:clamp(36px,7.8vw,52px); }
 .products-head h2 em { font-size:inherit; }
 .product-grid { gap:18px; }
 .product-card { padding:0; }
 .product-info { padding:15px 14px 14px; }
 .product-card h3 { font-size:15px; }
 .product-price-row { font-size:17px; }
 .product-rating { gap:6px; font-size:11px; }
 .product-rating b { font-size:14px; }
 .product-action { min-height:46px; padding:14px 20px; font-size:11px; }
 .craft-copy .craft-kicker { font-size:13px; margin-top:16px; }
 .testimonials { padding-top:75px; padding-bottom:65px; }
 .testimonials .section-head { margin-bottom:40px; }
}
@media (max-width:580px) {
 .product-grid { grid-template-columns:1fr; max-width:440px; gap:18px; }
 .product-card .photo { aspect-ratio:1/0.86; }
 .product-card h3 { font-size:18px; }
 .product-rating { font-size:12px; }
}
@media (max-width:800px) and (max-height:740px) {
 .signature-stage .categories h2 { font-size:28px; }
 .categories .section-head p { font-size:11px; line-height:1.45; margin-top:10px; }
}
/* Native vector cursors stay attached to the true pointer; no trailing layer. */
@media (hover:hover) and (pointer:fine) {
 html,body,body * { cursor:url('assets/coconut-cursor.58907d5b2b39.svg') 3 2,auto; }
 a,a *,button,button *,summary,[role=button] { cursor:url('assets/coconut-cursor-link.7510ae73d793.svg') 3 2,pointer; }
 input,textarea,[contenteditable=true] { cursor:text; }
 :disabled,:disabled * { cursor:not-allowed; }
}
@media (prefers-reduced-motion:reduce) {
 .product-card .photo::after { transform:translateX(-50%)!important; }
}

/* One spring across filled, outlined, editorial and newsletter buttons.
   Transform is separate from the individual translate used for entrances. */
:root { --button-duration:.46s; --button-ease:cubic-bezier(.22,1.65,.36,1); }
:is(.cta,.text-link,.craft-link,.footer-newsletter button,.product-action) {
 transform:translateY(0) scale(1);
 transition:transform var(--button-duration) var(--button-ease),background .25s,border-color .25s,color .25s;
}
.button-arrow { display:inline-block; flex-shrink:0; transform:translate(0,0); transition:transform var(--button-duration) var(--button-ease); }
.footer-newsletter button { gap:12px; }
:is(.cta,.text-link,.craft-link,.footer-newsletter button):focus-visible { transform:translateY(-4px) scale(1.018); }
:is(.cta,.text-link,.craft-link,.footer-newsletter button):focus-visible .button-arrow { transform:translate(3px,-3px); }
.review-arrow,.review-dot,.menu-toggle { transition:transform var(--button-duration) var(--button-ease),color .25s,background .25s; }
.review-arrow:focus-visible { transform:translateY(-3px) scale(1.1); }
.product-card .photo::after { scale:.96; transition:opacity .25s,transform var(--button-duration) var(--button-ease),scale var(--button-duration) var(--button-ease); }
.product-card:focus-visible .photo::after { transform:translate(-50%,-4px); scale:1.018; }
@media (hover:hover) and (pointer:fine) {
 :is(.cta,.text-link,.craft-link,.footer-newsletter button):hover { transform:translateY(-4px) scale(1.018); }
 :is(.cta,.text-link,.craft-link,.footer-newsletter button):hover .button-arrow { transform:translate(3px,-3px); }
 .product-card:hover .product-action { transform:translateY(-4px) scale(1.018); background:var(--button-hover); border-color:var(--button-hover); color:var(--button-ink); }
 .product-card:hover .product-action .button-arrow { transform:translate(3px,-3px); }
 .product-card:hover .photo::after { transform:translate(-50%,-4px); scale:1.018; }
 .review-arrow:hover { transform:translateY(-3px) scale(1.1); }
 .review-dot:hover { transform:scale(1.5); }
 .menu-toggle:hover { transform:scale(1.08); }
}
:is(.cta,.text-link,.craft-link,.footer-newsletter button):active { transform:translateY(0) scale(.97); transition-duration:.12s; }
:is(.cta,.text-link,.craft-link,.footer-newsletter button):active .button-arrow { transform:translate(1px,-1px); transition-duration:.12s; }
.product-card:active .product-action { transform:translateY(0) scale(.97); transition-duration:.12s; }
.product-card:active .product-action .button-arrow { transform:translate(1px,-1px); transition-duration:.12s; }
.product-card:active .photo::after { transform:translate(-50%,0); scale:.97; transition-duration:.12s; }
:is(.review-arrow,.review-dot,.menu-toggle):active { transform:scale(.9); transition-duration:.12s; }
@media (prefers-reduced-motion:reduce) {
 :is(.cta,.text-link,.craft-link,.footer-newsletter button,.product-action),.button-arrow,.review-arrow,.review-dot,.menu-toggle { transform:none!important; transition:none!important; }
 .product-card .photo::after { transform:translateX(-50%)!important; scale:1!important; transition:none!important; }
 .review-dot.active { transform:scale(1.25)!important; }
}

/* Product transformation story: material -> handwork -> everyday use. */
.story {
 min-height:0;
 display:grid;
 grid-template-columns:minmax(240px,.72fr) minmax(0,2.28fr);
 gap:clamp(34px,4.2vw,76px);
 align-items:end;
 padding:clamp(86px,8vw,132px) var(--page-gutter) clamp(74px,7vw,116px);
 background:var(--cream);
 color:var(--brand-green);
}
.story-heading { align-self:start; position:sticky; top:120px; }
.story .story-heading h2 { margin:0; color:var(--brand-green); font-size:clamp(42px,4.1vw,68px); line-height:1.03; letter-spacing:-.035em; }
.story .story-heading h2 em { color:var(--heading-warm); }
.story-heading>p { max-width:430px; margin:25px 0 0; color:#615b50; font-size:15px; line-height:1.72; }
.story-steps { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:clamp(15px,1.8vw,30px); }
.story-step { min-width:0; }
.story-image { aspect-ratio:4/5; overflow:hidden; background:#d7caba; }
.story-image img { width:100%; height:100%; display:block; object-fit:cover; transition:transform .8s cubic-bezier(.2,.7,.2,1),filter .5s; }
.story-step:first-child .story-image img { object-position:42% center; }
.story-step:nth-child(2) .story-image img { object-position:54% center; }
.story-step:last-child .story-image img { object-position:65% center; }
.story-step:hover .story-image img { transform:scale(1.04); filter:brightness(.96); }
.story-step-copy { display:grid; grid-template-columns:auto 1fr; gap:15px; padding:19px 0 22px; border-bottom:1px solid #9c846a78; }
.story-step-copy>span { color:#be7b2b; font:700 18px/1.1 var(--font-body); }
.story-step h3 { margin:0; color:var(--brand-green); font:700 13px/1.2 var(--font-body); letter-spacing:.12em; text-transform:uppercase; }
.story-step p { margin:9px 0 0; color:#615b50; font-size:12px; line-height:1.55; }
.story-link { grid-column:2; justify-self:center; display:inline-flex; align-items:center; justify-content:center; gap:22px; min-height:50px; margin-top:2px; padding:15px 25px; border:1px solid var(--button-fill); border-radius:var(--button-radius); background:var(--button-fill); color:var(--button-ink); font:600 13px/1.35 var(--font-body); letter-spacing:.08em; text-transform:uppercase; transition:transform var(--button-duration) var(--button-ease),background .25s; }
.story-link:hover,.story-link:focus-visible { transform:translateY(-4px) scale(1.018); background:var(--button-hover); }
.story-link:hover .button-arrow,.story-link:focus-visible .button-arrow { transform:translate(3px,-3px); }
.craft-shade { background:linear-gradient(180deg,#10231c5c 0%,#10231c93 35%,#10231c9b 65%,#10231ca8 100%); }
.craft-copy .craft-kicker { max-width:640px; }

@media (max-width:1050px) {
 .story { grid-template-columns:1fr; align-items:start; }
 .story-heading { position:static; max-width:720px; text-align:center; margin:0 auto; }
 .story-heading>p { margin-inline:auto; }
 .story-link { grid-column:1; }
}
@media (max-width:800px) {
 .story { display:block; padding:72px var(--page-gutter) 76px; overflow:hidden; }
 .story-heading { text-align:left; }
 .story .story-heading h2 { font-size:clamp(34px,9.4vw,48px); }
 .story-heading>p { margin:18px 0 0; font-size:13px; }
 .story-steps { display:flex; gap:14px; margin-top:36px; padding-right:12vw; overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:none; }
 .story-steps::-webkit-scrollbar { display:none; }
 .story-step { flex:0 0 78vw; scroll-snap-align:start; }
 .story-image { aspect-ratio:4/4.6; }
 .story-step-copy { padding-top:16px; }
 .story-link { margin:28px 0 0; }
 .craft-background { background-position:center; }
 .craft-copy { padding-inline:var(--page-gutter); }
}
@media (prefers-reduced-motion:reduce) {
 .story-image img,.story-link { transition:none; }
}

/* Approved editorial split: image left, product-transformation story right. */
.story {
 grid-template-columns:repeat(2,minmax(0,1fr));
 gap:0;
 align-items:stretch;
 padding:0;
 min-height:650px;
 background:var(--cream);
}
.story-media { min-width:0; min-height:650px; overflow:hidden; border-radius:8px; background:#5e3b27; }
.story-media img { width:100%; height:100%; display:block; object-fit:cover; object-position:center; transition:transform 1s cubic-bezier(.2,.7,.2,1); }
.story:hover .story-media img { transform:scale(1.025); }
.story .story-heading { position:static; align-self:center; box-sizing:border-box; width:100%; max-width:none; margin:0; padding:clamp(58px,5vw,112px) clamp(42px,5vw,112px); text-align:left; }
.story .story-heading h2 { font-size:clamp(44px,4.3vw,84px); }
.story .story-heading>p { max-width:680px; margin:26px 0 0; font-size:clamp(15px,1vw,19px); }
.story-values { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); margin-top:42px; border-top:1px solid #9c846a78; border-bottom:1px solid #9c846a78; }
.story-values>span { display:flex; flex-direction:column; gap:8px; min-width:0; padding:17px 15px 18px; color:var(--brand-green); font:700 10px/1.35 var(--font-body); letter-spacing:.08em; text-transform:uppercase; text-align:center; }
.story-values>span+span { border-left:1px solid #9c846a78; }
.story-values b { color:#b9772b; font:700 12px/1 var(--font-body); }
.story .story-link { grid-column:auto; justify-self:auto; margin-top:31px; }

/* Wide desktop: use the available canvas instead of a fixed, narrow copy island. */
@media (min-width:1600px) {
 .story .story-heading { padding-inline:clamp(74px,5vw,126px); }
 .story-values { margin-top:clamp(42px,3vw,64px); }
 .testimonials { padding-inline:clamp(32px,2.2vw,54px); }
 .testimonials .section-head { margin-bottom:clamp(48px,3.4vw,76px); }
 .review-stage { max-width:2100px; }
 .review-grid { height:clamp(330px,20vw,390px); }
 .testimonials .review-card { top:20px; height:clamp(278px,16vw,340px); min-height:0; }
 .review-card blockquote { font-size:clamp(15px,.92vw,20px); }
 .review-card h3 { font-size:clamp(14px,.78vw,18px); }
 .review-card cite { font-size:clamp(12px,.67vw,15px); }
}

@media (max-width:1050px) {
 .story { grid-template-columns:1fr 1fr; }
 .story .story-heading { text-align:left; margin:0; padding:58px 38px; }
 .story-values { grid-template-columns:1fr; }
 .story-values>span { flex-direction:row; justify-content:flex-start; text-align:left; }
 .story-values>span+span { border-left:0; border-top:1px solid #9c846a55; }
}
@media (max-width:800px) {
 .story { display:flex; flex-direction:column; padding:0; }
 .story-media { min-height:0; aspect-ratio:4/3.15; }
 .story .story-heading { padding:52px var(--page-gutter) 64px; }
 .story .story-heading h2 { font-size:clamp(36px,10vw,50px); }
 .story-values { margin-top:30px; }
 .story .story-link { margin-top:28px; }
}
@media (prefers-reduced-motion:reduce) {
 .story-media img { transition:none; }
}

/* One shared warm canvas across all light homepage sections. */
.products,.testimonials,.faq { background:var(--cream); }

/* Give the carousel's neighboring reviews enough contrast against the beige page. */
.testimonials { padding-inline:clamp(24px,3vw,56px); }
.review-stage { width:100%; max-width:2100px; }
.testimonials .review-card { background:#f8f3e9; border:1px solid #d8c8b2; box-shadow:0 12px 28px #51432f1c; }
.testimonials.in-view .review-card.is-visible { opacity:1; }
.testimonials.in-view .review-card.active { background:#fffaf1; border-color:#c9ae8a; box-shadow:0 22px 48px #51432f30; }
@media (max-width:800px) {
 .testimonials { padding-inline:0; }
 .review-stage { max-width:none; }
}

/* The navigation belongs to the continuous product stage, not a second bar. */
.nav.journey-transparent { background:transparent; border-color:transparent; box-shadow:none; backdrop-filter:none; }
.nav.journey-light { color:var(--brand-green); }
.nav .brand img { transition:filter .3s; }
.nav.journey-light .brand img { filter:brightness(0); }
.nav.journey-light .nav-swoosh { color:var(--heading-warm); }
.nav.journey-light .icons a:is(:hover,:focus-visible) { color:#946b45; background:#203b300c; }
.nav.journey-light .nav-links.open { color:#fffaf1; }
/* Masked title lines, rim-like rules, then the quieter supporting copy.
   All progress is driven by the existing scroll scrub; no looping text motion. */
.signature-line-mask { display:block; overflow:hidden; padding-bottom:.08em; margin-bottom:-.08em; }
.signature-heading-line,.signature-copy-line { display:block; opacity:var(--line-reveal,1); transform:translateY(calc((1 - var(--line-reveal,1))*110%)); }
.signature-copy-line { transform:translateY(calc((1 - var(--line-reveal,1))*80%)); }
.signature-point { border-top:0; }
.signature-point::before { content:''; position:absolute; top:0; left:0; width:100%; height:1px; background:#d6c7ab65; transform:scaleX(var(--rule-reveal,1)); transform-origin:left; }
.signature-point:is(.point-c,.point-d)::before { transform-origin:right; }
.signature-point h3 { overflow:hidden; padding-bottom:.08em; margin-bottom:calc(14px - .08em); }
.signature-point h3>span { display:block; opacity:var(--heading-reveal,1); transform:translateY(calc((1 - var(--heading-reveal,1))*110%)); }
.signature-point p { opacity:var(--body-reveal,1); transform:translateY(calc((1 - var(--body-reveal,1))*12px)); }
@media (max-width:800px) {
 .signature-point h3 { margin-bottom:calc(9px - .08em); }
}
@media (prefers-reduced-motion:reduce) {
 .signature-heading-line,.signature-copy-line,.signature-point h3>span,.signature-point p { opacity:1; transform:none; }
 .signature-point::before { transform:none; }
}

/* One main-title / subtitle hierarchy; the existing animated masks stay intact. */
:root { --section-title-size:clamp(42px,4.1vw,68px); --section-title-leading:1.08; --section-title-tracking:-.035em; --section-subtitle-size:clamp(20px,.6em,40px); --section-subtitle-gap:clamp(8px,.8vw,14px); --heading-accent-light:#e8c794; }
:is(.signature-title,.categories .section-head,.story .story-heading,.process-heading,.products-head,.craft-copy,.testimonials .section-head) h2 {
 font-family:var(--font-heading); font-weight:700; font-style:normal;
 font-size:var(--section-title-size); line-height:var(--section-title-leading); letter-spacing:var(--section-title-tracking);
 margin:0;
}
:is(.signature-title,.categories .section-head,.story .story-heading,.process-heading,.products-head,.craft-copy,.testimonials .section-head) h2>br { display:none; }
:is(.signature-title,.categories .section-head,.story .story-heading,.process-heading,.products-head,.craft-copy,.testimonials .section-head) h2 em {
 display:block; font-family:inherit; font-weight:700; font-style:normal;
 font-size:var(--section-subtitle-size); line-height:1.2; letter-spacing:-.02em;
 margin-top:var(--section-subtitle-gap); color:var(--heading-warm);
}
:is(.signature-title,.signature-stage .categories .section-head,.story.process-story .process-heading,.products-head,.craft-copy,.testimonials .section-head)>.section-description {
 max-width:520px; margin:18px auto 0; font:500 15px/1.65 var(--font-body); letter-spacing:0; opacity:1;
}
:is(.process-heading,.products-head,.testimonials .section-head)>.section-description { color:#615b50; }
:is(.signature-title,.craft-copy) h2 { color:#f7f0e2; }
:is(.signature-stage .signature-title,.craft-stage .craft-copy) h2 em { color:var(--heading-accent-light); }
.hero h1 { font-family:var(--font-heading); font-weight:700; font-style:normal; letter-spacing:var(--section-title-tracking); }
.hero h1 em { display:block; margin-top:var(--section-subtitle-gap); color:var(--heading-accent-light); font:700 clamp(25px,.52em,44px)/1.2 var(--font-heading); font-style:normal; letter-spacing:-.02em; }
@media (max-width:800px) {
 :root { --section-title-size:clamp(28px,8vw,48px); }
 :is(.signature-title,.signature-stage .categories .section-head,.story.process-story .process-heading,.products-head,.craft-copy,.testimonials .section-head)>.section-description { max-width:350px; margin-top:14px; font-size:13px; }
}

/* The supplied solid arrow is the single source for every direction.
   Rotation lives on its mask, leaving all existing wrapper springs unchanged. */
.arrow-icon { --arrow-rotation:45deg; display:inline-block; flex-shrink:0; width:1em; height:1em; line-height:1; vertical-align:-.16em; }
.arrow-icon::before { content:''; display:block; width:100%; height:100%; background:currentColor; -webkit-mask:url('assets/arrow-up.e99a2785e539.png') center/contain no-repeat; mask:url('assets/arrow-up.e99a2785e539.png') center/contain no-repeat; transform:rotate(var(--arrow-rotation)); }
.arrow-icon.arrow-right { --arrow-rotation:90deg; }
.arrow-icon.arrow-left { --arrow-rotation:-90deg; }
.arrow-icon.arrow-up { --arrow-rotation:0deg; }
.button-arrow.arrow-icon { font-size:20px; }
.category-label .arrow-icon { display:block; }
.review-arrow .arrow-icon { display:block; }
.footer a>.arrow-icon { font-size:16px; }

/* Picture-book timeline: native vertical scrolling follows the illustrated thread. */
.story.process-story { display:block; min-height:0; height:calc(100svh + var(--process-scroll-distance, 760px)); padding:0; background:var(--cream); color:var(--brand-green); }
.process-pin { position:sticky; top:0; display:flex; align-items:flex-start; width:100%; height:100svh; overflow:hidden; }
.process-panorama { --process-content-gap:clamp(28px,3.5svh,42px); --process-gap:clamp(72px,6.5vw,112px); --process-rise:clamp(24px,4svh,42px); --process-subtitle-size:clamp(25px,2.46vw,40px); --process-card-size:min(36vw,54svh,calc(100svh - 84px - var(--section-title-size) - var(--process-subtitle-size) - var(--section-subtitle-gap) - var(--process-content-gap) - var(--process-rise) - var(--process-rise) - 134px)); position:relative; display:flex; flex-direction:column; justify-content:center; width:100%; height:calc(100svh - 84px); margin:84px auto 0; overflow:hidden; background:var(--cream); }
.process-heading { position:relative; z-index:3; flex:none; width:calc(100% - 2 * var(--page-gutter)); margin-inline:auto; padding-top:0; text-align:center; pointer-events:none; }
.story.process-story .process-heading h2 { margin:0; color:var(--brand-green); font:700 var(--section-title-size)/var(--section-title-leading) var(--font-heading); letter-spacing:var(--section-title-tracking); }
.process-window { position:relative; flex:none; width:100%; height:calc(var(--process-card-size) + var(--process-rise) + var(--process-rise) + 64px); min-width:0; min-height:0; margin-top:var(--process-content-gap); overflow:hidden; outline-offset:-5px; }
.process-window:focus-visible { outline:3px solid #a88460; }
.process-photos { position:relative; display:flex; align-items:flex-start; justify-content:space-between; gap:var(--process-gap); width:max-content; min-width:100%; height:100%; padding:calc(var(--process-rise) + 32px) var(--page-gutter) 0; will-change:transform; }
.process-path { position:absolute; z-index:0; top:0; left:0; width:100%; height:100%; overflow:visible; pointer-events:none; }
.process-path path { fill:none; stroke-width:4; stroke-linecap:round; stroke-dasharray:2 14; }
.process-path-base { stroke:#bd9369; }
.process-path-active { stroke:var(--brand-green); }
.process-progress-clip { transition:none; }
.process-panel { position:relative; z-index:2; flex:none; width:var(--process-card-size); margin:0; transform:translateY(var(--process-rise)); }
.process-panel:nth-of-type(even) { transform:translateY(calc(-1 * var(--process-rise))); }
.process-photo { display:block; width:100%; aspect-ratio:1; height:auto; border-radius:18px; object-fit:cover; object-position:center; box-shadow:none; transition:filter .35s; }
.process-panel:not(.active) .process-photo { filter:saturate(.91); }
.process-panel figcaption { display:none; }
.process-current { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }

/* Preserve the three-position carousel. A 3:2 photo window gives portrait
   customer photographs enough room for both the person and the product. */
.review-stage { container-type:inline-size; }
.review-grid { height:calc(22.222cqw + 204px); }
.testimonials .review-card { height:calc(22.222cqw + 164px); min-height:0; padding:0; display:flex; flex-direction:column; justify-content:stretch; align-items:stretch; overflow:hidden; text-align:center; border-radius:10px; }
.testimonials.in-view .review-card.active { min-height:0; }
.review-media { flex:0 0 auto; aspect-ratio:3/2; min-height:0; overflow:hidden; background:#d3c3ab; }
.review-media img { width:100%; height:100%; display:block; object-fit:cover; object-position:center 58%; filter:saturate(var(--review-saturation,.88)) brightness(var(--review-brightness,.98)) contrast(.97); }
.review-card:nth-child(1) .review-media img { object-position:center 65%; }
.review-card:nth-child(2) .review-media img { object-position:center 62%; --review-saturation:.8; --review-brightness:.96; }
.review-card:nth-child(3) .review-media img { object-position:center 58%; --review-saturation:.76; --review-brightness:.96; }
.review-card:nth-child(4) .review-media img { object-position:center 68%; --review-saturation:.93; }
.review-card:nth-child(5) .review-media img { --review-saturation:.84; --review-brightness:.97; }
.review-copy { flex:1; min-height:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:clamp(7px,.7vw,12px); padding:clamp(17px,1.65vw,30px); }
.review-stars { color:#a46b32; font-size:clamp(15px,1vw,19px); line-height:1; }
.review-card blockquote { max-width:480px; font-size:clamp(13px,.9vw,17px); line-height:1.45; }
.review-card cite { margin:0; font-size:clamp(10px,.68vw,13px); color:var(--brand-green); }
@media (max-width:800px) {
 .story.process-story { height:auto; padding:32px 0 16px; }
 .process-pin { position:relative; height:auto; overflow:visible; }
 .process-panorama { --process-card-size:min(84vw,430px); --process-gap:clamp(42px,8vw,72px); --process-rise:16px; width:100%; height:auto; min-height:0; margin:0; }
 .process-heading { position:relative; top:auto; left:auto; right:auto; width:calc(100% - 2 * var(--page-gutter)); margin:0 auto; padding-top:0; }
 .story.process-story .process-heading h2 { font-size:clamp(32px,7.8vw,48px); }
 .process-window { flex:none; height:calc(var(--process-card-size) + 2 * var(--process-rise) + 44px); margin-top:8px; touch-action:pan-y; }
 .process-photos { align-items:flex-start; padding:calc(var(--process-rise) + 36px) calc(100vw - var(--process-card-size)) 0 var(--page-gutter); }
 .process-photos { transition:transform .65s cubic-bezier(.2,.7,.2,1); }
 .process-progress-clip { transition:width .65s cubic-bezier(.2,.7,.2,1); }
 .process-panel { transform:translateY(var(--process-rise)); }
 .process-panel:nth-of-type(even) { transform:translateY(calc(-1 * var(--process-rise))); }
 .products { padding-top:44px; }
 .review-grid { height:calc(56cqw + 205px); }
 .testimonials .review-card { top:20px; height:calc(56cqw + 160px); min-height:0; }
 .testimonials.in-view .review-card.active { min-height:0; }
 .review-card blockquote { font-size:14px; }
 .review-card cite { font-size:11px; }
}
@media (max-width:480px) {
 .story.process-story { padding:28px 0 16px; }
 .process-panorama { --process-card-size:84vw; --process-gap:42px; }
 .story.process-story .process-heading h2 { font-size:clamp(31px,8vw,38px); }
 .process-photo { border-radius:14px; }
}
@media (prefers-reduced-motion:reduce) {
 .story.process-story { height:auto; padding:42px 0; }
 .process-pin { position:relative; height:auto; overflow:visible; }
 .process-photos,.process-progress-clip,.process-photo { transition:none!important; }
}