/* Fiorare Design Studio. Folha de estilo unica, sem dependencias externas.
   Linguagem: editorial premium, cores do guia de marca, movimento guiado pela rolagem em CSS nativo.
   Regra de formas: botoes em pilula, cards e imagens com raio 24px, imagens de marca em arco (motivo do guia).
   Movimento: so transform e opacity; tudo desliga com prefers-reduced-motion. */


:root{
  color-scheme:light dark;
  --bg:#FEFFEF; --bg-alt:#E3F3F0; --bg-rosa:#FDE8F5; --card:#FFFFFB; --sec-green:#185953;
  --fg:#185953; --fg-soft:#48706B; --line:rgba(24,89,83,.16); --gold:#A7945F; --gold-text:#75673A; --gold-label:#8E7C45;
  --accent:#F8AADE;
  --btn-bg:#185953; --btn-fg:#FEFFEF; --btn-hover:#103C38;
  --band:#103C38; --band-fg:#EAF6F3; --band-soft:#B4D4CE;
  --shadow:0 30px 60px -32px rgba(24,89,83,.45);
  --serif:"Playfair Display",Georgia,"Times New Roman",serif;
  --sans:Poppins,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --ease:cubic-bezier(.16,1,.3,1);
  --r:24px; --arch:999px 999px 24px 24px;
  --max:1240px; --gutter:clamp(20px,5vw,56px); --nav-h:72px;
}
@media (prefers-color-scheme:dark){
  :root{
    --bg:#0E2523; --bg-alt:#12312E; --bg-rosa:#2A1D28; --card:#143733;
    --fg:#EAF6F3; --fg-soft:#A9CBC5; --line:rgba(234,246,243,.16); --gold-text:#CDB97D; --gold-label:#CDB97D;
    --btn-bg:#F8AADE; --btn-fg:#0E2523; --btn-hover:#F593D2;
    --band:#081B19; --shadow:0 30px 60px -32px rgba(0,0,0,.7);
  }
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--fg);font-family:var(--sans);font-size:1.0625rem;line-height:1.7;overflow-x:clip}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
h1,h2,h3,h4{font-family:var(--serif);font-weight:500;line-height:1.12;margin:0 0 .55em;letter-spacing:-.015em}
h1{font-size:clamp(2.6rem,6.4vw,5.4rem);line-height:1.1;letter-spacing:-.025em}
h2{font-size:clamp(2rem,4.4vw,3.6rem)}
h3{font-size:clamp(1.4rem,2.2vw,1.9rem)}
p{margin:0 0 1.1em}
em{font-style:italic;padding-bottom:.08em}
h1 em,h2 em{background:linear-gradient(transparent 66%,color-mix(in srgb,var(--accent) 70%,transparent) 66%);padding:0 .05em .08em}
:focus-visible{outline:3px solid var(--fg);outline-offset:3px;border-radius:6px}
.skip{position:absolute;left:-999px;top:8px;background:var(--btn-bg);color:var(--btn-fg);padding:.6rem 1rem;border-radius:999px;z-index:100}
.skip:focus{left:8px}
.container{width:100%;max-width:calc(var(--max) + var(--gutter)*2);margin:0 auto;padding:0 var(--gutter)}
.narrow{max-width:820px}
.lead{font-size:clamp(1.1rem,1.5vw,1.3rem);color:var(--fg-soft);max-width:44ch;line-height:1.6}
section{padding:clamp(72px,11vw,150px) 0}

