@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,600;1,300;1,400;1,600&family=Jost:wght@200;300;400;500&display=swap');

/* ── TOKENS ─────────────────────────────────── */
:root {
  --black:  #0A0A0A;
  --ink:    #181818;
  --mid:    #5C5C5C;
  --muted:  #9B9B9B;
  --rule:   #E8E6E3;
  --bone:   #F6F4F1;
  --white:  #FFFFFF;
  --serif:  'Cormorant Garamond', Georgia, serif;
  --sans:   'Jost', system-ui, sans-serif;
  --px:     clamp(1.5rem, 6vw, 6rem);
  --nav:    72px;
  --ease:   cubic-bezier(0.16, 1, 0.3, 1);
}

/* ── RESET ───────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
[id] { scroll-margin-top: calc(var(--nav) + 2rem); }
body { font-family: var(--sans); background: var(--white); color: var(--ink); overflow-x: hidden; -webkit-font-smoothing: antialiased; }
img  { display: block; max-width: 100%; }
a    { color: inherit; text-decoration: none; }
ul   { list-style: none; }
button { font-family: inherit; cursor: pointer; border: none; background: none; }
a:focus-visible, button:focus-visible { outline: 1px solid var(--ink); outline-offset: 3px; }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}

/* ── LOADER ──────────────────────────────────── */
.loader {
  position: fixed; inset: 0; z-index: 9999;
  background: var(--white); display: flex; align-items: center; justify-content: center;
  transition: opacity .5s ease, visibility .5s ease;
}
.loader[data-hidden] { opacity: 0; visibility: hidden; pointer-events: none; }
.loader__logo { width: 180px; opacity: 0; animation: logoPulse 1.8s ease-in-out infinite; }
@keyframes logoPulse { 0%,100%{opacity:.08;transform:scale(.97)} 50%{opacity:1;transform:scale(1)} }
.scroll-bar { position: fixed; top: 0; left: 0; height: 1px; background: var(--ink); z-index: 1000; width: 0; transition: width .1s; }

/* ── PAGE TRANSITION ─────────────────────────── */
.page-wipe { position: fixed; inset: 0; z-index: 9998; background: var(--ink); transform: scaleY(0); transform-origin: bottom; transition: transform .45s cubic-bezier(.76,0,.24,1); pointer-events: none; }
.page-wipe.active { transform: scaleY(1); }
main { animation: fadeUp .65s var(--ease) both; }
@keyframes fadeUp { from{opacity:0;transform:translateY(10px)} to{opacity:1;transform:translateY(0)} }

/* ── NAV ─────────────────────────────────────── */
.nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 100;
  height: var(--nav); padding: 0 var(--px);
  display: flex; align-items: center; justify-content: space-between;
  gap: 1.5rem;
  background: rgba(255,255,255,.97);
  border-bottom: .5px solid var(--rule);
}
.nav-logo img { height: 48px; width: auto; flex-shrink: 0; }
.nav-links { display: flex; gap: 2rem; align-items: center; }

/* CTA button always visible in nav */
.nav-cta {
  display: inline-block; flex-shrink: 0;
  padding: .55rem 1.5rem;
  font-size: .6rem; letter-spacing: .18em; text-transform: uppercase;
  background: var(--ink); color: var(--white);
  border: 1px solid var(--ink);
  transition: background .25s, color .25s;
  white-space: nowrap;
}
.nav-cta:hover { background: transparent; color: var(--ink); }
.nav-links a {
  font-size: .62rem; letter-spacing: .2em; text-transform: uppercase; color: var(--mid);
  position: relative; padding-bottom: 2px; transition: color .25s;
}
.nav-links a::after { content:''; position:absolute; bottom:0; left:50%; width:0; height:.5px; background:var(--ink); transition: width .25s, left .25s; }
.nav-links a:hover, .nav-links a[aria-current] { color: var(--ink); }
.nav-links a:hover::after, .nav-links a[aria-current]::after { width:100%; left:0; }
.nav-toggle { display:none; flex-direction:column; gap:5px; padding:4px; }
.nav-toggle span { display:block; width:22px; height:.5px; background:var(--ink); transition:.25s; }
.nav-toggle[aria-expanded=true] span:nth-child(1){transform:translateY(5.5px) rotate(45deg)}
.nav-toggle[aria-expanded=true] span:nth-child(2){opacity:0}
.nav-toggle[aria-expanded=true] span:nth-child(3){transform:translateY(-5.5px) rotate(-45deg)}
body.nav-open { overflow: hidden; }

