/* ============================================================
   ARTFORM SUB-PAGES — SHARED STYLES
   Aligned with /design.md (White canvas + Single orange #fe5000)
   ============================================================ */

/* ─── Tokens (mirrors styles.css) ─── */
:root{
  /* Surfaces */
  --bg:#ffffff;
  --paper:#f9f9f9;
  --paper-2:#f5f5f5;
  --paper-3:#efefef;
  --surface-cool:#f2f5f7;
  /* Ink ladder */
  --ink:#000000;
  --ink-2:#222222;
  --ink-strong:#424242;
  --muted:#666666;
  --tertiary:#5f5f5f;
  --placeholder:#9e9e9e;
  --disabled:#b5b5b5;
  --icon:#8f8f8f;
  --icon-subtle:#aaaaaa;
  /* Borders */
  --line:rgba(0,0,0,0.05);
  --line-2:#e4e4e4;
  --hairline:rgba(0,0,0,0.08);
  /* Accent — single orange */
  --accent:#fe5000;
  --accent-2:#fa8d6b;
  --accent-pressed:#fc9086;
  --accent-tint:#fdf0ec;
  --accent-tint-pale:#fcf3f2;
  --accent-3:#186ade;     /* rare info blue */
  /* Type */
  --serif:"esamanru","Pretendard",ui-sans-serif,system-ui,sans-serif;
  --sans:"Pretendard","Pretendard Variable",ui-sans-serif,system-ui,sans-serif;
  --display:"esamanru","Pretendard",ui-sans-serif,sans-serif;
  --mono:"Pretendard","Pretendard Variable",ui-sans-serif,system-ui,sans-serif;
  /* Legacy aliases kept for backward-compat with page-local CSS */
  --hi:#ffffff;
}

/* ─── Local fonts: esamanru (display) ─── */
@font-face{
  font-family:"esamanru";font-weight:300;font-style:normal;font-display:swap;
  src:url("../fonts/esamanru-Light.ttf") format("truetype");
}
@font-face{
  font-family:"esamanru";font-weight:500;font-style:normal;font-display:swap;
  src:url("../fonts/esamanru-Medium.ttf") format("truetype");
}
@font-face{
  font-family:"esamanru";font-weight:700;font-style:normal;font-display:swap;
  src:url("../fonts/esamanru-Bold.ttf") format("truetype");
}
@font-face{
  font-family:"esamanru";font-weight:800;font-style:normal;font-display:swap;
  src:url("../fonts/esamanru-Bold.ttf") format("truetype");
}
@font-face{
  font-family:"esamanru";font-weight:900;font-style:normal;font-display:swap;
  src:url("../fonts/esamanru-Bold.ttf") format("truetype");
}

/* ─── Reset ─── */
*{box-sizing:border-box;margin:0;padding:0;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
html,body{background:var(--bg);color:var(--ink-2);font-family:var(--sans);line-height:1.5}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit}
::selection{background:var(--accent);color:#fff}
body{min-width:1440px}
.wrap{max-width:1440px;margin:0 auto;padding:0 56px}
.wrap-wide{max-width:1600px;margin:0 auto;padding:0 40px}
/* 유틸바·헤더는 메인(index)과 동일한 1440 / 좌우 56px 폭으로 통일 */
.utility .wrap-wide,
header.site .wrap-wide{max-width:1440px;padding:0 56px;box-sizing:border-box}

/* ─── Display headlines: esamanru, no italic ─── */
h1,h2,h3,h4{font-family:var(--display);font-style:normal;color:var(--ink)}
.it{font-family:var(--display);font-style:normal;font-weight:400;color:var(--accent)}
.serif-it{font-family:var(--display);font-style:normal;font-weight:400}
/* Outline-stroke headlines → drop to subdued solid */
.out{-webkit-text-stroke:0 !important;color:var(--ink) !important;opacity:.22}

/* ─── Type primitives ─── */
.eyebrow{
  font-family:var(--sans);
  font-size:11px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--muted);font-weight:500;
  display:inline-flex;align-items:center;gap:12px;
}
.eyebrow::before{content:"";display:inline-block;width:24px;height:1px;background:currentColor}
.eyebrow .dot{display:none}      /* legacy dot suppressed */
.label{font-family:var(--sans);font-size:11px;letter-spacing:.16em;text-transform:uppercase;font-weight:500}

/* `<b>`/`<strong>` — no background highlights, just weight */
b,strong{background:none !important;color:var(--ink);font-weight:700}

/* ═══════════════════════════════════════
   UTILITY BAR
   ═══════════════════════════════════════ */
