/*
 Theme Name:   Astra Child
 Theme URI:    https://example.com/astra-child
 Description:  Tema hijo de Astra para personalizaciones
 Author:       Tu Nombre o Empresa
 Author URI:   https://example.com
 Template:     astra
 Version:      1.0.0
 Text Domain:  astra-child
*/

/* ==================================================
   LANDING (page-landing.php)
   MANTIENE header/footer de Astra como en Home
   y hace el contenido full width sin romper el tema
   ================================================== */

:root{
  --am-border:#e5e7eb;
  --am-muted:#64748b;
  --am-accent:#2563eb;
  --am-primary:#ff5a1f;
  --am-dark:#111827;
}

/* ✅ FIX ASTRA SOLO CONTENIDO (no tocar #page/.site completos) */
.page-template-page-landing .site-content{
  padding: 0 !important;
}

.page-template-page-landing .site-content .ast-container,
.page-template-page-landing .site-content .ast-container-fluid{
  max-width: 100% !important;
  margin: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* ✅ Contenedor propio para tus secciones */
.page-template-page-landing .am-container{
  width: min(100% - 32px, 1120px);
  margin: 0 auto;
}

/* ==================================================
   IMPORTANTE:
   - Si quieres header/footer IGUAL que Home:
     NO ocultes el header de Astra.
   - Por eso ELIMINAMOS el display:none del header Astra.
   ================================================== */

/* ❌ (ELIMINADO) Ocultar header de Astra SOLO en landing */
/*
.page-template-page-landing header.site-header,
.page-template-page-landing .ast-primary-header-bar,
.page-template-page-landing .main-header-bar,
.page-template-page-landing #ast-desktop-header,
.page-template-page-landing #ast-mobile-header{
  display: none !important;
}
*/

/* ==================================================
   HEADER CUSTOM (OPCIONAL)
   SOLO úsalo si DE VERDAD quieres un header distinto.
   Si quieres que sea igual que Home → no uses este HTML/CSS.
   ================================================== */

.page-template-page-landing .am-site-header{
  position: sticky;
  top: 0;
  z-index: 9999;
  background: rgba(255,255,255,.96);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--am-border);
}

.page-template-page-landing .am-header-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding: 14px 0;
}

.page-template-page-landing .am-brand{
  display:flex;
  align-items:center;
  text-decoration:none;
}

.page-template-page-landing .am-logo{
  height: 60px;
  width: auto;
  display:block;
}

.page-template-page-landing .am-nav{
  display:flex;
  gap:18px;
  align-items:center;
}

.page-template-page-landing .am-nav a{
  font-weight:800;
  font-size:14px;
  color:#0f172a;
  text-decoration:none;
}

.page-template-page-landing .am-nav a:hover{
  color: var(--am-accent);
}

.page-template-page-landing .am-header-actions{
  display:flex;
  align-items:center;
  gap:14px;
}

.page-template-page-landing .am-muted{
  color: var(--am-muted);
}

.page-template-page-landing .am-phone{
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  line-height:1.1;
  font-size:13px;
}

.page-template-page-landing .am-phone-link{
  color: var(--am-accent);
  font-weight:900;
  text-decoration:none;
}

.page-template-page-landing .am-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:10px 18px;
  border-radius:999px;
  border: 1px solid transparent;
  font-weight:900;
  text-decoration:none;
  cursor:pointer;
}

.page-template-page-landing .am-btn-dark{
  background: var(--am-dark);
  color:#fff;
}

.page-template-page-landing .am-btn-dark:hover{
  opacity:.92;
}

@media (max-width: 960px){
  .page-template-page-landing .am-nav{ display:none; }
  .page-template-page-landing .am-phone{ display:none; }
}

/* Fuerza tamaño del logo del HEADER solo en landing */
.page-template-page-landing .am-site-header .am-logo{
  height: 60px !important;
  width: auto !important;
}

/* =========================
   PÁGINA CONTACTO (no toca header/footer)
   ========================= */

.page-template-page-contacto .am-container,
.page-template-contacto .am-container{
  width: min(100% - 32px, 1120px);
  margin: 0 auto;
}

.page-template-page-contacto .am-contact,
.page-template-contacto .am-contact{
  padding: 28px 0 44px;
}

