/* Alcalá 58 — EFC Creative Studio. Editorial build: Georgia serif headlines,
   Arial body, paper/ink/muted/line palette. Replicated from the reference
   ChatGPT-built version at the user's request. */

:root{--paper:#f4f1e9;--ink:#292923;--muted:#68665e;--line:#cfcdc3}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:100px}
body{margin:0;background:var(--paper);color:var(--ink);font-family:Arial,Helvetica,sans-serif;font-size:16px;line-height:1.65}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;cursor:pointer}
a:hover{text-decoration:underline;text-underline-offset:6px}
button:focus-visible,a:focus-visible{outline:2px solid #886444;outline-offset:6px}
button{border:0;background:none}

header{height:98px;margin:0 4.5%;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);gap:30px}
.wordmark{font-family:Georgia,serif;font-size:23px;letter-spacing:2px;white-space:nowrap}
.wordmark span{font-style:italic}
header nav{display:flex;gap:25px;font-size:14px}
.header-right{display:flex;align-items:center;gap:25px;font-size:14px}
.contact-link{border-bottom:1px solid;padding:8px 0}
.language{font-size:13px}
.menu-toggle{display:none}
.skip{position:absolute;top:-100px}
.skip:focus{top:10px;z-index:20;background:white;padding:15px}

.hero{padding:50px 4.5% 0}
.hero-heading{position:relative}
.eyebrow{font-size:12px;letter-spacing:2px;text-transform:uppercase;margin:0 0 28px}
.hero h1{font-family:Georgia,serif;font-weight:400;line-height:1;letter-spacing:-7px;font-size:clamp(80px,10.7vw,175px);margin:0 0 42px}
.hero h1 i{font-weight:400}
.hero-caption{position:absolute;right:0;bottom:12px;display:flex;flex-direction:column;align-items:flex-end;font-size:12px;letter-spacing:1.5px;line-height:1.8}

.photo{display:block;position:relative;width:100%;padding:0;overflow:hidden}
.photo picture{display:block}
.photo img{display:block;width:100%;height:auto;transition:filter .25s}
.photo:hover img{filter:brightness(.94)}
.enlarge{position:absolute;bottom:18px;right:18px;border-radius:50%;background:var(--paper);width:38px;height:38px;display:grid;place-items:center}
.hero-bottom{display:flex;justify-content:space-between;padding:20px 0;border-bottom:1px solid var(--line);font-size:12px;letter-spacing:1px}

.wrap{max-width:1600px;margin:auto;padding-left:8%;padding-right:8%}
section[id]{scroll-margin-top:30px}
h2{font-family:Georgia,'Times New Roman',serif;font-size:clamp(36px,4.3vw,66px);line-height:1.13;font-weight:400;letter-spacing:-1.6px;margin:0 0 30px}
p{margin:0 0 25px}

.intro{padding-top:110px;padding-bottom:100px}
.split{display:grid;grid-template-columns:1.3fr 1fr;gap:12%;align-items:start}
.split>p,.intro-copy p{max-width:450px;padding-top:8px;font-size:18px}
.intro-copy p+p{padding-top:0}
.facts{display:grid;grid-template-columns:repeat(6,1fr);margin:65px 0 20px;border-top:1px solid var(--line);padding-top:25px;gap:16px}
.facts div{display:flex;flex-direction:column-reverse}
.facts dt{font-size:13px;color:var(--muted)}
.facts dd{margin:0;font-family:Georgia,serif;font-size:48px;line-height:1.3}
.facts small{font-size:23px}
.extra{color:var(--muted);font-size:14px;border-bottom:1px solid var(--line);padding-bottom:25px}

.architecture{display:grid;grid-template-columns:1.15fr .85fr;gap:10%;padding-bottom:100px;align-items:start}
.arch-image{padding-top:90px}
.arch-text h2{font-size:clamp(32px,3.2vw,48px)}
.arch-text>p:not(.eyebrow){max-width:430px}
.detail{width:65%;margin:55px 0 0 auto}

