/* ═══════════════════════════════════════════════════════════════════════════════
   /precios/ · prefijo .pr-  (se carga tras pages.css con extraCss)
   Lee los tokens de site.css y las variables --pg-* de pages.css; no redefine ninguna.
   Código de color: salvia / lima = lo que hace la herramienta (la cuota que cobra Ironbrain);
   lavanda / ciruela = lo que decide la persona (el presupuesto que declara y el aviso del límite).
   Índice: 0 hero (lista) · 1 hero (calculadora) · 2 planes · 3 parte variable · 4 qué incluye · 5 preguntas · 6 adaptación
   Movimiento: solo transform y opacity (barras con scaleX). Estado estático completo sin JS y con movimiento reducido.
   ═══════════════════════════════════════════════════════════════════════════════ */

/* ── 0 · Hero: lista numerada (el mismo color que las piezas de la calculadora) ── */
.pg-hero-list .pg-ln-1{background:var(--forest);border-color:var(--forest);color:#f6f8ee}
.pg-hero-list .pg-ln-2{background:var(--lime);border-color:#8fb36b;color:#2f4a28}
.pg-hero-list .pg-ln-3{background:var(--lavender);border-color:#b7a3d3;color:var(--pg-plum)}
/* con JS desaparece el marcado «sin JS» y al revés */
.pr-js{display:none}
.js .pr-js{display:block}
.js .pr-nojs{display:none}
.js .pr-presets.pr-js{display:flex}

/* ── 1 · Hero: calculadora del precio ─────────────────────────────────────── */
.pr-stage{container:pr / inline-size}
.pr-calc{display:grid;gap:14px;padding:16px}
.pr-calc>*{min-width:0}
/* presupuesto declarado */
.pr-in{padding:14px 16px 12px;border-radius:14px;background:var(--pg-p-soft);border:1px solid var(--pg-p-line)}
.pr-in-h{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:10px 16px}
.pr-in .pg-label{margin-bottom:2px;font-size:12px}
.pr-big{display:flex;align-items:baseline;gap:8px;margin:0;color:var(--pg-plum);line-height:1}
.pr-big output{font-size:clamp(40px,4vw,54px);font-weight:600;letter-spacing:-.06em;font-variant-numeric:tabular-nums lining-nums}
.pr-big small{font-size:14px;font-weight:560;color:var(--pg-p-ink)}
.pr-presets{gap:6px}
.pr-pre{min-height:44px;min-width:56px;padding:8px 14px;border-radius:9px;border:1px solid #cdbfe2;background:var(--white);color:var(--pg-plum);font-size:14px;font-weight:650;font-variant-numeric:tabular-nums;transition:background-color .2s ease,color .2s ease,border-color .2s ease,transform .2s var(--ease)}
.pr-pre:hover{background:#f6f2fb}.pr-pre:active{transform:scale(.97)}
.pr-pre[aria-pressed="true"]{background:var(--pg-plum);border-color:var(--pg-plum);color:#fff}
/* control escalonado */
.pr-rg{position:relative;margin-top:8px;height:72px}
.pr-rg-track{position:absolute;left:14px;right:14px;top:15px;height:14px;border-radius:7px;background:#e4dcf0;overflow:hidden}
.pr-rg-track i{position:absolute;inset:0;background:#b7a3d3;transform-origin:left;transform:scaleX(var(--p,0));transition:transform .25s var(--ease)}
.pr-rg-in{position:absolute;left:0;top:0;width:100%;height:44px;margin:0;background:transparent;-webkit-appearance:none;appearance:none;cursor:pointer}
.pr-rg-in::-webkit-slider-runnable-track{height:44px;background:transparent}
.pr-rg-in::-moz-range-track{height:44px;background:transparent}
.pr-rg-in::-webkit-slider-thumb{-webkit-appearance:none;width:30px;height:30px;margin-top:7px;border-radius:50%;background:#fff;border:3px solid var(--pg-plum);box-shadow:0 3px 8px #4c3f6055}
.pr-rg-in::-moz-range-thumb{width:24px;height:24px;border-radius:50%;background:#fff;border:3px solid var(--pg-plum);box-shadow:0 3px 8px #4c3f6055}
.pr-rg-in:focus-visible{outline-offset:2px}
.pr-rg-ticks{position:absolute;left:0;right:0;top:46px;height:20px;font-size:12px;font-weight:600;color:var(--pg-p-ink);font-variant-numeric:tabular-nums}
.pr-rg-ticks span{position:absolute;top:0;left:calc(14px + (100% - 28px) * var(--t));transform:translateX(-50%);white-space:nowrap}
/* ejemplos sin JS */
.pr-ex{width:100%;margin-top:12px;border-collapse:collapse;font-size:14px;font-variant-numeric:tabular-nums}
.pr-ex th,.pr-ex td{padding:8px 6px;text-align:left;border-top:1px solid #d9cfe8;vertical-align:baseline}
.pr-ex thead th{border-top:0;font-size:12px;font-weight:650;letter-spacing:.03em;color:var(--pg-p-ink)}
.pr-ex tbody th{font-weight:650;color:var(--pg-plum)}
.pr-ex td:last-child{font-weight:650;color:var(--deep)}
/* composición del precio */
.pr-res{padding:14px 16px 14px;border-radius:14px;background:#f6faeb;border:1px solid #cfdcbc}
.pr-bar{position:relative;height:22px;border-radius:11px;overflow:hidden;background:#dfe8cc}
.pr-bar i{position:absolute;inset:0;display:block;transition:transform .45s var(--ease)}
.pr-bar-a{background:var(--forest);transform-origin:left;transform:scaleX(var(--pf,.71))}
.pr-bar-b{background:repeating-linear-gradient(135deg,#b6d98a 0 6px,#d4ebaa 6px 12px);transform-origin:right;transform:scaleX(calc(1 - var(--pf,.71)))}
.pr-lines{display:grid;grid-template-columns:1fr 1fr;gap:0 18px;margin:12px 0 0}
.pr-ln{display:block;min-width:0;transition:opacity .25s ease}
.pr-ln dt{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:650;letter-spacing:.07em;text-transform:uppercase;color:#4f6455}
.pr-ln dt i{width:11px;height:11px;border-radius:3px;flex-shrink:0}
.pr-ln--a dt i{background:var(--forest)}
.pr-ln--b dt i{background:repeating-linear-gradient(135deg,#a6cf75 0 3px,#d4ebaa 3px 6px);border:1px solid #9cbd7d}
.pr-ln dd{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 8px;margin:3px 0 0;font-variant-numeric:tabular-nums}
.pr-ln dd b{font-size:22px;font-weight:620;letter-spacing:-.04em;color:var(--deep)}
.pr-ln dd small{font-size:12.5px;color:var(--pg-small)}
.pr-ln dd .pg-ic{width:15px;height:15px;align-self:center;color:var(--green)}
.pr-pct{font-size:15px;font-weight:650;color:var(--pg-t-ink)}
.pr-total{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 14px;margin:12px 0 0;padding-top:11px;border-top:1px solid #cfdcbc;font-variant-numeric:tabular-nums}
.pr-total-l{font-size:12px;font-weight:650;letter-spacing:.07em;text-transform:uppercase;color:#4f6455;margin-right:auto}
.pr-sum{font-size:17px;font-weight:560;color:#3e5144}
.pr-total strong{font-size:clamp(34px,3.4vw,46px);font-weight:620;letter-spacing:-.06em;line-height:1;color:var(--forest)}
/* presupuesto con freno */
.pr-meter{padding:14px 16px 14px;border-radius:14px;background:var(--white);border:1px solid #d9e2c9;transition:opacity .25s ease}
.pr-meter-h{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:2px 12px}
.pr-meter-t{margin:0;font-size:16px;font-weight:620;letter-spacing:-.03em;color:var(--deep)}
.pr-meter-v{margin:0;font-size:13px;color:var(--pg-small);font-variant-numeric:tabular-nums}
.pr-meter-v output{font-size:15px;font-weight:650;color:var(--deep)}
.pr-mt{position:relative;height:44px;margin-top:6px}
.pr-mt-track{position:absolute;left:14px;right:14px;top:15px;height:14px}
.pr-mt-a,.pr-mt-b{position:absolute;top:0;bottom:0;display:block;transform-origin:left;transition:transform .3s var(--ease),background-color .25s ease}
.pr-mt-a{left:0;width:80%;background:#b6d98a;transform:scaleX(calc(min(var(--v),80) / 80))}
.pr-mt-b{left:80%;width:20%;background:repeating-linear-gradient(135deg,#cbb9e4 0 6px,#b8a2d6 6px 12px);transform:scaleX(calc(max(0,var(--v) - 80) / 20))}
.pr-meter[data-s="stop"] .pr-mt-b{background:var(--deep)}
.pr-mt-tick{position:absolute;top:-7px;bottom:-7px;display:block;width:2px;margin-left:-1px;background:var(--forest);opacity:.6}
.pr-mt-t80{left:80%}
.pr-mt-t100{left:100%}
.pr-mt-track::before{content:"";position:absolute;inset:0;border-radius:7px;background:#e6ebdc}
.pr-mt-track i.pr-mt-a{border-radius:7px 0 0 7px}.pr-mt-track i.pr-mt-b{border-radius:0 7px 7px 0}
.pr-mt-in{position:absolute;left:0;top:0;width:100%;height:44px;margin:0;background:transparent;-webkit-appearance:none;appearance:none;cursor:pointer}
.pr-mt-in::-webkit-slider-runnable-track{height:44px;background:transparent}
.pr-mt-in::-moz-range-track{height:44px;background:transparent}
.pr-mt-in::-webkit-slider-thumb{-webkit-appearance:none;width:28px;height:28px;margin-top:8px;border-radius:50%;background:#fff;border:3px solid var(--forest);box-shadow:0 3px 8px #10362c55}
.pr-mt-in::-moz-range-thumb{width:22px;height:22px;border-radius:50%;background:#fff;border:3px solid var(--forest);box-shadow:0 3px 8px #10362c55}
.pr-mt-in:focus-visible{outline-offset:2px}
.pr-mt-lbls{position:relative;height:40px;margin-top:2px;font-size:12px;color:var(--pg-small)}
.pr-mt-lbls>span{position:absolute;top:0;display:flex;flex-direction:column;line-height:1.3;font-variant-numeric:tabular-nums}
.pr-mt-lbls b{display:flex;align-items:center;gap:5px;font-size:12px;font-weight:650;color:var(--deep);white-space:nowrap}
.pr-mt-lbls .pg-ic{width:14px;height:14px}
.pr-l80{left:calc(14px + (100% - 28px) * .8);transform:translateX(-100%);align-items:flex-end;text-align:right;padding-right:6px}
.pr-l80 .pg-ic{color:var(--pg-plum)}
.pr-l100{right:8px;align-items:flex-end;text-align:right}
.pr-mt-state{display:flex;align-items:center;gap:10px;margin-top:4px;padding:10px 12px;border-radius:11px;background:var(--pg-t-soft);border:1px solid var(--pg-t-line);font-size:13.5px;line-height:1.45;color:#37503f;min-height:46px}
.pr-mt-state .pg-ic{color:var(--pg-t-strong)}
.pr-meter[data-s="warn"] .pr-mt-state{background:var(--pg-p-soft);border-color:var(--pg-p-line);color:#4d3f63}
.pr-meter[data-s="warn"] .pr-mt-state .pg-ic{color:var(--pg-plum)}
.pr-meter[data-s="stop"] .pr-mt-state{background:var(--deep);border-color:var(--deep);color:#e8f0dd}
.pr-meter[data-s="stop"] .pr-mt-state .pg-ic{color:#d4ebaa}
.pr-sent{display:flex;align-items:flex-start;gap:9px;margin:10px 0 0;font-size:13.5px;font-weight:620;line-height:1.45;color:var(--deep)}
.pr-sent .pg-ic{margin-top:2px;color:var(--pg-plum)}
/* la lista del hero atenúa lo que no toca (data-hl lo pone page-precios.js) */
.pr-in,.pr-res,.pr-ln,.pr-meter{transition:opacity .25s ease}
.pr-stage[data-hl="1"] [data-l="2"],.pr-stage[data-hl="1"] [data-l="3"],.pr-stage[data-hl="1"] .pr-in{opacity:.3}
.pr-stage[data-hl="2"] [data-l="1"],.pr-stage[data-hl="2"] [data-l="3"]{opacity:.3}
.pr-stage[data-hl="3"] .pr-res,.pr-stage[data-hl="3"] .pr-in{opacity:.35}

/* ── 2 · Planes ──────────────────────────────────────────────────────────── */
.pr-terms{display:grid;gap:0;border-top:1px solid #c8d4bc}
.pr-terms li{display:grid;grid-template-columns:44px minmax(0,1fr);gap:16px;align-items:center;padding:15px 0;border-bottom:1px solid #d5ddc9;font-size:15px;line-height:1.5;color:var(--pg-body)}
.pr-term-ic{display:grid;place-items:center;width:44px;height:44px;border-radius:13px;background:var(--lime);color:var(--forest)}
.pr-term-ic--p{background:var(--lavender);color:var(--pg-plum)}
.pr-plans{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(18px,2.4vw,32px)}
.pr-plan{position:relative;display:flex;flex-direction:column;gap:0;min-width:0;padding:clamp(26px,2.8vw,40px);border-radius:26px;background:var(--white);border:1px solid var(--line);box-shadow:0 18px 48px -35px #173f355c;overflow:hidden}
.pr-plan::before{content:"";position:absolute;left:0;right:0;top:0;height:7px;background:#9cbd7d}
.pr-plan--p::before{background:#b7a3d3}
.pr-plan-h{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;margin-bottom:22px}
.pr-plan-ic{display:grid;place-items:center;width:46px;height:46px;border-radius:14px;background:var(--lime);color:var(--forest)}
.pr-plan--p .pr-plan-ic{background:var(--lavender);color:var(--pg-plum)}
.pr-plan-h h3{font-size:clamp(26px,2.4vw,32px);letter-spacing:-.045em;color:var(--deep)}
.pr-plan-tag{margin-left:auto;padding:3px 11px;border-radius:999px;border:1px solid #b9cfa3;background:#f3f6ea;font-size:12px;font-weight:650;color:#3f5a34;white-space:nowrap}
.pr-plan--p .pr-plan-tag{border-color:#d5c9e6;background:var(--pg-p-soft);color:var(--pg-plum)}
.pr-price{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 12px;margin:0;font-variant-numeric:tabular-nums}
.pr-price strong{font-size:clamp(52px,5.4vw,78px);font-weight:600;letter-spacing:-.07em;line-height:.95;color:var(--forest);white-space:nowrap}
.pr-price span{font-size:17px;font-weight:560;color:var(--pg-small)}
.pr-var{display:flex;align-items:center;gap:8px;margin:14px 0 0;padding:8px 14px 8px 10px;align-self:flex-start;border-radius:999px;background:var(--lime);border:1px solid #b9cfa3;font-size:15px;font-weight:650;color:#2f4a28;line-height:1.35}
.pr-plan--p .pr-var{background:var(--lavender);border-color:#d5c9e6;color:var(--pg-plum)}
.pr-var .pg-ic{width:16px;height:16px;stroke-width:2.2;flex-shrink:0}
.pr-for{margin:20px 0 0;font-size:16px;line-height:1.6;color:var(--pg-body);max-width:46ch}
.pr-inc{display:grid;gap:0;margin:22px 0 28px;border-top:1px solid #dfe6d3}
.pr-inc li{display:grid;grid-template-columns:24px minmax(0,1fr);gap:12px;align-items:start;padding:11px 0;border-bottom:1px solid #e6ebdc;font-size:15px;line-height:1.5;color:var(--pg-body)}
.pr-inc li>span{display:grid;place-items:center;width:22px;height:22px;margin-top:1px;border-radius:50%;background:var(--lime);color:var(--forest)}
.pr-plan--p .pr-inc li>span{background:var(--lavender);color:var(--pg-plum)}
.pr-inc .pg-ic{width:12px;height:12px;stroke-width:2.4}
.pr-plan .button{align-self:flex-start;margin-top:auto}

/* ── 3 · Parte variable ──────────────────────────────────────────────────── */
.pr-fig-h{margin-bottom:12px}
.pr-ex-tbl{margin-top:0;font-size:15px;font-variant-numeric:tabular-nums}
.pr-ex-tbl th,.pr-ex-tbl td{padding:15px 16px}
.pr-ex-tbl thead th{font-size:12px;letter-spacing:.01em}
.pr-ex-tbl tbody th{width:auto;font-size:19px;font-weight:620}
.pr-ex-tbl td{font-size:17px}
.pr-ex-tbl td b{font-size:19px;font-weight:650;color:var(--forest)}
.pr-fig-n{margin-top:12px;font-size:14px;color:var(--pg-small)}
.pr-two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(18px,2.4vw,32px)}
.pr-card{display:flex;flex-direction:column;gap:14px;padding:clamp(22px,2.6vw,36px);border-radius:22px;background:var(--white);border:1px solid var(--line);box-shadow:0 18px 48px -35px #173f355c}
.pr-card h3{display:flex;align-items:center;gap:12px;font-size:clamp(21px,1.9vw,26px);letter-spacing:-.04em;color:var(--deep)}
.pr-card-ic{display:grid;place-items:center;width:40px;height:40px;border-radius:12px;background:var(--lime);color:var(--forest)}
.pr-card--p .pr-card-ic{background:var(--lavender);color:var(--pg-plum)}
.pr-card p{font-size:15.5px;line-height:1.65;color:var(--pg-body);max-width:56ch}
.pr-card .text-link{align-self:flex-start;margin-top:auto}
.pr-dims,.pr-lim{display:flex;flex-wrap:wrap;gap:8px}
.pr-dims .pg-chip{font-size:13px;padding:5px 12px 5px 10px}
.pr-dims .pg-chip .pg-ic{width:15px;height:15px}
.pr-lim li{display:inline-flex;align-items:center;gap:8px;padding:6px 14px 6px 11px;border-radius:999px;font-size:13.5px;font-weight:650;border:1px solid}
.pr-lim .pg-ic{width:16px;height:16px}
.pr-lim-w{background:var(--lavender);border-color:#d5c9e6;color:var(--pg-plum)}
.pr-lim-s{background:var(--deep);border-color:var(--deep);color:#f6f8ee}

/* ── 4 · Qué incluye ─────────────────────────────────────────────────────── */
.pr-head{grid-column:1 / -1;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);column-gap:clamp(28px,5vw,80px);align-items:end}
.pr-head .pg-eyebrow{grid-column:1 / -1}
.pr-head h2{margin-bottom:0}
.pr-head .pg-lead{padding-bottom:6px}
.pr-tbl{margin-top:0}
@media(min-width:601px){.pr-tbl tbody th{width:34%}}
.pr-tbl td{font-size:15.5px}
.pr-tbl thead .pr-col-t span,.pr-tbl thead .pr-col-p span{display:inline-flex;align-items:center;gap:9px;font-size:15px;color:var(--deep)}
.pr-tbl thead i{width:11px;height:11px;border-radius:50%}
.pr-tbl thead .pr-col-t i{background:#8fb36b}.pr-tbl thead .pr-col-p i{background:#a68fc8}
.pr-tbl thead .pr-col-t{background:var(--lime)}
.pr-tbl thead .pr-col-p{background:#e1d6f1}
.pr-tbl td.pr-col-t{background:#f6faeb;color:var(--deep);font-weight:560}
.pr-tbl td.pr-col-p{background:#f8f5fc;color:#3f3552;font-weight:560}
.pr-after{margin-top:26px}

/* ── 5 · Preguntas ───────────────────────────────────────────────────────── */
.pr-faq-grid{align-items:start}
.pr-faq-head{grid-column:1 / span 4;grid-row:1;position:sticky;top:calc(var(--pg-hh) + var(--pg-sub-h) + 28px)}
.pr-faq-list{grid-column:5 / span 8;grid-row:1}
.pr-faq-head h2{margin-bottom:0}
.pr-faq-list .pg-faq{max-width:none;margin-top:0}
.pr-faq-list .pg-faq details{border-color:#d3c7e4}
.pr-faq-list .pg-faq summary{font-size:18px}

/* ── 6 · Adaptación ──────────────────────────────────────────────────────── */
@container pr (max-width: 560px){
  .pr-calc{padding:12px}
  .pr-in{padding:12px 12px 10px}
  .pr-lines{grid-template-columns:1fr;gap:10px}
  .pr-res,.pr-meter{padding:12px}
  .pr-mt-lbls{height:62px}
  .pr-mt-lbls .pr-l100{top:32px}
  .pr-sum{font-size:15px}
}
@media(max-width:1180px){
  .pr-head{grid-column:1 / -1}
}
@media(max-width:1000px){
  .pr-head{display:block}
  .pr-head h2{margin-bottom:24px}
  .pr-terms{margin-top:6px}
  .pr-plans,.pr-two{grid-template-columns:minmax(0,1fr)}
  .pr-faq-head,.pr-faq-list{grid-column:1 / -1;grid-row:auto;position:static}
  .pr-faq-head{margin-bottom:28px}
  .pr-faq-grid{display:block}
}
@media(max-width:600px){
  .pr-plan{padding:24px 20px 26px}
  .pr-plan-tag{margin-left:0}
  .pr-price strong{font-size:56px}
  .pr-ex-tbl th,.pr-ex-tbl td{padding:12px 16px}
  .pr-ex-tbl tbody th{font-size:16px}
  .pr-card{padding:22px 20px 24px}
  .pr-faq-list .pg-faq summary{font-size:16px}
  .pr-tbl td{font-size:15px}
}
@media(prefers-reduced-motion:reduce){
  .pr-rg-track i,.pr-bar i,.pr-mt-a,.pr-mt-b,.pr-pre,.pr-in,.pr-res,.pr-total,.pr-ln,.pr-meter{transition:none!important}
}
.reduce .pr-rg-track i,.reduce .pr-bar i,.reduce .pr-mt-a,.reduce .pr-mt-b,.reduce .pr-pre,.reduce .pr-in,.reduce .pr-res,.reduce .pr-total,.reduce .pr-ln,.reduce .pr-meter{transition:none!important}