/*
Theme Name: Contexto Astra Child
Theme URI: https://contexto-local.local
Description: Blindaje de Código - Oro Viejo + Conversión Metepec/Toluca
Author: Auditor SEO/GEO/AEO
Author URI: https://contexto-local.local
Template: astra
Version: 1.1.0
License: GPL v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
*/

@import url("../astra/style.css");

/* ========================================
   SISTEMA DE DISEÑO - BLINDAJE DE CÓDIGO
   Contexto Inmobiliario · Metepec / Toluca
   Paleta "Premium Híbrido" amplia (2026-09-16):
   oro viejo + negros/grises oscuros + blancos, cremas, beige y grises claros.
   Regla: este archivo NO pinta body ni el contenido de las entradas.
   El color general del sitio lo manda Astra (Personalizar > Colores globales).
   ======================================== */

/* ========== VARIABLES GLOBALES ========== */
:root {
  /* --- Oro viejo (títulos metálicos y botones) --- */
  --ci-oro-1: #BF953F;
  --ci-oro-2: #FCF6BA;
  --ci-oro-3: #B38728;
  --ci-oro-4: #FBF5B7;
  --ci-oro-5: #AA771C;
  --ci-oro-boton-1: #bfa36f;
  --ci-oro-boton-2: #dece62;
  --ci-oro-boton-3: #c0b283;

  /* --- Neutros oscuros --- */
  --ci-negro: #0a0a0a;
  --ci-negro-suave: #121212;
  --ci-gris-carbon: #1a1a1a;
  --ci-gris-sitio: #2c2c2c;      /* fondo actual de entradas (Astra) */
  --ci-gris-medio: #8c8987;

  /* --- Neutros claros --- */
  --ci-blanco: #ffffff;
  --ci-marfil: #f9f9f6;
  --ci-crema: #f7f6f3;
  --ci-crema-calido: #f0ebe1;
  --ci-beige: #e5dfd1;
  --ci-gris-claro: #e8e8e8;
  --ci-gris-perla: #d9d9d9;

  /* --- Texto según fondo (contraste AA garantizado) --- */
  --ci-texto-sobre-oscuro: #e8e8e8;
  --ci-texto-sobre-oscuro-fuerte: #ffffff;
  --ci-texto-sobre-claro: #1a1a1a;
  --ci-texto-sobre-claro-suave: #4a4a4a;

  /* --- Degradados --- */
  --ci-grad-metalico: linear-gradient(135deg, #BF953F 0%, #FCF6BA 25%, #B38728 50%, #FBF5B7 75%, #AA771C 100%);
  --ci-grad-boton: linear-gradient(135deg, #bfa36f 0%, #dece62 50%, #c0b283 100%);
  --ci-grad-boton-hover: linear-gradient(135deg, #dece62 0%, #FBF5B7 50%, #dece62 100%);

  /* --- Alias de compatibilidad (nombres anteriores, valores ya dentro de la paleta) --- */
  --ci-gold-primary: #bfa36f;
  --ci-gold-bright: #dece62;
  --ci-gold-dark: #AA771C;
  --ci-gold-muted: #c0b283;
  --ci-bg-dark: #0a0a0a;
  --ci-bg-medium: #121212;
  --ci-bg-light: #f7f6f3;

  /* --- Tipografía --- */
  --ci-font-family: 'Inter', sans-serif;          /* body / texto general */
  --ci-font-heading: 'Cinzel', serif;              /* títulos H1/H2 — marca del sitio */
  --ci-font-heading-deco: 'Cinzel Decorative', serif; /* uso especial/logo */
  --ci-font-secondary: 'League Spartan', sans-serif;  /* subtítulos / taglines */
  --ci-font-weight-normal: 400;
  --ci-font-weight-semibold: 600;
  --ci-font-weight-bold: 700;
  --ci-font-weight-extrabold: 900;

  /* --- Espaciado --- */
  --ci-space-xs: 4px;
  --ci-space-sm: 8px;
  --ci-space-md: 16px;
  --ci-space-lg: 24px;
  --ci-space-xl: 32px;
  --ci-space-xxl: 48px;
  --ci-space-seccion: clamp(40px, 8vw, 80px);

  /* --- Bordes y sombras --- */
  --ci-border-radius-sm: 4px;
  --ci-border-radius-md: 8px;
  --ci-border-radius-lg: 12px;
  --ci-shadow-sm: 0 2px 4px rgba(0, 0, 0, 0.2);
  --ci-shadow-md: 0 4px 12px rgba(191, 163, 111, 0.15);
  --ci-shadow-lg: 0 8px 24px rgba(191, 163, 111, 0.25);
  --ci-shadow-gold: 0 0 12px rgba(191, 163, 111, 0.4);
  --ci-shadow-claro: 0 8px 24px rgba(26, 26, 26, 0.08);
}

/* ========== RESET Y BASE ========== */
/* CORRECCIÓN 2026-09-16: se eliminó `body { background-color: #f5f5f5; color: #333 }`.
   Ese #333 le ganaba al color de texto de Astra (#e8e8e8) y dejaba cualquier párrafo
   sin color propio en gris oscuro sobre el fondo #2c2c2c (contraste 1.1:1, "invisible").
   Nunca volver a poner color ni fondo sobre body desde aquí. */
* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

a {
  transition: all 0.3s ease;
}

/* ========== SECCIONES ALTERNADAS (Premium Híbrido) ========== */
/* Oscura: fondo negro, texto claro, títulos con degradado metálico. */
.ci-seccion-oscura {
  background-color: var(--ci-negro);
  color: var(--ci-texto-sobre-oscuro);
  padding: var(--ci-space-seccion) var(--ci-space-lg);
}

.ci-seccion-oscura.ci-seccion-suave {
  background-color: var(--ci-negro-suave);
}

/* Clara: blanco / crema / beige, texto casi negro, títulos sólidos con acento dorado. */
.ci-seccion-clara {
  background-color: var(--ci-blanco);
  color: var(--ci-texto-sobre-claro);
  padding: var(--ci-space-seccion) var(--ci-space-lg);
}

.ci-seccion-clara.ci-fondo-crema {
  background-color: var(--ci-crema);
}

.ci-seccion-clara.ci-fondo-crema-calido {
  background-color: var(--ci-crema-calido);
}

.ci-seccion-clara.ci-fondo-beige {
  background-color: var(--ci-beige);
}

.ci-seccion-clara.ci-fondo-gris-claro {
  background-color: var(--ci-gris-claro);
}

.ci-seccion-clara p,
.ci-seccion-clara li {
  color: var(--ci-texto-sobre-claro);
}

.ci-seccion-clara .ci-text-muted {
  color: var(--ci-texto-sobre-claro-suave);
}

/* Acento dorado sólido (para palabras clave en títulos sobre fondo claro) */
.ci-acento-dorado {
  color: var(--ci-oro-5);
  -webkit-text-fill-color: currentColor;
  background: none;
}

/* ========== HEADER - BLINDAJE ========== */
.ci-header-wrapper,
.site-header {
  background: linear-gradient(180deg, var(--ci-negro) 0%, rgba(18, 18, 18, 0.98) 100%);
  box-shadow: 0 4px 16px rgba(191, 163, 111, 0.15);
  border-bottom: 3px solid var(--ci-gold-primary);
  padding: var(--ci-space-md) 0;
  position: sticky;
  top: 0;
  z-index: 100;
}

.ci-site-title,
.site-title a {
  color: var(--ci-gold-bright);
  font-weight: var(--ci-font-weight-extrabold);
  font-size: 28px;
  text-shadow: 0 2px 8px rgba(191, 163, 111, 0.3);
  letter-spacing: -0.5px;
  text-decoration: none;
}

.ci-site-title a:hover {
  color: var(--ci-oro-2);
  text-shadow: 0 2px 12px rgba(252, 246, 186, 0.4);
}

/* ========== NAVEGACIÓN - BLINDAJE ========== */
.ci-nav-menu,
.main-navigation .main-header-menu {
  list-style: none;
  display: flex;
  gap: var(--ci-space-xl);
  padding: 0;
  margin: 0;
  flex-wrap: wrap;
  align-items: center;
}

.ci-nav-item,
.main-navigation .main-header-menu > li {
  position: relative;
}

.ci-nav-item a,
.main-navigation .main-header-menu a {
  color: var(--ci-gris-claro);
  text-decoration: none;
  transition: all 0.3s ease;
  position: relative;
  font-weight: var(--ci-font-weight-semibold);
  font-size: 15px;
  padding: var(--ci-space-sm) 0;
}

.ci-nav-item a::after,
.main-navigation .main-header-menu a::after {
  content: '';
  position: absolute;
  bottom: -6px;
  left: 0;
  width: 0;
  height: 3px;
  background: linear-gradient(90deg, var(--ci-gold-primary), var(--ci-gold-bright));
  transition: width 0.3s ease;
  border-radius: 2px;
}

.ci-nav-item a:hover::after,
.ci-nav-item a:active::after,
.main-navigation .main-header-menu a:hover::after,
.main-navigation .main-header-menu a.current::after {
  width: 100%;
}

.ci-nav-item a:hover,
.ci-nav-item a:active,
.main-navigation .main-header-menu a:hover,
.main-navigation .main-header-menu a.current {
  color: var(--ci-gold-bright);
  text-shadow: 0 0 8px rgba(191, 163, 111, 0.3);
}

/* ========== BOTONES CTA - BLINDAJE ========== */
.ci-cta-boton,
.ast-button.ci-cta-boton {
  background: var(--ci-grad-boton);
  color: var(--ci-negro);
  padding: 14px 32px;
  border: none;
  border-radius: 8px;
  font-weight: var(--ci-font-weight-bold);
  font-size: 16px;
  cursor: pointer;
  transition: all 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
  box-shadow: 0 8px 24px rgba(191, 163, 111, 0.25);
  display: inline-block;
  text-decoration: none;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  min-width: 200px;
  text-align: center;
}

.ci-cta-boton:hover,
.ast-button.ci-cta-boton:hover {
  transform: translateY(-3px);
  box-shadow: 0 12px 28px rgba(222, 206, 98, 0.5);
  background: var(--ci-grad-boton-hover);
}

.ci-cta-boton:active,
.ast-button.ci-cta-boton:active {
  transform: translateY(-1px);
}

/* Botón Secundario (fondo oscuro) */
.ci-cta-boton-secondary,
.ast-button.ci-cta-boton-secondary {
  background: transparent;
  color: var(--ci-gold-bright);
  border: 2px solid var(--ci-gold-primary);
  padding: 12px 28px;
  box-shadow: none;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.ci-cta-boton-secondary:hover,
.ast-button.ci-cta-boton-secondary:hover {
  background: rgba(191, 163, 111, 0.1);
  border-color: var(--ci-gold-bright);
  box-shadow: var(--ci-shadow-gold);
  color: var(--ci-gold-bright);
}

/* Botón Secundario sobre fondo claro: el dorado brillante no se lee sobre blanco */
.ci-seccion-clara .ci-cta-boton-secondary {
  color: var(--ci-texto-sobre-claro);
  border-color: var(--ci-oro-5);
}

.ci-seccion-clara .ci-cta-boton-secondary:hover {
  color: var(--ci-texto-sobre-claro);
  background: rgba(170, 119, 28, 0.08);
  border-color: var(--ci-oro-3);
}

/* Botón Pequeño */
.ci-cta-boton-sm {
  padding: 10px 20px;
  font-size: 14px;
  min-width: auto;
}

/* Botón Full Width Móvil */
@media (max-width: 768px) {
  .ci-cta-boton,
  .ast-button.ci-cta-boton {
    width: 100%;
    padding: 16px 32px;
    font-size: 16px;
    min-height: 48px;
  }

  .ci-cta-boton-secondary {
    width: 100%;
  }
}

/* ========== HERO SECTION - BLINDAJE ========== */
.ci-hero-section {
  background: linear-gradient(135deg, var(--ci-negro) 0%, var(--ci-gris-carbon) 100%);
  padding: var(--ci-space-xxl) var(--ci-space-lg);
  text-align: center;
  min-height: 500px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  position: relative;
  overflow: hidden;
}

.ci-hero-section::before {
  content: '';
  position: absolute;
  top: -50%;
  right: -20%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(191, 149, 63, 0.12) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.ci-hero-wrapper {
  position: relative;
  z-index: 2;
  max-width: 800px;
}

.ci-hero-title {
  color: var(--ci-gold-bright);
  font-size: clamp(32px, 8vw, 56px);
  font-weight: var(--ci-font-weight-extrabold);
  margin-bottom: var(--ci-space-lg);
  line-height: 1.2;
  text-shadow: 0 3px 12px rgba(0, 0, 0, 0.5);
  letter-spacing: -1px;
}

.ci-hero-subtitle {
  color: var(--ci-texto-sobre-oscuro);
  font-size: clamp(18px, 3vw, 24px);
  margin-bottom: var(--ci-space-xl);
  line-height: 1.5;
}

.ci-hero-cta-group {
  display: flex;
  gap: var(--ci-space-lg);
  justify-content: center;
  flex-wrap: wrap;
}

/* ========== TARJETAS PRODUCTO - BLINDAJE ========== */
.ci-card-property {
  background: rgba(26, 26, 26, 0.95);
  border: 2px solid var(--ci-gold-primary);
  border-radius: var(--ci-border-radius-md);
  padding: var(--ci-space-lg);
  transition: all 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
  display: flex;
  flex-direction: column;
  gap: var(--ci-space-md);
  position: relative;
  overflow: hidden;
}

.ci-card-property::before {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(191, 163, 111, 0.1), transparent);
  transition: left 0.5s ease;
  pointer-events: none;
}

.ci-card-property:hover::before {
  left: 100%;
}

.ci-card-property:hover {
  transform: translateY(-12px) scale(1.02);
  box-shadow: 0 16px 40px rgba(191, 163, 111, 0.45);
  border-color: var(--ci-gold-bright);
  background: rgba(26, 26, 26, 0.99);
}

.ci-card-image {
  width: 100%;
  height: 250px;
  background: linear-gradient(135deg, var(--ci-gris-carbon) 0%, var(--ci-oro-5) 100%);
  border-radius: var(--ci-border-radius-sm);
  margin-bottom: var(--ci-space-md);
  object-fit: cover;
}

.ci-card-title {
  color: var(--ci-gold-bright);
  font-weight: var(--ci-font-weight-bold);
  font-size: 22px;
  margin: 0;
  line-height: 1.3;
}

/* CORRECCIÓN 2026-09-16: el precio era verde #2d5016 sobre la tarjeta oscura (ilegible). */
.ci-card-price {
  color: var(--ci-gold-primary);
  font-size: 28px;
  font-weight: var(--ci-font-weight-extrabold);
  margin: var(--ci-space-md) 0;
}

.ci-card-description {
  color: var(--ci-texto-sobre-oscuro);
  font-size: 15px;
  margin-bottom: var(--ci-space-md);
}

.ci-card-features {
  list-style: none;
  color: var(--ci-texto-sobre-oscuro);
  margin: var(--ci-space-md) 0;
  padding: 0;
  font-size: 14px;
}

.ci-card-features li {
  padding: var(--ci-space-sm) 0;
  display: flex;
  align-items: center;
  gap: var(--ci-space-sm);
}

.ci-card-features li::before {
  content: '✓';
  color: var(--ci-gold-primary);
  font-weight: var(--ci-font-weight-extrabold);
  font-size: 18px;
  display: flex;
  align-items: center;
}

.ci-card-cta {
  margin-top: auto;
  margin-top: var(--ci-space-md);
}

/* Tarjeta sobre sección clara: blanca con borde beige */
.ci-seccion-clara .ci-card-property {
  background: var(--ci-blanco);
  border-color: var(--ci-beige);
  box-shadow: var(--ci-shadow-claro);
}

.ci-seccion-clara .ci-card-property:hover {
  background: var(--ci-blanco);
  border-color: var(--ci-oro-1);
  box-shadow: 0 16px 40px rgba(26, 26, 26, 0.12);
}

.ci-seccion-clara .ci-card-title {
  color: var(--ci-texto-sobre-claro);
}

.ci-seccion-clara .ci-card-price,
.ci-seccion-clara .ci-card-features li::before {
  color: var(--ci-oro-5);
}

.ci-seccion-clara .ci-card-description,
.ci-seccion-clara .ci-card-features {
  color: var(--ci-texto-sobre-claro-suave);
}

/* ========== LINKS INTERNOS - BLINDAJE ========== */
.ci-link-internal,
a.ci-link-internal {
  color: var(--ci-gold-bright);
  text-decoration: underline;
  text-decoration-color: var(--ci-gold-primary);
  text-underline-offset: 6px;
  text-decoration-thickness: 2px;
  transition: all 0.3s ease;
  font-weight: var(--ci-font-weight-semibold);
}

.ci-link-internal:hover,
a.ci-link-internal:hover {
  color: var(--ci-oro-2);
  text-decoration-thickness: 3px;
  text-shadow: 0 0 12px rgba(191, 163, 111, 0.4);
}

.ci-seccion-clara .ci-link-internal,
.ci-seccion-clara a.ci-link-internal {
  color: var(--ci-oro-5);
  text-decoration-color: var(--ci-oro-1);
}

.ci-seccion-clara .ci-link-internal:hover,
.ci-seccion-clara a.ci-link-internal:hover {
  color: var(--ci-oro-3);
  text-shadow: none;
}

/* ========== BREADCRUMBS - BLINDAJE ========== */
.ci-breadcrumb-wrapper {
  display: flex;
  gap: var(--ci-space-md);
  align-items: center;
  margin-bottom: var(--ci-space-lg);
  padding: var(--ci-space-md) var(--ci-space-lg);
  background: rgba(191, 163, 111, 0.06);
  border-left: 4px solid var(--ci-gold-primary);
  border-radius: 0 var(--ci-border-radius-sm) var(--ci-border-radius-sm) 0;
  flex-wrap: wrap;
}

.ci-breadcrumb-item {
  color: var(--ci-texto-sobre-oscuro);
  font-size: 14px;
  font-weight: var(--ci-font-weight-normal);
}

.ci-breadcrumb-item a {
  color: var(--ci-gold-primary);
  text-decoration: none;
  transition: all 0.2s ease;
  font-weight: var(--ci-font-weight-semibold);
}

.ci-breadcrumb-item a:hover {
  color: var(--ci-gold-bright);
  text-shadow: 0 0 8px rgba(191, 163, 111, 0.5);
}

.ci-breadcrumb-separator {
  color: var(--ci-gold-primary);
  font-weight: var(--ci-font-weight-bold);
  opacity: 0.6;
}

.ci-breadcrumb-item.active {
  color: var(--ci-gold-bright);
  font-weight: var(--ci-font-weight-semibold);
}

.ci-seccion-clara .ci-breadcrumb-wrapper {
  background: var(--ci-crema-calido);
  border-left-color: var(--ci-oro-5);
}

.ci-seccion-clara .ci-breadcrumb-item {
  color: var(--ci-texto-sobre-claro-suave);
}

.ci-seccion-clara .ci-breadcrumb-item a,
.ci-seccion-clara .ci-breadcrumb-separator {
  color: var(--ci-oro-5);
}

.ci-seccion-clara .ci-breadcrumb-item a:hover {
  color: var(--ci-oro-3);
  text-shadow: none;
}

.ci-seccion-clara .ci-breadcrumb-item.active {
  color: var(--ci-texto-sobre-claro);
}

/* ========== SECCIÓN GEO - BLINDAJE ========== */
.ci-geo-section {
  background: linear-gradient(135deg, var(--ci-negro) 0%, var(--ci-negro-suave) 100%);
  padding: var(--ci-space-xxl) var(--ci-space-lg);
  text-align: center;
}

.ci-geo-title {
  color: var(--ci-gold-bright);
  font-size: 32px;
  font-weight: var(--ci-font-weight-bold);
  margin-bottom: var(--ci-space-lg);
}

.ci-geo-subtitle {
  color: var(--ci-texto-sobre-oscuro);
  font-size: 18px;
  margin-bottom: var(--ci-space-xxl);
}

.ci-geo-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: var(--ci-space-lg);
  max-width: 1200px;
  margin: 0 auto;
}

.ci-geo-section.ci-seccion-clara {
  background: var(--ci-crema);
}

.ci-seccion-clara .ci-geo-title {
  color: var(--ci-texto-sobre-claro);
}

.ci-seccion-clara .ci-geo-subtitle {
  color: var(--ci-texto-sobre-claro-suave);
}

/* ========== FOOTER - BLINDAJE ========== */
.ci-footer-geo,
.site-footer {
  background: linear-gradient(180deg, var(--ci-negro) 0%, rgba(0, 0, 0, 0.98) 100%);
  color: var(--ci-texto-sobre-oscuro);
  padding: var(--ci-space-xxl) var(--ci-space-lg);
  border-top: 3px solid var(--ci-gold-primary);
}

.ci-footer-title {
  color: var(--ci-gold-bright);
  font-size: 20px;
  font-weight: var(--ci-font-weight-bold);
  margin-bottom: var(--ci-space-lg);
}

.ci-footer-description {
  line-height: 1.6;
  margin-bottom: var(--ci-space-lg);
}

.ci-footer-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.ci-footer-list li {
  padding: var(--ci-space-sm) 0;
}

.ci-footer-list a {
  color: var(--ci-gold-primary);
  text-decoration: none;
  transition: all 0.2s ease;
}

.ci-footer-list a:hover {
  color: var(--ci-gold-bright);
  text-shadow: 0 0 8px rgba(191, 163, 111, 0.4);
}

/* ========== FORMULARIOS - BLINDAJE ========== */
.ci-form-group {
  margin-bottom: var(--ci-space-lg);
}

.ci-form-label {
  color: var(--ci-texto-sobre-oscuro);
  font-weight: var(--ci-font-weight-semibold);
  display: block;
  margin-bottom: var(--ci-space-sm);
  font-size: 14px;
}

.ci-form-input,
.ci-form-select,
.ci-form-textarea {
  width: 100%;
  padding: var(--ci-space-md);
  border: 2px solid var(--ci-gold-primary);
  border-radius: var(--ci-border-radius-sm);
  background: rgba(26, 26, 26, 0.95);
  color: var(--ci-texto-sobre-oscuro);
  font-family: var(--ci-font-family);
  font-size: 15px;
  transition: all 0.3s ease;
}

.ci-form-input:focus,
.ci-form-select:focus,
.ci-form-textarea:focus {
  outline: none;
  border-color: var(--ci-gold-bright);
  box-shadow: 0 0 12px rgba(191, 163, 111, 0.3);
  background: rgba(26, 26, 26, 0.99);
}

.ci-form-input::placeholder,
.ci-form-textarea::placeholder {
  color: rgba(232, 232, 232, 0.55);
}

.ci-form-checkbox,
.ci-form-radio {
  accent-color: var(--ci-gold-primary);
  width: 18px;
  height: 18px;
  cursor: pointer;
}

/* Formulario sobre fondo claro (tarjeta crema) */
.ci-seccion-clara .ci-form-label {
  color: var(--ci-texto-sobre-claro);
}

.ci-seccion-clara .ci-form-input,
.ci-seccion-clara .ci-form-select,
.ci-seccion-clara .ci-form-textarea {
  background: var(--ci-blanco);
  color: var(--ci-texto-sobre-claro);
  border-color: var(--ci-beige);
}

.ci-seccion-clara .ci-form-input:focus,
.ci-seccion-clara .ci-form-select:focus,
.ci-seccion-clara .ci-form-textarea:focus {
  background: var(--ci-blanco);
  border-color: var(--ci-oro-1);
  box-shadow: 0 0 0 3px rgba(191, 149, 63, 0.18);
}

.ci-seccion-clara .ci-form-input::placeholder,
.ci-seccion-clara .ci-form-textarea::placeholder {
  color: var(--ci-gris-medio);
}

.ci-seccion-clara .ci-form-checkbox,
.ci-seccion-clara .ci-form-radio {
  accent-color: var(--ci-oro-5);
}

/* ========== TIPOGRAFÍA - BLINDAJE ========== */
/* El título arranca en dorado sólido y solo se vuelve transparente si el navegador
   soporta el degradado recortado al texto. Así nunca queda invisible. */
h1.ci-heading,
h2.ci-heading {
  font-family: var(--ci-font-heading);
  color: var(--ci-gold-primary);
  font-weight: var(--ci-font-weight-bold);
  line-height: 1.3;
  margin-bottom: var(--ci-space-lg);
  letter-spacing: 0.05em; /* Cinzel se ve mejor con tracking */
}

@supports ((-webkit-background-clip: text) or (background-clip: text)) {
  h1.ci-heading,
  h2.ci-heading {
    background: var(--ci-grad-metalico);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    color: transparent;
  }
}

/* Sobre fondo claro: negro sólido, nunca degradado (regla Premium Híbrido). */
.ci-seccion-clara h1.ci-heading,
.ci-seccion-clara h2.ci-heading {
  background: none;
  -webkit-text-fill-color: currentColor;
  color: var(--ci-texto-sobre-claro);
}

h1.ci-heading {
  font-size: 42px;
}

h2.ci-heading {
  font-size: 32px;
}

h3.ci-heading {
  color: var(--ci-gold-bright);
  font-weight: var(--ci-font-weight-bold);
  font-size: 24px;
  line-height: 1.3;
  margin-bottom: var(--ci-space-lg);
}

.ci-seccion-clara h3.ci-heading {
  color: var(--ci-oro-5);
}

@media print {
  h1.ci-heading, h2.ci-heading {
    -webkit-text-fill-color: #000;
    background: none;
    color: #000;
  }
}

.ci-text-muted {
  color: rgba(232, 232, 232, 0.8);
  font-size: 14px;
}

.ci-text-highlight {
  background: linear-gradient(120deg, rgba(191, 149, 63, 0.2), rgba(222, 206, 98, 0.2));
  padding: var(--ci-space-sm) var(--ci-space-md);
  border-radius: var(--ci-border-radius-sm);
}

.ci-seccion-clara .ci-text-highlight {
  background: var(--ci-crema-calido);
  border-left: 3px solid var(--ci-oro-1);
}

/* ========== RESPONSIVE - BLINDAJE ========== */
@media (max-width: 992px) {
  .ci-nav-menu {
    gap: var(--ci-space-lg);
  }

  .ci-hero-section {
    padding: var(--ci-space-xl) var(--ci-space-md);
    min-height: 400px;
  }

  h1.ci-heading {
    font-size: 32px;
  }

  h2.ci-heading {
    font-size: 24px;
  }
}

@media (max-width: 768px) {
  .ci-hero-title {
    font-size: 28px;
  }

  .ci-hero-subtitle {
    font-size: 16px;
  }

  .ci-cta-boton,
  .ast-button.ci-cta-boton,
  .ci-cta-boton-secondary {
    width: 100%;
    padding: 16px 24px;
    font-size: 15px;
    min-height: 48px;
  }

  .ci-hero-cta-group {
    flex-direction: column;
    gap: var(--ci-space-md);
  }

  .ci-nav-menu {
    flex-direction: column;
    gap: var(--ci-space-md);
  }

  .ci-card-property {
    padding: var(--ci-space-md);
  }

  .ci-breadcrumb-wrapper {
    flex-direction: column;
    align-items: flex-start;
    gap: var(--ci-space-sm);
  }

  .ci-geo-grid {
    grid-template-columns: 1fr;
  }

  h1.ci-heading {
    font-size: 24px;
  }

  h2.ci-heading {
    font-size: 20px;
  }
}

@media (max-width: 544px) {
  .ci-hero-title {
    font-size: 22px;
  }

  .ci-cta-boton,
  .ast-button.ci-cta-boton,
  .ci-cta-boton-secondary {
    padding: 14px 20px;
    font-size: 14px;
  }

  .site-title {
    font-size: 20px;
  }
}

/* ========== ACCESIBILIDAD - BLINDAJE ========== */
.ci-sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border-width: 0;
}

/* Focus visible para navegación con teclado */
.ci-nav-item a:focus-visible,
.ci-cta-boton:focus-visible,
.ci-link-internal:focus-visible {
  outline: 3px solid var(--ci-gold-bright);
  outline-offset: 2px;
  border-radius: 2px;
}

.ci-seccion-clara .ci-cta-boton:focus-visible,
.ci-seccion-clara .ci-link-internal:focus-visible {
  outline-color: var(--ci-oro-5);
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  .ci-cta-boton,
  .ci-card-property,
  .ci-card-property::before {
    transition: none;
  }

  .ci-cta-boton:hover,
  .ci-card-property:hover {
    transform: none;
  }
}

/* ========== PRINT - BLINDAJE ========== */
@media print {
  .ci-header-wrapper,
  .ci-breadcrumb-wrapper,
  .ci-hero-cta-group,
  .ci-nav-menu {
    display: none;
  }

  .ci-hero-title,
  h1.ci-heading {
    color: #000;
    text-shadow: none;
  }
}