/* botoes */
.btn{display:inline-flex;align-items:center;gap:.7rem;padding:1rem 1.75rem;border-radius:999px;border:1.5px solid var(--btn-bg);font:500 .98rem/1.2 var(--sans);text-decoration:none;cursor:pointer;white-space:nowrap;transition:background .25s,color .25s,transform .25s var(--ease),border-color .25s}
.btn svg{width:1.05em;height:1.05em;flex:none;fill:currentColor;transition:transform .3s var(--ease)}
.btn:hover svg{transform:translateX(4px)}
.btn:hover{transform:translateY(-2px)}
.btn:active{transform:translateY(0) scale(.98)}
.btn-primary{background:var(--btn-bg);color:var(--btn-fg)}
.btn-primary:hover{background:var(--btn-hover);border-color:var(--btn-hover)}
.btn-ghost{background:transparent;color:var(--fg);border-color:var(--line)}
.btn-ghost:hover{border-color:var(--fg)}
.btn-rosa{background:var(--accent);border-color:var(--accent);color:#0E2523}
.btn-rosa:hover{background:#f593d2;border-color:#f593d2}
.btns{display:flex;flex-wrap:wrap;gap:14px;margin-top:2rem}
@media (max-width:560px){.btn{padding:.95rem 1.35rem;font-size:.94rem;gap:.55rem}.pkg{padding:28px 22px}}
@media (max-width:340px){.btn{white-space:normal;text-align:left}}
.link-arrow{display:inline-flex;align-items:center;gap:.6rem;font-weight:500;text-decoration:none;background:linear-gradient(currentColor,currentColor) 0 100%/100% 1.5px no-repeat;padding-bottom:4px;transition:background-size .4s var(--ease)}
.link-arrow svg{width:1em;height:1em;fill:currentColor;transition:transform .3s var(--ease)}
.link-arrow:hover svg{transform:translateX(5px)}

/* cabecalho */
.site-header{position:sticky;top:0;z-index:50;transition:background .3s,border-color .3s,backdrop-filter .3s;border-bottom:1px solid transparent}
.site-header.scrolled{background:color-mix(in srgb,var(--bg) 86%,transparent);backdrop-filter:saturate(1.4) blur(14px);-webkit-backdrop-filter:saturate(1.4) blur(14px);border-bottom-color:var(--line)}
.site-header .container{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:var(--nav-h)}
.brand img{height:46px;width:auto}
.nav{display:flex;align-items:center;gap:clamp(18px,2.6vw,38px)}
.nav ul{display:flex;gap:clamp(18px,2.4vw,34px);list-style:none;margin:0;padding:0}
.nav a{text-decoration:none;font-size:.95rem;font-weight:500;padding:.4rem 0;background:linear-gradient(var(--gold),var(--gold)) 0 100%/0 2px no-repeat;transition:background-size .35s var(--ease)}
.nav a:hover,.nav a[aria-current=page]{background-size:100% 2px}
.lang{font-size:.8rem;font-weight:600;letter-spacing:.08em;border:1.5px solid var(--line);border-radius:999px;padding:.35rem .85rem;transition:border-color .25s}
.nav a.lang{background:none}
.nav a.btn{background:var(--btn-bg);color:var(--btn-fg);padding:.7rem 1.2rem;font-size:.9rem;display:inline-flex;border:1.5px solid var(--btn-bg)}
.nav a.btn:hover{background:var(--btn-hover);border-color:var(--btn-hover)}
@media (max-width:1140px){.nav a.btn{margin-top:6px}}
.lang:hover{border-color:var(--fg)}
.nav-toggle{display:none;background:none;border:1.5px solid var(--line);border-radius:999px;padding:.5rem 1.1rem;font:500 .9rem var(--sans);color:var(--fg);cursor:pointer}
@media (max-width:1140px){
  .nav-toggle{display:inline-block}
  .nav{position:absolute;left:0;right:0;top:100%;background:var(--bg);border-bottom:1px solid var(--line);flex-direction:column;align-items:flex-start;padding:18px var(--gutter) 28px;gap:16px;display:none}
  .nav.open{display:flex}
  .nav ul{flex-direction:column;gap:6px;width:100%}
  .nav a{display:block;font-size:1.1rem}
}

/* revelar ao rolar (conteudo visivel sem JS) */
.js [data-reveal]{opacity:0;transform:translateY(32px);transition:opacity 1s var(--ease),transform 1s var(--ease);transition-delay:calc(var(--d,0)*90ms)}
.js [data-reveal].in{opacity:1;transform:none}

/* hero */
.hero{min-height:calc(100dvh - var(--nav-h));display:grid;align-items:center;padding:clamp(24px,4vw,56px) 0 clamp(40px,6vw,80px)}
.hero .container{display:grid;grid-template-columns:1.22fr .78fr;gap:clamp(24px,5vw,72px);align-items:center}
.hero h1{font-size:clamp(3rem,7.6vw,6.6rem);margin-bottom:.35em}
.hero .lead{margin-bottom:0}
.rw{display:inline-block}
.arches{position:relative;display:flex;align-items:flex-end;justify-content:center;gap:clamp(10px,1.6vw,20px);height:min(68dvh,600px);min-height:340px}
.arch{flex:1 1 0;max-width:190px;border-radius:var(--arch);overflow:hidden;background:var(--bg-alt);box-shadow:var(--shadow)}
.arch:nth-child(1){height:74%}.arch:nth-child(2){height:100%}.arch:nth-child(3){height:86%}
.arch-in{width:100%;height:100%}
.arch img{width:100%;height:100%;object-fit:cover}
@media (max-width:900px){
  .hero{min-height:0}.hero .container{grid-template-columns:1fr}
  .arches{height:clamp(240px,58vw,380px);min-height:0;margin-top:8px}
}

/* proposito: secao verde, titulo em italico, texto complementar e faixa */
.mono,.tag-row,.strip{font-family:"IBM Plex Mono",ui-monospace,"SFMono-Regular",Menlo,Consolas,monospace;font-weight:500}
.tag-row{display:flex;align-items:center;gap:14px;margin:0 0 1.6rem;font-size:.74rem;line-height:1;letter-spacing:.22em;text-transform:uppercase;color:var(--gold-label)}
.tag-row .star{flex:none;width:1.7em;height:1.7em;background:var(--gold);clip-path:polygon(50% 0,63% 37%,100% 50%,63% 63%,50% 100%,37% 63%,0 50%,37% 37%)}
.tag-row .rule{flex:1;height:1px;background:var(--gold);opacity:.8}
.display{font-family:var(--serif);font-style:italic;font-weight:600;letter-spacing:-.01em;line-height:1.24}
.display b{font-weight:700;color:var(--accent)}
.purpose{background:var(--sec-green);color:#EAF6F3;padding:clamp(80px,11vw,150px) 0 clamp(56px,7vw,96px)}
.purpose-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(32px,7vw,120px);align-items:center}
.purpose-copy{max-width:640px}
.purpose .tag-row{color:#D6C489;margin-bottom:2.2rem}
.purpose .tag-row .star,.purpose .tag-row .rule,.purpose-rule,.purpose .strip i{background:#D6C489}
.purpose .display{font-size:clamp(2.6rem,5.4vw,4.8rem);margin:0;padding-bottom:.1em;color:#F2F9F7}
.purpose-rule{border:0;height:1px;opacity:.8;margin:2.4rem 0 0}
.purpose-side p{font-size:clamp(1.05rem,1.5vw,1.3rem);line-height:1.65;margin:0 0 1.2em;color:#B9D8D2;max-width:36ch}
.purpose-side p:first-child{color:#EAF6F3;font-size:clamp(1.2rem,1.9vw,1.6rem)}
.strip{display:flex;align-items:center;gap:clamp(10px,1.6vw,24px);margin-top:clamp(56px,8vw,110px);font-size:clamp(.56rem,.9vw + .25rem,.78rem);line-height:1;letter-spacing:.14em;text-transform:uppercase;color:#D6C489}
.strip i{flex:1;height:1px;min-width:12px;opacity:.6}
.js .strip i{transform:scaleX(0);transform-origin:0 50%;transition:transform 1.6s var(--ease)}
.js .strip.in i{transform:none}
.js .strip.in i:nth-of-type(2){transition-delay:.25s}.js .strip.in i:nth-of-type(3){transition-delay:.5s}
@media (max-width:900px){.purpose-grid{grid-template-columns:1fr}.purpose-side p{max-width:none}}
@media (prefers-reduced-motion:reduce){.js .strip i{transform:none;transition:none}}

/* cases: capitulos que se empilham */
.stack{padding:0}
.stack-intro{padding-top:clamp(72px,11vw,150px);padding-bottom:clamp(40px,6vw,72px)}
.stack-intro .tag-row{max-width:560px;margin-bottom:2rem}
.stack-intro .display{font-size:clamp(2.4rem,5.2vw,4.6rem);max-width:28ch;margin:0;padding-bottom:.08em;text-wrap:balance}
.chapter{--c-bg:var(--c-l)}
@media (prefers-color-scheme:dark){.chapter{--c-bg:var(--c-d)}}
.chapter{position:sticky;top:0;min-height:100dvh;display:grid;align-items:center;background:var(--c-bg);border-radius:var(--r) var(--r) 0 0;padding:clamp(96px,11vw,140px) 0 clamp(48px,6vw,80px);box-shadow:0 -24px 60px -34px rgba(8,27,25,.4);transform-origin:50% 0;isolation:isolate}
.chapter::before{content:"";position:absolute;inset:0;border-radius:inherit;background:#081B19;opacity:0;pointer-events:none;z-index:2}
.chapter .container{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(24px,5vw,80px);align-items:center}
.chapter h3{font-size:clamp(2.6rem,6.4vw,5.6rem);line-height:1.04;letter-spacing:-.025em;margin-bottom:.3em}
.chapter .tagline{font-size:.95rem;color:var(--fg-soft);margin:0 0 1.2rem}
.chapter .lead{margin-bottom:1.8rem;font-size:clamp(1.15rem,1.7vw,1.5rem);color:var(--fg)}
.chapter .frame{position:relative;width:min(100%,440px);margin-left:auto;aspect-ratio:4/5;border-radius:var(--arch);overflow:hidden;box-shadow:var(--shadow)}
.chapter .frame img{width:100%;height:100%;object-fit:cover}
.chapter a.stretch::after{content:"";position:absolute;inset:0;z-index:3}
.chapter:hover .link-arrow svg{transform:translateX(5px)}
@media (max-width:900px){
  .chapter{position:relative;min-height:0;padding:72px 0 56px;border-radius:var(--r) var(--r) 0 0;margin-top:-24px}
  .chapter .container{grid-template-columns:1fr}
  .chapter .frame{margin:8px auto 0;width:min(78%,360px)}
  .stack .chapter:first-of-type{margin-top:0}
}

/* metodo: carrossel horizontal (arrastar, setas, teclado, barra de rolagem visivel) */
.pan{background:var(--bg-alt);padding:clamp(72px,10vw,140px) 0 clamp(64px,8vw,110px)}
.pan-intro h2{max-width:16ch;margin-bottom:.4em}
.pan-intro .lead{margin:0}
.pan-wrap{margin-top:clamp(32px,5vw,60px)}
.pan-track{--pad:max(var(--gutter),calc((100vw - var(--max)) / 2));list-style:none;margin:0;padding:6px var(--pad) 26px;display:flex;gap:clamp(14px,2vw,24px);overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:var(--pad);scrollbar-width:thin;scrollbar-color:var(--gold) transparent;-webkit-overflow-scrolling:touch;cursor:grab;overscroll-behavior-x:contain}
.pan-track.drag{cursor:grabbing;scroll-snap-type:none;user-select:none}
.pan-track::-webkit-scrollbar{height:6px}
.pan-track::-webkit-scrollbar-thumb{background:var(--gold);border-radius:999px}
.pan-track::-webkit-scrollbar-track{background:transparent}
.pan-panel{flex:0 0 min(84vw,520px);scroll-snap-align:start;background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:clamp(26px,3vw,42px);display:flex;flex-direction:column;box-shadow:0 24px 44px -30px rgba(24,89,83,.4)}
.pan-num{font-family:var(--serif);font-size:clamp(5.5rem,9vw,8rem);line-height:.9;color:transparent;-webkit-text-stroke:1.5px var(--gold);letter-spacing:-.04em;display:block;margin-bottom:.15em}
.pan-panel h3{font-size:clamp(2rem,3.6vw,3rem);margin-bottom:.1em}
.pan-sub{font-size:1rem;font-weight:500;color:var(--gold-text);margin:0 0 1rem}
.pan-text{color:var(--fg-soft);font-size:clamp(1.02rem,1.3vw,1.18rem);line-height:1.6;margin:0 0 1.4rem}
.pan-items{list-style:none;margin:auto 0 0;padding:0}
.pan-items li{position:relative;padding:.2rem 0 .2rem 1.5rem}
.pan-items li::before{content:"";position:absolute;left:0;top:1.05em;width:10px;height:1.5px;background:var(--gold)}
.pan-foot{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-top:1rem}
.pan-btns{display:flex;gap:12px}
.pan-btn{width:54px;height:54px;border-radius:999px;border:1.5px solid var(--line);background:transparent;color:var(--fg);display:grid;place-items:center;cursor:pointer;transition:border-color .25s,background .25s,opacity .25s,transform .25s var(--ease)}
.pan-btn svg{width:1.25rem;height:1.25rem;fill:currentColor}
.pan-btn.prev svg{transform:scaleX(-1)}
.pan-btn:hover:not(:disabled){border-color:var(--fg);transform:translateY(-2px)}
.pan-btn:disabled{opacity:.3;cursor:default}
.btn-green{background:var(--sec-green);border-color:var(--sec-green);color:#F3F9F8}
.btn-green:hover{background:#103C38;border-color:#103C38}

/* pacotes */
.pk-grid{display:grid;grid-template-columns:5fr 7fr;gap:clamp(18px,2.6vw,32px);align-items:stretch}
.pkg{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:clamp(28px,3.6vw,52px);display:flex;flex-direction:column}
.pkg h3{font-size:clamp(2rem,3.6vw,3rem)}
.pkg .desc{color:var(--fg-soft);max-width:40ch}
.pkg h4{font-family:var(--sans);font-size:1rem;font-weight:600;margin:0 0 .3rem;letter-spacing:0}
.pkg ul{list-style:none;margin:.4rem 0 0;padding:0}
.pkg li{padding:.16rem 0 .16rem 1.3rem;position:relative}
.pkg li::before{content:"";position:absolute;left:0;top:1.02em;width:9px;height:1.5px;background:var(--gold)}
.pkg .btns{margin-top:auto;padding-top:2rem}
.pkg-full{background:var(--band);border-color:var(--band);color:var(--band-fg)}
.pkg-full .desc{color:var(--band-soft)}
.pkg-full li::before{background:var(--accent)}
.pkg-full .btn-primary,.pkg .btn-primary{}
@media (max-width:900px){.pk-grid{grid-template-columns:1fr}}
.pkg-list{columns:2;column-gap:2rem}
@media (max-width:560px){.pkg-list{columns:1}}
.pkg-list li{break-inside:avoid}
.pk-group{break-inside:avoid;padding-top:1.6rem}
.note{font-size:.92rem;color:var(--fg-soft);margin-top:1.6rem}

/* blog */
.rows{list-style:none;margin:0;padding:0}
.rows li{border-bottom:1px solid var(--line)}
.rows li:last-child{border-bottom:0}
.row{display:grid;grid-template-columns:200px 1fr auto;gap:clamp(12px,3vw,40px);align-items:center;padding:clamp(24px,3vw,40px) 0;text-decoration:none}
.row time{font-size:.9rem;color:var(--fg-soft)}
.row h3{margin:0;font-size:clamp(1.4rem,2.6vw,2.2rem);max-width:30ch;transition:transform .5s var(--ease)}
.row svg{width:1.6rem;height:1.6rem;fill:currentColor;transition:transform .5s var(--ease)}
.row:hover h3{transform:translateX(12px)}
.row:hover svg{transform:translateX(8px)}
@media (max-width:760px){.row{grid-template-columns:1fr auto}.row time{grid-column:1/-1}}
.blog-head{margin-bottom:clamp(28px,4vw,56px)}
.blog-head .tag-row{max-width:560px;margin-bottom:1.6rem}
.section-title{max-width:18ch;margin:0}

/* faixa final + rodape */
.band{background:var(--band);color:var(--band-fg);position:relative;overflow:hidden}
.cta{padding:clamp(88px,12vw,170px) 0}
.cta .container{position:relative}
.cta h2{font-size:clamp(2.6rem,7vw,6rem);line-height:1.06;letter-spacing:-.025em;max-width:13ch;margin-bottom:.4em}
.cta p{color:var(--band-soft);max-width:38ch}
.cta .arc{position:absolute;right:var(--gutter);bottom:-1px;width:clamp(150px,22vw,300px);aspect-ratio:3/4;border:1.5px solid rgba(167,148,95,.55);border-bottom:0;border-radius:999px 999px 0 0;pointer-events:none}
.cta .arc+.arc{right:calc(var(--gutter) + clamp(70px,11vw,150px));width:clamp(110px,16vw,220px);border-color:rgba(167,148,95,.32)}
@media (max-width:700px){.cta .arc{display:none}}
.site-footer{background:var(--band);color:var(--band-fg);padding:clamp(48px,6vw,80px) 0 28px;border-top:1px solid rgba(255,255,255,.1);font-size:.96rem}
.footer-grid{display:grid;grid-template-columns:1.2fr 1fr 1.2fr;gap:clamp(24px,4vw,64px)}
.footer-brand img{height:150px;width:auto;margin-bottom:1rem}
.footer-brand p{color:var(--band-soft);max-width:28ch;font-family:var(--serif);font-size:1.4rem;line-height:1.3}
.site-footer h2{font-family:var(--sans);font-size:.95rem;font-weight:600;color:var(--accent);margin-bottom:1rem;letter-spacing:0}
.site-footer ul{list-style:none;margin:0;padding:0}
.site-footer li{margin-bottom:.5rem}
.site-footer a{text-decoration:none}
.site-footer a:hover{text-decoration:underline;text-underline-offset:3px}
.footer-bottom{border-top:1px solid rgba(255,255,255,.14);margin-top:40px;padding-top:20px;display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px 24px;font-size:.86rem;color:var(--band-soft)}
@media (max-width:820px){.footer-grid{grid-template-columns:1fr}.footer-brand img{height:110px}}

/* paginas internas */
.page-head{padding:clamp(48px,8vw,110px) 0 clamp(28px,4vw,56px)}
.page-head h1{max-width:16ch}
.crumbs{font-size:.86rem;color:var(--fg-soft);margin-bottom:2rem}
.crumbs ol{list-style:none;display:flex;flex-wrap:wrap;gap:.3rem .6rem;margin:0;padding:0}
.crumbs li+li::before{content:"/";margin-right:.6rem;color:var(--gold)}
.crumbs a{text-decoration:none}.crumbs a:hover{text-decoration:underline}
.prose{max-width:70ch}
.prose h2{margin-top:2.4rem;font-size:clamp(1.7rem,2.8vw,2.3rem)}
.prose ul,.prose ol{padding-left:1.3rem;margin:0 0 1.2em}
.prose li{margin-bottom:.5rem}
.prose a{text-decoration-color:var(--gold);text-underline-offset:3px}
.article-meta{color:var(--fg-soft);font-size:.92rem}
.split{display:grid;grid-template-columns:.36fr 1fr;gap:clamp(20px,5vw,88px);padding:clamp(36px,6vw,80px) 0;border-top:1px solid var(--line)}
.split:first-of-type{border-top:0}
.split>h2{position:sticky;top:calc(var(--nav-h) + 24px);align-self:start;font-size:clamp(1.3rem,2vw,1.6rem);font-family:var(--sans);font-weight:600;letter-spacing:0;margin:0}
.split .big{font-family:var(--serif);font-size:clamp(1.8rem,3.4vw,3rem);line-height:1.15;letter-spacing:-.02em;margin:0 0 .7em;max-width:22ch}
.split .txt{max-width:62ch}
@media (max-width:820px){.split{grid-template-columns:1fr}.split>h2{position:static}}
.rows-plain{list-style:none;margin:0;padding:0}
.rows-plain li{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(16px,4vw,64px);padding:clamp(24px,3vw,40px) 0;border-top:1px solid var(--line)}
.rows-plain li:first-child{border-top:0}
.rows-plain h3{margin:0;font-size:clamp(1.6rem,3vw,2.4rem)}
.rows-plain p{margin:0;color:var(--fg-soft);max-width:48ch}
@media (max-width:760px){.rows-plain li{grid-template-columns:1fr}}
.steps-v{list-style:none;margin:0;padding:0}
.steps-v>li{display:grid;grid-template-columns:minmax(120px,.5fr) 1.5fr;gap:clamp(16px,4vw,64px);padding:clamp(28px,4vw,56px) 0;border-top:1px solid var(--line)}
.steps-v>li:first-child{border-top:0}
.steps-v .num{font-family:var(--serif);font-size:clamp(4rem,9vw,8rem);line-height:.9;color:transparent;-webkit-text-stroke:1.5px var(--gold)}
.steps-v h3{font-size:clamp(1.8rem,3.4vw,2.8rem);margin-bottom:.2em}
.steps-v .sub{color:var(--gold-text);font-weight:500;font-size:.95rem;margin:0 0 .8rem}
.steps-v p{color:var(--fg-soft);max-width:52ch}
.steps-v ul{list-style:none;margin:.8rem 0 0;padding:0;color:var(--fg-soft)}
.steps-v ul li{position:relative;padding:.15rem 0 .15rem 1.4rem}
.steps-v ul li::before{content:"";position:absolute;left:0;top:1em;width:9px;height:1.5px;background:var(--gold)}
@media (max-width:640px){.steps-v>li{grid-template-columns:1fr}}
.bg-alt{background:var(--bg-alt)}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,5vw,80px);align-items:start}
@media (max-width:820px){.two-col{grid-template-columns:1fr}}
details{border-bottom:1px solid var(--line);padding:1.1rem 0}
summary{cursor:pointer;font-weight:500;list-style:none;display:flex;justify-content:space-between;gap:16px}
summary::after{content:"+";font-size:1.4rem;line-height:1;color:var(--gold-text)}
details[open] summary::after{content:"\2212"}
summary::-webkit-details-marker{display:none}
details p{margin:.8rem 0 0;color:var(--fg-soft)}
.contact-list{list-style:none;padding:0;margin:0}
.contact-list li{padding:1rem 0;border-bottom:1px solid var(--line);display:flex;flex-wrap:wrap;gap:4px 20px;align-items:baseline}
.contact-list li:last-child{border-bottom:0}
.contact-list span{min-width:110px;font-size:.9rem;color:var(--fg-soft)}
.contact-list a{font-size:1.15rem;font-weight:500}

/* pagina de case */
.case-head h1{font-size:clamp(3rem,9vw,8rem);max-width:none;line-height:1.02;letter-spacing:-.03em}
.case-head .lead{max-width:50ch}
.case-meta{display:grid;grid-template-columns:repeat(3,auto);justify-content:start;gap:12px clamp(28px,6vw,80px);margin:2.4rem 0 0}
.case-meta dt{font-size:.88rem;color:var(--fg-soft)}
.case-meta dd{margin:.1rem 0 0;font-weight:500}
@media (max-width:700px){.case-meta{grid-template-columns:1fr}}
.case-hero{padding:0 var(--gutter);max-width:calc(var(--max) + var(--gutter)*2 + 160px);margin:0 auto}
.case-hero-in{border-radius:var(--r);overflow:hidden;box-shadow:var(--shadow);background:var(--bg-alt)}
.case-hero img{width:100%}
.pillars{list-style:none;padding:0;margin:1.6rem 0 0;display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.pillars li{background:var(--bg-alt);border-radius:var(--r);padding:1.3rem 1.5rem}
.pillars strong{display:block;font-family:var(--serif);font-size:1.4rem;font-weight:500;line-height:1.2;margin-bottom:.2rem}
.pillars span{color:var(--fg-soft);font-size:.98rem}
@media (max-width:560px){.pillars{grid-template-columns:1fr}}
.sub-h{font-size:1rem;font-weight:600;font-family:var(--sans);letter-spacing:0;margin:2rem 0 .6rem}
.chips{display:flex;flex-wrap:wrap;gap:8px;list-style:none;padding:0;margin:0}
.chips li{border:1.5px solid var(--line);border-radius:999px;padding:.3rem 1rem;font-size:.95rem}
.bullets{padding-left:1.2rem;margin:0}
.bullets li{margin-bottom:.4rem}
.palette{display:flex;height:clamp(150px,20vw,220px);border-radius:var(--r);overflow:hidden;list-style:none;padding:0;margin:0}
.palette li{flex:1;display:flex;align-items:flex-end;padding:.9rem;font-size:.82rem;line-height:1.3;transition:flex .6s var(--ease)}
.palette li:hover{flex:2.4}
.palette .dark{color:#F4F7F6}.palette .light{color:#16211F}
.palette b{display:block;font-weight:600}
@media (max-width:640px){.palette{flex-direction:column;height:auto}.palette li{min-height:70px}}
.gallery{display:grid;gap:clamp(20px,3vw,40px);padding:clamp(24px,4vw,56px) 0}
.gallery figure{margin:0}
.gallery img{width:100%;border-radius:var(--r);background:var(--bg-alt)}
.gallery .tall{max-width:820px;margin-inline:auto}
.ai-note{font-size:.9rem;color:var(--fg-soft);border-left:3px solid var(--accent);padding:.2rem 0 .2rem 1rem;max-width:70ch;margin:1.2rem 0 0}
.case-nav{display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;padding:40px 0;border-top:1px solid var(--line)}
.case-nav a{text-decoration:none}
.case-nav small{display:block;font-size:.9rem;color:var(--fg-soft)}
.case-nav strong{font-family:var(--serif);font-weight:500;font-size:clamp(1.6rem,3vw,2.4rem);transition:transform .4s var(--ease);display:inline-block}
.case-nav a:hover strong{transform:translateX(6px)}
.case-nav .next{text-align:right;margin-left:auto}
.case-nav .next:hover strong{transform:translateX(-6px)}
.article{padding-bottom:clamp(56px,8vw,110px)}
.article .prose{margin-inline:auto}
.article h1{font-size:clamp(2.2rem,5vw,3.8rem);max-width:20ch}

/* ============ movimento guiado pela rolagem (progressivo; nada disso e necessario para ler o site) ============ */
@media (prefers-reduced-motion:no-preference){
  .rw{opacity:0;transform:translateY(70%);animation:rise 1s var(--ease) forwards;animation-delay:calc(var(--i)*110ms + 120ms)}
  .hero .lead,.hero .btns{opacity:0;transform:translateY(24px);animation:rise 1s var(--ease) forwards;animation-delay:.75s}
  .hero .btns{animation-delay:.9s}
  .arch{animation:arch-in 1.3s var(--ease) backwards}
  .arch:nth-child(1){animation-delay:.25s}.arch:nth-child(2){animation-delay:.4s}.arch:nth-child(3){animation-delay:.55s}
  @keyframes rise{to{opacity:1;transform:none}}
  @keyframes arch-in{from{opacity:0;transform:translateY(80px)}}
}
@supports (animation-timeline:view()){
@media (prefers-reduced-motion:no-preference){
  @keyframes drift{to{transform:translateY(var(--dy))}}
  @keyframes par{from{transform:translateY(-7%) scale(1.14)}to{transform:translateY(7%) scale(1.14)}}
  @keyframes grow{from{transform:scale(.84);border-radius:48px}to{transform:scale(1);border-radius:24px}}
  @keyframes recede{to{transform:scale(.93)}}
  @keyframes shade{to{opacity:.38}}

  /* hero: os arcos deslizam em velocidades diferentes */
  .arch-in{animation:drift linear both;animation-timeline:scroll(root);animation-range:0 90vh}
  .arch:nth-child(1) .arch-in{--dy:-46px}.arch:nth-child(2) .arch-in{--dy:-110px}.arch:nth-child(3) .arch-in{--dy:-70px}
  /* cases: cada capitulo recua quando o proximo sobe */
  .stack{timeline-scope:--ch2,--ch3}
  .chapter:nth-of-type(2){view-timeline:--ch2 block}
  .chapter:nth-of-type(3){view-timeline:--ch3 block}
  .chapter:nth-of-type(1){animation:recede linear both;animation-timeline:--ch2;animation-range:entry 0% entry 100%}
  .chapter:nth-of-type(2){animation:recede linear both;animation-timeline:--ch3;animation-range:entry 0% entry 100%}
  .chapter:nth-of-type(1)::before{animation:shade linear both;animation-timeline:--ch2;animation-range:entry 0% entry 100%}
  .chapter:nth-of-type(2)::before{animation:shade linear both;animation-timeline:--ch3;animation-range:entry 0% entry 100%}
  .chapter .frame img,.parallax img{animation:par linear both;animation-timeline:view();animation-range:cover 0% cover 100%}
  /* imagem principal dos cases */
  .case-hero-in{animation:grow linear both;animation-timeline:view();animation-range:entry 5% cover 38%}
}}
@media (max-width:900px){
  @supports (animation-timeline:view()){
    .chapter,.chapter::before{animation:none!important}
  }
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .js [data-reveal]{opacity:1;transform:none;transition:none}
  .btn,.row h3,.row svg{transition:none}
}

/* ===== acrescimos: FAQ, materiais, artigos, destaques ===== */
.page-intro{max-width:66ch;margin-top:1.6rem}
.page-intro p{color:var(--fg-soft);margin:0 0 1em}
.need{margin:1rem 0 0;padding-left:1rem;border-left:2px solid var(--gold);color:var(--fg);font-size:.98rem;max-width:56ch}
.purpose-side .by{font-size:.95rem;color:#D6C489;margin:1.8rem 0 0;max-width:none}
.more-links{display:flex;flex-wrap:wrap;gap:12px 28px;margin-top:1.2rem}
.callout{margin:1.8rem 0;padding:1.1rem 1.4rem;border-left:3px solid var(--accent);background:var(--bg-alt);border-radius:0 14px 14px 0}
.callout p{margin:0}
.callout a{font-weight:500}

/* teaser dos materiais e FAQ da home */
.teaser-sec{padding:0 0 clamp(56px,7vw,96px)}
.teaser{background:var(--sec-green);color:#EAF6F3;border-radius:var(--r);padding:clamp(28px,4.5vw,60px);display:flex;justify-content:space-between;align-items:center;gap:28px;flex-wrap:wrap}
.teaser h2{font-size:clamp(1.8rem,3.4vw,2.8rem);margin:0 0 .3em;color:#F2F9F7}
.teaser p{margin:0;color:#B9D8D2;max-width:54ch}
.faq{padding-top:clamp(40px,6vw,80px)}
.faq-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(28px,6vw,100px);align-items:start}
.faq-head{position:sticky;top:calc(var(--nav-h) + 28px)}
.faq-head .section-title{max-width:14ch;margin-bottom:.5em}
.faq-head .lead{font-size:1.05rem}
.faq-list summary{font-family:var(--serif);font-size:clamp(1.15rem,1.7vw,1.4rem);font-weight:500;padding:.2rem 0}
.faq-list details{padding:1.2rem 0}
.faq-list details:first-child{padding-top:0}
.faq-list details p{max-width:60ch}
@media (max-width:900px){.faq-grid{grid-template-columns:1fr}.faq-head{position:static}}

/* pagina de materiais */
.res-list{list-style:none;margin:0;padding:0}
.res{display:grid;grid-template-columns:minmax(180px,.5fr) 1.5fr;gap:clamp(24px,6vw,88px);align-items:center;padding:clamp(28px,4vw,52px) 0;border-top:1px solid var(--line)}
.res:first-child{border-top:0}
.res-cover img{width:100%;max-width:300px;border-radius:6px;box-shadow:var(--shadow);border:1px solid var(--line)}
.res-body h2{font-size:clamp(1.7rem,3.2vw,2.6rem);max-width:20ch}
.res-body>p{color:var(--fg-soft);max-width:58ch}
.res-meta{font-size:.9rem;color:var(--fg-soft);margin:1.2rem 0 1.4rem}
@media (max-width:760px){.res{grid-template-columns:1fr}.res-cover img{max-width:220px}}

/* artigo: autora e leia tambem */
.author{margin-top:3rem;padding:1.4rem 1.6rem;background:var(--bg-alt);border-radius:var(--r);display:flex;align-items:center;gap:1.2rem}
.author img{flex:none;width:72px;height:72px;border-radius:50%;object-fit:cover}
.author div{display:flex;flex-direction:column;gap:.2rem}
.author strong{font-family:var(--serif);font-size:1.3rem;font-weight:500}
.author span{color:var(--fg-soft)}
.readmore{margin-top:3.2rem}
.readmore h2{font-size:1.6rem}
.readmore .row{grid-template-columns:1fr auto}
.readmore .row time{grid-column:1/-1}

/* foto da Camila na pagina Sobre */
.bio{display:grid;grid-template-columns:minmax(200px,.6fr) 1fr;gap:clamp(24px,5vw,72px);align-items:center;max-width:none}
.bio-photo{margin:0}
.bio-photo img{width:100%;max-width:360px;aspect-ratio:4/5;object-fit:cover;object-position:50% 0;border-radius:var(--arch);box-shadow:var(--shadow);background:var(--bg-alt)}
.bio p{max-width:52ch}
@media (max-width:760px){.bio{grid-template-columns:1fr}.bio-photo img{max-width:260px}}
