@import url('https://fonts.googleapis.com/css2?family=Archivo:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,400;1,500;1,600&display=swap');

:root{
  --cream:#f6f3ee;
  --ink:#15171a;
  --line:rgba(21,23,26,0.14);
  --muted:#6b6a66;
  --tan:#c9bfa4;
}

*{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{
  background:var(--cream);
  color:var(--ink);
  font-family:'Playfair Display',serif;
  font-weight:500;
  -webkit-font-smoothing:antialiased;
}
a{color:inherit;text-decoration:none;}

.serif{font-family:'Playfair Display',serif;}

/* Nav */
.nav{
  position:fixed; top:0; left:0; right:0; z-index:50;
  padding:28px 48px 20px;
  color:#fff;
  background:linear-gradient(180deg, rgba(0,0,0,0.55) 0%, rgba(0,0,0,0.15) 70%, transparent 100%);
  transition:background 0.4s ease, padding 0.4s ease;
}
.nav.solid{
  color:var(--ink); background:var(--cream); border-bottom:1px solid var(--line);
  padding:16px 48px;
}
.nav .brand{
  display:block; font-family:'Playfair Display',serif; font-weight:800; text-transform:uppercase;
  font-size:clamp(38px,7.2vw,108px); letter-spacing:0.01em; line-height:0.92;
  text-shadow:0 2px 24px rgba(0,0,0,0.35);
  transition:font-size 0.4s ease;
}
.nav.solid .brand{ font-size:clamp(20px,2.4vw,28px); text-shadow:none; }
.nav .links{ display:flex; gap:48px; margin-top:18px; }
.nav.solid .links{ margin-top:10px; }
.nav .links a{ font-size:18px; font-weight:700; letter-spacing:0.08em; text-transform:uppercase; position:relative; padding-bottom:4px; display:inline-block; transition:transform 0.3s cubic-bezier(.16,1,.3,1), opacity 0.3s ease; }
.nav .links a::before{ content:"+ "; opacity:0.6; }
.nav .links a::after{
  content:""; position:absolute; left:0; right:100%; bottom:0; height:1px; background:currentColor;
  transition:right 0.5s cubic-bezier(.16,1,.3,1);
}
.nav .links a:hover{ transform:scale(1.12); opacity:1; }
.nav .links a:hover::after{ right:0; }
@media (max-width:900px){
  .nav .links{ gap:24px; flex-wrap:wrap; }
  .nav .links a{ font-size:12px; }
}

.reveal{
  opacity:0; transform:translateY(48px);
  transition:opacity 1.1s cubic-bezier(.16,1,.3,1), transform 1.1s cubic-bezier(.16,1,.3,1);
}
.reveal.in-view{ opacity:1; transform:translateY(0); }
.grid .card.reveal:nth-child(1){ transition-delay:0s; }
.grid .card.reveal:nth-child(2){ transition-delay:0.1s; }
.grid .card.reveal:nth-child(3){ transition-delay:0.2s; }
.grid .card.reveal:nth-child(4){ transition-delay:0.3s; }
.grid .card.reveal:nth-child(5){ transition-delay:0.4s; }
.grid .card.reveal:nth-child(6){ transition-delay:0.5s; }

.hero-content .tag, .hero-content h1{
  opacity:0; transform:translateY(28px);
  transition:opacity 1s cubic-bezier(.16,1,.3,1), transform 1s cubic-bezier(.16,1,.3,1);
}
.hero-content .tag{ transition-delay:0.3s; }
.hero-content h1{ transition-delay:0.5s; }
.hero-content .tag,
.hero-content h1{ opacity:1; transform:translateY(0); }

@media (prefers-reduced-motion: reduce){
  .reveal, .hero-content .tag, .hero-content h1{ opacity:1 !important; transform:none !important; transition:none !important; }
  .hero-bg{ transform:none !important; }
  .hero-bg .bg-slide{ transition:none !important; }
}

/* Hero */
.hero{
  position:relative; height:100vh; min-height:720px; width:100%;
  display:flex; align-items:center;
  overflow:hidden;
}
.hero-bg{
  position:absolute; inset:0; width:110%; height:130%; top:-8%; left:-5%;
  will-change:transform;
}
.hero-bg .bg-slide{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  opacity:0; transition:opacity 1.6s ease;
}
.hero-bg .bg-slide.active{ opacity:1; }
.photo-ph{
  position:absolute; inset:0; width:100%; height:100%;
  background:linear-gradient(150deg, #3d463f 0%, #262b25 55%, #1a1e19 100%);
  display:flex; align-items:center; justify-content:center;
  text-align:center;
}
.photo-ph span{
  color:rgba(255,255,255,0.55); font-size:11px; letter-spacing:0.14em; text-transform:uppercase;
  border:1px solid rgba(255,255,255,0.25); padding:10px 18px;
}
.card .photo-ph{ transition:transform 1.1s cubic-bezier(.2,.8,.2,1); }
.card:hover .photo-ph{ transform:scale(1.05); }
.hero::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(0,0,0,0.05) 0%, rgba(0,0,0,0.55) 100%);
}
.hero-content{
  position:relative; z-index:2; color:#fff; padding:0 48px;
  max-width:820px;
  text-shadow:0 2px 20px rgba(0,0,0,0.3);
}
.hero-content .tag{ font-size:12px; font-weight:700; letter-spacing:0.18em; text-transform:uppercase; opacity:0.85; margin-bottom:20px; display:block; }
.hero-content h1{ font-family:'Playfair Display',serif; font-size:clamp(36px,5.2vw,68px); font-weight:600; line-height:1.12; }
.hero-content h1 em{ font-style:normal; }

