/* LSJA Brand Direction — page styles. Fonts are self-hosted. */

@font-face{
  font-family:"LSJA Display";
  src:url("../fonts/BigShouldersDisplay-var-latin.woff2") format("woff2");
  font-weight:600 900;
  font-style:normal;
  font-display:swap;
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:"LSJA Display";
  src:url("../fonts/BigShouldersDisplay-var-latin-ext.woff2") format("woff2");
  font-weight:600 900;
  font-style:normal;
  font-display:swap;
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face{
  font-family:"LSJA Text";
  src:url("../fonts/Archivo-var-latin.woff2") format("woff2");
  font-weight:400 700;
  font-style:normal;
  font-stretch:100%;
  font-display:swap;
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:"LSJA Text";
  src:url("../fonts/Archivo-var-latin-ext.woff2") format("woff2");
  font-weight:400 700;
  font-style:normal;
  font-stretch:100%;
  font-display:swap;
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face{
  font-family:"LSJA Text";
  src:url("../fonts/Archivo-italic-latin.woff2") format("woff2");
  font-weight:400;
  font-style:italic;
  font-stretch:100%;
  font-display:swap;
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:"LSJA Text";
  src:url("../fonts/Archivo-italic-latin-ext.woff2") format("woff2");
  font-weight:400;
  font-style:italic;
  font-stretch:100%;
  font-display:swap;
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

:root{
  --carbon:#0B0B0D;
  --cream:#F5F2EC;
  --piping:#C4161C;
  --magenta:#AC3F86;
  --pitwall:#E4E6E8;
  --panel:#182221;
  --inksoft:#4A4D52;
  --bd-display:"LSJA Display","Arial Narrow",Impact,sans-serif;
  --bd-text:"LSJA Text","Segoe UI",system-ui,Helvetica,Arial,sans-serif;
}

/* Page uses brand type for document content; shared nav stays on hub faces */
.brand-doc{
  font-family:var(--bd-text);
  padding-bottom:72px;
}
.brand-doc h1,.brand-doc h2,.brand-doc h3,.brand-doc .bd-display{
  font-family:var(--bd-display);
  font-weight:800;
  letter-spacing:-.02em;
}

/* In-page jump links */
.bd-jump{
  display:flex;flex-wrap:wrap;gap:8px 18px;
  margin:22px 0 2px;
  padding:0;
  list-style:none;
}
.bd-jump a{
  font-family:var(--bd-display);
  font-weight:600;
  letter-spacing:.08em;
  text-transform:uppercase;
  font-size:13px;
  color:var(--muted);
  text-decoration:none;
}
.bd-jump a:hover{color:var(--cream);}

/* Opening */
.bd-open{padding:28px 0 8px;border-bottom:1px solid var(--line);margin-bottom:36px;}
.bd-open .kicker{margin-bottom:14px;}
.bd-open h1{
  font-weight:900;
  font-size:clamp(64px, 11vw, 148px);
  line-height:.8;
  letter-spacing:-.03em;
  margin:0 0 8px;
  text-transform:uppercase;
}
.bd-open h1 em{
  display:block;
  font-style:normal;
  font-weight:700;
  font-size:.42em;
  letter-spacing:.02em;
  color:var(--cream);
  opacity:.92;
  margin-top:.12em;
  text-transform:none;
}
.bd-open .version{
  display:inline-block;
  font-family:var(--bd-display);
  font-weight:700;
  letter-spacing:.1em;
  text-transform:uppercase;
  font-size:12px;
  color:var(--carbon);
  background:var(--cream);
  padding:5px 9px;
  border-radius:3px;
  margin-bottom:18px;
}
.bd-positioning{
  max-width:46em;
  color:var(--muted);
  font-size:clamp(16px,1.4vw,19px);
  line-height:1.55;
  margin:18px 0 28px;
}
.bd-positioning strong{color:var(--cream);font-weight:600;}

.bd-attrs{
  display:flex;flex-wrap:wrap;gap:10px;
  list-style:none;margin:0;padding:0;
}
.bd-attrs li{
  font-family:var(--bd-display);
  font-weight:700;
  letter-spacing:.1em;
  text-transform:uppercase;
  font-size:14px;
  color:var(--cream);
  border:1px solid var(--line);
  padding:8px 14px;
  border-radius:999px;
}

/* Section heads — slightly more editorial on this page */
.brand-doc .sec-head{margin:48px 0 22px;}
.brand-doc .sec-head h2{
  font-size:clamp(28px,3vw,40px);
  letter-spacing:.02em;
}

.bd-intro{
  color:var(--muted);
  font-size:16px;
  line-height:1.55;
  max-width:48em;
  margin:-8px 0 28px;
}
.bd-intro a{color:var(--cream);}

/* Palette */
.swatch-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:16px;
  margin-bottom:16px;
}
.swatch-grid.neutrals{
  grid-template-columns:repeat(3,1fr);
}
.swatch-card{
  background:var(--card);
  border:1px solid rgba(255,255,255,.08);
  border-radius:var(--radius);
  overflow:hidden;
  display:flex;
  flex-direction:column;
  min-width:0;
}
.swatch-chip{
  height:132px;
  position:relative;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.14);
}
.swatch-card.light-chip .swatch-chip{
  box-shadow:inset 0 0 0 1px rgba(24,34,33,.12);
}
.swatch-chip .hex-live{
  position:absolute;left:14px;bottom:12px;
  font-family:var(--bd-display);
  font-weight:700;
  letter-spacing:.06em;
  font-size:18px;
  margin:0;
}
.swatch-card.dark-chip .hex-live{color:var(--cream);}
.swatch-card.light-chip .hex-live{color:var(--panel);}
.swatch-meta{padding:16px 16px 18px;}
.swatch-meta h3{
  font-size:26px;
  line-height:1;
  margin:0 0 8px;
  letter-spacing:.01em;
  text-transform:uppercase;
}
.swatch-vals{
  display:flex;flex-wrap:wrap;gap:8px 16px;
  margin:0 0 10px;
  font-family:var(--bd-display);
  font-weight:600;
  letter-spacing:.06em;
  font-size:13px;
  text-transform:uppercase;
  color:var(--cream);
}
.swatch-vals code{
  font-family:var(--bd-text);
  font-weight:500;
  letter-spacing:0;
  text-transform:none;
  font-size:13px;
  color:var(--cream);
  background:transparent;
}
.swatch-role{
  margin:0 0 8px;
  font-size:13px;
  letter-spacing:.08em;
  text-transform:uppercase;
  font-family:var(--bd-display);
  font-weight:700;
  color:var(--piping);
}
.swatch-src{
  margin:0;
  color:var(--muted);
  font-size:13px;
  line-height:1.45;
}

/* Contrast */
.contrast-wrap{
  margin-top:28px;
  background:var(--card);
  border:1px solid rgba(255,255,255,.08);
  border-radius:var(--radius);
  overflow:hidden;
}
.contrast-wrap h3{
  font-size:22px;
  letter-spacing:.04em;
  text-transform:uppercase;
  margin:0;
  padding:18px 20px 0;
}
.contrast-wrap .bd-intro{padding:8px 20px 0;margin:0;}
.contrast-table{width:100%;border-collapse:collapse;margin-top:12px;}
.contrast-table th,.contrast-table td{
  text-align:left;
  padding:12px 20px;
  border-top:1px solid var(--line);
  vertical-align:middle;
  font-size:14px;
}
.contrast-table th{
  font-family:var(--bd-display);
  font-weight:600;
  letter-spacing:.08em;
  text-transform:uppercase;
  font-size:12px;
  color:var(--muted);
}
.pair{
  display:flex;align-items:center;gap:10px;
}
.pair i{
  width:28px;height:28px;border-radius:4px;
  border:1px solid rgba(255,255,255,.12);
  display:block;flex:0 0 auto;
}
.pair span{color:var(--cream);font-size:14px;}
.ratio{
  font-family:var(--bd-display);
  font-weight:700;
  font-size:18px;
  letter-spacing:.02em;
  font-variant-numeric:tabular-nums;
}
.badge{
  display:inline-block;
  font-family:var(--bd-display);
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
  font-size:11px;
  padding:4px 8px;
  border-radius:3px;
  white-space:nowrap;
}
.badge-aaa{background:var(--lime);color:var(--carbon);}
.badge-aa{background:var(--cream);color:var(--carbon);}
.badge-large{background:transparent;color:#ffd000;border:1px solid #ffd000;}
.badge-fail{background:transparent;color:var(--muted);border:1px solid var(--line);}
.use{color:var(--muted);font-size:13px;line-height:1.4;max-width:28em;}

/* Type */
.type-split{
  display:grid;
  grid-template-columns:1.15fr 1fr;
  gap:16px;
  margin-bottom:16px;
}
.type-card{
  background:var(--card);
  border:1px solid rgba(255,255,255,.08);
  border-radius:var(--radius);
  padding:28px 28px 24px;
  min-width:0;
}
.type-card.paper{background:var(--cream);color:var(--panel);border-color:transparent;}
.type-card .face-kicker{
  font-family:var(--bd-display);
  font-weight:700;
  letter-spacing:.12em;
  text-transform:uppercase;
  font-size:12px;
  margin:0 0 10px;
  color:var(--piping);
}
.type-card.paper .face-kicker{color:var(--piping);}
.type-card .face-name{
  font-size:clamp(40px,5vw,72px);
  line-height:.85;
  margin:0 0 10px;
  text-transform:uppercase;
  letter-spacing:-.03em;
}
.type-card.paper .face-name{color:var(--panel);}
.type-card .face-meta{
  margin:0 0 18px;
  font-size:13px;
  color:var(--muted);
  line-height:1.45;
}
.type-card.paper .face-meta{color:var(--inksoft);}
.type-card .pangram{
  margin:0;
  font-size:clamp(28px,3vw,42px);
  line-height:.95;
  letter-spacing:-.02em;
  text-transform:uppercase;
}
.type-card .body-sample{
  margin:0;
  font-size:17px;
  line-height:1.55;
  max-width:36em;
}
.type-card.paper .body-sample{color:var(--panel);}
.type-card .body-sample em{font-style:italic;font-weight:400;}

.scale{
  background:var(--card);
  border:1px solid rgba(255,255,255,.08);
  border-radius:var(--radius);
  overflow:hidden;
  margin-bottom:16px;
}
.scale-row{
  display:grid;
  grid-template-columns:140px 1fr;
  gap:20px;
  padding:18px 24px;
  border-top:1px solid var(--line);
  align-items:end;
}
.scale-row:first-child{border-top:0;}
.scale-meta{
  font-family:var(--bd-display);
  font-weight:600;
  letter-spacing:.08em;
  text-transform:uppercase;
  font-size:12px;
  color:var(--muted);
  padding-bottom:6px;
}
.scale-meta b{display:block;color:var(--cream);font-weight:700;font-size:14px;letter-spacing:.04em;margin-bottom:2px;}
.sc-h1{font-family:var(--bd-display);font-weight:900;font-size:clamp(52px,6vw,88px);line-height:.85;letter-spacing:-.03em;text-transform:uppercase;margin:0;}
.sc-h2{font-family:var(--bd-display);font-weight:800;font-size:clamp(32px,3.6vw,48px);line-height:.9;letter-spacing:-.02em;text-transform:uppercase;margin:0;}
.sc-h3{font-family:var(--bd-display);font-weight:700;font-size:clamp(22px,2.2vw,28px);line-height:1;letter-spacing:.02em;text-transform:uppercase;margin:0;}
.sc-body{font-family:var(--bd-text);font-weight:400;font-size:17px;line-height:1.55;margin:0;max-width:40em;color:var(--cream);}
.sc-caption{font-family:var(--bd-text);font-weight:400;font-style:italic;font-size:13px;line-height:1.45;margin:0;color:var(--muted);max-width:40em;}
.sc-nums{
  font-family:var(--bd-display);
  font-weight:800;
  font-variant-numeric:tabular-nums;
  letter-spacing:-.02em;
  line-height:1;
  margin:0;
  display:flex;flex-wrap:wrap;gap:8px 32px;
  align-items:baseline;
}
.sc-nums .n{font-size:clamp(40px,5vw,64px);}
.sc-nums .u{font-family:var(--bd-display);font-weight:600;letter-spacing:.1em;text-transform:uppercase;font-size:12px;color:var(--muted);display:block;margin-top:6px;}

.num-note{margin:8px 0 0;color:var(--muted);font-size:13px;}

.type-rationale{
  color:var(--muted);
  font-size:16px;
  line-height:1.55;
  max-width:52em;
  margin:8px 0 0;
}
.type-rationale strong{color:var(--cream);font-weight:600;}

/* Wireframes */
.wf-board{
  background:#101012;
  border:1px solid rgba(255,255,255,.08);
  border-radius:var(--radius);
  padding:28px 24px 32px;
  display:grid;
  grid-template-columns:1fr 280px;
  gap:28px;
  align-items:start;
}
.wf-col h3,.ann-col h3,.hero-preview-head h3{
  font-family:var(--bd-display);
  font-weight:800;
  letter-spacing:.04em;
  text-transform:uppercase;
  font-size:18px;
  margin:0 0 14px;
}
.browser{
  background:#d8d6d1;
  color:#2a2a2e;
  border-radius:12px;
  overflow:hidden;
  box-shadow:0 24px 48px rgba(0,0,0,.45);
}
.browser-bar{
  background:#c4c2bd;
  display:flex;align-items:center;gap:8px;
  padding:8px 12px;
}
.browser-bar .dots{display:flex;gap:5px;}
.browser-bar .dots i{width:8px;height:8px;border-radius:50%;background:#9a9690;display:block;}
.browser-bar .url{
  flex:1;height:18px;border-radius:4px;background:#efece6;
  font-family:var(--bd-text);font-size:10px;color:#6a6864;
  display:flex;align-items:center;padding:0 8px;
}
.desktop-page{background:#eceae6;padding:0;}
.wf-nav,.wf-hero,.wf-block,.wf-row,.wf-foot{
  border-bottom:1px solid #cfcbc4;
  padding:18px 14px 12px;
  position:relative;
}
.wf-label{
  position:absolute;top:6px;left:14px;
  font-family:var(--bd-display);
  font-weight:700;
  letter-spacing:.1em;
  text-transform:uppercase;
  font-size:9px;
  color:#6f6c67;
}
.wf-nav{display:flex;justify-content:space-between;align-items:center;padding:10px 14px;min-height:36px;}
.wf-nav .mark{font-family:var(--bd-display);font-weight:800;font-size:13px;letter-spacing:.08em;}
.wf-nav .links{display:flex;gap:8px;}
.wf-nav .links i{display:block;width:36px;height:6px;background:#c4c0ba;border-radius:2px;}
.wf-nav .cta-mini{width:44px;height:14px;background:#8d8a85;border-radius:2px;}
.wf-hero{padding:22px 14px 16px;min-height:110px;display:grid;grid-template-columns:1.3fr 86px;gap:12px;align-items:end;}
.wf-hero .lines{display:flex;flex-direction:column;gap:6px;padding-top:10px;}
.wf-hero .h{height:12px;width:78%;background:#3a3a3e;border-radius:2px;}
.wf-hero .h.s{width:54%;height:12px;}
.wf-hero .p{height:5px;width:70%;background:#c4c0ba;border-radius:2px;margin-top:4px;}
.wf-hero .btns{display:flex;gap:6px;margin-top:8px;}
.wf-hero .btn{height:16px;width:72px;background:#3a3a3e;border-radius:2px;}
.wf-hero .btn.ghost{background:transparent;border:1px solid #b0ada8;width:64px;}
.date-tile{
  background:#fff;
  border:1px solid #c4c0ba;
  border-radius:4px;
  padding:6px 6px 7px;
  text-align:center;
  color:#2a2a2e;
}
.date-tile .mo{
  font-family:var(--bd-display);
  font-weight:700;
  letter-spacing:.1em;
  font-size:7px;
  text-transform:uppercase;
  color:#8a8680;
}
.date-tile .dy{
  font-family:var(--bd-display);
  font-weight:900;
  font-size:28px;
  line-height:.9;
  letter-spacing:-.03em;
}
.date-tile .ev{
  font-family:var(--bd-text);
  font-size:6.5px;
  line-height:1.25;
  color:#6a6864;
  margin-top:3px;
}
.wf-mission{display:grid;grid-template-columns:1fr;gap:10px;padding:20px 14px 14px;min-height:52px;}
.wf-mission .ph{display:flex;flex-direction:column;gap:4px;padding-top:10px;}
.wf-mission .ph i{display:block;height:5px;background:#c4c0ba;border-radius:2px;}
.wf-programs{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;padding:18px 12px 12px;}
.prog{
  background:#e3e1dc;
  border:1px solid #d0ccc6;
  border-radius:4px;
  min-height:64px;
  padding:16px 8px 8px;
  display:flex;flex-direction:column;gap:4px;
}
.prog i{display:block;height:5px;background:#b8b4ae;border-radius:2px;}
.prog i.t{width:70%;height:7px;background:#6a6864;}
.wf-legacy{display:grid;grid-template-columns:80px 1fr;gap:10px;padding:16px 12px;min-height:72px;}
.portrait{
  background:#d0ccc6;
  border-radius:4px;
  display:flex;align-items:center;justify-content:center;
  font-family:var(--bd-display);
  font-weight:700;
  letter-spacing:.06em;
  text-transform:uppercase;
  font-size:7px;
  color:#7a7670;
  text-align:center;
  padding:6px;
  line-height:1.3;
}
.wf-legacy .ph{display:flex;flex-direction:column;gap:4px;padding-top:12px;}
.wf-legacy .ph i{display:block;height:5px;background:#c4c0ba;border-radius:2px;}
.wf-instructors{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;padding:18px 12px 12px;}
.inst{min-height:70px;background:#e3e1dc;border-radius:4px;display:flex;flex-direction:column;}
.inst .av{flex:1;background:#d0ccc6;border-radius:4px 4px 0 0;}
.inst .nm{height:16px;background:#e3e1dc;}
.wf-impact{padding:16px 12px;display:grid;grid-template-columns:repeat(3,1fr);gap:8px;}
.stat{
  padding:12px 8px 8px;
  border-left:2px solid #b0ada8;
  min-height:48px;
}
.stat .n{display:block;height:14px;width:50%;background:#3a3a3e;border-radius:2px;margin-bottom:6px;}
.stat i{display:block;height:4px;width:70%;background:#c4c0ba;border-radius:2px;}
.wf-schedule{padding:16px 12px;display:flex;align-items:center;gap:12px;min-height:70px;}
.wf-schedule .date-tile{flex:0 0 64px;}
.wf-schedule .ph{flex:1;display:flex;flex-direction:column;gap:4px;padding-top:10px;}
.wf-schedule .ph i{display:block;height:5px;background:#c4c0ba;border-radius:2px;}
.wf-partners{display:flex;gap:8px;padding:18px 12px 12px;align-items:center;}
.wf-partners .logo{flex:1;height:28px;background:#e3e1dc;border:1px dashed #c4c0ba;border-radius:3px;}
.wf-news{padding:16px 12px;display:grid;grid-template-columns:1fr 100px;gap:10px;align-items:center;min-height:56px;}
.wf-news .ph{display:flex;flex-direction:column;gap:4px;}
.wf-news .ph i{display:block;height:5px;background:#c4c0ba;border-radius:2px;}
.wf-news .field{height:18px;background:#fff;border:1px solid #c4c0ba;border-radius:3px;}
.wf-foot{display:flex;justify-content:space-between;padding:10px 12px;background:#d8d6d1;}
.wf-foot i{display:block;height:5px;background:#b0ada8;border-radius:2px;width:80px;}

/* Mobile wireframe */
.phone{
  width:230px;
  margin:0 auto;
  background:#d8d6d1;
  border-radius:22px;
  padding:10px 8px 14px;
  box-shadow:0 24px 48px rgba(0,0,0,.45);
  color:#2a2a2e;
}
.phone-notch{width:70px;height:8px;background:#c4c2bd;border-radius:6px;margin:0 auto 8px;}
.mobile-page{background:#eceae6;border-radius:12px;overflow:hidden;}
.m-nav{display:flex;justify-content:space-between;align-items:center;padding:8px 8px;border-bottom:1px solid #cfcbc4;position:relative;}
.m-hero{padding:16px 8px 12px;min-height:100px;position:relative;border-bottom:1px solid #cfcbc4;}
.m-hero .h{height:12px;width:86%;background:#3a3a3e;border-radius:2px;margin:12px 0 6px;}
.m-hero .h.s{width:60%;}
.m-hero .p{height:5px;width:80%;background:#c4c0ba;border-radius:2px;margin-bottom:8px;}
.m-hero .btn{height:14px;width:70%;background:#3a3a3e;border-radius:2px;margin-bottom:8px;}
.m-hero .date-tile{width:72px;}
.m-block{border-bottom:1px solid #cfcbc4;padding:14px 8px 10px;position:relative;min-height:44px;}
.m-grid2{display:grid;grid-template-columns:1fr 1fr;gap:6px;padding-top:12px;}
.m-grid2 i{display:block;height:42px;background:#e3e1dc;border-radius:3px;}
.m-legacy{display:grid;grid-template-columns:48px 1fr;gap:6px;padding-top:12px;}
.m-legacy .portrait{min-height:48px;font-size:6px;}
.m-row{display:flex;flex-direction:column;gap:4px;padding-top:12px;}
.m-row i{height:5px;background:#c4c0ba;border-radius:2px;display:block;}

/* Annotations */
.ann-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px;}
.ann-list li{
  display:grid;
  grid-template-columns:28px 1fr;
  gap:10px;
  color:var(--muted);
  font-size:13px;
  line-height:1.45;
}
.ann-list b{color:var(--cream);font-weight:600;display:block;margin-bottom:2px;font-size:14px;}
.ann-num{
  width:28px;height:28px;border-radius:50%;
  background:var(--piping);color:var(--cream);
  font-family:var(--bd-display);font-weight:800;
  display:flex;align-items:center;justify-content:center;
  font-size:13px;
  flex:0 0 auto;
}

/* Styled hero preview */
.hero-preview-head{margin:36px 0 14px;}
.styled-hero{
  background:var(--carbon);
  color:var(--cream);
  border-radius:var(--radius);
  overflow:hidden;
  border:1px solid rgba(255,255,255,.08);
  box-shadow:0 24px 48px rgba(0,0,0,.45);
  position:relative;
}
.styled-hero .sh-accent{height:6px;background:var(--piping);}
.styled-hero .sh-inner{
  padding:36px 40px 40px;
  display:grid;
  grid-template-columns:1.4fr auto;
  gap:40px;
  align-items:end;
  background:
    linear-gradient(180deg, rgba(11,11,13,0) 0%, rgba(11,11,13,.2) 100%),
    repeating-linear-gradient(-18deg, transparent 0 18px, rgba(196,22,28,.07) 18px 19px);
}
.styled-hero .sh-kicker{
  font-family:var(--bd-display);
  font-weight:700;
  letter-spacing:.14em;
  text-transform:uppercase;
  font-size:14px;
  color:var(--piping);
  margin:0 0 14px;
}
.styled-hero h3{
  font-family:var(--bd-display);
  font-weight:900;
  font-size:clamp(56px, 7vw, 112px);
  line-height:.8;
  letter-spacing:-.03em;
  text-transform:uppercase;
  margin:0 0 18px;
  color:var(--cream);
}
.styled-hero .sh-lede{
  font-family:var(--bd-text);
  font-size:17px;
  line-height:1.5;
  color:var(--pitwall);
  max-width:28em;
  margin:0 0 24px;
}
.sh-actions{display:flex;flex-wrap:wrap;gap:10px;align-items:center;}
.sh-btn{
  display:inline-block;
  font-family:var(--bd-display);
  font-weight:700;
  letter-spacing:.1em;
  text-transform:uppercase;
  font-size:14px;
  text-decoration:none;
  padding:12px 18px;
  border-radius:3px;
}
.sh-btn.primary{background:var(--piping);color:var(--cream);}
.sh-btn.ghost{background:transparent;color:var(--cream);border:1px solid rgba(245,242,236,.35);}
.sh-date{
  background:var(--cream);
  color:var(--panel);
  padding:14px 16px 16px;
  border-radius:6px;
  text-align:center;
  min-width:132px;
  box-shadow:0 12px 28px rgba(0,0,0,.35);
}
.sh-date .mo{
  font-family:var(--bd-display);
  font-weight:700;
  letter-spacing:.14em;
  text-transform:uppercase;
  font-size:12px;
  color:var(--piping);
  margin:0;
}
.sh-date .dy{
  font-family:var(--bd-display);
  font-weight:900;
  font-size:72px;
  line-height:.8;
  letter-spacing:-.04em;
  margin:4px 0 8px;
}
.sh-date .ev{
  font-family:var(--bd-text);
  font-size:11px;
  line-height:1.35;
  color:var(--inksoft);
  margin:0;
  max-width:10em;
}
.sh-caption{
  margin:10px 0 0;
  color:var(--muted);
  font-size:13px;
  font-style:italic;
}

/* Sources note */
.bd-note{
  margin:40px 0 0;
  color:var(--dim);
  font-size:13px;
  line-height:1.5;
  max-width:52em;
}

/* Index helper: mini palette dots */
.palette-dots{display:flex;gap:6px;margin:6px 0 2px;}
.palette-dots i{width:14px;height:14px;border-radius:50%;display:block;border:1px solid rgba(255,255,255,.15);}

/* Done card on the hub */
.soon-card.is-done{
  border-style:solid;
  border-color:rgba(255,255,255,.08);
  box-shadow:0 16px 40px rgba(0,0,0,.35);
}
.soon-card.is-done:hover{border-color:rgba(245,242,236,.2);}
.pill-dir{background:var(--cream);color:var(--bg);}

@media (max-width:1080px){
  .swatch-grid,.swatch-grid.neutrals{grid-template-columns:repeat(2,1fr);}
  .type-split,.wf-board{grid-template-columns:1fr;}
  .phone{margin:0;}
  .styled-hero .sh-inner{grid-template-columns:1fr;padding:28px 24px 28px;gap:24px;}
  .scale-row{grid-template-columns:110px 1fr;gap:12px;}
}
@media (max-width:720px){
  .swatch-grid,.swatch-grid.neutrals{grid-template-columns:1fr;}
  .bd-open h1{font-size:clamp(56px,18vw,80px);}
  .contrast-table,.contrast-table tbody,.contrast-table tr,.contrast-table td{display:block;width:100%;}
  .contrast-table th{display:none;}
  .contrast-table td{padding:8px 16px;border-top:0;}
  .contrast-table tr{border-top:1px solid var(--line);padding:8px 0;}
  .scale-row{grid-template-columns:1fr;gap:6px;padding:14px 16px;}
  .wf-programs,.wf-instructors{grid-template-columns:repeat(2,1fr);}
}
@media (prefers-reduced-motion:reduce){
  .soon-card.is-done:hover{transform:none;}
}

/* Logo Design */
.logo-group{margin:0 0 32px;}
.logo-group-head{
  display:flex;align-items:baseline;justify-content:space-between;gap:16px;flex-wrap:wrap;
  margin:0 0 14px;
}
.logo-group-head h3{
  font-family:var(--bd-display);
  font-weight:800;
  letter-spacing:.04em;
  text-transform:uppercase;
  font-size:22px;
  margin:0;
}
.logo-group-head .count{
  font-family:var(--bd-display);
  font-weight:600;
  letter-spacing:.1em;
  text-transform:uppercase;
  font-size:12px;
  color:var(--muted);
}
.logo-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:16px;
}
.logo-grid.cols-3{grid-template-columns:repeat(3,1fr);}
.logo-grid.cols-1{grid-template-columns:repeat(3,1fr);}
.logo-card{
  background:var(--card);
  border:1px solid rgba(255,255,255,.08);
  border-radius:var(--radius);
  overflow:hidden;
  display:flex;flex-direction:column;
  min-width:0;
  text-decoration:none;
  color:inherit;
  cursor:zoom-in;
  padding:0;
  font:inherit;
  text-align:left;
  width:100%;
  transition:transform .2s ease, border-color .2s ease;
}
.logo-card:hover{transform:translateY(-2px);border-color:rgba(245,242,236,.2);}
.logo-card .well{
  background:#141416;
  aspect-ratio:1/1;
  display:flex;align-items:center;justify-content:center;
  padding:14px;
}
.logo-card .well img{
  width:100%;height:100%;object-fit:contain;display:block;
}
.logo-card .meta{padding:12px 14px 14px;}
.logo-card .num-row{
  display:flex;align-items:center;justify-content:space-between;gap:8px;margin:0 0 6px;
}
.logo-card .cnum{
  font-family:var(--bd-display);
  font-weight:700;
  letter-spacing:.1em;
  text-transform:uppercase;
  font-size:12px;
  color:var(--muted);
}
.logo-tag{
  display:inline-block;
  font-family:var(--bd-display);
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
  font-size:10px;
  padding:3px 7px;
  border-radius:3px;
  white-space:nowrap;
}
.logo-tag.on{background:transparent;color:var(--lime);border:1px solid var(--lime);}
.logo-tag.off{background:transparent;color:var(--gold);border:1px solid var(--gold);}
.logo-card h4{
  font-family:var(--bd-display);
  font-weight:800;
  letter-spacing:.02em;
  text-transform:uppercase;
  font-size:16px;
  line-height:1.15;
  margin:0 0 6px;
}
.logo-card .cap{
  margin:0;
  color:var(--muted);
  font-size:12px;
  line-height:1.45;
}

/* Lightbox */
.logo-lb{
  position:fixed;inset:0;z-index:80;
  background:rgba(11,11,13,.96);
  display:flex;align-items:center;justify-content:center;
  padding:28px 72px 32px;
}
.logo-lb[hidden]{display:none;}
.logo-lb-stage{max-width:min(820px,92vw);max-height:92vh;display:flex;flex-direction:column;align-items:center;}
.logo-lb-stage img{
  max-width:min(820px,92vw);max-height:70vh;width:auto;height:auto;
  object-fit:contain;background:#141416;border-radius:10px;
}
.logo-lb-cap{margin-top:14px;max-width:640px;text-align:center;}
.logo-lb-cap .cnum{color:var(--muted);font-family:var(--bd-display);font-weight:700;letter-spacing:.1em;text-transform:uppercase;font-size:12px;}
.logo-lb-cap h2{font-family:var(--bd-display);font-weight:800;font-size:28px;letter-spacing:.02em;text-transform:uppercase;margin:4px 0 8px;}
.logo-lb-cap p{color:var(--muted);margin:0;font-size:15px;line-height:1.45;}
.logo-lb-close,.logo-lb-prev,.logo-lb-next{
  position:absolute;appearance:none;border:0;background:transparent;color:var(--cream);
  font-size:36px;line-height:1;cursor:pointer;padding:8px 12px;
}
.logo-lb-close{top:16px;right:20px;font-size:42px;}
.logo-lb-prev{left:12px;top:50%;transform:translateY(-50%);}
.logo-lb-next{right:12px;top:50%;transform:translateY(-50%);}
.logo-lb-close:hover,.logo-lb-prev:hover,.logo-lb-next:hover{color:#fff;}

@media (max-width:1080px){
  .logo-grid,.logo-grid.cols-3,.logo-grid.cols-1{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:720px){
  .logo-grid,.logo-grid.cols-3,.logo-grid.cols-1{grid-template-columns:1fr;}
  .logo-lb{padding:16px 16px 24px;}
  .logo-lb-prev,.logo-lb-next{top:auto;bottom:12px;transform:none;}
  .logo-lb-prev{left:16px;}
  .logo-lb-next{right:16px;}
}
@media (prefers-reduced-motion:reduce){
  .logo-card{transition:none;}
  .logo-card:hover{transform:none;}
}