/* Black Watch — "Select Your Track" hero: split copy + card→panel accordion with side tabs. */

.bwh{position:relative;min-height:100vh;display:flex;align-items:center;padding:clamp(86px,10vh,130px) clamp(20px,4vw,52px) 50px;overflow:hidden;isolation:isolate}
.bwh-vid{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;filter:grayscale(.4) brightness(.5) contrast(1.05)}
.bwh-ov{position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(8,8,6,.93),rgba(8,8,6,.72) 42%,rgba(8,8,6,.55))}
.bwh-wrap{position:relative;z-index:2;max-width:1500px;margin:0 auto;width:100%}
.bwh-split{display:flex;align-items:center;gap:clamp(28px,3.4vw,52px)}

.bwh-copy{flex:0 0 31%;max-width:430px}
.bwh-eyebrow{font-family:var(--display);text-transform:uppercase;letter-spacing:.3em;font-size:.6rem;color:var(--accent);font-weight:600;display:flex;align-items:center;gap:12px;margin-bottom:14px}
.bwh-eyebrow::before{content:"";width:26px;height:2px;background:var(--accent)}
.bwh-copy h1{font-family:var(--display);text-transform:uppercase;font-weight:700;line-height:.96;font-size:clamp(1.6rem,2.8vw,2.6rem);letter-spacing:.01em;color:var(--ink)}
.bwh-copy h1 .hl{color:var(--accent)}
.bwh-lead{color:#cfccc2;font-size:.84rem;line-height:1.6;margin-top:15px;max-width:380px}
.bwh-cta{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px}
.bwh-stats{display:flex;flex-wrap:wrap;gap:14px 30px;margin-top:28px}
.bwh-stats .stat .n{font-family:var(--display);font-size:1.65rem;line-height:1;color:var(--accent)}
.bwh-stats .stat .l{font-family:var(--display);text-transform:uppercase;letter-spacing:.12em;font-size:.55rem;color:var(--muted);margin-top:5px}

.bwh-right{flex:1;min-width:0}
.bwh-acc{position:relative;--cardh:min(70vh,560px);--openh:min(84vh,740px);height:var(--cardh);transition:height .45s cubic-bezier(.2,.7,.2,1)}

/* closed cards */
.bwh-cards{position:absolute;inset:0;display:flex;align-items:center;gap:10px;transition:opacity .3s,visibility .3s}
.bwh-card{position:relative;flex:1 1 0;min-width:54px;height:var(--cardh,min(70vh,560px));border-radius:5px;overflow:hidden;border:1px solid var(--line);cursor:pointer;transition:height .4s cubic-bezier(.2,.7,.2,1),border-color .3s,box-shadow .3s}
.bwh-card .bwh-img{position:absolute;inset:0;background-size:cover;z-index:0;filter:brightness(.82) contrast(1.05);transition:filter .4s}
.bwh-card .bwh-shade{position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(10,10,8,.1) 0%,rgba(10,10,8,0) 32%,rgba(8,8,6,.82) 80%,rgba(7,7,5,.96))}
.bwh-card .bwh-ic{position:absolute;left:0;right:0;bottom:66px;z-index:2;display:flex;justify-content:center}
.bwh-card .bwh-ic svg{width:32px;height:32px;color:var(--ink)}
.bwh-card .bwh-nm{position:absolute;left:8px;right:8px;bottom:24px;z-index:2;text-align:center;font-family:var(--display);text-transform:uppercase;font-weight:600;font-size:.9rem;letter-spacing:.1em;line-height:1.05;color:var(--ink)}
.bwh-card .bwh-rule{position:absolute;left:50%;transform:translateX(-50%);bottom:14px;z-index:2;height:3px;width:22px;background:var(--accent);opacity:0;transition:width .3s,opacity .3s}
.bwh-card:hover,.bwh-card:focus-visible{height:var(--openh,720px);z-index:6;border-color:var(--accent);box-shadow:0 26px 52px rgba(0,0,0,.55);outline:none}
.bwh-card:hover .bwh-rule,.bwh-card:focus-visible .bwh-rule{width:50px;opacity:1}
.bwh-card:hover .bwh-img,.bwh-card:focus-visible .bwh-img{filter:brightness(1.04)}

/* open stage */
.bwh-stage{display:none;gap:8px}
.bwh-acc.open{height:auto}
.bwh-acc.open .bwh-cards{display:none}
.bwh-acc.open .bwh-stage{display:flex}