.scroll-cue{
  position:absolute; bottom:32px; right:48px; z-index:2; color:#fff;
  font-size:12px; font-weight:700; letter-spacing:0.16em; text-transform:uppercase;
  display:flex; flex-direction:column; align-items:center; gap:10px;
  opacity:0.95; text-shadow:0 2px 12px rgba(0,0,0,0.4);
}
.scroll-cue span{ writing-mode:vertical-rl; }
.scroll-cue .chevron{
  width:14px; height:14px; border-right:2px solid currentColor; border-bottom:2px solid currentColor;
  transform:rotate(45deg); animation:scrollBounce 1.6s ease-in-out infinite;
}
@keyframes scrollBounce{
  0%,100%{ transform:rotate(45deg) translate(0,0); opacity:0.6; }
  50%{ transform:rotate(45deg) translate(4px,4px); opacity:1; }
}
@media (prefers-reduced-motion: reduce){
  .scroll-cue .chevron{ animation:none; }
}

/* Philosophy — agency-style two column intro */
.philosophy{
  position:relative; padding:160px 48px 120px; max-width:1500px; margin:0 auto;
  display:grid; grid-template-columns:0.9fr 1.5fr; column-gap:64px; row-gap:56px;
  overflow:hidden;
}
.philosophy::before{
  content:""; position:absolute; top:60px; right:-120px; width:640px; height:640px;
  border:1px solid var(--line); border-radius:50%;
  pointer-events:none;
}
.phil-title{
  font-family:'Playfair Display',serif; font-weight:600; font-size:clamp(48px,6vw,96px);
  line-height:0.95; letter-spacing:-0.01em; grid-column:1; grid-row:1;
}
.phil-copy{
  grid-column:2; grid-row:1; font-size:clamp(20px,2vw,28px); line-height:1.55; font-weight:500;
  font-family:'Playfair Display',serif;
  text-indent:2.4em;
}
.phil-photo{
  grid-column:2; grid-row:2; width:100%; aspect-ratio:16/10; object-fit:cover;
}
.phil-note{
  grid-column:1; grid-row:2; align-self:end; display:flex; gap:14px; align-items:flex-start;
}
.phil-note .plus{ font-size:20px; line-height:1; color:var(--ink); }
.phil-note p{
  font-size:15px; font-weight:600; letter-spacing:0.05em; text-transform:uppercase; color:var(--ink); line-height:1.6;
}
@media (max-width:1000px){
  .philosophy{ grid-template-columns:1fr; padding:120px 24px 80px; row-gap:32px; }
  .phil-title, .phil-copy, .phil-photo, .phil-note{ grid-column:1; grid-row:auto; }
  .phil-copy{ text-indent:0; }
  .philosophy::before{ display:none; }
  .phil-note p br{ display:none; }
}

