/* site.css — estilos globales del site (migración GULA loscisneroslaw)
   Valores atómicos medidos sobre el original vivo (Divi): secciones blancas
   con padding 54px, headings Open Sans 500, body Open Sans 16px/400 #666,
   página #f5f5f5. Regla: solo var(--token), sin hex/rgba hardcodeados.
   
   CORRECCIONES TIPOGRAFÍA 2025:
   - Body: 16px base (1rem) vs 14px original
   - Headings: Open Sans vs Poppins (legibilidad)
   - Line-height: 1.6-1.7 vs valores fijos problemáticos
   - Fluid typography con clamp() para escalado responsive
*/

body {
  font-family: var(--font-family-sans);
  font-size: var(--font-size-prose);
  line-height: 1.6;
  color: var(--color-text-muted);
  background: var(--color-bg);
  font-weight: var(--font-weight-normal);
  -webkit-font-smoothing: antialiased;
}
h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-family-sans);
  color: var(--color-text);
  line-height: var(--line-height-tight);
  font-weight: var(--font-weight-medium);
  margin: 0 0 var(--space-sm);
  overflow-wrap: break-word;
}
/* Tamaños base globales = IDIVI (inline en <style> del origen): h1 30 / h2 26 / h3 22 / h4 18 / h5 16 / h6 14px
   CORREGIDO: ahora usan clamp() para escalado fluido y rem en vez de px fijos */
h1 { font-size: clamp(2rem, 4vw, 2.5rem); font-family: var(--font-family-sans) !important; }
h2 { font-size: clamp(1.563rem, 3vw, 2rem); }
h3 { font-size: clamp(1.25rem, 2.5vw, 1.5rem); }
h4 { font-size: clamp(1.125rem, 2vw, 1.25rem); }
h5 { font-size: clamp(1rem, 1.8vw, 1.125rem); }
h6 { font-size: clamp(0.875rem, 1.5vw, 1rem); }
a { color: inherit; text-decoration: none; }
a.link { color: var(--color-accent); }
a.link:hover { opacity: 0.8; }
img { max-width: 100%; height: auto; display: block; }
.container { max-width: 1402px; width: 90%; margin: 0 auto; padding: 0; }

/* El original conserva el header amplio, pero usa filas de contenido Divi al
   80% con tope de 1280px. Se replica sólo en desktop para devolver aire a la
   lectura sin estrechar tablet ni móvil. */
@media (min-width: 1200px) {
  .section > .container {
    width: 80%;
    max-width: 1280px;
  }
}

/* ===== Top bar (header) ===== */
.topbar {
  background: var(--color-primary);
  color: var(--color-text-muted);
  font-size: var(--font-size-sm);
}
.topbar .container {
  display: flex; align-items: center; justify-content: space-between;
  flex-wrap: wrap; gap: var(--space-sm);
  padding-top: var(--space-xs); padding-bottom: var(--space-xs);
  min-height: 40px;
}
.topbar a { color: var(--color-on-dark-muted); }
.topbar a:hover { color: var(--color-white); }
.topbar .topbar-contacts { display: flex; gap: var(--space-lg); flex-wrap: wrap; min-width: 0; max-width: 100%; }
.topbar .topbar-contacts a { overflow-wrap: anywhere; }
.topbar .contact-copy { display: inline-flex; align-items: baseline; gap: 0.25rem; }
.topbar .contact-label { font-weight: 600; }
.topbar .contact-label::after { content: ":"; }
.topbar .topbar-contacts i { margin-right: var(--space-xs); color: var(--color-white); }
.topbar .topbar-social { display: flex; gap: var(--space-md); align-items: center; }
.topbar-social { display: flex; gap: var(--space-md); align-items: center; }
.topbar-social a { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; }
.topbar .topbar-social a {
  display: inline-flex; align-items: center; justify-content: center;
  width: 44px; height: 44px; border-radius: 95px;
  background: var(--color-primary); color: var(--color-white);
}
.topbar .topbar-social a:hover { color: var(--color-secondary); background: var(--color-secondary); }

