@font-face{font-family:'Playfair Display';font-style:normal;font-weight:500;font-display:swap;src:url(fonts/playfair-display-500.woff2) format('woff2')}
@font-face{font-family:'Playfair Display';font-style:normal;font-weight:700;font-display:swap;src:url(fonts/playfair-display-700.woff2) format('woff2')}
@font-face{font-family:'Figtree';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/figtree-400.woff2) format('woff2')}
@font-face{font-family:'Figtree';font-style:normal;font-weight:500;font-display:swap;src:url(fonts/figtree-500.woff2) format('woff2')}
@font-face{font-family:'Figtree';font-style:normal;font-weight:700;font-display:swap;src:url(fonts/figtree-700.woff2) format('woff2')}
@font-face{font-family:'Jost';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/jost-400.woff2) format('woff2')}
@font-face{font-family:'Jost';font-style:normal;font-weight:500;font-display:swap;src:url(fonts/jost-500.woff2) format('woff2')}

:root{
  --creme:#fdf7ef;
  --floresta:#2a4239;
  --floresta-claro:#3e6154;
  --tinta:#0b1511;
  --folha:#155d4f;
  --menta:#bee3cc;
  --pessego:#fcd4c4;
  --rosa:#f9dee5;
  --salvia:#789f90;
  --areia:#faecd8;
  --sec:#4b5d54;
  --sobre-escuro:#cfe0d6;
  --out:cubic-bezier(.23,1,.32,1);
  --gut:clamp(16px,3.5vw,50px);
  --max:1340px;
  --display:'Playfair Display',Georgia,'Times New Roman',serif;
  --rotulo:'Jost','Futura','Century Gothic',sans-serif;
  --corpo:'Figtree',system-ui,-apple-system,'Segoe UI',sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:16px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-size-adjust:100%}
body{margin:0;background:var(--creme);color:var(--floresta);font:400 1rem/1.6 var(--corpo);touch-action:manipulation}
img,svg{display:block;max-width:100%;height:auto}
h1,h2,h3,p,ul,ol,figure,blockquote{margin:0}
ul,ol{padding:0;list-style:none}
a{color:inherit}
p{max-width:64ch;text-wrap:pretty}
section{overflow-x:clip}
::selection{background:var(--floresta);color:var(--creme)}
:focus-visible{outline:3px solid var(--folha);outline-offset:3px}
.mx{width:100%;max-width:calc(var(--max) + var(--gut) * 2);margin-inline:auto;padding-inline:var(--gut)}
.centro{text-align:center;margin-top:36px;max-width:none}
.centro .pilula{margin-inline:auto}