/* Renderings — overlapping design/plan composition */
.renderings{
  position:relative; max-width:1500px; margin:0 auto; padding:0 48px 120px;
}
.rend-main{ width:100%; aspect-ratio:16/10; overflow:hidden; }
.rend-main img{ width:100%; height:100%; object-fit:cover; }
.rend-row{
  position:relative; z-index:2; margin-top:-100px;
  display:grid; grid-template-columns:minmax(220px,340px) minmax(220px,340px) 1fr; gap:32px; align-items:center;
}
.rend-inset{
  background:var(--cream); border:1px solid var(--line); padding:14px;
  box-shadow:0 30px 60px rgba(0,0,0,0.12);
}
.rend-inset img{ width:100%; display:block; }
.rend-caption{
  font-size:14px; letter-spacing:0.04em; text-transform:uppercase; color:var(--ink); line-height:1.6;
  display:flex; gap:14px; align-items:flex-start;
}
.rend-caption .plus{ font-size:20px; line-height:1; color:var(--ink); }
@media (max-width:1100px){
  .rend-row{ grid-template-columns:1fr 1fr; }
  .rend-caption{ grid-column:1 / -1; }
}
@media (max-width:900px){
  .renderings{ padding:0 24px 80px; }
  .rend-row{ grid-template-columns:1fr; margin-top:-40px; gap:24px; }
}

/* Buttons — bordered label + inverting arrow box, used for all site CTAs */
.btn-arrow{
  display:inline-flex; align-items:stretch; border:1px solid var(--ink); color:var(--ink);
  transition:background 0.3s ease, color 0.3s ease; text-decoration:none;
}
.btn-arrow .label{
  padding:18px 26px; font-size:12px; font-weight:600; letter-spacing:0.1em; text-transform:uppercase;
  display:flex; align-items:center;
}
.btn-arrow .icon{
  width:54px; display:flex; align-items:center; justify-content:center;
  background:var(--ink); color:var(--cream); font-size:18px;
  transition:background 0.3s ease, color 0.3s ease;
}
.btn-arrow:hover{ background:var(--ink); color:var(--cream); }
.btn-arrow:hover .icon{ background:var(--cream); color:var(--ink); }

/* Spotlight — single featured project, agency-style */
.spotlight{
  position:relative; max-width:1500px; margin:0 auto; padding:160px 48px 140px;
  display:grid; grid-template-columns:1fr 1fr; gap:64px; align-items:start;
}
.spotlight-photo-small{
  position:absolute; top:0; left:48px; width:280px; aspect-ratio:4/5; z-index:2;
}
.spotlight-photo-small img{ width:100%; height:100%; object-fit:cover; }
.spotlight-copy{ padding-top:200px; }
.spotlight-copy .eyebrow{ margin-bottom:0; }
.spotlight-copy h2{
  font-family:'Playfair Display',serif; font-weight:500; font-size:clamp(44px,5.5vw,84px); line-height:0.98; margin:18px 0 32px;
}
.spotlight-tags{ display:flex; gap:24px; margin-bottom:56px; }
.spotlight-tags span{
  font-size:12px; letter-spacing:0.08em; font-family:monospace,'Playfair Display',serif;
  border:1px solid var(--line); padding:6px 12px;
}
.spotlight-copy p{ max-width:340px; color:var(--ink); font-size:14px; line-height:1.7; text-transform:uppercase; letter-spacing:0.04em; margin-bottom:48px; }
.spotlight-photo-large{ width:100%; aspect-ratio:4/5; overflow:hidden; }
.spotlight-photo-large img{ width:100%; height:100%; object-fit:cover; }
@media (max-width:1000px){
  .spotlight{ grid-template-columns:1fr; padding:120px 24px 80px; gap:32px; }
  .spotlight-photo-small{ position:static; width:60%; margin-bottom:24px; }
  .spotlight-copy{ padding-top:0; }
}

