/* Doces da Ari — site (etapa 1). Tokens: id/cores/tokens.css (copiados abaixo). */
@font-face { font-family: "Fraunces"; src: url("../fonts/fraunces-var-latin.woff2") format("woff2"); font-weight: 100 900; font-display: swap; }
@font-face { font-family: "Nunito"; src: url("../fonts/nunito-var-latin.woff2") format("woff2"); font-weight: 200 1000; font-display: swap; }
@font-face { font-family: "Yellowtail"; src: url("../fonts/yellowtail-latin.woff2") format("woff2"); font-weight: 400; font-display: swap; }

:root {
  --ari-magenta: #b0125f;
  --ari-magenta-escuro: #8a0c4a;
  --ari-rosa: #ee6a9c;
  --ari-rosa-po: #fbd7e6;
  --ari-creme: #fff4f8;
  --ari-verde: #8dbf4a;
  --ari-verde-texto: #3f6414;
  --ari-cacau: #6b3a25;
  --ari-chocolate: #34170e;
  --ari-azul: #5bc0de;

  --ari-fonte-titulo: "Fraunces", "Georgia", serif;
  --ari-fonte-script: "Yellowtail", "Brush Script MT", cursive;
  --ari-fonte-texto: "Nunito", "Segoe UI", system-ui, sans-serif;

  --ari-raio: 22px;
  --ari-raio-pilula: 999px;
  --ari-ease: cubic-bezier(.22, 1, .36, 1);
  --ari-ease-in-out: cubic-bezier(.65, 0, .35, 1);
  --ari-dur-rapida: 180ms;
  --ari-dur-media: 420ms;
  --ari-dur-lenta: 900ms;
  --ari-passo: 70ms;

  /* layout */
  --margem: clamp(20px, 5vw, 72px);
  --largura: 1320px;
  --secao: clamp(88px, 11vw, 168px);
  --texto: clamp(1rem, .96rem + .2vw, 1.125rem);
  --h2: clamp(2.2rem, 1.4rem + 3.6vw, 4.6rem);
  --sombra: 0 30px 60px -30px rgba(52, 23, 14, .35), 0 10px 20px -12px rgba(52, 23, 14, .25);
  --flor: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 100 100%22%3E%3Cpath d=%22M98.47 50.00L99.23 52.15L99.63 54.34L99.57 56.53L99.05 58.65L98.09 60.66L96.79 62.54L95.28 64.28L93.72 65.91L92.24 67.50L90.95 69.10L89.92 70.78L89.14 72.60L88.58 74.58L88.14 76.71L87.70 78.93L87.13 81.16L86.33 83.29L85.23 85.23L83.78 86.86L82.01 88.15L79.98 89.08L77.78 89.68L75.51 90.05L73.26 90.29L71.11 90.55L69.10 90.95L67.22 91.57L65.46 92.47L63.76 93.63L62.05 94.97L60.28 96.39L58.42 97.74L56.43 98.86L54.34 99.63L52.18 99.95L50.00 99.80L47.85 99.21L45.78 98.26L43.80 97.08L41.92 95.82L40.10 94.64L38.31 93.64L36.47 92.92L34.54 92.47L32.49 92.26L30.32 92.20L28.06 92.15L25.76 91.98L23.52 91.56L21.43 90.81L19.56 89.67L17.99 88.15L16.72 86.31L15.75 84.25L14.99 82.08L14.36 79.91L13.73 77.83L12.99 75.92L12.05 74.18L10.86 72.60L9.42 71.12L7.80 69.68L6.10 68.18L4.45 66.58L3.00 64.82L1.88 62.89L1.19 60.82L0.95 58.65L1.17 56.43L1.74 54.22L2.56 52.07L3.47 50.00L4.32 48.01L4.99 46.06L5.38 44.13L5.49 42.15L5.34 40.10L5.03 37.95L4.68 35.71L4.45 33.42L4.47 31.14L4.85 28.95L5.65 26.91L6.87 25.10L8.46 23.54L10.32 22.22L12.33 21.09L14.36 20.09L16.29 19.11L18.05 18.05L19.60 16.82L20.95 15.38L22.15 13.71L23.29 11.86L24.47 9.92L25.76 8.02L27.24 6.29L28.95 4.85L30.87 3.81L32.97 3.20L35.19 3.02L37.46 3.21L39.72 3.64L41.92 4.18L44.03 4.67L46.06 4.99L48.04 5.04L50.00 4.80L52.00 4.30L54.06 3.62L56.20 2.89L58.42 2.26L60.67 1.89L62.89 1.88L65.04 2.31L67.03 3.20L68.85 4.49L70.47 6.10L71.92 7.88L73.26 9.71L74.57 11.44L75.92 12.99L77.39 14.30L79.05 15.38L80.90 16.27L82.92 17.08L85.03 17.90L87.13 18.84L89.10 20.00L90.81 21.43L92.17 23.14L93.13 25.10L93.69 27.26L93.90 29.53L93.87 31.83L93.72 34.09L93.60 36.25L93.64 38.31L93.93 40.26L94.51 42.15L95.35 44.03L96.38 45.94L97.47 47.93Z%22/%3E%3C/svg%3E");
  --grao: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .2 0 0 0 0 .09 0 0 0 0 .05 0 0 0 1 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body {
  margin: 0; background: var(--ari-rosa-po); color: var(--ari-chocolate);
  font: 400 var(--texto)/1.65 var(--ari-fonte-texto);
  -webkit-font-smoothing: antialiased; overflow-x: clip;
}
body::after { /* grão sutil em tudo */
  content: ""; position: fixed; inset: 0; z-index: 90; pointer-events: none;
  background: var(--grao); opacity: .05; mix-blend-mode: multiply;
}
img { display: block; max-width: 100%; height: auto; }
a { color: inherit; }
h1, h2, h3 { margin: 0; font-family: var(--ari-fonte-titulo); font-weight: 700; line-height: 1.02; letter-spacing: -.02em; font-optical-sizing: auto; }
p { margin: 0; }
:focus-visible { outline: 3px solid var(--ari-magenta); outline-offset: 3px; border-radius: 6px; }
.script { font-family: var(--ari-fonte-script); font-weight: 400; letter-spacing: 0; color: var(--ari-magenta); line-height: .9; }
.icone { width: 1.25em; height: 1.25em; flex: none; }
.sem-quebra { white-space: nowrap; }
.pular { position: absolute; left: 12px; top: -60px; z-index: 100; background: var(--ari-chocolate); color: var(--ari-creme); padding: 10px 16px; border-radius: 10px; text-decoration: none; }
.pular:focus { top: 12px; }

.selo-texto {
  display: inline-flex; align-items: center; gap: 10px;
  font-weight: 800; font-size: .8rem; letter-spacing: .16em; text-transform: uppercase; color: var(--ari-magenta);
}
.selo-texto::before { content: ""; width: 26px; height: 8px; background: var(--ari-verde); -webkit-mask: radial-gradient(circle at 4px 4px, #000 3px, transparent 3.5px) 0 0 / 9px 8px repeat-x; mask: radial-gradient(circle at 4px 4px, #000 3px, transparent 3.5px) 0 0 / 9px 8px repeat-x; }

/* ---------- botões ---------- */
.botao {
  --fundo: var(--ari-magenta); --cor: #fff;
  position: relative; display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  min-height: 52px; padding: 14px 26px; border-radius: var(--ari-raio-pilula); border: 2px solid var(--fundo);
  background: var(--fundo); color: var(--cor); font: 800 1rem/1 var(--ari-fonte-texto); text-decoration: none; letter-spacing: .01em;
  box-shadow: 0 10px 22px -12px rgba(176, 18, 95, .7);
  transition: transform var(--ari-dur-rapida) var(--ari-ease), background-color var(--ari-dur-rapida), box-shadow var(--ari-dur-media) var(--ari-ease);
}
.botao:hover { background: var(--ari-magenta-escuro); border-color: var(--ari-magenta-escuro); transform: translateY(-2px); box-shadow: 0 16px 28px -14px rgba(176, 18, 95, .8); }
.botao:active { transform: translateY(0) scale(.98); }
.botao--linha { --fundo: transparent; --cor: var(--ari-chocolate); border-color: var(--ari-chocolate); box-shadow: none; }
.botao--linha:hover { background: var(--ari-chocolate); color: var(--ari-creme); border-color: var(--ari-chocolate); box-shadow: none; }
.botao--rosa { --fundo: var(--ari-rosa); --cor: var(--ari-chocolate); box-shadow: 0 10px 22px -12px rgba(0, 0, 0, .6); }
.botao--rosa:hover { background: var(--ari-rosa-po); border-color: var(--ari-rosa-po); }
.botao--pequeno { min-height: 44px; padding: 10px 18px; font-size: .92rem; }
.botao--grande { min-height: 60px; padding: 18px 34px; font-size: 1.1rem; }

/* ---------- faixa correndo ---------- */
.faixa { background: var(--ari-chocolate); color: var(--ari-rosa-po); overflow: hidden; font-weight: 800; font-size: .78rem; letter-spacing: .14em; text-transform: uppercase; }
.faixa__trilho { display: flex; align-items: center; gap: 22px; width: max-content; padding: 9px 0; animation: correr 38s linear infinite; }
.faixa__trilho i { width: 7px; height: 7px; border-radius: 50%; background: var(--ari-verde); }
@keyframes correr { to { transform: translateX(-50%); } }

/* ---------- topo ---------- */
.topo { position: sticky; top: 0; z-index: 50; transition: background-color var(--ari-dur-media), box-shadow var(--ari-dur-media); }
.topo.is-rolado { background: rgba(251, 215, 230, .9); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); box-shadow: 0 1px 0 rgba(52, 23, 14, .1); }
.topo__dentro { max-width: var(--largura); margin: 0 auto; padding: 12px var(--margem); display: flex; align-items: center; gap: 24px; }
.topo__marca { display: inline-flex; align-items: center; gap: 10px; text-decoration: none; margin-right: auto; }
.topo__marca img { width: 52px; height: 52px; transition: transform var(--ari-dur-media) var(--ari-ease); }
.topo__marca:hover img { transform: rotate(-8deg) scale(1.05); }
.topo__nome { font-family: var(--ari-fonte-script); font-size: 1.7rem; color: var(--ari-magenta); line-height: 1; }
.topo__nav { display: flex; gap: 28px; }
.topo__nav a { position: relative; text-decoration: none; font-weight: 700; padding: 10px 0; }
.topo__nav a::after { content: ""; position: absolute; left: 0; right: 0; bottom: 4px; height: 2px; background: var(--ari-magenta); transform: scaleX(0); transform-origin: right; transition: transform var(--ari-dur-media) var(--ari-ease); }
.topo__nav a:hover::after, .topo__nav a:focus-visible::after { transform: scaleX(1); transform-origin: left; }

/* ---------- flor: moldura ondulada do logo ---------- */
.flor { position: relative; aspect-ratio: 1; isolation: isolate; }
.flor::before, .flor::after { content: ""; position: absolute; inset: 0; z-index: -1; -webkit-mask: var(--flor) center / contain no-repeat; mask: var(--flor) center / contain no-repeat; }
.flor::before { background: var(--ari-rosa); transform: scale(1.06) rotate(9deg); }
.flor::after { background: var(--ari-verde); transform: scale(1.1) rotate(-6deg); z-index: -2; }
.flor > img { width: 100%; height: 100%; object-fit: cover; -webkit-mask: var(--flor) center / contain no-repeat; mask: var(--flor) center / contain no-repeat; }

/* ---------- 1. hero ---------- */
.hero {
  position: relative; max-width: var(--largura); margin: 0 auto; padding: clamp(24px, 4vw, 56px) var(--margem) clamp(80px, 9vw, 130px);
  display: grid; grid-template-columns: repeat(12, 1fr); gap: 0 24px; align-items: center; min-height: min(88vh, 860px);
}
.hero__rabisco { position: absolute; left: 41%; top: -3%; width: 180px; opacity: .5; z-index: -1; }
.hero__texto { grid-column: 1 / span 6; position: relative; z-index: 2; }
.hero__script { font-family: var(--ari-fonte-script); color: var(--ari-magenta); font-size: clamp(1.7rem, 1.2rem + 1.6vw, 2.6rem); line-height: 1; transform: rotate(-3deg); transform-origin: left; margin-bottom: 14px; }
.hero__titulo { font-size: clamp(2.8rem, 1.3rem + 4.8vw, 5.6rem); font-weight: 800; line-height: .98; letter-spacing: -.03em; word-spacing: .05em; text-wrap: balance; }
.hero__titulo em { font-style: italic; font-weight: 600; color: var(--ari-magenta); }
.hero__lead { margin-top: 26px; max-width: 46ch; font-size: clamp(1.05rem, 1rem + .25vw, 1.2rem); }
.hero__acoes { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 34px; }
.hero__nota { display: flex; align-items: center; gap: 10px; margin-top: 22px; font-size: .9rem; font-weight: 700; color: var(--ari-verde-texto); }
.ponto { width: 10px; height: 10px; border-radius: 50%; background: var(--ari-verde); box-shadow: 0 0 0 0 rgba(141, 191, 74, .6); animation: pulsar 2.4s var(--ari-ease) infinite; }
@keyframes pulsar { 70% { box-shadow: 0 0 0 10px rgba(141, 191, 74, 0); } 100% { box-shadow: 0 0 0 0 rgba(141, 191, 74, 0); } }
.hero__foto { grid-column: 7 / span 6; position: relative; padding: 4% 4% 10% 6%; }
.hero__foto .flor { filter: drop-shadow(0 30px 40px rgba(52, 23, 14, .22)); }
.hero__ticket { position: absolute; left: -6%; bottom: 2%; width: 46%; margin: 0; padding: 8px; background: var(--ari-creme); border-radius: 16px; box-shadow: var(--sombra); transform: rotate(-6deg); }
.hero__ticket img { border-radius: 10px; aspect-ratio: 640 / 296; object-fit: cover; }
.carimbo { position: absolute; right: -2%; bottom: 4%; width: clamp(120px, 12vw, 168px); aspect-ratio: 1; display: grid; place-items: center; background: var(--ari-creme); border-radius: 50%; box-shadow: var(--sombra); }
.carimbo svg { position: absolute; inset: 0; width: 100%; height: 100%; }
.carimbo text { font: 800 15.5px var(--ari-fonte-texto); letter-spacing: .18em; text-transform: uppercase; fill: var(--ari-magenta); }
.carimbo img { width: 52%; }

/* ---------- ondas (borda recortada) ---------- */
.onda { position: absolute; left: 0; right: 0; height: 16px; background: var(--ari-chocolate); }
.onda--topo { top: -15px; -webkit-mask: radial-gradient(circle at 50% 100%, #000 15px, transparent 15.5px) 0 0 / 30px 16px repeat-x; mask: radial-gradient(circle at 50% 100%, #000 15px, transparent 15.5px) 0 0 / 30px 16px repeat-x; }
.onda--base { bottom: -15px; -webkit-mask: radial-gradient(circle at 50% 0, #000 15px, transparent 15.5px) 0 0 / 30px 16px repeat-x; mask: radial-gradient(circle at 50% 0, #000 15px, transparent 15.5px) 0 0 / 30px 16px repeat-x; }

/* ---------- 2. natal ---------- */
.natal { position: relative; z-index: 2; background: var(--ari-chocolate); color: var(--ari-rosa-po); }
.natal::before { content: ""; position: absolute; inset: 0; background: url("../img/rabiscos.svg") 0 0 / 260px repeat; opacity: .08; pointer-events: none; }
.natal__dentro { position: relative; max-width: var(--largura); margin: 0 auto; padding: var(--secao) var(--margem); display: grid; grid-template-columns: repeat(12, 1fr); gap: 24px; align-items: center; }
.natal__foto { grid-column: 1 / span 5; position: relative; border-radius: 240px 240px var(--ari-raio) var(--ari-raio); overflow: hidden; aspect-ratio: 4 / 5; box-shadow: 0 40px 80px -30px rgba(0, 0, 0, .6); }
.natal__foto img { width: 100%; height: 112%; object-fit: cover; margin-top: -6%; }
.natal__texto { grid-column: 7 / span 6; display: grid; gap: 22px; justify-items: start; }
.natal .selo-texto { color: var(--ari-rosa); }
.natal__titulo { font-size: var(--h2); font-weight: 700; }
.natal__titulo .script { color: var(--ari-rosa); font-size: 1.2em; display: inline-block; transform: rotate(-4deg); margin-right: .12em; }
.natal__texto > p { max-width: 48ch; color: #f6dbe6; }
.natal__sabores { list-style: none; padding: 0; margin: 6px 0 8px; width: 100%; max-width: 520px; }
.natal__sabores li { display: flex; flex-direction: column; gap: 2px; padding: 16px 0; border-top: 1px dashed rgba(251, 215, 230, .3); }
.natal__sabores li:last-child { border-bottom: 1px dashed rgba(251, 215, 230, .3); }
.natal__sabores strong { font-family: var(--ari-fonte-titulo); font-size: 1.35rem; font-weight: 600; color: #fff; }
.natal__sabores span { font-size: .95rem; color: #e9c3d3; }

/* ---------- 3. vitrine ---------- */
.vitrine { position: relative; padding: calc(var(--secao) + 10px) 0 var(--secao); overflow: hidden; background: var(--ari-creme); }
.vitrine__cabeca { max-width: var(--largura); margin: 0 auto; padding: 0 var(--margem) clamp(36px, 5vw, 64px); display: grid; grid-template-columns: repeat(12, 1fr); gap: 24px; align-items: end; }
.vitrine__titulo { grid-column: 1 / span 8; font-size: var(--h2); }
.vitrine__titulo .script { display: block; font-size: 1.1em; margin-top: .08em; }
.vitrine__cabeca p { grid-column: 9 / span 4; max-width: 34ch; }
.vitrine__janela { overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding-inline: var(--margem); scrollbar-width: none; padding: 0 max(var(--margem), calc((100% - var(--largura)) / 2 + var(--margem))) 10px; }
.vitrine__janela::-webkit-scrollbar { display: none; }
.vitrine__trilho { display: flex; align-items: flex-end; gap: clamp(18px, 2.4vw, 36px); width: max-content; }
.peca { margin: 0; scroll-snap-align: start; flex: none; }
.peca__moldura { overflow: hidden; border-radius: var(--ari-raio); box-shadow: var(--sombra); background: var(--ari-rosa-po); }
.peca__moldura img { width: 100%; height: 100%; object-fit: cover; transition: transform var(--ari-dur-lenta) var(--ari-ease); }
.peca:hover .peca__moldura img { transform: scale(1.03); }
.peca figcaption { margin-top: 14px; font-size: .95rem; color: var(--ari-cacau); max-width: 34ch; }
.peca figcaption .script { display: block; font-size: 2rem; margin-bottom: 4px; }
.peca--alta { width: clamp(250px, 26vw, 380px); } .peca--alta .peca__moldura { aspect-ratio: 700 / 1024; border-radius: 200px 200px var(--ari-raio) var(--ari-raio); }
.peca--larga { width: clamp(300px, 38vw, 560px); } .peca--larga .peca__moldura { aspect-ratio: 1200 / 1083; }
.peca--media { width: clamp(260px, 30vw, 440px); } .peca--media .peca__moldura { aspect-ratio: 580 / 480; border-radius: var(--ari-raio) 120px var(--ari-raio) var(--ari-raio); }
.peca--quadrada { width: clamp(240px, 24vw, 360px); } .peca--quadrada .peca__moldura { aspect-ratio: 1; border-radius: 50%; }
.peca--chamada {
  width: clamp(260px, 24vw, 340px); aspect-ratio: 3 / 4; padding: 32px; border-radius: var(--ari-raio); text-decoration: none;
  display: flex; flex-direction: column; justify-content: flex-end; gap: 10px; background: var(--ari-magenta); color: #fff; box-shadow: var(--sombra);
  transition: transform var(--ari-dur-media) var(--ari-ease), background-color var(--ari-dur-rapida);
}
.peca--chamada .script { color: var(--ari-rosa-po); font-size: 2.4rem; }
.peca--chamada strong { font-family: var(--ari-fonte-titulo); font-size: 1.6rem; line-height: 1.1; font-weight: 600; }
.peca__seta { font-size: 2rem; transition: transform var(--ari-dur-media) var(--ari-ease); }
.peca--chamada:hover { background: var(--ari-magenta-escuro); transform: translateY(-4px); }
.peca--chamada:hover .peca__seta { transform: translateX(8px); }
.vitrine__barra { max-width: var(--largura); margin: 34px auto 0; padding: 0 var(--margem); }
.vitrine__barra::before { content: ""; display: block; height: 3px; background: rgba(52, 23, 14, .12); border-radius: 3px; }
.vitrine__barra span { display: block; height: 3px; margin-top: -3px; background: var(--ari-magenta); border-radius: 3px; transform: scaleX(.08); transform-origin: left; }
.vitrine.is-presa { padding: 96px 0 32px; height: 100vh; min-height: 640px; display: flex; flex-direction: column; justify-content: center; }
.vitrine.is-presa .vitrine__janela { overflow: visible; scroll-snap-type: none; }
.vitrine.is-presa .vitrine__cabeca { padding-bottom: clamp(24px, 3vw, 44px); }
.vitrine.is-presa .vitrine__titulo { font-size: clamp(2rem, 1.2rem + 2.6vw, 3.8rem); }
.vitrine.is-presa .peca--alta { width: 25vh; }
.vitrine.is-presa .peca--larga { width: 40vh; }
.vitrine.is-presa .peca--media { width: 42vh; }
.vitrine.is-presa .peca--quadrada { width: 34vh; }
.vitrine.is-presa .peca--chamada { width: 28vh; padding: 26px; }
.vitrine.is-presa .vitrine__barra { margin-top: 24px; }

/* ---------- 4. cardápio ---------- */
.cardapio { padding: var(--secao) 0; }
.cardapio__dentro { max-width: var(--largura); margin: 0 auto; padding: 0 var(--margem); display: grid; grid-template-columns: repeat(12, 1fr); gap: 24px; align-items: start; }
.cardapio__lista { grid-column: 1 / span 6; }
.cardapio__titulo { font-size: var(--h2); margin-top: 14px; }
.cardapio__titulo .script { font-size: 1.15em; }
.cardapio__intro { margin-top: 18px; max-width: 46ch; }
.menu { list-style: none; padding: 0; margin: 40px 0 0; counter-reset: menu; }
.menu__item { position: relative; padding: 22px 0 22px 56px; border-top: 1.5px solid rgba(52, 23, 14, .16); counter-increment: menu; transition: background-color var(--ari-dur-media); }
.menu__item:last-child { border-bottom: 1.5px solid rgba(52, 23, 14, .16); }
.menu__item::before { content: "0" counter(menu); position: absolute; left: 0; top: 26px; font: 700 .85rem var(--ari-fonte-texto); letter-spacing: .1em; color: var(--ari-cacau); transition: color var(--ari-dur-media); }
.menu__linha { display: flex; align-items: baseline; gap: 14px; }
.menu__linha h3 { font-size: clamp(1.4rem, 1.1rem + 1vw, 2rem); font-weight: 600; transition: color var(--ari-dur-media), transform var(--ari-dur-media) var(--ari-ease); }
.menu__linha::after { content: ""; flex: 1; order: 1; border-bottom: 2px dotted rgba(52, 23, 14, .3); transform: translateY(-6px); }
.menu__preco { order: 2; font-weight: 800; font-size: .9rem; color: var(--ari-verde-texto); white-space: nowrap; }
.menu__item p { margin-top: 6px; max-width: 48ch; color: var(--ari-cacau); }
.menu__pedir { display: inline-flex; align-items: center; min-height: 44px; margin-top: 4px; font-weight: 800; font-size: .92rem; color: var(--ari-magenta); text-decoration: none; background: linear-gradient(currentColor, currentColor) 0 calc(100% - 10px) / 0 2px no-repeat; transition: background-size var(--ari-dur-media) var(--ari-ease); }
.menu__pedir::after { content: "→"; margin-left: 8px; transition: transform var(--ari-dur-media) var(--ari-ease); }
.menu__pedir:hover { background-size: 100% 2px; }
.menu__pedir:hover::after { transform: translateX(4px); }
.menu__item.is-ativo::before { color: var(--ari-magenta); }
.menu__item.is-ativo h3 { color: var(--ari-magenta); transform: translateX(6px); }
.cardapio__tambem { margin-top: 26px; font-weight: 700; color: var(--ari-cacau); }
.cardapio__vitrine { grid-column: 8 / span 5; position: sticky; top: 110px; }
.cardapio__quadro { position: relative; aspect-ratio: 4 / 5; border-radius: 50% 50% var(--ari-raio) var(--ari-raio) / 36% 36% var(--ari-raio) var(--ari-raio); overflow: hidden; background: var(--ari-creme); box-shadow: var(--sombra); }
.cardapio__quadro img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transform: scale(1.06); transition: opacity var(--ari-dur-media) var(--ari-ease), transform var(--ari-dur-lenta) var(--ari-ease); }
.cardapio__quadro img.is-ativo { opacity: 1; transform: scale(1); }
.cardapio__quadro img.foto-baixo { object-position: 50% 80%; }
.cardapio__rabisco { position: absolute; right: -60px; bottom: -70px; width: 200px; z-index: -1; opacity: .8; }

/* ---------- 5. passos ---------- */
.passos { position: relative; background: var(--ari-creme); padding: var(--secao) 0; }
.passos::before { content: ""; position: absolute; inset: 0; background: url("../img/rabiscos.svg") 40px 30px / 300px repeat; opacity: .06; pointer-events: none; }
.passos__dentro { position: relative; max-width: var(--largura); margin: 0 auto; padding: 0 var(--margem); }
.passos__titulo { font-size: var(--h2); max-width: 14ch; }
.passos__titulo .script { display: block; font-size: 1.1em; }
.passos__lista { list-style: none; padding: 0; margin: clamp(40px, 6vw, 80px) 0 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(20px, 3vw, 48px); }
.passos__lista li { position: relative; padding-top: 22px; border-top: 2px solid var(--ari-chocolate); }
.passos__lista li:nth-child(2) { margin-top: 48px; }
.passos__lista li:nth-child(3) { margin-top: 96px; }
.passos__num { display: block; font: 800 clamp(4rem, 3rem + 4vw, 7.5rem)/.85 var(--ari-fonte-titulo); color: var(--ari-rosa); -webkit-text-stroke: 2px var(--ari-magenta); margin-bottom: 14px; }
.passos__lista h3 { font-size: 1.6rem; font-weight: 600; margin-bottom: 8px; }
.passos__lista p { max-width: 32ch; color: var(--ari-cacau); }
.passos__dica { margin-top: clamp(40px, 5vw, 64px); display: inline-block; padding: 14px 22px; border-radius: var(--ari-raio-pilula); background: var(--ari-rosa-po); font-weight: 700; }

/* ---------- 6. a Ari ---------- */
.ari { padding: var(--secao) 0; }
.ari__dentro { max-width: var(--largura); margin: 0 auto; padding: 0 var(--margem); display: grid; grid-template-columns: repeat(12, 1fr); gap: 24px; align-items: center; }
.ari__marca { grid-column: 2 / span 4; }
.flor--logo { background: none; }
.flor--logo > img { -webkit-mask: none; mask: none; object-fit: contain; }
.flor--logo::before { transform: scale(1.02) rotate(14deg); background: var(--ari-creme); }
.flor--logo::after { transform: scale(1.1) rotate(-4deg); background: var(--ari-rosa); opacity: .5; }
.ari__texto { grid-column: 7 / span 6; display: grid; gap: 22px; justify-items: start; }
.ari__titulo { font-size: var(--h2); }
.ari__titulo .script { font-size: 1.3em; }
.ari__texto > p { max-width: 50ch; }
.ari__numeros { display: flex; flex-wrap: wrap; gap: 18px 44px; margin: 6px 0 0; }
.ari__numeros dt { font: 800 clamp(2.4rem, 2rem + 1.6vw, 3.4rem)/1 var(--ari-fonte-titulo); color: var(--ari-magenta); letter-spacing: -.03em; }
.ari__numeros dd { margin: 6px 0 0; max-width: 22ch; font-size: .95rem; color: var(--ari-cacau); }
.ari__falas { margin: 6px 0 0; padding: 22px 26px; background: var(--ari-creme); border-radius: var(--ari-raio); border-left: 5px solid var(--ari-verde); }
.ari__falas blockquote { margin: 0; font-family: var(--ari-fonte-titulo); font-style: italic; font-size: 1.35rem; line-height: 1.35; }
.ari__falas figcaption { margin-top: 10px; font-size: .88rem; color: var(--ari-cacau); }
.ari__falas a { color: var(--ari-magenta); font-weight: 700; }

/* ---------- 7. frase ---------- */
.frase { padding: clamp(40px, 6vw, 100px) var(--margem) var(--secao); max-width: var(--largura); margin: 0 auto; }
.frase__texto { font: 700 clamp(2.6rem, 1rem + 5.6vw, 7rem)/1.02 var(--ari-fonte-titulo); letter-spacing: -.035em; word-spacing: .06em; }
.frase__texto em { font-family: var(--ari-fonte-script); font-style: normal; font-weight: 400; letter-spacing: 0; color: var(--ari-magenta); font-size: 1.12em; }
.frase__texto .palavra { display: inline-block; }

/* ---------- 8. contato ---------- */
.contato { padding: 0 var(--margem) var(--secao); }
.contato__cartao {
  position: relative; overflow: hidden; max-width: var(--largura); margin: 0 auto; padding: clamp(48px, 7vw, 110px) clamp(24px, 6vw, 96px);
  background: var(--ari-magenta); color: #fff; border-radius: clamp(28px, 4vw, 56px); display: grid; gap: 22px; justify-items: start;
}
.contato__rabisco { position: absolute; right: -30px; top: -20px; width: clamp(200px, 26vw, 360px); opacity: .35; filter: brightness(0) invert(1); }
.contato__fotos { position: absolute; right: clamp(40px, 6vw, 110px); top: 50%; width: clamp(260px, 28vw, 400px); aspect-ratio: 1; transform: translateY(-50%); }
.contato__fotos img { position: absolute; border: 8px solid var(--ari-creme); border-radius: 18px; box-shadow: 0 30px 50px -24px rgba(0, 0, 0, .55); object-fit: cover; transition: transform var(--ari-dur-media) var(--ari-ease); }
.contato__fotos img:first-child { width: 72%; aspect-ratio: 700 / 632; left: 0; top: 4%; transform: rotate(-7deg); }
.contato__fotos img:last-child { width: 50%; aspect-ratio: 3 / 4; right: 0; bottom: 0; object-position: 50% 70%; transform: rotate(6deg); }
.contato__cartao:hover .contato__fotos img:first-child { transform: rotate(-9deg) translateY(-6px); }
.contato__cartao:hover .contato__fotos img:last-child { transform: rotate(8deg) translateY(-4px); }
.contato__titulo { position: relative; font-size: clamp(2.4rem, 1.4rem + 4.4vw, 5.6rem); max-width: 12ch; }
.contato__titulo .script { display: block; color: var(--ari-rosa-po); font-size: 1.1em; }
.contato__cartao > p { position: relative; max-width: 44ch; font-size: 1.15rem; color: #ffe6f0; }
.contato .botao--grande { --fundo: #fff; --cor: var(--ari-magenta); border-color: #fff; box-shadow: 0 16px 30px -16px rgba(0, 0, 0, .5); }
.contato .botao--grande:hover { background: var(--ari-rosa-po); border-color: var(--ari-rosa-po); }
.contato__info { position: relative; list-style: none; padding: 0; margin: 10px 0 0; display: flex; flex-wrap: wrap; gap: 14px 34px; font-weight: 700; }
@media (min-width: 901px) { .contato__info, .contato__titulo, .contato__cartao > p { max-width: min(58%, 44ch); } .contato__titulo { max-width: 60%; } }
.contato__info li { display: flex; align-items: center; gap: 10px; min-height: 44px; }
.contato__info a { display: inline-flex; align-items: center; min-height: 44px; color: #fff; text-underline-offset: 4px; }

/* ---------- rodapé ---------- */
.rodape { background: var(--ari-chocolate); color: #f1cfdc; padding: 48px 0 110px; }
.rodape__dentro { max-width: var(--largura); margin: 0 auto; padding: 0 var(--margem); display: flex; flex-wrap: wrap; align-items: baseline; gap: 10px 32px; }
.rodape__nome { font-family: var(--ari-fonte-script); color: var(--ari-rosa); font-size: 2.2rem; margin-right: auto; }
.rodape__mini { width: 100%; font-size: .82rem; color: #c9a2b3; }

/* ---------- WhatsApp fixo (celular) ---------- */
.whats-fixo { position: fixed; right: 16px; bottom: 16px; z-index: 60; width: 60px; height: 60px; border-radius: 50%; display: none; place-items: center; background: var(--ari-magenta); color: #fff; box-shadow: 0 14px 30px -10px rgba(52, 23, 14, .6); transition: transform var(--ari-dur-media) var(--ari-ease), opacity var(--ari-dur-media); }
.whats-fixo .icone { width: 28px; height: 28px; }
.whats-fixo.is-oculto { transform: translateY(90px); opacity: 0; pointer-events: none; }

/* ---------- revelação na rolagem ---------- */
@supports (animation-timeline: view()) {
  @media (prefers-reduced-motion: no-preference) {
    [data-reveal] { animation: subir linear both; animation-timeline: view(); animation-range: entry 0% entry 70%; }
    .passos__lista li[data-reveal]:nth-child(2) { animation-range: entry 10% entry 80%; }
    .passos__lista li[data-reveal]:nth-child(3) { animation-range: entry 20% entry 90%; }
    .natal__foto[data-reveal] { animation-name: abrir; }
  }
}
@keyframes subir { from { opacity: 0; transform: translateY(40px); } to { opacity: 1; transform: none; } }
@keyframes abrir { from { opacity: .3; clip-path: inset(30% 0 0 0 round 240px 240px 22px 22px); } to { opacity: 1; clip-path: inset(0 0 0 0 round 240px 240px 22px 22px); } }
.js-io [data-reveal] { opacity: 0; transform: translateY(40px); transition: opacity var(--ari-dur-lenta) var(--ari-ease), transform var(--ari-dur-lenta) var(--ari-ease); }
.js-io [data-reveal].is-in { opacity: 1; transform: none; }

/* ---------- responsivo ---------- */
@media (max-width: 1100px) {
  .topo__nav { gap: 20px; }
  .hero__texto { grid-column: 1 / span 7; }
  .hero__foto { grid-column: 8 / span 5; }
  .hero__rabisco { left: 50%; top: -4%; width: 140px; }
}
@media (max-width: 900px) {
  .topo__nav { display: none; }
  .hero { grid-template-columns: 1fr; min-height: 0; padding-top: 16px; }
  .hero__texto, .hero__foto { grid-column: 1; }
  .hero__foto { max-width: 560px; width: 100%; justify-self: center; margin-top: 40px; }
  .hero__rabisco { left: auto; right: 0; top: 0; width: 140px; }
  .natal__dentro, .vitrine__cabeca, .cardapio__dentro, .ari__dentro { grid-template-columns: 1fr; }
  .natal__foto, .natal__texto, .vitrine__titulo, .vitrine__cabeca p, .cardapio__lista, .ari__marca, .ari__texto { grid-column: 1; }
  .natal__foto { max-width: 440px; width: 100%; }
  .natal__texto { margin-top: 24px; }
  .cardapio__vitrine, .contato__fotos { display: none; }
  .ari__marca { max-width: 340px; width: 80%; justify-self: center; margin-bottom: 30px; }
  .passos__lista { grid-template-columns: 1fr; }
  .passos__lista li:nth-child(n) { margin-top: 0; }
  .whats-fixo { display: grid; }
}
@media (max-width: 560px) {
  .topo__nome { display: none; }
  .hero__acoes .botao, .botao--grande { width: 100%; }
  .botao--grande { padding: 18px 20px; font-size: 1.02rem; white-space: nowrap; }
  .hero__rabisco { display: none; }
  .hero__ticket { left: -2%; width: 52%; }
  .carimbo { right: 0; }
  .menu__item { padding-left: 40px; }
  .menu__linha { flex-wrap: wrap; row-gap: 2px; }
  .menu__linha::after { display: none; }
  .menu__preco { width: 100%; }
  .frase__texto { font-size: clamp(2.4rem, 11vw, 3.6rem); }
}

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