/* BLADEPHAROH -- public site v2
   Palette: void #0A1220 / navy #0F2233 / ink #EAF0F3 / mist #9DB2BD / signal #35B7C6
   Zero JavaScript. Static by decision. Cinematic image bands, varied section rhythm. */

:root{
  --void:#0A1220;
  --void-deep:#060B14;
  --navy:#0F2233;
  --ink:#EAF0F3;
  --mist:#9DB2BD;
  --signal:#35B7C6;
  --line:rgba(157,178,189,.16);
  --line-strong:rgba(157,178,189,.32);
  --sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
}

*{box-sizing:border-box;margin:0;padding:0}
body{
  background:var(--void);
  color:var(--ink);
  font-family:var(--sans);
  font-size:17px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}

.skip{position:absolute;left:-9999px;top:0;background:var(--signal);color:var(--void);padding:.6rem 1rem;font-weight:700;z-index:50}
.skip:focus{left:0}

a{color:var(--ink);text-decoration:none}
a:focus-visible{outline:2px solid var(--signal);outline-offset:3px}
p a{color:var(--signal);border-bottom:1px solid rgba(53,183,198,.4)}

.wrap{max-width:1120px;margin-inline:auto;padding-inline:28px}
.narrow{max-width:720px}

/* ---------- nav ---------- */
.top{position:relative;z-index:5;border-bottom:1px solid var(--line);background:var(--void)}
.top .wrap{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;padding-block:18px;flex-wrap:wrap}
.brand{font-weight:800;letter-spacing:.22em;font-size:.95rem}
.top nav{display:flex;gap:1.35rem;flex-wrap:wrap}
.top nav a{font-size:.71rem;letter-spacing:.17em;color:var(--mist);padding-block:.3rem;border-bottom:2px solid transparent}
.top nav a:hover{color:var(--ink)}
.top nav a[aria-current="page"]{color:var(--signal);border-bottom-color:var(--signal)}

/* ---------- buttons ---------- */
.actions{display:flex;gap:1rem;margin-top:2.2rem;flex-wrap:wrap}
.btn{display:inline-block;padding:.85rem 1.6rem;font-size:.73rem;font-weight:700;letter-spacing:.18em;border:1px solid var(--line-strong);color:var(--ink);background:rgba(6,11,20,.35)}
.btn:hover{border-color:var(--mist)}
.btn-signal{border-color:var(--signal);color:var(--signal)}
.btn-signal:hover{background:rgba(53,183,198,.1)}

/* ---------- cinematic bands ---------- */
.band{position:relative;overflow:hidden;border-bottom:1px solid var(--line)}
.band-art{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.band-veil{position:absolute;inset:0;pointer-events:none}
.band-inner{position:relative}

/* hero: text left over the dark left field, runner stays clear on the right */
.hero .band-art{object-position:center right}
.hero .band-veil{background:linear-gradient(90deg,rgba(6,11,20,.88) 0%,rgba(6,11,20,.55) 42%,rgba(6,11,20,.08) 70%)}
.hero .band-inner{padding-block:22vh 24vh}
.hero h1{font-size:clamp(2.5rem,6vw,4.4rem);font-weight:800;line-height:1.05;letter-spacing:.01em;max-width:13ch}
.hero h1 .l{display:block}
.hero .lede{margin-top:1.6rem;max-width:31rem;color:var(--ink);font-size:1.05rem}
.hero .lede.muted{color:var(--mist)}

/* flagship band: bladeverse, biggest moment after hero */
.flagship .band-inner{padding-block:34vh 8vh;display:flex;align-items:flex-end;min-height:92vh}
.flagship .band-veil{background:linear-gradient(180deg,rgba(6,11,20,.25) 0%,rgba(6,11,20,.1) 45%,rgba(6,11,20,.9) 88%)}
.flagship .panel{max-width:620px}

/* fifth chair band: intimate, centered, atmospheric */
.chair .band-inner{min-height:78vh;display:flex;align-items:flex-end;justify-content:center;text-align:center;padding-block:30vh 7vh}
.chair .band-veil{background:linear-gradient(180deg,rgba(6,11,20,.15) 0%,rgba(6,11,20,.05) 50%,rgba(6,11,20,.88) 92%)}
.chair .panel{max-width:560px}
.chair .actions{justify-content:center}

/* subpage heads */
.page-head{min-height:52vh;display:flex;align-items:flex-end}
.page-head .band-veil{background:linear-gradient(180deg,rgba(6,11,20,.4) 0%,rgba(6,11,20,.15) 45%,rgba(6,11,20,.92) 90%)}
.page-head .band-inner{padding-block:16vh 5vh;width:100%}
.page-head h1{font-size:clamp(2.2rem,5vw,3.7rem);font-weight:800;line-height:1.05;letter-spacing:.01em}

/* ---------- flat sections ---------- */
section.flat{padding-block:96px}
.eyebrow{font-size:.69rem;font-weight:700;letter-spacing:.26em;color:var(--signal);margin-bottom:1.1rem}
.identifier{font-size:.69rem;font-weight:700;letter-spacing:.26em;color:var(--mist);margin-bottom:1.1rem}
h2{font-size:clamp(1.7rem,3.2vw,2.4rem);font-weight:800;line-height:1.12;margin-bottom:1.3rem}
.prose p{margin-bottom:1.1rem;max-width:62ch}
.prose p:last-child{margin-bottom:0}
.muted{color:var(--mist)}
.tagline{font-size:1rem;font-weight:700;letter-spacing:.12em;margin-bottom:1.3rem}
.canon{border-left:2px solid var(--signal);padding:1rem 0 1rem 1.5rem;margin:1.9rem 0;font-size:.9rem;font-weight:700;letter-spacing:.14em;line-height:2;max-width:46ch}
.canon span{display:block}
.doctrine-line{font-size:clamp(1.25rem,2.4vw,1.7rem);font-weight:800;letter-spacing:.06em;margin:1.6rem 0}

/* reverse a&r editorial split */
.editorial{border-bottom:1px solid var(--line)}
.ed-grid{display:grid;grid-template-columns:1fr 1fr;gap:0;align-items:stretch;min-height:74vh}
.ed-copy{padding:96px 56px 96px 28px;display:flex;flex-direction:column;justify-content:center}
.ed-copy .inner{max-width:520px;margin-left:auto}
.ed-art{position:relative;overflow:hidden}
.ed-art img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}