.page-template-page-contacto .am-contact-grid,
.page-template-contacto .am-contact-grid{
  display: grid;
  grid-template-columns: 1.05fr .95fr;
  gap: 22px;
  align-items: start;
}

.page-template-page-contacto .am-contact-photo,
.page-template-contacto .am-contact-photo{
  margin: 0 0 14px;
  border-radius: 16px;
  overflow: hidden;
  border: 1px solid #e5e7eb;
  box-shadow: 0 10px 30px rgba(15,23,42,.08);
}

.page-template-page-contacto .am-contact-photo img,
.page-template-contacto .am-contact-photo img{
  width: 100%;
  height: 320px;
  object-fit: cover;
  display: block;
}

.page-template-page-contacto .am-contact-card,
.page-template-contacto .am-contact-card{
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 16px;
  padding: 18px;
  box-shadow: 0 10px 30px rgba(15,23,42,.08);
}

.page-template-page-contacto .am-contact-card h1,
.page-template-contacto .am-contact-card h1{
  margin: 0 0 8px;
  font-size: 28px;
  letter-spacing: -.02em;
}

.page-template-page-contacto .am-contact-list,
.page-template-contacto .am-contact-list{
  margin: 12px 0 0;
  padding-left: 18px;
  color: #64748b;
  font-weight: 600;
  display: grid;
  gap: 6px;
}

.page-template-page-contacto .am-contact-list a,
.page-template-contacto .am-contact-list a{
  color: #2563eb;
  font-weight: 800;
  text-decoration: none;
}

.page-template-page-contacto .am-contact-list a:hover,
.page-template-contacto .am-contact-list a:hover{
  opacity: .85;
}

@media (max-width: 960px){
  .page-template-page-contacto .am-contact-grid,
  .page-template-contacto .am-contact-grid{
    grid-template-columns: 1fr;
  }
  .page-template-page-contacto .am-contact-photo img,
  .page-template-contacto .am-contact-photo img{
    height: 220px;
  }
}
/* ==================================================
   FIX: Header custom también en CONTACTO y GRACIAS
   (mismo look que en landing)
   ================================================== */

/* 1) Reutiliza los estilos del header para landing + contacto + gracias */
.page-template-page-landing .am-site-header,
.page-template-page-contacto .am-site-header,
.page-template-contacto .am-site-header,
.page-template-page-gracias .am-site-header,
.page-template-gracias .am-site-header{
  position: sticky;
  top: 0;
  z-index: 9999;
  background: rgba(255,255,255,.96);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--am-border);
}

/* 2) Alinea el contenido del header */
.page-template-page-landing .am-header-row,
.page-template-page-contacto .am-header-row,
.page-template-contacto .am-header-row,
.page-template-page-gracias .am-header-row,
.page-template-gracias .am-header-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding: 14px 0;
}

/* 3) Contenedor centrado dentro del header */
.page-template-page-landing .am-site-header .am-container,
.page-template-page-contacto .am-site-header .am-container,
.page-template-contacto .am-site-header .am-container,
.page-template-page-gracias .am-site-header .am-container,
.page-template-gracias .am-site-header .am-container{
  width: min(100% - 32px, 1120px);
  margin: 0 auto;
}

/* 4) LOGO: evita que salga gigante */
.page-template-page-landing .am-logo,
.page-template-page-contacto .am-logo,
.page-template-contacto .am-logo,
.page-template-page-gracias .am-logo,
.page-template-gracias .am-logo{
  height: 60px !important;
  width: auto !important;
  display:block;
}

/* Por si el logo no tiene clase am-logo y es un <img> dentro del brand */
.page-template-page-landing .am-brand img,
.page-template-page-contacto .am-brand img,
.page-template-contacto .am-brand img,
.page-template-page-gracias .am-brand img,
.page-template-gracias .am-brand img{
  max-height: 60px;
  width: auto;
  display:block;
}

/* 5) Menú en fila */
.page-template-page-landing .am-nav,
.page-template-page-contacto .am-nav,
.page-template-contacto .am-nav,
.page-template-page-gracias .am-nav,
.page-template-gracias .am-nav{
  display:flex;
  gap:18px;
  align-items:center;
}

.page-template-page-landing .am-nav a,
.page-template-page-contacto .am-nav a,
.page-template-contacto .am-nav a,
.page-template-page-gracias .am-nav a,
.page-template-gracias .am-nav a{
  font-weight:800;
  font-size:14px;
  color:#0f172a;
  text-decoration:none;
}

