:root{
  /* ---- base ---- */
  --ivory:#FBF4E7;
  --ivory-deep:#F5EBDA;
  --card:#FFFDF8;
  --ink:#1A2340;
  --body:#4A4438;
  --muted:#6E685B;
  --line: rgba(26,35,64,0.08);

  /* ---- brand gradient (from KAIPEX mark) ---- */
  --brand-blue:#2451F2;
  --brand-violet:#8B5CF6;
  --brand-teal:#17C3A2;
  --brand-grad: linear-gradient(100deg, var(--brand-blue) 0%, var(--brand-violet) 52%, var(--brand-teal) 100%);

  /* ---- pastels, mixed by section ---- */
  --p-peach:#FFE3C7;
  --p-peach-ink:#B5602A;
  --p-mint:#CDF3E3;
  --p-mint-ink:#1C8C6E;
  --p-lav:#E8DCFB;
  --p-lav-ink:#6A45C9;
  --p-sky:#D6E8FC;
  --p-sky-ink:#2A5FA8;
  --p-butter:#FCEFC0;
  --p-butter-ink:#9C7A12;

  /* ---- section wash tints (lighter than chip pastels, for full-section backgrounds) ---- */
  --wash-sky:#EFF6FE;
  --wash-mint:#EDFBF5;
  --wash-lav:#F5F0FE;
  --wash-peach:#FFF3E9;
  --wash-butter:#FFFAEA;

  --radius-lg: 28px;
  --radius-md: 18px;
  --radius-sm: 12px;
  --shadow-soft: 0 10px 30px rgba(26,35,64,0.06);
  --shadow-lift: 0 20px 45px rgba(26,35,64,0.12);
  --ease: cubic-bezier(.22,.9,.32,1);
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--ivory);
  color:var(--body);
  font-family:'Pretendard Variable','Pretendard',-apple-system,BlinkMacSystemFont,sans-serif;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
.mono{font-family:'JetBrains Mono','Pretendard Variable',monospace;}
h1,h2,h3,h4{color:var(--ink); margin:0; letter-spacing:-0.02em; word-break:keep-all;}
p{margin:0; word-break:keep-all;}
a{color:inherit; text-decoration:none;}
img{max-width:100%; display:block;}
.wrap{max-width:1180px; margin:0 auto; padding:0 28px;}

::selection{background:var(--p-lav); color:var(--ink);}

a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible{
  outline:3px solid var(--brand-violet); outline-offset:3px; border-radius:6px;
}

/* ---------- page loader ---------- */
.page-loader{
  position:fixed; inset:0; z-index:99999; background:var(--ivory);
  display:flex; align-items:center; justify-content:center;
  transition:opacity .5s var(--ease), visibility .5s var(--ease);
  animation:loaderFailsafe .6s var(--ease) 4s forwards;
}
@keyframes loaderFailsafe{ to{ opacity:0; visibility:hidden; pointer-events:none; } }
.page-loader.loaded{ opacity:0; visibility:hidden; pointer-events:none; }
.loader-spin{ width:60px; height:60px; animation:loaderSpin 1.1s linear infinite; }
@keyframes loaderSpin{ to{ transform:rotate(360deg); } }
@media (prefers-reduced-motion:reduce){ .loader-spin{ animation:none; } }

/* ---------- scroll progress ---------- */
#progress{
  position:fixed; top:0; left:0; height:3px; width:0%;
  background:var(--brand-grad); z-index:9999; transition:width .1s linear;
}

/* ---------- header & dropdown nav ---------- */
header{
  position:sticky; top:0; z-index:1000;
  background:rgba(251,244,231,0.86);
  backdrop-filter:blur(14px) saturate(140%);
  border-bottom:1px solid var(--line);
  transition:box-shadow .3s var(--ease);
}
header.scrolled{ box-shadow:0 8px 24px rgba(26,35,64,0.06); }
.nav-row{
  display:flex; align-items:center; justify-content:space-between;
  padding:14px 0; gap:20px;
}
.brand-logo{ height:46px; width:auto; transition:height .3s var(--ease); }
header.scrolled .brand-logo{ height:38px; }

