.tfg-case{--forest:#1d301b;--electric:#4cdd16}
.tfg-case-hero{background:var(--forest);color:var(--electric);padding:clamp(60px,8vw,130px) var(--gutter);min-height:560px;display:grid;place-items:center}
.tfg-case-hero h1{font-size:0;line-height:0;width:100%;max-width:1450px;margin:0}
.tfg-logo{display:block;width:100%;height:auto;fill:currentColor}
.tfg-logo circle{fill:none;stroke:currentColor}
.tfg-logo path{fill:currentColor}
.tfg-case .case-summary dl{grid-template-columns:1fr 1fr}
.case-page.tfg-case .case-overview h2{font:500 clamp(23px,2.25vw,34px)/1.3 GTExtended,sans-serif;letter-spacing:-.025em;max-width:24ch}
.case-support{font:400 17px/1.6 GTExtended,sans-serif;color:var(--muted);max-width:48ch;margin-top:24px}
.tfg-case .case-section-head .case-description{max-width:37ch}
.tfg-chapter{padding-bottom:0}
.tfg-chapter .case-figure{margin-bottom:100px}
.tfg-identity{padding:0 var(--gutter) 105px}

.identity-note{font:400 14px/1.6 GTExtended,sans-serif;color:var(--muted);margin-top:24px;max-width:57ch}
.tfg-applications{display:grid;grid-template-columns:1fr 1fr;gap:32px;align-items:start}
.tfg-applications .case-figure:nth-child(2){margin-top:85px}
.tfg-applications .case-figure>img{aspect-ratio:auto}
.tfg-applications figcaption{grid-template-columns:1fr auto;gap:12px}
.tfg-applications .image-index{display:none}
.tfg-case .case-next .work-image{aspect-ratio:1.9}
.tfg-case .case-next .work-image>img{filter:none}

@media(max-width:760px){
  .tfg-case-hero{min-height:340px;padding:65px 24px}
  .tfg-case-hero h1{width:100%}
  .tfg-case .hero-caption{font-size:10px;gap:20px}
  .case-page.tfg-case .case-overview h2{font-size:24px}
  .case-support{display:none}
  .tfg-case .case-summary dl{gap:25px;font-size:12px}
  .tfg-identity{padding:0 0 60px}
  .tfg-chapter .case-figure{margin-bottom:55px}
  .tfg-applications{display:block}
  .tfg-applications .case-figure:nth-child(2){margin-top:0}
  .tfg-case .case-next .work-image{aspect-ratio:1.3}
}


/* Approved three-palette sequence: full-frame 240ms dissolves. */
#tfg-color-dissolve{background:#080908;color:#efeee5;font-family:GTMono,monospace;--forest:#1d301b;--electric:#4cdd16;--paper:#efeee5}
#tfg-color-dissolve *{box-sizing:border-box}
#tfg-color-dissolve .seq-stage{position:relative;height:auto;aspect-ratio:2.25;min-height:360px;overflow:hidden;--electric-opacity:0;--paper-opacity:0}
#tfg-color-dissolve .seq-layer{position:absolute;inset:0;display:grid;place-items:center;padding:48px 8%;background:var(--forest);color:var(--electric)}
#tfg-color-dissolve .seq-layer svg{display:block;width:100%;height:auto}
#tfg-color-dissolve .seq-layer circle{fill:none;stroke:currentColor}
#tfg-color-dissolve .seq-layer path{fill:currentColor}
#tfg-color-dissolve .seq-electric{background:var(--electric);color:#080d08;opacity:var(--electric-opacity)}
#tfg-color-dissolve .seq-paper{background:var(--paper);color:var(--forest);opacity:var(--paper-opacity)}
#tfg-color-dissolve .seq-controls{padding:20px 28px 24px;display:grid;grid-template-columns:70px minmax(0,1fr);gap:24px;align-items:center}
#tfg-color-dissolve button{background:none;border:0;color:var(--paper);font:400 12px/1.4 GTMono,monospace;padding:10px 0;min-height:44px}
#tfg-color-dissolve .seq-play{text-align:left}
#tfg-color-dissolve .seq-timeline{min-width:0}
#tfg-color-dissolve .seq-range{display:block;width:100%;height:28px;margin:0;background:transparent;appearance:none;-webkit-appearance:none;cursor:ew-resize;--progress:0%}
#tfg-color-dissolve .seq-range::-webkit-slider-runnable-track{height:3px;background:linear-gradient(to right,var(--electric) var(--progress),#42483d var(--progress))}
#tfg-color-dissolve .seq-range::-moz-range-track{height:3px;background:linear-gradient(to right,var(--electric) var(--progress),#42483d var(--progress))}
#tfg-color-dissolve .seq-range::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:12px;height:18px;margin-top:-7.5px;border:0;border-radius:0;background:var(--paper)}
#tfg-color-dissolve .seq-range::-moz-range-thumb{width:12px;height:18px;border:0;border-radius:0;background:var(--paper)}
#tfg-color-dissolve .seq-labels{display:flex;justify-content:space-between;gap:8px}
#tfg-color-dissolve .seq-labels button{opacity:.5;display:flex;align-items:center;gap:7px}
#tfg-color-dissolve .seq-labels button[aria-pressed=true]{opacity:1}
#tfg-color-dissolve .seq-labels span{width:7px;height:7px;display:block;border-radius:50%;background:var(--forest)}
#tfg-color-dissolve [data-position="50"] span{background:var(--electric)}
#tfg-color-dissolve [data-position="100"] span{background:var(--paper)}
#tfg-color-dissolve [data-position="0"] span{background:#7f9977}
#tfg-color-dissolve button{cursor:pointer}
@media(max-width:760px){#tfg-color-dissolve .seq-stage{height:270px;min-height:0;aspect-ratio:auto}#tfg-color-dissolve .seq-layer{padding:35px 6%}#tfg-color-dissolve .seq-controls{padding:16px 24px 20px;gap:12px;grid-template-columns:48px minmax(0,1fr)}#tfg-color-dissolve .seq-labels button{font-size:11px;gap:5px}}

