/* The established FORGE identity, refined for a listening portfolio. */
:root{--ground:#080d0b;--ground-2:#101a16;--steel:#7e9a93;--brass:#c9a468;--brass-hi:#e2d0a6;--text:#eceae4;--text-dim:#afbab4;--text-faint:#92a29a;--line:#2b3831;--display:"Big Shoulders Display","Oswald",sans-serif;--body:"Oswald",sans-serif;--wrap:1280px;--gutter:64px}
* ,*::before,*::after{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:90px}body{margin:0;background:var(--ground);color:var(--text);font-family:var(--body);font-weight:300;line-height:1.65;-webkit-font-smoothing:antialiased}a{color:inherit}button,input{font:inherit}button,a,input{-webkit-tap-highlight-color:transparent}button{cursor:pointer}img{display:block;max-width:100%}a:focus-visible,button:focus-visible,input:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--brass-hi);outline-offset:6px}.wrap{width:min(var(--wrap),100% - var(--gutter)*2);margin-inline:auto}.sep{color:var(--steel)}.skip-link{position:fixed;top:-80px;left:20px;z-index:100;background:var(--brass-hi);color:var(--ground);padding:12px 20px}.skip-link:focus{top:12px}
.header{height:88px;padding:0 var(--gutter);display:flex;align-items:center;justify-content:space-between;gap:24px;border-bottom:1px solid var(--line);position:relative;z-index:10;background:var(--ground)}.header__mark{display:flex;align-items:center;gap:20px;font-family:var(--display);font-size:23px;font-weight:700;text-transform:uppercase;text-decoration:none;letter-spacing:.025em}.header__rule{height:22px;width:1px;background:var(--line)}.header__role{font-family:var(--body);font-size:11px;font-weight:400;letter-spacing:.14em;color:var(--text-dim)}.header__nav{display:flex;gap:38px}.header__nav a{padding:12px 0;font-size:13px;letter-spacing:.08em;text-decoration:none;color:var(--text-dim)}.header__nav a:hover{color:var(--brass-hi)}
.hero{position:relative;min-height:690px;height:min(780px,calc(100svh - 88px));isolation:isolate;display:flex;align-items:center;overflow:hidden}.hero__portrait{position:absolute;right:0;top:0;width:57%;height:100%;z-index:-2}.hero__portrait img{width:100%;height:100%;object-fit:cover;object-position:50% 39%}.hero__portrait::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,var(--ground),transparent 43%),linear-gradient(0deg,var(--ground),transparent 30%)}.hero__inner{width:min(var(--wrap),100% - var(--gutter)*2);margin:0 auto;padding-bottom:30px}.hero__discipline{margin:0 0 32px;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--text-dim)}.hero__discipline span{display:block;color:var(--brass-hi);margin-top:4px}.hero__name{font-family:var(--display);font-weight:800;font-size:clamp(90px,11.5vw,172px);line-height:.88;letter-spacing:-.025em;text-transform:uppercase;margin:0 0 30px;color:var(--brass-hi)}.hero__line{font-size:16px;color:var(--text-dim);margin:0 0 32px;max-width:36ch}.hero__actions{display:flex;align-items:center;gap:28px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:13px;min-height:54px;padding:14px 24px;font-size:13px;font-weight:400;letter-spacing:.04em;text-decoration:none;border:1px solid var(--brass);transition:background .2s,color .2s}.btn--primary{background:var(--brass-hi);color:var(--ground);border-color:var(--brass-hi)}.btn--primary:hover{background:var(--brass)}.btn svg{width:18px;height:18px;fill:currentColor}.text-link{display:inline-flex;gap:18px;align-items:center;text-decoration:none;font-size:13px;padding:12px 0;border-bottom:1px solid var(--steel)}.text-link:hover{color:var(--brass-hi);border-color:var(--brass-hi)}.hero__foot{position:absolute;bottom:26px;left:var(--gutter);right:var(--gutter);display:flex;justify-content:space-between;color:var(--text-dim);font-size:11px;letter-spacing:.13em;text-transform:uppercase}.hero__foot a{text-decoration:none}.hero__foot a span{margin-left:20px;color:var(--brass)}
.section{padding:90px 0}.section-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:30px;margin-bottom:38px}.section__title{font-family:var(--display);font-weight:700;font-size:clamp(48px,5.2vw,76px);line-height:1;letter-spacing:-.025em;text-transform:uppercase;margin:0}.section__title span{color:var(--brass)}.section-heading p{margin:0;color:var(--text-dim);font-size:14px}.player{display:grid;grid-template-columns:1.15fr 1fr;border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--ground-2)}.player__deck{padding:36px 36px 22px;min-width:0}.player__head{display:flex;justify-content:space-between;align-items:end;gap:20px}.player__title{font-family:var(--display);font-weight:600;font-size:clamp(28px,3vw,44px);line-height:1.1;margin:0 0 12px;text-transform:uppercase;color:var(--brass-hi)}.player__sub,.player__time{font-size:12px;letter-spacing:.1em;font-variant-numeric:tabular-nums;color:var(--text-dim);margin:0}.player__sub .sep{margin:0 7px}.wave{height:152px;position:relative;cursor:crosshair;touch-action:none;margin-top:20px}.wave canvas{position:absolute;inset:0;width:100%;height:100%}.transport{display:flex;align-items:center;gap:16px;margin-top:22px}.tbtn,.playbtn{display:grid;place-items:center;color:var(--text);background:transparent;border:0;width:44px;height:44px}.playbtn{width:52px;height:52px;border-radius:50%;background:var(--brass-hi);color:var(--ground)}.tbtn:hover{color:var(--brass)}.playbtn:hover{background:var(--brass)}.tbtn svg,.playbtn svg{width:20px;height:20px;fill:currentColor}.playbtn .i-pause,.playbtn.is-playing .i-play{display:none}.playbtn.is-playing .i-pause{display:block}.vol{display:flex;align-items:center;gap:12px;margin-left:auto;color:var(--text-dim)}.vol svg{width:19px;height:19px;fill:currentColor}.vol input{width:75px;accent-color:var(--brass);height:24px}.player__status{font-size:13px;color:var(--brass-hi);margin:8px 0 0;min-height:21px}.player__library{padding:32px;border-left:1px solid var(--line)}.library-heading{display:flex;justify-content:space-between;padding:0 0 20px;color:var(--text-dim);font-size:11px;letter-spacing:.1em;text-transform:uppercase}.playlist{list-style:none;padding:0;margin:0}.playlist button{display:grid;grid-template-columns:26px 1fr auto;align-items:center;gap:14px;min-height:67px;width:100%;padding:14px 10px;background:transparent;border:0;border-top:1px solid var(--line);color:var(--text);text-align:left}.playlist button:hover{background:#1b2922}.playlist button.is-active{background:#223128;color:var(--brass-hi)}.playlist .num,.playlist .dur{color:var(--text-dim);font-size:12px;font-variant-numeric:tabular-nums}.playlist .name{font-size:17px;font-weight:400}.playlist button.is-active .num{color:var(--brass-hi)}
.section--about{border-bottom:1px solid var(--line);padding-top:55px;padding-bottom:100px}.about,.cta{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);column-gap:80px}.about__heading>p{margin:28px 0 0;color:var(--brass-hi);font-size:18px}.about__heading>p span{font-size:13px;color:var(--text-dim)}.about__text>p{margin:0 0 22px;font-family:Arial,sans-serif;font-size:16px;line-height:1.85;color:var(--text-dim);max-width:65ch}.facts{list-style:none;margin:32px 0 0;padding:0}.facts li{display:flex;justify-content:space-between;gap:20px;padding:12px 0;border-top:1px solid var(--line);font-size:13px}.facts span{color:var(--text-dim)}.section--cta{padding:86px 0 92px}.cta{position:relative}.cta__title{font-family:var(--display);font-size:clamp(46px,6vw,86px);line-height:1;text-transform:uppercase;letter-spacing:-.025em;max-width:780px;font-weight:600;margin:0 0 24px}.cta__line{color:var(--brass-hi);margin:0 0 20px}.contact-pending{color:var(--text-dim);font-size:14px;margin:0 0 18px}.footer{padding:28px 0;border-top:1px solid var(--line)}.footer__inner{display:flex;justify-content:space-between;gap:24px}.footer p{margin:0;color:var(--text-dim);font-size:11px;letter-spacing:.04em}.footer .sep{margin:0 8px}
@media(min-width:1600px){.header{padding-inline:max(var(--gutter),calc((100vw - var(--wrap))/2))}.hero__foot{left:calc((100vw - var(--wrap))/2);right:calc((100vw - var(--wrap))/2)}}
@media(max-width:1050px){:root{--gutter:36px}.hero{min-height:660px}.hero__actions{gap:20px}.hero__portrait{width:65%;opacity:.8}.player{grid-template-columns:1fr 1fr}.player__deck,.player__library{padding:25px}.transport{gap:8px}.vol input{width:54px}.about{gap:40px}}
@media(max-width:760px){:root{--gutter:24px}.header{height:74px}.header__mark{font-size:19px}.header__role,.header__rule{display:none}.header__nav{gap:20px}.header__nav a{font-size:12px}.hero{height:720px;min-height:0;align-items:flex-end}.hero__portrait{top:0;width:100%;height:530px;opacity:1}.hero__portrait img{object-position:50% 32%}.hero__portrait::after{background:linear-gradient(0deg,var(--ground),transparent 80%)}.hero__inner{padding-bottom:95px;position:relative}.hero__discipline{font-size:10px;margin:0 0 18px;color:var(--text)}.hero__name{font-size:clamp(72px,23vw,140px);margin-bottom:24px}.hero__line{font-size:14px;margin-bottom:24px}.hero__actions{gap:20px}.btn{padding:13px 18px;font-size:12px}.hero__actions .text-link{font-size:12px;gap:8px}.hero__foot{font-size:9px;letter-spacing:.07em}.hero__foot a span{margin-left:8px}.section{padding:58px 0}.section-heading{align-items:flex-start;flex-direction:column;gap:20px;margin-bottom:28px}.section-heading p br{display:none}.section-heading p{font-size:13px}.player{grid-template-columns:1fr}.player__deck{padding:26px 22px 16px}.player__library{padding:22px;border-left:0;border-top:1px solid var(--line)}.player__title{font-size:36px}.wave{height:140px}.vol input{width:75px}.playlist .name{font-size:16px}.about{grid-template-columns:1fr;gap:30px}.about__heading>p{margin-top:20px}.about__text>p{font-size:15px}.section--about{padding-top:26px}.footer__inner{flex-direction:column;gap:8px}.cta__title{font-size:54px}.section--cta{padding-bottom:64px}}
@media(max-width:370px){:root{--gutter:18px}.header__nav{gap:13px}.hero__name{font-size:23vw}.hero__actions{gap:14px}.hero__actions .text-link{font-size:11px}.playlist button{gap:9px}.playlist .name{font-size:15px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important}}

