/* ============================================================
   Fernando Ferreira — Design System (Preto · Ouro · Vermelho)
   Identidade do cliente (design-guide.md). Não confundir com atpOS.
   ============================================================ */
:root{
  --bg:#0A0A0A; --panel:#161616; --panel2:#101010; --line:rgba(255,255,255,.12);
  --white:#FAFAFA; --soft:#C9C9C9; --muted:#8A8A8A; --dim:#5A5A5A;
  --gold:#E0A53B; --gold-soft:rgba(224,165,59,.5); --gold-grad:linear-gradient(180deg,rgba(224,165,59,.08),rgba(224,165,59,0) 70%);
  --red:#D81E2C; --red-soft:rgba(216,30,44,.45); --red-grad:linear-gradient(180deg,rgba(216,30,44,.08),rgba(216,30,44,0) 70%);
}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{font-family:'Inter',sans-serif;background:var(--bg);color:var(--white);line-height:1.6;-webkit-font-smoothing:antialiased;}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
.wrap{max-width:1100px;margin:0 auto;padding:0 28px;}
.narrow{max-width:820px;}
.disp{font-family:'Anton',sans-serif;font-weight:400;text-transform:uppercase;letter-spacing:.005em;line-height:1;}
.eyebrow{font-family:'Oswald',sans-serif;font-size:13px;font-weight:600;letter-spacing:.28em;text-transform:uppercase;color:var(--gold);}
b.g{color:var(--gold);} b.r{color:var(--red);}
.g{color:var(--gold);} .r{color:var(--red);}

/* ---------- Buttons ---------- */
.btn{display:inline-flex;align-items:center;gap:10px;font-family:'Oswald',sans-serif;font-weight:600;text-transform:uppercase;letter-spacing:.06em;font-size:15px;background:var(--red);color:#fff;padding:15px 28px;border-radius:8px;border:none;cursor:pointer;transition:transform .15s,filter .15s;}
.btn:hover{filter:brightness(1.1);transform:translateY(-1px);}
.btn.ghost{background:transparent;border:1px solid var(--line);color:var(--white);}
.btn.ghost:hover{border-color:var(--gold-soft);}
.btn.sm{padding:11px 20px;font-size:13px;}

/* ---------- Nav ---------- */
header{position:sticky;top:0;z-index:50;background:rgba(10,10,10,.85);backdrop-filter:blur(12px);border-bottom:1px solid var(--line);}
nav{display:flex;align-items:center;justify-content:space-between;height:74px;}
.brand{font-family:'Anton',sans-serif;text-transform:uppercase;font-size:22px;letter-spacing:.02em;}
.brand b{color:var(--gold);font-weight:400;}
.navlinks{display:flex;gap:28px;align-items:center;}
.navlinks a{font-size:14.5px;color:var(--soft);font-weight:500;transition:color .15s;}
.navlinks a:hover,.navlinks a.active{color:var(--white);}
.navlinks a.active{color:var(--gold);}

/* ---------- Sections / headings ---------- */
section{padding:78px 0;border-bottom:1px solid var(--line);}
.sec-head{max-width:760px;}
h1{font-family:'Anton',sans-serif;text-transform:uppercase;line-height:1;}
h2{font-family:'Anton',sans-serif;text-transform:uppercase;font-size:clamp(30px,4.4vw,52px);line-height:1.04;margin-top:20px;}
.sec-head p{color:var(--soft);font-size:17px;margin-top:18px;}
.lead{font-size:18px;color:var(--soft);max-width:760px;margin-top:20px;}
.lead b{color:var(--white);font-weight:600;}
p.body{font-size:16px;color:var(--soft);max-width:760px;margin-top:16px;}
p.body b{color:var(--white);font-weight:600;}

/* ---------- Page hero (internal) ---------- */
.phero{padding:84px 0 64px;background:radial-gradient(120% 70% at 12% 8%,rgba(224,165,59,.10),transparent 55%);border-bottom:1px solid var(--line);}
.phero h1{font-size:clamp(40px,6vw,76px);margin-top:26px;}
.phero h1 .g{color:var(--gold);} .phero h1 .r{color:var(--red);}
.phero .lead{margin-top:22px;}
.phero .cta{display:flex;gap:14px;margin-top:30px;flex-wrap:wrap;}
.crumbs{font-family:'Oswald',sans-serif;font-size:12.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);}
.crumbs a:hover{color:var(--gold);}