/* ── BUTTONS ─────────────────────────────────── */
.btn {
  display: inline-block; padding: .9rem 2.4rem;
  font-size: .62rem; letter-spacing: .2em; text-transform: uppercase;
  border: 1px solid transparent; transition: background .25s, color .25s, border-color .25s, transform .2s;
}
.btn:hover { transform: translateY(-1px); }
.btn--dark  { background:var(--ink); color:var(--white); border-color:var(--ink); }
.btn--dark:hover { background:#2a2a2a; }
.btn--light { background:var(--white); color:var(--ink); border-color:var(--white); }
.btn--light:hover { background:transparent; color:var(--white); }
.btn--outline { border-color:var(--ink); color:var(--ink); }
.btn--outline:hover { background:var(--ink); color:var(--white); }
.btn--outline-light { border-color:rgba(255,255,255,.4); color:rgba(255,255,255,.8); }
.btn--outline-light:hover { border-color:var(--white); color:var(--white); }

/* ── FADE IN ─────────────────────────────────── */
.fade { opacity:0; transform:translateY(18px); transition: opacity .75s var(--ease), transform .75s var(--ease); }
.fade.in { opacity:1; transform:translateY(0); }
.fade[data-d="1"]{transition-delay:.1s}
.fade[data-d="2"]{transition-delay:.2s}
.fade[data-d="3"]{transition-delay:.3s}

/* ── HEADLINE REVEAL (curtain mask, like the hero title lines) ── */
.reveal-mask { display:block; overflow:hidden; }
.reveal-mask .reveal-inner { display:block; transform:translateY(112%); transition:transform 1s var(--ease); }
.reveal-mask.in .reveal-inner { transform:translateY(0); }
@media (prefers-reduced-motion: reduce) {
  .reveal-mask .reveal-inner { transform:none; }
}

/* ── TYPOGRAPHY ──────────────────────────────── */
.label { display:inline-flex; align-items:center; gap:.7rem; font-size:.57rem; letter-spacing:.4em; text-transform:uppercase; color:var(--muted); }
.label::after { content:''; width:16px; height:.5px; background:currentColor; }
.serif { font-family:var(--serif); font-weight:300; line-height:1.1; }
.serif--xl { font-size:clamp(3rem,8vw,8rem); }
.serif--lg { font-size:clamp(2.2rem,5vw,4.8rem); }
.serif--md { font-size:clamp(1.6rem,3vw,2.8rem); }
em.it { font-style:italic; color:var(--mid); }

/* ── HERO — full-width, image behind text ─────── */
/* ── HERO — split: text left / photo right ─────── */
.hero {
  display: grid;
  grid-template-columns: 1fr 1fr;
  min-height: 100vh;
  min-height: 100dvh; /* iOS Safari: dvh accounts for the address bar, vh alone doesn't */
  padding-top: var(--nav);
  background: var(--ink);
}
.hero__text {
  display: flex; flex-direction: column; justify-content: center;
  padding: 5rem var(--px);
}
.hero__eyebrow {
  font-size: .57rem; letter-spacing: .42em; text-transform: uppercase;
  color: rgba(255,255,255,.38); margin-bottom: 1.8rem;
}
.hero__title { color: var(--white); margin-bottom: 1.8rem; }
.hero__title .line { display: block; opacity: 1; transform: none; }
body.loaded .hero__title .line,
body.hero-ready .hero__title .line {
  opacity: 0; transform: translateY(22px);
  animation: lineIn .8s var(--ease) both;
}
body.loaded .hero__title .line:nth-child(1),
body.hero-ready .hero__title .line:nth-child(1) { animation-delay: .05s; }
body.loaded .hero__title .line:nth-child(2),
body.hero-ready .hero__title .line:nth-child(2) { animation-delay: .18s; }
body.loaded .hero__title .line:nth-child(3),
body.hero-ready .hero__title .line:nth-child(3) { animation-delay: .31s; }
@keyframes lineIn { to { opacity: 1; transform: translateY(0); } }
.hero__sub {
  font-size: .87rem; line-height: 1.95; color: rgba(255,255,255,.42);
  max-width: 360px; margin-bottom: 2.8rem; font-weight: 300;
}
.hero__actions { display: flex; gap: 1rem; flex-wrap: wrap; }
.hero__img { position: relative; overflow: hidden; }
.hero__img img {
  width: 100%; height: 100%; object-fit: cover; object-position: top center;
  min-height: calc(100vh - var(--nav));
  min-height: calc(100dvh - var(--nav));
  filter: brightness(.84);
  transition: transform .9s var(--ease);
}
.hero__img:hover img { transform: scale(1.02); }
.hero__caption {
  position: absolute; bottom: 1.8rem; left: 1.8rem;
  font-family: var(--serif); font-style: italic;
  font-size: .82rem; color: rgba(255,255,255,.45);
}

/* ── MARQUEE ─────────────────────────────────── */
.marquee { overflow:hidden; background:var(--bone); border-top:.5px solid var(--rule); border-bottom:.5px solid var(--rule); padding:.8rem 0; }
.marquee__track { display:flex; gap:2.5rem; width:max-content; animation:marqueeMove 26s linear infinite; }
.marquee__item { font-size:.57rem; letter-spacing:.32em; text-transform:uppercase; color:var(--muted); white-space:nowrap; }
.marquee__sep { color:var(--rule); }
@keyframes marqueeMove { from{transform:translateX(0)} to{transform:translateX(-50%)} }

/* ── SECTION HEADER ──────────────────────────── */
.sec-head { display:flex; align-items:flex-end; justify-content:space-between; margin-bottom:2.8rem; gap:1.5rem; flex-wrap:wrap; }

/* ── GALLERY GRID — uniform portrait cards ────── */
/* This is the key: all images same ratio, clean grid like ELHA */
.gallery {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.2rem;
}
.gallery--2 { grid-template-columns: repeat(2, 1fr); }
/* Full collections page — 4 uniform columns like ELHA */
.gallery--4 {
  grid-template-columns: repeat(4, 1fr);
  gap: .9rem;
}

.g-card {
  position: relative; overflow: hidden; cursor: pointer;
  background: var(--bone); /* fallback while image loads */
  transition: box-shadow .3s;
}
.g-card:hover { box-shadow: 0 12px 32px rgba(0,0,0,.1); }
.g-card img {
  width: 100%; height: auto; display: block;
  aspect-ratio: 3 / 4;       /* uniform portrait — no stretched or cropped surprises */
  object-fit: cover;
  object-position: top;
  transition: transform .8s var(--ease);
}
.g-card:hover img { transform: scale(1.04); }
.g-card__info {
  position: absolute; bottom: 0; left: 0; right: 0;
  padding: 2.5rem 1.4rem 1.4rem;
  background: linear-gradient(to top, rgba(10,10,10,.78) 0%, transparent 100%);
  transform: translateY(3px); transition: transform .3s;
}
.g-card:hover .g-card__info { transform: translateY(0); }
.g-card__yr   { font-size:.53rem; letter-spacing:.3em; text-transform:uppercase; color:rgba(255,255,255,.42); display:block; margin-bottom:.35rem; }
.g-card__name { font-family:var(--serif); font-size:1.4rem; font-weight:300; color:var(--white); display:block; }
.g-card__sub  { font-size:.64rem; color:rgba(255,255,255,.42); display:block; margin-top:.2rem; }
.g-card__expand {
  position:absolute; top:.9rem; right:.9rem;
  width:28px; height:28px; border-radius:50%;
  border:1px solid rgba(255,255,255,.3);
  display:flex; align-items:center; justify-content:center;
  color:var(--white); font-size:.8rem; opacity:0; transition:opacity .25s;
  background:rgba(0,0,0,.2);
}
.g-card:hover .g-card__expand { opacity:1; }

/* ── FEATURED 3 (homepage) — clean style, label below ── */
.gallery--featured {
  gap: 2rem;           /* more breathing room between cards */
  align-items: start;
}

/* Clean card: label below image, no dark overlay */
.g-card--clean { background: none; box-shadow: none; }
.g-card--clean:hover { box-shadow: none; }
.g-card--clean img {
  aspect-ratio: 3 / 4;
  object-position: center 10%;   /* show upper body, avoids cropping to floor */
  filter: none;
}
.g-card--clean:hover img {
  transform: scale(1.03);
  filter: brightness(.96);
}
.g-card--clean .g-card__info {
  position: static;
  background: none;
  transform: none !important;
  padding: .9rem 0 0;
}
.g-card--clean .g-card__yr   { color: var(--muted); }
.g-card--clean .g-card__name {
  color: var(--ink);
  font-size: 1rem;
  font-family: var(--serif);
  font-weight: 300;
}
.g-card--clean .g-card__sub  { color: var(--muted); font-size: .62rem; }
.g-card--clean .g-card__expand { display: none; }

/* ── MASONRY — collection galleries: organic Pinterest-style mosaic ──
   Each photo keeps its natural proportions (no forced cropping), so
   portrait, square and landscape shots sit together at different
   sizes. JS (masonry.js) distributes cards into these columns using a
   shortest-column-first placement so no column is left short with a
   dangling gap at the bottom. */
.masonry {
  display: flex;
  gap: 1.1rem;
  align-items: flex-start;
}
.masonry__col {
  display: flex;
  flex-direction: column;
  gap: 1.1rem;
  flex: 1 1 0;
  min-width: 0;
}
.masonry .g-card {
  display: block;
  width: 100%;
}
.masonry .g-card img {
  width: 100%; height: auto; display: block;
  aspect-ratio: auto;         /* let each photo's real proportions show */
  object-fit: initial;
  transition: transform .8s var(--ease);
}

@media (max-width: 900px) {
  .masonry { gap: .7rem; }
  .masonry__col { gap: .7rem; }
}

/* ── SECTION PADDING ─────────────────────────── */
.section { padding: 9rem var(--px); }
.section--bone { background: var(--bone); }
.section--dark { background: var(--ink); }
.section--tight { padding-top: 4rem; padding-bottom: 4rem; }

/* ── INTRO (brand block) ─────────────────────── */
.intro { display:grid; grid-template-columns:1fr 1fr; }
.intro + .intro { border-top: .5px solid var(--rule); }
.intro__img { overflow:hidden; }
.intro__img img { width:100%; height:100%; object-fit:cover; object-position:top; min-height:520px; transition:transform .9s var(--ease); }
.intro__img:hover img { transform:scale(1.03); }
.intro__body { display:flex; flex-direction:column; justify-content:center; padding:6.5rem var(--px); background:var(--bone); }
.intro__text { font-size:.88rem; line-height:1.95; color:var(--mid); font-weight:300; margin-bottom:1.2rem; }
.intro--dark .intro__body { background:var(--ink); }
.intro--dark .intro__body .label { color:rgba(255,255,255,.42); }
.intro--dark .intro__body h2, .intro--dark .intro__body h3 { color:var(--white); }
.intro--dark .intro__body .intro__text { color:rgba(255,255,255,.62); }
.stats { display:flex; gap:2.8rem; margin-top:2.5rem; padding-top:2.5rem; border-top:.5px solid var(--rule); }
.stat__n { font-family:var(--serif); font-size:2.6rem; font-weight:300; line-height:1; color:var(--ink); }
.stat__l { font-size:.54rem; letter-spacing:.16em; text-transform:uppercase; color:var(--muted); margin-top:.3rem; }

/* ── STATEMENT ───────────────────────────────── */
.statement { display:grid; grid-template-columns:1fr 1fr; }
.statement__img { overflow:hidden; }
.statement__img img { width:100%; height:100%; object-fit:cover; min-height:520px; }
.statement--reverse .statement__img { order:2; }
.statement--reverse .statement__body { order:1; }
.statement__body { background:var(--ink); display:flex; flex-direction:column; justify-content:center; padding:7.5rem var(--px); }
.statement__mark { font-family:var(--serif); font-size:5rem; line-height:.5; color:rgba(255,255,255,.08); margin-bottom:1.5rem; }
.statement__q { font-family:var(--serif); font-style:italic; font-size:clamp(1.4rem,2.2vw,2.2rem); font-weight:300; line-height:1.55; color:var(--white); margin-bottom:1.8rem; }
.statement__attr { font-size:.56rem; letter-spacing:.28em; text-transform:uppercase; color:rgba(255,255,255,.3); }
.statement--light .statement__body { background:var(--bone); }
.statement--light .statement__mark { color:rgba(24,24,24,.08); }
.statement--light .statement__q { color:var(--ink); }
.statement--light .statement__attr { color:var(--muted); }

/* ── VALUES ──────────────────────────────────── */
.values { background:var(--ink); display:grid; grid-template-columns:repeat(3,1fr); border-top:.5px solid rgba(255,255,255,.05); }
.val { padding:3rem 2.5rem; border-right:.5px solid rgba(255,255,255,.05); }
.val:last-child { border-right:none; }
.val__n { font-family:var(--serif); font-size:1.4rem; color:rgba(255,255,255,.15); margin-bottom:1rem; }
.val__t { font-family:var(--serif); font-size:1.15rem; font-weight:300; color:var(--white); margin-bottom:.55rem; }
.val__p { font-size:.78rem; line-height:1.8; color:rgba(255,255,255,.32); font-weight:300; }

/* ── CREDENTIALS ─────────────────────────────── */
.creds__grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--rule); border:1px solid var(--rule); margin-top:3rem; }
.cred { background:var(--bone); padding:2.6rem 2rem; transition:background .25s; }
.cred:hover { background:var(--white); }
.cred__line { width:20px; height:.5px; background:var(--ink); margin-bottom:1.3rem; }
.cred__t { font-family:var(--serif); font-size:1.1rem; color:var(--ink); margin-bottom:.55rem; }
.cred__p { font-size:.76rem; line-height:1.75; color:var(--mid); font-weight:300; }

