:root {
    --milk: #fff9f2;
    --cream: #f4eadc;
    --cream-2: #eadac5;
    --ink: #25221f;
    --muted: #776f67;
    --line: rgba(37,34,31,.14);
    --pink: #e98a91;
    --matcha: #91a977;
    --butter: #f2cb72;
    --chocolate: #5b4037;
    --serif: "Cormorant Garamond", Georgia, serif;
    --sans: "Manrope", Inter, system-ui, sans-serif;
    --radius: 28px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--milk); }
body { margin: 0; color: var(--ink); background: var(--milk); font-family: var(--sans); font-size: 16px; line-height: 1.6; overflow-x: hidden; }
a { color: inherit; text-decoration: none; }
button, input { font: inherit; }
button { color: inherit; }
::selection { background: var(--ink); color: var(--milk); }

.site-shell { min-height: 100vh; }
main { overflow: clip; }
.topbar { position: fixed; top: 0; left: 0; right: 0; z-index: 100; height: 82px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; padding: 0 clamp(22px,4vw,68px); transition: background .35s, border-color .35s, backdrop-filter .35s; border-bottom: 1px solid transparent; }
.topbar.scrolled { background: rgba(255,249,242,.82); backdrop-filter: blur(18px); border-bottom-color: var(--line); }
.brand { font-size: 1.3rem; font-weight: 800; letter-spacing: -.06em; width: fit-content; }
.brand span { color: var(--pink); }
.desktop-nav { display: flex; gap: 34px; font-size: .76rem; font-weight: 700; letter-spacing: .06em; }
.desktop-nav a, .nav-search { position: relative; }
.desktop-nav a::after { content:""; position:absolute; height:1px; background:var(--ink); left:0; right:100%; bottom:-5px; transition:right .25s; }
.desktop-nav a:hover::after, .desktop-nav a.active::after { right:0; }
.nav-actions { display:flex; align-items:center; justify-content:flex-end; gap:20px; font-size:.76rem; font-weight:700; }
kbd { border: 1px solid var(--line); border-radius: 6px; padding: 2px 6px; font-family: var(--sans); font-size: .68rem; background: rgba(255,255,255,.5); }
.menu-button { display:none; border:0; background:none; width:34px; height:34px; padding:7px; cursor:pointer; }
.menu-button span { display:block; width:100%; height:1px; background:var(--ink); margin:7px 0; }
.mobile-menu { position:fixed; inset:0; z-index:90; background:var(--ink); color:var(--milk); padding:120px 26px 40px; display:flex; flex-direction:column; gap:12px; transform:translateY(-102%); transition:transform .45s cubic-bezier(.76,0,.24,1); }
.mobile-menu.open { transform:none; }
.mobile-menu a { font-family:var(--serif); font-size:clamp(2.7rem,10vw,5rem); line-height:1; font-style:italic; border-bottom:1px solid rgba(255,255,255,.18); padding:14px 0; }

.eyebrow { font-size:.68rem; font-weight:800; letter-spacing:.18em; text-transform:uppercase; }
.section-pad { padding: clamp(90px,10vw,160px) clamp(22px,6vw,96px); }
.section-pad-top { padding: 35px clamp(22px,6vw,96px) 130px; }
.section-heading h2, .page-hero h1, .hero-copy h1, .baking-teaser h2, .search-cta span, .cake-detail-hero h1, .recipe-hero h1 { font-family:var(--serif); font-weight:500; letter-spacing:-.055em; line-height:.92; margin:0; }
em { font-weight:400; }
.split-heading { display:grid; grid-template-columns:minmax(0,1.4fr) minmax(260px,.6fr); align-items:end; gap:60px; margin-bottom:70px; }
.split-heading h2, .row-heading h2, .center-heading h2 { font-size:clamp(3.2rem,6vw,6.8rem); margin-top:20px; }
.split-heading > p { max-width:480px; color:var(--muted); font-size:1rem; }
.center-heading { text-align:center; max-width:900px; margin:0 auto 70px; }
.row-heading { display:flex; justify-content:space-between; align-items:end; gap:40px; margin-bottom:70px; }
.circle-link { width:118px; aspect-ratio:1; border:1px solid var(--ink); border-radius:50%; display:grid; place-items:center; text-align:center; font-size:.68rem; font-weight:800; letter-spacing:.08em; transition:.3s; }
.circle-link:hover { background:var(--ink); color:var(--milk); transform:rotate(-8deg); }

