/* ══════════════════════════════════════════════════════════
   Stiluri pentru paginile interioare.
   Sistemul de bază (culori, tipografie, nav, footer) e în style.css.
   ══════════════════════════════════════════════════════════ */

/* ── punți între pagini ──────────────────────────────── */
.cross{padding:var(--sec) 0}
.cross-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));gap:1.2rem}
.cross-card{
  display:flex;flex-direction:column;gap:.5rem;text-decoration:none;
  padding:2.1rem 1.9rem;border-radius:3px;
  background:linear-gradient(160deg,hsl(24 22% 10% / .82),hsl(26 26% 6% / .82));
  border:1px solid hsl(34 26% 46% / .16);
  transition:.55s var(--e);
}
.cross-card:hover{border-color:hsl(34 60% 55% / .42);transform:translateY(-6px);
  background:linear-gradient(160deg,hsl(28 26% 13% / .9),hsl(26 26% 7% / .9))}
.cross-k{font-size:.68rem;letter-spacing:.22em;text-transform:uppercase;color:var(--ember-soft)}
.cross-t{font-family:var(--f-display);font-size:1.65rem;line-height:1.1;font-variation-settings:'SOFT' 80,'WONK' 1;letter-spacing:-.02em}
.cross-d{color:var(--cream-2);font-size:.92rem;line-height:1.6}

/* ── butoane suplimentare ────────────────────────────── */
.btn-sm{padding:.62rem 1.15rem;font-size:.78rem}
.btn-soon{
  border:1px dashed hsl(34 30% 46% / .45);color:var(--cream-3);cursor:default;
  background:none;
}

/* ══════════════════════ GALERIE ══════════════════════ */
.gal-intro{
  padding:calc(var(--sec) + 3.5rem) 0 var(--sec);
  background:linear-gradient(180deg,var(--ink) 0%,var(--ink) 78%,transparent 100%);
}
.gal-intro h1{font-size:clamp(2.4rem,6vw,4.6rem);max-width:16ch}
.gal-intro .sec-lead{max-width:46ch}

.gal-stage{
  position:relative;height:100svh;
  cursor:grab;touch-action:none;
  display:flex;flex-direction:column;justify-content:flex-end;align-items:center;
  padding-bottom:clamp(2rem,6vh,4rem);
}
.gal-stage.grabbing{cursor:grabbing}
.gal-stage.pointing{cursor:pointer}
.gal-hint{
  position:absolute;left:50%;bottom:clamp(2rem,6vh,4rem);transform:translateX(-50%);
  margin:0;font-size:.66rem;letter-spacing:.3em;text-transform:uppercase;color:var(--cream-3);
  transition:opacity .8s var(--e),transform .8s var(--e);pointer-events:none;
}
.gal-hint.gone{opacity:0;transform:translate(-50%,10px)}
.gal-hint-in{
  display:inline-block;padding:.6rem 1.3rem;border-radius:100px;
  background:hsl(26 40% 4% / .6);border:1px solid hsl(34 40% 50% / .24);
  backdrop-filter:blur(8px);
  animation:hintPulse 3.4s var(--e-soft) infinite;
}
@keyframes hintPulse{0%,100%{opacity:.6}50%{opacity:1}}
.gal-cap{
  position:absolute;left:50%;bottom:clamp(2rem,6vh,4rem);transform:translate(-50%,8px);
  margin:0;max-width:min(88vw,40ch);text-align:center;pointer-events:none;
  font-family:var(--f-display);font-style:italic;font-size:clamp(1rem,2.2vw,1.35rem);
  font-variation-settings:'SOFT' 100,'WONK' 1;
  color:var(--cream);text-shadow:0 2px 24px hsl(26 40% 2% / .95);
  opacity:0;transition:opacity .45s var(--e),transform .45s var(--e);
}
.gal-cap.on{opacity:1;transform:translate(-50%,0)}
body.no-webgl .gal-stage{display:none}