/* Projects table */
.proj-table{ max-width:1500px; margin:0 auto; padding:0 48px 100px; }
.proj-row{
  display:grid; grid-template-columns:2fr 1fr 1fr 40px; align-items:center; gap:16px;
  padding:26px 24px; border-bottom:1px solid var(--line);
  transition:background 0.25s ease, color 0.25s ease; cursor:pointer;
}
.proj-row:first-child{ border-top:1px solid var(--line); }
.proj-row .rname{ font-family:'Playfair Display',serif; font-size:clamp(20px,2vw,28px); }
.proj-row .rsize, .proj-row .rloc{ font-size:13px; letter-spacing:0.06em; text-transform:uppercase; }
.proj-row .rarrow{ font-size:18px; text-align:right; }
.proj-row:hover{ background:var(--ink); color:var(--cream); }
.table-cta{ margin-top:56px; }
@media (max-width:700px){
  .proj-row{ grid-template-columns:1fr 40px; grid-template-areas:"name arrow" "size loc"; row-gap:6px; }
  .proj-row .rname{ grid-area:name; }
  .proj-row .rarrow{ grid-area:arrow; }
  .proj-row .rsize{ grid-area:size; }
  .proj-row .rloc{ grid-area:loc; text-align:right; }
}

/* Vision — title + copy + photo pair + note/CTA, closing manifesto line */
.vision{
  position:relative; padding:160px 48px 120px; max-width:1500px; margin:0 auto;
  display:grid; grid-template-columns:0.9fr 1fr 1fr; column-gap:32px; row-gap:56px;
  grid-template-areas:
    "title copy copy"
    "note photoa photob";
  overflow:hidden;
}
.vision::before{
  content:""; position:absolute; top:20px; left:-140px; width:520px; height:520px;
  border:1px solid var(--line); border-radius:50%; pointer-events:none;
}
.vision-title{
  grid-area:title; font-family:'Playfair Display',serif; font-weight:600; font-size:clamp(48px,6vw,96px);
  line-height:0.95; letter-spacing:-0.01em;
}
.vision-copy{
  grid-area:copy; font-size:clamp(20px,2vw,28px); line-height:1.55; font-weight:500; text-indent:2.4em;
}
.vision-photo-a{ grid-area:photoa; width:100%; aspect-ratio:4/5; object-fit:cover; }
.vision-photo-b{ grid-area:photob; width:100%; aspect-ratio:4/5; object-fit:cover; }
.vision-note{ grid-area:note; align-self:end; display:flex; flex-direction:column; gap:22px; }
.vision-note .note-text{ display:flex; gap:14px; align-items:flex-start; }
.vision-note .plus{ font-size:20px; line-height:1; color:var(--ink); }
.vision-note p{ font-size:15px; font-weight:600; letter-spacing:0.05em; text-transform:uppercase; color:var(--ink); line-height:1.6; }
.vision-note .btn-arrow{ align-self:flex-start; }
@media (max-width:1000px){
  .vision{ grid-template-columns:1fr; grid-template-areas:"title" "copy" "photoa" "photob" "note"; padding:120px 24px 80px; row-gap:32px; }
  .vision-copy{ text-indent:0; }
  .vision::before{ display:none; }
}

.manifesto{
  max-width:1100px; margin:0 auto; padding:0 48px 160px;
  font-family:'Playfair Display',serif; font-weight:500; font-size:clamp(34px,4.6vw,64px);
  line-height:1.2; letter-spacing:-0.01em;
}
@media (max-width:900px){
  .manifesto{ padding:0 24px 100px; }
}

