:root{
  --bg:#07111c;--bg2:#0a1724;--panel:#0b1826;--panel2:#0d1c2b;--text:#f2f6fa;--muted:#9aaabd;--muted2:#71879c;--line:rgba(255,255,255,.11);--cyan:#71d9eb;--green:#70e4c7;--max:1380px
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:radial-gradient(circle at 82% 5%,rgba(55,143,184,.13),transparent 28rem),var(--bg);color:var(--text);font-family:'DM Sans',sans-serif;line-height:1.5;overflow-x:hidden}a{color:inherit;text-decoration:none}button{font:inherit}.cursor-glow{position:fixed;width:420px;height:420px;border-radius:50%;background:radial-gradient(circle,rgba(85,190,215,.07),transparent 68%);pointer-events:none;transform:translate(-50%,-50%);z-index:0}.topbar{position:fixed;left:0;right:0;top:0;z-index:30;height:76px;padding:0 max(22px,calc((100vw - var(--max))/2));display:flex;align-items:center;gap:28px;background:linear-gradient(to bottom,rgba(5,12,20,.92),rgba(5,12,20,.58));backdrop-filter:blur(17px);border-bottom:1px solid transparent;transition:.25s}.topbar.scrolled{border-color:var(--line);background:rgba(5,12,20,.88)}.brand{display:flex;align-items:center;gap:11px;font-family:'Space Grotesk';font-size:11px;letter-spacing:.09em;font-weight:700}.brand-mark{display:grid;place-items:center;width:36px;height:36px;border:1px solid rgba(113,217,235,.35);border-radius:10px;color:var(--cyan);background:rgba(113,217,235,.04)}nav{display:flex;gap:22px;margin-left:auto}nav a,.nav-cta{font-size:9px;letter-spacing:.07em;color:#a5b3c0;transition:.2s}nav a:hover,.nav-cta:hover{color:var(--cyan)}.nav-cta{padding:9px 11px;border:1px solid var(--line);border-radius:9px}.hero{min-height:100vh;position:relative;display:flex;align-items:center;overflow:hidden;padding:130px 24px 100px}.hero-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);background-size:58px 58px;mask-image:linear-gradient(to bottom,black 0%,rgba(0,0,0,.65) 65%,transparent 100%);opacity:.32}.hero-grid:after{content:"";position:absolute;width:1px;height:100%;left:66%;top:0;background:linear-gradient(transparent,rgba(113,217,235,.35),transparent)}.hero-rings{position:absolute;right:-80px;top:18%;width:560px;height:560px}.hero-rings i{position:absolute;inset:0;border-radius:50%;border:1px solid rgba(113,217,235,.14)}.hero-rings i:nth-child(2){inset:80px}.hero-rings i:nth-child(3){inset:160px}.hero-content{width:min(var(--max),100%);margin:auto;position:relative;z-index:2;max-width:1060px}.eyebrow{font-size:10px;letter-spacing:.19em;color:var(--cyan);font-weight:700;margin-bottom:25px}.eyebrow span{display:inline-block;width:30px;height:1px;background:var(--cyan);vertical-align:middle;margin-right:10px}.hero h1{font-family:'Space Grotesk';font-size:clamp(56px,7vw,104px);line-height:.93;letter-spacing:-.055em;margin:0;max-width:1000px}.hero h1 em{font-style:normal;color:transparent;background:linear-gradient(95deg,#f5f9fc,var(--cyan),var(--green));background-clip:text;-webkit-background-clip:text}.hero-lede{font-size:19px;line-height:1.75;color:#aebbc8;max-width:820px;margin:30px 0 31px}.hero-actions{display:flex;gap:11px;flex-wrap:wrap}.btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 18px;border-radius:10px;font-size:10px;letter-spacing:.07em;font-weight:700}.btn.primary{color:#06121c;background:linear-gradient(135deg,var(--cyan),var(--green));box-shadow:0 14px 40px rgba(72,205,200,.14)}.btn.secondary{border:1px solid var(--line);background:rgba(255,255,255,.025)}.hero-facts{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border-top:1px solid var(--line);margin-top:54px;max-width:1000px}.hero-facts div{padding:24px 24px 0 0;margin-right:24px;border-right:1px solid var(--line)}.hero-facts div:last-child{border-right:0}.hero-facts strong{display:block;font-family:'Space Grotesk';font-size:31px;letter-spacing:-.04em}.hero-facts span{display:block;color:#74889c;font-size:9px;text-transform:uppercase;letter-spacing:.08em;line-height:1.5;margin-top:5px}.scroll-indicator{position:absolute;z-index:3;bottom:24px;left:50%;transform:translateX(-50%);font-size:8px;letter-spacing:.2em;color:#5f7285}.scroll-indicator span{color:var(--cyan);margin-left:8px}.marquee{border-top:1px solid var(--line);border-bottom:1px solid var(--line);overflow:hidden;white-space:nowrap;color:#61788e;font-size:9px;letter-spacing:.17em;padding:16px 0}.marquee div{width:max-content;animation:marquee 22s linear infinite}.marquee span{color:var(--cyan);margin:0 17px}@keyframes marquee{from{transform:translateX(0)}to{transform:translateX(-35%)}}.section{padding:112px 24px}.section>*{width:min(var(--max),100%);margin-left:auto;margin-right:auto}.section-intro{display:grid;grid-template-columns:.27fr .73fr;column-gap:55px;row-gap:10px;margin-bottom:48px}.section-number{font-size:9px;letter-spacing:.18em;color:var(--cyan);font-weight:700;text-transform:uppercase}.section-intro h2{font-family:'Space Grotesk';font-size:clamp(40px,4.5vw,64px);line-height:1.02;letter-spacing:-.05em;margin:0;max-width:920px}.section-intro>p:last-child{grid-column:2;color:#8fa2b4;font-size:14px;line-height:1.75;max-width:790px}.section-intro.compact{margin-bottom:36px}.accordion-list,.project-accordion{border-top:1px solid var(--line)}.accordion-item,.project-row{border-bottom:1px solid var(--line);background:rgba(255,255,255,.006)}.accordion-item.featured{background:linear-gradient(90deg,rgba(113,217,235,.035),rgba(255,255,255,.006))}.accordion-trigger,.project-trigger{width:100%;border:0;background:none;color:inherit;text-align:left;cursor:pointer;display:grid;align-items:center;padding:28px 0}.accordion-trigger{grid-template-columns:1fr auto 34px;gap:24px}.trigger-kicker,.project-trigger small{font-size:8px;color:#6f8499;letter-spacing:.14em;text-transform:uppercase}.trigger-main h3,.project-trigger h3{font-family:'Space Grotesk';font-size:28px;letter-spacing:-.035em;margin:6px 0 4px}.trigger-main p,.project-trigger p{margin:0;color:#a3b0be;font-size:11px}.trigger-meta{display:flex;gap:7px;flex-wrap:wrap;justify-content:flex-end}.trigger-meta span{border:1px solid var(--line);border-radius:999px;padding:6px 9px;color:#71879a;font-size:8px}.accordion-icon,.project-arrow{display:grid;place-items:center;width:30px;height:30px;border:1px solid var(--line);border-radius:50%;color:var(--cyan);font-size:17px}.accordion-panel,.project-panel{display:grid;grid-template-rows:0fr;opacity:0;transition:grid-template-rows .45s ease,opacity .35s ease}.accordion-panel>* ,.project-panel>*{overflow:hidden}.accordion-item.open .accordion-panel,.project-row.open .project-panel{grid-template-rows:1fr;opacity:1}.detail-grid{display:grid;grid-template-columns:1.35fr .65fr;gap:60px;padding:8px 0 34px}.detail-grid.single{grid-template-columns:1fr}.detail-lead p{color:#aebbc7;font-size:14px;line-height:1.8;max-width:860px}.metric-stack{border-left:1px solid var(--line);padding-left:28px}.metric-stack div{padding:0 0 20px;margin-bottom:20px;border-bottom:1px solid var(--line)}.metric-stack div:last-child{border-bottom:0}.metric-stack strong{display:block;font-family:'Space Grotesk';font-size:29px;letter-spacing:-.04em;margin-bottom:5px}.metric-stack span{font-size:9px;line-height:1.55;color:#758a9e}.work-blocks{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border-top:1px solid var(--line);margin-bottom:34px}.work-blocks div{padding:24px 24px 8px 0;margin-right:24px;border-right:1px solid var(--line)}.work-blocks div:nth-child(3n){border-right:0}.work-blocks small,.project-facts small{color:var(--cyan);font-size:8px;letter-spacing:.15em}.work-blocks p,.project-facts p{color:#8195a8;font-size:10px;line-height:1.65}.projects-section{background:linear-gradient(180deg,transparent,rgba(255,255,255,.012),transparent)}.project-trigger{grid-template-columns:70px 1fr 36px;gap:23px;padding:31px 0}.project-index{font-family:'Space Grotesk';font-size:12px;color:#5e7488;align-self:start;padding-top:4px}.project-trigger h3{font-size:31px}.project-panel>.project-story{overflow:visible}.project-panel{grid-template-columns:1fr}.project-story{padding:0 100px 18px 70px}.project-story p{font-size:14px;line-height:1.85;color:#aab8c6;margin:0 0 16px;max-width:1050px}.project-facts{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border-top:1px solid var(--line);padding-left:70px;margin:0 0 35px}.project-facts div{padding:21px 25px 0 0;margin-right:25px;border-right:1px solid var(--line)}.project-facts div:last-child{border:0}.personal-section{background:#091522}.skills-grid{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.skills-grid>div{padding:34px;border-right:1px solid var(--line)}.skills-grid>div:last-child{border-right:0}.skills-grid span{font-size:8px;letter-spacing:.16em;color:var(--cyan)}.skills-grid h3{font-family:'DM Sans';font-size:13px;font-weight:500;color:#b6c4d1;margin:17px 0}.cv-section{padding-top:70px;padding-bottom:70px}.cv-card{display:flex;align-items:center;justify-content:space-between;gap:35px;padding:44px;border:1px solid var(--line);border-radius:21px;background:radial-gradient(circle at 87% 25%,rgba(112,228,199,.08),transparent 23%),var(--panel)}.cv-card h2{font-family:'Space Grotesk';font-size:42px;letter-spacing:-.04em;margin:8px 0}.cv-card p:not(.section-number){color:#8498ab;font-size:12px;max-width:650px}.contact-section{padding-top:70px}.contact-panel{padding:60px;border-radius:24px;border:1px solid rgba(94,216,230,.2);background:radial-gradient(circle at 80% 10%,rgba(92,210,227,.12),transparent 28%),radial-gradient(circle at 15% 100%,rgba(102,222,186,.08),transparent 30%),#0b1928}.contact-panel h2{font-family:'Space Grotesk';font-size:64px;letter-spacing:-.05em;margin:12px 0}.contact-panel>p:not(.section-number){color:#92a4b7}.contact-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:32px}.contact-grid a{padding:19px;border:1px solid var(--line);border-radius:13px;background:rgba(255,255,255,.015);transition:.2s}.contact-grid a:hover{border-color:rgba(113,217,235,.4);transform:translateY(-2px)}.contact-grid small{display:block;color:#698095;font-size:8px;letter-spacing:.15em}.contact-grid strong{display:block;font-family:'Space Grotesk';font-size:17px;margin:8px 0}.contact-grid span{display:block;color:var(--cyan);font-size:8px}.reveal{opacity:0;transform:translateY(18px);transition:.7s ease}.reveal.visible{opacity:1;transform:none}footer{width:min(var(--max),calc(100% - 48px));margin:auto;padding:25px 0 38px;border-top:1px solid var(--line);display:flex;justify-content:space-between;color:#5f7388;font-size:9px}
@media(max-width:1050px){nav{display:none}.nav-cta{margin-left:auto}.hero-facts{grid-template-columns:repeat(2,1fr)}.section-intro{grid-template-columns:1fr}.section-intro>p:last-child{grid-column:auto}.detail-grid{grid-template-columns:1fr}.metric-stack{border-left:0;border-top:1px solid var(--line);padding:25px 0 0}.work-blocks{grid-template-columns:1fr 1fr}.work-blocks div:nth-child(3n){border-right:1px solid var(--line)}.work-blocks div:nth-child(2n){border-right:0}.contact-grid{grid-template-columns:1fr}}
@media(max-width:720px){.topbar{height:66px;padding:0 15px}.brand span:last-child{display:none}.hero{padding:110px 18px 85px}.hero h1{font-size:54px}.hero-lede{font-size:16px}.hero-facts{grid-template-columns:1fr 1fr}.hero-facts div{padding-right:12px;margin-right:12px}.section{padding:82px 18px}.accordion-trigger{grid-template-columns:1fr 30px}.trigger-meta{grid-column:1/-1;justify-content:flex-start;order:3}.trigger-main h3,.project-trigger h3{font-size:23px}.accordion-icon{grid-column:2;grid-row:1}.work-blocks{grid-template-columns:1fr}.work-blocks div{border-right:0!important;margin-right:0}.project-trigger{grid-template-columns:45px 1fr 30px;gap:13px}.project-story{padding:0 0 14px 45px}.project-facts{grid-template-columns:1fr;padding-left:45px}.project-facts div{border-right:0;border-bottom:1px solid var(--line);margin-right:0;padding-bottom:15px}.cv-card{flex-direction:column;align-items:flex-start;padding:30px}.contact-panel{padding:36px 24px}.contact-panel h2{font-size:48px}footer{flex-direction:column;gap:8px}}


/* V3 — compact closed rows + clearer expand controls */
.accordion-item,.project-row{overflow:hidden}
.accordion-trigger,.project-trigger{padding-top:20px;padding-bottom:20px}
.accordion-panel,.project-panel{
  display:block;
  max-height:0;
  opacity:0;
  overflow:hidden;
  visibility:hidden;
  transition:max-height .55s cubic-bezier(.2,.7,.2,1), opacity .28s ease, visibility 0s linear .55s;
}
.accordion-item.open .accordion-panel,.project-row.open .project-panel{
  max-height:3200px;
  opacity:1;
  visibility:visible;
  transition:max-height .7s cubic-bezier(.2,.7,.2,1), opacity .3s ease .08s, visibility 0s;
}
.accordion-icon,.project-arrow{
  width:38px;
  height:38px;
  font-size:22px;
  font-weight:500;
  border-color:rgba(113,217,235,.32);
  background:rgba(113,217,235,.055);
  box-shadow:inset 0 0 0 1px rgba(113,217,235,.025);
  transition:transform .2s ease,border-color .2s ease,background .2s ease;
}
.accordion-trigger:hover .accordion-icon,.project-trigger:hover .project-arrow{
  border-color:rgba(113,217,235,.65);
  background:rgba(113,217,235,.10);
  transform:scale(1.06);
}
.accordion-trigger{grid-template-columns:1fr auto 42px}
.project-trigger{grid-template-columns:70px 1fr 42px}
.accordion-item:not(.open) .accordion-trigger,.project-row:not(.open) .project-trigger{margin-bottom:0}
@media(max-width:720px){
  .accordion-trigger{grid-template-columns:1fr 40px;padding-top:18px;padding-bottom:18px}
  .project-trigger{grid-template-columns:45px 1fr 40px;padding-top:18px;padding-bottom:18px}
  .accordion-icon,.project-arrow{width:36px;height:36px;font-size:21px}
}


/* V4 — make McDonald's internal promotions unmistakable without changing the V3 layout */
.promotion-label{
  display:inline-flex;align-items:center;margin-right:8px;padding:3px 7px;border-radius:999px;
  border:1px solid rgba(113,217,235,.34);background:rgba(113,217,235,.07);
  color:var(--cyan);font-size:7px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;vertical-align:1px
}
.career-progression{
  display:grid;grid-template-columns:1fr 74px 1fr 74px 1fr;align-items:stretch;gap:0;
  margin:7px 0 34px;padding:0 0 30px;border-bottom:1px solid var(--line)
}
.progression-step{
  position:relative;padding:20px 22px;border:1px solid var(--line);border-radius:15px;
  background:rgba(255,255,255,.012);min-height:138px
}
.progression-step.current{
  border-color:rgba(113,217,235,.28);
  background:linear-gradient(145deg,rgba(113,217,235,.065),rgba(112,228,199,.025))
}
.progression-step:before{
  content:"";position:absolute;left:20px;top:-1px;width:48px;height:1px;background:var(--cyan);opacity:.55
}
.progression-date{
  display:block;color:#6f8499;font-size:8px;letter-spacing:.13em;text-transform:uppercase;margin-bottom:12px
}
.progression-step strong{
  display:block;font-family:'Space Grotesk';font-size:20px;letter-spacing:-.025em;margin-bottom:7px
}
.progression-step small{display:block;color:#8296a9;font-size:9px;line-height:1.55}
.progression-connector{position:relative;display:flex;align-items:center;justify-content:center}
.progression-connector:before{content:"";position:absolute;left:8px;right:8px;height:1px;background:linear-gradient(90deg,rgba(113,217,235,.18),rgba(113,217,235,.65),rgba(113,217,235,.18))}
.progression-connector:after{content:"›";position:absolute;right:5px;color:var(--cyan);font-size:17px;line-height:1;top:50%;transform:translateY(-55%)}
.progression-connector span{
  position:relative;z-index:1;padding:4px 6px;border-radius:999px;background:var(--bg);
  color:var(--cyan);font-size:6px;font-weight:700;letter-spacing:.12em;text-transform:uppercase
}
@media(max-width:900px){
  .career-progression{grid-template-columns:1fr;gap:10px}
  .progression-connector{height:24px}
  .progression-connector:before{left:50%;right:auto;top:0;bottom:0;width:1px;height:auto}
  .progression-connector:after{content:"↓";right:auto;left:50%;top:auto;bottom:-1px;transform:translateX(-50%);font-size:12px}
  .progression-connector span{display:none}
}

/* V5 — expanded McDonald's role-by-role progression */
.career-progression-vertical{
  display:block;
  margin:7px 0 34px;
  padding:0 0 30px;
  border-bottom:1px solid var(--line);
}
.career-progression-vertical .progression-step{
  min-height:0;
  padding:24px 26px;
}
.career-progression-vertical .progression-step p{
  margin:10px 0 0;
  color:#9fb0bf;
  font-size:12px;
  line-height:1.75;
  max-width:1080px;
}
.career-progression-vertical .progression-step strong{
  margin-bottom:0;
}
.progression-connector-vertical{
  min-height:0;
  display:grid;
  grid-template-columns:105px 1fr;
  gap:20px;
  align-items:start;
  padding:14px 22px 14px 38px;
  position:relative;
}
.progression-connector-vertical:before{
  content:"";
  position:absolute;
  left:25px;
  top:-2px;
  bottom:-2px;
  width:1px;
  height:auto;
  background:linear-gradient(to bottom,rgba(113,217,235,.2),rgba(113,217,235,.75),rgba(113,217,235,.2));
}
.progression-connector-vertical:after{
  content:"↓";
  position:absolute;
  left:20px;
  bottom:-7px;
  color:var(--cyan);
  font-size:13px;
  line-height:1;
}
.progression-connector-vertical span{
  position:relative;
  z-index:1;
  width:max-content;
  margin-top:2px;
  padding:5px 8px;
  border:1px solid rgba(113,217,235,.25);
  border-radius:999px;
  background:rgba(113,217,235,.05);
  color:var(--cyan);
  font-size:7px;
  font-weight:700;
  letter-spacing:.14em;
  text-transform:uppercase;
}
.progression-connector-vertical p{
  position:relative;
  z-index:1;
  margin:0;
  color:#8196aa;
  font-size:10px;
  line-height:1.65;
  max-width:900px;
}
.progression-connector-vertical p strong{
  color:#cbd6df;
  font-family:'DM Sans',sans-serif;
  font-size:inherit;
  letter-spacing:0;
}
.mc-summary-grid{padding-top:0}
@media(max-width:720px){
  .progression-connector-vertical{grid-template-columns:1fr;padding-left:34px;gap:8px}
  .progression-connector-vertical:before{left:17px}
  .progression-connector-vertical:after{left:12px}
  .career-progression-vertical .progression-step{padding:20px 18px}
}


/* V6 — blended hero portrait background */
.hero{
  background:linear-gradient(115deg,#030d18 0%,#071423 54%,#04101d 100%);
}
.hero:before{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg,rgba(3,13,24,.96) 0%,rgba(3,13,24,.91) 26%,rgba(3,13,24,.78) 42%,rgba(3,13,24,.42) 58%,rgba(3,13,24,.10) 100%),
    linear-gradient(180deg,rgba(3,13,24,.18) 0%,rgba(3,13,24,.06) 48%,rgba(3,13,24,.86) 100%);
  z-index:0;
  pointer-events:none;
}
.hero-photo{
  position:absolute;
  top:0;
  right:0;
  bottom:0;
  width:min(57vw,980px);
  background-image:url('assets/images/hero-wastewater-photo.png');
  background-size:cover;
  background-position:68% center;
  opacity:.97;
  z-index:0;
  pointer-events:none;
  filter:saturate(1.02) contrast(1.02);
  -webkit-mask-image:linear-gradient(to left, rgba(0,0,0,1) 52%, rgba(0,0,0,.95) 62%, rgba(0,0,0,.72) 72%, rgba(0,0,0,.28) 84%, rgba(0,0,0,0) 100%), linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,.98) 8%, rgba(0,0,0,1) 70%, rgba(0,0,0,.80) 84%, rgba(0,0,0,0) 100%);
  -webkit-mask-composite: source-in;
  mask-image:linear-gradient(to left, rgba(0,0,0,1) 52%, rgba(0,0,0,.95) 62%, rgba(0,0,0,.72) 72%, rgba(0,0,0,.28) 84%, rgba(0,0,0,0) 100%), linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,.98) 8%, rgba(0,0,0,1) 70%, rgba(0,0,0,.80) 84%, rgba(0,0,0,0) 100%);
  mask-composite: intersect;
}
.hero-content{
  max-width:1200px;
}
.hero-content > *{
  max-width:720px;
}
.hero-facts{
  max-width:760px;
}
.hero-grid{
  z-index:0;
}
.hero-rings{
  right:-40px;
  top:16%;
  z-index:1;
  opacity:.68;
}
.scroll-indicator{
  z-index:4;
}
@media(max-width:1150px){
  .hero-photo{
    width:min(60vw,760px);
    background-position:64% center;
  }
  .hero-content > *{max-width:640px;}
  .hero-facts{max-width:700px;}
}
@media(max-width:860px){
  .hero:before{
    background:
      linear-gradient(180deg,rgba(3,13,24,.62) 0%,rgba(3,13,24,.72) 38%,rgba(3,13,24,.92) 72%,rgba(3,13,24,1) 100%),
      linear-gradient(90deg,rgba(3,13,24,.90) 0%,rgba(3,13,24,.46) 62%,rgba(3,13,24,.28) 100%);
  }
  .hero-photo{
    width:100%;
    background-position:60% center;
    opacity:.5;
    -webkit-mask-image:linear-gradient(to bottom, rgba(0,0,0,.08) 0%, rgba(0,0,0,.92) 16%, rgba(0,0,0,.95) 54%, rgba(0,0,0,.38) 74%, rgba(0,0,0,0) 100%);
    mask-image:linear-gradient(to bottom, rgba(0,0,0,.08) 0%, rgba(0,0,0,.92) 16%, rgba(0,0,0,.95) 54%, rgba(0,0,0,.38) 74%, rgba(0,0,0,0) 100%);
    -webkit-mask-composite: initial;
    mask-composite: add;
  }
  .hero-content > *{max-width:none;}
  .hero-facts{max-width:none;}
}