/* ── CONTACT ─────────────────────────────────── */
.contact { display:grid; grid-template-columns:1fr 1fr; gap:6rem; align-items:center; }
.contact__text { font-size:.87rem; line-height:1.9; color:var(--mid); font-weight:300; margin-bottom:.8rem; }
.form { display:flex; flex-direction:column; gap:1.5rem; }
.field { position:relative; }
.field input,.field textarea { width:100%; background:none; border:none; border-bottom:.5px solid var(--rule); padding:.75rem 0; font-family:var(--sans); font-size:.88rem; color:var(--ink); font-weight:300; outline:none; transition:border-color .25s; }
.field input:focus,.field textarea:focus { border-color:var(--ink); }
.field textarea { resize:vertical; min-height:90px; }
.field label { position:absolute; top:.75rem; left:0; font-size:.88rem; color:var(--muted); pointer-events:none; transition:.28s; font-weight:300; }
.field input:focus~label,.field input:not(:placeholder-shown)~label,
.field textarea:focus~label,.field textarea:not(:placeholder-shown)~label { transform:translateY(-1.3rem); font-size:.54rem; letter-spacing:.18em; text-transform:uppercase; }
.field::after { content:''; position:absolute; bottom:0; left:50%; width:0; height:1px; background:var(--ink); transition:.3s ease; }
.field:focus-within::after { width:100%; left:0; }
.field__err { font-size:.64rem; color:#b33; }

/* ── PHONE FIELD (country code + number) ──────── */
.field--phone .phone-row { display:flex; align-items:center; gap:.6rem; border-bottom:.5px solid var(--rule); transition:border-color .25s; }
.field--phone:focus-within .phone-row { border-color:var(--ink); }
.field--phone .phone-row select {
  border:none; background:none; -webkit-appearance:none; appearance:none;
  font-family:var(--sans); font-size:.82rem; color:var(--ink); font-weight:300;
  padding:.75rem .2rem .75rem 0; outline:none; cursor:pointer; flex-shrink:0; max-width:5.2rem;
}
.field--phone .phone-row input { border:none; flex:1; min-width:0; }
.field--phone label { left:5.8rem; }
.field--phone:has(input:focus) label,
.field--phone:has(input:not(:placeholder-shown)) label {
  left:0; transform:translateY(-1.3rem); font-size:.54rem; letter-spacing:.18em; text-transform:uppercase;
}
.form__status { font-size:.76rem; color:var(--mid); }

/* ── CTA STRIP ───────────────────────────────── */
.cta-strip { text-align:center; }
.cta-strip .label { justify-content:center; margin-bottom:1.4rem; }
.cta-strip__title { margin-bottom:2.2rem; }

/* ── FOOTER ──────────────────────────────────── */
.footer { background:var(--ink); padding:3rem var(--px); display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:1.5rem; }
.footer__logo img { height:52px; filter:invert(1); opacity:.85; }
.footer__sub { font-size:.7rem; color:var(--muted); margin-top:.65rem; letter-spacing:.05em; }
.footer__links { display:flex; gap:1.8rem; }
.footer__links a { font-size:.57rem; letter-spacing:.18em; text-transform:uppercase; color:rgba(255,255,255,.35); transition:color .2s; }
.footer__links a:hover { color:var(--white); }
.footer__copy { font-size:.57rem; color:var(--muted); }

/* ── LIGHTBOX ────────────────────────────────── */
.lb { position:fixed; inset:0; z-index:9000; background:rgba(10,10,10,.95); display:flex; align-items:center; justify-content:center; opacity:0; visibility:hidden; transition:opacity .28s,visibility .28s; }
.lb.open { opacity:1; visibility:visible; }
.lb figure { max-width:90vw; max-height:85vh; max-height:85dvh; display:flex; flex-direction:column; align-items:center; }
.lb__img { max-width:100%; max-height:75vh; max-height:75dvh; object-fit:contain; transform:scale(.96); transition:transform .3s var(--ease); }
.lb.open .lb__img { transform:scale(1); }
.lb__cap { font-family:var(--serif); font-style:italic; color:var(--white); margin-top:1rem; font-size:.95rem; }
.lb__close,.lb__nav { position:absolute; color:var(--white); cursor:pointer; transition:opacity .2s; }
.lb__close:hover,.lb__nav:hover { opacity:.5; }
.lb__close { top:1.2rem; right:1.2rem; font-size:1.8rem; width:40px; height:40px; }
.lb__nav { top:50%; transform:translateY(-50%); font-size:2.6rem; width:52px; height:52px; }
.lb__nav--p { left:.5rem; } .lb__nav--n { right:.5rem; }

/* ── WHATSAPP ────────────────────────────────── */


/* ── RESPONSIVE ──────────────────────────────── */
@media (max-width:1024px){
  .gallery { grid-template-columns:repeat(2,1fr); }
  .gallery--4 { grid-template-columns:repeat(2,1fr); gap:.8rem; }
  .gallery--featured .g-card:nth-child(2) img { aspect-ratio:3/4; }
  .gallery--featured { grid-template-rows:auto auto; }
  .gallery--featured .g-card:nth-child(2) { order:-1; grid-column:1/-1; }
  .gallery--featured .g-card:nth-child(2) img { aspect-ratio:16/9; object-position:center; }
  .creds__grid { grid-template-columns:repeat(2,1fr); }
}
@media (max-width:900px){
  :root{ --px:1.5rem; --nav:64px; }
  .nav-logo img { height:40px; }
  .nav-cta { padding: .45rem 1rem; font-size: .55rem; letter-spacing: .12em; }
  .nav-links { position:fixed; inset:0; height:100dvh; background:var(--white); flex-direction:column; align-items:center; justify-content:center; gap:2.5rem; z-index:99; transform:translateY(-100%); opacity:0; transition:.4s ease; pointer-events:none; }
  .nav-links.open { transform:translateY(0); opacity:1; pointer-events:auto; }
  .nav-links a { font-size:.72rem; }
  .nav-toggle { display:flex; z-index:100; }
  /* Split hero stacks on mobile */
  .hero { grid-template-columns: 1fr; min-height: auto; }
  .hero__text { padding: 3.5rem var(--px) 2.5rem; }
  .hero__img img { min-height: 65vw; }
  .intro { grid-template-columns:1fr; }
  .intro__img { order:1; }
  .intro__body { order:2; padding:4.5rem var(--px); }
  .intro__img img { height:auto; min-height:0; max-height:none; }
  .statement { grid-template-columns:1fr; }
  .statement__img img { height:auto; min-height:0; }
  .statement__body { padding:5.5rem var(--px); }
  .statement--reverse .statement__img { order:1; }
  .statement--reverse .statement__body { order:2; }
  .values { grid-template-columns:1fr; }
  .val { border-right:none; border-top:.5px solid rgba(255,255,255,.05); }
  .section { padding:6.5rem var(--px); }
  .contact { grid-template-columns:1fr; gap:3rem; }
  .footer { flex-direction:column; text-align:center; padding:2.5rem var(--px); }
  .creds__grid { grid-template-columns:1fr; }
  .stats { flex-wrap:wrap; gap:2rem; }
}
@media (max-width:560px){
  .gallery, .gallery--4 { grid-template-columns:1fr 1fr; gap:.6rem; }
  .gallery--featured { grid-template-columns:1fr 1fr; }
  .gallery--featured .g-card:nth-child(2) { order:0; grid-column:auto; }
  .gallery--featured .g-card:nth-child(2) img { aspect-ratio:3/4; }
}