/* Inspiration — full-bleed image band + tan statement strip */
.inspiration-hero{
  position:relative; height:80vh; min-height:560px; width:100%; overflow:hidden;
  display:flex; align-items:flex-start; justify-content:center; text-align:center;
}
.inspiration-hero img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.inspiration-hero::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(0,0,0,0.45) 0%, rgba(0,0,0,0.05) 35%, rgba(0,0,0,0.05) 70%, rgba(0,0,0,0.25) 100%);
}
.inspiration-hero-content{ position:relative; z-index:2; color:#fff; padding-top:64px; max-width:640px; }
.inspiration-hero-content h2{
  font-family:'Playfair Display',serif; font-weight:500; font-size:clamp(40px,6vw,80px);
}
.inspiration-hero-content p{ margin-top:60px; font-size:20px; font-weight:600; line-height:1.6; opacity:0.95; }
.inspiration-band{
  background:var(--tan); padding:80px 48px; display:flex; flex-direction:column; gap:40px; align-items:flex-start;
}
.inspiration-band p{
  font-family:'Playfair Display',serif; font-size:clamp(24px,3vw,38px); line-height:1.35; max-width:900px; color:var(--ink);
}
@media (max-width:900px){
  .inspiration-band{ padding:56px 24px; }
}

/* Showcase — categorized photo strips, "crown jewel" mood board */
.showcase{ background:var(--tan); }
.showcase-row{
  display:grid; grid-template-columns:260px 1fr; gap:40px; padding:56px 48px;
  border-top:1px solid rgba(21,23,26,0.18);
}
.showcase-row:last-child{ border-bottom:1px solid rgba(21,23,26,0.18); }
.showcase-label{ display:flex; gap:14px; align-items:flex-start; }
.showcase-label .plus{ font-size:18px; color:var(--ink); line-height:1.2; }
.showcase-label-text{ display:flex; flex-direction:column; gap:24px; }
.showcase-label-text .name{ font-family:'Playfair Display',serif; font-weight:600; font-size:22px; }
.showcase-label-text .caption{
  font-size:11px; letter-spacing:0.05em; text-transform:uppercase; color:var(--ink); line-height:1.7; max-width:220px;
}
.showcase-photos{ display:grid; grid-template-columns:repeat(5,1fr); gap:3px; }
.showcase-photos img{ width:100%; aspect-ratio:4/5; object-fit:cover; transition:transform 0.8s cubic-bezier(.2,.8,.2,1); }
.showcase-photos img:hover{ transform:scale(1.04); }
@media (max-width:1000px){
  .showcase-row{ grid-template-columns:1fr; gap:20px; padding:40px 24px; }
  .showcase-photos{ grid-template-columns:repeat(3,1fr); }
}
@media (max-width:600px){
  .showcase-photos{ grid-template-columns:repeat(2,1fr); }
}

/* Split-reveal — letters animate in left to right on scroll, used for big headings */
.split-reveal .word{ display:inline-block; white-space:nowrap; }
.split-reveal .char{
  display:inline-block; opacity:0; transform:translateX(-18px);
  transition:opacity 0.6s ease, transform 0.6s ease;
}
.split-reveal.in-view .char{ opacity:1; transform:translateX(0); }
@media (prefers-reduced-motion: reduce){
  .split-reveal .char{ opacity:1 !important; transform:none !important; transition:none !important; }
}

/* Mega footer */
.footer-mega{ background:var(--tan); }
.footer-photos{ display:grid; grid-template-columns:repeat(5,1fr); gap:3px; }
.footer-photos img{ width:100%; aspect-ratio:5/4; object-fit:cover; }
.footer-brand-wrap{ padding:100px 48px 56px; text-align:center; overflow:hidden; }
.footer-brand{
  font-family:'Playfair Display',serif; font-weight:600; text-transform:uppercase;
  font-size:clamp(48px,10vw,150px); letter-spacing:0.01em; line-height:0.9;
}
.footer-sub{
  font-family:'Playfair Display',serif; font-weight:600; letter-spacing:0.35em; text-transform:uppercase;
  font-size:clamp(14px,2vw,26px); margin-top:20px;
}
.footer-columns{
  display:grid; grid-template-columns:1.1fr 1fr 1fr 1fr; gap:32px;
  padding:0 48px 72px; max-width:1500px; margin:0 auto;
}
.footer-columns .plus-nav{ display:flex; gap:14px; }
.footer-columns .plus-nav .plus{ font-size:20px; color:var(--ink); }
.footer-nav-links{ display:flex; flex-direction:column; gap:8px; }
.footer-nav-links a{ font-family:'Playfair Display',serif; font-size:19px; transition:opacity 0.25s ease; }
.footer-nav-links a:hover{ opacity:0.55; }
.footer-columns .head{ font-size:14px; font-weight:600; margin-bottom:16px; }
.footer-columns a, .footer-columns p{
  display:block; font-size:13px; letter-spacing:0.03em; margin-bottom:6px; color:var(--ink); line-height:1.6;
}
.footer-columns a{ transition:opacity 0.25s ease; }
.footer-columns a:hover{ opacity:0.55; }
.footer-loc-group{ margin-bottom:28px; }
.footer-bottom{
  background:var(--ink); color:#fff; padding:22px 48px;
  display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px;
  font-size:11px; letter-spacing:0.08em; text-transform:uppercase;
}
.footer-bottom .legal{ display:flex; gap:24px; }
.footer-bottom a{ color:#fff; opacity:0.75; transition:opacity 0.25s ease; }
.footer-bottom a:hover{ opacity:1; }
@media (max-width:1000px){
  .footer-columns{ grid-template-columns:1fr 1fr; }
  .footer-photos{ grid-template-columns:repeat(3,1fr); }
}
@media (max-width:600px){
  .footer-columns{ grid-template-columns:1fr; }
  .footer-photos{ grid-template-columns:repeat(2,1fr); }
  .footer-bottom{ flex-direction:column; align-items:flex-start; }
}

/* Archidomo-style stacked project rows */
.arch-project{
  display:grid; grid-template-columns:1fr 1fr; gap:0 64px;
  max-width:1600px; margin:0 auto; padding:100px 48px; border-bottom:1px solid var(--line);
  align-items:start;
}
.arch-project-left{ padding-top:20px; }
.arch-project-title{
  font-family:'Playfair Display',serif; font-weight:600; font-size:clamp(40px,5vw,80px);
  line-height:0.98; letter-spacing:-0.01em; margin-bottom:32px;
}
.arch-project-meta{ display:flex; gap:20px; flex-wrap:wrap; margin-bottom:40px; }
.arch-project-meta span{
  font-size:12px; letter-spacing:0.06em; font-family:monospace,'Playfair Display',serif;
  border:1px solid var(--line); padding:6px 12px;
}
.arch-project-copy{
  font-size:13px; letter-spacing:0.03em; text-transform:uppercase; color:var(--ink);
  line-height:1.7; max-width:340px; margin-bottom:40px;
}
.arch-project-photo-small{ width:70%; aspect-ratio:4/5; overflow:hidden; }
.arch-project-photo-small img{ width:100%; height:100%; object-fit:cover; }
.arch-project-photo-large{ width:100%; aspect-ratio:4/5; overflow:hidden; }
.arch-project-photo-large img{ width:100%; height:100%; object-fit:cover; transition:transform 0.6s ease; }
.arch-project:hover .arch-project-photo-large img{ transform:scale(1.03); }
@media (max-width:1000px){
  .arch-project{ grid-template-columns:1fr; padding:64px 24px; gap:32px; }
  .arch-project-photo-small{ width:100%; }
}

/* Sections */.section{ padding:140px 48px; max-width:1400px; margin:0 auto; }
.section.narrow{ max-width:820px; }
.eyebrow{ font-size:12px; letter-spacing:0.18em; text-transform:uppercase; color:var(--ink); margin-bottom:24px; }
.statement{ font-family:'Playfair Display',serif; font-size:clamp(26px,3.4vw,44px); line-height:1.35; font-weight:500; }
.statement em{ font-style:normal; color:var(--ink); }
.eyebrow.reveal + .statement.reveal{ transition-delay:0.12s; }

/* Project grid */
.grid{
  display:grid; grid-template-columns:repeat(2,1fr); gap:4px; margin-top:64px;
}
.card{ position:relative; overflow:hidden; aspect-ratio:4/5; }
.card img{ width:100%; height:100%; object-fit:cover; transition:transform 1.1s cubic-bezier(.2,.8,.2,1); }
.card:hover img{ transform:scale(1.05); }
.card .meta{
  position:absolute; left:0; right:0; bottom:0; padding:28px;
  background:linear-gradient(180deg, transparent, rgba(0,0,0,0.6));
  color:#fff;
}
.card .meta .name{ font-family:'Playfair Display',serif; font-size:24px; margin-bottom:8px; }
.card .meta .tags{ font-size:11px; letter-spacing:0.1em; text-transform:uppercase; opacity:0.85; }
.card .meta .tags span:not(:last-child)::after{ content:"/"; margin:0 8px; opacity:0.6; }

.grid.wide{ grid-template-columns:repeat(3,1fr); }
@media (max-width:900px){
  .grid, .grid.wide{ grid-template-columns:1fr; }
  .section{ padding:90px 24px; }
  .hero-content{ padding:0 24px 48px; }
  .nav{ padding:22px 24px; }
}

/* Footer */
.footer{
  border-top:1px solid var(--line);
  padding:64px 48px; display:flex; justify-content:space-between; align-items:flex-end;
  max-width:1400px; margin:0 auto;
}
.footer .mark{ font-family:'Playfair Display',serif; font-size:22px; }
.footer .cols{ display:flex; gap:80px; }
.footer .col{ font-size:12px; letter-spacing:0.06em; }
.footer .col .head{ text-transform:uppercase; letter-spacing:0.14em; color:var(--ink); margin-bottom:14px; }
.footer .col a{ display:block; margin-bottom:8px; transition:opacity 0.25s ease; }
.footer .col a:hover{ opacity:0.55; }
@media (max-width:900px){
  .footer{ flex-direction:column; gap:40px; align-items:flex-start; }
  .footer .cols{ gap:48px; flex-wrap:wrap; }
}

/* Contact page */
.contact-split{ display:grid; grid-template-columns:1fr 1fr; gap:0; min-height:100vh; }
.contact-split .info{ padding:160px 64px 64px; display:flex; flex-direction:column; justify-content:center; }
.contact-split .photo{ position:relative; }
.contact-split .photo img{ width:100%; height:100%; object-fit:cover; position:absolute; inset:0; }
.contact-split .photo{ background:linear-gradient(150deg, #3d463f 0%, #262b25 55%, #1a1e19 100%); }
.contact-split h1{ font-family:'Playfair Display',serif; font-size:clamp(32px,4vw,56px); font-weight:500; margin-bottom:28px; }
.contact-split p{ max-width:440px; color:var(--ink); font-size:16px; line-height:1.7; margin-bottom:40px; }
.detail-row{ margin-bottom:28px; }
.detail-row .head{ font-size:11px; letter-spacing:0.14em; text-transform:uppercase; color:var(--ink); margin-bottom:6px; }
.detail-row .val{ font-size:18px; }
@media (max-width:900px){
  .contact-split{ grid-template-columns:1fr; }
  .contact-split .photo{ height:50vh; }
  .contact-split .info{ padding:120px 24px 64px; }
}

/* Archidomo-style contact layout */
.contact-arch{
  position:relative; padding:130px 48px 60px; max-width:1600px; margin:0 auto;
  display:grid; grid-template-columns:1fr 1.3fr 1fr; column-gap:56px; row-gap:24px;
  grid-template-areas:
    "title copy photo"
    "title details photo"
    "smallphoto locations photo";
  align-items:start;
}
.contact-arch-title{
  font-family:'Playfair Display',serif; font-weight:600; font-size:clamp(48px,6.5vw,110px);
  line-height:0.92; letter-spacing:-0.01em; grid-area:title; align-self:start;
}
.contact-arch-copy{
  grid-area:copy; font-size:clamp(20px,2vw,28px); line-height:1.5; font-weight:500;
}
.contact-arch-details{ grid-area:details; margin-top:16px; display:flex; flex-direction:column; gap:8px; align-self:start; }
.contact-arch-details a{ font-size:clamp(22px,2.2vw,30px); font-weight:700; transition:opacity 0.25s ease; }
.contact-arch-details a:hover{ opacity:0.55; }
.contact-arch-locations{ grid-area:locations; margin-top:16px; display:flex; gap:32px; flex-wrap:nowrap; align-self:start; }
.contact-arch-locations > div{ flex:1; min-width:0; }
.contact-arch-locations .head{ font-family:'Playfair Display',serif; font-size:15px; font-weight:500; margin-bottom:12px; white-space:nowrap; }
.contact-arch-locations p{ font-size:12px; letter-spacing:0.04em; text-transform:uppercase; color:var(--ink); line-height:1.7; }
.contact-arch-photo-small{
  grid-area:smallphoto; align-self:start; width:100%; aspect-ratio:16/11; overflow:hidden;
}
.contact-arch-photo-small img{ width:100%; height:100%; object-fit:cover; }
.contact-arch-photo-large{
  grid-area:photo; width:100%; height:100%; min-height:480px; overflow:hidden;
}
.contact-arch-photo-large img{ width:100%; height:100%; object-fit:cover; }
@media (max-width:1100px){
  .contact-arch{ grid-template-columns:1fr; grid-template-areas:"title" "copy" "details" "locations" "smallphoto" "photo"; padding:130px 24px 70px; row-gap:32px; }
  .contact-arch-photo-large{ min-height:340px; }
}
@media (max-width:640px){
  .contact-arch-locations{ flex-direction:column; gap:20px; }
  .contact-arch-locations .head{ white-space:normal; }
}

.page-hero{
  padding:200px 48px 80px; max-width:1400px; margin:0 auto;
}
.page-hero h1{ font-family:'Playfair Display',serif; font-weight:500; font-size:clamp(40px,6vw,72px); }
/* Immersive gallery sections */
.gallery-section{
  position:relative; height:100vh; min-height:600px; width:100%;
  overflow:hidden; display:flex; align-items:flex-end;
  cursor:pointer;
}
.gallery-section img{
  position:absolute; top:-10%; left:-5%; width:110%; height:120%; object-fit:cover;
  will-change:transform;
}
.gallery-section::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(0,0,0,0.02) 40%, rgba(0,0,0,0.62) 100%);
}
.gallery-meta{
  position:relative; z-index:2; color:#fff; width:100%;
  padding:0 48px 56px; display:flex; justify-content:space-between; align-items:flex-end; gap:24px;
}
.gallery-meta .index{
  font-family:'Playfair Display',serif; font-size:18px; font-weight:600; opacity:0.9;
}
.gallery-meta .name{
  font-family:'Playfair Display',serif; font-size:clamp(30px,4vw,54px); font-weight:500; margin-bottom:10px;
}
.gallery-meta .tags{ font-size:15px; font-weight:600; letter-spacing:0.1em; text-transform:uppercase; opacity:0.95; }
.gallery-meta .tags span:not(:last-child)::after{ content:"/"; margin:0 8px; opacity:0.6; }
.gallery-meta .view{
  font-size:11px; letter-spacing:0.14em; text-transform:uppercase; opacity:0.75;
  border:1px solid rgba(255,255,255,0.4); padding:10px 18px; white-space:nowrap;
  transition:background 0.3s ease, color 0.3s ease, border-color 0.3s ease;
}
.gallery-section:hover .view{ background:#fff; color:#111; opacity:1; }
@media (max-width:900px){
  .gallery-meta{ padding:0 24px 40px; flex-direction:column; align-items:flex-start; gap:14px; }
}

/* Lightbox */
.lightbox{
  position:fixed; inset:0; background:rgba(10,10,8,0.97); z-index:300;
  display:flex; align-items:center; justify-content:center;
  opacity:0; pointer-events:none; transition:opacity 0.45s ease;
}
.lightbox.open{ opacity:1; pointer-events:auto; }
.lightbox figure{ margin:0; max-width:90vw; max-height:86vh; display:flex; flex-direction:column; align-items:center; gap:20px; }
.lightbox img{
  max-width:90vw; max-height:78vh; object-fit:contain;
  box-shadow:0 40px 100px rgba(0,0,0,0.5);
  opacity:0; transform:scale(0.97); transition:opacity 0.4s ease, transform 0.4s ease;
}
.lightbox.open img{ opacity:1; transform:scale(1); }
.lightbox figcaption{ color:#fff; text-align:center; }
.lightbox figcaption .name{ font-family:'Playfair Display',serif; font-size:20px; margin-bottom:6px; }
.lightbox figcaption .tags{ font-size:11px; letter-spacing:0.12em; text-transform:uppercase; opacity:0.65; }
.lightbox figcaption .tags span:not(:last-child)::after{ content:"/"; margin:0 8px; opacity:0.5; }
.lightbox-close, .lightbox-prev, .lightbox-next{
  position:fixed; color:#fff; background:none; border:none; cursor:pointer;
  font-family:'Playfair Display',serif; font-size:15px; letter-spacing:0.04em;
  padding:12px; opacity:0.75; transition:opacity 0.2s ease;
}
.lightbox-close:hover, .lightbox-prev:hover, .lightbox-next:hover{ opacity:1; }
.lightbox-close{ top:28px; right:40px; }
.lightbox-prev{ left:24px; top:50%; transform:translateY(-50%); font-size:28px; }
.lightbox-next{ right:24px; top:50%; transform:translateY(-50%); font-size:28px; }
@media (max-width:900px){
  .lightbox-close{ top:16px; right:16px; }
  .lightbox-prev{ left:6px; }
  .lightbox-next{ right:6px; }
}