.gal-list{
  padding:var(--sec) 0;
  background:linear-gradient(180deg,transparent 0%,var(--ink) 8%,var(--ink) 100%);
}
.gal-grid{
  columns:4 210px;
  column-gap:clamp(.7rem,1.4vw,1.15rem);
}
.gal-cell{
  display:block;width:100%;break-inside:avoid;
  margin:0 0 clamp(.7rem,1.4vw,1.15rem);
  position:relative;border:0;padding:0;background:none;cursor:pointer;
  border-radius:2px;overflow:hidden;
  box-shadow:0 16px 34px -20px hsl(26 40% 2% / .95);
  transition:transform .6s var(--e),box-shadow .6s var(--e);
}
.gal-cell img{
  display:block;width:100%;height:auto;
  filter:saturate(.86) contrast(1.04) brightness(.8);
  transition:filter .7s var(--e-soft),transform 1.1s var(--e);
}
.gal-cell::after{content:'';position:absolute;inset:0;
  background:linear-gradient(180deg,transparent 42%,hsl(26 42% 2% / .92));
  opacity:0;transition:opacity .5s var(--e-soft)}
.gal-cell-cap{
  position:absolute;left:0;right:0;bottom:0;z-index:2;padding:.9rem;
  font-size:.76rem;line-height:1.4;color:var(--cream);text-align:left;
  opacity:0;transform:translateY(8px);
  transition:opacity .5s var(--e),transform .5s var(--e);
}
.gal-cell:hover,.gal-cell:focus-visible{transform:translateY(-5px);outline:none;
  box-shadow:0 34px 56px -24px hsl(26 40% 1% / .95),0 0 0 1px hsl(34 70% 58% / .38)}
.gal-cell:hover img,.gal-cell:focus-visible img{filter:saturate(1.04) brightness(1);transform:scale(1.04)}
.gal-cell:hover::after,.gal-cell:focus-visible::after{opacity:1}
.gal-cell:hover .gal-cell-cap,.gal-cell:focus-visible .gal-cell-cap{opacity:1;transform:none}

/* ── lightbox ────────────────────────────────────────── */
.lb{position:fixed;inset:0;z-index:150;display:grid;place-items:center;padding:clamp(1rem,4vw,3rem)}
.lb[hidden]{display:none}
.lb-scrim{position:absolute;inset:0;background:hsl(26 40% 2% / .94);backdrop-filter:blur(16px);animation:fadeIn .45s var(--e-soft)}
.lb-fig{position:relative;margin:0;max-width:min(100%,1200px);display:flex;flex-direction:column;gap:1rem;align-items:center;animation:cardIn .7s var(--e) both}
.lb-fig img{max-width:100%;max-height:78svh;width:auto;object-fit:contain;border-radius:2px;
  box-shadow:0 50px 100px -40px hsl(26 40% 0% / .95)}
.lb-fig figcaption{display:flex;gap:1.2rem;align-items:baseline;color:var(--cream-2);font-size:.9rem}
.lb-fig figcaption b{font-weight:500;color:var(--cream-3);font-size:.76rem;letter-spacing:.14em;font-variant-numeric:tabular-nums}
.lb-x,.lb-prev,.lb-next{
  position:absolute;z-index:5;background:hsl(26 40% 4% / .66);color:var(--cream);
  border:1px solid hsl(34 30% 46% / .3);border-radius:50%;cursor:pointer;
  transition:.4s var(--e-soft);backdrop-filter:blur(8px);line-height:1;
}
.lb-x{top:clamp(1rem,3vw,2rem);right:clamp(1rem,3vw,2rem);width:42px;height:42px;font-size:1.5rem}
.lb-prev,.lb-next{top:50%;width:48px;height:48px;font-size:1.7rem;margin-top:-24px}
.lb-prev{left:clamp(.6rem,2vw,2rem)}
.lb-next{right:clamp(.6rem,2vw,2rem)}
.lb-x:hover,.lb-prev:hover,.lb-next:hover{background:var(--ember);color:var(--ink);border-color:var(--ember)}
.lb-x:hover{transform:rotate(90deg)}

