/* ============================================
   Matt Walsh CXO — Production Stylesheet
   ============================================ */

/* RESET & BASE */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{-webkit-font-smoothing:antialiased;scroll-behavior:smooth;}

:root{
  --bg:#F2EDE3;
  --bg2:#E8E0D2;
  --bg3:#DDD3C1;
  --ink:#141C1A;
  --ink2:#3A4440;
  --muted:#5A635F;
  --teal:#1A6B62;
  --teal2:#1F7D71;
  --gold:#966624;
  --line:rgba(20,28,26,.1);
  --line2:rgba(20,28,26,.18);
  --f:'Familjen Grotesk',system-ui,sans-serif;
  --b:'Outfit',system-ui,sans-serif;
}

body{
  background:var(--bg);
  color:var(--ink);
  font-family:var(--b);
  overflow-x:hidden;
}

a{transition:color .2s,opacity .2s;}
img{display:block;max-width:100%;}

/* Skip to content */
.skip-link{
  position:absolute;top:-100%;left:1rem;z-index:200;
  background:var(--teal);color:white;padding:.75rem 1.5rem;
  font-family:var(--f);font-size:.85rem;font-weight:600;
  border-radius:0 0 4px 4px;text-decoration:none;
  transition:top .2s;
}
.skip-link:focus{top:0;}

/* Focus visible styles for keyboard nav */
*:focus-visible{outline:2px solid var(--teal);outline-offset:2px;border-radius:2px;}
.nav-cta:focus-visible{outline-color:white;}
.btn-fill:focus-visible{outline-color:white;outline-offset:3px;}
.btn-white:focus-visible{outline-color:var(--ink);outline-offset:3px;}
.submit-btn:focus-visible{outline-color:white;outline-offset:3px;}
/* Overlay buttons sit on a dark backdrop — need white rings */
.cs-close:focus-visible,.cs-nav-btn:focus-visible{outline:2px solid white;outline-offset:3px;}

/* ============================================
   NAV
   ============================================ */
#nav{
  position:fixed;top:0;left:0;right:0;z-index:100;
  height:64px;display:flex;align-items:center;justify-content:center;
  padding:0 3.5rem;
  background:rgba(242,237,227,.96);
  backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);
  border-bottom:1px solid var(--line);
  transition:box-shadow .3s;
}
#nav.scrolled{box-shadow:0 2px 24px rgba(20,28,26,.08);}

.nav-inner{max-width:1160px;width:100%;display:flex;align-items:center;justify-content:space-between;}
.nav-logo{font-family:var(--f);font-size:1.1rem;font-weight:700;color:var(--ink);text-decoration:none;letter-spacing:-.01em;}
.nav-logo span{color:var(--teal);}

.nav-links{display:flex;align-items:center;gap:2.5rem;list-style:none;}
.nav-links a{
  font-family:var(--f);font-size:.7rem;font-weight:500;
  letter-spacing:.1em;text-transform:uppercase;
  color:var(--muted);text-decoration:none;transition:color .2s;
}
.nav-links a:hover,.nav-links a.active,.nav-links a[aria-current="page"]{color:var(--ink);}
.nav-links .nav-cta,.nav-links .nav-cta:hover,.nav-links .nav-cta.active,.nav-links .nav-cta[aria-current="page"]{color:white;}
.nav-links .nav-cta{
  font-family:var(--f);font-size:.7rem;font-weight:700;
  letter-spacing:.08em;text-transform:uppercase;
  background:var(--teal);color:white;
  padding:.5rem 1.3rem;border-radius:2px;text-decoration:none;transition:background .2s;
}
.nav-links .nav-cta:hover{background:var(--teal2);color:white;}

/* Mobile Nav Toggle */
.nav-toggle{display:none;background:none;border:none;cursor:pointer;padding:.5rem;flex-direction:column;gap:5px;}
.nav-toggle span{display:block;width:22px;height:2px;background:var(--ink);border-radius:2px;transition:all .3s;}

/* ============================================
   SHARED COMPONENTS
   ============================================ */
.kicker,.page-kicker,.section-kicker{
  font-family:var(--f);font-size:.68rem;font-weight:600;
  letter-spacing:.22em;text-transform:uppercase;color:var(--teal);
  display:flex;align-items:center;gap:.75rem;margin-bottom:1.2rem;
}
.kicker::before,.page-kicker::before,.section-kicker::before,
.hero-eyebrow::before,.contact-kicker::before{
  content:'';width:0;height:1.5px;background:currentColor;
  transition:width .6s cubic-bezier(.22,1,.36,1);
}
.kicker.kicker-visible::before,
.page-kicker.kicker-visible::before,
.section-kicker.kicker-visible::before,
.hero-eyebrow.kicker-visible::before,
.contact-kicker.kicker-visible::before{
  width:22px;
}

.section-h2{
  font-family:var(--f);font-size:2.2rem;font-weight:700;
  line-height:1.1;letter-spacing:-.025em;color:var(--ink);margin-bottom:1rem;
}
.section-h2 em{font-style:normal;color:var(--teal);}

/* Buttons */
.btn-fill{
  font-family:var(--f);font-size:.75rem;font-weight:700;
  letter-spacing:.08em;text-transform:uppercase;
  background:var(--teal);color:white;
  padding:.88rem 1.9rem;border-radius:2px;
  text-decoration:none;display:inline-flex;align-items:center;gap:.4rem;
  border:none;cursor:pointer;transition:background .2s;
}
.btn-fill:hover{background:var(--teal2);}

.btn-line{
  font-family:var(--f);font-size:.75rem;font-weight:600;
  letter-spacing:.08em;text-transform:uppercase;
  background:transparent;color:var(--ink);
  padding:.88rem 1.9rem;border-radius:2px;
  border:1.5px solid var(--line2);text-decoration:none;
  transition:border-color .2s;
}
.btn-line:hover{border-color:var(--ink);}

.btn-white{
  font-family:var(--f);font-size:.75rem;font-weight:700;
  letter-spacing:.08em;text-transform:uppercase;
  background:white;color:var(--teal);
  padding:1rem 2.2rem;border-radius:2px;
  text-decoration:none;white-space:nowrap;display:inline-flex;align-items:center;
  border:none;cursor:pointer;transition:opacity .2s;margin:0;flex-shrink:0;
}
.btn-white:hover{opacity:.9;}