/* ---------- Grids / cards ---------- */
.grid{display:grid;gap:16px;margin-top:30px;}
.c2{grid-template-columns:1fr 1fr;} .c3{grid-template-columns:1fr 1fr 1fr;} .c4{grid-template-columns:repeat(4,1fr);}
.card{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:26px;}
.card.gold{border-color:var(--gold-soft);background:var(--gold-grad),var(--panel);}
.card.red{border-color:var(--red-soft);background:var(--red-grad),var(--panel);}
.card .k{font-family:'Oswald',sans-serif;font-size:12px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);}
.card.gold .k{color:var(--gold);} .card.red .k{color:var(--red);}
.card h3{font-family:'Oswald',sans-serif;font-weight:600;font-size:20px;margin:10px 0 8px;text-transform:uppercase;letter-spacing:.01em;}
.card p{font-size:14.5px;color:var(--soft);}
.card p b{color:var(--white);}
.card a.more{display:inline-block;margin-top:14px;color:var(--gold);font-family:'Oswald',sans-serif;font-size:13px;letter-spacing:.06em;text-transform:uppercase;}

/* ---------- Stats ---------- */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:30px;}
.stat{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:22px;text-align:center;}
.stat .n{font-family:'Anton',sans-serif;font-size:38px;line-height:1;}
.stat .n .g{color:var(--gold);} .stat .n .r{color:var(--red);}
.stat .l{font-size:12.5px;color:var(--muted);margin-top:8px;}

/* ---------- Clean list ---------- */
ul.clean{list-style:none;margin-top:22px;display:flex;flex-direction:column;gap:13px;}
ul.clean li{padding-left:28px;position:relative;font-size:16px;color:var(--soft);max-width:820px;}
ul.clean li:before{content:"";position:absolute;left:0;top:9px;width:9px;height:9px;background:var(--gold);transform:skewX(-12deg);}
ul.clean li b{color:var(--white);font-weight:600;}
ul.clean.red li:before{background:var(--red);}

/* ---------- Steps ---------- */
.steps{display:flex;flex-direction:column;gap:14px;margin-top:30px;}
.stp{display:grid;grid-template-columns:64px 1fr;gap:18px;align-items:start;background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:22px 24px;}
.stp .no{font-family:'Anton',sans-serif;font-size:40px;color:var(--gold);line-height:.9;}
.stp h3{font-family:'Oswald',sans-serif;text-transform:uppercase;font-size:18px;letter-spacing:.02em;margin-bottom:6px;}
.stp p{font-size:15px;color:var(--soft);}
.stp p b{color:var(--white);}

