/* Mono Space · macheta 5 · Premium, atmosferă: sala seara, o singură lumină caldă */
@font-face { font-family: "Bricolage Grotesque"; font-weight: 450 650; font-display: swap; src: url(../fonturi/bricolage-grotesque/bricolage-latin-ext.woff2) format("woff2"); unicode-range: U+0100-017F, U+0218-021B; }
@font-face { font-family: "Bricolage Grotesque"; font-weight: 450 650; font-display: swap; src: url(../fonturi/bricolage-grotesque/bricolage-latin.woff2) format("woff2"); unicode-range: U+0000-00FF, U+2013-2014, U+2018-201E, U+2022, U+2026, U+20AC, U+2192, U+2212; }
@font-face { font-family: "Hanken Grotesk"; font-weight: 400 600; font-display: swap; src: url(../fonturi/hanken-grotesk/hanken-latin-ext.woff2) format("woff2"); unicode-range: U+0100-017F, U+0218-021B; }
@font-face { font-family: "Hanken Grotesk"; font-weight: 400 600; font-display: swap; src: url(../fonturi/hanken-grotesk/hanken-latin.woff2) format("woff2"); unicode-range: U+0000-00FF, U+2013-2014, U+2018-201E, U+2022, U+2026, U+20AC, U+2192, U+2212; }
@font-face { font-family: "JetBrains Mono"; font-weight: 400 500; font-display: swap; src: url(../fonturi/jetbrains-mono/mono-latin.woff2) format("woff2"); unicode-range: U+0000-00FF, U+2013-2014, U+2018-201E, U+2022, U+2026, U+20AC, U+2192, U+2212; }
@font-face { font-family: "JetBrains Mono"; font-weight: 400 500; font-display: swap; src: url(../fonturi/jetbrains-mono/mono-latin-ext.woff2) format("woff2"); unicode-range: U+0100-017F, U+0218-021B; }