.view-more{
  font-family:var(--f);font-size:.72rem;font-weight:600;
  letter-spacing:.08em;text-transform:uppercase;
  color:var(--teal);text-decoration:none;
  border-bottom:1.5px solid var(--teal);padding-bottom:.1rem;
  transition:opacity .2s;
}
.view-more:hover{opacity:.7;}

/* CTA Band */
.cta-band{
  background:var(--teal);padding:5.5rem 3.5rem;
  position:relative;overflow:hidden;
}
.cta-band::before{
  content:'';position:absolute;inset:0;
  background:radial-gradient(ellipse at 30% 50%,rgba(46,148,133,.25) 0%,transparent 60%);
  will-change:transform;pointer-events:none;
}
.cta-band::after{
  content:'';position:absolute;inset:0;
  background:radial-gradient(ellipse at 80% 50%,rgba(255,255,255,.06) 0%,transparent 50%);
  will-change:transform;pointer-events:none;
}
.cta-inner{
  max-width:1160px;margin:0 auto;
  display:flex;align-items:center;justify-content:space-between;gap:4rem;flex-wrap:wrap;
}
.cta-h2{
  font-family:var(--f);font-size:2.2rem;font-weight:700;
  letter-spacing:-.025em;color:white;line-height:1.15;
  margin:0;
}

/* Section Divider */
.section-divider{border:none;border-top:1px solid var(--line);max-width:1160px;margin:0 auto;}

/* Scroll Reveal — enhanced with stagger */
.reveal{opacity:0;transform:translateY(26px);transition:opacity .65s ease,transform .65s ease;}
.reveal.visible{opacity:1;transform:none;}

/* Parallax Layers */
[data-parallax]{will-change:transform;transition:none;}

/* Floating decorative circles — subtle depth cues */
.parallax-orb{
  position:absolute;border-radius:50%;pointer-events:none;
  will-change:transform;
  mix-blend-mode:multiply;
}
.parallax-orb.orb-teal{
  background:radial-gradient(circle,rgba(26,107,98,.07) 0%,transparent 70%);
}
.parallax-orb.orb-gold{
  background:radial-gradient(circle,rgba(196,136,58,.06) 0%,transparent 70%);
}
.parallax-orb.orb-ink{
  background:radial-gradient(circle,rgba(20,28,26,.04) 0%,transparent 70%);
}

/* Parallax container needs relative positioning */
.parallax-container{position:relative;overflow:hidden;}

/* Hero image subtle zoom on scroll */
.hero-right.parallax-zoom{overflow:hidden;}
.hero-right.parallax-zoom > *:first-child{
  transition:none;will-change:transform;
}

/* Recognition hero — depth layers */
.rec-hero{position:relative;overflow:hidden;}
.rec-hero::before{
  content:'';position:absolute;top:-120px;right:-80px;
  width:400px;height:400px;border-radius:50%;
  border:1px solid rgba(46,148,133,.08);pointer-events:none;
  will-change:transform;
}
.rec-hero::after{
  content:'';position:absolute;bottom:-60px;left:10%;
  width:250px;height:250px;border-radius:50%;
  border:1px solid rgba(255,255,255,.04);pointer-events:none;
  will-change:transform;
}

/* Contact decorative circles enhanced for parallax */
.contact-left::before,.contact-left::after{will-change:transform;}

/* Network stat boxes — subtle lift on scroll */
.net-num-box{
  transition:transform .6s cubic-bezier(.22,1,.36,1),box-shadow .6s ease;
}
.net-num-box.parallax-lifted{
  transform:translateY(-4px);
  box-shadow:0 8px 32px rgba(20,28,26,.06);
}

/* Method items — staggered entrance */
.method-item{
  opacity:0;transform:translateY(16px);
  transition:opacity .5s ease,transform .5s ease;
}
.method-item.visible{opacity:1;transform:none;}

/* Testimonial cards — staggered entrance */
.testimonial-card{
  opacity:0;transform:translateY(20px);
  transition:opacity .5s ease,transform .5s ease;
}
.testimonial-card.visible{opacity:1;transform:none;}

/* Project cards — staggered entrance */
.project-card{
  opacity:0;transform:translateY(16px);
  transition:opacity .45s ease,transform .45s ease;
}
.project-card.visible{opacity:1;transform:none;}

/* ============================================
   FOOTER
   ============================================ */
.site-footer{background:var(--ink);padding:3rem 3.5rem;}
.footer-inner{
  max-width:1160px;margin:0 auto;
  display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:1.5rem;
}
.footer-meta{font-family:var(--b);font-size:.72rem;color:rgba(255,255,255,.6);}

/* ============================================
   HOMEPAGE — HERO
   ============================================ */
.hero{min-height:100vh;padding-top:64px;display:grid;grid-template-columns:1fr 1fr;}
.hero-left{display:flex;flex-direction:column;justify-content:center;padding:5rem 4rem 5rem calc(max(3.5rem, (100vw - 1160px) / 2));}
.hero-eyebrow{
  font-family:var(--f);font-size:.68rem;font-weight:600;
  letter-spacing:.22em;text-transform:uppercase;color:var(--teal);
  display:flex;align-items:center;gap:.75rem;margin-bottom:1.8rem;
}
.hero-h1{
  font-family:var(--f);font-size:clamp(2.4rem,3.8vw,3.6rem);font-weight:700;
  line-height:1.04;letter-spacing:-.03em;color:var(--ink);margin-bottom:1.5rem;
}
.hero-h1 em{font-style:normal;color:var(--teal);}
.hero-sub{font-family:var(--b);font-size:1rem;line-height:1.8;color:var(--ink2);max-width:44ch;margin-bottom:2.5rem;}
.hero-btns{display:flex;gap:.75rem;flex-wrap:wrap;}
.hero-right{position:relative;overflow:hidden;background:var(--bg3);}
.hero-right img{width:100%;height:100%;object-fit:cover;object-position:center 20%;display:block;}
.hero-right-overlay{display:none;}