/* ---------- Quote callout ---------- */
.quote{text-align:center;padding:84px 0;background:linear-gradient(180deg,#0c0c0c,#0a0a0a);}
.quote .q{font-family:'Anton',sans-serif;text-transform:uppercase;font-size:clamp(26px,4vw,50px);line-height:1.04;max-width:960px;margin:0 auto;}
.quote .q .r{color:var(--red);} .quote .q .g{color:var(--gold);}
.quote .src{font-family:'Oswald',sans-serif;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);font-size:13px;margin-top:24px;}
.callout{background:linear-gradient(135deg,#1a1206,#0a0a0a 65%);border:1px solid var(--gold-soft);border-radius:20px;padding:42px;margin-top:32px;}
.callout.red{border-color:var(--red-soft);background:linear-gradient(135deg,#1a0608,#0a0a0a 65%);}
.callout .q{font-family:'Anton',sans-serif;text-transform:uppercase;font-size:clamp(22px,3.2vw,36px);line-height:1.06;}
.callout .q .g{color:var(--gold);} .callout .q .r{color:var(--red);}
.callout .src{font-family:'Oswald',sans-serif;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);font-size:12.5px;margin-top:16px;}

/* ---------- Authority: YouTube + IG ---------- */
.yt-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:18px;margin-top:30px;align-items:center;}
.yt{background:var(--panel);border:1px solid var(--line);border-radius:14px;overflow:hidden;}
.yt .frame{position:relative;aspect-ratio:16/9;background:#000;}
.yt iframe{position:absolute;inset:0;width:100%;height:100%;border:0;}
.yt .cap{padding:14px 18px;font-size:13.5px;color:var(--soft);}
.yt .cap b{color:var(--white);}
.yt .cap .src{display:block;font-family:'Oswald',sans-serif;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);margin-bottom:5px;}
.yt-side{display:flex;flex-direction:column;gap:18px;}
.ig-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:18px;}
.igc{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:20px;display:flex;flex-direction:column;gap:10px;transition:border-color .2s,transform .2s;}
.igc:hover{border-color:var(--gold-soft);transform:translateY(-2px);}
.igc .metric{font-family:'Anton',sans-serif;font-size:30px;color:var(--gold);line-height:1;}
.igc .metric.viral{color:var(--red);}
.igc .t{font-size:14px;color:var(--white);font-weight:600;flex:1;}
.igc .lk{font-family:'Oswald',sans-serif;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);}
.igc:hover .lk{color:var(--gold);}
.medialogos{display:flex;flex-wrap:wrap;gap:12px;margin-top:22px;}
.medialogos .m{border:1px solid var(--line);border-radius:10px;padding:14px 22px;color:var(--soft);font-family:'Oswald',sans-serif;letter-spacing:.1em;text-transform:uppercase;font-size:13.5px;background:var(--panel);}

/* ---------- Testimonials ---------- */
.tests{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:30px;}
.test{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:26px;}
.test .stars{color:var(--gold);letter-spacing:3px;font-size:15px;}
.test p{font-size:15px;color:var(--white);margin:14px 0 18px;line-height:1.55;}
.test .who{display:flex;align-items:center;gap:12px;}
.test .av{width:40px;height:40px;border-radius:50%;background:linear-gradient(135deg,#262626,#141414);border:1px solid var(--line);}
.test .who .nm{font-weight:600;font-size:14px;} .test .who .rl{font-size:12.5px;color:var(--muted);}
.ph-note{font-family:'Oswald',sans-serif;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--dim);margin-top:16px;}

/* ---------- CTA band ---------- */
.band{background:linear-gradient(135deg,#1a0608,#0a0a0a 60%);border:1px solid var(--red-soft);border-radius:22px;padding:58px 46px;text-align:center;}
.band h2{font-size:clamp(28px,4vw,48px);line-height:1.02;}
.band p{color:var(--soft);font-size:17px;margin:16px auto 28px;max-width:560px;}

/* ---------- FAQ ---------- */
.faq{margin-top:30px;border-top:1px solid var(--line);}
.faq details{border-bottom:1px solid var(--line);padding:22px 4px;}
.faq summary{font-family:'Oswald',sans-serif;font-weight:500;font-size:18px;cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:20px;}
.faq summary::-webkit-details-marker{display:none;}
.faq summary:after{content:"+";color:var(--gold);font-size:24px;}
.faq details[open] summary:after{content:"\2013";}
.faq p{color:var(--soft);font-size:15px;margin-top:14px;max-width:840px;}

/* ---------- Form (diagnóstico) ---------- */
.form{background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:34px;margin-top:30px;max-width:640px;}
.form label{display:block;font-size:13px;font-family:'Oswald',sans-serif;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:18px 0 8px;}
.form input,.form select,.form textarea{width:100%;background:var(--panel2);border:1px solid var(--line);border-radius:10px;padding:13px 15px;color:var(--white);font-family:'Inter',sans-serif;font-size:15px;}
.form input:focus,.form select:focus,.form textarea:focus{outline:none;border-color:var(--gold-soft);}
.form .opts{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px;}
.form .opts label{margin:0;}
.form .row{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
.form .btn{margin-top:24px;width:100%;justify-content:center;}
.lgpd{font-size:12px;color:var(--muted);margin-top:14px;text-align:center;}

/* ---------- Legal prose ---------- */
.prose{max-width:820px;margin-top:24px;}
.prose h2{font-family:'Oswald',sans-serif;text-transform:uppercase;font-size:22px;letter-spacing:.02em;margin:34px 0 12px;}
.prose h3{font-size:17px;font-weight:700;margin:22px 0 8px;color:var(--white);}
.prose p,.prose li{color:var(--soft);font-size:15.5px;margin-top:10px;line-height:1.7;}
.prose ul{margin:8px 0 8px 22px;}
.prose b{color:var(--white);}
.minuta{border:1px solid var(--gold-soft);background:var(--gold-grad);border-radius:12px;padding:16px 20px;color:var(--gold);font-size:13.5px;margin-top:20px;}

/* ---------- Footer ---------- */
footer{padding:60px 0 40px;background:#070707;}
.fgrid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:30px;}
.fgrid h4{font-family:'Oswald',sans-serif;text-transform:uppercase;letter-spacing:.12em;font-size:13px;color:var(--muted);margin-bottom:16px;}
.fgrid a{display:block;color:var(--soft);font-size:14px;margin-bottom:10px;}
.fgrid a:hover{color:var(--gold);}
.fbrand{font-family:'Anton',sans-serif;text-transform:uppercase;font-size:24px;}
.fbrand b{color:var(--gold);font-weight:400;}
.fbrand + p{color:var(--muted);font-size:13.5px;margin-top:12px;max-width:300px;}
.legal{margin-top:40px;padding-top:24px;border-top:1px solid var(--line);color:var(--dim);font-size:12.5px;line-height:1.7;}
.legal b{color:var(--muted);}
.legal a{color:var(--muted);text-decoration:underline;}

/* ---------- Mockup ribbon ---------- */
.mock{position:fixed;bottom:0;left:0;right:0;background:var(--gold);color:#000;text-align:center;font-family:'Oswald',sans-serif;font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;padding:6px;z-index:99;font-weight:600;}

@media(max-width:900px){
  .navlinks{display:none;}
  .yt-grid{grid-template-columns:1fr;}
}
@media(max-width:820px){
  .c2,.c3,.c4,.stats,.tests,.ig-grid,.form .opts,.form .row{grid-template-columns:1fr;}
  .fgrid{grid-template-columns:1fr 1fr;}
}
@media print{.mock{display:none;} section{page-break-inside:avoid;} body{background:#000;}}