.section-heading{display:flex;justify-content:space-between;align-items:end;gap:30px}
.section-heading>p{font-size:13px;color:var(--muted)}
.gallery{padding-top:45px;padding-bottom:105px;border-top:1px solid var(--line)}
.gallery h2{font-size:46px;max-width:540px}
.gallery-grid{display:grid;grid-template-columns:1fr 1fr;gap:55px 35px;margin-top:35px}
.gallery-grid figure{margin:0}
.gallery-grid figure:nth-child(3n+1){grid-column:1/-1}
.gallery-grid img{background:#e6e1d7}
figcaption{font-size:12px;color:var(--muted);padding-top:12px;max-width:650px}
.text-button{border-bottom:1px solid;padding:10px 0;margin-top:40px;font-size:16px}

.plan-section{background:#e9e5da;padding:90px 0 55px}
.plan-section a,.location a{font-size:14px;border-bottom:1px solid;padding-bottom:8px}
.plan-preview{width:100%;padding:35px 0 15px}
.plan-preview img{width:100%;height:auto;display:block}
.plan-preview span{display:inline-block;margin:20px 0 12px;border-bottom:1px solid}
.plan-section .eyebrow:last-child{font-size:11px;color:var(--muted);letter-spacing:1px}

.location{padding-top:110px;padding-bottom:110px;display:grid;grid-template-columns:1fr 1fr;gap:15%;align-items:center}
.location p{max-width:380px}

.contact{background:#292b26;color:#eee5d5;padding:80px 0 30px}
.contact h2{font-size:clamp(55px,7vw,100px)}
.contact .split{gap:15%}
.mail-cta{display:block;border-bottom:1px solid #8d9084;padding:15px 0;margin:20px 0;font-size:22px}
.email-address{font-size:14px;overflow-wrap:anywhere}
footer{border-top:1px solid #62645b;margin-top:85px;padding-top:40px;display:grid;grid-template-columns:1fr 1fr 1fr;gap:60px;align-items:start}
.efc{width:145px;height:auto}
footer a{display:block;font-size:13px;margin-bottom:8px}
footer p{font-size:12px;color:#c5c3b6}
.disclaimer{font-size:12px}
.menu-toggle{font-size:14px}

dialog{border:0;padding:0;background:#252621;color:#f4f1e9;width:100vw;height:100dvh;max-width:none;max-height:none;inset:0;margin:0}
dialog[open]{display:flex;flex-direction:column}
dialog::backdrop{background:#252621}
.viewer-toolbar,.viewer-bottom{display:flex;justify-content:space-between;align-items:center;padding:18px 4%;gap:25px;flex-shrink:0}
.viewer-toolbar button{padding:8px 15px;border:1px solid #77796d}
.image-stage{flex:1;min-height:0;display:flex;align-items:center;justify-content:center;padding:0 4%}
.image-stage img{max-width:100%;max-height:100%;object-fit:contain}
.viewer-bottom p{margin:0;text-align:center;font-size:14px;max-width:750px}
.viewer-bottom button{font-size:30px;padding:5px 20px}
.plan-stage{overflow:auto;flex:1;background:var(--paper);padding:20px}
.plan-stage img{width:100%;max-width:none;height:auto;display:block}

.locked{overflow:hidden}
#mobile-nav{padding:20px 5%;border-bottom:1px solid var(--line)}
#mobile-nav a{display:block;padding:10px}
#mobile-nav[hidden]{display:none}

/* Natural aspect ratio everywhere — no forced cropping of the photography */
.hero-image img{aspect-ratio:auto;object-fit:contain}
.hero-image{max-height:none}
.arch-image img,.detail img,.gallery-grid figure:nth-child(3n+1) img,.location img{aspect-ratio:auto;object-fit:contain}
.gallery-grid img{aspect-ratio:auto}
.gallery-grid{align-items:start}

@media(min-width:1800px){.hero{max-width:1800px;margin:auto}}

@media(max-width:1050px){
  header nav{display:none}
  .menu-toggle{display:block}
  .hero-caption{font-size:10px}
  .facts{grid-template-columns:repeat(3,1fr);row-gap:25px}
  .architecture{gap:6%}
  .wrap{padding-left:6%;padding-right:6%}
}

@media(max-width:700px){
  header{height:77px;margin:0 6%;gap:15px}
  .wordmark{font-size:19px}
  .header-right{gap:18px}
  .contact-link{display:none}
  .hero{padding:35px 6% 0}
  .hero .eyebrow{font-size:10px;margin-bottom:20px}
  .hero h1{font-size:88px;letter-spacing:-5px;margin-bottom:22px}
  .hero-caption{position:static;align-items:start;flex-direction:row;justify-content:space-between;font-size:9px;margin-bottom:20px;letter-spacing:.7px}
  .hero-bottom{font-size:10px;gap:15px}
  .split{grid-template-columns:1fr;gap:5px}
  .intro{padding-top:65px;padding-bottom:40px}
  .split>p,.intro-copy p{font-size:16px}
  .facts{margin-top:35px;gap:22px 10px}
  .facts dd{font-size:39px}
  .facts dt{font-size:12px}
  .extra{font-size:12px;line-height:1.9}
  .architecture{display:flex;flex-direction:column;gap:35px;padding-bottom:60px}
  .arch-image{padding-top:0;width:87%}
  .arch-text h2{font-size:36px}
  .detail{width:55%;margin-top:30px}
  .eyebrow{margin-bottom:20px;font-size:11px}
  h2{font-size:38px;letter-spacing:-1px}
  .gallery{padding-top:40px;padding-bottom:65px}
  .section-heading{display:block}
  .gallery h2{font-size:38px}
  .gallery-grid{gap:28px 15px;margin-top:25px}
  .gallery-grid figure{grid-column:1/-1}
  figcaption{font-size:11px}
  .text-button{margin-top:25px}
  .plan-section{padding:60px 0 30px}
  .plan-preview{padding-top:20px}
  .plan-section .eyebrow:last-child{font-size:9px}
  .location{grid-template-columns:1fr;gap:40px;padding-top:60px;padding-bottom:60px}
  .location>.photo{width:80%;margin-left:auto}
  .contact{padding-top:55px}
  .contact h2{font-size:64px}
  .contact .split{gap:10px}
  footer{grid-template-columns:1fr 1fr;gap:30px;margin-top:50px}
  .disclaimer{grid-column:1/-1}
  .efc{width:125px}
  .viewer-bottom p{font-size:12px}
  .viewer-bottom{gap:8px;padding:15px 3%}
  .viewer-bottom button{padding:5px 10px}
  .viewer-toolbar{padding:14px 4%;font-size:14px}
  .viewer-toolbar button{padding:8px}
  .image-stage{padding:0 2%}
}

@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}
