/* Paginile MEMOIRES si LEGAL: acelasi limbaj ca site-ul (negru, o singura culoare pe pagina, Helvetica + monospace mic),
   dar text real, citibil. Particulele stau pe margini, intr-un canvas fix in spate. */
:root{--acc:#ff1a0d;--ink:#efe8e3;--soft:color-mix(in srgb,var(--ink) 72%,transparent);--line:color-mix(in srgb,var(--acc) 32%,transparent)}
*{box-sizing:border-box}
html{background:#000;color:var(--ink);-webkit-text-size-adjust:100%}
body{margin:0;font:400 17px/1.7 Helvetica,Arial,sans-serif;min-height:100vh}
.margini{position:fixed;inset:0;z-index:0;pointer-events:none}
.sus,.continut,.jos{position:relative;z-index:1}
a{color:inherit}
.mono{font:500 12px/1.4 ui-monospace,Menlo,monospace;letter-spacing:.24em;text-transform:uppercase}

/* sus: semnul casei stanga, legaturile dreapta */
.sus{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:26px 40px}
.sus a{color:var(--acc);text-decoration:none}
.casa{font:700 15px/1 Helvetica,Arial,sans-serif;letter-spacing:.1em;text-transform:uppercase}
.nav{display:flex;gap:26px}
.nav a{font:500 12px/1 ui-monospace,Menlo,monospace;letter-spacing:.24em;text-transform:uppercase;opacity:.75}
.nav a[aria-current],.nav a:hover{opacity:1}
.nav a:focus-visible,.casa:focus-visible,.continut a:focus-visible,.jos a:focus-visible{outline:1px solid var(--acc);outline-offset:4px}

/* coloana de citit */
.continut{max-width:720px;margin:0 auto;padding:56px 24px 40px}
.fir{color:var(--soft);margin:0 0 28px}
.fir a{text-decoration:none}
.fir span{white-space:nowrap}
.fir a:hover{color:var(--acc)}
.kicker{color:var(--acc);margin:0 0 18px}
h1{font:400 clamp(34px,5.4vw,56px)/1.08 Helvetica,Arial,sans-serif;letter-spacing:-.01em;margin:0 0 22px;text-wrap:balance}
.dek{font-size:20px;line-height:1.55;color:var(--soft);margin:0 0 36px;text-wrap:pretty}
.poza{margin:0 0 40px;border:1px solid var(--line)}
.poza img{display:block;width:100%;height:auto;aspect-ratio:1000/1241;object-fit:cover}
.scurt{border:1px solid var(--line);padding:22px 24px;margin:0 0 44px}
.scurt .mono{color:var(--acc);margin:0 0 10px}
.scurt p{margin:0}
h2{font:400 26px/1.25 Helvetica,Arial,sans-serif;color:var(--acc);margin:52px 0 14px;text-wrap:balance}
.continut p{margin:0 0 18px;text-wrap:pretty}
.final{font:400 22px/1.45 Helvetica,Arial,sans-serif;color:var(--acc);border-top:1px solid var(--line);padding-top:28px;margin:52px 0 0;text-wrap:balance}
.cta{display:inline-block;margin:28px 0 0;padding:14px 22px;border:1px solid var(--acc);color:var(--acc);text-decoration:none;white-space:nowrap;font:500 12px/1 ui-monospace,Menlo,monospace;letter-spacing:.24em;text-transform:uppercase}
.cta:hover{background:var(--acc);color:#000}

/* lista de articole (hub) si „mai departe” */
.grup{margin:56px 0 0}
.grup>.mono{color:var(--acc);margin:0 0 6px}
.lista{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.lista li{border-bottom:1px solid var(--line)}
.lista a{display:block;padding:22px 0;text-decoration:none}
.lista .mono{color:var(--acc);display:block;margin:0 0 8px;font-size:11px}
.lista strong{display:block;font:400 24px/1.25 Helvetica,Arial,sans-serif;margin:0 0 8px;text-wrap:balance}
.lista span.d{display:block;color:var(--soft);font-size:15px;line-height:1.6}
.lista a:hover strong{color:var(--acc)}

/* legal */
.legal h2{font-size:22px}
.legal p:not(.mono):not(.dek),.legal li{font-size:16px}

.jos{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px 24px;padding:56px 40px 84px;color:var(--acc)}
.jos a{text-decoration:none;opacity:.8}
.jos a:hover{opacity:1}

@media (max-width:640px){
  body{font-size:16px}
  .sus{padding:20px 20px;flex-wrap:wrap}
  .nav{gap:18px}
  .continut{padding:36px 20px 28px}
  .dek{font-size:18px}
  h2{font-size:23px;margin-top:42px}
  .jos{padding:40px 20px 84px;justify-content:center;text-align:center}
}

/* 26 oct: trecere cursiva intre site si MEMOIRES/LEGAL: pagina veche ramane pe ecran pana se deseneaza cea noua (fara pauza neagra) */
@view-transition{navigation:auto}
::view-transition-old(root),::view-transition-new(root){animation-duration:.5s;animation-timing-function:ease-in-out}

/* player-ul muzicii (26 oct): jos-stanga, ca pe site; apare doar daca muzica a fost pornita pe site */
.player{position:fixed;left:22px;bottom:22px;z-index:3;display:flex;gap:6px}
.player button{width:44px;height:44px;padding:10px;border:0;background:transparent;cursor:pointer;color:var(--acc)}
.player svg{width:100%;height:100%;fill:currentColor;display:block}
.player .i-pauza{display:none}
.player.canta .i-pauza{display:inline}
.player.canta .i-play{display:none}
.player button:focus-visible{outline:1px solid var(--acc);outline-offset:2px}