/* ═══════════════════════════════════════════════════════════════════
   TERMINA — »ORRERIJ« v5.0, zaključna plast

   Kaj je ta datoteka. Svet povesta styles.css in postavitev.css; ta
   plast nosi samo tisto, kar je bilo med »Papirjem« in »Gozdom«
   IZMERJENO kot napaka in popravljeno. Vsako pravilo tu je bilo
   nekoč hrošč, ne okus.

   Zakaj obstaja namesto da bi popravke vpisal v postavitev.css.
   Ker se tako vidi, kaj je svet in kaj je popravek. Ko bo svet
   naslednjič zamenjan, gre ta datoteka z njim ali pa ne — odločitev
   je berljiva na enem mestu.

   Kaj je bilo iz »Gozda« NAMENOMA izpuščeno: vsa barva, teden s
   prostimi urami in pas kategorij. Prva dva sta bila drug svet,
   tretji pa je nadomeščal orrerij, ki je zdaj spet tu.
   ═══════════════════════════════════════════════════════════════════ */

/* ── gibanje: Kowalskijev register ───────────────────────────────────
   Iz »Gozda« ostane, ker ni barva. Vstop je vedno ease-out: ease-in
   pri istem trajanju bere počasneje, ker zamakne prav tisti trenutek,
   ki ga oko gleda najbolj pozorno. */
:root{
  --hitro:cubic-bezier(.23,1,.32,1);
  --t-pritisk:140ms;
  --t-odziv:180ms;
  --t-prihod:240ms;
}

/* Pritisk stisne gumb za 3 %. Merjeno na dotik: pri 140 ms je odziv
   še vezan na prst, pri 220 ms se že bere kot animacija. */
.btn{transition:transform var(--t-pritisk) var(--hitro),
                background var(--t-odziv),border-color var(--t-odziv),color var(--t-odziv)}
.btn:active{transform:scale(.97)}
.time:active{transform:scale(.96)}
.time.gone:active{transform:none}
.btn-p:disabled:active{transform:none}

/* Prehod ob drsenju: krajši in z močnejšo krivuljo kot prej.
   Razred .js postavi pwa.js; brez njega je vsebina vidna takoj in
   varovalka ga po dveh sekundah odvzame, če se opazovalec ne oglasi. */
.js .reveal{opacity:0;transform:translateY(10px);
  transition:opacity var(--t-prihod) var(--hitro),transform var(--t-prihod) var(--hitro)}
.js .reveal.in{opacity:1;transform:none}

/* Dvig kartice samo tam, kjer miška sploh obstaja. Na dotik je
   :hover lepljivo stanje, ki ostane po tapu. */
@media(hover:hover) and (pointer:fine){
  .pcard:hover,.fpost:hover,.plan:hover{transform:translateY(-2px)}
}

/* ── postavitev: štirje koraki ───────────────────────────────────────
   .arches je tretji otrok mreže z dvema stolpcema, zato so vsi štirje
   koraki stali v levi polovici — 474 px od 964. */
.kako-grid>.arches{grid-column:1 / -1;margin-top:52px}

/* .arch je mreža z dvema stolpcema in tremi otroki: odstavek je padel
   v drugo vrsto prvega stolpca, naslov odletel desno, besedilo pa se
   je stisnilo na 20 znakov v vrstici. */
.arch{display:grid;grid-template-columns:auto minmax(0,1fr);
      column-gap:18px;row-gap:6px;align-items:start}
.arch .cap{grid-column:1;grid-row:1 / -1}
.arch h3{grid-column:2;margin:0;align-self:center}
.arch p{grid-column:2;margin:0;max-width:46ch;line-height:1.6}

/* ── tipografija: hierarhija, ki je manjkala ─────────────────────── */
.arch h3{font-size:var(--t-lg);line-height:1.25}
.plan h3{font-size:var(--t-xl);line-height:1.22}

/* Poved, ki naredi razdelek s cenami pošten, ni smela biti šepet. */
.plan-foot{font-size:var(--t-md);line-height:1.6;max-width:62ch}
/* vrstica dodatkov pod paketi: isti glas kot nogi cenika, le tišja */
/* Vrstica dodatkov je bila edina sredinska vrstica v levo poravnanem
   razdelku cenika — stala je pod tremi karticami kot podnapis pod sliko in
   se je od noge cenika, ki je tik pod njo, ločila brez razloga. */