/* V10 — swipeable media galleries inside project and experience panels */
.media-gallery{
  margin-top:30px;
  padding-top:24px;
  border-top:1px solid var(--line);
}
.gallery-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:16px;
  margin-bottom:16px;
  flex-wrap:wrap;
}
.gallery-head small{
  color:var(--cyan);
  font-size:10px;
  font-weight:700;
  letter-spacing:.14em;
  text-transform:uppercase;
}
.gallery-head p{
  margin:0;
  color:#8ca0b2;
  font-size:12px;
  line-height:1.6;
  max-width:760px;
}
.gallery-viewport{
  position:relative;
}
.gallery-track{
  display:flex;
  gap:18px;
  overflow-x:auto;
  scroll-snap-type:x mandatory;
  scroll-behavior:smooth;
  -ms-overflow-style:none;
  scrollbar-width:none;
}
.gallery-track::-webkit-scrollbar{display:none}
.gallery-slide{
  min-width:100%;
  scroll-snap-align:start;
  border:1px solid var(--line);
  border-radius:20px;
  overflow:hidden;
  background:rgba(255,255,255,.018);
  box-shadow:0 20px 40px rgba(0,0,0,.18);
}
.gallery-slide img,
.gallery-slide video{
  display:block;
  width:100%;
  height:clamp(280px,46vw,520px);
  object-fit:contain;
  background:linear-gradient(180deg,rgba(6,15,25,.92),rgba(9,20,33,.98));
}
.gallery-slide figcaption{
  padding:14px 16px 16px;
  color:#9eb1c1;
  font-size:12px;
  line-height:1.6;
  border-top:1px solid rgba(255,255,255,.05);
}
.gallery-nav{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  width:42px;
  height:42px;
  border-radius:999px;
  border:1px solid rgba(113,217,235,.28);
  background:rgba(3,13,24,.78);
  color:#dff7ff;
  font-size:28px;
  line-height:1;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  z-index:2;
  transition:transform .18s ease, background .18s ease, border-color .18s ease, opacity .18s ease;
  backdrop-filter:blur(8px);
}
.gallery-nav:hover{
  transform:translateY(-50%) scale(1.04);
  background:rgba(8,26,42,.92);
  border-color:rgba(113,217,235,.58);
}
.gallery-nav:disabled{
  opacity:.35;
  cursor:default;
}
.gallery-nav.prev{left:14px}
.gallery-nav.next{right:14px}
.gallery-dots{
  display:flex;
  gap:8px;
  justify-content:center;
  align-items:center;
  margin-top:14px;
  flex-wrap:wrap;
}
.gallery-dots button{
  width:9px;
  height:9px;
  padding:0;
  border-radius:999px;
  border:0;
  background:rgba(255,255,255,.18);
  cursor:pointer;
  transition:transform .18s ease, background .18s ease;
}
.gallery-dots button.active{
  background:var(--cyan);
  transform:scale(1.18);
}
.gallery-viewport.single-slide .gallery-nav,
.media-gallery.single .gallery-nav,
.media-gallery.single .gallery-dots{
  display:none;
}
@media(max-width:860px){
  .gallery-nav{width:38px;height:38px;font-size:24px}
  .gallery-nav.prev{left:10px}
  .gallery-nav.next{right:10px}
}
@media(max-width:720px){
  .media-gallery{margin-top:26px;padding-top:20px}
  .gallery-head p{font-size:11px}
  .gallery-slide img,
  .gallery-slide video{height:clamp(240px,72vw,420px)}
  .gallery-slide figcaption{font-size:11px;padding:12px 14px 14px}
}


