/* Dantone Creative | estimator styles (pricing page only) */
.est{display:grid; grid-template-columns:1.12fr .88fr; gap:clamp(18px, 2.4vw, 32px); align-items:start}
@media (max-width:960px){ .est{grid-template-columns:minmax(0, 1fr)} }

.est-panel{background:var(--bg-2); border:1px solid var(--line)}
.est-block{padding:clamp(22px, 3vw, 36px)}
.est-block + .est-block{border-top:1px solid var(--line)}
.est-block h2{font-size:clamp(1.5rem, 2.4vw, 2rem); letter-spacing:-.01em; margin:10px 0 8px}
.est-block .hint{margin:0 0 22px; color:var(--text-2); font-size:.95rem; max-width:60ch}

.est-freq{display:grid; grid-template-columns:repeat(4, 1fr); gap:10px}
@media (max-width:640px){ .est-freq{grid-template-columns:repeat(2, minmax(0, 1fr))} }
@media (max-width:360px){ .est-block{padding:20px 16px} } /* small phones (iPhone SE) */
.est-freq button{
  appearance:none; text-align:left; cursor:pointer; background:var(--bg); color:var(--text);
  border:1px solid var(--line-2); border-radius:var(--radius); padding:16px 14px; font:inherit;
  display:flex; flex-direction:column; gap:6px; transition:border-color .2s, background .2s;
}
.est-freq button:hover{border-color:var(--text-2)}
.est-freq .fname{font-weight:900; text-transform:uppercase; font-size:.95rem; line-height:1.05; letter-spacing:-.005em}
.est-freq .fmeta{font-size:.78rem; color:var(--text-2)}
.est-freq .fsave{font-size:.72rem; font-weight:800; letter-spacing:.12em; text-transform:uppercase; color:var(--blue-hi); font-variation-settings:"wdth" 115}
.est-freq button[aria-pressed="true"]{background:var(--orange); border-color:var(--orange); color:#0a0a0b}
.est-freq button[aria-pressed="true"] .fmeta, .est-freq button[aria-pressed="true"] .fsave{color:#0a0a0b}

.est-hours-top{display:flex; justify-content:space-between; align-items:flex-end; gap:16px; margin-bottom:8px}
.est-hours-val{font-weight:900; font-size:clamp(3.4rem, 7vw, 5rem); line-height:.85; letter-spacing:-.03em}
.est-hours-val span{font-size:.3em; letter-spacing:.06em; color:var(--text-2); margin-left:.3em}
.est-eff{text-align:right; font-size:.8rem; color:var(--text-2)}
.est-eff b{display:block; color:var(--text); font-size:1.2rem; font-variant-numeric:tabular-nums}

.est input[type=range]{-webkit-appearance:none; appearance:none; width:100%; height:40px; background:transparent; cursor:pointer; margin:4px 0 0; padding:0}
.est input[type=range]::-webkit-slider-runnable-track{height:6px; background:linear-gradient(90deg, var(--blue) 0, var(--orange) var(--pct,30%), var(--bg-3) var(--pct,30%))}
.est input[type=range]::-moz-range-track{height:6px; background:var(--bg-3)}
.est input[type=range]::-moz-range-progress{height:6px; background:linear-gradient(90deg, var(--blue), var(--orange))}
.est input[type=range]::-webkit-slider-thumb{-webkit-appearance:none; width:26px; height:26px; border-radius:50%; background:var(--text); border:4px solid var(--orange); margin-top:-10px; transition:transform .15s}
.est input[type=range]::-moz-range-thumb{width:20px; height:20px; border-radius:50%; background:var(--text); border:4px solid var(--orange)}
.est input[type=range]:active::-webkit-slider-thumb{transform:scale(1.15)}
.est input[type=range]:focus-visible{outline:2px solid var(--orange); outline-offset:4px}
.est-scale{display:flex; justify-content:space-between; font-size:.72rem; color:var(--muted); font-weight:700; letter-spacing:.1em}

.est-ladder{margin-top:22px; border:1px solid var(--line)}
.est-ladder .h{display:flex; justify-content:space-between; padding:10px 14px; background:var(--bg-3); font-weight:800; font-size:.66rem; letter-spacing:.22em; text-transform:uppercase; color:var(--text-2)}
.est-ladder table{width:100%; border-collapse:collapse; font-size:.9rem}
.est-ladder td{padding:9px 14px; border-top:1px solid var(--line); color:var(--text-2)}
.est-ladder td:last-child{text-align:right; color:var(--text); font-variant-numeric:tabular-nums; font-weight:700}
.est-ladder tr:first-child td{border-top:0}
.est-ladder .drop{color:var(--blue-hi); font-size:.74rem; padding-left:8px}

.est-addon{display:flex; gap:18px; align-items:flex-start; padding:18px 0; border-top:1px solid var(--line)}
.est-addon:first-of-type{border-top:0; padding-top:0}
.est-addon .info{flex:1}
.est-addon .aname{font-weight:900; text-transform:uppercase; font-size:1.02rem; letter-spacing:-.005em}
.est-addon .adesc{color:var(--text-2); font-size:.9rem; margin-top:4px}
.est-addon .aprice{margin-top:8px; font-weight:800; font-size:.74rem; letter-spacing:.16em; text-transform:uppercase; color:var(--orange)}

.est-switch{position:relative; flex:none; width:56px; height:30px}
.est-switch input{position:absolute; inset:0; opacity:0; margin:0; cursor:pointer; z-index:1}
.est-switch .slot{position:absolute; inset:0; border-radius:999px; background:var(--bg-3); border:1px solid var(--line-2); transition:background .2s}
.est-switch .knob{position:absolute; top:4px; left:4px; width:22px; height:22px; border-radius:50%; background:var(--text); transition:transform .2s var(--ease)}
.est-switch input:checked ~ .slot{background:var(--orange); border-color:var(--orange)}
.est-switch input:checked ~ .knob{transform:translateX(26px); background:#0a0a0b}
.est-switch input:focus-visible ~ .slot{outline:2px solid var(--orange); outline-offset:3px}

.est-stepper{display:flex; flex:none; border:1px solid var(--line-2)}
.est-stepper button{width:42px; height:42px; background:var(--bg); color:var(--text); border:0; font:inherit; font-size:1.3rem; cursor:pointer}
.est-stepper button:hover{background:var(--bg-3); color:var(--orange)}
.est-stepper .count{width:48px; text-align:center; line-height:42px; font-weight:900; font-size:1.1rem; border-left:1px solid var(--line-2); border-right:1px solid var(--line-2); font-variant-numeric:tabular-nums}

.est-summary{position:sticky; top:calc(var(--nav-h) + 20px)}
.est-summary .est-panel{position:relative; overflow:hidden; isolation:isolate; background:var(--bg)}
.est-summary .est-panel::before{content:""; position:absolute; inset:0; z-index:-1; background:radial-gradient(80% 60% at 0% 0%, rgba(13,106,166,.35), transparent 65%), radial-gradient(80% 60% at 100% 100%, rgba(255,90,20,.32), transparent 65%)}
.est-lines{list-style:none; margin:18px 0 0; padding:0}
.est-lines li{display:flex; justify-content:space-between; gap:16px; padding:12px 0; border-top:1px solid var(--line); font-size:.95rem}
.est-lines li:first-child{border-top:0}
.est-lines .lbl small{display:block; color:var(--muted); font-size:.78rem}
.est-lines .amt{font-weight:700; font-variant-numeric:tabular-nums; white-space:nowrap}
.est-lines .amt.neg{color:var(--blue-hi)}
.est-total{display:flex; justify-content:space-between; align-items:flex-end; gap:14px; border-top:3px solid var(--text); margin-top:14px; padding-top:20px}
.est-total .v{font-weight:900; font-size:clamp(3rem, 5.4vw, 4.4rem); line-height:.85; letter-spacing:-.03em; font-variant-numeric:tabular-nums}
.est-roll{display:grid; grid-template-columns:1fr; gap:1px; background:var(--line); border:1px solid var(--line); margin-top:24px}
.est-roll div{background:var(--bg-2); padding:16px}
.est-roll b{display:block; font-size:1.35rem; font-weight:900; margin-top:6px; font-variant-numeric:tabular-nums}
.est-roll small{color:var(--muted); font-size:.78rem}
.est-send{display:grid; gap:10px; margin-top:26px}
.est-send .btn{width:100%}
.est-send .pair{display:grid; grid-template-columns:1fr 1fr; gap:10px}
.est-fine{margin:22px 0 0; font-size:.8rem; color:var(--muted); line-height:1.55}
.est-fine strong{color:var(--text-2)}

.est-bar{
  position:fixed; left:12px; right:12px; bottom:calc(12px + env(safe-area-inset-bottom, 0px)); z-index:60; display:none;
  background:var(--orange); color:#0a0a0b; text-decoration:none; padding:16px 20px; justify-content:space-between; align-items:center;
  font-weight:900; text-transform:uppercase; letter-spacing:.06em; box-shadow:0 14px 40px rgba(0,0,0,.5);
  transition:transform .3s var(--ease), opacity .3s;
}
.est-bar.hide{transform:translateY(140%); opacity:0}
@media (max-width:960px){ .est-bar{display:flex} }