.arrow-icon{width:16px;height:16px;flex:none;vertical-align:middle}.hero__foot .arrow-icon{margin-left:12px;width:13px;height:13px}
/* Head and shoulders against space, with the subject anchored on the right. */
.hero__portrait { width: min(100%, 1600px); }
.hero__portrait img { object-position: 72% 0%; }
.hero__portrait::after {
  background: linear-gradient(90deg, var(--ground), rgba(8, 13, 11, .8) 18%, transparent 54%),
              linear-gradient(0deg, var(--ground), transparent 32%);
}
@media(max-width:1050px) {
  .hero__portrait { width: 100%; opacity: 1; }
  .hero__portrait img { object-position: 62% 0%; }
}
@media(max-width:760px) {
  .hero__portrait { height: 420px; }
  .hero__portrait img { object-position: 74% 0%; }
  .hero__portrait::after {
    background: linear-gradient(90deg, var(--ground), transparent 35%),
                linear-gradient(0deg, var(--ground), rgba(8, 13, 11, .9) 5%, transparent 30%);
  }
}

/* Larger actions and a composer credit with its own presence. */
.btn { min-height: 60px; padding: 16px 30px; font-size: 17px; }
.text-link { font-size: 16px; }
.btn svg { width: 20px; height: 20px; }
.btn:disabled { opacity: .65; cursor: wait; }
.about__heading > p { font-family: var(--display); font-size: clamp(34px, 3.5vw, 50px); font-weight: 600; line-height: 1.2; }
.about__heading > p span { display: block; margin-top: 12px; font-family: var(--body); font-size: 16px; font-weight: 300; }

