/* Original production header rules, shared across every page. */
:root { --font-sans:Inter,"Noto Sans KR",Arial,sans-serif; --font:var(--font-sans); }
body,body *,body *::before,body *::after { font-family:var(--font-sans) !important; }
body { font-size:16px; line-height:1.7; }
.topline { height:35px; padding:0 max(28px, calc((100vw - 1280px)/2)); background:var(--ink-deep); color:#dbeaf0; display:flex; align-items:center; justify-content:space-between; font:500 10px/1.2 "DM Mono",monospace; letter-spacing:.1em; text-transform:uppercase; }
.topline p { margin:0; }
.topline a { color:#fff; }
.signal { width:7px; height:7px; display:inline-block; background:#93cab6; border-radius:50%; margin:0 8px 1px 0; box-shadow:0 0 0 4px rgba(147,202,182,.13); }
.site-header { height:90px; padding:0 max(28px, calc((100vw - 1280px)/2)); display:flex; align-items:center; gap:26px; position:relative; z-index:3; background:rgba(255,253,250,.95); border-bottom:1px solid rgba(14,39,64,.08); }
.brand { display:flex; align-items:center; gap:13px; min-width:388px; }
.brand-logo { display:block; width:224px; height:auto; }
.brand-identity { padding-left:13px; border-left:1px solid rgba(14,39,64,.16); }
.brand-identity b { display:block; color:var(--ink); font-weight:800; font-size:11px; letter-spacing:.075em; line-height:1.15; }
.brand-identity small { display:block; margin-top:3px; color:var(--slate); font:500 7px/1.4 "DM Mono",monospace; letter-spacing:.11em; }
.site-header nav { display:flex; gap:27px; margin-left:auto; }
.site-header nav a { font-size:12px; font-weight:700; letter-spacing:.02em; position:relative; }
.site-header nav a:after { content:""; position:absolute; bottom:-7px; left:0; width:0; height:1px; background:var(--ocean); transition:.25s; }
.site-header nav a:hover:after { width:100%; }
.header-actions { display:flex; gap:12px; align-items:center; }
.language-toggle { cursor:pointer; border:0; background:transparent; color:var(--ocean); font:500 10px "DM Mono",monospace; letter-spacing:.04em; padding:8px; }
@media (max-width:900px) {
.site-header {gap:14px}
.site-header nav {display:none}
.brand {min-width:0}
.header-actions {margin-left:auto}
}
@media (max-width:620px) {
.topline {padding:0 17px;font-size:8px}
.topline p {max-width:260px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.site-header {height:70px;padding:0 17px}
.brand {min-width:0}
.brand-logo {width:184px}
.brand-identity {display:none}
.header-actions .button {display:none}
.language-toggle {padding:7px 0}
}
.topline { height:34px; background:#008cbf; color:#fff; font-size:9px; letter-spacing:.06em; }
.topline a { color:#fff; font-weight:800; }
.signal { background:#fff; box-shadow:none; }
.site-header { height:82px; background:#fff; border-bottom:1px solid #e7eef1; box-shadow:none; }
.brand-logo { width:214px; }
.brand-identity { border-color:#dbe5e9; }
.brand-identity b { color:#183248; font-size:10px; }
.brand-identity small { color:#687781; font-size:7px; }
.site-header nav a { color:#405a69; font-size:11px; font-weight:700; }
.site-header nav a:after { bottom:-9px; background:#008cbf; }
.language-toggle { color:#008cbf; font-size:10px; font-weight:800; }
@media (max-width:620px) {
.site-header { height:70px; }
.brand-logo { width:178px; }
}
.topline { background:#111315; color:#f5f2ed; }
.topline a { font-size:11px; letter-spacing:.03em; }
.signal { background:#b7663f; }
.site-header { border-bottom-color:#e5e1da; }
.brand-identity b { color:#111315; }
.brand-identity small { color:#1c3147; }
.site-header nav a { color:#1c3147; }
.site-header nav a:after { background:#b7663f; }
.language-toggle { color:#1c3147; }
.site-header { background:#fcfaf6; border-bottom-color:#e6ddd1; }
@media (max-width:620px) {
.topline p { display:none; }
.topline { justify-content:flex-end; }
}
@media (max-width:620px) {
.topline { height:auto; min-height:50px; padding:8px 18px; align-items:center; justify-content:space-between; gap:10px; letter-spacing:.04em; text-transform:none; }
.topline p { display:block; flex:1; max-width:none; white-space:normal; overflow:visible; text-overflow:clip; font-size:8px; line-height:1.35; }
.topline a { flex:0 0 auto; font-size:10px; white-space:nowrap; }
}
@media (max-width:620px) {
.language-toggle { min-width:44px; min-height:44px; display:inline-flex; align-items:center; justify-content:center; }
}
@supports (padding:max(0px)) {
@media (max-width:620px) {
.topline,.site-header { padding-left:max(18px, env(safe-area-inset-left)); padding-right:max(18px, env(safe-area-inset-right)); }
}
}
.mobile-calculator-link { display:none; }
@media (max-width:620px) {
.header-actions { gap:8px; }
.mobile-calculator-link,.language-toggle { min-height:44px; display:inline-flex; align-items:center; padding:0 7px; color:var(--ocean); font:800 10px/1 var(--font-sans); letter-spacing:0; white-space:nowrap; }
.mobile-calculator-link { display:inline-flex; }
}
@media (max-width:360px) {
.site-header { padding-left:14px; padding-right:14px; gap:6px; }
.brand-logo { width:150px; }
.header-actions { gap:3px; }
.language-toggle,.mobile-calculator-link { min-width:39px; min-height:39px; padding:0 5px; font-size:9px; }
}

/* Same calculator type scale in the homepage and full calculator. */
.calc-title {font-size:23px;font-weight:800;line-height:1.3;letter-spacing:-.02em;}
.calc-subtitle,.result-sub {font-size:13px;line-height:1.7;font-weight:400;}
.calc-tab {font-size:11px;font-weight:800;min-height:44px;}
.input-field label {font-size:12px;font-weight:500;line-height:1.5;letter-spacing:0;}
.input-wrap {min-height:44px;}
.input-wrap input,.input-wrap select {font-size:16px;font-weight:700;}
.result-main {font-size:37px;font-weight:800;line-height:1.3;}
.result-metrics span {font-size:11px;line-height:1.6;}
.result-metrics strong {font-size:14px;font-weight:700;}
.calculator-disclaimer,.disclaimer {font-size:12px;line-height:1.7;}
.site-header .button-small {padding:12px 15px;font-size:10px;font-weight:800;line-height:1;}
html { -webkit-text-size-adjust:100%; text-size-adjust:100%; }
html[lang^="ko"] :is(h1,h2,h3,p,li,label) {word-break:keep-all;overflow-wrap:break-word;}
@media(max-width:620px) {
 .site-header {min-height:70px;}
 .brand {flex-shrink:1;max-width:none;}
 .header-actions {flex-shrink:0;margin-left:auto;}
 .brand-logo {max-width:100%;}
 .calc-tab {font-size:10px;}
 .result-main {font-size:34px;}
 .input-grid {grid-template-columns:1fr;}
 .calculator-tabs {margin:0;max-width:100%;overflow-x:auto;}
 .calculator-body,.calculator-result {min-width:0;}
}
/* Homepage type scale also applies to the standalone calculator hero. */
.hero h1 {font-size:clamp(45px,4.7vw,68px);font-weight:800;line-height:1.09;letter-spacing:-.04em;}
.hero h1 em {font-weight:800;}
.hero>p:not(.eyebrow) {font-size:15px;line-height:1.8;}
@media(max-width:620px) {
 .hero h1 {font-size:clamp(36px,10vw,44px);}
 .hero>p:not(.eyebrow) {font-size:15px;}
}