/* One shared design system. All type, including diagrams, uses locally served Pretendard. */
:root {
  --font-body:'Pretendard Variable',Pretendard,sans-serif;
  --font-display:var(--font-body); --font-mono:var(--font-body);
  --bg:#f2f5f9; --surface:#fff; --surface-2:#eaf0f6;
  --ink:#121827; --ink-soft:#3e4859; --ink-muted:#515e70; --ink-faint:#647084;
  --accent:#7b2945; --accent-soft:#f6edf1; --accent-light:#d9b7c3;
  --line:#dce2ea; --line-strong:#b5bfcc;
  --r-sm:12px; --r-md:20px; --r-lg:28px; --r-pill:999px;
  --t-h1:clamp(2.75rem,6.1vw,5.5rem); --t-h2:clamp(2rem,4vw,3.5rem);
  --t-label:.8125rem; --section-space:112px;
}
*,*::before,*::after { box-sizing:border-box; }
html { scroll-padding-top:var(--header-offset,110px); }
body { margin:0; background:var(--bg); color:var(--ink); font-family:var(--font-body); font-size:18px; line-height:1.7; -webkit-font-smoothing:antialiased; }
[hidden] { display:none !important; }
h1,h2,h3,h4,p,figure { margin:0; }
h1,h2,h3,h4 { font-weight:650; line-height:1.22; word-break:keep-all; overflow-wrap:anywhere; }
h1,h2 { letter-spacing:-.03em; text-wrap:balance; }
h1 { font-size:var(--t-h1); }
h2 { font-size:var(--t-h2); }
h3 { font-size:26px; letter-spacing:-.02em; }
p { word-break:keep-all; overflow-wrap:anywhere; text-wrap:pretty; }
a { color:inherit; text-underline-offset:4px; }
a:hover { color:var(--accent); }
button,input,select,textarea { font:inherit; }
button,a,input,select,textarea { -webkit-tap-highlight-color:transparent; }
:focus-visible { outline:3px solid var(--accent); outline-offset:5px; }
.skip-link { position:fixed; z-index:30; top:16px; left:20px; padding:11px 22px; border-radius:var(--r-pill); background:#121318; color:#fff; font-size:15px; font-weight:600; text-decoration:none; transform:translateY(calc(-100% - 24px)); }
.skip-link:hover { color:#fff; }
.skip-link:focus-visible { transform:none; outline-offset:3px; }
/* A native fragment target works without JS; it must not capture text clicks. */
.skip-target { pointer-events:none; }
img,svg { display:block; max-width:100%; }
.wrap { width:min(1280px,calc(100% - 96px)); margin-inline:auto; min-width:0; }
section { padding-block:var(--section-space); }
.eyebrow,.prod-kicker { font-size:var(--t-label); line-height:1.5; font-weight:700; letter-spacing:.15em; text-transform:uppercase; color:var(--accent); margin-bottom:20px; }
.sec-head,.philo-center { text-align:center; margin:0 auto 52px; }
.sec-head h2,.philo-center h2 { max-width:1000px; margin-inline:auto; }
.sec-head p,.page-header p { max-width:700px; margin:24px auto 0; color:var(--ink-muted); font-size:20px; line-height:1.8; }
.btn { display:inline-flex; align-items:center; justify-content:center; gap:16px; min-height:54px; padding:14px 28px; border:1px solid transparent; border-radius:var(--r-pill); font-size:16px; line-height:1.5; font-weight:600; text-decoration:none; cursor:pointer; transition:background .18s,color .18s,transform .18s; }
.btn-accent { color:#fff; background:#121318; }
.btn-accent:hover { color:#fff; background:#323746; transform:translateY(-2px); }
.btn-outline { border-color:var(--line-strong); background:transparent; }
.btn-outline:hover { background:#fff; border-color:var(--ink); }
.btn-sm { min-height:46px; padding:10px 22px; }
button:disabled { opacity:.45; cursor:not-allowed; transform:none; }
.hero-ctas { display:flex; justify-content:center; flex-wrap:wrap; gap:12px; margin-top:32px; }
header.site { position:sticky; top:0; z-index:20; background:rgba(242,245,249,.96); border-bottom:1px solid var(--line); backdrop-filter:blur(16px); }
.nav { min-height:88px; display:flex; align-items:center; gap:40px; }
.logo { display:inline-flex; align-items:center; gap:10px; min-height:44px; font-size:30px; font-weight:700; letter-spacing:-.045em; line-height:1; text-decoration:none; flex:none; }
.logo-mark { width:38px; height:38px; display:flex; align-items:center; justify-content:center; }
.logo-mark img { width:100%; height:100%; object-fit:contain; }
.navlinks { display:flex; gap:28px; align-items:center; margin-left:auto; }
.nav-item>a { display:block; padding:12px 0; font-size:16px; font-weight:550; text-decoration:none; }
.nav-item>a[aria-current=page] { color:var(--accent); }
.page-header { position:relative; text-align:center; padding:108px 0 100px; background:radial-gradient(ellipse at 23% 15%,#e6edf6 0,transparent 55%),radial-gradient(ellipse at 80% 45%,#e4eff6 0,transparent 55%); border-bottom:1px solid var(--line); }
.page-header h1 { max-width:1150px; margin-inline:auto; }
/* Connected white panels: borders belong to the group, never individual floating cards. */
.grid3,.reasons-grid,.metric-grid { display:grid; overflow:hidden; border:1px solid var(--line); border-radius:var(--r-lg); background:var(--line); gap:1px; }
.grid3 { grid-template-columns:repeat(2,minmax(0,1fr)); }
.reasons-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
.feat,.reason-card,.metric { min-width:0; background:var(--surface); padding:44px 40px; }
.feat-icon { width:40px; height:40px; color:var(--ink); margin-bottom:32px; flex:none; }
.feat h3,.reason-card h3 { margin-bottom:16px; }
.feat p,.reason-card p { font-size:17px; color:var(--ink-muted); line-height:1.8; }
.reason-num { display:block; color:var(--accent); font-size:14px; font-weight:650; letter-spacing:.08em; margin-bottom:24px; }
.reason-card .card-icon { width:38px; height:38px; margin-bottom:28px; }
.card-icon { fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; }
.cta-banner { padding-top:40px; }
.cta-box,.cta-banner>.wrap:not(:has(.cta-box)) { padding:80px 48px; border:1px solid var(--line); border-radius:32px; text-align:center; background:radial-gradient(ellipse at 15% 100%,#e3eaf4,transparent 65%),radial-gradient(ellipse at 100% 0,#f4e7ed,transparent 65%),#fff; }
.cta-banner h2 { font-size:clamp(1.75rem,3.1vw,2.75rem); margin-inline:auto; }
.cta-banner p { color:var(--ink-muted); margin:20px auto 0; max-width:700px; }
.cta-banner .btn { margin-top:32px; }
footer { background:#eaf0f6; border-top:1px solid var(--line); padding:72px 0 0; }
.foot-grid { display:flex; justify-content:space-between; align-items:flex-start; gap:48px; padding-bottom:64px; }
.foot-brand .logo { margin-bottom:16px; }
.foot-brand p { font-size:15px; line-height:1.8; color:var(--ink-muted); margin-top:14px; }
.foot-brand a[href^=mailto] { display:inline-flex; align-items:center; min-height:44px; color:var(--accent); text-decoration:none; }
.foot-links { list-style:none; padding:0; margin:0; display:flex; flex-wrap:wrap; gap:0 32px; }
.foot-links a { display:inline-flex; align-items:center; min-width:44px; min-height:44px; font-size:16px; text-decoration:none; }
.foot-bottom { border-top:1px solid var(--line-strong); padding:12px 0; color:var(--ink-muted); font-size:14px; }
.foot-bottom a { display:inline-flex; align-items:center; min-width:44px; min-height:44px; text-decoration:none; }
.not-found { min-height:62vh; display:flex; align-items:center; }
.not-found .btn { margin-top:36px; }
/* Legal text keeps its full table contents. Tables scroll locally; wide tables stack per row on phones. */
.prose { max-width:1120px; font-size:18px; line-height:1.9; }
.prose p,.prose ul,.prose ol,.prose pre,.prose blockquote { margin:0 0 1.4em; }
.prose h2 { font-size:32px; margin:2em 0 1em; }
.prose h3 { font-size:26px; margin:2.5em 0 1em; }
.prose ul,.prose ol { padding-left:24px; }
.prose li+li { margin-top:8px; }
.prose li>ul { margin-top:8px; }
.prose a { color:var(--accent); }
.prose table { display:block; width:100%; overflow:auto; border-collapse:collapse; margin:24px 0; border:1px solid var(--line); border-radius:12px; background:#fff; }
.prose th,.prose td { min-width:145px; padding:18px; text-align:left; border:1px solid var(--line); font-size:16px; overflow-wrap:anywhere; }
.prose th { background:var(--surface-2); font-weight:650; }
.prose pre { padding:24px; overflow:auto; background:#fff; border-radius:12px; }
.prose code { font-family:var(--font-body); }
.prose blockquote { border-left:2px solid var(--accent); padding-left:24px; }
.prose hr { border:0; border-top:1px solid var(--line); margin-block:40px; }
.visually-hidden { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
@media(min-width:901px) {
 .nav-ctas { margin-left:12px; }
 /* Reason cards read as rows on wide screens so each sentence keeps to one line. */
 .reasons-grid { grid-template-columns:minmax(0,1fr); }
 .reason-card { display:grid; grid-template-columns:48px minmax(0,240px) minmax(0,1fr); grid-template-areas:"icon num desc" "icon title desc"; column-gap:32px; align-items:center; padding:36px 44px; }
 .reason-card .card-icon { grid-area:icon; margin:0; }
 .reason-card .reason-num { grid-area:num; margin:0 0 4px; align-self:end; }
 .reason-card h3 { grid-area:title; margin:0; align-self:start; }
 .reason-card p { grid-area:desc; font-size:18px; color:var(--ink-soft); }
}
@media(max-width:1100px) {
 .wrap { width:calc(100% - 64px); }
 .nav { gap:24px; } .navlinks { gap:20px; }
 .feat,.reason-card,.metric { padding:32px; }
 .foot-grid { flex-direction:column; gap:16px; }
}
/* A six-column legal table needs about 935px, so it stacks per row below that. */
@media(max-width:960px) {
 .prose table.stacked { display:block; overflow:visible; border:0; border-radius:0; background:none; }
 .prose table.stacked thead { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
 .prose table.stacked tbody { display:grid; gap:16px; }
 .prose table.stacked tr { display:block; padding:6px 18px; border:1px solid var(--line); border-radius:12px; background:#fff; }
 .prose table.stacked td { display:block; min-width:0; padding:12px 0; border:0; }
 .prose table.stacked td+td { border-top:1px solid var(--line); }
 .prose table.stacked td:first-child { font-weight:650; }
 /* The visible column name is for sighted readers; the header cell already names it for screen readers. */
 .prose table.stacked td+td::before { content:attr(data-label); content:attr(data-label) / ""; display:block; color:var(--ink-soft); font-size:14px; font-weight:650; }
}
@media(max-width:760px) {
 :root { --section-space:72px; }
 body { font-size:17px; }
 .wrap { width:calc(100% - 40px); }
 .nav { min-height:116px; flex-wrap:wrap; gap:0; padding-top:12px; padding-bottom:6px; }
 .nav .logo { font-size:27px; } .logo-mark { width:32px; height:32px; }
 .nav-ctas { margin-left:auto; }
 .nav-ctas .btn { min-height:44px; font-size:14px; padding:9px 18px; }
 .navlinks { order:3; width:100%; margin:6px 0 0; justify-content:space-between; gap:0; }
 .nav-item>a { font-size:14px; padding:10px 2px; min-height:44px; }
 html { scroll-padding-top:var(--header-offset,145px); }
 .page-header { padding:72px 0; }
 .page-header p,.sec-head p { font-size:18px; }
 .sec-head,.philo-center { margin-bottom:36px; }
 .eyebrow,.prod-kicker { margin-bottom:16px; font-size:12px; }
 .grid3,.reasons-grid { grid-template-columns:minmax(0,1fr); border-radius:22px; }
 .feat,.reason-card { padding:32px 28px; }
 h3 { font-size:25px; }
 .feat p,.reason-card p { font-size:17px; }
 .feat-icon { margin-bottom:24px; }
 .cta-banner { padding-top:16px; }
 .cta-box,.cta-banner>.wrap:not(:has(.cta-box)) { padding:48px 24px; border-radius:24px; }
 .cta-banner h2 { font-size:28px; }
 br.cb { display:none; }
 footer { padding-top:48px; }
 .foot-grid { padding-bottom:32px; }
 .foot-brand p { max-width:100%; }
 .foot-links { gap:0 16px; }
 .foot-links a { font-size:15px; }
 .foot-bottom { font-size:12px; }
 .prose { font-size:17px; }
 .prose h3 { font-size:23px; }
 .prose th,.prose td { padding:14px; }
}
@media(prefers-reduced-motion:reduce) {
 *,*::before,*::after { animation:none !important; transition:none !important; scroll-behavior:auto !important; }
}
.card-icon .icon-filter,.card-icon .icon-route { display:none; }
.reason-card:nth-child(3n+2) .icon-clock,.reason-card:nth-child(3n) .icon-clock { display:none; }
.reason-card:nth-child(3n+2) .icon-filter,.reason-card:nth-child(3n) .icon-route { display:initial; }
/* Keep long Korean legal titles intact even at 320px. */
.legal-header h1 { font-size:clamp(2rem,6.1vw,5.5rem); }
