@font-face{font-family:'Outfit';font-style:normal;font-weight:500;font-display:swap;src:url('/fonts/outfit-500.woff2') format('woff2')}
@font-face{font-family:'Outfit';font-style:normal;font-weight:600;font-display:swap;src:url('/fonts/outfit-600.woff2') format('woff2')}
@font-face{font-family:'Outfit';font-style:normal;font-weight:700;font-display:swap;src:url('/fonts/outfit-700.woff2') format('woff2')}
@font-face{font-family:'DM Sans';font-style:normal;font-weight:400;font-display:swap;src:url('/fonts/dm-sans-400.woff2') format('woff2')}
@font-face{font-family:'DM Sans';font-style:normal;font-weight:500;font-display:swap;src:url('/fonts/dm-sans-500.woff2') format('woff2')}
@font-face{font-family:'DM Sans';font-style:normal;font-weight:700;font-display:swap;src:url('/fonts/dm-sans-700.woff2') format('woff2')}
:root{
  --grafite:#1D1E20; --nevoa:#E6EAED; --nevoa2:#D8DEE3; --texto:#1D1E20; --suave:#464B58;
  --demanda:#0B7F84; --oferta:#D63163; --ouro:#BD8D55;
  --claro:#E6EAED; --claro-suave:#B4BBC7;
  --f-tit:'Outfit',system-ui,sans-serif; --f-txt:'DM Sans',system-ui,sans-serif;
}
*{box-sizing:border-box;margin:0}
html{scroll-behavior:smooth;scroll-padding-top:84px;-webkit-text-size-adjust:100%}
body{font:17px/1.62 var(--f-txt);color:var(--texto);background:var(--nevoa);overflow-x:hidden}
img,svg{max-width:100%;display:block}
a{color:inherit}
:focus-visible{outline:3px solid var(--ouro);outline-offset:3px;border-radius:4px}
.wrap{width:min(1180px,100% - 32px);margin-inline:auto}
h1,h2,h3{font-family:var(--f-tit);font-weight:600;line-height:1.08;letter-spacing:-.015em}
h1{font-size:clamp(2.15rem,5.2vw,4rem)}
h2{font-size:clamp(1.8rem,3.6vw,2.8rem)}
h3{font-size:1.35rem}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;min-height:52px;padding:.8rem 1.7rem;border-radius:999px;background:#000;color:var(--ouro);font:600 1.02rem var(--f-tit);text-decoration:none;border:2px solid #000;transition:background .2s,color .2s,transform .2s}
.btn:hover{background:var(--ouro);color:#111;border-color:var(--ouro);transform:translateY(-2px)}
.btn.sm{min-height:42px;padding:.45rem 1.15rem;font-size:.95rem}
.btn.on-dark{background:var(--ouro);color:#111;border-color:var(--ouro)}
.btn.on-dark:hover{background:transparent;color:var(--ouro)}
.lnk{font:500 1rem var(--f-tit);text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:2px;text-decoration-color:var(--oferta)}
.lnk:hover{text-decoration-color:var(--demanda)}

/* topo */
.top{position:fixed;inset:0 0 auto 0;z-index:50;background:var(--nevoa);height:68px;transition:box-shadow .2s}
.top.scrolled{box-shadow:0 1px 0 var(--nevoa2),0 8px 24px -14px rgba(29,30,32,.35)}
.top .wrap{display:flex;align-items:center;justify-content:space-between;height:68px}
.brand{display:flex;align-items:center;gap:.6rem;text-decoration:none;font:600 1.3rem var(--f-tit)}
.brand i{display:grid;place-items:center;width:34px;height:34px;background:var(--grafite);color:var(--ouro);font:700 1.15rem var(--f-tit);font-style:normal;border-radius:8px 8px 8px 2px}
nav#menu{display:flex;align-items:center;gap:1.6rem}
nav#menu a:not(.btn){text-decoration:none;font-weight:500;font-size:.98rem;padding:.4rem 0;border-bottom:2px solid transparent}
nav#menu a:not(.btn):hover{border-bottom-color:var(--oferta)}
.burger{display:none;width:46px;height:46px;border:0;background:transparent;cursor:pointer;border-radius:8px}
.burger span{display:block;width:24px;height:2px;background:var(--grafite);margin:6px auto;transition:transform .25s,opacity .25s}
.burger[aria-expanded=true] span:nth-child(1){transform:translateY(8px) rotate(45deg)}
.burger[aria-expanded=true] span:nth-child(2){opacity:0}
.burger[aria-expanded=true] span:nth-child(3){transform:translateY(-8px) rotate(-45deg)}

/* hero */
.hero{padding:110px 0 0;overflow:hidden}
.hero .wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.95fr);gap:3.2rem;align-items:center;min-height:calc(100svh - 110px);padding-bottom:3rem}
.chip{display:inline-flex;align-items:center;gap:.55rem;font:500 .95rem var(--f-tit);padding:.35rem .9rem .35rem .7rem;border:1.5px solid var(--grafite);border-radius:999px;margin-bottom:1.4rem}
.chip::before{content:"";width:10px;height:10px;border-radius:50%;background:var(--oferta)}
.hero h1 em{font-style:normal;color:var(--oferta)}
.hero p.sub{font-size:1.2rem;color:var(--suave);max-width:34rem;margin:1.4rem 0 2rem}
.hero .acts{display:flex;flex-wrap:wrap;align-items:center;gap:1.4rem}
.chart{background:var(--grafite);border-radius:26px 26px 26px 4px;padding:1rem 1rem .6rem;color:var(--claro);box-shadow:18px 18px 0 var(--nevoa2)}
.chart svg{width:100%;height:auto}
.chart figcaption{font-size:.86rem;color:var(--claro-suave);padding:.4rem .4rem .5rem}
.cl-rev{animation:rev 2.8s cubic-bezier(.3,.6,.2,1) .25s both}
@keyframes rev{from{width:0}to{width:560px}}
.ln-draw{stroke-dasharray:900;stroke-dashoffset:900;animation:draw 2.8s ease-out .25s forwards}
@keyframes draw{to{stroke-dashoffset:0}}
.lbl{opacity:0;animation:fadein .6s ease-out forwards}
.lbl.l1{animation-delay:1.7s}.lbl.l2{animation-delay:2.9s}
@keyframes fadein{to{opacity:1}}