.page-template-page-landing .am-nav a:hover,
.page-template-page-contacto .am-nav a:hover,
.page-template-contacto .am-nav a:hover,
.page-template-page-gracias .am-nav a:hover,
.page-template-gracias .am-nav a:hover{
  color: var(--am-accent);
}

/* 6) Acciones derecha */
.page-template-page-landing .am-header-actions,
.page-template-page-contacto .am-header-actions,
.page-template-contacto .am-header-actions,
.page-template-page-gracias .am-header-actions,
.page-template-gracias .am-header-actions{
  display:flex;
  align-items:center;
  gap:14px;
}

.page-template-page-landing .am-phone,
.page-template-page-contacto .am-phone,
.page-template-contacto .am-phone,
.page-template-page-gracias .am-phone,
.page-template-gracias .am-phone{
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  line-height:1.1;
  font-size:13px;
}

.page-template-page-landing .am-phone-link,
.page-template-page-contacto .am-phone-link,
.page-template-contacto .am-phone-link,
.page-template-page-gracias .am-phone-link,
.page-template-gracias .am-phone-link{
  color: var(--am-accent);
  font-weight:900;
  text-decoration:none;
}

/* 7) Botón */
.page-template-page-landing .am-btn,
.page-template-page-contacto .am-btn,
.page-template-contacto .am-btn,
.page-template-page-gracias .am-btn,
.page-template-gracias .am-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:10px 18px;
  border-radius:999px;
  border: 1px solid transparent;
  font-weight:900;
  text-decoration:none;
  cursor:pointer;
}

.page-template-page-landing .am-btn-dark,
.page-template-page-contacto .am-btn-dark,
.page-template-contacto .am-btn-dark,
.page-template-page-gracias .am-btn-dark,
.page-template-gracias .am-btn-dark{
  background: var(--am-dark);
  color:#fff;
}

.page-template-page-landing .am-btn-dark:hover,
.page-template-page-contacto .am-btn-dark:hover,
.page-template-contacto .am-btn-dark:hover,
.page-template-page-gracias .am-btn-dark:hover,
.page-template-gracias .am-btn-dark:hover{
  opacity:.92;
}

/* 8) Responsive: oculta menú y teléfono en móvil */
@media (max-width: 960px){
  .page-template-page-landing .am-nav,
  .page-template-page-contacto .am-nav,
  .page-template-contacto .am-nav,
  .page-template-page-gracias .am-nav,
  .page-template-gracias .am-nav{ display:none; }

  .page-template-page-landing .am-phone,
  .page-template-page-contacto .am-phone,
  .page-template-contacto .am-phone,
  .page-template-page-gracias .am-phone,
  .page-template-gracias .am-phone{ display:none; }
}
/* Estilo sencillo para páginas legales */
.am-legal{
  padding: 44px 0 64px;
}

.am-legal-container{
  width: min(100% - 32px, 900px);
  margin: 0 auto;
}

.am-legal h1{
  margin: 0 0 12px;
  font-size: 34px;
  letter-spacing: -0.02em;
}

.am-legal h2{
  margin: 26px 0 10px;
  font-size: 18px;
}

.am-legal p, .am-legal li{
  color: #334155;
  line-height: 1.8;
}

.am-legal ul{
  padding-left: 18px;
}
.am-footer{
  border-top: 1px solid #e5e7eb;
  background:#fff;
  padding: 18px 0;
}

.am-footer-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
}

.am-footer-links{
  display:flex;
  gap:14px;
  flex-wrap:wrap;
}

.am-footer-links a{
  color:#64748b;
  font-weight:700;
  text-decoration:none;
}

.am-footer-links a:hover{
  color:#2563eb;
}
.am-req{
  color:#ef4444;
  font-weight:900;
  margin-right:6px;
}
.am-req{
  color:#ef4444;
  font-weight:900;
  margin-right:6px;
}
/* =========================
   GRACIAS CENTRADO EN PÁGINA
   ========================= */

.am-thanks-center{
  min-height: calc(100vh - 120px); /* resta header/footer */
  display: flex;
  align-items: center;   /* centra vertical */
  justify-content: center; /* centra horizontal */
  padding: 40px 16px;
}

.am-thanks-inner{
  max-width: 760px;
  width: 100%;
  text-align: center;
}
/* ==================================================
   FIX DEFINITIVO: GRACIAS CENTRADO
   ================================================== */

