
.about-page{min-height:100%;background:#0b0c0c;color:var(--text)}
.about-header{position:sticky;top:0;z-index:60;height:78px;display:grid;grid-template-columns:auto 1fr;align-items:center;gap:28px;padding:0 4vw;background:rgba(7,8,8,.91);backdrop-filter:blur(15px);border-bottom:1px solid rgba(255,255,255,.055)}
.about-brand{display:flex;align-items:center;gap:10px;font-family:var(--serif);letter-spacing:.18em}
.about-brand img{width:38px;height:38px;object-fit:cover;border-radius:50%;filter:grayscale(1) contrast(1.08)}
.about-nav{display:flex;justify-content:flex-end;gap:28px}
.about-nav a{position:relative;font-size:.74rem;text-transform:uppercase;letter-spacing:.15em;color:#c8c4bc}
.about-nav a::after{content:"";position:absolute;left:0;right:100%;bottom:-12px;height:1px;background:var(--brass-soft);transition:right .25s ease}
.about-nav a:hover::after,.about-nav a.active::after{right:0}
.about-menu-toggle{display:none;background:none;border:0;width:44px;height:44px;padding:8px}
.about-menu-toggle span:not(.sr-only){display:block;height:1px;background:#ddd;margin:7px 0}

.about-shell{width:min(1180px,100%);margin:auto}
.about-k{margin:0 0 12px;font-size:.7rem;letter-spacing:.31em;text-transform:uppercase;color:rgba(180,157,128,.74)}
.about-rule{width:108px;height:1px;margin:27px 0;background:linear-gradient(90deg,#9a7445,transparent)}

.about-hero{position:relative;overflow:hidden;padding:112px 6vw 105px;border-bottom:1px solid rgba(255,255,255,.06);background:radial-gradient(circle at 78% 40%,rgba(154,116,69,.07),transparent 28%),linear-gradient(180deg,#0b0c0c,#101111)}
.about-hero::before{content:"";position:absolute;inset:0;opacity:.18;background:repeating-linear-gradient(90deg,rgba(255,255,255,.006) 0 1px,transparent 1px 5px)}
.about-hero-inner{position:relative;z-index:2;width:min(1180px,100%);margin:auto;display:grid;grid-template-columns:minmax(0,1.25fr) minmax(250px,.75fr);gap:75px;align-items:center}
.about-hero h1{margin:0;font-family:var(--serif);font-size:clamp(5rem,10vw,9.2rem);font-weight:400;line-height:.86;letter-spacing:-.055em}
.about-lead{margin:0;font-family:var(--serif);font-size:clamp(1.6rem,2.8vw,2.45rem);font-style:italic;color:#b9b0a5}
.about-intro{max-width:720px;margin:22px 0 0;color:rgba(202,196,186,.66);font-size:.97rem;line-height:1.82}
.about-mark{display:grid;place-items:center}
.about-mark img{width:min(300px,82%);opacity:.17;filter:grayscale(1) brightness(.75) drop-shadow(0 25px 35px rgba(0,0,0,.30))}

.about-philosophy{padding:90px 6vw;background:#0d0e0e}
.philosophy-grid{display:grid;grid-template-columns:.95fr 1.05fr;gap:82px;align-items:start}
.philosophy-statement h2{margin:0;font-family:var(--serif);font-size:clamp(3.2rem,6vw,5.9rem);font-weight:400;line-height:.96;letter-spacing:-.045em}
.philosophy-copy{padding-top:26px;border-top:1px solid rgba(154,116,69,.18)}
.philosophy-copy p{max-width:650px;margin:0 0 22px;color:rgba(202,195,185,.62);font-size:.98rem;line-height:1.82}
.philosophy-copy p:last-child{margin-bottom:0}

.about-name{position:relative;overflow:hidden;padding:105px 6vw;background:linear-gradient(180deg,#0a0b0b,#101111);border-top:1px solid rgba(255,255,255,.05);border-bottom:1px solid rgba(255,255,255,.05)}
.about-name-ghost{position:absolute;right:-.03em;top:50%;transform:translateY(-54%);font-family:var(--serif);font-size:min(43vw,660px);line-height:.75;letter-spacing:-.09em;color:rgba(255,255,255,.018);pointer-events:none;user-select:none}
.name-grid{position:relative;z-index:2;display:grid;grid-template-columns:.9fr 1.1fr;gap:80px;align-items:center}
.name-copy h2{margin:0;font-family:var(--serif);font-size:clamp(3.1rem,5.5vw,5.5rem);line-height:.96;letter-spacing:-.045em;font-weight:400}
.name-copy>p{max-width:590px;margin:0 0 19px;color:rgba(201,194,184,.62);line-height:1.78}
.name-copy strong{font-weight:500;color:#ded7cd}

.requiem-card{position:relative;padding:42px 42px 36px;border:1px solid rgba(154,116,69,.22);background:radial-gradient(circle at 72% 10%,rgba(154,116,69,.055),transparent 31%),rgba(13,14,14,.84);box-shadow:0 28px 70px rgba(0,0,0,.22)}
.requiem-card::before{content:"";position:absolute;inset:13px;border:1px solid rgba(255,255,255,.026);pointer-events:none}
.requiem-card-top{position:relative;z-index:2}
.requiem-card h3{margin:0;font-family:var(--serif);font-size:clamp(2.5rem,4.5vw,4.35rem);font-weight:400;line-height:.98;letter-spacing:-.035em}
.requiem-short{max-width:580px;margin:21px 0 0;color:rgba(201,194,184,.60);font-size:.88rem;line-height:1.72}

.requiem-player{position:relative;z-index:2;display:grid;grid-template-columns:auto 1fr;gap:22px;align-items:center;margin-top:34px;padding:24px 0 22px;border-top:1px solid rgba(154,116,69,.16);border-bottom:1px solid rgba(154,116,69,.16)}
.requiem-play{display:inline-flex;align-items:center;gap:12px;min-height:46px;padding:0 17px;border:1px solid rgba(154,116,69,.50);background:rgba(154,116,69,.055);color:#ece6dc;text-transform:uppercase;letter-spacing:.13em;font-size:.66rem;transition:.25s}
.requiem-play:hover{background:rgba(154,116,69,.15);border-color:#9a7445}
.play-icon{position:relative;width:11px;height:14px}
.play-icon::before{content:"";position:absolute;left:1px;top:1px;border-top:6px solid transparent;border-bottom:6px solid transparent;border-left:9px solid #b99463}
.requiem-play.is-playing .play-icon::before{left:1px;top:1px;width:8px;height:12px;border:0;border-left:3px solid #b99463;border-right:3px solid #b99463}
.requiem-progress-wrap{display:grid;gap:8px}
.requiem-track{position:relative;height:16px;cursor:pointer;outline:none}
.requiem-track::before{content:"";position:absolute;left:0;right:0;top:7px;height:1px;background:rgba(255,255,255,.13)}
.requiem-progress{position:absolute;left:0;top:7px;width:0;height:1px;background:#a77c4a;box-shadow:0 0 8px rgba(154,116,69,.30)}
.requiem-track:focus-visible{box-shadow:0 0 0 1px rgba(154,116,69,.55)}
.requiem-time{display:flex;justify-content:space-between;font-size:.61rem;letter-spacing:.12em;color:rgba(195,188,178,.43)}
.requiem-meta{position:relative;z-index:2;display:grid;gap:4px;margin-top:20px;font-size:.65rem;line-height:1.5;color:rgba(193,186,176,.40)}
.requiem-meta a{width:max-content;color:rgba(178,147,107,.62);border-bottom:1px solid rgba(154,116,69,.22)}

.about-values{padding:88px 6vw 94px;background:#0c0d0d}
.about-section-heading{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:22px}
.about-section-heading span{height:1px;background:linear-gradient(90deg,transparent,rgba(154,116,69,.40))}
.about-section-heading span:last-child{background:linear-gradient(90deg,rgba(154,116,69,.40),transparent)}
.about-section-heading h2{margin:0;font-family:var(--serif);font-weight:400;text-transform:uppercase;letter-spacing:.18em;font-size:1.02rem}
.values-grid{display:grid;grid-template-columns:repeat(3,1fr);margin-top:42px;border-top:1px solid rgba(154,116,69,.15);border-bottom:1px solid rgba(154,116,69,.15)}
.values-grid article{min-height:235px;padding:34px 30px;border-right:1px solid rgba(154,116,69,.14)}
.values-grid article:first-child{padding-left:0}
.values-grid article:last-child{border-right:0}
.values-grid article>span{font-family:var(--serif);color:#9a7445;font-size:1.15rem}
.values-grid h3{margin:21px 0 11px;font-family:var(--serif);font-weight:400;font-size:2rem}
.values-grid p{max-width:330px;margin:0;color:rgba(198,191,181,.55);font-size:.84rem;line-height:1.7}

.about-close{position:relative;overflow:hidden;padding:110px 6vw 118px;text-align:center;background:radial-gradient(circle at 50% 50%,rgba(154,116,69,.055),transparent 27%),#090a0a;border-top:1px solid rgba(255,255,255,.045)}
.about-close-inner{width:min(920px,100%);margin:auto}
.about-close img{width:112px;margin:0 auto 31px;opacity:.24;filter:grayscale(1)}
.about-close p{margin:0 0 8px;text-transform:uppercase;letter-spacing:.20em;font-size:.68rem;color:#9c7950}
.about-close h2{margin:0;font-family:var(--serif);font-size:clamp(3.3rem,6vw,6rem);font-weight:400;line-height:.97;letter-spacing:-.045em}

.about-footer{display:flex;justify-content:space-between;gap:20px;padding:28px 6vw;border-top:1px solid rgba(255,255,255,.06);font-size:.72rem;letter-spacing:.15em;text-transform:uppercase;color:rgba(199,193,183,.55)}
.about-footer span{font-family:var(--serif);letter-spacing:.22em}

@media(max-width:980px){
  .about-header{grid-template-columns:1fr auto}
  .about-menu-toggle{display:block}
  .about-nav{display:none;position:absolute;top:78px;left:0;right:0;padding:18px 5vw 26px;background:#090a0a;border-bottom:1px solid rgba(255,255,255,.07);flex-direction:column;gap:0}
  .about-nav.open{display:flex}
  .about-nav a{padding:14px 0}
  .about-nav a::after{display:none}
  .about-hero-inner,.philosophy-grid,.name-grid{grid-template-columns:1fr}
  .about-mark{display:none}
  .name-grid{gap:55px}
  .values-grid{grid-template-columns:1fr}
  .values-grid article{min-height:0;padding:30px 0;border-right:0;border-bottom:1px solid rgba(154,116,69,.14)}
  .values-grid article:last-child{border-bottom:0}
}
@media(max-width:680px){
  .about-hero,.about-philosophy,.about-name,.about-values,.about-close{padding-left:22px;padding-right:22px}
  .about-hero{padding-top:84px;padding-bottom:78px}
  .about-philosophy{padding-top:70px;padding-bottom:70px}
  .about-name{padding-top:78px;padding-bottom:78px}
  .requiem-card{padding:32px 22px 29px}
  .requiem-player{grid-template-columns:1fr;gap:18px}
  .requiem-play{width:max-content}
  .about-values{padding-top:68px;padding-bottom:72px}
  .about-section-heading{grid-template-columns:1fr}
  .about-section-heading span{display:none}
  .about-section-heading h2{line-height:1.6}
  .about-close{padding-top:82px;padding-bottom:90px}
}
@media(prefers-reduced-motion:reduce){
  *{scroll-behavior:auto!important}
}