/* HOMEPAGE — What Matt Does */
.what-i-do{background:var(--bg2);border-top:1px solid var(--line);padding:7rem max(3.5rem,calc((100vw - 1160px) / 2));display:grid;grid-template-columns:5fr 7fr;gap:6rem;align-items:start;}
.wid-desc{font-family:var(--b);font-size:.95rem;line-height:1.8;color:var(--muted);}
.method-list{display:flex;flex-direction:column;}
.method-item{display:grid;grid-template-columns:auto 1fr;gap:1.5rem;align-items:start;padding:1.5rem 0;border-bottom:1px solid var(--line);}
.method-item:first-child{border-top:1px solid var(--line);}
.method-num{font-family:var(--f);font-size:.68rem;font-weight:700;letter-spacing:.12em;color:var(--teal);padding-top:.15rem;min-width:2rem;}
.method-title{font-family:var(--f);font-size:1.05rem;font-weight:700;letter-spacing:-.01em;color:var(--ink);margin-bottom:.3rem;}
.method-body{font-family:var(--b);font-size:.88rem;color:var(--muted);line-height:1.7;}

/* HOMEPAGE — Clients */
.clients{background:var(--bg2);border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:6rem 3.5rem;}
.clients-inner{max-width:1160px;margin:0 auto;}
.clients-header{margin-bottom:4rem;}
.columns-wrap{display:grid;grid-template-columns:1fr 1fr;gap:3rem;}
.col-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:1.5rem;padding-bottom:1rem;border-bottom:1.5px solid var(--teal);}
.col-label{font-family:var(--f);font-size:.78rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--teal);}
.col-filter{
  font-family:var(--f);font-size:.72rem;font-weight:500;color:var(--ink2);
  background:var(--bg);border:1px solid var(--line2);border-radius:2px;
  padding:.35rem .65rem;cursor:pointer;appearance:none;-webkit-appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%237A8480' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right .5rem center;padding-right:1.6rem;
}
.col-filter:focus{border-color:var(--teal);outline:2px solid var(--teal);outline-offset:1px;}
.vc-list{display:flex;flex-direction:column;gap:.35rem;list-style:none;margin:0;padding:0;}
.vc{
  font-family:var(--f);font-size:.85rem;font-weight:500;color:var(--ink2);
  padding:.42rem .9rem;background:var(--bg);
  border:1px solid var(--line2);border-radius:2px;transition:all .15s;cursor:default;
}
.vc:hover{background:var(--teal);color:white;border-color:var(--teal);}
.vc[hidden]{display:none;}

/* HOMEPAGE — Full-Stack Matt */
.network{max-width:1160px;margin:0 auto;padding:7rem 0;display:grid;grid-template-columns:1fr 1fr;gap:6rem;align-items:center;}
.network-numbers{display:grid;grid-template-columns:1fr 1fr;gap:2rem;}
.net-num-box{padding:2rem;background:var(--bg2);border:1px solid var(--line2);border-radius:3px;}
.net-num{font-family:var(--f);font-size:2.8rem;font-weight:700;letter-spacing:-.04em;color:var(--ink);line-height:1;margin-bottom:.3rem;}
.net-num span{color:var(--teal);}
.net-num.infinity{font-size:3.6rem;line-height:.85;}
.net-label{font-family:var(--b);font-size:.82rem;color:var(--muted);line-height:1.4;}
.net-label strong{color:var(--ink2);font-weight:500;display:block;}
/* HOMEPAGE — Building Organizations */
.build-org{background:var(--ink);padding:7rem 3.5rem;}
.build-org-header{
  max-width:1160px;margin:0 auto 2rem;
}
.build-org .kicker{color:var(--teal2);}
.build-org .kicker::before{background:var(--teal2);}
.build-org .section-h2{color:white;}
.build-org .section-h2 em{color:var(--teal2);}
.build-org-desc{
  font-family:var(--b);font-size:.95rem;line-height:1.8;
  color:rgba(255,255,255,.5);max-width:52ch;margin-top:.5rem;margin-bottom:2rem;
}
.org-toggle-wrap{
  display:flex;gap:.5rem;flex-wrap:wrap;
}
.org-toggle-btn{
  font-family:var(--f);font-size:.72rem;font-weight:600;
  letter-spacing:.06em;text-transform:uppercase;
  padding:.55rem 1.2rem;border-radius:100px;
  border:1px solid rgba(255,255,255,.18);background:transparent;
  color:rgba(255,255,255,.45);cursor:pointer;transition:all .2s;
  white-space:nowrap;
}
.org-toggle-btn:hover:not(.active){color:rgba(255,255,255,.75);border-color:rgba(255,255,255,.4);}
.org-toggle-btn.active{background:var(--teal);color:white;border-color:var(--teal);}
.org-grid{
  max-width:1160px;margin:0 auto;
  display:grid;grid-template-columns:repeat(3,1fr);
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.07);
  border-radius:4px;overflow:hidden;gap:1px;
}
.org-card{
  background:var(--ink);padding:2.5rem 2rem;
  display:flex;flex-direction:column;gap:.6rem;
  opacity:0;transform:translateY(16px);
  transition:opacity .5s ease,transform .5s ease,background .2s;
}
.org-card.visible{opacity:1;transform:none;}
.org-card:hover{background:rgba(255,255,255,.03);}
.org-num{
  font-family:var(--f);font-size:.62rem;font-weight:700;
  letter-spacing:.15em;color:var(--teal2);
}
.org-card-title{
  font-family:var(--f);font-size:1rem;font-weight:700;
  letter-spacing:-.01em;color:white;line-height:1.25;margin-bottom:.2rem;
}
.org-card-body{
  font-family:var(--b);font-size:.85rem;
  color:rgba(255,255,255,.52);line-height:1.78;flex:1;
  transition:opacity .2s ease;
}
.org-card-body.fading{opacity:0;}

/* ============================================
   WORK PAGE
   ============================================ */
.page-hero{padding:calc(64px + 4.5rem) 3.5rem 3rem;max-width:1160px;margin:0 auto;}
.page-h1{
  font-family:var(--f);font-size:clamp(2.4rem,5vw,4rem);font-weight:700;
  line-height:1.0;letter-spacing:-.035em;color:var(--ink);margin-bottom:1.2rem;
}
.page-h1 em{font-style:normal;color:var(--teal);}
.page-sub{font-family:var(--b);font-size:1rem;line-height:1.75;color:var(--ink2);max-width:55ch;}

