/* =============================================
   ABCDO — Mobile Responsive Fixes (v2)
   Regras cirúrgicas, sem overrides globais agressivos
   ============================================= */

/* ---- OVERFLOW GLOBAL (só html/body) ---- */
html { overflow-x: hidden; }
body { overflow-x: hidden; }

/* ---- CONTAINER ---- */
@media (max-width: 768px) {
  .container, .container-sm {
    padding-left: 16px;
    padding-right: 16px;
  }
}

/* ============================================
   FLOATING BENEFITS BUTTON
   ============================================ */
@media (max-width: 600px) {
  #benefits-float { right: 12px; bottom: 16px; }
  #benefits-panel { width: calc(100vw - 40px) !important; right: 0 !important; }
  #benefits-float > button { font-size: .78rem; padding: 10px 14px; }
}

/* ============================================
   NAVBAR
   ============================================ */
@media (max-width: 768px) {
  .navbar-inner { padding: 0 16px; }
  .navbar-logo-text .title { font-size: .72rem; }
  .navbar-logo img { height: 40px !important; }
}

/* ============================================
   HERO
   ============================================ */
@media (max-width: 480px) {
  .hero-actions {
    flex-direction: column;
    align-items: center;
    gap: 12px;
  }
  .hero-actions .btn {
    width: 100%;
    max-width: 280px;
    text-align: center;
    justify-content: center;
  }
}

/* ============================================
   BOARD (DIRETORIA) — forçar 1 coluna em mobile
   ============================================ */
@media (max-width: 600px) {
  .board-grid {
    grid-template-columns: 1fr !important;
    gap: 20px;
  }
  .board-card-photo { height: 200px; }
  .board-card-photo img { height: 200px; object-fit: cover; }
}

/* ============================================
   MEMBERS GRID (ACADÊMICOS TITULARES)
   ============================================ */
@media (max-width: 600px) {
  .members-grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 14px !important;
  }
  .member-card-photo { height: 130px; overflow: hidden; }
  .member-card-photo img { height: 130px; object-fit: cover; }
  .member-card-body { padding: 12px; }
  .member-card-name { font-size: .82rem; line-height: 1.3; }
  .member-card-role { font-size: .75rem; }
  .member-card-chair { font-size: .68rem; }
  .member-card-patron { font-size: .75rem; }
  .member-card-actions { margin-top: 10px; }
  .member-card-actions .btn { font-size: .75rem; padding: 6px 10px; }
}
@media (max-width: 320px) {
  .members-grid { grid-template-columns: 1fr !important; }
}

/* ============================================
   ACADEMIC MODAL
   ============================================ */
@media (max-width: 600px) {
  .academic-modal { padding: 10px; }
  .academic-modal-card {
    padding: 24px 16px;
    max-height: 92vh;
    border-radius: 14px;
  }
  .academic-modal-card h2 { font-size: 1.3rem; }
}

/* ============================================
   NEWS GRID
   ============================================ */
@media (max-width: 640px) {
  .news-grid { grid-template-columns: 1fr !important; }
  .news-card { max-width: 100%; }
  .news-card-img { height: 180px; }
}

/* ============================================
   SECTION HEADERS
   ============================================ */
@media (max-width: 480px) {
  .section-header { margin-bottom: 32px; }
  .section-header p { font-size: .95rem; }
}

/* ============================================
   CTA BANNER
   ============================================ */
@media (max-width: 600px) {
  .cta-banner { padding: 36px 20px; }
  .cta-banner-actions {
    flex-direction: column;
    align-items: center;
    gap: 12px;
  }
  .cta-banner-actions .btn {
    width: 100%;
    max-width: 280px;
    text-align: center;
    justify-content: center;
  }
}

/* ============================================
   FOOTER
   ============================================ */
@media (max-width: 768px) {
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 28px; }
}
@media (max-width: 480px) {
  .footer-grid { grid-template-columns: 1fr !important; gap: 24px; }
  .footer-brand { text-align: center; }
  .social-links { justify-content: center; }
}

/* ============================================
   CANDIDATURA — layout 2fr 1fr
   ============================================ */
@media (max-width: 860px) {
  .candidatura-wrap > div[style] {
    display: block !important;
  }
}

/* Campos de formulário lado a lado → 1 coluna em mobile */
@media (max-width: 540px) {
  .form-group-row,
  form div[style*="grid-template-columns:1fr 1fr"],
  form div[style*="grid-template-columns: 1fr 1fr"] {
    grid-template-columns: 1fr !important;
  }
  /* Evita zoom automático no iOS em campos de texto */
  input, select, textarea { font-size: 16px !important; }
}

/* ============================================
   ÁREA PRIVADA
   ============================================ */
@media (max-width: 640px) {
  .private-nav-inner {
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 4px;
    gap: 2px;
  }
  .private-nav-link {
    white-space: nowrap;
    font-size: .78rem;
    padding: 8px 10px;
  }
  .private-nav-link svg { display: none; }
}

