/* GC Consultora — estilos globales.
 *
 * El proyecto de diseño llevaba las cajas en atributos `style` inline y los
 * estados hover en un atributo `style-hover` que resolvía el runtime de Design
 * Canvas. Acá los inline se conservan tal cual y cada `style-hover` pasó a una
 * clase `.hv-*`. Van con !important porque una regla de hoja de estilos no
 * puede ganarle a una propiedad declarada inline.
 */

/* --- Base (bloques <helmet> de los .dc.html) ----------------------------- */

/* Varios paneles que arrancan cerrados llevan `hidden` y además un `display`
 * inline heredado del diseño. La regla del user-agent (`[hidden]{display:none}`)
 * pierde contra el inline, así que hace falta forzarla. */
[hidden] { display: none !important; }

body { margin: 0; background: #ffffff; }
body.page-asesor { background: #eef2f6; }
a { color: #114a87; }
a:hover { color: #0d3a6b; }
::selection { background: #bcdcf1; }

/* --- Hover ---------------------------------------------------------------*/

.hv-nav:hover        { color: #114a87 !important; background: #eef4fb !important; }
.hv-dd:hover         { background: #eef4fb !important; color: #114a87 !important; }
.hv-soft:hover       { background: #eaf2fb !important; }
.hv-blue-dark:hover  { background: #0d3a6b !important; }
.hv-blue-light:hover { background: #1a5fa8 !important; }
.hv-glass:hover      { background: rgba(255, 255, 255, 0.16) !important; }
.hv-glass2:hover     { background: rgba(255, 255, 255, 0.24) !important; }
.hv-link:hover       { color: #0d3a6b !important; }
.hv-link-dark:hover  { color: #323947 !important; }
.hv-blue-text:hover  { color: #114a87 !important; }
.hv-white:hover      { color: #ffffff !important; }
.hv-social:hover     { background: #114a87 !important; color: #ffffff !important; }
.hv-invert:hover     { background: #ffffff !important; color: #0a2e54 !important; }
.hv-wa:hover         { background: #1fbf5a !important; }
.hv-row:hover        { background: #f6f8fa !important; }
.hv-opt:hover        { background: #114a87 !important; color: #ffffff !important; border-color: #114a87 !important; }
.hv-pill:hover       { background: #eaf2fb !important; color: #0d3a6b !important; border-color: #cfe3f4 !important; }
.hv-shadow:hover     { box-shadow: 0 16px 40px rgba(15, 42, 49, 0.1) !important; }
.hv-lift:hover       { box-shadow: 0 16px 40px rgba(15, 42, 49, 0.1) !important; transform: translateY(-4px) !important; border-color: #cfe3f4 !important; }
.hv-lift5:hover      { box-shadow: 0 20px 44px rgba(15, 42, 49, 0.12) !important; transform: translateY(-5px) !important; }
.hv-lift-p:hover     { box-shadow: 0 18px 44px rgba(23, 42, 71, 0.1) !important; transform: translateY(-4px) !important; border-color: #cfe0ee !important; }

/* --- Nav: menús desplegables --------------------------------------------- */

.dd-panel { display: none; }
.dd:hover .dd-panel,
.dd:focus-within .dd-panel { display: block; }

/* --- Campos de formulario (Asesor) --------------------------------------- */

.gc-field {
  width: 100%; box-sizing: border-box; padding: 12px 14px;
  border: 1px solid #d6e0e0; border-radius: 11px;
  font-family: Manrope, sans-serif; font-size: 15px; color: #323947;
  background: #fff; outline: none;
}
.gc-field:focus { border-color: #42a7da; box-shadow: 0 0 0 3px rgba(66, 167, 218, 0.18); }
.gc-field::placeholder { color: #9aa9ac; }

@keyframes msgIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
@keyframes dotb  { 0%, 80%, 100% { transform: translateY(0); opacity: .4; } 40% { transform: translateY(-4px); opacity: 1; } }

/* --- Responsive (bloques <style> de cada página) ------------------------- */

/* Pain cards: centrar la última si queda sola (p.ej. 7 ítems) */
@media (min-width: 961px) {
  [data-pain-grid] > :last-child:nth-child(3n+1) {
    grid-column: 2;
  }
}

@media (max-width: 960px) and (min-width: 561px) {
  [data-pain-grid] > :last-child:nth-child(odd) {
    grid-column: 1 / -1;
    width: 100%;
    max-width: calc(50% - 10px);
    justify-self: center;
  }
}


/* Mobile: centrar bloques hero / entes / asesor / sujetos */
@media (max-width: 960px) {
  [data-hero-copy] {
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  [data-hero-copy] > p {
    margin-left: auto !important;
    margin-right: auto !important;
  }
  [data-hero-ctas] { justify-content: center !important; }
  [data-hero-stats] {
    justify-content: center !important;
    gap: 20px 28px !important;
  }
  [data-entes] {
    flex-direction: column !important;
    text-align: center;
  }
  [data-entes-logos] {
    justify-content: center !important;
    max-width: 300px;
  }
  [data-asesor-banner] {
    text-align: center;
    justify-items: center !important;
  }
  [data-asesor-copy] {
    flex-direction: column !important;
    text-align: center;
    align-items: center !important;
  }
  [data-asesor-copy] p {
    margin-left: auto !important;
    margin-right: auto !important;
  }
  [data-asesor-banner] > a { justify-self: center; }
}

@media (max-width: 560px) {
  [data-sujeto-grid] { justify-items: center !important; }
  [data-sujeto-grid] > a {
    width: 100%;
    max-width: 360px;
    text-align: center;
  }
  [data-sujeto-grid] > a > div {
    text-align: center;
  }
  [data-sujeto-grid] > a ul {
    align-items: center;
  }
  [data-sujeto-grid] > a li {
    justify-content: center;
    text-align: center;
  }
  [data-hero-stats] > div[style*="width:1px"] {
    display: none !important;
  }
  [data-entes-logos] {
    display: grid !important;
    grid-template-columns: repeat(2, 132px);
    justify-content: center;
    gap: 14px;
    max-width: none;
  }
}

@media (max-width: 1040px) {
  [data-desktop-nav] { display: none !important; }
  [data-mobile-btn]  { display: flex !important; }
  [data-cta-desktop] { display: none !important; }
}

@media (max-width: 960px) {
  [data-hero-grid]     { grid-template-columns: 1fr !important; gap: 44px; }
  [data-areas-grid]    { grid-template-columns: repeat(2, 1fr) !important; }
  [data-sujeto-grid]   { grid-template-columns: repeat(2, 1fr) !important; }
  [data-pain-grid]     { grid-template-columns: repeat(2, 1fr) !important; }
  [data-why-grid]      { grid-template-columns: 1fr !important; }
  [data-cta-grid]      { grid-template-columns: 1fr !important; }
  [data-asesor-banner] { grid-template-columns: 1fr !important; gap: 24px; }
}

@media (max-width: 900px) {
  [data-intro-grid] { grid-template-columns: 1fr !important; }
  [data-val-grid]   { grid-template-columns: 1fr !important; }
  [data-stat-grid]  { grid-template-columns: repeat(2, 1fr) !important; gap: 32px 24px; }
  [data-body-grid]  { grid-template-columns: 1fr !important; }
  [data-aside]      { position: static !important; flex-direction: row; flex-wrap: wrap; }
  [data-aside] > div { flex: 1; min-width: 240px; }
}

@media (max-width: 860px) {
  [data-svc-card]   { grid-template-columns: 1fr !important; }
  [data-areas-grid] { grid-template-columns: repeat(2, 1fr) !important; }
}

@media (max-width: 820px) {
    [data-contact-grid] { grid-template-columns: 1fr !important; }
  [data-maps-grid]   { grid-template-columns: 1fr !important; }
  [data-footer-grid]  { grid-template-columns: 1fr 1fr !important; }
}

@media (max-width: 760px) {
  [data-personas-grid] { grid-template-columns: 1fr !important; }
}

@media (max-width: 560px) {
  [data-areas-grid],
  [data-sujeto-grid],
  [data-pain-grid]  { grid-template-columns: 1fr !important; }
  [data-inc-grid]   { grid-template-columns: 1fr !important; }
  [data-cta-box]    { padding: 40px 26px !important; }
  [data-venc-row]   { grid-template-columns: 1fr auto !important; }
  [data-venc-row] > span:nth-child(2) { grid-column: 1 / -1; order: 3; }
  [data-aside]      { flex-direction: column; }
}

@media (max-width: 560px) {
  /* En Vencimientos la columna del medio se atenúa al pasar a una fila propia. */
  [data-venc-page] [data-venc-row] > span:nth-child(2) { color: #9aa9ac; }
}

@media (max-width: 520px) {
  [data-footer-grid] { grid-template-columns: 1fr !important; }
}

@media (max-width: 440px) {
  [data-cc-row] { flex-direction: column; }
}