nav.menu{ display:flex; align-items:center; gap:6px; }
nav.menu > .nav-item{ position:relative; }
nav.menu > .nav-item > a{
  position:relative; display:flex; align-items:center; gap:5px;
  font-size:15px; font-weight:600; color:var(--ink);
  padding:10px 14px; border-radius:10px;
  transition:background .2s var(--ease);
}
nav.menu > .nav-item > a:hover{ background:rgba(26,35,64,0.05); }
nav.menu > .nav-item > a .caret{ font-size:10px; opacity:.55; transition:transform .25s var(--ease); }
nav.menu > .nav-item:hover > a .caret{ transform:rotate(180deg); }

.dropdown{
  position:absolute; top:calc(100% + 6px); left:50%; transform:translateX(-50%) translateY(6px);
  background:var(--card); border:1px solid var(--line); border-radius:16px;
  padding:10px; min-width:200px; box-shadow:var(--shadow-lift);
  opacity:0; visibility:hidden; transition:all .22s var(--ease);
  display:flex; flex-direction:column; gap:2px;
}
nav.menu > .nav-item:hover .dropdown{
  opacity:1; visibility:visible; transform:translateX(-50%) translateY(0);
}
.dropdown a{
  display:block; padding:10px 14px; border-radius:10px; font-size:14px; font-weight:500;
  color:var(--body); white-space:nowrap;
}
.dropdown a:hover{ background:var(--p-lav); color:var(--p-lav-ink); }

.cta-btn{
  display:inline-flex; align-items:center; gap:8px;
  background:var(--ink); color:var(--ivory)!important;
  padding:11px 22px; border-radius:999px; font-weight:700; font-size:14px;
  border:none; cursor:pointer; white-space:nowrap;
  transition:transform .25s var(--ease), box-shadow .25s var(--ease);
  box-shadow:var(--shadow-soft);
}
.cta-btn:hover{ transform:translateY(-2px); box-shadow:var(--shadow-lift); }
.menu-toggle{ display:none; background:none; border:none; cursor:pointer; padding:8px; }
.menu-toggle span{ display:block; width:24px; height:2px; background:var(--ink); margin:5px 0; border-radius:2px; }

