/* ===== OCTA · Proposta Estúdio · v2 ===== */
:root {
  --bg: #ebebeb;
  --ink: #212121;
  --accent: #e8ad32;
  --accent-deep: #7a5510;
  --danger: #e0524f;
  --gain-bright: #35c46f;
  --radius: 24px;
  --font-head: 'Jost','Avenir Next',sans-serif;
  --font-body: 'Questrial','Helvetica Neue',sans-serif;
  --maxw: 1120px;
}
* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { background:var(--bg); color:var(--ink); font-family:var(--font-body); font-size:18px; line-height:1.6; overflow-x:hidden; }
img { max-width:100%; display:block; }
h1,h2,h3 { font-family:var(--font-head); font-weight:600; line-height:1.15; }
a { color:inherit; }
.nowrap { white-space:nowrap; }

/* ===== folds e cenas ===== */
.fold { position:relative; overflow:hidden; }
.fold-light { background:var(--bg); }
.fold-dark { background:var(--ink); color:var(--bg); }
.scene { position:absolute; inset:0; width:100%; height:100%; pointer-events:none; z-index:1; }
.fold > section, .fold > header { position:relative; z-index:2; }

/* ===== VIDRO (receita v2: transparente de verdade) ===== */
.glass {
  background:linear-gradient(135deg, rgba(255,255,255,.16), rgba(255,255,255,.03));
  -webkit-backdrop-filter:blur(10px) saturate(1.5);
  backdrop-filter:blur(10px) saturate(1.5);
  border:1px solid rgba(255,255,255,.6);
  border-radius:var(--radius);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.75), 0 12px 40px rgba(33,33,33,.10);
}
.glass-dark {
  background:linear-gradient(135deg, rgba(255,255,255,.08), rgba(255,255,255,.02));
  border-color:rgba(255,255,255,.22);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.18), 0 12px 48px rgba(0,0,0,.4);
}
@supports not (backdrop-filter: blur(1px)) {
  .glass { background:rgba(255,255,255,.9); }
  .fold-dark .glass-dark { background:rgba(45,45,45,.94); }
}

/* ===== blobs de fundo (matéria para o vidro borrar) ===== */
.blob-layer { position:absolute; inset:0; overflow:hidden; z-index:0; }
.blob { position:absolute; border-radius:50%; }
/* claros: âmbar suave sobre o cinza */
.blob-layer-light .blob { filter:blur(80px); opacity:.4;
  background:radial-gradient(circle, rgba(232,173,50,.7) 0%, rgba(232,173,50,0) 70%); }
.lb1 { width:560px; height:560px; top:-10%; right:6%;  animation:blobdrift 30s ease-in-out infinite alternate; }
.lb2 { width:480px; height:480px; bottom:-14%; left:-6%; animation:blobdrift 38s ease-in-out infinite alternate-reverse; }
.lb3 { width:420px; height:420px; top:38%; left:38%; opacity:.25; animation:blobdrift 44s ease-in-out infinite alternate; }
/* escuros: laranja profundo sobre o quase-preto */
.db1 { width:720px; height:720px; top:-18%; left:-10%; filter:blur(90px); opacity:.28;
  background:radial-gradient(circle, rgba(122,85,16,.9) 0%, rgba(122,85,16,0) 70%);
  animation:blobdrift 28s ease-in-out infinite alternate; }
.db2 { width:600px; height:600px; bottom:-22%; right:2%; filter:blur(100px); opacity:.24;
  background:radial-gradient(circle, rgba(122,85,16,.85) 0%, rgba(122,85,16,0) 70%);
  animation:blobdrift 34s ease-in-out infinite alternate-reverse; }
.db3 { width:460px; height:460px; top:34%; left:48%; filter:blur(90px); opacity:.16;
  background:radial-gradient(circle, rgba(232,173,50,.5) 0%, rgba(232,173,50,0) 70%);
  animation:blobdrift 42s ease-in-out infinite alternate; }
@keyframes blobdrift {
  0%   { transform:translate(0,0) scale(1); }
  50%  { transform:translate(110px,-70px) scale(1.14); }
  100% { transform:translate(-90px,60px) scale(.92); }
}