/* ===== menu e faixa do pacote ===== */
.pular{position:absolute;left:-9999px;top:8px;z-index:100;background:var(--floresta);color:var(--creme);padding:10px 16px;border-radius:999px;font:500 .85rem var(--rotulo)}
.pular:focus{left:8px}
.rascunho{background:var(--floresta);color:var(--creme);text-align:center;font:500 .8rem/1.4 var(--corpo);padding:8px var(--gut)}
.pacote{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:10px var(--gut);background:var(--creme);border-bottom:1px solid rgba(42,66,57,.25)}
.pacote-abas{display:flex;flex-wrap:wrap;gap:4px 8px}
.pacote-abas a{display:inline-flex;align-items:center;min-height:44px;padding:0 14px;color:var(--floresta);text-decoration:none;font:500 .78rem/1 var(--rotulo);letter-spacing:.14em;text-transform:uppercase;border-bottom:2px solid transparent;transition:border-color .2s ease,background-color .2s ease}
.pacote-abas a[aria-current="page"]{border-bottom-color:var(--floresta)}
.pacote-abas .curto{display:none}
.chat{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:0 24px;border-radius:999px;background:var(--floresta);color:var(--creme);text-decoration:none;font:500 .78rem/1 var(--rotulo);letter-spacing:.14em;text-transform:uppercase;transition:background-color .2s ease,transform .15s ease}
@media (hover:hover) and (pointer:fine){
  .pacote-abas a:hover{background:var(--areia)}
  .chat:hover{background:var(--floresta-claro)}
}
.chat:active{transform:scale(.97)}
@media (max-width:860px){
  .pacote{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;padding:10px 12px}
  .pacote-abas{display:contents}
  .pacote-abas a,.chat{justify-content:center;text-align:center;padding:0 6px;font-size:.7rem;letter-spacing:.08em;border:1px solid rgba(42,66,57,.3);border-radius:10px;min-height:44px}
  .pacote-abas a[aria-current="page"]{background:var(--floresta);color:var(--creme);border-color:var(--floresta)}
  .chat{border-color:var(--floresta)}
}
.rodape{background:var(--floresta);color:var(--creme);text-align:center;padding:40px var(--gut) 48px;display:flex;flex-direction:column;gap:12px;align-items:center}
.rodape p{max-width:70ch;font-size:.9rem}
.rodape-chat{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:0 28px;border-radius:999px;background:var(--creme);color:var(--floresta);text-decoration:none;font:500 .78rem/1 var(--rotulo);letter-spacing:.14em;text-transform:uppercase;transition:background-color .2s ease}
.rodape-fontes{color:#cfe0d6;font-size:.82rem}

/* ===== tipografia e botões ===== */
.titulo-grande,.titulo-centro,.titulo-lado,.aviso-titulo,.abertura-titulo,.fases-titulo{font-family:var(--display);font-weight:500;letter-spacing:.01em;text-wrap:balance}
.titulo-grande{font-size:clamp(1.9rem,3.4vw,3rem);line-height:1.12}
.titulo-lado{font-size:clamp(1.9rem,3.2vw,2.6rem);line-height:1.12}
.titulo-centro{font-size:clamp(1.9rem,3.2vw,2.6rem);line-height:1.12;text-align:center}
.lede{font-size:1.125rem;line-height:1.6}
.subtitulo{font-family:var(--display);font-weight:500;font-size:clamp(1.4rem,2.2vw,1.8rem);line-height:1.2;letter-spacing:.01em;margin:44px 0 20px}
.pilula{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:0 28px;border-radius:999px;background:var(--floresta);color:var(--creme);text-decoration:none;font:500 .78rem/1 var(--rotulo);letter-spacing:.14em;text-transform:uppercase;border:1.5px solid var(--floresta);transition:background-color .2s ease,color .2s ease,transform .15s ease}
.pilula-clara{background:transparent;color:var(--floresta)}
.pilula-pq{min-height:40px;padding:0 20px;font-size:.7rem}
.pilula:active{transform:scale(.97)}
@media (hover:hover) and (pointer:fine){
  .pilula:hover{background:var(--floresta-claro);border-color:var(--floresta-claro)}
  .pilula-clara:hover{background:var(--floresta);color:var(--creme)}
}

/* ===== revelação ===== */
.com-js .rv{opacity:0;transition:opacity .9s var(--out),transform .9s var(--out),clip-path 1.1s var(--out);transition-delay:calc(var(--i,0) * 90ms)}
.com-js .rv-up{transform:translateY(22px)}
.com-js .rv-esc{transform:scale(.97)}
.com-js .rv-onda{clip-path:inset(0 0 100% 0)}
.com-js .rv.in{opacity:1;transform:none;clip-path:inset(0 0 0 0)}

/* ===== 1. abertura: foto sangrada de fundo, cartão menta embaixo ===== */
.abertura{position:relative;isolation:isolate;display:flex;min-height:clamp(700px,94vh,920px);background-color:var(--pessego)}
.abertura-foto{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 20%;z-index:-1}
.abertura-palco{flex:1 1 auto;min-width:0;display:flex;align-items:flex-end;width:100%;max-width:calc(var(--max) + var(--gut) * 2);margin-inline:auto;padding:var(--gut)}
.abertura-cartao{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:14px;max-width:640px;padding:clamp(22px,2.4vw,34px);border-radius:28px;background-color:var(--menta)}
.abertura-titulo{font-size:clamp(2rem,3.6vw,3.2rem);line-height:1.05;text-align:left}
.abertura-cartao > p:first-of-type{font-size:1.05rem}
.abertura-botoes{display:flex;flex-wrap:wrap;gap:12px;max-width:none}
.abertura-botoes .pilula{flex:0 0 auto}
@keyframes sobe{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
.com-js .abertura-cartao{animation:sobe .9s var(--out) .15s both}
.selo{position:absolute;top:calc(clamp(88px,10vw,148px) * -.55);right:12px;width:clamp(88px,10vw,148px);z-index:3}
.selo svg{width:100%;height:auto}
.selo-giro{transform:rotate(var(--giro,0deg));transform-origin:50% 50%}
.selo-fundo{fill:var(--creme)}
.selo-miolo{fill:none;stroke:var(--floresta);stroke-width:1}
.selo-texto{font:500 13.5px var(--rotulo);fill:var(--floresta);letter-spacing:.02em}
.selo-grau{font:500 34px var(--display);fill:var(--floresta)}
@media (min-width:900px){.selo{top:auto;bottom:-46px;right:-40px}}

/* ===== 2. aviso pêssego curto ===== */
.aviso{background-color:var(--pessego);padding-block:clamp(32px,4vw,52px)}
.aviso-in{display:flex;flex-direction:column;align-items:center;gap:16px;text-align:center}
.aviso-titulo{font-size:clamp(1.5rem,2.4vw,1.9rem);line-height:1.2;font-weight:700}
.aviso-in p{font-size:1.125rem;max-width:62ch}

/* ===== 3. mostrador (fundo da página) ===== */
.mostrador{padding-block:clamp(56px,6vw,104px)}
.mostrador-in{display:flex;flex-direction:column;gap:28px}
.mostrador-esq{display:flex;flex-direction:column;gap:12px;min-width:0}
@media (min-width:1000px){
  .mostrador-in{flex-direction:row;align-items:flex-start;gap:64px}
  .mostrador-esq{flex:0 0 440px;position:sticky;top:24px}
  .paineis{flex:1 1 0;min-width:0;min-height:800px}
}
.anel{--d:240px;--pw:96px;position:relative;width:var(--d);height:var(--d);margin:36px auto;border:1.5px solid var(--floresta);border-radius:50%}
.anel::before{content:"";position:absolute;inset:11%;border-radius:50%;border:1px dashed var(--salvia)}
@media (min-width:560px){.anel{--d:340px;--pw:108px}}
@media (min-width:1000px){.anel{--d:380px;--pw:118px}}
.aba{position:absolute;left:50%;top:50%;width:var(--pw);height:42px;margin:-21px 0 0 calc(var(--pw) / -2);display:grid;place-items:center;padding:0;border:1.5px solid var(--floresta);border-radius:999px;background-color:var(--creme);color:var(--floresta);font:500 .66rem/1 var(--rotulo);letter-spacing:.1em;text-transform:uppercase;cursor:pointer;transform:rotate(calc(var(--i) * 72deg)) translateY(calc(var(--d) / -2)) rotate(calc(var(--i) * -72deg));transition:background-color .25s ease,color .25s ease;z-index:2}
@media (min-width:560px){.aba{font-size:.72rem}}
.aba[aria-selected="true"]{background-color:var(--floresta);color:var(--creme)}
@media (hover:hover) and (pointer:fine){.aba[aria-selected="false"]:hover{background-color:var(--menta)}}
.ponteiro{position:absolute;left:50%;bottom:50%;width:2px;height:50%;margin-left:-1px;background:var(--floresta);transform-origin:50% 100%;transform:rotate(var(--ang));transition:transform .7s var(--out)}
.nucleo{position:absolute;inset:27%;border-radius:50%;background-color:var(--menta);display:grid;place-content:center;text-align:center;gap:2px;z-index:1}
.nucleo-grau{font:500 clamp(1.7rem,3vw,2.4rem)/1 var(--display)}
.nucleo-nome{font:500 .7rem/1.2 var(--rotulo);letter-spacing:.14em;text-transform:uppercase}
.painel{display:block}
.painel + .painel{margin-top:56px}
.com-js .painel:not(.on){display:none}
.com-js .painel + .painel{margin-top:0}
.painel-topo{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:24px;padding-bottom:16px;border-bottom:1.5px solid var(--floresta)}
.painel-topo h3{font-family:var(--display);font-weight:500;font-size:clamp(1.5rem,2.4vw,2rem);letter-spacing:.02em}
.vitrine{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px 20px}
.vitrine-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.vitrine-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.vit{display:grid;gap:10px;align-content:start;text-decoration:none;text-align:center;color:inherit}
.vit-foto{display:grid;place-items:center;aspect-ratio:1/1;background-color:var(--tile);border-radius:16px;overflow:hidden;transition:transform .35s var(--out)}
.vit-foto img{width:100%;height:100%;object-fit:contain;padding:8%}
.vit-nome{font:500 .76rem/1.45 var(--rotulo);letter-spacing:.1em;text-transform:uppercase;text-wrap:balance}
.vit-preco{font-size:.92rem;color:var(--sec);font-variant-numeric:tabular-nums}
@media (hover:hover) and (pointer:fine){.vit:hover .vit-foto{transform:translateY(-4px)}}
.vit-texto{background-color:var(--tile);border-radius:16px;padding:28px 20px;min-height:220px;align-content:space-between;justify-items:center;text-align:center}
.vit-letra{font:500 4.5rem/1 var(--display);color:var(--folha)}
.vit-texto .vit-nome{font-size:.8rem}
.painel-nota{margin-top:24px;color:var(--sec);font-size:.95rem}
@media (max-width:700px){
  .vitrine,.vitrine-2,.vitrine-3{grid-template-columns:minmax(0,1fr);gap:14px}
  .vit{grid-template-columns:104px minmax(0,1fr);align-items:center;text-align:left;gap:4px 16px}
  .vit-foto{grid-row:1 / span 2;border-radius:12px}
  .vit-nome{align-self:end}
  .vit-preco{align-self:start}
  .vit-texto{grid-template-columns:1fr;min-height:0;padding:20px;justify-items:start;text-align:left}
  .vit-letra{font-size:3rem}
}

/* ===== 4. fundadora ===== */
.fundadora{background-color:var(--pessego);padding-top:clamp(40px,6vw,80px)}
.fundadora-in{display:flex;flex-direction:column;gap:32px;max-width:1440px;margin-inline:auto}
.fundadora-texto{display:flex;flex-direction:column;align-items:flex-start;gap:20px;padding-inline:var(--gut)}
.fundadora-foto{display:flex;justify-content:flex-end;min-width:0}
.fundadora-foto img{width:100%;max-width:720px;border-radius:18px 18px 0 0}
.citacao{border-left:3px solid var(--floresta);padding-left:20px;display:flex;flex-direction:column;gap:10px}
.citacao p{font-family:var(--display);font-size:1.1rem;line-height:1.5}
.citacao footer{font:500 .78rem var(--rotulo);letter-spacing:.14em;text-transform:uppercase}
@media (min-width:900px){
  .fundadora-in{flex-direction:row;align-items:flex-end;gap:40px}
  .fundadora-texto{flex:1 1 54%;min-width:0;padding-bottom:clamp(40px,5vw,72px)}
  .fundadora-foto{flex:0 1 46%}
}

/* ===== 5. fases (verde-floresta) ===== */
.fases{background-color:var(--floresta);color:var(--creme);padding-block:clamp(64px,8vw,120px)}
.fases :focus-visible{outline-color:var(--menta)}
.fases-titulo{font-size:clamp(2.2rem,5vw,4.6rem);line-height:1.05;text-align:left}
.fases-texto{columns:2 340px;column-gap:clamp(32px,5vw,72px);margin-top:clamp(32px,4vw,56px);color:var(--sobre-escuro)}
.fases-texto p{max-width:none;break-inside:avoid;margin-bottom:16px;font-size:1.05rem}
.regua-caixa{position:relative;margin-top:clamp(36px,5vw,72px)}
.regua{display:flex}
.regua::before{content:"";position:absolute;left:0;right:0;top:13px;height:2px;background:rgba(253,247,239,.3)}
.fase{position:relative;flex:1 1 0;min-width:0;display:flex;flex-direction:column;gap:4px;padding:44px 20px 0 0}
.fase::before{content:"";position:absolute;left:0;top:4px;width:20px;height:20px;border-radius:50%;background-color:var(--menta);border:4px solid var(--floresta);box-shadow:0 0 0 1.5px var(--menta)}
.fase-n{font:500 .74rem/1 var(--rotulo);letter-spacing:.14em;text-transform:uppercase}
.fase-nome{font:500 clamp(1.6rem,2.8vw,2.4rem)/1.15 var(--display)}
.fase-dias{font:500 .95rem/1.2 var(--rotulo);letter-spacing:.06em;font-variant-numeric:tabular-nums;color:var(--sobre-escuro)}
.regua-fio{position:absolute;left:0;right:0;top:13px;height:2px;background:var(--menta);transform-origin:left}
.com-js .regua-fio.rv{opacity:1;transform:scaleX(0);transition:transform 1.8s var(--out)}
.com-js .regua-fio.rv.in{transform:none}
.fases-rodape{margin-top:clamp(36px,4vw,56px);font-size:1.05rem;max-width:70ch;color:var(--sobre-escuro)}
@media (max-width:700px){
  .regua{flex-direction:column}
  .regua::before,.regua-fio{left:9px;right:auto;top:6px;bottom:6px;width:2px;height:auto}
  .com-js .regua-fio.rv{transform:scaleY(0);transform-origin:top}
  .com-js .regua-fio.rv.in{transform:none}
  .fase{padding:0 0 28px 48px}
  .fase::before{top:2px}
}

/* ===== 6. laço do algodão (fundo da página) ===== */
.laco{padding-block:clamp(64px,7vw,112px)}
.laco-topo{display:flex;flex-direction:column;gap:40px}
.laco-texto{display:flex;flex-direction:column;align-items:flex-start;gap:18px;min-width:0}
.laco-anel{width:100%;max-width:520px;align-self:center}
.laco-anel svg{width:100%;height:auto}
.laco-base{fill:none;stroke:rgba(42,66,57,.2);stroke-width:3}
.laco-traco{fill:none;stroke:var(--floresta);stroke-width:3;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:0;transition:stroke-dashoffset 2.6s var(--out) .2s}
.com-js .laco-anel:not(.in) .laco-traco{stroke-dashoffset:1}
.laco-nos circle{fill:var(--floresta);stroke:var(--creme);stroke-width:4}
.laco-rotulo{font:500 19px var(--rotulo);fill:var(--floresta);letter-spacing:.08em;text-transform:uppercase}
.laco-centro{font:500 70px var(--display);fill:var(--floresta)}
.paradas{display:flex;flex-direction:column;gap:28px;margin-top:clamp(40px,5vw,72px)}
.parada{display:flex;flex-direction:column;gap:10px;padding-top:20px;border-top:1.5px solid var(--floresta);min-width:0}
.parada h3{font:500 clamp(1.4rem,2.2vw,1.8rem)/1.2 var(--display)}
.parada p{font-size:.98rem}
@media (min-width:900px){
  .laco-topo{flex-direction:row;align-items:center;gap:72px}
  .laco-texto{flex:1 1 54%}
  .laco-anel{flex:0 1 44%}
  .paradas{flex-direction:row;gap:40px}
  .parada{flex:1 1 0}
}

/* ===== 7. tamanhos (rosa) ===== */
.tamanhos{background-color:var(--rosa);padding-block:clamp(56px,7vw,104px)}
.tamanhos-in{display:flex;flex-direction:column;gap:40px}
.tamanhos-col{display:flex;flex-direction:column;gap:8px;min-width:0}
.medidas{display:flex;flex-direction:column;gap:18px;margin-top:20px}
.medida-topo{display:flex;justify-content:space-between;gap:12px;font:500 .8rem/1.2 var(--rotulo);letter-spacing:.12em;text-transform:uppercase;margin-bottom:8px}
.medida-num{white-space:nowrap;font-variant-numeric:tabular-nums}
.medida-trilho{position:relative;height:18px;border-radius:999px;background-color:rgba(42,66,57,.12)}
.medida-trilho::before{content:"";position:absolute;inset:0 auto 0 0;width:var(--w);border-radius:999px;background-color:var(--floresta);transform-origin:left;transition:transform 1.3s var(--out);transition-delay:calc(var(--i,0) * 90ms)}
.medidas-fina .medida-trilho{height:12px}
.medidas-fina .medida-trilho::before{background-color:var(--folha)}
.com-js .rv-barra:not(.in) .medida-trilho::before{transform:scaleX(0)}
.tamanhos-foto{max-width:440px;align-self:center}
.tamanhos-foto img{width:100%;border-radius:18px}
@media (min-width:900px){
  .tamanhos-in{flex-direction:row;align-items:flex-start;gap:72px}
  .tamanhos-col{flex:1 1 60%}
  .tamanhos-foto{flex:0 1 38%;position:sticky;top:24px;align-self:flex-start}
}

/* ===== 8. banner de foto sangrada ===== */
.banner{position:relative;isolation:isolate;display:flex;align-items:center;min-height:clamp(420px,34vw,500px);background-color:var(--areia)}
.banner-fundo,.fecho-fundo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-1}
.banner-fundo{object-position:50% 24%}
.banner-in{padding-block:clamp(32px,5vw,64px)}
.banner-cartao{display:flex;flex-direction:column;gap:16px;max-width:520px;padding:clamp(24px,3vw,40px);border-radius:22px;background-color:var(--floresta);color:var(--creme)}
.banner-cartao .titulo-grande{font-size:clamp(1.6rem,2.6vw,2.2rem)}

/* ===== 9. remendo (verde-floresta) ===== */
.remendo{background-color:var(--floresta);color:var(--creme);padding-block:clamp(64px,8vw,112px)}
.remendo :focus-visible{outline-color:var(--menta)}
.remendo-cab{display:flex;flex-direction:column;gap:32px;margin-bottom:clamp(32px,4vw,56px)}
.remendo-texto{display:flex;flex-direction:column;align-items:flex-start;gap:16px;min-width:0}
.remendo-texto p{color:var(--sobre-escuro)}
.remendo-texto .lede{color:var(--creme)}
.remendo-kit{background-color:var(--areia);border-radius:20px;padding:6%;max-width:420px;width:100%;align-self:center}
.remendo-kit img{width:100%}
.mosaico{display:flex;flex-direction:column;gap:12px}
.mos{position:relative;border-radius:16px;overflow:hidden;aspect-ratio:1/1;background-color:var(--floresta-claro)}
.mos img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.mos-pilha{display:flex;flex-direction:column;gap:12px;min-width:0}
.mos-alta img{object-position:12% 50%}
.mos-larga{background-color:#b9dcf8}
.mos-larga img{object-fit:contain}
.mos-pilha .mos:nth-child(2) img{object-position:50% 10%}
.contagens{display:flex;flex-direction:column;margin-top:clamp(36px,4vw,64px);border-top:1px solid rgba(253,247,239,.4)}
.contagem{display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-areas:"n nome" "n un";column-gap:20px;align-items:baseline;padding:18px 0;border-bottom:1px solid rgba(253,247,239,.4)}
.contagem-n{grid-area:n;font:500 clamp(2.6rem,5vw,4.4rem)/1 var(--display);font-variant-numeric:tabular-nums;min-width:2.4ch}
.contagem-nome{grid-area:nome;font:500 .8rem/1.3 var(--rotulo);letter-spacing:.12em;text-transform:uppercase}
.contagem-un{grid-area:un;color:var(--sobre-escuro);font-size:.95rem}
@media (min-width:900px){
  .remendo-cab{flex-direction:row;align-items:center;gap:64px}
  .remendo-texto{flex:1 1 56%}
  .remendo-kit{flex:0 1 38%;align-self:center}
  .mosaico{flex-direction:row;gap:16px;height:620px}
  .mos{aspect-ratio:auto}
  .mos-alta,.mos-larga{flex:1.15 1 0;min-width:0}
  .mos-pilha{flex:1 1 0;gap:16px}
  .mos-pilha .mos{flex:1 1 0;min-height:0}
  .contagens{flex-direction:row;border-top:0}
  .contagem{flex:1 1 0;min-width:0;display:flex;flex-direction:column-reverse;align-items:flex-start;gap:6px;padding:24px 20px 0 0;border-bottom:0;border-top:1px solid rgba(253,247,239,.4)}
  .contagem-n{order:1}
}
@media (max-width:899px){
  .mos-pilha .mos,.mos-alta,.mos-larga{width:100%}
}

/* ===== 10. máscaras (fundo da página + faixas de cor de embalagem) ===== */
.mascaras{padding-top:clamp(56px,7vw,104px)}
.mascaras-cab{display:flex;flex-direction:column;gap:12px;margin-bottom:clamp(28px,3.5vw,48px)}
.mascaras-novo{font:500 .8rem/1.2 var(--rotulo);letter-spacing:.16em}
.triptico{display:flex;flex-direction:column}
.faixa{display:flex;flex-direction:column;gap:20px;padding:clamp(28px,3vw,48px) clamp(20px,3vw,48px) clamp(32px,4vw,56px);min-width:0}
.faixa-rosa{background-color:#f9d6d6}
.faixa-amarela{background-color:#f6e9a8}
.faixa-azul{background-color:#c9e1f1}
.faixa h3{font:500 clamp(1.4rem,2.2vw,1.9rem)/1.2 var(--display)}
.faixa-preco{font:500 .85rem/1 var(--rotulo);letter-spacing:.14em;font-variant-numeric:tabular-nums}
.faixa-pacote{background-color:var(--creme);border-radius:16px;padding:6%;max-width:340px;width:100%;align-self:center}
.faixa-foto{display:flex;flex-direction:column;gap:8px;max-width:420px;width:100%;align-self:center}
.faixa-foto img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:16px}
.faixa-foto figcaption{font-size:.85rem;color:var(--tinta)}
@media (min-width:900px){
  .mascaras-cab{flex-direction:row;align-items:flex-end;justify-content:space-between}
  .triptico{flex-direction:row}
  .faixa{flex:1 1 0}
}

/* ===== 11. assinatura (fundo da página) ===== */
.assina{padding-block:clamp(56px,7vw,104px)}
.passos{display:flex;flex-direction:column;gap:36px;margin-top:clamp(32px,4vw,56px);text-align:center}
.passo{display:flex;flex-direction:column;align-items:center;gap:12px;min-width:0}
.passo svg{width:clamp(112px,12vw,160px);height:auto}
.ico-aro{fill:none;stroke:var(--floresta);stroke-width:2.5}
.ico-linha{fill:none;stroke:var(--floresta);stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.ico-num{font:500 30px var(--rotulo);fill:var(--floresta)}
.passo h3{font:500 1.15rem/1.3 var(--rotulo);letter-spacing:.04em}
.passo p{font-size:.95rem;max-width:34ch}
@media (min-width:800px){.passos{flex-direction:row;gap:48px}.passo{flex:1 1 0}}
.passe{display:flex;flex-direction:column;margin-top:clamp(40px,5vw,72px);border:1.5px solid var(--floresta);border-radius:22px;background-color:var(--areia)}
.passe-cel{display:flex;flex-direction:column;gap:6px;padding:24px 28px;min-width:0}
.passe-cel + .passe-cel{border-top:1.5px solid var(--floresta)}
.passe-cel h3{font:500 1.35rem/1.2 var(--display)}
.passe-cel p{font-size:.95rem}
@media (min-width:900px){
  .passe{flex-direction:row}
  .passe-cel{flex:1 1 0;padding:32px}
  .passe-cel + .passe-cel{border-top:0;border-left:1.5px solid var(--floresta)}
}
.avisos{display:flex;flex-direction:column;gap:12px;margin-top:28px;color:var(--sec);font-size:.95rem}
@media (min-width:900px){.avisos{flex-direction:row;gap:40px}.avisos p{flex:1 1 0}.avisos p:nth-child(3){flex:2 1 0}}

/* ===== 12. faixa curta menta ===== */
.recompensa{background-color:var(--menta);color:var(--floresta);padding-block:clamp(22px,2.4vw,30px)}
.recompensa-in{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 40px}
.recompensa-titulo{font:500 clamp(.9rem,1.4vw,1.05rem)/1.3 var(--rotulo);letter-spacing:.14em}
.recompensa-texto{flex:1 1 320px;font-size:.98rem;max-width:62ch}

/* ===== 13. primeira menstruação ===== */
.primeira{padding-block:clamp(56px,7vw,104px)}
.primeira-painel{display:flex;flex-direction:column;gap:32px;padding:clamp(28px,5vw,72px);border-radius:32px;background-color:var(--rosa)}
.primeira-esq{display:flex;flex-direction:column;align-items:flex-start;gap:16px;min-width:0}
.primeira-sub{font:500 .85rem/1.2 var(--rotulo);letter-spacing:.16em;text-transform:uppercase}
.primeira-dir{display:flex;flex-direction:column;gap:24px;min-width:0}
.primeira-meio{font-family:var(--display);font-size:clamp(1.2rem,2vw,1.55rem);line-height:1.4;max-width:46ch}
.tres{display:flex;flex-direction:column}
.tres-item{display:flex;flex-direction:column;gap:10px;padding:24px 0;border-top:1.5px solid var(--floresta)}
.tres-item h3{font:500 clamp(1.4rem,2.2vw,1.8rem)/1.2 var(--display)}
.tres-n{color:var(--folha);font-variant-numeric:tabular-nums}
.tres-item p{font-size:.98rem}
.primeira-fim{display:flex;flex-direction:column;align-items:flex-start;gap:14px;padding-top:24px;border-top:1.5px solid var(--floresta)}
.primeira-fim p{max-width:62ch}
@media (min-width:1000px){
  .primeira-painel{flex-direction:row;align-items:flex-start;gap:72px}
  .primeira-esq{flex:0 0 38%;position:sticky;top:24px}
  .primeira-dir{flex:1 1 0}
}

/* ===== 14. doação (pêssego, pôster tipográfico) ===== */
.doacao{background-color:var(--pessego);padding-block:clamp(56px,7vw,104px)}
.doacao-topo{display:flex;flex-direction:column;gap:32px}
.doacao-titulo{display:flex;flex-direction:column;gap:4px;font-family:var(--display);font-weight:500;line-height:1;letter-spacing:.01em;min-width:0}
.doacao-quase{font-size:clamp(1.3rem,2.2vw,1.9rem)}
.doacao-grande{font-size:clamp(3.4rem,10vw,8.6rem);line-height:.95;white-space:nowrap;font-variant-numeric:lining-nums tabular-nums}
.doacao-resto{font-size:clamp(1.3rem,2.2vw,1.9rem);line-height:1.2}
.doacao-texto{display:flex;flex-direction:column;gap:16px;min-width:0}
.doacao-dados{display:flex;flex-direction:column;gap:20px;margin-top:clamp(32px,4vw,56px);padding-top:28px;border-top:1.5px solid var(--floresta)}
.dado{font-size:1.02rem;min-width:0}
.dado strong{font:500 clamp(2rem,3.4vw,2.8rem)/1.1 var(--display);display:block}
@media (min-width:900px){
  .doacao-topo{flex-direction:row;align-items:flex-end;gap:72px}
  .doacao-titulo{flex:1 1 56%}
  .doacao-texto{flex:1 1 40%}
  .doacao-dados{flex-direction:row;gap:36px}
  .dado{flex:1 1 0;font-size:.95rem}
}

/* ===== 15. faixa de fotos ===== */
.faixa-fotos{padding-block:clamp(44px,5vw,72px)}
.faixa-cab{display:flex;flex-direction:column;align-items:center;gap:16px;margin-bottom:28px}
.pausa{min-height:44px;padding:0 22px;border-radius:999px;border:1.5px solid var(--floresta);background:transparent;color:var(--floresta);font:500 .72rem/1 var(--rotulo);letter-spacing:.14em;text-transform:uppercase;cursor:pointer;transition:background-color .2s ease,color .2s ease}
.pausa[aria-pressed="true"]{background-color:var(--floresta);color:var(--creme)}
.rail{overflow-x:auto;padding-inline:var(--gut)}
.rail-pista{display:flex;gap:16px;width:max-content}
.rail-item{flex:0 0 clamp(200px,22vw,300px);aspect-ratio:1/1;border-radius:16px;overflow:hidden;background-color:var(--areia)}
.rail-item img{width:100%;height:100%;object-fit:cover}
.rail-card{background-color:#e3f0e6}
.rail-card img{object-fit:contain;padding:8%}
.com-js .rail{overflow:hidden}
.com-js .rail-pista{animation:rolar var(--dur,70s) linear infinite}
.com-js .rail-pista.parado{animation-play-state:paused}
@keyframes rolar{to{transform:translateX(-50%)}}
@media (hover:hover) and (pointer:fine){.com-js .rail:hover .rail-pista{animation-play-state:paused}}

/* ===== 16. dúvidas ===== */
.duvidas{padding-block:clamp(56px,7vw,104px)}
.duvidas-in{display:flex;flex-direction:column;gap:36px}
.duvidas-esq{display:flex;flex-direction:column;gap:28px;min-width:0}
.duvidas-foto{max-width:420px}
.duvidas-foto img{width:100%;border-radius:18px}
.duvidas-lista{border-top:1.5px solid var(--floresta);min-width:0}
details{border-bottom:1.5px solid var(--floresta)}
summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:64px;padding:14px 0;font:500 1rem/1.4 var(--corpo);transition:color .2s ease}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";font:400 1.6rem/1 var(--rotulo);flex:0 0 auto;transition:transform .3s var(--out)}
details[open] summary::after{transform:rotate(45deg)}
details p{padding:0 0 22px;color:var(--floresta);max-width:62ch}
@media (hover:hover) and (pointer:fine){summary:hover{color:var(--folha)}}
@media (min-width:900px){
  .duvidas-in{flex-direction:row;align-items:flex-start;gap:72px}
  .duvidas-esq{flex:0 0 33%;position:sticky;top:24px}
  .duvidas-lista{flex:1 1 0}
}

/* ===== 17. diário ===== */
.diario{background-color:var(--areia);padding-block:clamp(56px,7vw,104px)}
.diario-cab{display:flex;flex-direction:column;gap:12px;margin-bottom:clamp(28px,4vw,48px)}
@media (min-width:900px){.diario-cab{flex-direction:row;align-items:flex-end;gap:64px}.diario-cab > *{flex:1 1 0}}
.indice{border-top:1.5px solid var(--floresta)}
.linha{display:flex;flex-direction:column;gap:6px;padding:20px 0;border-bottom:1px solid rgba(42,66,57,.35)}
.linha time{font:500 .8rem/1.4 var(--rotulo);letter-spacing:.12em;text-transform:uppercase;font-variant-numeric:tabular-nums}
.linha a{font:500 clamp(1.15rem,1.9vw,1.55rem)/1.25 var(--display);text-decoration:none;transition:color .2s ease;text-wrap:balance}
.linha p{margin-top:8px;font-size:.95rem;color:var(--sec)}
.autoria{font-size:.9rem;color:var(--sec)}
@media (hover:hover) and (pointer:fine){.linha a:hover{color:var(--folha);text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}}
@media (min-width:900px){
  .linha{flex-direction:row;gap:32px;align-items:flex-start;padding:26px 0}
  .linha time{flex:0 0 200px}
  .linha-texto{flex:1 1 0;min-width:0}
  .autoria{flex:0 0 220px;text-align:right}
}

/* ===== 18. fecho ===== */
.fecho{position:relative;isolation:isolate;display:flex;align-items:center;min-height:clamp(480px,38vw,560px);background-color:var(--pessego)}
.fecho-fundo{object-position:50% 60%}
.fecho-in{padding-block:clamp(40px,6vw,80px)}
.fecho-cartao{display:flex;flex-direction:column;align-items:flex-start;gap:18px;max-width:520px;padding:clamp(28px,3.4vw,44px);border-radius:24px;background-color:var(--menta)}
.fecho-logo{width:140px;height:auto}
.fecho-fim{font:500 clamp(1.3rem,2.2vw,1.8rem)/1.2 var(--display);margin-top:6px}

/* ===== apoio: rótulo, passos do remendo, botão sobre fundo escuro ===== */
.eyebrow{font:500 .78rem/1.3 var(--rotulo);letter-spacing:.16em;text-transform:uppercase;margin-bottom:6px}
.fases .eyebrow{color:var(--sobre-escuro);margin-bottom:16px}
.remendo-passos{display:flex;flex-direction:column;gap:6px;margin-top:6px;padding-top:16px;border-top:1px solid rgba(253,247,239,.4);font-variant-numeric:tabular-nums}
.banner-cartao .pilula{background-color:var(--creme);color:var(--floresta);border-color:var(--creme);align-self:flex-start}
@media (hover:hover) and (pointer:fine){.banner-cartao .pilula:hover{background-color:var(--menta);border-color:var(--menta)}}

/* anel: posições fixas em % do círculo (5 abas a cada 72°), sem depender de transform+var */
.anel .aba{transform:none;margin:-21px 0 0 calc(var(--pw) / -2)}
.anel .aba:nth-of-type(1){left:50%;top:0}
.anel .aba:nth-of-type(2){left:97.55%;top:34.55%}
.anel .aba:nth-of-type(3){left:79.39%;top:90.45%}
.anel .aba:nth-of-type(4){left:20.61%;top:90.45%}
.anel .aba:nth-of-type(5){left:2.45%;top:34.55%}
.laco-anel{max-width:560px}
.laco-rotulo{font-size:22px}

/* ===== movimento reduzido ===== */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .com-js .rv,.com-js .rv-up,.com-js .rv-esc,.com-js .rv-onda{transform:none;clip-path:none;transition:opacity .4s ease}
  .com-js .abertura-cartao{animation:none}
  .com-js .regua-fio.rv,.com-js .regua-fio.rv.in{transform:none;transition:none}
  .com-js .rv-barra:not(.in) .medida-trilho::before{transform:none}
  .com-js .laco-anel:not(.in) .laco-traco{stroke-dashoffset:0}
  .com-js .rail-pista{animation:none}
  .com-js .rail{overflow-x:auto}
  .ponteiro,.medida-trilho::before,.laco-traco{transition:none}
}