/* ══════════════════════ SUFLETE ══════════════════════ */
.soul-stage{
  position:relative;height:100svh;overflow:hidden;
  display:grid;align-items:end;
}
.soul-photo{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  filter:saturate(.92) contrast(1.03);
  animation:fadeIn .9s var(--e-soft);
}
body.soul-gl .soul-photo{opacity:0}
.soul-shade{
  position:absolute;inset:0;pointer-events:none;
  background:
    linear-gradient(90deg,hsl(26 34% 3% / .93) 0%,hsl(26 34% 3% / .6) 34%,transparent 62%),
    linear-gradient(0deg,hsl(26 34% 3% / .92) 0%,transparent 46%);
}
.soul-text{
  position:relative;z-index:3;
  padding:0 clamp(1.25rem,5vw,5rem) clamp(3.5rem,9vh,6rem);
  max-width:min(92vw,44ch);
}
.soul-text.swap>*{animation:soulIn .8s var(--e) both}
.soul-text.swap>*:nth-child(2){animation-delay:.05s}
.soul-text.swap>*:nth-child(3){animation-delay:.1s}
.soul-text.swap>*:nth-child(4){animation-delay:.14s}
.soul-text.swap>*:nth-child(5){animation-delay:.18s}
.soul-text.swap>*:nth-child(6){animation-delay:.22s}
.soul-text.swap>*:nth-child(7){animation-delay:.26s}
@keyframes soulIn{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.soul-num{margin:0 0 1rem;font-size:.7rem;letter-spacing:.24em;color:var(--cream-2);font-variant-numeric:tabular-nums}
.soul-title{margin:0 0 .3rem;font-size:.74rem;letter-spacing:.2em;text-transform:uppercase;color:var(--ember)}
.soul-name{font-size:clamp(2.6rem,8vw,5.4rem);line-height:.95;letter-spacing:-.035em;margin:0 0 .9rem;
  text-shadow:0 4px 40px hsl(26 34% 2% / .8)}
.soul-status{
  display:inline-block;margin:0 0 1rem;padding:.3rem .75rem;border-radius:100px;
  font-size:.62rem;letter-spacing:.16em;text-transform:uppercase;font-weight:700;
  color:var(--ember);border:1px solid hsl(34 60% 55% / .45);background:hsl(34 60% 40% / .14);
}
.soul-status:empty{display:none}
.soul-traits{margin:0 0 1rem;font-size:.85rem;letter-spacing:.05em;color:var(--cream-2)}
.soul-rel{margin:0 0 .9rem;font-style:italic;color:var(--cream-3);font-size:.92rem}
.soul-rel:empty{display:none}
.soul-line{margin:0 0 1.8rem;color:var(--cream);line-height:1.7;max-width:40ch}
.soul-nav{display:flex;gap:.6rem}
.soul-nav button{
  width:48px;height:48px;border-radius:50%;cursor:pointer;font-size:1.1rem;
  background:hsl(26 40% 4% / .5);border:1px solid hsl(34 30% 46% / .32);color:var(--cream);
  transition:.4s var(--e-soft);backdrop-filter:blur(8px);
}
.soul-nav button:hover{background:var(--ember);color:var(--ink);border-color:var(--ember);transform:translateY(-2px)}

.soul-index{
  position:absolute;z-index:3;right:clamp(.75rem,2vw,1.75rem);top:50%;transform:translateY(-50%);
  display:flex;flex-direction:column;gap:.4rem;
  max-height:min(74svh,640px);overflow-y:auto;padding:.4rem;
  -webkit-mask-image:linear-gradient(180deg,transparent,#000 6%,#000 94%,transparent);
  mask-image:linear-gradient(180deg,transparent,#000 6%,#000 94%,transparent);
  scrollbar-width:thin;scrollbar-color:hsl(34 40% 45% / .4) transparent;
}
.soul-index::-webkit-scrollbar{width:4px}
.soul-index::-webkit-scrollbar-thumb{background:hsl(34 40% 45% / .4);border-radius:4px}
.soul-tab{
  flex:0 0 auto;
  display:flex;align-items:center;gap:.6rem;cursor:pointer;
  padding:.28rem .7rem .28rem .28rem;border-radius:100px;
  background:hsl(26 40% 4% / .52);border:1px solid transparent;color:var(--cream-2);
  font:inherit;font-size:.78rem;text-align:left;white-space:nowrap;
  backdrop-filter:blur(8px);transition:.4s var(--e-soft);
}
.soul-tab img{width:26px;height:26px;border-radius:50%;object-fit:cover;filter:saturate(.7) brightness(.85);transition:.4s}
.soul-tab:hover{color:var(--cream);border-color:hsl(34 40% 50% / .3)}
.soul-tab[aria-current="true"]{color:var(--ink);background:var(--ember);border-color:var(--ember);font-weight:600}
.soul-tab[aria-current="true"] img{filter:none}

.soul-after{padding:var(--sec) 0;text-align:center}
.soul-after h2{font-size:clamp(1.9rem,4.6vw,3.2rem)}
.soul-after .section-label{justify-content:center}
.soul-after .sec-lead{margin-inline:auto;max-width:52ch}
.soul-cta{display:flex;gap:.85rem;justify-content:center;flex-wrap:wrap;margin-top:2.4rem}

/* ══════════════════════ DONEAZĂ ══════════════════════ */
.don-head{padding:calc(var(--sec) + 3.5rem) 0 var(--sec);text-align:center}
.don-head .section-label{justify-content:center}
.don-head h1{font-size:clamp(2.6rem,6.4vw,4.8rem)}
.don-head .sec-lead{margin:1.8rem auto 2.6rem;max-width:50ch}
.don-what{padding-bottom:var(--sec)}
.don-what .sec-head{margin-bottom:clamp(2.5rem,5vw,4rem)}

.don-proof{padding:var(--sec) 0}
.don-proof-grid{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1fr);gap:clamp(2.5rem,6vw,5.5rem);align-items:center}
.don-photo{margin:0;position:relative}
.don-photo img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:2px;filter:saturate(.94) contrast(1.03);
  box-shadow:0 40px 84px -32px hsl(26 40% 1% / .95),0 0 0 1px hsl(34 30% 40% / .18)}
.don-photo figcaption{margin-top:1rem;font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;color:var(--cream-3)}
.don-story h2{font-size:clamp(1.8rem,4vw,3rem);margin-bottom:1.7rem}
.don-story p{color:var(--cream-2);margin:0 0 1.3rem;max-width:52ch}

/* nume propriu: „.don-alt" e deja un paragraf pe prima pagină (style.css) */
.don-more{padding:var(--sec) 0;text-align:center}
.alt-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:1.2rem;margin-bottom:clamp(3rem,6vw,4.5rem)}
.alt-card{
  display:flex;flex-direction:column;gap:.6rem;text-align:left;text-decoration:none;
  padding:1.9rem 1.6rem;border-radius:3px;
  background:linear-gradient(160deg,hsl(24 22% 10% / .8),hsl(26 26% 6% / .8));
  border:1px solid hsl(34 26% 46% / .15);transition:.55s var(--e);
}
.alt-card:hover{border-color:hsl(34 60% 55% / .4);transform:translateY(-6px)}
.alt-card b{font-family:var(--f-display);font-size:1.3rem;font-weight:400;font-variation-settings:'SOFT' 80,'WONK' 1}
.alt-card span{color:var(--cream-2);font-size:.9rem;line-height:1.6}
.don-thanks{margin-top:2rem;color:var(--cream-3);font-size:.9rem;max-width:44ch;margin-inline:auto}
.don-write{margin:1.4rem auto 0;color:var(--cream-2);font-size:.92rem;line-height:1.7;max-width:52ch}

