/* ===== fontes e ícones locais (07-11): sem Google Fonts nem CDN, nada sai para terceiros ===== */
@font-face{font-family:'Cormorant Garamond';src:url(fonts/cormorant.woff2) format('woff2');font-weight:500 600;font-style:normal;font-display:swap}
@font-face{font-family:'Cormorant Garamond';src:url(fonts/cormorant-italic.woff2) format('woff2');font-weight:500 600;font-style:italic;font-display:swap}
@font-face{font-family:'Jost';src:url(fonts/jost.woff2) format('woff2');font-weight:400 500;font-style:normal;font-display:swap}
/* ícones Phosphor Light (MIT), em máscara SVG */
.ph-light{display:inline-block;width:1em;height:1em;flex:none;vertical-align:-.125em;background:currentColor;-webkit-mask:var(--ic) center/contain no-repeat;mask:var(--ic) center/contain no-repeat}
.ph-arrow-up-right{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'%3E%3Cpath d='M198,64V168a6,6,0,0,1-12,0V78.48L68.24,196.24a6,6,0,0,1-8.48-8.48L177.52,70H88a6,6,0,0,1,0-12H192A6,6,0,0,1,198,64Z'/%3E%3C/svg%3E")}
.ph-caret-left{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'%3E%3Cpath d='M164.24,203.76a6,6,0,1,1-8.48,8.48l-80-80a6,6,0,0,1,0-8.48l80-80a6,6,0,0,1,8.48,8.48L88.49,128Z'/%3E%3C/svg%3E")}
.ph-caret-right{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'%3E%3Cpath d='M180.24,132.24l-80,80a6,6,0,0,1-8.48-8.48L167.51,128,91.76,52.24a6,6,0,0,1,8.48-8.48l80,80A6,6,0,0,1,180.24,132.24Z'/%3E%3C/svg%3E")}
.ph-plus{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'%3E%3Cpath d='M222,128a6,6,0,0,1-6,6H134v82a6,6,0,0,1-12,0V134H40a6,6,0,0,1,0-12h82V40a6,6,0,0,1,12,0v82h82A6,6,0,0,1,222,128Z'/%3E%3C/svg%3E")}
.ph-whatsapp-logo{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'%3E%3Cpath d='M186.68,146.63l-32-16a6,6,0,0,0-6,.38L133,141.46A42.49,42.49,0,0,1,114.54,123L125,107.33a6,6,0,0,0,.38-6l-16-32A6,6,0,0,0,104,66a38,38,0,0,0-38,38,86.1,86.1,0,0,0,86,86,38,38,0,0,0,38-38A6,6,0,0,0,186.68,146.63ZM152,178a74.09,74.09,0,0,1-74-74,26,26,0,0,1,22.42-25.75l12.66,25.32-10.39,15.58a6,6,0,0,0-.54,5.63,54.43,54.43,0,0,0,29.07,29.07,6,6,0,0,0,5.63-.54l15.58-10.39,25.32,12.66A26,26,0,0,1,152,178ZM128,26A102,102,0,0,0,38.35,176.69L26.73,211.56a14,14,0,0,0,17.71,17.71l34.87-11.62A102,102,0,1,0,128,26Zm0,192a90,90,0,0,1-45.06-12.08,6.09,6.09,0,0,0-3-.81,6.2,6.2,0,0,0-1.9.31L40.65,217.88a2,2,0,0,1-2.53-2.53L50.58,178a6,6,0,0,0-.5-4.91A90,90,0,1,1,128,218Z'/%3E%3C/svg%3E")}
.ph-x{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'%3E%3Cpath d='M204.24,195.76a6,6,0,1,1-8.48,8.48L128,136.49,60.24,204.24a6,6,0,0,1-8.48-8.48L119.51,128,51.76,60.24a6,6,0,0,1,8.48-8.48L128,119.51l67.76-67.75a6,6,0,0,1,8.48,8.48L136.49,128Z'/%3E%3C/svg%3E")}
/* Alexandra Ferreira Artesanal · versão I
   Tema único: azul noite + marfim + um dourado. Tipos: Cormorant Garamond (a da marca) + Jost. */
:root{
  --bg:#0A1430;--bg2:#0F1B3D;--bg3:#14234B;
  --ink:#F2EEE6;--muted:rgba(242,238,230,.68);--faint:rgba(242,238,230,.42);
  --gold:#D4AE68;
  --line:rgba(242,238,230,.12);--glass:rgba(242,238,230,.05);
  --ease:cubic-bezier(.32,.72,0,1);
  --f-display:'Cormorant Garamond',Georgia,serif;--f-body:'Jost','Segoe UI',system-ui,sans-serif;
  --r-lg:32px;--r-md:24px;
  --pad:clamp(20px,5vw,72px);
  --sec:clamp(88px,12vw,168px);
  color-scheme:dark;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:96px;overflow-x:clip;background:var(--bg)}
body{margin:0;background:var(--bg);color:var(--ink);font:400 18px/1.65 var(--f-body);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
body::after{content:"";position:fixed;inset:0;pointer-events:none;z-index:90;opacity:.04;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>")}
img{display:block;max-width:100%}
a{color:inherit}
p{margin:0}
h1,h2,h3{font-family:var(--f-display);font-weight:500;letter-spacing:-.015em;line-height:1.06;margin:0;text-wrap:balance}
h1 em,h2 em,h3 em{font-style:italic;font-weight:500;color:var(--gold);padding-bottom:.08em}
.wrap{max-width:1320px;margin-inline:auto;padding-inline:var(--pad)}
.sec{padding-block:var(--sec)}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px}

/* ---------- botões: pílula com seta aninhada ---------- */
.btn{display:inline-flex;align-items:center;gap:18px;border-radius:999px;padding:8px 8px 8px 28px;font:500 16px/1 var(--f-body);letter-spacing:.01em;text-decoration:none;border:1px solid transparent;cursor:pointer;white-space:nowrap;transition:transform .6s var(--ease),background .6s var(--ease),border-color .6s var(--ease)}
.btn:active{transform:scale(.97)}
.btn .ar{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;font-size:19px;transition:transform .6s var(--ease)}
.btn:hover .ar{transform:translate(3px,-2px) scale(1.06)}
.btn-light{background:var(--ink);color:var(--bg)}
.btn-light .ar{background:rgba(10,20,48,.09)}
.btn-light:hover{background:#fff}
.btn-ghost{color:var(--ink);border-color:rgba(242,238,230,.3);padding-left:26px}
.btn-ghost .ar{background:rgba(242,238,230,.08)}
.btn-ghost:hover{border-color:var(--ink);background:rgba(242,238,230,.05)}
.btn.sm{padding:5px 5px 5px 20px;font-size:14.5px;gap:12px}
.btn.sm .ar{width:34px;height:34px;font-size:16px}
.link{display:inline-flex;align-items:center;gap:8px;font-weight:500;text-decoration:none;border-bottom:1px solid rgba(242,238,230,.35);padding-bottom:3px;transition:border-color .5s var(--ease),gap .5s var(--ease)}
.link:hover{border-color:var(--gold);gap:12px}

/* ---------- cabeçalho: ilha flutuante ---------- */
.nav{position:fixed;top:16px;left:50%;transform:translateX(-50%);z-index:60;width:min(960px,calc(100% - 28px));height:62px;border-radius:999px;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 8px 0 22px;background:rgba(14,25,58,.55);-webkit-backdrop-filter:blur(20px) saturate(140%);backdrop-filter:blur(20px) saturate(140%);border:1px solid rgba(242,238,230,.13);box-shadow:inset 0 1px 0 rgba(255,255,255,.08);transition:background .6s var(--ease),transform .6s var(--ease)}
.nav.solid{background:rgba(10,20,48,.82)}
.nav .brand{display:flex;align-items:center;gap:11px;text-decoration:none;flex:none}
.nav .brand img{height:28px;width:auto}
.nav .brand b{font:600 20px/1 var(--f-display);letter-spacing:-.005em;white-space:nowrap}
.nav ul{display:flex;gap:6px;list-style:none;margin:0;padding:0}
.nav ul a{display:block;padding:9px 14px;border-radius:99px;font-size:15px;text-decoration:none;color:var(--muted);transition:color .5s var(--ease),background .5s var(--ease)}
.nav ul a:hover{color:var(--ink);background:rgba(242,238,230,.07)}
.nav ul a[aria-current="page"]{color:var(--ink)}
.nav ul a.nat{color:var(--gold)}
.nav .btn{flex:none}
.burger{display:none;width:46px;height:46px;border-radius:50%;border:0;background:rgba(242,238,230,.08);position:relative;cursor:pointer;color:var(--ink)}
.burger span{position:absolute;left:14px;right:14px;height:1.5px;background:currentColor;border-radius:2px;transition:transform .7s var(--ease),opacity .4s}
.burger span:nth-child(1){top:19px}.burger span:nth-child(2){top:26px}
.menu-open .burger span:nth-child(1){transform:translateY(3.5px) rotate(45deg)}
.menu-open .burger span:nth-child(2){transform:translateY(-3.5px) rotate(-45deg)}
.sheet{position:fixed;inset:0;z-index:55;display:grid;align-content:center;padding:90px var(--pad) 40px;background:rgba(8,16,40,.9);-webkit-backdrop-filter:blur(28px);backdrop-filter:blur(28px);opacity:0;pointer-events:none;transition:opacity .6s var(--ease)}
.menu-open .sheet{opacity:1;pointer-events:auto}
.sheet a{display:block;font:500 clamp(38px,11vw,64px)/1.15 var(--f-display);text-decoration:none;padding:6px 0;transform:translateY(40px);opacity:0;transition:transform .8s var(--ease),opacity .8s var(--ease)}
.menu-open .sheet a{transform:none;opacity:1}
.menu-open .sheet a:nth-child(1){transition-delay:.08s}.menu-open .sheet a:nth-child(2){transition-delay:.14s}.menu-open .sheet a:nth-child(3){transition-delay:.2s}.menu-open .sheet a:nth-child(4){transition-delay:.26s}.menu-open .sheet a:nth-child(5){transition-delay:.32s}
.sheet a.nat{color:var(--gold)}

/* ---------- molduras duplas (Doppelrand) ---------- */
.shell{padding:8px;border-radius:var(--r-lg);background:var(--glass);border:1px solid var(--line)}
.core{border-radius:calc(var(--r-lg) - 8px);overflow:hidden;position:relative;box-shadow:inset 0 1px 1px rgba(255,255,255,.14);background:var(--bg3)}
.core img{width:100%;height:100%;object-fit:cover}

/* ---------- topo ---------- */
.hero{min-height:100dvh;display:grid;align-items:center;padding:110px 0 56px;position:relative;overflow:clip}
.hero::before{content:"";position:absolute;inset:-10% -20% auto auto;width:70vw;height:70vw;max-width:980px;max-height:980px;border-radius:50%;background:radial-gradient(circle,rgba(212,174,104,.13),transparent 62%);pointer-events:none}
.hero .wrap{display:grid;grid-template-columns:1.02fr .98fr;gap:clamp(24px,5vw,88px);align-items:center;position:relative}
.hero h1{font-size:clamp(58px,8.4vw,128px);line-height:.98;letter-spacing:-.025em;margin-bottom:28px}
.hero p{font-size:clamp(17px,1.5vw,20px);color:var(--muted);max-width:42ch;margin-bottom:40px}
.hero .acts{display:flex;flex-wrap:wrap;gap:12px}
.cascade{position:relative;height:min(76dvh,720px);min-height:480px}
.cascade .a{position:absolute;right:0;top:0;width:68%;height:86%}
.cascade .b{position:absolute;left:0;bottom:0;width:54%;aspect-ratio:4/3;transform:rotate(-3deg);box-shadow:0 30px 60px -30px rgba(0,0,0,.6)}
.cascade .c{position:absolute;right:-1%;bottom:2%;width:26%;aspect-ratio:1;transform:rotate(4deg)}
.cascade .shell,.cascade .core{height:100%}

/* ---------- títulos de secção ---------- */
.sh{display:grid;gap:18px;margin-bottom:clamp(40px,6vw,72px);max-width:880px}
.sh h2{font-size:clamp(44px,6vw,92px);letter-spacing:-.022em}
.sh p{font-size:19px;color:var(--muted);max-width:50ch}

/* ---------- mosaico de bolos ---------- */
.bento{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:clamp(170px,19vw,270px);gap:14px}
.bento .cell{padding:0;border:0;background:none;cursor:zoom-in;display:block;width:100%;height:100%;text-align:left;color:inherit}
.bento .cell .shell{height:100%;transition:transform .8s var(--ease),border-color .8s var(--ease)}
.bento .cell .core{height:100%}
.bento .cell img{transition:transform 1.4s var(--ease)}
.bento .cell:hover .shell{transform:translateY(-4px);border-color:rgba(212,174,104,.5)}
.bento .cell:hover img{transform:scale(1.05)}
.bento .s1{grid-column:1/3;grid-row:1/3}
.bento .s2{grid-column:3;grid-row:1}
.bento .s3{grid-column:4;grid-row:1/3}
.bento .s4{grid-column:3;grid-row:2}
.bento .s5{grid-column:1/3;grid-row:3}
.bento .s6{grid-column:3;grid-row:3}
.bento .s7{grid-column:4;grid-row:3}
.after{display:flex;flex-wrap:wrap;gap:16px 28px;align-items:center;margin-top:clamp(32px,4vw,52px)}

/* ---------- bolachas: texto fixo + colunas ---------- */
.split{display:grid;grid-template-columns:5fr 7fr;gap:clamp(32px,6vw,110px);align-items:start}
.stick{position:sticky;top:120px;display:grid;gap:24px}
.stick h2{font-size:clamp(44px,5.6vw,86px)}
.stick p{color:var(--muted);max-width:40ch}
.mas{display:grid;grid-template-columns:1fr 1fr;gap:14px;align-items:start}
.mas .col{display:grid;gap:14px}
.mas .col:nth-child(2){margin-top:clamp(40px,8vw,110px)}
.mas button{padding:0;border:0;background:none;cursor:zoom-in;display:block;width:100%;color:inherit}
.mas .shell{transition:transform .8s var(--ease),border-color .8s var(--ease)}
.mas button:hover .shell{transform:translateY(-4px);border-color:rgba(212,174,104,.5)}
.mas img{aspect-ratio:var(--ar,4/5);transition:transform 1.4s var(--ease)}
.mas button:hover img{transform:scale(1.05)}

/* ---------- natal ---------- */
.band{position:relative;min-height:88dvh;display:grid;align-items:end;overflow:clip;isolation:isolate}
.band>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.band::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(10,20,48,.96) 24%,rgba(10,20,48,.78) 52%,rgba(10,20,48,.35)),linear-gradient(0deg,rgba(10,20,48,.75),transparent 45%)}
.band .wrap{padding-block:clamp(80px,12vw,150px)}
.band h2{font-size:clamp(54px,8vw,124px);line-height:1;letter-spacing:-.025em;max-width:11ch;margin-bottom:26px}
.band p{max-width:44ch;font-size:19px;color:rgba(242,238,230,.82);margin-bottom:36px}
.days{display:inline-flex;align-items:baseline;gap:14px;border:1px solid rgba(242,238,230,.3);border-radius:99px;padding:12px 26px;margin-bottom:34px}
.days b{font:500 46px/1 var(--f-display);color:var(--gold)}
.days span{font-size:15px;color:var(--muted)}

/* ---------- faixa curta (salgados) ---------- */
.slim{padding-block:clamp(56px,7vw,96px);background:var(--bg2)}
.slim .wrap{display:flex;flex-wrap:wrap;gap:24px 56px;align-items:center;justify-content:space-between}
.slim h2{font-size:clamp(34px,4.4vw,60px);max-width:16ch}
.slim p{color:var(--muted);max-width:44ch;margin-top:12px}

/* ---------- passos e listas ---------- */
.twocol{display:grid;grid-template-columns:5fr 7fr;gap:clamp(32px,6vw,110px);align-items:start}
.twocol h2{font-size:clamp(42px,5.4vw,82px);position:sticky;top:120px}
.rows{display:grid}
.row{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.3fr);gap:20px 40px;padding:34px 0;border-top:1px solid var(--line)}
.row:last-child{border-bottom:1px solid var(--line)}
.row h3{font-size:clamp(28px,3vw,40px)}
.row p{color:var(--muted);font-size:17px;line-height:1.6}

/* ---------- sobre ---------- */
.about .big{font:500 clamp(40px,6.2vw,96px)/1.04 var(--f-display);letter-spacing:-.022em;max-width:17ch}
.about .big em{color:var(--gold);font-style:italic}
.about .sign{font:500 italic 36px/1 var(--f-display);color:var(--gold);margin-top:30px}
.allergy{margin-top:clamp(56px,8vw,100px);max-width:780px}
.allergy summary{cursor:pointer;list-style:none;display:flex;align-items:center;gap:14px;font:500 clamp(26px,3vw,36px)/1.1 var(--f-display)}
.allergy summary::-webkit-details-marker{display:none}
.allergy summary i{font-size:22px;color:var(--gold);transition:transform .6s var(--ease)}
.allergy[open] summary i{transform:rotate(45deg)}
.allergy p{color:var(--muted);margin-top:18px;font-size:16.5px}
.allergens{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:18px 0 0;padding:0}
.allergens li{border:1px solid var(--line);border-radius:99px;padding:7px 14px;font-size:14px;color:var(--muted)}

/* ---------- final e rodapé ---------- */
.final{text-align:left}
.final h2{font-size:clamp(54px,9vw,148px);line-height:.98;letter-spacing:-.028em;max-width:12ch;margin-bottom:40px}
.final p{color:var(--muted);max-width:46ch;margin-bottom:36px;font-size:19px}
footer{border-top:1px solid var(--line);padding:64px 0 120px}
footer .wrap{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:32px 48px;align-items:start}
footer .logo img{height:62px;width:auto;margin-bottom:16px}
footer small{display:block;color:var(--faint);font-size:14px}
footer h4{font:600 13px/1 var(--f-body);letter-spacing:.16em;text-transform:uppercase;color:var(--faint);margin:0 0 16px}
footer ul{list-style:none;margin:0;padding:0;display:grid;gap:10px}
footer a{text-decoration:none;color:var(--muted);transition:color .4s}
footer a:hover{color:var(--ink)}
.fab{position:fixed;right:20px;bottom:20px;z-index:50;display:inline-flex;align-items:center;gap:10px;background:var(--ink);color:var(--bg);padding:14px 22px 14px 18px;border-radius:99px;text-decoration:none;font:500 15px/1 var(--f-body);box-shadow:0 18px 40px -16px rgba(0,0,0,.7);transition:transform .6s var(--ease)}
.fab i{font-size:22px}
.fab:hover{transform:translateY(-3px)}

/* ---------- páginas interiores ---------- */
.phero{padding:clamp(150px,18vw,210px) 0 clamp(56px,7vw,96px);position:relative;overflow:clip}
.phero::before{content:"";position:absolute;inset:-30% auto auto -20%;width:60vw;height:60vw;max-width:800px;max-height:800px;border-radius:50%;background:radial-gradient(circle,rgba(212,174,104,.1),transparent 62%);pointer-events:none}
.phero .wrap{display:grid;grid-template-columns:1.25fr .75fr;gap:clamp(24px,5vw,80px);align-items:end}
.phero.solo .wrap{grid-template-columns:1fr}
.phero h1{font-size:clamp(54px,8vw,124px);line-height:1;letter-spacing:-.025em;margin-bottom:26px;max-width:12ch}
.phero p{color:var(--muted);max-width:46ch;margin-bottom:34px;font-size:19px}
.phero .shell{aspect-ratio:4/5;transform:rotate(2deg)}
.phero .shell .core{height:100%}
.crumbs{font-size:14px;color:var(--faint);margin-bottom:28px}
.crumbs a{text-decoration:none;border-bottom:1px solid rgba(242,238,230,.25)}
.mason{columns:3 300px;column-gap:14px}
.mason button{break-inside:avoid;margin:0 0 14px;padding:0;border:0;background:none;cursor:zoom-in;display:block;width:100%;color:inherit;text-align:left}
.mason .shell{transition:transform .8s var(--ease),border-color .8s var(--ease)}
.mason button:hover .shell{transform:translateY(-4px);border-color:rgba(212,174,104,.5)}
.mason img{height:auto;transition:transform 1.4s var(--ease)}
.mason button:hover img{transform:scale(1.04)}
.mason .nm{display:block;padding:14px 8px 6px;font:500 24px/1.15 var(--f-display)}
.mason .ds{display:block;padding:0 8px;color:var(--muted);font-size:15px;line-height:1.5}
.faq{display:grid;max-width:860px}
.faq details{border-top:1px solid var(--line);padding:0}
.faq details:last-child{border-bottom:1px solid var(--line)}
.faq summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:20px;align-items:center;padding:26px 0;font:500 clamp(24px,2.6vw,32px)/1.15 var(--f-display)}
.faq summary::-webkit-details-marker{display:none}
.faq summary i{font-size:20px;color:var(--gold);flex:none;transition:transform .6s var(--ease)}
.faq details[open] summary i{transform:rotate(45deg)}
.faq details p{color:var(--muted);padding:0 0 26px;max-width:62ch}
.prose{max-width:760px;display:grid;gap:18px}
.prose h2{font-size:clamp(30px,3.4vw,42px);margin-top:26px}
.prose p,.prose li{color:var(--muted);font-size:17.5px}
.prose ul{margin:0;padding-left:22px;display:grid;gap:8px}

/* ---------- pedido (mosaico + formulário) ---------- */
.pedido-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(28px,4vw,60px);align-items:start}
.picks{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.pick{position:relative;display:block;padding:8px;border:1px solid var(--line);border-radius:26px;background:var(--glass);cursor:pointer;color:inherit;transition:transform .7s var(--ease),border-color .7s var(--ease)}
.pick img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:18px;transition:transform 1.2s var(--ease)}
.pick:hover{transform:translateY(-3px)}
.pick .nm{display:block;padding:10px 6px 4px;font:500 18px/1.15 var(--f-display);text-align:left}
.pick .ck{position:absolute;top:18px;right:18px;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;font-style:normal;font-size:14px;background:var(--gold);color:var(--bg);opacity:0;transform:scale(.5);transition:all .5s var(--ease)}
.pick[aria-pressed="true"]{border-color:var(--gold)}
.pick[aria-pressed="true"] .ck{opacity:1;transform:none}
.picks-note{margin-top:18px;color:var(--muted);font-size:15.5px;line-height:1.55}
.picks-note b{color:var(--ink);font-weight:500}
.pedido .form{position:sticky;top:96px;display:grid;gap:26px;padding:34px;border-radius:var(--r-lg);background:var(--bg2);border:1px solid var(--line);box-shadow:inset 0 1px 1px rgba(255,255,255,.08)}
fieldset{border:0;padding:0;margin:0;display:grid;gap:12px;min-width:0}
legend{font:500 26px/1.1 var(--f-display);padding:0;margin-bottom:12px}
legend .n{display:none}
.opts{display:flex;flex-wrap:wrap;gap:8px}
.opt{position:relative}
.opt input{position:absolute;opacity:0;inset:0;cursor:pointer;margin:0}
.opt span{display:inline-flex;align-items:center;padding:11px 18px;border-radius:99px;border:1px solid rgba(242,238,230,.22);font:500 15px/1 var(--f-body);color:var(--muted);transition:all .5s var(--ease)}
.opt input:hover+span{border-color:var(--ink);color:var(--ink)}
.opt input:checked+span{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.opt input:focus-visible+span{outline:2px solid var(--gold);outline-offset:2px}
.range output{font:500 48px/1 var(--f-display)}
.range output small{font:400 15px var(--f-body);color:var(--muted);margin-left:8px}
input[type=range]{width:100%;accent-color:var(--gold)}
.field{display:grid;gap:8px}
.field label{font-size:14.5px;color:var(--muted)}
.field input,textarea{width:100%;font:inherit;font-size:16px;color:var(--ink);background:rgba(242,238,230,.05);border:1px solid rgba(242,238,230,.2);border-radius:14px;padding:14px 16px;color-scheme:dark}
textarea{min-height:92px;resize:vertical}
.field input::placeholder,textarea::placeholder{color:var(--faint)}
.two{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.send{display:grid;gap:14px}
.send .btn{justify-self:start}
.send small{color:var(--faint);font-size:14px;line-height:1.5}
.maker .head{display:grid;gap:18px;margin-bottom:clamp(36px,5vw,64px);max-width:820px}
.maker .head h2{font-size:clamp(44px,6vw,92px)}
.maker .head p{color:var(--muted);font-size:19px;max-width:50ch}
.maker .kicker{display:none}

/* ---------- vista ampliada ---------- */
.lb{position:fixed;inset:0;z-index:100;background:rgba(6,12,30,.94);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);display:flex;align-items:center;justify-content:center;padding:24px;opacity:0;pointer-events:none;transition:opacity .5s var(--ease)}
.lb.on{opacity:1;pointer-events:auto}
.lb figure{margin:0;display:grid;grid-template-columns:minmax(0,1.3fr) minmax(280px,.7fr);gap:clamp(24px,4vw,56px);max-width:1200px;width:100%;max-height:92vh;align-items:center}
.lb img{width:100%;max-height:86vh;object-fit:contain;border-radius:22px}
.lb figcaption{display:grid;gap:18px;align-content:center}
.lb h3{font-size:clamp(34px,4vw,56px)}
.lb p{color:var(--muted);font-size:17.5px}
.lb .cnt{font-size:14px;color:var(--faint)}
.lb .x,.lb .nv{position:absolute;background:rgba(242,238,230,.08);color:var(--ink);border:1px solid rgba(242,238,230,.2);border-radius:50%;width:50px;height:50px;font-size:22px;cursor:pointer;display:grid;place-items:center;transition:background .4s,transform .5s var(--ease)}
.lb .x:hover,.lb .nv:hover{background:rgba(242,238,230,.16)}
.lb .x{top:20px;right:20px}
.lb .pv{left:16px;top:50%;transform:translateY(-50%)}
.lb .nx{right:16px;top:50%;transform:translateY(-50%)}

/* ---------- movimento ---------- */
.js .rv{opacity:0;transform:translateY(44px);filter:blur(8px);transition:opacity 1s var(--ease),transform 1s var(--ease),filter 1s var(--ease);transition-delay:var(--d,0s)}
.js .rv.in{opacity:1;transform:none;filter:none}
@supports (animation-timeline:view()){
  @media (prefers-reduced-motion:no-preference){
    .cascade .a{animation:drift-a linear both;animation-timeline:view();animation-range:exit 0% exit 100%}
    .cascade .b{animation:drift-b linear both;animation-timeline:view();animation-range:exit 0% exit 100%}
    .band>img{animation:slowzoom linear both;animation-timeline:view();animation-range:entry 0% exit 100%}
    @keyframes drift-a{to{transform:translateY(-60px)}}
    @keyframes drift-b{to{transform:rotate(-3deg) translateY(50px)}}
    @keyframes slowzoom{from{transform:scale(1)}to{transform:scale(1.12)}}
  }
}

/* ---------- ecrãs pequenos ---------- */
@media (max-width:980px){
  .nav ul,.nav>.btn{display:none}
  .burger{display:block}
  .nav{padding:0 8px 0 20px}
  .hero{padding-top:100px}
  .hero .wrap{grid-template-columns:1fr}
  .cascade{height:auto;min-height:0;display:grid;gap:12px}
  .cascade .a,.cascade .b,.cascade .c{position:relative;inset:auto;width:100%;height:auto;transform:none;animation:none}
  .cascade .a{aspect-ratio:4/5}
  .cascade .c{display:none}
  .cascade .b{aspect-ratio:16/10}
  .bento{grid-template-columns:1fr 1fr;grid-auto-rows:46vw}
  .bento .s1{grid-column:1/3;grid-row:auto/span 2}
  .bento .s2,.bento .s4,.bento .s6,.bento .s7{grid-column:auto;grid-row:auto}
  .bento .s3{grid-column:auto;grid-row:auto/span 2}
  .bento .s5{grid-column:1/3;grid-row:auto}
  .split,.twocol,.pedido-grid,.phero .wrap{grid-template-columns:1fr}
  .stick,.twocol h2,.pedido .form{position:static}
  .mas .col:nth-child(2){margin-top:40px}
  .phero .shell{display:none}
  .row{grid-template-columns:1fr;gap:10px}
  footer .wrap{grid-template-columns:1fr}
  .lb figure{grid-template-columns:1fr;gap:16px}
  .lb img{max-height:54vh}
  .band::after{background:linear-gradient(0deg,rgba(10,20,48,.95) 30%,rgba(10,20,48,.35))}
}
@media (max-width:560px){
  body{font-size:17px}
  .picks{grid-template-columns:repeat(2,1fr)}
  .two{grid-template-columns:1fr}
  .pedido .form{padding:22px}
  .mas{gap:10px}.mas .col{gap:10px}
  .fab span{display:none}.fab{padding:16px}
  .btn{padding-left:22px}
}
@media (prefers-reduced-motion:reduce){
  *{scroll-behavior:auto!important}
  .js .rv{opacity:1;transform:none;filter:none;transition:none}
  .sheet a{transition:none}
}

/* ===== versão J: bolos recortados, topo cenográfico, montra horizontal ===== */
.btn-ink{background:#0A1430;color:#F2EEE6}
.btn-ink .ar{background:rgba(242,238,230,.14)}
.btn-ink:hover{background:#13245a}

/* topo */
.hero2{min-height:100dvh;position:relative;overflow:clip;display:grid;align-items:center;padding:96px 0 40px;isolation:isolate}
.hero2::before{content:"";position:absolute;right:-8%;top:50%;width:min(70vw,98dvh);aspect-ratio:1;transform:translateY(-50%);border-radius:50%;background:radial-gradient(circle,rgba(212,174,104,.2),rgba(212,174,104,.06) 40%,transparent 62%);z-index:-1;pointer-events:none}
.hcopy{position:relative;z-index:1;width:100%}
.hcopy h1{font-size:clamp(56px,min(9.4vw,15.5dvh),152px);line-height:.92;letter-spacing:-.032em;margin:0 0 28px;max-width:7ch}
.hcopy p{font-size:clamp(17px,1.4vw,20px);color:var(--muted);max-width:36ch;margin-bottom:36px}
.hcopy .acts{display:flex;flex-wrap:wrap;gap:12px}
.stage{position:absolute;right:max(2vw,0px);top:52%;transform:translateY(-50%);width:min(52vw,86dvh,780px);aspect-ratio:1;z-index:2;pointer-events:none}
.stage .ring{position:absolute;inset:3%;width:94%;height:94%;animation:spin 70s linear infinite;opacity:.8}
.stage .ring text{font:500 13.6px var(--f-body);letter-spacing:.34em;fill:var(--gold)}
.px{position:absolute;transform:translate3d(calc(var(--mx,0)*var(--k)*1px),calc(var(--my,0)*var(--k)*1px),0);transition:transform .9s var(--ease)}
.ck{display:block;width:100%;height:auto;filter:drop-shadow(0 34px 38px rgba(0,0,0,.55)) drop-shadow(0 4px 8px rgba(0,0,0,.35))}
.px.m{left:21%;top:7%;width:58%}
.px.l{left:-1%;bottom:7%;width:30%}
.px.r{right:0;top:12%;width:25%}
.px.b{right:11%;bottom:-3%;width:34%}
.px.m .ck{animation:floatm 9s var(--ease) infinite}
.px.l .ck{animation:floatl 11s var(--ease) infinite}
.px.r .ck{animation:floatr 10s var(--ease) infinite}
.px.b .ck{animation:floatb 12s var(--ease) infinite}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes floatm{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-14px) rotate(.6deg)}}
@keyframes floatl{0%,100%{transform:rotate(-9deg) translateY(0)}50%{transform:rotate(-7deg) translateY(-16px)}}
@keyframes floatr{0%,100%{transform:rotate(7deg) translateY(0)}50%{transform:rotate(9deg) translateY(-12px)}}
@keyframes floatb{0%,100%{transform:rotate(-5deg) translateY(0)}50%{transform:rotate(-3deg) translateY(-18px)}}

/* montra horizontal */
.vit{padding-block:var(--sec) clamp(56px,7vw,96px)}
.vit-head{display:flex;justify-content:space-between;align-items:end;gap:24px;margin-bottom:clamp(28px,4vw,52px)}
.vit-head h2{font-size:clamp(44px,6vw,92px);letter-spacing:-.022em}
.vit-ctl{display:flex;gap:10px;flex:none}
.vit-ctl button{width:56px;height:56px;border-radius:50%;border:1px solid rgba(242,238,230,.28);background:rgba(242,238,230,.05);color:var(--ink);font-size:22px;cursor:pointer;display:grid;place-items:center;transition:background .5s var(--ease),transform .5s var(--ease)}
.vit-ctl button:hover{background:rgba(242,238,230,.14)}
.vit-ctl button:active{transform:scale(.94)}
.vit-track{display:flex;gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;padding:0 var(--pad) 20px;scroll-padding-inline:var(--pad);scrollbar-width:none;cursor:grab;overscroll-behavior-x:contain}
.vit-track::-webkit-scrollbar{display:none}
.vit-track.drag{cursor:grabbing;scroll-snap-type:none}
.slide{position:relative;flex:none;width:min(88vw,1060px);height:clamp(520px,76dvh,740px);border-radius:40px;overflow:hidden;scroll-snap-align:center;display:grid;grid-template-columns:1.05fr .95fr;align-items:center;padding:clamp(28px,4vw,60px);isolation:isolate;--ink:#F2EEE6;--muted:rgba(242,238,230,.72);color:var(--ink)}
.slide.navy{background:#14234B}
.slide.navy2{background:#1B2D63}
.slide.gold{background:#D4AE68;--ink:#0A1430;--muted:rgba(10,20,48,.72)}
.slide.cream{background:#EFE8DA;--ink:#0A1430;--muted:rgba(10,20,48,.7)}
.slide .bgword{position:absolute;left:-2%;bottom:-8%;font:500 clamp(140px,22vw,340px)/.8 var(--f-display);letter-spacing:-.04em;white-space:nowrap;opacity:.12;z-index:-1;color:var(--ink);pointer-events:none}
.slide{grid-template-rows:minmax(0,1fr)}.slide .cutimg{width:100%;height:100%;min-height:0;object-fit:contain;filter:drop-shadow(0 30px 34px rgba(0,0,0,.45));justify-self:center;pointer-events:none;user-select:none}
.slide .info{display:grid;gap:16px;align-content:center;justify-items:start}
.slide .info h3{font-size:clamp(34px,4.2vw,64px);line-height:1}
.slide .info p{color:var(--muted);max-width:30ch;font-size:17.5px}
.slide.rev .cutimg{order:2}
.slide.rev{grid-template-columns:.95fr 1.05fr}
.slide.rev .info{order:1}
@supports (animation-timeline:view()){
  @media (prefers-reduced-motion:no-preference){
    .slide .cutimg{animation:slidepar linear both;animation-timeline:view(inline);animation-range:cover 0% cover 100%}
    .slide .bgword{animation:wordpar linear both;animation-timeline:view(inline);animation-range:cover 0% cover 100%}
    @keyframes slidepar{from{transform:translateX(60px) scale(.92)}50%{transform:none}to{transform:translateX(-60px) scale(.92)}}
    @keyframes wordpar{from{transform:translateX(90px)}to{transform:translateX(-90px)}}
  }
}

/* páginas interiores com bolo recortado */
.phero .pcut{width:100%;max-height:72dvh;object-fit:contain;filter:drop-shadow(0 40px 44px rgba(0,0,0,.55));animation:floatm 10s var(--ease) infinite}

@media (max-width:980px){
  .hero2{padding-top:92px;align-items:start}
  .hcopy h1{font-size:clamp(64px,19vw,110px);margin-bottom:22px}
  .stage{position:relative;right:auto;top:auto;transform:none;width:min(94vw,520px);margin:34px auto 0;z-index:0}
  .hero2{display:flex;flex-direction:column}
  .hero2 .wrap.hcopy{order:1}
  .hero2 .stage{order:2}
  .hero2::before{right:-30%;top:62%}
  .px{transform:none!important}
  .slide{grid-template-columns:1fr;grid-template-rows:1fr auto;height:auto;min-height:540px;width:86vw}
  .slide.rev{grid-template-columns:1fr}
  .slide.rev .cutimg,.slide.rev .info{order:0}
  .slide .cutimg{height:300px;max-height:300px}
  .vit-head{align-items:center}
  .vit-ctl button{width:48px;height:48px}
}
@media (prefers-reduced-motion:reduce){
  .stage .ring,.px .ck,.phero .pcut{animation:none}
  .px{transition:none}
}

/* ===== versão K: base marfim quente; o azul da marca só em texto, botões, rodapé e um painel ===== */
:root{
  --bg:#F6F0E6;--bg2:#EEE4D3;--bg3:#E7DAC4;
  --ink:#1B2A52;--muted:rgba(27,42,82,.72);--faint:rgba(27,42,82,.5);
  --gold:#94622A;
  --line:rgba(27,42,82,.14);--glass:rgba(27,42,82,.04);
  color-scheme:light;
}
html,body{background:var(--bg)}
body::after{opacity:.05;mix-blend-mode:multiply}

/* botões */
.btn-light{background:var(--ink);color:#F6F0E6}
.btn-light .ar{background:rgba(246,240,230,.16)}
.btn-light:hover{background:#27397a}
.btn-ghost{color:var(--ink);border-color:rgba(27,42,82,.34)}
.btn-ghost .ar{background:rgba(27,42,82,.07)}
.btn-ghost:hover{border-color:var(--ink);background:rgba(27,42,82,.05)}
.btn-ink{background:#1B2A52;color:#F6F0E6}
.btn-ink .ar{background:rgba(246,240,230,.16)}
.btn-cream{background:#F6F0E6;color:#1B2A52}
.btn-cream .ar{background:rgba(27,42,82,.1)}
.btn-cream:hover{background:#fff}
.link{border-bottom-color:rgba(27,42,82,.35)}
.link:hover{border-color:var(--gold)}

/* navegação */
.nav{background:rgba(246,240,230,.7);border-color:rgba(27,42,82,.12);box-shadow:inset 0 1px 0 rgba(255,255,255,.6),0 10px 30px -18px rgba(27,42,82,.3)}
.nav.solid{background:rgba(246,240,230,.9)}
.nav ul a:hover{background:rgba(27,42,82,.06)}
.burger{background:rgba(27,42,82,.08)}
.sheet{background:rgba(246,240,230,.95)}

/* topo e bolos recortados */
.hero2::before{background:radial-gradient(circle,rgba(214,160,92,.30),rgba(214,160,92,.1) 40%,transparent 62%)}
.stage .ring text{fill:#94622A}
.ck{filter:drop-shadow(0 30px 28px rgba(70,40,12,.30)) drop-shadow(0 4px 8px rgba(70,40,12,.18))}
.slide .cutimg,.phero .pcut{filter:drop-shadow(0 28px 28px rgba(60,35,10,.34))}
.phero::before{background:radial-gradient(circle,rgba(214,160,92,.22),transparent 62%)}

/* molduras e cartões */
.core{box-shadow:inset 0 1px 1px rgba(255,255,255,.5);background:var(--bg3)}
.shell{background:rgba(255,255,255,.4)}
.bento .cell:hover .shell,.mas button:hover .shell,.mason button:hover .shell{border-color:rgba(148,98,42,.5)}

/* painéis da montra: ambientes quentes */
.slide{color:var(--ink)}
.slide.cocoa{background:#3A2A22;--ink:#F6F0E6;--muted:rgba(246,240,230,.74);--gold:#E2BC7A}
.slide.rose{background:#E9CBC5;--ink:#2A2144;--muted:rgba(42,33,68,.72)}
.slide.blue{background:#1B2A52;--ink:#F6F0E6;--muted:rgba(246,240,230,.74);--gold:#E2BC7A}
.slide.caramel{background:#D9A765;--ink:#2B1B0E;--muted:rgba(43,27,14,.74)}
.slide.sand{background:#E7DAC4;--ink:#1B2A52;--muted:rgba(27,42,82,.72)}
.slide .bgword{opacity:.13}
.vit-ctl button{border-color:rgba(27,42,82,.3);background:rgba(27,42,82,.04)}
.vit-ctl button:hover{background:rgba(27,42,82,.1)}

/* banda do Natal fica escura (um bloco de cor) */
.band{--ink:#F6F0E6;--muted:rgba(246,240,230,.84);--gold:#E2BC7A;color:#F6F0E6}
.band .btn-light{background:#F6F0E6;color:#1B2A52}
.band .btn-light .ar{background:rgba(27,42,82,.1)}
.band .days{border-color:rgba(246,240,230,.4)}

/* faixas e formulário */
.slim{background:var(--bg2)}
.pedido .form{background:#FBF7EF;box-shadow:inset 0 1px 1px rgba(255,255,255,.7),0 20px 50px -30px rgba(27,42,82,.25)}
.opt span{border-color:rgba(27,42,82,.24)}
.opt input:checked+span{background:var(--ink);color:#F6F0E6;border-color:var(--ink)}
.field input,textarea{background:rgba(27,42,82,.04);border-color:rgba(27,42,82,.22);color-scheme:light}
.pick .ck{background:var(--ink);color:#F6F0E6}
.pick[aria-pressed="true"]{border-color:var(--ink)}
input[type=range]{accent-color:#94622A}

/* vista ampliada continua escura (foco na foto) */
.lb{--ink:#F6F0E6;--muted:rgba(246,240,230,.74);--faint:rgba(246,240,230,.5);--gold:#E2BC7A}
.lb .btn-light{background:#F6F0E6;color:#1B2A52}
.lb .btn-light .ar{background:rgba(27,42,82,.1)}
.lb .x,.lb .nv{color:#F6F0E6}

/* rodapé azul da marca */
footer{background:#14224A;border-top:0;--ink:#F6F0E6;--muted:rgba(246,240,230,.72);--faint:rgba(246,240,230,.5);--line:rgba(246,240,230,.16);color:#F6F0E6}
.fab{background:#1B2A52;color:#F6F0E6}

/* ===== afinação (auditoria) ===== */
:root{--sec:clamp(72px,9vw,128px)}
body::after{mix-blend-mode:normal;opacity:.035}

/* bolachas num painel azul da marca: as caixas brancas e os laços azuis ganham contraste */
.bolpanel{margin:0 var(--pad);border-radius:44px;background:#1B2A52;padding:clamp(48px,7vw,110px) clamp(24px,5vw,80px);--ink:#F6F0E6;--muted:rgba(246,240,230,.78);--gold:#E2BC7A;--line:rgba(246,240,230,.14);color:var(--ink)}
.bolpanel .link{border-bottom-color:rgba(246,240,230,.4)}
.bolpanel .link:hover{border-color:var(--gold)}
.bolpanel .shell{background:rgba(246,240,230,.06);border-color:rgba(246,240,230,.16)}
.bolpanel .stick{top:130px}

/* como funciona: imagem fixa que muda com cada passo */
.story2 h2{font-size:clamp(44px,6vw,92px);margin-bottom:clamp(16px,3vw,40px)}
.s2grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,6vw,100px);align-items:start}
.s2frame{position:sticky;top:104px;height:min(calc(100dvh - 140px),680px)}
.s2frame .shell,.s2frame .core{height:100%}
.s2frame img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.06);transition:opacity 1s var(--ease),transform 1.6s var(--ease)}
.s2frame img.on{opacity:1;transform:none}
.s2steps{list-style:none;margin:0;padding:0}
.s2step{min-height:min(72dvh,620px);display:grid;align-content:center;gap:16px;padding:20px 0;opacity:.3;transition:opacity .8s var(--ease)}
.s2step.on{opacity:1}
.s2n{font:500 italic 24px/1 var(--f-display);color:var(--gold)}
.s2step h3{font-size:clamp(36px,4.4vw,64px)}
.s2step p{color:var(--muted);max-width:40ch;font-size:18px}
.s2m{display:none}

/* Natal: véu de cacau em vez de azul, a foto fica quente */
.band{margin-top:var(--sec)}
.band::after{background:linear-gradient(90deg,rgba(43,28,20,.94) 20%,rgba(43,28,20,.66) 50%,rgba(43,28,20,.12)),linear-gradient(0deg,rgba(43,28,20,.55),transparent 45%)}

/* sobre + pedido juntos */
.about .big{max-width:19ch}
.aboutcta{display:flex;flex-wrap:wrap;gap:20px 36px;align-items:center;margin-top:clamp(36px,5vw,56px)}
.aboutcta p{color:var(--muted);max-width:38ch;font-size:18px}
.allergy{margin-top:clamp(40px,5vw,64px)}

footer .logo img{height:96px}

@media (max-width:980px){
  .bolpanel{margin:0 12px;border-radius:30px;padding:48px 20px}
  .s2grid{grid-template-columns:1fr}
  .s2frame{display:none}
  .s2step{min-height:0;opacity:1;padding:0 0 48px}
  .s2m{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;border-radius:24px;margin-bottom:8px}
  .band::after{background:linear-gradient(0deg,rgba(43,28,20,.95) 32%,rgba(43,28,20,.35))}
}
@media (prefers-reduced-motion:reduce){.s2frame img,.s2step{transition:none}}
main>.band:first-child{margin-top:0}

/* sobre: o bolo de Kinder (visto de cima) a girar devagar ocupa o lado direito, até haver foto da Alexandra */
.aboutgrid{display:grid;grid-template-columns:1.25fr .75fr;gap:clamp(24px,5vw,80px);align-items:center}
.aboutpic img{width:100%;height:auto;filter:drop-shadow(0 30px 30px rgba(60,35,10,.3));animation:spin 90s linear infinite}
@media (max-width:980px){.aboutgrid{grid-template-columns:1fr}.aboutpic{max-width:320px;margin:0 auto}}
@media (prefers-reduced-motion:reduce){.aboutpic img{animation:none}}
/* Natal com a foto nova: o lado do texto fica bem escuro, a caixa aparece à direita */
.band::after{background:linear-gradient(90deg,rgba(38,24,17,.97) 0%,rgba(38,24,17,.9) 40%,rgba(38,24,17,.45) 62%,rgba(38,24,17,.08) 85%),linear-gradient(0deg,rgba(38,24,17,.5),transparent 40%)}
@media (max-width:980px){.band::after{background:linear-gradient(0deg,rgba(38,24,17,.96) 34%,rgba(38,24,17,.4))}}

/* as sombras dos bolos recortados já vêm desenhadas na imagem */
.ck,.slide .cutimg,.phero .pcut,.aboutpic img{filter:none!important}

/* topo, opção B: linha em versaletes por cima, título em duas linhas, texto mais legível */
.eyb{display:block;font:500 12px/1 var(--f-body);letter-spacing:.3em;text-transform:uppercase;color:#94622A;margin-bottom:26px}
.eyb i{font-style:normal;margin:0 .7em}
.hcopy h1{font-size:clamp(46px,min(5.8vw,10.4dvh),100px);line-height:1.04;max-width:none;letter-spacing:-.02em;margin-bottom:26px}
.hcopy p{font-size:19px;color:var(--muted);max-width:36ch}
@media (max-width:1100px){.hcopy h1{font-size:clamp(40px,11.5vw,64px)}.eyb{font-size:10.5px;letter-spacing:.22em;margin-bottom:18px}}
/* ===== versão M: cabeçalho de "maison" (logótipo ao centro, versaletes espaçados, sem pílula) ===== */
html{scroll-padding-top:130px}
.mtop{position:fixed;top:0;left:0;right:0;z-index:60;color:var(--ink);transition:background .6s var(--ease),box-shadow .6s var(--ease)}
.annc{margin:0;text-align:center;font:500 11px/1 var(--f-body);letter-spacing:.24em;text-transform:uppercase;padding:11px 16px;background:#1B2A52;color:#F2EAD9;transition:margin .6s var(--ease),opacity .4s var(--ease)}
.annc span{color:#D9B36A;margin:0 .8em}
.mbar{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:24px;height:112px;padding:0 var(--pad);border-bottom:1px solid transparent;transition:height .6s var(--ease),border-color .6s var(--ease)}
.ml,.mr{display:flex;gap:clamp(20px,2.8vw,44px);align-items:center}
.mr{justify-content:flex-end}
.ml a,.mr a{font:500 12px/1 var(--f-body);letter-spacing:.22em;text-transform:uppercase;text-decoration:none;color:inherit;opacity:.8;padding:8px 0;position:relative;white-space:nowrap;transition:opacity .4s var(--ease),background .5s var(--ease),color .5s var(--ease)}
.ml a::after,.mr a::after{content:"";position:absolute;left:0;right:0;bottom:2px;height:1px;background:currentColor;transform:scaleX(0);transform-origin:right;transition:transform .7s var(--ease)}
.ml a:hover,.mr a:hover,.ml a[aria-current="page"],.mr a[aria-current="page"]{opacity:1}
.ml a:hover::after,.mr a:hover::after,.ml a[aria-current="page"]::after,.mr a[aria-current="page"]::after{transform:scaleX(1);transform-origin:left}
.mr a.menc{opacity:1;border:1px solid currentColor;padding:13px 22px;border-radius:999px}
.mr a.menc::after{display:none}
.mr a.menc:hover{background:var(--ink);color:var(--bg)}
.mlogo{display:block;justify-self:center}
.mlogo img{height:84px;width:auto;display:block;transition:height .6s var(--ease)}
.mlogo .lg-gold{display:none}
.mwa{display:none}
.mbar .burger{display:none}
.mtop.solid{background:rgba(246,240,230,.94);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:0 12px 30px -24px rgba(27,42,82,.35)}
.mtop.solid .annc{margin-top:-33px;opacity:0}
.mtop.solid .mbar{height:76px;border-bottom-color:rgba(27,42,82,.12)}
.mtop.solid .mlogo img{height:52px}

/* página que começa num bloco escuro (Natal): cabeçalho claro até rolar */
.darktop .mtop:not(.solid){color:#F6F0E6}
.darktop .mtop:not(.solid) .lg-blue{display:none}
.darktop .mtop:not(.solid) .lg-gold{display:block}
.darktop .mtop:not(.solid) .mr a.menc:hover{background:#F6F0E6;color:#1B2A52}
.darktop .mtop:not(.solid) .mwa{background:rgba(246,240,230,.14);color:#F6F0E6}

/* espaço para o cabeçalho mais alto */
.hero2{padding-top:168px}
.phero{padding-top:clamp(200px,20vw,250px)}
.sheet{padding-top:150px}

@media (max-width:1100px){
  .ml,.mr{display:none}
  .mbar{grid-template-columns:48px 1fr 48px;height:84px;padding:0 16px}
  .mbar .burger{display:block;grid-column:1}
  .mlogo{grid-column:2}
  .mlogo img{height:58px}
  .mwa{display:grid;place-items:center;grid-column:3;width:46px;height:46px;border-radius:50%;background:rgba(27,42,82,.08);color:inherit;font-size:22px;text-decoration:none}
  .mtop.solid .mbar{height:66px}
  .mtop.solid .mlogo img{height:42px}
  .mtop.solid .annc{margin-top:-30px}
  .annc{font-size:9.5px;letter-spacing:.16em;padding:10px 12px}
  .hero2{padding-top:132px}
  .phero{padding-top:150px}
}

/* afinação: logótipo maior no topo, título do topo um pouco menor para os botões ficarem à vista */
.mlogo img{height:96px}
.mtop.solid .mlogo img{height:54px}
.hero2{padding-top:156px}
.hcopy h1{font-size:clamp(54px,min(8.6vw,13.2dvh),146px)}
@media (max-width:1100px){.mlogo img{height:60px}.mtop.solid .mlogo img{height:42px}.hcopy h1{font-size:clamp(56px,17vw,96px)}}

.annc b{font-weight:inherit}
/* página que começa na banda escura: o texto desce para não ficar debaixo do cabeçalho */
main>.band:first-child .wrap{padding-top:clamp(170px,18vw,210px)}
@media (max-width:560px){.annc span,.annc .a2{display:none}}

.darktop .mtop:not(.solid) .burger{background:rgba(246,240,230,.14);color:#F6F0E6}

/* logótipo do cabeçalho em texto, nas letras da marca: o "ARTESANAL" fica legível */
.mlogo{display:grid;justify-items:center;text-decoration:none;color:inherit;line-height:1}
.mlogo .lsym img{height:40px;width:auto;display:block;transition:height .6s var(--ease)}
.mlogo .lsym .lg-gold{display:none}
.mlogo b{font:500 25px/1 var(--f-display);letter-spacing:.01em;margin-top:6px;white-space:nowrap;transition:font-size .6s var(--ease)}
.mlogo i{font:500 10.5px/1 var(--f-body);font-style:normal;letter-spacing:.52em;margin:7px -.52em 0 0;text-transform:uppercase;color:#94622A;transition:font-size .6s var(--ease),margin .6s var(--ease)}
.mtop.solid .mlogo .lsym img{height:24px}
.mtop.solid .mlogo b{font-size:19px;margin-top:4px}
.mtop.solid .mlogo i{font-size:8.5px;margin-top:5px}
.darktop .mtop:not(.solid) .mlogo .lsym .lg-blue{display:none}
.darktop .mtop:not(.solid) .mlogo .lsym .lg-gold{display:block}
.darktop .mtop:not(.solid) .mlogo i{color:#E2BC7A}

/* o bolo do topo começa abaixo do cabeçalho (não passa por baixo dos menus) */
.stage{width:min(48vw,calc(100dvh - 196px),760px);top:calc(50% + 72px)}
@media (max-width:1100px){
  .mlogo .lsym img{height:30px}
  .mlogo b{font-size:19px;margin-top:4px}
  .mlogo i{font-size:8.5px;letter-spacing:.42em;margin:5px -.42em 0 0}
  .mtop.solid .mlogo .lsym img{height:22px}
  .mtop.solid .mlogo b{font-size:16px}
  .mtop.solid .mlogo i{font-size:7.5px}
  .stage{width:min(94vw,520px);top:auto}
}
/* topo: o conjunto de bolos fica junto (como antes), um pouco maior e centrado no lado direito, para não deixar vazio a meio */
@media (min-width:1101px){
  .stage{--sw:min(50vw,calc(100dvh - 176px),800px);width:var(--sw);right:auto;left:calc(68% - var(--sw) / 2);top:calc(50% + 78px)}
}
/* topo, opção B: linha em versaletes por cima, título em duas linhas, texto mais legível */
.eyb{display:block;font:500 12px/1 var(--f-body);letter-spacing:.3em;text-transform:uppercase;color:#94622A;margin-bottom:26px}
.eyb i{font-style:normal;margin:0 .7em}
.hcopy h1{font-size:clamp(46px,min(5.8vw,10.4dvh),100px);line-height:1.04;max-width:none;letter-spacing:-.02em;margin-bottom:26px}
.hcopy p{font-size:19px;color:var(--muted);max-width:36ch}
@media (max-width:1100px){.hcopy h1{font-size:clamp(40px,11.5vw,64px)}.eyb{font-size:10.5px;letter-spacing:.22em;margin-bottom:18px}}
/* ===== versão N: topo com uma fotografia real de todos os produtos numa mesa ===== */
.hero3{position:relative;min-height:100dvh;display:grid;align-items:center;overflow:clip;isolation:isolate}
.h3img{position:absolute;inset:56px 0 0 0;z-index:-1}
.h3img img{width:100%;height:100%;object-fit:cover;object-position:70% 55%;
  -webkit-mask-image:linear-gradient(180deg,transparent 0,#000 16%);mask-image:linear-gradient(180deg,transparent 0,#000 16%)}
.hero3::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:linear-gradient(90deg,rgba(246,240,230,.72) 0%,rgba(246,240,230,.38) 30%,rgba(246,240,230,0) 50%)}
.h3copy{position:relative;width:100%;padding-top:140px;padding-bottom:40px}
.h3copy h1{font-size:clamp(46px,min(5.6vw,10dvh),98px);line-height:1.04;letter-spacing:-.02em;margin:0 0 26px;max-width:12ch}
.h3copy p{font-size:19px;color:var(--muted);max-width:32ch;margin-bottom:36px}
.h3copy .acts{display:flex;flex-wrap:wrap;gap:12px}
@media (prefers-reduced-motion:no-preference){
  .h3img img{animation:kb 22s var(--ease) both}
  @keyframes kb{from{transform:scale(1.07)}to{transform:scale(1)}}
}
@media (max-width:1100px){
  .hero3{display:flex;flex-direction:column;min-height:0}
  .hero3::after{display:none}
  .h3copy{order:1;padding-top:130px;padding-bottom:28px}
  .h3copy h1{font-size:clamp(40px,11.5vw,64px)}
  .h3img{order:2;position:relative;inset:auto;aspect-ratio:5/4;width:100%}
  .h3img img{object-position:100% 62%;-webkit-mask-image:none;mask-image:none}
}

/* a foto ocupa a direita e funde-se no marfim à esquerda: os produtos nunca ficam por baixo do texto */
@media (min-width:1101px){
  .h3img{inset:56px 0 0 30%}
  .h3img img{object-position:62% 55%;
    -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 24%),linear-gradient(180deg,transparent 0,#000 14%);
    -webkit-mask-composite:source-in;
    mask-image:linear-gradient(90deg,transparent 0,#000 24%),linear-gradient(180deg,transparent 0,#000 14%);
    mask-composite:intersect}
  .hero3::after{display:none}
}
/* ===== coerência com o cabeçalho: botões em versaletes, sem seta em círculo; molduras direitas ===== */
.btn{gap:0;padding:18px 30px;font:500 12.5px/1 var(--f-body);letter-spacing:.2em;text-transform:uppercase}
.btn .ar{display:none}
.btn.sm{padding:14px 22px;font-size:11.5px}
.btn-ghost{padding-left:30px}
.send .btn{padding:20px 30px}
.lb .btn{padding:18px 30px}
.phero .shell{transform:none;aspect-ratio:4/5}
.aboutpic img{animation:none}
.aboutpic .shell{aspect-ratio:4/3}
.aboutpic .core{height:100%}
.aboutpic .core img{width:100%;height:100%;object-fit:cover}
@media (max-width:1100px){.aboutpic{max-width:none}}
/* ===== revisão final ===== */
.h3copy h1{max-width:none}
.pick img{height:auto}
@media (min-width:1101px){.phero{padding-top:176px}}
.flogo{display:inline-grid;justify-items:center;text-decoration:none;color:#F6F0E6;line-height:1;margin-bottom:22px}
.flogo img{height:40px;width:auto;display:block}
.flogo b{font:500 25px/1 var(--f-display);margin-top:7px;white-space:nowrap}
.flogo i{font:500 10.5px/1 var(--f-body);font-style:normal;letter-spacing:.52em;margin:8px -.52em 0 0;text-transform:uppercase;color:#E2BC7A}
footer .logo img{height:40px;margin:0}
.fab{font:500 12px/1 var(--f-body);letter-spacing:.16em;text-transform:uppercase;padding:15px 22px 15px 18px}

/* sobre com retrato e texto dela */
@media (min-width:981px){.aboutgrid{grid-template-columns:1.1fr .9fr;align-items:start}}
.aboutpic .shell{aspect-ratio:4/5}
.aboutpic .core img{object-position:50% 30%}
.aboutpic{position:sticky;top:110px}
.about .bio{margin-top:26px;max-width:56ch}
.about .bio p{font-size:18px;line-height:1.65;color:var(--muted);margin:0 0 16px}
@media (max-width:980px){.aboutpic{position:static;width:100%;max-width:380px;margin:0 auto}}

/* ===== Monte a sua caixa ===== */
.cx{padding:var(--sec) var(--pad);background:#F1EBE0}
.cx-wrap{max-width:1320px;margin:0 auto;display:grid;grid-template-columns:1.08fr .92fr;gap:clamp(28px,5vw,88px);align-items:start}
.cx-left{position:sticky;top:88px}
.cx-stage{position:relative;aspect-ratio:1;width:min(100%,640px,calc(100svh - 150px));margin:0 auto}
.cx-box{position:absolute;inset:0;width:100%;height:100%;-webkit-mask:linear-gradient(90deg,transparent,#000 14%,#000 86%,transparent),linear-gradient(180deg,transparent,#000 14%,#000 86%,transparent);-webkit-mask-composite:source-in;mask:linear-gradient(90deg,transparent,#000 14%,#000 86%,transparent),linear-gradient(180deg,transparent,#000 14%,#000 86%,transparent);mask-composite:intersect}
.cx-grid{position:absolute;left:23.6%;top:23.5%;width:52.8%;height:53.2%;display:grid;grid-template-columns:repeat(var(--n),1fr);grid-template-rows:repeat(var(--n),1fr);gap:1.2%}
.cx-slot{position:relative;border:0;padding:0;background:none;cursor:default;border-radius:50%}
.cx-slot:not(.on)::after{content:"";position:absolute;inset:18%;border-radius:50%;border:1.5px dashed rgba(27,42,82,.14)}
.cx-slot.on{cursor:pointer}
.cx-slot img{position:absolute;inset:-3%;width:106%;height:106%;object-fit:contain;transform:translate(var(--x),var(--y)) rotate(var(--r));filter:drop-shadow(0 4px 5px rgba(40,25,10,.32)) drop-shadow(0 1px 1px rgba(40,25,10,.25));transition:transform .4s var(--ease),opacity .2s}
.cx-slot.on:hover img{transform:translate(var(--x),var(--y)) rotate(var(--r)) scale(.94)}
.cx-slot.land img{animation:cxland .4s var(--ease)}
@keyframes cxland{40%{transform:translate(var(--x),var(--y)) rotate(var(--r)) scale(.92)}}
.cx-fly{position:fixed;z-index:200;pointer-events:none;object-fit:contain;transform-origin:center}
.cx-stage.nope{animation:cxnope .45s}
@keyframes cxnope{20%,60%{transform:translateX(-7px)}40%,80%{transform:translateX(7px)}}
/* laço */
.cx-rib{position:absolute;left:19.1%;top:18.7%;width:62%;height:62.9%;pointer-events:none}
.cx-rib i{position:absolute;background:linear-gradient(90deg,#141F3F,#25376A 30%,#1B2A52 52%,#30447A 70%,#141F3F);box-shadow:0 3px 6px rgba(10,15,35,.35)}
.cx-rib .h{left:-1%;right:-1%;top:46%;height:7%;transform:scaleX(0);transform-origin:left;background:linear-gradient(180deg,#141F3F,#2B3F74 35%,#1B2A52 55%,#33477E 75%,#141F3F)}
.cx-rib .v{top:-1%;bottom:-1%;left:46%;width:7%;transform:scaleY(0);transform-origin:top}
.cx-seal{position:absolute;left:50%;top:50%;width:30%;aspect-ratio:1;border-radius:50%;background:#1B2A52;border:2px solid #C9A25E;box-shadow:0 0 0 4px #1B2A52,0 6px 14px rgba(10,15,35,.4);display:grid;place-content:center;justify-items:center;gap:4%;transform:translate(-50%,-50%) scale(0) rotate(-30deg)}
.cx-seal img{width:40%}
.cx-seal small{font:500 clamp(6px,.82vw,10.5px)/1.15 var(--f-display);color:#E2BC7A;letter-spacing:.03em;text-align:center}.cx-seal small i{display:block;font:500 .62em/1.6 var(--f-body);letter-spacing:.28em;font-style:normal}
.cx-box{transition:opacity .6s ease}.cx-box2{opacity:0}.cx-stage.full .cx-box2{opacity:1}.cx-stage.full .cx-box:not(.cx-box2){opacity:0}
.cx-stage.full .cx-rib .h{transform:scaleX(1);transition:transform .55s var(--ease) .1s}
.cx-stage.full .cx-rib .v{transform:scaleY(1);transition:transform .55s var(--ease) .45s}
.cx-stage.full .cx-seal{transform:translate(-50%,-50%) scale(1) rotate(0);transition:transform .7s cubic-bezier(.34,1.56,.64,1) .85s}
.cx-count{position:relative;z-index:2;text-align:center;margin-top:14px;color:var(--muted);font-size:16px}
.cx-count b{color:var(--ink);font-weight:500}
.cx-count em{font-style:normal}
.is-full .cx-count em{color:var(--gold);font-weight:500}
/* lado direito */
.cx-right h2{font-size:clamp(44px,5.6vw,80px);margin:8px 0 18px}
.cx-lede{color:var(--muted);max-width:46ch}
.cx-size{display:flex;gap:8px;margin:28px 0 22px;flex-wrap:wrap}
.cx-size button{font:500 15px/1 var(--f-body);color:var(--ink);background:none;border:1px solid rgba(27,42,82,.2);border-radius:999px;padding:12px 18px;cursor:pointer;transition:background .3s,color .3s,border-color .3s}
.cx-size button small{opacity:.6;margin-left:4px;font-size:13px}
.cx-size button[aria-pressed=true]{background:#1B2A52;color:#F6F0E6;border-color:#1B2A52}
.cx-picks{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.cx-pick{position:relative;display:grid;justify-items:center;gap:6px;padding:12px 8px 12px;border-radius:20px;border:1px solid rgba(27,42,82,.1);background:rgba(255,255,255,.45);cursor:pointer;font:400 13.5px/1.25 var(--f-body);color:var(--ink);text-align:center;transition:transform .35s var(--ease),background .3s,border-color .3s,box-shadow .3s}
.cx-pick:hover{transform:translateY(-3px);background:#fff;box-shadow:0 14px 26px -16px rgba(40,25,10,.35)}
.cx-pick:active{transform:scale(.96)}
.cx-pick.has{border-color:rgba(201,162,94,.6);background:#fff}
.cx-pimg{width:min(84px,80%);aspect-ratio:1}
.cx-pimg img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 4px 5px rgba(40,25,10,.25));transition:transform .5s var(--ease)}
.cx-pick:hover .cx-pimg img{transform:rotate(-12deg) scale(1.06)}
.cx-pq{position:absolute;top:8px;right:10px;font:600 12px/1 var(--f-body);color:#9A7432}
.cx-tools{display:flex;gap:20px;margin:14px 2px 0}
.cx-tools button{background:none;border:0;padding:4px 0;font:500 14px/1 var(--f-body);color:var(--muted);cursor:pointer;border-bottom:1px solid rgba(27,42,82,.25)}
.cx-tools button:hover{color:var(--ink);border-color:var(--ink)}
.cx-sum{margin-top:26px;padding-top:22px;border-top:1px solid rgba(27,42,82,.12)}
.cx-list{list-style:none;margin:0 0 20px;padding:0;display:flex;flex-wrap:wrap;gap:6px 18px;font-size:15px;color:var(--muted);min-height:24px}
.cx-list b{color:var(--ink);font-weight:500}
.cx-cta.off{opacity:.38;cursor:not-allowed}
.is-full .cx-cta{animation:cxpulse 1.6s var(--ease) 1.4s 2}
@keyframes cxpulse{50%{box-shadow:0 0 0 10px rgba(27,42,82,.12)}}
.cx-note{margin-top:14px;font-size:14px;color:var(--faint)}
@media (max-width:980px){
  .cx-wrap{grid-template-columns:1fr}
  .cx-left{position:sticky;top:64px;z-index:5;background:#F1EBE0;margin:0 calc(-1*var(--pad));padding:8px var(--pad) 4px;border-bottom:1px solid rgba(27,42,82,.08)}
  .cx-left{overflow:hidden}
  .cx-stage{--s:min(124vw,60svh);width:var(--s);margin:calc(var(--s)*-.13) 0 calc(var(--s)*-.13) calc(50% - var(--s)/2)}
  .cx-count{margin-top:4px;font-size:14px}
  .cx-right{order:2}
  .cx-pick{font-size:12.5px;border-radius:16px;padding:10px 4px}
}
@media (prefers-reduced-motion:reduce){.cx-rib *,.cx-seal{transition:none!important}.cx-slot.land img{animation:none}}
.cx-count a{color:var(--ink);text-underline-offset:3px}

/* caixa: dados do pedido (data, entrega, nome, alergias) */
.cx-form{display:grid;gap:16px;margin:4px 0 22px}
.cx-f{display:grid;gap:7px}
.cx-f>span{font:500 12px/1 var(--f-body);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.cx-f input{width:100%;min-height:46px;box-sizing:border-box;font:400 16px/1.2 var(--f-body);color:var(--ink);background:rgba(255,255,255,.55);border:1px solid rgba(27,42,82,.18);border-radius:12px;padding:10px 14px;transition:border-color .25s,background .25s}
.cx-f input:focus{outline:none;border-color:#1B2A52;background:#fff}
.cx-f small{font-size:13px;color:var(--faint)}
.cx-ent{display:flex;flex-wrap:wrap;gap:8px}
.cx-ent button{font:500 15px/1.2 var(--f-body);color:var(--ink);background:none;border:1px solid rgba(27,42,82,.2);border-radius:999px;padding:12px 18px;cursor:pointer;transition:background .3s,color .3s,border-color .3s}
.cx-ent button[aria-pressed=true]{background:#1B2A52;color:#F6F0E6;border-color:#1B2A52}
.cx-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.cx-f.bad input,.cx-f.bad .cx-ent button{border-color:#A3342B}
.cx-why{margin:12px 0 0;font-size:14px;color:#A3342B;min-height:0}
.cx-why:empty{display:none}
@media (max-width:560px){.cx-row{grid-template-columns:1fr}}

/* bacalhau (foto real + preços) */
.bac .wrap{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,5vw,80px);align-items:center}
.bac-img{margin:0}
.bac-img img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;border-radius:22px;box-shadow:0 30px 60px -36px rgba(40,25,10,.45)}
.bac-tx h2{max-width:14ch}
.bac-pr{list-style:none;margin:26px 0 28px;padding:0;max-width:340px}
.bac-pr li{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:12px 0;border-bottom:1px solid rgba(27,42,82,.14)}
.bac-pr li:first-child{border-top:1px solid rgba(27,42,82,.14)}
.bac-pr span{color:var(--muted)}
.bac-pr b{font:500 26px/1 var(--f-display);color:var(--ink);font-variant-numeric:lining-nums}
.bac-acts{display:flex;flex-wrap:wrap;gap:10px}
.bac-more{display:inline-flex;margin-top:22px}
@media (max-width:820px){.bac .wrap{grid-template-columns:1fr}.bac-acts .btn{flex:1 1 100%;justify-content:center}}

/* ===== acabamento final (07-11) ===== */
/* itálico dourado só no título principal de cada página e na frase do "Sobre"; nos restantes fica itálico na cor do texto */
h2 em{color:inherit}
h3 em{font-style:normal;color:inherit}
.s2n{font:500 12px/1.6 var(--f-body);letter-spacing:.18em;text-transform:uppercase;font-style:normal;color:var(--gold)}
/* palavra gigante atrás dos bolos da montra: decoração a mais, sai */
.slide .bgword{display:none}
/* chamada final mais contida */
.final h2{font-size:clamp(46px,6.4vw,104px)}
/* catálogo: grelha regular em vez de colunas desencontradas, todas as fotos no mesmo formato */
.mason{columns:auto;display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:28px 18px;align-items:start}
.mason button{margin:0}
.mason .shell{aspect-ratio:4/5}
.mason .core{height:100%}
.mason img{width:100%;height:100%;object-fit:cover;object-position:50% 50%}
.mason .nm{padding:16px 4px 6px;font-size:23px}
.mason .ds{padding:0 4px;font-size:15px}
@media (max-width:560px){
  .mason{grid-template-columns:1fr 1fr;gap:22px 10px}
  .mason .nm{font-size:18px;padding:10px 2px 4px}
  .mason .ds{font-size:13px;padding:0 2px;line-height:1.45}
}
/* fotografias reais do telemóvel (fundo cinzento e frio) aproximadas ao tom quente das restantes, só no ecrã */
img[src*="g-06-"],img[src*="g-12-"],img[src*="r-13-"]{filter:sepia(.14) saturate(1.06) brightness(1.03) contrast(1.02)}
img[src*="g-10-"],img[src*="g-11-"],img[src*="g-16-"]{filter:sepia(.06) saturate(1.04) contrast(1.02)}
/* contador da caixa legível por cima da imagem no telemóvel */
@media (max-width:980px){.cx-count{display:table;margin:4px auto 0;padding:5px 14px;border-radius:99px;background:rgba(241,235,224,.92)}}
/* botão principal do formulário de pedido */
.send .btn{gap:14px}
/* rodapé: identificação legal */
.flegal{grid-column:1/-1;margin-top:40px;padding-top:26px;border-top:1px solid var(--line);display:grid;gap:8px;font-size:14px;line-height:1.6;color:var(--faint)}
.flegal p{margin:0;max-width:96ch}
.flegal b{font-weight:500;color:var(--muted)}
.flegal a{color:var(--muted);text-decoration:underline;text-underline-offset:3px}
.flegal a.lre{display:inline-block;margin-top:2px;padding:8px 14px;border:1px solid var(--line);border-radius:99px;text-decoration:none;color:var(--ink)}
.flegal a.lre:hover{border-color:var(--ink)}
footer{padding-bottom:110px}
footer>.wrap+.wrap{display:block}
/* página 404 */
.nf{min-height:70vh;display:grid;align-content:center}
.nf h1{font-size:clamp(54px,8vw,120px);line-height:1;margin-bottom:20px}
.nf p{color:var(--muted);max-width:44ch;margin:0 0 30px}
.nf .acts{display:flex;flex-wrap:wrap;gap:12px}
.pedido .head .alt{margin-top:10px;font-size:16px;color:var(--muted)}
.pedido .head .alt a{color:var(--ink);text-underline-offset:3px}
.cx-f[hidden]{display:none}
@media (max-width:980px){.cx.cx-free .cx-left{position:relative;top:auto}}

/* ===== SEO fase 1 (07-11) ===== */
/* <picture> não mexe na disposição das imagens */
picture{display:contents}
/* título da vista ampliada (era um h3 vazio) */
.lb .lbt{font:500 clamp(34px,4vw,56px)/1.06 var(--f-display);letter-spacing:-.015em;margin:0}
/* linha de contexto dentro do H1 da inicial: mesmo aspeto que a linha que estava por cima */
.h1x .eyb{white-space:normal}
.h1x .h1t{display:block}
/* ligação entre páginas a seguir ao catálogo */
.xlink{margin:clamp(8px,2vw,20px) 0 0;font-size:17px;color:var(--muted)}
.xlink a{color:var(--ink);text-underline-offset:3px}
/* topo das subpáginas: o título aparece logo (conta para o LCP), mantendo um deslize curto de entrada */
.js .phero .rv{opacity:1;filter:none;transform:translateY(12px)}
.js .phero .rv.in{transform:none}

/* ===== FASE 2 (07-11): grupos 1 e 2 ===== */
/* Grupo 1. Enquadramento das fotografias reais nas grelhas. Os ficheiros não mudam e a vista ampliada mostra a foto inteira. */
.mason img[src*="g-06-"]{scale:1.398;transform-origin:38.6% 102.9%}
.mason img[src*="g-12-"]{scale:1.5;transform-origin:36.2% 102%}
.mason img[src*="g-10-"]{object-position:100% 50%}
.mason img[src*="g-11-"]{object-position:36.6% 50%}
.pick img[src*="g-10-"]{object-position:100% 50%}

/* Grupo 2. Contraste dos dourados pequenos (o dourado dos títulos grandes não muda) */
.eyb,.cx-pq{color:#8A5A22}
.is-full .cx-count em{color:#8A5A22}

/* Grupo 2. Legibilidade no telemóvel: só legendas e descrições de produtos, rótulos do formulário e a faixa de avisos */
@media (max-width:560px){
  .mason .ds{font-size:14.5px;line-height:1.45}
  .cx-pn{font-size:13.5px}
  .cx-f>span{font-size:13px}
  .annc{font-size:11px}
  .eyb{font-size:11.5px}
}

/* Grupo 2. Áreas de toque de pelo menos 44 px nas ligações e botões isolados (as ligações dentro de frases ficam como estão) */
@media (max-width:980px){
  footer li a{display:flex;align-items:center;min-height:44px}
  footer ul{gap:0}
  .crumbs a{display:inline-block;padding:12px 6px;margin:-12px -6px}
  .link{min-height:44px}
  .allergy summary{min-height:48px}
  .cx-tools button{padding:14px 0}
}

/* ===== FASE 3, GRUPO 3 (08-11): WhatsApp em ecras pequenos ===== */
/* O icone do cabecalho duplicava o botao flutuante: em ecras ate 1100 px fica so o flutuante. */
@media (max-width: 1100px) {
  .mwa { display: none; }
  .fab {
    right: max(16px, env(safe-area-inset-right, 0px));
    bottom: max(16px, calc(env(safe-area-inset-bottom, 0px) + 8px));
    transition: transform .6s var(--ease), opacity .4s var(--ease);
  }
  /* Esconde-se onde o conteudo ja tem o seu proprio botao (ver app.js). */
  .fab.fab-off {
    opacity: 0;
    transform: translateY(14px);
    pointer-events: none;
  }
}

/* ===== FASE 3, GRUPO 4 (08-11): bloco final e ligacao "Veja tambem" ===== */

/* Bloco "Para quando e a sua encomenda?": titulo a esquerda, texto e botao a direita. */
.final {
  padding-block: clamp(40px, 5vw, 72px) clamp(64px, 7vw, 104px);
}
.final .wrap {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
  column-gap: clamp(32px, 6vw, 96px);
  align-items: center;
  border-top: 1px solid var(--line);
  padding-top: clamp(36px, 4.5vw, 64px);
}
.final h2 {
  grid-column: 1;
  grid-row: 1 / span 2;
  margin: 0;
  font-size: clamp(38px, 4.6vw, 68px);
  line-height: 1.02;
  max-width: 12ch;
}
.final p {
  grid-column: 2;
  grid-row: 1;
  align-self: end;
  margin: 0 0 22px;
  font-size: 18px;
}
.final .wrap > div {
  grid-column: 2;
  grid-row: 2;
  align-self: start;
}
@media (max-width: 980px) {
  .final .wrap { grid-template-columns: 1fr; padding-top: 32px; }
  .final h2 { grid-column: 1; grid-row: auto; font-size: clamp(34px, 9vw, 46px); margin-bottom: 14px; max-width: 14ch; }
  .final p { grid-column: 1; grid-row: auto; margin: 0 0 20px; }
  .final .wrap > div { grid-column: 1; grid-row: auto; }
}

/* Ligacao "Veja tambem...": frase editorial junto ao catalogo, em vez de uma linha solta. */
.xlink {
  margin: calc(var(--sec) * -.6) 0 clamp(36px, 5vw, 72px);
  font: 500 clamp(21px, 2.3vw, 27px) / 1.35 var(--f-display);
  color: var(--muted);
  max-width: 44ch;
}
.xlink a {
  color: var(--ink);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 5px;
  text-decoration-color: rgba(27, 42, 82, .4);
  transition: text-decoration-color .4s var(--ease);
}
.xlink a:hover { text-decoration-color: var(--ink); }
@media (max-width: 980px) {
  .xlink { margin-top: -18px; }
  .xlink a { display: inline-block; padding-block: 10px; margin-block: -10px; }
}

/* ===== FASE 3, GRUPO 4 (correcao Bolachas) ===== */
/* Na Bolachas o "Veja tambem" vem logo a seguir ao painel azul: sem margem negativa, para nao ficar por baixo dele. */
.bolpanel + .wrap .xlink { margin-top: clamp(24px, 3vw, 40px); }

/* 10-11: rissois (fotos reais tratadas) */
.bac{flex-direction:column}
.slim.bac{display:block}
.ris{display:block!important;margin-top:clamp(56px,8vw,110px)}
.ris-hd{max-width:640px;margin-bottom:clamp(28px,4vw,48px)}
.ris-hd h2{font-size:clamp(34px,4.4vw,60px)}
.ris-hd p{color:var(--muted);margin-top:12px}
.ris-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2.4vw,32px)}
.ris-list figure{margin:0 0 16px}
.ris-list img{width:100%;height:auto;aspect-ratio:1/1;object-fit:cover;border-radius:22px;box-shadow:0 30px 60px -36px rgba(40,25,10,.45)}
.ris-list h3{font-size:clamp(26px,2.6vw,34px)}
.ris-list p{color:var(--muted);margin:6px 0 10px}
.ris-list .link{display:inline-flex;align-items:center;gap:8px;min-height:44px}
@media (max-width:820px){.ris-list{grid-template-columns:1fr 1fr}.ris-list li:last-child{grid-column:1/-1;max-width:calc(50% - 8px)}}
@media (max-width:520px){.ris-list{grid-template-columns:1fr}.ris-list li:last-child{max-width:none}}
/* 10-11: massas e recheios (texturas dos menus da Alexandra) */
.sab-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,5vw,80px)}
.sab-col h3{font-size:clamp(28px,3vw,40px);padding-bottom:16px;border-bottom:1px solid var(--line);margin-bottom:8px}
.sab-col ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:4px 24px}
.sab-col li{display:flex;align-items:center;gap:16px;padding:12px 0;font:500 clamp(20px,1.8vw,24px)/1.15 var(--f-display)}
.sab-col img{width:64px;height:64px;border-radius:50%;flex:none;box-shadow:0 10px 24px -14px rgba(0,0,0,.6)}
@media (max-width:820px){.sab-grid{grid-template-columns:1fr}}
@media (max-width:420px){.sab-col ul{grid-template-columns:1fr}}
select{width:100%;font:inherit;font-size:16px;color:var(--ink);background:rgba(242,238,230,.05);border:1px solid rgba(242,238,230,.2);border-radius:14px;padding:14px 16px;color-scheme:dark;min-height:52px}

/* 10-11: grupos da caixa (grelha de 6) + aviso de prazo */
.cx-picks{grid-template-columns:repeat(6,1fr)}
.cx-pick{grid-column:span 2}
.cx-grp{grid-column:1/-1;margin:10px 2px 0;font:600 11.5px/1.2 var(--f-body);letter-spacing:.14em;text-transform:uppercase;color:#8A5A22}
.cx-grp:first-child{margin-top:0}
.cx-pick.cx-gf{grid-column:span 3;grid-template-columns:auto 1fr;justify-items:start;align-items:center;text-align:left;gap:10px;padding:10px 26px 10px 10px}
.cx-pick.cx-gf .cx-pimg{width:64px}
.aviso-prazo{margin:8px 0 0;font-size:14px;line-height:1.45;color:#8A5A22}
@media (max-width:560px){
  .cx-grp{font-size:11px}
  .cx-pick.cx-gf{gap:8px;padding:8px 22px 8px 8px}
  .cx-pick.cx-gf .cx-pimg{width:52px}
}

/* 10-11: no computador o botao flutuante fica sempre visivel (canto inferior direito, 175 px + 20 px de margem).
   Reserva-se uma margem a direita da caixa para a grelha nunca passar por baixo dele. So acima de 1100 px
   (abaixo disso o botao ja se esconde sobre a caixa, ver app.js). A grelha e a disposicao nao mudam. */
@media (min-width:1101px){
  #caixa .cx-wrap{padding-right:max(0px,calc(216px - max(var(--pad),(100vw - 1320px)/2)))}
}

/* 11-11 ronda estetica */
/* 1) os cartoes da grelha sao <button>: sem isto o texto saia na letra do sistema (Arial) */
.mason button{font:inherit}
/* 2) fotos reais frias: aquecer (so cor, a comida nao e tocada) */
img[src*="g-07-"]{filter:sepia(.14) saturate(1.06) brightness(1.03) contrast(1.02)}
/* 3) carrossel dos bolos no computador: cartoes mais estreitos, ve-se mais do que um bolo */
@media (min-width:981px){
  .slide{width:min(58vw,780px);height:clamp(440px,60dvh,560px);padding:clamp(22px,2.4vw,38px);border-radius:32px}
  .slide .info h3{font-size:clamp(30px,2.7vw,44px)}
  .slide .info p{font-size:16px}
}
/* 4) Sobre: enquadramento mais fechado no retrato */
.aboutpic .core img{scale:1.32;transform-origin:50% 18%}
/* 5) telemovel, "Pedir e simples": a 1.a foto cortava o topo do bolo */
@media (max-width:980px){
  .s2m[src*="g-14-"]{aspect-ratio:1/1;object-position:50% 12%}
  .s2steps .s2step:last-child{padding-bottom:0}
}