/* ---------- hero (home) ---------- */
.hero{ position:relative; padding:150px 0 120px; overflow:hidden; isolation:isolate; }
.hero-bg{ position:absolute; inset:0; z-index:-3; overflow:hidden; }
.hero-bg img{
  width:100%; height:100%; object-fit:cover; filter:blur(4px) saturate(105%);
  transform:scale(1.1); animation:kenburns 22s ease-in-out infinite alternate;
  opacity:0; animation:kenburns 22s ease-in-out infinite alternate, bgFadeIn 1.6s var(--ease) forwards;
}
@keyframes kenburns{ 0%{ transform:scale(1.08) translate3d(0,0,0); } 100%{ transform:scale(1.18) translate3d(-1%,-1.5%,0); } }
@keyframes bgFadeIn{ from{ opacity:0; } to{ opacity:1; } }
.hero-overlay{
  position:absolute; inset:0; z-index:-2;
  background:
    linear-gradient(180deg, rgba(251,244,231,0.94) 0%, rgba(251,244,231,0.88) 30%, rgba(251,244,231,0.72) 60%, rgba(251,244,231,0.85) 100%);
}
#aiNet{ position:absolute; inset:0; z-index:-1; opacity:.85; }
.blob{ position:absolute; border-radius:50%; filter:blur(60px); opacity:.5; z-index:-1; animation:float 16s ease-in-out infinite; }
.blob.b1{ width:420px; height:420px; background:var(--p-mint); top:-120px; right:-80px; }
.blob.b2{ width:340px; height:340px; background:var(--p-lav); bottom:-100px; left:-60px; animation-delay:-5s;}
.blob.b3{ width:260px; height:260px; background:var(--p-sky); top:40%; right:18%; animation-delay:-9s;}
@keyframes float{ 0%,100%{ transform:translate(0,0) scale(1);} 50%{ transform:translate(30px,-40px) scale(1.08);} }
.eyebrow{
  display:inline-flex; align-items:center; gap:10px;
  font-family:'JetBrains Mono','Pretendard Variable',monospace; font-size:13px; font-weight:500;
  color:var(--brand-violet); background:var(--p-lav);
  padding:7px 16px; border-radius:999px; margin-bottom:26px; letter-spacing:.03em;
}
.hero h1{ font-size:clamp(34px, 5.2vw, 62px); font-weight:800; line-height:1.18; max-width:820px; }
.hero .rise{ opacity:0; transform:translateY(36px); animation:riseIn .9s var(--ease) forwards; }
.hero .rise.r1{ animation-delay:.15s; }
.hero .rise.r2{ animation-delay:.35s; }
.hero .rise.r3{ animation-delay:.55s; }
.hero .rise.r4{ animation-delay:.75s; }
.hero .rise.r5{ animation-delay:.95s; }
@keyframes riseIn{ from{ opacity:0; transform:translateY(36px); } to{ opacity:1; transform:translateY(0); } }
.hero h1 .grad{
  background:var(--brand-grad); background-size:220% auto;
  -webkit-background-clip:text; background-clip:text; color:transparent;
  animation:shimmer 7s ease-in-out infinite;
}
@keyframes shimmer{ 0%,100%{ background-position:0% 50%; } 50%{ background-position:100% 50%; } }
.hero .sub{ margin-top:24px; font-size:18px; color:var(--body); max-width:640px; }
.hero-actions{ display:flex; gap:14px; margin-top:38px; flex-wrap:wrap; }
.btn-outline{
  display:inline-flex; align-items:center; gap:8px;
  padding:13px 26px; border-radius:999px; font-weight:700; font-size:15px;
  border:1.5px solid var(--ink); background:transparent; transition:all .25s var(--ease);
}
.btn-outline:hover{ background:var(--ink); color:var(--ivory); }
.btn-solid{
  display:inline-flex; align-items:center; gap:8px;
  padding:14px 28px; border-radius:999px; font-weight:700; font-size:15px;
  background:var(--brand-grad); color:#fff; border:none; cursor:pointer;
  box-shadow:0 12px 28px rgba(139,92,246,0.28);
  transition:transform .25s var(--ease), box-shadow .25s var(--ease);
}
.btn-solid:hover{ transform:translateY(-3px); box-shadow:0 18px 36px rgba(139,92,246,0.36); }
.btn-solid[disabled], .btn-outline[disabled]{ opacity:.45; cursor:not-allowed; pointer-events:none; }
.wave-sig{ width:180px; height:auto; margin-top:44px; opacity:.9; }

/* ---------- inner page hero (sub pages) ---------- */
.page-hero{ position:relative; padding:64px 0 56px; overflow:hidden; isolation:isolate; border-bottom:1px solid var(--line); }
.page-hero .blob{ opacity:.4; }
.page-hero .crumb{ font-size:13px; color:var(--muted); margin-bottom:14px; font-family:'JetBrains Mono','Pretendard Variable',monospace; }
.page-hero h1{ font-size:clamp(28px,3.6vw,42px); font-weight:800; }
.page-hero p{ margin-top:14px; font-size:16px; color:var(--body); max-width:600px; }

/* ---------- section shared ---------- */
section{ padding:100px 0; position:relative; }
.section-head{ max-width:640px; margin-bottom:56px; }
.section-head .eyebrow{ margin-bottom:18px; }
.section-head h2{ font-size:clamp(26px,3.4vw,38px); font-weight:800; }
.section-head p{ margin-top:16px; font-size:16px; color:var(--muted); }
.reveal{ opacity:0; transform:translateY(28px); transition:opacity .7s var(--ease), transform .7s var(--ease); }
.reveal.in{ opacity:1; transform:translateY(0); }