/* An open contact surface, using the player's steel and brass materials. */
.cta { align-items: start; }
.cta__title { font-size: clamp(50px, 5.4vw, 76px); max-width: 11ch; }
.cta__description { color: var(--text-dim); max-width: 30ch; font-size: 17px; }
.contact-form { min-width: 0; }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.form-field { display: flex; flex-direction: column; gap: 10px; margin-bottom: 24px; }
.form-field label { font-size: 16px; color: var(--text); }
.form-field input, .form-field textarea {
  width: 100%; min-width: 0; border: 1px solid #43564a; border-radius: 0;
  background: var(--ground-2); color: var(--text); padding: 14px 16px;
  font: 16px/1.5 Arial, sans-serif; transition: border-color .2s, background .2s;
}
.form-field input { min-height: 54px; }
.form-field textarea { resize: vertical; min-height: 150px; }
.form-field input:hover, .form-field textarea:hover { border-color: var(--steel); }
.form-field input:focus, .form-field textarea:focus { border-color: var(--brass); background: #142019; }
.form-actions { display: flex; align-items: center; gap: 24px; }
.form-actions p { color: var(--text-dim); font-size: 13px; margin: 0; }
.form-status { color: var(--brass-hi); font-size: 16px; margin: 18px 0 0; }
.form-status:empty { display: none; }
.motion-toggle { color: var(--text-dim); padding: 0 8px; min-height: 32px; background: none; border: 0; font-size: 12px; text-decoration: underline; text-underline-offset: 4px; }
.motion-toggle:hover { color: var(--brass-hi); }
.motion-toggle[hidden] { display: none; }

/* FORGE atmosphere: sparse cold-metal dust and a few slow brass embers. */
.hero__atmosphere { position: absolute; inset: 0; z-index: -1; pointer-events: none; overflow: hidden; }
.ember { position: absolute; left: var(--x); top: var(--y); width: var(--size); height: var(--size); border-radius: 50%; background: var(--steel); opacity: 0; animation: ember-drift var(--duration) linear var(--delay) infinite; animation-play-state: paused; }
.ember:nth-child(3n) { background: var(--brass-hi); }
.hero.is-in-view .ember { animation-play-state: running; }
body.motion-paused .ember { animation-play-state: paused; }
@keyframes ember-drift {
  0% { transform: translate3d(0, 35px, 0); opacity: 0; }
  20% { opacity: .32; }
  70% { opacity: .2; }
  100% { transform: translate3d(var(--drift), -160px, 0); opacity: 0; }
}
.hero.is-entering .hero__portrait { animation: portrait-arrive 1.5s cubic-bezier(.16,1,.3,1) both; }
.hero.is-entering .hero__name { animation: name-arrive 1s cubic-bezier(.16,1,.3,1) both; }
.hero.is-entering .hero__actions { animation: actions-arrive 1.1s cubic-bezier(.16,1,.3,1) both; }
@keyframes portrait-arrive { from { opacity: .45; transform: scale(1.035); } to { opacity: 1; transform: scale(1); } }
@keyframes name-arrive { from { opacity: .35; transform: translateY(18px); filter: blur(3px); } to { opacity: 1; transform: none; filter: blur(0); } }
@keyframes actions-arrive { from { opacity: .3; transform: translateY(10px); } to { opacity: 1; transform: none; } }
@media(max-width:1050px) { .cta { gap: 40px; } }
@media(max-width:760px) {
  .hero__actions { flex-wrap: wrap; gap: 18px 24px; }
  .hero__actions .text-link { font-size: 15px; gap: 12px; }
  .hero__inner { padding-bottom: 64px; }
  .cta { grid-template-columns: 1fr; gap: 32px; }
  .cta__title { font-size: 58px; max-width: 12ch; }
  .cta__description { max-width: 36ch; }
  .about__heading > p { font-size: 38px; }
  .motion-toggle { padding: 0; align-self: flex-start; }
}
@media(max-width:440px) {
  .hero__actions { align-items: flex-start; flex-direction: column; gap: 10px; }
  .hero__inner { padding-bottom: 36px; }
  .hero__name { font-size: 22vw; }
  .form-row { grid-template-columns: 1fr; gap: 0; }
  .form-actions { align-items: flex-start; flex-direction: column; gap: 14px; }
}
@media(prefers-reduced-motion:reduce) {
  *, *::before, *::after { animation: none !important; }
  .hero__atmosphere { display: none; }
}