.era-section{max-width:1160px;margin:0 auto;padding:3rem 0 5rem;}
.era-header{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:2.5rem;padding-bottom:1rem;border-bottom:2px solid var(--ink);}
.era-name{font-family:var(--f);font-size:1.5rem;font-weight:700;letter-spacing:-.02em;color:var(--ink);}
.era-years{font-family:var(--b);font-size:.8rem;color:var(--muted);}
.era-desc{font-family:var(--b);font-size:.88rem;color:var(--muted);line-height:1.7;max-width:65ch;margin-bottom:2.5rem;}

/* Project Cards */
.project-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line2);border:1px solid var(--line2);border-radius:4px;overflow:hidden;}
.project-card{background:var(--bg);transition:background .2s;display:flex;flex-direction:column;}
.project-card:hover{background:var(--bg2);}
.proj-img{height:180px;background:var(--bg3);position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;}
.proj-img-inner{font-family:var(--b);font-size:.8rem;font-style:italic;color:var(--ink2);}
.proj-img-link{display:block;text-decoration:none;cursor:pointer;}
.proj-img-link .proj-img{transition:opacity .2s ease;}
.proj-img-link:hover .proj-img{opacity:.88;}
.proj-img-label{position:absolute;top:.75rem;left:.75rem;}
.award-badge{font-family:var(--f);font-size:.55rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;padding:.25rem .65rem;border-radius:100px;display:inline-block;}
.badge-gold{background:var(--gold);color:white;}
.badge-teal{background:var(--teal);color:white;}
.badge-purple{background:#7B5EA7;color:white;}
.proj-body{padding:1.5rem 1.6rem 1.8rem;flex:1;display:flex;flex-direction:column;}
.proj-client{font-family:var(--f);font-size:.58rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--teal);margin-bottom:.4rem;}
.proj-title{font-family:var(--f);font-size:1.05rem;font-weight:700;letter-spacing:-.015em;color:var(--ink);line-height:1.25;margin-bottom:.5rem;}
.proj-scope{font-family:var(--b);font-size:.78rem;color:var(--muted);line-height:1.65;margin-bottom:.8rem;flex:1;}
.proj-awards{display:flex;flex-wrap:wrap;gap:.35rem;padding-bottom:.6rem;}
.proj-award-tag{display:inline-flex;align-items:center;gap:.3rem;font-family:var(--f);font-size:.56rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);padding:.2rem .55rem;border:1px solid var(--line2);border-radius:100px;}
.proj-award-tag.highlight{color:var(--teal);border-color:var(--teal);}

/* Green Stone Note */
.gs-note{background:var(--bg2);border:1px solid var(--line2);border-radius:4px;padding:2.5rem;margin-bottom:2rem;display:grid;grid-template-columns:1fr auto;gap:3rem;align-items:center;}
.gs-note-text p{font-family:var(--b);font-size:.88rem;color:var(--ink2);line-height:1.7;}
.gs-note-text p strong{font-weight:600;color:var(--ink);}
.gs-stat-row{display:flex;gap:2rem;flex-shrink:0;}
.gs-stat{text-align:center;}
.gs-num{font-family:var(--f);font-size:1.8rem;font-weight:700;letter-spacing:-.03em;color:var(--teal);line-height:1;}
.gs-lbl{font-family:var(--b);font-size:.68rem;color:var(--muted);}

/* Work Filter Tabs */
.work-filter-bottom-wrap{
  max-width:1160px;margin:0 auto;padding:0;
}
.filter-see-more-label{
  width:100%;flex-basis:100%;
  font-family:var(--f);font-size:.68rem;font-weight:600;
  letter-spacing:.22em;text-transform:uppercase;color:var(--teal);
  margin:0 0 .75rem;display:block;
}
.work-filter-tabs--bottom{max-width:none;margin:0 0 2rem;}
.work-tab-select--bottom{max-width:none;margin:0 0 2rem;}
.work-filter-tabs{
  max-width:1160px;margin:0 auto 2rem;padding:0;
  display:flex;gap:.5rem;flex-wrap:wrap;
}
.work-tab{
  font-family:var(--f);font-size:.72rem;font-weight:600;
  letter-spacing:.06em;text-transform:uppercase;
  padding:.55rem 1.2rem;border-radius:100px;
  border:1px solid var(--line2);background:transparent;
  color:var(--muted);cursor:pointer;transition:all .2s;
  white-space:nowrap;
}
.work-tab:hover{color:var(--ink);border-color:var(--ink);}
.work-tab.active{background:var(--teal);color:white;border-color:var(--teal);}
.work-tab-select{
  display:none;
  font-family:var(--f);font-size:.75rem;color:var(--ink2);
  background:var(--bg);border:1px solid var(--line2);border-radius:4px;
  padding:.65rem 2rem .65rem 1rem;
  appearance:none;-webkit-appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%233A4440'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right .75rem center;
  cursor:pointer;max-width:1160px;margin:0 auto 2rem;
}

/* Project Grids */
.proj-grid-container{max-width:1160px;margin:0 auto;padding-bottom:4rem;}
.proj-grid-row{
  display:grid;gap:1px;background:var(--line2);
  border:1px solid var(--line2);overflow:hidden;
}
.proj-grid-row:first-child{border-radius:4px 4px 0 0;}
.proj-grid-row:last-child{border-radius:0 0 4px 4px;}
.proj-grid-row:only-child{border-radius:4px;}
.proj-grid-row + .proj-grid-row{border-top:0;}
.proj-grid-row.cols-2{grid-template-columns:1fr 1fr;}
.proj-grid-row.cols-3{grid-template-columns:repeat(3,1fr);}
.proj-grid-row.cols-2 .proj-img{height:260px;}
.proj-grid-row.cols-3 .proj-img{height:200px;}

/* Project Link */
.proj-footer{
  display:flex;align-items:center;gap:.5rem;
  margin-top:auto;
  border-top:1px solid var(--line);
  padding-top:.8rem;
}
.proj-footer-dot{
  color:var(--line2);font-size:.6rem;
}
.proj-link{
  display:inline-flex;align-items:center;gap:.3rem;
  font-family:var(--f);font-size:.72rem;font-weight:600;
  color:var(--teal);text-decoration:none;
  transition:color .2s,gap .2s;
}
.proj-link:hover{color:var(--ink);gap:.5rem;}

