/* =========================================================================
   ABRAER — Associação Brasileira dos Estudantes do Ensino Regular
   Reconstrução em Bootstrap 5 do site original (WordPress + Elementor).
   Paleta e tipografia extraídas do kit Elementor (post-7.css) do abraer.com.br.
   ========================================================================= */

:root {
  --abr-blue:        #0033DA;   /* azul institucional (hero) */
  --abr-blue-light:  #0393FA;   /* azul claro (gradiente)    */
  --abr-navy:        #022242;   /* azul-marinho (rodapé)     */
  --abr-cyan:        #00AEEF;   /* ciano da logomarca        */
  --abr-lime:        #C6FF12;   /* verde-limão de destaque   */
  --abr-orange:      #F9B44D;   /* laranja (âmbar)           */
  --abr-orange-dk:   #EF770E;   /* laranja escuro            */
  --abr-text:        #313F5F;   /* texto principal           */
  --abr-muted:       #7A7A7A;   /* texto secundário          */
  --abr-surface:     #F4F7FF;   /* fundo suave azulado       */
  --abr-border:      #E7ECF5;
  --abr-radius:      16px;

  --bs-body-font-family: "Roboto", -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  --bs-body-color: var(--abr-text);
}

* { scroll-behavior: smooth; }
html { scroll-padding-top: 90px; }

body {
  font-family: var(--bs-body-font-family);
  color: var(--abr-text);
  overflow-x: hidden;
}

h1, h2, h3, h4, h5, .h1, .h2, .h3 {
  font-family: "Poppins", var(--bs-body-font-family);
  font-weight: 700;
  color: var(--abr-navy);
  line-height: 1.15;
}

a { color: var(--abr-blue); text-decoration: none; }
a:hover { color: var(--abr-blue-light); }

