/* ==================================================
   GODIGITAL DESIGN SYSTEM V2 — PREMIUM
   ================================================== */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&display=swap');

:root {
  --gd-max-width: 1200px;

  --gd-primary: #2563EB;
  --gd-primary-dark: #1D4ED8;
  --gd-primary-light: #EFF6FF;
  --gd-accent: #6366F1;

  --gd-text: #0F172A;
  --gd-text-light: #475569;
  --gd-text-muted: #94A3B8;

  --gd-bg: #FFFFFF;
  --gd-bg-soft: #F8FAFC;
  --gd-bg-subtle: #F1F5F9;

  --gd-border: #E2E8F0;
  --gd-border-light: #F1F5F9;

  --gd-radius-sm: 10px;
  --gd-radius-md: 16px;
  --gd-radius-lg: 24px;
  --gd-radius-xl: 32px;

  --gd-shadow-sm: 0 1px 3px rgba(15,23,42,.06), 0 1px 2px rgba(15,23,42,.04);
  --gd-shadow: 0 4px 16px rgba(15,23,42,.08), 0 1px 4px rgba(15,23,42,.04);
  --gd-shadow-md: 0 8px 32px rgba(15,23,42,.10), 0 2px 8px rgba(15,23,42,.06);
  --gd-shadow-lg: 0 20px 60px rgba(15,23,42,.12), 0 4px 16px rgba(15,23,42,.08);
  --gd-shadow-blue: 0 8px 32px rgba(37,99,235,.20);
}

/* ==================================================
   TIPOGRAFÍA GLOBAL
   ================================================== */

body,
.wp-block-heading,
h1, h2, h3, h4, h5, h6,
.entry-content p,
.entry-content li {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
}

body {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  color: var(--gd-text);
}

/* ==================================================
   CONTAINER
   ================================================== */

.ast-container,
.site-content .ast-container {
  max-width: var(--gd-max-width);
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  padding-left: 24px;
  padding-right: 24px;
  box-sizing: border-box;
}

/* ---- HEADER ---- */
#masthead,
.ast-primary-header-bar,
.ast-above-header-bar,
.ast-below-header-bar {
  width: 100%;
}

