:root{
  --bg:#0a0c0a;
  --fg:#f5f7f7;
  --muted:#b7c0c2;
  --brand:#0ee07a;
  --brand-2:#1a9b5c;
  --gold:#c6a464;
  --card:#0f1214;
  --stroke:#20262a;
  --shadow: 0 10px 30px rgba(0,0,0,.35);
}

*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--bg);color:var(--fg);font-family:Inter, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;line-height:1.6}

.container{max-width:1100px;margin:0 auto;padding:0 20px}
.section{padding:80px 0}
.section.alt{background:linear-gradient(180deg, rgba(10,12,10,0) 0%, rgba(21,28,24,.4) 100%)}

h1,h2,h3{line-height:1.2;margin:0 0 14px}
h1{font-size:clamp(32px, 4vw, 56px)}
h2{font-size:clamp(26px, 3vw, 40px)}
h3{font-size:20px}
p{color:var(--muted);margin:0 0 14px}

.btn{display:inline-block;padding:12px 18px;border-radius:14px;text-decoration:none;border:1px solid var(--stroke);box-shadow:var(--shadow);transition:.25s}
.btn:hover{transform:translateY(-2px)}
.btn-primary{background:linear-gradient(90deg, var(--brand), var(--brand-2)); color:#0a0c0a;border:0;font-weight:700}
.btn-outline{background:transparent;color:var(--fg)}

.site-header{position:relative;min-height:80vh;display:flex;align-items:center;overflow:hidden;border-bottom:1px solid #0f1a12}
.honeycomb-bg{position:absolute;inset:0;background:url('../img/cdvBankColmeia.png') center/cover no-repeat;filter:saturate(1.1)}
.header-overlay{position:absolute;inset:0;background:radial-gradient(1200px 600px at 25% 30%, rgba(0,0,0,.1) 0%, rgba(0,0,0,.6) 50%, rgba(0,0,0,.9) 100%)}
.header-content{position:relative;z-index:2;width:100%}
.brand{height:56px;filter:drop-shadow(0 4px 20px rgba(0,0,0,.5));margin:24px 0}
.nav{display:flex;gap:18px;flex-wrap:wrap;align-items:center;margin-bottom:24px}
.nav a{color:var(--fg);text-decoration:none;opacity:.9}
.nav a:hover{opacity:1}
.hero{max-width:780px;margin:60px 0}
.hero p{font-size:18px}

.scroll-down{position:absolute;bottom:20px;left:50%;transform:translateX(-50%);color:#9adbb7;text-decoration:none;opacity:.7}

.features{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px;padding:0;list-style:none}
.features li{background:rgba(255,255,255,.03);border:1px solid var(--stroke);padding:14px;border-radius:14px}

.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.card{background:var(--card);border:1px solid var(--stroke);padding:20px;border-radius:18px;box-shadow:var(--shadow)}
.card h3{color:#e5e9e9}

.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:4px}

.timeline{list-style:none;padding-left:0;display:grid;gap:10px}
.timeline li{background:var(--card);border:1px solid var(--stroke);padding:14px;border-radius:12px}
.timeline span{color:#8de0b3;font-weight:700;margin-right:8px}

.contact-list{list-style:none;padding-left:0}
.contact-form{display:grid;gap:12px}
.contact-form input, .contact-form textarea{width:100%;padding:12px;border-radius:12px;border:1px solid var(--stroke);background:#0b0f11;color:var(--fg)}

.site-footer{border-top:1px solid #0f1a12;padding:40px 0;background:linear-gradient(180deg, rgba(20,26,22,1), rgba(8,10,9,1))}
.footer-inner{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;color:var(--muted)}
.footer-logo{height:28px;opacity:.8}
.to-top{color:#9adbb7;text-decoration:none}

@media (max-width:960px){
  .features{grid-template-columns:1fr 1fr}
  .cards{grid-template-columns:1fr 1fr}
  .grid-2{grid-template-columns:1fr}
}
@media (max-width:640px){
  .features{grid-template-columns:1fr}
  .cards{grid-template-columns:1fr}
}

/* === Ajustes solicitados para V1 Mod === */
.center-logo{display:flex;flex-direction:column;align-items:center;text-align:center}
.hero-brand{max-height:120px;height:auto;width:auto;margin:24px auto 8px;object-fit:contain}

/* remover nav da V1 (não será exibido) */
.nav{display:none !important}

/* Botão flutuante (menu de risquinhos) */
.fab{position:fixed;right:22px;bottom:22px;width:56px;height:56px;border-radius:18px;background:rgba(20,30,25,0.75);backdrop-filter:blur(8px);border:1px solid var(--stroke);box-shadow:var(--shadow);display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:999}
.fab span{display:block;width:26px;height:2px;background:#e9f5ee;margin:3px 0;transition:transform .3s,opacity .3s}
.fab.active span:nth-child(1){transform:translateY(5px) rotate(45deg)}
.fab.active span:nth-child(2){opacity:0}
.fab.active span:nth-child(3){transform:translateY(-5px) rotate(-45deg)}

/* Drawer */
.drawer{position:fixed;top:0;right:-340px;width:320px;height:100%;background:rgba(15,20,18,0.95);backdrop-filter:blur(10px);border-left:1px solid var(--stroke);box-shadow:-10px 0 30px rgba(0,0,0,.5);transition:right .35s ease;z-index:998;display:flex;flex-direction:column}
.drawer.open{right:0}
.drawer-header{display:flex;align-items:center;justify-content:space-between;padding:16px;border-bottom:1px solid var(--stroke)}
.drawer-logo{height:32px}
.drawer-close{background:transparent;border:0;color:#fff;font-size:28px;cursor:pointer;line-height:1}
.drawer-nav{display:flex;flex-direction:column;padding:14px}
.drawer-nav a{color:var(--fg);text-decoration:none;padding:12px 8px;border-radius:10px;transition:background .2s, color .2s}
.drawer-nav a:hover{background:rgba(255,255,255,.06);color:#e7ffee}
.drawer-cta{margin-top:8px;background:linear-gradient(90deg, var(--gold), #f1d18a);color:#0a0c0a !important;font-weight:700;text-align:center}

/* CTA Internet Banking na hero */
.btn-ib{border-color: var(--gold); color:#f5f7f7}
.btn-ib:hover{background:linear-gradient(90deg,#c6a464,#f1d18a); color:#0a0c0a; border-color:transparent}

/* Fade-in sections */
.fade-section{opacity:0;transform:translateY(40px);transition:opacity .8s ease, transform .8s ease}
.fade-section.visible{opacity:1;transform:translateY(0)}

@media (max-width:720px){
  .drawer{width:88vw}
}


/* === Fix: evitar logo duplicado no fundo da colmeia === */
.site-header .honeycomb-bg{
  background-position: 80% center !important; /* empurra o foco para a direita (área sem logo) */
  background-size: 140% !important;          /* amplia para garantir que o logo embutido saia da área visível */
}
.header-overlay{background:radial-gradient(1200px 600px at 55% 45%, rgba(0,0,0,.15) 0%, rgba(0,0,0,.65) 60%, rgba(0,0,0,.9) 100%) !important}

/* === Fix: botão hambúrguer no topo direito === */
.fab{
  top:16px !important;
  right:16px !important;
  bottom:auto !important;
  border-radius:12px !important;
  width:50px !important;
  height:50px !important;
}

*{box-sizing:border-box}
html,body{height:100%;margin:0;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;background:var(--bg);color:var(--fg)}

.bg{position:fixed;inset:0;background:url('../img/honeycomb.png') center/cover no-repeat;filter:saturate(1.05) brightness(0.9);z-index:-2}
.overlay{position:fixed;inset:0;background:radial-gradient(1200px 600px at 25% 35%, rgba(0,0,0,.35) 0%, rgba(0,0,0,.75) 55%, rgba(0,0,0,.92) 100%);z-index:-1}

.card{position:relative;max-width:760px;margin:6vh auto;padding:28px 28px 22px;background:var(--card);border:1px solid var(--stroke);border-radius:22px;backdrop-filter:blur(10px);box-shadow:var(--shadow);text-align:center}
.logo{height:60px;margin-bottom:10px;filter:drop-shadow(0 6px 22px rgba(0,0,0,.5))}
h1{font-size:clamp(26px,4vw,40px);margin:6px 0 8px}
p{color:var(--muted);margin:0 0 16px}

.status{display:flex;gap:10px;justify-content:center;align-items:center;margin:8px 0 16px}
.pulse{width:10px;height:10px;background:var(--brand);border-radius:50%;box-shadow:0 0 0 rgba(14,224,122,.7);animation:pulse 2s infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(14,224,122,.7)} 70%{box-shadow:0 0 0 14px rgba(14,224,122,0)} 100%{box-shadow:0 0 0 0 rgba(14,224,122,0)}}
.status-text{color:#9adbb7}

.progress{height:10px;background:rgba(255,255,255,.06);border:1px solid var(--stroke);border-radius:999px;overflow:hidden}
.bar{display:block;height:100%;background:linear-gradient(90deg,var(--brand),var(--brand-2));}

.cta{display:flex;justify-content:center;gap:12px;margin:18px 0 4px;flex-wrap:wrap}
.btn{display:inline-block;padding:12px 18px;border-radius:14px;text-decoration:none;border:1px solid var(--stroke);box-shadow:var(--shadow);transition:.25s}
.btn:hover{transform:translateY(-2px)}
.btn-primary{background:linear-gradient(90deg,var(--brand),var(--brand-2)); color:#0a0c0a;border:0;font-weight:700}
.btn-outline{background:transparent;color:var(--fg)}

.countdown{margin:12px 0 8px;color:#cfe8da}
.foot{margin-top:8px;color:#9ab7a8;font-size:14px}

@media (max-width:560px){
  .card{margin:4vh 14px;padding:22px 18px}
  .logo{height:44px}
}

/* === Logo do topo sobre a colmeia === */
.site-header .top-logo {
  position: absolute;
  top: 18px;
  left: 50%;
  transform: translateX(-50%);
  height: 130px;
  z-index: 3;
  filter: drop-shadow(0 6px 18px rgba(0,0,0,.45));
  pointer-events: none;
}

@media (max-width: 560px) {
  .site-header .top-logo {
    height: 48px;
    top: 14px;
  }
}