/* Project Year */
.proj-year{
  font-family:var(--f);font-size:.72rem;font-weight:500;
  letter-spacing:.08em;
  color:var(--muted);
}

/* Career */
.career-section{max-width:1160px;margin:3rem auto 0;padding:3rem 0;border-top:1px solid var(--line);}
.career-item{display:grid;grid-template-columns:1fr auto;align-items:center;padding:1.4rem 0;border-top:1px solid var(--line);}
.career-item:last-child{border-bottom:1px solid var(--line);}
.career-name{font-family:var(--f);font-size:1.05rem;font-weight:700;color:var(--ink);margin-bottom:.25rem;}
.career-name a{color:inherit;text-decoration:none;transition:color .2s;}
.career-name a:hover{color:var(--teal);}
.career-role{font-family:var(--b);font-size:.88rem;color:var(--ink2);}
.career-dates{font-family:var(--b);font-size:.78rem;color:var(--muted);text-align:right;line-height:1.6;}

/* ============================================
   RECOGNITION PAGE
   ============================================ */
.rec-hero{background:var(--ink);padding:9rem 3.5rem 6rem;}
.rec-hero-inner{max-width:1160px;margin:0 auto;}
.rec-hero .page-kicker{color:var(--teal2);}
.rec-hero .page-kicker::before{background:var(--teal2);}
.rec-hero .page-h1{color:white;}
.rec-hero .page-h1 em{color:var(--teal2);}
.rec-hero .page-sub{color:rgba(255,255,255,.6);}

.rec-section{max-width:1160px;margin:0 auto;padding:5rem 0;}

/* Testimonials */
.testimonial-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;}
.testimonial-card{background:var(--bg2);border:1px solid var(--line2);border-radius:4px;padding:2rem;}
.testimonial-quote{font-family:var(--b);font-size:.92rem;line-height:1.75;color:var(--ink2);margin-bottom:1.5rem;font-style:italic;}
.testimonial-quote::before{content:'\201C';}
.testimonial-quote::after{content:'\201D';}
.testimonial-attr{font-family:var(--f);font-size:.72rem;font-weight:600;color:var(--ink);}
.testimonial-title{font-family:var(--b);font-size:.75rem;color:var(--muted);margin-top:.2rem;}

.testimonial-list{margin-top:1.5rem;display:none;border-top:1px solid var(--line);}
.testimonial-list-item{padding:1.2rem 0;border-bottom:1px solid var(--line);}
.testimonial-list-quote{font-family:var(--b);font-size:.88rem;line-height:1.7;color:var(--ink2);font-style:italic;margin-bottom:.5rem;}
.testimonial-list-attr{font-family:var(--f);font-size:.75rem;font-weight:600;color:var(--ink);}
.testimonial-list-title{font-family:var(--b);font-size:.73rem;color:var(--muted);margin-top:.15rem;}

