
/* ============ TOKENS ============ */
:root{
  --bg:#05070a;
  --bg-soft:#080b11;
  --panel:#0c1220;
  --panel-2:#0f1730;
  --navy:#101c38;
  --navy-2:#0a1226;
  --silver:#cdd2da;
  --silver-dim:#b8c0cd;
  --silver-faint:#a9b3c2;
  --white:#f3f4f6;
  --line:rgba(205,210,218,.14);
  --line-strong:rgba(205,210,218,.30);
  --accent:#9db1e0;
  --fold:#1a2848;
  --radius-s:2px;
  --ease:cubic-bezier(.16,1,.3,1);
  --display:'Jost', -apple-system, sans-serif;
  --body:'Jost', -apple-system, sans-serif;
  --mono:'IBM Plex Mono', ui-monospace, monospace;
  --maxw:1180px;
  --gutter:clamp(20px, 5vw, 64px);
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:auto;scroll-padding-top:84px}
@media (prefers-reduced-motion: no-preference){ html{ scroll-behavior:smooth } }
body{
  margin:0;
  background:var(--bg);
  color:var(--white);
  font-family:var(--body);
  font-size:16px;
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img,svg{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
h1,h2,h3,p,figure{margin:0}
ul{margin:0;padding:0;list-style:none}
button{font:inherit;color:inherit;background:none;border:none;cursor:pointer}
input,select{font:inherit;color:inherit}
fieldset{border:0;padding:0;margin:0;min-width:0}
legend{padding:0;width:100%}

.wrap{max-width:var(--maxw);margin-inline:auto;padding-inline:var(--gutter)}

:focus-visible{outline:2px solid var(--accent);outline-offset:3px}

.skip-link{
  position:absolute;left:12px;top:-48px;background:var(--white);color:var(--bg);
  padding:10px 16px;z-index:200;transition:top .2s var(--ease);font-family:var(--mono);font-size:13px;
}
.skip-link:focus{top:12px}

/* eyebrow / labels */
.eyebrow{
  font-family:var(--body);font-size:12px;font-weight:500;line-height:1.4;
  letter-spacing:.1em;text-transform:uppercase;color:var(--silver-dim);display:inline-block;
}

h1{font-family:var(--display);font-weight:440;letter-spacing:-.01em}
.h2{font-family:var(--display);font-weight:420;letter-spacing:-.01em;font-size:clamp(1.9rem,3.6vw,2.9rem);line-height:1.12;color:var(--white)}
.lede{color:var(--silver-dim);font-size:clamp(1rem,1.6vw,1.15rem);line-height:1.6;max-width:52ch}

.section{padding-block:clamp(64px,9vw,120px)}
.section--tight{padding-block:clamp(40px,6vw,72px)}
.hline{height:1px;background:var(--line);border:none;margin:0}

/* placeholder data marker */
.ph{border-bottom:1px dashed var(--silver-faint);opacity:.72;cursor:help}

/* ============ CORNER-FOLD SIGNATURE ============
   "Canto" = corner, in Portuguese. Every key panel carries one
   folded corner, alternating orientation, as the page's recurring
   motif — a literal, quiet callback to the brand name. */
.fold{position:relative;background:var(--panel);border:1px solid var(--line)}
.fold::after{
  content:"";position:absolute;width:22px;height:22px;
  background:linear-gradient(135deg, var(--fold) 0 50%, transparent 50.5%);
  pointer-events:none;
}
.fold--tr{clip-path:polygon(0 0,calc(100% - 22px) 0,100% 22px,100% 100%,0 100%)}
.fold--tr::after{top:0;right:0;transform:rotate(90deg)}
.fold--bl{clip-path:polygon(0 0,100% 0,100% 100%,22px 100%,0 calc(100% - 22px))}
.fold--bl::after{bottom:0;left:0;transform:rotate(-90deg)}

/* ============ BUTTONS ============ */
.btn{
  display:inline-flex;align-items:center;gap:10px;
  padding:14px 26px;font-family:var(--body);font-weight:600;font-size:.95rem;
  transition:transform .35s var(--ease), background-color .25s var(--ease), border-color .25s var(--ease);
  clip-path:polygon(0 0, calc(100% - 14px) 0, 100% 14px, 100% 100%, 0 100%);
}
.btn-primary{background:var(--white);color:var(--bg)}
.btn-primary:hover{transform:translateY(-2px)}
.btn-ghost{border:1px solid var(--line-strong);color:var(--silver)}
.btn-ghost:hover{border-color:var(--silver);background:rgba(255,255,255,.03)}
.btn-arrow{transition:transform .35s var(--ease)}
.btn:hover .btn-arrow{transform:translateX(3px)}
@media (prefers-reduced-motion: reduce){ .btn{transition:none} .btn:hover{transform:none} }

.micro{font-family:var(--mono);font-size:12.5px;color:var(--silver-dim);letter-spacing:.02em}

/* ============ HEADER ============ */
.site-header{
  position:fixed;top:0;left:0;right:0;z-index:100;
  padding-block:18px;transition:background-color .3s var(--ease), border-color .3s var(--ease);
  border-bottom:1px solid transparent;
}
.site-header.is-scrolled{background:rgba(5,7,10,.86);backdrop-filter:blur(10px);border-color:var(--line)}
.site-header .wrap{display:flex;align-items:center;justify-content:space-between}
.logo{display:flex;align-items:center;gap:10px;font-family:var(--display);font-size:1.15rem;letter-spacing:-.01em}
.nav-links{display:none;gap:32px;font-size:.9rem;color:var(--silver-dim)}
.nav-links a{transition:color .2s}
.nav-links a:hover{color:var(--white)}
@media (min-width:900px){.nav-links{display:flex}}
.header-cta{display:none}
@media (min-width:640px){.header-cta{display:inline-flex;padding:10px 20px;font-size:.85rem}}

/* ============ SECTION HEADS ============ */
.section-head{max-width:640px;margin-bottom:clamp(32px,5vw,56px)}
.section-head .eyebrow{margin-bottom:16px}

/* ============ PROOF BAR ============ */
.proof{border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.proof-grid{display:grid;grid-template-columns:1fr;gap:0}
@media (min-width:760px){.proof-grid{grid-template-columns:repeat(3,1fr)}}
.proof-item{padding:clamp(28px,4vw,44px) var(--gutter);border-top:1px solid var(--line)}
.proof-item:first-child{border-top:none}
@media (min-width:760px){
  .proof-item{border-top:none;border-left:1px solid var(--line)}
  .proof-item:first-child{border-left:none}
}
.proof-metric{font-family:var(--mono);font-size:clamp(2.1rem,4vw,3rem);color:var(--white);font-weight:500}
.proof-channel{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--silver-faint);margin-top:10px}
.proof-context{color:var(--silver-dim);margin-top:8px;font-size:.94rem;max-width:34ch}

/* ============ BIG IDEA / FLOW ============ */
.bigidea .h2{max-width:18ch}
.bigidea-copy{margin-top:24px;display:grid;gap:16px;max-width:60ch}
.bigidea-copy p{color:var(--silver-dim)}
.bigidea-copy p:first-child{color:var(--silver)}

/* ============ CASES ============ */
.cases-list{display:grid;gap:1px;background:var(--line);border:1px solid var(--line)}
.case{background:var(--bg);padding:clamp(28px,4vw,48px) var(--gutter)}
.case-top{display:flex;align-items:baseline;gap:20px;justify-content:space-between;flex-wrap:wrap}
.case-num{font-family:var(--display);font-size:clamp(3rem,6vw,4.4rem);color:var(--panel-2);line-height:1;font-weight:400}
.case-heading{font-family:var(--display);font-size:clamp(1.3rem,2.4vw,1.7rem);max-width:30ch}
.case-meta{font-family:var(--mono);font-size:11.5px;color:var(--silver-faint);letter-spacing:.08em;text-transform:uppercase}
.case-grid{margin-top:24px;display:grid;gap:22px}
@media (min-width:760px){.case-grid{grid-template-columns:repeat(4,1fr)}}
.case-block h4{font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--silver-faint);margin-bottom:8px}
.case-block p{color:var(--silver);font-size:.94rem}

/* ============ SERVICES (list, not cards) ============ */
.services-list{border-top:1px solid var(--line)}
.service-row{
  display:grid;grid-template-columns:1fr;gap:10px;
  padding:28px 0;border-bottom:1px solid var(--line);
  transition:padding-left .35s var(--ease);
}
@media (min-width:760px){
  .service-row{grid-template-columns:1fr 1.4fr;gap:40px;align-items:baseline}
}
.service-row:hover{padding-left:12px}
@media (prefers-reduced-motion: reduce){.service-row:hover{padding-left:0}}
.service-title{font-family:var(--display);font-size:clamp(1.25rem,2.2vw,1.6rem);display:flex;align-items:baseline;gap:14px}
.service-title .micro{color:var(--silver-faint)}
.service-desc{color:var(--silver-dim)}

/* ============ FIT (para quem é) ============ */
.fit-grid{display:grid;grid-template-columns:1fr;border-top:1px solid var(--line)}
@media (min-width:820px){.fit-grid{grid-template-columns:1fr 1fr}}
.fit-col{padding:clamp(28px,4vw,44px) 0}
@media (min-width:820px){
  .fit-col:first-child{padding-right:var(--gutter);border-right:1px solid var(--line)}
  .fit-col:last-child{padding-left:var(--gutter)}
}
.fit-col h3{font-family:var(--display);font-size:1.35rem;margin-bottom:20px}
.fit-list li{display:flex;gap:14px;padding:12px 0;border-top:1px solid var(--line);color:var(--silver-dim)}
.fit-list li:first-child{border-top:none}
.fit-mark{font-family:var(--mono);color:var(--silver-faint);flex-shrink:0}
.fit-col--yes .fit-mark{color:var(--accent)}

/* ============ DIAGNOSIS (oferta) ============ */
.diagnosis-panel{
  background:linear-gradient(165deg, var(--navy) 0%, var(--navy-2) 100%);
  border:1px solid var(--line-strong);
  padding:clamp(32px,5vw,64px);
  clip-path:polygon(0 0,calc(100% - 34px) 0,100% 34px,100% 100%,0 100%);
  position:relative;overflow:hidden;
}
.diagnosis-panel::before{
  content:"";position:absolute;top:0;right:0;width:34px;height:34px;
  background:linear-gradient(135deg, rgba(255,255,255,.05) 0 50%, transparent 50.5%);
}
.diagnosis-head{max-width:640px}
.tabs{margin-top:40px}
.tablist{display:inline-flex;border:1px solid var(--line-strong);padding:3px}
.tab{padding:9px 18px;font-family:var(--mono);font-size:12.5px;letter-spacing:.04em;color:var(--silver-dim);transition:background-color .25s,color .25s}
.tab[aria-selected="true"]{background:var(--white);color:var(--bg)}
.tabpanel{margin-top:28px;display:grid;gap:28px}
@media (min-width:760px){.tabpanel{grid-template-columns:1.2fr 1fr}}
.tabpanel[hidden]{display:none}
.tabpanel p{color:var(--silver-dim);font-size:1rem;max-width:48ch;white-space:pre-line}
.takeaway h4{font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--silver-faint);margin-bottom:14px}
.takeaway li{display:flex;gap:10px;color:var(--silver);padding:8px 0;border-top:1px solid var(--line)}
.takeaway li:first-child{border-top:none}
.diagnosis-cta{margin-top:40px;display:flex;flex-wrap:wrap;align-items:center;gap:16px}
.invest-note{margin-top:28px;padding-top:24px;border-top:1px solid var(--line);color:var(--silver-dim);font-size:.9rem;max-width:60ch}