/* ---------- about ---------- */
#about{ background:var(--wash-sky); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.about-grid{ display:grid; grid-template-columns:1.1fr .9fr; gap:56px; align-items:start; }
.about-copy p{ font-size:16px; color:var(--body); margin-bottom:16px; }
.info-card{ background:var(--ivory); border:1px solid var(--line); border-radius:var(--radius-md); padding:30px 32px; }
.info-card dl{ margin:0; display:grid; grid-template-columns:110px 1fr; row-gap:14px; column-gap:10px; }
.info-card dt{ font-size:13px; color:var(--muted); font-weight:600; padding-top:2px;}
.info-card dd{ margin:0; font-size:15px; font-weight:600; color:var(--ink); }
.badge-soon{
  display:inline-block; font-family:'JetBrains Mono','Pretendard Variable',monospace; font-size:12px;
  background:var(--p-peach); color:var(--p-peach-ink); padding:3px 10px; border-radius:999px; font-weight:600;
}
.placeholder-box{
  margin-top:22px; border:1.5px dashed var(--line); border-radius:var(--radius-md);
  padding:26px; text-align:center; color:var(--muted); font-size:14px; background:#fff;
}
.placeholder-box strong{ display:block; color:var(--ink); font-size:15px; margin-bottom:6px; }

/* ---------- board ---------- */
#board{ background:var(--wash-lav); }
.board-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:28px; perspective:1200px; }
.board-card{
  background:var(--card); border:1px solid var(--line); border-radius:var(--radius-lg);
  padding:0; overflow:hidden;
  transition:transform .35s var(--ease), box-shadow .35s var(--ease);
  transform-style:preserve-3d; will-change:transform;
}
.board-card:hover{ box-shadow:var(--shadow-lift); }
.board-photo{
  width:100%; height:280px; overflow:hidden; margin:0; position:relative;
}
.board-photo::after{
  content:''; position:absolute; inset:0; background:linear-gradient(180deg, rgba(26,35,64,0) 55%, rgba(26,35,64,0.18) 100%);
}
.board-photo img{ width:100%; height:100%; object-fit:cover; transition:transform .5s var(--ease); }
.board-card:hover .board-photo img{ transform:scale(1.06); }
.board-card .card-body{ padding:26px 28px 30px; }
.board-role{
  display:inline-block; font-size:12px; font-weight:700; padding:4px 12px; border-radius:999px;
  margin-bottom:10px; font-family:'JetBrains Mono','Pretendard Variable',monospace;
}
.role-chair{ background:var(--p-lav); color:var(--p-lav-ink); }
.role-director{ background:var(--p-sky); color:var(--p-sky-ink); }
.role-auditor{ background:var(--p-mint); color:var(--p-mint-ink); }
.board-card h3{ font-size:20px; font-weight:800; margin-bottom:12px; }
.board-card ul{ margin:0; padding:0; list-style:none; display:flex; flex-direction:column; gap:7px; }
.board-card li{ font-size:13.5px; color:var(--body); padding-left:14px; position:relative; }
.board-card li::before{ content:'○'; position:absolute; left:0; top:5px; font-size:9px; color:var(--brand-violet); }

/* ---------- programs ---------- */
#programs{ background:var(--wash-mint); }
.program-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:28px; perspective:1200px; }
.program-card{
  background:var(--card); border-radius:var(--radius-lg); padding:30px; border:1px solid var(--line);
  display:flex; flex-direction:column; gap:16px;
  transition:transform .35s var(--ease), box-shadow .35s var(--ease);
  will-change:transform;
}
.program-card:hover{ box-shadow:var(--shadow-lift); }
.tag-row{ display:flex; gap:8px; flex-wrap:wrap; }
.tag{ font-size:12px; font-weight:700; padding:5px 12px; border-radius:999px; font-family:'JetBrains Mono','Pretendard Variable',monospace; }
.tag-gov{ background:var(--p-sky); color:var(--p-sky-ink); }
.tag-edu{ background:var(--p-mint); color:var(--p-mint-ink); }
.tag-biz{ background:var(--p-lav); color:var(--p-lav-ink); }
.tag-status{ background:var(--ink); color:var(--ivory); }
.program-card h3{ font-size:19px; font-weight:800; }
.program-card .desc{ font-size:14.5px; color:var(--body); flex-grow:1; }
.program-meta{ display:flex; flex-direction:column; gap:6px; font-size:13px; color:var(--muted); border-top:1px dashed var(--line); padding-top:14px; }
.program-meta b{ color:var(--ink); }