/* Awards Table */
.awards-table{width:100%;border-collapse:collapse;}
.awards-table thead tr{border-bottom:1px solid var(--line2);}
.awards-table th{font-family:var(--f);font-size:.65rem;font-weight:600;letter-spacing:.15em;text-transform:uppercase;color:var(--muted);padding:.7rem 1.2rem .7rem 0;text-align:left;}
.awards-table tbody tr{border-bottom:1px solid var(--line);transition:background .15s;}
.awards-table tbody tr:hover{background:var(--bg2);}
.awards-table td{font-family:var(--b);font-size:.85rem;color:var(--ink2);padding:.9rem 1.2rem .9rem 0;vertical-align:top;line-height:1.45;}
.td-show{font-family:var(--f);font-weight:600;color:var(--ink);}
.td-project{color:var(--ink);font-weight:500;}
.level-badge{font-family:var(--f);font-size:.58rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:.2rem .6rem;border-radius:100px;white-space:nowrap;}
.lv-grand{background:#7B5EA7;color:white;}
.lv-titanium{background:#7060A0;color:white;}
.lv-gold{background:var(--gold);color:white;}
.lv-silver{background:var(--muted);color:white;}
.lv-special{background:var(--teal);color:white;}
.lv-bronze{background:#7A6346;color:white;}

/* ============================================
   CONTACT PAGE
   ============================================ */
.contact-wrap{min-height:100vh;display:grid;grid-template-columns:1fr 1fr;padding-top:64px;}

/* Left Panel */
.contact-left{
  background:var(--ink);padding:5rem 4rem 5rem calc(max(3.5rem, (100vw - 1160px) / 2));
  display:flex;flex-direction:column;justify-content:center;position:relative;overflow:hidden;
}
.contact-left::before{content:'';position:absolute;bottom:-80px;right:-80px;width:320px;height:320px;border-radius:50%;border:1px solid rgba(255,255,255,.06);pointer-events:none;}
.contact-left::after{content:'';position:absolute;bottom:20px;right:20px;width:180px;height:180px;border-radius:50%;border:1px solid rgba(255,255,255,.04);pointer-events:none;}

.contact-kicker{font-family:var(--f);font-size:.63rem;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--teal2);display:flex;align-items:center;gap:.75rem;margin-bottom:1.8rem;}
.contact-h1{font-family:var(--f);font-size:clamp(2.2rem,4vw,3.4rem);font-weight:700;line-height:1.0;letter-spacing:-.035em;color:white;margin-bottom:1.2rem;}
.contact-h1 em{font-style:normal;color:var(--teal2);}
.contact-tagline{font-family:var(--b);font-size:.95rem;line-height:1.75;color:rgba(255,255,255,.6);max-width:40ch;margin-bottom:3.5rem;}

.contact-details{display:flex;flex-direction:column;gap:1.5rem;margin-bottom:3.5rem;}
.contact-detail{display:flex;align-items:flex-start;gap:1rem;}
.detail-icon{width:36px;height:36px;border-radius:50%;background:rgba(255,255,255,.08);flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:.85rem;margin-top:.05rem;color:rgba(255,255,255,.75);}
.detail-label{font-family:var(--f);font-size:.58rem;font-weight:600;letter-spacing:.15em;text-transform:uppercase;color:rgba(255,255,255,.6);margin-bottom:.2rem;}
.detail-value{font-family:var(--b);font-size:.9rem;color:rgba(255,255,255,.9);}
.detail-value a{color:white;text-decoration:none;transition:color .2s;}
.detail-value a:hover{color:rgba(255,255,255,.7);text-decoration:underline;}

/* Right Panel — Form */
.contact-right{background:var(--bg);padding:5rem 3.5rem 5rem 4rem;display:flex;flex-direction:column;justify-content:center;}
.form-title{font-family:var(--f);font-size:1.5rem;font-weight:700;letter-spacing:-.02em;color:var(--ink);margin-bottom:.4rem;}
.form-sub{font-family:var(--b);font-size:.85rem;color:var(--muted);line-height:1.65;margin-bottom:2.5rem;}

.contact-form{display:flex;flex-direction:column;gap:1.25rem;}
.field{display:flex;flex-direction:column;gap:.4rem;}
.field label{font-family:var(--f);font-size:.62rem;font-weight:600;letter-spacing:.15em;text-transform:uppercase;color:var(--muted);}
.field label .req{color:var(--teal);}
.field input,.field select,.field textarea{
  font-family:var(--b);font-size:.9rem;font-weight:400;color:var(--ink);
  background:var(--bg);border:1.5px solid var(--line2);border-radius:2px;
  padding:.75rem 1rem;transition:border-color .2s,box-shadow .2s;outline:none;width:100%;
  -webkit-appearance:none;appearance:none;
}
.field input::placeholder,.field textarea::placeholder{color:var(--muted);}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--teal);box-shadow:0 0 0 3px rgba(26,107,98,.12);}
.field input[aria-invalid="true"],.field textarea[aria-invalid="true"]{border-color:#c0392b;box-shadow:0 0 0 3px rgba(192,57,43,.1);}
.field textarea{resize:vertical;min-height:110px;line-height:1.65;}
.field select{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%237A8480' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 1rem center;padding-right:2.5rem;cursor:pointer;
}

.form-submit{margin-top:.5rem;}
.submit-btn{
  font-family:var(--f);font-size:.72rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
  background:var(--teal);color:white;border:none;
  padding:1rem 2.5rem;border-radius:2px;cursor:pointer;transition:background .2s;
  display:inline-flex;align-items:center;gap:.5rem;width:100%;justify-content:center;
}
.submit-btn:hover{background:var(--teal2);}
.submit-btn:disabled{opacity:.6;cursor:not-allowed;background:var(--teal);}
.form-note{font-family:var(--b);font-size:.72rem;color:var(--muted);line-height:1.6;margin-top:.8rem;text-align:center;}

/* Success State */
.success-state{display:none;text-align:center;padding:3rem 2rem;}
.success-icon{width:56px;height:56px;border-radius:50%;background:var(--teal);display:flex;align-items:center;justify-content:center;margin:0 auto 1.5rem;font-size:1.4rem;color:white;}
.success-h{font-family:var(--f);font-size:1.5rem;font-weight:700;letter-spacing:-.02em;color:var(--ink);margin-bottom:.6rem;}
.success-p{font-family:var(--b);font-size:.9rem;color:var(--muted);line-height:1.7;max-width:36ch;margin:0 auto;}

/* ============================================
   RESPONSIVE
   ============================================ */
@media(max-width:960px){
  /* Disable parallax on mobile for performance */
  .parallax-orb{display:none!important;}
  .rec-hero::before,.rec-hero::after{display:none;}
  .cta-band::before,.cta-band::after{display:none;}
  [data-parallax]{transform:none!important;}

  #nav{padding:0 1.5rem;}
  .nav-links{
    display:none;position:fixed;top:64px;left:0;right:0;
    background:var(--bg);flex-direction:column;padding:2rem 1.5rem;
    border-bottom:1px solid var(--line);gap:1.5rem;
    box-shadow:0 8px 24px rgba(20,28,26,.08);
  }
  .nav-links.open{display:flex;}
  .nav-toggle{display:flex;}

  .hero{grid-template-columns:1fr;min-height:auto;}
  .hero-left{padding:8rem 1.5rem 4rem;}
  .hero-right{height:50vh;}
  .hero-right-overlay{display:none;}

  .what-i-do{grid-template-columns:1fr;padding:4rem 1.5rem;gap:3rem;}
  .work-filter-tabs{padding:0 1.5rem;}
  .work-filter-bottom-wrap{padding:0 1.5rem;}
  .proj-grid-container{padding:0 1.5rem 4rem;}
  .proj-grid-row.cols-3{grid-template-columns:1fr 1fr;}
  .clients{padding:4rem 1.5rem;}
  .columns-wrap{grid-template-columns:1fr;}
  .network{grid-template-columns:1fr;padding:4rem 1.5rem;gap:3rem;}

  .page-hero{padding:calc(64px + 3rem) 1.5rem 2rem;}
  .era-section{padding:2rem 1.5rem 4rem;}
  .project-grid{grid-template-columns:1fr 1fr;}
  .gs-note{grid-template-columns:1fr;gap:1.5rem;}
  .rec-hero{padding:8rem 1.5rem 4rem;}
  .rec-section{padding:3rem 1.5rem;}
  .testimonial-grid{grid-template-columns:1fr;}
  .awards-table{font-size:.78rem;}
  .awards-table th,.awards-table td{padding:.6rem .6rem .6rem 0;}

  .contact-wrap{grid-template-columns:1fr;min-height:auto;}
  .contact-left{padding:8rem 1.5rem 4rem;}
  .contact-right{padding:4rem 1.5rem 5rem;}

  .cta-band{padding:4rem 1.5rem;}
  .cta-inner{flex-direction:column;gap:2rem;text-align:center;}
  .site-footer{padding:2.5rem 1.5rem;}
  .footer-inner{flex-direction:column-reverse;align-items:center;gap:1rem;}
  .footer-meta{text-align:center !important;max-width:100% !important;}
}

@media(max-width:640px){
  .work-filter-tabs .work-tab{display:none;}
  .work-tab-select{display:block;}
}
@media(max-width:580px){
  .project-grid{grid-template-columns:1fr;}
  .proj-grid-row.cols-2,.proj-grid-row.cols-3{grid-template-columns:1fr;}
  .network-numbers{grid-template-columns:1fr;}
}

/* Reduced motion preference */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:0.01ms!important;
    animation-iteration-count:1!important;
    transition-duration:0.01ms!important;
    scroll-behavior:auto!important;
  }
  .reveal{opacity:1;transform:none;}
  .method-item,.testimonial-card,.project-card{opacity:1;transform:none;}
  [data-parallax]{transform:none!important;}
  .parallax-orb{display:none!important;}
  html{scroll-behavior:auto;}
}