/* ===== Menú principal (original: row blanco 104px, links Open Sans 1rem/500 navy, CTA gold) ===== */
.site-header {
  width: 100%;
  background: var(--color-white);
}
.site-header > .container,
.site-header .menu-row { background: var(--color-white); }
.site-header .menu-row {
  display: flex; align-items: center; justify-content: flex-start;
  gap: var(--space-md); min-height: 104px; background: var(--color-white);
}
.main-nav { margin-left: auto; margin-right: 2.5rem; }
.logo img { width: auto; height: 64px; max-width: 120px; }
.main-nav ul { display: flex; gap: var(--space-lg); list-style: none; margin: 0; padding: 0; }
.main-nav a {
  font-family: var(--font-family-sans);
  font-size: var(--font-size-action); font-weight: var(--font-weight-medium); text-transform: none; letter-spacing: var(--letter-spacing-normal);
  min-height: 44px; display: inline-flex; align-items: center;
  color: var(--color-primary);
}
.main-nav a:hover, .main-nav a.active { color: var(--color-primary); }
.menu-row .btn-gold { color: var(--color-white); }
.mobile-menu-toggle { display: none; font-size: 28px; color: var(--color-primary); min-width: 44px; min-height: 44px; }
/* MENÚ MÓVIL - legible y touch-friendly */
@media (max-width: 768px) {
  .logo img { height: 48px; }
  .main-nav a {
    font-size: 1rem;
    padding: 0.75rem 0.5rem;
  }
  .main-nav.open li { padding: 0.5rem 0; }
}

/* Botones: dos variantes medidas del original */
.btn {
  display: inline-block; font-family: var(--font-family-sans);
  font-size: var(--font-size-action); font-weight: var(--font-weight-medium); line-height: 1.5;
  padding: 0.5em 1.5em; border-radius: 8px;
  background: var(--color-primary); color: var(--color-white);
  transition: opacity 0.3s ease, transform 0.15s ease;
  cursor: pointer; border: none; text-align: center;
  min-height: 44px; min-width: 120px;
}
.btn:hover { opacity: 0.9; }
.btn-gold {
  background: var(--color-secondary); color: var(--color-black);
  border-radius: 8px;
}
.btn-gold:hover { opacity: 0.9; }
.btn-outline {
  background: transparent; color: var(--color-primary);
  border: 2px solid var(--color-primary);
}
.btn-outline:hover { background: var(--color-primary); color: var(--color-white); }
.btn-link {
  display: inline-block; background: transparent; color: var(--color-accent);
  font-family: var(--font-family-sans); font-size: var(--font-size-action); font-weight: var(--font-weight-medium);
  border-radius: 4px; padding: 0.5em 1em; cursor: pointer; border: none;
  min-height: 44px;
}
.btn-link:hover { opacity: 0.8; }
.ti-arrow, .badge-carousel__nav { min-width: 44px; min-height: 44px; }
.pac-dcm-column { overflow: hidden !important; }
.menu-row .btn, .menu-row .btn-gold { font-size: var(--font-size-action); border-radius: 8px; margin-right: 40px; padding: 0.5em 1.5em 0.5em 0.7em; min-height: 44px; }
.menu-row > .btn-gold { display: inline-flex; align-items: center; justify-content: center; }

/* ===== Secciones / layout de páginas (original: 54px de padding, blancas) ===== */
.section { padding: 54px 0; background: var(--color-white); }
.section-heading { text-align: center; margin-bottom: var(--space-lg); }
.section-heading .eyebrow {
  font-family: var(--font-family-sans); font-size: clamp(1rem, 1.8vw, 1.5rem);
  font-weight: 500; color: var(--color-text);
  line-height: 1.5; margin-bottom: 10px;
}
.section-heading h2 { font-size: clamp(1.5rem, 3vw, 2.5rem); font-weight: 500; line-height: 1.3; font-family: var(--font-family-sans); }
.divider { border: 0; height: 1px; background: var(--color-border); margin: var(--space-lg) 0; }
.grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-lg); }
.grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.grid-4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--space-md); }

/* ===== Banner de título de páginas internas (tb-17 del origen) ===== */
.page-banner { background: var(--color-primary); padding: clamp(2rem, 5vw, 57px) 0 clamp(1rem, 2vw) 13px; min-height: clamp(150px, 30vh, 247px); text-align: center; }
.page-banner .container { display: flex; flex-direction: column; align-items: center; }
.page-banner h4 {
  font-family: var(--font-family-sans); font-size: clamp(1rem, 2vw, 1.3rem); font-weight: var(--font-weight-medium);
  line-height: var(--line-height-relaxed); color: var(--color-white); margin: 0 0 2px;
}
.page-banner h1 {
  font-family: var(--font-family-sans); font-weight: var(--font-weight-medium);
  color: var(--color-white); margin: 0; padding-bottom: 10px;
  font-size: var(--font-size-page-title); line-height: 1.15;
  max-width: 18ch;
}