/* ── responsive ──────────────────────────────────────── */
@media (max-width:960px){
  .don-proof-grid{grid-template-columns:1fr}
  .don-photo{max-width:460px}
}
@media (max-width:760px){
  .soul-stage{align-items:end}
  .soul-shade{background:linear-gradient(0deg,hsl(26 34% 3% / .96) 0%,hsl(26 34% 3% / .72) 30%,transparent 62%)}
  .soul-text{max-width:none;padding-bottom:calc(3.5rem + 62px)}
  .soul-index::-webkit-scrollbar{display:none}
  .soul-index{
    position:absolute;right:0;left:0;top:auto;bottom:0;transform:none;
    flex-direction:row;max-height:none;overflow-x:auto;overflow-y:hidden;
    padding:.65rem clamp(1.25rem,5vw,2rem);gap:.45rem;
    background:linear-gradient(0deg,hsl(26 34% 3% / .95) 40%,transparent);
    -webkit-mask-image:none;mask-image:none;
    scrollbar-width:none;
  }
  .soul-name{font-size:clamp(2.4rem,11vw,3.6rem)}
  .gal-grid{columns:2 140px}
  .lb-prev,.lb-next{width:40px;height:40px;font-size:1.4rem}
}
@media (prefers-reduced-motion:reduce){
  .gal-hint-in{animation:none}
  .soul-text.swap>*{animation:none}
}