.abr-skip {
  position: absolute; left: -999px; top: 0; z-index: 2000;
  background: var(--abr-blue); color: #fff; padding: .6rem 1rem; border-radius: 0 0 8px 0;
}
.abr-skip:focus { left: 0; color: #fff; }

.text-blue   { color: var(--abr-blue) !important; }
.text-cyan   { color: var(--abr-cyan) !important; }
.text-orange { color: var(--abr-orange-dk) !important; }
.text-navy   { color: var(--abr-navy) !important; }
.bg-navy     { background: var(--abr-navy) !important; }
.bg-soft     { background: var(--abr-surface) !important; }

/* ---- Botões -------------------------------------------------------------- */
.btn { font-family:"Poppins",sans-serif; font-weight:600; border-radius:999px; padding:.7rem 1.7rem; }
.btn-abr {
  background: linear-gradient(90deg, var(--abr-blue), var(--abr-blue-light));
  color:#fff; border:none;
  box-shadow: 0 8px 20px rgba(3,147,250,.28);
}
.btn-abr:hover { color:#fff; filter:brightness(1.06); transform:translateY(-2px); transition:.2s; }
.btn-orange { background: var(--abr-orange); color: var(--abr-navy); border:none; }
.btn-orange:hover { background: var(--abr-orange-dk); color:#fff; }
.btn-light-outline { border:2px solid #fff; color:#fff; }
.btn-light-outline:hover { background:#fff; color:var(--abr-blue); }

/* =========================================================================
   Cabeçalho
   ========================================================================= */
.abr-header {
  position: sticky; top: 0; z-index: 1030;
  background:#fff; box-shadow: 0 2px 18px rgba(2,34,66,.06);
}
.abr-header .navbar-brand img { height: 52px; width:auto; }
.abr-header .navbar { padding-top:.7rem; padding-bottom:.7rem; }
.abr-header .nav-link {
  font-family:"Poppins",sans-serif; font-weight:500; color:var(--abr-navy);
  padding:.4rem 1rem !important; position:relative;
}
.abr-header .nav-link:hover,
.abr-header .nav-link:focus { color: var(--abr-blue); }
.abr-header .nav-link.active { color: var(--abr-blue); }
.abr-header .dropdown-menu {
  border:none; border-radius:12px; box-shadow:0 12px 34px rgba(2,34,66,.14); padding:.4rem;
}
.abr-header .dropdown-item { font-family:"Poppins",sans-serif; font-weight:500; border-radius:8px; padding:.55rem .9rem; }
.abr-header .dropdown-item:hover { background:var(--abr-surface); color:var(--abr-blue); }
.abr-header .navbar-toggler { border:none; font-size:1.6rem; color:var(--abr-blue); }
.abr-header .navbar-toggler:focus { box-shadow:none; }

/* =========================================================================
   Hero
   ========================================================================= */
.abr-hero { padding: clamp(2.5rem, 6vw, 5.5rem) 0; background: #fff; }
.abr-hero h1 {
  font-size: clamp(2rem, 4.4vw, 3.4rem);
  color: var(--abr-navy);
}
.abr-hero h1 .hl { color: var(--abr-blue); }
.abr-hero p.lead { color: var(--abr-muted); font-size:1.12rem; max-width: 34rem; }
.abr-hero-art { position: relative; }
.abr-hero-art .blob {
  position:absolute; inset:auto 0 0 0; margin:auto;
  width:100%; aspect-ratio: 16/10;
  background: linear-gradient(135deg, var(--abr-blue), var(--abr-blue-light));
  border-radius: 44% 44% 46% 46% / 60% 60% 40% 40%;
  z-index:0;
}
.abr-hero-art img.hero-photo {
  position: relative; z-index:1; width:100%; max-width:520px;
  border-radius: var(--abr-radius);
  display:block; margin-inline:auto;
  box-shadow: 0 24px 60px rgba(2,34,66,.22);
}

/* =========================================================================
   Benefícios
   ========================================================================= */
.abr-section { padding: clamp(3rem, 7vw, 5.5rem) 0; }
.abr-section-title { font-size: clamp(1.6rem, 3.4vw, 2.5rem); }
.abr-section-title .hl { color: var(--abr-blue); }

.abr-benefit {
  height:100%; background:#fff; border:1px solid var(--abr-border);
  border-radius: var(--abr-radius); padding: 2rem 1.4rem; text-align:center;
  transition: transform .2s, box-shadow .2s;
}
.abr-benefit:hover { transform: translateY(-6px); box-shadow: 0 18px 40px rgba(2,34,66,.12); }
.abr-benefit .ico {
  width:74px; height:74px; border-radius:50%; margin:0 auto 1.1rem;
  display:grid; place-items:center; font-size:2rem; color:#fff;
}
.abr-benefit h3 { font-size:1.18rem; margin-bottom:.5rem; }
.abr-benefit p { color: var(--abr-muted); font-size:.96rem; margin:0; }
.ico-1 { background: linear-gradient(135deg,var(--abr-blue),var(--abr-blue-light)); }
.ico-2 { background: linear-gradient(135deg,var(--abr-cyan),#4fd0ff); }
.ico-3 { background: linear-gradient(135deg,var(--abr-orange),var(--abr-orange-dk)); }
.ico-4 { background: linear-gradient(135deg,#2ec4b6,#00a896); }
.ico-5 { background: linear-gradient(135deg,#7048e8,#9775fa); }

/* =========================================================================
   Parceiros
   ========================================================================= */
.abr-partner {
  height:100%; background:#fff; border:1px solid var(--abr-border); border-radius:14px;
  display:grid; place-items:center; padding:1.4rem; min-height:120px;
}
.abr-partner img { max-height:64px; max-width:100%; width:auto; object-fit:contain;
  filter: grayscale(1); opacity:.72; transition:.25s; }
.abr-partner:hover img { filter:none; opacity:1; }

/* =========================================================================
   Formulário / CTA
   ========================================================================= */
.abr-cta {
  background: linear-gradient(120deg, var(--abr-blue), var(--abr-blue-light));
  color:#fff;
}
.abr-cta h2 { color:#fff; font-size: clamp(1.8rem,4vw,2.8rem); }
.abr-cta h2 .hl { color: var(--abr-lime); }
.abr-form-card {
  background:#fff; border-radius: var(--abr-radius); padding: clamp(1.5rem,3vw,2.4rem);
  box-shadow: 0 24px 60px rgba(2,34,66,.25);
}
.abr-form-card .form-control {
  border-radius: 10px; border:1px solid var(--abr-border); padding:.8rem 1rem; background:#f8faff;
}
.abr-form-card .form-control:focus { border-color: var(--abr-blue-light); box-shadow:0 0 0 .2rem rgba(3,147,250,.15); }
.abr-form-card .form-check-label { font-size:.86rem; color:var(--abr-muted); }
.abr-alert { border-radius:10px; }

/* =========================================================================
   Últimas notícias (chamada do blog)
   ========================================================================= */
.abr-news { background: var(--abr-surface); }
.abr-news h2 .hl { color: var(--abr-blue); }

/* =========================================================================
   Rodapé
   ========================================================================= */
.abr-footer { background: var(--abr-navy); color: rgba(255,255,255,.82); padding: 3.5rem 0 0; }
.abr-footer img.logo { height:54px; margin-bottom:1.2rem; }
.abr-footer h5 { color:#fff; font-size:1rem; font-family:"Poppins"; margin-bottom:1rem; }
.abr-footer a { color: rgba(255,255,255,.82); }
.abr-footer a:hover { color:#fff; }
.abr-footer .social a {
  display:inline-grid; place-items:center; width:40px; height:40px; border-radius:50%;
  background: rgba(255,255,255,.1); color:#fff; margin-right:.5rem; font-size:1.1rem; transition:.2s;
}
.abr-footer .social a:hover { background: var(--abr-blue-light); }
.abr-footer .foot-bottom {
  border-top:1px solid rgba(255,255,255,.12); margin-top:2.5rem; padding:1.2rem 0;
  font-size:.86rem; color: rgba(255,255,255,.6);
}

/* =========================================================================
   Páginas internas (Quem Somos)
   ========================================================================= */
.abr-page-hero {
  background: linear-gradient(120deg, var(--abr-blue), var(--abr-blue-light));
  color:#fff; padding: clamp(3rem,7vw,5rem) 0; text-align:center;
}
.abr-page-hero h1 { color:#fff; font-size: clamp(2rem,5vw,3rem); }
.abr-prose { font-size:1.08rem; color:#4a5573; line-height:1.8; }
.abr-info-card {
  background:#fff; border:1px solid var(--abr-border); border-radius:var(--abr-radius);
  padding:1.8rem; height:100%;
}
.abr-info-card .ico { font-size:1.8rem; color:var(--abr-blue); margin-bottom:.6rem; }

@media (max-width: 991px){
  .abr-hero-art { margin-top:2.5rem; }
}