/* ============================================
   THOUGHT LEADERSHIP PAGE
   ============================================ */

/* Hero */
.tl-hero {
  background: var(--ink);
  padding: 9rem 3.5rem 6rem;
  position: relative;
  overflow: hidden;
}
.tl-hero::before {
  content: '';
  position: absolute;
  top: -120px;
  right: -80px;
  width: 400px;
  height: 400px;
  border-radius: 50%;
  border: 1px solid rgba(46,148,133,.08);
  pointer-events: none;
}
.tl-hero::after {
  content: '';
  position: absolute;
  bottom: -60px;
  left: 10%;
  width: 250px;
  height: 250px;
  border-radius: 50%;
  border: 1px solid rgba(255,255,255,.04);
  pointer-events: none;
}
.tl-hero-inner {
  max-width: 1160px;
  margin: 0 auto;
}
.tl-hero .page-kicker { color: var(--teal2); }
.tl-hero .page-kicker::before { background: var(--teal2); }
.tl-hero .page-h1 { color: white; }
.tl-hero .page-h1 em { color: var(--teal2); }
.tl-hero .page-sub { color: rgba(255,255,255,.6); }

/* Content section */
.tl-content {
  max-width: 1160px;
  margin: 0 auto;
  padding: 5rem 0 5rem;
}

/* Featured cards — image left / content right */
.tl-featured-container {
  border: 1px solid var(--line2);
  border-radius: 4px;
  overflow: hidden;
}

.tl-featured-card {
  display: grid;
  grid-template-columns: 300px 1fr;
  background: var(--bg);
  transition: background .15s;
  cursor: pointer;
  border-bottom: 1px solid var(--line);
}
.tl-featured-card:last-child {
  border-bottom: none;
}
.tl-featured-card:hover {
  background: var(--bg2);
}

.tl-card-img {
  overflow: hidden;
}
.tl-card-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  min-height: 180px;
  transition: transform .4s ease;
}
.tl-featured-card:hover .tl-card-img img {
  transform: scale(1.04);
}

.tl-card-body {
  padding: 1.8rem 2.2rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.tl-card-meta {
  display: flex;
  align-items: center;
  gap: .75rem;
  margin-bottom: .6rem;
}

.tl-card-type {
  font-family: var(--f);
  font-size: .55rem;
  font-weight: 700;
  letter-spacing: .15em;
  text-transform: uppercase;
  padding: .2rem .6rem;
  border-radius: 100px;
  display: inline-block;
  width: fit-content;
}
.tl-type-article { background: var(--teal); color: white; }
.tl-type-podcast { background: var(--gold); color: white; }
.tl-type-video   { background: var(--ink); color: white; }

.tl-card-pub {
  font-family: var(--f);
  font-size: .62rem;
  font-weight: 600;
  letter-spacing: .15em;
  text-transform: uppercase;
  color: var(--teal);
}

.tl-card-title {
  font-family: var(--f);
  font-size: 1.1rem;
  font-weight: 700;
  letter-spacing: -.01em;
  color: var(--ink);
  line-height: 1.25;
  margin-bottom: .5rem;
}

.tl-card-desc {
  font-family: var(--b);
  font-size: .82rem;
  color: var(--muted);
  line-height: 1.65;
  margin-bottom: .8rem;
}

.tl-card-link {
  font-family: var(--f);
  font-size: .68rem;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--teal);
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: .3rem;
  transition: color .2s;
}
.tl-card-link:hover { color: var(--ink); }

/* Archive list */
.tl-archive-container {
  border: 1px solid var(--line2);
  border-radius: 4px;
  overflow: hidden;
  margin-top: 2.5rem;
}

.tl-list-item {
  display: grid;
  grid-template-columns: 1fr auto auto;
  gap: 2rem;
  align-items: center;
  padding: .95rem 1.5rem;
  border-bottom: 1px solid var(--line);
  transition: background .15s, padding-left .15s, padding-right .15s;
  cursor: pointer;
}
.tl-list-item:last-child {
  border-bottom: none;
}
.tl-list-item:hover {
  background: var(--bg2);
  padding-left: 2.25rem;
  padding-right: 2.25rem;
}

.tl-list-title {
  font-family: var(--f);
  font-size: .9rem;
  font-weight: 600;
  color: var(--ink);
  text-decoration: none;
  letter-spacing: -.01em;
  transition: color .15s;
  line-height: 1.35;
}
.tl-list-title:hover { color: var(--teal); }

.tl-list-pub {
  font-family: var(--b);
  font-size: .75rem;
  color: var(--muted);
  white-space: nowrap;
  flex-shrink: 0;
}

.tl-list-type {
  font-family: var(--f);
  font-size: .52rem;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  padding: .18rem .5rem;
  border-radius: 100px;
  white-space: nowrap;
}

/* ============================================
   WORK PAGE — CASE STUDY OVERLAY
   ============================================ */

.cs-overlay {
  position: fixed; inset: 0; z-index: 9999;
  background: rgba(20,28,26,.85);
  backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
  opacity: 0; visibility: hidden;
  transition: opacity .3s ease, visibility .3s ease;
  overflow-y: auto; -webkit-overflow-scrolling: touch;
}
.cs-overlay.cs-open { opacity: 1; visibility: visible; }

.cs-close {
  position: fixed; top: 1.5rem; right: 1.5rem; z-index: 10001;
  width: 44px; height: 44px; border-radius: 50%;
  background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.15);
  color: white; font-size: 1.2rem; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: background .2s;
}
.cs-close:hover { background: rgba(255,255,255,.2); }

.cs-toolbar-line {
  position: fixed; top: 5.75rem; left: 0; right: 0; height: 1px;
  background: rgba(255,255,255,.08); z-index: 10000;
  pointer-events: none;
}