/* Hero */
.hero-section { min-height:100svh; position:relative; display:grid; grid-template-columns:minmax(0,1fr) minmax(460px,.9fr); align-items:center; gap:5vw; padding:130px clamp(22px,6vw,96px) 70px; }
.hero-section::before { content:""; position:absolute; width:45vw; height:45vw; border-radius:50%; background:#f2e4d3; filter:blur(0); right:-12vw; top:-12vw; z-index:0; }
.hero-copy { position:relative; z-index:2; max-width:850px; }
.hero-kicker { display:flex; align-items:center; gap:12px; font-size:.67rem; font-weight:800; letter-spacing:.18em; margin-bottom:34px; }
.hero-kicker span { width:34px; height:1px; background:var(--ink); }
.hero-copy h1 { font-size:clamp(4.2rem,7.5vw,9.3rem); max-width:1000px; }
.hero-copy h1 em { color:var(--pink); }
.hero-lead { max-width:610px; color:#625b55; font-size:clamp(1rem,1.3vw,1.15rem); margin:35px 0 30px; }
.hero-actions { display:flex; gap:25px; align-items:center; flex-wrap:wrap; }
.button { display:inline-flex; align-items:center; gap:28px; min-height:54px; padding:0 22px; border-radius:999px; font-size:.74rem; font-weight:800; letter-spacing:.05em; transition:.25s; border:1px solid transparent; }
.button span { font-size:1rem; }
.button-dark { color:var(--milk); background:var(--ink); }
.button-dark:hover { transform:translateY(-3px); box-shadow:0 13px 30px rgba(37,34,31,.18); }
.button-light { color:var(--ink); background:var(--milk); }
.button-light:hover { transform:translateY(-3px); }
.text-link { font-size:.75rem; font-weight:800; border-bottom:1px solid var(--ink); padding-bottom:3px; }
.hero-micro { display:flex; gap:32px; margin-top:58px; }
.hero-micro div { display:flex; flex-direction:column; padding-right:30px; border-right:1px solid var(--line); }
.hero-micro div:last-child { border:0; }
.hero-micro strong { font-family:var(--serif); font-size:1.5rem; line-height:1; }
.hero-micro span { font-size:.64rem; color:var(--muted); text-transform:uppercase; letter-spacing:.09em; margin-top:5px; }
.hero-stage { min-height:620px; position:relative; z-index:1; display:grid; place-items:center; }
.hero-orbit { position:absolute; font-size:.56rem; letter-spacing:.22em; font-weight:800; color:#746b63; animation:float 5s ease-in-out infinite; }
.orbit-1 { top:20%; left:5%; transform:rotate(-12deg); }
.orbit-2 { bottom:16%; right:3%; transform:rotate(9deg); animation-delay:-2s; }
.hero-label { position:absolute; display:flex; gap:9px; align-items:flex-start; font-size:.6rem; line-height:1.3; text-transform:uppercase; letter-spacing:.06em; }
.hero-label b { width:25px; height:25px; border-radius:50%; border:1px solid var(--ink); display:grid; place-items:center; font-size:.52rem; }
.label-a { top:27%; right:0; }
.label-b { bottom:31%; left:0; }
.label-c { bottom:17%; right:8%; }
.scroll-hint { position:absolute; bottom:24px; left:50%; transform:translateX(-50%); font-size:.56rem; letter-spacing:.18em; font-weight:800; display:flex; align-items:center; gap:10px; }
.scroll-hint span { width:4px; height:4px; background:var(--ink); border-radius:50%; animation:pulse 1.5s infinite; }

/* Cake visual */
.cake-visual { width:100%; aspect-ratio:1.15; position:relative; display:grid; place-items:center; perspective:900px; }
.cake-visual .art-shadow { position:absolute; width:58%; height:13%; background:rgba(80,54,39,.14); filter:blur(16px); border-radius:50%; bottom:20%; transform:rotate(-4deg); }
.art-main { width:72%; height:62%; position:relative; transform:rotate(-7deg) translateY(-2%); transition:transform .5s cubic-bezier(.2,.7,.2,1); }
.cake-card:hover .art-main { transform:rotate(-3deg) translateY(-6%) scale(1.04); }
.piece { position:absolute; display:block; }
.art-highlight { position:absolute; width:34%; height:8%; border-radius:50%; background:rgba(255,255,255,.5); filter:blur(10px); left:20%; top:20%; transform:rotate(-12deg); }
.hero-art { width:min(40vw,610px); z-index:2; filter:drop-shadow(0 26px 28px rgba(75,46,34,.18)); animation:heroFloat 5s ease-in-out infinite; }
/* layer cake */
.cake-visual.layer .piece, .cake-visual.pandan .piece { left:9%; width:82%; height:14%; border-radius:48% 48% 18% 18% / 80% 80% 28% 28%; box-shadow:inset 0 -7px 10px rgba(80,35,35,.08); }
.cake-visual.layer .piece-1 { top:11%; background:#fff1e7; border:10px solid #f3d9cf; height:27%; }
.cake-visual.layer .piece-2 { top:31%; background:#f7d6a8; }
.cake-visual.layer .piece-3 { top:43%; background:#fff7eb; }
.cake-visual.layer .piece-4 { top:55%; background:var(--accent); }
.cake-visual.layer .piece-5 { top:67%; background:#f5ce9a; }
.cake-visual.layer .piece-6 { width:16%; height:16%; left:26%; top:1%; background:#da5967; border-radius:50% 60% 48% 55%; box-shadow:80px 20px 0 #e46470, 145px 2px 0 #d65464; transform:rotate(12deg); }
.cake-visual.pandan .piece-1 { top:18%; background:#f0dd8d; }
.cake-visual.pandan .piece-2 { top:31%; background:#8eb780; }
.cake-visual.pandan .piece-3 { top:44%; background:#efd889; }
.cake-visual.pandan .piece-4 { top:57%; background:#86ab72; }
.cake-visual.pandan .piece-5 { top:70%; background:#f1da8c; }
.cake-visual.pandan .piece-6 { top:8%; left:30%; width:42%; height:12%; border-radius:50%; background:#93bb80; }
/* croissant */
.cake-visual.croissant .art-main { width:78%; height:56%; }
.cake-visual.croissant .piece { top:25%; width:27%; height:44%; border-radius:48% 52% 52% 48%; background:linear-gradient(110deg,#d89b4e,#f0c06c 55%,#b97636); box-shadow:inset -9px -8px 12px rgba(108,57,22,.18), inset 6px 5px 8px rgba(255,242,181,.45); transform:rotate(var(--r,0deg)); }
.cake-visual.croissant .piece-1{left:2%;--r:-28deg}.cake-visual.croissant .piece-2{left:18%;top:16%;--r:-15deg}.cake-visual.croissant .piece-3{left:35%;top:12%;--r:0deg}.cake-visual.croissant .piece-4{left:52%;top:16%;--r:15deg}.cake-visual.croissant .piece-5{left:68%;--r:28deg}.cake-visual.croissant .piece-6{width:17%;height:20%;left:42%;top:28%;border-radius:50%;background:#7e552e;box-shadow:inset 0 0 0 5px #d89d52}
/* tiramisu / honeycomb */
.cake-visual.tiramisu .piece, .cake-visual.honeycomb .piece, .cake-visual.cheesecake .piece { left:12%; width:76%; height:17%; border-radius:10px; transform:skewY(-3deg); }
.cake-visual.tiramisu .piece-1{top:14%;background:#5e4338;height:8%}.cake-visual.tiramisu .piece-2{top:23%;background:#f3ead7}.cake-visual.tiramisu .piece-3{top:39%;background:#aa7e5d}.cake-visual.tiramisu .piece-4{top:54%;background:#f3ead7}.cake-visual.tiramisu .piece-5{top:69%;background:#9e7355}.cake-visual.tiramisu .piece-6{display:none}
.cake-visual.honeycomb .piece-1,.cake-visual.honeycomb .piece-2,.cake-visual.honeycomb .piece-3,.cake-visual.honeycomb .piece-4,.cake-visual.honeycomb .piece-5{top:18%;height:58%;background:linear-gradient(135deg,#c88745,#e6ad62);box-shadow:inset 0 -15px 25px rgba(85,45,17,.15)}
.cake-visual.honeycomb .piece-2{width:8%;height:8%;left:27%;top:32%;border-radius:50%;background:#8e5a2e;box-shadow:55px 17px 0 #8e5a2e,105px -7px 0 #8e5a2e,20px 65px 0 #8e5a2e,87px 71px 0 #8e5a2e}.cake-visual.honeycomb .piece-3,.cake-visual.honeycomb .piece-4,.cake-visual.honeycomb .piece-5,.cake-visual.honeycomb .piece-6{display:none}
.cake-visual.cheesecake .piece-1{top:18%;height:50%;background:linear-gradient(#8f563d 0 9%,#f5d9a0 11% 100%);border-radius:48% 48% 8px 8px}.cake-visual.cheesecake .piece-2{display:block;top:58%;height:13%;background:#c48c52}.cake-visual.cheesecake .piece-3,.cake-visual.cheesecake .piece-4,.cake-visual.cheesecake .piece-5,.cake-visual.cheesecake .piece-6{display:none}
/* breads */
.cake-visual.baguette .piece-1,.cake-visual.bread .piece-1 { width:86%; height:39%; left:7%; top:26%; border-radius:52% 52% 40% 40% / 75% 75% 45% 45%; background:linear-gradient(140deg,#e1ae66,#b97538); box-shadow:inset 0 -14px 18px rgba(93,49,22,.16); }
.cake-visual.baguette .piece-2,.cake-visual.bread .piece-2,.cake-visual.baguette .piece-3,.cake-visual.bread .piece-3,.cake-visual.baguette .piece-4,.cake-visual.bread .piece-4 { width:4%; height:24%; background:#f6d79f; top:30%; transform:rotate(55deg); border-radius:99px; }
.cake-visual.baguette .piece-2,.cake-visual.bread .piece-2{left:28%}.cake-visual.baguette .piece-3,.cake-visual.bread .piece-3{left:47%}.cake-visual.baguette .piece-4,.cake-visual.bread .piece-4{left:66%}.cake-visual.baguette .piece-5,.cake-visual.bread .piece-5,.cake-visual.baguette .piece-6,.cake-visual.bread .piece-6{display:none}
/* mochi/macaron */
.cake-visual.mochi .piece,.cake-visual.macaron .piece { width:34%; aspect-ratio:1.1; border-radius:50% 50% 45% 45%; background:color-mix(in srgb,var(--accent) 65%,#fff); box-shadow:inset -10px -12px 16px rgba(79,48,54,.08); top:34%; }
.cake-visual.mochi .piece-1,.cake-visual.macaron .piece-1{left:10%;transform:rotate(-8deg)}.cake-visual.mochi .piece-2,.cake-visual.macaron .piece-2{left:34%;top:22%;}.cake-visual.mochi .piece-3,.cake-visual.macaron .piece-3{left:57%;transform:rotate(8deg)}.cake-visual.mochi .piece-4,.cake-visual.mochi .piece-5,.cake-visual.mochi .piece-6,.cake-visual.macaron .piece-4,.cake-visual.macaron .piece-5,.cake-visual.macaron .piece-6{display:none}
.cake-visual.macaron .piece{height:21%;aspect-ratio:auto;border-radius:50%;border-bottom:8px solid #fff3dd}
/* savory/tart/rice */
.cake-visual.savory .piece-1,.cake-visual.ricecake .piece-1,.cake-visual.tart .piece-1,.cake-visual.pancake .piece-1 { width:76%; height:42%; left:12%; top:28%; border-radius:50%; background:linear-gradient(145deg,#f0c865,#c98f3f); box-shadow:inset 0 -12px 18px rgba(90,56,23,.13); }
.cake-visual.savory .piece-2,.cake-visual.ricecake .piece-2,.cake-visual.tart .piece-2,.cake-visual.pancake .piece-2 { width:46%; height:18%; left:27%; top:35%; border-radius:50%; background:#efdf9a; }
.cake-visual.savory .piece-3,.cake-visual.ricecake .piece-3 { width:9%; height:12%; left:45%; top:27%; border-radius:50%; background:#d65d46; box-shadow:55px 22px 0 #d65d46,-43px 28px 0 #d65d46; }
.cake-visual.tart .piece-2 { background:#e4b345; height:31%; top:31%; }
.cake-visual.pancake .piece-1{height:18%;top:30%;box-shadow:0 18px 0 #d6a45e,0 36px 0 #c8934e}.cake-visual.pancake .piece-2{top:44%;height:15%;background:#8e4f3b}.cake-visual.savory .piece-4,.cake-visual.savory .piece-5,.cake-visual.savory .piece-6,.cake-visual.ricecake .piece-4,.cake-visual.ricecake .piece-5,.cake-visual.ricecake .piece-6,.cake-visual.tart .piece-3,.cake-visual.tart .piece-4,.cake-visual.tart .piece-5,.cake-visual.tart .piece-6,.cake-visual.pancake .piece-3,.cake-visual.pancake .piece-4,.cake-visual.pancake .piece-5,.cake-visual.pancake .piece-6{display:none}
/* misc */
.cake-visual.sponge .piece-1,.cake-visual.canele .piece-1,.cake-visual.mooncake .piece-1,.cake-visual.tet .piece-1,.cake-visual.chung .piece-1,.cake-visual.eclair .piece-1 { left:18%; top:18%; width:64%; height:55%; background:var(--accent); border-radius:50% 50% 14px 14px; box-shadow:inset 0 -18px 24px rgba(85,48,22,.12); }
.cake-visual.sponge .piece-1{background:#edcf8f}.cake-visual.canele .piece-1{width:45%;left:27%;border-radius:30% 30% 16% 16%;background:linear-gradient(90deg,#633b2d,#a05e3e,#583226);clip-path:polygon(15% 0,85% 0,100% 100%,0 100%)}
.cake-visual.mooncake .piece-1{width:56%;height:56%;left:22%;border-radius:50%;background:#b87548;box-shadow:inset 0 0 0 9px #a86942,inset 0 0 0 13px #c88d5c}.cake-visual.mooncake .piece-2{left:39%;top:35%;width:22%;height:22%;border:2px solid #e0b17b;border-radius:50%}
.cake-visual.tet .piece-1{width:44%;height:62%;left:28%;border-radius:40% / 12%;background:linear-gradient(90deg,#587951,#83a174,#4f704a)}
.cake-visual.chung .piece-1{width:58%;height:58%;left:21%;border-radius:12px;background:linear-gradient(145deg,#64815b,#3f6047);transform:rotate(5deg)}
.cake-visual.eclair .piece-1{left:8%;top:32%;width:84%;height:28%;border-radius:999px;background:linear-gradient(#7a4938 0 30%,#ca9360 32% 100%)}
.cake-visual.sponge .piece-2,.cake-visual.canele .piece-2,.cake-visual.mooncake .piece-3,.cake-visual.tet .piece-2,.cake-visual.chung .piece-2,.cake-visual.eclair .piece-2{display:none}.cake-visual.sponge .piece-3,.cake-visual.canele .piece-3,.cake-visual.mooncake .piece-4,.cake-visual.tet .piece-3,.cake-visual.chung .piece-3,.cake-visual.eclair .piece-3{display:none}.cake-visual.sponge .piece-4,.cake-visual.canele .piece-4,.cake-visual.mooncake .piece-5,.cake-visual.tet .piece-4,.cake-visual.chung .piece-4,.cake-visual.eclair .piece-4,.cake-visual.sponge .piece-5,.cake-visual.canele .piece-5,.cake-visual.mooncake .piece-6,.cake-visual.tet .piece-5,.cake-visual.chung .piece-5,.cake-visual.eclair .piece-5,.cake-visual.sponge .piece-6,.cake-visual.canele .piece-6,.cake-visual.tet .piece-6,.cake-visual.chung .piece-6,.cake-visual.eclair .piece-6{display:none}

/* Anatomy home */
.home-anatomy { background:var(--ink); color:var(--milk); }
.home-anatomy .eyebrow { color:#c9bcae; }
.home-anatomy .split-heading > p { color:#b9afa7; }
.anatomy-showcase { display:grid; grid-template-columns:1fr .75fr; min-height:130vh; gap:8vw; }
.anatomy-sticky { position:relative; }
.exploded-cake { position:sticky; top:16vh; height:68vh; display:flex; flex-direction:column; align-items:center; justify-content:center; perspective:900px; }
.exploded-layer { width:min(520px,85%); height:68px; border-radius:50%; margin:-9px 0; position:relative; transform:rotateX(55deg); box-shadow:0 28px 30px rgba(0,0,0,.25); transition:.3s; }
.exploded-layer span { position:absolute; left:105%; top:45%; font-size:.52rem; white-space:nowrap; letter-spacing:.12em; text-transform:uppercase; color:#b9afa7; }
.exploded-layer.top { background:#f7dfe0; width:74%; box-shadow:inset 0 0 0 12px #fff4eb,0 28px 30px rgba(0,0,0,.22); margin-bottom:27px; }
.exploded-layer.top::before,.exploded-layer.top::after { content:""; position:absolute; width:46px; height:38px; background:#d55766; border-radius:50%; left:32%; top:-20px; box-shadow:110px 14px 0 #df6874; }
.exploded-layer.cream { background:#fff3df; margin-bottom:22px; }
.exploded-layer.sponge { background:#e7b977; margin-bottom:20px; }
.exploded-layer.jam { background:#ae4458; height:36px; margin-bottom:22px; }
.exploded-layer.sponge.two { margin-bottom:8px; }
.exploded-plate { width:70%; height:34px; border-radius:50%; background:#d7cec3; transform:rotateX(65deg); margin-top:18px; opacity:.4; }
.anatomy-notes { padding-top:10vh; }
.anatomy-notes article { min-height:48vh; display:grid; align-content:center; border-top:1px solid rgba(255,255,255,.15); }
.anatomy-notes article > span { color:#9c8d81; font-size:.65rem; letter-spacing:.16em; }
.anatomy-notes h3 { font-family:var(--serif); font-size:clamp(2.6rem,4vw,4.5rem); font-weight:500; margin:10px 0; }
.anatomy-notes p { color:#b9afa7; max-width:520px; }

/* worlds */
.worlds-section { background:#f2e8db; }
.world-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:16px; max-width:1450px; margin:auto; }
.world-card { min-height:440px; border-radius:var(--radius); padding:35px; display:flex; justify-content:space-between; align-items:flex-end; position:relative; overflow:hidden; isolation:isolate; transition:transform .35s; }
.world-card:hover { transform:translateY(-6px); }
.world-card::before,.world-card::after { content:""; position:absolute; border-radius:50%; z-index:-1; transition:.6s cubic-bezier(.2,.7,.2,1); }
.world-card:hover::before { transform:scale(1.15) rotate(8deg); }
.world-number { position:absolute; top:32px; left:35px; font-family:var(--serif); font-size:1.3rem; }
.world-card small { font-size:.58rem; letter-spacing:.15em; font-weight:800; }
.world-card h3 { font-family:var(--serif); font-size:clamp(3.5rem,5vw,6rem); line-height:.78; letter-spacing:-.06em; font-weight:500; margin:18px 0 0; }
.world-card > b { width:48px; height:48px; border:1px solid currentColor; border-radius:50%; display:grid; place-items:center; font-size:1.2rem; }
.bread-world { background:#d9b47b; }.bread-world::before{width:380px;height:150px;background:#b9834f;right:-40px;top:80px;border-radius:999px;transform:rotate(-12deg)}
.sweet-world { background:#e7afb1; }.sweet-world::before{width:300px;height:300px;background:#f5d9cb;right:-40px;top:-30px}.sweet-world::after{width:130px;height:130px;background:#b95564;right:70px;top:55px}
.vietnam-world { background:#9eaf83; }.vietnam-world::before{width:300px;height:400px;background:#617a55;right:30px;top:-60px;border-radius:45% 55% 65% 35%}
.pastry-world { background:#714d42; color:#fff8ed; }.pastry-world::before{width:340px;height:180px;background:#c99351;right:-30px;top:70px;border-radius:45% 45% 50% 50%;transform:rotate(18deg)}

/* cards */
.featured-section { background:var(--milk); }
.featured-grid,.explore-grid,.related-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:46px 22px; }
.cake-card { display:block; min-width:0; }
.cake-card-visual { min-height:390px; background:color-mix(in srgb,var(--accent) 14%,#f5ebde); border-radius:22px; display:grid; place-items:center; position:relative; overflow:hidden; }
.cake-card-visual .cake-visual { width:78%; z-index:1; }
.cake-card-action { position:absolute; top:18px; right:18px; background:var(--ink); color:var(--milk); font-size:.55rem; letter-spacing:.1em; padding:11px 13px; border-radius:999px; transform:translateY(-60px); transition:.3s; z-index:2; }
.cake-card:hover .cake-card-action { transform:none; }
.cake-card-copy { padding:18px 4px 0; }
.cake-card-copy .eyebrow { color:var(--muted); font-size:.56rem; }
.cake-card-copy h3 { font-family:var(--serif); font-size:2.25rem; font-weight:600; letter-spacing:-.035em; margin:5px 0 5px; }
.cake-card-copy p { color:var(--muted); font-size:.82rem; margin:0; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.tag-row { display:flex; gap:7px; flex-wrap:wrap; margin-top:13px; }
.tag-row span { font-size:.56rem; border:1px solid var(--line); border-radius:999px; padding:5px 8px; color:#625b55; }

/* Baking teaser */
.baking-teaser { background:#5d784f; color:var(--milk); min-height:720px; display:grid; grid-template-columns:1.1fr .9fr; gap:5vw; align-items:center; position:relative; overflow:hidden; }
.baking-teaser-copy { position:relative; z-index:2; max-width:760px; }
.baking-teaser h2 { font-size:clamp(3.5rem,6vw,7rem); margin:20px 0 30px; }
.baking-teaser p { max-width:600px; color:#e0e7d8; margin-bottom:28px; }
.teaser-blob { position:absolute; border-radius:50%; background:#78956a; opacity:.65; }
.blob-a { width:420px;height:420px;left:-160px;bottom:-200px }.blob-b{width:250px;height:250px;right:25%;top:-130px;background:#9db28f}
.ingredient-orbit { min-height:500px; position:relative; display:grid; place-items:center; }
.formula-card { width:290px; aspect-ratio:.82; background:var(--milk); color:var(--ink); border-radius:22px; padding:34px; transform:rotate(7deg); box-shadow:0 35px 60px rgba(27,48,19,.2); display:flex; flex-direction:column; justify-content:space-between; }
.formula-card small { font-size:.6rem; letter-spacing:.18em; font-weight:800; }.formula-card strong{font-family:var(--serif);font-size:2.8rem;line-height:.95}.formula-card em{font-family:var(--serif);font-size:2rem;color:var(--matcha)}
.ingredient-pill { position:absolute; border:1px solid rgba(255,255,255,.7); border-radius:999px; padding:10px 15px; font-size:.58rem; letter-spacing:.13em; font-weight:800; animation:float 5s ease-in-out infinite; }.p1{top:8%;left:4%}.p2{right:2%;top:28%;animation-delay:-1s}.p3{left:4%;bottom:16%;animation-delay:-2s}.p4{right:10%;bottom:4%;animation-delay:-3s}
.search-cta { background:#e9b1b4; text-align:center; padding-top:100px;padding-bottom:100px; }
.search-cta p { font-size:.75rem; font-weight:700; }
.giant-search-link { display:flex; justify-content:center; align-items:center; gap:35px; margin-top:15px; }
.giant-search-link span { font-size:clamp(3.4rem,8vw,9rem); border-bottom:2px solid var(--ink); }
.giant-search-link b { width:80px; height:80px; border-radius:50%; border:1px solid var(--ink); display:grid; place-items:center; font-size:2rem; transition:.25s; }
.giant-search-link:hover b { background:var(--ink);color:#fff;transform:rotate(-20deg) }

/* page heroes */
.page-hero { min-height:70vh; padding:160px clamp(22px,6vw,96px) 80px; display:flex; flex-direction:column; justify-content:flex-end; position:relative; }
.page-hero h1 { font-size:clamp(4.5rem,9vw,11rem); max-width:1200px; margin:18px 0 25px; }
.page-hero p { max-width:650px; color:var(--muted); font-size:1.05rem; }
.compact-hero { min-height:60vh; border-bottom:1px solid var(--line); }
.compact-hero::after { content:"INDEX"; position:absolute; right:6vw; bottom:30px; font-family:var(--serif); font-size:clamp(7rem,18vw,17rem); line-height:.7; color:#f0e4d6; z-index:-1; }

/* Explore */
.explore-shell { max-width:1700px; margin:auto; }
.explore-toolbar { display:grid; gap:18px; }
.mega-search { border-bottom:1px solid var(--ink); display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:15px; min-height:78px; }
.mega-search > span { font-family:var(--serif); font-size:2.6rem; transform:rotate(-15deg); }
.mega-search input { border:0; outline:0; background:transparent; font-family:var(--serif); font-size:clamp(1.7rem,3vw,3rem); letter-spacing:-.03em; color:var(--ink); }
.mega-search input::placeholder{color:#a69d93}.filter-group{display:flex;gap:8px;flex-wrap:wrap;padding:6px 0 12px}.filter-chip{border:1px solid var(--line);background:transparent;border-radius:999px;padding:9px 13px;font-size:.65rem;font-weight:700;cursor:pointer;transition:.2s}.filter-chip:hover,.filter-chip.active{background:var(--ink);color:var(--milk);border-color:var(--ink)}
.explore-meta { display:flex; justify-content:space-between; color:var(--muted); font-size:.67rem; letter-spacing:.08em; text-transform:uppercase; margin:40px 0 25px; }
.explore-grid { grid-template-columns:repeat(4,1fr); }
.explore-grid .cake-card-visual { min-height:300px; }
.explore-grid .cake-card-copy h3 { font-size:1.85rem; }
.empty-state { padding:120px 0;text-align:center}.empty-cookie{font-size:6rem}.empty-state h2{font-family:var(--serif);font-size:3rem;margin:0}.empty-state p{color:var(--muted)}

/* detail */
.cake-detail { background:var(--milk); }
.cake-detail-hero { min-height:100svh; display:grid; grid-template-columns:1fr 1fr; padding:120px clamp(22px,6vw,96px) 70px; gap:5vw; align-items:center; }
.detail-copy { max-width:720px; }
.back-link { display:block; width:fit-content; font-size:.62rem; letter-spacing:.14em; font-weight:800; margin-bottom:65px; border-bottom:1px solid var(--ink); }
.detail-copy h1 { font-size:clamp(5rem,9vw,10rem); color:var(--cake-accent); }
.detail-copy h2 { font-family:var(--serif); font-size:clamp(1.6rem,2.5vw,2.6rem); font-weight:500; font-style:italic; margin:4px 0 26px; }
.detail-copy > p { max-width:570px;color:var(--muted);font-size:1rem}.detail-facts{display:grid;grid-template-columns:repeat(3,1fr);gap:15px;border-top:1px solid var(--line);margin-top:45px;padding-top:22px}.detail-facts div{display:flex;flex-direction:column}.detail-facts small{font-size:.55rem;letter-spacing:.14em;color:var(--muted);font-weight:800}.detail-facts strong{font-family:var(--serif);font-size:1.25rem;margin-top:3px}
.detail-art-wrap { background:color-mix(in srgb,var(--cake-accent) 18%,#f3e8da); border-radius:40px; min-height:72vh; display:grid; place-items:center; position:relative; overflow:hidden; }.detail-art-wrap .hero-art{width:80%}.detail-art-index{position:absolute;top:30px;left:32px;font-family:var(--serif);font-size:1.4rem}.detail-flavors{position:absolute;bottom:28px;right:28px;display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}.detail-flavors span{font-size:.55rem;letter-spacing:.08em;text-transform:uppercase;border:1px solid rgba(37,34,31,.22);padding:7px 10px;border-radius:999px;background:rgba(255,255,255,.28);backdrop-filter:blur(6px)}
.story-band { padding:120px clamp(22px,10vw,170px); background:var(--ink); color:var(--milk); text-align:center; }.story-band .eyebrow{color:#a99d93}.story-band blockquote{font-family:var(--serif);font-size:clamp(2.7rem,5vw,5.6rem);line-height:1.03;letter-spacing:-.035em;max-width:1200px;margin:38px auto 65px;font-weight:400}.story-line{display:flex;justify-content:center;align-items:center;gap:18px;font-size:.58rem;letter-spacing:.13em;text-transform:uppercase;color:#a99d93}.story-line i{width:80px;height:1px;background:#675f59}
.detail-anatomy { background:#f2e7d8; }.cake-layer-inspector{display:grid;grid-template-columns:1fr 1fr;gap:9vw;align-items:center}.layer-visual{min-height:650px;display:flex;flex-direction:column;align-items:center;justify-content:center;perspective:900px}.inspection-layer{width:min(520px,85%);height:96px;border-radius:50%;background:color-mix(in srgb,var(--cake-accent) 45%,#f3d6a6);transform:rotateX(58deg) translateY(calc(var(--i) * -12px));margin:-15px 0;box-shadow:0 32px 36px rgba(63,39,24,.13),inset 0 -9px 18px rgba(76,38,17,.08);position:relative}.inspection-layer span{position:absolute;right:-35px;top:45%;font-size:.55rem;font-weight:800}.layer-notes article{display:grid;grid-template-columns:50px 1fr;gap:22px;padding:26px 0;border-top:1px solid var(--line)}.layer-notes b{font-size:.6rem;letter-spacing:.15em}.layer-notes h3{font-family:var(--serif);font-size:2rem;margin:0 0 5px}.layer-notes p{margin:0;color:var(--muted)}
.texture-section{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:10vw;background:color-mix(in srgb,var(--cake-accent) 20%,#fff9f2)}.texture-copy h2{font-family:var(--serif);font-size:clamp(4rem,7vw,7rem);line-height:.88;font-weight:500;letter-spacing:-.05em;margin:16px 0 25px}.texture-copy p{max-width:530px;color:var(--muted)}.texture-panel{background:rgba(255,255,255,.45);border:1px solid rgba(37,34,31,.12);border-radius:26px;padding:15px 34px}.texture-row{display:flex;justify-content:space-between;align-items:center;padding:21px 0;border-bottom:1px solid var(--line);font-size:.78rem;font-weight:700}.texture-row:last-child{border:0}.texture-dots{display:flex;gap:9px}.texture-dots i{width:14px;height:14px;border:1px solid var(--ink);border-radius:50%}.texture-dots i.active{background:var(--cake-accent);border-color:var(--cake-accent)}
.recipe-preview{display:grid;grid-template-columns:.8fr 1.2fr;gap:8vw;align-items:center;background:var(--milk)}.recipe-preview-art{border-radius:26px;background:color-mix(in srgb,var(--cake-accent) 16%,#f3e8da);padding:40px}.recipe-preview-copy h2{font-family:var(--serif);font-size:clamp(4rem,7vw,7.7rem);line-height:.88;font-weight:500;letter-spacing:-.055em;margin:16px 0 25px}.recipe-preview-copy p{color:var(--muted);margin-bottom:28px}.related-grid{grid-template-columns:repeat(3,1fr)}

/* recipe */
.recipe-hero{min-height:76vh;padding:140px clamp(22px,7vw,110px) 80px;background:color-mix(in srgb,var(--cake-accent) 19%,#f6ecdf);display:grid;grid-template-columns:1.2fr .8fr;gap:40px;align-items:center}.recipe-hero h1{font-size:clamp(4.5rem,8vw,9rem);margin:20px 0 30px}.recipe-hero .cake-photo{max-width:560px}.recipe-stat-row{display:flex;gap:25px;flex-wrap:wrap;font-size:.68rem;font-weight:800;letter-spacing:.08em}.recipe-workspace{display:grid;grid-template-columns:360px 1fr;gap:9vw;align-items:start}.ingredient-checklist{position:sticky;top:120px}.ingredient-checklist h2{font-family:var(--serif);font-size:3.7rem;margin:8px 0 24px}.ingredient-item{display:grid;grid-template-columns:22px 72px 1fr;align-items:center;gap:10px;padding:13px 0;border-top:1px solid var(--line);cursor:pointer;transition:.2s}.ingredient-item input{display:none}.custom-check{width:18px;height:18px;border:1px solid var(--ink);border-radius:50%;position:relative}.ingredient-item.checked .custom-check::after{content:"";position:absolute;inset:4px;border-radius:50%;background:var(--cake-accent)}.ingredient-item.checked b,.ingredient-item.checked em{opacity:.45;text-decoration:line-through}.ingredient-item b{font-size:.72rem}.ingredient-item em{font-style:normal;font-size:.78rem}.ingredient-progress{height:3px;background:#e5ddd3;margin-top:20px}.ingredient-progress span{display:block;height:100%;background:var(--cake-accent);transition:.3s}.ingredient-checklist>small{font-size:.58rem;color:var(--muted);letter-spacing:.08em}.recipe-steps{max-width:900px}.recipe-step{display:grid;grid-template-columns:90px 1fr;gap:40px;padding:45px 0 80px;border-top:1px solid var(--line)}.step-number{font-family:var(--serif);font-size:3rem;color:var(--cake-accent)}.step-body h2{font-family:var(--serif);font-size:clamp(3rem,5vw,5rem);font-weight:500;letter-spacing:-.04em;margin:10px 0 15px}.step-body>p{max-width:650px;color:var(--muted);font-size:1rem}.mini-timer{margin-top:30px;border:1px solid var(--line);border-radius:20px;padding:18px 20px;display:flex;align-items:center;gap:12px;max-width:460px}.mini-timer div{display:flex;flex-direction:column;margin-right:auto}.mini-timer small{font-size:.5rem;letter-spacing:.15em}.mini-timer strong{font-family:var(--serif);font-size:2rem;line-height:1}.mini-timer button{border:0;border-radius:999px;background:var(--ink);color:var(--milk);padding:9px 14px;font-size:.55rem;font-weight:800;cursor:pointer}.mini-timer button.reset{background:transparent;color:var(--ink);border:1px solid var(--line)}.recipe-finish{padding:70px;border-radius:28px;background:var(--ink);color:var(--milk);text-align:center}.recipe-finish>span{font-size:2.2rem}.recipe-finish h2{font-family:var(--serif);font-size:4rem;margin:10px 0}.recipe-finish p{color:#bfb4aa;max-width:520px;margin:0 auto 25px}.recipe-finish a{font-size:.65rem;letter-spacing:.12em;border-bottom:1px solid #fff}

/* Vietnam */
.vietnam-hero{background:#6b815c;color:var(--milk)}.vietnam-hero p{color:#dce6d6}.vietnam-hero::after{content:"VIỆT";position:absolute;right:5vw;top:120px;font-family:var(--serif);font-size:16vw;line-height:1;color:rgba(255,255,255,.06)}.vietnam-map-section{display:grid;grid-template-columns:.9fr 1.1fr;gap:7vw;background:#f0e5d5}.vietnam-map-wrap{position:sticky;top:100px;height:780px;align-self:start}.vietnam-map{height:100%;width:100%;filter:drop-shadow(0 25px 25px rgba(55,70,44,.12))}.vietnam-map path{fill:#7d936d;stroke:#536649;stroke-width:2}.map-pin{fill:#f3c869;stroke:#fff4df;stroke-width:4}.map-label{position:absolute;display:flex;flex-direction:column;background:rgba(255,249,242,.82);backdrop-filter:blur(10px);border:1px solid var(--line);padding:12px 14px;border-radius:10px}.map-label small{font-size:.5rem;letter-spacing:.15em;font-weight:800}.map-label strong{font-family:var(--serif);font-size:1rem}.map-north{top:13%;right:2%}.map-central{top:46%;left:0}.map-south{bottom:9%;right:0}.region-block{padding:45px 0;border-top:1px solid var(--line)}.region-head{display:flex;gap:20px;align-items:flex-start}.region-head>span{font-size:.58rem;font-weight:800;letter-spacing:.15em}.region-head small{font-size:.55rem;letter-spacing:.16em;font-weight:800}.region-head h2{font-family:var(--serif);font-size:4.4rem;line-height:.9;font-weight:500;margin:6px 0}.region-block>p{color:var(--muted);max-width:620px;margin:18px 0 26px}.region-cakes{display:flex;flex-direction:column}.region-cakes a{display:flex;justify-content:space-between;align-items:center;padding:12px 0;border-top:1px dashed rgba(37,34,31,.14);font-family:var(--serif);font-size:1.35rem}.region-cakes a b{font-family:var(--sans);font-size:.8rem;transition:.2s}.region-cakes a:hover b{transform:translate(4px,-4px)}.vietnam-quote{background:#d6b55b;text-align:center}.vietnam-quote>span{font-family:var(--serif);font-size:7rem;line-height:.5}.vietnam-quote blockquote{font-family:var(--serif);font-size:clamp(2.6rem,5vw,5.8rem);line-height:1.02;letter-spacing:-.035em;max-width:1200px;margin:25px auto}

/* world */
.world-hero{background:#62463e;color:var(--milk)}.world-hero p{color:#d5c5bc}.continent-list{background:var(--milk)}.continent-row{display:grid;grid-template-columns:320px 1fr;gap:5vw;padding:65px 0;border-top:1px solid var(--line)}.continent-title small{font-size:.58rem;letter-spacing:.15em;font-weight:800}.continent-title h2{font-family:var(--serif);font-size:4rem;margin:8px 0}.continent-title p{color:var(--muted);font-size:.8rem}.continent-cakes{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.continent-cakes>a{background:color-mix(in srgb,var(--accent) 14%,#f2e7d8);border-radius:18px;padding:10px;transition:.25s}.continent-cakes>a:hover{transform:translateY(-5px)}.continent-cakes .cake-photo{aspect-ratio:1.25}.continent-cakes div{display:flex;flex-direction:column;padding:5px 8px 10px}.continent-cakes small{font-size:.5rem;letter-spacing:.12em}.continent-cakes strong{font-family:var(--serif);font-size:1.4rem}

/* learning */
.learning-hero{background:#f2c96e}.formula-strip{min-height:170px;display:flex;align-items:center;justify-content:center;gap:clamp(10px,2.4vw,35px);background:var(--ink);color:var(--milk);font-family:var(--serif);font-size:clamp(1.6rem,4vw,4.2rem);overflow:hidden;white-space:nowrap}.formula-strip b{color:#756d67;font-weight:400}.formula-strip em{color:var(--butter)}.article-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}.article-card{min-height:340px;border-radius:24px;background:color-mix(in srgb,var(--accent) 30%,#f4e9dc);padding:34px;display:grid;grid-template-columns:70px 1fr;gap:20px;align-items:start}.article-index{font-family:var(--serif);font-size:2.5rem}.article-card small{font-size:.55rem;letter-spacing:.12em;font-weight:800}.article-card h3{font-family:var(--serif);font-size:2.7rem;line-height:1;letter-spacing:-.035em;margin:16px 0}.article-card p{color:#635c55;max-width:570px}.article-card span{display:inline-block;margin-top:18px;font-size:.57rem;font-weight:800;letter-spacing:.1em;border-bottom:1px solid}.science-section{background:#2d2a27;color:var(--milk);display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.science-card{min-height:510px;border:1px solid rgba(255,255,255,.14);border-radius:24px;padding:34px;position:relative;overflow:hidden}.science-card small{font-size:.56rem;letter-spacing:.16em;color:#aca29a}.science-card h2{font-family:var(--serif);font-size:4.5rem;margin:55px 0 10px}.science-card p{color:#b8aea6}.science-line{height:2px;background:#d8b26b;position:absolute;left:35px;right:35px;bottom:60px;box-shadow:0 -16px 0 #d8b26b,0 16px 0 #d8b26b;transform:rotate(-7deg)}.bubble-field i{position:absolute;border:1px solid #c9b8aa;border-radius:50%}.bubble-field i:nth-child(1){width:110px;height:110px;right:30px;bottom:35px}.bubble-field i:nth-child(2){width:48px;height:48px;left:45px;bottom:60px}.bubble-field i:nth-child(3){width:75px;height:75px;right:110px;bottom:160px}.bubble-field i:nth-child(4){width:25px;height:25px;right:30px;bottom:190px}.bubble-field i:nth-child(5){width:40px;height:40px;left:130px;bottom:140px}.heat-wave{font-family:var(--serif);font-size:7rem;color:#d17f5c;position:absolute;bottom:20px;left:35px;letter-spacing:-.12em}.faq-section{background:#f0e5d6}.faq-list details{border-top:1px solid var(--line);padding:0}.faq-list details:last-child{border-bottom:1px solid var(--line)}.faq-list summary{list-style:none;cursor:pointer;font-family:var(--serif);font-size:clamp(1.7rem,3vw,3rem);padding:24px 0;display:flex;justify-content:space-between;gap:20px}.faq-list summary::-webkit-details-marker{display:none}.faq-list summary span{font-family:var(--sans);font-weight:300}.faq-list details[open] summary span{transform:rotate(45deg)}.faq-list details p{max-width:760px;color:var(--muted);padding:0 0 28px;margin:0}

/* 404 */
.not-found{min-height:100svh;padding:130px 22px 80px;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center}.not-found h1{font-family:var(--serif);font-size:clamp(4rem,9vw,10rem);line-height:.82;letter-spacing:-.055em;margin:20px 0}.not-found p{max-width:540px;color:var(--muted);margin-bottom:30px}.lost-bite{width:140px;height:100px;background:#c58b4d;border-radius:45% 45% 40% 40%;position:relative;margin-bottom:30px}.lost-bite::after{content:"";position:absolute;width:60px;height:60px;border-radius:50%;background:var(--milk);right:-15px;top:-14px;box-shadow:-28px -18px 0 var(--milk)}

/* footer */
.site-footer { min-height:360px; background:var(--ink); color:var(--milk); padding:75px clamp(22px,6vw,96px) 28px; display:grid; grid-template-columns:1fr 1fr; gap:50px; align-content:space-between; }
.footer-brand { font-size:2rem; }
.site-footer p { color:#a9a098; max-width:380px; font-size:.85rem; }
.footer-links { display:grid; grid-template-columns:1fr 1fr; align-content:start; gap:10px 30px; }
.footer-links a { border-bottom:1px solid rgba(255,255,255,.15); padding:7px 0; font-family:var(--serif); font-size:1.3rem; }
.footer-note { grid-column:1/-1; border-top:1px solid rgba(255,255,255,.12); padding-top:20px; font-size:.52rem; letter-spacing:.16em; color:#827a74; }

@keyframes float { 0%,100%{transform:translateY(0) rotate(-4deg)}50%{transform:translateY(-12px) rotate(2deg)} }
@keyframes heroFloat { 0%,100%{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-14px) rotate(1.5deg)} }
@keyframes pulse { 0%,100%{opacity:.3;transform:scale(.7)}50%{opacity:1;transform:scale(1.4)} }

@media (max-width: 1100px) {
    .desktop-nav { display:none; }.menu-button{display:block}.topbar{grid-template-columns:1fr 1fr}.nav-search{display:none}
    .hero-section{grid-template-columns:1fr;min-height:auto;padding-top:150px}.hero-stage{min-height:520px}.hero-art{width:min(70vw,580px)}.hero-label{display:none}
    .featured-grid,.related-grid{grid-template-columns:repeat(2,1fr)}.explore-grid{grid-template-columns:repeat(3,1fr)}
    .cake-detail-hero{grid-template-columns:1fr;padding-top:140px}.detail-art-wrap{min-height:600px}.cake-detail-hero .back-link{margin-bottom:35px}
    .vietnam-map-section{grid-template-columns:1fr}.vietnam-map-wrap{position:relative;top:auto;height:660px}.continent-row{grid-template-columns:1fr}.recipe-workspace{grid-template-columns:300px 1fr;gap:5vw}
}

@media (max-width: 760px) {
    .topbar{height:68px;padding:0 20px}.section-pad{padding:80px 20px}.section-pad-top{padding:28px 20px 90px}.hero-section{padding:115px 20px 55px;gap:10px}.hero-copy h1{font-size:clamp(4rem,19vw,6.5rem)}.hero-lead{font-size:.92rem}.hero-micro{gap:16px;margin-top:40px}.hero-micro div{padding-right:15px}.hero-stage{min-height:400px}.hero-art{width:86vw}.cake-photo.hero-art{width:86vw}.scroll-hint{display:none}
    .split-heading{grid-template-columns:1fr;gap:22px}.split-heading h2,.row-heading h2,.center-heading h2{font-size:clamp(3.1rem,14vw,5rem)}.row-heading{align-items:flex-start}.circle-link{width:86px;flex:0 0 86px}
    .anatomy-showcase{grid-template-columns:1fr;min-height:auto}.anatomy-sticky{height:600px}.exploded-cake{top:110px;height:500px}.exploded-layer span{display:none}.anatomy-notes{padding-top:0}.anatomy-notes article{min-height:310px}
    .world-grid{grid-template-columns:1fr}.world-card{min-height:340px;padding:25px}.world-card h3{font-size:4rem}.world-number{left:25px;top:22px}
    .featured-grid,.explore-grid,.related-grid{grid-template-columns:1fr}.cake-card-visual{min-height:340px}.baking-teaser{grid-template-columns:1fr;min-height:auto}.ingredient-orbit{min-height:440px}.formula-card{width:240px}.search-cta{padding:80px 20px}.giant-search-link{gap:15px}.giant-search-link span{font-size:13vw}.giant-search-link b{width:52px;height:52px;font-size:1.3rem;flex:0 0 52px}
    .page-hero{min-height:60vh;padding:125px 20px 60px}.page-hero h1{font-size:16vw}.explore-meta{gap:15px;align-items:flex-end}.explore-meta span:last-child{text-align:right}.filter-group{overflow-x:auto;flex-wrap:nowrap;padding-bottom:15px}.filter-chip{white-space:nowrap}.mega-search input{min-width:0;font-size:1.4rem}
    .cake-detail-hero{padding:115px 20px 55px}.detail-copy h1{font-size:18vw}.detail-facts{gap:8px}.detail-facts strong{font-size:1rem}.detail-art-wrap{min-height:450px;border-radius:25px}.detail-art-wrap .hero-art{width:95%}.story-band{padding:90px 20px}.story-line i{width:25px}.detail-anatomy .split-heading{margin-bottom:20px}.cake-layer-inspector{grid-template-columns:1fr;gap:0}.layer-visual{min-height:500px}.inspection-layer{height:78px}.texture-section{grid-template-columns:1fr;gap:40px}.recipe-preview{grid-template-columns:1fr}.recipe-preview-art{padding:10px}.recipe-preview-copy h2{font-size:16vw}
    .recipe-hero{grid-template-columns:1fr;padding:120px 20px 60px;min-height:auto}.recipe-hero h1{font-size:16vw}.recipe-hero .cake-visual{max-width:420px}.recipe-workspace{grid-template-columns:1fr}.ingredient-checklist{position:relative;top:auto}.recipe-step{grid-template-columns:55px 1fr;gap:14px;padding-bottom:55px}.step-number{font-size:2.1rem}.mini-timer{flex-wrap:wrap}.recipe-finish{padding:50px 20px}
    .vietnam-map-section{padding-left:20px;padding-right:20px}.vietnam-map-wrap{height:560px}.map-label{padding:8px}.map-label strong{font-size:.8rem}.region-head h2{font-size:3.5rem}.continent-cakes{grid-template-columns:repeat(2,1fr)}.continent-row{padding:45px 0}.continent-title h2{font-size:3.4rem}
    .article-grid{grid-template-columns:1fr}.article-card{grid-template-columns:50px 1fr;padding:24px}.article-card h3{font-size:2.15rem}.science-section{grid-template-columns:1fr}.science-card{min-height:390px}.formula-strip{min-height:120px}.site-footer{grid-template-columns:1fr;padding:60px 20px 24px}.footer-note{grid-column:1}
}

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

/* ==========================================================
   PHOTO EDITION · real food photography + editorial motion
   ========================================================== */
.cake-photo { width:100%; aspect-ratio:1.08; position:relative; display:grid; place-items:center; isolation:isolate; transition:transform .45s cubic-bezier(.2,.75,.2,1); }
.cake-photo .photo-aura { position:absolute; width:78%; aspect-ratio:1; border-radius:50%; background:color-mix(in srgb,var(--accent) 24%,rgba(255,255,255,.72)); filter:blur(2px); opacity:.9; z-index:-2; }
.cake-photo .photo-frame { width:78%; aspect-ratio:1.04; position:relative; overflow:hidden; border-radius:44% 56% 42% 58% / 52% 42% 58% 48%; box-shadow:0 28px 65px rgba(63,43,31,.18); transform:rotate(-3deg); transition:transform .55s cubic-bezier(.18,.8,.2,1),border-radius .55s ease; background:#e9dfd3; }
.cake-photo .photo-frame::after { content:""; position:absolute; inset:0; box-shadow:inset 0 0 0 1px rgba(255,255,255,.36); pointer-events:none; }
.cake-photo img { width:100%; height:100%; display:block; object-fit:cover; transform:scale(1.03); transition:transform .7s cubic-bezier(.2,.8,.2,1),filter .5s ease; }
.cake-photo .photo-sheen { position:absolute; inset:0; background:linear-gradient(135deg,rgba(255,255,255,.20),transparent 35%,rgba(35,20,12,.08)); mix-blend-mode:soft-light; pointer-events:none; }
.cake-photo .photo-floor { position:absolute; width:55%; height:8%; bottom:8%; border-radius:50%; background:rgba(58,38,27,.16); filter:blur(18px); z-index:-1; }
.cake-photo.hero-art { width:min(42vw,650px); animation:heroFloat 7s ease-in-out infinite; }
.cake-photo.hero-art .photo-frame { width:84%; box-shadow:0 40px 90px rgba(65,42,28,.20); }
.cake-card:hover .cake-photo .photo-frame,.continent-cakes>a:hover .cake-photo .photo-frame { transform:rotate(1deg) scale(1.025); border-radius:50% 42% 55% 45% / 43% 55% 45% 57%; }
.cake-card:hover .cake-photo img,.continent-cakes>a:hover .cake-photo img { transform:scale(1.09); }

.hero-stage .cake-photo { z-index:1; }
.hero-orbit { z-index:2; }

/* real photo cards */
.cake-card.photo-edition .cake-card-visual { min-height:430px; background:linear-gradient(155deg,color-mix(in srgb,var(--accent) 15%,#fffaf3),#eee2d4); }
.cake-card.photo-edition .cake-card-visual .cake-photo { width:94%; z-index:1; }
.cake-card-index { position:absolute; left:18px; top:17px; z-index:2; font-family:var(--serif); font-size:1.15rem; }
.cake-card-action { z-index:3; }
.cake-card-copy h3 { font-size:2.45rem; }

/* real-photo home anatomy */
.real-exploded-cake { gap:18px; justify-content:center; }
.real-slice { --slice:0; width:min(540px,88%); height:88px; overflow:hidden; position:relative; border-radius:24px; box-shadow:0 22px 40px rgba(0,0,0,.28); transform:translateX(calc((var(--slice) - 1.5) * 12px)) rotate(calc((var(--slice) - 1.5) * .7deg)); transition:transform .45s cubic-bezier(.2,.8,.2,1); }
.real-slice img { position:absolute; left:0; width:100%; height:400%; max-width:none; object-fit:cover; top:calc(var(--slice) * -100%); filter:saturate(.92) contrast(1.02); }
.real-exploded-cake:hover .real-slice:nth-child(1){transform:translate(-24px,-10px) rotate(-2deg)}
.real-exploded-cake:hover .real-slice:nth-child(2){transform:translate(14px,-2px) rotate(1deg)}
.real-exploded-cake:hover .real-slice:nth-child(3){transform:translate(-10px,5px) rotate(-.5deg)}
.real-exploded-cake:hover .real-slice:nth-child(4){transform:translate(22px,12px) rotate(2deg)}
.slice-caption { position:absolute; display:flex; gap:10px; align-items:center; font-size:.52rem; letter-spacing:.14em; color:#c8bcb2; }
.slice-caption b { width:28px;height:28px;border:1px solid rgba(255,255,255,.3);border-radius:50%;display:grid;place-items:center;font-size:.48rem; }
.slice-caption.cap-1{right:-4%;top:21%}.slice-caption.cap-2{left:-3%;top:47%}.slice-caption.cap-3{right:-3%;bottom:20%}
.real-exploded-cake .exploded-plate { margin-top:2px; width:64%; }

/* detail hero as food editorial */
.detail-art-wrap { background:linear-gradient(145deg,color-mix(in srgb,var(--cake-accent) 20%,#fff9f0),#eadfd2); }
.detail-art-wrap .cake-photo.hero-art { width:min(90%,670px); }
.detail-art-wrap .cake-photo .photo-frame { width:82%; }
.detail-art-wrap::after { content:"PHOTO / TEXTURE / ORIGIN"; position:absolute; right:31px; top:29px; writing-mode:vertical-rl; font-size:.48rem; letter-spacing:.18em; opacity:.55; }
.photo-credit { position:absolute; left:30px; bottom:28px; z-index:4; max-width:46%; font-size:.48rem; letter-spacing:.09em; text-transform:uppercase; opacity:.62; transition:opacity .2s; }
.photo-credit:hover { opacity:1; }

/* photo anatomy: one photograph physically split into horizontal slices */
.photo-layer-visual { position:relative; }
.photo-layer-stack { width:min(570px,92%); display:flex; flex-direction:column; gap:17px; perspective:1000px; padding:24px 0; }
.photo-anatomy-strip { --i:0; --count:3; height:118px; overflow:hidden; position:relative; border-radius:24px; box-shadow:0 24px 40px rgba(72,45,29,.14); transform:translateX(calc((var(--i) - 1) * 18px)) rotateY(calc((var(--i) - 1) * -1deg)); transition:transform .45s cubic-bezier(.2,.8,.2,1); background:#ddd0c0; }
.photo-anatomy-strip img { position:absolute; left:0; top:calc(var(--i) * -100%); width:100%; height:calc(var(--count) * 100%); max-width:none; object-fit:cover; filter:saturate(.96) contrast(1.02); }
.photo-anatomy-strip::after { content:""; position:absolute; inset:0; border:1px solid rgba(255,255,255,.35); border-radius:inherit; box-shadow:inset 0 -25px 35px rgba(31,18,10,.07); }
.photo-anatomy-strip span { position:absolute; right:14px; top:14px; z-index:2; width:29px;height:29px;border-radius:50%;display:grid;place-items:center;background:rgba(255,253,247,.86);backdrop-filter:blur(6px);font-size:.52rem;font-weight:800; }
.photo-layer-stack:hover .photo-anatomy-strip:nth-child(odd){transform:translateX(-25px) rotateY(2deg)}
.photo-layer-stack:hover .photo-anatomy-strip:nth-child(even){transform:translateX(25px) rotateY(-2deg)}
.anatomy-photo-note { margin-top:16px; font-size:.48rem; letter-spacing:.18em; color:var(--muted); }

.recipe-preview-art { min-height:480px; display:grid; place-items:center; padding:25px; overflow:hidden; }
.recipe-preview-art .cake-photo { width:min(100%,560px); }
.recipe-hero .cake-photo { max-width:600px; justify-self:center; }
.continent-cakes .cake-photo { aspect-ratio:1.25; }
.continent-cakes .cake-photo .photo-frame { width:88%; border-radius:24px; transform:none; }
.continent-cakes .cake-photo .photo-aura,.continent-cakes .cake-photo .photo-floor { display:none; }
.continent-cakes .cake-photo img { transform:scale(1.02); }

/* image loading state */
.cake-photo .photo-frame { background:linear-gradient(120deg,#eadfd2,#f8f1e8,#e8daca); background-size:220% 100%; animation:photoShimmer 2.8s ease-in-out infinite; }
.cake-photo .photo-frame img { background:#e9dfd3; }
@keyframes photoShimmer { 0%,100%{background-position:0% 50%}50%{background-position:100% 50%} }

@media (max-width:1100px){
  .cake-photo.hero-art{width:min(76vw,620px)}
  .detail-art-wrap .cake-photo.hero-art{width:min(88vw,650px)}
}
@media (max-width:760px){
  .hero-stage .cake-photo.hero-art{width:90vw}.cake-photo.hero-art .photo-frame{width:82%}
  .cake-card.photo-edition .cake-card-visual{min-height:360px}
  .real-slice{height:72px;gap:12px}.real-exploded-cake{gap:14px}.slice-caption{display:none}
  .photo-layer-stack{width:94%;gap:12px}.photo-anatomy-strip{height:92px;border-radius:18px}
  .detail-art-wrap .cake-photo.hero-art{width:100%}.photo-credit{left:20px;bottom:18px;max-width:55%}
  .recipe-preview-art{min-height:360px}.recipe-hero .cake-photo{max-width:440px}
}

/* photo source index */
.credit-hero { padding-bottom:72px; }
.photo-credits-section { padding-top:20px; }
.photo-credit-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:34px 22px; }
.photo-credit-card { display:block; min-width:0; }
.photo-credit-thumb { aspect-ratio:1.08; position:relative; overflow:hidden; border-radius:28px; background:#eadfd2; box-shadow:0 18px 45px rgba(64,42,29,.10); }
.photo-credit-thumb img { width:100%; height:100%; object-fit:cover; display:block; transform:scale(1.025); transition:transform .55s cubic-bezier(.2,.8,.2,1),filter .4s ease; }
.photo-credit-thumb span { position:absolute; top:14px; left:14px; width:34px; height:34px; display:grid; place-items:center; border-radius:50%; background:rgba(255,253,247,.88); backdrop-filter:blur(8px); font-size:.55rem; font-weight:800; }
.photo-credit-card:hover .photo-credit-thumb img { transform:scale(1.08); filter:saturate(1.04); }
.photo-credit-copy { display:grid; gap:4px; padding:14px 3px 0; }
.photo-credit-copy small { color:var(--muted); font-size:.55rem; letter-spacing:.1em; text-transform:uppercase; }
.photo-credit-copy strong { font-family:var(--serif); font-size:1.65rem; font-weight:500; letter-spacing:-.035em; }
.photo-credit-copy em { color:var(--muted); font-family:var(--sans); font-size:.6rem; font-style:normal; letter-spacing:.07em; text-transform:uppercase; }
@media (max-width:1050px){.photo-credit-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:760px){.photo-credit-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 12px}.photo-credit-thumb{border-radius:19px}.photo-credit-copy strong{font-size:1.25rem}}

/* ==========================================================
   V4 · RESPONSIVE PHOTO SYSTEM + UNIQUE ILLUSTRATED ANATOMY
   ========================================================== */

/* Photos should read like editorial photography, not floating stickers. */
.cake-photo,
.cake-photo.hero-art {
    width: 100%;
    height: 100%;
    aspect-ratio: auto;
    animation: none;
    filter: none;
    display: block;
}
.cake-photo .photo-frame {
    width: 100%;
    height: 100%;
    aspect-ratio: auto;
    border-radius: inherit;
    transform: none;
    box-shadow: none;
    background: #e9dfd3;
}
.cake-photo .photo-frame::after { box-shadow: inset 0 0 0 1px rgba(37,34,31,.08); }
.cake-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: none;
    filter: saturate(.96) contrast(1.01);
}
.cake-photo .photo-sheen { opacity: .38; }
.cake-card:hover .cake-photo .photo-frame,
.continent-cakes>a:hover .cake-photo .photo-frame {
    transform: none;
    border-radius: inherit;
}
.cake-card:hover .cake-photo img,
.continent-cakes>a:hover .cake-photo img { transform: scale(1.035); }

/* Remove the decorative circles that were covering photography. */
.cake-card-visual::before,
.cake-card.photo-edition .cake-card-visual::before,
/* Card system: consistent crop and sane height on every viewport. */
.featured-grid,
.explore-grid,
.related-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: clamp(32px, 3.2vw, 56px) clamp(16px, 1.8vw, 28px);
}
.explore-shell { max-width: 1560px; margin-inline: auto; }
.cake-card.photo-edition .cake-card-visual,
.cake-card-visual {
    min-height: 0;
    aspect-ratio: 4 / 3;
    border-radius: 24px;
    overflow: hidden;
    background: color-mix(in srgb,var(--accent) 10%,#eee4d8);
}
.cake-card-visual .cake-photo { width: 100%; height: 100%; }
.cake-card-visual .photo-frame { border-radius: 24px; }
.cake-card-index {
    left: 16px;
    top: 14px;
    padding: 5px 9px;
    border-radius: 999px;
    background: rgba(255,250,244,.84);
    backdrop-filter: blur(8px);
    font-family: var(--sans);
    font-size: .58rem;
    font-weight: 800;
    letter-spacing: .08em;
}
.cake-card-action { top:14px; right:14px; }
.cake-card-copy { padding-top: 16px; }
.cake-card-copy h3 { font-size: clamp(1.8rem, 2.4vw, 2.55rem); line-height: 1; }
.cake-card-copy p { max-width: 92%; }
.explore-meta { align-items: center; gap: 24px; }
.explore-meta > span:last-child { color: var(--muted); text-align: right; max-width: 430px; }

/* Homepage hero: one strong photograph with controlled crop. */
.hero-stage { min-height: min(72vh, 700px); }
.hero-stage .cake-photo.hero-art {
    width: min(90%, 610px);
    height: min(68vh, 640px);
    padding: 16px;
    border-radius: 34px;
    background: rgba(255,255,255,.28);
    box-shadow: 0 36px 90px rgba(64,42,29,.13);
    transform: rotate(-1.5deg);
}
.hero-stage .cake-photo.hero-art .photo-frame { border-radius: 24px; }

/* Detail hero: no accidental mega-crop on desktop/mobile. */
.cake-detail-hero {
    min-height: auto;
    grid-template-columns: minmax(0, .88fr) minmax(520px, 1.12fr);
    max-width: 1720px;
    margin-inline: auto;
    padding-top: 124px;
    padding-bottom: 84px;
    align-items: center;
}
.detail-art-wrap {
    min-height: 0;
    height: clamp(520px, 66vh, 760px);
    border-radius: 30px;
    padding: 18px;
    overflow: hidden;
    background: color-mix(in srgb,var(--cake-accent) 11%,#eadfd2);
}
.detail-art-wrap .cake-photo.hero-art {
    width: 100%;
    height: 100%;
    padding: 0;
    border-radius: 22px;
    background: transparent;
    box-shadow: none;
    transform: none;
}
.detail-art-wrap .cake-photo .photo-frame { width:100%; height:100%; border-radius:22px; }
.detail-art-wrap .cake-photo img { object-fit: cover; }
.detail-art-wrap::after {
    right: 32px;
    top: 34px;
    padding: 7px 9px;
    background: rgba(255,250,244,.72);
    border-radius: 999px;
    backdrop-filter: blur(7px);
    writing-mode: horizontal-tb;
    z-index: 4;
}
.photo-credit {
    left: 30px;
    bottom: 27px;
    max-width: 58%;
    padding: 7px 10px;
    border-radius: 999px;
    background: rgba(255,250,244,.76);
    backdrop-filter: blur(8px);
    opacity: .82;
}
.detail-flavors { z-index: 4; }
.detail-flavors span { background: rgba(255,250,244,.74); }

/* World cards get the same photographic language. */
.continent-cakes>a { padding: 0 0 12px; overflow: hidden; border-radius: 20px; }
.continent-cakes .cake-photo { width:100%; height:auto; aspect-ratio:4/3; }
.continent-cakes .cake-photo .photo-frame { width:100%; height:100%; border-radius:20px 20px 0 0; }
.continent-cakes div { padding: 12px 14px 5px; }

/* The inside is intentionally illustrated, not a repeated photo crop. */
.illustrated-layer-visual { min-height: 560px; }
.anatomy-illustration {
    width: min(100%, 720px);
    position: relative;
    border-radius: 36px;
    background:
        radial-gradient(circle at 20% 12%, color-mix(in srgb,var(--anatomy-accent) 9%,transparent), transparent 32%),
        #fffaf4;
    border: 1px solid rgba(37,34,31,.09);
    box-shadow: 0 34px 80px rgba(71,48,34,.10);
    padding: clamp(14px,2vw,24px);
    overflow: hidden;
}
.anatomy-illustration::before {
    content:"";
    position:absolute;
    inset:0;
    pointer-events:none;
    opacity:.24;
    background-image: radial-gradient(rgba(37,34,31,.15) .55px, transparent .55px);
    background-size: 8px 8px;
    mask-image: linear-gradient(to bottom, black, transparent 75%);
}
.anatomy-svg { width:100%; height:auto; display:block; overflow:visible; position:relative; z-index:1; }
.anatomy-shadow { fill: rgba(54,34,23,.12); filter: blur(7px); }
.anatomy-pin circle { fill: var(--ink); stroke: #fffaf4; stroke-width: 4; }
.anatomy-pin text { fill:#fffaf4; font:800 13px var(--sans); text-anchor:middle; }
.anatomy-pin path { fill:none; stroke:rgba(37,34,31,.56); stroke-width:1.5; stroke-dasharray:4 5; }
.anatomy-pin { transform-origin:center; transition:transform .3s ease; }
.anatomy-illustration:hover .anatomy-pin { transform: translateY(-3px); }
.anatomy-legend {
    position:relative;
    z-index:2;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;
    padding: 9px 10px 2px;
    color:var(--muted);
    font-size:.5rem;
    font-weight:800;
    letter-spacing:.16em;
}
/* material-specific detail */
.honeycomb-holes ellipse,.crumb-holes ellipse,.custard-holes ellipse,.choux-cavities ellipse { fill:#9b6b3f; opacity:.54; }
.anatomy-croissant .honeycomb-holes ellipse { fill:#b07c43; opacity:.58; stroke:#f6d99d; stroke-width:5; }
.lamination-lines path { fill:none; stroke:#8a552b; stroke-width:4; opacity:.42; stroke-linecap:round; }
.layer-gloss path { fill:none; stroke:rgba(255,255,255,.45); stroke-width:7; stroke-linecap:round; }
.cocoa-specks circle { fill:#39251e; opacity:.72; }
.filling-dots circle { fill:#a94f3f; stroke:#f0be77; stroke-width:4; }
.fried-shallots path { stroke:#ad7840; stroke-width:8; stroke-linecap:round; }
.leaf-veins path { fill:none; stroke:rgba(232,242,215,.27); stroke-width:4; }
.macaron-feet path { fill:none; stroke:#7f455a; stroke-width:7; stroke-linecap:round; stroke-linejoin:round; opacity:.78; }
.moon-pattern path { fill:none; stroke:#6f3f27; stroke-width:5; opacity:.28; }
.canele-ribs path { fill:none; stroke:#c07b46; stroke-width:7; opacity:.35; }
.savory-herbs path { fill:none; stroke:#648357; stroke-width:8; stroke-linecap:round; }

/* Home anatomy uses the illustrated cross-section as a sticky exhibit. */
.anatomy-sticky .anatomy-illustration {
    position: sticky;
    top: 14vh;
    margin-top: 5vh;
    background:#2f2a27;
    border-color:rgba(255,255,255,.12);
    box-shadow:0 35px 90px rgba(0,0,0,.24);
}
.home-anatomy .anatomy-illustration::before { opacity:.08; }
.home-anatomy .anatomy-legend { color:#b9afa7; }
.home-anatomy .anatomy-pin path { stroke:rgba(255,255,255,.4); }

/* Related cards should never become full-screen slabs. */
.related-grid .cake-card-visual { aspect-ratio: 16 / 11; }

@media (max-width: 1180px) {
    .featured-grid,.explore-grid,.related-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .cake-detail-hero { grid-template-columns:1fr; max-width:960px; gap:52px; }
    .detail-art-wrap { height:auto; aspect-ratio: 4 / 3; }
    .detail-copy { max-width:760px; }
    .continent-row { grid-template-columns: 230px 1fr; }
}

@media (max-width: 760px) {
    .section-pad-top { padding-inline: 18px; }
    .explore-shell { padding-bottom: 90px; }
    .explore-meta { align-items:flex-start; flex-direction:column; gap:5px; }
    .explore-meta > span:last-child { text-align:left; font-size:.62rem; }
    .featured-grid,.explore-grid,.related-grid { grid-template-columns:1fr; gap:34px; }
    .cake-card.photo-edition .cake-card-visual,.cake-card-visual { aspect-ratio: 16 / 10; border-radius:20px; }
    .cake-card-visual .photo-frame { border-radius:20px; }
    .cake-card-copy h3 { font-size:2.05rem; }
    .cake-card-copy p { max-width:100%; }

    .hero-stage { min-height: 430px; }
    .hero-stage .cake-photo.hero-art { width:92vw; max-width:430px; height:400px; padding:11px; border-radius:25px; transform:none; }
    .hero-stage .cake-photo.hero-art .photo-frame { border-radius:18px; }

    .cake-detail-hero { padding: 108px 18px 52px; gap:38px; }
    .detail-art-wrap { width:100%; height:auto; aspect-ratio:4/3; border-radius:22px; padding:10px; }
    .detail-art-wrap .cake-photo.hero-art { width:100%; height:100%; border-radius:16px; }
    .detail-art-wrap .cake-photo .photo-frame { border-radius:16px; }
    .detail-art-wrap::after { top:18px; right:18px; font-size:.42rem; }
    .photo-credit { left:18px; bottom:16px; max-width:68%; font-size:.42rem; }
    .detail-flavors { display:none; }

    .illustrated-layer-visual { min-height:0; }
    .anatomy-illustration { width:100%; border-radius:24px; padding:8px; }
    .anatomy-legend { padding:5px 7px 2px; font-size:.43rem; }
    .cake-layer-inspector { gap:36px; }
    .layer-notes article { padding:20px 0; }
    .layer-notes h3 { font-size:1.65rem; }

    .anatomy-showcase { grid-template-columns:1fr; min-height:auto; gap:50px; }
    .anatomy-sticky { height:auto; }
    .anatomy-sticky .anatomy-illustration { position:relative; top:auto; margin:0; }
    .anatomy-notes article { min-height:auto; padding:48px 0; }

    .continent-row { grid-template-columns:1fr; gap:24px; }
    .continent-cakes { grid-template-columns:1fr 1fr; }
    .continent-cakes .cake-photo { aspect-ratio: 1 / 1; }
}

@media (max-width: 480px) {
    .continent-cakes { grid-template-columns:1fr; }
    .continent-cakes .cake-photo { aspect-ratio:16/10; }
    .cake-card.photo-edition .cake-card-visual,.cake-card-visual { aspect-ratio: 3 / 2; }
    .detail-art-wrap { aspect-ratio: 1 / 1; }
    .anatomy-legend span:last-child { display:none; }
}

/* Detail pages show the complete photograph whenever the source crop is awkward. */
.detail-art-wrap .cake-photo.contain-photo .photo-frame {
    background: linear-gradient(145deg, color-mix(in srgb,var(--cake-accent) 9%,#f5eee7), #eee5dc);
}
.detail-art-wrap .cake-photo.contain-photo img {
    object-fit: contain;
    padding: clamp(8px,1.2vw,16px);
}


/* ==========================================================
   V5 · HARD RESET FOR PHOTOGRAPHY + MOBILE FIT
   This block intentionally wins over every legacy visual rule.
   ========================================================== */
.cake-card-visual::before,
.cake-card-visual::after,
.cake-card.photo-edition .cake-card-visual::before,
.cake-card.photo-edition .cake-card-visual::after,
.detail-art-wrap::before,
.hero-stage::before,
.hero-stage::after {
    content: none !important;
    display: none !important;
}

.cake-card-visual,
.cake-card.photo-edition .cake-card-visual {
    position: relative;
    min-height: 0 !important;
    height: auto !important;
    aspect-ratio: 4 / 3 !important;
    overflow: hidden !important;
    border-radius: 22px !important;
    background: color-mix(in srgb, var(--accent) 8%, #eee5da) !important;
}

.cake-card-visual > .cake-photo,
.cake-card-visual .cake-photo,
.cake-card-visual .photo-frame {
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    border-radius: inherit !important;
    overflow: hidden !important;
    transform: none !important;
}

.cake-card-visual img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: var(--photo-position, center) !important;
    transform: scale(1.001);
    transition: transform .45s cubic-bezier(.2,.8,.2,1), filter .35s ease;
}

.cake-card:hover .cake-card-visual img { transform: scale(1.035); }

/* Keep labels compact; they must never become large decorative discs. */
.cake-card-index,
.cake-card-action {
    z-index: 5 !important;
    width: auto !important;
    height: auto !important;
    min-width: 0 !important;
    aspect-ratio: auto !important;
    border-radius: 999px !important;
    line-height: 1 !important;
    box-shadow: none !important;
    transform: none !important;
    opacity: 1 !important;
}

.cake-card-index {
    left: 14px !important;
    top: 14px !important;
    padding: 7px 10px !important;
    background: rgba(255,250,244,.88) !important;
    color: var(--ink) !important;
    border: 1px solid rgba(37,34,31,.10) !important;
}

.cake-card-action {
    right: 14px !important;
    top: 14px !important;
    padding: 9px 12px !important;
    background: rgba(37,34,31,.92) !important;
    color: #fffaf4 !important;
}

/* Homepage hero: photograph is the subject, not a background shape. */
.hero-stage {
    min-height: clamp(430px, 62vw, 690px) !important;
    padding: clamp(4px, 1vw, 12px);
}
.hero-stage .cake-photo.hero-art {
    width: min(100%, 610px) !important;
    height: clamp(430px, 58vw, 650px) !important;
    max-height: 68vh;
    padding: 0 !important;
    border-radius: 30px !important;
    overflow: hidden !important;
    background: transparent !important;
    box-shadow: 0 30px 85px rgba(64,42,29,.14) !important;
    transform: none !important;
}
.hero-stage .cake-photo.hero-art .photo-frame { border-radius: inherit !important; }
.hero-stage .cake-photo.hero-art img { object-fit: cover !important; }

/* Detail: always show a complete, intentional photograph. */
.detail-art-wrap {
    height: clamp(500px, 64vh, 760px) !important;
    aspect-ratio: auto !important;
    padding: 14px !important;
    border-radius: 28px !important;
}
.detail-art-wrap .cake-photo.hero-art,
.detail-art-wrap .cake-photo.hero-art .photo-frame {
    width: 100% !important;
    height: 100% !important;
    border-radius: 18px !important;
}
.detail-art-wrap .cake-photo.contain-photo img {
    object-fit: contain !important;
    padding: clamp(8px, 1vw, 14px) !important;
}

/* Actual cross-sections stay illustrated and cake-specific. */
.illustrated-layer-visual .anatomy-illustration {
    margin-inline: auto;
    max-width: 760px;
}

@media (max-width: 1180px) {
    .featured-grid, .explore-grid, .related-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 760px) {
    .topbar { height: 64px; padding-inline: 18px; }
    .menu-button { display: block; }
    .desktop-nav, .nav-search { display: none !important; }

    .hero-section {
        min-height: auto !important;
        grid-template-columns: 1fr !important;
        padding: 96px 18px 60px !important;
        gap: 34px !important;
    }
    .hero-copy h1 { font-size: clamp(3.6rem, 17vw, 5.4rem) !important; }
    .hero-lead { margin-top: 22px !important; }
    .hero-micro { margin-top: 34px !important; gap: 16px !important; }
    .hero-micro div { padding-right: 14px !important; }
    .hero-stage { min-height: 0 !important; width: 100%; }
    .hero-stage .cake-photo.hero-art {
        width: 100% !important;
        height: auto !important;
        aspect-ratio: 4 / 5 !important;
        max-height: none !important;
        border-radius: 22px !important;
    }
    .hero-label, .hero-orbit, .scroll-hint { display: none !important; }

    .featured-grid, .explore-grid, .related-grid {
        grid-template-columns: 1fr !important;
        gap: 38px !important;
    }
    .cake-card-visual,
    .cake-card.photo-edition .cake-card-visual {
        aspect-ratio: 4 / 3 !important;
        border-radius: 18px !important;
    }
    .cake-card-copy { padding-top: 14px !important; }
    .cake-card-copy h3 { font-size: 2rem !important; }

    .cake-detail-hero {
        grid-template-columns: 1fr !important;
        padding: 92px 18px 48px !important;
        gap: 34px !important;
    }
    .detail-art-wrap {
        width: 100% !important;
        height: auto !important;
        aspect-ratio: 4 / 3 !important;
        padding: 8px !important;
        border-radius: 18px !important;
    }
    .detail-art-wrap .cake-photo.hero-art,
    .detail-art-wrap .cake-photo.hero-art .photo-frame { border-radius: 12px !important; }
    .detail-art-wrap::after { display: none !important; }
    .photo-credit { max-width: 78% !important; }

    .anatomy-illustration { border-radius: 20px !important; }
    .anatomy-svg { max-height: 62vh; }
}

@media (max-width: 480px) {
    .cake-card-visual,
    .cake-card.photo-edition .cake-card-visual { aspect-ratio: 1.3 / 1 !important; }
    .detail-art-wrap { aspect-ratio: 1.18 / 1 !important; }
    .section-pad, .section-pad-top { padding-inline: 16px !important; }
}