/* ===== Hero home (original: sección vacía 900px navy + foto cover) ===== */
.hero-banner {
  min-height: clamp(400px, 60vh, 900px);
  background-color: var(--color-primary-soft);
  background-image: url("/img/2025/03/LegalServices-LosCisnerosLaw-Nicaragua-min-scaled.jpg");
  background-size: cover;
  background-position: 50% 50%;
  background-repeat: no-repeat;
}
/* En escritorio se conserva la altura original para apreciar la fotografía
   completa; tablet y móvil mantienen sus alturas responsivas más compactas. */
@media (min-width: 1101px) {
  .hero-banner { min-height: 900px; }
}
/* HERO MÓVIL - altura justa para el contenido visible */
@media (max-width: 480px) {
  .hero-banner { min-height: 450px; }
}

/* ===== Intro del home (párrafos Open Sans, legibilidad mejorada) ===== */
.measure { max-width: 70ch; margin-inline: auto; }
.intro { max-width: 70ch; margin-inline: auto; }
.intro p {
  font-family: var(--font-family-sans);
  font-size: var(--font-size-prose); line-height: var(--line-height-relaxed); color: var(--color-text-muted);
  max-width: 70ch;
  margin-bottom: var(--space-md);
}

/* ===== Cards de servicios (original: 2x2 navy/gold, radius 6, min 490px, texto blanco/negro) ===== */
.service-card {
  position: relative; overflow: hidden; text-align: center;
  background: var(--color-primary); color: var(--color-white);
  border-radius: 6px; padding: 23% 40px 40px;
  display: flex; flex-direction: column; gap: var(--space-md);
  justify-content: center; align-items: center; min-height: 490px;
}
.service-card.gold { background: var(--color-secondary); color: var(--color-black); }
.service-card h3 { color: inherit; font-size: clamp(1.25rem, 2.5vw, 1.5rem); font-weight: var(--font-weight-medium); margin: 0; }
.service-card p { color: inherit; opacity: 0.95; font-size: var(--font-size-prose); line-height: var(--line-height-relaxed); margin: 0; max-width: 65ch; }
.service-card .btn {
  font-size: var(--font-size-action);
  background: var(--color-primary); color: var(--color-white);
  border: 1px solid var(--color-white); border-radius: 3px;
  padding: 0.5em 2em 0.5em 0.7em;
  min-height: 44px;
}
@media (max-width: 768px) {
  .service-card { min-height: 380px; padding: 15% 25px 25px; }
  .service-card h3 { font-size: 1.125rem; }
  .service-card p { font-size: var(--font-size-prose); }
}

/* ===== Listas con íconos (dsm_icon_list del origen) ===== */
.icon-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--space-sm); }
.icon-list li { display: flex; align-items: flex-start; gap: var(--space-sm); min-width: 0; overflow-wrap: anywhere; }
.icon-list li i { color: var(--color-secondary); margin-top: 0.25em; }

/* ===== Formularios ===== */
.form-group { margin-bottom: var(--space-md); }
.form-group label {
  display: block; font-family: var(--font-family-heading);
  font-size: var(--font-size-sm); font-weight: 600;
  color: var(--color-text); margin-bottom: var(--space-xs);
}
.form-group input, .form-group select, .form-group textarea {
  width: 100%; padding: 0.7em 0.9em; border: 1px solid var(--color-border);
  border-radius: var(--radius-sm); background: var(--color-white);
  color: var(--color-text); font-family: var(--font-family-sans); font-size: var(--font-size-base);
}
.form-group input:focus, .form-group select:focus, .form-group textarea:focus {
  outline: 2px solid var(--color-accent); outline-offset: 1px;
}
.form-honeypot { position: absolute; left: -9999px; opacity: 0; height: 0; overflow: hidden; }
.form-notice { padding: var(--space-md); border-radius: var(--radius-sm); margin-bottom: var(--space-md); }
.form-notice.ok { background: var(--color-secondary-soft); color: var(--color-text); border: 1px solid var(--color-secondary); }
.form-notice.err { background: var(--color-surface); color: var(--color-text); border: 1px solid var(--color-border); }