/* decide */
.decide{background:var(--grafite);color:var(--claro);padding:6rem 0}
.decide .wrap{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:4rem}
.decide h2{position:sticky;top:110px;align-self:start}
.decide h2 span{color:var(--ouro)}
.steps{list-style:none;padding:0;border-left:3px solid #3a3d44}
.steps li{position:relative;padding:0 0 2.6rem 2.2rem}
.steps li:last-child{padding-bottom:0}
.steps li::before{content:"";position:absolute;left:-10px;top:.25rem;width:17px;height:17px;border-radius:50%;background:var(--c)}
.steps li:nth-child(1){--c:var(--demanda)}.steps li:nth-child(2){--c:var(--ouro)}.steps li:nth-child(3){--c:var(--oferta)}
.steps h3{margin-bottom:.5rem}
.steps p{color:var(--claro-suave);max-width:34rem}

/* ativos */
.ativos{padding:6rem 0}
.ativos h2{max-width:20ch;margin-bottom:2.6rem}
.duo{display:grid;grid-template-columns:1.25fr 1fr;gap:1.5rem}
.plate{padding:2.2rem 2rem 2rem;border-radius:4px 28px 4px 28px;position:relative;overflow:hidden}
.plate.au{background:var(--ouro);color:#14110d}
.plate.nq{background:var(--demanda);color:#fff;border-radius:28px 4px 28px 4px}
.plate b{display:block;font:700 clamp(2.2rem,5vw,3.6rem) var(--f-tit);line-height:1;margin-bottom:.8rem}
.plate p{max-width:26rem}
.plate small{display:block;margin-top:1.2rem;font-weight:500}
.ativos .note{margin-top:1.6rem;color:var(--suave)}

/* criadores */
.criadores{background:var(--nevoa2);padding:6rem 0}
.criadores .wrap{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:3rem}
.pair{display:grid;grid-template-columns:1fr 1fr;gap:2.4rem}
.pair h3{font-size:1.7rem;margin-bottom:.2rem}
.pair .role{color:var(--oferta);font-weight:600;margin-bottom:.8rem;font-family:var(--f-tit)}
.pair p{color:var(--suave)}
.social{margin-top:.9rem;display:flex;gap:1.1rem;flex-wrap:wrap}

/* reserva */
.reserva{padding:6rem 0}
.reserva .box{background:var(--grafite);color:var(--claro);border-radius:34px 6px 34px 6px;padding:clamp(2rem,6vw,4.5rem);display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:2.5rem;align-items:center}
.reserva h2 em{font-style:normal;color:var(--ouro)}
.reserva p{color:var(--claro-suave);margin:1rem 0 0;max-width:32rem}
.reserva .side{display:grid;gap:1rem;justify-items:start}
.reserva .tel{font:500 1.05rem var(--f-tit);color:var(--claro)}

/* faq */
.faq{padding:2rem 0 6rem}
.faq h2{margin-bottom:2.4rem}
.qa{display:grid;grid-template-columns:1fr 1fr;gap:2.2rem 4rem}
.qa h3{font-size:1.15rem;margin-bottom:.4rem;font-weight:600}
.qa p{color:var(--suave)}

footer{background:var(--grafite);color:var(--claro-suave);padding:3.4rem 0 2.4rem;font-size:.95rem}
footer .wrap{display:grid;gap:1.6rem}
footer .row{display:flex;flex-wrap:wrap;gap:1rem 2.4rem;align-items:center;justify-content:space-between}
footer a{color:var(--claro)}
footer .risk{font-size:.84rem;line-height:1.55;max-width:70ch}

/* entrada unica do hero */
.hero .wrap>*{opacity:1}
.js body:not(.ready) .hero .wrap>div:first-child{opacity:0;transform:translateY(14px)}
.hero .wrap>div:first-child{transition:opacity .8s ease,transform .8s ease}

@media (max-width:860px){
  .burger{display:block}
  nav#menu{position:fixed;inset:68px 0 auto 0;flex-direction:column;align-items:stretch;gap:0;background:var(--nevoa);padding:.6rem 16px 1.6rem;border-bottom:1px solid var(--nevoa2);box-shadow:0 18px 30px -18px rgba(29,30,32,.45);transform:translateY(-130%);visibility:hidden;transition:transform .3s ease,visibility 0s .3s;max-height:calc(100svh - 68px);overflow:auto}
  nav#menu.open{transform:none;visibility:visible;transition:transform .3s ease}
  nav#menu a:not(.btn){padding:1rem 0;border-bottom:1px solid var(--nevoa2);font-size:1.1rem}
  nav#menu .btn{margin-top:1.1rem}
  .hero .wrap,.decide .wrap,.criadores .wrap,.reserva .box,.duo{grid-template-columns:minmax(0,1fr)}
  .hero .wrap{min-height:0;gap:2.4rem}
  .decide h2{position:static}
  .decide,.ativos,.criadores,.reserva{padding:4rem 0}
  .pair,.qa{grid-template-columns:1fr}
  .chart{box-shadow:10px 10px 0 var(--nevoa2)}
}
