:root{
    --bg:#F5FAFC;
    --surface:#FFFFFF;
    --surface-2:#EEF6F9;
    --ink:#0E2233;
    --ink-soft:#4B6577;
    --line:#DCEAEF;
    --navy-deep:#0B2A4A;
    --navy:#12507A;
    --ocean:#1C86B4;
    --cyan:#3FC1D6;
    --cyan-light:#B7E9EF;
    --gold:#E2963C;
    --gold-soft:#FBEBD3;
    --on-navy:#F2F8FB;
  }
  @media (prefers-color-scheme: dark){
    :root:not([data-theme="light"]){
      --bg:#081521;
      --surface:#0F2434;
      --surface-2:#122C3E;
      --ink:#E7F1F6;
      --ink-soft:#9AB4C4;
      --line:#1E3E52;
      --navy-deep:#081A2C;
      --navy:#123A57;
      --ocean:#2E9BC7;
      --cyan:#4FCBDF;
      --cyan-light:#153342;
      --gold:#EDAE5C;
      --gold-soft:#2C2213;
      --on-navy:#EAF4F8;
    }
  }
  :root[data-theme="dark"]{
    --bg:#081521;
    --surface:#0F2434;
    --surface-2:#122C3E;
    --ink:#E7F1F6;
    --ink-soft:#9AB4C4;
    --line:#1E3E52;
    --navy-deep:#081A2C;
    --navy:#123A57;
    --ocean:#2E9BC7;
    --cyan:#4FCBDF;
    --cyan-light:#153342;
    --gold:#EDAE5C;
    --gold-soft:#2C2213;
    --on-navy:#EAF4F8;
  }

  *{box-sizing:border-box;}
  html,body{margin:0;padding:0;}
  body{
    background:var(--bg);
    color:var(--ink);
    font-family:"Noto Sans KR","Pretendard",-apple-system,sans-serif;
    line-height:1.6;
    -webkit-font-smoothing:antialiased;
  }
  h1,h2,h3{font-family:"Gothic A1","Noto Sans KR",sans-serif;text-wrap:balance;margin:0;}
  a{color:inherit;text-decoration:none;}
  img{max-width:100%;display:block;}
  .eyebrow{
    font-family:"IBM Plex Mono",monospace;
    font-size:12px;
    letter-spacing:.1em;
    text-transform:uppercase;
  }

  /* ---- mockup chrome ---- */
  /* ---- GNB ---- */
  .gnb{
    position:sticky; top:0; z-index:50;
    background:var(--surface);
    border-bottom:1px solid var(--line);
  }
  .gnb-inner{
    max-width:1180px;margin:0 auto;
    display:flex;align-items:center;justify-content:space-between;
    padding:14px 24px;
    gap:24px;
  }
  .brand{display:flex;align-items:center;gap:10px;}
  .brand a{display:flex;align-items:center;gap:10px;text-decoration:none;color:inherit;}
  .brand img{height:34px;width:auto;}
  .brand .word{
    font-family:"Gothic A1",sans-serif;
    font-weight:800;
    font-size:15.5px;
    line-height:1.15;
    color:var(--navy-deep);
  }
  .brand .word small{display:block;font-family:"Noto Sans KR";font-weight:500;font-size:10.5px;color:var(--ink-soft);letter-spacing:.01em;}

  .gnb-menu{
    display:flex;gap:28px;
    font-size:14.5px;font-weight:500;
    color:var(--ink);
  }
  .gnb-menu a{padding:6px 0;border-bottom:2px solid transparent;}
  .gnb-menu a:hover{border-color:var(--ocean);color:var(--ocean);}

  .btn{
    display:inline-flex;align-items:center;gap:6px;
    padding:11px 22px;
    border-radius:999px;
    font-weight:700;
    font-size:14px;
    white-space:nowrap;
    cursor:pointer;
    border:1px solid transparent;
  }
  .btn-primary{background:var(--navy-deep);color:#fff;}
  .btn-primary:hover{background:var(--ocean);}
  .btn-gold{background:var(--gold);color:#241505;}
  .btn-ghost{background:transparent;border-color:var(--line);color:var(--ink);}
  .btn-ghost-invert{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.5);color:#fff;}
  .btn-sm{padding:8px 16px;font-size:12.5px;}

  .gnb-cta{display:flex;align-items:center;gap:14px;}
  .gnb-tel{
    font-family:"IBM Plex Mono",monospace;
    font-size:13px;color:var(--ink-soft);
    display:none;
    align-items:center;gap:6px;
  }
  .gnb-tel .lbl{font-family:"Noto Sans KR";font-size:11px;color:var(--ink-soft);}
  .gnb-tel b{color:var(--navy-deep);font-weight:700;}
  @media (min-width:760px){ .gnb-tel{display:inline-flex;} }

  .gnb-burger{
    display:none;
    align-items:center;justify-content:center;
    width:38px;height:38px;flex-shrink:0;
    background:none;border:1px solid var(--line);border-radius:8px;
    cursor:pointer;padding:0;
  }
  .gnb-burger svg{width:19px;height:19px;color:var(--ink);}
  .gnb-burger .i-close{display:none;}
  .gnb.open .gnb-burger .i-open{display:none;}
  .gnb.open .gnb-burger .i-close{display:block;}

  .gnb-mobile{
    display:none;
    flex-direction:column;
    background:var(--surface);
    border-top:1px solid var(--line);
    padding:6px 24px 18px;
  }
  .gnb.open .gnb-mobile{display:flex;}
  .gnb-mobile a{
    padding:13px 2px;
    font-size:15px;font-weight:600;color:var(--ink);
    border-bottom:1px solid var(--line);
  }
  .gnb-mobile .m-tel{
    display:flex;align-items:center;justify-content:space-between;
    padding:14px 2px 4px;
    font-family:"IBM Plex Mono",monospace;font-size:13.5px;color:var(--ink-soft);
  }
  .gnb-mobile .m-tel b{color:var(--navy-deep);font-size:15px;}

  /* ---- notice bar ---- */
  .notice{
    background:var(--surface-2);
    border-bottom:1px solid var(--line);
  }
  .notice-inner{
    max-width:1180px;margin:0 auto;
    display:flex;align-items:center;gap:14px;
    padding:10px 24px;
    font-size:13.5px;
  }
  .notice-tag{
    background:var(--gold);color:#241505;
    font-family:"IBM Plex Mono",monospace;
    font-size:10.5px;font-weight:700;
    padding:3px 8px;border-radius:4px;letter-spacing:.03em;flex-shrink:0;
  }
  .notice-text{flex:1;min-width:0;color:var(--ink);font-weight:500;}
  .notice-close{color:var(--ink-soft);font-size:16px;cursor:pointer;flex-shrink:0;}
  @media (max-width:480px){
    .notice-inner{padding:9px 16px;font-size:12.5px;gap:10px;}
    .notice-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
  }

  /* ---- hero ---- */
  .hero{
    position:relative;
    overflow:hidden;
    background:var(--navy-deep);
    color:var(--on-navy);
  }
  .hero-photo{
    position:absolute;inset:0;z-index:0;
    width:100%;height:100%;
    object-fit:cover;
    object-position:center 30%;
  }
  .hero-overlay{
    position:absolute;inset:0;z-index:1;
    background:linear-gradient(100deg,
      rgba(8,26,44,.95) 0%,
      rgba(8,26,44,.88) 30%,
      rgba(8,26,44,.62) 54%,
      rgba(8,26,44,.32) 76%,
      rgba(8,26,44,.42) 100%);
  }
  .hero-wave-bottom{position:absolute;left:0;right:0;bottom:-1px;width:100%;height:56px;z-index:2;display:block;}
  .hero-inner{
    position:relative;z-index:3;
    max-width:1180px;margin:0 auto;
    padding:88px 24px 96px;
    display:grid;
    grid-template-columns:1.15fr .85fr;
    gap:40px;
    align-items:center;
  }
  .hero-eyebrow{color:var(--cyan);margin-bottom:18px;}
  .hero h1{
    font-size:clamp(32px,4.4vw,52px);
    font-weight:800;
    line-height:1.28;
    margin-bottom:22px;
  }
  .hero h1 em{font-style:normal;color:var(--cyan);}
  .hero-sub{
    font-size:15.5px;
    color:#CFE4EC;
    max-width:52ch;
    margin-bottom:8px;
  }
  .hero-sub + .hero-sub{margin-bottom:26px;}
  .hero-actions{display:flex;gap:14px;flex-wrap:wrap;}
  .hero-quote{
    background:rgba(255,255,255,.07);
    border:1px solid rgba(255,255,255,.16);
    border-radius:16px;
    padding:28px 30px;
    backdrop-filter:blur(2px);
  }
  .hero-quote p{
    font-family:"Gothic A1",sans-serif;
    font-weight:800;
    font-size:22px;
    line-height:1.5;
    color:#fff;
    margin:0;
  }
  .hero-quote p .hi{color:var(--gold);}

  /* ---- section shell ---- */
  section{padding:80px 24px;}
  .section-inner{max-width:1180px;margin:0 auto;}
  .section-head{
    display:flex;
    justify-content:space-between;
    align-items:flex-end;
    gap:20px;
    margin-bottom:38px;
    flex-wrap:wrap;
  }
  .section-head .tag{
    color:var(--ocean);
    margin-bottom:10px;
  }
  .section-head h2{font-size:clamp(22px,2.6vw,29px);font-weight:800;color:var(--ink);}
  .section-head p{color:var(--ink-soft);font-size:14px;max-width:48ch;margin-top:6px;}
  .section-link{font-size:13.5px;font-weight:700;color:var(--ocean);display:inline-flex;align-items:center;gap:4px;flex-shrink:0;}

  .alt{background:var(--surface-2);}

  /* ---- trust strip ---- */
  .trust-strip{
    background:var(--surface);
    border-bottom:1px solid var(--line);
    padding:0;
  }
  .trust-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:0;
    max-width:1180px;
  }
  .trust-item{
    display:flex;
    align-items:center;
    gap:14px;
    padding:26px 22px;
    border-left:1px solid var(--line);
  }
  .trust-item:first-child{border-left:none;}
  .t-icon{
    width:40px;height:40px;flex-shrink:0;
    border-radius:10px;
    background:var(--cyan-light);
    color:var(--ocean);
    display:flex;align-items:center;justify-content:center;
  }
  .t-icon svg{width:20px;height:20px;}
  .t-text{display:flex;flex-direction:column;gap:2px;}
  .t-text b{font-size:14px;font-weight:800;color:var(--ink);}
  .t-text span{font-size:12px;color:var(--ink-soft);}

  /* ---- 핵심사업 3가지 ---- */
  .biz-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;}
  .biz-card{
    background:var(--surface);
    border:1px solid var(--line);
    border-radius:18px;
    padding:30px 26px;
    position:relative;
    overflow:hidden;
  }
  .biz-card .num{
    font-family:"IBM Plex Mono",monospace;
    font-size:12px;color:var(--ink-soft);
    letter-spacing:.05em;
  }
  .biz-card .icon{
    width:52px;height:52px;border-radius:14px;
    display:flex;align-items:center;justify-content:center;
    margin:16px 0 18px;
    background:var(--cyan-light);
  }
  .biz-card .icon svg{width:26px;height:26px;}
  .biz-card h3{font-size:18px;font-weight:800;margin-bottom:10px;color:var(--ink);}
  .biz-card p{font-size:13.5px;color:var(--ink-soft);margin:0;}
  .biz-card.b1 .icon{background:var(--cyan-light);}
  .biz-card.b1 .icon svg{stroke:var(--ocean);}
  .biz-card.b2 .icon{background:var(--gold-soft);}
  .biz-card.b2 .icon svg{stroke:var(--gold);}
  .biz-card.b3 .icon{background:#E4EEE0;}
  .biz-card.b3 .icon svg{stroke:#4C8A4E;}
  :root[data-theme="dark"] .biz-card.b3 .icon,
  html:not([data-theme="light"]) .biz-card.b3 .icon{background:#173423;}

  /* ---- 교육안내 3갈래 ---- */
  .track-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;}
  .track-card{
    border-radius:18px;
    padding:26px 24px;
    color:#fff;
    position:relative;
    min-height:260px;
    display:flex;flex-direction:column;justify-content:flex-end;
    overflow:hidden;
  }
  .track-img{
    position:absolute;inset:0;z-index:0;
    width:100%;height:100%;
    object-fit:cover;
  }
  .track-card::before{
    content:"";position:absolute;inset:0;z-index:1;
  }
  .track-card .t-eyebrow{font-family:"IBM Plex Mono",monospace;font-size:11px;letter-spacing:.06em;opacity:.85;margin-bottom:8px;position:relative;z-index:2;}
  .track-card h3{font-size:19px;font-weight:800;margin-bottom:6px;position:relative;z-index:2;}
  .track-card p{font-size:12.5px;opacity:.9;margin:0 0 12px;position:relative;z-index:2;}
  .track-conds{
    position:relative;z-index:2;
    display:flex;flex-wrap:wrap;gap:6px;
    margin-bottom:16px;
  }
  .track-conds span{
    font-family:"IBM Plex Mono",monospace;
    font-size:10.5px;font-weight:600;
    background:rgba(255,255,255,.18);
    border:1px solid rgba(255,255,255,.32);
    padding:3px 8px;border-radius:5px;
  }
  .track-card .go{
    position:relative;z-index:2;
    font-size:12.5px;font-weight:700;
    display:inline-flex;align-items:center;gap:4px;
    width:fit-content;
  }
  .track-card.t1::before{background:linear-gradient(0deg, rgba(8,32,54,.94) 0%, rgba(11,42,74,.62) 46%, rgba(11,42,74,.08) 82%);}
  .track-card.t2::before{background:linear-gradient(0deg, rgba(9,45,58,.94) 0%, rgba(15,74,82,.62) 46%, rgba(15,74,82,.08) 82%);}
  .track-card.t3::before{background:linear-gradient(0deg, rgba(58,32,10,.94) 0%, rgba(138,78,31,.62) 46%, rgba(138,78,31,.08) 82%);}

  /* ---- 대표 프로그램 ---- */
  .prog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}
  .prog-card{
    background:var(--surface);
    border:1px solid var(--line);
    border-radius:16px;
    overflow:hidden;
    display:block;text-decoration:none;color:inherit;
  }
  .prog-thumb{
    height:120px;
    display:flex;align-items:center;justify-content:center;
    position:relative;
  }
  .prog-thumb svg{width:44px;height:44px;}
  .prog-body{padding:18px 18px 20px;}
  .prog-cat{
    font-family:"IBM Plex Mono",monospace;
    font-size:10px;font-weight:700;letter-spacing:.04em;
    padding:2px 7px;border-radius:4px;
    display:inline-block;margin-bottom:9px;
  }
  .prog-cat.sw{background:var(--cyan-light);color:var(--navy);}
  .prog-cat.ai{background:var(--gold-soft);color:#8A5A15;}
  .prog-body h3{font-size:15px;font-weight:700;margin-bottom:5px;color:var(--ink);}
  .prog-body .target{font-size:12px;color:var(--ink-soft);margin-bottom:8px;}
  .prog-body p{font-size:12.5px;color:var(--ink-soft);margin:0;}

  /* ---- 소식 ---- */
  .news-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;}
  .news-card{
    display:block;
    background:var(--surface);
    border:1px solid var(--line);
    border-radius:14px;
    overflow:hidden;
  }
  .news-thumb{
    height:130px;
    position:relative;
    background:var(--surface-2);
    overflow:hidden;
  }
  .news-thumb img{
    width:100%;height:100%;
    object-fit:cover;
    display:block;
  }
  .news-cat{
    position:absolute;top:8px;left:8px;
    font-family:"IBM Plex Mono",monospace;
    font-size:9.5px;font-weight:700;letter-spacing:.02em;
    background:rgba(11,42,74,.78);color:#fff;
    padding:3px 7px;border-radius:4px;
  }
  .news-body{padding:14px 15px 16px;}
  .news-date{font-family:"IBM Plex Mono",monospace;font-size:10.5px;color:var(--ink-soft);margin-bottom:6px;}
  .news-body h4{
    font-size:13.5px;font-weight:700;line-height:1.4;color:var(--ink);margin:0;
    display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
  }

  /* ---- CTA band ---- */
  .cta-band{
    background:var(--navy-deep);
    color:var(--on-navy);
    padding:64px 24px;
    text-align:center;
    position:relative;
    overflow:hidden;
  }
  .cta-band .section-inner{position:relative;z-index:2;}
  .cta-band h2{font-size:clamp(22px,3vw,30px);font-weight:800;margin-bottom:12px;}
  .cta-band p{color:#CFE4EC;font-size:14.5px;margin-bottom:28px;}
  .cta-actions{display:flex;justify-content:center;gap:14px;flex-wrap:wrap;}
  .cta-tel{font-family:"Noto Sans KR";font-size:13.5px;color:#CFE4EC;margin-top:18px;}
  .cta-tel b{font-family:"IBM Plex Mono",monospace;font-size:16px;color:var(--cyan);font-weight:600;}

  /* ---- footer ---- */
  footer{background:var(--surface);border-top:1px solid var(--line);padding:44px 24px 36px;}
  .foot-inner{max-width:1180px;margin:0 auto;}
  .foot-top{display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;margin-bottom:26px;}
  .foot-brand{display:flex;align-items:center;gap:10px;}
  .foot-brand img{height:26px;}
  .foot-brand .word{font-family:"Gothic A1";font-weight:800;font-size:14px;color:var(--navy-deep);}
  .foot-links{display:flex;gap:20px;font-size:12.5px;color:var(--ink-soft);flex-wrap:wrap;}
  .foot-meta{
    font-size:12px;color:var(--ink-soft);
    line-height:2;
    display:grid;grid-template-columns:repeat(3,1fr);gap:4px 24px;
    border-top:1px solid var(--line);
    padding-top:20px;
  }
  .foot-meta b{color:var(--ink);font-weight:600;}

  @media (max-width:960px){
    .gnb-menu{display:none;}
    .gnb-tel{display:none !important;}
    .gnb-burger{display:inline-flex;}
    .hero-inner{grid-template-columns:1fr;}
    .biz-grid,.track-grid,.prog-grid{grid-template-columns:repeat(2,1fr);}
    .news-grid{grid-template-columns:repeat(2,1fr);}
    .foot-meta{grid-template-columns:1fr;}
    .trust-grid{grid-template-columns:repeat(2,1fr);}
    .trust-item{border-left:none;border-top:1px solid var(--line);}
    .trust-item:nth-child(1),.trust-item:nth-child(2){border-top:none;}
  }
  @media (max-width:600px){
    .biz-grid,.track-grid,.prog-grid,.news-grid{grid-template-columns:1fr;}
    section{padding:56px 18px;}
    .trust-grid{grid-template-columns:1fr;}
    .trust-item{border-top:1px solid var(--line);}
    .trust-item:first-child{border-top:none;}
    .hero-inner{padding:56px 18px 64px;gap:28px;}
    .hero-quote{padding:22px 22px;}
    .hero-quote p{font-size:19px;}
    .gnb-inner{padding:12px 16px;gap:10px;}
    .brand{gap:8px;}
    .brand img{height:28px;}
    .brand .word{font-size:13px;}
    .gnb-cta{gap:8px;}
    .gnb-cta .btn-sm{padding:8px 12px;font-size:12px;}
  }
  @media (max-width:380px){
    .brand .word small{display:none;}
  }

  @media (prefers-reduced-motion: no-preference){
    .btn, .gnb-menu a, .prog-card, .track-card{transition:all .15s ease;}
  }