/* ===== Blog ===== */
.post-card { background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius-md); overflow: hidden; display: flex; flex-direction: column; }
.post-card .post-thumb { aspect-ratio: 16/9; overflow: hidden; background: var(--color-surface); }
.post-card .post-thumb img { width: 100%; height: 100%; object-fit: cover; }
.post-card .post-body { padding: var(--space-md); display: flex; flex-direction: column; gap: var(--space-sm); flex: 1; }
.post-card h3 { font-size: var(--font-size-lg); margin: 0; }
.post-card h3 a:hover { color: var(--color-primary); }
.post-meta { font-size: var(--font-size-sm); color: var(--color-text-muted); }
.post-excerpt { color: var(--color-text-muted); font-size: var(--font-size-prose); line-height: var(--line-height-relaxed); flex: 1; max-width: 70ch; }
.post-card .btn { font-size: var(--font-size-action); align-self: flex-start; }
.article-content { line-height: var(--line-height-relaxed); }
.article-content p { margin-bottom: var(--space-md); }
.article-content h2, .article-content h3, .article-content h4 { margin: var(--space-lg) 0 var(--space-sm); }
.article-content ul, .article-content ol { margin: 0 0 var(--space-md) 1.5em; padding: 0; }
.article-content li { margin-bottom: var(--space-xs); }
.article-content img { margin: var(--space-md) auto; border-radius: var(--radius-md); }
.article-content blockquote { border-left: 4px solid var(--color-secondary); padding-left: var(--space-md); color: var(--color-text-muted); margin: var(--space-md) 0; }
.article-content table { width: 100%; margin: var(--space-md) 0; }
.article-content td, .article-content th { border: 1px solid var(--color-border); padding: var(--space-sm) var(--space-md); }
.article-content a { color: var(--color-accent); }

/* ===== Properties (original: card blanco radius 8 + shadow + height 250, price verde #28a745,
   meta grid 2col .85rem iconos navy, botón navy radius 4 pad .5rem/1rem, badge For-Sale verde) ===== */
.property-card {
  position: relative;
  background: var(--color-white); border-radius: 8px; overflow: hidden; border: none;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}
.property-card .property-image { aspect-ratio: 16/9; overflow: hidden; display: block; }
.property-card .property-image img { width: 100%; height: 100%; object-fit: cover; }
.property-card .property-badge {
  position: absolute; top: 12px; left: 12px;
  background: rgba(40, 167, 69, 0.9); color: var(--color-white);
  padding: 0.35rem 0.75rem; border-radius: 20px; font-size: 0.75rem; font-weight: 600; z-index: 1;
}
.property-card .property-details { padding: var(--space-md); display: flex; flex-direction: column; gap: var(--space-sm); }
.property-card .property-details h3 {
  font-size: clamp(1rem, 2vw, 1.2rem); font-weight: 500; margin: 0;
}
.property-card .property-details h3 a { color: var(--color-text); }
.property-card .property-details h3 a:hover { color: var(--color-primary); }
.property-price {
  font-family: var(--font-family-sans); font-size: clamp(0.9375rem, 1.3vw, 1.125rem); font-weight: 600;
  color: var(--color-success); display: flex; align-items: center; gap: var(--space-xs);
}
.property-meta {
  display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-xs);
  font-size: clamp(0.75rem, 1.1vw, 0.875rem); color: var(--color-text-muted);
  font-family: var(--font-family-sans);
}
.property-meta i { color: var(--color-primary); width: 16px; text-align: center; }
.property-card .btn {
  font-size: clamp(0.8125rem, 1.2vw, 0.9375rem); border-radius: 4px; padding: 0.5rem 1rem;
  background: var(--color-primary); color: var(--color-white);
  min-height: 44px;
  margin: 0;
  }


/* ===== Reviews ===== */
.stars { color: var(--color-star); letter-spacing: 0.1em; }
.review-card { background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius-md); padding: var(--space-lg); }
.review-text { color: var(--color-text); font-style: italic; }
.review-name { font-family: var(--font-family-heading); font-weight: 600; color: var(--color-primary); font-size: 1rem; margin-top: var(--space-sm); }
.section-gold { background: var(--color-secondary); }
.section-gold h2, .section-gold .review-text, .section-gold .review-name { color: var(--color-black); }