/* ===== títulos: centrados em todas as dobras (exceto hero) ===== */
.sec-title { font-size:clamp(1.9rem,4.5vw,3rem); margin:0 auto 7vh; text-align:center; max-width:22em; }

/* ===== topbar + hero ===== */
.topbar { max-width:var(--maxw); margin:0 auto; padding:28px 24px 0; }
.logo-h { width:132px; height:auto; }
.hero { max-width:var(--maxw); margin:0 auto; padding:9vh 24px 12vh; }
.hero-card { max-width:760px; padding:clamp(30px,5vw,56px); }
.hero h1 { font-size:clamp(2.3rem,5.8vw,4rem); letter-spacing:-.01em; }
.accent-word { position:relative; }
.accent-word::after { content:""; position:absolute; left:0; bottom:.06em; width:100%; height:.14em; background:var(--accent); opacity:.55; z-index:-1; border-radius:2px; }
.hero-sub { margin-top:22px; font-size:clamp(1.02rem,1.9vw,1.25rem); max-width:32em; }
.hero-cta { display:inline-flex; align-items:center; gap:10px; margin-top:34px; font-family:var(--font-head); font-weight:500; font-size:1rem; text-decoration:none; border:1px solid var(--ink); border-radius:999px; padding:12px 26px; background:rgba(255,255,255,.35); transition:background .25s,color .25s; }
.hero-cta:hover { background:var(--ink); color:var(--bg); }
.hero-cta svg { animation:seta 1.6s ease-in-out infinite; }
@keyframes seta { 0%,100%{transform:translateY(0)} 50%{transform:translateY(4px)} }

/* ===== ponte: faixa escura em marquee ===== */
.ponte { background:var(--ink); color:var(--bg); overflow:hidden; padding:26px 0; }
.marquee { width:100%; overflow:hidden; }
.marquee-track { display:flex; width:max-content; animation:marquee 36s linear infinite; }
.mq-seg { display:flex; align-items:center; gap:26px; padding-right:26px; white-space:nowrap; }
.mq-seg strong { font-family:var(--font-head); font-weight:500; font-size:clamp(1.05rem,2.2vw,1.4rem); }
.mq-seg i { color:var(--accent); font-style:normal; font-weight:600; font-size:1.2rem; }
.mq-seg em { font-style:normal; opacity:.65; font-size:.95rem; }
@keyframes marquee { from { transform:translateX(0); } to { transform:translateX(-50%); } }
.marquee:hover .marquee-track { animation-play-state:paused; }

