/* [cc 03.11] Digital+ pe pagina Prețuri (varianta A din _piese-noi/digital-plus-v1, aleasă de David: „first version look the best”). Doar clase dpa-*;
   restul vine din preturi.css (tokenii --pa-*, sticla --gl-*, .pa-btn, .pa-big, .pa-lk). Același fișier pentru RO și EN.
   Placa de cumpărare (.dpa-buy) = bleumarinul paginii (--pa-navy2, ca rezultatul calculatorului); valorile sunt cele din preturi.css, nu culori noi. */

/* ---------- vederea Digital+ ---------- */
.dpa-wrap{display:none}
main#main:has(#pl-d:checked) .dpa-wrap{display:block}
main#main:has(#pl-d:checked) .dpa-band{display:none}

.dpa{display:grid;grid-template-columns:minmax(0,1fr) minmax(360px,440px);grid-template-rows:auto 1fr auto;grid-template-areas:"head buy" "body buy" "own own";
  border-radius:24px;overflow:hidden;background:var(--pa-card);box-shadow:inset 0 0 0 1px var(--pa-line),var(--pa-edge),var(--pa-shadow)}
:root body.pa .dpa{background:var(--gl-bg);box-shadow:var(--gl-hi),inset 0 0 0 .5px var(--gl-bd),var(--gl-sh)}

/* stânga sus: numele, tipul, pentru cine */
.dpa-head{grid-area:head;padding:44px 48px 0}
.dpa-n{font:600 30px/1.1 var(--ws);letter-spacing:-.022em;color:var(--pa-ink);border-radius:6px}
.dpa-type{margin-top:10px;font:600 12px/1.2 var(--ws);letter-spacing:.16em;text-transform:uppercase;color:var(--pa-mute)}
.dpa-w{margin-top:16px;max-width:42em;font:400 16px/1.55 var(--ws);color:var(--pa-mute);text-wrap:pretty}

/* stânga jos: ce include */
.dpa-body{grid-area:body;padding:36px 48px 44px}
.dpa-h4{font:600 12px/1.2 var(--ws);letter-spacing:.12em;text-transform:uppercase;color:var(--pa-mute)}
.dpa-inc{margin-top:14px;padding-top:22px;border-top:1px solid var(--pa-line2);display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 36px}
.dpa-inc li{display:grid;grid-template-columns:10px minmax(0,1fr);column-gap:12px;align-items:start}
.dpa-inc .pa-hex{margin-top:5px;color:var(--pa-ink)}
.dpa-it{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;font:500 16px/1.35 var(--ws);letter-spacing:-.012em;color:var(--pa-ink)}
.dpa-is{margin-top:5px;font:400 13.5px/1.55 var(--ws);color:var(--pa-mute);text-wrap:pretty}
.dpa-is .pa-sp-k{height:20px;padding:0 8px;margin-right:2px;font-size:12px;vertical-align:1px}
/* jos, pe toată lățimea: serverul e al tău */
.dpa-own{grid-area:own;padding:30px 48px 34px;border-top:1px solid var(--pa-line);background:var(--pa-card2)}
.dpa-srv{margin-top:18px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px 36px}
.dpa-srv li{display:grid;grid-template-columns:36px minmax(0,1fr);column-gap:14px;align-items:start}
.dpa-srv p{padding-top:7px;font:400 13.5px/1.55 var(--ws);color:var(--pa-mute);text-wrap:pretty}
.dpa-srv b{font-weight:600;color:var(--pa-ink)}
.dpa-srv .pa-lk{display:inline-block;margin-top:4px;white-space:nowrap}
.dpa-i{display:grid;place-items:center;width:36px;height:36px;border-radius:10px;color:var(--pa-ink);background:var(--pa-card);box-shadow:inset 0 0 0 1px var(--pa-line2)}

/* dreapta: placa de cumpărare */
.dpa-buy{grid-area:buy;position:relative;isolation:isolate;display:flex;flex-direction:column;padding:44px 40px 40px;background:var(--pa-navy2);
  --pa-ink:#f6f4f0;--pa-mute:#c4cdd6;--pa-line:rgba(255,255,255,.13);--pa-line2:rgba(255,255,255,.24);
  --pa-b1:#f6f4f0;--pa-b1-ink:#142A3E;--pa-b1-h:#fff;--pa-glow:rgba(130,170,230,.26);color:var(--pa-ink)}
.dpa-buy::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse 80% 50% at 100% 0%,var(--pa-glow),transparent 70%)}
.dpa-p{display:flex;align-items:flex-end;gap:12px}
.dpa-buy .pa-big{font-size:clamp(56px,5vw,72px)}
.dpa-buy .pa-per{font-size:13.5px}
.dpa-vat{margin-top:14px;font:400 14px/1.4 var(--ws);color:var(--pa-mute)}
.dpa-cta{margin-top:30px;height:50px;font-size:15.5px}
.dpa-tel{margin-top:14px;margin-bottom:36px;font:400 14px/1.5 var(--ws);color:var(--pa-mute)}
.dpa-tel .pa-lk{white-space:nowrap}
.dpa-pay{margin-top:0;padding-top:22px;border-top:1px solid var(--pa-line);display:grid;gap:10px}
.dpa-pay p{font:400 13.5px/1.55 var(--ws);color:var(--pa-mute);text-wrap:pretty}
.dpa-pay .dpa-pay-1{color:var(--pa-ink)}