/* Rompe cualquier grid/flex heredado */
.page-template-page-gracias .am-landing{
  display: block !important;
}

/* Sección de gracias a pantalla completa */
.page-template-page-gracias .am-thanks{
  min-height: calc(100vh - 120px); /* header + footer */
  display: flex !important;
  align-items: center !important;    /* centro vertical */
  justify-content: center !important;/* centro horizontal */
  padding: 40px 16px;
}

/* Anula el am-container SOLO aquí */
.page-template-page-gracias .am-container{
  max-width: none !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Caja central real */
.page-template-page-gracias .am-thanks-inner{
  max-width: 760px;
  width: 100%;
  margin: 0 auto;
  text-align: center;
}
/* ==================================================
   GRACIAS: contenido centrado, header/footer como siempre
   ================================================== */

/* 1) Centrado del contenido */
.page-template-page-gracias .am-thanks{
  min-height: calc(100vh - 120px);
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 40px 16px;
}

/* 2) Caja central */
.page-template-page-gracias .am-thanks-inner{
  max-width: 760px;
  width: 100%;
  margin: 0 auto;
  text-align: center;
}

/* 3) IMPORTANTE:
   Si tus resets hacen que el HEADER/FOOTER se estiren,
   aquí forzamos el contenedor del header/footer a ancho “normal”
   (igual que en el resto de la web).
*/
.page-template-page-gracias .am-site-header .am-container,
.page-template-page-gracias .am-footer .am-container{
  width: min(100% - 32px, 1120px) !important;
  margin: 0 auto !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* 4) Evita que el footer se pegue raro */
.page-template-page-gracias .am-footer-row{
  width: 100%;
}
/* ===== Footer partners ===== */
.am-footer-partners{
  margin-top: 14px;
  width: 100%;
  display: grid;
  grid-template-columns: 160px 1fr 120px;
  gap: 12px;
  align-items: center;
}

.am-partners-title{
  font-size: 14px;
  opacity: .8;
}

.am-partners-strip{
  overflow: hidden;
  border-radius: 10px;
  padding: 8px 10px;
  background: rgba(255,255,255,.04);
}

.am-partners-track{
  display: inline-flex;
  align-items: center;
  gap: 24px;
  animation: amPartnersScroll 12s linear infinite;
  will-change: transform;
}

.am-partners-track img{
  height: 32px;
  width: auto;
  opacity: .95;
}

.am-google-badge{
  display:flex;
  justify-content:flex-end;
}
.am-google-badge img{
  height: 28px;
  width:auto;
  opacity:.95;
}

@keyframes amPartnersScroll{
  from{ transform: translateX(0); }
  to{ transform: translateX(-50%); }
}

/* ===== Reviews slider ===== */
.am-reviews{
  margin-top: 16px;
  width: 100%;
}

.am-reviews-head{
  display:flex;
  justify-content:space-between;
  gap: 10px;
  align-items: baseline;
  margin-bottom: 10px;
}

.am-reviews-title{
  font-size: 14px;
  font-weight: 600;
}

.am-reviews-note{
  font-size: 12px;
  opacity: .7;
}

.am-reviews-viewport{
  overflow: hidden;
}

.am-reviews-track{
  display: flex;
  gap: 12px;
  transition: transform 600ms ease;
  will-change: transform;
}

.am-review-card{
  flex: 0 0 calc((100% - 36px) / 4); /* 4 cards desktop */
  padding: 12px 12px;
  border-radius: 12px;
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.08);
}

.am-review-top{
  display:flex;
  justify-content:space-between;
  gap: 10px;
  margin-bottom: 6px;
}

.am-review-name{
  font-size: 13px;
  font-weight: 600;
}

.am-stars{
  font-size: 13px;
  letter-spacing: 1px;
  opacity:.9;
}

.am-review-text{
  font-size: 13px;
  opacity: .85;
  line-height: 1.35;
}

/* Responsive: 2 cards en móvil */
@media (max-width: 768px){
  .am-footer-partners{
    grid-template-columns: 1fr;
  }
  .am-google-badge{
    justify-content:flex-start;
  }
  .am-review-card{
    flex: 0 0 calc((100% - 12px) / 2);
  }
}
/* =========
   BASE
========= */
.am-landing{
  /* evita desbordes raros en móvil */
  overflow-x: clip;
}

