/* =========================
   FONTS
========================= */
@font-face {
  font-family: 'Britannic Bold';
  src: url('fonte/Britannic-Bold.ttf') format('truetype');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'MADE Tommy Light';
  src: url('fonte/MADE-Tommy-Light.otf') format('opentype');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

/* =========================
   TOKENS (ROOT ÚNICO)
========================= */
:root{
  --font-headings:'Spectral',serif;
  --font-body:'MADE Tommy Light',system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif;

  --brand-bg:#0B0F19;
  --brand-primary:#0A2342;
  --brand-accent:#C6A34F;
  --brand-accent-2:#E7CF8C;

  --brand-muted:#6B7280;
  --brand-light:#F5F7FA;
  --radius-xl:24px;

  /* tokens auxiliares */
  --gold:#f1c24b;
  --gold-glow: rgba(241,194,75,.75);
  --gold-soft: rgba(241,194,75,.35);
  --brand:#0A2342;
}

/* =========================
   BASE
========================= */
html{scroll-behavior:smooth}
body{font-family:var(--font-body);color:#0f172a}

/* =========================
   NAVBAR (GENÉRICO + MODERN)
========================= */
/* base genérica para links da navbar */
.navbar .nav-link{
  font-weight:700;
  letter-spacing:.2px;
  display:inline-flex;
  align-items:center;
  gap:.45rem;
  position:relative;
  transition: color .2s ease, text-shadow .25s ease, transform .25s ease;
}
.navbar .nav-link .bi{
  font-size:1.05em;
  transform:translateY(0);
  transition:transform .25s ease, filter .25s ease;
}
.navbar .nav-link::after{
  content:"";
  position:absolute;
  left:12%; right:12%; bottom:.35rem; height:2px;
  background:linear-gradient(90deg,transparent,var(--brand),transparent);
  opacity:0; transform:scaleX(.6);
  transition:opacity .25s ease, transform .25s ease;
}
.navbar .nav-link::before{
  content:"";
  position:absolute; inset:-6px -10px;
  background:radial-gradient(60px 20px at var(--x,50%) 90%, var(--gold-soft), transparent 60%);
  opacity:0; pointer-events:none; transition:opacity .25s ease;
}
.navbar .nav-link:hover,
.navbar .nav-link.active{
  color:#000;
  text-shadow:0 0 6px var(--gold-glow), 0 0 18px rgba(241,194,75,.35);
}
.navbar .nav-link:hover .bi{ transform:translateY(-1px); filter:drop-shadow(0 0 6px var(--gold-glow)); }
.navbar .nav-link:hover::after{ opacity:1; transform:scaleX(1); }
.navbar .nav-link:hover::before{ opacity:1; }

/* tema “modern” dourado */
.navbar-modern{
  position:sticky; top:0; z-index:1050;
  background:linear-gradient(135deg,#c6a34f 0%,#e8d48a 45%,#c6a34f 100%);
  background-size:200% 200%;
  box-shadow:0 6px 25px rgba(0,0,0,.15);
  backdrop-filter:saturate(120%) blur(4px);
  animation:goldShine 8s ease-in-out infinite alternate;
  padding:.35rem 0; transition:all .4s ease;
}
@keyframes goldShine{
  0%{ background-position:0% 50% } 100%{ background-position:100% 50% }
}
.navbar-modern .navbar-brand img{
  height:90px; width:auto;
  filter:drop-shadow(0 2px 3px rgba(0,0,0,.25));
  transition:transform .25s ease, height .25s ease;
}
.navbar-modern .navbar-brand:hover img{ transform:scale(1.04); }
.navbar-modern.scrolled .navbar-brand img{ height:78px; }

.navbar-modern .nav-link{
  color:#f0f2f4; text-transform:uppercase; padding:.5rem .9rem; letter-spacing:.02em;
  transition:color .3s ease;
}
.navbar-modern .nav-link::after{
  content:""; position:absolute; left:.9rem; right:.9rem; bottom:-6px; height:2px;
  background:var(--brand-primary); transform:scaleX(0); transform-origin:center; transition:transform .3s ease;
}
.navbar-modern .nav-link:hover, .navbar-modern .nav-link.active{ color:var(--brand-primary); }
.navbar-modern .nav-link:hover::after, .navbar-modern .nav-link.active::after{ transform:scaleX(1); }

.navbar-modern.scrolled{
  background:linear-gradient(135deg,#b9943e 0%,#e4cf8a 40%,#b9943e 100%);
  padding:.25rem 0; box-shadow:0 6px 30px rgba(0,0,0,.2);
}
.navbar-modern .navbar-toggler{ border:none; background:rgba(0,0,0,.15); border-radius:6px; }
.navbar-modern .navbar-toggler-icon{ filter:brightness(0); }

/* variação com gradiente contínuo */
.navbar-gold-gradient{
  padding:.35rem 0;
  overflow:visible;
  background:linear-gradient(90deg,#d4af37 0%,#f5d76e 50%,#b8860b 100%);
}

/* ===== LOGO RESPONSIVA (NAVBAR) ===== */
.navbar .navbar-brand img {
  height: 110px;
  width: auto;
  transition: height .25s ease, transform .25s ease;
  filter: drop-shadow(0 2px 3px rgba(0,0,0,.25));
}
.navbar.scrolled .navbar-brand img { height: 90px; }

/* ===== MOBILE (até 991.98px) — sem centralizar logo ===== */
@media (max-width: 991.98px) {
  .navbar .container {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
  }
  .navbar .navbar-brand { order: 0; margin: 0; text-align: left; }
  .navbar .navbar-brand img { height: 80px; }

  .navbar .navbar-nav { padding: .5rem 0 1rem; }
  .navbar .collapse.navbar-collapse { width: 100%; }
}
/* Transição suave do collapse */
.navbar .collapse.navbar-collapse { transition: height .35s ease; }

/* ===== NAV: borda inferior + medalhão com IMAGEM ===== */
/* Use o id da sua nav principal */
#navMain {
  position: sticky;
  top: 0;
  z-index: 1050;
  /* mantém o gradiente sólido da classe .navbar-gold-gradient (não transparente) */
  --medal-img: url("/img/logo_icon.png"); /* caminho confirmado */
}

/* filete (borda) embaixo da nav */
#navMain::before{
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: 0;
  height: 6px;
  background: linear-gradient(90deg, transparent, var(--brand-accent), transparent);
  opacity: .95;
  pointer-events: none;
  z-index: 1060;
}

/* medalhão central com imagem */
/* medalhão central com imagem (borda branca) */
#navMain::after{
  content: "";
  position: absolute;
  left: 50%;
  bottom: -18px; /* entra por cima do header */
  transform: translateX(-50%) rotate(0deg);
  width: 48px; height: 48px;
  border-radius: 50%;
  background: center/80% 80% no-repeat var(--medal-img);
 
  z-index: 3000; /* acima da nav e do header */
  pointer-events: none;
  animation: navMedalSpinIn 1.1s ease-out both;
}


@keyframes navMedalSpinIn{
  0%   { transform: translateX(-50%) rotate(-360deg); opacity:0; }
  60%  { opacity:1; }
  100% { transform: translateX(-50%) rotate(0deg);   opacity:1; }
}
@media (prefers-reduced-motion: reduce){
  #navMain::after{ animation: none; }
}
@media (max-width: 991.98px){
  #navMain::after{
    width: 42px; height: 42px;
    bottom: -16px;
    border-width: 2.5px;
    background-size: 72% 72%;
  }
}

/* =========================
   HERO / HEADER
========================= */
.bg-hero{
  position:relative; color:#fff; min-height:68vh; overflow:hidden;
  background:linear-gradient(135deg,var(--brand-bg) 0%, #101729 60%, #131A2B 100%);
  padding-top: 28px; /* espaço pro medalhão */
}
.bg-hero::before{
  content:""; position:absolute; inset:0; z-index:0;
  background:
    radial-gradient(800px 280px at 20% 10%, rgba(231,207,140,.10), transparent 60%),
    radial-gradient(800px 300px at 90% 30%, rgba(10,35,66,.16), transparent 60%);
  pointer-events:none;
}
#chalkFlight{
  position:absolute; inset:0; z-index:1; pointer-events:none; display:block; opacity:.9;
}
.lights-container{ position:absolute; inset:0; overflow:hidden; z-index:1; }
.light{
  position:absolute; width:6px; height:6px; border-radius:50%;
  background:rgba(255,215,100,.9); box-shadow:0 0 8px 4px rgba(255,215,100,.5);
  animation:flicker 3s infinite ease-in-out;
}
@keyframes flicker{ 0%,100%{opacity:.1; transform:scale(.8)} 50%{opacity:1; transform:scale(1.3)} }
.bg-hero .container{ position:relative; z-index:2; }

/* hero compacto */
.bg-hero-compact{
  position:relative; color:#fff; min-height:32vh; overflow:hidden;
  background:
    radial-gradient(1200px 420px at 10% -10%, rgba(222,172,35,.18), transparent 60%),
    linear-gradient(135deg, var(--brand-bg) 0%, #101729 55%, #141B2C 100%);
}

/* =========================
   SEÇÕES BÁSICAS
========================= */
.section{ padding:72px 0 }
.section-tight{ padding:48px 0 }
.bg-light-alt{ background:var(--brand-light) }
.brand-divider{ height:4px; width:64px; background:var(--brand-accent); border-radius:999px }
.text-accent{ color:var(--brand-accent)!important }

/* =========================
   CARDS COMUNS
========================= */
.card-neo{
  border-radius:calc(var(--radius-xl) - 6px);
  background:linear-gradient(to bottom right, rgba(255,255,255,.92), rgba(255,255,255,.86));
  border:1px solid rgba(16,24,40,.08);
  box-shadow:0 10px 30px rgba(16,24,40,.06);
  transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.card-neo:hover{ transform:translateY(-3px); box-shadow:0 16px 36px rgba(16,24,40,.10); border-color:rgba(198,163,79,.38); }
.card-neo .feature-icon{
  width:56px; height:56px; border-radius:16px; display:grid; place-items:center;
  background:conic-gradient(from 120deg, rgba(198,163,79,.18), rgba(231,207,140,.12));
  color:#6b531f; font-size:1.25rem;
}

/* =========================
   SERVICE CARDS (NOVA VERSÃO)
========================= */
.svc-card{
  position:relative; display:flex; flex-direction:column; gap:12px;
  height:100%;
  padding:22px 18px;
  border-radius:calc(var(--radius-xl) - 6px);
  background:linear-gradient(180deg,#ffffff,#fbfbfd);
  border:1px solid rgba(16,24,40,.08);
  box-shadow:0 10px 24px rgba(16,24,40,.06);
  transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease, background .25s ease;
  overflow:hidden; isolation:isolate;
}
.svc-card:hover{ transform:translateY(-4px); box-shadow:0 16px 36px rgba(16,24,40,.12); border-color:rgba(198,163,79,.35); }
.svc-shine{
  position:absolute; inset:-1px;
  background:
    radial-gradient(520px 180px at 18% -10%, rgba(198,163,79,.18), transparent 60%),
    radial-gradient(480px 200px at 95% 110%, rgba(10,35,66,.10), transparent 60%);
  filter:blur(18px); opacity:.35; pointer-events:none; z-index:-1;
}
.svc-icon{
  width:64px; height:64px; border-radius:18px; display:grid; place-items:center;
  font-size:1.6rem; color:#6b531f;
  background:conic-gradient(from 120deg, rgba(198,163,79,.22), rgba(231,207,140,.12));
  border:1px solid rgba(198,163,79,.35);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.6);
}
.svc-title{
  margin:6px 0 2px; font-family:var(--font-headings);
  font-weight:700; letter-spacing:.2px; color:#0B0F19;
}
.svc-list{ list-style:none; padding:0; margin:6px 0 0; color:#475569; font-size:.95rem }
.svc-list li{ display:flex; gap:.5rem; align-items:flex-start; padding:.3rem 0 }
.svc-list i{ color:var(--brand-accent) }
.svc-badge{
  position:absolute; top:12px; right:12px;
  background:var(--brand-accent); color:#111; font-weight:700; font-size:.75rem;
  padding:.25rem .5rem; border-radius:999px; box-shadow:0 4px 10px rgba(0,0,0,.12);
}
.svc-highlight{
  border-width:2px; border-color:rgba(198,163,79,.45);
  box-shadow:0 14px 34px rgba(198,163,79,.15), 0 10px 28px rgba(16,24,40,.06);
}

/* =========================
   PLANOS
========================= */
.plan-card{
  background:#fff; border-radius:var(--radius-xl); padding:2rem; text-align:center;
  border:1px solid rgba(16,24,40,.08); box-shadow:0 8px 24px rgba(16,24,40,.06);
  transition:all .3s ease;
}
.plan-card:hover{ transform:translateY(-5px); box-shadow:0 16px 36px rgba(16,24,40,.12); border-color:var(--brand-accent); }
.plan-card.highlight{ border:2px solid var(--brand-accent); box-shadow:0 12px 32px rgba(198,163,79,.25); }
.plan-icon{ width:64px; height:64px; margin:0 auto; border-radius:18px; display:grid; place-items:center; font-size:1.75rem; color:#fff; }
.bg-soft-gold{ background:var(--brand-accent); color:#111 }
.bg-soft-blue{ background:var(--brand-primary) }
.bg-soft-dark{ background:#0B0F19 }
.plan-card .price{ font-family:var(--font-headings); color:var(--brand-primary) }

/* =========================
   CTA
========================= */
.cta-azul{
  padding:40px 0; background:linear-gradient(90deg,var(--brand-primary) 0%, #0b1f3d 100%); color:#fff;
}
.cta-azul .btn-light{ color:var(--brand-primary); font-weight:600 }
.cta-azul .btn-outline-light{ border-width:2px; font-weight:600 }
.cta-azul .btn-outline-light:hover{ background:#fff; color:var(--brand-primary) }

.cta-gold{
  padding:40px 0;
  background:linear-gradient(90deg,#d4af37 0%, #f5d76e 50%, #b8860b 100%);
  color:#fff; text-shadow:0 1px 2px rgba(0,0,0,.25);
}
.cta-gold .btn-light{ color:#b8860b; font-weight:600; background:#fff; border:0 }
.cta-gold .btn-outline-light{
  border-width:2px; font-weight:600; border-color:#fff; color:#fff; transition:all .3s ease;
}
.cta-gold .btn-outline-light:hover{ background:#fff; color:#b8860b; box-shadow:0 0 10px rgba(255,215,0,.4) }

/* =========================
   E-BOOKS
========================= */
.ebook-card{ background:#fff; border-radius:var(--radius-xl); box-shadow:0 8px 28px rgba(16,24,40,.06); transition:all .3s ease; position:relative }
.ebook-card:hover{ transform:translateY(-4px); box-shadow:0 14px 36px rgba(16,24,40,.12) }
.ebook-cover{ position:relative }
.ebook-cover img{ border-radius:var(--radius-xl); transition:transform .3s ease }
.ebook-card:hover .ebook-cover img{ transform:scale(1.04) }
.price-tag{
  position:absolute; top:10px; right:14px;
  background:var(--brand-accent); color:#111; font-weight:700; font-size:1rem;
  padding:.25rem .6rem; border-radius:8px; box-shadow:0 4px 10px rgba(0,0,0,.15);
}
.ebook-card h3{ font-family:var(--font-headings); position:relative }
.ebook-card h3::after{
  content:""; position:absolute; bottom:-6px; left:50%; transform:translateX(-50%);
  width:40px; height:3px; border-radius:2px; background:var(--brand-accent);
}

/* =========================
   WIZARD
========================= */
.wizard-step{ display:none }
.wizard-step.active{ display:block }
.divider{ height:1px; background:#e9ecef; margin:1.25rem 0 }

.wizard-emphasis{
  position:relative; border-radius:var(--radius-xl); background:#fff;
  box-shadow:0 14px 34px rgba(16,24,40,.12), 0 0 0 1px rgba(198,163,79,.22);
  isolation:isolate;
}
.wizard-emphasis::before{
  content:""; position:absolute; inset:-2px; border-radius:inherit;
  background:
    radial-gradient(600px 200px at 15% -10%, rgba(198,163,79,.22), transparent 60%),
    radial-gradient(500px 200px at 95% 110%, rgba(231,207,140,.18), transparent 60%);
  filter:blur(14px); z-index:-1; pointer-events:none;
}
.wizard-step.was-validated .form-control:invalid,
.wizard-step.was-validated .form-select:invalid{
  border-color:#dc3545; padding-right:calc(1.5em + .75rem); background-image:none;
}
.wizard-step.was-validated .invalid-feedback{ display:block }
.wizard-tag{
  position:absolute; top:10px; right:12px;
  background:var(--brand-accent-2); color:#111; font-weight:700; font-size:.75rem;
  padding:.25rem .5rem; border-radius:999px; box-shadow:0 4px 10px rgba(0,0,0,.12);
}
.progress .progress-bar{
  background:linear-gradient(90deg,var(--brand-accent),var(--brand-accent-2));
}

/* =========================
   BOTÕES
========================= */
.btn-brand{ background:#0a0a0a; color:#fff; border:0 }
.btn-brand:hover{ opacity:.95 }
.btn-gold{ background:var(--brand-accent); border-color:var(--brand-accent); color:#111 }
.btn-gold:hover{ background:#b8933e; border-color:#b8933e; color:#111 }
.btn-outline-gold{ border-color:var(--brand-accent); color:var(--brand-accent) }
.btn-outline-gold:hover{ background:var(--brand-accent); color:#111 }
.btn-hero{
  background:linear-gradient(90deg,var(--brand-accent),var(--brand-accent-2));
  border:0; color:#111; font-weight:700;
}
.btn-hero:hover{ filter:saturate(1.05) brightness(1.02) }

/* =========================
   SOBRE / TIMELINE / STATS
========================= */
.about-photo img{ aspect-ratio:4/5; object-fit:cover }
.timeline{ list-style:none; padding-left:0; margin:0; position:relative }
.timeline::before{
  content:""; position:absolute; left:10px; top:0; bottom:0; width:2px;
  background:linear-gradient(180deg, rgba(198,163,79,.6), rgba(198,163,79,.2));
}
.timeline li{ position:relative; padding-left:38px; padding-bottom:18px }
.timeline .t-bullet{
  position:absolute; left:2px; top:2px; width:16px; height:16px; border-radius:50%;
  background:#fff; border:3px solid var(--brand-accent); box-shadow:0 0 0 3px rgba(198,163,79,.15);
}
.timeline .t-content{ padding-top:2px }
.stat-card{
  background:#fff; border:1px solid rgba(16,24,40,.08); border-radius:18px; padding:18px; text-align:center;
  box-shadow:0 8px 24px rgba(16,24,40,.06);
}
.stat-value{ font-family:var(--font-headings); font-size:1.6rem; font-weight:800; color:var(--brand-primary) }
.stat-label{ font-size:.85rem; color:#64748b }

/* =========================
   FOOTER
========================= */
.footer{ background:#0A0F1A; color:#cbd5e1 }
.footer a{ color:#cbd5e1; text-decoration:none }
.footer .logo-footer{ height:54px; width:auto; transform:scale(3.03) }
.footer .social a{
  width:42px; height:42px; display:inline-grid; place-items:center; border-radius:999px;
  border:1px solid rgba(255,255,255,.18);
  transition:transform .2s ease, background .2s ease, border-color .2s ease;
}
.footer .social a:hover{ transform:translateY(-2px); background:#fff; color:#111; border-color:#fff }

/* =========================
   UTILITÁRIOS
========================= */
.wa-float{ position:fixed; right:18px; bottom:18px; z-index:1090 }
.wa-float .btn{ border-radius:999px; padding:.9rem 1.1rem }
.logoimg{ width:90px; height:auto; transform:scale(1.5) }

/* =========================
   RESPONSIVO / PREFERÊNCIAS
========================= */
@media (max-width:992px){
  .navbar-modern .navbar-brand img{ height:78px }
}
@media (max-width:576px){
  .section{ padding:56px 0 }
  .hero-badge{ font-size:.9rem }
  .navbar-modern .navbar-brand img{ height:68px }
  .svc-card{ padding:20px 16px }
  .svc-icon{ width:56px; height:56px; font-size:1.45rem; border-radius:16px }
}
@media (prefers-reduced-motion:reduce){
  *, *::before, *::after{ animation:none !important; transition:none !important }
}

/* ===== NAVBAR: ÍCONE DO HAMBÚRGUER VISÍVEL ===== */
.navbar-gold-gradient .navbar-toggler-icon {
  background-image: url("data:image/svg+xml,%3csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3e%3cpath stroke='rgba(0,0,0,0.85)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}
.navbar-gold-gradient .navbar-toggler {
  border: none;
  background: rgba(255,255,255,.35);
  border-radius: .5rem;
  padding: .35rem .5rem;
}