/* Declaração — campos 1fr 1fr */
@media (max-width: 540px) {
  #panel-declaracao div[style*="1fr 1fr"],
  #panel-anuidade div[style*="1fr 1fr"] {
    grid-template-columns: 1fr !important;
  }
}

/* Artigos grid */
@media (max-width: 500px) {
  #artigos-grid { grid-template-columns: 1fr !important; }
}

/* Aulas / resource grid */
@media (max-width: 640px) {
  .resource-grid { grid-template-columns: 1fr !important; }
}

/* ============================================
   CONGRESSOS / ROUNDS
   ============================================ */
@media (max-width: 480px) {
  /* Data box + texto da programação */
  .rounds-row {
    grid-template-columns: 70px 1fr !important;
    gap: 8px !important;
  }
}

/* ============================================
   SOBRE — grids internos
   ============================================ */
@media (max-width: 600px) {
  .about-tabs-nav {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    flex-wrap: nowrap;
  }
  .about-tab-btn { white-space: nowrap; }
}

/* ============================================
   ESPECIALISTAS — filtros e grid
   ============================================ */
@media (max-width: 600px) {
  .filter-bar { flex-direction: column; }
  .filter-bar input,
  .filter-bar select { width: 100%; min-width: 0; }
  #specialists-grid { grid-template-columns: 1fr !important; }
}

/* ============================================
   CADEIRAS GRID (página sobre)
   ============================================ */
@media (max-width: 480px) {
  .chairs-grid {
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 8px !important;
  }
}

/* ============================================
   ARTIGO / NOTÍCIA
   ============================================ */
@media (max-width: 480px) {
  article[style*="padding:80px"] { padding: 40px 0 !important; }
  .container-sm { padding-left: 16px; padding-right: 16px; }
}

/* ============================================
   LOJA
   ============================================ */
@media (max-width: 640px) {
  .store-grid { grid-template-columns: 1fr !important; }
}

/* ============================================
   EVENTOS — grids internos inline
   ============================================ */
@media (max-width: 480px) {
  /* Rounds: data box 90px + conteúdo */
  div[style*="grid-template-columns:90px 1fr"],
  div[style*="grid-template-columns: 90px 1fr"] {
    grid-template-columns: 68px 1fr !important;
    gap: 8px !important;
  }
}

/* ============================================
   FIXES PARA OVERFLOW HORIZONTAL (raízes do problema)
   ============================================ */

/* Stats section — pseudo-element extravaza à direita */
.stats-section { overflow: hidden; }

/* About section — badge absoluto sai da tela */
.about-home { overflow: hidden; }
@media (max-width: 768px) {
  .about-img-badge { display: none; }
  .about-img-wrap { overflow: hidden; }
  .about-img-main { min-height: 240px !important; }
}

/* Hero — partículas e elementos decorativos */
.hero { overflow: hidden; }
.hero-bg { overflow: hidden; }

/* Seções gerais — pseudo-elements decorativos não devem causar scroll */
.section-pad { overflow: hidden; }

/* Texto sem word-break causa overflow em mobile */
@media (max-width: 768px) {
  h1, h2, h3, h4, p, span, li, a {
    word-wrap: break-word;
    overflow-wrap: break-word;
    word-break: break-word;
  }
  /* Mas não quebrar palavras em botões e labels */
  .btn, .badge, .pre-title, .news-cat {
    word-break: normal;
    overflow-wrap: normal;
  }
}

/* Stats grid — 4 colunas são demais em mobile */
@media (max-width: 480px) {
  .stats-grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 20px !important;
  }
  .stat-num { font-size: 2rem !important; }
  .stat-label { font-size: .78rem !important; }
  .stat-item::after { display: none; }
}

/* About grid — gap grande causa problemas */
@media (max-width: 1024px) {
  .about-grid { gap: 32px !important; }
}

/* Nav menu mobile — largura correta */
@media (max-width: 768px) {
  .nav-menu {
    width: 100% !important;
    max-width: 100vw !important;
  }
  .dropdown { min-width: 0 !important; width: 100% !important; }
}

/* Dropdown no mobile — não extravasa */
@media (max-width: 768px) {
  .nav-item .dropdown {
    position: static !important;
    left: auto !important;
    transform: none !important;
    width: 100% !important;
    min-width: 0 !important;
    box-shadow: none !important;
  }
}

/* Board cards — image badge pode sair */
.board-card { overflow: hidden; }
.board-card-photo { overflow: hidden; }

/* Seção de boas-vindas privada */
@media (max-width: 480px) {
  .private-header { flex-wrap: wrap; gap: 8px; }
}

/* Inline styles com padding 64px */
@media (max-width: 480px) {
  [style*="padding:54px 64px"] { padding: 28px 16px !important; }
  [style*="padding: 54px 64px"] { padding: 28px 16px !important; }
}

/* Modal (declaração) — texto largo */
@media (max-width: 600px) {
  .academic-modal-card * { word-wrap: break-word; overflow-wrap: break-word; }
}