/* Metricpedia master calculator page: visual template. Global tokens live in ../css/tokens.css */
.calculator-page{font-size:14px}
.calculator-page .calc-hero{min-height:338px;background:linear-gradient(90deg,#f2f6fc 0%,rgba(242,246,252,.99) 36%,rgba(242,246,252,.76) 52%,rgba(242,246,252,.03) 76%),url("https://images.pexels.com/photos/6474471/pexels-photo-6474471.jpeg?auto=compress&cs=tinysrgb&w=1800") center right /cover no-repeat}
.calc-hero-inner{max-width:1330px;width:92%;margin:auto;padding:24px 0 27px}
.calc-crumb{display:flex;gap:13px;align-items:center;flex-wrap:wrap;color:#53647c;font-size:11px}
.calc-crumb a{color:inherit;text-decoration:none}
.calc-hero h1{font-size:clamp(43px,4.5vw,64px);letter-spacing:-2.4px;line-height:1.05;margin:25px 0 8px;color:#09142c}
.calc-hero h2{font-size:20px;color:#14233c;line-height:1.35}
.calc-hero-inner>p{max-width:565px;font-size:15px;line-height:1.5;margin:12px 0;color:#3c4c67}
.calc-benefits{display:flex;gap:26px;flex-wrap:wrap;margin-top:24px}
.calc-benefits>div{display:flex;align-items:center;gap:12px}
.calc-benefits span{font-size:29px;color:var(--mp-accent)}
.calc-benefits b{font-size:13px;color:#102344}
.calc-benefits small{display:block;margin-top:3px;font-size:11px;font-weight:400;color:#5d708a}
.calc-shell{width:92%;max-width:1330px;margin:20px auto 30px}
.calc-top{display:grid;grid-template-columns:minmax(0,1.57fr) minmax(265px,.91fr) minmax(230px,.84fr);gap:14px;align-items:stretch}
.calc-panel{border:1px solid var(--mp-border);background:var(--mp-card-bg);border-radius:9px;padding:16px;min-width:0;color:var(--mp-text)}
.calc-panel h2{font-size:22px;letter-spacing:-.5px;line-height:1.2}
.section-sub{font-size:12px;margin-top:6px;color:var(--mp-muted)}
.calc-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));background:#f1f5fa;border-radius:7px;gap:0;margin-top:19px}
.calc-tabs button{font-size:12px;padding:13px 4px;color:#5c6b85;border-bottom:2px solid transparent;cursor:pointer}
.calc-tabs .active{color:var(--mp-accent);border-bottom-color:var(--mp-accent);font-weight:700;background:#e8f1ff}
.calc-subtabs{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0 11px}
.calc-subtabs button{border:1px solid var(--mp-border);background:var(--mp-card-bg);color:var(--mp-muted);padding:7px 10px;border-radius:6px;font-size:11px;cursor:pointer}
.calc-subtabs button.chosen{color:var(--mp-accent);border-color:var(--mp-accent);font-weight:700}
.calc-fields{display:grid;gap:15px;padding:14px 0 9px}
.calc-fields label{font-weight:600;font-size:12px;display:grid;grid-template-columns:35% minmax(0,1fr);align-items:center;column-gap:11px;row-gap:3px}
.calc-fields label>span{display:flex;min-width:0;gap:7px}
.calc-fields input,.calc-fields select{background:var(--mp-card-bg);border:1px solid var(--mp-border);border-radius:6px;min-height:36px;color:var(--mp-text);font:inherit;padding:7px;min-width:0}
.calc-fields input{width:59%;flex:1}
.calc-fields select{width:40%;font-size:11px;flex:0 1 auto}
.calc-fields small{grid-column:2;font-size:10px;color:var(--mp-muted);font-weight:400}
.calc-fields .stepper{max-width:185px;display:flex;gap:0;border:1px solid var(--mp-border);border-radius:6px;overflow:hidden;align-items:center}
.stepper button{padding:8px 12px;color:var(--mp-accent);cursor:pointer;font-size:16px}
.stepper output{flex:1;min-width:32px;text-align:center;font-weight:600}
.calc-submit{width:100%;border-radius:6px;margin-top:15px;padding:13px 9px;color:white;background:var(--mp-accent);font-weight:700;cursor:pointer}
.calc-submit:hover{background:var(--mp-accent-hover)}
.calc-results{background:linear-gradient(135deg,#eaf3ff,#f7faff)}
.calc-answer{display:flex;gap:15px;align-items:center;padding:32px 4px 25px}
.result-symbol{font-size:39px;color:var(--mp-accent)}
.calc-answer strong{font-size:clamp(23px,2.2vw,31px);letter-spacing:-1px;white-space:nowrap;color:#0a1735;display:block}
.calc-answer small{color:#62728f;font-size:12px;display:block;margin-top:5px}
.calc-result-breakdown{padding:12px;background:#ffffffb8;border-radius:7px}
.calc-result-breakdown>div{display:flex;justify-content:space-between;gap:9px;border-bottom:1px solid #dae5f4;padding:10px 0;font-size:12px}
.calc-result-breakdown>div:last-child{border-bottom:0}
.calc-result-breakdown span{color:#5d6d88}
.calc-result-breakdown b{text-align:right;color:#102342}
.calc-advice{margin-top:18px;padding:14px;background:#e3efff;border-radius:7px;color:#506784;font-size:11px;line-height:1.5}
.calc-advice b{color:#075aff;font-size:16px;margin-right:5px}
.calc-related h2{font-size:16px;margin-bottom:10px}
.related-item{display:flex;align-items:center;gap:10px;padding:7px;border:1px solid var(--mp-border);background:var(--mp-card-bg);border-radius:7px;margin:0 0 8px;text-decoration:none;color:var(--mp-text);min-height:65px}
.related-item img{width:66px;height:52px;object-fit:cover;border-radius:5px;flex:none}
.related-item span{flex:1;min-width:0}
.related-item b{font-size:11px;line-height:1.25;display:block}
.related-item small{font-size:10px;line-height:1.3;color:var(--mp-muted);display:block;margin-top:5px}
.related-item i{font-size:21px;font-style:normal;color:var(--mp-accent)}
.related-item:hover{border-color:var(--mp-accent)}
.calc-bottom{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:12px}
.calc-info h2{font-size:18px;margin-bottom:10px}
.calc-info>p{font-size:12px;color:var(--mp-muted);line-height:1.5}
.fact-box{background:var(--mp-surface);margin-top:18px;border-radius:7px;padding:15px}
.fact-box h3{font-size:13px}
.calc-info ul{list-style:none;margin:13px 0 0;padding:0;display:grid;gap:12px}
.calc-info li{position:relative;padding-left:20px;color:var(--mp-muted);font-size:12px;line-height:1.5}
.calc-info li:before{content:"✓";position:absolute;left:0;color:white;background:var(--mp-accent);border-radius:50%;height:14px;width:14px;text-align:center;font-size:10px;line-height:14px}
.tips-photo{height:120px;width:100%;object-fit:cover;border-radius:7px;margin:2px 0 0}
.calc-faq{margin-top:14px}
.calc-faq h2{font-size:20px;margin-bottom:12px}
.calc-faq details{border-top:1px solid var(--mp-border);padding:13px 3px}
.calc-faq summary{cursor:pointer;font-weight:600}
.calc-faq details p{font-size:12px;margin-top:9px;color:var(--mp-muted);line-height:1.5}
.is-hidden{display:none!important}
html[data-theme="dark"] .calculator-page .calc-hero{background-image:linear-gradient(90deg,#121c2c 0%,rgba(18,28,44,.99) 35%,rgba(18,28,44,.7) 55%,rgba(18,28,44,.1) 85%),url("https://images.pexels.com/photos/6474471/pexels-photo-6474471.jpeg?auto=compress&cs=tinysrgb&w=1800")}
html[data-theme="dark"] .calculator-page .calc-hero h1,html[data-theme="dark"] .calculator-page .calc-hero h2,html[data-theme="dark"] .calculator-page .calc-benefits b{color:#f0f5ff}
html[data-theme="dark"] .calculator-page .calc-hero p,html[data-theme="dark"] .calculator-page .calc-crumb,html[data-theme="dark"] .calculator-page .calc-benefits small{color:#c3d2e8}
html[data-theme="dark"] .calculator-page .calc-results{background:#202b3d}
html[data-theme="dark"] .calculator-page .calc-answer strong,html[data-theme="dark"] .calculator-page .calc-result-breakdown b{color:#f3f6ff}
html[data-theme="dark"] .calculator-page .calc-result-breakdown{background:#1b202a}
html[data-theme="dark"] .calculator-page .calc-result-breakdown>div{border-color:#37445b}
html[data-theme="dark"] .calculator-page .calc-result-breakdown span{color:#b4c4dc}
html[data-theme="dark"] .calculator-page .calc-advice{background:#253956;color:#cad9ed}
html[data-theme="dark"] .calculator-page .calc-tabs{background:#202b3d}
html[data-theme="dark"] .calculator-page .calc-tabs .active{background:#253956}
@media(max-width:1100px){.calc-top{grid-template-columns:minmax(0,1.5fr) minmax(270px,1fr)}.calc-related{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}.calc-related h2{grid-column:1/-1}.calc-related .related-item{margin:0}.calc-bottom{grid-template-columns:repeat(2,minmax(0,1fr))}.calc-bottom .calc-panel:last-child{grid-column:1/-1}}
@media(max-width:730px){.calculator-page .calc-hero{background-position:center,right center;background-size:cover}.calc-hero-inner{padding:17px 0 25px}.calc-hero h1{font-size:42px}.calc-hero h2{font-size:17px}.calc-benefits{gap:13px}.calc-top,.calc-bottom{grid-template-columns:1fr}.calc-related{display:block;grid-column:auto}.calc-related .related-item{margin-bottom:8px}.calc-bottom .calc-panel:last-child{grid-column:auto}.calc-fields label{grid-template-columns:1fr}.calc-fields small{grid-column:1}.calc-fields label>span{max-width:100%}.calc-tabs button{font-size:11px}}

/* Shared master Results icon: consistent calculator symbol across calculator types. */
.calculator-page .result-symbol{display:inline-flex;align-items:center;justify-content:center;flex:0 0 46px;line-height:1;color:var(--mp-accent)}
.calculator-page .result-symbol svg{width:46px;height:46px;display:block}