.plan-dodatki{font-size:var(--t-sm);margin-top:18px}

/* Zaključni razdelek je odslej levo poravnan (styles.css); ostane samo
   omejitev širine, da vrstica ne postane predolga za branje. */
.close .note,.close .sub{max-width:58ch}

/* Povzetek tretjega koraka je bral kot obrazec, ne kot pregled. */
#s3 .fld span{font-size:var(--t-sm);letter-spacing:0}

/* Prazno stanje toka je bilo sredinsko na levo poravnani strani. */
.feed .empty,#feed .empty,.flist .empty,#empty.empty{
  text-align:left;padding:22px 24px;font-size:var(--t-md);
  border:1px solid var(--meja);border-radius:var(--r-drobno);
}

/* Prazna opomba je držala svojo višino in odpirala vrzel pod
   obrazcem, preden je uporabnik karkoli naredil. */
.note:empty{display:none;padding:0;border:none;background:none}

/* ── prihod korakov rezervacije ──────────────────────────────────────
   Korak, ki se pokaže brez prihoda, bere kot preskok. Osem pikslov
   navzgor in nič drugega. */
#s2:not([hidden]),#s3:not([hidden]),#done:not([hidden]),
#slots-wrap:not([hidden]){animation:t-prihod var(--t-prihod) var(--hitro) both}
@keyframes t-prihod{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

/* ── Termina's mark on a profile without a photograph ────────────────
   Where a provider has not uploaded an image there is neither emptiness
   nor a stock photograph, but Termina's mark. The pulse is slow — 6.4 s
   per cycle — because this is a space waiting for a picture, not a
   notification. The mark sits in the UPPER third of the field, since the
   name plate covers the lower half.

   The CGP ban on looping applies to Signal as an EVENT; a space that
   waits does not happen once. */
.p-signal{
  position:absolute;left:50%;top:38%;transform:translate(-50%,-50%);
  width:132px;height:132px;overflow:visible;pointer-events:none;
}
.pfoto.ima .p-signal{display:none}
.p-signal .rip,.p-signal .pika,.p-signal .obroc{
  transform-box:fill-box;transform-origin:center;
}
.p-signal .pika{fill:var(--medenina)}
.p-signal .obroc,.p-signal .rip{stroke:var(--medenina)}
.p-signal .obroc{opacity:.5}
.p-signal .rip{opacity:0;animation:p-sig 6.4s cubic-bezier(.25,.6,.3,1) infinite}
.p-signal .r2{animation-delay:3.2s}
.p-signal .pika{animation:p-dih 6.4s ease-in-out infinite}
.p-signal .obroc{animation:p-obroc 6.4s ease-in-out infinite}
@keyframes p-sig{0%{transform:scale(1);opacity:0}14%{opacity:.42}100%{transform:scale(2.9);opacity:0}}
@keyframes p-dih{0%,100%{transform:scale(1)}50%{transform:scale(1.04)}}
@keyframes p-obroc{0%,100%{opacity:.5}50%{opacity:.72}}

/* ── zmanjšano gibanje ─────────────────────────────────────────────── */
@media(prefers-reduced-motion:reduce){
  .btn,.time,.pcard,.fpost,.plan{transition:none}
  .btn:active,.time:active{transform:none}
  .pcard:hover,.fpost:hover,.plan:hover{transform:none}
  #s2:not([hidden]),#s3:not([hidden]),#done:not([hidden]),
  #slots-wrap:not([hidden]){animation:none}
  .p-signal .rip{animation:none;opacity:.28;transform:scale(1.6)}
  .p-signal .r2{opacity:.16;transform:scale(2.2)}
  .p-signal .pika,.p-signal .obroc{animation:none}
}

[hidden]{display:none !important}

/* ── fokusna obroba se ne animira ─────────────────────────────────────
   Blanketni `transition:.2s` je animiral tudi outline, zato se je
   fokusna obroba pojavljala 200 ms po pritisku na tabulator. Obroba
   fokusa mora biti takojšnja: uporabnik, ki tipka, ne sme čakati, da
   izve, kje je. */
:focus-visible{transition:none !important}