:root{--calc-navy:#062f5b;--calc-blue:#1971b9;--calc-muted:#5d7895;--calc-line:#d8e6f2;--calc-surface:#f5f9fd;--calc-orange:#f47721}
*{box-sizing:border-box}.calculator-hero{padding-bottom:48px}.calculator-hero h1{max-width:850px;font-size:clamp(32px,4vw,52px);line-height:1.08}.calculator-main{padding:48px 0 72px;background:#fff}.calculator-layout{display:grid;grid-template-columns:minmax(0,1.04fr) minmax(360px,.96fr);gap:24px;align-items:start}.calculator-card,.calculator-results,.calculator-guide,.calculator-faq{border:1px solid var(--calc-line);border-radius:22px;background:linear-gradient(145deg,#f8fbff,#eef6fc);box-shadow:0 16px 34px -30px rgba(0,36,72,.4)}.calculator-card,.calculator-results{padding:30px}.calculator-card-header h2,.results-header h2,.calculator-guide h2,.calculator-faq h2{margin:0;color:var(--calc-navy);font-size:clamp(24px,3vw,34px);line-height:1.15}.calculator-card-header p:last-child,.results-header p:last-child{margin:10px 0 0;color:var(--calc-muted);line-height:1.6}.calculator-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:17px 14px;margin-top:26px}.calculator-fields label{position:relative;display:grid;gap:7px;color:var(--calc-navy);font-size:14px;font-weight:800}.calculator-fields input,.calculator-fields select{width:100%;min-height:48px;padding:11px 42px 11px 13px;border:1px solid #c7d9e8;border-radius:10px;background:#fff;color:var(--calc-navy);font:inherit;font-weight:600;outline:0}.calculator-fields input:focus,.calculator-fields select:focus{border-color:var(--calc-blue);box-shadow:0 0 0 3px rgba(25,113,185,.14)}.field-unit{position:absolute;right:14px;bottom:14px;color:var(--calc-muted);font-size:12px;font-weight:700}.calculator-fields label:has(select) .field-unit{display:none}.calculator-submit{width:100%;margin-top:24px;border:0;cursor:pointer}.calculator-helper{margin:12px 0 0;color:var(--calc-muted);font-size:13px;line-height:1.5}.calculator-error{margin:16px 0 0;padding:11px 13px;border-radius:9px;background:#fff1ec;color:#a44523;font-size:14px;line-height:1.45}.results-header{margin-bottom:22px}.result-primary{padding:22px;border-radius:16px;background:var(--calc-navy);color:#fff}.result-primary span,.result-primary small{display:block;color:#cfe0ee;font-size:14px}.result-primary strong{display:block;margin:6px 0 2px;color:#fff;font-size:clamp(32px,4vw,48px);line-height:1;font-variant-numeric:tabular-nums}.result-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;margin-top:18px;overflow:hidden;border:1px solid var(--calc-line);border-radius:14px;background:var(--calc-line)}.result-grid div{display:grid;gap:6px;padding:16px;background:#fff}.result-grid span{color:var(--calc-muted);font-size:13px}.result-grid strong{color:var(--calc-navy);font-size:20px;font-variant-numeric:tabular-nums}.result-note{margin-top:20px;padding-top:18px;border-top:1px solid var(--calc-line)}.result-note strong{color:var(--calc-navy);font-size:15px}.result-note p{margin:7px 0 0;color:var(--calc-muted);font-size:14px;line-height:1.55}.results-cta{width:100%;justify-content:center;margin-top:20px}.calculator-guide{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:30px;align-items:center;margin-top:28px;padding:30px}.calculator-guide p{color:var(--calc-muted);line-height:1.65}.calculator-guide figure{margin:0}.calculator-guide img{display:block;width:100%;height:auto;border-radius:12px;background:#fff}.calculator-guide figcaption{margin-top:8px;color:var(--calc-muted);font-size:12px}.calculator-faq{margin-top:28px;padding:30px}.calculator-faq h2{margin-bottom:18px}.calculator-faq details{border-top:1px solid var(--calc-line)}.calculator-faq summary{padding:16px 0;color:var(--calc-navy);font-weight:800;cursor:pointer}.calculator-faq p{margin:0 0 16px;color:var(--calc-muted);line-height:1.6}.pm-button{background:var(--calc-orange)}
 .calculator-pattern-stack{display:grid;gap:22px}.calculator-pattern-stack figure{padding-bottom:16px;border-bottom:1px solid var(--calc-line)}.calculator-pattern-stack figure:last-child{padding-bottom:0;border-bottom:0}.calculator-fields label[for="material"]{grid-column:1;grid-row:1}.calculator-fields label[for="pattern"]{grid-column:2;grid-row:1}
@media(max-width:900px){.calculator-layout,.calculator-guide{grid-template-columns:1fr}.calculator-guide{gap:18px}}
@media(max-width:600px){.calculator-main{padding:30px 0 52px}.calculator-card,.calculator-results,.calculator-guide,.calculator-faq{padding:20px;border-radius:16px}.calculator-fields{grid-template-columns:1fr;gap:14px;margin-top:21px}.calculator-fields label[for="material"],.calculator-fields label[for="pattern"]{grid-column:auto;grid-row:auto}.calculator-hero{padding-bottom:34px}.calculator-hero h1{font-size:32px}.result-grid strong{font-size:17px}}
.calculator-guide{display:none}.calculator-seo-copy{display:block;border:0;border-radius:0;background:transparent;box-shadow:none;padding:0!important;align-items:start}.calculator-seo-copy>div+div{margin-top:22px}.calculator-seo-copy h2,.calculator-seo-copy h3,.calculator-seo-copy p,.calculator-seo-copy ul{text-align:left}
@media(min-width:601px){.calculator-card,.calculator-results,.calculator-guide{padding:22px}.calculator-card-header p:last-child,.results-header p:last-child{margin-top:6px}.calculator-fields{gap:13px 12px;margin-top:20px}.results-header{margin-bottom:16px}.calculator-guide{gap:20px}}
@media(max-width:600px){.calculator-hero{padding:14px 0 18px}.calculator-hero .pm-breadcrumbs,.calculator-hero .pm-hero-copy{display:none}.calculator-hero .pm-eyebrow{margin-bottom:4px}.calculator-hero h1{font-size:24px;line-height:1.1}.calculator-main{padding:14px 0 30px}.calculator-layout{gap:12px}.calculator-card,.calculator-results{padding:14px;border-radius:14px}.calculator-card-header h2,.results-header h2{font-size:22px}.calculator-card-header p:last-child,.results-header p:last-child{font-size:12px;line-height:1.35;margin-top:5px}.calculator-fields{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 8px;margin-top:14px}.calculator-fields label{font-size:12px;gap:4px}.calculator-fields input,.calculator-fields select{min-height:44px;padding:8px 28px 8px 9px;font-size:12px}.field-unit{right:8px;bottom:13px;font-size:10px}.calculator-submit{min-height:44px;margin-top:14px;font-size:12px}.calculator-helper{margin-top:8px;font-size:10px;line-height:1.35}.results-header{margin-bottom:10px}.result-primary{padding:14px}.result-primary strong{font-size:32px}.result-grid{margin-top:10px}.result-grid div{padding:10px}.result-grid span{font-size:11px}.result-grid strong{font-size:16px}.result-note,.results-cta{display:none}}
@media(max-width:600px){.calculator-card,.calculator-results{padding:10px;border-radius:12px}.calculator-card-header h2,.results-header h2{font-size:20px}.calculator-card-header p:last-child,.results-header p:last-child,.calculator-helper{display:none}.calculator-fields{gap:7px 6px;margin-top:10px}.calculator-fields label{font-size:11px;gap:3px}.calculator-fields input,.calculator-fields select{min-height:40px;padding:6px 24px 6px 8px}.field-unit{bottom:11px;font-size:9px}.calculator-submit{min-height:40px;margin-top:10px}.result-primary{padding:11px}.result-primary strong{font-size:28px}.result-grid{margin-top:8px}.result-grid div{padding:8px}.result-grid strong{font-size:15px}}
@media(max-width:600px){.calculator-hero{padding:8px 0 10px}.calculator-hero .pm-breadcrumbs{display:flex!important;margin-bottom:8px;font-size:13px}.calculator-hero .pm-hero-copy{display:block!important;margin-top:7px;font-size:14px;line-height:1.45}.calculator-hero .pm-hero-copy p{margin:0}.calculator-hero h1{font-size:22px;line-height:1.08}.calculator-hero .pm-eyebrow{font-size:11px}}
@media(min-width:901px){.calculator-main .pm-container{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.calculator-layout{display:contents}.calculator-card,.calculator-results,.calculator-guide{min-width:0}.calculator-card,.calculator-results{padding:18px}.calculator-card-header h2,.results-header h2,.calculator-guide h2{font-size:24px}.calculator-guide{grid-column:auto;padding:18px;gap:14px}.calculator-guide img{max-height:190px;object-fit:contain}.calculator-guide p{font-size:13px}.calculator-pattern-stack{gap:10px}.calculator-faq{grid-column:1/-1}}
@media(min-width:901px){.calculator-main .pm-container{grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr) minmax(0,1fr);align-items:stretch}.calculator-card,.calculator-results,.calculator-guide{height:100%}.calculator-card-header,.results-header{min-height:94px}.calculator-results{display:flex;flex-direction:column}.calculator-results .results-cta{margin-top:auto}.calculator-guide{align-content:start}.calculator-guide figure{margin-top:0}}
@media(min-width:901px){.calculator-main .pm-container{grid-template-columns:repeat(2,minmax(0,1fr))}.calculator-guide{grid-column:1/-1}}
@media(min-width:901px){.calculator-card,.calculator-results{height:auto;align-self:start;padding:16px}.calculator-card-header,.results-header{min-height:0}.calculator-fields{margin-top:15px;gap:10px 12px}.calculator-fields input,.calculator-fields select{min-height:44px}.calculator-submit{margin-top:16px}.calculator-helper{margin-top:8px}.result-primary{padding:17px}.result-grid{margin-top:14px}.result-grid div{padding:13px}.result-note{margin-top:14px;padding-top:14px}.calculator-results .results-cta{margin-top:14px}}
@media(min-width:901px){.calculator-card .calculator-helper,.calculator-results .result-note,.calculator-results .results-cta{display:none}}
@media(min-width:901px){.calculator-card .calculator-helper{display:block;margin:4px 0 0;font-size:11px;line-height:1.3}.calculator-results .result-note{display:block;margin-top:8px;padding-top:8px}.calculator-results .result-note p{margin-top:4px;font-size:12px;line-height:1.35}.calculator-results .results-cta{display:flex;min-height:36px;margin-top:8px;padding:8px 12px;font-size:12px}}
.result-pattern-preview{margin-top:8px;padding-top:6px;border-top:1px solid var(--calc-line)}.result-pattern-preview figure{margin:0}.result-pattern-preview img{display:block;width:100%;max-height:150px;object-fit:contain;border-radius:8px;background:#fff}.result-pattern-preview figcaption{display:none}
.pattern-input-note{margin:10px 0 0;color:var(--calc-muted);font-size:16px;line-height:1.6}
@media(max-width:600px){.result-pattern-preview{margin-top:6px;padding-top:4px}.result-pattern-preview img{max-height:110px}.result-pattern-preview figcaption{font-size:10px}}
@media(max-width:600px){.pattern-input-note{margin:6px 0 0;font-size:12px;line-height:1.35}}
@media(min-width:601px){.result-pattern-preview img{max-height:none;height:auto;object-fit:initial;margin-left:0;margin-right:0}}
@media(min-width:601px){.results-header h2{max-width:100%;font-size:clamp(14px,1.45vw,19px);line-height:1.2;white-space:nowrap;letter-spacing:-.03em}}
.result-pattern-preview img{height:300px;object-fit:contain}
@media(max-width:600px){.result-pattern-preview img{height:180px;max-height:none;object-fit:contain;object-position:center}}
@media(min-width:601px){.calculator-submit,.calculator-results .results-cta{height:48px;min-height:48px;padding:0 16px;font-size:14px;font-weight:700;line-height:1;display:flex;align-items:center;justify-content:center}}
@media(min-width:901px){.calculator-card,.calculator-results{height:100%;align-self:stretch}}
@media(min-width:901px){.calculator-card{display:flex;flex-direction:column}.calculator-card .calculator-submit,.calculator-results .results-cta{margin-top:auto}}
@media(min-width:769px){.calculator-hero{min-height:300px;padding-bottom:0}.calculator-hero .pm-hero-inner{padding:36px 0 40px}.calculator-hero .pm-breadcrumbs{margin-bottom:20px}.calculator-hero .pm-hero-copy{margin:12px 0 0}}
@media(max-width:768px){.calculator-hero{min-height:220px}}
.calculator-hero{background-image:linear-gradient(90deg,rgba(0,20,42,.86),rgba(0,28,58,.5),rgba(0,0,0,.12)),url('../assets/uploads/2026/07/perforated-metal-calculator-banner.png');background-position:center;background-size:cover}
.calculator-hero .pm-breadcrumbs{display:flex;align-items:center;gap:8px}.calculator-hero .pm-breadcrumbs span[aria-current="page"]{font-weight:800;color:#fff}
.calculator-card .calculator-left-note,.calculator-results .results-helper{color:var(--calc-muted);font-size:16px;line-height:1.6}
.calculator-card .calculator-left-note p{font-size:15px;line-height:1.6}
.calculator-results .results-cta{background:var(--calc-orange)!important;color:#fff!important}
.calculator-results .results-cta{font-size:14px;font-weight:700}
@media(max-width:600px){.calculator-card .calculator-left-note,.calculator-results .results-helper{font-size:12px;line-height:1.35}.calculator-card .calculator-left-note p{font-size:13px;line-height:1.45}.calculator-results .results-helper{display:block;margin:8px 0 0}}