/* G Records · machetă v5 «Jucăuș»: coperta de single cu numele artistului */
@font-face{font-family:'Big Shoulders';font-weight:100 900;font-display:swap;src:url(../fonts/big-shoulders-latin-ext-normal.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+20A0-20C0,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Big Shoulders';font-weight:100 900;font-display:swap;src:url(../fonts/big-shoulders-latin-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2212}
@font-face{font-family:'Figtree';font-weight:300 900;font-display:swap;src:url(../fonts/figtree-latin-ext-normal.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+20A0-20C0,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Figtree';font-weight:300 900;font-display:swap;src:url(../fonts/figtree-latin-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2212}
@font-face{font-family:'DM Mono';font-weight:400;font-display:swap;src:url(../fonts/dm-mono-latin-ext-400-normal.woff2) format('woff2');unicode-range:U+0100-02BA,U+0218-021B,U+1E00-1E9F}
@font-face{font-family:'DM Mono';font-weight:400;font-display:swap;src:url(../fonts/dm-mono-latin-400-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+2000-206F,U+20AC}
@font-face{font-family:'DM Mono';font-weight:500;font-display:swap;src:url(../fonts/dm-mono-latin-500-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+2000-206F,U+20AC}
@font-face{font-family:'DM Mono';font-weight:500;font-display:swap;src:url(../fonts/dm-mono-latin-ext-500-normal.woff2) format('woff2');unicode-range:U+0100-02BA,U+0218-021B,U+1E00-1E9F}

:root{
  --crem:#F4EEDD; --crem-2:#EAE2CA; --portocaliu:#FF4B1F; --albastru:#2D3CFF; --negru:#131313; --galben:#FFD23F;
  --text:#131313; --text-2:#3d3a33;
  --titlu:'Big Shoulders', 'Arial Narrow', sans-serif;
  --corp:'Figtree', system-ui, sans-serif;
  --mono:'DM Mono', ui-monospace, monospace;
  --arc:cubic-bezier(.34,1.56,.64,1);   /* back.out mic */
  --iese:cubic-bezier(.23,1,.32,1);     /* ease-out puternic */
  --r:18px;                              /* colțuri: cartonașe 18, butoane pastilă */
  --antet:60px;
  --s:min(500px, 33vw);                  /* latura coperții */
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-padding-top:calc(var(--antet) + 12px);-webkit-text-size-adjust:100%}
body{background:var(--crem);color:var(--text);font:400 17px/1.55 var(--corp);overflow-x:hidden}
a{color:inherit}
ul,ol{list-style:none}
svg{display:block}
:focus-visible{outline:3px solid var(--albastru);outline-offset:3px;border-radius:6px}
.sari{position:absolute;left:-999px;top:8px;background:var(--negru);color:var(--crem);padding:10px 14px;border-radius:99px;z-index:20}
.sari:focus{left:12px}

/* ANTET */
.antet{position:sticky;top:0;z-index:10;height:var(--antet);display:flex;align-items:center;gap:28px;
  padding-inline:max(16px, calc((100% - 1280px) / 2 + clamp(16px, 4vw, 48px)));background:color-mix(in srgb, var(--crem) 92%, transparent);
  border-bottom:2px solid var(--negru)}
.marca{font:900 30px/1 var(--titlu);letter-spacing:.01em;text-decoration:none;display:inline-flex;align-items:center;min-height:44px}
.nav{display:flex;gap:22px;margin-left:auto}
.nav a{font-weight:600;font-size:15px;text-decoration:none;min-height:44px;display:inline-flex;align-items:center;background:linear-gradient(var(--portocaliu),var(--portocaliu)) 0 78%/0 3px no-repeat;transition:background-size .3s var(--iese)}
.nav a:hover{background-size:100% 3px}
.tel{font:500 14px/1 var(--mono);text-decoration:none;border:2px solid var(--negru);border-radius:99px;padding:0 14px;min-height:44px;display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.tel small{font-size:12px;background:var(--galben);padding:2px 6px;border-radius:99px}

/* PRIMUL ECRAN */
.erou{max-width:1280px;margin:0 auto;min-height:min(calc(100dvh - var(--antet)), 820px);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);
  align-items:center;gap:clamp(24px,4vw,64px);padding:clamp(24px,4vw,56px) clamp(16px,4vw,48px)}
h1{font-family:var(--titlu);font-weight:900;text-transform:none}
.h1-mare{display:block;font-size:clamp(46px,7.4vw,118px);line-height:.92;letter-spacing:-.005em}
.h1-mic{display:block;font:700 clamp(19px,1.9vw,27px)/1.3 var(--corp);margin-top:14px;max-width:24ch;color:var(--text-2)}
.camp-nume{display:block;margin-top:clamp(20px,3vw,36px);max-width:440px}
.eticheta{display:block;font:500 13px/1 var(--mono);text-transform:uppercase;letter-spacing:.08em;margin-bottom:8px}
.camp-nume input{width:100%;height:58px;border:3px solid var(--negru);border-radius:99px;background:#fffdf6;padding:0 24px;
  font:800 24px/1 var(--titlu);letter-spacing:.04em;text-transform:uppercase;color:var(--negru);box-shadow:4px 4px 0 var(--negru);
  transition:box-shadow .2s var(--iese), transform .2s var(--iese)}
.camp-nume input::placeholder{color:#6f6a5e;text-transform:none;letter-spacing:0;font-weight:600}
.camp-nume input:focus{outline:none;transform:translate(-2px,-2px);box-shadow:6px 6px 0 var(--albastru)}
.actiune{display:flex;align-items:center;flex-wrap:wrap;gap:14px 20px;margin-top:22px}
.buton{display:inline-flex;align-items:center;gap:12px;min-height:56px;padding:6px 8px 6px 26px;border-radius:99px;background:var(--negru);color:var(--crem);
  font:800 18px/1 var(--corp);text-decoration:none;border:0;cursor:pointer;white-space:nowrap;box-shadow:0 1px 0 rgba(255,255,255,.12) inset, 0 10px 24px -12px rgba(19,19,19,.6);
  transition:transform .16s var(--iese), background .2s}
.buton-ic{width:42px;height:42px;border-radius:50%;background:var(--portocaliu);color:var(--negru);display:grid;place-items:center;font-size:20px;transition:transform .3s var(--arc)}
.buton:hover .buton-ic{transform:translateX(3px) rotate(-12deg) scale(1.06)}
.buton:active{transform:scale(.97)}
.pret-sus{font:500 15px/1.2 var(--mono)}
.pret-sus strong{font:900 30px/1 var(--titlu);letter-spacing:.01em;margin-right:2px}
.secundar{display:inline-flex;margin-top:14px;font-weight:600;font-size:15px;min-height:44px;align-items:center;text-underline-offset:4px}

/* SCENA: plicul și discul */
.scena{display:flex;flex-direction:column;align-items:center;gap:18px}
.scena-in{position:relative;width:calc(var(--s) * 1.6);height:var(--s);perspective:1200px;touch-action:pan-y}
.obiect{position:absolute;inset:0}
.disc{position:absolute;top:2%;left:2%;width:96%;height:96%;width:calc(var(--s) * .96);height:calc(var(--s) * .96);border-radius:50%;
  transform:translateX(60%);z-index:0}
.disc-rot{width:100%;height:100%;border-radius:50%;
  background:radial-gradient(circle at 50% 50%, transparent 0 31%, rgba(255,255,255,.07) 31.5% 32%, transparent 32.5%),
    repeating-radial-gradient(circle at 50% 50%, #1b1b1b 0 2px, #0d0d0d 2px 4px),
    #111;
  box-shadow:0 18px 40px -18px rgba(19,19,19,.7), inset 0 0 0 2px #000;display:grid;place-items:center;position:relative;overflow:hidden}
.disc-rot::after{content:"";position:absolute;inset:0;border-radius:50%;background:conic-gradient(from 210deg, transparent 0 8%, rgba(255,255,255,.16) 12%, transparent 18% 58%, rgba(255,255,255,.1) 62%, transparent 68%);pointer-events:none}
.eticheta-disc{width:38%;height:38%;border-radius:50%;background:var(--albastru);color:var(--crem);display:flex;flex-direction:column;align-items:center;justify-content:center;
  text-align:center;position:relative;z-index:1;padding:6%}
.eticheta-disc::before{content:"";position:absolute;width:7%;height:7%;border-radius:50%;background:var(--crem);top:50%;left:50%;transform:translate(-50%,-50%)}
.ed-sus,.ed-jos{font:500 max(12px, calc(var(--s) * .028))/1 var(--mono);letter-spacing:.06em}
.ed-nume{font:900 calc(var(--s) * .055)/1 var(--titlu);text-transform:uppercase;margin:auto 0 auto;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding-bottom:12%}
.ed-sus{margin-top:6%}
.plic{position:absolute;top:0;left:0;width:var(--s);height:var(--s);transform-style:preserve-3d;z-index:1;transform:rotate(-4deg)}
.fata,.spate{position:absolute;inset:0;border-radius:6px;backface-visibility:hidden;-webkit-backface-visibility:hidden;overflow:hidden}
.fata{border:0;cursor:pointer;color:var(--negru);text-align:left;padding:7%;display:flex;flex-direction:column;justify-content:space-between;
  box-shadow:0 30px 60px -28px rgba(19,19,19,.65), 0 2px 0 rgba(255,255,255,.35) inset;font:inherit}
.fata-culoare,.sterge{position:absolute;inset:0;z-index:0;background:var(--copertă, var(--portocaliu))}
.sterge{clip-path:polygon(0 0,0 0,0 0,0 0);background:var(--urmatoare, var(--albastru))}
.fata::after{content:"";position:absolute;inset:0;z-index:3;pointer-events:none;
  background:linear-gradient(115deg, rgba(255,255,255,.28) 0%, rgba(255,255,255,0) 32%, rgba(255,255,255,0) 64%, rgba(255,255,255,.12) 78%, rgba(255,255,255,0) 90%)}
.fata > span:not(.fata-culoare):not(.sterge){position:relative;z-index:2}
.fata-sus{font:900 calc(var(--s) * .07)/1 var(--titlu);letter-spacing:.02em}
.fata-nume{--k:.263;font:900 calc(var(--s) * var(--k))/.94 var(--titlu);text-transform:uppercase;letter-spacing:-.005em;display:flex;flex-wrap:wrap;column-gap:.18em;align-content:flex-end;flex:1;padding-top:6%;overflow-wrap:anywhere}
.cuv{display:inline-flex;white-space:nowrap}
.lit{display:inline-block;transform-origin:50% 80%}
.fata-jos{font:500 max(12px, calc(var(--s) * .032))/1.3 var(--mono);letter-spacing:.02em;margin-top:5%}
.cerc{display:none;position:absolute!important;right:-14%;bottom:24%;width:46%;aspect-ratio:1;border-radius:50%;border:calc(var(--s) * .022) solid currentColor;opacity:.9;z-index:1!important}
.sticker{position:absolute!important;top:4%;right:4%;width:24%;aspect-ratio:1;border-radius:50%;background:var(--galben);color:var(--negru);
  display:flex;flex-direction:column;align-items:center;justify-content:center;transform:rotate(12deg);box-shadow:0 4px 0 rgba(0,0,0,.18);text-align:center;line-height:1}
.sticker b{font:900 calc(var(--s) * .062)/1 var(--titlu)}
.sticker span{font:500 max(12px, calc(var(--s) * .028))/1.15 var(--mono);margin-top:3px}
/* culori de copertă: textul se întoarce după fond */
.plic[data-c="albastru"] .fata,.plic[data-c="negru"] .fata{color:var(--crem)}
.spate{transform:rotateY(180deg);background:var(--crem-2);padding:7%;display:flex;flex-direction:column;box-shadow:0 30px 60px -28px rgba(19,19,19,.65)}
.sp-titlu{font:900 calc(var(--s) * .07)/1 var(--titlu);margin-bottom:5%}
.credite{display:grid;gap:calc(var(--s) * .014);font:400 max(12px, calc(var(--s) * .032))/1.3 var(--mono)}
.credite div{display:grid;grid-template-columns:44% 1fr;gap:4%}
.credite dt{color:#4a463d}
.credite dd{font-weight:500}
#cr-artist{text-transform:uppercase}
.sp-mic{margin-top:auto;font:400 max(12px, calc(var(--s) * .027))/1.35 var(--mono);color:#4a463d}
.scena-ctrl{display:flex;align-items:center;gap:14px;flex-wrap:wrap;justify-content:center}
.mic-btn{font:700 15px/1 var(--corp);background:transparent;border:2px solid var(--negru);border-radius:99px;padding:0 18px;min-height:44px;cursor:pointer;color:var(--negru);transition:background .2s, transform .16s var(--iese)}
.mic-btn:hover{background:var(--galben)}
.mic-btn:active{transform:scale(.96)}
.indiciu{font:500 13px/1.2 var(--mono);color:var(--text-2)}

/* CE PRIMEȘTI */
section h2{font:900 clamp(44px,6vw,92px)/.95 var(--titlu)}
.primesti{max-width:1280px;margin:0 auto;padding:clamp(56px,6vw,88px) clamp(16px,4vw,48px) clamp(72px,9vw,128px)}
.primesti h2 .sub{display:block;font:700 clamp(19px,2vw,26px)/1.3 var(--corp);margin-top:12px;color:var(--text-2)}
.carti{display:grid;grid-template-columns:repeat(12,1fr);gap:22px;margin-top:48px}
.carte{grid-column:span 4;border-radius:var(--r);padding:26px 26px 28px;display:flex;flex-direction:column;gap:8px;border:3px solid var(--negru);
  box-shadow:6px 6px 0 var(--negru);transition:transform .35s var(--arc)}
.carte svg{width:40px;height:40px;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round;margin-bottom:10px}
.carte .cifra{font:900 clamp(40px,4vw,58px)/.95 var(--titlu)}
.carte span{font-size:17px;max-width:30ch}
.carte:nth-child(1){grid-column:span 5;grid-row:span 2;transform:rotate(-2deg)}
.carte:nth-child(1) .cifra{font-size:clamp(64px,8vw,120px)}
.carte:nth-child(1) span{font-size:20px;font-weight:600}
.carte:nth-child(2){transform:rotate(1.6deg)}
.carte:nth-child(3){grid-column:span 3;transform:rotate(-1.2deg)}
.carte:nth-child(4){grid-column:span 4;transform:rotate(-1.5deg)}
.carte:nth-child(5){grid-column:span 3;transform:rotate(2deg)}
.carte:nth-child(6){grid-column:6 / span 7;transform:rotate(-.8deg)}
.carte:hover{transform:rotate(0) translateY(-4px)}
.c-portocaliu{background:var(--portocaliu)}
.c-crem{background:#fffdf6}
.c-albastru{background:var(--albastru);color:var(--crem)}
.c-negru{background:var(--negru);color:var(--crem);box-shadow:6px 6px 0 var(--portocaliu)}
.c-galben{background:var(--galben)}
.c-crem2{background:var(--crem-2)}
.text-mic{margin-top:40px;font:500 14px/1.5 var(--mono);max-width:60ch;color:var(--text-2)}

/* CUM INTRI */
.calendar{background:var(--albastru);color:var(--crem);padding:clamp(72px,9vw,120px) max(16px, calc((100% - 1280px) / 2 + clamp(16px,4vw,48px)))}
.pasi{display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin-top:44px;border-top:3px solid var(--crem)}
.pasi li{padding:26px 24px 8px 0;display:flex;flex-direction:column;gap:6px;position:relative}
.pasi li + li{padding-left:24px;border-left:3px solid var(--crem)}
.pista{font:500 14px/1 var(--mono);background:var(--crem);color:var(--albastru);border-radius:99px;padding:6px 10px;align-self:flex-start;margin-bottom:10px}
.pasi b{font:800 clamp(22px,2.2vw,30px)/1.15 var(--corp)}
.data{font:900 clamp(30px,3.4vw,48px)/1 var(--titlu);color:var(--galben)}
.nota-cal{margin-top:40px;max-width:62ch;font-size:18px}

/* SERIA */
.serie{max-width:1280px;margin:0 auto;padding:clamp(72px,9vw,128px) clamp(16px,4vw,48px);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.3fr);gap:40px 56px;align-items:start}
.serie h2 span{display:block;font:700 clamp(19px,2vw,26px)/1.3 var(--corp);margin-top:12px;color:var(--text-2)}
.serie-text p{margin-top:18px;max-width:46ch}
.raft{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.plic-gol{aspect-ratio:1;border:3px dashed var(--negru);border-radius:8px;display:flex;flex-direction:column;justify-content:flex-end;padding:16px;position:relative;overflow:hidden}
.plic-gol::before{content:"";position:absolute;width:70%;aspect-ratio:1;border-radius:50%;right:-25%;top:-20%;background:repeating-radial-gradient(circle, rgba(19,19,19,.12) 0 2px, transparent 2px 6px)}
.plic-gol:nth-child(2){transform:rotate(2deg)} .plic-gol:nth-child(3){transform:rotate(-1.5deg)}
.plic-gol span{font:900 28px/1 var(--titlu);position:relative}
.plic-gol small{font:500 13px/1.3 var(--mono);color:var(--text-2);position:relative;margin-top:4px}
.comunitate{grid-column:1 / -1;display:flex;align-items:center;gap:18px;background:var(--galben);border-radius:var(--r);padding:22px 26px;border:3px solid var(--negru)}
.comunitate svg{width:44px;height:44px;flex:none;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}
.de-confirmat{font:500 13px/1 var(--mono)}

/* APLICAREA */
.aplica{background:var(--portocaliu);padding:clamp(72px,9vw,120px) max(16px, calc((100% - 1280px) / 2 + clamp(16px,4vw,48px)));display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:40px 64px;align-items:start}
.aplica-cap p{margin-top:16px;font-size:19px;max-width:34ch;font-weight:500}
.pret-jos{font:500 16px/1.2 var(--mono)!important}
.pret-jos strong{font:900 44px/1 var(--titlu)}
.formular{display:grid;grid-template-columns:1fr 1fr;gap:18px 18px;background:var(--crem);border:3px solid var(--negru);border-radius:var(--r);padding:clamp(20px,3vw,34px);box-shadow:8px 8px 0 var(--negru)}
.f-rand{display:flex;flex-direction:column;gap:8px}
.f-lat{grid-column:1 / -1}
.f-rand label{font-weight:700;font-size:15px}
.f-rand input,.f-rand textarea{font:500 17px/1.3 var(--corp);color:var(--negru);background:#fffdf6;border:2px solid var(--negru);border-radius:12px;padding:12px 14px;min-height:50px;width:100%}
.f-rand input::placeholder{color:#6f6a5e}
.f-rand input:focus,.f-rand textarea:focus{outline:3px solid var(--albastru);outline-offset:1px}
#f-scena{font:800 20px/1 var(--titlu);letter-spacing:.04em;text-transform:uppercase}
.f-scena-aprins{animation:aprins 1.2s var(--iese)}
@keyframes aprins{0%{background:var(--galben)}100%{background:#fffdf6}}
.f-trimite{grid-column:1 / -1;display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-top:4px}
.f-nota{font:500 13px/1.4 var(--mono);color:var(--text-2);max-width:40ch}

/* SUBSOL */
.subsol{background:var(--negru);color:var(--crem);padding:56px max(16px, calc((100% - 1280px) / 2 + clamp(16px,4vw,48px))) 40px}
.subsol-marca{font:900 clamp(72px,16vw,240px)/.82 var(--titlu);letter-spacing:-.01em}
.semnatura{font:700 clamp(19px,2vw,26px)/1.3 var(--corp);margin-top:16px;color:var(--galben)}
.subsol-rand{display:flex;flex-wrap:wrap;gap:8px 24px;align-items:center;margin-top:32px;font-size:15px}
.subsol-rand a{min-height:44px;display:inline-flex;align-items:center}
.subsol .mic{font:400 13px/1.3 var(--mono);color:#cfc8b4}

/* zbor: numele care trece în formular */
.zbor{position:fixed;z-index:30;pointer-events:none;font:900 28px/1 var(--titlu);text-transform:uppercase;color:var(--negru);background:var(--galben);padding:6px 12px;border-radius:99px;white-space:nowrap;box-shadow:3px 3px 0 var(--negru)}

/* TABLETĂ */
@media (max-width:1023px){
  .nav{display:none}
  .tel{margin-left:auto}
  .erou{grid-template-columns:1fr;min-height:0}
  :root{--s:min(360px, 60vw)}
  .scena{order:0}
  .carte,.carte:nth-child(n){grid-column:span 6;grid-row:auto}
  .serie,.aplica{grid-template-columns:1fr}
}
/* TELEFON */
@media (max-width:767px){
  :root{--antet:56px;--s:min(218px, 56vw)}
  body{font-size:16px}
  .antet{gap:12px}
  .marca{font-size:26px}
  .tel{font-size:13px;padding:0 12px}
  .erou{padding:14px 16px 40px;gap:16px;display:flex;flex-direction:column;align-items:stretch}
  .erou-text{display:contents}
  h1{order:1}
  .h1-mare{font-size:46px}
  .h1-mic{font-size:17px;margin-top:8px}
  .camp-nume{order:2;margin-top:0}
  .camp-nume input{height:52px;font-size:22px}
  .scena{order:3;gap:10px;align-items:flex-start}
  .scena-in{margin-left:4px}
  .scena-ctrl{justify-content:flex-start}
  .indiciu{display:none}
  .sticker{width:30%;top:3%;right:3%}
  .ed-sus,.ed-jos{display:none}
  .ed-nume{font-size:12px;padding-bottom:0}
  .fata-jos{letter-spacing:0}
  .actiune{order:4;margin-top:0;gap:10px 14px}
  .secundar{order:5;margin-top:-6px}
  .buton{font-size:17px;padding-left:22px}
  .carti{grid-template-columns:1fr;gap:18px}
  .carte,.carte:nth-child(n){grid-column:auto;transform:none}
  .carte:nth-child(odd){transform:rotate(-1deg)} .carte:nth-child(even){transform:rotate(1deg)}
  .pasi{grid-template-columns:1fr;border-top:0}
  .pasi li,.pasi li + li{padding:20px 0;border-left:0;border-top:3px solid var(--crem)}
  .raft{grid-template-columns:1fr 1fr 1fr;gap:10px}
  .plic-gol{padding:10px}
  .plic-gol span{font-size:20px}
  .plic-gol small{font-size:12px}
  .comunitate{flex-direction:column;align-items:flex-start}
  .formular{grid-template-columns:1fr}
}
@media (max-width:359px){ .tel small{display:none} }

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{transition-duration:.01ms!important;animation-duration:.01ms!important}
  .plic{transform:none}
  .carte,.carte:nth-child(n){transform:none!important}
}