/* =========================================================
   SCALETRON 2026 — base
   브랜드 파랑은 로고(#0852BC)에서, 나머지는 잉크·회색 계열
   ========================================================= */
:root{
  --blue:#0852bc; --blue-d:#063f93; --blue-l:#e9f0fb; --blue-ll:#f4f7fc;
  --ink:#10151f; --ink-2:#2b3240; --g6:#4f5868; --g5:#727b8b; --g4:#9aa2af; --g3:#c9ced6; --g2:#e3e6eb; --g1:#f2f4f7; --g0:#f8f9fb;
  --navy:#0b1628; --navy-2:#13213a;
  --hd:84px; --wrap:1360px; --pad:clamp(20px,4.2vw,48px);
  --sec:clamp(96px,10.5vw,168px);
  --r-s:8px; --r:16px; --r-l:24px;
  --ease:cubic-bezier(.2,.7,.2,1); --ease-io:cubic-bezier(.65,0,.35,1);
  --f:'Pretendard Variable',Pretendard,-apple-system,BlinkMacSystemFont,'Apple SD Gothic Neo','Malgun Gothic',sans-serif;
}
@media (max-width:1024px){:root{--hd:64px}}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-behavior:auto}
body{margin:0;font-family:var(--f);font-size:16px;line-height:1.7;color:var(--ink);background:#fff;letter-spacing:-.01em;word-break:keep-all;overflow-wrap:anywhere;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}
body.is-locked{overflow:hidden}
img,video,svg{display:block;max-width:100%}
img{height:auto}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit;letter-spacing:inherit}
button{background:none;border:0;padding:0;cursor:pointer}
h1,h2,h3,h4,h5,h6,p,ul,ol,dl,dd,figure{margin:0;padding:0}
ul,ol{list-style:none}
em,i,b,strong{font-style:normal}
table{border-collapse:collapse;width:100%}
:focus-visible{outline:2px solid var(--blue);outline-offset:3px;border-radius:4px}
::selection{background:var(--blue);color:#fff}
[hidden]{display:none!important}
.sr{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.skip{position:fixed;left:16px;top:-60px;z-index:200;background:var(--ink);color:#fff;padding:10px 16px;border-radius:var(--r-s);font-size:14px}
.skip:focus{top:16px}

.wrap{width:100%;max-width:calc(var(--wrap) + var(--pad)*2);margin:0 auto;padding:0 var(--pad)}
.wrap--narrow{max-width:calc(1120px + var(--pad)*2)}
.sec{padding:var(--sec) 0}
.sec--tight{padding:calc(var(--sec)*.62) 0}
.sec--gray{background:var(--g0)}
.sec + .sec--flush{padding-top:0}

/* ---------- type ---------- */
.eyebrow{display:inline-flex;align-items:center;gap:12px;font-size:13px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--blue);line-height:1}
.eyebrow::after{content:"";width:28px;height:1px;background:currentColor;opacity:.55}
.eyebrow--plain::after{display:none}
.eyebrow--light{color:rgba(255,255,255,.78)}
.h-display{font-size:clamp(38px,4.6vw,72px);line-height:1.2;font-weight:700;letter-spacing:-.045em}
.h-sec{font-size:clamp(28px,3.05vw,46px);line-height:1.32;font-weight:700;letter-spacing:-.04em;color:var(--ink)}
.h-sec .hl{color:var(--blue)}
.h-card{font-size:clamp(20px,1.6vw,24px);line-height:1.4;font-weight:700;letter-spacing:-.03em}
.lead{font-size:clamp(16px,1.25vw,18px);line-height:1.75;color:var(--g6);letter-spacing:-.015em}
.body{font-size:16px;line-height:1.8;color:var(--g6)}
.sm{font-size:14px;line-height:1.65;color:var(--g5)}
.en .h-display,.en .h-sec{letter-spacing:-.03em}
.nobr{white-space:nowrap}
br.m{display:none}
@media (max-width:768px){br.pc{display:none}br.m{display:inline}}

/* section heading blocks */
.head{display:flex;align-items:flex-end;justify-content:space-between;gap:40px;margin-bottom:clamp(40px,4.4vw,64px)}
.head__t{display:flex;flex-direction:column;gap:20px;max-width:760px}
.head__d{max-width:440px;color:var(--g6);font-size:16px;line-height:1.75;padding-bottom:6px}
.head--center{flex-direction:column;align-items:center;text-align:center}
.head--center .head__t{align-items:center}
@media (max-width:900px){.head{flex-direction:column;align-items:flex-start;gap:20px}.head--center{align-items:center}}

/* ---------- buttons ---------- */
.btn{--bh:56px;display:inline-flex;align-items:center;justify-content:center;gap:14px;height:var(--bh);padding:0 26px 0 28px;border-radius:var(--r-s);font-size:16px;font-weight:600;letter-spacing:-.01em;line-height:1;white-space:nowrap;transition:background-color .35s var(--ease),color .35s var(--ease),border-color .35s var(--ease)}
.btn .ar{width:18px;height:18px;flex:none;transition:transform .45s var(--ease)}
.btn:hover .ar{transform:translateX(4px)}
.btn--blue{background:var(--blue);color:#fff}
.btn--blue:hover{background:var(--blue-d)}
.btn--ink{background:var(--ink);color:#fff}
.btn--ink:hover{background:#000}
.btn--white{background:#fff;color:var(--ink)}
.btn--white:hover{background:var(--blue-l)}
.btn--line{border:1px solid var(--g3);color:var(--ink);background:#fff}
.btn--line:hover{border-color:var(--ink)}
.btn--ghost{border:1px solid rgba(255,255,255,.55);color:#fff}
.btn--ghost:hover{background:#fff;color:var(--ink);border-color:#fff}
.btn--s{--bh:46px;padding:0 20px;font-size:15px}
.btn[disabled]{opacity:.45;pointer-events:none}

.tlink{display:inline-flex;align-items:center;gap:10px;font-size:15px;font-weight:600;color:var(--ink);padding-bottom:6px;position:relative;white-space:nowrap}
.tlink::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:currentColor;transform-origin:right;transition:transform .5s var(--ease)}
.tlink:hover::after{transform:scaleX(.0);transform-origin:right}
.tlink:hover{color:var(--blue)}
.tlink .ar{width:16px;height:16px;transition:transform .45s var(--ease)}
.tlink:hover .ar{transform:translateX(4px)}
.tlink--blue{color:var(--blue)}

.circ{width:48px;height:48px;border-radius:50%;border:1px solid currentColor;display:inline-grid;place-items:center;flex:none;transition:background-color .4s var(--ease),border-color .4s var(--ease),color .4s var(--ease)}
.circ svg{width:18px;height:18px;transition:transform .45s var(--ease)}

/* pills / tabs */
.pills{display:flex;flex-wrap:wrap;gap:8px}
.pill{height:44px;padding:0 22px;border-radius:999px;border:1px solid var(--g2);background:#fff;font-size:15px;font-weight:600;color:var(--g6);display:inline-flex;align-items:center;gap:8px;transition:all .3s var(--ease)}
.pill:hover{border-color:var(--g4);color:var(--ink)}
.pill.is-on{background:var(--ink);border-color:var(--ink);color:#fff}
.pill .n{font-size:12px;font-weight:600;opacity:.6}

.tag{display:inline-flex;align-items:center;height:24px;padding:0 9px;border-radius:4px;font-size:11px;font-weight:700;letter-spacing:.08em;background:var(--blue-l);color:var(--blue)}
.tag--ink{background:var(--ink);color:#fff}
.tag--line{background:transparent;border:1px solid var(--g3);color:var(--g6)}

/* ---------- reveal ---------- */
[data-rv]{opacity:0;transform:translate3d(0,36px,0);transition:opacity 1s var(--ease),transform 1.1s var(--ease);transition-delay:var(--d,0s)}
[data-rv="fade"]{transform:none}
[data-rv="left"]{transform:translate3d(-40px,0,0)}
[data-rv="scale"]{transform:scale(.96)}
[data-rv].is-in{opacity:1;transform:none}
.no-js [data-rv]{opacity:1;transform:none}
.mask{display:block;overflow:hidden;padding-bottom:.08em;margin-bottom:-.08em}
.mask > span{display:block;transform:translate3d(0,105%,0);transition:transform 1.15s var(--ease);transition-delay:var(--d,0s)}
.is-in .mask > span,.mask.is-in > span{transform:none}
@media (prefers-reduced-motion:reduce){[data-rv],.mask > span{opacity:1!important;transform:none!important;transition:none!important}}

/* media frame */
.ph{position:relative;overflow:hidden;background:var(--g1)}
.ph img{width:100%;height:100%;object-fit:cover}
.ph--zoom img{transition:transform 1.2s var(--ease)}