#masthead .ast-container,
.ast-primary-header-bar .ast-container,
.site-primary-header-wrap.ast-builder-grid-row-container {
  max-width: 1200px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 24px !important;
  padding-right: 24px !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

/* ---- CONTENIDO ---- */
.site-content > .ast-container,
#primary > .ast-container {
  max-width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.entry-content > .wp-block-group {
  box-sizing: border-box;
  width: 100%;
}

/* ==================================================
   HEADER PREMIUM
   ================================================== */

.ast-primary-header-bar {
  background: rgba(255,255,255,0.92) !important;
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;
  border-bottom: 1px solid var(--gd-border-light) !important;
  position: sticky !important;
  top: 0 !important;
  z-index: 999 !important;
  transition: box-shadow 0.3s ease !important;
}

.ast-primary-header-bar.scrolled {
  box-shadow: var(--gd-shadow) !important;
}

/* Logo */
.site-title a {
  font-family: 'Inter', sans-serif !important;
  font-weight: 800 !important;
  font-size: 22px !important;
  color: var(--gd-text) !important;
  letter-spacing: -0.5px !important;
  text-decoration: none !important;
}

/* Nav links */
.main-header-menu .menu-link {
  font-family: 'Inter', sans-serif !important;
  font-size: 15px !important;
  font-weight: 500 !important;
  color: var(--gd-text-light) !important;
  transition: color 0.2s ease !important;
  padding: 8px 12px !important;
  border-radius: 6px !important;
}

.main-header-menu .menu-link:hover,
.main-header-menu .current-menu-item .menu-link {
  color: var(--gd-primary) !important;
  background: var(--gd-primary-light) !important;
}

/* Botón CTA header */
.ast-custom-button {
  background: var(--gd-primary) !important;
  color: #fff !important;
  border-radius: 8px !important;
  padding: 10px 20px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  font-family: 'Inter', sans-serif !important;
  transition: all 0.2s ease !important;
  box-shadow: var(--gd-shadow-blue) !important;
}

.ast-custom-button:hover {
  background: var(--gd-primary-dark) !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 12px 40px rgba(37,99,235,.30) !important;
}

/* ==================================================
   HERO — GRADIENTE DE FONDO
   ================================================== */

.page-id-9 .entry-content > .wp-block-group:first-child,
.page-id-10 .entry-content > .wp-block-group:first-child,
.page-id-11 .entry-content > .wp-block-group:first-child,
.page-id-12 .entry-content > .wp-block-group:first-child,
.page-id-13 .entry-content > .wp-block-group:first-child,
.page-id-16 .entry-content > .wp-block-group:first-child {
  background: linear-gradient(135deg, #ffffff 0%, #f0f4ff 50%, #fafbff 100%) !important;
  position: relative;
  overflow: hidden;
}

/* Círculo de luz detrás del hero */
.page-id-9 .entry-content > .wp-block-group:first-child::before {
  content: '';
  position: absolute;
  top: -200px;
  right: -200px;
  width: 600px;
  height: 600px;
  background: radial-gradient(circle, rgba(37,99,235,0.08) 0%, transparent 70%);
  pointer-events: none;
  z-index: 0;
}

.page-id-9 .entry-content > .wp-block-group:first-child > * {
  position: relative;
  z-index: 1;
}

/* H1 hero más impactante */
.page-id-9 .entry-content > .wp-block-group:first-child h1 {
  letter-spacing: -2px !important;
  line-height: 1.02 !important;
  background: linear-gradient(135deg, #0F172A 0%, #1e3a8a 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

/* ==================================================
   BOTONES PREMIUM
   ================================================== */

.wp-block-button .wp-element-button,
.wp-block-button__link {
  font-family: 'Inter', sans-serif !important;
  font-weight: 600 !important;
  font-size: 15px !important;
  transition: all 0.25s ease !important;
  letter-spacing: -0.1px !important;
}

/* Botón primario (filled) */
.wp-block-button:not(.is-style-outline) .wp-element-button {
  box-shadow: var(--gd-shadow-blue) !important;
  position: relative !important;
  overflow: hidden !important;
}

.wp-block-button:not(.is-style-outline) .wp-element-button::after {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 60%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.2), transparent);
  transform: skewX(-20deg);
  animation: shimmer 3s infinite;
}

@keyframes shimmer {
  0% { left: -100%; }
  60%, 100% { left: 150%; }
}

.wp-block-button:not(.is-style-outline) .wp-element-button:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 12px 40px rgba(37,99,235,.35) !important;
}

/* Botón outline */
.wp-block-button.is-style-outline .wp-element-button {
  border-width: 1.5px !important;
  transition: all 0.25s ease !important;
}

.wp-block-button.is-style-outline .wp-element-button:hover {
  background: var(--gd-primary-light) !important;
  border-color: var(--gd-primary) !important;
  color: var(--gd-primary) !important;
  transform: translateY(-2px) !important;
}

/* ==================================================
   CARDS PREMIUM
   ================================================== */

/* Cards de soluciones */
.entry-content .wp-block-group.has-border-color {
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
  border-color: var(--gd-border) !important;
  box-shadow: var(--gd-shadow-sm) !important;
}

.entry-content .wp-block-group.has-border-color:hover {
  transform: translateY(-6px) !important;
  box-shadow: var(--gd-shadow-lg) !important;
  border-color: rgba(37,99,235,0.3) !important;
}

/* Línea de acento superior en hover */
.entry-content .wp-block-group.has-border-color {
  position: relative;
  overflow: hidden;
}

.entry-content .wp-block-group.has-border-color::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: linear-gradient(90deg, var(--gd-primary), var(--gd-accent));
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.3s ease;
}

.entry-content .wp-block-group.has-border-color:hover::before {
  transform: scaleX(1);
}

/* ==================================================
   SECCIÓN CON FONDO CLARO
   ================================================== */

.entry-content .wp-block-group.has-background[style*="f7f8fa"],
.entry-content .wp-block-group.has-background[style*="F7F8FA"] {
  background: linear-gradient(180deg, #f8fafc 0%, #f1f5f9 100%) !important;
}

/* ==================================================
   SECCIÓN OSCURA — "CÓMO TRABAJAMOS"
   ================================================== */

.entry-content .wp-block-group.has-background[style*="111827"] {
  background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%) !important;
  position: relative;
  overflow: hidden;
}

.entry-content .wp-block-group.has-background[style*="111827"]::after {
  content: '';
  position: absolute;
  bottom: -100px;
  left: -100px;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(37,99,235,0.12) 0%, transparent 70%);
  pointer-events: none;
}

