/*
 * „Cântecul tău”, creatorul (7 octombrie 2026; inc/produs-cantec.php, template-parts/produs/cantec.php, assets/cantec.js,
 * assets/cantec-scena.js). Varianta „wow”: limbajul primei pagini („Seara darurilor”): scene de noapte și de zmeuriu, titluri mari
 * în Bricolage Grotesque cu o singură frază zmeurie, carduri rotunjite, butoane-pastilă, ecoul celor trei o din siglă.
 *
 * Întâi telefonul (390 px): conținut lizibil, cu bara „Înapoi / Continuă” lipită jos (position: sticky în ghid). Niciun
 * strămoș al barei nu are overflow în afară de visible sau clip: hidden ar face din el un container de derulare, iar bara s-ar lipi
 * de el, nu de ecran (bug-ul din 5 octombrie, pe intro). Decorurile se taie în straturile lor (.cn-erou, .cn-atelier__ecou,
 * .cn-cadoul), nu în părinții barei. Mișcarea se oprește cu „reducerea mișcării” din sistem (la final).
 * Culorile: zmeuriu #C92A48 · cerneală #1E1A20 · roz pal #FBEEF1 · brad #1F5B4A · aur #F3DDAA · cremă #FFF3E3.
 */
body.cantec-creator{background:#FBF6EF}
/* Pagina cântecului păstrează atenția pe cadoul digital; oferta cutiilor rămâne în secțiunea de la final. */
body.cantec-creator .announcement--cutie{display:none}
body.cantec-creator main.shop{max-width:none;padding:0}
@media(max-width:370px){body.cantec-creator .footer-echo{gap:8px}}
.hp.cn{
  --cn-zm:#C92A48;--cn-zm-d:#A81F3B;--cn-zm-l:#EE5B78;--cn-zm-ll:#F59AAD;--cn-zm-pal:#FFF1F4;--cn-zm-linie:rgba(201,42,72,.28);
  --cn-ink:#1E1A20;--cn-ink-2:#4A444D;--cn-ink-3:#736B79;
  --cn-blush:#FBEEF1;--cn-pin:#1F5B4A;--cn-aur:#F3DDAA;--cn-aur-2:#E3B563;--cn-eticheta-disc:#EFD05E;
  --cn-crem:#FFF3E3;--cn-hartie:#FFFDFB;--cn-hartie-2:#FBF6EF;--cn-linie:#EAE2E6;--cn-linie-2:#F3EEF0;--cn-noapte:#171219;
  --cn-ease:cubic-bezier(.2,.8,.2,1);--cn-arc:cubic-bezier(.34,1.56,.5,1);
  --cn-anunt:0px;
  display:block;margin:0;color:var(--cn-ink);font-family:var(--font-body)
}
.cn [hidden]{display:none!important}
.cn .screen-reader-text{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.cn h1,.cn h2,.cn h3,.cn h4{font-family:var(--font-display);letter-spacing:-.025em;text-wrap:balance;margin:0}
.cn :focus-visible{outline:3px solid var(--cn-zm);outline-offset:2px;border-radius:8px}
.cn-wrap{width:min(1240px,calc(100% - 28px));margin-inline:auto}

/* ---------- elemente comune: eticheta, butoanele, vinilul, egalizatorul, telefonul ---------- */
.cn-eticheta{display:flex;align-items:center;gap:9px;margin:0 0 12px;font:650 11px/1.3 var(--font-body);letter-spacing:.16em;text-transform:uppercase;color:#F6B3C1}
.cn-stea{color:var(--cn-aur-2);font-size:13px;letter-spacing:0}
.cn-linie{flex:none;width:30px;height:1px;background:currentColor;opacity:.75}
.cn-eticheta--aur{color:var(--cn-aur)}
.cn-eticheta--zm{color:var(--cn-zm-d)}

.cn-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:50px;padding:0 22px;border:0;border-radius:999px;font:650 15.5px/1.15 var(--font-body);text-decoration:none;cursor:pointer;transition:background .2s,color .2s,box-shadow .2s,transform .2s var(--cn-ease),opacity .2s;-webkit-tap-highlight-color:transparent}
.cn-btn:disabled,.cn-btn[aria-disabled="true"]{opacity:.45;cursor:not-allowed}
.cn-btn:not(:disabled):active{transform:scale(.97)}
.cn-btn--zmeura{background:var(--cn-zm);color:#fff;box-shadow:0 14px 30px -14px rgba(201,42,72,.95)}
@media (hover:hover){.cn-btn--zmeura:not(:disabled):hover{background:var(--cn-zm-d);color:#fff}}
.cn-btn--linie{background:#fff;color:var(--cn-ink);box-shadow:inset 0 0 0 1.5px #D8CCD2}
@media (hover:hover){.cn-btn--linie:not(:disabled):hover{box-shadow:inset 0 0 0 1.5px var(--cn-ink)}}
.cn-btn--linie[aria-pressed="true"]{background:var(--cn-ink);color:#fff;box-shadow:none}
.cn-btn--fantoma{background:rgba(255,243,227,.06);color:var(--cn-crem);box-shadow:inset 0 0 0 1.5px rgba(255,243,227,.42)}
@media (hover:hover){.cn-btn--fantoma:hover{background:rgba(255,243,227,.12);box-shadow:inset 0 0 0 1.5px var(--cn-crem)}}
.cn-btn__play{flex:none;width:0;height:0;border-style:solid;border-width:6px 0 6px 10px;border-color:transparent transparent transparent currentColor}
.cn-btn--mare{min-height:54px;padding:0 26px;font-size:16px}
.cn-btn--mic{min-height:44px;padding:10px 16px;font-size:14px;line-height:1.3}

/* Vinilul reacționează numai la audiție. Reflexul se rotește, eticheta hooo rămâne lizibilă. */
.cn-vinil{position:absolute;display:grid;place-items:center;aspect-ratio:1;border-radius:50%;container-type:inline-size;
  background:radial-gradient(circle,transparent 0 31%,rgba(255,255,255,.05) 31.5% 32%,transparent 33%),repeating-radial-gradient(circle at center,#28222B 0 2px,#3A343F 2.6px,#1C181E 3.4px);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.06),0 24px 60px -24px rgba(0,0,0,.8)}
.cn-vinil::after{content:"";position:absolute;inset:0;border-radius:50%;background:conic-gradient(from 20deg,transparent 0 10%,rgba(255,255,255,.12) 14%,transparent 19% 52%,rgba(255,255,255,.09) 57%,transparent 62%);animation:cn-roteste 9s linear infinite;animation-play-state:paused}
.cn-erou.is-audio.is-motion-running .cn-vinil::after{animation-play-state:running}
.cn-vinil__et{position:relative;z-index:1;display:grid;place-items:center;width:33%;aspect-ratio:1;border-radius:50%;background:var(--cn-eticheta-disc);color:var(--cn-ink);font:800 10cqi/1 var(--font-display);letter-spacing:-.04em;box-shadow:inset 0 0 0 1.5cqi rgba(30,26,32,.08)}
@keyframes cn-roteste{to{transform:rotate(360deg)}}

.cn-eq{display:inline-flex;align-items:flex-end;gap:2px;height:14px}
.cn-eq i{display:block;width:3px;height:100%;border-radius:2px;background:currentColor;transform-origin:50% 100%;transform:scaleY(.3);animation:cn-eq .9s ease-in-out infinite}
.cn-eq i:nth-child(2){animation-duration:.7s;animation-delay:-.3s}
.cn-eq i:nth-child(3){animation-duration:1.1s;animation-delay:-.55s}
.cn-eq i:nth-child(4){animation-duration:.8s;animation-delay:-.15s}
.cn-eq i:nth-child(5){animation-duration:1s;animation-delay:-.45s}
.cn-eq i:nth-child(6){animation-duration:.75s;animation-delay:-.65s}
.cn-eq i:nth-child(7){animation-duration:.95s;animation-delay:-.2s}
.cn-eq i:nth-child(8){animation-duration:1.15s;animation-delay:-.8s}
.cn-eq i:nth-child(9){animation-duration:.85s;animation-delay:-.4s}
@keyframes cn-eq{0%,100%{transform:scaleY(.25)}50%{transform:scaleY(1)}}

/* telefonul: rama și ecranul 9:16, cât videoclipul adevărat (1080 × 1920), ca nimic din el să nu fie tăiat; poza, bucla sau
   videoclipul, insula și semnul AI (sus, în dreapta, ca în videoclip); textele din ecran cresc cu el (cqi) */
.cn-telefon{position:relative;z-index:2;width:100%;margin:0;padding:3.6%;border-radius:15%/8.6%;
  background:linear-gradient(150deg,#45404A 0%,#16121A 38%,#0E0B10 70%,#36303B 100%);
  box-shadow:0 0 0 1px rgba(255,255,255,.1),inset 0 0 0 1.5px rgba(255,255,255,.06),0 36px 70px -26px rgba(0,0,0,.8)}
.cn-telefon__ecran{position:relative;width:100%;aspect-ratio:9/16;overflow:hidden;border-radius:12%/6.8%;background:#0C090E;isolation:isolate;container-type:inline-size}
.cn-telefon__poster,.cn-telefon__video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.cn-telefon__video{opacity:0;transition:opacity .7s ease}
.cn-telefon__video.is-on{opacity:1}
.cn-telefon__insula{position:absolute;z-index:5;top:2.4%;left:50%;width:30%;height:3.1%;border-radius:999px;background:#000;transform:translateX(-50%)}
.cn-telefon__ai{position:absolute;z-index:4;top:6.4%;right:5.5%;font:500 3.2cqi/1.2 var(--font-body);color:rgba(255,255,255,.78);white-space:nowrap;text-shadow:0 1px 3cqi rgba(0,0,0,.5)}

/* versurile pe ecran, ca în videoclipul adevărat: în treimea de sus, peste o umbră; întâi titlul, liniuța zmeurie, „Pentru …” și
   „de la …”, apoi rândul cântat (mare) și următorul (mai mic, estompat) */
.cn-clip{position:absolute;inset:0;z-index:3;color:#fff;text-align:center;pointer-events:none}
.cn-clip__umbra{position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,6,12,.72) 0%,rgba(10,6,12,.5) 30%,rgba(10,6,12,.1) 50%,rgba(10,6,12,0) 62%)}
.cn-clip__cap,.cn-clip__randuri{position:absolute;left:7%;right:7%;top:19%;transition:opacity .6s var(--cn-ease),transform .6s var(--cn-ease)}
.cn-clip__titlu{margin:0;font:800 8.4cqi/1.06 var(--font-display);letter-spacing:-.025em;text-shadow:0 .5cqi 4cqi rgba(0,0,0,.45);text-wrap:balance}
.cn-clip__pentru{margin:0;font:650 5cqi/1.3 var(--font-body);color:rgba(255,255,255,.92)}
.cn-clip__pentru::before{content:"";display:block;width:8cqi;height:.6cqi;margin:3.6cqi auto 3.4cqi;border-radius:1cqi;background:var(--cn-zm-l)}
.cn-clip__dela{margin:.6cqi 0 0;font:500 4.2cqi/1.3 var(--font-body);color:rgba(255,255,255,.8)}
.cn-clip__randuri{top:20%;opacity:0;transform:translateY(3cqi)}
.cn-clip__acum{margin:0;font:760 6.6cqi/1.18 var(--font-display);letter-spacing:-.01em;text-shadow:0 .5cqi 4cqi rgba(0,0,0,.5);text-wrap:balance}
.cn-clip__urm{margin:3.2cqi 0 0;font:500 4.6cqi/1.25 var(--font-body);color:rgba(255,255,255,.66);text-wrap:balance}
.cn-clip.is-versuri .cn-clip__cap{opacity:0;transform:translateY(-3cqi)}
.cn-clip.is-versuri .cn-clip__randuri{opacity:1;transform:none}
.cn-clip.is-rand .cn-clip__acum{animation:cn-vers-intra .6s var(--cn-ease)}
.cn-clip.is-rand .cn-clip__urm{animation:cn-vers-intra .6s var(--cn-ease) .08s backwards}
@keyframes cn-vers-intra{from{opacity:0;transform:translateY(2.4cqi)}}

/* „Pornește sunetul”: sub telefon, cu egalizatorul cât se aude */
.cn-sunet{position:relative;left:50%;z-index:6;display:flex;align-items:center;justify-content:center;gap:7px;width:max-content;min-height:38px;margin:-19px 0 0;padding:0 14px 0 11px;transform:translateX(-50%);border:0;border-radius:999px;background:#fff;color:var(--cn-ink);font:650 13px/1 var(--font-body);white-space:nowrap;cursor:pointer;box-shadow:0 12px 26px -10px rgba(0,0,0,.65);transition:background .2s,color .2s,transform .2s var(--cn-ease)}
.cn-sunet__ic svg{display:block;width:18px;height:18px}
.cn-sunet .cn-eq{display:none;height:13px}
.cn-sunet[aria-pressed="false"] .cn-sunet__unde,.cn-sunet[aria-pressed="true"] .cn-sunet__x{display:none}
.cn-sunet[aria-pressed="true"]{background:var(--cn-zm);color:#fff}
.cn-sunet[aria-pressed="true"] .cn-sunet__ic{display:none}
.cn-sunet[aria-pressed="true"] .cn-eq{display:inline-flex}
@media (hover:hover){.cn-sunet:hover{transform:translate(-50%,-1px)}}

/* ---------- 1. Muzică și ecou: auroră, inele hooo și puls. Mișcarea rulează numai când scena este vizibilă. ---------- */
.cn-erou{position:relative;isolation:isolate;overflow:hidden;padding:28px 0 72px;background:var(--cn-noapte);color:var(--cn-crem)}
.cn-erou__fundal{position:absolute;inset:0;z-index:-1;overflow:hidden;pointer-events:none;background:linear-gradient(125deg,#211724,#23122F 58%,#391729)}
.cn-erou__fundal::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(21,16,24,.94),rgba(21,16,24,.72) 35%,rgba(21,16,24,.12) 74%),linear-gradient(0deg,rgba(23,18,25,.75),transparent 30%)}
.cn-aura{position:absolute;display:block;border-radius:50%;animation:cn-aurora 14s ease-in-out infinite alternate;animation-play-state:paused;transform-origin:50% 50%}
.cn-aura--1{top:-24%;right:-23%;width:115%;height:118%;background:radial-gradient(ellipse,rgba(237,45,112,.78),rgba(194,26,101,.42) 35%,transparent 68%)}
.cn-aura--2{right:-12%;bottom:-29%;width:100%;height:112%;background:radial-gradient(ellipse,rgba(119,58,227,.82),rgba(85,32,162,.38) 40%,transparent 68%);animation-duration:18s;animation-delay:-7s;animation-direction:alternate-reverse}
.cn-aura--3{top:-34%;right:-31%;width:100%;height:104%;background:radial-gradient(ellipse,rgba(250,177,95,.62),rgba(240,115,87,.3) 33%,transparent 64%);animation-duration:21s;animation-delay:-11s}
.cn-ecouri{position:absolute;top:47%;right:-225px;width:650px;aspect-ratio:1;transform:translateY(-50%)}
.cn-ecouri i{position:absolute;inset:0;display:block;border:1px solid rgba(255,177,203,.52);border-radius:50%;box-shadow:inset 0 0 32px rgba(239,81,137,.12),0 0 28px rgba(239,81,137,.13);animation:cn-ecou-lumina 9s ease-in-out infinite;animation-play-state:paused}
.cn-ecouri i:nth-child(2){inset:13%;border-color:rgba(255,214,172,.5);animation-delay:-3s}
.cn-ecouri i:nth-child(3){inset:26%;border-color:rgba(212,180,255,.6);animation-delay:-6s}
.cn-erou.is-motion-running .cn-aura,.cn-erou.is-motion-running .cn-ecouri i,.cn-erou.is-motion-running .cn-telefon--erou{animation-play-state:running}
@keyframes cn-aurora{from{transform:translate3d(-3%,-3%,0) rotate(-8deg) scale(.94);opacity:.75}to{transform:translate3d(4%,5%,0) rotate(8deg) scale(1.08);opacity:1}}
@keyframes cn-ecou-lumina{0%,100%{transform:scale(.97);opacity:.5}50%{transform:scale(1.04);opacity:1}}
.cn-erou__grila{display:grid;grid-template-columns:minmax(0,1fr);gap:28px;align-items:center}
.cn-erou__text{display:grid;justify-items:start;gap:13px;min-width:0}
.cn-erou .cn-eticheta{margin:0}
.cn-titlu{margin:0;max-width:16ch;font-size:clamp(36px,9.7vw,68px);font-weight:800;line-height:1.04;letter-spacing:-.04em;color:var(--cn-crem);text-wrap:balance}
.cn-titlu em{font-style:normal;color:var(--cn-zm-l);text-decoration:underline;text-decoration-thickness:.035em;text-underline-offset:.1em;text-decoration-color:rgba(238,91,120,.35)}
.cn-erou__sub{margin:0;max-width:34em;font-size:15.5px;line-height:1.55;color:rgba(255,243,227,.84)}
/* dovezile: trei pastile mici */
.cn-dovezi{display:flex;flex-wrap:wrap;gap:6px;margin:0;padding:0;list-style:none}
.cn-dovezi li{display:flex;align-items:center;gap:6px;min-height:30px;padding:5px 11px;border-radius:999px;background:rgba(255,243,227,.08);box-shadow:inset 0 0 0 1px rgba(255,243,227,.16);font-size:12.5px;font-weight:650;line-height:1.15;color:var(--cn-crem)}
.cn-dovezi svg{flex:none;width:15px;height:15px;color:var(--cn-zm-l)}
/* oferta lângă acțiune: prețul WooCommerce și conținutul cadoului digital */
.cn-erou__offre{display:grid;gap:7px;max-width:35em;margin-top:4px}
.cn-erou__offre .cn-pret b{font-size:34px;color:var(--cn-crem)}
.cn-erou__offre .cn-pret del{font-size:18px;color:rgba(255,243,227,.66)}
.cn-erou__inclus{margin:0;font-size:14px;line-height:1.45;color:rgba(255,243,227,.9)}
/* Pulsul CTA-ului se oprește la hover/focus și împreună cu scena, fără deplasare laterală. */
.cn-erou__actiune{display:flex;flex-wrap:wrap;align-items:center;gap:14px 12px;width:100%;margin-top:0;padding:4px 0}
.cn-demo-cta{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:46px;padding:10px 19px;border:1px solid rgba(255,243,227,.55);border-radius:999px;background:rgba(255,243,227,.08);color:var(--cn-crem);font:650 15px/1.3 var(--font-body);cursor:pointer}
.cn-demo-cta[aria-pressed=true]{background:var(--cn-crem);color:var(--cn-noapte)}
.cn .cn-demo-cta:focus-visible{outline-color:var(--cn-crem)}
.cn-erou-auditie{display:grid;grid-template-columns:36px minmax(0,1fr);gap:10px 12px;align-items:center;flex-basis:100%;width:100%;max-width:440px;padding:12px;border:1px solid rgba(255,243,227,.2);border-radius:18px;background:rgba(255,243,227,.045)}
.cn-erou-auditie__coperta{display:block;width:36px;height:64px;border-radius:6px;object-fit:cover;align-self:start;box-shadow:0 5px 12px rgba(0,0,0,.2)}
.cn-erou-auditie__text{display:flex;flex-wrap:wrap;align-items:center;gap:2px 9px;min-width:0}
.cn-erou-auditie small{flex-basis:100%;font-size:11.5px;line-height:1.35;color:rgba(255,243,227,.75)}
.cn-erou-auditie .cn-demo-cta{justify-content:flex-start;min-height:44px;gap:7px;padding:6px 0;border:0;border-radius:6px;background:transparent;font-size:14px}
.cn-erou-auditie .cn-demo-cta[aria-pressed=true]{color:var(--cn-zm-ll)}
.cn-demo-inceput{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:5px 2px;border:0;border-radius:6px;background:transparent;color:rgba(255,243,227,.8);font:500 12px/1.3 var(--font-body);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.cn .cn-demo-inceput:focus-visible{outline-color:var(--cn-crem)}
.cn-erou-auditie__vers{flex-basis:100%;margin:0;font:650 15px/1.3 var(--font-display);color:var(--cn-zm-ll)}
.cn-erou-auditie>.cn-erou-auditie__vers{grid-column:2}
@media (hover:hover){.cn-erou-auditie .cn-demo-cta:hover,.cn-demo-inceput:hover{color:#fff;text-decoration:underline;text-underline-offset:3px}}
.cn-erou__nota{flex-basis:100%;max-width:37em;margin:0;font-size:12.5px;line-height:1.5;color:rgba(255,243,227,.78)}
.cn-cta{position:relative;isolation:isolate;display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:62px;padding:0 32px;border-radius:999px;background:linear-gradient(180deg,#DC3858 0%,var(--cn-zm) 52%,var(--cn-zm-d) 100%);color:#fff;font:760 18.5px/1 var(--font-display);letter-spacing:-.01em;text-decoration:none;box-shadow:0 20px 44px -16px rgba(201,42,72,.95),inset 0 1px 0 rgba(255,255,255,.22);transition:transform .35s var(--cn-ease),box-shadow .3s;-webkit-tap-highlight-color:transparent}
.cn-cta::before{content:"";position:absolute;inset:-14px -18px;z-index:-1;border-radius:inherit;background:radial-gradient(closest-side,rgba(238,91,118,.35),rgba(238,91,118,0));pointer-events:none}
.cn-cta:hover,.cn-cta:focus-visible{color:#fff;box-shadow:0 24px 50px -14px rgba(201,42,72,1),inset 0 1px 0 rgba(255,255,255,.25)}
.cn-cta:focus-visible{outline:3px solid var(--cn-crem);outline-offset:4px}
.cn-cta:active{transform:scale(.97)}
.cn-erou .cn-cta{animation:cn-cta-puls 3.2s ease-in-out infinite;animation-play-state:paused}
.cn-erou .cn-cta::before{animation:cn-cta-lumina 3.2s ease-in-out infinite;animation-play-state:paused}
.cn-erou.is-motion-running .cn-cta,.cn-erou.is-motion-running .cn-cta::before{animation-play-state:running}
.cn-erou .cn-cta:is(:hover,:focus-visible,:active),.cn-erou .cn-cta:is(:hover,:focus-visible,:active)::before{animation-play-state:paused}
@keyframes cn-cta-puls{0%,100%{transform:scale(1)}50%{transform:scale(1.025)}}
@keyframes cn-cta-lumina{0%,100%{transform:scale(.92);opacity:.6}50%{transform:scale(1.2);opacity:1}}
/* Pe mobil, cardul de audiție ține demonstrația aproape de CTA; telefonul amplu apare de la tabletă. */
.cn-erou__vizual{display:none;position:relative;justify-self:center;width:min(190px,52vw);margin:0 0 22px}
.cn-telefon--erou{animation:cn-telefon-pluteste 8s ease-in-out infinite;animation-play-state:paused;box-shadow:0 0 0 1px rgba(255,255,255,.1),inset 0 0 0 1.5px rgba(255,255,255,.06),0 36px 70px -26px rgba(0,0,0,.85),0 0 90px -16px rgba(201,42,72,.55)}
.cn-vinil--erou{z-index:1;width:146%;top:4%;left:44%}
@keyframes cn-telefon-pluteste{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-8px) rotate(-1deg)}}
.cn-pret{display:flex;align-items:baseline;flex-wrap:wrap;gap:2px 10px;margin:0}
.cn-pret del{font:600 17px/1 var(--font-display);color:var(--cn-ink-3);text-decoration-thickness:2px}
.cn-pret b{font:800 32px/1 var(--font-display);letter-spacing:-.035em;color:var(--cn-zm-d)}

/* ---------- 2. ghidul: „Hai să-l facem”, pe zmeuriu, cu ecoul celor trei o ---------- */
.cn-atelier{position:relative;isolation:isolate;padding:30px 0 34px;color:var(--cn-crem);
  background:radial-gradient(1100px 620px at 12% -14%,rgba(236,92,118,.55),transparent 62%),radial-gradient(1000px 720px at 104% 112%,rgba(122,14,38,.6),transparent 64%),var(--cn-zm)}
.cn-atelier__ecou{position:absolute;inset:0;z-index:-1;overflow:hidden;pointer-events:none}
.cn-atelier__ecou::before{content:"";position:absolute;top:18px;right:-90px;width:min(880px,120vw);aspect-ratio:248/96;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='105 52 248 96'%3E%3Cg fill='none' stroke='%23FFF3E3' stroke-width='4'%3E%3Ccircle cx='153' cy='100' r='43.5' stroke-opacity='.2'/%3E%3Ccircle cx='253' cy='112' r='31.5' stroke-opacity='.15'/%3E%3Ccircle cx='329' cy='124' r='19.5' stroke-opacity='.1'/%3E%3C/g%3E%3C/svg%3E") no-repeat center/contain}
.cn-atelier__cap{margin:0 4px 16px}
.cn-atelier__cap .cn-eticheta{margin-bottom:10px}
.cn-atelier__t{font-size:clamp(36px,10vw,68px);font-weight:760;line-height:1;letter-spacing:-.04em;color:var(--cn-crem)}
.cn-atelier__t em{font-style:normal;color:var(--cn-aur)}

/* panoul cu pașii */
/* 26.10.2026, Adrian („formularul se face mai mic/mai mare în funcție de pas … ești distras de elementele de mai jos”): panoul are
   cel puțin un ecran, la fiecare pas; conținutul stă sus, capsula jos, iar ce e sub ghid nu se vede cât lucrezi în el */
.cn-ghid{position:relative;display:flex;flex-direction:column;min-height:calc(100svh - var(--hdr-h) - 12px);padding:14px 16px 0;border-radius:24px;background:var(--cn-hartie);color:var(--cn-ink);box-shadow:0 44px 90px -44px rgba(74,8,24,.85),0 0 0 1px rgba(255,255,255,.35)}
.cn-noscript{margin:0 0 12px;padding:12px 14px;border-radius:12px;background:var(--cn-zm-pal);font-size:15px}

/* progresul: cele trei o din hooo se umplu, pas cu pas (--f1, --f2, --f3, de la cantec.js); la pasul 5, sigla e plină */
/* 26.10.2026: în ghid, progresul e acum cu segmente (mai jos, „segmentele”); sigla rămâne pentru pagina de plată (plata-cantec.css) */
.cn-progres{display:flex;align-items:flex-end;gap:12px;margin:0 0 16px}
.cn-hooo{flex:none;width:82px;height:auto;overflow:visible}
.cn-hooo__h{fill:none;stroke:var(--cn-ink);stroke-width:13;stroke-linecap:round;stroke-linejoin:round}
.cn-o__pista{fill:var(--cn-zm-pal)}
.cn-o__apa{fill:var(--cn-zm-l);animation:cn-val 2.6s linear infinite}
.cn-o__inel{fill:none;stroke:#E7D4DA;stroke-width:13;transition:stroke .5s}
.cn-o.is-plin .cn-o__inel{stroke:var(--cn-zm)}
.cn-o.is-plin .cn-o__apa{fill:var(--cn-zm)}
.cn-o__nivel{transition:transform 1s var(--cn-arc)}
.cn-o--1 .cn-o__nivel{transform:translate(96px,calc(134.5px - var(--f1,0) * 78px))}
.cn-o--2 .cn-o__nivel{transform:translate(208px,calc(134.5px - var(--f2,0) * 54px))}
.cn-o--3 .cn-o__nivel{transform:translate(300px,calc(134.5px - var(--f3,0) * 30px))}
@keyframes cn-val{to{transform:translateX(-40px)}}
.cn-hooo.is-sarbatoare .cn-o{animation:cn-o-sare .7s var(--cn-arc) both}
.cn-hooo.is-sarbatoare .cn-o--2{animation-delay:.1s}
.cn-hooo.is-sarbatoare .cn-o--3{animation-delay:.2s}
@keyframes cn-o-sare{40%{transform:translateY(-14px)}}
/* segmentele: GEN · STIL · POVESTE · CÂNTECUL și „2/4”; textul complet al pasului rămâne doar pentru cititoarele de ecran */
.cn-progres__t,.cn-substatus{position:absolute!important;width:1px;height:1px;margin:0;padding:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}
.cn-progres__bara{flex:1;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;min-width:0;margin:0;padding:0;list-style:none}
.cn-progres__seg{display:grid;gap:8px;width:100%;min-width:0;padding:10px 0 4px;border:0;background:none;color:var(--cn-ink-3);font:750 10.5px/1 var(--font-body);letter-spacing:.07em;text-transform:uppercase;text-align:left;cursor:default;-webkit-tap-highlight-color:transparent}
.cn-progres__seg:not(:disabled){cursor:pointer}
.cn-progres__linie{display:block;height:5px;border-radius:5px;background:var(--cn-linie-2);overflow:hidden}
.cn-progres__umple{display:block;width:var(--umple,0%);height:100%;border-radius:inherit;background:var(--cn-zm);transition:width .6s var(--cn-ease)}
.cn-progres__et{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cn-progres__bara>.is-gata .cn-progres__seg{color:var(--cn-ink-2)}
.cn-progres__bara>.is-gata .cn-progres__umple{background:var(--cn-zm-l)}
.cn-progres__bara>.is-acum .cn-progres__seg{color:var(--cn-zm-d)}
@media (hover:hover){.cn-progres__seg:not(:disabled):hover{color:var(--cn-ink)}}
.cn-progres__seg:focus-visible{outline:2px solid var(--cn-zm);outline-offset:3px;border-radius:4px}
.cn-progres__nr{flex:none;padding:0 0 3px;font:760 13px/1 var(--font-display);letter-spacing:.02em;color:var(--cn-ink-3);font-variant-numeric:tabular-nums}

/* proiectul personal: o previzualizare compactă a aspectului, după completarea numelui */
.cn-proiect{display:grid;grid-template-columns:42px minmax(0,1fr);align-items:center;gap:8px 11px;margin:0 0 16px;padding:11px 12px;border:1px solid var(--cn-zm-linie);border-radius:16px;background:var(--cn-zm-pal)}
.cn-proiect__coperta{display:block;width:42px;height:54px;border-radius:8px;object-fit:cover;object-position:50% 60%;box-shadow:0 5px 12px -8px rgba(30,26,32,.55)}
.cn-proiect__text{display:grid;gap:3px;min-width:0}
.cn-proiect__text>small{font-size:10px;line-height:1.2;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--cn-zm-d)}
.cn-proiect__text>strong{font:750 16px/1.2 var(--font-display);overflow-wrap:anywhere;color:var(--cn-ink)}
.cn-proiect__text>span{font-size:12px;line-height:1.4;overflow-wrap:anywhere;color:var(--cn-ink-2)}
.cn-proiect>small{grid-column:1/-1;font-size:11px;line-height:1.3;color:var(--cn-ink-3)}

.cn-pasi{flex:1 0 auto;display:flex;flex-direction:column}
.cn-pas{flex:1 0 auto;padding:0 0 16px}
.cn-pas.cn-intra--inainte{animation:cn-intra-inainte .5s var(--cn-ease) both}
.cn-pas.cn-intra--inapoi{animation:cn-intra-inapoi .5s var(--cn-ease) both}
@keyframes cn-intra-inainte{from{opacity:0;transform:translate3d(28px,0,0)}}
@keyframes cn-intra-inapoi{from{opacity:0;transform:translate3d(-28px,0,0)}}
.cn-pas__t{font-size:clamp(22px,6vw,32px);font-weight:760;line-height:1.08;color:var(--cn-ink);outline:0}
.cn-pas__t em{font-style:normal;color:var(--cn-zm)}
.cn-pas__t.is-hooo{animation:cn-hooo .8s var(--cn-arc)}
@keyframes cn-hooo{0%{transform:scale(.9);opacity:0}60%{transform:scale(1.04);opacity:1}100%{transform:none}}
.cn-pas__sub{margin:5px 0 12px;font-size:14.5px;line-height:1.45;color:var(--cn-ink-2)}
.cn-pas__sub b{color:var(--cn-zm-d);font-weight:650}
.cn-eroare{display:block;margin:8px 0 0;font-size:13.5px;line-height:1.4;font-weight:600;color:#B42318}
.cn-eroare::before{content:"! ";font-weight:800}

/* intrările ascunse ale alegerilor: rămân în tab și pentru cititoarele de ecran */
.cn-dala input,.cn-stil input,.cn-voce input,.cn-cip input{position:absolute;opacity:0;width:1px;height:1px;margin:0;pointer-events:none}

/* 1. genurile (12): textul rămâne vizibil, selecția este în stânga sus, ascultarea în dreapta sus.
   Înălțimea crește cu textul, fără comprimarea descrierilor pentru a încăpea într-un singur ecran. */
.cn-dale{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.cn-dala-loc{position:relative;display:grid;min-width:0;min-height:142px}
.cn-dala{position:relative;display:flex;flex-direction:column;justify-content:flex-end;min-width:0;padding:60px 11px 12px;border-radius:14px;overflow:hidden;isolation:isolate;background:#2A2230;color:#fff;cursor:pointer;box-shadow:0 8px 18px -12px rgba(30,26,32,.6);transition:transform .3s var(--cn-ease),box-shadow .3s}
.cn-dala__fundal{position:absolute;inset:0;z-index:-2}
.cn-dala__fundal img,.cn-dala__fundal video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 62%;transition:transform 1.2s var(--cn-ease),opacity .6s}
.cn-dala__fundal video{opacity:0}
.cn-dala-loc.is-video .cn-dala__fundal video{opacity:1}
.cn-dala::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(14,9,16,.12) 0%,rgba(14,9,16,.72) 48%,rgba(14,9,16,.95) 100%);transition:background .3s}
.cn-dala__text{display:grid;gap:4px}
.cn-dala__t{font:760 15.5px/1.15 var(--font-display);letter-spacing:-.01em;overflow-wrap:anywhere;text-shadow:0 1px 10px rgba(0,0,0,.45)}
.cn-dala__d{font-size:12.5px;line-height:1.35;color:rgba(255,255,255,.94)}
.cn-dala__bifa{position:absolute;top:10px;left:10px;display:grid;place-items:center;width:24px;height:24px;border-radius:50%;border:1.5px solid rgba(255,255,255,.72);background:rgba(14,9,16,.45);color:transparent;box-shadow:0 4px 10px -3px rgba(0,0,0,.5);transition:background .2s,color .2s,border-color .2s,transform .4s var(--cn-arc)}
.cn-dala__bifa svg{width:14px;height:14px}
.cn-dala.is-ales{box-shadow:0 0 0 3px var(--cn-zm),0 16px 34px -14px rgba(201,42,72,.85);transform:translateY(-2px)}
.cn-dala.is-ales .cn-dala__bifa{border-color:var(--cn-zm);background:var(--cn-zm);color:#fff;transform:scale(1.08)}
.cn-dala.is-focus{outline:3px solid var(--cn-ink);outline-offset:3px}
@media (hover:hover){
  .cn-dala:hover{transform:translateY(-3px);box-shadow:0 18px 34px -16px rgba(30,26,32,.7)}
  .cn-dala.is-ales:hover{box-shadow:0 0 0 3px var(--cn-zm),0 18px 36px -14px rgba(201,42,72,.85)}
  .cn-dala:hover .cn-dala__fundal img,.cn-dala:hover .cn-dala__fundal video{transform:scale(1.06)}
}
/* fără imagine: cardul simplu, cu pictograma */
.cn-dala--simpla{background:#fff;color:var(--cn-ink);border:1.5px solid var(--cn-linie);justify-content:flex-start}
.cn-dala--simpla::after{display:none}
.cn-dala--simpla .cn-dala__fundal{position:static;z-index:auto;margin-bottom:6px}
.cn-dala--simpla .cn-dala__t{text-shadow:none}
.cn-dala--simpla .cn-dala__d{color:var(--cn-ink-3)}
.cn-dala--simpla .cn-dala__bifa{border-color:#D5C8CE;background:var(--cn-zm-pal)}
.cn-dala--simpla.is-ales .cn-dala__bifa{border-color:var(--cn-zm);background:var(--cn-zm)}
.cn-dala__ic{display:grid;place-items:center;width:32px;height:32px;border-radius:10px;background:var(--cn-zm-pal);color:var(--cn-zm)}
.cn-dala__ic svg{width:19px;height:19px}
/* butonul mare de ascultare, cu inelul care arată cât s-a ascultat și egalizatorul cât cântă */
.cn-asculta{position:absolute;z-index:3;top:9px;right:9px;display:grid;place-items:center;width:44px;height:44px;padding:0;border:0;border-radius:50%;background:rgba(255,255,255,.96);color:var(--cn-ink);cursor:pointer;box-shadow:0 8px 18px -8px rgba(0,0,0,.6);transition:transform .25s var(--cn-ease),background .2s,color .2s;-webkit-tap-highlight-color:transparent}
.cn-asculta__play,.cn-asculta__pauza{grid-area:1/1;width:17px;height:17px}
.cn-asculta__play{margin-left:2px}
.cn-asculta__pauza{display:none}
.cn-asculta__inel{position:absolute;inset:-5px;width:calc(100% + 10px);height:calc(100% + 10px);transform:rotate(-90deg);pointer-events:none;overflow:visible}
.cn-asculta__inel circle{fill:none;stroke:#fff;stroke-width:3;stroke-linecap:round;stroke-dasharray:100;stroke-dashoffset:calc(100 - var(--cn-p,0) * 100);opacity:0;transition:stroke-dashoffset .3s linear,opacity .25s}
.cn-asculta[aria-pressed="true"]{background:var(--cn-ink);color:#fff}
.cn-asculta[aria-pressed="true"] .cn-asculta__play{display:none}
.cn-asculta[aria-pressed="true"] .cn-asculta__pauza{display:block}
.cn-asculta[aria-pressed="true"] .cn-asculta__inel circle{opacity:1}
@media (hover:hover){.cn-asculta:hover{transform:scale(1.08)}}
.cn-eq--dala{position:absolute;z-index:3;left:11px;top:42px;height:10px;color:#fff;opacity:0;transition:opacity .25s;filter:drop-shadow(0 1px 4px rgba(0,0,0,.5));pointer-events:none}
.cn-dala-loc.is-reda .cn-eq--dala{opacity:1}
.cn-dala--simpla~.cn-asculta{background:var(--cn-ink);color:#fff}
.cn-dala--simpla~.cn-eq--dala{color:var(--cn-zm)}

/* intrare opțională pentru cei care preferă să pornească de la atmosfera cadoului */
.cn-gen-ajutor{margin:0 0 16px;border:1px solid var(--cn-linie);border-radius:16px;background:#fff}
.cn-gen-ajutor>summary{min-height:48px;padding:14px 16px;font:650 14px/1.4 var(--font-body);color:var(--cn-zm-d);cursor:pointer}
.cn-gen-ajutor__optiuni{display:grid;gap:8px;padding:0 12px 12px}
.cn-gen-ajutor>p{margin:0 16px 14px;font-size:12.5px;line-height:1.45;color:var(--cn-ink-2)}
.cn-directie{display:grid;gap:4px;min-width:0;min-height:64px;padding:12px 14px;border:1px solid var(--cn-linie);border-radius:12px;background:var(--cn-hartie);color:var(--cn-ink);font:700 14px/1.3 var(--font-body);text-align:left;cursor:pointer;transition:background .2s,border-color .2s}
.cn-directie small{font-size:12.5px;line-height:1.4;font-weight:500;color:var(--cn-ink-2)}
.cn-directie.is-ales{border-color:var(--cn-zm);background:var(--cn-zm-pal)}
@media (hover:hover){.cn-directie:hover{border-color:var(--cn-zm)}}

/* 2. stilurile (coperte cu discul care iese când e ales) și vocea (pictograme, cu unde la alegere) */
.cn-stiluri__gen{display:grid;gap:8px}
.cn-stil{position:relative;display:grid;grid-template-columns:66px minmax(0,1fr) 24px;column-gap:12px;align-items:center;padding:8px 12px 8px 8px;border:1.5px solid var(--cn-linie);border-radius:16px;background:#fff;cursor:pointer;transition:border-color .2s,background .2s,box-shadow .2s,transform .2s var(--cn-ease)}
.cn-stil__coperta{position:relative;grid-row:1/3;width:54px;height:54px}
.cn-stil__coperta img{position:relative;z-index:1;display:block;width:54px;height:54px;border-radius:11px;object-fit:cover;object-position:var(--cn-poz,50% 70%);filter:hue-rotate(var(--cn-nuanta,0deg)) saturate(1.08);box-shadow:0 8px 16px -9px rgba(0,0,0,.6)}
.cn-stil__disc{position:absolute;top:4px;left:4px;width:46px;height:46px;border-radius:50%;background:radial-gradient(circle,var(--cn-zm) 0 17%,#F7DCE2 18% 20%,transparent 21%),repeating-radial-gradient(circle,#2A2430 0 1.5px,#413A47 2.4px,#211C24 3.3px);transition:left .5s var(--cn-arc)}
.cn-stil.is-ales .cn-stil__disc{left:16px;animation:cn-roteste 2.8s linear infinite}
.cn-stil__t{grid-column:2;font:720 15.5px/1.2 var(--font-display);color:var(--cn-ink)}
.cn-stil__d{grid-column:2;margin-top:1px;font-size:12.8px;line-height:1.3;color:var(--cn-ink-3)}
.cn-stil__bifa{grid-column:3;grid-row:1/3;display:grid;place-items:center;width:24px;height:24px;border-radius:50%;border:1.5px solid #D5C8CE;color:transparent;transition:background .2s,border-color .2s,color .2s,transform .35s var(--cn-arc)}
.cn-stil__bifa svg{width:14px;height:14px}
.cn-stil.is-ales{border-color:var(--cn-zm);background:#FFF7F9;box-shadow:0 0 0 3px rgba(201,42,72,.12)}
.cn-stil.is-ales .cn-stil__bifa{background:var(--cn-zm);border-color:var(--cn-zm);color:#fff;transform:scale(1.08)}
.cn-stil.is-focus{outline:3px solid var(--cn-zm);outline-offset:2px}
@media (hover:hover){.cn-stil:hover{border-color:#D9C7CE;transform:translateY(-1px)}}
.cn-voci{margin:14px 0 0;padding:0;border:0;min-width:0}
.cn-voci legend{margin:0 0 8px;padding:0;font:720 16px/1.2 var(--font-display);color:var(--cn-ink)}
.cn-voci__lista{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.cn-voce{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;min-height:96px;padding:10px 6px;border:1.5px solid var(--cn-linie);border-radius:16px;background:#fff;text-align:center;cursor:pointer;font-size:13px;font-weight:650;line-height:1.15;color:var(--cn-ink);transition:background .25s,border-color .25s,color .25s}
.cn-voce__ic{position:relative;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--cn-zm-pal);color:var(--cn-zm);transition:background .25s,color .25s}
.cn-voce__ic svg{width:25px;height:25px}
.cn-voce__unde{position:absolute;inset:0;border-radius:50%;border:2px solid var(--cn-zm-l);opacity:0;pointer-events:none}
.cn-voce small{font-size:10.5px;font-weight:650;color:var(--cn-zm-d)}
.cn-voce.is-ales{border-color:var(--cn-ink);background:var(--cn-ink);color:#fff}
.cn-voce.is-ales .cn-voce__ic{background:var(--cn-zm);color:#fff;animation:cn-salt .6s var(--cn-arc)}
.cn-voce.is-ales .cn-voce__unde{animation:cn-unda 1.5s ease-out .15s 2}
.cn-voce.is-ales small{color:#F6B3C1}
.cn-voce.is-focus{outline:3px solid var(--cn-zm);outline-offset:2px}
@keyframes cn-salt{0%{transform:scale(.72)}60%{transform:scale(1.14)}100%{transform:scale(1)}}
@keyframes cn-unda{from{opacity:.75;transform:scale(1)}to{opacity:0;transform:scale(1.9)}}

.cn-ajutor-muzica{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 16px}
.cn-ajutor-muzica p{flex-basis:100%;margin:0;font-size:12.5px;line-height:1.4;color:var(--cn-ink-2)}
.cn-ajutor-muzica .cn-recomandare{padding:9px 12px;border-radius:12px;background:var(--cn-zm-pal);color:var(--cn-zm-d)}

/* 3. povestea: patru întrebări, câte una pe ecran, pe orice dispozitiv. */
.cn-camp{display:block;min-width:0;margin:0 0 9px;padding:0;border:0}
.cn-camp legend,.cn-camp__et{display:block;margin:0 0 6px;padding:0;font-size:13.5px;font-weight:650;line-height:1.3;color:var(--cn-ink-2)}
.cn-camp__et small{font-weight:500;color:var(--cn-ink-3)}
.cn .cn-camp input[type=text],.cn .cn-camp select,.cn .cn-camp textarea{width:100%;min-height:48px;margin:0;padding:11px 13px;border:1.5px solid var(--cn-linie);border-radius:14px;background:#fff;color:var(--cn-ink);font:500 16px/1.35 var(--font-body);box-shadow:none;transition:border-color .2s,box-shadow .2s}
.cn .cn-camp input[name=cn_nume]{min-height:58px;font:700 22px/1.2 var(--font-display);letter-spacing:-.01em}
.cn .cn-camp textarea{min-height:110px;height:clamp(110px,calc(100svh - var(--hdr-h) - 500px),210px);resize:vertical;line-height:1.45}
.cn .cn-camp input:focus,.cn .cn-camp select:focus,.cn .cn-camp textarea:focus{outline:0;border-color:var(--cn-zm);box-shadow:0 0 0 4px rgba(201,42,72,.12)}
.cn .cn-camp .is-gresit{border-color:#B42318}
.cn-camp__ajutor{display:block;margin-top:5px;font-size:12.5px;line-height:1.4;color:var(--cn-ink-3)}
.cn-q3{min-width:0}
.cn-q3__t{margin:0 0 12px;font:760 clamp(23px,6.4vw,30px)/1.1 var(--font-display);letter-spacing:-.025em;color:var(--cn-ink);outline:0}
.cn-q3__t small{font:500 15px/1 var(--font-body);letter-spacing:0;color:var(--cn-ink-3)}
.cn-nuante{margin:14px 0;border:1px solid var(--cn-linie);border-radius:14px;padding:0 12px;background:#fff}
.cn-nuante summary,.cn-poveste-ajutor summary{min-height:44px;padding:12px 0;font-size:13.5px;font-weight:650;line-height:1.4;cursor:pointer}
.cn-nuante summary small{font-weight:500;color:var(--cn-ink-3)}
.cn-intentii{min-width:0;margin:18px 0 12px;padding:0;border:0}
.cn-intentii legend{margin-bottom:8px;font-size:13.5px;font-weight:650}
.cn .cn-nuante textarea{min-height:80px;height:80px}
.cn .cn-expeditor-t{margin:16px 0 8px;font-size:18px;line-height:1.3}
/* a) pentru cine: carduri mari, cu pictograme; cele cu mai multe chei („…”) întreabă mai departe, cu cipuri */
.cn-cine{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.cn-cine__card{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-height:clamp(58px,calc((100svh - var(--hdr-h) - 400px) / 5),84px);padding:8px 4px;border:1.5px solid var(--cn-linie);border-radius:16px;background:#fff;text-align:center;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:background .25s,border-color .25s,transform .25s var(--cn-ease),box-shadow .25s}
.cn-cine__card input{position:absolute;opacity:0;width:1px;height:1px;margin:0;pointer-events:none}
.cn-cine__ic{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--cn-zm-pal);color:var(--cn-zm);transition:background .25s,color .25s}
.cn-cine__ic svg{width:20px;height:20px}
.cn-cine__t{font:650 13px/1.15 var(--font-body);color:var(--cn-ink)}
.cn-cine__mai{position:absolute;top:2px;right:9px;font:800 15px/1 var(--font-body);color:var(--cn-ink-3)}
.cn-cine__card:active{transform:scale(.97)}
.cn-cine__card.is-ales{border-color:var(--cn-ink);background:var(--cn-ink);box-shadow:0 12px 24px -14px rgba(30,26,32,.8)}
.cn-cine__card.is-ales .cn-cine__t,.cn-cine__card.is-ales .cn-cine__mai{color:#fff}
.cn-cine__card.is-ales .cn-cine__ic{background:var(--cn-zm);color:#fff;animation:cn-salt .5s var(--cn-arc)}
.cn-cine__card.is-focus{outline:3px solid var(--cn-zm);outline-offset:2px}
@media (hover:hover){.cn-cine__card:not(.is-ales):hover{border-color:#D9C7CE;transform:translateY(-2px)}}
.cn-cine__grup{margin:10px 0 0;padding:11px 12px 12px;border-radius:16px;background:var(--cn-zm-pal);animation:cn-hooo .45s var(--cn-arc)}
.cn-cine__q{margin:0 0 8px;font:720 15px/1.2 var(--font-display);color:var(--cn-ink)}
.cn-cine__cipuri,.cn-ocazii{display:flex;flex-wrap:wrap;gap:8px}
.cn-cip{position:relative;flex:0 0 auto;cursor:pointer;-webkit-tap-highlight-color:transparent}
.cn-cip span{display:block;padding:10px 15px;border:1.5px solid var(--cn-linie);border-radius:999px;background:#fff;font-size:14.5px;font-weight:650;line-height:1.1;white-space:nowrap;color:var(--cn-ink);transition:background .2s,border-color .2s,color .2s,transform .3s var(--cn-arc)}
.cn-cip.is-ales span{border-color:var(--cn-ink);background:var(--cn-ink);color:#fff;transform:scale(1.04)}
.cn-cip.is-focus span{outline:3px solid var(--cn-zm);outline-offset:2px}
/* b) numele, cu „+ cum îi spui acasă” */
.cn-adauga{display:inline-flex;align-items:center;gap:6px;margin:2px 0 0;padding:6px 2px;border:0;background:none;color:var(--cn-zm-d);font:650 14.5px/1.2 var(--font-body);cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.cn-camp--porecla{margin-top:6px}
/* d) povestea: începuturi de frază, numărătoarea, un exemplu, dictarea (doar pe ecranele tactile), sfatul */
.cn-incep{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 9px}
.cn-incep__b{min-height:44px;padding:9px 12px;border:1.5px dashed #D9C3CB;border-radius:999px;background:#fff;color:var(--cn-ink-2);font:600 13.5px/1.15 var(--font-body);cursor:pointer;-webkit-tap-highlight-color:transparent;transition:border-color .2s,color .2s,transform .2s}
.cn-incep__b:active{transform:scale(.96)}
@media (hover:hover){.cn-incep__b:hover{border-color:var(--cn-zm);color:var(--cn-zm-d)}}
.cn-contor{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:5px 10px;margin-top:5px}
.cn-contor__metru{grid-column:1/-1;display:block;height:4px;border-radius:4px;background:var(--cn-linie-2);overflow:hidden}
.cn-contor__metru i{display:block;width:0;height:100%;border-radius:4px;background:linear-gradient(90deg,var(--cn-zm-ll),var(--cn-zm));transition:width .4s var(--cn-ease)}
.cn-contor__text{font-size:12.5px;font-weight:650;line-height:1.3;color:var(--cn-ink-2);transition:color .3s}
.cn-contor.is-putin .cn-contor__text{color:var(--cn-zm-d)}
.cn-contor.is-bine .cn-contor__metru i{background:linear-gradient(90deg,#4FA383,var(--cn-pin))}
.cn-contor.is-bine .cn-contor__text{color:var(--cn-pin)}
.cn-numar{font-size:12px;color:var(--cn-ink-3);font-variant-numeric:tabular-nums}
.cn-exemplu{margin:0;font-size:12.5px;line-height:1.45;font-style:italic;color:var(--cn-ink-3)}
.cn-dicteaza{display:none;align-items:center;gap:6px;margin:5px 0 0;font-size:12.5px;line-height:1.4;color:var(--cn-ink-2)}
.cn-dicteaza svg,.cn-sfat svg{flex:none;width:15px;height:15px}
.cn-dicteaza svg{color:var(--cn-zm)}
@media (hover:none) and (pointer:coarse){.cn-dicteaza{display:flex}}
.cn-sfat{display:flex;align-items:center;gap:6px;margin:5px 0 0;font-size:12.5px;line-height:1.4;font-weight:650;color:var(--cn-ink-2)}
.cn-sfat svg{color:var(--cn-pin)}
/* O singură întrebare activă; JS setează hidden și păstrează istoricul independent de lățime. */
.cn-js .cn-p3__t,.cn-js .cn-p3__sub{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.cn-q3.cn-intra--inainte{animation:cn-intra-inainte .45s var(--cn-ease) both}
.cn-q3.cn-intra--inapoi{animation:cn-intra-inapoi .45s var(--cn-ease) both}
.cn-poveste-ajutor{margin:10px 0 8px;border-top:1px solid var(--cn-linie)}
.cn-poveste-ajutor summary{color:var(--cn-zm-d)}
.cn-poveste-ajutor[open]{padding-bottom:8px}
.cn-q3--poveste>.cn-camp__ajutor{margin:0 0 12px;font-size:14px;line-height:1.5}
.cn-q3--poveste .cn-nuante{margin-top:12px}
@media (max-width:767px){.cn-erou-auditie small{display:none}}

/* foaia versurilor (o folosesc „Studio live” și rezumatele): etichetele secțiunilor, refrenul zmeuriu, rândurile care apar */
.cn-sect{margin:12px 0 0}
.cn-sect__t{margin:0 0 3px;font-size:10.5px;font-weight:750;letter-spacing:.14em;text-transform:uppercase;color:var(--cn-ink-3)}
.cn-sect--refren .cn-sect__t{color:var(--cn-zm-d)}
.cn-sect__v{margin:0;font-size:15.5px;line-height:1.5;color:var(--cn-ink)}
.cn-sect__v .cn-rand{display:block}
.cn-sect--refren .cn-sect__v{font-weight:650;color:var(--cn-zm)}
@keyframes cn-rand-apare{from{opacity:0;transform:translate3d(0,9px,0);filter:blur(4px)}}
@keyframes cn-cursor{50%{opacity:0}}
@keyframes cn-respira{0%,100%{transform:scale(.9);opacity:.7}50%{transform:scale(1.06);opacity:1}}
/* confetti: pânza e a scenei (cantec-scena.js), peste pagină, fără să prindă clicuri */
.cn-confetti{position:fixed;inset:0;z-index:60;width:100%;height:100%;pointer-events:none}

/* 4. comanda: telefonul compact lângă preț; pachetul și povestea folosesc toată lățimea pe mobil */
.cn-final{display:grid;grid-template-columns:104px minmax(0,1fr);grid-template-areas:"clip info" "pachet pachet" "mai mai";gap:18px 18px;align-items:start}
.cn-final__clip{grid-area:clip;min-width:0}
.cn-final__info{grid-area:info;display:grid;align-self:center;gap:7px;min-width:0}
.cn-final__mai{grid-area:mai;display:grid;gap:12px;min-width:0}
.cn-telefon--clip{box-shadow:0 0 0 1px rgba(30,26,32,.08),0 26px 50px -24px rgba(30,26,32,.6),0 0 60px -20px rgba(201,42,72,.45)}
/* sub titlul videoclipului, rândul care ține locul versurilor: o lumină trece peste el, notele se leagănă */
.cn-clip__loc{margin:9cqi 0 0;font:650 4.4cqi/1.35 var(--font-body);color:#fff;text-wrap:balance}
.cn-clip__loc-t{background:linear-gradient(90deg,rgba(255,255,255,.5) 0%,rgba(255,255,255,.5) 35%,#fff 50%,rgba(255,255,255,.5) 65%,rgba(255,255,255,.5) 100%);background-size:260% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:cn-sclipire 2.8s linear infinite}
.cn-clip__nota{display:inline-block;color:var(--cn-zm-ll);animation:cn-nota 1.6s ease-in-out infinite}
.cn-clip__nota:last-child{animation-delay:.8s}
@keyframes cn-sclipire{from{background-position:100% 0}to{background-position:-160% 0}}
@keyframes cn-nota{0%,100%{transform:translateY(0)}50%{transform:translateY(-1.4cqi)}}
.cn-comanda{padding:0}
.cn-pret--comanda del{font-size:16px}
.cn-pret--comanda b{font-size:30px}
.cn-ai{margin:7px 0 0;font-size:12px;line-height:1.45;color:var(--cn-ink-3)}
.cn-pachet{grid-area:pachet;min-width:0;padding:15px;border:1px solid var(--cn-linie);border-radius:16px;background:var(--cn-hartie-2)}
.cn .cn-pachet__titlu{margin:0 0 12px;font:750 16px/1.3 var(--font-display);color:var(--cn-ink)}
.cn-primesti{display:grid;gap:10px;margin:0;padding:0;list-style:none}
.cn-primesti li{display:flex;align-items:flex-start;gap:9px;font-size:14px;line-height:1.45;color:var(--cn-ink)}
.cn-primesti__ic{flex:none;display:grid;place-items:center;width:24px;height:24px;border-radius:8px;background:var(--cn-zm-pal);color:var(--cn-zm)}
.cn-primesti__ic svg{width:14px;height:14px}
.cn-conditii{margin:12px 0 0;padding-top:11px;border-top:1px solid var(--cn-linie);font-size:12.5px;line-height:1.5;color:var(--cn-ink-2)}
.cn-conditii p{margin:0}
.cn-conditii p+p{margin-top:4px}
.cn-rezumat{padding:14px;border:1px solid var(--cn-linie);border-radius:16px;background:#fff}
.cn-rezumat__lista{display:grid;gap:11px;margin:0}
.cn-rezumat__rand{min-width:0;padding-bottom:11px;border-bottom:1px solid var(--cn-linie-2)}
.cn-rezumat__rand:last-child{padding-bottom:0;border-bottom:0}
.cn-rezumat__lista dt{margin-bottom:4px;font-size:12px;color:var(--cn-ink-3)}
.cn-rezumat__lista dd{display:flex;align-items:flex-start;gap:10px;margin:0;font-size:14px;font-weight:650;line-height:1.5;color:var(--cn-ink);overflow-wrap:anywhere}
.cn-rezumat__lista dd>span{flex:1;min-width:0;white-space:pre-wrap}
.cn-rezumat__edit{flex:none;min-height:44px;margin:-9px -4px -9px 0;padding:8px 4px;border:0;background:none;color:var(--cn-zm-d);font:650 12.5px/1.4 var(--font-body);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.cn-rezumat__grup{margin:13px 0 0;padding-top:2px;border-top:1px solid var(--cn-linie)}
.cn-rezumat__grup>summary{min-height:44px;padding:12px 0;font-size:13px;font-weight:650;line-height:1.45;color:var(--cn-ink-2);cursor:pointer}
.cn-rezumat__grup[open]>.cn-rezumat__lista{padding:3px 0 8px}
.cn .cn-pas__t:focus-visible,.cn .cn-q3__t:focus-visible{outline:0}
.cn-rezumat__fara{margin:6px 0 0;padding-top:6px;border-top:1px solid var(--cn-linie-2);font-size:12.5px;line-height:1.35;color:var(--cn-ink-2)}
.cn-alt-cantec{margin:0;padding:16px 0 24px;text-align:center;border-top:1px solid var(--cn-linie)}
.cn-alt-cantec__buton{min-height:44px;padding:10px 12px;border:0;background:transparent;color:var(--cn-ink-2);font:500 14px/1.4 var(--font-body);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.cn-alt-cantec__buton:hover{color:var(--cn-zm-d)}
.cn-alt-cantec__buton:disabled{opacity:.45;cursor:not-allowed}
.cn-alt-cantec p{margin:0;font-size:12px;line-height:1.5;color:var(--cn-ink-3)}
.cn-reset-modal{box-sizing:border-box;width:min(480px,calc(100% - 32px));max-height:calc(100dvh - 32px);margin:auto;padding:28px;border:1px solid var(--cn-linie);border-radius:24px;background:var(--cn-hartie);color:var(--cn-ink);box-shadow:0 30px 90px rgba(0,0,0,.3);overflow:auto}
.cn-reset-modal:not([open]){display:none}
.cn-reset-modal::backdrop{background:rgba(15,9,19,.65);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}
.cn-reset-modal h3{margin:0 0 12px;font:700 clamp(24px,5vw,30px)/1.15 var(--font-display);letter-spacing:-.025em}
.cn-reset-modal p{margin:0;color:var(--cn-ink-2);font-size:15px;line-height:1.6}
.cn-reset-modal__actiuni{display:grid;gap:12px;margin-top:24px}
.cn-reset-modal__actiuni .cn-btn{padding:14px 16px;line-height:1.4;white-space:normal}
/* caseta WooCommerce: livrarea, „Vândut de”, formularul (butonul lui stă în bara de jos, cât merge scriptul) */
.cn-caseta{margin:0;font-size:14px}
.cn-caseta .hooo-livrare{margin:0;font-size:13px;line-height:1.45;color:var(--cn-ink-2)}
.cn-caseta .hooo-livrare p{margin:0 0 2px}
.cn-caseta .hooo-vandut{margin:6px 0 4px;font-size:12px;color:var(--cn-ink-3)}
.cn-caseta form.cart{margin:10px 0 6px}
.cn-caseta .quantity{display:none}
.cn-caseta .single_add_to_cart_button,.cn-caseta .hooo-indisponibil__btn{width:100%;min-height:52px;border-radius:999px}
.cn.cn-js .cn-caseta form.cart{display:block;height:0;margin:0;padding:0;border:0;overflow:hidden}
.cn-caseta .hp-eyebrow{display:none}
.cn.cn-js .cn-caseta .hooo-indisponibil{display:none}
.cn-caseta .hooo-cod-nota{margin:8px 0;padding:10px 12px;border-radius:12px;background:#fff;font-size:13.5px}

/* după „Adaugă în coș” */
.cn-gata{display:grid;justify-items:center;gap:6px;padding:34px 6px 24px;text-align:center}
.cn-gata__ic{display:grid;place-items:center;width:68px;height:68px;margin-bottom:6px;border-radius:50%;background:var(--cn-zm);color:#fff;box-shadow:0 16px 34px -12px rgba(201,42,72,.75);animation:cn-salt .7s var(--cn-arc)}
.cn-gata__ic svg{width:34px;height:34px}
.cn-gata__act{display:grid;gap:10px;width:100%;max-width:360px;margin:12px 0 0}
.cn-gata .cn-pas__sub{max-width:30em}

/* ---------- bara de jos ---------- */
/* 26.10.2026, Adrian („de acord cu toate”): bara plutitoare, ca o capsulă lipită jos pe ecran cât se vede ghidul: „←” rotund și
   „Continuă →” lat; prețul e în eticheta butonului („Continuă la plată · 29 lei”), nu într-un rând separat */
.cn-btn--inapoi{flex:none;width:52px;min-height:52px;padding:0;border-radius:50%;background:#fff;color:var(--cn-ink);box-shadow:inset 0 0 0 1.5px #D8CCD2;font-size:19px}
.cn-inapoi__t{display:none}
.cn-bara{position:sticky;bottom:calc(10px + env(safe-area-inset-bottom));z-index:6;display:flex;align-items:center;gap:8px;margin:auto -9px 10px;padding:6px;border-radius:999px;background:rgba(255,253,251,.9);-webkit-backdrop-filter:blur(14px) saturate(1.3);backdrop-filter:blur(14px) saturate(1.3);box-shadow:0 0 0 1px rgba(30,26,32,.08),0 16px 36px -14px rgba(40,14,28,.5);transition:opacity .3s,visibility .3s,transform .35s var(--cn-ease)}
/* panoul abia intră în ecran (sub scena de sus): bara nu plutește peste ea (cantec-scena.js) */
.cn-bara.is-departe{opacity:0;visibility:hidden;transform:translateY(14px)}
.cn-btn--continua{flex:1 1 auto;min-width:0;min-height:52px;padding:0 16px;background:linear-gradient(180deg,#DC3858 0%,var(--cn-zm) 55%,var(--cn-zm-d) 100%);font:700 clamp(14.5px,4vw,16px)/1.15 var(--font-body);text-align:center;text-wrap:balance;box-shadow:0 12px 26px -12px rgba(201,42,72,.95),inset 0 1px 0 rgba(255,255,255,.22)}
.cn-btn--continua>span:last-child{transition:transform .25s var(--cn-ease)}
@media (hover:hover){.cn-btn--continua:not(:disabled):hover>span:last-child{transform:translateX(3px)}}
/* când lipsește ceva, eticheta spune ce („Scrie numele ca să continui”): fără săgeată, ca textul să încapă */
.cn-bara.is-lipsa .cn-btn--continua>span:last-child{display:none}
.cn-bara__pret{display:none!important}
/* pe telefon, etichetele scurte („Îmi plac”, „Adaugă în coș”): nimic tăiat pe butonul principal; cele lungi, de la 560 px.
   La plată, eticheta lungă („Continuă la plată · 29 lei”) încape și pe telefon; pe cele foarte înguste, fără săgeată. */
.cn-btn--continua .cn-lung{display:none}
.cn-btn--continua .cn-scurt{display:inline}
.cn-bara.is-plata .cn-btn--continua .cn-lung{display:inline}
.cn-bara.is-plata .cn-btn--continua .cn-scurt{display:none}
@media (max-width:379.98px){.cn-bara.is-plata .cn-btn--continua>span:last-child{display:none}}

/* ---------- 3. Cum arată cadoul: videoclipul, pagina-cadou cu versurile luminate și reacția, trei pași ---------- */
.cn-cadoul{position:relative;overflow:hidden;padding:54px 0 58px;background:var(--cn-blush);color:var(--cn-ink)}
.cn-sect-cap{max-width:640px;margin:0 0 26px}
.cn-sect-cap h2{font-size:clamp(34px,9vw,60px);font-weight:760;line-height:1;letter-spacing:-.04em;color:var(--cn-ink)}
.cn-sect-cap h2 em{font-style:normal;color:var(--cn-zm)}
.cn-sect-cap>p:not(.cn-eticheta){margin:14px 0 0;font-size:16px;line-height:1.6;color:var(--cn-ink-2)}
.cn-sect-cap a:not(.cn-btn){color:var(--cn-zm-d);font-weight:650}
.cn-cadoul__grila{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:26px 14px;align-items:start}
.cn-exemplu-proces{display:grid;gap:12px;margin:0 0 30px;padding:0;list-style:none}
.cn-exemplu-proces li{min-width:0;padding:18px;border:1px solid var(--cn-linie);border-radius:18px;background:#fff}
.cn-exemplu-proces b{display:block;font:750 18px/1.3 var(--font-display);color:var(--cn-ink)}
.cn-exemplu-proces small{display:block;margin-top:5px;font-size:12px;line-height:1.4;color:var(--cn-ink-3)}
.cn-exemplu-proces p{margin:10px 0;font-size:14px;line-height:1.5;color:var(--cn-ink-2)}
.cn-detalii{display:flex;flex-wrap:wrap;gap:7px;margin-top:14px}
.cn-detalii button{display:inline-flex;align-items:center;justify-content:center;min-height:44px;max-width:100%;padding:9px 13px;border:1px solid var(--cn-zm-linie);border-radius:12px;background:var(--cn-zm-pal);color:var(--cn-zm-d);font:650 13px/1.35 var(--font-body);text-align:left;cursor:pointer;transition:background .2s,color .2s,border-color .2s}
.cn-detalii button[aria-pressed=true]{border-color:var(--cn-zm);background:var(--cn-zm);color:#fff}
@media (hover:hover){.cn-detalii button:not([aria-pressed=true]):hover{border-color:var(--cn-zm);background:#FCE1E8}}
.cn-vers-reper{margin:16px 0 13px;padding:14px 15px;border:0;border-left:3px solid var(--cn-zm);border-radius:0 12px 12px 0;background:var(--cn-zm-pal);font:700 clamp(21px,5.5vw,27px)/1.25 var(--font-display);letter-spacing:-.015em;color:var(--cn-zm-d);overflow-wrap:anywhere;white-space:pre-line;text-wrap:balance}
.cn-exemplu-proces [data-cn-vers-context]{min-height:2.8em}
.cn-exemplu-proces .cn-btn{max-width:100%;text-align:center}
.cn-invitatie{display:grid;grid-template-columns:minmax(0,1fr);justify-items:stretch;gap:20px;margin:0 0 38px;padding:26px 22px;border:1px solid rgba(201,42,72,.18);border-radius:24px;background:linear-gradient(120deg,#FFFDFB,#FFF4EB);box-shadow:0 15px 40px -30px rgba(74,8,24,.3)}
.cn-invitatie__cutie{position:relative;width:92px;height:72px;margin:24px 8px 0 5px;border-radius:4px 4px 8px 8px;background:linear-gradient(90deg,transparent 40%,#F3DDAA 40% 58%,transparent 58%),linear-gradient(130deg,#D63E5A,#A81F3B);box-shadow:0 15px 25px -18px rgba(74,8,24,.6);transform:rotate(-6deg)}
.cn-invitatie__cutie::before{content:"";position:absolute;inset:-7px -5px auto;height:19px;border-radius:4px;background:linear-gradient(90deg,transparent 41%,#F3DDAA 41% 57%,transparent 57%),#E9516D;box-shadow:0 5px 6px -3px rgba(74,8,24,.25)}
.cn-invitatie__cutie::after{content:"";position:absolute;width:55px;height:29px;left:18px;top:-32px;background:radial-gradient(ellipse at 70% 70%,transparent 32%,#E3B563 34% 49%,transparent 51%) left/50% 100% no-repeat,radial-gradient(ellipse at 30% 70%,transparent 32%,#F3DDAA 34% 49%,transparent 51%) right/50% 100% no-repeat}
.cn-invitatie>div{min-width:0}
.cn-invitatie h3{margin:0;font-size:clamp(26px,6.5vw,36px);line-height:1.1;color:var(--cn-ink)}
.cn-invitatie p{margin:12px 0 0;font-size:15px;line-height:1.55;color:var(--cn-ink-2)}
.cn-invitatie .cn-btn{width:100%;max-width:100%;min-height:52px;padding:14px 20px;text-align:center;white-space:normal;line-height:1.35}
.cn-cadoul__fig{margin:0;min-width:0}
.cn-cadoul__telefon{position:relative;width:min(100%,250px);margin:0 auto}
.cn-cadoul__fig figcaption{margin-top:16px;font-size:13px;line-height:1.45;color:var(--cn-ink-2);text-align:center}
.cn-cadoul__fig figcaption b{display:block;margin-bottom:3px;font:720 16px/1.2 var(--font-display);color:var(--cn-ink)}
.cn-cadou-demo{max-width:100%;margin-top:12px;padding:10px 14px;font-size:13px;line-height:1.35}
.cn-telefon--cadou{box-shadow:0 0 0 1px rgba(30,26,32,.1),0 30px 60px -26px rgba(74,8,24,.55)}
/* pagina-cadou, desenată în telefon */
.cn-telefon--pagina{box-shadow:0 0 0 1px rgba(30,26,32,.1),0 30px 60px -26px rgba(74,8,24,.55)}
.cn-telefon--pagina .cn-telefon__ecran{background:#FBF6EF}
.cn-pg{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;padding:16cqi 6cqi 0;text-align:center;color:var(--cn-ink)}
.cn-pg__svg{display:block;width:22cqi;height:auto}
.cn-pg__eticheta{margin:6cqi 0 0;font:700 3.4cqi/1.2 var(--font-body);letter-spacing:.18em;color:var(--cn-zm-d)}
.cn-pg__nume{margin:1.4cqi 0 0;font:800 9.6cqi/1.02 var(--font-display);letter-spacing:-.04em;text-wrap:balance}
.cn-pg__card{width:100%;margin-top:6cqi;padding:5cqi 4.6cqi;border-radius:6cqi;background:#fff;box-shadow:0 2cqi 8cqi -4cqi rgba(30,26,32,.3);text-align:left}
.cn-pg__var{margin:0;font:750 3cqi/1.2 var(--font-body);letter-spacing:.16em;color:var(--cn-zm-d)}
.cn-pg__titlu{margin:1cqi 0 3cqi;font:760 5.4cqi/1.12 var(--font-display);letter-spacing:-.02em}
.cn-pg__player{display:flex;align-items:center;gap:3cqi;padding:2.8cqi 3.6cqi;border-radius:999px;background:#F9E4E9}
.cn-pg__play{flex:none;width:0;height:0;border-style:solid;border-width:2cqi 0 2cqi 3.4cqi;border-color:transparent transparent transparent var(--cn-ink)}
.cn-pg__bara{flex:1;height:1.2cqi;border-radius:2cqi;background:rgba(30,26,32,.14);overflow:hidden}
.cn-pg__bara i{display:block;width:100%;height:100%;border-radius:2cqi;background:var(--cn-zm);transform:scaleX(.3);transform-origin:0 50%;animation:cn-pg-bara 14s linear infinite}
@keyframes cn-pg-bara{from{transform:scaleX(.04)}to{transform:scaleX(1)}}
.cn-pg__player b{font:700 3.2cqi/1 var(--font-body);color:var(--cn-zm-d)}
.cn-pg__versuri{margin:3.4cqi 0 0;padding:1.6cqi;list-style:none;border-radius:4cqi;background:#FFFBF4;border:1px solid #EFE3D3}
.cn-pg__versuri li{padding:1.5cqi 2.4cqi;border-radius:2.6cqi;font-size:3.9cqi;line-height:1.28;color:var(--cn-ink-3);transition:background .45s,color .45s}
.cn-pg__versuri li.is-acum{background:#F9E4E9;color:var(--cn-ink);font-weight:700}
/* reacția, ca o notificare lângă telefon */
.cn-reactie{position:absolute;z-index:6;right:-3%;bottom:11%;display:flex;align-items:center;gap:7px;width:max-content;max-width:112%;padding:6px 12px 6px 6px;border-radius:22px;background:#fff;color:var(--cn-ink);box-shadow:0 20px 40px -16px rgba(74,8,24,.55);transform-origin:15% 50%}
.cn-reactie__chip{position:relative;flex:none;display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:linear-gradient(145deg,var(--cn-zm-l),var(--cn-zm-d));color:#fff;font:800 17px/1 var(--font-display)}
.cn-reactie__play{position:absolute;right:-3px;bottom:-3px;width:17px;height:17px;border-radius:50%;background:var(--cn-ink);box-shadow:0 0 0 2px #fff}
.cn-reactie__play::after{content:"";position:absolute;left:6.5px;top:5px;border-style:solid;border-width:3.5px 0 3.5px 5.5px;border-color:transparent transparent transparent #fff}
.cn-reactie__text b{display:block;font:720 12px/1.15 var(--font-display)}
.cn-reactie__text{min-width:0}
.cn-reactie__text small{display:flex;align-items:center;gap:5px;margin-top:3px;font-size:10px;color:var(--cn-ink-3);white-space:normal}
.cn-reactie__rec{width:7px;height:7px;border-radius:50%;background:var(--cn-zm);animation:cn-cursor 1.2s steps(1) infinite}
.cn-reactie__inima{position:absolute;top:-11px;right:-6px;display:grid;place-items:center;width:25px;height:25px;border-radius:50%;background:var(--cn-zm);color:#fff;font-size:13px;line-height:1;animation:cn-bate 1.7s ease-in-out infinite}
@keyframes cn-bate{0%,100%{transform:scale(1)}15%{transform:scale(1.2)}30%{transform:scale(1)}45%{transform:scale(1.14)}}
.cn-cadoul.is-vizibil .cn-reactie{animation:cn-apare-reactie .8s var(--cn-arc) .6s both}
@keyframes cn-apare-reactie{from{opacity:0;transform:translateY(16px) scale(.6)}}
.cn-cadoul__pasi{grid-column:1/-1;display:grid;gap:10px;margin:6px 0 0;padding:0;list-style:none}
.cn-cadoul__pasi li{display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:14px;row-gap:3px;padding:15px 16px;border-radius:20px;background:#fff;box-shadow:0 12px 30px -24px rgba(74,8,24,.5)}
.cn-cadoul__nr{grid-row:1/3;font:800 26px/1 var(--font-display);letter-spacing:-.03em;color:var(--cn-zm)}
.cn-cadoul__pasi b{font:720 16.5px/1.2 var(--font-display);color:var(--cn-ink)}
.cn-cadoul__pasi span:not(.cn-cadoul__nr){font-size:14px;line-height:1.45;color:var(--cn-ink-2)}
.cn-cadoul__nota{margin:22px 0 0;font-size:11.5px;line-height:1.5;color:var(--cn-ink-3)}

/* ---------- 4. întrebările ---------- */
.cn-intrebari{padding:56px 0 64px;background:var(--cn-hartie-2)}
.cn-intrebari__grila{display:grid;gap:18px}
.cn-intrebari .cn-sect-cap{margin:0}
.cn-intrebari .cn-sect-cap .cn-btn{margin-top:20px}
.cn-q{border-bottom:1px solid #E6DCCD}
.cn-q summary{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 2px;cursor:pointer;list-style:none;font:700 17px/1.3 var(--font-display);letter-spacing:-.01em;color:var(--cn-ink)}
.cn-q summary::-webkit-details-marker{display:none}
.cn-q__semn{flex:none;position:relative;width:28px;height:28px;border-radius:50%;background:var(--cn-zm-pal);transition:background .25s}
.cn-q__semn::before,.cn-q__semn::after{content:"";position:absolute;left:8px;right:8px;top:13px;height:2px;border-radius:2px;background:var(--cn-zm);transition:transform .3s var(--cn-ease)}
.cn-q__semn::after{transform:rotate(90deg)}
.cn-q[open] .cn-q__semn{background:var(--cn-zm)}
.cn-q[open] .cn-q__semn::before,.cn-q[open] .cn-q__semn::after{background:#fff}
.cn-q[open] .cn-q__semn::after{transform:rotate(0)}
.cn-q p{margin:0 0 18px;max-width:62ch;font-size:15.5px;line-height:1.6;color:var(--cn-ink-2)}

/* Cutia, sub întrebări, pe fondul paginii */
.cn + .cp,.cn .cp{margin-top:0}

/* Cadoul demonstrativ se deschide în pagina produsului. Antetul rămâne vizibil, iar iframe-ul are scroll propriu. */
.cn-demo-modal{box-sizing:border-box;width:min(1000px,calc(100% - 32px));height:min(90dvh,860px);max-width:none;max-height:calc(100dvh - 32px);margin:auto;padding:0;border:1px solid rgba(255,243,227,.6);border-radius:24px;background:var(--cn-hartie-2,#FBF6EF);color:var(--cn-ink,#1E1A20);box-shadow:0 36px 100px rgba(0,0,0,.5);overflow:hidden}
.cn-demo-modal:not([open]){display:none}
.cn-demo-modal[open]{display:block}
.cn-demo-modal::backdrop{background:rgba(15,9,19,.78);-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px)}
.cn-demo-modal__panou{display:flex;flex-direction:column;height:100%;min-height:0}
.cn-demo-modal__cap{flex:none;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 22px;border-bottom:1px solid #EAE2E6;background:#FFFDFB}
.cn .cn-demo-modal__cap h2{margin:0;font:750 22px/1.15 var(--font-display);letter-spacing:-.025em;color:#1E1A20}
.cn-demo-modal__cap p{margin:4px 0 0;font:400 12px/1.4 var(--font-body);color:#736B79}
.cn-demo-modal__inchide{flex:none;display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:44px;min-width:94px;padding:8px 13px;border:1px solid #D8CCD2;border-radius:999px;background:#FBF6EF;color:#1E1A20;font:650 13px/1.2 var(--font-body);cursor:pointer}
.cn-demo-modal__inchide span{font-size:24px;line-height:1;font-weight:400}
.cn-demo-modal__inchide:hover{background:#FFF1F4;border-color:#C92A48}
.cn-demo-modal__inchide:focus-visible{outline:3px solid #C92A48;outline-offset:2px}
.cn-demo-modal__continut{position:relative;flex:1 1 auto;min-height:0}
.cn-demo-modal__iframe{position:absolute;inset:0;display:block;width:100%;height:100%;border:0;background:#FBF6EF}
.cn-demo-modal__status{position:absolute;inset:0;z-index:1;display:grid;place-content:center;min-height:180px;height:100%;margin:0;padding:24px;box-sizing:border-box;background:#FBF6EF;text-align:center;font:500 15px/1.5 var(--font-body);color:#4A444D}
.cn-demo-modal__status[hidden]{display:none!important}
@media(max-width:559px){
  .cn-demo-modal{width:calc(100% - 16px);height:calc(100dvh - 16px);max-height:calc(100dvh - 16px);border-radius:18px}
  .cn-demo-modal__cap{gap:10px;padding:12px}
  .cn .cn-demo-modal__cap h2{font-size:18px}
  .cn-demo-modal__cap p{font-size:11px}
}

/* ---------- ecrane puțin mai late (telefoane mari, tablete) ---------- */
@media (min-width:560px){
  .cn-wrap{width:min(1240px,calc(100% - 40px))}
  .cn-erou__grila{grid-template-columns:minmax(0,1fr) 180px;gap:24px}
  .cn-erou__vizual{display:block;width:160px;margin:0;align-self:center}
  .cn-ecouri{right:-15%;width:75vw;max-width:1000px;min-width:650px}
  .cn-titlu{font-size:clamp(38px,6vw,62px)}
  .cn-erou-auditie{max-width:420px}
  .cn-invitatie{grid-template-columns:110px minmax(0,1fr);align-items:center;gap:24px;padding:28px 30px}
  .cn-invitatie__cutie{justify-self:center;margin-top:24px}
  .cn-invitatie__cta{grid-column:2}
  .cn-ghid{padding:22px 24px 0;border-radius:28px}
  .cn-bara{margin:auto -12px 14px;padding:7px}
  .cn-btn--inapoi{width:auto;padding:0 20px 0 16px;border-radius:999px;font-size:15.5px}
  .cn-inapoi__t{display:inline}
  .cn-btn--continua{flex:0 1 auto;margin-left:auto;padding:0 28px}
  .cn-dale{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
  .cn-dala-loc{min-height:148px}
  .cn-dala{padding:60px 12px 13px;border-radius:16px}
  .cn-dala__fundal img,.cn-dala__fundal video{object-position:50% 72%}
  .cn-dala__t{font-size:16px}
  .cn-gen-ajutor__optiuni{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cn-cine{grid-template-columns:repeat(4,minmax(0,1fr))}
  .cn-btn--continua .cn-lung{display:inline}
  .cn-btn--continua .cn-scurt{display:none}
  .cn-final{grid-template-columns:138px minmax(0,1fr)}
  .cn-hooo{width:96px}
  .cn-cadoul__telefon{width:min(100%,230px)}
}

/* ---------- tabletă culcată, laptop mic ---------- */
@media (min-width:860px){
  .cn-erou{padding:42px 0 68px}
  .cn-erou__grila{grid-template-columns:minmax(0,1fr) 290px;gap:48px}
  .cn-erou__vizual{width:230px}
  .cn-invitatie{grid-template-columns:130px minmax(0,1fr);gap:24px;padding:32px}
  .cn-invitatie__cutie{width:116px;height:88px;margin-top:28px}
  .cn-invitatie__cutie::after{left:30px}
  .cn-progres{gap:18px;margin-bottom:20px}
  .cn-hooo{width:118px}
  .cn-proiect{grid-template-columns:42px minmax(0,1fr) auto}
  .cn-proiect>small{grid-column:3;max-width:12em;text-align:right}
  .cn-final{grid-template-columns:180px minmax(0,1fr);grid-template-areas:"clip info" "clip pachet" "clip mai";gap:18px 28px}
  .cn-final__info{align-self:start}
  .cn-cadoul{padding:80px 0 84px}
  .cn-cadoul__grila{grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,1.1fr);gap:30px 34px}
  .cn-cadoul__pasi{grid-column:auto;align-self:center;margin:0}
  .cn-intrebari{padding:84px 0 92px}
  .cn-intrebari__grila{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:60px;align-items:start}
  .cn-intrebari .cn-sect-cap{position:sticky;top:calc(var(--hdr-h) + 40px)}
}

/* ---------- laptop: oferta și refrenul lângă telefon; ghid lat, întrebări succesive ---------- */
@media (min-width:1024px){
  .cn-erou{display:flex;align-items:center;min-height:min(calc(100svh - var(--hdr-h) - var(--cn-anunt,34px)),720px);padding:42px 0 72px}
  .cn-erou__grila{grid-template-columns:minmax(0,1fr) minmax(300px,380px);column-gap:clamp(48px,7vw,120px)}
  .cn-erou__text{gap:16px}
  .cn-titlu{font-size:clamp(48px,4.8vw,70px)}
  .cn-erou__sub{font-size:18px;line-height:1.55}
  .cn-dovezi li{min-height:34px;padding:7px 14px;font-size:13.5px}
  .cn-erou__offre .cn-pret b{font-size:40px}
  .cn-erou__inclus{font-size:15px}
  .cn-cta{min-height:62px;padding:0 32px;font-size:20px}
  .cn-erou__vizual{width:min(280px,100%);margin:0;justify-self:center}
  .cn-aura--1{right:-10%;width:85%}
  .cn-aura--2{right:0;width:76%}
  .cn-aura--3{right:-12%;width:72%}
  .cn-ecouri{right:-4%;width:65vw;max-width:1040px}
  .cn-vinil--erou{width:158%;top:2%;left:42%}
  .cn-erou-auditie{max-width:440px}
  .cn-sunet{min-height:42px;margin-top:-21px;padding:0 18px 0 14px;font-size:14px}

  .cn-atelier{padding:84px 0 100px}
  .cn-atelier__wrap{max-width:1060px}
  .cn-atelier__cap{margin:0 8px 26px}
  .cn-ghid{min-height:min(780px,calc(100vh - var(--hdr-h) - 36px));padding:26px 40px 0;border-radius:34px}
  .cn-bara{margin:auto -24px 22px;padding:8px}
  .cn-btn--continua{padding:0 32px}
  .cn-pas__t{font-size:32px}
  .cn-pas__sub{margin-bottom:18px;font-size:16px}
  .cn-dale{grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
  .cn-dala-loc{min-height:166px}
  .cn-dala{padding:68px 16px 15px;border-radius:20px}
  .cn-dala__t{font-size:18px}
  .cn-dala__d{font-size:13px}
  .cn-dala__fundal img,.cn-dala__fundal video{object-position:50% 66%}
  .cn-dala__bifa{top:12px;left:12px;width:28px;height:28px}
  .cn-asculta{top:12px;right:12px;width:48px;height:48px}
  .cn-asculta__play,.cn-asculta__pauza{width:19px;height:19px}
  .cn-eq--dala{top:48px;left:18px;height:12px}
  .cn-stiluri__gen{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
  .cn-stil{grid-template-columns:104px minmax(0,1fr) 26px;column-gap:16px;padding:12px 18px 12px 12px;border-radius:20px}
  .cn-stil__coperta,.cn-stil__coperta img{width:82px;height:82px}
  .cn-stil__coperta img{border-radius:14px}
  .cn-stil__disc{top:6px;left:6px;width:70px;height:70px}
  .cn-stil.is-ales .cn-stil__disc{left:28px}
  .cn-stil__t{font-size:18.5px}
  .cn-stil__d{margin-top:3px;font-size:14px}
  .cn-voci{margin-top:22px}
  .cn-voci__lista{gap:14px}
  .cn-voce{min-height:126px;gap:8px;font-size:15px;border-radius:20px}
  .cn-voce__ic{width:58px;height:58px}
  .cn-voce__ic svg{width:31px;height:31px}
  .cn-voce small{font-size:11.5px}
  .cn-invitatie{grid-template-columns:110px minmax(0,1fr) minmax(240px,280px);gap:28px;padding:32px}
  .cn-invitatie h3{font-size:30px}
  .cn-invitatie__cta{grid-column:3;grid-row:1;align-self:center}
  .cn-invitatie__cutie{width:92px;height:72px}
  .cn-invitatie__cutie::after{left:18px}
  /* Povestea rămâne o conversație scurtă și pe desktop. */
  .cn[data-cn-pas="3"] .cn-ghid{max-width:760px;min-height:580px;margin-inline:auto}
  .cn-p3__grila{display:block}
  .cn-q3__t{margin:0 0 14px;font-size:28px;letter-spacing:-.025em}
  .cn-q3__t small{font-size:14px}
  .cn-cine{grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}
  .cn-cine__card{min-height:90px;padding:12px 6px}
  .cn-cine__t{font-size:13px}
  .cn-cine__grup{margin-top:12px}
  .cn-cip span{min-height:44px;display:flex;align-items:center;padding:10px 16px;font-size:14px}
  .cn .cn-camp input[name=cn_nume]{min-height:58px;font-size:22px}
  .cn .cn-camp--poveste textarea{min-height:150px;height:170px}
  .cn-camp{margin-bottom:10px}
  .cn-final{grid-template-columns:220px minmax(0,1fr);gap:18px 32px}
  .cn-pret--comanda b{font-size:38px}
  .cn-pret--comanda del{font-size:20px}
  .cn-primesti li{align-items:center;font-size:14px}
  .cn-primesti__ic{width:28px;height:28px;margin-top:0;border-radius:9px}
  .cn-primesti__ic svg{width:16px;height:16px}
  .cn-rezumat{padding:12px 16px}
  .cn-rezumat__lista dt{font-size:12.5px}
  .cn-rezumat__lista dd{font-size:14px}
  .cn-exemplu-proces{grid-template-columns:repeat(3,minmax(0,1fr))}

  .cn-cadoul__telefon{width:min(100%,264px)}
  .cn-reactie{right:-20%;gap:8px;max-width:none}
  .cn-reactie__chip{width:40px;height:40px}
  .cn-reactie__text b{font-size:12.5px}
  .cn-reactie__text small{font-size:10.5px}
}

/* ---------- „reducerea mișcării” din sistem: totul stă pe loc (filmul și videoclipurile nu pornesc singure, din cantec-scena.js) ---------- */
@media (prefers-reduced-motion:reduce){
  .cn *,.cn *::before,.cn *::after{animation-duration:.001ms!important;animation-delay:0s!important;animation-iteration-count:1!important;transition-duration:.001ms!important;transition-delay:0s!important}
  .cn-eq i{transform:scaleY(.55)}
  .cn-aura,.cn-ecouri i,.cn-telefon--erou,.cn-erou .cn-cta,.cn-erou .cn-cta::before,.cn-vinil::after{animation:none!important}
}

/* 21.10.2026 · modul „cutie”: cântecul dintr-o cutie gata făcută, deja plătit (inc/produs-cantec.php, hooo_cantec_mod_cutie) */
.cn-cutie-banda{display:flex;align-items:center;gap:10px;margin:0 0 14px;padding:10px 14px;border:1px solid var(--cn-aur-2);border-radius:14px;background:var(--cn-hartie-2);color:var(--cn-ink);font-size:15px;font-weight:600;line-height:1.4}
.cn-cutie-banda__ic{flex:0 0 24px;width:24px;height:24px;color:var(--cn-zm)}
.cn-cutie-banda__ic svg{width:24px;height:24px}
.cantec-cutie .cn-gata{align-content:center}
.cantec-cutie .cn-gata__act{align-content:start}

/* ======================================================================
   22.10.2026, Adrian: pagina cântecului în limbajul primei pagini noi. Numele (dacă îl știm) scris de mână, auriu, sub titlu;
   garanția lângă buton; secțiunile intră una în alta pe o margine de troian (masca de sus a secțiunii, fără culori de potrivit);
   „Cum arată cadoul”, cutiile și întrebările pe aceeași hârtie crem; cardurile pe hârtia biletului; exemplul într-un singur bilet,
   pe trei coloane: detaliul → versul (scris de mână) → ascultă
   ====================================================================== */
@font-face{font-family:"hooo Scris";font-style:normal;font-weight:600;font-display:swap;src:url(fonts/hooo-scris-600-ro.woff2) format("woff2")}
.cn{--cn-troian:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 48' preserveAspectRatio='none'%3E%3Cpath d='M0 48V24c60-8 120-20 200-16 90 5 130 26 230 24 110-2 150-28 260-28 100 0 140 22 240 24 95 2 140-20 230-22 80-2 140 14 280 20v46z'/%3E%3C/svg%3E");
  --cn-bilet:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-60 -60 120 120'%3E%3Cdefs%3E%3Cpath id='b' d='M0-9V-52M0-39l-10-10M0-39l10-10M0-25l-8-8M0-25l8-8'/%3E%3Cg id='f' fill='none' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cuse href='%23b'/%3E%3Cuse href='%23b' transform='rotate(60)'/%3E%3Cuse href='%23b' transform='rotate(120)'/%3E%3Cuse href='%23b' transform='rotate(180)'/%3E%3Cuse href='%23b' transform='rotate(240)'/%3E%3Cuse href='%23b' transform='rotate(300)'/%3E%3Ccircle r='6'/%3E%3C/g%3E%3C/defs%3E%3Cuse href='%23f' stroke='%23fff' transform='translate(-1.3 -1.3)'/%3E%3Cuse href='%23f' stroke='%238c6a44' stroke-opacity='.22' transform='translate(1.3 1.3)'/%3E%3Cuse href='%23f' stroke='%23f7efe1'/%3E%3C/svg%3E") right -30px bottom -28px/130px no-repeat,
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .42 0 0 0 0 .3 0 0 0 0 .18 0 0 0 .3 -.1'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E") 0 0/160px,
    radial-gradient(140% 90% at 12% 0%,#fffefa 0%,#fcf7ee 50%,#f6ecdc 100%)}
/* numele și garanția, în primul ecran */
.cn-erou__pentru{margin:2px 0 4px;font:600 clamp(30px,7.6vw,46px)/1.1 "hooo Scris","Segoe Script",cursive;color:#EFC654;rotate:-2deg;transform-origin:0 50%;text-shadow:0 2px 14px rgba(10,4,6,.55)}
.cn-erou__pentru b{font-weight:600}
.cn-garantie{display:flex;flex-basis:100%;align-items:center;gap:7px;margin:0;font-size:14px;font-weight:600;color:var(--cn-crem)}
.cn-garantie svg{flex:none;width:18px;height:18px;color:#EFC654}
/* trecerile: fiecare secțiune urcă peste cea de dinainte cu o margine de troian */
.cn-atelier,.cn-cadoul{z-index:1;margin-top:-46px;
  -webkit-mask:var(--cn-troian) 0 0/100% 48px no-repeat,linear-gradient(#000,#000) 0 46px/100% calc(100% - 46px) no-repeat;
  mask:var(--cn-troian) 0 0/100% 48px no-repeat,linear-gradient(#000,#000) 0 46px/100% calc(100% - 46px) no-repeat}
.cn-atelier{padding-top:76px}
/* 23.10.2026, Adrian („spațiu aici”): sub ghid rămâne loc înainte de troianul secțiunii următoare, care urcă 46 px peste el */
@media (max-width:1023px){.cn-atelier{padding-bottom:88px}}
.cn-cadoul{z-index:2;padding-top:96px;background:var(--cn-hartie-2)}
.cn-intrebari{padding-top:40px}
/* exemplul, într-un singur bilet */
.cn-exemplu-proces{gap:0;border-radius:22px;background:var(--cn-bilet);box-shadow:0 1px 0 #ede1cd,0 2px 0 #e0cfb5,0 18px 40px -26px rgba(24,10,3,.45);outline:1px solid rgba(150,112,70,.16);outline-offset:-8px}
.cn-exemplu-proces li{padding:22px 22px 20px;border:0;border-radius:0;background:none}
.cn-exemplu-proces li+li{border-top:1.5px dashed rgba(150,112,70,.28)}
.cn-vers-reper{margin:12px 0 4px;padding:0;border:0;border-radius:0;background:none;font:600 clamp(26px,6.4vw,34px)/1.18 "hooo Scris","Segoe Script",cursive;letter-spacing:0;color:var(--cn-zm-d)}
.cn-exemplu-proces li:nth-child(3) .cn-btn{min-height:48px;padding:0 22px;border:0;border-radius:999px;background:var(--cn-zm);color:#fff;box-shadow:0 10px 22px -12px rgba(201,42,72,.75)}
/* invitația și pașii, pe hârtia biletului */
.cn-invitatie,.cn-cadoul__pasi li{border:0;background:var(--cn-bilet);box-shadow:0 1px 0 #ede1cd,0 2px 0 #e0cfb5,0 16px 34px -26px rgba(24,10,3,.45)}
@media (min-width:860px){
  .cn-exemplu-proces{grid-template-columns:minmax(0,1.15fr) minmax(0,1.2fr) minmax(0,.8fr)}
  .cn-exemplu-proces li+li{border-top:0;border-left:1.5px dashed rgba(150,112,70,.28)}
  .cn-exemplu-proces li:nth-child(3){display:flex;flex-direction:column;justify-content:center;align-items:flex-start}
}

/* ---------- 24.10.2026, Adrian („produsul înaintea promoției”): pe telefon, titlul centrat cu eticheta deasupra, apoi mostra
   („Ascultă refrenul”, produsul însuși), cele trei pastile, prețul și butonul; ceasul mic sub buton (timer-lansare.css);
   fără textul de sub titlu și fără „Tot pachetul inclus…” în primul ecran ---------- */
@media (max-width:559.98px){
  .cn-erou__text{justify-items:center;text-align:center;gap:12px}
  .cn-erou__offre,.cn-erou__actiune{display:contents}
  .cn-erou .cn-eticheta{order:1}
  .cn-titlu{order:2;margin-inline:auto;font-size:clamp(30px,8.6vw,40px)}
  .cn-erou__pentru{order:3}
  .cn-erou__sub,.cn-erou__inclus{display:none}
  .cn-erou-auditie{order:4;text-align:left;margin-inline:auto}
  .cn-dovezi{order:5;justify-content:center}
  .cn-erou__offre .cn-pret{order:6;justify-content:center}
  .cn-erou .cn-cta{order:7}
  .cn-erou .cn-garantie{order:8}
  .cn-erou__nota{order:9;text-align:center}
}

/* ---------- 24.10.2026, Adrian („să ajungă direct la configurarea melodiei”), telefonul: sus rămâne o bandă subțire (eticheta,
   titlul, prețul și ceasul), iar ghidul începe imediat după ea; fără butonul „Creează cântecul”, fără mostra și pastilele din erou
   (fiecare gen are mostra lui) și fără titlul „Hai să-l facem.” (rămâne „Pasul 1 din 4”) ---------- */
@media (max-width:559.98px){
  .cn-erou{padding:14px 0 58px}
  .cn-erou__text{gap:8px}
  .cn-titlu{font-size:clamp(27px,7.6vw,33px)}
  .cn-erou .cn-cta,.cn-erou-auditie,.cn-dovezi,.cn-erou__nota{display:none}
  .cn-erou__offre .cn-pret{order:4}
  .cn-erou__offre .cn-pret b{font-size:28px}
  .cn-erou .cn-garantie{order:5}
  .cn-atelier{padding-top:54px}
  .cn-atelier__cap{display:none}
}

/* ---------- 24.10.2026 (același cerut), tabletă și calculator: sus doar eticheta, titlul, prețul și ceasul; ghidul imediat după.
   Pe calculator, telefonul cu cântecul, mostra și „ce primești” stau într-o coloană lipită lângă ghid (cantec.php, .cn-atelier__produs) ---------- */
.cn-atelier__produs{display:none}
@media (min-width:560px){
  .cn-erou{min-height:0;padding:28px 0 70px}
  .cn-erou__grila{grid-template-columns:minmax(0,1fr)}
  .cn-erou__text{justify-items:center;text-align:center;gap:10px}
  .cn-titlu{max-width:none;font-size:clamp(36px,4.2vw,54px)}
  .cn-erou__sub,.cn-erou__inclus,.cn-erou__nota,.cn-erou .cn-cta{display:none}
  .cn-erou__offre{justify-items:center}
  .cn-erou__offre .cn-pret{justify-content:center}
  .cn-erou__actiune{justify-content:center}
  .cn-atelier__cap{display:none}
  .cn-atelier{padding-top:66px}
}
@media (min-width:1024px){
  .cn-atelier__wrap{display:grid;grid-template-columns:minmax(0,1fr) 300px;column-gap:36px;align-items:start}
  .cn-atelier__wrap>.cn-ghid{grid-column:1;grid-row:1}
  .cn-atelier__produs{display:grid;grid-column:2;grid-row:1;position:sticky;top:calc(var(--hdr-h,70px) + 24px);gap:16px;justify-items:center;color:var(--cn-crem)}
  .cn-atelier__produs .cn-erou__vizual{display:block;width:210px;margin:0 0 6px;justify-self:center}
  .cn-atelier__produs .cn-erou-auditie{max-width:300px}
  .cn-atelier__produs .cn-dovezi{justify-content:center}
}
/* același, sus pe tabletă și calculator: ceasul mic, centrat, într-un rând (ca pe telefon); fără rândul cu garanția și al doilea cadou */
@media (min-width:560px){
  .cn-erou .hooo-subcta{justify-content:center;gap:0!important;margin-top:2px!important}
  .cn-erou .hooo-tl--ceas{flex-direction:row;flex-wrap:wrap;justify-content:center;align-items:center;gap:4px 12px;padding:0;background:none;border:0;box-shadow:none;font-size:13px}
  .cn-erou .hooo-tl--ceas .hooo-tl__pana{display:none}
  .cn-erou .hooo-tl--ceas .hooo-tl__cap{display:flex;gap:6px;font-size:11px}
  .cn-erou .hooo-tl__ceas{gap:4px;align-items:center}
  .cn-erou .hooo-tl__u{flex-direction:row;align-items:baseline;gap:3px}
  .cn-erou .hooo-tl__u b{min-width:0;height:auto;padding:3px 7px;border-radius:7px;font-size:17px;line-height:1.25}
  .cn-erou .hooo-tl__u b::after{display:none}
  .cn-erou .hooo-tl__u small{font-size:9.5px;letter-spacing:.04em}
  .cn-erou .hooo-tl__dp{font-size:14px;line-height:1.5}
  .cn-erou .hooo-subcta .hooo-prom{display:none!important}
}

/* ---------- 24.10.2026, Adrian: „pe desktop scoate aia din dreapta cu discul și exemplul și du-l jos, ca formularul să fie pe toată
   lățimea; pe mobil headline-ul de sus mai mare; pe desktop padding puțin mai mare sus și jos” ---------- */
@media (max-width:559.98px){
  .cn-titlu{font-size:clamp(33px,9.4vw,41px)}
}
@media (min-width:1024px){
  .cn-erou{padding:50px 0 92px}
  .cn-atelier__wrap{display:block}
  .cn-atelier__produs{position:static;display:grid;grid-template-columns:auto minmax(0,440px);justify-content:center;align-items:center;column-gap:56px;row-gap:16px;margin:46px auto 0}
  .cn-atelier__produs .cn-erou__vizual{grid-row:1/span 2;width:190px;margin:0}
  .cn-atelier__produs .cn-erou-auditie{grid-column:2;max-width:440px}
  .cn-atelier__produs .cn-dovezi{grid-column:2;justify-content:flex-start}
}
/* 24.10.2026 (bug semnalat de Adrian): sub formular, discul iese cu ~90% din lățimea telefonului spre dreapta și acoperea exemplul și
   pastilele; telefonul primește în dreapta loc cât iese discul */
@media (min-width:1024px){
  .cn-atelier__produs .cn-erou__vizual{margin-right:200px}
}
/* 24.10.2026: „Nu știu ce gen să aleg” stă acum sub cele 12 genuri */
.cn-dale~.cn-gen-ajutor{margin:14px 0 0}
.cn-pas[data-pas="1"] .cn-pas__t{margin-bottom:14px} /* fără textul de sub titlu, genurile stăteau lipite de el */

/* ---------- 24.10.2026, Adrian: „scoatem fundalul acela rozaliu; fundalul primei secțiuni să cuprindă și formularul”: ghidul stă pe
   noaptea eroului, fără troianul dintre ele; eroul și ghidul se citesc ca o singură scenă ---------- */
.cn-erou{padding-bottom:18px}
.cn-erou+.cn-atelier,.cn-atelier{margin-top:0;-webkit-mask:none;mask:none;padding-top:6px;
  background:radial-gradient(900px 520px at 0% 100%,rgba(194,26,101,.28),transparent 70%),linear-gradient(180deg,#2B1430,#1C1220 70%,#171219)}
.cn-atelier__ecou{display:none}
@media (min-width:560px){
  .cn-erou{padding-bottom:22px}
  .cn-atelier{padding-top:8px}
}
@media (min-width:1024px){
  .cn-erou{padding-bottom:26px}
  .cn-atelier{padding-top:10px}
}

/* ---------- 24.10.2026, Adrian: „fundalul de sus să cuprindă și formularul, are efectul ăla pe spate”: fundalul eroului stă în
   .cn-erou (pentru animațiile lui), dar se întinde pe toată .cn-scena (eroul + ghidul). Eroul nu mai e poziționat, deci blocul care
   îl conține pe fundal e scena; aurele și ecourile sunt măsurate de sus, ca să nu sară când pașii ghidului își schimbă înălțimea.
   26.10: „clip”, nu „hidden”: „hidden” face din scenă un container de derulare și bara lipicioasă a ghidului nu mai stătea jos
   pe ecran (pe telefon, „Continuă” apărea abia la capătul pasului). „hidden” rămâne doar pentru navigatoarele fără „clip”. */
.cn-scena{position:relative;isolation:isolate;overflow:hidden;overflow:clip;background:var(--cn-noapte)}
.cn-scena>.cn-erou{position:static;isolation:auto;overflow:visible;background:none}
.cn-scena>.cn-atelier{background:none}
.cn-scena .cn-erou__fundal::after{background:linear-gradient(90deg,rgba(21,16,24,.9),rgba(21,16,24,.62) 35%,rgba(21,16,24,.1) 74%),linear-gradient(0deg,rgba(23,18,25,.8),transparent 380px)}
.cn-scena .cn-aura--1{top:-300px;right:-23%;width:115%;height:900px}
.cn-scena .cn-aura--2{top:260px;bottom:auto;right:-12%;width:100%;height:1100px}
.cn-scena .cn-aura--3{top:-340px;right:-31%;width:100%;height:820px}
.cn-scena .cn-ecouri{top:150px}
@media (min-width:1024px){.cn-scena .cn-ecouri{top:170px;width:760px;right:-240px}}
/* 24.10.2026: imaginile noi ale dalelor (4:5) au subiectul în treimea de sus; dala e lată, deci decupăm mai sus decât la fundalurile vechi */
.cn-dala__fundal img.cn-dala__nou{object-position:50% 14%}
/* 24.10.2026: afișul 16:9 al dalei și bucla lui (assets/cantec/dale/<gen>-169.webp și <gen>.mp4) au aceeași încadrare, pe centru */
.cn-dala__fundal img.cn-dala__afis,.cn-dala-loc[data-cn-bucla*="/dale/"] .cn-dala__fundal video{object-position:50% 50%}

/* 24.10.2026, Adrian („în pasul 2 să vină direct opțiunile; în pașii următori scoate previzualizarea”): fără cardul „Cadou din detaliile
   tale”, iar în pasul 2 fără titlu, subtitlu, „Alegeți voi stilul și vocea”, „Ascultă genul” și nota despre exemplu; titlul rămâne
   pentru cititoarele de ecran și pentru focus (grupul de stiluri îl folosește ca etichetă) */
.cn-proiect{display:none!important}
/* 26.10.2026, Adrian („de acord cu toate”): fiecare pas începe la fel, cu titlul mare; pasul 2 are iar titlul („Ce stil și ce voce?”)
   și rândul cu genul ales, dar tot fără butoanele de ajutor și nota despre exemplu */
.cn-pas[data-pas="2"] .cn-ajutor-muzica{display:none!important}

/* ---------- 26.10.2026, Adrian: versurile la rezumat, gratis, înainte de plată (assets/cantec.js, „versurile la rezumat”) ---------- */
.cn-versuri{display:grid;gap:12px;padding:18px 18px 16px;border:1px solid #EFE3D3;border-radius:20px;background:linear-gradient(180deg,#FFFBF4,#FFF6EC);box-shadow:0 16px 34px -26px rgba(74,40,20,.45)}
.cn-versuri__cap{display:grid;gap:4px}
.cn-versuri__t{margin:0;font-size:19px;font-weight:780;line-height:1.2;letter-spacing:-.02em;color:var(--cn-ink)}
.cn-versuri__sub{margin:0;font-size:14px;line-height:1.5;color:var(--cn-ink-2)}
.cn-versuri__scriem{display:flex;align-items:center;gap:12px;padding:14px 16px;border-radius:14px;background:var(--cn-zm-pal);color:var(--cn-zm-d);font-weight:650;font-size:15px}
.cn-versuri__scriem p{margin:0}
.cn-versuri__unde{display:inline-flex;align-items:flex-end;gap:3px;height:18px;flex:none}
.cn-versuri__unde i{display:block;width:4px;height:100%;border-radius:3px;background:var(--cn-zm);animation:cn-v-unda 1s ease-in-out infinite}
.cn-versuri__unde i:nth-child(2){animation-delay:-.33s}.cn-versuri__unde i:nth-child(3){animation-delay:-.66s}
@keyframes cn-v-unda{0%,100%{transform:scaleY(.35)}50%{transform:scaleY(1)}}
.cn-versuri__text{display:grid;gap:10px}
.cn-versuri__corp{max-height:min(420px,60svh);overflow-y:auto;padding:14px 16px 12px;border:1px solid #EFE3D3;border-radius:16px;background:#fff;overscroll-behavior:contain}
.cn-versuri__titlu{margin:0 0 2px;font-size:20px;font-weight:780;line-height:1.15;color:var(--cn-ink)}
.cn-versuri__sect.is-apare .cn-rand,.cn-versuri__sect.is-apare .cn-sect__t{animation:cn-rand-apare .6s ease both;animation-delay:calc(var(--i,0) * 70ms)}
.cn-versuri .cn-vers{display:block;width:100%;margin:2px 0;padding:4px 7px;border:0;border-bottom:1.5px dashed #D9C9BC;border-radius:6px 6px 0 0;background:#FFFBF6;font:inherit;font-size:16px;color:inherit} /* 16px: iOS nu mai mărește pagina la focus */
.cn-versuri .cn-vers:focus{outline:none;border-bottom-color:var(--cn-zm);background:#fff}
.cn-versuri__ajutor{margin:0;font-size:13px;color:var(--cn-ink-3)}
.cn-versuri__act{display:flex;flex-wrap:wrap;gap:8px}
.cn-versuri .cn-btn--mic{min-height:40px;padding:8px 16px;font-size:14px}
.cn-versuri__ramase{margin:0;font-size:13px;color:var(--cn-ink-3)}
.cn-versuri__ramase:empty{display:none}
.cn-versuri__nota{margin:0;font-size:13px;font-weight:650;color:var(--cn-zm-d)}
.cn-versuri__err{margin:0;padding:12px 14px;border-radius:12px;background:#F7F2EC;font-size:14px;line-height:1.5;color:var(--cn-ink-2)}
@media (prefers-reduced-motion:reduce){.cn-versuri__unde i{animation:none}}

/* ---------- 26.10.2026: refrenul cântat, înainte de plată (assets/cantec.js, „refrenul”) ---------- */
.cn-refren{display:grid;gap:12px;margin-top:4px;padding:16px;border-radius:18px;background:linear-gradient(135deg,#2A1530 0%,#4A1B35 55%,#7A2240 100%);color:#FFF4F6;box-shadow:0 18px 36px -24px rgba(74,20,40,.7);position:relative;overflow:hidden}
.cn-refren::after{content:"";position:absolute;right:-40px;top:-40px;width:160px;height:160px;border-radius:50%;background:radial-gradient(circle,rgba(245,154,173,.35),rgba(245,154,173,0) 70%);pointer-events:none}
.cn-refren__cap{display:flex;gap:12px;align-items:flex-start;position:relative;z-index:1}
.cn-refren__ic{flex:none;display:grid;place-items:center;width:40px;height:40px;border-radius:12px;background:rgba(255,255,255,.12);color:var(--cn-zm-ll)}
.cn-refren__ic svg{width:22px;height:22px}
.cn-refren__t{margin:0;font-size:17px;font-weight:780;line-height:1.25;letter-spacing:-.01em;color:#fff}
.cn-refren__sub{margin:3px 0 0;font-size:13.5px;line-height:1.5;color:rgba(255,236,240,.82)}
.cn-refren .cn-refren__start{justify-self:start;position:relative;z-index:1;min-height:44px;padding:10px 20px;border:0;border-radius:999px;background:#fff;color:var(--cn-zm-d);font-weight:760;font-size:15px;box-shadow:0 8px 20px -10px rgba(0,0,0,.45);transition:transform .2s var(--cn-ease),box-shadow .2s var(--cn-ease)}
.cn-refren .cn-refren__start:hover{transform:translateY(-1px);box-shadow:0 12px 24px -10px rgba(0,0,0,.5)}
.cn-refren .cn-refren__start:focus-visible{outline:3px solid var(--cn-zm-ll);outline-offset:3px}
.cn-refren__lucru{display:flex;align-items:center;gap:12px;position:relative;z-index:1;padding:12px 14px;border-radius:14px;background:rgba(255,255,255,.1);font-weight:650;font-size:14.5px}
.cn-refren__lucru p{margin:0}
.cn-refren__lucru .cn-versuri__unde i{background:var(--cn-zm-ll)}
.cn-refren__audio{position:relative;z-index:1;display:block;width:100%;height:44px;border-radius:999px}
.cn-refren.is-gata .cn-refren__audio{animation:cn-refren-apare .5s var(--cn-ease) both}
@keyframes cn-refren-apare{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.cn-refren__nota{margin:0;position:relative;z-index:1;font-size:13px;color:rgba(255,236,240,.82)}
.cn-refren__err{margin:0;position:relative;z-index:1;padding:10px 12px;border-radius:12px;background:rgba(255,255,255,.1);font-size:13.5px;line-height:1.5;color:#FFE9EE}
@media (prefers-reduced-motion:reduce){.cn-refren.is-gata .cn-refren__audio{animation:none}.cn-refren .cn-refren__start{transition:none}}
/* 03.11.2026 (E2): tot cântecul, sub refren, 72 de ore */
.cn-refren__tot{display:grid;gap:8px;position:relative;z-index:1;padding:12px 14px 14px;border-radius:14px;background:rgba(255,255,255,.1);border:1px solid rgba(255,214,140,.28)}
.cn-refren__tot-t{margin:0;font-size:15px;font-weight:780;color:#FFE3B0}
.cn-refren__tot .cn-refren__nota b{font-weight:760;color:#fff}

/* ---------- 26.10.2026: „Primește versurile pe e-mail” (assets/cantec.js, email-versuri.php) ---------- */
.cn-trimite{border:1px dashed #E3D3C3;border-radius:14px;background:#FFFCF8}
.cn-trimite__sum{cursor:pointer;list-style:none;padding:12px 14px;font-size:14.5px;font-weight:700;color:var(--cn-zm-d)}
.cn-trimite__sum::-webkit-details-marker{display:none}
.cn-trimite__sum::before{content:"✉";display:inline-block;margin-right:8px;font-weight:400}
.cn-trimite__sum::after{content:"›";display:inline-block;margin-left:6px;transition:transform .2s var(--cn-ease)}
.cn-trimite[open] .cn-trimite__sum::after{transform:rotate(90deg)}
.cn-trimite__corp{display:grid;gap:10px;padding:0 14px 14px}
.cn-trimite__sub{margin:0;font-size:13.5px;line-height:1.5;color:var(--cn-ink-2)}
.cn-trimite__rand{display:flex;flex-wrap:wrap;gap:8px}
.cn-trimite__rand input{flex:1 1 200px;min-width:0;min-height:44px;padding:10px 14px;border:1.5px solid #E3D3C3;border-radius:12px;background:#fff;font:inherit;font-size:16px;color:var(--cn-ink)}
.cn-trimite__rand input:focus{outline:none;border-color:var(--cn-zm);box-shadow:0 0 0 3px var(--cn-zm-pal)}
.cn-trimite .cn-btn--mic{min-height:44px}
.cn-trimite__opt{display:flex;gap:8px;align-items:flex-start;font-size:13px;line-height:1.45;color:var(--cn-ink-2)}
.cn-trimite__opt input{margin-top:2px;accent-color:var(--cn-zm)}
.cn-trimite__mesaj{margin:0;padding:10px 12px;border-radius:10px;background:#FBEFEF;font-size:13.5px;line-height:1.5;color:var(--cn-zm-d)}
.cn-trimite__mesaj.is-ok{background:#EAF5EF;color:#1F5B4A}
.cn-trimite__conf{margin:0;font-size:12px;color:var(--cn-ink-3)}
.cn-trimite__conf a{color:inherit}
.cn-note--ok{margin:0 0 12px;padding:12px 14px;border-radius:12px;background:#EAF5EF;color:#1F5B4A;font-size:14px;font-weight:600}
@media (prefers-reduced-motion:reduce){.cn-trimite__sum::after{transition:none}}

/* ---------- 26.10.2026: povestea dictată și stilul recomandat, deja ales (assets/cantec.js) ---------- */
.cn-dicteaza-btn{display:inline-flex;align-items:center;gap:8px;justify-self:start;margin-top:8px;min-height:40px;padding:8px 14px;border:1.5px solid var(--cn-zm-linie);border-radius:999px;background:#fff;color:var(--cn-zm-d);font:inherit;font-size:14px;font-weight:700;cursor:pointer;transition:background .2s var(--cn-ease),color .2s var(--cn-ease)}
.cn-dicteaza-btn__ic{display:grid;place-items:center;width:20px;height:20px}
.cn-dicteaza-btn__ic svg{width:18px;height:18px}
.cn-dicteaza-btn:hover{background:var(--cn-zm-pal)}
.cn-dicteaza-btn:focus-visible{outline:3px solid var(--cn-zm-ll);outline-offset:2px}
.cn-dicteaza-btn.is-asculta{background:var(--cn-zm);border-color:var(--cn-zm);color:#fff}
.cn-dicteaza-btn.is-asculta .cn-dicteaza-btn__ic{animation:cn-dicteaza 1.2s ease-in-out infinite}
@keyframes cn-dicteaza{0%,100%{transform:scale(1)}50%{transform:scale(1.18)}}
.cn-stiluri__gen > .cn-stil:first-of-type{position:relative}
/* eticheta lângă numele stilului, nu peste bifă */
.cn-stiluri__gen > .cn-stil:first-of-type .cn-stil__t::after{content:"Recomandat";display:inline-block;margin-left:8px;padding:2px 8px;border-radius:999px;background:var(--cn-zm);color:#fff;font-size:10.5px;font-weight:750;letter-spacing:.04em;vertical-align:2px}
@media (prefers-reduced-motion:reduce){.cn-dicteaza-btn.is-asculta .cn-dicteaza-btn__ic{animation:none}.cn-dicteaza-btn{transition:none}}
.cn-garantie-cmd{display:flex;gap:10px;align-items:center;margin:0 0 12px;padding:12px 14px;border-radius:14px;background:#EEF6F1;color:#1F5B4A;font-size:14px;line-height:1.45}
.cn-garantie-cmd__ic{flex:none;display:grid;place-items:center;width:28px;height:28px;color:#2F7A55}
.cn-garantie-cmd__ic svg{width:26px;height:26px}
.cn-trimite .cn-btn--mic{border:0;border-radius:999px;background:var(--cn-zm);color:#fff;font-weight:750;padding:10px 18px}
.cn-trimite .cn-btn--mic:hover{background:var(--cn-zm-d)}
.cn-trimite .cn-btn--mic:disabled{opacity:.6}

.cn-note--info{margin:0 0 12px;padding:12px 14px;border-radius:12px;background:#FFF4E5;color:#7A4A12;font-size:14px;font-weight:600}

/* ---------- 26.10.2026, Adrian („toate 5”): povestea în 3 răspunsuri scurte (assets/cantec.js, „povestea ghidată”) ---------- */
.cn-ghidat{display:grid;gap:14px}
.cn-ghidat__q{display:grid;gap:6px}
.cn-ghidat__et{display:flex;align-items:center;gap:10px;font-size:15.5px;font-weight:750;line-height:1.3;color:var(--cn-ink)}
.cn-ghidat__nr{flex:none;display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--cn-zm-pal);color:var(--cn-zm-d);font-size:12.5px;font-weight:800}
.cn-ghidat__in{width:100%;min-height:50px;padding:12px 14px;border:1.5px solid var(--cn-linie);border-radius:14px;background:#fff;font:inherit;font-size:16px;color:var(--cn-ink);transition:border-color .2s,box-shadow .2s}
.cn-ghidat__in::placeholder{color:#A69CAA}
.cn-ghidat__in:focus{outline:none;border-color:var(--cn-zm);box-shadow:0 0 0 3px var(--cn-zm-pal)}
.cn-ghidat__comuta{justify-self:start;padding:6px 0;border:0;background:none;color:var(--cn-zm-d);font:inherit;font-size:13.5px;font-weight:700;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.cn-ghidat__comuta--inapoi{margin-top:6px}
.cn-camp--poveste.is-ghidat textarea,.cn-camp--poveste.is-ghidat .cn-contor,.cn-camp--poveste.is-ghidat .cn-dicteaza-btn{display:none}
.cn-cine__card.is-sugerat:not(.is-ales){border-color:var(--cn-zm-linie)}

/* ---------- 26.10.2026, Adrian („toate 5”): pasul 4 mai scurt, cu versurile și refrenul primele. Fără telefonul demonstrativ
   (pe telefon arăta altă poză decât cântecul, pe calculator era negru); prețul pe un rând; pachetul deschis la cerere; rezumatul strâns ---------- */
.cn-final{display:flex;flex-direction:column;gap:14px}
.cn-final__clip{display:none}
.cn-final__mai{display:contents}
.cn-final .cn-versuri{order:1}
.cn-final__info{order:2}
.cn-final .cn-pachet{order:3}
.cn-final .cn-rezumat{order:4}
.cn-final .cn-caseta{order:5}
.cn-final__info .cn-comanda{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:4px 14px}
.cn-final__info .cn-ai--pret{flex:1 1 200px;margin:0;font-size:12.5px}
details.cn-pachet{padding:0}
.cn-pachet__sum{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 12px;align-items:center;padding:14px 15px;cursor:pointer;list-style:none}
.cn-pachet__sum::-webkit-details-marker{display:none}
.cn-pachet__sum .cn-pachet__titlu{grid-column:1;margin:0;font-size:14.5px;font-weight:750;color:var(--cn-ink)}
.cn-pachet__scurt{grid-column:1;font-size:12.5px;line-height:1.45;color:var(--cn-ink-2)}
.cn-pachet__vezi{grid-column:2;grid-row:1 / span 2;font-size:12.5px;font-weight:750;color:var(--cn-zm-d);text-decoration:underline;text-underline-offset:3px}
details.cn-pachet[open] .cn-pachet__vezi{visibility:hidden}
details.cn-pachet[open] .cn-pachet__scurt{display:none}
details.cn-pachet > .cn-primesti,details.cn-pachet > .cn-conditii{margin:0 15px 14px}
.cn-rezumat__lista{gap:0}
.cn-rezumat__rand{display:grid;grid-template-columns:104px minmax(0,1fr);align-items:baseline;gap:10px;padding:9px 0}
.cn-rezumat__lista dt{margin:0;font-size:12px}
.cn-rezumat__lista dd{font-size:14px;line-height:1.4}
.cn-rezumat__lista dd>span{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.cn-rezumat__edit{min-height:36px;margin:-8px -4px -8px 0}
@media (min-width:1024px){
  .cn-final{display:grid;grid-template-columns:minmax(0,1fr) 330px;grid-template-areas:"v info" "v pachet" "v rez" "v cas";gap:14px 24px;align-items:start}
  .cn-final .cn-versuri{grid-area:v}
  .cn-final__info{grid-area:info}
  .cn-final .cn-pachet{grid-area:pachet}
  .cn-final .cn-rezumat{grid-area:rez}
  .cn-final .cn-caseta{grid-area:cas}
  .cn-final:not(:has(.cn-versuri:not([hidden]))){grid-template-columns:minmax(0,1fr);grid-template-areas:"info" "pachet" "rez" "cas"}
}
.cn-final:has(.cn-versuri__text:not([hidden])) .cn-rezumat__fara{display:none} /* versurile sunt pe ecran: nota „Dacă nu aștepți versurile…” nu mai are rost */

/* ---------- 26.10.2026, Adrian („de acord cu toate”, după melodia-cadou.ro): finisajele ghidului. Pasul 1 mai scurt pe telefon,
   aceeași culoare pentru orice alegere (cardurile: chenar zmeură, fond pal, bifă; cipurile: zmeură plin), apăsarea se simte pe toate cardurile, trecerea dintre pași
   mai scurtă ---------- */
@media (max-width:559.98px){
  .cn-dala-loc{min-height:108px}
  .cn-dala{padding:50px 11px 11px;border-radius:16px}
  .cn-dala__t{font-size:15px}
  .cn-dala__d{font-size:12px;line-height:1.3}
  .cn-asculta{top:8px;right:8px;width:40px;height:40px}
  .cn-eq--dala{top:38px}
}
.cn-voce.is-ales,.cn-cine__card.is-ales{border-color:var(--cn-zm);background:#FFF7F9;color:var(--cn-ink);box-shadow:0 0 0 3px rgba(201,42,72,.12)}
.cn-voce.is-ales small{color:var(--cn-zm-d)}
.cn-cine__card.is-ales .cn-cine__t,.cn-cine__card.is-ales .cn-cine__mai{color:var(--cn-ink)}
.cn-voce.is-ales::after,.cn-cine__card.is-ales::after{content:"";position:absolute;top:7px;left:7px;width:20px;height:20px;border-radius:50%;background:var(--cn-zm) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 12.5l4 4L18.5 8' fill='none' stroke='%23fff' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/13px no-repeat;animation:cn-salt .45s var(--cn-arc)}
.cn-cip.is-ales span{border-color:var(--cn-zm);background:var(--cn-zm);color:#fff;transform:none;box-shadow:0 8px 18px -10px rgba(201,42,72,.9)} /* cipurile: pline, fără bifă, ca rândul să nu se miște la alegere */
.cn-dala:active,.cn-stil:active,.cn-voce:active,.cn-cine__card:active{transform:scale(.97);transition-duration:.1s}
.cn-cip:active span{transform:scale(.95);transition-duration:.1s}
.cn-progres__seg:not(:disabled):active{transform:scale(.96)}
.cn-pas.cn-intra--inainte,.cn-pas.cn-intra--inapoi{animation-duration:.38s}
@media (prefers-reduced-motion:reduce){
  .cn-dala:active,.cn-stil:active,.cn-voce:active,.cn-cine__card:active,.cn-cip:active span{transform:none}
  .cn-voce.is-ales::after,.cn-cine__card.is-ales::after{animation:none}
}

/* ---------- 26.10.2026, Adrian („pasul «Pentru cine e cântecul» la ei se vede mult mai fain”): pastile care curg pe rânduri, nu
   o grilă de 15 carduri albe la fel. Fiecare familie are culoarea ei (mama și bunica roz, tata și bunicul albastru, cuplul roșu,
   copilul verde, bunicii auriu, prietenii turcoaz, colegii indigo, „pentru mine” violet); alegerea e zmeură plin, ca la cipuri.
   „Pentru mine” trece lângă „Altcineva”, la sfârșit: e un cadou, deci primele sunt cei dragi ---------- */
.cn-cine{display:flex;flex-wrap:wrap;gap:7px}
.cn-cine__card{--t:#C92A48;--tb:#FFF4F6;--tl:#F3CBD4;--ti:#FBDDE4;flex:0 0 auto;flex-direction:row;justify-content:flex-start;gap:7px;min-height:44px;padding:4px 13px 4px 4px;border-color:var(--tl);border-radius:999px;background:var(--tb);text-align:left;transition:background .2s,border-color .2s,transform .25s var(--cn-ease),box-shadow .25s}
.cn-cine__ic{width:30px;height:30px;background:var(--ti);color:var(--t)}
.cn-cine__ic svg{width:17px;height:17px}
.cn-cine__t{font:680 14px/1.15 var(--font-body);white-space:nowrap}
.cn-cine__mai{position:static;margin-left:-2px;font-size:14px;color:var(--t)}
.cn-cine__card[data-cn-cine-card="mama"],.cn-cine__card[data-cn-cine-card="bunica"]{--t:#D04577;--tb:#FFF3F7;--tl:#F5C9DA;--ti:#FCDCE8}
.cn-cine__card[data-cn-cine-card="tata"],.cn-cine__card[data-cn-cine-card="bunicul"]{--t:#2F64C9;--tb:#F2F6FF;--tl:#C9D8F5;--ti:#DCE6FB}
.cn-cine__card[data-cn-cine-card="copil"]{--t:#23895C;--tb:#F0FAF5;--tl:#C3E6D4;--ti:#D5F0E2}
.cn-cine__card[data-cn-cine-card="bunicii"]{--t:#B07610;--tb:#FFF8EA;--tl:#F0DDB0;--ti:#FAEACB}
.cn-cine__card[data-cn-cine-card="prietena"],.cn-cine__card[data-cn-cine-card="prietenul"]{--t:#16848F;--tb:#EFF9FA;--tl:#BFE3E7;--ti:#D3EEF1}
.cn-cine__card[data-cn-cine-card="coleg"]{--t:#4B4BC4;--tb:#F4F4FF;--tl:#D3D3F4;--ti:#E2E2FB}
.cn-cine__card[data-cn-cine-card="mine"]{--t:#7A42C9;--tb:#F8F3FF;--tl:#DCCBF3;--ti:#EADDFB;order:1}
.cn-cine__card[data-cn-cine-card="altcineva"]{--t:#7C6A60;--tb:#FAF7F4;--tl:#E3D9D1;--ti:#EFE7E0;order:2}
.cn-cine__card.is-sugerat:not(.is-ales){border-color:var(--t);box-shadow:0 0 0 3px var(--ti)}
.cn-cine__card.is-ales{border-color:var(--cn-zm);background:var(--cn-zm);box-shadow:0 10px 22px -12px rgba(201,42,72,.95)}
.cn-cine__card.is-ales .cn-cine__t,.cn-cine__card.is-ales .cn-cine__mai{color:#fff}
.cn-cine__card.is-ales .cn-cine__ic{background:rgba(255,255,255,.22);color:#fff}
.cn-cine__card.is-ales::after{content:none}
@media (hover:hover){.cn-cine__card:not(.is-ales):hover{border-color:var(--t);transform:translateY(-1px)}}
@media (min-width:560px){.cn-cine{gap:10px}.cn-cine__card{min-height:50px;padding:6px 18px 6px 6px}.cn-cine__t{font-size:15px}}