/* V11 — integrate media directly beside the written content */
.accordion-item.featured{
  background:rgba(255,255,255,.006);
}

.detail-grid.has-media{
  grid-template-columns:minmax(0,1.05fr) minmax(300px,.72fr) minmax(215px,.48fr);
  gap:28px;
  align-items:start;
}
.detail-grid.has-media.single{
  grid-template-columns:minmax(0,1.25fr) minmax(320px,.75fr);
}
.detail-grid.has-media .media-gallery{
  margin:0;
  padding:0;
  border-top:0;
  min-width:0;
  align-self:start;
}
.detail-grid.has-media .gallery-head{
  margin-bottom:11px;
}
.detail-grid.has-media .gallery-head p{
  font-size:10px;
  line-height:1.5;
}
.detail-grid.has-media .gallery-slide img,
.detail-grid.has-media .gallery-slide video{
  height:360px;
  object-fit:contain;
}
.detail-grid.has-media .gallery-slide figcaption{
  font-size:10px;
  padding:10px 12px 12px;
}
.detail-grid.has-media .gallery-nav{
  width:34px;
  height:34px;
  font-size:22px;
}
.detail-grid.has-media .gallery-nav.prev{left:9px}
.detail-grid.has-media .gallery-nav.next{right:9px}
.detail-grid.has-media .metric-stack{
  min-width:0;
}