/* ===== FAQ ===== */
details.faq-item { border: 1px solid var(--color-border); border-radius: var(--radius-md); margin-bottom: var(--space-sm); background: var(--color-white); }
details.faq-item summary {
  cursor: pointer; font-family: var(--font-family-heading); font-weight: 500;
  color: var(--color-text); padding: var(--space-md); list-style: none;
  display: flex; justify-content: space-between; align-items: center;
}
details.faq-item summary::after { content: "+"; font-size: var(--font-size-xl); color: var(--color-secondary); }
details.faq-item[open] summary::after { content: "\2212"; }
details.faq-item .faq-answer { padding: 0 var(--space-md) var(--space-md); color: var(--color-text-muted); }

/* ===== Footer (original: navy, padding-top 54, oficinas Poppins uppercase, bottom 1.2rem/700) ===== */
.site-footer { background: var(--color-primary); color: var(--color-on-dark-muted); padding-top: 54px; min-height: 525px; }
.site-footer .footer-logo-img { border-radius: 95px; overflow: hidden; border: 1px solid var(--color-white); box-shadow: 0 2px 18px 0 var(--color-white); display: block; }
.site-footer h5 {
  color: var(--color-white); font-size: clamp(1rem, 1.3vw, 1.2rem); font-weight: 500;
  text-transform: uppercase; letter-spacing: -0.04em; line-height: 1.4;
  margin-bottom: 19px; font-family: var(--font-family-sans);
}
.site-footer .footer-bottom { border-top: 1px solid var(--color-primary-soft); padding: var(--space-md) 0; text-align: center; font-size: clamp(1rem, 1.3vw, 1.2rem); font-weight: 700; color: var(--color-white); font-family: var(--font-family-sans); }
.footer-bottom a { color: var(--color-on-dark-muted); }
.site-footer a:hover { color: var(--color-secondary); }
.site-footer .footer-cols { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: var(--space-lg); max-width: 1348px; padding-bottom: var(--space-lg); min-width: 0; }
.site-footer .footer-bottom p { max-width: 100%; overflow-wrap: anywhere; }
.site-footer .map-frame { width: 100%; height: 220px; border: 0; border-radius: var(--radius-md); background: var(--color-primary-soft); }

/* ===== Tabs (book-a-consultation) ===== */
.tabs-controls { display: flex; list-style: none; gap: var(--space-sm); margin: 0 0 var(--space-md); padding: 0; }
.tabs-controls li a { display: block; padding: var(--space-sm) var(--space-lg); background: var(--color-surface-soft); border-radius: var(--radius-sm) var(--radius-sm) 0 0; color: var(--color-text); font-family: var(--font-family-sans); font-weight: 500; font-size: clamp(0.875rem, 1.2vw, 1rem); }
.tabs-controls li.active a { background: var(--color-primary); color: var(--color-white); }

/* ===== Contextos de headings medidos del original ===== */
/* Servicios (Challenge/Solution/...): H2 Open Sans 500 */
.service-page h2 { font-family: var(--font-family-sans); font-size: clamp(1.375rem, 2.2vw, 1.625rem); font-weight: 500; line-height: 1.4; margin: var(--space-lg) 0 var(--space-sm); }
.service-page p { font-size: var(--font-size-prose); line-height: var(--line-height-relaxed); max-width: 70ch; margin-inline: auto; }
.service-page h5 { line-height: 1.35; max-width: 70ch; }
.service-quote { font-style: italic; }
.team-page .section p, .bulletin-page .section > .container > p { max-width: 70ch; margin-inline: auto; font-size: var(--font-size-prose); line-height: var(--line-height-relaxed); }
.service-page h2.text-center { text-align: center; }
/* Team: H2 fluid */
.team-page h2 { font-size: clamp(1.625rem, 3vw, 2.5rem); font-weight: 500; line-height: 1.3; margin-bottom: var(--space-sm); font-family: var(--font-family-sans); }
/* Boletines: H2 fluid */
.bulletin-page h2 { font-family: var(--font-family-sans); font-size: clamp(1.3125rem, 2vw, 1.4375rem); font-weight: 500; line-height: 1.4; }
.bulletin-page h3, .bulletin-page h3 a { font-family: var(--font-family-sans); font-size: clamp(1.125rem, 1.8vw, 1.3125rem); font-weight: 500; line-height: 1.4; color: var(--color-text); }
.bulletin-subheading { color: var(--color-text); font-family: var(--font-family-sans); line-height: 1.35; }
/* Reviews testimonios */
.reviews-page h2 { font-size: clamp(1.3125rem, 2vw, 1.625rem); font-weight: 500; font-family: var(--font-family-sans); line-height: 1.35; }
.reviews-page h2.big-quote { font-size: clamp(1.6875rem, 4vw, 2.625rem); font-weight: 300; font-family: var(--font-family-sans); line-height: 1.2; }