/* ===== entregáveis ===== */
.entregaveis { max-width:var(--maxw); margin:0 auto; padding:10vh 24px; }
.row { display:grid; grid-template-columns:1fr 1.15fr; gap:clamp(24px,4vw,56px); align-items:center; margin-bottom:9vh; }
.row-flip .card { order:2; }
.row-flip .shot { order:1; }
.card { padding:clamp(24px,3.5vw,40px); }
.num { font-family:var(--font-head); font-weight:600; color:var(--accent); font-size:1rem; letter-spacing:.08em; }
.card h3 { font-size:clamp(1.3rem,2.6vw,1.75rem); margin:8px 0 12px; }
.entregaveis .card p { font-size:1rem; }
.entregaveis .card p.mercado { margin-top:24px; font-family:var(--font-head); font-size:2.4rem; opacity:1; color:#8f8f8f; }
.mercado s { text-decoration:none; position:relative; display:inline-block; padding:0 2px; }
.mercado s::after { content:""; position:absolute; left:0; top:54%; height:4px; width:0; background:var(--danger); transform:rotate(-4deg); border-radius:2px; transition:width .5s cubic-bezier(.7,0,.3,1); }
.mercado s.riscado::after { width:100%; }
.shot { border-radius:var(--radius); overflow:hidden; box-shadow:0 16px 48px rgba(33,33,33,.16); border:1px solid rgba(33,33,33,.08); }
.shot img { width:100%; height:auto; }
.fineprint { font-size:.8rem; opacity:.55; max-width:44em; margin:0 auto; text-align:center; }

/* ===== investimento (dobra escura) ===== */
.investimento { max-width:var(--maxw); margin:0 auto; padding:11vh 24px; }
.inv-grid { display:grid; grid-template-columns:1fr 1fr; gap:clamp(24px,4vw,48px); align-items:stretch; }
.inv-card { padding:clamp(26px,3.6vw,44px); display:flex; flex-direction:column; }
.inv-label { font-family:var(--font-head); font-size:1.08rem; opacity:.85; margin-bottom:18px; }
/* extrato do mercado */
.extrato { list-style:none; flex:1; }
.extrato li { display:flex; justify-content:space-between; gap:16px; padding:8px 0; border-bottom:1px solid rgba(255,255,255,.08); font-size:.95rem; color:rgba(235,235,235,.55); }
.extrato li b { font-weight:400; font-family:var(--font-head); color:rgba(235,235,235,.55); }
.extrato-total { display:flex; justify-content:space-between; align-items:baseline; margin-top:18px; }
.extrato-total > span { font-family:var(--font-head); opacity:.7; }
.inv-valor { font-family:var(--font-head); font-weight:600; font-size:clamp(2.2rem,4.5vw,3.2rem); position:relative; display:inline-block; color:rgba(235,235,235,.8); }
.inv-mercado .inv-valor::after { content:""; position:absolute; left:-3%; top:52%; height:5px; width:0; background:var(--danger); transform:rotate(-5deg); border-radius:3px; transition:width .45s cubic-bezier(.7,0,.3,1) .15s; }
.inv-mercado.riscado .inv-valor::after { width:106%; }
/* card octa */
.inv-octa { border-color:rgba(53,196,111,.5); box-shadow:inset 0 1px 0 rgba(255,255,255,.18), 0 8px 56px rgba(53,196,111,.15); opacity:0; transform:scale(.96); transition:opacity .5s .4s, transform .5s .4s; }
.inv-octa.entrou { opacity:1; transform:scale(1); }
.inv-checks { list-style:none; flex:1; }
.inv-checks li { padding:5px 0 5px 30px; position:relative; font-size:.95rem; }
.inv-checks li::before { content:"✓"; position:absolute; left:0; color:var(--gain-bright); font-weight:700; }
.octa-total { margin-top:18px; display:flex; flex-direction:column; align-items:flex-start; }
.octa-total > span { font-family:var(--font-head); opacity:.7; }
.inv-valor-octa { color:var(--gain-bright); font-size:clamp(3.4rem,7.5vw,5.4rem); line-height:1.05; }
.inv-porque { margin:9vh auto 0; max-width:52em; text-align:center; }
.inv-porque h3 { font-size:clamp(1.3rem,2.6vw,1.7rem); margin-bottom:12px; }
.inv-porque p { opacity:.88; }

/* ===== contrato de transparência ===== */
.fold-quiet { background:var(--bg); }
.transparencia { max-width:var(--maxw); margin:0 auto; padding:10vh 24px; }
.transparencia .sec-title { margin-bottom:2vh; }
.transp-intro { text-align:center; opacity:.75; margin-bottom:5vh; }
.transp-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:18px; }
.transp-card { padding:24px; }
.transp-card h3 { font-size:1.05rem; margin-bottom:8px; }
.transp-card p { font-size:.9rem; }
.transp-prazo { margin:26px auto 0; max-width:560px; padding:22px 28px; text-align:center; font-size:1rem; }
.transp-prazo p + p { margin-top:6px; font-size:.9rem; opacity:.75; }

/* ===== evoluções ===== */
.evolucoes { max-width:var(--maxw); margin:0 auto; padding:10vh 24px; }
.evo-intro { margin:0 auto 6vh; opacity:.85; max-width:40em; text-align:center; }
.evo-grid { display:grid; gap:26px; max-width:820px; margin:0 auto; }
.evo-row { display:grid; grid-template-columns:150px 1fr; gap:22px; align-items:center; }
.evo-icon { border-radius:var(--radius); overflow:hidden; box-shadow:0 10px 30px rgba(33,33,33,.14); }
.evo-card { padding:22px 26px; }
.evo-card h3 { font-size:1.12rem; margin-bottom:6px; }
.evo-card p { font-size:.93rem; opacity:.85; }