/* ---------- news / community placeholder grid ---------- */
.news-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.news-card{
  border:1.5px dashed var(--line); border-radius:var(--radius-md); background:var(--card);
  padding:34px 26px; text-align:center; color:var(--muted);
}
.news-card .dot{ width:10px; height:10px; border-radius:50%; margin:0 auto 16px; background:var(--brand-grad); }
.news-card strong{ display:block; color:var(--ink); font-size:15px; margin-bottom:6px; font-weight:700; }

/* ---------- contact ---------- */
#contact{ background:var(--wash-butter); border-top:1px solid var(--line); }
.contact-grid{ display:grid; grid-template-columns:1fr .85fr; gap:40px; }
.form-card{ background:var(--ivory); border-radius:var(--radius-lg); padding:38px; border:1px solid var(--line); }
.tab-toggle{ display:flex; gap:6px; background:var(--ivory-deep); padding:6px; border-radius:14px; margin-bottom:28px; }
.tab-btn{
  flex:1; padding:12px 14px; border-radius:10px; border:none; background:transparent;
  font-weight:700; font-size:13.5px; color:var(--muted); cursor:pointer;
  transition:all .25s var(--ease); font-family:'Pretendard Variable',sans-serif;
}
.tab-btn.active{ background:var(--card); color:var(--ink); box-shadow:var(--shadow-soft); }
.tab-btn:hover:not(.active){ color:var(--ink); }
.contact-panel{ display:none; animation:fadeIn .35s var(--ease); }
.contact-panel.active{ display:block; }
.form-status{ margin:14px 0 0; font-size:13.5px; font-weight:600; min-height:18px; }
.form-status.ok{ color:var(--brand-teal); }
.form-status.err{ color:#C0392B; }
@keyframes fadeIn{ from{ opacity:0; transform:translateY(6px); } to{ opacity:1; transform:translateY(0); } }
.form-row{ display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-bottom:16px; }
.form-field{ display:flex; flex-direction:column; gap:8px; }
.form-field.full{ grid-column:1/-1; }
label{ font-size:13px; font-weight:700; color:var(--ink); }
input, select, textarea{
  font-family:inherit; font-size:14.5px; padding:13px 15px; border-radius:12px;
  border:1.5px solid var(--line); background:#fff; color:var(--ink);
  transition:border-color .2s var(--ease), box-shadow .2s var(--ease); width:100%;
}
input:focus, select:focus, textarea:focus{ border-color:var(--brand-violet); box-shadow:0 0 0 4px rgba(139,92,246,0.12); outline:none; }
textarea{ resize:vertical; min-height:110px; }
input[disabled], select[disabled], textarea[disabled]{ background:var(--ivory-deep); color:var(--muted); cursor:not-allowed; }
.consent{ display:flex; align-items:flex-start; gap:10px; font-size:13px; color:var(--muted); margin:18px 0 22px; }
.consent input{ width:16px; height:16px; margin-top:2px; padding:0; flex-shrink:0; }

.contact-info-card{
  background:var(--ink); color:var(--ivory); border-radius:var(--radius-lg);
  padding:38px; display:flex; flex-direction:column; gap:22px; position:relative; overflow:hidden;
}
.contact-info-card::before{ content:''; position:absolute; inset:0; background:var(--brand-grad); opacity:.12; }
.contact-info-card .badge-logo{ width:64px; height:64px; border-radius:16px; }
.contact-line{ display:flex; align-items:center; gap:14px; font-size:15px; }
.contact-line .ic{
  width:38px; height:38px; border-radius:10px; background:rgba(255,255,255,0.1);
  display:flex; align-items:center; justify-content:center; flex-shrink:0;
}
.contact-line b{ display:block; font-size:12px; color:rgba(251,244,231,0.55); font-weight:500; margin-bottom:2px; }

/* ---------- coming-soon block (자격증/강의실/교재) ---------- */
.soon-card{
  background:var(--card); border:1.5px dashed var(--line); border-radius:var(--radius-lg);
  padding:44px; text-align:center;
}
.soon-card .soon-icon{
  width:56px; height:56px; border-radius:16px; margin:0 auto 20px; background:var(--p-lav);
  display:flex; align-items:center; justify-content:center; font-size:24px;
}
.soon-card h3{ font-size:20px; font-weight:800; margin-bottom:10px; }
.soon-card p{ font-size:14.5px; color:var(--muted); max-width:440px; margin:0 auto; }
.anchor-tabs{ display:flex; gap:10px; flex-wrap:wrap; margin-bottom:44px; }
.anchor-tabs a{
  font-size:14px; font-weight:600; padding:9px 18px; border-radius:999px;
  border:1.5px solid var(--line); color:var(--body); transition:all .2s var(--ease);
}
.anchor-tabs a:hover{ border-color:var(--brand-violet); color:var(--brand-violet); }
.sub-block{ scroll-margin-top:100px; }

/* ---------- mock classroom login ---------- */
.mock-login{
  max-width:420px; margin:0 auto; background:var(--card); border:1px solid var(--line);
  border-radius:var(--radius-lg); padding:36px; text-align:left; box-shadow:var(--shadow-soft);
}
.mock-login .form-field{ margin-bottom:14px; }

/* ---------- org chart ---------- */
.org-chart{ display:flex; flex-direction:column; align-items:center; gap:0; }
.org-node{
  background:var(--card); border:1px solid var(--line); border-radius:16px;
  padding:16px 26px; text-align:center; box-shadow:var(--shadow-soft); position:relative; z-index:1;
}
.org-node.top{ background:var(--ink); color:var(--ivory); }
.org-node .role{ font-size:11px; font-family:'JetBrains Mono','Pretendard Variable',monospace; opacity:.65; margin-bottom:4px; }
.org-node .name{ font-size:16px; font-weight:800; }
.org-line{ width:2px; height:36px; background:var(--line); }
.org-row{ display:flex; gap:22px; flex-wrap:wrap; justify-content:center; position:relative; }
.org-row::before{
  content:''; position:absolute; top:-36px; left:8%; right:8%; height:2px; background:var(--line);
}
.org-row .branch{ display:flex; flex-direction:column; align-items:center; }
.org-row .branch .org-line{ height:36px; }
.org-auditor-wrap{ margin-top:26px; padding-top:26px; border-top:1px dashed var(--line); text-align:center; }
.org-auditor-wrap .tag{ margin-bottom:14px; display:inline-block; }

/* ---------- identity / CI page ---------- */
.ci-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:28px; }
.ci-card{ background:var(--card); border:1px solid var(--line); border-radius:var(--radius-lg); padding:36px; text-align:center; }
.ci-card img{ max-height:110px; width:auto; margin:0 auto 20px; }
.ci-card h4{ font-size:15px; font-weight:700; margin-bottom:6px; }
.ci-card p{ font-size:13px; color:var(--muted); }
.swatch-row{ display:grid; grid-template-columns:repeat(5,1fr); gap:14px; margin-top:20px; }
.swatch{ border-radius:14px; padding:16px 10px 10px; text-align:center; font-family:'JetBrains Mono','Pretendard Variable',monospace; font-size:11px; color:var(--ink); }
.swatch .chip{ height:56px; border-radius:10px; margin-bottom:10px; }
.dont-row{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-top:24px; }
.dont-card{ background:#fff; border:1px solid var(--line); border-radius:16px; padding:22px; text-align:center; }
.dont-card .mark{ font-size:22px; margin-bottom:10px; }

/* ---------- join / career ---------- */
.join-card{
  background:var(--card); border:1px solid var(--line); border-radius:var(--radius-lg);
  padding:38px; display:grid; grid-template-columns:1fr auto; gap:30px; align-items:center;
}
.join-card ul{ margin:14px 0 0; padding-left:18px; font-size:14.5px; color:var(--body); display:flex; flex-direction:column; gap:6px; }

/* ---------- footer ---------- */
footer{ background:var(--ink); color:rgba(251,244,231,0.6); padding:56px 0 30px; }
.footer-top{ display:flex; justify-content:space-between; align-items:flex-start; gap:40px; flex-wrap:wrap; margin-bottom:36px; }
.footer-logo-wrap{ background:var(--card); padding:14px 20px; border-radius:16px; display:inline-block; margin-bottom:16px; }
.footer-logo{ height:30px; display:block; }
.footer-links{ display:flex; gap:26px; flex-wrap:wrap; }
.footer-links a{ font-size:13.5px; color:rgba(251,244,231,0.7); }
.footer-links a:hover{ color:#fff; }
.footer-bottom{ border-top:1px solid rgba(251,244,231,0.12); padding-top:24px; font-size:12.5px; display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px; }

/* Prevent CSS Grid items from refusing to shrink below their content's
   min-content size (the classic grid overflow trap on narrow viewports) */
.about-grid > *, .contact-grid > *, .ci-grid > *,
.board-grid > *, .program-grid > *, .news-grid > *,
.info-card dd, .join-card > div{ min-width:0; }

/* ---------- responsive ---------- */
/* Tablet & below: switch to hamburger nav (a full horizontal menu with 6 items
   + logo + CTA doesn't fit between 720–960px, so the hamburger threshold is
   raised here — keeps the header from wrapping/crowding on iPads and small
   laptop windows) */
@media (max-width:960px){
  nav.menu{
    position:fixed; top:74px; left:0; right:0; background:var(--ivory);
    flex-direction:column; align-items:stretch; padding:12px 20px 30px; gap:4px;
    border-bottom:1px solid var(--line); box-shadow:var(--shadow-soft);
    transform:translateY(-140%); opacity:0; transition:all .3s var(--ease); pointer-events:none;
    max-height:80vh; overflow-y:auto;
  }
  nav.menu.open{ transform:translateY(0); opacity:1; pointer-events:auto; }
  nav.menu > .nav-item > a{ padding:14px 10px; justify-content:space-between; white-space:normal; }
  .dropdown, nav.menu > .nav-item:hover .dropdown{
    position:static !important; left:auto !important; opacity:1 !important; visibility:visible !important;
    transform:none !important; box-shadow:none; border:none; background:transparent;
    padding:0 0 6px 14px; display:none;
  }
  nav.menu > .nav-item.mobile-open .dropdown{ display:flex !important; }
  .menu-toggle{ display:block; }
  .cta-btn.desktop-only{ display:none; }
}

/* Tablet grid tuning: 2-column cards still read well down to 600px */
@media (max-width:920px){
  .about-grid, .contact-grid, .ci-grid{ grid-template-columns:1fr; }
  .board-grid, .program-grid, .news-grid{ grid-template-columns:repeat(2,1fr); }
  .swatch-row{ grid-template-columns:repeat(3,1fr); }
  .dont-row{ grid-template-columns:1fr; }
  .join-card{ grid-template-columns:1fr; text-align:center; }
}

/* Phone: everything collapses to a single column */
@media (max-width:600px){
  .board-grid, .program-grid, .news-grid, .swatch-row{ grid-template-columns:1fr; }
  .form-row{ grid-template-columns:1fr; }
  section{ padding:70px 0; }
  .hero{ padding:90px 0 70px; }
  .org-row{ flex-direction:column; align-items:center; }
  .org-row::before{ display:none; }
  .tab-btn{ font-size:12.5px; padding:11px 8px; }
}

@media (prefers-reduced-motion:reduce){
  *{ animation-duration:0.001ms !important; animation-iteration-count:1 !important; transition-duration:0.001ms !important; }
  html{ scroll-behavior:auto; }
  .hero .rise{ opacity:1; transform:none; }
  .hero-bg img{ opacity:1; transform:scale(1.1); }
  #aiNet{ display:none; }
  .board-card, .program-card{ transform:none !important; }
}

/* ---------- card tilt (JS-driven via CSS vars) ---------- */
.board-card, .program-card{
  transform: perspective(1200px) rotateX(var(--tiltX,0)) rotateY(var(--tiltY,0)) translateY(var(--liftY,0));
}