:root{--ink:#17211d;--pine:#243d34;--sage:#9cae9f;--sand:#ede9df;--cream:#f7f5ef;--gold:#ae8d56;--white:#fff}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--cream);color:var(--ink);font-family:"DM Sans",sans-serif}
a{color:inherit;text-decoration:none}
.site-header{height:88px;padding:0 5vw;display:flex;align-items:center;justify-content:space-between;background:rgba(247,245,239,.96);position:fixed;inset:0 0 auto;z-index:20;border-bottom:1px solid rgba(23,33,29,.1)}
.brand{font-family:"Libre Caslon Display",serif;font-size:31px;letter-spacing:-1.5px}
.brand span{color:var(--gold)}
nav{display:flex;gap:30px;font-size:13px}
nav a{transition:.2s}
nav a:hover{color:var(--gold)}
.menu-button{display:none;background:none;border:1px solid var(--ink);padding:8px 13px}
.hero{height:100vh;min-height:700px;position:relative;color:#fff;background:linear-gradient(120deg,#1e3029 0%,#446054 47%,#a09073 100%);overflow:hidden}
.hero:after{content:"";position:absolute;width:55vw;height:90vh;right:-8vw;bottom:-25vh;border:1px solid rgba(255,255,255,.22);border-radius:50% 50% 0 0;transform:rotate(-17deg)}
.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(10,22,17,.5),transparent 70%)}
.hero-content{position:absolute;left:9vw;top:50%;transform:translateY(-45%);z-index:2;max-width:800px}
.eyebrow{text-transform:uppercase;letter-spacing:2.5px;font-size:11px;font-weight:600;margin:0 0 30px}
.eyebrow.dark{color:#66736d}
.hero h1,.section h2{font-family:"Libre Caslon Display",serif;font-weight:400}
.hero h1{font-size:clamp(58px,7.8vw,112px);line-height:.95;letter-spacing:-4px;margin:0 0 30px}
.hero-copy{font-size:18px;line-height:1.65;max-width:570px;margin-bottom:35px}
.button{display:inline-block;padding:15px 23px;border:1px solid}
.button.light{border-color:rgba(255,255,255,.7)}
.hero-index{position:absolute;right:5vw;bottom:45px;z-index:2;display:flex;align-items:center;gap:14px;font-size:10px;text-transform:uppercase;letter-spacing:2px}
.hero-index i{width:70px;height:1px;background:#fff}
.section{padding:120px 9vw}
.intro{display:grid;grid-template-columns:1fr 1fr;gap:10vw}
.section h2{font-size:clamp(44px,5vw,72px);line-height:1.05;letter-spacing:-2px;margin:0}
.intro-copy{font-size:18px;line-height:1.8;padding-top:45px}
.sectors{background:var(--sand)}
.sector-grid{display:grid;grid-template-columns:repeat(4,1fr);margin-top:65px;border-top:1px solid #bdb9af}
.sector-grid article{padding:30px 30px 30px 0;border-right:1px solid #bdb9af;min-height:270px}
.sector-grid article+article{padding-left:30px}
.sector-grid article:last-child{border-right:0}
.sector-grid span{font-size:11px;color:#7a817d}
.sector-grid h3{font-family:"Libre Caslon Display",serif;font-size:29px;font-weight:400;margin:50px 0 18px}
.sector-grid p{font-size:14px;line-height:1.65;color:#58615d}
.portfolio{background:var(--pine);color:#fff}
.portfolio-heading{display:grid;grid-template-columns:1fr 2fr 1fr;gap:5vw;align-items:end}
.portfolio-heading p:last-child{color:#c6d0cb;line-height:1.7}
.tile-grid{display:grid;grid-template-columns:1.25fr .75fr 1fr;grid-template-rows:300px 380px;gap:8px;padding:0 8px 8px}
.tile{position:relative;min-height:260px;overflow:hidden;background-size:cover;background-position:center}
.tile span{position:absolute;inset:auto 18px 15px;color:rgba(255,255,255,.7);font-size:10px;letter-spacing:2px;text-transform:uppercase}
.tile-a{background:linear-gradient(135deg,#5c7169,#ad9878);grid-row:span 2}
.tile-b{background:linear-gradient(40deg,#8f978e,#e1d6c3)}
.tile-c{background:linear-gradient(150deg,#293b36,#71887c)}
.tile-d{background:linear-gradient(110deg,#c5b9a3,#6c766f)}
.tile-e{background:linear-gradient(30deg,#5e6e66,#b29b7e)}
.tile-f{display:none}
.platforms>h2{margin-bottom:65px}
.platform-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.platform{height:500px;position:relative;color:white;padding:45px;display:flex;align-items:flex-end;overflow:hidden}
.platform:before{content:"";position:absolute;inset:0;transition:.5s}
.platform:hover:before{transform:scale(1.04)}
.platform.medical:before{background:linear-gradient(150deg,rgba(19,46,40,.25),rgba(12,35,30,.9)),linear-gradient(120deg,#739186,#2c5147)}
.platform.arnold:before{background:linear-gradient(150deg,rgba(80,61,37,.05),rgba(55,43,26,.88)),linear-gradient(120deg,#c1a67f,#71654f)}
.platform div{position:relative;z-index:1}
.platform p{font-size:11px;text-transform:uppercase;letter-spacing:2px}
.platform h3{font:400 clamp(45px,5vw,72px)/1 "Libre Caslon Display",serif;margin:12px 0 35px}
.platform span{font-size:13px;border-bottom:1px solid;padding-bottom:6px}
.vision{background:#9aa99e;color:#fff;text-align:center}
.vision blockquote{font:400 clamp(36px,4.5vw,65px)/1.25 "Libre Caslon Display",serif;max-width:1000px;margin:0 auto}
footer{background:#15251f;color:#dbe2de;padding:75px 9vw 35px;display:grid;grid-template-columns:2fr 1fr 1fr;gap:40px;position:relative}
.footer-brand{color:#fff}
footer p,footer a{display:block;font-size:13px;line-height:2;color:#aab7b1}
.footer-label{color:#fff;text-transform:uppercase;letter-spacing:2px;font-size:10px}
.copyright{grid-column:1/-1;border-top:1px solid #425049;padding-top:25px;margin-top:40px}
.reveal{animation:rise .9s ease-out both}
@keyframes rise{from{opacity:0;transform:translateY(-35%)}
to{opacity:1;transform:translateY(-45%)}
}
@media(max-width:800px){.site-header{height:70px}
.menu-button{display:block}
nav{display:none;position:absolute;top:70px;left:0;right:0;background:var(--cream);padding:25px 5vw;flex-direction:column}
nav.open{display:flex}
.hero{min-height:650px}
.hero-content{left:7vw;right:7vw}
.hero h1{letter-spacing:-2px}
.section{padding:80px 7vw}
.intro,.portfolio-heading{grid-template-columns:1fr}
.intro-copy{padding-top:0}
.sector-grid{grid-template-columns:1fr 1fr}
.sector-grid article:nth-child(2){border-right:0}
.tile-grid{grid-template-columns:1fr 1fr;grid-template-rows:260px 260px}
.tile-a{grid-row:span 1}
.tile-e{display:none}
.platform-grid{grid-template-columns:1fr}
.platform{height:390px}
footer{grid-template-columns:1fr 1fr}
}
@media(max-width:520px){.sector-grid{grid-template-columns:1fr}
.sector-grid article,.sector-grid article+article{padding-left:0;border-right:0}
.tile-grid{grid-template-columns:1fr;grid-template-rows:repeat(4,240px)}
footer{grid-template-columns:1fr}
.copyright{grid-column:1}
}

/* Compact, layered project collage */
.hero-index{display:block}
.hero-index i,.hero-index span:first-child:not(:last-child){display:none}
.tile-grid{display:block;height:570px;max-width:1360px;margin:0 auto;padding:25px 5vw 45px;position:relative}
.tile{position:absolute;margin:0;min-height:0;overflow:hidden;background:#20362e;box-shadow:0 18px 42px rgba(7,18,14,.28);transition:transform .35s ease,box-shadow .35s ease}
.tile img{width:100%;height:100%;display:block;object-fit:cover}
.tile:hover{z-index:12;transform:translateY(-7px);box-shadow:0 24px 55px rgba(7,18,14,.4)}
.tile-a{left:5%;top:30px;width:31%;height:250px;z-index:2}
.tile-b{left:32%;top:0;width:30%;height:205px;z-index:4}
.tile-c{left:59%;top:38px;width:20%;height:235px;z-index:3}
.tile-d{right:4%;top:10px;width:20%;height:190px;z-index:5}
.tile-e{left:8%;top:255px;width:22%;height:205px;z-index:5}
.tile-f{display:block;left:27%;top:190px;width:29%;height:260px;z-index:6}
.tile-g{left:53%;top:245px;width:24%;height:205px;z-index:4}
.tile-h{right:5%;top:180px;width:22%;height:235px;z-index:7}
.tile-i{right:18%;top:390px;width:18%;height:145px;z-index:8}
@media(max-width:800px){
  .tile-grid{height:auto;padding:0 7vw 70px;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:none;gap:10px}
  .tile,.tile-a,.tile-b,.tile-c,.tile-d,.tile-e,.tile-f,.tile-g,.tile-h,.tile-i{position:relative;inset:auto;width:auto;height:190px;display:block}
  .tile-a,.tile-f{grid-column:span 2;height:230px}
  .tile:hover{transform:none}
}
@media(max-width:520px){
  .tile-grid{grid-template-columns:1fr}
  .tile,.tile-a,.tile-b,.tile-c,.tile-d,.tile-e,.tile-f,.tile-g,.tile-h,.tile-i{grid-column:auto;height:190px}
  .tile-a,.tile-f{height:220px}
}

/* Orderly portfolio mosaic contained within the portfolio background */
.tile-grid{height:auto;max-width:1500px;margin:0 auto;padding:0 5vw 90px;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));grid-auto-rows:180px;gap:10px;position:relative}
.tile,.tile-a,.tile-b,.tile-c,.tile-d,.tile-e,.tile-f,.tile-g,.tile-h,.tile-i,.tile-j,.tile-k,.tile-l,.tile-m,.tile-n,.tile-o{position:relative;inset:auto;width:auto;height:auto;min-height:0;margin:0;display:block;box-shadow:none;z-index:auto}
.tile img{width:100%;height:100%;object-fit:cover}
.tile-a,.tile-f,.tile-j{grid-column:span 2}
.tile-b,.tile-l{grid-row:span 2}
.tile:hover{z-index:auto;transform:none;box-shadow:none}
@media(max-width:1000px){
  .tile-grid{grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:190px}
  .tile-a,.tile-f,.tile-j{grid-column:span 2}
}
@media(max-width:650px){
  .tile-grid{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:170px;padding:0 5vw 65px}
  .tile,.tile-a,.tile-b,.tile-c,.tile-d,.tile-e,.tile-f,.tile-g,.tile-h,.tile-i,.tile-j,.tile-k,.tile-l,.tile-m,.tile-n,.tile-o{grid-column:auto;grid-row:auto;height:auto}
  .tile-a,.tile-f,.tile-j{grid-column:span 2}
}

/* Even edge-to-edge gallery: 14 images in two equal rows */
.tile-grid{width:100%;max-width:none;padding:0 14px 70px;grid-template-columns:repeat(7,minmax(0,1fr));grid-auto-rows:190px;gap:8px}
.tile,.tile-a,.tile-b,.tile-c,.tile-d,.tile-e,.tile-f,.tile-g,.tile-h,.tile-i,.tile-k,.tile-l,.tile-m,.tile-n,.tile-o{grid-column:auto;grid-row:auto;height:auto}
@media(max-width:1000px){
  .tile-grid{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:190px;padding:0 10px 60px;gap:8px}
  .tile,.tile-a,.tile-b,.tile-c,.tile-d,.tile-e,.tile-f,.tile-g,.tile-h,.tile-i,.tile-k,.tile-l,.tile-m,.tile-n,.tile-o{grid-column:auto;grid-row:auto}
}
@media(max-width:520px){
  .tile-grid{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:145px;padding-left:7px;padding-right:7px;gap:6px}
}

/* Balanced 13-image gallery: one generous feature image fills the final cell */
.tile-grid{grid-auto-rows:230px;padding-left:12px;padding-right:12px;gap:9px}
.tile-a{grid-column:auto}
.tile-c{grid-column:span 2}
@media(max-width:1000px){
  .tile-grid{grid-auto-rows:220px}
  .tile-a{grid-column:auto}
  .tile-c{grid-column:span 2}
}
@media(max-width:520px){
  .tile-grid{grid-auto-rows:175px}
  .tile-a{grid-column:auto}
  .tile-c{grid-column:span 2}
}

/* Kingston and Friday Apartments stacked within one aligned gallery block */
.tile-stack{grid-column:span 3;height:230px;display:grid;grid-template-rows:3fr 2fr;gap:9px;overflow:hidden}
.tile-stack .tile-b,.tile-stack .tile-c{position:relative;inset:auto;width:100%;height:100%;grid-column:auto;grid-row:auto;margin:0}
@media(max-width:1000px){
  .tile-stack{grid-column:span 2;height:300px;grid-template-rows:3fr 2fr}
  .tile-o{grid-column:span 2}
}
@media(max-width:520px){
  .tile-stack{grid-column:span 2;height:270px;gap:6px}
  .tile-o{grid-column:span 2}
}

/* Numbered project gallery: edit order by replacing Photo1–Photo13 assets. */
.numbered-gallery{
  width:100%;
  padding:0 12px 75px;
  display:grid;
  gap:10px;
}
.gallery-row{display:grid;gap:10px;min-width:0}
.gallery-row-1{grid-template-columns:1fr 1fr;height:552px}
.gallery-stack{
  display:grid;
  grid-template-rows:minmax(0,1fr) minmax(0,1fr);
  gap:10px;
  min-width:0;
  min-height:0;
}
.gallery-row-2,.gallery-row-3{
  grid-template-columns:repeat(3,minmax(0,1fr));
  height:304px;
}
.gallery-row-4{
  grid-template-columns:repeat(4,minmax(0,1fr));
  height:304px;
}
.gallery-photo{margin:0;overflow:hidden;min-width:0;min-height:0;background:#20362e}
.gallery-photo img{width:100%;height:100%;display:block;object-fit:cover}

@media(max-width:800px){
  .numbered-gallery{padding:0 10px 65px;gap:8px}
  .gallery-row,.gallery-stack{gap:8px}
  .gallery-row-1{grid-template-columns:1fr;height:auto}
  .gallery-row-1>.photo-1{height:300px}
  .gallery-stack{height:380px}
  .gallery-row-2,.gallery-row-3{grid-template-columns:1fr;height:auto}
  .gallery-row-2 .gallery-photo,.gallery-row-3 .gallery-photo{height:242px}
  .gallery-row-4{grid-template-columns:repeat(2,minmax(0,1fr));height:auto}
  .gallery-row-4 .gallery-photo{height:220px}
}
@media(max-width:520px){
  .numbered-gallery{padding-left:7px;padding-right:7px;gap:6px}
  .gallery-row,.gallery-stack{gap:6px}
  .gallery-row-1>.photo-1{height:240px}
  .gallery-stack{height:330px}
  .gallery-row-2 .gallery-photo,.gallery-row-3 .gallery-photo{height:210px}
  .gallery-row-4{grid-template-columns:1fr}
  .gallery-row-4 .gallery-photo{height:210px}
}