.project-content-grid{
  display:grid;
  grid-template-columns:minmax(0,1.3fr) minmax(320px,.7fr);
  gap:34px;
  align-items:start;
  padding:0 0 22px 70px;
}
.project-content-grid .project-story{
  padding:0;
}
.project-content-grid .media-gallery{
  margin:0;
  padding:0;
  border-top:0;
  min-width:0;
}
.project-content-grid .gallery-head{
  margin-bottom:11px;
}
.project-content-grid .gallery-head p{
  font-size:10px;
  line-height:1.5;
}
.project-content-grid .gallery-slide img,
.project-content-grid .gallery-slide video{
  height:360px;
  object-fit:contain;
}
.project-content-grid .gallery-slide figcaption{
  font-size:10px;
  padding:10px 12px 12px;
}
.project-content-grid .gallery-nav{
  width:34px;
  height:34px;
  font-size:22px;
}
.project-content-grid .gallery-nav.prev{left:9px}
.project-content-grid .gallery-nav.next{right:9px}

@media(max-width:1180px){
  .detail-grid.has-media{
    grid-template-columns:minmax(0,1fr) minmax(300px,.8fr);
  }
  .detail-grid.has-media .metric-stack{
    grid-column:1/-1;
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:0;
    border-left:0;
    border-top:1px solid var(--line);
    padding:22px 0 0;
  }
  .detail-grid.has-media .metric-stack div{
    border-bottom:0;
    border-right:1px solid var(--line);
    padding:0 18px 0 0;
    margin:0 18px 0 0;
  }
  .detail-grid.has-media .metric-stack div:last-child{border-right:0}
}

@media(max-width:900px){
  .detail-grid.has-media,
  .detail-grid.has-media.single,
  .project-content-grid{
    grid-template-columns:1fr;
  }
  .project-content-grid{
    padding-left:45px;
  }
  .detail-grid.has-media .gallery-slide img,
  .detail-grid.has-media .gallery-slide video,
  .project-content-grid .gallery-slide img,
  .project-content-grid .gallery-slide video{
    height:clamp(280px,58vw,460px);
  }
  .detail-grid.has-media .metric-stack{
    grid-template-columns:1fr;
  }
  .detail-grid.has-media .metric-stack div{
    border-right:0;
    border-bottom:1px solid var(--line);
    padding:0 0 16px;
    margin:0 0 16px;
  }
}

@media(max-width:720px){
  .project-content-grid{padding-left:45px;gap:20px}
}


/* V12 — fuller case-study copy beside media */
.detail-grid.has-media .detail-lead p{
  font-size:14.5px;
  line-height:1.86;
}
.project-content-grid .project-story p{
  font-size:14.5px;
  line-height:1.9;
}
@media(max-width:900px){
  .detail-grid.has-media .detail-lead p,
  .project-content-grid .project-story p{
    font-size:14px;
  }
}