:root {
  --negru: #0d0f10;          /* sala stinsă */
  --antracit: #17191b;       /* gri închis */
  --antracit-2: #202426;
  --antracit-3: #2a2f31;
  --sirius: #6f8a81;         /* gri verzui Sirius */
  --sirius-stins: #34403c;
  --text: #e9ece9;
  --text-2: #a8b2ae;
  --lumina: #f2c48e;         /* lumina caldă, singurul accent */
  --lumina-2: #ffdcb0;
  --pe-lumina: #1a1208;
  --gresit: #ff9f8c;
  --linie: rgba(233, 236, 233, .1);
  --linie-2: rgba(233, 236, 233, .18);
  --lum: var(--lumina);      /* lumina activității alese (orele, conurile) */
  --r: 14px;                 /* raza: rame, fișe, câmpuri; butoanele și comenzile sunt pastile */
  --ies: cubic-bezier(.23, 1, .32, 1);
  --greu: cubic-bezier(.65, 0, .35, 1);
  --display: "Bricolage Grotesque", "Hanken Grotesk", system-ui, sans-serif;
  --corp: "Hanken Grotesk", system-ui, sans-serif;
  --mono: "JetBrains Mono", ui-monospace, monospace;
  --margine: clamp(20px, 5vw, 72px);
}
html[data-activ="live"] { --lum: #efe3cf; }
html[data-activ="clip"] { --lum: #c9d6ee; }
html[data-activ="curs"] { --lum: #f5ad62; }

*, *::before, *::after { box-sizing: border-box; }
html { background: var(--negru); color: var(--text); font-family: var(--corp); font-size: 100%; -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: 96px; scrollbar-color: var(--antracit-3) var(--negru); accent-color: var(--lumina); caret-color: var(--lumina); }
body { margin: 0; line-height: 1.55; text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; }
::selection { background: var(--lumina); color: var(--pe-lumina); }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
body::after { /* granulație fină, fixă, ca pe o cameră seara */
  content: ""; position: fixed; inset: 0; pointer-events: none; z-index: 30; opacity: .045;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
h1, h2, h3, p, dl, dd, figure { margin: 0; }
[hidden] { display: none !important; }
a { color: inherit; text-underline-offset: .2em; text-decoration-thickness: 1px; }
img { display: block; max-width: 100%; }
:focus-visible { outline: 2px solid var(--lumina); outline-offset: 3px; border-radius: 6px; }
.sari { position: absolute; left: 12px; top: -60px; z-index: 50; background: var(--lumina); color: var(--pe-lumina); padding: 10px 14px; border-radius: 99px; }
.sari:focus { top: 12px; }
.sr { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.ic { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; flex: none; }

/* ---------- butoane: pastile, apăsate fizic ---------- */
.btn {
  --h: 52px; display: inline-flex; align-items: center; justify-content: space-between; gap: 14px; min-height: var(--h); padding: 6px 6px 6px 22px; border-radius: 99px;
  background: var(--lumina); color: var(--pe-lumina); font: 600 16px/1 var(--corp); text-decoration: none; white-space: nowrap; border: 0; cursor: pointer;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.45), 0 10px 24px -14px rgba(0,0,0,.8);
  transition: transform .16s var(--ies), background-color .3s var(--ies), box-shadow .3s var(--ies), opacity .3s;
}
.btn__ic { width: 40px; height: 40px; border-radius: 50%; background: rgba(26,18,8,.1); display: grid; place-items: center; transition: transform .35s var(--ies); }
.btn__ic svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.btn:active { transform: scale(.97); }
@media (hover: hover) { .btn:hover { background: var(--lumina-2); } .btn:hover .btn__ic { transform: translate(2px, -1px) scale(1.05); } }
.btn--mic { --h: 44px; padding: 0 18px; font-size: 14px; }
.btn--contur { background: transparent; color: var(--text); box-shadow: inset 0 0 0 1px var(--linie-2); padding: 0 22px; gap: 10px; justify-content: center; }
@media (hover: hover) { .btn--contur:hover { background: rgba(233,236,233,.06); } }
.btn[aria-disabled="true"] { opacity: .5; cursor: not-allowed; }
.btn[aria-disabled="true"]:active { transform: none; }
.btn[disabled] { opacity: .6; cursor: progress; }
.link-ora { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; color: var(--lumina); font: 600 16px/1 var(--corp); text-decoration: none; }
.link-ora .ic { transition: transform .3s var(--ies); }
@media (hover: hover) { .link-ora:hover .ic { transform: translateX(4px); } .link-ora:hover { text-decoration: underline; } }

/* ---------- antet: pastilă plutitoare (fixă pe desktop; pe telefon stă sus, nu peste text) ---------- */
.antet {
  position: fixed; z-index: 20; top: 14px; left: 50%; translate: -50% 0; width: min(calc(100% - 24px), 1280px);
  display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 8px 8px 8px 20px; border-radius: 99px;
  background: rgba(13,15,16,.62); backdrop-filter: blur(14px) saturate(1.2); -webkit-backdrop-filter: blur(14px) saturate(1.2);
  box-shadow: inset 0 0 0 1px rgba(233,236,233,.08), inset 0 1px 0 rgba(255,255,255,.05), 0 12px 30px -18px rgba(0,0,0,.8);
}
.marca { font: 650 17px/1 var(--display); letter-spacing: -.02em; text-decoration: none; display: inline-flex; align-items: center; min-height: 44px; }
.marca span { color: var(--sirius); margin-left: .18em; }
.antet__nav { display: flex; gap: 12px; font-size: 14px; color: var(--text-2); }
.antet__nav a { text-decoration: none; padding: 12px 8px; min-width: 44px; text-align: center; transition: color .2s; }
.antet__nav a:hover { color: var(--text); }
.antet__dr { display: flex; align-items: center; gap: 8px; flex: none; }
.antet__tel {
  display: inline-grid; place-items: center; width: 44px; height: 44px; border-radius: 99px; color: var(--text-2);
  box-shadow: inset 0 0 0 1px rgba(233,236,233,.14); transition: color .2s, box-shadow .2s, transform .16s var(--ies);
}
.antet__tel:hover { color: var(--text); box-shadow: inset 0 0 0 1px rgba(233,236,233,.32); }
.antet__tel:active { transform: scale(.97); }
@media (max-width: 380px) { .antet__lung { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; } }
@media (max-width: 860px) { .antet__nav { display: none; } }
@media (max-width: 760px) { .antet { position: absolute; top: 10px; padding-left: 16px; } }

/* ---------- primul ecran ---------- */
.erou { position: relative; min-height: 100svh; display: grid; align-items: center; overflow: hidden; overflow: clip; }
.erou__scena {
  position: absolute; inset: 0; z-index: 0; touch-action: pan-y; cursor: grab;
  background: radial-gradient(60% 55% at 64% 58%, #2a2a25 0%, #15171a 55%, var(--negru) 100%);
}
.erou__scena:active { cursor: grabbing; }
.erou__poster, .erou__poster img { position: absolute; inset: 0; width: 100%; height: 100%; }
.erou__poster img { object-fit: cover; object-position: 50% 50%; transition: opacity .3s var(--ies); }
.erou__poster img.schimba { opacity: 0; }
.erou__scena canvas { position: absolute; z-index: 0; inset: 0; width: 100%; height: 100%; opacity: 0; transition: opacity .9s var(--ies); }
.erou__scena.aprins canvas { opacity: 1; }
.erou__scena::after { /* umbra din stânga, ca textul să stea pe întuneric */
  content: ""; position: absolute; z-index: 1; inset: 0; pointer-events: none;
  background: linear-gradient(90deg, rgba(13,15,16,.94) 0%, rgba(13,15,16,.72) 26%, rgba(13,15,16,0) 50%), linear-gradient(0deg, rgba(13,15,16,.75) 0%, rgba(13,15,16,0) 22%);
}
.fara-3d .format { display: none; }

.erou__text { position: relative; z-index: 2; padding: 112px var(--margine) 64px; max-width: calc(580px + var(--margine)); pointer-events: none; }
.erou__text > * { pointer-events: auto; }
h1 { font: 650 clamp(44px, 5.4vw, 80px)/1.04 var(--display); letter-spacing: -.035em; text-wrap: balance; }
h1 span { display: block; color: var(--lumina); font-weight: 450; }
.erou__sub { margin-top: 22px; max-width: 42ch; font-size: 18px; color: var(--text-2); }

/* consola de lumini: patru întrerupătoare */
.consola { margin-top: 32px; display: grid; grid-template-columns: repeat(4, auto); gap: 6px; padding: 6px; width: max-content; max-width: 100%; border-radius: 99px; background: rgba(20,22,24,.92); box-shadow: inset 0 0 0 1px var(--linie), inset 0 1px 0 rgba(255,255,255,.04); }
.consola button {
  display: inline-flex; align-items: center; gap: 9px; min-height: 44px; padding: 0 16px 0 13px; border: 0; border-radius: 99px; background: transparent; color: #c4ccc8;
  font: 500 15px/1.1 var(--corp); cursor: pointer; white-space: nowrap; transition: background-color .5s var(--ies), color .5s var(--ies), transform .16s var(--ies);
}
.consola button:active { transform: scale(.97); }
.consola button[aria-checked="true"] { background: var(--antracit-2); color: var(--text); box-shadow: inset 0 1px 0 rgba(255,255,255,.06), 0 6px 18px -8px rgba(0,0,0,.8); }
@media (hover: hover) { .consola button:hover { color: var(--text); } }
.bec { width: 9px; height: 9px; border-radius: 50%; background: #3b423f; flex: none; transition: background-color .9s var(--greu), box-shadow .9s var(--greu); }
[aria-checked="true"] .bec, .comut input:checked ~ .bec { background: var(--lumina); box-shadow: inset 0 0 0 1px rgba(255,255,255,.3); }

.fisa { margin-top: 16px; display: flex; align-items: center; justify-content: space-between; gap: 20px; max-width: 540px; padding: 12px 12px 12px 22px; border-radius: 99px; background: rgba(20,22,24,.92); box-shadow: inset 0 0 0 1px var(--linie); }
.fisa__nume { font: 600 17px/1.2 var(--display); transition: opacity .22s var(--ies); }
.fisa__nume.schimba { opacity: 0; }
.fisa__pret { font: 400 13px/1.45 var(--mono); color: var(--text-2); }
.fisa__pret > span:first-child { color: var(--lumina); }
.fisa__azi { display: block; color: var(--text); }
.fisa__azi:empty { display: none; }

/* vizorul camerei: ghidaje, lumina activității, 16:9 sau 9:16 */
.vizor { position: absolute; z-index: 2; inset: 96px 4% 84px 46%; pointer-events: none; display: grid; place-items: center; }
.vizor__zona { position: relative; width: 100%; height: 100%; transition: box-shadow .9s var(--greu); border-radius: 4px; }
.vizor[data-vizor="9:16"] .vizor__zona { width: min(100%, calc((100svh - 180px) * 9 / 16)); box-shadow: 0 0 0 100vmax rgba(8,9,10,.55); }
.col { position: absolute; width: 26px; height: 26px; border: solid rgba(233,236,233,.7); border-width: 0; }
.col--ss { left: 0; top: 0; border-top-width: 1.5px; border-left-width: 1.5px; }
.col--sd { right: 0; top: 0; border-top-width: 1.5px; border-right-width: 1.5px; }
.col--js { left: 0; bottom: 0; border-bottom-width: 1.5px; border-left-width: 1.5px; }
.col--jd { right: 0; bottom: 0; border-bottom-width: 1.5px; border-right-width: 1.5px; }
.vizor__lumina { position: absolute; left: 14px; bottom: 14px; padding: 6px 12px; border-radius: 99px; background: rgba(13,15,16,.86); box-shadow: inset 0 0 0 1px var(--linie); font: 500 13px/1.3 var(--corp); color: var(--text); transition: opacity .22s var(--ies); }
.vizor__lumina.schimba { opacity: 0; }
.format { position: absolute; z-index: 3; right: calc(4% + 12px); top: 108px; display: flex; gap: 2px; padding: 3px; border-radius: 99px; background: rgba(13,15,16,.9); box-shadow: inset 0 0 0 1px var(--linie); }
.format button { min-height: 44px; min-width: 52px; padding: 0 10px; border: 0; border-radius: 99px; background: transparent; color: #c4ccc8; font: 500 12px/1 var(--mono); cursor: pointer; transition: background-color .3s var(--ies), color .3s; }
.format button[aria-pressed="true"] { background: rgba(233,236,233,.14); color: var(--text); }

/* intrarea primului ecran: titlul e vizibil de la prima pictare (LCP), restul urcă pe rând */
@media (prefers-reduced-motion: no-preference) {
  .intra-titlu { animation: intra-titlu .8s var(--ies) both; }
  @keyframes intra-titlu { from { opacity: .4; translate: 0 12px; } }
  .intra { animation: intra .9s var(--ies) both; animation-delay: calc(var(--i) * 90ms + 120ms); }
  @keyframes intra { from { translate: 0 16px; } }
}


/* telefon: titlul, sala într-o fereastră, consola, fișa */
@media (max-width: 820px) {
  .erou { display: flex; flex-direction: column; align-items: stretch; min-height: 0; padding-top: 66px; }
  .erou__scena { position: relative; order: 2; inset: auto; aspect-ratio: 5 / 4; max-height: 42svh; width: auto; margin: 0 12px; border-radius: var(--r); overflow: hidden; box-shadow: inset 0 0 0 1px var(--linie); }
  .erou__scena::after { background: linear-gradient(0deg, rgba(13,15,16,.55) 0%, rgba(13,15,16,0) 30%); }
  .erou__text { display: contents; }
  .erou h1 { order: 1; padding: 4px 20px 12px; font-size: clamp(32px, 9vw, 46px); }
  .consola { order: 3; margin: 10px 12px 0; width: auto; grid-template-columns: repeat(4, 1fr); border-radius: 18px; gap: 4px; padding: 4px; }
  .consola button { flex-direction: column; justify-content: center; gap: 5px; min-height: 54px; padding: 6px 4px; border-radius: 14px; font-size: 13px; white-space: normal; text-align: center; line-height: 1.15; }
  .fisa { order: 4; margin: 8px 12px 0; max-width: none; padding: 8px 8px 8px 18px; border-radius: 22px; }
  .erou__sub { order: 5; margin: 22px 20px 0; font-size: 16px; }
  .vizor { inset: 12px; }
  .vizor[data-vizor="9:16"] .vizor__zona { width: 42%; }
  .format { top: 10px; right: 10px; }

}
@media (max-width: 380px) { .fisa .btn { padding-left: 16px; gap: 8px; } .fisa .btn__ic { width: 34px; height: 34px; } .fisa__pret { font-size: 12px; } }

.inapoi { margin-top: 14px; display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 4px; border: 0; background: transparent; color: var(--text); font: 500 15px/1 var(--corp); cursor: pointer; text-decoration: underline; text-underline-offset: .25em; text-decoration-color: var(--linie-2); }
@media (max-width: 820px) { .inapoi { order: 4; margin: 10px 20px 0; align-self: flex-start; } }
/* posterul (pentru imaginile de pornire): doar sala, fără text */
.poster body::after, .poster .antet, .poster .erou__text, .poster .vizor, .poster .format, .poster main > :not(.erou), .poster .subsol, .poster .erou__scena::after, .poster .erou__poster { display: none; }
.poster .erou__scena { position: fixed; inset: 0 auto auto 0; width: 100vw; height: 100vh; margin: 0; border-radius: 0; max-height: none; aspect-ratio: auto; }
@media (max-width: 820px) { .poster .erou__scena { height: 80vw; } }

/* ---------- secțiunile de după: lente, puține ---------- */
section:not(.erou) { padding: clamp(96px, 13vw, 168px) var(--margine) 0; max-width: 1320px; margin: 0 auto; }
h2 { font: 600 clamp(34px, 4.4vw, 60px)/1.06 var(--display); letter-spacing: -.03em; text-wrap: balance; }
h3 { font: 600 clamp(22px, 2.2vw, 28px)/1.15 var(--display); letter-spacing: -.02em; }
.apare { transition: opacity .7s var(--ies), translate .9s var(--ies); }
.js .apare:not(.vazut) { opacity: 0; translate: 0 24px; }
@media (prefers-reduced-motion: reduce) { .js .apare:not(.vazut) { opacity: 1; translate: none; } }

/* activitățile: planul de lumină al fiecăreia, ca foaia tehnicianului */
.lista { list-style: none; margin: 56px 0 0; padding: 0; }
.rand {
  position: relative; display: grid; grid-template-columns: 160px minmax(0, 1fr) auto; align-items: center; gap: 36px; padding: 26px 24px 26px 18px; border-radius: var(--r);
  transition: background-color .6s var(--ies);
}
.rand + .rand::before { content: ""; position: absolute; left: 18px; right: 18px; top: 0; height: 1px; background: var(--linie); }
.rand__plan { width: 160px; aspect-ratio: 1; border-radius: 12px; background: var(--antracit); box-shadow: inset 0 0 0 1px var(--linie), inset 0 1px 0 rgba(255,255,255,.04); padding: 6px; }
.plan { display: block; width: 100%; height: 100%; }
.pl-con { stroke-dasharray: 1; stroke-dashoffset: 0; stroke-opacity: .55; fill-opacity: var(--o); }
.rand h3 { font-size: clamp(24px, 2.6vw, 34px); }
.rand__txt p { color: var(--text-2); margin-top: 6px; max-width: 58ch; }
.rand .rand__meta { font: 400 13px/1.5 var(--mono); color: var(--text-2); margin-top: 10px; }
.rand__meta b { font-weight: 500; color: var(--lumina); }
.rand__act { display: flex; flex-direction: column; align-items: stretch; gap: 8px; }
.rand__vezi { min-height: 44px; padding: 0 18px; border-radius: 99px; border: 0; background: transparent; color: var(--text); font: 500 14px/1 var(--corp); box-shadow: inset 0 0 0 1px var(--linie-2); cursor: pointer; transition: background-color .3s var(--ies), transform .16s var(--ies); }
.rand__vezi:active { transform: scale(.97); }
@media (hover: hover) { .rand:hover { background: rgba(233,236,233,.03); } .rand__vezi:hover { background: rgba(233,236,233,.06); } }
.activitati__nota { margin-top: 32px; max-width: 70ch; color: var(--text-2); font-size: 15px; padding-left: 18px; }
/* mișcarea: contururile, apoi conurile se trag din stative, apoi lumina se umple ca un dimmer, apoi prețul */
@media (prefers-reduced-motion: no-preference) {
  .js .rand .pl-sala, .js .rand .pl-obiecte { transition: opacity .6s var(--ies); }
  .js .rand .pl-con { transition: stroke-dashoffset .75s var(--greu) .2s, fill-opacity .9s cubic-bezier(.4, 0, .2, 1) .65s; }
  .js .rand .rand__txt, .js .rand .rand__act { transition: opacity .7s var(--ies) 1s, translate .7s var(--ies) 1s; }
  .js .rand .rand__txt { transition-delay: .15s; }
  .js .rand:not(.vazut) .pl-sala, .js .rand:not(.vazut) .pl-obiecte { opacity: .15; }
  .js .rand:not(.vazut) .pl-con { stroke-dashoffset: 1; fill-opacity: 0; }
  .js .rand:not(.vazut) .rand__txt, .js .rand:not(.vazut) .rand__act { opacity: 0; translate: 0 12px; }
  .js .rand:nth-child(2) .pl-con { transition-delay: .3s, .75s; } .js .rand:nth-child(3) .pl-con { transition-delay: .4s, .85s; } .js .rand:nth-child(4) .pl-con { transition-delay: .5s, .95s; }
}
@media (max-width: 720px) {
  .rand { grid-template-columns: 76px minmax(0, 1fr); gap: 4px 16px; padding: 24px 4px; align-items: start; }
  .rand__plan { width: 76px; padding: 4px; }
  .rand__act { grid-column: 1 / -1; flex-direction: row; margin-top: 14px; }
  .rand__act .btn { flex: 1; justify-content: center; }
  .activitati__nota { padding-left: 4px; }
}

/* sala: ramele pentru poze, cu vizorul camerei */
.sala__cap { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 0 32px; }
.sala__cap h2, .sala__cap p { grid-column: 1; }
.sala__cap p { margin-top: 16px; max-width: 48ch; color: var(--text-2); font-size: 18px; }
.sala__cap .format--sala { grid-column: 2; grid-row: 1 / span 2; align-self: end; margin-top: 0; }
@media (max-width: 760px) { .sala__cap { grid-template-columns: minmax(0, 1fr); } .sala__cap .format--sala { grid-column: 1; grid-row: auto; justify-self: start; margin-top: 22px; } }
.format--sala { position: static; display: inline-flex; margin-top: 22px; }
.rame { margin-top: 44px; display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr) minmax(0, 1fr); grid-template-rows: 300px 260px; gap: 14px; }
.rame:focus-visible { outline-offset: 6px; }
.rama { display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.rama--mare { grid-row: span 2; }
.rama:nth-child(4) { grid-column: span 2; }
.rama__poza {
  position: relative; flex: 1; min-height: 0; border-radius: var(--r); overflow: hidden; display: grid; place-items: center;
  background: linear-gradient(160deg, #2c3132, #121415 72%);
  box-shadow: inset 0 0 0 1px var(--linie), inset 0 1px 0 rgba(255,255,255,.04);
  transition: filter 1.3s cubic-bezier(.4, 0, .2, 1) .5s;
}
.rama__poza--sirius { background: linear-gradient(200deg, #4c5f58, #1d2321 75%); }
.rama__poza--inchis { background: linear-gradient(180deg, #1d2022, #0f1112); }
.rama__poza--perete { background: linear-gradient(90deg, #56695f, #34403c 70%); }
.rama__poza img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: saturate(.85); }
.rama__vizor { position: absolute; inset: 14px; width: calc(100% - 28px); height: calc(100% - 28px); fill: none; stroke: rgba(233,236,233,.75); stroke-width: 1.5; vector-effect: non-scaling-stroke; }
.rama__vizor path { stroke-dasharray: 1; stroke-dashoffset: 0; vector-effect: non-scaling-stroke; transition: stroke-dashoffset 1s var(--greu) .1s; }
.rama__vertical { position: absolute; top: 8%; bottom: 8%; left: 50%; aspect-ratio: 9 / 16; translate: -50% 0; border-radius: 3px; outline: 1.5px solid rgba(233,236,233,.75); box-shadow: 0 0 0 100vmax rgba(8,9,10,.62); opacity: 0; visibility: hidden; transition: opacity .6s var(--ies), visibility 0s .6s; }
.sala[data-cadru="9:16"] .rama__vertical { opacity: 1; visibility: visible; transition-delay: 0s; }
.sala[data-cadru="9:16"] .rama__vizor { opacity: 0; }
.rama__schema { position: absolute; top: 24px; left: 26px; padding: 5px 11px; border-radius: 99px; background: rgba(13,15,16,.86); box-shadow: inset 0 0 0 1px var(--linie); font: 500 12px/1.3 var(--corp); color: var(--text); }
.rama figcaption { font: 500 15px/1.35 var(--corp); color: var(--text); }
.rama figcaption small { display: block; font: 400 13px/1.5 var(--corp); color: var(--text-2); margin-top: 2px; }
.sala > .link-ora { margin-top: 28px; }
@media (prefers-reduced-motion: no-preference) {
  .js .rama:not(.vazut) .rama__poza { filter: brightness(.22); }
  .js .rama:not(.vazut) .rama__vizor path { stroke-dashoffset: 1; }
  .js .rama:nth-child(2) .rama__poza { transition-delay: .65s; } .js .rama:nth-child(3) .rama__poza { transition-delay: .8s; } .js .rama:nth-child(4) .rama__poza { transition-delay: .95s; }
}
@media (max-width: 760px) {
  .rame { grid-template-columns: none; grid-template-rows: none; grid-auto-flow: column; grid-auto-columns: 78%; overflow-x: auto; scroll-snap-type: x mandatory; margin-inline: calc(var(--margine) * -1); padding: 0 var(--margine) 8px; scroll-padding-inline: var(--margine); scrollbar-width: none; }
  .rame::-webkit-scrollbar { display: none; }
  .rama, .rama--mare, .rama:nth-child(4) { grid-row: auto; grid-column: auto; scroll-snap-align: start; }
  .rama__poza { flex: none; aspect-ratio: 4 / 5; }
}

/* ---------- calendarul: tabla orelor și cererea ---------- */
.calendar__cap p { margin-top: 14px; color: var(--text-2); font-size: 18px; }
.programare { margin-top: 44px; display: grid; grid-template-columns: minmax(0, 1fr) minmax(320px, 380px); gap: 16px; align-items: start; }
.programare__tabla, .programare__cerere { padding: 22px; border-radius: calc(var(--r) + 8px); background: rgba(233,236,233,.03); box-shadow: inset 0 0 0 1px var(--linie); min-width: 0; }
.programare__cerere { position: sticky; top: 92px; display: grid; gap: 18px; }
fieldset { margin: 0; padding: 0; border: 0; min-width: 0; }
legend { padding: 0; font: 600 15px/1.3 var(--corp); color: var(--text); margin-bottom: 12px; }

.alege-act { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; padding: 0; }
.alege-act legend { grid-column: 1 / -1; }
.comut { position: relative; display: flex; align-items: center; gap: 10px; min-height: 56px; padding: 8px 14px; border-radius: 16px; background: var(--antracit); cursor: pointer; transition: background-color .4s var(--ies), box-shadow .4s var(--ies), transform .16s var(--ies); }
.comut:active { transform: scale(.98); }
.comut input { position: absolute; opacity: 0; width: 1px; height: 1px; pointer-events: none; }
.comut span { font: 500 15px/1.2 var(--corp); color: var(--text-2); }
.comut small { display: block; font: 400 12px/1.4 var(--mono); color: var(--text-2); margin-top: 2px; }
.comut:has(input:checked) { background: var(--antracit-2); box-shadow: inset 0 0 0 1px rgba(242,196,142,.35), inset 0 1px 0 rgba(255,255,255,.06); }
.comut:has(input:checked) span { color: var(--text); }
.comut:has(input:focus-visible) { outline: 2px solid var(--lumina); outline-offset: 2px; }
@media (hover: hover) { .comut:hover { background: var(--antracit-2); } }

.tabla { margin-top: 22px; }
.tabla__nav { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.tabla__sapt { font: 500 15px/1.2 var(--mono); }
.tabla__sag { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 50%; border: 0; background: var(--antracit); color: var(--text); cursor: pointer; transition: background-color .3s, transform .16s var(--ies); }
.tabla__sag:active { transform: scale(.94); }
.tabla__sag:disabled { opacity: .35; cursor: default; }
@media (hover: hover) { .tabla__sag:not(:disabled):hover { background: var(--antracit-2); } }
/* consola: ora scrisă o dată, în stânga; celulele sunt locuri de lumină fără text (starea e în aria-label) */
.tabla__zile, .tabla__grila { display: grid; grid-template-columns: 50px repeat(7, minmax(0, 1fr)); gap: 5px; }
.tabla__ore { display: grid; grid-auto-rows: 44px; gap: 5px; }
.tabla__ore span { align-self: center; justify-self: end; padding-right: 8px; font: 400 12px/1 var(--mono); color: var(--text-2); }
.tabla__zile { margin-top: 14px; }
.zi { position: relative; min-height: 52px; display: grid; place-content: center; gap: 2px; border: 0; border-radius: 12px; background: transparent; color: var(--text); font: 600 14px/1.2 var(--corp); cursor: pointer; transition: background-color .3s var(--ies); }
.zi small { font: 400 12px/1 var(--mono); color: var(--text-2); }
.tabla__grila { margin-top: 6px; }
.zcol { display: grid; grid-auto-rows: 44px; gap: 5px; }
.ora {
  position: relative; min-height: 0; display: grid; place-items: center; padding: 0; border: 0; border-radius: 9px; background: #121415; color: var(--text);
  box-shadow: inset 0 0 0 1px rgba(233,236,233,.07); font: 500 12px/1.15 var(--mono); cursor: pointer;
  transition: background-color .45s var(--greu), color .45s var(--greu), box-shadow .45s var(--greu), transform .16s var(--ies);
}
.ora .o, .ora .s { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.loc { width: 12px; height: 12px; border-radius: 50%; background: #2c3133; box-shadow: inset 0 0 0 1px rgba(255,255,255,.07); transition: background-color .45s var(--greu), box-shadow .45s var(--greu); }
.ora .s { font-family: var(--corp); font-size: 12px; color: var(--text-2); }
.ora .s:empty { display: none; }
.ora:active { transform: scale(.96); }
@media (hover: hover) { .ora.st-liber:not(.aleasa):hover .loc, .ora.st-cerut:not(.aleasa):hover .loc { background: color-mix(in srgb, var(--lum) 55%, #2c3133); } .ora.st-liber:not(.aleasa):hover { background: #181b1d; } }
/* cerut: hașurat ocru, se poate cere în continuare */
.ora.st-cerut { background: repeating-linear-gradient(135deg, rgba(242,196,142,.26) 0 2px, transparent 2px 7px), #121415; box-shadow: inset 0 0 0 1px rgba(242,196,142,.42); }
.ora.st-cerut .loc { background: transparent; box-shadow: none; }
/* ocupat: plin */
.ora.st-ocupat { background: #39433f; box-shadow: none; color: #b9c2be; cursor: not-allowed; }
.ora.st-ocupat .loc, .ora.st-trecut .loc { opacity: 0; }
.ora.st-ocupat .o { text-decoration: line-through; }
.ora.st-trecut { background: transparent; color: #7b8481; cursor: default; box-shadow: inset 0 0 0 1px rgba(233,236,233,.05); }
/* al tău: aprins în lumina activității cerute (pe acest dispozitiv) */
.ora.st-al-tau { --l: var(--lumina); cursor: default; background: color-mix(in srgb, var(--l) 26%, #121415); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--l) 70%, transparent); }
.ora.st-al-tau[data-act="live"] { --l: #efe3cf; }
.ora.st-al-tau[data-act="clip"] { --l: #c9d6ee; }
.ora.st-al-tau[data-act="curs"] { --l: #f5ad62; }
.ora.st-al-tau .loc { background: radial-gradient(circle, #fffaf1 0 30%, var(--l) 45%); box-shadow: none; }
.ora.st-al-tau .s { color: var(--text); }
/* aleasă acum: aprinsă în lumina activității alese */
.ora.aleasa { z-index: 1; background: var(--lum); color: var(--pe-lumina); box-shadow: inset 0 0 0 1px rgba(255,255,255,.4), 0 10px 20px -12px rgba(0,0,0,.9); }
.ora.aleasa .loc { background: radial-gradient(circle, #fffdf8 0 40%, rgba(255,250,241,.55) 60%, rgba(255,250,241,0) 72%); width: 20px; height: 20px; box-shadow: none; }
.ora.aleasa .s { color: var(--pe-lumina); }
.tabla__ajutor, .tabla__lipsa { margin-top: 10px; color: var(--text-2); font-size: 15px; }
.tabla__lipsa { color: var(--gresit); font-weight: 500; }
.continua { margin-top: 12px; display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 56px; padding: 10px 16px; border-radius: var(--r); background: var(--lum); color: var(--pe-lumina); font: 500 15px/1.3 var(--corp); text-decoration: none; transition: transform .16s var(--ies); }
.continua:active { transform: scale(.98); }
.continua__da { display: inline-flex; align-items: center; gap: 6px; font-weight: 600; white-space: nowrap; }
@media (min-width: 961px) { .continua { display: none !important; } }
.legenda { list-style: none; margin: 14px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px 18px; font-size: 13px; color: var(--text-2); }
.legenda li { display: inline-flex; align-items: center; gap: 8px; }
.st { width: 22px; height: 14px; border-radius: 5px; }
.st--liber { background: radial-gradient(circle, #3a4042 0 3.5px, transparent 4px), #121415; box-shadow: inset 0 0 0 1px rgba(233,236,233,.12); }
.st--cerut { background: repeating-linear-gradient(135deg, rgba(242,196,142,.4) 0 2px, transparent 2px 6px); box-shadow: inset 0 0 0 1px rgba(242,196,142,.6); }
.st--ocupat { background: #39433f; }
.st--al-tau { background: radial-gradient(circle, #fffaf1 0 3px, transparent 3.5px), var(--lum); }
.programare__nota { margin-top: 16px; font: 400 13px/1.5 var(--corp); color: var(--text-2); max-width: 70ch; }

.clasic { margin-top: 22px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.clasic legend { grid-column: 1 / -1; }

.rezumat { padding: 16px 18px; border-radius: var(--r); background: var(--antracit); }
.rezumat__titlu { font: 600 17px/1.2 var(--display); }
.rezumat dl { margin-top: 10px; display: grid; gap: 6px; }
.rezumat dl div { display: grid; grid-template-columns: 90px minmax(0, 1fr); gap: 10px; font-size: 15px; }
.rezumat dt { color: var(--text-2); }
.rezumat dd b { font: 500 14px/1.4 var(--mono); color: var(--lumina); }
.rezumat dd span { display: block; color: var(--text-2); font-size: 13px; }
.rezumat dd span:empty { display: none; }
.rezumat__lipsa { color: var(--gresit); font-size: 15px; }

.campuri { display: grid; gap: 14px; }
.camp { display: grid; gap: 6px; }
.camp label { font-size: 15px; font-weight: 500; }
.camp label span { color: var(--text-2); font-weight: 400; }
.camp small { color: var(--text-2); font-size: 13px; }
input[type="text"], input[type="email"], input[type="tel"], input[type="date"], select, textarea {
  width: 100%; min-height: 48px; padding: 12px 14px; border-radius: 12px; border: 0; background: #0f1112; color: var(--text);
  font: 400 16px/1.4 var(--corp); box-shadow: inset 0 0 0 1px var(--linie-2); transition: box-shadow .25s var(--ies); color-scheme: dark;
}
textarea { resize: vertical; min-height: 84px; }
input:focus-visible, select:focus-visible, textarea:focus-visible { outline: none; box-shadow: inset 0 0 0 2px var(--lumina); }
input:user-invalid, textarea:user-invalid { box-shadow: inset 0 0 0 2px var(--gresit); }
.capcana { display: none; }
.bifa { display: grid; grid-template-columns: 24px minmax(0, 1fr); gap: 12px; align-items: start; font-size: 15px; color: var(--text-2); cursor: pointer; }
.bifa input { appearance: none; -webkit-appearance: none; width: 44px; height: 44px; margin: -10px -10px -10px -10px; cursor: pointer; border-radius: 10px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='1' y='1' width='22' height='22' rx='6' fill='%230f1112' stroke='%23a8b2ae' stroke-width='1.5'/%3E%3C/svg%3E") center / 24px 24px no-repeat; }
.bifa input:checked { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='1' y='1' width='22' height='22' rx='6' fill='%23f2c48e'/%3E%3Cpath d='M6.5 12.5l3.5 3.5 7.5-8' fill='none' stroke='%231a1208' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); }
.bifa input:focus-visible { outline: 2px solid var(--lumina); outline-offset: -8px; }
.bifa input:user-invalid { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='1' y='1' width='22' height='22' rx='6' fill='%230f1112' stroke='%23ff9f8c' stroke-width='2'/%3E%3C/svg%3E"); }
.bifa a { color: var(--text); }
.btn--plin { width: 100%; }
.programare__fara { font-size: 14px; color: var(--text-2); }
.programare__fara a { color: var(--text); }

.trimis, .eroare { margin-top: 16px; padding: 22px; border-radius: var(--r); background: var(--antracit); display: grid; gap: 10px; justify-items: start; }
.trimis:target { display: grid !important; }
.trimis__titlu { font: 600 22px/1.2 var(--display); }
.eroare p { color: var(--gresit); }

/* după formular: drumul cererii pe patru indicatoare, apoi întrebările */
.dupa { margin-top: 64px; display: grid; gap: 56px; }
.indicatoare { list-style: none; margin: 28px 0 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; }
.ind { position: relative; display: grid; gap: 6px; align-content: start; }
.ind b { font: 600 17px/1.3 var(--display); margin-top: 14px; }
.ind span { color: var(--text-2); font-size: 15px; max-width: 30ch; }
.led { position: relative; z-index: 1; width: 16px; height: 16px; border-radius: 50%; background: var(--negru); box-shadow: inset 0 0 0 1.5px #56615d; transition: background-color .6s var(--greu), box-shadow .6s var(--greu); }
.ind:not(:last-child)::after { content: ""; position: absolute; left: 24px; right: -16px; top: 7px; height: 0; border-top: 1.5px dotted #3d4744; }
.ind--1::before { content: ""; position: absolute; z-index: 1; left: 24px; right: -16px; top: 7px; height: 1.5px; background: var(--lumina); transform-origin: 0 50%; transition: transform 1s linear .7s; }
.ind--1 .led, .ind--2 .led { background: var(--lumina); box-shadow: inset 0 0 0 1px rgba(255,255,255,.3); }
.ind--1 .led { transition-delay: .2s; }
.ind--2 .led { transition-delay: 1.7s; }
.ind--2 b::after { content: "în așteptare"; display: inline-block; margin-left: 10px; padding: 2px 8px; border-radius: 99px; font: 500 12px/1.5 var(--corp); color: var(--lumina); background: rgba(242,196,142,.1); vertical-align: 2px; }
@media (prefers-reduced-motion: no-preference) {
  .js [data-drum]:not(.vazut) .ind--1 .led, .js [data-drum]:not(.vazut) .ind--2 .led { background: var(--negru); box-shadow: inset 0 0 0 1.5px #56615d; }
  .js [data-drum]:not(.vazut) .ind--1::before { transform: scaleX(0); }
  .js [data-drum].vazut .ind--2 .led { animation: standby 2.8s cubic-bezier(.4, 0, .6, 1) 2.6s 4; }
  @keyframes standby { 50% { background: #8a6b49; box-shadow: inset 0 0 0 1px rgba(255,255,255,.3); } }
}
.intrebari { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); gap: 16px 48px; align-items: start; }
.intrebari h3 { grid-row: span 5; }
details { border-radius: var(--r); background: rgba(233,236,233,.03); box-shadow: inset 0 0 0 1px var(--linie); }
summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 56px; padding: 14px 18px; cursor: pointer; font: 500 16px/1.35 var(--corp); list-style: none; }
summary::-webkit-details-marker { display: none; }
summary::after { content: ""; width: 10px; height: 10px; flex: none; border: solid var(--text-2); border-width: 0 1.5px 1.5px 0; rotate: 45deg; translate: 0 -3px; transition: rotate .3s var(--ies), translate .3s var(--ies); }
details[open] summary::after { rotate: 225deg; translate: 0 3px; }
details p { padding: 0 18px 18px; color: var(--text-2); max-width: 62ch; }
@media (max-width: 960px) {
  .programare { grid-template-columns: minmax(0, 1fr); }
  .programare__cerere { position: static; }
  .intrebari { grid-template-columns: minmax(0, 1fr); }
  .intrebari h3 { grid-row: auto; }
}
@media (max-width: 720px) {
  .programare__tabla, .programare__cerere { padding: 14px; }
  .alege-act { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 4px; }
  .comut { min-height: 54px; padding: 6px 4px; flex-direction: column; justify-content: center; gap: 5px; border-radius: 14px; text-align: center; }
  .comut span { font-size: 13px; line-height: 1.15; }
  .comut small { display: none; }
  .tabla__zile { grid-template-columns: repeat(7, 64px); overflow-x: auto; scroll-snap-type: x proximity; padding-bottom: 4px; scrollbar-width: none; }
  .tabla__zile::-webkit-scrollbar { display: none; }
  .zi { scroll-snap-align: start; background: var(--antracit); }
  .zi[aria-pressed="true"] { background: var(--text); color: var(--negru); }
  .zi[aria-pressed="true"] small { color: #3a4441; }
  .tabla__grila { grid-template-columns: minmax(0, 1fr); margin-top: 10px; }
  .tabla__colt, .tabla__ore { display: none; }
  .zcol { display: none; grid-auto-rows: auto; }
  .zcol.activa { display: grid; }
  .ora { min-height: 52px; display: flex; justify-content: flex-start; align-items: center; gap: 14px; padding: 0 16px; border-radius: 12px; font-size: 14px; background: var(--antracit); }
  .ora .o, .ora .s { position: static; width: auto; height: auto; overflow: visible; clip-path: none; white-space: normal; }
  .ora .s { margin-left: auto; }
  .ora.st-ocupat { background: #2b3230; color: #a3ada9; }
  .ora .s:empty { display: inline; }
  .ora.st-liber .s:empty::after { content: "liber"; }
  .ora .s { font-size: 13px; }
  .clasic { grid-template-columns: minmax(0, 1fr); }
  .indicatoare { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .ind { grid-template-columns: 16px minmax(0, 1fr); column-gap: 16px; padding-bottom: 26px; }
  .ind b { margin-top: -3px; grid-column: 2; }
  .ind span { grid-column: 2; }
  .led { grid-row: span 2; }
  .ind:not(:last-child)::after { left: 7px; right: auto; top: 22px; bottom: 2px; height: auto; border-top: 0; border-left: 1.5px dotted #3d4744; }
  .ind--1::before { left: 7px; right: auto; top: 22px; bottom: 2px; width: 1.5px; height: auto; transform-origin: 50% 0; }
  .js [data-drum]:not(.vazut) .ind--1::before { transform: scaleY(0); }
}
@media (min-width: 721px) { .zi[aria-pressed="true"] { background: var(--antracit); } }

/* cum ajungi: linia cererii coboară la ușă, lampa se aprinde */
.drum { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: 24px 64px; align-items: center; }
.drum__adresa { margin-top: 18px; font: 400 18px/1.5 var(--corp); color: var(--text-2); }
.drum__adresa span { font-family: var(--mono); color: var(--lumina); font-size: 15px; }
.drum__ind { margin-top: 10px; color: var(--text-2); max-width: 46ch; }
.drum__btn { margin-top: 28px; display: flex; gap: 12px; flex-wrap: wrap; }
.drum__nota { margin-top: 14px; max-width: 50ch; color: var(--text-2); font-size: 14px; }
.drum__ora { grid-column: 1; }
.usa { grid-row: span 2; }
.usa__svg { display: block; width: 100%; height: auto; max-height: 420px; overflow: visible; }
.usa__perete { stroke: #2b3230; stroke-width: 2; fill: none; }
.usa__prag { stroke: #4a5452; stroke-width: 3; stroke-linecap: round; }
.usa__fir { fill: none; stroke: var(--lumina); stroke-width: 2; stroke-linejoin: round; stroke-dasharray: 1; stroke-dashoffset: 0; transition: stroke-dashoffset 1.6s linear .2s; }
.usa__toc { fill: none; stroke: #56615d; stroke-width: 2; }
.usa__foaie { fill: #171b1b; stroke: #2f3735; stroke-width: 1.5; }
.usa__clanta { fill: #8a948f; }
.usa__lampa-corp { fill: #2c3233; }
.usa__bec { fill: var(--lumina); transition: fill .9s var(--greu) 1.8s; }
.usa__con { fill: rgba(242,196,142,.12); transition: opacity 1.2s cubic-bezier(.4, 0, .2, 1) 2s; }
@media (prefers-reduced-motion: no-preference) {
  .js .usa:not(.vazut) .usa__fir { stroke-dashoffset: 1; }
  .js .usa:not(.vazut) .usa__bec { fill: #3b423f; }
  .js .usa:not(.vazut) .usa__con { opacity: 0; }
}
@media (max-width: 760px) {
  .drum { grid-template-columns: minmax(0, 1fr); }
  .usa { grid-row: auto; order: -1; margin-bottom: -12px; }
  .usa__svg { max-height: 170px; }
  .drum__btn .btn { width: 100%; }
}

/* păreri, jos de tot: lampa-fantomă de pe scena goală, până vin cele reale */
/* păreri: scena goală (lampa-fantomă pe podea și lumina ei) așteaptă primele păreri */
.pareri { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: 32px 64px; align-items: center; padding-bottom: clamp(96px, 12vw, 160px) !important; }
.pareri__txt { grid-column: 1; grid-row: 1; }
.pareri .fantoma { grid-column: 2; grid-row: 1; }
.pareri__txt p { margin-top: 16px; max-width: 46ch; color: var(--text-2); font-size: 18px; }
.pareri__txt .link-ora { margin-top: 18px; }
.fantoma__svg { display: block; width: 100%; height: auto; overflow: visible; -webkit-mask-image: linear-gradient(90deg, transparent, #000 16%, #000 84%, transparent); mask-image: linear-gradient(90deg, transparent, #000 16%, #000 84%, transparent); }
.fantoma__perete { stroke: #2a3032; stroke-width: 1.5; fill: none; }
.fantoma__umbra { fill: rgba(0,0,0,.35); }
.fantoma__stativ { stroke: #56615d; stroke-width: 4; stroke-linecap: round; fill: none; }
.fantoma__cusca { stroke: #8a948f; stroke-width: 2; fill: none; }
.fantoma__cablu { stroke: #2f3638; stroke-width: 2.5; stroke-linecap: round; fill: none; }
.fantoma__bec { fill: #ffe2bc; }
.fantoma__aura, .fantoma__pata, .fantoma__bec { transition: opacity 1.6s cubic-bezier(.4, 0, .2, 1) .4s; }
@media (prefers-reduced-motion: no-preference) { .js .fantoma:not(.vazut) .fantoma__aura, .js .fantoma:not(.vazut) .fantoma__pata, .js .fantoma:not(.vazut) .fantoma__bec { opacity: .15; } }
@media (max-width: 760px) {
  .pareri { grid-template-columns: minmax(0, 1fr); gap: 8px; }
  .pareri .fantoma { grid-column: 1; grid-row: 1; width: min(100%, 320px); }
  .pareri__txt { grid-row: 2; }
}

/* subsol */
.subsol { border-top: 1px solid var(--linie); padding: 48px var(--margine) 36px; display: grid; grid-template-columns: minmax(0, 1.4fr) repeat(3, minmax(0, 1fr)); gap: 28px 40px; align-items: start; max-width: 1320px; margin: 0 auto; font-size: 14px; color: var(--text-2); }
.marca--mare { font-size: 22px; color: var(--text); min-height: 0; }
.subsol__marca p + p { margin-top: 10px; max-width: 32ch; }
.subsol__t { color: var(--text); font-weight: 600; margin-bottom: 6px; }
.subsol__col { display: flex; flex-direction: column; align-items: flex-start; }
.subsol__col a { text-decoration: none; padding: 5px 0; min-height: 44px; display: inline-flex; align-items: center; }
.subsol__col a:hover { color: var(--text); text-decoration: underline; }
.subsol__firma { grid-column: 1 / -1; padding-top: 20px; border-top: 1px solid var(--linie); font-size: 13px; }
@media (max-width: 900px) { .subsol { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } .subsol__marca { grid-column: 1 / -1; } }
@media (max-width: 480px) { .subsol { grid-template-columns: minmax(0, 1fr); gap: 22px; } }

details:not([open]) > :not(summary) { display: none; }