:root{--forest:#203f36;--mint:#c6d9d3;--paper:#f4f3ef;--ink:#111;--line:rgba(17,17,17,.28);--font:"Helvetica Neue",Helvetica,Arial,sans-serif}*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;background:var(--paper);color:var(--ink)}body{font-family:var(--font)}a{color:inherit}header{position:fixed;z-index:20;inset:0 0 auto;height:64px;padding:0 3vw;display:grid;grid-template-columns:1fr 1fr 1fr;align-items:center;border-bottom:1px solid rgba(17,17,17,.24);background:rgba(198,217,211,.9);backdrop-filter:blur(14px);font-size:12px;text-transform:uppercase;letter-spacing:.06em}header span{text-align:center}header a{text-decoration:none}header a:last-child{text-align:right;font-weight:700}.cg-hero{min-height:100svh;padding:100px 3vw 40px;display:grid;grid-template-columns:1fr .62fr;grid-template-rows:auto 1fr auto;gap:3vw;background:var(--mint);position:relative;overflow:hidden}.cg-meta{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr auto;font-size:12px;text-transform:uppercase}.cg-hero h1{align-self:center;font-size:clamp(86px,13vw,230px);font-weight:500;line-height:.78;letter-spacing:-.07em;color:var(--forest)}.cg-hero>p{align-self:end;padding-bottom:1.5vw;max-width:560px;font-size:clamp(18px,1.4vw,24px);line-height:1.4;letter-spacing:-.02em}.speech-mark{position:absolute;right:-5vw;bottom:-9vw;width:30vw;aspect-ratio:1}.speech-mark i{position:absolute;width:70%;aspect-ratio:1;border:2.2vw solid var(--paper);border-radius:50%;background:var(--forest)}.speech-mark i:first-child{top:0;left:0}.speech-mark i:last-child{right:0;bottom:0}.label,.section-head{font-size:12px;text-transform:uppercase;letter-spacing:.06em}.cg-context{padding:18vh 4vw;display:grid;grid-template-columns:.55fr 1.45fr;gap:4vw;background:var(--forest);color:var(--paper)}.cg-context h2,.slides-section>h2,.prototype-section>h2{font-size:clamp(46px,6vw,100px);font-weight:400;line-height:.96;letter-spacing:-.055em}.cg-context div>p{width:min(650px,100%);margin-top:55px;font-size:clamp(17px,1.35vw,23px);line-height:1.5;color:rgba(244,243,239,.72)}.slides-section,.prototype-section{padding:110px 4vw 140px}.section-head{display:flex;justify-content:space-between;margin-bottom:90px}.section-head span{opacity:.55}.slides-section>h2,.prototype-section>h2{margin-bottom:70px;color:var(--forest)}.project-slideshow{border:1px solid var(--line);background:white}.slideshow-viewport{overflow:hidden;touch-action:pan-y}.slideshow-track{display:flex;transition:transform .55s cubic-bezier(.16,1,.3,1)}.slide{flex:0 0 100%}.slide img{display:block;width:100%;aspect-ratio:1576/888;object-fit:contain}.slideshow-controls{height:72px;padding:0 18px;display:grid;grid-template-columns:auto auto 1fr auto;gap:22px;align-items:center;border-top:1px solid var(--line)}.slide-arrow{width:42px;height:42px;border:1px solid var(--line);border-radius:50%;background:transparent;font-size:18px;cursor:pointer}.slide-status{display:flex;gap:7px;font-size:11px}.slide-status i{font-style:normal;opacity:.35}.slide-dots{display:flex;justify-content:center;gap:8px}.slide-dot{width:6px;height:6px;border:0;border-radius:50%;background:rgba(17,17,17,.25);cursor:pointer}.slide-dot.is-active{background:var(--forest);transform:scale(1.5)}.prototype-section{background:var(--mint)}.prototype-shell{border:1px solid var(--line);background:var(--forest)}.prototype-shell video{display:block;width:100%;max-height:84vh;aspect-ratio:16/9;object-fit:contain}footer{padding:48px 4vw;display:flex;justify-content:space-between;border-top:1px solid var(--line);background:var(--mint);font-size:12px;text-transform:uppercase}footer a{text-decoration:none}@media(max-width:700px){.cg-hero{grid-template-columns:1fr;grid-template-rows:auto 1fr auto}.cg-meta span:nth-child(2){display:none}.cg-meta{grid-template-columns:1fr auto}.cg-hero h1{font-size:20vw}.speech-mark{opacity:.25;width:60vw}.cg-context{grid-template-columns:1fr;gap:60px}.section-head{margin-bottom:65px}.slides-section,.prototype-section{padding:90px 5vw}.slideshow-controls{grid-template-columns:auto 1fr auto}.slide-status{display:none}.slide-dots{gap:5px}}

/* Keep the project deck comfortably within the viewport. */
.project-slideshow { width: min(78vw, 1050px); margin-inline: auto; }
@media (max-width: 700px) { .project-slideshow { width: 100%; } }

/* Keep the speech-bubble mark decorative and safely behind the hero copy. */
.cg-hero .hero-copy { position: relative; z-index: 2; }
.cg-hero { grid-template-rows: 1fr; }
.cg-hero .hero-copy { grid-column: 1 / -1; grid-row: 1; align-self: center; transform: translateY(-4vh); }
.cg-hero .hero-copy h1 { transform: none; }
.cg-hero .hero-subtitle { position: relative; z-index: 2; grid-column: 1 / -1; grid-row: 1; align-self: end; justify-self: end; width: min(58vw, 820px); max-width: none; padding: 0 .5vw 1vh 0; text-align: right; font-size: clamp(20px, 1.65vw, 28px); line-height: 1.32; }
.speech-mark { z-index: 0; opacity: 1; right: 2vw; top: 24vh; bottom: auto; width: 26vw; }
@media (max-width: 700px) {
  .cg-hero { grid-template-rows: 1fr auto; }
  .cg-hero .hero-copy { grid-column: 1; grid-row: 1; transform: translateY(-2vh); }
  .cg-hero .hero-subtitle { grid-column: 1; grid-row: 2; width: 100%; padding: 0; font-size: clamp(18px, 5vw, 23px); }
  .speech-mark { right: -8vw; top: 30vh; width: 58vw; }
}

@media (max-width: 700px) {
  .cg-hero .hero-copy { position:relative; z-index:2; }
  .cg-hero .hero-copy h1 { font-size:16.5vw; line-height:.82; }
  .cg-hero .hero-subtitle { position:relative; z-index:2; max-width:92%; margin-left:auto; font-size:17px; line-height:1.35; }
  .speech-mark { right:-16vw; top:28vh; width:48vw; opacity:.16; }
}