/* ===== Utilidades ===== */
.text-center { text-align: center; }
.text-justify { text-align: justify; }
.mt-1 { margin-top: var(--space-sm); }
.mt-2 { margin-top: var(--space-md); }
.mt-3 { margin-top: var(--space-lg); }
.mb-1 { margin-bottom: var(--space-sm); }
.mb-2 { margin-bottom: var(--space-md); }
.mb-3 { margin-bottom: var(--space-lg); }
.hidden { display: none; }

/* ===== BREAKPOINTS RESPONSIVE - Mobile First ===== */
@media (max-width: 480px) {
  .section { padding: 30px 0; }
  .hero-banner { min-height: 450px; }
  .service-card { min-height: 320px; }
  .site-footer { min-height: 400px; }
  .main-nav { display: none; }
  .main-nav.open { display: block; position: absolute; top: 100%; left: 0; right: 0; background: var(--color-white); box-shadow: var(--shadow-md); z-index: 100; }
  .main-nav.open ul { flex-direction: column; gap: 0; padding: var(--space-md); }
  .main-nav.open li { padding: var(--space-sm) 0; border-bottom: 1px solid var(--color-border); }
  .mobile-menu-toggle { display: block; font-size: 28px; color: var(--color-primary); }
  .topbar .container { justify-content: center; }
  .site-footer .footer-cols { grid-template-columns: 1fr; }
}

@media (min-width: 481px) and (max-width: 768px) {
  .section { padding: 40px 0; }
  .hero-banner { min-height: 560px; }
  .site-footer { min-height: 450px; }
  .site-footer .footer-cols { grid-template-columns: 1fr; }
}

@media (min-width: 901px) and (max-width: 1024px) {
  .grid-2 { grid-template-columns: 1fr; }
  .section { padding: 45px 0; }
}

@media (min-width: 1025px) and (max-width: 1280px) {
  .site-footer .footer-cols { max-width: 1100px; }
}

@media (max-width: 900px) {
  .grid-2, .grid-3, .grid-4 { grid-template-columns: 1fr; }
  .main-nav { display: none; }
  .main-nav.open { display: block; position: absolute; top: 100%; left: 0; right: 0; background: var(--color-white); box-shadow: var(--shadow-md); z-index: 100; }
  .main-nav.open ul { flex-direction: column; gap: 0; padding: var(--space-md); }
  .main-nav.open li { padding: var(--space-sm) 0; border-bottom: 1px solid var(--color-border); }
  .mobile-menu-toggle { display: block; font-size: 28px; color: var(--color-primary); }
  .site-footer .footer-cols { grid-template-columns: 1fr; }
  .topbar .container { justify-content: center; }
  .hero-banner { min-height: 480px; }
}

/* El menú completo y sus ocho enlaces no caben de forma segura en tablet ni
   en escritorios muy estrechos; se mantiene colapsado hasta 1199px. */
@media (max-width: 1199.98px) {
  .main-nav { display: none; }
  .main-nav.open { display: block; position: absolute; top: 100%; left: 0; right: 0; background: var(--color-white); box-shadow: var(--shadow-md); z-index: 100; }
  .main-nav.open ul { flex-direction: column; gap: 0; padding: var(--space-md); }
  .main-nav.open li { padding: var(--space-sm) 0; border-bottom: 1px solid var(--color-border); }
  .mobile-menu-toggle { display: block; }
}

@media (max-width: 768px) {
  .menu-row { flex-wrap: wrap; }
  .menu-row .btn, .menu-row .btn-gold { margin-right: 0; }
  .text-justify { text-align: left; }
  .page-banner h1 { font-size: clamp(2rem, 8vw, 2.5rem); line-height: 1.15; max-width: 16ch; }
  .mobile-menu-toggle { min-width: 44px; min-height: 44px; }
}