/* sub panou: TVA + întoarcerea la pachete */
.dpa-foot{margin-top:14px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:4px 24px;padding:0 6px;font:400 13.5px/1.5 var(--ws);color:var(--pa-mute)}
.dpa-note{display:flex;align-items:center;gap:8px;min-height:44px}
.dpa-ii{flex:none;color:var(--pa-mute)}
.dpa-back{display:flex;flex-wrap:wrap;align-items:center;column-gap:8px}
.dpa-back .pa-lk--go{font-weight:500}

/* ---------- banda de la Lunar / Anual ---------- */
.dpa-band{margin-top:24px;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:16px 22px;padding:22px 26px 22px 22px;border-radius:var(--pa-r);
  background:var(--pa-card);box-shadow:inset 0 0 0 1px var(--pa-line),var(--pa-edge),var(--pa-shadow)}
:root body.pa .dpa-band{background:var(--gl-bg);box-shadow:var(--gl-hi),inset 0 0 0 .5px var(--gl-bd),var(--gl-sh)}
.dpa-band .dpa-band-i{width:44px;height:44px;margin:0;border-radius:12px}
.dpa-band-t p{margin-top:4px;max-width:46em;font:400 14.5px/1.55 var(--ws);color:var(--pa-mute);text-wrap:pretty}
.dpa-band-t b{font-weight:600;color:var(--pa-ink)}
.dpa-band-go{flex:none}

@media (prefers-reduced-transparency:reduce){
  :root body.pa :is(.dpa,.dpa-band){background:var(--gl-solid)}
}

/* ---------- lățimi ---------- */
/* sub 1180 (unde și pachetele trec pe două coloane): un singur șir; placa de cumpărare stă între nume și listă, prețul în stânga, butonul în dreapta */
@media (max-width:1180px){
  .dpa{grid-template-columns:minmax(0,1fr);grid-template-rows:none;grid-template-areas:"head" "buy" "body" "own"}
  .dpa-head{padding:36px 40px 30px}
  .dpa-body{padding:36px 40px}
  .dpa-own{padding:28px 40px 30px}
}
@media (min-width:701px) and (max-width:1180px){
  .dpa-buy{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:40px;align-items:start;padding:34px 40px}
  .dpa-p{grid-column:1;grid-row:1;align-self:end}
  .dpa-vat{grid-column:1;grid-row:2}
  .dpa-cta{grid-column:2;grid-row:1;align-self:end;margin-top:0}
  .dpa-tel{grid-column:2;grid-row:2;margin-bottom:26px}
  .dpa-pay{grid-column:1/-1;grid-row:3;margin-top:0;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:40px}
}
@media (max-width:900px){
  .dpa-srv{grid-template-columns:minmax(0,1fr);gap:16px}
  .dpa-band{grid-template-columns:44px minmax(0,1fr)}
  .dpa-band-go{grid-column:1/-1;justify-self:start}
}
@media (max-width:700px){
  .dpa{border-radius:var(--pa-r)}
  .dpa-head{padding:26px 20px 24px}
  .dpa-n{font-size:26px}
  .dpa-w{font-size:15px}
  .dpa-buy{padding:26px 20px 24px}
  .dpa-buy .pa-big{font-size:52px}
  .dpa-cta{margin-top:24px}
  .dpa-tel{margin-bottom:22px}
  .dpa-pay{margin-top:0}
  .dpa-body{padding:28px 20px 26px}
  .dpa-inc{grid-template-columns:minmax(0,1fr);gap:18px}
  .dpa-own{padding:24px 20px 24px}
  .dpa-foot{flex-direction:column;align-items:flex-start;gap:0;padding:0 4px}
  .dpa-note{align-items:flex-start;min-height:0;padding-top:4px}
  .dpa-ii{margin-top:2px}
  .dpa-band{align-items:start;padding:20px;gap:16px 16px}
  .dpa-band .dpa-band-i{width:40px;height:40px;margin-top:2px}
  .dpa-band-go{justify-self:stretch}
}

/* [cc 03.11 review] eticheta de lângă preț nu se rupe; telefon mic: prețul puțin mai mic; zone de apăsare mai mari pe telefon */
.dpa-buy .pa-per{white-space:nowrap}
@media (max-width:700px){
  .dpa-tel .pa-lk{padding:12px 2px;margin:-12px -2px}
  .dpa-srv .pa-lk{padding:12px 0;margin:-8px 0 -12px}
}
@media (max-width:340px){ .dpa-buy .pa-big{font-size:44px} }