.cs-inner {
  max-width: 1060px; margin: 0 auto;
  padding: 7.5rem 2rem 4rem;
  display: grid; grid-template-columns: 320px 1fr; gap: 4rem;
}

.cs-meta-col { position: sticky; top: 7.5rem; align-self: start; }

.cs-title {
  font-family: var(--f); font-size: 1.6rem; font-weight: 700;
  color: white; letter-spacing: -.02em; line-height: 1.15; margin-bottom: 2rem;
}

.cs-meta-label {
  font-family: var(--f); font-size: .58rem; font-weight: 700;
  letter-spacing: .15em; text-transform: uppercase;
  color: rgba(255,255,255,.4); margin-bottom: .2rem;
}
.cs-meta-value {
  font-family: var(--b); font-size: .85rem; font-weight: 500;
  color: rgba(255,255,255,.85); margin-bottom: 1.1rem;
}

.cs-section-label {
  font-family: var(--f); font-size: .62rem; font-weight: 700;
  letter-spacing: .15em; text-transform: uppercase;
  color: var(--teal2); margin: 2rem 0 .6rem;
}

.cs-body-text {
  font-family: var(--b); font-size: .85rem; font-weight: 400;
  color: rgba(255,255,255,.7); line-height: 1.75;
}

.cs-recognition-item {
  font-family: var(--b); font-size: .82rem;
  color: rgba(255,255,255,.65); line-height: 1.8;
  padding-left: .8rem; position: relative;
}
.cs-recognition-item::before {
  content: '•'; position: absolute; left: 0; color: var(--teal2);
}

.cs-images-col { display: flex; flex-direction: column; gap: 1.25rem; }
.cs-images-col img {
  width: 100%; border-radius: 4px; display: block;
  box-shadow: 0 4px 24px rgba(0,0,0,.3);
}

/* Linked project image with teal bottom bar */
.cs-img-link {
  display: block; position: relative; border-radius: 4px;
  overflow: hidden; text-decoration: none;
  box-shadow: 0 4px 24px rgba(0,0,0,.3);
}
.cs-img-link img {
  width: 100%; display: block;
  transition: transform .5s ease;
  box-shadow: none;
}
.cs-img-link:hover img { transform: scale(1.03); }
.cs-img-bar {
  position: absolute; left: 0; right: 0; bottom: 0;
  padding: .9rem 1.2rem;
  background: var(--teal);
  display: flex; align-items: center; justify-content: space-between;
  transition: background .2s;
}
.cs-img-link:hover .cs-img-bar { background: var(--teal2); }
.cs-img-bar-label {
  font-family: var(--f); font-size: .7rem; font-weight: 700;
  letter-spacing: .08em; text-transform: uppercase;
  color: white; white-space: nowrap;
}
.cs-img-bar-arrow {
  width: 28px; height: 28px; border-radius: 50%;
  border: 1px solid rgba(255,255,255,.4);
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0; color: white;
  transition: border-color .2s, background .2s;
}
.cs-img-link:hover .cs-img-bar-arrow {
  border-color: white;
  background: rgba(255,255,255,.15);
}

.cs-nav {
  position: fixed; top: 1.5rem; left: 1.5rem; z-index: 10001;
  display: flex; align-items: center; gap: .5rem;
}
.cs-nav-btn {
  width: 44px; height: 44px; border-radius: 50%;
  background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.15);
  color: white; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: background .2s;
}
.cs-nav-btn:hover { background: rgba(255,255,255,.2); }
.cs-nav-btn:disabled { opacity: .25; cursor: default; pointer-events: none; }
.cs-nav-count {
  font-family: var(--f); font-size: .62rem; font-weight: 600;
  letter-spacing: .06em; color: rgba(255,255,255,.4);
  min-width: 2.5rem; text-align: center;
}

/* ============================================
   RECOGNITION — PHOTO GRID
   ============================================ */

.photo-grid {
  max-width: 1160px;
  margin: 0 auto;
  padding: 0 0 4rem;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 1rem;
}
.photo-grid img {
  width: 100%;
  height: 240px;
  object-fit: cover;
  border-radius: 4px;
}

/* ============================================
   SHARED UTILITY — HIDDEN STATES
   ============================================ */

/* Awards table extra rows — hidden until toggled */
.award-extra { display: none; }

/* Form error message */
.form-error {
  margin-top: .8rem;
  text-align: center;
  font-family: var(--b);
  font-size: .78rem;
  color: #c0392b;
  line-height: 1.5;
}

/* ============================================
   RESPONSIVE — TL + CS OVERLAY ADDITIONS
   ============================================ */

@media(max-width:960px) {
  .tl-hero { padding: 8rem 1.5rem 4rem; }
  .tl-hero::before, .tl-hero::after { display: none; }
  .tl-content { padding: 3rem 1.5rem 4rem; }
  .tl-featured-card { grid-template-columns: 1fr; }
  .tl-card-img img { min-height: 200px; max-height: 220px; }
  .tl-card-body { padding: 1.5rem; }
  .tl-archive-container { margin-top: 1.5rem; }
  .tl-list-item { grid-template-columns: 1fr auto; gap: 1rem; padding: .85rem 1rem; }
  .tl-list-item:hover { padding-left: 1.5rem; padding-right: 1.5rem; }
  .tl-list-type { display: none; }

  .cs-inner { grid-template-columns: 1fr; gap: 2rem; padding: 7.5rem 1.5rem 3rem; }
  .cs-meta-col { position: static; }
  .cs-title { font-size: 1.3rem; }

  .photo-grid { grid-template-columns: 1fr 1fr; }
  .photo-grid-hide { display: none; }

  .build-org { padding: 5rem 1.5rem; }
  .org-grid { grid-template-columns: 1fr 1fr; }
}

@media(max-width:600px) {
  .org-grid { grid-template-columns: 1fr; }
  .org-card { padding: 1.75rem 1.5rem; }
}

/* Visually hidden (screen-reader only) */
.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0,0,0,0);
  white-space: nowrap;
  border: 0;
}

/* Extracted Utility Classes */
.text-body-secondary { font-family: var(--b); font-size: .95rem; line-height: 1.8; color: var(--ink2); cursor: default; }
.mb-1 { margin-bottom: 1.2rem; }
.footer-legal { text-align: right; max-width: 40ch; }