.utility{background:var(--paper-2);color:var(--ink-2);font-size:12px;border-bottom:1px solid var(--line-2)}
.utility .wrap-wide{display:flex;align-items:center;justify-content:space-between;height:34px}
.utility .left{display:flex;gap:24px;align-items:center;font-family:var(--sans);font-weight:500;letter-spacing:.04em}
.utility .ticker{flex:1;margin:0 0 0 32px;overflow:hidden;mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.utility .ticker-track{display:inline-flex;gap:48px;white-space:nowrap;animation:tick 38s linear infinite;font-family:var(--sans);font-weight:500;letter-spacing:.08em;color:var(--ink-2)}
.utility .ticker-track b{color:var(--accent);font-weight:700;margin-right:6px}
@keyframes tick{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.utility .right{display:flex;gap:18px;align-items:center;font-family:var(--sans);font-weight:500;letter-spacing:.04em}
.utility .right a{color:var(--ink-2);opacity:.85;transition:opacity .2s}
.utility .right a:hover{opacity:1;color:var(--accent)}
.utility .pill{background:var(--accent);color:#fff;padding:4px 10px;border-radius:4px;font-weight:600;letter-spacing:.04em}

/* ═══════════════════════════════════════
   HEADER
   ═══════════════════════════════════════ */
header.site{position:sticky;top:0;z-index:80;background:#fff;border-bottom:1px solid var(--line-2)}
header.site .row{display:grid;grid-template-columns:auto 1fr auto;align-items:center;height:88px;gap:24px}
header.site .logo{display:flex;align-items:baseline;gap:10px;flex-shrink:0;white-space:nowrap}
header.site .logo img{height:44px;width:auto;display:block;object-fit:contain}
header.site .logo .mark{font-family:var(--display);font-weight:900;font-size:30px;letter-spacing:-0.05em;color:var(--ink)}
header.site .logo .mark .o{display:inline-block;color:var(--accent);transform:translateY(2px)}
header.site .logo .kr{font-weight:800;font-size:18px;letter-spacing:-0.04em;color:var(--ink-2);border-left:1px solid var(--line-2);padding-left:10px;margin-left:4px}

nav.primary{display:flex;justify-content:center;gap:6px}
nav.primary .nav-item{position:relative}
nav.primary .nav-trigger{padding:14px 14px;font-size:14px;font-weight:500;letter-spacing:-0.02em;color:var(--ink);display:inline-flex;align-items:center;gap:6px;white-space:nowrap;line-height:1.2;position:relative}
nav.primary .nav-trigger::after{content:"";position:absolute;left:14px;right:14px;bottom:6px;height:4px;background:var(--accent);transform:scaleX(0);transform-origin:left;transition:transform .25s ease}
nav.primary .nav-item.is-current .nav-trigger::after,
nav.primary .nav-item:hover .nav-trigger::after{transform:scaleX(1)}
nav.primary .nav-trigger .en{font-family:var(--mono);font-weight:500;font-size:9px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}

header.site .end{display:flex;gap:10px;align-items:center}
header.site .end .ico-btn{width:40px;height:40px;border:1px solid var(--line-2);border-radius:8px;display:grid;place-items:center;color:var(--ink);transition:background .2s,color .2s,border-color .2s}
header.site .end .ico-btn:hover{background:var(--ink);color:#fff;border-color:var(--ink)}
header.site .end .cta{height:40px;padding:0 16px 0 18px;background:var(--ink);color:#fff;border-radius:999px;font-size:14px;font-weight:600;display:inline-flex;align-items:center;gap:10px;letter-spacing:-0.01em;transition:background .2s}
header.site .end .cta:hover{background:var(--accent)}
header.site .end .cta .arr{width:22px;height:22px;background:var(--accent);color:#fff;border-radius:9999px;display:grid;place-items:center;font-size:11px;font-weight:700;transition:background .2s,color .2s}
header.site .end .cta:hover .arr{background:#fff;color:var(--accent)}
header.site .end .cta:hover{color:#fff}

/* ═══════════════════════════════════════
   PAGE INTRO / BREADCRUMB
   ═══════════════════════════════════════ */
.page-intro{background:#fff;border-bottom:1px solid var(--line-2);padding:32px 0 0}
.page-intro .crumb{display:flex;gap:8px;align-items:center;font-family:var(--sans);font-weight:500;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.page-intro .crumb b{color:var(--ink);font-weight:700}

/* ═══════════════════════════════════════
   BUTTONS
   ═══════════════════════════════════════ */
.btn{display:inline-flex;align-items:center;gap:10px;height:46px;padding:0 22px;border-radius:8px;font-size:14px;font-weight:700;letter-spacing:-0.01em;transition:background .2s,color .2s,border-color .2s}
.btn-primary{background:var(--accent);color:#fff;border-radius:12px}
.btn-primary:hover{background:var(--ink)}
.btn-primary .arr{width:22px;height:22px;background:#fff;color:var(--accent);border-radius:9999px;display:grid;place-items:center;font-size:11px;font-weight:700;transition:background .2s,color .2s}
.btn-primary:hover .arr{background:var(--accent);color:#fff}
.btn-ghost{background:#fff;border:1px solid var(--line-2);color:var(--ink)}
.btn-ghost:hover{background:var(--ink);color:#fff;border-color:var(--ink)}

/* ═══════════════════════════════════════
   FOOTER (compact for subpages)
   ═══════════════════════════════════════ */
footer.site{background:var(--paper);color:var(--ink-2);padding:80px 0 36px;margin-top:0;border-top:1px solid var(--line-2)}
footer.site .cols{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr 1fr;gap:32px;padding-bottom:48px;border-bottom:1px solid var(--line-2)}
footer.site .col h5{font-family:var(--sans);font-weight:500;font-size:11px;letter-spacing:.14em;color:var(--accent);text-transform:uppercase;margin-bottom:18px}
footer.site .col ul{list-style:none;display:flex;flex-direction:column;gap:9px}
footer.site .col a{font-size:13px;color:var(--ink-2);transition:color .2s}
footer.site .col a:hover{color:var(--accent)}
footer.site .brand .mark img{height:48px;margin-bottom:18px}
footer.site .brand .mark{font-family:var(--display);font-weight:900;font-size:36px;letter-spacing:-0.05em;color:var(--ink);margin-bottom:14px}
footer.site .brand .mark .o{color:var(--accent)}
footer.site .brand p{font-size:13px;color:var(--muted);line-height:1.7;max-width:320px}
footer.site .brand .ph{margin-top:18px;font-family:var(--display);font-weight:900;color:var(--ink);font-size:28px;letter-spacing:-0.02em}
footer.site .brand .ph small{display:block;font-family:var(--sans);font-weight:600;font-size:11px;color:var(--accent);letter-spacing:.1em;text-transform:uppercase;margin-top:4px}
footer.site .meta{padding-top:32px;display:grid;grid-template-columns:1fr auto;gap:24px;font-family:var(--sans);font-weight:500;font-size:11px;letter-spacing:.04em;color:var(--muted);line-height:1.7}
footer.site .meta b{color:var(--ink) !important;font-weight:700}
footer.site .meta .legal{display:flex;gap:18px;align-items:flex-start}
footer.site .meta .legal a{color:var(--ink-2)}
footer.site .meta .legal a:hover{color:var(--accent)}

/* ═══════════════════════════════════════
   SECTION HELPERS
   ═══════════════════════════════════════ */
.sect{padding:120px 0;border-bottom:1px solid var(--line-2);background:#fff}
.sect-dark{background:var(--ink);color:#fff;border-bottom:none}
.sect-paper{background:var(--paper)}
.head-2col{display:grid;grid-template-columns:1.2fr 1fr;gap:48px;align-items:end;margin-bottom:64px}
.head-2col .lf .eyebrow{margin-bottom:24px}
.head-2col h2{font-family:var(--display);font-weight:900;letter-spacing:-0.04em;line-height:.95;font-size:88px;color:inherit;text-wrap:balance;word-break:keep-all}
.head-2col h2 .it{font-size:inherit;color:var(--accent);display:inline}
.head-2col .rt{font-size:15px;line-height:1.7;color:var(--ink-2);max-width:440px;justify-self:end;font-weight:500}
.sect-dark .head-2col .rt{color:rgba(255,255,255,.78)}
.sect-dark h2{color:#fff}
.sect-dark .eyebrow{color:var(--accent)}

/* ═══════════════════════════════════════
   PLACEHOLDER IMAGE — flat paper, monospace label
   (replaces warm khaki gradient)
   ═══════════════════════════════════════ */
.ph-img{
  background:var(--paper-2);
  position:relative;overflow:hidden;
  border:1px solid var(--line-2);
}
.ph-img::before{
  content:"";position:absolute;inset:0;
  background:repeating-linear-gradient(45deg,rgba(0,0,0,.02) 0 6px,transparent 6px 14px);
}
.ph-img .lbl{position:absolute;left:14px;bottom:12px;font-family:var(--sans);font-weight:500;font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);z-index:2}
.ph-img .ix{position:absolute;right:14px;top:12px;font-family:var(--display);font-weight:900;font-size:28px;color:var(--accent);z-index:2;letter-spacing:-0.02em}

/* ═══════════════════════════════════════════════════════════
   CALM PASS — page-local overrides
   Neutralizes warm-paper / Archivo aesthetic across subpages
   without touching each page's local <style> block.
   ═══════════════════════════════════════════════════════════ */

/* 1) Strip ALL khaki/cream gradient placeholders → flat paper */
.ab-frame .stage,
.cp-hero .collage .tile,
.cp-card .stage,
.mp-grid .tcard .portrait,
.mp-dir .who .pt,
.ab-dir .portrait,
[class*="portrait"]:not(header .portrait),
[style*="linear-gradient(135deg,#cec3a9"],
[style*="linear-gradient(135deg,#3a3328"]{
  /* tiles keep their geometry, but no warm gradients */
}
.cp-hero .collage .tile,
.cp-card .stage,
.ab-frame .stage{
  background:var(--paper-2) !important;
  border:1px solid var(--line-2);
}
.cp-hero .collage .tile::after,
.cp-card .stage::after,
.ab-frame .stage::after{
  background:repeating-linear-gradient(45deg,rgba(0,0,0,.025) 0 6px,transparent 6px 14px) !important;
}
.cp-hero .collage .tile.t1,
.cp-hero .collage .tile.t2,
.cp-hero .collage .tile.t3,
.cp-hero .collage .tile.t4,
.cp-hero .collage .tile.t5,
.cp-hero .collage .tile.t6,
.cp-hero .collage .tile.t7{background:var(--paper-2) !important}
.cp-hero .collage .tile .lbl,
.cp-hero .collage .tile .lbl b,
.cp-card .stage .ph-lbl,
.cp-card .stage .ph-lbl b{color:var(--ink) !important}
.cp-hero .collage .tile .pin,
.cp-card .stage .stamp{background:var(--accent) !important;color:#fff !important;border-radius:8px !important}
.cp-card .stage .stamp::before{background:#fff !important}
.cp-card .stage .ix-big{color:rgba(0,0,0,.06) !important}
.cp-card .stage .nav .nd{background:#fff !important;color:var(--ink) !important;border:1px solid var(--line-2);border-radius:9999px !important}
.cp-card .stage .nav .nd.is-on{background:var(--ink) !important;color:#fff !important;border-color:var(--ink)}
.cp-card .stage .mini-map{background:#fff !important;border-color:var(--line-2) !important;border-radius:8px !important;box-shadow:0 4px 12px rgba(0,0,0,.06) !important}

/* ph-img tiles inside the manpower portrait area */
.mp-grid .tcard .portrait,
.ab-dir .portrait,
.mp-dir .who .pt{
  background:var(--paper-2) !important;
  border:1px solid var(--line-2);
}
.mp-grid .tcard .portrait::after,
.ab-dir .portrait::after,
.mp-dir .who .pt::after{
  background:repeating-linear-gradient(45deg,rgba(0,0,0,.025) 0 6px,transparent 6px 14px) !important;
}
.ab-dir .portrait .nm{color:var(--ink) !important}
.ab-dir .portrait .nm small{color:var(--accent) !important}
.ab-dir .portrait .stamp,
.mp-grid .tcard .portrait .role{background:var(--accent) !important;color:#fff !important;border-radius:8px !important}
.mp-grid .tcard .portrait .role.acc{background:var(--ink) !important}

/* 2) Hero monstro-type — keep emotion, reduce shoutiness */
.ab-hero h1,.cp-hero h1,.mp-hero h1{
  font-family:var(--display) !important;
  font-size:128px !important;
  line-height:.92 !important;
  letter-spacing:-0.045em !important;
  color:var(--ink) !important;
  text-wrap:balance;word-break:keep-all;
}
.ab-hero h1 .it,.cp-hero h1 .it,.mp-hero h1 .it,
.ab-hero h1 .num,.cp-hero h1 .num,.mp-hero h1 .num{
  font-family:var(--display) !important;font-style:normal !important;
  font-size:inherit !important;color:var(--accent) !important;
  letter-spacing:-0.04em !important;display:inline;transform:none !important;
}

/* Manifesto / director / timeline / sub headlines */
.ab-mani .rt h2,.ab-time .head h2,.ab-dir .letter h2,
.ab-group .head h2,.cp-card .top h2,
.mp-dir .letter h2,.mp-prin .head h2,.mp-dir-idx .head h2,
.head-2col h2{
  font-family:var(--display) !important;font-style:normal !important;
  letter-spacing:-0.04em !important;
}
.ab-mani .rt h2{font-size:56px !important;line-height:1.02 !important}
.ab-time .head h2{font-size:72px !important;line-height:1 !important}
.ab-dir .letter h2{font-size:48px !important;line-height:1.05 !important}
.ab-group .head h2,.cp-card .top h2{font-size:72px !important;line-height:1 !important}
.mp-dir .letter h2{font-size:44px !important;line-height:1.08 !important}
.mp-prin .head h2{font-size:64px !important;line-height:1 !important}
.mp-dir-idx .head h2{font-size:60px !important;line-height:1.02 !important}

/* `.it` inline equality — no separate giant size */
.ab-mani .rt h2 .it,.ab-time .head h2 .it,.ab-dir .letter h2 .it,
.ab-group .head h2 .it,.cp-card .top h2 .it,
.mp-dir .letter h2 .it,.mp-prin .head h2 .it,.mp-dir-idx .head h2 .it,
.ab-hero .belt .b .v small,
.cp-card .top h2 .en{
  font-size:inherit !important;
  font-family:var(--display) !important;font-style:normal !important;
  color:var(--accent) !important;
  display:inline !important;
  margin:0 !important;
  letter-spacing:-0.02em !important;
}
/* campus EN label keeps muted color (it's a sub-label not an emphasis word) */
.cp-card .top h2 .en{color:var(--muted) !important;font-size:24px !important;display:block !important;margin-top:14px !important;font-weight:500 !important;letter-spacing:.06em !important}

/* Numbers / italic display micro-elements throughout subpages */
.ab-hero .belt .b .v,
.cp-hero h1 .num,
.cp-card .top .ix,
.mp-hero .sub .nums .b .v,
.mp-grid .tcard .yrs,
.mp-prin .triad .cell .ix,
.ab-mani .lf .num,
.ab-time .row-tl .item .yr,
.ab-dir .letter .sig .ssign{
  font-family:var(--display) !important;font-style:normal !important;
  letter-spacing:-0.03em !important;
}
.ab-dir .letter .sig .ssign{font-size:36px !important;color:var(--accent) !important}

/* 3) Calm warm-paper sections → white / light grey */
.ab-time,
.cp-list,.cp-card,
.mp-dir,.mp-dir-idx{background:#fff !important}
.ab-time{background:var(--paper) !important;border-top-color:var(--line-2) !important;border-bottom-color:var(--line-2) !important}
.ab-time .row-tl .item .dot{border-color:var(--paper) !important;background:var(--accent) !important}

/* Dark sections — keep dark but tone glow + accent */
.ab-group,.mp-prin{background:var(--ink) !important;color:#fff !important}
.ab-group::before,.mp-prin::before{
  background:radial-gradient(900px 480px at 88% -10%,rgba(254,80,0,.16),transparent 60%) !important;
}
.ab-group .head .eyebrow,.mp-prin .head .eyebrow{color:var(--accent) !important;opacity:1}
.ab-group .head .eyebrow::before,.mp-prin .head .eyebrow::before{background:var(--accent)}
.ab-group .head h2 .it,.mp-prin .head h2 .it{color:var(--accent) !important}
.ab-group .head .rt,.mp-prin .head .rt{color:rgba(255,255,255,.7) !important}
.ab-group .head .rt b,.mp-prin .head .rt b{color:#fff !important}
.mp-prin .triad{background:rgba(255,255,255,.08) !important}
.mp-prin .triad .cell h3{color:#fff !important}
.mp-prin .triad .cell h3 .it{color:var(--accent) !important;font-family:var(--display) !important;font-style:normal !important;font-size:inherit !important}
.mp-prin .triad .cell p{color:rgba(255,255,255,.75) !important}
.mp-prin .triad .cell p b{color:#fff !important}
.mp-prin .triad .cell ul li{color:rgba(255,255,255,.78) !important}
.mp-prin .triad .cell ul li::before{content:"" !important;display:inline-block;width:5px;height:5px;background:var(--accent);border-radius:0;transform:rotate(45deg);margin-top:6px}

/* Director letter — kill orange left-border tip, use hairline */
.mp-dir .letter{border-left:none !important;padding-left:0 !important}
.mp-dir .letter .lq{display:none !important}
.mp-dir .letter::before{
  content:"";display:block;width:48px;height:2px;background:var(--accent);margin-bottom:20px;
}
.ab-dir .letter .body p:first-letter{
  font-family:var(--display) !important;font-style:normal !important;
  font-size:48px !important;color:var(--accent) !important;
  line-height:.9 !important;margin-right:6px;margin-top:4px;
}

/* About frame quote — flat dark with no orange stripe overlay */
.ab-frame .stage{background:var(--ink) !important;border:none !important}
.ab-frame .stage::after{background:repeating-linear-gradient(45deg,rgba(255,255,255,.025) 0 14px,transparent 14px 32px) !important}
.ab-frame .stage .stamp{color:var(--accent) !important}
.ab-frame .stage .stamp::before{display:none !important}
.ab-frame .stage .stamp{display:inline-flex;align-items:center;gap:10px}
.ab-frame .stage .stamp b{color:#fff !important}
.ab-frame .stage .quote .lq{color:var(--accent) !important}
.ab-frame .stage .quote p em{
  font-family:var(--display) !important;font-style:normal !important;
  color:var(--accent) !important;font-size:inherit !important;
}

/* 4) Pills / chips / round things → 8px sqaures, except CTAs (12px) */
.utility .pill,
.cp-card .top .rt .pill,
.cp-card .info .tracks .chip,
.cp-net .quick,
.mp-filters .chip,
.ab-time .row-tl .item .dot,
.cp-card .stage .stamp,
.mp-grid .tcard .portrait .role,
.ab-dir .portrait .stamp{
  border-radius:8px !important;
}
.cp-card .info .tracks .chip{background:#fff !important;border:1px solid var(--line-2) !important;color:var(--ink) !important}
.cp-card .info .tracks .chip.acc{background:var(--accent) !important;color:#fff !important;border-color:var(--accent) !important}
.mp-filters .chip{background:#fff !important;border:1px solid var(--line-2) !important;color:var(--ink) !important}
.mp-filters .chip.is-active{background:var(--ink) !important;color:#fff !important;border-color:var(--ink) !important}
.mp-filters .chip .ct{color:var(--muted) !important}
.mp-filters .chip.is-active .ct{color:var(--accent) !important}

/* hero belt for about — divider style */
.ab-hero .belt{border-top-color:var(--ink) !important;border-bottom-color:var(--ink) !important}
.ab-hero .belt .b{border-right-color:var(--line-2) !important}
.ab-hero .belt .b .v .ac{color:var(--accent) !important}
.ab-hero .belt .b .v small{color:var(--muted) !important}

/* network bar */
.cp-net{border-top-color:var(--ink) !important;border-bottom-color:var(--ink) !important}
.cp-net .quick a{border-right-color:var(--line-2) !important;color:var(--ink) !important}
.cp-net .quick a:hover{background:var(--ink) !important;color:#fff !important}
.cp-net .quick a .n{color:var(--accent) !important;font-family:var(--display) !important;font-style:normal !important}

/* meta strip / sort bars */
.mp-hero .meta-strip,.mp-sort{border-top-color:var(--ink) !important;border-bottom-color:var(--line-2) !important}

/* tcard hover background — light paper, not warm */
.mp-grid{background:var(--line-2) !important}
.mp-grid .tcard{background:#fff !important}
.mp-grid .tcard:hover{background:var(--paper-2) !important}
.mp-grid .tcard .info .nm .k{color:var(--ink) !important}
.mp-grid .tcard .info .uni b{color:var(--accent) !important}
.mp-grid .tcard .info .campus span{background:var(--paper-2) !important;color:var(--ink) !important;border-radius:8px !important}
.mp-grid .tcard .stats .s .k{color:var(--muted) !important}

/* 5) Stat panels / info rows — neutral paper, hairlines */
.cp-card .info .stat-row{border-top-color:var(--ink) !important}
.cp-card .info .stat-row .st{background:var(--paper-2) !important;border-right-color:var(--line-2) !important;border-bottom-color:var(--line-2) !important}
.cp-card .info .stat-row .st .v{color:var(--ink) !important;font-family:var(--display) !important;font-style:normal !important}
.cp-card .info .stat-row .st .v.ac{color:var(--accent) !important}
.cp-card .info .stat-row .st .v small{color:var(--muted) !important}
.cp-card .info .stat-row .st .k{color:var(--muted) !important;font-family:var(--sans) !important;font-weight:500 !important}
.cp-card .info .tracks h6,
.cp-card .info .schedule h6{font-family:var(--sans) !important;font-weight:500 !important;color:var(--muted) !important}
.cp-card .info .schedule .h,.cp-card .info .schedule .t{font-family:var(--sans) !important;font-weight:500 !important}

/* 6) Manifesto pillar `<b>` highlight — no yellow underline */
.ab-mani .rt .lede b{background:none !important;color:var(--ink) !important;font-weight:800}

/* 7) Group chart in about — calmer */
.ab-group .chart .center .core{background:rgba(255,255,255,.06) !important;border-color:rgba(255,255,255,.4) !important;border-radius:8px !important}
.ab-group .chart .center .core .l{color:var(--accent) !important}
.ab-group .chart .center .core h3{font-family:var(--display) !important;font-style:normal !important;color:#fff !important}
.ab-group .chart .center .core small{color:rgba(255,255,255,.7) !important}
.ab-group .chart .b::after{background:var(--accent) !important;border-radius:9999px}

/* 8) Sort active tab */
.mp-sort .right a.is-on{color:var(--accent) !important;border-bottom-color:var(--accent) !important}

/* 9) Director sig — sans, not serif italic */
.ab-dir .letter .sig .who small{font-family:var(--sans) !important;font-weight:500 !important;letter-spacing:.1em !important}

/* 10) Hero collage pin labels readability */
.cp-hero .collage .tile .pin{
  width:36px;height:36px;display:grid;place-items:center;
  font-family:var(--display) !important;font-style:normal !important;font-weight:900 !important;font-size:16px !important;
  box-shadow:0 6px 16px -4px rgba(254,80,0,.35) !important;
}

/* 11) Faculty mini-cards inside campus */
.cp-card .faculty .fc{background:#fff !important;border:1px solid var(--line-2) !important;border-radius:8px !important}
.cp-card .faculty h6,
.cp-card .faculty h6 .all{font-family:var(--sans) !important;font-weight:500 !important}
.cp-card .faculty h6 .all{color:var(--ink) !important;border-bottom-color:var(--ink) !important}

/* 12) Reveal */
.reveal{opacity:0;transform:translateY(16px);transition:opacity .6s ease,transform .6s ease}
.reveal.is-visible{opacity:1;transform:none}

/* 13) Director letter eyebrow above */
.ab-dir .letter .eyebrow{color:var(--muted) !important;opacity:1}
.ab-dir .letter .eyebrow .dot{display:none !important}
.ab-dir .letter .eyebrow::before{content:"";display:inline-block;width:24px;height:1px;background:currentColor}

/* 14) About timeline accents */
.ab-time .row-tl .item .yr{color:var(--ink) !important}
.ab-time .row-tl .item.acc .yr{color:var(--accent) !important}
.ab-time .row-tl .item.acc .dot{background:var(--ink) !important}

/* 15) Selection */
::selection{background:var(--accent);color:#fff}

/* ═══════════════════════════════════════════════════════════
   MEGAMENU  (injected by pages/nav-menu.js)
   - 펼침/정렬/호버 동작은 index.html 과 동일하게 맞춤
   ═══════════════════════════════════════════════════════════ */
/* nav.primary 를 기준점으로 — 메가메뉴가 헤더 폭 기준 중앙정렬 */
nav.primary{position:relative;z-index:5}
nav.primary .nav-item{position:static}
.megamenu{
  position:absolute;left:50%;top:100%;transform:translateX(-50%);
  width:min(1280px,calc(100vw - 80px));
  background:#fff;border:1px solid var(--line-2);border-top:none;
  box-shadow:0 12px 24px rgba(0,0,0,.06);
  padding:36px 40px 28px;
  opacity:0;pointer-events:none;transition:opacity .15s ease;
  display:grid;grid-template-columns:280px 1fr 320px;gap:48px;
  z-index:100;
}
/* hover bridge — 트리거와 박스 사이의 빈 공간에서 마우스가 끊기지 않도록 */
.megamenu::before{
  content:"";position:absolute;left:0;right:0;top:-16px;height:16px;background:transparent;
}
nav.primary .nav-item:hover .megamenu,
nav.primary .nav-item.open .megamenu,
.megamenu:hover{opacity:1;pointer-events:auto}

.megamenu .lf{min-width:0}
.megamenu .mm-title{
  font-family:var(--display);font-weight:900;
  font-size:48px;line-height:.95;letter-spacing:-0.04em;color:var(--ink);
  text-wrap:balance;word-break:keep-all;word-break:keep-all;
}
.megamenu .mm-title .it{
  font-family:var(--display);font-style:normal;font-weight:400;
  color:var(--accent);font-size:inherit;display:inline;letter-spacing:-0.02em;
}
.megamenu .mm-desc{
  margin-top:14px;font-size:13px;line-height:1.55;color:var(--muted);max-width:240px;
  word-break:keep-all;
}

.megamenu .mm-list{
  display:grid;grid-template-columns:1fr 1fr;gap:6px 40px;align-content:start;
  border-left:1px solid var(--line-2);padding-left:36px;
}
.megamenu .mm-link{
  display:flex;align-items:baseline;gap:10px;
  padding:14px 8px;border-bottom:1px solid var(--line-2);
  transition:padding .2s ease,color .2s ease;
}
.megamenu .mm-link:hover{padding-left:16px;color:var(--accent)}
.megamenu .mm-link .nm{font-size:18px;font-weight:700;letter-spacing:-0.02em;flex:1;min-width:0;color:var(--ink);white-space:nowrap}
.megamenu .mm-link:hover .nm{color:var(--accent)}
.megamenu .mm-link .ko{font-size:12px;color:var(--muted);font-family:var(--mono);font-weight:500;letter-spacing:.08em}
.megamenu .mm-link .arr{font-size:14px;opacity:.4;transition:transform .2s,opacity .2s}
.megamenu .mm-link:hover .arr{transform:translateX(4px);opacity:1;color:var(--accent)}

.megamenu .mm-feature{
  background:var(--ink);color:#fff;border-radius:8px;
  padding:22px;display:flex;flex-direction:column;gap:12px;
  position:relative;overflow:hidden;
}
.megamenu .mm-feature .tag{
  font-family:var(--sans);font-weight:500;font-size:10px;
  letter-spacing:.18em;color:var(--accent);text-transform:uppercase;
}
.megamenu .mm-feature h4{
  font-family:var(--display);font-weight:900;font-size:22px;
  letter-spacing:-0.03em;line-height:1.15;color:#fff;text-wrap:balance;word-break:keep-all;
}
.megamenu .mm-feature p{
  font-size:12px;color:rgba(255,255,255,.7);line-height:1.55;
}
.megamenu .mm-feature .go{
  margin-top:auto;display:inline-flex;align-items:center;gap:8px;
  font-size:13px;font-weight:600;color:#fff;
}
.megamenu .mm-feature .go::after{content:"→"}
.megamenu .mm-feature .go:hover{color:var(--accent)}


/* anchor-scroll offset (sticky 88px header) */
html{scroll-behavior:smooth}
section[id],[id]:target{scroll-margin-top:104px}


/* unified page header (.pg-head) */
.pg-head{padding:60px 0 44px}
.pg-head .crumb{display:flex;gap:8px;align-items:center;font-family:var(--sans);font-weight:500;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-bottom:34px}
.pg-head .crumb b{color:var(--ink);font-weight:700}
.pg-head .crumb .sep{opacity:.4}
.pg-head .row{display:grid;grid-template-columns:1.5fr 1fr;gap:56px;align-items:end;padding-bottom:42px;border-bottom:1px solid var(--ink)}
.pg-head .row .lf .eyebrow{margin-bottom:24px}
.pg-head h1{font-family:var(--display);font-weight:900;font-size:80px;line-height:.93;letter-spacing:-0.05em;color:var(--ink);text-wrap:balance;word-break:keep-all}
.pg-head h1 .it{color:var(--accent);display:inline}
.pg-head .row .rt{justify-self:end;max-width:440px}
.pg-head .row .rt p{font-size:15px;line-height:1.7;color:var(--ink-2);font-weight:500}
.pg-head .row .rt p b{color:var(--ink);font-weight:700}
.pg-head .stats{display:flex;gap:34px;margin-top:26px}
.pg-head .stats .s{display:flex;flex-direction:column;gap:5px}
.pg-head .stats .s .v{font-family:var(--display);font-weight:900;font-size:40px;line-height:1;letter-spacing:-0.04em;color:var(--ink)}
.pg-head .stats .s .v.ac{color:var(--accent)}
.pg-head .stats .s .k{font-family:var(--sans);font-weight:500;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}

/* ═══════════════════════════════════════
   SHARED CONSULT BAND + CROSS-LINKS (site-chrome.js 주입)
   ═══════════════════════════════════════ */
.consult-band{background:var(--ink);color:#fff}
.consult-band .wrap{padding:84px 56px 70px}
.cb-top{display:grid;grid-template-columns:1.35fr 1fr;gap:56px;align-items:end;padding-bottom:46px;border-bottom:1px solid rgba(255,255,255,.16)}
.cb-eyebrow{font-family:var(--sans);font-weight:700;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--accent-2);margin-bottom:20px}
.cb-top h2{font-family:var(--display);font-weight:900;font-size:60px;line-height:.98;letter-spacing:-0.04em;color:#fff;text-wrap:balance;word-break:keep-all}
.cb-top h2 .ac{color:var(--accent);display:inline}
.cb-top .cb-phone{margin-top:24px;display:flex;align-items:baseline;gap:14px}
.cb-top .cb-phone .num{font-family:var(--display);font-weight:900;font-size:30px;letter-spacing:-0.03em;color:#fff}
.cb-top .cb-phone .lbl{font-family:var(--sans);font-weight:500;font-size:12px;letter-spacing:.06em;color:rgba(255,255,255,.55)}
.cb-actions{display:flex;flex-direction:column;gap:12px;justify-self:end;width:100%;max-width:400px}
.cb-btn{height:64px;border-radius:12px;display:flex;align-items:center;justify-content:space-between;padding:0 26px;font-family:var(--sans);font-weight:700;font-size:16px;letter-spacing:-0.01em;transition:background .2s,color .2s,border-color .2s}
.cb-btn .arr{width:34px;height:34px;border-radius:9999px;display:grid;place-items:center;font-size:15px;transition:transform .2s}
.cb-btn:hover .arr{transform:translateX(3px)}
.cb-btn.primary{background:var(--accent);color:#fff}
.cb-btn.primary .arr{background:#fff;color:var(--accent)}
.cb-btn.primary:hover{background:#fff;color:var(--ink)}
.cb-btn.ghost{background:transparent;border:1px solid rgba(255,255,255,.3);color:#fff}
.cb-btn.ghost .arr{background:rgba(255,255,255,.14);color:#fff}
.cb-btn.ghost:hover{border-color:#fff;background:rgba(255,255,255,.06)}
/* 이어보기 교차링크 */
.cb-related{padding-top:34px}
.cb-related .lbl{font-family:var(--sans);font-weight:500;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.45);margin-bottom:18px}
.cb-related .grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.cb-rel{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:22px 24px;border:1px solid rgba(255,255,255,.16);border-radius:12px;transition:background .2s,border-color .2s}
.cb-rel:hover{background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.4)}
.cb-rel .tx .k{display:block;font-family:var(--sans);font-weight:500;font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--accent-2);margin-bottom:10px}
.cb-rel .tx .t{font-family:var(--display);font-weight:900;font-size:19px;letter-spacing:-0.025em;color:#fff;line-height:1.15}
.cb-rel .go{flex-shrink:0;width:38px;height:38px;border-radius:9999px;background:rgba(255,255,255,.1);display:grid;place-items:center;font-size:16px;color:#fff;transition:background .2s,color .2s,transform .2s}
.cb-rel:hover .go{background:var(--accent);color:#fff;transform:translateX(3px)}

/* ═══════════════════════════════════════════════════════════
   LEGAL / DOCUMENT PAGES  (privacy.html · terms.html)
   흰 캔버스 · 좌측 sticky 목차 + 우측 조문 · 하드 헤어라인
   ═══════════════════════════════════════════════════════════ */
.lg-body{padding:8px 0 132px;background:var(--bg)}
.lg-grid{display:grid;grid-template-columns:260px 1fr;gap:80px;align-items:start}

/* 좌측 sticky 목차 */
.lg-toc{position:sticky;top:120px}
.lg-toc .eyebrow{margin-bottom:22px}
.lg-toc ol{list-style:none;counter-reset:toc;display:flex;flex-direction:column;border-top:1px solid var(--line-2)}
.lg-toc ol li{counter-increment:toc;border-bottom:1px solid var(--line-2)}
.lg-toc ol li a{display:grid;grid-template-columns:30px 1fr;gap:10px;align-items:baseline;padding:13px 4px 13px 0;font-family:var(--sans);font-weight:600;font-size:13.5px;letter-spacing:-0.01em;color:var(--ink-2);transition:color .18s}
.lg-toc ol li a::before{content:counter(toc,decimal-leading-zero);font-family:var(--sans);font-weight:700;font-size:11px;letter-spacing:.06em;color:var(--muted);transition:color .18s}
.lg-toc ol li a:hover{color:var(--accent)}
.lg-toc ol li a:hover::before{color:var(--accent)}
.lg-toc .effect{margin-top:26px;padding:18px 0 0;border-top:1px solid var(--ink);font-family:var(--sans);font-weight:500;font-size:11px;letter-spacing:.04em;line-height:1.7;color:var(--muted)}
.lg-toc .effect b{display:block;color:var(--ink);font-weight:700;font-size:12px;letter-spacing:.02em;margin-bottom:3px}

/* 우측 조문 */
.lg-doc{max-width:760px}
.lg-intro{font-size:16px;line-height:1.85;color:var(--ink-2);font-weight:500;padding-bottom:40px;margin-bottom:8px;border-bottom:1px solid var(--line-2)}
.lg-intro b{color:var(--ink);font-weight:700}
.lg-art{padding:46px 0;border-bottom:1px solid var(--line-2);scroll-margin-top:120px}
.lg-art:last-child{border-bottom:none}
.lg-art .num{font-family:var(--sans);font-weight:700;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--accent);margin-bottom:14px}
.lg-art h2{font-family:var(--display);font-weight:900;font-size:30px;line-height:1.15;letter-spacing:-0.035em;color:var(--ink);margin-bottom:22px;text-wrap:balance;word-break:keep-all}
.lg-art p{font-size:15px;line-height:1.85;color:var(--ink-2);font-weight:500;margin-bottom:14px;text-wrap:pretty}
.lg-art p b{color:var(--ink);font-weight:700}
.lg-art a{color:var(--accent);text-decoration:underline;text-underline-offset:2px}
.lg-art ul{list-style:none;display:flex;flex-direction:column;gap:11px;margin:6px 0 18px}
.lg-art ul li{position:relative;padding-left:20px;font-size:15px;line-height:1.7;color:var(--ink-2);font-weight:500}
.lg-art ul li::before{content:"";position:absolute;left:2px;top:11px;width:5px;height:5px;background:var(--accent);transform:rotate(45deg)}
.lg-art ul li b{color:var(--ink);font-weight:700}

/* 데이터 표 (1px gap 그리드) */
.lg-table{margin:6px 0 18px;border:1px solid var(--line-2);font-size:13.5px}
.lg-table .tr{display:grid;grid-template-columns:200px 1fr;border-bottom:1px solid var(--line-2)}
.lg-table .tr:last-child{border-bottom:none}
.lg-table .tr .th{padding:14px 18px;background:var(--paper-2);font-family:var(--sans);font-weight:700;color:var(--ink);letter-spacing:-0.01em;border-right:1px solid var(--line-2)}
.lg-table .tr .td{padding:14px 18px;color:var(--ink-2);font-weight:500;line-height:1.65}
.lg-table .tr .td b{color:var(--ink);font-weight:700}

/* 강조 콜아웃 (변경 고지 등) — 좌측 컬러보더 금지(Don'ts), 톤 배경만 */
.lg-note{margin:18px 0 6px;padding:20px 22px;background:var(--accent-tint);border:1px solid var(--line-2);font-size:14px;line-height:1.75;color:var(--ink-2);font-weight:500}
.lg-note b{color:var(--ink);font-weight:700}