/* =========================
   Theme Vars & Base
   ========================= */
:root{
  --cp-blue:#0b2d6b;
  --cp-blue-2:#0f3a83;
  --cp-teal:#00a3a6;
  --cp-bg:#f6f8fc;
  --cp-text:#1a2433;

  --cp-muted:#6b778c;
  --cp-white:#ffffff;
  --cp-shadow:0 10px 30px rgba(0,0,0,.06);
}

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

img{ max-width:100%; height:auto; display:block }
a{ text-decoration:none }

/* Utils */
.object-fit-cover{ object-fit:cover }
.shadow-text{ text-shadow:0 10px 30px rgba(0,0,0,.45) }
.hover-lift{ transition:transform .2s ease, box-shadow .2s ease }
.hover-lift:hover{ transform:translateY(-4px); box-shadow:0 .75rem 1.5rem rgba(0,0,0,.08)!important }
.text-muted{ color:var(--cp-muted)!important }
.text-brand-ink{ color:var(--cp-blue) }

/* =========================
   Topbar
   ========================= */
.topbar{ background:#0f1f3c; color:#cfe0ff; font-size:.9rem; height:42px }
.topbar__item{ color:#cfe0ff; text-decoration:none }
.topbar__item:hover{ color:#fff }
.topbar__item i{ margin-right:6px }
.topbar__soc{ color:#cfe0ff }
.topbar__soc:hover{ color:#fff }

/* =========================
   Navbar
   ========================= */
.mainnav{
  background:linear-gradient(90deg,var(--cp-blue),var(--cp-blue-2));
  position:sticky; top:0; z-index:1045;
}
.navbar .nav-link{ color:#eef3ff; opacity:.9 }
.navbar .nav-link:hover,.navbar .nav-link:focus{ color:#fff; opacity:1 }
.brand-logo{ height:28px; width:auto; object-fit:contain; filter:drop-shadow(0 1px 2px rgba(0,0,0,.2)) }
.brand-text{ color:#fff; font-weight:700; letter-spacing:.2px }
.navbar-toggler{ color:#fff }

/* header transparente sobre o hero (se usar) */
.header-transparent .nav-wrap{
  background:linear-gradient(180deg, rgba(0,0,0,.55) 0%, rgba(0,0,0,0) 100%);
}

/* Offcanvas mobile full */
.offcanvas-full{ width:100% }
.offcanvas-full .offcanvas-header{ border-bottom:1px solid rgba(0,0,0,.06) }
.offcanvas-full .nav-link{ padding:.9rem 0; border-bottom:1px solid rgba(0,0,0,.05); font-weight:600 }

/* =========================
   Buttons
   ========================= */
.btn-primary{
  background:linear-gradient(90deg,var(--cp-blue),var(--cp-teal));
  border:none
}
.btn-primary:hover{ filter:saturate(1.05) }
.btn-outline-primary{ border-color:var(--cp-blue); color:var(--cp-blue) }
.btn-outline-primary:hover{ background:var(--cp-blue); color:#fff }

/* =========================
   Footer
   ========================= */
.site-footer{ background:#0f1f3c; color:#cfe0ff }
.site-footer a{ color:#e7eeff; text-decoration:none }
.site-footer a:hover{ color:#fff; text-decoration:underline }
.brand-logo--footer{ height:30px }
.footer-list li{ margin-bottom:.4rem }
.soc{
  display:inline-flex; align-items:center; justify-content:center;
  width:36px; height:36px; border-radius:10px;
  background:rgba(255,255,255,.08); color:#fff
}
.soc:hover{ background:rgba(255,255,255,.18) }

/* =========================
   HERO PRO — full width
   ========================= */
.site-header{ position:fixed !important; left:0; right:0; top:0; z-index:1030 } /* hero "sobe" por trás */
main{ margin-top:0 } /* evita faixa branca */

.hero-pro{ position:relative; overflow:hidden }
.hero-pro__bg,
.hero-pro__media{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover }
.hero-pro__overlay{ position:absolute; inset:0; background-image:linear-gradient(180deg, rgba(0,0,0,.55) 0%, rgba(0,0,0,.78) 100%) }
.hero-pro__content{
  position:relative; min-height:86vh; display:flex; align-items:flex-end;
  padding: clamp(32px, 6vw, 80px) 16px;
}
.hero-pro__copy{ max-width:860px; color:#fff; text-shadow:0 10px 30px rgba(0,0,0,.45) }
.hero-pro__copy.align-left{ margin-right:auto; text-align:left }
.hero-pro__content.valign-bottom{ align-items:flex-end }

/* =========================
   Quem Somos – azul
   ========================= */
.about-hero{ position:relative; overflow:hidden; background:#f4f7fb }
.about-hero__bg{
  position:absolute; inset:0; z-index:0;
  background:
    radial-gradient(58rem 40rem at 92% 14%, rgba(11,45,107,.12) 0%, rgba(11,45,107,0) 60%),
    linear-gradient(90deg, #e9f1ff 0%, #eef4ff 38%, #f6f8fc 60%, #f6f8fc 100%);
}
.about-hero .container-xl{ position:relative; z-index:1 }
.text-brand-ink{ color:#0b2d6b }

.about-banner{
  display:flex; align-items:center; gap:10px; width:max-content;
  background:#0b2d6b; color:#fff; padding:6px 10px; border-radius:10px;
}
.about-banner__logo{ height:clamp(22px,3.2vw,36px); width:auto; display:block }
.about-banner span{ font-weight:800; text-transform:uppercase; letter-spacing:.3px; line-height:1.05 }

.about-copy p{ margin-bottom:12px }

/* Foto “solta” com glow azul, sem caixa */
.about-portrait{ position:relative; aspect-ratio:3/4; width:100%; max-width:520px; margin-left:auto; overflow:visible; background:transparent; border:0; box-shadow:none; border-radius:0 }
.about-portrait::before{
  content:""; position:absolute; inset:-12%; z-index:0; pointer-events:none;
  background:
    radial-gradient(80% 70% at 70% 25%, rgba(11,45,107,.22) 0%, rgba(11,45,107,0) 60%),
    radial-gradient(90% 80% at 20% 85%, rgba(11,45,107,.12) 0%, rgba(11,45,107,0) 68%);
  filter:blur(28px);
}
.about-portrait img{ position:relative; z-index:1; display:block; width:100%; height:100%; object-fit:contain; object-position:right center }

/* =========================
   Cards / Seções
   ========================= */
.card{ border:0; border-radius:18px; box-shadow:var(--cp-shadow); background:#fff }
.cp-card{ border-radius:18px; box-shadow:var(--cp-shadow) }

/* KPIs bonitos (dados reais) */
.kpibox{
  position:relative; text-align:center; padding:24px;
  border-radius:18px; background:#fff; box-shadow:0 8px 28px rgba(11,45,107,.06);
}
.kpibox::after{
  content:""; position:absolute; inset:-6%; z-index:-1;
  background:
    radial-gradient(24rem 18rem at 80% 20%, rgba(11,45,107,.08) 0%, rgba(11,45,107,0) 60%),
    radial-gradient(20rem 16rem at 20% 90%, rgba(11,45,107,.05) 0%, rgba(11,45,107,0) 65%);
  filter:blur(16px);
}
.kpibox__value{ font-size:1.85rem; font-weight:800; color:#1d66ff; letter-spacing:.2px }
.kpibox__label{ color:#6b778c; margin-top:.35rem }

/* =========================
   SLIDER (Notícias / Obras)
   ========================= */
.slider-block{ position:relative }
.slider-header{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:10px }
.slider-actions{ display:flex; align-items:center; gap:6px }
.slider-btn{
  width:38px; height:38px; border:0; border-radius:12px; background:#eef3ff; color:#0b2d6b;
  font-size:18px; display:grid; place-items:center; box-shadow:0 6px 16px rgba(11,45,107,.08)
}
.slider-btn:hover{ filter:brightness(.96) }
.slider-track{
  display:flex; gap:16px; overflow-x:auto; scroll-snap-type:x mandatory; padding-bottom:4px;
}
.slider-track::-webkit-scrollbar{ height:8px }
.slider-track::-webkit-scrollbar-thumb{ background:#e1e7f7; border-radius:8px }
.slide-card{
  flex:0 0 clamp(260px, 31vw, 360px);
  background:#fff; border-radius:16px; box-shadow:0 10px 28px rgba(11,45,107,.06);
  scroll-snap-align:start; overflow:hidden;
}

/* =========================
   Vídeo institucional (API)
   ========================= */
.home-video-card{ position:relative; border-radius:22px; overflow:hidden }
.home-video-glow{
  position:absolute; inset:-10%; z-index:0; pointer-events:none;
  background:
    radial-gradient(40rem 28rem at 85% 15%, rgba(11,45,107,.22) 0%, rgba(11,45,107,0) 60%),
    radial-gradient(34rem 26rem at 10% 95%, rgba(11,45,107,.10) 0%, rgba(11,45,107,0) 65%);
  filter: blur(24px);
}
.home-video-frame{ position:relative; z-index:1; background:#000; border-radius:22px; overflow:hidden;
  box-shadow: 0 28px 44px rgba(11,45,107,.10), 0 12px 18px rgba(11,45,107,.05);
}
.home-video__iframe,.home-video__tag{ width:100%; aspect-ratio:16/9; display:block; border:0 }

/* =========================
   Mapa (Leaflet)
   ========================= */
.coplan-pin .pin{
  width:18px; height:18px; border-radius:50%;
  background:var(--cp-blue); border:3px solid #fff; box-shadow:0 0 0 3px rgba(11,45,107,.35)
}
.leaflet-popup-content-wrapper{ border-radius:12px }

/* =========================
   CTA final / Footer spacing
   ========================= */
.cta-final{ margin-bottom:0 !important }
.site-footer{ margin-top:0 !important }
main > section:last-of-type{ margin-bottom:0 !important }

/* =========================
   Responsivo
   ========================= */
@media (max-width: 1199.98px){
  .about-portrait{ max-width:480px }
}
@media (max-width: 991.98px){
  .about-portrait{ margin:24px auto 0; max-width:420px }
  .about-portrait::before{ filter:blur(20px); opacity:.9 }
  .slide-card{ flex-basis: clamp(240px, 70vw, 320px) }
  .hero-pro__content{ min-height:64vh }
}
@media (max-width: 575.98px){
  .brand-logo{ height:24px }
  .about-portrait{ max-width:360px }
}
