/* Shared tool-page design measurements, matched to ezran.my. */
body{font-family:Arial,Helvetica,sans-serif;font-size:16px;line-height:1.65}
.site-header{position:fixed;z-index:20;top:18px;left:0;right:0;width:min(1340px,calc(100% - 48px));margin:auto;padding:0;border:1px solid #9abbff24;border-radius:14px;background:#080f1acc;box-shadow:0 12px 44px #0003;backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px)}
.site-header .nav-wrap{width:calc(100% - 48px);max-width:none;height:72px;min-height:0;margin:auto;padding:0;border:0;border-radius:0;background:none;box-shadow:none;backdrop-filter:none;display:flex;align-items:center;justify-content:space-between;gap:30px;flex-wrap:nowrap}
.wordmark{font-size:25px;font-weight:800;letter-spacing:.09em;line-height:1;color:#f4f6fb;text-decoration:none}.wordmark span{color:#568cff}
.site-header nav{display:flex;align-items:center;gap:28px;width:auto;position:static;padding:0}
.site-header nav a{font-size:13px;line-height:1.65;font-weight:400;min-height:44px;padding:0;color:#b5bdcd;text-decoration:none}
.site-header nav a:hover,.site-header nav a[aria-current]{color:white}
.site-header nav .nav-contact{border:1px solid #91b8ff40;border-radius:6px;background:#3866ab12;padding:12px 19px;color:white;display:flex;gap:24px;align-items:center;white-space:nowrap;margin:0}
.site-header .menu-toggle{display:none}
.container,.calculator-hero,.tabs-wrapper,.content,.calculator-footer{width:min(1240px,calc(100% - 112px));max-width:none;margin-inline:auto;padding-inline:0}
.tools-hero,.calculator-hero,.hero{padding-top:190px;padding-bottom:36px}
.tools-hero h1,.calculator-hero h1,.hero h1{font-family:Arial,Helvetica,sans-serif;font-size:clamp(64px,8.3vw,120px);font-weight:800;letter-spacing:-.07em;line-height:.96;max-width:none;margin:0;text-shadow:0 6px 50px #0005}
.tools-hero .eyebrow,.brand-row,.hero-meta{font-size:11px;line-height:1.6;font-weight:600;letter-spacing:.2em;margin:0 0 30px;min-height:17.6px}
.hero-meta a{min-height:0;line-height:1.6}.hero-meta>span,.currency-tag{font-size:9px;font-weight:400;letter-spacing:.08em}
.calculator-hero>p,.hero>p{font-size:17px;line-height:1.7;margin-top:30px;max-width:640px;color:#b7c0d1}.hero .hero-assumptions,.calculator-hero .compat-style-1{font-size:12px;line-height:1.8;margin-top:10px}
.calculator-footer{padding-top:26px}.content{padding-top:24px;padding-bottom:36px}.tabs-wrapper{margin-top:24px}
@media(max-width:800px){
 .container,.calculator-hero,.tabs-wrapper,.content,.calculator-footer{width:calc(100% - 48px)}
 .site-header{top:12px;width:calc(100% - 24px);border-radius:10px}
 .site-header .nav-wrap{width:calc(100% - 32px);height:64px}
 .js .site-header .menu-toggle{display:flex;align-items:center;gap:16px;border:1px solid #252e40;background:transparent;color:white;padding:9px 13px;min-width:70px;min-height:44px;font-size:13px;line-height:1.65;font-family:inherit;font-weight:400;border-radius:0}
 .js .site-header nav{display:none;position:absolute;top:76px;left:0;right:0;border:1px solid #a1bded30;background:#091321f5;border-radius:10px;padding:16px;flex-direction:column;align-items:stretch;gap:0;width:auto}
 .js .site-header nav.is-open{display:flex}
 .js .site-header nav a{font-size:15px;padding:10px 12px;min-height:48px}
 .js .site-header nav .nav-contact{margin-top:8px;padding:12px 16px;justify-content:space-between}
 .tools-hero,.calculator-hero,.hero{padding-top:150px}
 .tools-hero h1,.calculator-hero h1,.hero h1{font-size:clamp(58px,10vw,84px)}
 .calculator-hero>p,.hero>p{font-size:16px}
 body:not(.js) .site-header{position:relative;top:12px;margin-bottom:12px}
 body:not(.js) .site-header .nav-wrap{height:auto;padding:22px 0;flex-wrap:wrap}
 body:not(.js) .site-header nav{flex-wrap:wrap;gap:16px}
}
@media(max-width:540px){
 .container,.calculator-hero,.tabs-wrapper,.content,.calculator-footer{width:calc(100% - 40px)}
 .site-header .nav-wrap{width:calc(100% - 40px)}
 .wordmark{font-size:24px}
 .tools-hero,.calculator-hero,.hero{padding-top:140px;padding-bottom:28px}
 .tools-hero h1,.calculator-hero h1,.hero h1{font-size:clamp(48px,12.6vw,68px)}
 .tools-hero .eyebrow,.brand-row,.hero-meta{font-size:9px;letter-spacing:.13em;margin-bottom:30px}
 .calculator-hero>p,.hero>p{font-size:15px;margin-top:25px}
 .hero .hero-assumptions,.calculator-hero .compat-style-1{font-size:12px;margin-top:10px}
 .currency-tag,.hero-meta>span{font-size:8px;letter-spacing:.03em}
}
.brand-row,.hero-meta{position:relative;height:17.6px;min-height:0}.brand-row .currency-tag,.hero-meta>span{position:absolute;right:0;top:50%;transform:translateY(-50%)}
.tools-hero .hero-copy{max-width:none}.tools-hero .intro{font-size:17px;line-height:1.7;letter-spacing:normal;margin-top:30px}.tools-hero .hero-description{font-size:17px;line-height:1.7}
@media(max-width:800px){.tools-hero .intro,.tools-hero .hero-description{font-size:16px}}
@media(max-width:540px){.tools-hero .intro,.tools-hero .hero-description{font-size:15px}.tools-hero .intro{margin-top:25px}}
@media(max-width:540px){.tabs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}.tabs .tab-btn{min-width:0;white-space:normal;line-height:1.35;min-height:48px}}

/* Fit longer calculator titles on the narrowest phones without splitting words. */
@media(max-width:360px){.calculator-hero h1,.hero h1{font-size:40px}}

/* Match the main-page mobile wordmark and inner header gutters. */
@media(max-width:540px){.site-header .nav-wrap{width:calc(100% - 32px)}.site-header .wordmark{font-size:25px}}
@media(max-width:800px){.js .site-header nav{max-height:calc(100vh - 100px);max-height:calc(100dvh - 100px);overflow-y:auto;overscroll-behavior:contain}}

/* Keep legal-page text clear of the shared fixed header. */
.js .privacy-page{padding-top:190px}.privacy-page p,.privacy-page h1,.privacy-page h2{max-width:720px}
@media(max-width:800px){.js .privacy-page{padding-top:140px}}