/* Números de pasos */
.entry-content .wp-block-group.has-background[style*="111827"] h3 {
  font-size: 20px !important;
  font-weight: 700 !important;
  letter-spacing: -0.3px !important;
}

/* ==================================================
   CTA FINAL — AZUL OSCURO
   ================================================== */

.entry-content .wp-block-group.has-background[style*="1e3a5f"] {
  background: linear-gradient(135deg, #1e3a5f 0%, #0f172a 100%) !important;
  position: relative;
  overflow: hidden;
}

.entry-content .wp-block-group.has-background[style*="1e3a5f"]::before {
  content: '';
  position: absolute;
  top: -150px;
  right: -150px;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(99,102,241,0.15) 0%, transparent 70%);
  pointer-events: none;
}

/* ==================================================
   TIPOGRAFÍA HEADINGS
   ================================================== */

.entry-content h1.wp-block-heading {
  letter-spacing: -1.5px;
  line-height: 1.05;
}

.entry-content h2.wp-block-heading {
  letter-spacing: -0.8px;
  line-height: 1.15;
}

.entry-content h3.wp-block-heading {
  letter-spacing: -0.3px;
  line-height: 1.3;
}

/* ==================================================
   ANIMACIONES SCROLL — FADE IN UP
   ================================================== */

.gd-animate {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity 0.6s cubic-bezier(0.4, 0, 0.2, 1),
              transform 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}

.gd-animate.gd-visible {
  opacity: 1;
  transform: translateY(0);
}

.gd-animate-delay-1 { transition-delay: 0.1s; }
.gd-animate-delay-2 { transition-delay: 0.2s; }
.gd-animate-delay-3 { transition-delay: 0.3s; }
.gd-animate-delay-4 { transition-delay: 0.4s; }

/* ==================================================
   PAGE TITLES — OCULTAR DUPLICADOS
   ================================================== */

.page-id-9 .entry-header,
.page-id-10 .entry-header,
.page-id-11 .entry-header,
.page-id-12 .entry-header,
.page-id-13 .entry-header,
.page-id-14 .entry-header,
.page-id-15 .entry-header,
.page-id-16 .entry-header,
.page-id-17 .entry-header,
.page-id-18 .entry-header {
  display: none;
}

@media (min-width: 922px) {
  .page-id-10 .entry-content > .wp-block-group:first-child > *:not(.alignwide):not(.alignfull) {
    max-width: 1160px !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
}

/* ==================================================
   FLUENT FORMS
   ================================================== */

.ff-el-input--content input,
.ff-el-input--content textarea,
.ff-el-input--content select {
  width: 100%;
  border: 1.5px solid var(--gd-border);
  border-radius: 10px;
  padding: 13px 16px;
  font-size: 15px;
  font-family: 'Inter', sans-serif;
  line-height: 1.5;
  color: var(--gd-text);
  background: #fff;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
  box-sizing: border-box;
}

.ff-el-input--content input:focus,
.ff-el-input--content textarea:focus,
.ff-el-input--content select:focus {
  outline: none;
  border-color: var(--gd-primary);
  box-shadow: 0 0 0 4px rgba(37,99,235,0.10);
}

.ff-el-group label.ff-el-input--label {
  font-size: 14px;
  font-weight: 600;
  color: var(--gd-text);
  margin-bottom: 6px;
  display: block;
  font-family: 'Inter', sans-serif;
}

.ff-btn-submit {
  background: linear-gradient(135deg, var(--gd-primary), var(--gd-accent)) !important;
  color: #fff !important;
  border: none !important;
  border-radius: 10px !important;
  padding: 14px 32px !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  font-family: 'Inter', sans-serif !important;
  cursor: pointer !important;
  transition: all 0.25s ease !important;
  width: 100% !important;
  box-shadow: var(--gd-shadow-blue) !important;
}

.ff-btn-submit:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 12px 40px rgba(37,99,235,.35) !important;
}

.ff-el-group {
  margin-bottom: 20px;
}

/* ==================================================
   FOOTER
   ================================================== */

.site-footer {
  border-top: 1px solid var(--gd-border-light);
  background: var(--gd-bg-soft) !important;
}

.site-footer .ast-footer-copyright {
  font-family: 'Inter', sans-serif;
  font-size: 14px;
  color: var(--gd-text-muted);
}

/* ==================================================
   RESPONSIVE
   ================================================== */

@media (max-width: 768px) {
  .page-id-9 .entry-content > .wp-block-group:first-child h1 {
    letter-spacing: -1px !important;
  }
}