/* ============================================================
   STRATA US — design tokens
   Concept: architectural drawing set / property titleblock.
   Blueprint paper, ruled hairlines, corner registration ticks,
   dimension-line stats, mono data callouts — pulled straight
   from the survey & parcel data (SF, acreage, frontage, zoning)
   that runs through Strata's own deal sheets.
   ============================================================ */

/* ---------- self-hosted fonts (fonts/) ---------- */
@font-face{ font-family:"Big Shoulders Display"; font-style:normal; font-weight:600; font-display:swap; src:url("../fonts/big-shoulders-display-latin-600-normal.woff2") format("woff2"); }
@font-face{ font-family:"Big Shoulders Display"; font-style:normal; font-weight:700; font-display:swap; src:url("../fonts/big-shoulders-display-latin-700-normal.woff2") format("woff2"); }
@font-face{ font-family:"Big Shoulders Display"; font-style:normal; font-weight:800; font-display:swap; src:url("../fonts/big-shoulders-display-latin-800-normal.woff2") format("woff2"); }
@font-face{ font-family:"IBM Plex Mono"; font-style:normal; font-weight:400; font-display:swap; src:url("../fonts/ibm-plex-mono-latin-400-normal.woff2") format("woff2"); }
@font-face{ font-family:"IBM Plex Mono"; font-style:normal; font-weight:500; font-display:swap; src:url("../fonts/ibm-plex-mono-latin-500-normal.woff2") format("woff2"); }
@font-face{ font-family:"IBM Plex Mono"; font-style:normal; font-weight:600; font-display:swap; src:url("../fonts/ibm-plex-mono-latin-600-normal.woff2") format("woff2"); }
@font-face{ font-family:"IBM Plex Sans"; font-style:normal; font-weight:400; font-display:swap; src:url("../fonts/ibm-plex-sans-latin-400-normal.woff2") format("woff2"); }
@font-face{ font-family:"IBM Plex Sans"; font-style:normal; font-weight:500; font-display:swap; src:url("../fonts/ibm-plex-sans-latin-500-normal.woff2") format("woff2"); }
@font-face{ font-family:"IBM Plex Sans"; font-style:normal; font-weight:600; font-display:swap; src:url("../fonts/ibm-plex-sans-latin-600-normal.woff2") format("woff2"); }

:root{
  --ink:        #101E2B;   /* primary text / deep panels */
  --navy:       #1B3350;   /* secondary panel navy */
  --navy-soft:  #2C4A6E;
  --brick:      #B75B2E;   /* accent — terracotta / brick */
  --brick-hi:   #D97F45;   /* accent hover / highlight */
  --paper:      #E9EDE8;   /* cool blueprint paper */
  --paper-hi:   #F4F6F2;   /* lighter paper panel */
  --line:       #C3CBC2;   /* hairline rule */
  --line-dark:  rgba(233,237,232,0.28);
  --ink-soft:   #4C5A5C;   /* muted text on paper */
  --white:      #FFFFFF;
  --sheet-radius: 2px;

  --font-display: "Big Shoulders Display", sans-serif;
  --font-body: "IBM Plex Sans", sans-serif;
  --font-mono: "IBM Plex Mono", monospace;
}

*, *::before, *::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--font-body);
  font-size:16px;
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
}
img{ max-width:100%; height:auto; display:block; }
picture{ display:contents; }
picture source{ display:none; } /* keep <source> from becoming a grid/flex item */
a{ color:inherit; }
h1,h2,h3,h4{ font-family:var(--font-display); margin:0; font-weight:700; letter-spacing:.01em; }
p{ margin:0 0 1em; }
.container{ max-width:1180px; margin:0 auto; padding:0 28px; }

@media (prefers-reduced-motion: reduce){
  *{ animation-duration:0.001ms !important; transition-duration:0.001ms !important; scroll-behavior:auto !important; }
}

/* ---------- utility: mono eyebrow / sheet labels ---------- */
.eyebrow{
  font-family:var(--font-mono);
  font-size:12.5px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--brick);
  display:flex;
  align-items:center;
  gap:10px;
  margin-bottom:14px;
}
.eyebrow::before{
  content:"";
  width:22px; height:1px;
  background:var(--brick);
  display:inline-block;
}
.eyebrow .sheet-code{ color:var(--ink-soft); }

/* ---------- corner registration ticks (signature motif) ---------- */
.ticked{ position:relative; }
.ticked::before, .ticked::after,
.ticked .tick-br, .ticked .tick-bl{ content:""; position:absolute; width:11px; height:11px; pointer-events:none; }
.ticked::before{ top:-1px; left:-1px; border-top:1.5px solid currentColor; border-left:1.5px solid currentColor; }
.ticked::after{ top:-1px; right:-1px; border-top:1.5px solid currentColor; border-right:1.5px solid currentColor; }
.ticked .tick-bl{ bottom:-1px; left:-1px; border-bottom:1.5px solid currentColor; border-left:1.5px solid currentColor; }
.ticked .tick-br{ bottom:-1px; right:-1px; border-bottom:1.5px solid currentColor; border-right:1.5px solid currentColor; }