#investimento{background:#fff;color:#101c38;--white:#101c38;--silver-dim:#4b5563;--silver-faint:#4b5563}
#investimento .diagnosis-panel{background:transparent;border:0;clip-path:none;padding:0;overflow:visible}
#investimento .diagnosis-panel::before{display:none}
#investimento .btn-primary{background:#101c38;color:#fff}

/* ============ FAQ ============ */
.faq-list{border-top:1px solid var(--line)}
.faq-item{border-bottom:1px solid var(--line)}
.faq-q{
  width:100%;display:flex;align-items:center;justify-content:space-between;gap:20px;
  padding:22px 0;text-align:left;
}
.faq-q .h2{font-family:var(--body);font-weight:600;font-size:1.02rem;color:var(--white)}
.faq-icon{font-family:var(--mono);color:var(--silver-faint);flex-shrink:0;transition:transform .3s var(--ease)}
.faq-q[aria-expanded="true"] .faq-icon{transform:rotate(45deg)}
.faq-q{list-style:none;cursor:pointer}
.faq-q::-webkit-details-marker{display:none}
.faq-item[open] .faq-icon{transform:rotate(45deg)}
.faq-a{max-height:0;overflow:hidden;transition:max-height .4s var(--ease)}
.faq-a-inner{padding-bottom:22px;color:var(--silver-dim);max-width:64ch}

