/* Mesajul de la Moș Crăciun · 29.10.2026, Adrian: pasul 1 („Copilul”) mai wow (assets/mos-pas1.js). Plicul viu, vârsta pe butoane,
   Băiat / Fată pe carduri mari, „Câți copii sunt în mesaj” pe trei butoane. Peste mos.css, carti-pasi.css și mos-frati.css. */

/* ---------- plicul viu ---------- */
.mos .pp-plic{position:relative;container-type:inline-size;width:100%;aspect-ratio:16/9;margin:20px 0 4px;border-radius:14px;overflow:hidden;background:#1b1410;
  box-shadow:0 0 0 1px #c9a25e,0 0 0 5px #fffaf1,0 0 0 6px #e2c99c,0 26px 40px -24px #5a3414b3;rotate:-1.2deg}
.mos .pp-plic[hidden]{display:none}
.mos .pp-plic__zoom{position:absolute;inset:0;transform:scale(1.42);transform-origin:50% 55%}
.mos .pp-plic__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.mos .pp-plic .pf-scris{transition:opacity .4s}
.mos .pp-plic.is-exemplu .pf-scris,.mos .pp-plic.is-exemplu .pf-stampila{opacity:.42}
.mos .pp-plic .pf-stampila{transition:opacity .4s}
@media (prefers-reduced-motion:no-preference){
  .mos .pp-plic.is-stampila .pf-stampila{animation:pp-stampila .6s cubic-bezier(.3,1.5,.5,1) both;transform-box:fill-box;transform-origin:50% 50%}
}
@keyframes pp-stampila{0%{opacity:0;transform:scale(2.1) rotate(-18deg)}60%{opacity:1;transform:scale(.92)}100%{opacity:1;transform:none}}

/* ---------- vârsta: 1–12 ---------- */
.mos .cs-pas[data-pas="copil"] .pp-varsta{grid-column:1/-1}
.mos .pp-ascuns{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0 0 0 0)!important;border:0!important;opacity:0}
.mos .pp-varste{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px;margin-top:2px}
.mos .pp-varste__b{display:grid;place-items:center;min-height:48px;padding:0;border:1.5px solid #e2d3c2;border-radius:14px;background:#fff;color:#1E1A20;
  font:750 18px/1 var(--font-display);font-variant-numeric:tabular-nums;cursor:pointer;transition:transform .2s cubic-bezier(.3,1.6,.5,1),background .2s,border-color .2s,color .2s,box-shadow .2s}
