@font-face{font-family:'Spectral';font-style:italic;font-weight:200;font-display:swap;src:url(fonts/spectral-200-italic.woff2) format('woff2')}
@font-face{font-family:'Spectral';font-style:italic;font-weight:300;font-display:swap;src:url(fonts/spectral-300-italic.woff2) format('woff2')}
@font-face{font-family:'Spectral';font-style:italic;font-weight:400;font-display:swap;src:url(fonts/spectral-400-italic.woff2) format('woff2')}
@font-face{font-family:'Spectral';font-style:normal;font-weight:200;font-display:swap;src:url(fonts/spectral-200.woff2) format('woff2')}
@font-face{font-family:'Spectral';font-style:normal;font-weight:300;font-display:swap;src:url(fonts/spectral-300.woff2) format('woff2')}
@font-face{font-family:'Spectral';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/spectral-400.woff2) format('woff2')}
@font-face{font-family:'Public Sans';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/public-sans-400.woff2) format('woff2')}
@font-face{font-family:'Public Sans';font-style:normal;font-weight:600;font-display:swap;src:url(fonts/public-sans-600.woff2) format('woff2')}

:root{--ink:#1b1722;--cream:#fdf4f1;--mint:#8ae5d3;--mint-pale:#d2eae5;--lilac:#b9a6dc;--plum:#5b4a82}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--cream);color:var(--ink);font-family:'Public Sans',system-ui,sans-serif;font-size:17px;line-height:1.6}
img{max-width:100%;height:auto;display:block}
h1,h2,h3{font-family:'Spectral',Georgia,serif;font-weight:300;line-height:1.1;margin:0 0 20px}
h2{font-size:clamp(30px,3.6vw,52px)}
h3{font-size:clamp(21px,2vw,26px);line-height:1.2;margin-bottom:10px}
p{margin:0 0 16px}
ul,ol,dl{margin:0;padding:0}
a{color:inherit}
:focus-visible{outline:3px solid var(--plum);outline-offset:3px}
#function-machine :focus-visible,#giving-back :focus-visible,.rodape :focus-visible{outline-color:var(--mint)}
section{overflow-x:clip;position:relative}
.wrap{max-width:1240px;margin:0 auto;padding:0 24px}
.eyebrow{font-size:13px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--plum);margin:0 0 14px}
.lead{font-size:19px;max-width:760px}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 28px;border-radius:8px;background:var(--lilac);color:var(--ink);font-weight:600;font-size:14px;letter-spacing:.06em;text-transform:uppercase;text-decoration:none;border:0;cursor:pointer}
.btn:hover{background:#a58fd2}
.btn.dark{background:var(--ink);color:var(--cream)}
.btn.dark:hover{background:#34304a}

/* bloco do pacote */
.pular{position:absolute;left:-9999px;top:0;background:var(--ink);color:var(--cream);padding:12px 16px;z-index:100}
.pular:focus{left:8px;top:8px}
.rascunho{background:var(--ink);color:var(--cream);font-size:13px;padding:8px 16px;text-align:center}
.pacote{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 16px;background:var(--mint-pale);padding:8px 16px}
.pacote-abas{display:flex;flex-wrap:wrap;gap:4px}
.pacote-abas a{display:inline-flex;align-items:center;min-height:44px;padding:0 14px;border-radius:8px;text-decoration:none;font-weight:600;font-size:14px;color:var(--ink)}
.pacote-abas a[aria-current="page"]{background:var(--ink);color:var(--cream)}
.pacote-abas a:not([aria-current]):hover{background:rgba(27,23,34,.1)}
.pacote-abas .curto{display:none}
.chat,.rodape-chat{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:0 20px;border-radius:8px;background:var(--ink);color:var(--cream);font-weight:600;font-size:14px;text-decoration:none}
.chat:hover,.rodape-chat:hover{background:#34304a}
.rodape{background:var(--ink);color:var(--cream);padding:48px 24px;text-align:left}
.rodape p{max-width:760px;margin:0 0 16px;font-size:14px}
.rodape-chat{background:var(--mint);color:var(--ink)}
.rodape-fontes{color:#cfc6dc}

/* revelação */
.rv{transition:opacity .6s ease,transform .6s ease}
.com-js section:not(.in) .rv{opacity:0;transform:translateY(18px)}
@media (prefers-reduced-motion:reduce){.com-js section:not(.in) .rv{opacity:1;transform:none}.rv{transition:none}}

/* grades */
.g2{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:56px;align-items:center}
.cards4,.cards3,.steps,.ticks,.offers,.marquee,.tips{list-style:none}
.cards4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;margin-top:40px}
.cards3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;margin-top:40px}
.col-stick{position:sticky;top:24px;align-self:start}
.card-img{margin:0;position:relative;align-self:stretch;min-height:320px;border-radius:16px;overflow:hidden;background:#e9dff5}
.card-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
img.plain{width:100%;border-radius:12px;margin-top:24px}

/* hero */
#hero{min-height:min(88vh,820px);display:flex;align-items:center;padding:56px 0 56px 6vw;overflow:hidden}
.hero-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:right center}
.hero-card{position:relative;width:min(500px,42vw);background:var(--cream);padding:44px 40px;border-radius:4px}
.hero-card h1{font-size:clamp(40px,4.4vw,66px);margin-bottom:14px;overflow-wrap:anywhere}
.fx{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:14px;color:var(--plum);margin:0 0 14px}
.hero-sub{font-size:18px}

/* faixa */
#claims{background:var(--mint);min-height:84px;display:flex;align-items:center;gap:16px;padding:0 0 0 24px}
.marquee{display:flex;flex-wrap:wrap;gap:8px 56px;flex:1;min-width:0;overflow:hidden;padding:12px 0}
.marquee li{white-space:nowrap;font-size:14px;font-weight:600;letter-spacing:.2em;text-transform:uppercase}
.marquee li::before{content:"✓";margin-right:12px;color:var(--ink)}
.marquee.run{flex-wrap:nowrap;padding:0}
.marquee.run li{animation:slide 28s linear infinite}
.marquee.paused li{animation-play-state:paused}
@keyframes slide{to{transform:translateX(calc(var(--set) * -1))}}
.pausa{min-height:44px;padding:0 18px;margin-right:24px;border-radius:999px;border:0;background:var(--ink);color:var(--cream);font:600 14px 'Public Sans',sans-serif;cursor:pointer}

/* tipos */
#hair-types{padding:56px 0}
#hair-types .wrap{text-align:center}
#hair-types .lead,#sustainability .lead,#giving-back .lead,#people .lead{margin-left:auto;margin-right:auto}
#sustainability .wrap>.eyebrow,#sustainability .wrap>h2,#sustainability .wrap>.lead,#giving-back .wrap>.eyebrow,#giving-back .wrap>h2,#giving-back .wrap>.lead,#giving-back .closing,#people .wrap>.eyebrow,#people .wrap>h2,#people .wrap>.lead{text-align:center}
#giving-back .closing{margin-left:auto;margin-right:auto}
.ncard,.fcard,.pcard a{text-align:left}
.tcard a{text-align:center}
.tcard{background:#fff;border:1px solid #e6d9d3;border-radius:16px;overflow:hidden}
.tcard a{display:block;padding:16px;text-decoration:none;min-height:44px}
.tcard img{width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:10px;margin-bottom:14px}
.tlab{display:block;font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--plum);margin-bottom:6px}
.tname{display:block;font-family:'Spectral',Georgia,serif;font-size:21px;line-height:1.2}

/* máquina */
#function-machine{background:var(--ink);color:var(--cream);padding:96px 0}
#function-machine .eyebrow{color:var(--mint);font-family:ui-monospace,Menlo,Consolas,monospace;text-transform:none;letter-spacing:.04em;font-size:14px}
#function-machine h2{font-size:clamp(48px,8vw,120px);font-style:italic;font-weight:200;margin-bottom:24px}
.machine{margin-top:40px}
.mhead{grid-template-columns:minmax(0,7fr) minmax(0,5fr);align-items:stretch;gap:48px}
.mhead .card-img{min-height:340px;background:#2a2536}
.sel{border:0;padding:0;margin:0;min-width:0}
.sel legend{font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:#cfc6dc;padding:0;margin-bottom:14px}
.sel input{position:absolute;opacity:0;width:1px;height:1px}
.sel label{display:inline-flex;align-items:center;min-height:48px;padding:0 26px;margin:0 8px 8px 0;border:1px solid var(--mint);border-radius:999px;cursor:pointer;font-weight:600}
.sel input:checked + label{background:var(--mint);color:var(--ink)}
.sel input:focus-visible + label{outline:3px solid var(--lilac);outline-offset:3px}
.panels{margin-top:28px}
.panel{display:none;border-left:3px solid var(--lilac);padding-left:24px;max-width:820px}
#m-straight:checked ~ .panels #p-straight,#m-wavy:checked ~ .panels #p-wavy,#m-curly:checked ~ .panels #p-curly,#m-coily:checked ~ .panels #p-coily{display:block}
.inp{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:14px;color:var(--mint)}
.why{font-family:'Spectral',Georgia,serif;font-size:clamp(20px,2.4vw,28px);line-height:1.35}
.ret{font-family:'Spectral',Georgia,serif;font-style:italic;font-weight:300;font-size:clamp(32px,4vw,56px);line-height:1.1;margin-top:20px}
.ret span{display:block;font:600 13px ui-monospace,Menlo,Consolas,monospace;letter-spacing:.14em;text-transform:uppercase;color:var(--lilac);margin-bottom:6px}
.note{margin-top:40px;font-size:15px;color:#cfc6dc;max-width:680px}

/* dois passos */
#two-steps{background:#fff;padding:80px 0}
.steps{counter-reset:s;margin:24px 0}
.steps li{counter-increment:s;position:relative;padding:0 0 18px 64px;font-size:18px}
.steps li::before{content:counter(s);position:absolute;left:0;top:-8px;font-family:'Spectral',Georgia,serif;font-style:italic;font-weight:200;font-size:48px;color:var(--plum);line-height:1}
.cover{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:12px}

/* laboratório */
#formula-lab{min-height:780px;display:flex;align-items:center;justify-content:flex-end;padding:64px 8vw}
.bg-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.lab-card{position:relative;background:var(--cream);max-width:620px;padding:40px;border-radius:4px}

/* metas */
#goals{padding:96px 0 72px}
.banner{width:100%;max-height:340px;object-fit:cover;border-radius:12px;margin-top:32px}
.tablewrap{margin-top:28px;overflow-x:auto;background:#fff;border:1px solid #e6d9d3;border-radius:12px}
table{width:100%;min-width:760px;border-collapse:collapse;font-size:15px}
th,td{text-align:left;vertical-align:top;padding:14px 16px;border-bottom:1px solid #eadfd9}
thead th{background:var(--ink);color:var(--cream);font-size:13px;letter-spacing:.1em;text-transform:uppercase}
tbody th{font-family:'Spectral',Georgia,serif;font-size:19px;font-weight:400}
.closing{font-family:'Spectral',Georgia,serif;font-style:italic;font-size:clamp(22px,2.6vw,32px);margin-top:36px;max-width:780px}

/* porosidade */
#porosity{background:var(--mint);padding:88px 0}
#porosity .eyebrow,#proof .eyebrow,#cta-final .eyebrow{color:var(--ink)}
#porosity .wrap{grid-template-columns:minmax(0,5fr) minmax(0,7fr);align-items:start}
#porosity h3{margin-top:28px}

/* recomendados */
#recommended{padding:88px 0}
.row{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:40px;margin-top:56px;align-items:stretch}
.row:nth-of-type(even){grid-template-columns:minmax(0,7fr) minmax(0,5fr)}
.row:nth-of-type(even) .card-img{order:2}
.card-img.rec{background:#f6ecb5}
.card-img.rec2{background:#fde1d6}
.card-img.rec2 img{mix-blend-mode:multiply}
.card-img.rec img,.card-img.rec2 img{inset:24px;width:calc(100% - 48px);height:calc(100% - 48px);object-fit:contain}
.row h3{font-size:clamp(24px,2.6vw,34px)}

/* loja */
#shop-collection{background:#fff;padding:72px 0}
.pcard{background:var(--cream);border:1px solid #e6d9d3;border-radius:16px;overflow:hidden}
.pimg{aspect-ratio:1/1;background:var(--mint-pale);display:flex;align-items:center;justify-content:center}
.pcard:nth-child(4n+2) .pimg{background:#fde1d6}
.pcard:nth-child(4n+3) .pimg{background:#e6dcf3}
.pcard:nth-child(4n) .pimg{background:#f6ecb5}
.pimg img{width:100%;height:100%;object-fit:contain;padding:12px;mix-blend-mode:multiply}
.pcard a{display:flex;align-items:center;min-height:64px;padding:12px 16px;font-family:'Spectral',Georgia,serif;font-size:19px;line-height:1.2;text-decoration:none}
.pcard a:hover{text-decoration:underline}

/* prova */
#proof{background:var(--lilac);padding:96px 0}
.stats{display:flex;flex-wrap:wrap;gap:16px 72px}
.stat{flex:1 1 320px;font-family:'Spectral',Georgia,serif;font-size:clamp(22px,2.6vw,32px);margin:0}
.big{display:block;font-family:'Spectral',Georgia,serif;font-size:clamp(72px,12vw,168px);font-style:italic;font-weight:200;line-height:1}
.foot{font-size:14px;margin:12px 0 56px}
.qcard{background:var(--cream);border-radius:16px;padding:24px}
.qimg{height:220px;background:#e9dff5;border-radius:12px;display:flex;align-items:center;justify-content:center;margin-bottom:18px}
.qimg img{height:100%;width:auto;max-width:100%;object-fit:contain;padding:12px}
.qlab{font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--plum);margin-bottom:10px}
blockquote{margin:0}
.qcard blockquote p{font-family:'Spectral',Georgia,serif;font-size:20px;line-height:1.4}
blockquote footer{font-weight:600;font-size:15px}

/* pessoas */
#people{background:#fff;padding:88px 0}
.fcard img{width:100%;aspect-ratio:3/2;object-fit:cover;border-radius:12px;margin-bottom:16px}
#hien{padding:88px 0}
#hien .wrap{grid-template-columns:minmax(0,5fr) minmax(0,6fr);align-items:stretch}
.facts div{display:grid;grid-template-columns:170px minmax(0,1fr);gap:16px;padding:12px 0;border-bottom:1px solid #eadfd9}
.facts dt{font-size:13px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--plum)}
.facts dd{margin:0}
.pull{border-left:3px solid var(--lilac);padding-left:20px;margin:28px 0}
.pull p{font-family:'Spectral',Georgia,serif;font-style:italic;font-size:clamp(22px,2.4vw,28px);line-height:1.3;margin-bottom:6px}

/* feito em casa */
#made-in-house{padding:96px 0}
#made-in-house .wrap{grid-template-columns:minmax(0,7fr) minmax(0,5fr);align-items:stretch}
#made-in-house h3{margin-top:26px}

/* GirlStart */
#giving-back{background:var(--ink);color:var(--cream);padding:88px 0}
#giving-back .eyebrow{color:var(--mint)}
.trio li img{width:100%;aspect-ratio:3/4;object-fit:cover;border-radius:12px}

/* sustentabilidade */
#sustainability{padding:104px 0 80px}
.numrow{display:flex;flex-wrap:wrap;gap:32px 48px;margin:48px 0}
.numrow p{flex:1 1 240px;margin:0;font-size:17px}
.numrow .big{font-size:clamp(56px,8vw,112px);color:var(--plum)}
.twocol{columns:2;column-gap:56px}
.twocol p{break-inside:avoid}

/* cetim, secador */
#satin-ritual{background:#fff;padding:80px 0}
#satin-ritual .wrap{grid-template-columns:minmax(0,7fr) minmax(0,5fr);align-items:start}
#satin-ritual .col-stick{order:2}
.ticks li{position:relative;padding-left:32px;margin-bottom:8px}
.ticks li::before{content:"✓";position:absolute;left:0;color:var(--plum);font-weight:600}
#blowdry{padding:88px 0}
#blowdry .wrap{grid-template-columns:minmax(0,4fr) minmax(0,7fr);align-items:start}
.tips{counter-reset:t}
.tips li{counter-increment:t;position:relative;padding:22px 0 10px 72px;border-top:1px solid #d9c9c1}
.tips li::before{content:counter(t);position:absolute;left:0;top:14px;font-family:'Spectral',Georgia,serif;font-style:italic;font-weight:200;font-size:56px;line-height:1;color:var(--plum)}
.tips h3{margin-bottom:6px}

/* caderno */
#field-guide{padding:80px 0}
.ncard img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:12px;margin-bottom:14px}
.ncard h3 a{display:block;text-decoration:none;min-height:44px}
.ncard h3 a:hover{text-decoration:underline}
.ncard p{font-size:15px}

/* FAQ */
#faq{background:#fff;padding:88px 0}
#faq .wrap{grid-template-columns:minmax(0,4fr) minmax(0,8fr);align-items:start}
.qa dt{font-family:'Spectral',Georgia,serif;font-size:clamp(22px,2.4vw,30px);line-height:1.2;margin-top:28px;padding-top:24px;border-top:1px solid #eadfd9}
.qa dt:first-child{margin-top:0;border-top:0;padding-top:0}
.qa dd{margin:10px 0 0}

/* CTA */
#cta-final{background:var(--lilac);padding:64px 0}
#cta-final .wrap{grid-template-columns:minmax(0,6fr) minmax(0,5fr);align-items:stretch}
#cta-final h2{font-size:clamp(40px,5.5vw,80px)}
.offers{display:flex;flex-wrap:wrap;gap:12px;margin:24px 0 28px}
.offers li{background:var(--cream);border-radius:999px;padding:10px 20px;font-weight:600;font-size:15px}
#cta-final .col-text{align-self:center}

/* responsivo */
@media (max-width:1000px){
  #hero{display:block;min-height:0;padding:0}
  .hero-img{position:static;height:380px}
  .hero-card{width:auto;padding:40px 8vw;border-radius:0}
  .cards3{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cards4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .quotes,.founders,.trio{grid-template-columns:minmax(0,1fr)}
  .g2,#porosity .wrap,#hien .wrap,#made-in-house .wrap,#satin-ritual .wrap,#blowdry .wrap,#faq .wrap,#cta-final .wrap,.row,.row:nth-of-type(even){grid-template-columns:minmax(0,1fr);gap:32px}
  .col-stick{position:static}
  #satin-ritual .col-stick{order:0}
  .row:nth-of-type(even) .card-img{order:0}
  .card-img{min-height:300px}
  .numrow{display:block}
  .numrow p{margin-bottom:28px}
}
@media (max-width:640px){
  body{font-size:16px}
  .pacote-abas .longo{display:none}
  .pacote-abas .curto{display:inline}
  .pacote-abas a{padding:0 10px}
  .hero-card{padding:28px 24px}
  #formula-lab{display:block;min-height:0;padding:0}
  .bg-img{position:static;height:280px}
  .lab-card{max-width:none;padding:28px 24px;border-radius:0}
  .cards3.notes{grid-template-columns:minmax(0,1fr)}
  .facts div{grid-template-columns:minmax(0,1fr);gap:2px}
  .twocol{columns:1}
  .tips li{padding-left:56px}
  .tips li::before{font-size:44px}
  #function-machine,#proof,#cta-final,#giving-back{padding:64px 0}
}