.am-container{
  max-width: 1120px;
  margin: 0 auto;
  padding-left: 16px;
  padding-right: 16px;
}

/* Imágenes siempre responsivas */
.am-landing img{
  max-width: 100%;
  height: auto;
  display: block;
}

/* =========
   HERO: tamaños y espaciados
========= */
.am-hero{
  padding: clamp(18px, 4vw, 44px) 0;
}

.am-hero-grid{
  display: grid;
  grid-template-columns: 1.05fr .95fr; /* escritorio */
  gap: clamp(14px, 3vw, 30px);
  align-items: start;
}

/* TIPOGRAFÍA RESPONSIVE (clave) */
.am-hero-copy h1{
  font-size: clamp(26px, 4.6vw, 44px);
  line-height: 1.08;
  margin: 0 0 10px;
}

.am-hero-sub{
  font-size: clamp(15px, 2.2vw, 18px);
  line-height: 1.45;
  margin: 0 0 14px;
}

.am-bullets{
  margin: 0;
  padding-left: 18px;
}
.am-bullets li{
  margin: 8px 0;
  line-height: 1.35;
}

/* CTA que no reviente: wrap + botones fluidos */
.am-cta{
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 14px;
}

.am-btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  border-radius: 12px;
  padding: 12px 14px;
  line-height: 1;
  max-width: 100%;
  white-space: nowrap;
}

/* En móvil: botones a 2 columnas o a 1 según ancho */
@media (max-width: 480px){
  .am-cta .am-btn{
    flex: 1 1 100%;
    width: 100%;
  }
}

/* =========
   CARD / FORM: que no se vea gigante
========= */
.am-card{
  border-radius: 16px;
  padding: clamp(14px, 2.2vw, 20px);
}

/* Inputs: tamaño cómodo en móvil */
.am-form input,
.am-form textarea{
  width: 100%;
  box-sizing: border-box;
  padding: 12px 12px;
  font-size: 16px; /* evita zoom iOS */
  border-radius: 12px;
}

/* Botón block real */
.am-btn-block{
  width: 100%;
}

/* ReCAPTCHA: escalar en pantallas pequeñas */
@media (max-width: 360px){
  .am-recaptcha{
    transform: scale(.90);
    transform-origin: 0 0;
  }
}

/* =========
   SECCIONES: menos aire en móvil
========= */
.am-services,
.am-process,
.am-why{
  padding: clamp(18px, 4vw, 50px) 0;
}

.am-section-head h2{
  font-size: clamp(20px, 3.6vw, 30px);
  line-height: 1.15;
  margin: 0 0 8px;
}

/* =========
   GRIDS: pasar a 1 columna en móvil
========= */
@media (max-width: 900px){
  .am-hero-grid{
    grid-template-columns: 1fr;
  }
}

/* Servicios: 3->2->1 columnas */
.am-services-grid{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}
@media (max-width: 900px){
  .am-services-grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 560px){
  .am-services-grid{ grid-template-columns: 1fr; }
}