/* ============================================================
   NAV
   ============================================================ */
.nav{
  position:fixed; top:0; left:0; right:0; z-index:100;
  background:rgba(16,30,43,0.92);
  backdrop-filter:blur(6px);
  border-bottom:1px solid var(--line-dark);
}
.nav-inner{
  max-width:1180px; margin:0 auto; padding:0 28px;
  height:64px; display:flex; align-items:center; justify-content:space-between;
}
.nav-mark{
  font-family:var(--font-display); font-weight:700; font-size:27px;
  color:var(--white); letter-spacing:.02em; text-decoration:none;
  display:flex; align-items:baseline; gap:10px;
}
.nav-mark em{
  font-style:normal; color:var(--ink);
  background:var(--brick-hi);
  padding:1px 8px 0;
  margin-left:1px;
}
.nav-mark span{ font-family:var(--font-mono); font-size:11px; color:var(--brick-hi); letter-spacing:.1em; }
.nav-links{ display:flex; gap:30px; list-style:none; margin:0; padding:0; }
.nav-links a{
  font-family:var(--font-mono); font-size:12px; letter-spacing:.08em; text-transform:uppercase;
  color:#C9D2D8; text-decoration:none; transition:color .2s;
}
.nav-links a:hover{ color:var(--brick-hi); }
.nav-links a[aria-current="page"]{ color:var(--white); border-bottom:1px solid var(--brick-hi); padding-bottom:3px; }
.nav-links li.nav-cta{ margin-left:8px; }
.nav-links li.nav-cta a{
  background:var(--brick); color:var(--white); padding:9px 14px; border:none;
  font-weight:600; transition:background .2s;
}
.nav-links li.nav-cta a:hover{ background:var(--brick-hi); color:var(--ink); }
.nav-toggle{ display:none; background:none; border:1px solid #3a5068; color:var(--white); font-family:var(--font-mono); font-size:11px; padding:8px 12px; letter-spacing:.08em; cursor:pointer; }
.nav-toggle:focus-visible, .nav-links a:focus-visible, .btn:focus-visible{ outline:2px solid var(--brick-hi); outline-offset:3px; }

@media (max-width:520px){
  .nav-mark{ font-size:22px; }
  .nav-mark span{ display:none; }
}

@media (max-width:920px){
  .nav-links{
    position:fixed; top:64px; left:0; right:0; background:var(--ink);
    flex-direction:column; gap:0; max-height:0; overflow:hidden; transition:max-height .3s ease;
    border-bottom:1px solid var(--line-dark);
  }
  .nav-links.open{ max-height:420px; }
  .nav-links a{ display:block; padding:16px 28px; border-top:1px solid var(--line-dark); }
  .nav-links a[aria-current="page"]{ border-bottom:none; padding-bottom:16px; box-shadow:inset 3px 0 0 var(--brick-hi); }
  .nav-links li.nav-cta{ margin:0; }
  .nav-links li.nav-cta a{ margin:14px 28px 18px; padding:14px; text-align:center; }
  .nav-toggle{ display:block; }
}

/* ---------- buttons ---------- */
.btn{
  display:inline-block; font-family:var(--font-mono); font-size:12.5px; letter-spacing:.1em; text-transform:uppercase;
  text-decoration:none; padding:14px 22px; border:1px solid var(--brick); color:var(--brick); background:transparent;
  cursor:pointer; transition:background .2s, color .2s;
}
.btn:hover{ background:var(--brick); color:var(--white); }
.btn-solid{ background:var(--brick); color:var(--white); }
.btn-solid:hover{ background:var(--brick-hi); color:var(--ink); border-color:var(--brick-hi); }
.btn-light{ border-color:rgba(255,255,255,.55); color:var(--white); }
.btn-light:hover{ background:var(--white); color:var(--ink); border-color:var(--white); }
.btn-row{ display:flex; gap:14px; flex-wrap:wrap; margin-top:28px; }
.btn svg{ width:14px; height:14px; vertical-align:-2px; margin-right:8px; }

/* ============================================================
   HERO
   ============================================================ */
.hero{
  position:relative;
  min-height:100vh;
  display:flex; align-items:flex-end;
  color:var(--white);
  overflow:hidden;
}
.hero-media{ position:absolute; inset:0; z-index:0; }
.hero-media img{ width:100%; height:100%; object-fit:cover; }
.hero-media::after{
  content:"";
  position:absolute; inset:0;
  background:
    linear-gradient(180deg, rgba(16,30,43,.22) 0%, rgba(16,30,43,.24) 30%, rgba(16,30,43,.68) 100%);
}
.hero-content{
  position:relative; z-index:1;
  width:100%;
  padding:160px 0 84px;
}
.hero-grid{
  display:grid; grid-template-columns:1.5fr 1fr; gap:48px; align-items:end;
}
/* Eyebrow labels over photography sit on a dark backing chip so they stay
   legible over bright rooftops / sky, where a text-shadow alone was not enough. */
.hero-eyebrow, .page-head.has-media .eyebrow{
  display:inline-flex; align-items:center; gap:10px;
  font-family:var(--font-mono); font-size:12.5px; letter-spacing:.16em; text-transform:uppercase;
  color:var(--brick-hi); margin-bottom:18px;
  background:rgba(16,30,43,.78); padding:7px 12px 7px 10px;
  border-left:2px solid var(--brick-hi);
  text-shadow:none;
}
.page-head.has-media .eyebrow::before{ display:none; }
.page-head.has-media .eyebrow .sheet-code{ color:#AFC0C6; }
.hero h1{
  font-size:clamp(42px, 6.4vw, 92px);
  line-height:.96;
  text-transform:uppercase;
  text-shadow:0 2px 24px rgba(16,30,43,.55);
  margin-bottom:22px;
}
.hero h1 em{ font-style:normal; color:var(--brick-hi); }
.hero-sub{ font-size:18px; max-width:46ch; color:#DCE3E6; text-shadow:0 1px 12px rgba(16,30,43,.6); }

.titleblock{
  background:rgba(16,30,43,.72);
  border:1px solid rgba(255,255,255,.25);
  color:var(--white);
  font-family:var(--font-mono);
  font-size:12.5px;
  padding:18px 20px;
}
.titleblock-row{
  display:flex; justify-content:space-between; gap:14px;
  padding:8px 0; border-top:1px solid rgba(255,255,255,.14);
}
.titleblock-row:first-child{ border-top:none; padding-top:0; }
.titleblock-row dt{ color:#9FB0BA; letter-spacing:.08em; text-transform:uppercase; }
.titleblock-row dd{ margin:0; text-align:right; color:var(--white); font-weight:500; }
.titleblock{ margin:0; }

@media (max-width:520px){
  .titleblock-row{ flex-direction:column; gap:4px; }
  .titleblock-row dd{ text-align:left; }
}

.scroll-cue{
  position:absolute; bottom:22px; left:50%; transform:translateX(-50%);
  z-index:1; font-family:var(--font-mono); font-size:11px; letter-spacing:.16em;
  color:rgba(255,255,255,.6); text-transform:uppercase;
  display:flex; flex-direction:column; align-items:center; gap:8px;
}
.scroll-cue::after{ content:""; width:1px; height:34px; background:rgba(255,255,255,.4); animation:scrollpulse 1.8s ease-in-out infinite; }
@keyframes scrollpulse{ 0%,100%{opacity:.2} 50%{opacity:1} }

@media (max-width:900px){
  .hero-grid{ grid-template-columns:1fr; }
  .hero-content{ padding:140px 0 40px; }
  .scroll-cue{ display:none; }
}

/* ============================================================
   SECTION SCAFFOLDING
   ============================================================ */
section{ padding:104px 0; position:relative; }
.section-head{ max-width:760px; margin-bottom:56px; }
.section-head h2{ font-size:clamp(32px,4vw,52px); text-transform:uppercase; line-height:1.02; }
.section-head p{ color:var(--ink-soft); font-size:17px; margin-top:16px; max-width:56ch; }

.section-dark{ background:var(--ink); color:var(--paper); }
.section-dark .eyebrow{ color:var(--brick-hi); }
.section-dark .section-head p{ color:#AFC0C6; }
.section-dark .eyebrow .sheet-code{ color:#7E939C; }

.rule{ border:none; border-top:1px solid var(--line); margin:0; }
.section-dark .rule{ border-top:1px solid rgba(233,237,232,.16); }

/* ============================================================
   TRAJECTORY — dimension-line stats
   ============================================================ */
.stat-grid{
  display:grid; grid-template-columns:repeat(6,1fr); gap:0;
  border-top:1px solid rgba(233,237,232,.2);
}
.stat{
  padding:28px 18px 0;
  border-left:1px solid rgba(233,237,232,.2);
}
.stat:last-child{ border-right:1px solid rgba(233,237,232,.2); }
.stat-num{
  font-family:var(--font-display); font-weight:700;
  font-size:clamp(30px,3.4vw,46px); color:var(--white); line-height:1;
}
.dim-line{ position:relative; height:14px; margin:14px 0 12px; }
.dim-line::before{
  content:""; position:absolute; left:0; right:0; top:6px; height:1px; background:var(--brick-hi);
}
.dim-line::after{
  content:""; position:absolute; left:0; top:0; height:14px; width:1px; background:var(--brick-hi);
  box-shadow:calc(100% - 1px) 0 0 var(--brick-hi);
}
.stat-label{ font-family:var(--font-mono); font-size:11.5px; letter-spacing:.06em; color:#AFC0C6; text-transform:uppercase; padding-bottom:26px; }

@media (max-width:980px){ .stat-grid{ grid-template-columns:repeat(3,1fr); } .stat:nth-child(3n){border-right:1px solid rgba(233,237,232,.2);} }
@media (max-width:560px){ .stat-grid{ grid-template-columns:repeat(2,1fr); } }

/* ============================================================
   REGIONS
   ============================================================ */
.region-grid{ display:grid; grid-template-columns:1fr 1fr; gap:1px; background:var(--line); border:1px solid var(--line); }
.region-card{ background:var(--paper-hi); padding:40px; color:var(--ink); }
.region-card h3{ font-size:30px; text-transform:uppercase; margin-bottom:6px; color:var(--ink); }
.region-count{ font-family:var(--font-mono); color:var(--brick); font-size:14px; letter-spacing:.06em; margin-bottom:18px; }
.region-card p{ color:var(--ink-soft); font-size:15px; }
.region-list{ font-family:var(--font-mono); font-size:12.5px; color:var(--ink-soft); margin-top:16px; line-height:1.9; }
@media (max-width:760px){ .region-grid{ grid-template-columns:1fr; } }

/* ============================================================
   PROJECT / TITLEBLOCK CARDS
   ============================================================ */
.card-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:28px; }
.card-grid.two{ grid-template-columns:repeat(3,1fr); }
@media (max-width:980px){ .card-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:640px){ .card-grid{ grid-template-columns:1fr; } }

.pcard{
  background:var(--white);
  border:1px solid var(--line);
  color:var(--ink);
}
.pcard.pre-reveal{ opacity:0; transform:translateY(18px); transition:opacity .6s ease, transform .6s ease; }
.pcard.pre-reveal.in{ opacity:1; transform:none; }
.pcard-media{ aspect-ratio:4/3; overflow:hidden; background:var(--ink); }
.pcard-media img{ width:100%; height:100%; object-fit:cover; transition:transform .5s ease; }
.pcard:hover .pcard-media img{ transform:scale(1.05); }
.pcard-body{ padding:20px 22px 22px; }
.pcard-tag{ font-family:var(--font-mono); font-size:11px; letter-spacing:.08em; color:var(--brick); text-transform:uppercase; margin-bottom:8px; }
.pcard h4{ font-size:22px; text-transform:uppercase; margin-bottom:2px; line-height:1.05; }
.pcard-loc{ color:var(--ink-soft); font-size:13.5px; margin-bottom:14px; }
.pcard-data{ font-family:var(--font-mono); font-size:12px; color:var(--ink-soft); border-top:1px dashed var(--line); padding-top:12px; display:grid; grid-template-columns:1fr 1fr; gap:6px 10px; }
.pcard-data b{ color:var(--ink); font-weight:600; }

/* ============================================================
   PINEWOOD CROSSING — flagship spotlight
   ============================================================ */
.flagship-hero{ position:relative; }
.flagship-media{ position:relative; }
.flagship-media img{ width:100%; height:56vh; min-height:360px; object-fit:cover; }
.flagship-strip{ display:grid; grid-template-columns:2fr 1fr; gap:1px; margin-top:1px; background:var(--line-dark); }
.flagship-strip img{ height:220px; object-fit:cover; width:100%; }
.flagship-strip-single{ grid-template-columns:1fr; }
.flagship-strip-single img{ height:280px; }

.flagship-badge{
  position:absolute; top:24px; left:24px;
  background:var(--brick); color:var(--white);
  font-family:var(--font-mono); font-size:12px; letter-spacing:.1em; text-transform:uppercase;
  padding:8px 14px;
}

.flagship-intro{ display:grid; grid-template-columns:1.3fr 1fr; gap:60px; margin-top:56px; align-items:start; }
.flagship-intro h3{ font-size:38px; text-transform:uppercase; margin-bottom:18px; }
.flagship-intro .lede{ font-size:18px; color:#D3DBDB; max-width:52ch; }

.spec-table{ width:100%; border-collapse:collapse; font-family:var(--font-mono); font-size:13px; }
.spec-table tr{ border-top:1px solid rgba(233,237,232,.18); }
.spec-table tr:first-child{ border-top:none; }
.spec-table td{ padding:11px 0; }
.spec-table td:first-child{ color:#8FA2AB; letter-spacing:.06em; text-transform:uppercase; width:44%; }
.spec-table td:last-child{ color:var(--white); text-align:right; font-weight:500; }

.performance-strip{
  margin-top:56px;
  display:grid; grid-template-columns:repeat(3,1fr); gap:1px;
  background:rgba(233,237,232,.18);
}
.performance-cell{ background:var(--ink); padding:30px 26px; }
.performance-cell .stat-num{ color:var(--brick-hi); }
.performance-cell .stat-label{ padding-bottom:0; margin-top:10px; }
@media (max-width:900px){ .flagship-intro{ grid-template-columns:1fr; } .performance-strip{ grid-template-columns:1fr; } .flagship-strip{ grid-template-columns:1fr; } }

/* anchor tenants */
.tenant-grid{ display:grid; grid-template-columns:1fr 1fr; gap:1px; background:var(--line); border:1px solid var(--line); margin-top:56px; }
.tenant-card{ background:var(--paper-hi); color:var(--ink); }
.tenant-media{ aspect-ratio:16/10; overflow:hidden; }
.tenant-media img{ width:100%; height:100%; object-fit:cover; }
.tenant-body{ padding:28px 30px 32px; }
.tenant-body .eyebrow{ margin-bottom:10px; }
.tenant-body h4{ font-size:26px; text-transform:uppercase; margin-bottom:12px; color:var(--ink); }
.tenant-body p{ color:var(--ink-soft); font-size:15px; }
@media (max-width:760px){ .tenant-grid{ grid-template-columns:1fr; } }

/* area overview */
.area-cols{ display:grid; grid-template-columns:1fr 1fr; gap:48px; margin-top:44px; }
.area-cols h4{ font-family:var(--font-mono); font-size:12.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--brick); margin-bottom:14px; }
.area-cols ul{ margin:0; padding-left:18px; color:var(--ink-soft); font-size:15px; line-height:1.9; }
@media (max-width:760px){ .area-cols{ grid-template-columns:1fr; } }

/* ============================================================
   TEAM
   ============================================================ */
.lead-partner{ display:grid; grid-template-columns:220px 1fr; gap:40px; align-items:start; padding-bottom:48px; border-bottom:1px solid var(--line); margin-bottom:48px; }
.lead-partner img{ width:100%; aspect-ratio:3/4; object-fit:cover; filter:grayscale(.15); }
.lead-partner h3{ font-size:32px; text-transform:uppercase; margin-bottom:4px; }
.lead-partner .role{ font-family:var(--font-mono); font-size:13px; color:var(--brick); text-transform:uppercase; letter-spacing:.06em; margin-bottom:16px; }
.lead-partner p{ color:var(--ink-soft); max-width:64ch; }
.contact-line{ font-family:var(--font-mono); font-size:13.5px; color:var(--ink); margin-top:14px; }
.contact-line a{ text-decoration:none; border-bottom:1px solid var(--brick); }
@media (max-width:640px){ .lead-partner{ grid-template-columns:120px 1fr; } }

.team-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:28px; }
.team-card img{ width:100%; aspect-ratio:1/1; object-fit:cover; filter:grayscale(.15); margin-bottom:16px; }
.team-card h4{ font-size:19px; text-transform:uppercase; margin-bottom:2px; }
.team-card .role{ font-family:var(--font-mono); font-size:11.5px; color:var(--brick); text-transform:uppercase; letter-spacing:.05em; margin-bottom:10px; }
.team-card p{ font-size:14px; color:var(--ink-soft); }
@media (max-width:820px){ .team-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:520px){ .team-grid{ grid-template-columns:1fr; } }

.track-table-wrap{ margin-top:60px; overflow-x:auto; }
.track-table{ width:100%; border-collapse:collapse; min-width:720px; font-size:13.5px; }
.track-table caption{ text-align:left; font-family:var(--font-mono); font-size:12px; letter-spacing:.08em; text-transform:uppercase; color:var(--brick); margin-bottom:14px; }
.track-table th{ font-family:var(--font-mono); font-size:11px; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-soft); text-align:left; padding:10px 14px; border-bottom:1px solid var(--ink); }
.track-table td{ padding:12px 14px; border-bottom:1px solid var(--line); vertical-align:top; }
.track-table td strong{ display:block; font-family:var(--font-display); font-size:16px; text-transform:uppercase; }

/* ============================================================
   CONTACT / FOOTER
   ============================================================ */
.contact-grid{ display:grid; grid-template-columns:1.1fr 1fr; gap:60px; }
.contact-card{ border:1px solid rgba(233,237,232,.2); padding:32px; }
.contact-card .eyebrow{ margin-bottom:16px; }
.contact-card h4{ font-size:24px; text-transform:uppercase; margin-bottom:4px; }
.contact-card .role{ font-family:var(--font-mono); color:var(--brick-hi); font-size:12.5px; text-transform:uppercase; margin-bottom:20px; }
.contact-detail{ font-family:var(--font-mono); font-size:14px; display:flex; justify-content:space-between; padding:10px 0; border-top:1px solid rgba(233,237,232,.14); }
.contact-detail:first-of-type{ border-top:none; }
.contact-detail a{ color:var(--white); text-decoration:none; border-bottom:1px solid var(--brick); }
@media (max-width:900px){ .contact-grid{ grid-template-columns:1fr; } }

footer{ background:var(--ink); color:#8FA2AB; padding:40px 0; font-family:var(--font-mono); font-size:12px; }
.footer-inner{ display:flex; justify-content:space-between; flex-wrap:wrap; gap:16px; }
.footer-note{ max-width:60ch; color:#6C808A; margin-top:18px; font-size:11.5px; line-height:1.7; }

/* reveal-on-scroll helper (generic) — hidden only once JS confirms it can reveal it */
.reveal.pre-reveal{ opacity:0; transform:translateY(16px); transition:opacity .6s ease, transform .6s ease; }
.reveal.pre-reveal.in{ opacity:1; transform:none; }

/* ============================================================
   INTERIOR PAGE HEADER — sheet titleblock for every sub-page
   ============================================================ */
.page-head{
  background:var(--ink); color:var(--paper);
  padding:150px 0 64px;
  border-bottom:1px solid var(--line-dark);
}
.page-head .eyebrow{ color:var(--brick-hi); }
.page-head .eyebrow .sheet-code{ color:#7E939C; }
.page-head h1{ font-size:clamp(40px,6vw,84px); text-transform:uppercase; line-height:.96; max-width:14ch; }
.page-head .lede{ font-size:18px; color:#AFC0C6; max-width:58ch; margin-top:20px; }
.page-head-grid{ display:grid; grid-template-columns:1.4fr 1fr; gap:48px; align-items:end; }
.page-head .titleblock{ font-size:12px; }
@media (max-width:900px){ .page-head-grid{ grid-template-columns:1fr; } .page-head{ padding-top:120px; } }

.page-head.has-media{ position:relative; overflow:hidden; padding-top:220px; }
.page-head.has-media .head-media{ position:absolute; inset:0; z-index:0; }
.page-head.has-media .head-media img{ width:100%; height:100%; object-fit:cover; }
.page-head.has-media .head-media::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(16,30,43,.35) 0%, rgba(16,30,43,.92) 100%); }
.page-head.has-media .container{ position:relative; z-index:1; }

/* breadcrumb-ish sheet index */
.sheet-index{ font-family:var(--font-mono); font-size:11.5px; letter-spacing:.1em; text-transform:uppercase; color:#7E939C; margin-bottom:26px; }
.sheet-index a{ color:#AFC0C6; text-decoration:none; }
.sheet-index a:hover{ color:var(--brick-hi); }
.sheet-index span{ margin:0 8px; }

/* ============================================================
   HOME — flagship spotlight card + portfolio teaser
   ============================================================ */
.spotlight{
  display:grid; grid-template-columns:1.25fr 1fr; gap:0;
  background:var(--white); border:1px solid var(--line);
}
.spotlight-media{ position:relative; min-height:380px; overflow:hidden; }
.spotlight-media img{ width:100%; height:100%; object-fit:cover; position:absolute; inset:0; }
.spotlight-body{ padding:40px 44px; display:flex; flex-direction:column; justify-content:center; }
.spotlight-body h3{ font-size:34px; text-transform:uppercase; line-height:1; margin:6px 0 14px; }
.spotlight-body p{ color:var(--ink-soft); }
.spotlight-stats{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin:22px 0 8px; border-top:1px dashed var(--line); padding-top:18px; }
.spotlight-stats .stat-num{ color:var(--ink); font-size:30px; }
.spotlight-stats .stat-label{ color:var(--ink-soft); padding-bottom:0; margin-top:6px; }
@media (max-width:900px){ .spotlight{ grid-template-columns:1fr; } .spotlight-media{ min-height:260px; } .spotlight-body{ padding:30px 26px; } }

.section-foot{ margin-top:44px; display:flex; justify-content:space-between; align-items:center; gap:20px; flex-wrap:wrap; }
.section-foot .note{ font-family:var(--font-mono); font-size:12px; color:var(--ink-soft); letter-spacing:.04em; }

/* ============================================================
   CTA BAND — investor inquiries
   ============================================================ */
.cta-band{ background:var(--brick); color:var(--white); padding:72px 0; }
.cta-band-inner{ display:grid; grid-template-columns:1.2fr 1fr; gap:40px; align-items:center; }
.cta-band h2{ font-size:clamp(30px,4vw,50px); text-transform:uppercase; line-height:1; }
.cta-band p{ color:rgba(255,255,255,.85); margin-top:12px; max-width:52ch; }
.cta-band .btn-row{ margin-top:0; justify-content:flex-end; }
.cta-band .btn-light:hover{ color:var(--brick); }
@media (max-width:820px){ .cta-band-inner{ grid-template-columns:1fr; } .cta-band .btn-row{ justify-content:flex-start; } }

/* ============================================================
   PORTFOLIO — tabs
   ============================================================ */
.tabs{ display:flex; gap:0; border-bottom:1px solid var(--line); margin-bottom:56px; flex-wrap:wrap; }
.tab{
  font-family:var(--font-mono); font-size:12.5px; letter-spacing:.1em; text-transform:uppercase;
  background:none; border:none; border-bottom:2px solid transparent; margin-bottom:-1px;
  padding:14px 22px; color:var(--ink-soft); cursor:pointer; text-decoration:none;
}
.tab:hover{ color:var(--ink); }
.tab[aria-selected="true"]{ color:var(--brick); border-bottom-color:var(--brick); }
.tab .count{ color:var(--ink-soft); margin-left:6px; }
.tabpanel[hidden]{ display:none; }
.tabpanel{ animation:fadein .35s ease; }
@keyframes fadein{ from{opacity:0; transform:translateY(6px);} to{opacity:1; transform:none;} }
.subsection{ margin-top:72px; }
.subsection .section-head{ margin-bottom:36px; }
.subsection .section-head h2{ font-size:clamp(26px,3vw,38px); }

.pcard-link{ text-decoration:none; color:inherit; display:block; }
.spotlight.pcard-link{ display:grid; }
.pcard-cta{ font-family:var(--font-mono); font-size:11.5px; letter-spacing:.08em; text-transform:uppercase; color:var(--brick); margin-top:14px; }
.pcard-cta::after{ content:" →"; }

/* ============================================================
   CONTACT FORM
   ============================================================ */
.contact-layout{ display:grid; grid-template-columns:1.15fr .85fr; gap:60px; align-items:start; }
@media (max-width:900px){ .contact-layout{ grid-template-columns:1fr; } }
.form{ background:var(--white); border:1px solid var(--line); padding:36px; }
.form-head{ font-family:var(--font-mono); font-size:12px; letter-spacing:.12em; text-transform:uppercase; color:var(--brick); margin-bottom:22px; display:flex; justify-content:space-between; }
.form-head span:last-child{ color:var(--ink-soft); }
.field{ display:flex; flex-direction:column; gap:7px; margin-bottom:18px; }
.field label{ font-family:var(--font-mono); font-size:11.5px; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-soft); }
.field input, .field select, .field textarea{
  font-family:var(--font-body); font-size:15px; color:var(--ink);
  border:1px solid var(--line); background:var(--paper-hi); padding:12px 14px; border-radius:0;
  transition:border-color .2s, background .2s; width:100%;
}
.field input:focus, .field select:focus, .field textarea:focus{ outline:none; border-color:var(--brick); background:var(--white); }
.field textarea{ min-height:140px; resize:vertical; }
.field-row{ display:grid; grid-template-columns:1fr 1fr; gap:18px; }
@media (max-width:560px){ .field-row{ grid-template-columns:1fr; } }
.form-foot{ display:flex; justify-content:space-between; align-items:center; gap:16px; flex-wrap:wrap; margin-top:8px; }
.form-foot .fine{ font-size:12.5px; color:var(--ink-soft); max-width:40ch; }
.hp{ position:absolute; left:-9999px; }

.contact-aside .contact-card{ border-color:var(--line); }
.contact-aside .contact-detail{ border-top-color:var(--line); }
.contact-aside .contact-detail a{ color:var(--ink); }
.contact-aside .contact-card .role{ color:var(--brick); }
.contact-aside .contact-card + .contact-card{ margin-top:24px; }
.download-card{ border:1px solid var(--line); padding:26px 28px; margin-top:24px; background:var(--paper-hi); }
.download-card h4{ font-size:22px; text-transform:uppercase; margin:8px 0 8px; }
.download-card p{ color:var(--ink-soft); font-size:14px; }
.download-card .meta{ font-family:var(--font-mono); font-size:11.5px; color:var(--ink-soft); letter-spacing:.06em; margin-top:12px; }

.success-box{ background:var(--white); border:1px solid var(--line); padding:48px; max-width:640px; }
.success-box h2{ font-size:40px; text-transform:uppercase; }

/* ============================================================
   FOOTER — expanded with sheet index
   ============================================================ */
.footer-grid{ display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:40px; padding-bottom:36px; border-bottom:1px solid rgba(233,237,232,.14); margin-bottom:24px; }
.footer-grid h5{ font-family:var(--font-mono); font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--brick-hi); margin:0 0 14px; }
.footer-grid ul{ list-style:none; margin:0; padding:0; }
.footer-grid li{ margin-bottom:9px; }
.footer-grid a{ color:#C9D2D8; text-decoration:none; font-family:var(--font-body); font-size:14px; }
.footer-grid a:hover{ color:var(--brick-hi); }
.footer-brand .nav-mark{ font-size:26px; margin-bottom:12px; }
.footer-brand p{ color:#8FA2AB; font-family:var(--font-body); font-size:14px; max-width:36ch; }
@media (max-width:820px){ .footer-grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:520px){ .footer-grid{ grid-template-columns:1fr; } }

/* ============================================================
   HOME — investment criteria ("buy box")
   Four titleblock panels: what / where / who / how. Built for a
   broker to read in ten seconds and forward a deal.
   ============================================================ */
.criteria-thesis{
  font-family:var(--font-display); font-weight:700; text-transform:uppercase;
  font-size:clamp(22px,2.6vw,32px); line-height:1.08; color:var(--ink);
  max-width:30ch; margin:0 0 44px; letter-spacing:.01em;
}
.criteria-thesis em{ font-style:normal; color:var(--brick); }
.criteria-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--line); border:1px solid var(--line); }
.criteria{ background:var(--white); padding:28px 26px 30px; color:var(--ink); position:relative; }
.criteria .crit-code{ font-family:var(--font-mono); font-size:11px; letter-spacing:.12em; color:var(--brick); text-transform:uppercase; margin-bottom:12px; }
.criteria h3{ font-size:24px; text-transform:uppercase; margin-bottom:16px; line-height:1; }
.criteria dl{ margin:0; font-family:var(--font-mono); font-size:12.5px; }
.criteria dl div{ display:grid; grid-template-columns:auto 1fr; gap:12px; padding:9px 0; border-top:1px dashed var(--line); }
.criteria dl div:first-child{ border-top:none; padding-top:0; }
.criteria dt{ color:var(--ink-soft); letter-spacing:.06em; text-transform:uppercase; font-size:11px; padding-top:2px; white-space:nowrap; }
.criteria dd{ margin:0; color:var(--ink); font-weight:500; line-height:1.5; }
@media (max-width:980px){ .criteria-grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:560px){ .criteria-grid{ grid-template-columns:1fr; } }

/* ============================================================
   PINEWOOD — dated timeline, before/after, location diagram
   ============================================================ */
.timeline{ position:relative; margin:0; padding:0; list-style:none; border-left:1px solid var(--line); margin-left:8px; }
.timeline li{ position:relative; padding:0 0 40px 36px; }
.timeline li:last-child{ padding-bottom:0; }
.timeline li::before{
  content:""; position:absolute; left:-6px; top:6px; width:11px; height:11px;
  background:var(--paper); border:1.5px solid var(--brick); transform:rotate(45deg);
}
.timeline li.done::before{ background:var(--brick); }
.timeline .t-date{ font-family:var(--font-mono); font-size:11.5px; letter-spacing:.12em; text-transform:uppercase; color:var(--brick); margin-bottom:6px; }
.timeline h3{ font-size:24px; text-transform:uppercase; line-height:1; margin-bottom:8px; }
.timeline p{ color:var(--ink-soft); font-size:15px; max-width:52ch; margin:0; }
.timeline .t-tags{ margin-top:10px; display:flex; flex-wrap:wrap; gap:6px; }
.timeline .t-tags span{ font-family:var(--font-mono); font-size:11px; letter-spacing:.06em; text-transform:uppercase; color:var(--ink); background:var(--paper-hi); border:1px solid var(--line); padding:4px 8px; }

.case-grid{ display:grid; grid-template-columns:1fr 1fr; gap:64px; align-items:start; }
@media (max-width:900px){ .case-grid{ grid-template-columns:1fr; gap:48px; } }

.ba-table{ width:100%; border-collapse:collapse; font-size:14px; background:var(--white); border:1px solid var(--line); }
.ba-table caption{ text-align:left; font-family:var(--font-mono); font-size:12px; letter-spacing:.1em; text-transform:uppercase; color:var(--brick); margin-bottom:14px; }
.ba-table th{ font-family:var(--font-mono); font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-soft); text-align:right; padding:12px 16px; border-bottom:1px solid var(--ink); font-weight:500; }
.ba-table th:first-child{ text-align:left; }
.ba-table th.now{ color:var(--brick); }
.ba-table td{ padding:13px 16px; border-bottom:1px solid var(--line); text-align:right; font-family:var(--font-mono); font-size:13px; }
.ba-table td:first-child{ text-align:left; font-family:var(--font-body); font-size:14px; color:var(--ink); }
.ba-table td.now{ font-weight:600; color:var(--ink); background:rgba(183,91,46,.06); }
.ba-table td.delta{ color:var(--brick); font-weight:600; }
.ba-table tr:last-child td{ border-bottom:none; }
.ba-note{ font-family:var(--font-mono); font-size:11.5px; color:var(--ink-soft); margin-top:12px; line-height:1.6; }

.locmap{ background:var(--ink); border:1px solid var(--line-dark); padding:0; }
.locmap svg{ width:100%; height:auto; display:block; }
.locmap-cap{ display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap; font-family:var(--font-mono); font-size:11.5px; color:#8FA2AB; letter-spacing:.06em; padding:12px 16px; border-top:1px solid var(--line-dark); }
.locmap-cap b{ color:var(--brick-hi); font-weight:500; }

/* ============================================================
   404
   ============================================================ */
.err{ min-height:100vh; display:flex; align-items:center; background:var(--ink); color:var(--paper); padding:120px 0 80px; }
.err h1{ font-size:clamp(80px,18vw,220px); line-height:.9; text-transform:uppercase; color:var(--brick-hi); }
.err h2{ font-size:clamp(26px,3vw,40px); text-transform:uppercase; margin-top:18px; }
.err p{ color:#AFC0C6; max-width:48ch; margin-top:14px; }

/* area lists on dark sections need lighter body text */
.section-dark .area-cols ul{ color:#AFC0C6; }
.section-dark .area-cols h4{ color:var(--brick-hi); }
.area-cols.with-map{ grid-template-columns:1.25fr 1fr; }
@media (max-width:760px){ .area-cols.with-map{ grid-template-columns:1fr; } }
.ba-table-wrap{ overflow-x:auto; }
.case-grid > *{ min-width:0; }
.ba-table{ min-width:420px; }
@media (max-width:600px){
  .locmap{ overflow-x:auto; -webkit-overflow-scrolling:touch; }
  .locmap svg{ min-width:560px; }
  .ba-table{ min-width:0; }
  .ba-table th:nth-child(4), .ba-table td:nth-child(4){ display:none; }
}