/* ===== Header stability contract (phase 09) =====
   The header uses explicit grid areas at every collapsed breakpoint. This
   keeps the controls in declared rows instead of letting flex-wrap decide
   their geometry as the viewport changes by a few pixels. */
.site-header .container,
.site-header .menu-row {
  position: relative;
}

.mobile-menu-toggle {
  align-items: center;
  justify-content: center;
  border: 0;
  background: transparent;
  padding: 0;
  cursor: pointer;
}

.main-nav.open {
  box-sizing: border-box;
  max-width: 100%;
  max-height: calc(100vh - 1rem);
  overflow-y: auto;
}

@media (max-width: 1199.98px) {
  .site-header .menu-row {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    grid-template-areas: "logo cta toggle";
    align-items: center;
    justify-content: initial;
    gap: var(--space-md);
    min-height: 104px;
    padding-block: var(--space-sm);
    box-sizing: border-box;
  }

  .site-header .logo {
    grid-area: logo;
    justify-self: start;
    min-width: 0;
  }

  .site-header .menu-row > .btn-gold {
    grid-area: cta;
    justify-self: center;
    width: min(100%, 220px);
    margin-right: 0;
    box-sizing: border-box;
  }

  .site-header .mobile-menu-toggle {
    grid-area: toggle;
    display: inline-flex;
    justify-self: end;
    flex: none;
  }

  .site-header .main-nav {
    display: none;
    margin: 0;
  }

  .site-header .main-nav.open {
    display: block;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    width: 100%;
    background: var(--color-white);
    box-shadow: var(--shadow-md);
    z-index: 100;
  }

  .site-header .main-nav.open ul {
    display: flex;
    flex-direction: column;
    gap: 0;
    padding: var(--space-md);
  }

  .site-header .main-nav.open li {
    padding: var(--space-sm) 0;
    border-bottom: 1px solid var(--color-border);
  }
}

/* ===== Private property administrator ===== */
.admin-shell {
  width: min(92%, 520px);
  margin: 0 auto;
  padding: clamp(2rem, 6vw, 5rem) 0;
}
.admin-shell-wide { width: min(94%, 1200px); }
.admin-card { padding: clamp(1.5rem, 4vw, 3rem); background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius-md); box-shadow: var(--shadow-sm); }
.admin-card h1, .admin-shell h1 { color: var(--color-primary); }
.admin-card > p { margin: 0 0 var(--space-md); }
.admin-form { display: grid; gap: var(--space-xs); max-width: 760px; margin-top: var(--space-lg); }
.admin-form label { color: var(--color-text); font-weight: var(--font-weight-medium); margin-top: var(--space-sm); }
.admin-form label span { font-weight: var(--font-weight-normal); color: var(--color-text-muted); }
.admin-form input, .admin-form textarea { width: 100%; padding: 0.65rem 0.75rem; border: 1px solid var(--color-border); border-radius: var(--radius-sm); background: var(--color-white); color: var(--color-text); }
.admin-form textarea { min-height: 8rem; resize: vertical; }
.admin-form .btn { justify-self: start; margin-top: var(--space-md); }
.admin-check { display: flex; align-items: center; gap: var(--space-xs); }
.admin-check input { width: 1.25rem; height: 1.25rem; }
.admin-error { color: var(--color-danger, var(--color-primary)); font-weight: var(--font-weight-medium); }
.admin-toolbar { display: flex; align-items: center; justify-content: space-between; gap: var(--space-md); margin: var(--space-md) 0 var(--space-lg); }
.admin-toolbar h1 { margin: 0; }
.admin-kicker { margin: 0; color: var(--color-text-muted); text-transform: uppercase; letter-spacing: var(--letter-spacing-wide); font-size: var(--font-size-sm); }
.admin-actions, .admin-publish-actions, .admin-row-actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-sm); }
.admin-table-wrap { overflow-x: auto; background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius-md); }
.admin-table { width: 100%; border-collapse: collapse; min-width: 760px; }
.admin-table th, .admin-table td { padding: var(--space-sm); border-bottom: 1px solid var(--color-border); text-align: left; vertical-align: middle; }
.admin-table th { color: var(--color-primary); }
.admin-table a, .admin-row-actions button { color: var(--color-primary); text-decoration: underline; background: none; border: 0; cursor: pointer; font: inherit; }
.admin-status { display: inline-block; padding: 0.2rem 0.5rem; border-radius: var(--radius-sm); font-size: var(--font-size-sm); font-weight: var(--font-weight-medium); }
.admin-status-published { background: var(--color-success); color: var(--color-white); }
.admin-status-draft { background: var(--color-surface-soft); color: var(--color-primary); }
.admin-status-archived { background: var(--color-border); color: var(--color-text-muted); }
.admin-empty { padding: var(--space-lg); background: var(--color-white); border-radius: var(--radius-md); }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }

