*{box-sizing:border-box}html{scroll-padding-top:1rem}body{margin:0;background:#f8f6f1;color:#202522;font:18px/1.55 Georgia,serif}body:before{content:"";display:block;height:3px;background:linear-gradient(90deg,#cf5456 25%,#539663 25% 50%,#527aa8 50% 75%,#dcad39 75%)}header,footer,.wrap,.hero{width:min(1120px,90%);margin:auto}header,footer,nav{display:flex;align-items:center;justify-content:space-between;gap:1.3rem;flex-wrap:wrap}header{padding:20px 0;border-bottom:1px solid #b9bdb6}a{color:inherit;text-underline-offset:.24em}a:hover{color:#49765b}a:focus-visible{outline:3px solid #5787b2;outline-offset:4px}.initial{font:bold 25px Georgia;text-decoration:none}nav,small,.kicker,figcaption,.rows span{font:14px/1.5 Arial,sans-serif}.hero{padding:clamp(45px,7vw,100px) 0}.hero h1{font:normal clamp(54px,9vw,120px)/1 Georgia;margin:16px 0;letter-spacing:-.055em;text-shadow:1px 0 #ac6262,-1px 0 #75a3a0}.hero h1 span{color:#657768}.hero p{font-size:clamp(22px,3vw,36px);margin:12px 0}.hero .intro,.wrap p{font-size:18px;max-width:54ch}.kicker,small{text-transform:uppercase;letter-spacing:.12em}.wrap{display:grid;grid-template-columns:1fr 1.18fr;gap:clamp(24px,6vw,85px);align-items:center;padding:64px 0}.audio{background:#e4e8e1}.dark,footer{background:#141b18;color:#eaece6}.rows a{display:grid;gap:3px;padding:15px 0;border-top:1px solid #a4aca5;text-decoration:none}.rows strong,h3{font:normal 25px Georgia}.rows a:hover strong{text-decoration:underline}h2{font:normal clamp(32px,4vw,50px)/1.1 Georgia;margin:10px 0 20px}figure{margin:0}img{display:block;width:100%;height:auto}figcaption{margin-top:8px}ul{margin:0;padding:0;list-style:none}li{padding:8px 0;border-bottom:1px solid #c2c7bf}footer{width:100%;padding:44px max(5%,calc((100vw - 1120px)/2))}.skip{position:absolute;left:-9999px}.skip:focus{left:12px;background:white}@media(max-width:680px){.wrap{grid-template-columns:1fr;padding:40px 0}header nav{gap:.8rem}footer{align-items:flex-start}}

/* Portfolio art direction */
:root{color-scheme:dark;--ink:#f4f2e9;--muted:#b5bfc1;--line:#3a4346;--amber:#ffca4c}
body{background:#0b1011;color:var(--ink);font:17px/1.6 "Segoe UI",Arial,sans-serif}
header,footer,.wrap,.hero{width:min(1440px,90%)}
header{border-color:var(--line)}.initial{font:800 24px/1 Arial;letter-spacing:-.08em;text-decoration:none}
nav a{text-decoration:none}nav a:hover{text-decoration:underline}
.hero{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);align-items:center;gap:5vw;padding:clamp(48px,6vw,94px) 0}
.hero h1{font:800 clamp(72px,8.8vw,155px)/.85 Arial,sans-serif;letter-spacing:-.08em;margin:22px 0 26px;text-shadow:none}
.hero h1 span,small,.kicker{color:var(--amber)}.kicker,small,figcaption{font:13px/1.5 Consolas,monospace}
.hero p{font:normal clamp(22px,2.2vw,37px)/1.18 Georgia;max-width:24ch}
.hero .intro,.wrap p{color:var(--muted);font:17px/1.62 "Segoe UI",Arial,sans-serif;max-width:48ch}
.instrument{padding:clamp(14px,2.5vw,42px);background:repeating-linear-gradient(0deg,transparent 0 30px,#ffffff09 31px),linear-gradient(145deg,#344955,#15232a);border:1px solid #45575f}
.instrument img{box-shadow:0 15px 32px #0006}.instrument figcaption{display:flex;justify-content:space-between;gap:8px;flex-wrap:wrap;color:var(--ink);margin-top:18px}.instrument figcaption span{color:#c1cbd0}
.actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px}.actions a{padding:10px 17px;border:1px solid #758084;font-weight:650;text-decoration:none}.actions a:first-child{background:var(--amber);color:#171712;border-color:var(--amber)}
.audio{background:#171f22}.dark{background:linear-gradient(120deg,#17251f,#080b09)}.wrap{padding:clamp(45px,6vw,92px) 0}section[id]{border-top:1px solid var(--line)}
h2{font:720 clamp(37px,4.8vw,78px)/.99 "Segoe UI",Arial,sans-serif;letter-spacing:-.06em}h3{font:normal 30px Georgia}
.rows strong{font:650 clamp(24px,2.5vw,40px)/1.2 "Segoe UI",Arial}.rows a,li{border-color:var(--line)}.rows span,figcaption{color:var(--muted)}li{font:normal 22px/1.4 Georgia;padding:10px 0}a:hover{color:var(--amber)}.actions a:hover{outline:1px solid var(--amber)}.skip:focus{color:#111}.dark img{border:1px solid var(--line)}
footer{width:100%;background:#060909;border-top:1px solid var(--line)}footer nav{justify-content:flex-start}
@media(max-width:760px){.hero,.wrap{grid-template-columns:1fr}.hero{gap:32px}.hero h1{font-size:clamp(72px,15vw,104px)}.instrument{max-width:640px}.hero p{max-width:32ch}}
.deck{color-scheme:dark;background:#101719;border:1px solid #475459;padding:18px;margin:0 0 16px}.deck label,.deck figcaption{display:block;font:600 20px/1.3 "Segoe UI",Arial;color:var(--ink);margin:0 0 12px}.deck select{width:100%;background:#232d31;border:1px solid #637075;color:var(--ink);font:inherit;padding:8px}.deck audio,.deck video{display:block;width:100%;margin-top:10px;accent-color:var(--amber)}.deck video{max-height:340px;background:#070909}.dark img[src$="founder-logo.png"]{border:0}.dark .welcome{text-align:center;max-width:none;font:22px Georgia;color:#e7e6db}.dark figure figcaption{text-align:center}.deck :focus-visible{outline:2px solid var(--amber);outline-offset:3px}

.hero-copy{container-type:inline-size;min-width:0}
.hero h1{font-size:clamp(1rem,12.8cqw,7.5rem);white-space:nowrap;letter-spacing:-.055em}


.reel-box{padding:1rem;min-width:0;border:1px solid currentColor}.reel-box iframe{width:100%;height:clamp(320px,52vw,590px);border:0;background:#151515}.dark .reel-box,.further{grid-column:1/-1}.further ul{display:block!important;columns:15rem;list-style:none;padding:0}.further ul li{font-size:.92rem;break-inside:avoid;padding:.3rem 0}#sound-design{scroll-margin-top:5rem}
.hero:has(>.hero-copy:only-child){grid-template-columns:minmax(0,1fr)}.tools-intro{grid-column:1/-1}.tools-grid{align-items:start}.tools-grid figure{min-width:0}.tools-grid video{display:block;width:100%;height:auto}.tools-grid .tools-intro p{max-width:70ch}
.reel-box label { display: block; margin-bottom: .35rem; }
.reel-picker { width: 100%; padding: .6rem; font: inherit; background: #232d31; color: var(--ink); border: 1px solid #637075; }
.reel-box video { display: block; width: 100%; aspect-ratio: 16 / 9; margin-top: .75rem; background: #070909; }
.deck audio[hidden], .music-controls[hidden] { display: none; }
.music-controls {
  display: grid;
  grid-template-columns: auto minmax(3rem,1fr) auto auto minmax(3rem,5rem);
  gap: .7rem; align-items: center; padding: .8rem 0 0;
  color: var(--ink); font: .9rem/1.4 Consolas, monospace;
}
.music-controls button {
  background: #171e20; color: var(--ink); border: 1px solid var(--line);
  padding: .55rem .75rem; font: inherit; cursor: pointer;
}
#music-play { background: var(--amber); color: #101719; border-color: var(--amber); min-width: 4.3rem; }
.music-controls input { min-width: 0; width: 100%; accent-color: var(--amber); cursor: pointer; }
.music-controls output { white-space: nowrap; }
.music-controls :focus-visible { outline: 2px solid var(--amber); outline-offset: 3px; }
@media(max-width: 850px) {
  .music-controls { grid-template-columns: auto minmax(2rem,1fr) auto; }
  #music-volume { max-width: 6rem; }
}
.gb-player { box-sizing:border-box; width:min(100%,24rem); margin:1.4rem auto 2rem; padding:1.25rem; border:1px solid #596164; border-radius:.7rem .7rem 2.6rem .7rem; background:#333c40; box-shadow:inset 0 2px #ffffff15; }
.gb-player h3 { margin:0 0 .75rem; color:#ebe9d9; font:bold 1.15rem/1.3 monospace; }
.gb-screen { border:.65rem solid #20272a; border-radius:.25rem .25rem .85rem .25rem; background:#b2bf85; color:#273321; padding:.85rem; font: bold .83rem/1.4 monospace; box-shadow:inset 1px 2px 4px #526044; }
.gb-screen select { display:block; width:100%; margin:.3rem 0 .65rem; padding:.2rem 0; border:0; border-bottom:1px solid #63724c; color:inherit; background:#b2bf85; color-scheme:light; font:bold 1.1rem monospace; }
.gb-readout,.gb-buttons { display:flex; align-items:center; justify-content:space-between; gap:.4rem; }
.gb-screen .gb-readout span { color:inherit; font:inherit; }
.gb-buttons { margin-top:.75rem; justify-content:flex-start; }
.gb-buttons[hidden] { display:none; }
.gb-buttons button { min-width:2.75rem; min-height:2.75rem; border:1px solid #677175; border-radius:.4rem; background:#1b2224; color:#fff; cursor:pointer; }
#gb-play { margin-left:auto; border-radius:2rem; background:#823452; padding:0 1rem; font-weight:bold; }
.gb-player :focus-visible { outline:3px solid #ffca4c; outline-offset:2px; }
.tools-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
.tools-grid .instrument img { width:100%; height:auto; aspect-ratio:16/9; object-fit:contain; }
.tool-demo { grid-column:1/-1; }
.tool-demo summary { cursor:pointer; color:var(--amber); }
.tool-demo video { margin-top:1rem; max-width:45rem; }
@media(max-width:680px) { .tools-grid { grid-template-columns:minmax(0,1fr); } }

/* Portfolio listening and viewing sections */
.audio .wrap { grid-template-columns:repeat(2,minmax(0,1fr)); column-gap:clamp(1rem,3vw,3rem); align-items:start; row-gap:clamp(1.5rem,3vw,3rem); }
.audio-players { display:grid; gap:.85rem; min-width:0; }
.audio-players :is(.deck,.gb-player) { width:100%; margin:0; padding:1rem; background:#101719; border:1px solid var(--line); border-radius:.35rem; box-shadow:none; }
.audio-players :is(.deck label,.gb-player h3) { margin:0 0 .65rem; font:600 1.1rem/1.3 "Segoe UI",Arial,sans-serif; color:var(--ink); }
.audio-players .gb-screen { border-width:.22rem; padding:.55rem .8rem; }
.audio-players #gb-play { border-radius:.3rem; background:var(--amber); color:#101719; }
.audio-reels { grid-column:1/-1; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:clamp(1rem,3vw,3rem); }
.audio-reels .reel-box { padding:0; border:0; }
.audio-reels h3 { margin:0 0 .5rem; }
.demo-archive { grid-column:1/-1; border-top:1px solid var(--line); padding-top:.65rem; }
.demo-archive h3 { margin:0; line-height:1; }
.demo-archive .reel-box { padding:.75rem 0 0; border:0; max-width:46rem; }
#games .wrap { row-gap:1rem; }
@media(max-width:760px) { .audio .wrap, .audio-reels { grid-template-columns:minmax(0,1fr); } }

.tools-grid { column-gap:clamp(1rem,3vw,3rem); }
.tools-grid .instrument { margin:0; padding:0; border:0; background:none; }
.tools-grid .instrument img { display:block; border:1px solid var(--line); box-shadow:none; }
@media(max-width:760px) { .tools-grid { grid-template-columns:minmax(0,1fr); } }

.demo-archive { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); column-gap:clamp(1rem,3vw,3rem); align-items:start; }
.demo-archive h3 { grid-column:1/-1; }
.demo-archive .reel-box { max-width:none; }
.demo-downloads { padding-top:.75rem; }
.demo-downloads h4 { margin:0 0 .5rem; font:inherit; }
.demo-downloads a { display:flex; justify-content:space-between; gap:1rem; align-items:center; border-top:1px solid var(--line); padding:.75rem 0; }
.demo-downloads span { color:var(--amber); font:.85rem Consolas,monospace; }
@media(max-width:760px) { .demo-archive { grid-template-columns:minmax(0,1fr); } }
.demo-archive > .reel-box { grid-column:1; }