/* Steps: 4->2->1 */
.am-steps{
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}
@media (max-width: 900px){
  .am-steps{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 560px){
  .am-steps{ grid-template-columns: 1fr; }
}

/* WHY: 2 columnas -> 1 */
.am-why-grid{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
  align-items: start;
}
@media (max-width: 900px){
  .am-why-grid{ grid-template-columns: 1fr; }
}

/* Fotos: que no sean enormes */
.am-why-photos{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
.am-photo-big{
  grid-column: 1 / -1;
}
.am-photo img{
  width: 100%;
  height: auto;
  border-radius: 16px;
}

/* =========
   SI ASTRA TE ESTÁ METIENDO UN "H1" GIGANTE:
   forzamos solo dentro de .am-landing
========= */
.am-landing h1,
.am-landing h2,
.am-landing h3{
  letter-spacing: -0.01em;
}
/* Solo para la plantilla Landing Renta 2026 (ajusta si tu body class difiere) */
body[class*="page-template"] .site-header,
body[class*="page-template"] header.header{
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/* Astra suele usar estas clases para el logo */
body[class*="page-template"] .custom-logo-link img,
body[class*="page-template"] .site-branding img,
body[class*="page-template"] .logo img,
body[class*="page-template"] .logo__img{
  height: 56px !important;
  max-height: 56px !important;
  width: auto !important;
}

/* Reduce el “aire” del header */
body[class*="page-template"] .site-header .ast-container,
body[class*="page-template"] .header__inner{
  padding-top: 10px !important;
  padding-bottom: 10px !important;
}

/* En móvil, aún más compacto */
@media (max-width: 768px){
  body[class*="page-template"] .custom-logo-link img,
  body[class*="page-template"] .site-branding img,
  body[class*="page-template"] .logo img,
  body[class*="page-template"] .logo__img{
    height: 44px !important;
    max-height: 44px !important;
  }
}
/* =========================
   LANDING: RESET + BASE
   ========================= */
.am-landing{
  box-sizing: border-box;
  font-family: inherit;
  font-size: 16px;           /* base estable */
  line-height: 1.5;
  color: #111;
}
.am-landing * ,
.am-landing *::before,
.am-landing *::after{
  box-sizing: inherit;
}

.am-landing h1, .am-landing h2, .am-landing h3{
  line-height: 1.15;
  margin: 0 0 12px 0;
}
.am-landing p{ margin: 0 0 12px 0; }
.am-landing ul{ margin: 0; padding-left: 18px; }
.am-landing img{ max-width: 100%; height: auto; display: block; }

/* Contenedor y espaciados */
.am-container{
  width: min(1120px, calc(100% - 32px));
  margin: 0 auto;
}
.am-hero, .am-services, .am-process, .am-why{
  padding: 56px 0;
}

/* =========================
   HERO GRID (2 columnas)
   ========================= */
.am-hero-grid{
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: 28px;
  align-items: start;
}
@media (max-width: 900px){
  .am-hero-grid{ grid-template-columns: 1fr; }
}

/* Tipografías seguras (evita "gigante") */
.am-hero-copy h1{
  font-size: clamp(28px, 3.2vw, 44px);
}
.am-hero-sub{
  font-size: 1.05rem;
  color: #333;
}
.am-muted{ color: #666; font-size: 0.95rem; }

/* Botones */
.am-cta, .am-center-cta, .am-why-cta{
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 14px;
}
.am-btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 12px 16px;
  border-radius: 12px;
  text-decoration: none;
  border: 1px solid #ddd;
  font-weight: 600;
  font-size: 0.95rem;
}
.am-btn-primary{
  background: #111;
  color: #fff;
  border-color: #111;
}
.am-btn-ghost{
  background: transparent;
  color: #111;
}
.am-btn-block{ width: 100%; }

/* Card del formulario */
.am-card{
  border: 1px solid #e6e6e6;
  border-radius: 16px;
  padding: 18px;
  background: #fff;
}

/* =========================
   FORM
   ========================= */
.am-form{
  display: grid;
  gap: 12px;
  margin-top: 10px;
}
.am-form label{
  display: grid;
  gap: 6px;
  font-size: 0.95rem;
}
.am-form input,
.am-form textarea{
  width: 100%;
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid #ddd;
  font-size: 1rem;
}
.am-check{
  display: grid;
  grid-template-columns: 18px 1fr;
  align-items: start;
  gap: 10px;
}
.am-check input{ margin-top: 3px; }

.am-req{ color: #b00020; font-weight: 700; }

.am-hp{ display:none !important; } /* honeypot oculto */
.am-recaptcha{ margin-top: 6px; }

/* Alertas */
.am-alert{
  padding: 10px 12px;
  border-radius: 12px;
  font-size: 0.95rem;
}
.am-alert-ok{ background: #eef9f0; border: 1px solid #bfe6c8; }
.am-alert-err{ background: #fff1f1; border: 1px solid #f2b9b9; }

/* =========================
   SERVICES GRID
   ========================= */
.am-section-head{ margin-bottom: 18px; }
.am-services-grid{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}
@media (max-width: 980px){
  .am-services-grid{ grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 640px){
  .am-services-grid{ grid-template-columns: 1fr; }
}
.am-service{
  border: 1px solid #e6e6e6;
  border-radius: 16px;
  padding: 16px;
  background: #fff;
}
.am-link{ text-decoration: none; font-weight: 600; }

/* =========================
   PROCESS STEPS
   ========================= */
.am-steps{
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
}
@media (max-width: 980px){
  .am-steps{ grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 640px){
  .am-steps{ grid-template-columns: 1fr; }
}
.am-step{
  border: 1px solid #e6e6e6;
  border-radius: 16px;
  padding: 16px;
  background: #fff;
}
.am-step-num{
  width: 36px;
  height: 36px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 800;
  border: 1px solid #ddd;
  margin-bottom: 10px;
}

/* =========================
   WHY GRID (fotos + texto)
   ========================= */
.am-why-grid{
  display: grid;
  grid-template-columns: 0.95fr 1.05fr;
  gap: 24px;
  align-items: start;
}
@media (max-width: 980px){
  .am-why-grid{ grid-template-columns: 1fr; }
}
.am-why-photos{
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
}
.am-photo{
  overflow: hidden;
  border-radius: 16px;
  border: 1px solid #e6e6e6;
  background: #fafafa;
}
.am-photo-big{
  grid-column: 1 / -1;
}
.am-why-points{
  margin-top: 14px;
}

/* separador */
.am-divider{
  height: 1px;
  background: #eaeaea;
  margin: 16px 0;
}
/* =========================
   HEADER LANDING
   ========================= */

/* Variables de marca (cámbialas a tus colores) */
:root{
  --am-brand: #0f6b5f;        /* color principal */
  --am-brand-2: #12a389;      /* secundario (hover/acento) */
  --am-ink: #111;
  --am-bg: #fff;
  --am-border: #e6e6e6;
}

/* Header */
.am-site-header{
  position: sticky;          /* se queda arriba */
  top: 0;
  z-index: 999;
  background: var(--am-bg);
  border-bottom: 1px solid var(--am-border);
}

/* Fila */
.am-header-row{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 14px 0;
}

/* Logo */
.am-brand{
  display: inline-flex;
  align-items: center;
  gap: 10px;
  text-decoration: none;
}
.am-logo{
  width: 180px;
  max-width: 42vw;
  height: auto;
}

/* Nav desktop */
.am-nav{
  display: flex;
  gap: 16px;
  align-items: center;
}
.am-nav a{
  text-decoration: none;
  font-weight: 600;
  color: var(--am-ink);
  font-size: 0.95rem;
  padding: 8px 10px;
  border-radius: 10px;
}
.am-nav a:hover{
  background: rgba(15,107,95,0.08);
  color: var(--am-brand);
}

/* Acciones */
.am-header-actions{
  display: flex;
  align-items: center;
  gap: 14px;
}
.am-phone{
  display: grid;
  line-height: 1.1;
}
.am-phone-link{
  font-weight: 800;
  text-decoration: none;
  color: var(--am-ink);
}

/* Botón menú móvil */
.am-nav-toggle{
  display: none;
  width: 44px;
  height: 44px;
  border-radius: 12px;
  border: 1px solid var(--am-border);
  background: #fff;
  align-items: center;
  justify-content: center;
  gap: 5px;
}
.am-nav-toggle span{
  display: block;
  width: 18px;
  height: 2px;
  background: var(--am-ink);
  border-radius: 999px;
}

/* Responsive */
@media (max-width: 980px){
  .am-phone{ display:none; }

  .am-nav-toggle{
    display: inline-flex;
  }

  /* Convertimos el nav en desplegable */
  .am-nav{
    position: absolute;
    left: 0;
    right: 0;
    top: 100%;
    display: none;
    flex-direction: column;
    gap: 6px;
    background: #fff;
    border-bottom: 1px solid var(--am-border);
    padding: 10px 16px 14px 16px;
  }
  .am-nav.is-open{ display: flex; }

  /* Para que el absolute funcione respecto al header */
  .am-site-header{ position: sticky; }
  .am-site-header .am-container{ position: relative; }
}
/* =========================
   BOTONES CON COLOR CORPORATIVO
   ========================= */
.am-btn{
  border: 1px solid var(--am-border);
  background: #fff;
  color: var(--am-ink);
}

.am-btn-primary{
  background: var(--am-brand);
  border-color: var(--am-brand);
  color: #fff;
}
.am-btn-primary:hover{
  background: var(--am-brand-2);
  border-color: var(--am-brand-2);
}

.am-btn-ghost{
  background: transparent;
  border-color: rgba(15,107,95,0.35);
  color: var(--am-brand);
}
.am-btn-ghost:hover{
  background: rgba(15,107,95,0.08);
  border-color: rgba(15,107,95,0.55);
}

/* Links/acento */
.am-link{ color: var(--am-brand); }
.am-link:hover{ color: var(--am-brand-2); }
/* =========================
   PALETA CORPORATIVA NARANJA
   ========================= */
:root{
  --am-brand: #f26a1b;     /* naranja principal */
  --am-brand-2: #d9570f;   /* hover */
  --am-ink: #111;
  --am-bg: #fff;
  --am-border: #e6e6e6;
}

/* =========================
   HEADER
   ========================= */
.am-site-header{
  background: var(--am-bg);
  border-bottom: 1px solid var(--am-border);
}

.am-nav a{
  color: var(--am-ink);
}
.am-nav a:hover{
  background: rgba(242,106,27,0.12);
  color: var(--am-brand);
}

/* =========================
   BOTONES
   ========================= */
.am-btn{
  border: 1px solid var(--am-border);
  background: #fff;
  color: var(--am-ink);
}

/* Botón principal */
.am-btn-primary,
.am-btn-dark{
  background: var(--am-brand);
  border-color: var(--am-brand);
  color: #fff;
}
.am-btn-primary:hover,
.am-btn-dark:hover{
  background: var(--am-brand-2);
  border-color: var(--am-brand-2);
}

/* Botón ghost */
.am-btn-ghost{
  background: transparent;
  border-color: rgba(242,106,27,0.45);
  color: var(--am-brand);
}
.am-btn-ghost:hover{
  background: rgba(242,106,27,0.12);
  border-color: rgba(242,106,27,0.7);
}

/* =========================
   LINKS Y ACENTOS
   ========================= */
.am-link{
  color: var(--am-brand);
}
.am-link:hover{
  color: var(--am-brand-2);
}

/* Numeración pasos */
.am-step-num{
  border-color: rgba(242,106,27,0.45);
  color: var(--am-brand);
}

/* Checks y detalles */
.am-req{
  color: var(--am-brand);
}

/* ==================================================
   FIX DEFINITIVO: .am-btn-dark SIEMPRE NEGRO
   Motivo: en este archivo hay una regla global que hace
   .am-btn-primary, .am-btn-dark { background: var(--am-brand) }
   y por eso en Renta 2026 el botón del header sale naranja.
   ================================================== */

/* 1) Botón oscuro global (para que sea igual en toda la web) */
.am-btn-dark{
  background: var(--am-dark) !important;
  border-color: var(--am-dark) !important;
  color: #fff !important;
}
.am-btn-dark:hover{
  background: #0b0f1a !important;
  border-color: #0b0f1a !important;
  color: #fff !important;
}

/* 2) Extra: si algún selector del header gana por especificidad */
header.am-site-header .am-btn.am-btn-dark,
.am-site-header .am-header-actions .am-btn.am-btn-dark{
  background: var(--am-dark) !important;
  border-color: var(--am-dark) !important;
  color: #fff !important;
}

/* =========================
   FIX GLOBAL: LOGO GRANDE (COMO EN RENTA) EN TODAS LAS PÁGINAS
   Motivo: tenías reglas por plantilla (landing/contacto/gracias) que
   forzaban height: 60px !important y lo hacían más pequeño.
   Este bloque lo iguala en TODA la web.
   ========================= */

/* Tamaño deseado del logo (ajusta si quieres aún más grande) */
:root{
  --am-logo-height-desktop: 72px;
  --am-logo-height-mobile: 56px;
}

/* Gana a cualquier regla anterior */
header.am-site-header .am-brand img,
header.am-site-header img.am-logo,
.am-site-header .am-brand img,
.am-site-header img.am-logo{
  height: var(--am-logo-height-desktop) !important;
  max-height: var(--am-logo-height-desktop) !important;
  width: auto !important;
}

@media (max-width: 480px){
  header.am-site-header .am-brand img,
  header.am-site-header img.am-logo,
  .am-site-header .am-brand img,
  .am-site-header img.am-logo{
    height: var(--am-logo-height-mobile) !important;
    max-height: var(--am-logo-height-mobile) !important;
  }
}
/* Quitar hamburguesa (y el menú desplegable) SOLO en la plantilla Renta 2026 */
@media (max-width: 980px){
  body.page-template-landing-renta-2026 .am-nav-toggle{
    display: none !important;
  }
  body.page-template-landing-renta-2026 #am-site-nav{
    display: none !important;
  }
}