/* ===== manifesto (escuro, centrado) ===== */
.manifesto { max-width:var(--maxw); margin:0 auto; padding:11vh 24px; text-align:center; }
.man-title { font-size:clamp(2rem,5vw,3.2rem); max-width:16em; margin:0 auto 5vh; }
.man-body { max-width:44em; margin:0 auto; display:grid; gap:20px; font-size:1.06rem; opacity:.92; }
.socios { display:flex; gap:clamp(32px,7vw,88px); margin-top:8vh; flex-wrap:wrap; justify-content:center; }
.socio { display:flex; flex-direction:column; align-items:center; }
.socio img { width:216px; height:216px; border-radius:var(--radius); object-fit:cover; box-shadow:0 16px 48px rgba(0,0,0,.5); }
.socio h3 { margin-top:16px; font-size:1.2rem; }
.socio p { font-size:.92rem; opacity:.7; }

/* ===== cta ===== */
.cta { max-width:var(--maxw); margin:0 auto; padding:16vh 24px; display:flex; justify-content:center; }
.cta-card { max-width:560px; padding:clamp(28px,4vw,44px); text-align:center;
  background:linear-gradient(135deg, rgba(255,255,255,.09), rgba(255,255,255,.02));
  -webkit-backdrop-filter:blur(3px) saturate(1.3);
  backdrop-filter:blur(3px) saturate(1.3); }
.cta-card h2 { font-size:clamp(1.7rem,3.8vw,2.4rem); }
.btn-cta { display:inline-block; margin-top:30px; font-family:var(--font-head); font-weight:600; font-size:1.15rem; text-decoration:none; background:var(--accent); color:var(--ink); border-radius:999px; padding:16px 38px; box-shadow:0 10px 32px rgba(232,173,50,.35); transition:transform .2s, box-shadow .2s; }
.btn-cta:hover { transform:translateY(-2px); box-shadow:0 16px 40px rgba(232,173,50,.45); }

/* ===== footer (separado, centrado) ===== */
.footer { background:var(--ink); color:var(--bg); padding:36px 24px 26px; display:flex; flex-direction:column; align-items:center; gap:16px; text-align:center; }
.logo-foot { width:150px; filter:invert(1) brightness(1.1); }
.footer-tag { font-family:var(--font-head); font-size:1rem; opacity:.85; }
.footer-div { width:64px; height:2px; background:var(--accent); border-radius:2px; margin:2px 0; }
.footer p { font-size:.85rem; opacity:.55; }

/* ===== reveals ===== */
.reveal { opacity:0; transform:translateY(24px); }
.no-js .reveal, .revealed { opacity:1; transform:none; }

/* ===== responsivo ===== */
@media (max-width: 980px) {
  .transp-grid { grid-template-columns:repeat(2,1fr); }
  .evo-row { grid-template-columns:110px 1fr; }
}
@media (max-width: 900px) {
  .row, .row-flip { grid-template-columns:1fr; }
  .row-flip .card { order:1; } .row-flip .shot { order:2; }
  .row .shot { order:-1; }
  .inv-grid { grid-template-columns:1fr; }
}
@media (max-width: 560px) {
  body { font-size:16px; }
  .transp-grid { grid-template-columns:1fr; }
  .socio img { width:168px; height:168px; }
  .hero { padding-top:6vh; }
}

/* ===== reduced motion ===== */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior:auto; }
  .reveal { opacity:1; transform:none; }
  .hero-cta svg { animation:none; }
  .blob { animation:none; }
  .marquee-track { animation:none; flex-wrap:wrap; }
  .mercado s::after, .inv-mercado .inv-valor::after { width:100%; transition:none; }
  .inv-octa { opacity:1; transform:none; transition:none; }
}
