/* ==========================================================================
   BASE — variables, reset, tipografía global y componentes compartidos
   ========================================================================== */

:root {
  /* Paleta corporativa */
  --navy:#10243b;
  --navy2:#0b1b2d;
  --gold:#b58a43;
  --cream:#f5f0e8;
  --warm:#eee7dc;
  --ink:#17202b;
  --muted:#66707a;
  --white:#fffdf9;
  --line:#ddd4c8;
  --pure-white:#fff;

  /* Tipografías */
  --font-sans:"DM Sans",Arial,sans-serif;
  --font-serif:"Playfair Display",Georgia,serif;

  /* Espaciado vertical de secciones */
  --section-space:90px;
  --section-space-mobile:65px;

  /* Otros valores repetidos */
  --radius-pill:999px;
  --tracking-wide:.2em;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;color:var(--ink);background:var(--white);font-family:var(--font-sans);line-height:1.55}
a{color:inherit;text-decoration:none}

/* Layout */
.container{width:min(1160px,calc(100% - 40px));margin:auto}
.two-columns{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center}

/* Botón principal (header, hero, ubicación, contacto) */
.cta{display:inline-flex;align-items:center;justify-content:center;padding:14px 22px;border-radius:var(--radius-pill);background:var(--gold);color:var(--pure-white);font-weight:600;transition:.2s}
.cta:hover{transform:translateY(-1px);filter:brightness(1.05)}

/* Titulares */
h1{font-family:var(--font-serif);font-size:clamp(44px,6vw,76px);line-height:1.03;font-weight:500;margin:0 0 22px}
.kicker{color:var(--gold);font-size:13px;letter-spacing:var(--tracking-wide);text-transform:uppercase;font-weight:700}
h2{font-family:var(--font-serif);font-size:clamp(34px,4vw,52px);line-height:1.1;font-weight:500;margin:12px 0 20px;color:var(--navy)}
.lead{font-size:19px;color:#38434e}

/* Fotografías */
.photo{border-radius:20px;overflow:hidden;box-shadow:0 20px 55px rgba(16,36,59,.12)}
.photo img{display:block;width:100%;height:100%;object-fit:cover}
.photo-portrait{aspect-ratio:4/5}
.photo-landscape{aspect-ratio:16/10}

/* Encabezado centrado de sección (servicios, FAQ) */
.section-heading{text-align:center;max-width:700px;margin:0 auto 48px}

@media(max-width:800px){
 .two-columns{grid-template-columns:1fr;gap:35px}
}