/* the order device */
.order{margin:1.9rem 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding-block:1.3rem}
.order .row{display:flex;flex-wrap:wrap;align-items:baseline;gap:.5rem 0;padding-block:.45rem}
.order .lab{font-size:.66rem;font-weight:700;letter-spacing:.22em;color:var(--mist);min-width:9.5rem}
.order .seq{font-size:.8rem;font-weight:700;letter-spacing:.14em}
.order .seq .arw{color:var(--mist);padding-inline:.55rem;font-weight:400}
.order .rev .seq{color:var(--signal)}

/* founder preview */
.preview{border-top:1px solid var(--line)}

/* contact */
.contact{text-align:center;border-top:1px solid var(--line)}
.contact .mail{display:inline-block;margin-top:1.4rem;font-size:clamp(1.15rem,2.4vw,1.6rem);font-weight:700;color:var(--signal);border-bottom:2px solid rgba(53,183,198,.4);padding-bottom:.2rem}
.contact .mail:hover{border-bottom-color:var(--signal)}

/* ---------- about page ---------- */
.about-head{border-bottom:1px solid var(--line);padding-block:110px 70px}
.about-head h1{font-size:clamp(2.1rem,4.6vw,3.4rem);font-weight:800;line-height:1.06;letter-spacing:.02em}
.about-body{padding-block:80px}
.about-block{margin-bottom:64px}
.about-block:last-child{margin-bottom:0}
.about-photo{border:1px solid var(--line-strong);background:var(--navy);aspect-ratio:4/5;max-width:340px;display:none}

/* subpage body */
.page-body{padding-block:80px}

/* ---------- footer ---------- */
footer{border-top:1px solid var(--line);padding-block:64px;background:var(--void-deep)}
.foot-brand{font-weight:800;letter-spacing:.22em;font-size:.9rem}
.foot-doctrine{color:var(--mist);margin-top:.7rem;font-size:.95rem}
.foot-links{display:flex;gap:1.5rem;flex-wrap:wrap;margin-top:2rem}
.foot-links a{font-size:.71rem;letter-spacing:.16em;color:var(--mist)}
.foot-links a:hover{color:var(--ink)}
.foot-copy{margin-top:2.2rem;font-size:.8rem;color:var(--mist)}

/* ---------- responsive ---------- */
@media (max-width:960px){
  .ed-grid{grid-template-columns:1fr;min-height:0}
  .ed-art{min-height:52vh;position:relative}
  .ed-copy{padding:72px 28px}
  .ed-copy .inner{margin-left:0}
  .flagship .band-inner{padding-block:42vh 7vh;min-height:0}
  .chair .band-inner{padding-block:36vh 7vh;min-height:0}
}
@media (max-width:640px){
  body{font-size:16px}
  .top nav{gap:.95rem}
  .hero .band-inner{padding-block:16vh 18vh}
  .hero .band-veil{background:linear-gradient(90deg,rgba(6,11,20,.9) 0%,rgba(6,11,20,.62) 55%,rgba(6,11,20,.28) 100%)}
  section.flat{padding-block:64px}
  .page-head{min-height:42vh}
  .about-head{padding-block:70px 50px}
  .order .lab{min-width:100%}
}
