/* ============================================================
   BORA! IA — home (boraia.ai)
   Identidade oficial: alto-mar à noite + âmbar de bússola
   Crimson Pro (headings) · Instrument Sans (body)
   ============================================================ */
:root{
  --navy:#0D1825; --navy-deep:#0A121D; --navy-soft:#182940;
  --papel:#F5F0E8; --creme:#EDE6D8;
  --texto:#F5F0E8; --texto-suave:#A8B0BD; --tinta:#0D1825; --tinta-suave:#6B7686;
  --hairline:rgba(168,176,189,.28); --hairline-strong:rgba(168,176,189,.5);
  --hairline-light:#DCD4C5;
  --gold:#D4A574; --cta:#D4A574; --cta-hover:#E8C89A; --cta-fg:#0D1825;
  --serif:'Crimson Pro',Georgia,'Times New Roman',serif;
  --sans:'Instrument Sans',system-ui,-apple-system,sans-serif;
  --maxw:1160px; --ease:cubic-bezier(.2,.8,.2,1);
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--navy);color:var(--texto);font-family:var(--sans);
  font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:hidden}
img,svg{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
.container{max-width:var(--maxw);margin:0 auto;padding:0 24px}
.container--narrow{max-width:760px}

/* ---------- reveal ---------- */
[data-reveal]{opacity:0;transform:translateY(18px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
.js-ready [data-reveal].is-visible,[data-reveal].is-visible{opacity:1;transform:none}

/* ---------- fio timbrado (invertido: dourado + azul-claro) ---------- */
.fio{width:100%}
.fio .a{height:3px;background:var(--gold)}
.fio .b{height:1px;background:var(--texto-suave)}

/* ---------- nav ---------- */
.nav{border-bottom:1px solid var(--hairline);background:var(--navy);position:relative;z-index:10}
.nav .row{display:flex;justify-content:space-between;align-items:center;padding:18px 0}
.logo{display:inline-flex;align-items:center}
.logo svg{height:26px;width:auto;display:block}
.nav .right{font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--texto-suave)}

/* ---------- tipografia ---------- */
h1,h2,h3,h4{margin:0}
.sec-index{display:flex;align-items:baseline;gap:14px;margin-bottom:16px}
.sec-index .n{font-family:var(--serif);font-size:1.5rem;font-weight:500;color:var(--texto-suave);font-variant-numeric:tabular-nums;line-height:1}
.sec-index .k{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.18em;color:var(--texto-suave)}
.sec-index .k::before{content:"";display:inline-block;width:14px;height:2px;background:var(--gold);margin-right:10px;vertical-align:middle}
h1{font-family:var(--serif);font-weight:500;font-size:clamp(2.2rem,4.6vw,3.6rem);line-height:1.1;letter-spacing:-.02em;color:var(--texto)}
h2{font-family:var(--serif);font-weight:500;font-size:clamp(1.9rem,3.4vw,2.8rem);line-height:1.12;letter-spacing:-.015em;color:var(--texto)}
.u-gold{border-bottom:2px solid var(--gold);padding-bottom:2px;font-style:normal}
.sub{font-size:1.08rem;line-height:1.7;color:var(--texto-suave);max-width:36em}
strong{color:var(--texto);font-weight:600}

/* seções claras invertem a tinta */
.light{background:var(--papel);color:var(--tinta)}
.light h2{color:var(--tinta)}
.light .sub{color:var(--tinta-suave)}
.light .sec-index .n,.light .sec-index .k{color:var(--tinta-suave)}
.light strong{color:var(--tinta)}

/* ---------- botões ---------- */
.btn-cta{display:inline-block;background:var(--cta);color:var(--cta-fg);border:0;border-radius:6px;
  padding:16px 32px;font-weight:700;font-size:14px;text-transform:uppercase;letter-spacing:.08em;
  cursor:pointer;transition:background .2s var(--ease),transform .2s var(--ease)}
.btn-cta:hover{background:var(--cta-hover);transform:translateY(-1px)}
.btn-cta--block{width:100%;text-align:center;padding:18px}
.cta-mid{text-align:center;margin-top:clamp(40px,5vw,64px)}

/* ---------- placa fotográfica (foto NATURAL, sem efeito — moldura fio dourado) ---------- */
.placa-wrap{position:relative;z-index:5}
.placa{position:relative;background:var(--navy-deep);border:1px solid var(--hairline-strong);border-radius:0}
.placa::before{content:"";position:absolute;top:10px;left:10px;right:-10px;bottom:-10px;border:1px solid var(--gold);pointer-events:none;z-index:0}
.placa img{width:100%;height:100%;object-fit:cover;position:relative;z-index:1}
.placa-cap{margin-top:12px;border-top:1px solid var(--hairline);padding-top:8px;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.16em;color:var(--texto-suave)}

/* ---------- HERO ---------- */
.hero{padding:72px 0 88px;background:linear-gradient(180deg,var(--navy-deep) 0%,var(--navy) 70%)}
.hero .grid{display:grid;grid-template-columns:1.35fr 1fr;gap:64px;align-items:center}
.hero h1{margin:0}
.hero h1 em{font-style:italic;color:var(--gold)}
.hero .sub{margin-top:20px}
.cta-row{display:flex;gap:24px;align-items:center;margin-top:32px;flex-wrap:wrap}
.hero .placa{aspect-ratio:4/5}
.hero .placa img{object-position:center 20%}

/* ---------- logos ---------- */
.logos{border-top:1px solid var(--hairline);border-bottom:1px solid var(--hairline);padding:52px 0;background:var(--navy)}
.logos .k{text-align:center;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.2em;color:var(--texto-suave);margin-bottom:28px}
.logos .row{display:flex;justify-content:center;align-items:center;gap:clamp(24px,5vw,64px);flex-wrap:wrap}
/* logos 100% BRANCOS e visíveis sobre o navy */
.logos img{height:26px;width:auto;filter:brightness(0) invert(1);opacity:.85;transition:opacity .2s}
.logos img:hover{opacity:1}

/* ---------- TWO COMMA / premiação de funis (navy) ---------- */
.premio{background:var(--navy);padding:96px 0}
.premio .grid{display:grid;grid-template-columns:1fr 1.15fr;gap:64px;align-items:center}
.premio .placa{aspect-ratio:4/5}
.premio h2{margin-top:12px}
.premio .sub{margin-top:18px}

/* faixa de clientes atendidos */
.logos--clientes{background:var(--navy-deep)}
.logos--clientes img{height:30px}
.logos--clientes img.tall{height:56px;filter:none;opacity:1}

/* ---------- QUEM SOMOS (navy-deep) ---------- */
.quem{background:var(--navy-deep);padding:96px 0}
.quem .grid{display:grid;grid-template-columns:1.15fr 1fr;gap:72px;align-items:center}
.quem h2{margin-top:12px}
.quem .sub{margin-top:18px;font-size:1.05rem}
.metrics{border-top:1px solid var(--hairline)}
.metrics .mrow{display:flex;justify-content:space-between;align-items:baseline;border-bottom:1px solid var(--hairline);padding:18px 0}
.metrics .mrow .n{font-family:var(--serif);font-size:clamp(1.8rem,3vw,2.4rem);font-weight:500;color:var(--gold);line-height:1}
.metrics .mrow .l{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.16em;color:var(--texto-suave);text-align:right;max-width:16ch}

/* ---------- SOLUÇÕES (dobra clara — o coração da página) ---------- */
.solucoes{background:var(--papel);color:var(--tinta);padding:104px 0}
.solucoes .head{max-width:680px;margin-bottom:56px}
.solucoes .head h2{color:var(--tinta);margin-top:12px}
.solucoes .head .sub{color:var(--tinta-suave);margin-top:14px}
.sol-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:20px}
.sol{background:#FFFDF8;border:1px solid var(--hairline-light);padding:36px 30px;position:relative;display:flex;flex-direction:column;transition:border-color .2s,transform .2s}
.sol:hover{border-color:var(--tinta);transform:translateY(-4px)}
.sol::before{content:"";position:absolute;top:-1px;left:-1px;right:-1px;height:3px;background:var(--navy)}
.sol .ghost{font-family:var(--serif);font-size:3.4rem;font-weight:500;color:#DCD2C0;line-height:1;font-variant-numeric:tabular-nums}
.sol .tag{margin-top:18px;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.16em;color:var(--tinta-suave)}
.sol h3{font-family:var(--serif);font-weight:500;font-size:1.5rem;color:var(--tinta);margin:6px 0 12px;line-height:1.2}
.sol p{font-size:.98rem;color:var(--tinta-suave);margin:0 0 18px}
.sol ul{margin:0 0 22px;padding:0;list-style:none;border-top:1px solid var(--hairline-light)}
.sol li{font-size:.9rem;color:var(--tinta);padding:10px 0;border-bottom:1px solid var(--hairline-light);display:flex;gap:10px;align-items:baseline}
.sol li::before{content:"";width:12px;height:2px;background:var(--gold);flex:none;transform:translateY(-3px)}
.sol .btn-cta{margin-top:auto;text-align:center}
.sol--destaque{border-color:var(--navy)}
.sol--destaque::before{background:var(--gold)}

/* ---------- COMO FUNCIONA (navy) ---------- */
.passos{background:var(--navy);padding:96px 0}
.passos .head{max-width:640px;margin-bottom:56px}
.passos .head h2{margin-top:12px}
.passos .cols{display:grid;grid-template-columns:1fr 1fr 1fr}
.passos .col{padding:0 32px;border-left:1px solid var(--hairline)}
.passos .col:first-child{border-left:0;padding-left:0}
.passos .ghost{font-family:var(--serif);font-size:5rem;font-weight:500;color:var(--texto-suave);opacity:.55;line-height:1;font-variant-numeric:tabular-nums}
.passos h3{font-family:var(--serif);font-weight:500;font-size:1.35rem;color:var(--texto);margin:18px 0 10px}
.passos p{font-size:.98rem;color:var(--texto-suave)}

/* ---------- O QUE A IA DESTRAVA (navy-deep, fichas) ---------- */
.areas{background:var(--navy-deep);padding:96px 0}
.areas .head{max-width:660px;margin-bottom:48px}
.areas .head h2{margin-top:12px}
.areas .grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.ficha{background:rgba(168,176,189,.06);border:1px solid var(--hairline);padding:22px;position:relative;transition:border-color .2s,transform .2s}
.ficha:hover{border-color:var(--gold);transform:translateY(-3px)}
.ficha .n{position:absolute;top:16px;right:18px;font-family:var(--serif);color:var(--texto-suave);opacity:.7;font-size:1.1rem;font-variant-numeric:tabular-nums}
.ficha h4{font-weight:700;font-size:1rem;color:var(--texto);margin-bottom:4px}
.ficha p{font-size:.85rem;color:var(--texto-suave);margin:0}

/* ---------- QUEM ENTREGA (navy, dossiês) ---------- */
.entrega{background:var(--navy);padding:96px 0}
.entrega .head{max-width:660px;margin-bottom:48px}
.entrega .head h2{margin-top:12px}
.entrega .cols{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.dossie{border:1px solid var(--hairline-strong);padding:36px;position:relative;background:rgba(10,18,29,.35)}
.dossie::before{content:"";position:absolute;top:-1px;left:-1px;right:-1px;height:2px;background:var(--gold)}
.dossie .tag{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.16em;color:var(--texto-suave);margin-bottom:12px;display:inline-block}
.dossie h3{font-family:var(--serif);font-weight:500;font-size:1.6rem;color:var(--texto);margin-bottom:12px}
.dossie p{font-size:1rem;color:var(--texto-suave);margin:0}
.chip{display:inline-block;margin-top:16px;background:rgba(212,165,116,.14);color:var(--gold);border-radius:100px;padding:5px 14px;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.1em}

/* ---------- JORNADA (navy-deep) ---------- */
.jornada{background:var(--navy-deep);padding:96px 0}
.jornada .head{max-width:660px;margin-bottom:48px}
.jornada .head h2{margin-top:12px}
.timeline{position:relative;max-width:760px;padding-left:44px}
.timeline::before{content:"";position:absolute;left:11px;top:8px;bottom:8px;width:1px;background:var(--texto-suave);opacity:.4}
.tstep{position:relative;padding-bottom:34px}
.tstep:last-child{padding-bottom:0}
.tmark{position:absolute;left:-44px;top:0;width:24px;height:14px;display:flex;align-items:center}
.tmark i{width:13px;height:13px;border-radius:50%;border:1.5px solid var(--gold);background:var(--navy-deep)}
.tmark i+i{width:5px;height:5px;border:0;background:var(--gold);margin-left:-9px}
.tstep .when{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.16em;color:var(--texto-suave)}
.tstep h3{font-family:var(--serif);font-weight:500;font-size:1.3rem;color:var(--texto);margin:4px 0 6px}
.tstep p{font-size:.98rem;color:var(--texto-suave);max-width:46ch;margin:0}

/* ---------- vídeo ---------- */
.video{background:var(--navy);padding:96px 0}
.yt-facade{position:relative;cursor:pointer;border:1px solid var(--hairline-strong);aspect-ratio:16/9;overflow:hidden;background:#000}
.yt-facade::before{content:"";position:absolute;top:10px;left:10px;right:-10px;bottom:-10px;border:1px solid var(--gold);pointer-events:none;z-index:3}
.yt-facade img{width:100%;height:100%;object-fit:cover;opacity:.85}
.yt-facade__play{position:absolute;inset:0;margin:auto;width:74px;height:52px;border:0;background:transparent;cursor:pointer;display:flex;align-items:center;justify-content:center;z-index:4}
.yt-facade iframe{position:absolute;inset:0;width:100%;height:100%;border:0}

/* ---------- prints (dobra clara) ---------- */
.prints{background:var(--creme);color:var(--tinta);padding:96px 0}
.prints .head{max-width:660px;margin-bottom:44px}
.prints .head h2{color:var(--tinta);margin-top:12px}
.prints .head .sub{color:var(--tinta-suave)}
.prints .sec-index .n,.prints .sec-index .k{color:var(--tinta-suave)}
.prints__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:18px}
.prints__grid img{width:100%;border:1px solid var(--hairline-light);box-shadow:0 2px 16px rgba(13,24,37,.08)}

/* ---------- MENTORADOS (navy, avatares naturais) ---------- */
.mentor{background:var(--navy);padding:96px 0}
.mentor .head{max-width:660px;margin-bottom:44px}
.mentor .head h2{margin-top:12px}
.mentor__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:28px 22px}
.aluno{text-align:center;margin:0}
.aluno img{width:100%;aspect-ratio:1;object-fit:cover;object-position:center 20%;border-radius:50%;border:2px solid var(--gold)}
.aluno figcaption{margin-top:12px;font-family:var(--serif);font-size:1.1rem;color:var(--texto)}

/* ---------- FAQ (navy) ---------- */
.faq{background:var(--navy);padding:96px 0}
.faq .head{max-width:660px;margin:0 auto 40px}
.faq__list{max-width:760px;margin:0 auto;border-top:1px solid var(--hairline)}
.faq__item{border-bottom:1px solid var(--hairline)}
.faq__item summary{list-style:none;cursor:pointer;padding:22px 0;display:flex;justify-content:space-between;align-items:center;gap:20px;
  font-family:var(--serif);font-weight:500;font-size:1.2rem;color:var(--texto)}
.faq__item summary::-webkit-details-marker{display:none}
.faq__item summary::after{content:"+";font-family:var(--sans);font-weight:400;font-size:1.5rem;color:var(--gold);flex:none}
.faq__item[open] summary::after{content:"–"}
.faq__answer{padding:0 0 22px}
.faq__answer p{font-size:1rem;color:var(--texto-suave);max-width:60ch;margin:0}

/* ---------- CTA FINAL (navy-deep) ---------- */
.final{background:var(--navy-deep);position:relative;overflow:hidden;padding:120px 0;text-align:center}
.final .wm{position:absolute;right:20px;bottom:-220px;opacity:.07;pointer-events:none;font-family:var(--serif);font-weight:700;font-size:560px;line-height:1;color:var(--gold)}
.final .inner{position:relative;z-index:2}
.final .tick{width:34px;height:2px;background:var(--gold);margin:0 auto 26px}
.final h2 em{font-style:italic;color:var(--gold)}
.final h2{font-size:clamp(2rem,4vw,3.2rem)}
.final .sub{margin:18px auto 0;max-width:36em}
.final .btn-cta{margin-top:36px}

/* ---------- footer ---------- */
.footer{background:#080E17;color:var(--texto-suave);padding:32px 0;font-size:12px;text-align:center;letter-spacing:.08em}
.footer .fio-top{height:3px;background:var(--gold);margin-bottom:32px;opacity:.8}
.footer b{color:var(--texto)}
.footer a{color:var(--texto-suave);text-decoration:underline;text-decoration-color:rgba(168,176,189,.4)}

/* ---------- WhatsApp FAB ---------- */
.whatsapp-fab{position:fixed;right:22px;bottom:22px;z-index:60;width:56px;height:56px;border-radius:50%;
  background:#25d366;color:#fff;display:flex;align-items:center;justify-content:center;box-shadow:0 8px 30px rgba(0,0,0,.35)}

/* ---------- MODAL (painel claro sobre navy) ---------- */
.modal[hidden]{display:none}
.modal{position:fixed;inset:0;z-index:100;display:flex;align-items:center;justify-content:center;padding:20px}
.modal__backdrop{position:absolute;inset:0;background:rgba(7,13,20,.72);backdrop-filter:blur(3px)}
.modal__panel{position:relative;background:var(--papel);color:var(--tinta);border:1px solid var(--hairline-light);max-width:520px;width:100%;max-height:92vh;overflow:auto;box-shadow:0 40px 100px rgba(7,13,20,.5)}
.modal__panel::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--gold)}
.modal__close{position:absolute;top:14px;right:14px;width:36px;height:36px;border:1px solid var(--hairline-light);background:#FFFDF8;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--tinta)}
.modal__body{padding:40px 34px 34px}
.modal__head .k{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--hairline-light);background:#FFFDF8;border-radius:4px;padding:6px 14px;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.18em;color:var(--tinta);margin-bottom:14px}
.modal__head .k .dot{width:6px;height:6px;border-radius:50%;background:var(--cta-hover)}
.modal__head h2{color:var(--tinta);font-size:1.7rem;margin-bottom:8px}
.modal__sub{font-size:.95rem;color:var(--tinta-suave);margin:0 0 24px}
.form__row{margin-bottom:16px}
.form__row--2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.field{display:block}
.field__label{display:block;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.12em;color:var(--tinta-suave);margin-bottom:7px}
.field input,.field select,.field textarea{width:100%;background:#FFFDF8;border:1px solid var(--hairline-light);border-radius:4px;padding:13px 14px;color:var(--tinta);font-size:15px;transition:border-color .2s}
.field input:focus,.field select:focus,.field textarea:focus{outline:0;border-color:var(--tinta)}
.field.is-error input,.field.is-error select,.field.is-error textarea{border-color:#c0392b}
.field__error{display:block;color:#c0392b;font-size:12px;margin-top:5px}
.hp{position:absolute;left:-9999px}
.form__note{font-size:11px;color:var(--tinta-suave);margin-top:14px;text-align:center}
.form__success,.form__fail{padding:14px;border-radius:4px;margin-top:14px;font-size:14px}
.form__success{background:rgba(21,128,61,.1);color:#15803d;border:1px solid rgba(21,128,61,.3)}
.form__fail{background:rgba(192,57,43,.08);color:#c0392b;border:1px solid rgba(192,57,43,.3)}
body.modal-open{overflow:hidden}

/* ============================================================
   TABLET (821-1024): grids intermediários
   ============================================================ */
@media(max-width:1024px){
  .sol-grid{grid-template-columns:1fr;max-width:600px;margin:0 auto}
  .areas .grid{grid-template-columns:1fr 1fr}
  .mentor__grid{grid-template-columns:repeat(3,1fr)}
  .final .wm{font-size:420px;right:-30px;bottom:-160px}
}

/* ============================================================
   MOBILE
   ============================================================ */
@media(max-width:820px){
  .hero .grid,.quem .grid,.premio .grid{grid-template-columns:1fr;gap:40px}
  .hero{padding:56px 0 72px}
  .hero .placa{aspect-ratio:4/5}
  .sol-grid{grid-template-columns:1fr;gap:18px}
  .passos .cols{grid-template-columns:1fr;gap:36px}
  .passos .col{border-left:0;padding:0}
  .areas .grid{grid-template-columns:1fr 1fr}
  .mentor__grid{grid-template-columns:1fr 1fr;gap:24px 16px}
  .entrega .cols{grid-template-columns:1fr}
  .prints__grid{grid-template-columns:1fr}
  .btn-cta{width:100%;text-align:center}
  .cta-row{gap:16px}
  .logo svg{height:22px}
  .nav .right{display:none}
}
@media(max-width:520px){
  .modal__body{padding:34px 22px 26px}
  .form__row--2{grid-template-columns:1fr}
  .areas .grid{grid-template-columns:1fr}
}
@media(prefers-reduced-motion:reduce){[data-reveal]{opacity:1;transform:none;transition:none}}

/* ---------- Bora: hero em dupla (Bruno + Luis) ---------- */
.placa-duo{display:grid;grid-template-columns:1fr 1fr;gap:26px;align-items:start}
.placa-duo .placa{aspect-ratio:4/5}
.placa-duo .placa img{object-position:center 15%}
@media(max-width:900px){.placa-duo{gap:16px}.placa-duo .placa-cap{font-size:9px}}

/* ---------- Bora: fotos no Quem Somos ---------- */
.quem-fotos{display:grid;grid-template-columns:1fr 1fr;gap:26px;margin-top:34px;max-width:480px}
.quem-fotos .placa{aspect-ratio:4/5}
.quem-fotos .placa img{object-position:center 15%}