/* calculator.css — calculatorul v25 (S24) și alegerile (pastilele), mutate din acasa.css pe 4 oct 2026 (pilonul 2): le poartă Acasă și paginile de localitate.
   Vine după comun.css; culorile vin numai din tokens.css. Pe Acasă, așezarea lui în erou rămâne în acasa.css. */
/* Calculatorul v25 (§5, S24): instrumentul închis de lângă titlu. Suprafața acoperișului, socotită pe loc (S5), e cifra mare, neon;
   prețul vine din intervalele de montaj ale lui Mitică. Glisoarele: 44 px de țintă, pătratul cu muchii tăiate ca mâner, umplerea neon din --p (scrisă de generator, apoi de JS). */
.calc {
  position: relative; display: grid; gap: var(--acd-sp-card); padding: var(--acd-sp-card); color: var(--acd-ceata);
  background:
    radial-gradient(34rem 22rem at 100% 0%, rgb(13 104 52 / .5), rgb(13 104 52 / 0) 62%),
    radial-gradient(26rem 18rem at 0% 100%, rgb(86 191 254 / .12), rgb(86 191 254 / 0) 60%),
    var(--acd-ardezie);
  box-shadow: 0 0 0 1px var(--acd-linie-sticla), var(--acd-umbra-ridicat), 0 40px 80px -44px rgb(13 104 52 / .7);
}
.calc::before { content: ""; position: absolute; inset: 0 0 auto; height: 1px; background: var(--acd-muchie-stralucitoare); pointer-events: none; }
.calc h2, .calc h3 { font-size: var(--acd-h3); font-weight: 600; line-height: 1.25; }
.calc fieldset { border: 0; padding: 0; display: grid; gap: 8px; min-width: 0; }
.calc legend { padding: 0; margin-bottom: 8px; font: 700 var(--acd-mic) / 1.35 var(--acd-font-text); }
.calc .nota { font-size: var(--acd-mic); line-height: 1.45; color: color-mix(in srgb, var(--acd-ceata) 80%, var(--acd-ardezie)); }
.calc .nota a { color: var(--acd-ceata); text-decoration-color: var(--acd-neon); text-underline-offset: .2em; }   /* pe sat: legătura spre casa medie a unității */
.calc__glisoare { display: grid; gap: 4px; }
.calc__cap { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.calc__cap label { font: 700 var(--acd-mic) / 1.35 var(--acd-font-text); }
.calc__cap output { font: 700 1.125rem / 1 var(--acd-font-titlu); color: var(--acd-neon); font-variant-numeric: tabular-nums; }
.glisor { --p: 50%; -webkit-appearance: none; appearance: none; display: block; width: 100%; height: 44px; margin: 0; background: none; cursor: pointer; }
.glisor::-webkit-slider-runnable-track { height: 6px; border-radius: 1px; background: linear-gradient(to right, var(--acd-neon) var(--p), color-mix(in srgb, var(--acd-ceata) 26%, var(--acd-ardezie)) var(--p)); }
.glisor::-moz-range-track { height: 6px; border-radius: 1px; background: linear-gradient(to right, var(--acd-neon) var(--p), color-mix(in srgb, var(--acd-ceata) 26%, var(--acd-ardezie)) var(--p)); }
.glisor::-webkit-slider-thumb { -webkit-appearance: none; appearance: none; width: 24px; height: 24px; margin-top: -9px; border: 3px solid var(--acd-neon); border-radius: var(--acd-raza-buton); background: var(--acd-ceata); box-shadow: 0 0 14px rgb(74 222 128 / .6); }
.glisor::-moz-range-thumb { width: 18px; height: 18px; border: 3px solid var(--acd-neon); border-radius: var(--acd-raza-buton); background: var(--acd-ceata); box-shadow: 0 0 14px rgb(74 222 128 / .6); }
.glisor:focus-visible { outline: 2px solid var(--acd-neon); outline-offset: 2px; box-shadow: 0 0 0 2px var(--acd-noapte); }
.calc__rezultat { display: grid; gap: 6px; padding: var(--acd-sp-card); background-color: rgb(30 41 59 / .72); box-shadow: inset 0 0 0 1px var(--acd-linie-sticla), inset 0 1px 0 rgb(74 222 128 / .3); }
.calc__rezultat .eticheta { color: var(--acd-cer); }
.calc__cifra { display: flex; align-items: baseline; gap: .12em; font: 700 clamp(3rem, 2.4rem + 2.4vw, 4.25rem) / 1 var(--acd-font-titlu); letter-spacing: -.02em; color: var(--acd-neon); text-shadow: var(--acd-stralucire); font-variant-numeric: tabular-nums; }
.calc__cifra small { font-size: .42em; font-weight: 600; letter-spacing: 0; color: var(--acd-ceata); text-shadow: none; }
.calc__formula { font-size: var(--acd-mic); line-height: 1.45; color: color-mix(in srgb, var(--acd-ceata) 80%, var(--acd-ardezie)); }
.calc__cum a { display: inline-flex; align-items: center; min-height: 44px; font-size: var(--acd-mic); color: var(--acd-ceata); text-decoration-color: var(--acd-neon); text-underline-offset: .25em; }
.calc__pret { display: grid; gap: 8px; }
.calc__alegerea { font: 600 1.0625rem / 1.35 var(--acd-font-titlu); }
.calc__randuri { display: grid; margin: 0; }
.calc__rand { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; padding-block: 10px; border-bottom: 1px solid var(--acd-linie-sticla); }
.calc__rand[hidden], .calc__rand small[hidden] { display: none; }
.calc__rand dt { display: grid; gap: 2px; }
.calc__rand dt small { font-size: var(--acd-mic); color: var(--acd-ceata); }
.calc__rand dd { margin: 0; text-align: right; white-space: nowrap; font-weight: 700; }
.calc__total { border-bottom: 0; }
.calc__total dt { font: 600 1.0625rem / 1.35 var(--acd-font-titlu); }
.calc__total dd { font: 700 1.375rem / 1.2 var(--acd-font-titlu); color: var(--acd-neon); text-shadow: var(--acd-stralucire); }
.calc__nota { font-size: var(--acd-mic); line-height: 1.45; color: var(--acd-ceata); }
.calc__nota .tnum { white-space: nowrap; }
.calc .buton { width: 100%; }
@media (prefers-reduced-motion: no-preference) {
  .calc__cifra.puls { animation: acd-puls var(--acd-t3) var(--acd-curba); }
  @keyframes acd-puls { from { transform: scale(1.06); } to { transform: none; } }
}
/* Alegerile (pastilele): aceleași în calculator și în filtrele galeriei. Pe deschis (filtrele): contur de oțel, alesul în verdele de pădure;
   pe închis (calculatorul): contur de ceață, alesul neon cu halou. (G38: varianta închisă scrisă global ștergea filtrele de pe fundalul deschis.) */
.alegeri { display: flex; flex-wrap: wrap; gap: 8px; }
.alegere { position: relative; }
.alegere input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
.alegere span {
  display: inline-flex; align-items: center; min-height: 44px; padding: .45rem .85rem;
  border: 2px solid var(--acd-otel); border-radius: var(--acd-raza-buton);
  background-color: var(--acd-alb); color: var(--acd-ardezie); font: 700 var(--acd-mic) / 1.2 var(--acd-font-text);
  box-shadow: inset 0 2px 0 color-mix(in srgb, var(--acd-ardezie) 8%, var(--acd-alb));   /* DEBOSS: umbra interioară, de sus (§7) */
  transition: background-color var(--acd-t1) var(--acd-curba), border-color var(--acd-t1) var(--acd-curba);
}
.alegere input:hover + span { border-color: var(--acd-padure); }
.alegere input:checked + span { background-color: var(--acd-padure); border-color: var(--acd-padure); color: var(--acd-alb); box-shadow: var(--acd-halou-padure); }
.alegere input:focus-visible + span { outline: 2px solid var(--acd-ardezie); outline-offset: 2px; box-shadow: 0 0 0 2px var(--acd-neon); }
.pe-inchis .alegere span { border-color: color-mix(in srgb, var(--acd-ceata) 56%, var(--acd-ardezie)); background-color: rgb(248 250 252 / .04); color: var(--acd-ceata); box-shadow: none; }
.pe-inchis .alegere input:hover + span { border-color: var(--acd-neon); }
.pe-inchis .alegere input:checked + span { background-color: var(--acd-neon); border-color: var(--acd-neon); color: var(--acd-noapte); box-shadow: var(--acd-halou-neon); }
.pe-inchis .alegere input:focus-visible + span { outline: 2px solid var(--acd-neon); outline-offset: 2px; box-shadow: 0 0 0 2px var(--acd-noapte); }