/* ============ FINAL CTA + FORM ============ */
.finalcta{position:relative;text-align:left}
.finalcta .h2{font-size:clamp(2rem,4.4vw,3.1rem);max-width:16ch}
.finalcta .lede{margin-top:20px}

.form-panel{
  margin-top:56px;background:var(--panel);border:1px solid var(--line-strong);
  padding:clamp(24px,4vw,44px);max-width:640px;
  clip-path:polygon(0 0,100% 0,100% 100%,26px 100%,0 calc(100% - 26px));
  position:relative;
}
.form-panel::after{
  content:"";position:absolute;bottom:0;left:0;width:26px;height:26px;
  background:linear-gradient(-45deg, rgba(255,255,255,.05) 0 50%, transparent 50.5%);
}
.form-progress{display:flex;gap:8px;margin-bottom:28px}
.form-progress span{height:2px;flex:1;background:var(--line)}
.form-progress span.is-done,.form-progress span.is-active{background:var(--accent)}
.form-step{display:none}
.form-step.is-active{display:block;animation:step-in .45s var(--ease)}
@keyframes step-in{from{opacity:0;transform:translateX(10px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion: reduce){.form-step.is-active{animation:none}}
.field{margin-bottom:20px}
.field label{display:block;font-family:var(--mono);font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--silver-faint);margin-bottom:10px}
.field input,.field select{
  width:100%;background:transparent;border:none;border-bottom:1px solid var(--line-strong);
  padding:10px 2px;color:var(--white);font-size:1rem;
}
.field select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%238890a0'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 4px center}
.field select option{background:var(--panel);color:var(--white)}
.field input:focus,.field select:focus{outline:none;border-color:var(--accent)}
.pill-group{display:flex;gap:12px}
.pill{border:1px solid var(--line-strong);padding:10px 22px;font-size:.92rem;transition:border-color .2s,background-color .2s}
.pill[aria-checked="true"]{background:var(--white);color:var(--bg);border-color:var(--white)}
.form-nav{display:flex;justify-content:space-between;align-items:center;margin-top:8px}
.form-back{color:var(--silver-dim);font-size:.9rem}
.form-back[hidden]{display:none}
.form-success{display:none;text-align:center;padding:20px 0}
.form-success.is-active{display:block}
.field-error{display:none;margin:8px 0 0;color:#f5c2c7;font-size:.84rem}
.field.is-invalid .field-error{display:block}
.field.is-invalid input,.field.is-invalid select,.pill-group.is-invalid{border-color:#f5c2c7}

/* sticky mobile CTA */
.sticky-cta{
  position:fixed;left:0;right:0;bottom:0;z-index:90;
  padding:12px var(--gutter) calc(12px + env(safe-area-inset-bottom));
  background:rgba(5,7,10,.92);backdrop-filter:blur(10px);border-top:1px solid var(--line);
  transform:translateY(100%);transition:transform .35s var(--ease);
}
.sticky-cta.is-visible{transform:translateY(0)}
.sticky-cta.is-hidden{display:none}
.sticky-cta .btn{width:100%;justify-content:center}
@media (min-width:900px){.sticky-cta{display:none}}

/* ============ FOOTER ============ */
.site-footer{border-top:1px solid var(--line);padding-block:44px}
.site-footer .wrap{display:flex;flex-direction:column;gap:24px}
@media (min-width:760px){.site-footer .wrap{flex-direction:row;justify-content:space-between;align-items:center}}
.footer-links{display:flex;gap:28px;flex-wrap:wrap;color:var(--silver-dim);font-size:.88rem}
.footer-legal{color:var(--silver-faint);font-size:.8rem;margin-top:18px}

/* reveal-on-scroll utility */
.reveal{transition:opacity .7s var(--ease), transform .7s var(--ease)}
.reveal.in-view{opacity:1;transform:none}
@media (prefers-reduced-motion: reduce){
  .reveal{opacity:1;transform:none;transition:none}
}
