/* MH Global Madrid — primera versión visual. Sin animaciones. */
:root {
  color-scheme: light;
  --marfil: #f8f6f2;
  --blanco: #fffdf9;
  --champan: #ede5d8;
  --champan-oscuro: #d9ccbb;
  --tinta: #282721;
  --secundario: #6f6c64;
  --naranja: #a65d3e;
  --borde: #e0d9d0;
  --max: 1340px;
}
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: auto; }
body { margin: 0; background: var(--marfil); color: var(--tinta); font-family: 'Manrope', Arial, sans-serif; -webkit-font-smoothing: antialiased; }
a { color: inherit; text-decoration: none; }
a:focus-visible, button:focus-visible { outline: 2px solid var(--naranja); outline-offset: 4px; }
button { font: inherit; }
img { max-width: 100%; display:block; }
.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; }
.site-shell { width: min(calc(100% - 108px), var(--max)); margin: auto; }
.eyebrow { font-size: 10px; font-weight: 650; letter-spacing: .24em; text-transform: uppercase; color: var(--naranja); margin: 0; }
.site-header { background: var(--blanco); border-bottom: 1px solid var(--borde); position:relative; z-index: 10; }
.header-inner { min-height: 94px; display:flex; align-items:center; justify-content: space-between; gap: 28px; }
.logo { display:flex; align-items:center; gap: 15px; flex-shrink:0; }
.logo-initials { font-size: 38px; font-family: Georgia, 'Times New Roman',serif; font-weight: 400; line-height:1; color:var(--naranja); letter-spacing: -.09em; }
.logo-separator { height: 35px; width:1px; background:#b5a99b; }
.logo-name { display:block; font-size: 14px; letter-spacing: .19em; font-weight: 600; white-space:nowrap; }
.primary-nav { display:flex; gap: clamp(15px, 2.05vw, 34px); align-items:center; }
.primary-nav a, .lang-links { font-size: 10px; text-transform: uppercase; font-weight: 650; letter-spacing: .115em; white-space: nowrap; }
.primary-nav a:hover, .primary-nav a[aria-current='page'], .lang-links .active { color:var(--naranja); }
.header-actions { display:flex; align-items:center; gap: 14px; padding-left: 17px; border-left: 1px solid var(--borde); }
.lang-links { display:flex; gap:8px; align-items:center; }
.lang-links .slash { color:#c6beb5; font-weight:400; }
.ig-link { display:flex; align-items:center; }
.ig-link svg { width:17px;height:17px;stroke: currentColor;fill:none;stroke-width:1.45; }
.mobile-toggle { display:none; background:transparent; border:0; padding:12px; margin-right:-12px; cursor:pointer; }
.mobile-toggle span {display:block;width:22px;height:1px;background:var(--tinta);margin:5px 0;}
.hero-heading { padding: 72px 0 54px; text-align:center; }
.hero-heading h1 { font-size: clamp(40px,5.1vw,73px); font-weight: 350; letter-spacing: -.064em; line-height: 1.12; margin:17px auto 16px; max-width:1000px; }
.hero-heading .subtitle { color: var(--secundario); font-size: 14px; line-height:1.8; margin:0; font-weight:400; }
.hero-cta { display: inline-flex; align-items:center; justify-content:center; padding: 14px 21px; border:1px solid var(--naranja); color:var(--naranja); font-size:10px; text-transform: uppercase; font-weight:700; letter-spacing:.15em; margin-top:31px; background:transparent; }
.hero-cta:hover, .hero-cta:focus-visible { background:#f0e6dc; }
.hero-figure { margin:0; }
.hero-image { width:100%; aspect-ratio: 2.8/1; object-fit:cover; object-position:center; background:#d6c5ac; }
.hero-figure figcaption { padding: 12px 0 0; text-align:right; color:#897f76; font-size:10px; line-height:1.5; }
.summary-line { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--borde); border-bottom:1px solid var(--borde); margin-top:57px; }
.summary-item { padding:28px 20px; text-align:center; font-size:10px; font-weight:600; letter-spacing:.12em; text-transform: uppercase; }
.summary-item + .summary-item { border-left:1px solid var(--borde); }
section.content-section { padding:120px 0; }
.section-number { font-size:10px; font-weight:650; letter-spacing:.20em; color:var(--naranja); text-transform: uppercase; margin-bottom:19px; }
.section-title { font-size: clamp(36px, 4.3vw, 59px); font-weight:350; line-height:1.14; letter-spacing:-.055em; margin:0; }
.section-description { color:var(--secundario); font-size:14px; line-height:1.95; max-width:500px; }
.section-top { display:flex;justify-content:space-between;align-items:end;gap:40px;margin-bottom:65px; }
.section-top .section-description { margin:0; }
.district-list { border-top:1px solid var(--borde); }
.district-link { border-bottom:1px solid var(--borde); padding:31px 5px; display:grid; grid-template-columns: 56px 1fr 1fr auto; align-items:center; gap:20px; }
.district-number { color:var(--naranja); font-size:11px; }
.district-name { font-size:clamp(28px,3.0vw,41px); font-weight:400; letter-spacing:-.055em; }
.district-detail { font-size:12px; color:var(--secundario); }
.district-arrow { font-size:20px; font-weight:300; }
.district-link:hover .district-name { color:var(--naranja); }
.projects-band { background:var(--champan); }
.projects-grid { display:grid; grid-template-columns: 1.1fr 1fr; align-items:center; gap:clamp(45px,8vw,135px); }
.projects-image { margin:0; }
.projects-image img { width:100%; aspect-ratio:4/3; object-fit:cover; }
.projects-copy { padding: 45px 0; }
.projects-copy .section-description { margin:26px 0 30px; }
.text-link { display:inline-flex; border-bottom:1px solid var(--naranja);padding-bottom:9px; color:var(--naranja); font-weight:700; font-size:10px; text-transform:uppercase; letter-spacing:.17em; }
.about-grid { display:grid; grid-template-columns:1fr 1fr;gap:95px; align-items:start; }
.about-copy { font-size:16px; line-height:2; color:var(--secundario); margin:0; }
.social-band { border-top:1px solid var(--borde); border-bottom:1px solid var(--borde); }
.social-grid { display:grid; grid-template-columns: 1fr 1fr; }
.social-panel { padding:56px 7%; min-height:260px; }
.social-panel:first-child { border-right:1px solid var(--borde); padding-left:0; }
.social-panel h3 { font-size:27px; font-weight:400; letter-spacing:-.04em; margin:15px 0; }
.social-panel p:not(.eyebrow) { font-size:13px;line-height:1.8;color:var(--secundario);max-width:400px;margin:0 0 24px; }
.site-footer { background:var(--blanco);padding:67px 0 35px; }
.footer-main { display:grid; grid-template-columns:1.4fr 1fr;gap:50px;align-items:end;padding-bottom:60px; }
.footer-main .section-title { font-size:43px;max-width:570px;margin-top:12px; }
.footer-contact { display:flex; flex-direction:column; gap:12px; font-size:14px; align-items:flex-end; }
.footer-contact a { border-bottom:1px solid var(--naranja); padding-bottom:5px; }
.footer-bottom { border-top:1px solid var(--borde); display:flex; justify-content:space-between; gap:15px; padding-top:23px; color:var(--secundario);font-size:11px; }
@media (max-width: 1070px) {
 .site-shell { width:min(calc(100% - 64px),var(--max)); }
 .header-inner { min-height:76px; }
 .logo-name { font-size:12px; }
 .primary-nav { gap:13px; }
 .primary-nav a, .lang-links { font-size:9px; }
 .header-actions { padding-left:10px; gap:8px; }
 .site-header .ig-link { display:none; }
 .hero-heading {padding:62px 0 42px;}
}
@media (max-width: 760px) {
 .site-shell { width:calc(100% - 36px); }
 .header-inner { min-height:76px; }
 .logo-initials { font-size:33px; }
 .logo-separator { height:30px; }
 .logo-name { font-size:11px;letter-spacing:.15em; }
 .mobile-toggle { display:block; }
 .primary-nav { display:none; position:absolute; top:100%;left:0;right:0; flex-direction:column;align-items:stretch; gap:0; background:var(--blanco);border-bottom:1px solid var(--borde);padding: 12px 18px 20px; box-shadow:0 12px 15px rgb(30 20 10 / .06); }
 .primary-nav.is-open { display:flex; }
 .primary-nav a { font-size:13px; padding:16px 5px;border-bottom:1px solid var(--borde); }
 .header-actions { margin-left:auto; border-left:0;padding-left:0; }
 .header-actions .lang-links { font-size:10px; }
 .hero-heading { padding:54px 7px 34px; }
 .hero-heading h1 { font-size:clamp(35px,9vw,50px); margin:16px auto 15px; letter-spacing:-.057em; }
 .hero-heading .subtitle {font-size:13px;line-height:1.75;}
 .hero-cta { padding:13px 15px;margin-top:25px;font-size:9px; }
 .hero-image {aspect-ratio: 0.95/1; object-position:center;}
 .hero-figure figcaption { font-size:9px; padding:10px 0 0; }
 .summary-line { margin-top:37px; }
 .summary-item { font-size:9px; padding:22px 5px; letter-spacing:.02em; }
 section.content-section { padding:78px 0; }
 .section-top { display:block; margin-bottom:33px; }
 .section-description {font-size:13px;line-height:1.85; }
 .section-top .section-description { margin-top:22px; }
 .district-link { grid-template-columns:27px 1fr auto; gap:14px;padding:24px 3px; }
 .district-name {font-size:28px;}
 .district-detail { display:none; }
 .projects-grid {grid-template-columns:1fr;gap:25px;}
 .projects-image { margin:0; }
 .projects-image img {aspect-ratio: 4/3;}
 .projects-copy {padding:7px 0 0;}
 .projects-copy .section-description { margin:22px 0 25px; }
 .about-grid {grid-template-columns:1fr;gap:25px;}
 .about-copy { font-size:14px; line-height:1.9; }
 .social-grid {grid-template-columns:1fr;}
 .social-panel { padding:40px 0;min-height:0; }
 .social-panel:first-child {border-right:0;border-bottom:1px solid var(--borde);padding-left:0;}
 .footer-main {grid-template-columns:1fr;gap:37px;padding-bottom:45px;}
 .footer-main .section-title {font-size:37px;}
 .footer-contact {align-items:start;}
 .footer-bottom {font-size:10px;flex-direction:column;}
}
@media (max-width: 355px) {
 .logo { gap:10px; }
 .logo-name {font-size:10px;}
 .header-actions .lang-links {font-size:9px;}
 .hero-heading h1 {font-size:34px;}
}
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { animation:none!important; transition:none!important; scroll-behavior:auto!important; } }


/* AJUSTES DEL DISEÑO 3. Minimalismo de lujo — sobre la base compartida */
@media (min-width: 1021px) {
  .header-inner { min-height: 106px; gap: 24px; }
  .logo-initials { font-size: 49px; }
  .logo-separator { height: 44px; }
  .logo-name { font-size: 18px; letter-spacing: .155em; }
  .primary-nav a, .lang-links { font-size: 14px; letter-spacing: .075em; font-weight: 550; }
  .primary-nav { gap: clamp(13px, 1.7vw, 29px); }
  .hero-heading { padding-top: 47px; padding-bottom: 16px; }
  .hero-heading h1 { font-size: 32px; font-weight: 450; letter-spacing: -.043em; max-width: 1100px; margin: 15px auto 12px; }
  .hero-heading .subtitle { font-size: 14.5px; }
  .section-title { font-size: 27px; font-weight: 450; letter-spacing: -.04em; }
}
/* Refuerzo coherente de cabeceras secundarias en los tres diseños */
.eyebrow { font-size: 12px; letter-spacing: .19em; }
.section-number { font-size: 12px; }
.summary-item { font-size: 11px; }
.district-name { font-size: clamp(26px, 2.5vw, 35px); }
.footer-main .section-title { font-size: clamp(28px, 2.8vw, 36px); }
@media (min-width: 761px) and (max-width: 1020px) {
  .logo-initials { font-size: 40px; }
  .logo-name { font-size: 14px; letter-spacing: .10em; }
  .header-inner { gap: 14px; }
  .primary-nav { gap: 11px; }
  .primary-nav a, .lang-links { font-size: 11px; }
  .header-actions { gap: 7px; }
  .hero-heading h1 { font-size: 32px; letter-spacing: -.043em; }
  .section-title { font-size: 27px; }
}
@media (max-width: 760px) {
 .logo-initials { font-size: 40px; }
 .logo-separator { height: 31px; }
 .logo-name { font-size: 12px; }
 .hero-heading { padding: 37px 7px 21px; }
 .hero-heading h1 { font-size: clamp(26px, 8vw, 33px); font-weight: 450; letter-spacing: -.045em; line-height: 1.28; }
 .hero-heading .subtitle { font-size: 13px; }
 .eyebrow { font-size: 10px; }
 .section-title { font-size: 26px; }
 .summary-item { font-size: 9px; }
}
@media (max-width: 390px) {
 .logo-initials {font-size:35px;}
 .logo-name {font-size:10.5px;}
 .hero-heading h1 {font-size:26px;}
}

/* ÚNICO CAMBIO FRENTE A LA OPCIÓN 3 APROBADA: NUMERACIÓN DE SECCIONES */
.section-number { display:flex; align-items:baseline; gap:9px; font-size:15px; line-height:1.35; font-weight:600; letter-spacing:.12em; margin-bottom:21px; }
.section-number .section-index { font-size:24px; font-weight:600; letter-spacing:.02em; }
.section-number .section-label { font-size:15px; letter-spacing:.12em; }
@media (max-width:760px) {
 .section-number { gap:8px; margin-bottom:18px; }
 .section-number .section-index {font-size:21px;}
 .section-number .section-label {font-size:14px;}
}
