/* ===========================================================================
   Fundații: reset, tipografie, accesibilitate
   =========================================================================== */

*, *::before, *::after { box-sizing: border-box; }

html, body {
  height: 100%;
  margin: 0;
}

body.poarta {
  position: relative;
  overflow: hidden;                 /* scena ocupă exact ecranul */
  background: var(--noapte-adanca);
  color: var(--pergament);
  font-family: var(--font-interfata);
  font-size: 16px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

img { max-width: 100%; display: block; }
svg { display: block; }

h1, h2, h3, p, dl, dd, figure { margin: 0; }
dl { padding: 0; }

/* ---------------------------------------------------------------------------
   Accesibilitate
   --------------------------------------------------------------------------- */

/* Prima oprire cu tasta Tab: sare direct la formular, peste decor. */
.sari-la-continut {
  position: absolute;
  top: -100px;
  left: 1rem;
  z-index: 999;
  padding: 0.7rem 1.2rem;
  border-radius: var(--rotunjire);
  background: var(--aur);
  color: var(--noapte-adanca);
  font-weight: 600;
  text-decoration: none;
  transition: top var(--durata-scurta) var(--moale);
}
.sari-la-continut:focus { top: 1rem; }

/* Inelul de focus este auriu și gros: pe un fundal atât de închis, un contur
   subțire nu se vede. */
:focus-visible {
  outline: 2px solid var(--aur-clar);
  outline-offset: 3px;
  border-radius: var(--rotunjire-mica);
}

.doar-pentru-cititoare {
  position: absolute;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}

/* ---------------------------------------------------------------------------
   Cele trei niveluri tipografice
   --------------------------------------------------------------------------- */

/* A. Titlul artistic */
.titlu-caligrafic {
  display: block;
  max-width: 100%;
  font-family: var(--font-caligrafic);
  /*
   * Mărimea se leagă de lățimea PAGINII, nu de cea a ecranului. O carte
   * deschisă are pagina cam la 44% din lățimea totală, iar un titlu calculat
   * după ecran ieșea din chenar și trecea peste cotor.
   */
  font-size: clamp(1.9rem, 0.9rem + 2.1vw, 3.2rem);
  font-weight: 400;
  line-height: 1.08;
  letter-spacing: 0.01em;
  color: var(--cerneala);
  overflow-wrap: break-word;
  /* Relieful ușor face literele să pară scrise cu cerneală, apăsat. */
  text-shadow:
    0 1px 0 rgba(255, 255, 255, 0.55),
    0 2px 3px rgba(43, 32, 22, 0.22);
}

/* B. Academic */
.tip-lucrare,
.subtitlu-academic,
.date-rand dt,
.date-rand dd,
.motto,
.destinatii-titlu {
  font-family: var(--font-academic);
}

/* C. Funcțional */
.formular,
.buton-intra,
.mesaj-formular,
.acces-privat,
.subsol {
  font-family: var(--font-interfata);
}

/* ---------------------------------------------------------------------------
   Mai puțină mișcare, la cerere
   ---------------------------------------------------------------------------
   Cine a bifat în sistem „reduceți mișcarea" primește aceeași pagină, cu
   aceleași informații, dar fără nimic care se mișcă singur. Nu ascundem
   conținut — oprim doar animația.
   --------------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
    scroll-behavior: auto !important;
  }
  .scena-particule { display: none; }
}