.mos .pp-varste__b:hover{border-color:#c92a48;transform:translateY(-2px)}
.mos .pp-varste__b[aria-checked="true"]{border-color:#c92a48;background:#c92a48;color:#fff;box-shadow:0 10px 18px -10px #c92a48;transform:scale(1.06)}
.mos .pp-varste__b:focus-visible{outline:3px solid #dfa74f;outline-offset:2px}
.mos .pp-varste__replica{margin:10px 0 0;padding:10px 14px;border-radius:12px;background:#fbf1ee;font:500 15px/1.45 var(--font-display);color:#5d4b53}
.mos .pp-varste__replica b{color:#c92a48;font-weight:750}
@media (prefers-reduced-motion:no-preference){.mos .pp-varste__replica.is-nou{animation:pf-apare .35s ease-out both}}

/* ---------- Băiat sau fată: două carduri mari ---------- */
.mos .cs-pas[data-pas="copil"] .hooo-camp--radio .hooo-optiuni{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.mos .cs-pas[data-pas="copil"] .hooo-camp--radio .hooo-optiune{position:relative;display:flex;align-items:center;justify-content:center;gap:12px;min-height:64px;margin:0;padding:12px 16px;
  border:1.5px solid #e2d3c2;border-radius:16px;background:#fff;font:750 18px/1.2 var(--font-display);color:#1E1A20;cursor:pointer;transition:border-color .2s,background .2s,box-shadow .2s,transform .2s}
.mos .cs-pas[data-pas="copil"] .hooo-camp--radio .hooo-optiune:hover{border-color:#c92a48;transform:translateY(-2px)}
.mos .cs-pas[data-pas="copil"] .hooo-camp--radio .hooo-optiune input{position:absolute;opacity:0;width:1px;height:1px;margin:0;pointer-events:none}
.mos .cs-pas[data-pas="copil"] .hooo-camp--radio .hooo-optiune::before{content:"";flex:none;width:24px;height:24px;border:2px solid #d8ccd2;border-radius:50%;background:#fff center/14px no-repeat;transition:background-color .2s,border-color .2s,transform .3s cubic-bezier(.3,1.6,.5,1)}
.mos .cs-pas[data-pas="copil"] .hooo-camp--radio .hooo-optiune:has(input:checked){border-color:#c92a48;background:#fff5f6;box-shadow:0 12px 22px -14px #c92a48}
.mos .cs-pas[data-pas="copil"] .hooo-camp--radio .hooo-optiune:has(input:checked)::before{border-color:#c92a48;transform:scale(1.08);
  background:#c92a48 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 12.5l4 4 8-9' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/14px no-repeat}
.mos .cs-pas[data-pas="copil"] .hooo-camp--radio .hooo-optiune:has(input:focus-visible){outline:3px solid #dfa74f;outline-offset:2px}

/* ---------- câți copii sunt în mesaj ---------- */
.mos .cs-pas[data-pas="copil"] .pp-copii{grid-column:1/-1}
.mos .pp-copii__t{margin:0 0 8px;font:700 15px/1.3 var(--font-body);color:#1E1A20}
.mos .pp-copii__opt{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.mos .pp-copii__b{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-height:58px;padding:8px 6px;border:1.5px solid #e2d3c2;border-radius:14px;background:#fff;color:#1E1A20;cursor:pointer;
  transition:border-color .2s,background .2s,box-shadow .2s,transform .2s}
.mos .pp-copii__b b{font:700 14.5px/1.2 var(--font-body)}
.mos .pp-copii__b small{font:700 12px/1.2 var(--font-body);color:#c92a48}
.mos .pp-copii__b:hover{border-color:#c92a48;transform:translateY(-2px)}
.mos .pp-copii__b[aria-checked="true"]{border-color:#c92a48;background:#fff5f6;box-shadow:0 12px 22px -14px #c92a48}
.mos .pp-copii__b[aria-checked="true"] b{color:#c92a48}
.mos .pp-copii__b:focus-visible{outline:3px solid #dfa74f;outline-offset:2px}

/* ---------- telefon ---------- */
@media (max-width:899px){
  .mos .pp-plic{width:min(100%,330px);margin:14px auto 6px}
  .mos .pp-varste{gap:7px}
  .mos .pp-varste__b{min-height:46px;font-size:17px}
  .mos .cs-pas[data-pas="copil"] .hooo-camp--radio .hooo-optiune{min-height:58px;font-size:17px}
  .mos .pp-copii__b b{font-size:13.5px}
}

/* ---------- primul ecran (29.10.2026, Adrian: „zona cu numele și CTA pare nefinisată”; ceasul și garanția sub video; prețul în colțul videoului) ----------
   Tichetul e o capsulă: „Pentru [numele, scris de mână] [Pregătește-i mesajul]”, ca eticheta de pe daruri. În dreapta: videoul cu eticheta
   de preț în colț, iar dedesubt ceasul prețurilor de lansare și garanția cu „Al doilea cadou”. */
.mos .pm-erou__dreapta{grid-area:film;min-width:0;display:flex;flex-direction:column;gap:22px}
.mos .pm-erou__dreapta .pm-film{grid-area:auto;position:relative}

/* eticheta de preț, prinsă în colțul de sus al ramei */
.mos .pm-film .pm-pret-colt{position:absolute;top:-20px;right:-16px;z-index:6;margin:0;rotate:4deg;filter:drop-shadow(0 14px 18px #0009);pointer-events:none}
.mos .pm-film .pm-pret-colt .cf-oferta{margin:0;transform:scale(1.12);transform-origin:100% 0}
@media (prefers-reduced-motion:no-preference){
  .mos .pm-film .pm-pret-colt{animation:pm-pret-leagan 4.8s ease-in-out infinite;transform-origin:85% 0}
}
@keyframes pm-pret-leagan{0%,100%{rotate:4deg}50%{rotate:1.5deg}}

/* sub video: ceasul și garanția, centrate pe lățimea videoului */
.mos .pm-erou__dreapta .hooo-subcta,.mos .pm-erou__dreapta .pm-garantie{margin:0!important;justify-content:center;text-align:center}
.mos .pm-erou__dreapta .hooo-subcta__r,.mos .pm-erou__dreapta .hooo-tl,.mos .pm-erou__dreapta .hooo-tl__cap{justify-content:center!important;text-align:center!important}

/* tichetul */
.mos .pm-tichet.is-activ{max-width:600px}
.mos .pm-tichet__capsula{display:flex;align-items:center;gap:4px}
.mos .pm-tichet.is-activ .pm-tichet__capsula{padding:7px 7px 7px 22px;border-radius:999px;background:#fffaf1;
  box-shadow:0 0 0 1.5px #e2c99c,0 0 0 7px #ffffff14,0 22px 44px -22px #000;transition:box-shadow .25s}
.mos .pm-tichet.is-activ .pm-tichet__capsula:focus-within{box-shadow:0 0 0 2px #c92a48,0 0 0 7px #e6b76440,0 22px 44px -22px #000}
.mos .pm-tichet__pentru{flex:none;font:700 12px/1 var(--font-body);letter-spacing:.16em;text-transform:uppercase;color:#a0877a}
.mos .pm-tichet__in{flex:1 1 120px;min-width:0;height:56px;padding:8px 8px 0;border:0;border-radius:0;background:none;color:#1e295c;
  font:600 31px/1 var(--pf-mana,"hooo Scris",cursive);box-shadow:none}
.mos .pm-tichet__in::placeholder{font:600 31px/1 var(--pf-mana,"hooo Scris",cursive);color:#1e295c;opacity:.3}
.mos .pm-tichet__in:focus{outline:0}
.mos .pm-tichet.is-activ .pm-main-cta{flex:none;width:auto;min-height:56px;margin:0;padding:0 22px 0 26px;gap:16px}
@media (max-width:899px){
  .mos .pm-erou__dreapta{gap:18px}
  .mos .pm-film .pm-pret-colt{top:-14px;right:-6px}
  .mos .pm-film .pm-pret-colt .cf-oferta{transform:scale(.96)}
  .mos .pm-tichet.is-activ{max-width:none}
  .mos .pm-tichet.is-activ .pm-tichet__capsula{flex-wrap:wrap;gap:6px 4px;padding:6px 6px 6px 18px;border-radius:26px}
  .mos .pm-tichet__in{height:52px;font-size:29px}
  .mos .pm-tichet__in::placeholder{font-size:29px}
  .mos .pm-tichet.is-activ .pm-main-cta{flex:1 1 100%;width:100%;justify-content:space-between;margin-right:0}
}

/* ---------- lista din primul ecran (29.10.2026, Adrian: „o idee mai mari; bifele ca badge-ul de play, dar cu bifă”) ----------
   Fiecare bifă e un mic sigiliu de ceară roșie (ca sigiliul de pe butonul videoului), cu marginea ondulată, inelul presat și bifa crem. */
.mos .pm-erou .pm-sub-lista{gap:13px;max-width:34em}
.mos .pm-erou .pm-sub-lista li{padding-left:40px;font-size:17px;line-height:1.45;min-height:28px}
.mos .pm-erou .pm-sub-lista li::before{left:0;top:-1px;width:28px;height:28px;border-radius:50%;
  background:radial-gradient(circle at 34% 30%,#ef5a74 0 18%,#d1314f 46%,#a8173a 78%,#8a0f2e 100%);
  box-shadow:inset 0 0 0 3px #b61f40,inset 0 0 0 4.5px #ffb3c066,inset 0 -2px 3px #5c051c80,0 3px 6px #00000080;
  -webkit-mask:radial-gradient(circle,#000 62%,#0000 63%) 0 0/100% 100%,conic-gradient(from 0deg,#000 0 8deg,#0000 8deg 15deg,#000 15deg 30deg,#0000 30deg 36deg,#000 36deg 52deg,#0000 52deg 58deg,#000 58deg 75deg,#0000 75deg 81deg,#000 81deg 98deg,#0000 98deg 104deg,#000 104deg 121deg,#0000 121deg 127deg,#000 127deg 144deg,#0000 144deg 150deg,#000 150deg 167deg,#0000 167deg 173deg,#000 173deg 190deg,#0000 190deg 196deg,#000 196deg 213deg,#0000 213deg 219deg,#000 219deg 236deg,#0000 236deg 242deg,#000 242deg 259deg,#0000 259deg 265deg,#000 265deg 282deg,#0000 282deg 288deg,#000 288deg 305deg,#0000 305deg 311deg,#000 311deg 328deg,#0000 328deg 334deg,#000 334deg 360deg);
  rotate:-10deg}
.mos .pm-erou .pm-sub-lista li::after{left:10px;top:5px;width:7px;height:12px;border:solid #fff3e3;border-width:0 2.6px 2.6px 0;border-radius:0 0 1px 0;transform:rotate(42deg);filter:drop-shadow(0 1px 0 #6a0a24)}
.mos .pm-erou .pm-sub-lista b{color:#f2c879}
@media (max-width:899px){
  .mos .pm-erou .pm-sub-lista{gap:10px;max-width:400px}
  .mos .pm-erou .pm-sub-lista li{padding-left:34px;font-size:15.5px;min-height:24px}
  .mos .pm-erou .pm-sub-lista li::before{top:-1px;width:24px;height:24px}
  .mos .pm-erou .pm-sub-lista li::after{left:8.5px;top:4px;width:6px;height:11px;border-width:0 2.3px 2.3px 0}
}

/* ---------- „Frați? Același mesaj, +17 lei de copil.” sub capsulă (29.10.2026, Adrian: fără capsula ei) ----------
   Un rând simplu, legătură spre formularul cu doi copii: doi copii schițați cu auriu, textul, săgeata care înaintează la hover. */
.mos .pm-erou .pm-frati-pret{display:flex;margin:14px 0 0 6px}
.mos .pm-erou .pm-frati-pret a{display:inline-flex;align-items:center;gap:10px;padding:0;border:0;background:none;box-shadow:none;color:#e9e1d3;font-size:15px;text-decoration:none}
.mos .pm-erou .pm-frati-pret a>span:not(.pm-frati-pret__ic){padding:0;background:none;box-shadow:none;border:0} /* 29.10.2026, Adrian: fără linia punctată de dedesubt */
.mos .pm-erou .pm-frati-pret b{color:#f2c879}
.mos .pm-erou .pm-frati-pret a>svg{width:16px;height:16px;color:#f2c879;transition:transform .25s}
.mos .pm-erou .pm-frati-pret a:hover>span:not(.pm-frati-pret__ic){color:#fff}
.mos .pm-erou .pm-frati-pret a:hover>svg{transform:translateX(4px)}
.mos .pm-frati-pret__ic svg{display:block;width:30px;height:22px;fill:none;stroke:#f2c879;stroke-width:1.8;stroke-linecap:round}
@media (max-width:899px){
  .mos .pm-erou .pm-frati-pret{justify-content:center;margin:14px 0 0}
  .mos .pm-erou .pm-frati-pret a{font-size:14px}
}
.mos .pm-erou .pm-frati-pret .pm-frati-pret__ic{display:block;padding:0;border-radius:0;background:none;box-shadow:none}

/* ---------- vârsta ca listă (29.10.2026, Adrian: „ca să comasăm”); în fereastră, pe telefon, fără titlul cutiei și cu plicul mai mic ---------- */
.mos .pp-varsta__lista{position:relative}
.mos .pp-varsta__lista::after{content:"";position:absolute;right:20px;top:50%;width:9px;height:9px;border:solid #c92a48;border-width:0 2.2px 2.2px 0;transform:translateY(-70%) rotate(45deg);pointer-events:none}
.mos .pp-varsta__alege{-webkit-appearance:none;appearance:none;display:block;width:100%;height:56px;margin:0;padding:0 48px 0 18px;border:1.5px solid #e2d3c2;border-radius:16px;background:#fff;
  color:#1E1A20;font:700 17px/1 var(--font-display);cursor:pointer;transition:border-color .2s,box-shadow .2s}
.mos .pp-varsta__alege:hover{border-color:#c92a48}
.mos .pp-varsta__alege:focus{outline:0;border-color:#c92a48;box-shadow:0 0 0 4px #e6b76440}
.mos .pp-varsta__alege.is-gol{color:#a0877a;font-weight:600}
.mos .pp-varsta__alege option{color:#1E1A20;font-weight:600}
@media (max-width:899px){
  .mos dialog.pm-modal .pm-ghid__cap{display:none}
  .mos dialog.pm-modal .pp-plic{width:min(78%,250px);margin:12px auto 26px}
  .mos .pp-varsta__alege{height:52px;font-size:16.5px}
}