.bwh-panel{flex:1;position:relative;display:flex;border-radius:6px;overflow:hidden;border:1px solid var(--accent);background:var(--panel,#100f0c);min-width:0}
.bwh-pimg{flex:0 0 34%;background-size:cover}
.bwh-pcontent{flex:1;display:flex;flex-direction:column;min-width:0}
.bwh-phead{padding:22px 30px 16px;border-bottom:1px solid var(--line);flex:none}
.bwh-tier{font-family:var(--display);text-transform:uppercase;letter-spacing:.22em;font-size:.64rem;color:var(--accent);margin-bottom:9px}
.bwh-phead h2{font-family:var(--display);text-transform:uppercase;font-size:1.85rem;letter-spacing:.02em;line-height:1;color:var(--ink)}
.bwh-tag{color:#cdcabf;font-size:.85rem;line-height:1.55;margin-top:11px;max-width:560px}
.bwh-facts{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}
.bwh-fact{font-family:var(--display);text-transform:uppercase;letter-spacing:.05em;font-size:.6rem;padding:6px 11px;border-radius:3px;border:1px solid var(--line);color:var(--muted)}
.bwh-fact b{color:var(--gold);font-weight:600}
.bwh-pmain{flex:1;display:flex;gap:28px;padding:22px 30px 26px}
.bwh-pcol{flex:1;min-width:0}
.bwh-side{flex:0 0 232px;border:1px solid var(--line);border-radius:8px;padding:20px;align-self:flex-start}
.bwh-mh{font-family:var(--display);text-transform:uppercase;letter-spacing:.18em;font-size:.63rem;color:var(--muted);margin:0 0 11px}
.bwh-overview p{color:#cdcabf;font-size:.87rem;line-height:1.58;margin-bottom:10px}
.bwh-curric{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:9px 24px;margin-top:4px}
.bwh-curric li{font-size:.85rem;color:var(--ink);padding-left:17px;position:relative;line-height:1.36}
.bwh-curric li::before{content:"\25B8";position:absolute;left:0;color:var(--accent)}
.bwh-srow{margin-bottom:13px}
.bwh-srow .bwh-sl{font-family:var(--display);text-transform:uppercase;letter-spacing:.14em;font-size:.57rem;color:var(--muted);margin-bottom:4px}
.bwh-srow .bwh-sv{font-size:.83rem;color:var(--ink);line-height:1.42}
.bwh-gear{list-style:none}
.bwh-gear li{font-size:.8rem;color:#cdcabf;padding-left:16px;position:relative;line-height:1.5}
.bwh-gear li::before{content:"\2713";position:absolute;left:0;color:var(--green-bright,#7e9079)}
.bwh-deep{display:block;text-align:center;margin-top:16px;font-family:var(--display);text-transform:uppercase;letter-spacing:.1em;font-size:.76rem;font-weight:600;padding:11px;border-radius:4px;background:transparent;border:1px solid var(--accent);color:var(--accent);text-decoration:none;transition:.2s}
.bwh-deep:hover{background:var(--accent-soft)}
.bwh-find{display:block;text-align:center;margin-top:10px;font-family:var(--display);text-transform:uppercase;letter-spacing:.1em;font-size:.76rem;font-weight:600;padding:12px;border-radius:4px;background:var(--accent);color:#15140f;text-decoration:none;transition:.2s}
.bwh-find:hover{background:var(--gold)}
.bwh-pclose{position:absolute;top:13px;right:13px;z-index:6;width:34px;height:34px;border-radius:4px;border:1px solid var(--line);background:rgba(0,0,0,.4);color:var(--ink);font-size:1.2rem;cursor:pointer;display:grid;place-items:center;transition:.2s}
.bwh-pclose:hover{border-color:var(--accent);color:var(--accent)}

/* right side-tab rail */
.bwh-rail{flex:0 0 52px;display:flex;flex-direction:column;gap:6px}
.bwh-tab{flex:1;position:relative;display:flex;align-items:center;justify-content:center;cursor:pointer;border:1px solid var(--line);border-radius:4px;background:rgba(16,15,12,.85);color:var(--muted);transition:.2s;overflow:hidden}
.bwh-tab .bwh-tnm{writing-mode:vertical-rl;transform:rotate(180deg);font-family:var(--display);text-transform:uppercase;letter-spacing:.14em;font-size:.6rem;line-height:1;white-space:nowrap}
.bwh-tab:hover{color:var(--ink);border-color:var(--accent)}
.bwh-tab.active{color:var(--gold);border-color:var(--accent);background:rgba(187,138,82,.08)}
.bwh-tab.active::before{content:"";position:absolute;left:-1px;top:12px;bottom:12px;width:3px;background:var(--accent);border-radius:0 2px 2px 0}

@media(max-width:1040px){
  .bwh-split{flex-direction:column;align-items:stretch;gap:30px}
  .bwh-copy{flex:none;max-width:none}
  .bwh-right{width:100%}
  .bwh-acc{height:auto}
  .bwh-cards{position:static;flex-wrap:wrap}
  .bwh-card{flex:1 1 30%;min-width:140px;height:44vw;max-height:320px}
  .bwh-card:hover,.bwh-card:focus-visible{height:44vw}
  .bwh-acc.open{height:auto}
  .bwh-acc.open .bwh-cards{display:none}
  .bwh-stage{position:static;flex-direction:column;transform:none}
  .bwh-panel{flex-direction:column}
  .bwh-pimg{flex:none;height:180px}
  .bwh-pmain{flex-direction:column;overflow:visible}
  .bwh-side{flex:none;margin-top:16px}
  .bwh-rail{flex-direction:row;flex:none;order:-1}
  .bwh-tab{padding:10px}
  .bwh-tab .bwh-tnm{writing-mode:horizontal-tb;transform:none}
  .bwh-tab.active::before{left:12px;right:12px;top:-1px;bottom:auto;width:auto;height:3px}
}
@media(max-width:600px){.bwh-card{flex:1 1 44%;height:58vw}.bwh-card:hover{height:58vw}}