@media (max-width: 480px) {
  .topbar .container {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto auto;
    justify-items: center;
    align-items: center;
    row-gap: var(--space-xs);
    padding-block: var(--space-xs);
    width: calc(100% - 16px);
  }

  .topbar .topbar-contacts {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-areas: "email email" "nica usa";
    grid-auto-rows: minmax(1.5rem, auto);
    justify-items: center;
    align-items: center;
    row-gap: var(--space-xs);
    column-gap: 8px;
    width: 100%;
    max-width: 100%;
  }

  .topbar .topbar-contacts a {
    min-height: 24px;
    display: grid;
    grid-template-columns: 1.25rem auto;
    align-items: center;
    justify-content: start;
    justify-self: center;
    width: 100%;
    max-width: 100%;
    text-align: left;
    white-space: normal;
    overflow-wrap: anywhere;
  }

  .topbar .topbar-contacts a:nth-child(1) { grid-area: email; }
  .topbar .topbar-contacts a:nth-child(2) { grid-area: nica; }
  .topbar .topbar-contacts a:nth-child(3) { grid-area: usa; }

  .topbar .topbar-contacts .contact-email {
    width: auto;
    justify-self: center;
  }

  .topbar .topbar-contacts .contact-phone {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.2rem;
    min-height: 72px;
    padding: 0.45rem 0.35rem;
    border-radius: 8px;
    background: var(--color-secondary);
    color: var(--color-primary);
    text-align: center;
  }

  .topbar .topbar-contacts .contact-phone:hover {
    background: var(--color-secondary);
    color: var(--color-primary);
  }

  .topbar .topbar-contacts .contact-phone i {
    color: var(--color-primary);
    width: auto;
    margin: 0;
    font-size: 1.125rem;
    line-height: 1;
  }

  .topbar .contact-copy {
    min-width: 0;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.08rem;
    line-height: 1.15;
    text-align: center;
  }

  .topbar .contact-label {
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    line-height: 1.1;
    color: var(--color-primary);
  }

  .topbar .contact-label::after { content: ""; }
  .topbar .contact-phone .contact-value {
    font-size: 0.9375rem;
    font-weight: 600;
    line-height: 1.2;
    white-space: normal;
    overflow-wrap: anywhere;
  }

  .topbar .topbar-contacts i {
    width: 1.25rem;
    margin-right: 0;
    text-align: center;
  }

  .topbar .topbar-social {
    display: grid;
    grid-template-columns: repeat(5, minmax(44px, 1fr));
    gap: var(--space-xs);
    width: min(100%, 252px);
    justify-content: center;
  }

  .topbar .topbar-social a {
    width: 44px;
    height: 44px;
  }

  .site-header .menu-row {
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas: "logo toggle" "cta cta";
    grid-template-rows: auto auto;
    row-gap: var(--space-sm);
    min-height: 0;
    padding-block: var(--space-sm);
  }

  .site-header .logo img {
    height: 48px;
  }

  .site-header .menu-row > .btn-gold {
    width: min(100%, 220px);
    min-height: 44px;
  }
}


@media (min-width: 1200px) and (max-width: 1440px) {
  .main-nav { margin-right: var(--space-md); }
  .main-nav ul { gap: clamp(0.75rem, 1.25vw, 1.125rem); }
  .main-nav a {
    font-size: 1rem;
    white-space: nowrap;
  }
  .menu-row > .btn-gold {
    margin-right: 0;
    padding-inline: 0.75rem;
    font-size: 1rem;
    white-space: nowrap;
  }
}

@media (min-width: 1200px) {
  .site-header .main-nav {
    display: block;
  }

  .site-header .mobile-menu-toggle {
    display: none;
  }
}