/* ===========================================================
   Mikołaj Kopernik — interaktywna ekspozycja 3D
   Motyw: jasny, studyjny, minimalistyczny (na wzór konfiguratora 3D)
   Fonty: Oswald (nagłówki kondensowane) + Inter (treść) + Cormorant (życiorys)
   =========================================================== */
:root{
  --bg:#e9e8e4;
  --studio-1:#f6f5f2;     /* środek studyjnego tła */
  --studio-2:#d7d6d1;     /* brzeg */
  --panel:#ffffff;
  --panel-2:#f3f2ef;
  --ink:#1b1b1c;
  --ink-soft:#3a3a3c;
  --muted:#7c7b78;
  --faint:#a8a7a3;
  --gold:#a9802f;
  --gold-soft:#c79a45;
  --line:rgba(0,0,0,.12);
  --line-soft:rgba(0,0,0,.07);
  --shadow:0 16px 44px rgba(30,30,35,.16);
  --shadow-soft:0 6px 20px rgba(30,30,35,.10);
  --radius:16px;
  --cond:"Oswald",Impact,sans-serif;
  --sans:"Inter",system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
  --serif:"Cormorant Garamond",Georgia,serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;font-family:var(--sans);color:var(--ink);background:var(--bg);
  line-height:1.65;-webkit-font-smoothing:antialiased;
}
a{color:var(--gold);text-decoration:none}
a:hover{text-decoration:underline}
h1,h2,h3,h4{margin:0 0 .4em;line-height:1.12}
h2,h3{font-family:var(--cond);font-weight:600;letter-spacing:.5px;text-transform:uppercase}
img{max-width:100%;display:block}
.skip{position:absolute;left:-999px;top:0;background:var(--ink);color:#fff;padding:10px 16px;border-radius:0 0 10px 0;z-index:4000}
.skip:focus{left:0}

/* ---------- nav ---------- */
.nav{position:sticky;top:0;z-index:1000;background:rgba(246,245,242,.86);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.nav__inner{max-width:1280px;margin:0 auto;display:flex;align-items:center;gap:18px;padding:11px 22px}
.brand{display:flex;align-items:center;gap:11px;font-family:var(--cond);font-size:1.28rem;letter-spacing:1px;text-transform:uppercase;color:var(--ink)}
.brand .mark{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(180deg,var(--gold-soft),var(--gold));color:#fff;font-size:1rem}
.nav__links{margin-left:auto;display:flex;gap:4px;flex-wrap:wrap}
.nav__links a{color:var(--muted);padding:8px 14px;border-radius:999px;font-size:.86rem;font-weight:600;letter-spacing:.4px;text-transform:uppercase}
.nav__links a:hover{color:var(--ink);background:rgba(0,0,0,.05);text-decoration:none}
.nav__links a.active{color:#fff;background:var(--ink)}
.nav__toggle{display:none}

/* ---------- layout helpers ---------- */
.wrap{max-width:1180px;margin:0 auto;padding:0 22px}
.section{padding:70px 0}
.eyebrow{font-family:var(--sans);text-transform:uppercase;letter-spacing:.26em;font-size:.72rem;color:var(--gold);font-weight:700;margin-bottom:12px}
.section h2{font-size:clamp(1.9rem,3.6vw,2.7rem);color:var(--ink)}
.lead{color:var(--muted);font-size:1.06rem;max-width:64ch}
.divider{height:1px;background:var(--line);max-width:1180px;margin:0 auto}

/* ======================================================
   STAGE — konfigurator 3D (strona główna)
   ====================================================== */
.stage{position:relative;height:100vh;min-height:600px;overflow:hidden;
  background:radial-gradient(120% 100% at 50% 38%,var(--studio-1) 0%,var(--studio-1) 38%,var(--studio-2) 100%)}
.stage.is-dark{background:radial-gradient(120% 100% at 50% 38%,#26262a 0%,#1a1a1d 55%,#101012 100%)}
.stage.is-dark .stage__title h1{color:#fff}
.stage.is-dark .stage__title p{color:#c7c6c2}
.stage.is-dark .stage__menu a{color:#cfceca}
.stage.is-dark .stage__menu a:hover,.stage.is-dark .stage__menu a.active{color:#fff}
.stage.is-dark .stage__menu a .dot{border-color:#9a9994}
.stage.is-dark .tool,.stage.is-dark .mini{color:#e7e6e2;border-color:rgba(255,255,255,.18);background:rgba(255,255,255,.06)}
.stage.is-dark .tool:hover,.stage.is-dark .mini:hover{border-color:var(--gold-soft)}

.stage__model{position:absolute;inset:0;width:100%;height:100%;
  --poster-color:transparent;background:transparent;z-index:1;
  --min-hotspot-opacity:0}  /* punkty z tyłu (zasłonięte) całkowicie znikają */

/* tytuł */
.stage__title{position:absolute;top:clamp(78px,9vh,120px);left:clamp(22px,4vw,64px);z-index:5;max-width:46%}
.stage__title h1{font-family:var(--cond);font-weight:700;text-transform:uppercase;letter-spacing:1px;
  font-size:clamp(2.4rem,6vw,4.6rem);line-height:.98;color:var(--ink);margin:0}
.stage__title p{font-family:var(--cond);font-weight:500;text-transform:uppercase;letter-spacing:1px;
  font-size:clamp(.95rem,1.8vw,1.35rem);color:var(--gold);margin:.35em 0 0}

/* menu lewe */
.stage__menu{position:absolute;left:clamp(22px,4vw,64px);top:50%;transform:translateY(-50%);z-index:5;display:flex;flex-direction:column;gap:2px}
.stage__menu a{display:flex;align-items:center;gap:11px;color:var(--ink-soft);font-family:var(--cond);font-weight:500;
  text-transform:uppercase;letter-spacing:1px;font-size:1rem;padding:8px 2px;cursor:pointer;transition:.15s;background:none;border:none;text-align:left}
.stage__menu a .dot{width:11px;height:11px;border-radius:50%;border:1.5px solid var(--faint);flex:0 0 auto;transition:.15s}
.stage__menu a:hover{color:var(--gold);text-decoration:none}
.stage__menu a:hover .dot{border-color:var(--gold)}
.stage__menu a.active{color:var(--gold)}
.stage__menu a.active .dot{background:var(--gold);border-color:var(--gold)}

/* prawy pasek narzędzi/nawigacji */
.stage__tools{position:absolute;right:clamp(18px,3vw,46px);top:50%;transform:translateY(-50%);z-index:5;display:flex;flex-direction:column;gap:14px}
.tool{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;cursor:pointer;
  background:rgba(255,255,255,.7);border:1px solid var(--line);color:var(--ink-soft);font-size:1.15rem;transition:.15s;text-decoration:none}
.tool:hover{border-color:var(--gold);color:var(--gold);transform:translateY(-1px);text-decoration:none}
.tool svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.tool .tip{position:absolute;right:54px;white-space:nowrap;background:var(--ink);color:#fff;font-size:.74rem;font-family:var(--sans);
  text-transform:none;letter-spacing:0;padding:5px 9px;border-radius:7px;opacity:0;pointer-events:none;transform:translateX(6px);transition:.15s}
.tool{position:relative}
.tool:hover .tip{opacity:1;transform:translateX(0)}

/* dolne mini-kontrolki (lewy-dół) */
.stage__mini{position:absolute;left:clamp(22px,4vw,64px);bottom:26px;z-index:5;display:flex;gap:10px}
.mini{width:38px;height:38px;border-radius:10px;display:grid;place-items:center;cursor:pointer;
  background:rgba(255,255,255,.7);border:1px solid var(--line);color:var(--ink-soft);font-size:1rem;transition:.15s}
.mini:hover{border-color:var(--gold);color:var(--gold)}
.mini.is-on{background:var(--ink);color:#fff;border-color:var(--ink)}

/* AR przycisk (dół-środek) */
.stage__ar{position:absolute;left:50%;bottom:24px;transform:translateX(-50%);z-index:5}
.btn-ar{display:inline-flex;align-items:center;gap:9px;background:var(--ink);color:#fff;border:none;border-radius:999px;
  padding:12px 22px;font-family:var(--cond);text-transform:uppercase;letter-spacing:1px;font-size:.92rem;cursor:pointer;box-shadow:var(--shadow-soft)}
.btn-ar:hover{background:var(--gold)}

/* podpowiedź obrotu */
.stage__hint{position:absolute;right:clamp(18px,3vw,46px);bottom:26px;z-index:4;font-size:.8rem;color:var(--muted);
  background:rgba(255,255,255,.6);border:1px solid var(--line-soft);padding:6px 12px;border-radius:999px}
.stage.is-dark .stage__hint{background:rgba(0,0,0,.3);color:#cfceca;border-color:rgba(255,255,255,.12)}

/* hotspoty + z podpisem */
.hotspot{display:flex;align-items:center;gap:8px;cursor:pointer;background:none;border:none;padding:0;transition:.16s}
.hs-dot{flex:0 0 auto;width:26px;height:26px;border-radius:50%;border:1.5px solid rgba(0,0,0,.45);
  background:rgba(255,255,255,.88);color:#1b1b1c;font-size:1.05rem;line-height:1;display:grid;place-items:center;
  box-shadow:0 2px 8px rgba(0,0,0,.28);transition:.16s}
.hs-cap{font-family:var(--cond);text-transform:uppercase;letter-spacing:.6px;font-size:.78rem;font-weight:600;color:#1b1b1c;
  background:rgba(255,255,255,.88);border:1px solid var(--line-soft);padding:3px 10px;border-radius:999px;white-space:nowrap;
  box-shadow:0 2px 8px rgba(0,0,0,.14);transition:.16s}
.hotspot:hover .hs-dot,.hotspot.is-active .hs-dot{background:var(--gold);color:#fff;border-color:var(--gold);transform:scale(1.12)}
.hotspot:hover .hs-cap,.hotspot.is-active .hs-cap{color:var(--gold);border-color:var(--gold)}
.stage.is-dark .hs-dot{background:rgba(30,30,33,.9);color:#fff;border-color:rgba(255,255,255,.5)}
.stage.is-dark .hs-cap{background:rgba(30,30,33,.9);color:#fff;border-color:rgba(255,255,255,.18)}
.stage.is-dark .hotspot:hover .hs-dot,.stage.is-dark .hotspot.is-active .hs-dot,
.stage.is-dark .hotspot:hover .hs-cap,.stage.is-dark .hotspot.is-active .hs-cap{background:var(--gold);color:#fff;border-color:var(--gold)}
.stage.hide-hotspots .hotspot{opacity:0;pointer-events:none}

/* panel treści (wysuwany z prawej) */
.info-panel{position:fixed;top:0;right:0;height:100%;width:min(420px,90vw);z-index:1500;
  background:var(--panel);border-left:1px solid var(--line);box-shadow:-26px 0 60px rgba(0,0,0,.18);
  transform:translateX(102%);transition:transform .38s cubic-bezier(.2,.8,.2,1);padding:34px 30px;overflow-y:auto}
.info-panel.open{transform:translateX(0)}
.info-panel__close{position:absolute;top:18px;right:18px;background:var(--panel-2);border:1px solid var(--line);
  width:36px;height:36px;border-radius:50%;cursor:pointer;font-size:1.1rem;color:var(--ink)}
.info-panel .ip-eyebrow{font-family:var(--sans);text-transform:uppercase;letter-spacing:.2em;font-size:.72rem;color:var(--gold);font-weight:700}
.info-panel .ip-icon{font-size:2.2rem;color:var(--gold)}
.info-panel h3{font-family:var(--cond);font-size:1.9rem;color:var(--ink);margin:.15em 0 .1em;letter-spacing:.5px}
.info-panel .ip-lead{color:var(--gold);font-weight:600;margin-bottom:12px}
.info-panel p{color:var(--ink-soft);font-size:1rem}
.info-panel figure{margin:18px 0 0}
.info-panel figure img{border-radius:12px;border:1px solid var(--line)}
.info-panel figcaption{color:var(--muted);font-size:.8rem;margin-top:6px}
.info-panel .btn{margin-top:18px}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;gap:9px;border:1px solid var(--line);background:var(--panel);color:var(--ink);
  padding:11px 19px;border-radius:999px;font-weight:600;font-size:.92rem;cursor:pointer;transition:.16s;font-family:var(--sans)}
.btn:hover{border-color:var(--gold);color:var(--gold);text-decoration:none}
.btn--gold{background:var(--ink);color:#fff;border:none}
.btn--gold:hover{background:var(--gold);color:#fff}
.btn--ghost{background:transparent}
.btn--sm{padding:8px 14px;font-size:.84rem}
.btn.active{background:var(--ink);color:#fff;border-color:var(--ink)}

/* ======================================================
   ŻYCIORYS
   ====================================================== */
.bio{display:grid;grid-template-columns:240px 1fr;gap:44px;align-items:start;margin-top:34px}
.bio__toc{position:sticky;top:80px;border-left:2px solid var(--line);padding-left:18px}
.bio__toc a{display:block;color:var(--muted);padding:5px 0;font-size:.9rem;font-weight:500}
.bio__toc a:hover,.bio__toc a.active{color:var(--gold);text-decoration:none}
.bio__body{max-width:74ch}
.bio__sec{padding:12px 0 26px;border-bottom:1px solid var(--line-soft)}
.bio__sec h3{font-family:var(--cond);font-size:1.7rem;color:var(--ink);letter-spacing:.5px}
.bio__sec p{margin:0 0 1em;color:var(--ink-soft);font-family:var(--serif);font-size:1.18rem;line-height:1.7}
.bio__sec::after{content:"";display:block;clear:both}
/* inicjał (drop-cap) */
.bio__sec p:first-of-type::first-letter{font-family:var(--serif);font-size:3.6rem;line-height:.78;float:left;margin:.04em .1em 0 0;color:var(--gold);font-weight:600}
/* portret wpleciony */
.bio-figure{float:right;width:250px;max-width:44%;margin:4px 0 16px 24px}
.bio-figure img{width:100%;border-radius:10px;border:1px solid var(--line);box-shadow:var(--shadow-soft)}
.bio-figure figcaption{font-size:.78rem;color:var(--muted);margin-top:6px;text-align:center;font-family:var(--sans)}
/* cytat */
.pullquote{margin:18px 0;padding:4px 0 4px 22px;border-left:3px solid var(--gold);font-family:var(--serif);font-size:1.55rem;font-style:italic;color:var(--ink);line-height:1.35}
.pullquote cite{display:block;font-style:normal;font-family:var(--sans);font-size:.92rem;color:var(--muted);margin-top:8px}
/* ciekawostka */
.ciekawostka{display:block;margin:20px 0 6px;background:var(--panel-2);border:1px solid var(--line);border-left:3px solid var(--gold);border-radius:10px;padding:14px 16px;font-family:var(--sans);font-size:.96rem;color:var(--ink-soft);line-height:1.55}
.ck-label{display:block;font-family:var(--cond);text-transform:uppercase;letter-spacing:.7px;font-size:.8rem;color:var(--gold);margin-bottom:5px}

/* ---------- OŚ CZASU ---------- */
.timeline{position:relative;display:flex;align-items:center;gap:8px;margin:34px 0 6px}
.timeline__nav{flex:0 0 auto;width:38px;height:38px;border-radius:50%;border:1px solid var(--line);background:var(--panel);color:var(--ink);cursor:pointer;font-size:1.3rem;line-height:1;transition:.15s}
.timeline__nav:hover{border-color:var(--gold);color:var(--gold)}
.timeline__track{position:relative;display:flex;gap:0;overflow-x:auto;flex:1;padding:0 4px 12px;scroll-behavior:smooth;scrollbar-width:thin}
.timeline__track::before{content:"";position:absolute;left:14px;right:14px;top:26px;height:2px;background:var(--line);z-index:0}
.tl-node{position:relative;flex:0 0 158px;display:flex;flex-direction:column;align-items:center;gap:7px;padding:16px 8px 4px;background:none;border:none;cursor:pointer;text-align:center}
.tl-dot{order:-1;width:16px;height:16px;border-radius:50%;background:#fff;border:2px solid var(--gold);z-index:1;transition:.16s}
.tl-year{font-family:var(--cond);font-size:1.18rem;color:var(--ink);letter-spacing:.4px;transition:.16s}
.tl-title{font-size:.78rem;color:var(--muted);line-height:1.25}
.tl-node:hover .tl-dot,.tl-node.active .tl-dot{background:var(--gold);transform:scale(1.22)}
.tl-node:hover .tl-year,.tl-node.active .tl-year{color:var(--gold)}
.tl-node:hover .tl-title{color:var(--ink)}
.timeline-detail{display:flex;gap:20px;align-items:flex-start;background:var(--panel);border:1px solid var(--line);border-left:3px solid var(--gold);
  border-radius:12px;padding:18px 22px;margin:4px 0 12px;box-shadow:var(--shadow-soft);animation:fade .3s ease}
.tld-year{font-family:var(--cond);font-size:2rem;color:var(--gold);flex:0 0 auto;line-height:1}
.tld-body h4{font-family:var(--cond);font-size:1.25rem;margin:0 0 5px;color:var(--ink);letter-spacing:.4px}
.tld-body p{margin:0 0 9px;color:var(--ink-soft)}
.tld-link{font-weight:600;font-size:.92rem}

/* ---------- MAPA PODRÓŻY ---------- */
.bio-map{margin:32px 0 12px;border:1px solid var(--line);border-radius:var(--radius);background:var(--panel);overflow:hidden;box-shadow:var(--shadow-soft)}
.bio-map__head{padding:22px 24px 8px}
.bio-map__head h3{font-family:var(--cond);font-size:1.5rem;color:var(--ink);letter-spacing:.5px}
.bio-map__head p{color:var(--muted);max-width:64ch;font-size:.95rem;margin:.3em 0 0}
.bio-map__legend{display:flex;gap:16px;flex-wrap:wrap;margin-top:12px}
.lg{font-size:.78rem;color:var(--muted);display:inline-flex;align-items:center;gap:7px;font-weight:600}
.lg::before{content:"";width:10px;height:10px;border-radius:50%}
.lg--krakow::before{background:#3b6fb0}.lg--italy::before{background:#b0533b}.lg--warmia::before{background:var(--gold)}
.bio-map__stage{display:grid;grid-template-columns:1.35fr 1fr;gap:0;align-items:stretch}
.bio-map__svg{padding:8px 16px 18px;display:flex;align-items:center;justify-content:center}
.bio-map__svg svg{width:100%;height:auto;max-height:540px}
.bio-map__info{border-left:1px solid var(--line);padding:26px;display:flex;flex-direction:column;justify-content:center;background:var(--panel-2)}
.bio-map__info>strong{font-family:var(--cond);text-transform:uppercase;letter-spacing:.5px;color:var(--ink);font-size:1.05rem}
.bio-map__info>span{color:var(--muted);font-size:.92rem;margin-top:6px}
.mi-tag{display:inline-block;font-family:var(--cond);text-transform:uppercase;letter-spacing:.5px;font-size:.95rem;padding:5px 13px;border-radius:999px;color:#fff;margin-bottom:12px}
.mi-tag--krakow{background:#3b6fb0}.mi-tag--italy{background:#b0533b}.mi-tag--warmia{background:var(--gold)}
.bio-map__info p{color:var(--ink-soft);font-size:1rem;margin:0;line-height:1.6}
.pin{cursor:pointer}
.pin__dot{fill:#fff;stroke-width:1.1;transition:.16s}
.pin__lbl{font-family:var(--sans);font-size:2.5px;font-weight:600;fill:var(--ink-soft);pointer-events:none;transition:.16s}
.pin--krakow .pin__dot{stroke:#3b6fb0}.pin--italy .pin__dot{stroke:#b0533b}.pin--warmia .pin__dot{stroke:var(--gold)}
.pin:hover .pin__dot{stroke-width:1.8}
.pin.is-active .pin__dot{stroke-width:2}
.pin--krakow.is-active .pin__dot{fill:#3b6fb0}.pin--italy.is-active .pin__dot{fill:#b0533b}.pin--warmia.is-active .pin__dot{fill:var(--gold)}
.pin.is-active .pin__lbl{fill:var(--ink);font-weight:700}

/* ---------- przyrządy 3D / AR (animowane) ---------- */
.anim-sub{margin:0 0 40px}
.anim-sub__head{display:flex;gap:14px;align-items:flex-start;margin:0 0 18px;padding-bottom:12px;border-bottom:2px solid var(--line)}
.anim-sub__ic{font-size:1.8rem;line-height:1}
.anim-sub__head h3{font-family:var(--cond);text-transform:uppercase;letter-spacing:.5px;font-size:1.4rem;color:var(--ink);margin:0}
.anim-sub__head p{color:var(--muted);font-size:.95rem;margin:.25em 0 0;max-width:70ch}
.anim-sub--rekon .anim-sub__head{border-bottom-color:var(--gold)}
.anim-sub--rekon .anim-sub__head p strong{color:var(--gold)}
.anim-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:22px}
.anim-card{border:1px solid var(--line);border-radius:var(--radius);background:var(--panel);overflow:hidden;box-shadow:var(--shadow-soft);display:flex;flex-direction:column;transition:.18s}
.anim-card:hover{box-shadow:var(--shadow);transform:translateY(-2px)}
.anim-card__view{position:relative;background:linear-gradient(160deg,#f4f3f0,#e4e3df);min-height:300px}
.anim-mv{width:100%;height:300px;--poster-color:transparent}
.anim-badge{position:absolute;top:12px;left:12px;z-index:3;font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;font-weight:700;
  background:rgba(255,255,255,.85);color:var(--gold);padding:5px 11px;border-radius:999px;border:1px solid var(--line-soft)}
.anim-play{position:absolute;bottom:12px;right:12px;z-index:3;width:38px;height:38px;border-radius:50%;border:1px solid var(--line);
  background:rgba(255,255,255,.9);color:var(--ink);cursor:pointer;font-size:.95rem}
.anim-play:hover{border-color:var(--gold);color:var(--gold)}
.anim-ar{position:absolute;bottom:12px;left:50%;transform:translateX(-50%)}
.anim-expand{position:absolute;top:12px;right:12px;z-index:3;width:38px;height:38px;border-radius:50%;border:1px solid var(--line);
  background:rgba(255,255,255,.9);color:var(--ink);cursor:pointer;font-size:1rem}
.anim-expand:hover{border-color:var(--gold);color:var(--gold)}
.anim-card__body{padding:20px 22px 22px;border-top:1px solid var(--line)}
.anim-card__body h3{font-family:var(--cond);font-size:1.3rem;color:var(--ink);letter-spacing:.3px;margin:0 0 6px;display:flex;align-items:center;gap:9px}
.anim-ic{font-size:1.3rem}
.anim-card__body p{color:var(--ink-soft);font-size:.96rem;margin:0;line-height:1.6}
.anim-meta-row{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0 14px}
.anim-meta{display:inline-flex;flex-direction:column;gap:2px;min-width:min(210px,100%);background:var(--panel-2);border:1px solid var(--line-soft);
  border-radius:10px;padding:8px 10px}
.anim-meta strong{font-family:var(--cond);text-transform:uppercase;letter-spacing:.5px;font-size:.72rem;color:var(--gold)}
.anim-meta span{font-size:.86rem;color:var(--ink-soft);line-height:1.35}
.anim-reference{margin:16px 0 0;border:1px solid var(--line-soft);border-radius:10px;background:var(--panel-2);overflow:hidden}
.anim-reference img{display:block;width:100%;height:auto;max-height:280px;object-fit:contain;background:#e7e6e2}
.anim-reference figcaption{margin:0;padding:9px 11px;color:var(--muted);font-size:.82rem;line-height:1.4;border-top:1px solid var(--line-soft)}
.anim-info{margin-top:16px;padding-top:14px;border-top:1px solid var(--line-soft)}
.anim-info h4{font-family:var(--cond);font-size:1.02rem;letter-spacing:.35px;text-transform:uppercase;color:var(--ink);margin:0 0 7px}
.anim-info p{font-size:.93rem;line-height:1.62;color:var(--ink-soft);margin:0}
.anim-info ul{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:7px}
.anim-info li{position:relative;padding-left:20px;color:var(--ink-soft);font-size:.93rem;line-height:1.55}
.anim-info li::before{content:"";position:absolute;left:2px;top:.67em;width:7px;height:7px;border-radius:50%;background:var(--gold)}
.anim-sources{margin-top:16px;border-top:1px dashed var(--line);padding-top:12px;color:var(--muted)}
.anim-sources summary{cursor:pointer;font-family:var(--cond);text-transform:uppercase;letter-spacing:.45px;font-size:.86rem;color:var(--gold)}
.anim-sources ul{margin:10px 0 0;padding-left:18px}
.anim-sources li{font-size:.82rem;line-height:1.45;margin:5px 0}

/* powiększony podgląd modelu 3D (po kliknięciu ⤢) */
.anim-lightbox{position:fixed;inset:0;z-index:3200;background:rgba(20,20,22,.72);display:none;padding:30px;overflow-y:auto}
.anim-lightbox.open{display:block}
.anim-lightbox__inner{max-width:1000px;margin:0 auto;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow)}
.anim-lightbox__view{position:relative;background:linear-gradient(160deg,#f4f3f0,#e4e3df)}
.anim-lightbox__mv{width:100%;height:min(70vh,640px);--poster-color:transparent}
.anim-lightbox__body{padding:22px 28px 26px;border-top:1px solid var(--line)}
.anim-lightbox__body h3{font-family:var(--cond);font-size:1.5rem;color:var(--ink);letter-spacing:.3px;margin:0 0 8px;display:flex;align-items:center;gap:10px}
.anim-lightbox__body p{color:var(--ink-soft);font-size:1rem;margin:0;line-height:1.65}
.anim-lightbox__body .anim-info p,.anim-lightbox__body .anim-info li{font-size:.98rem}
.anim-lightbox__close{position:fixed;top:18px;right:24px;background:var(--panel);border:1px solid var(--line);color:var(--ink);width:42px;height:42px;border-radius:50%;font-size:1.3rem;cursor:pointer;z-index:3300}
@media(max-width:560px){.anim-lightbox{padding:14px}.anim-lightbox__body{padding:18px}}

/* ---------- animacje pojawiania ---------- */
.reveal{opacity:0;transform:translateY(20px);transition:opacity .6s ease,transform .6s ease}
.reveal.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}}

/* ======================================================
   GALERIA
   ====================================================== */
.cards{display:grid;grid-template-columns:1fr;gap:30px;margin-top:8px}
.figure-card{border:1px solid var(--line);border-radius:var(--radius);background:var(--panel);overflow:hidden;box-shadow:var(--shadow-soft)}
.figure-card__top{display:grid;grid-template-columns:1fr 1fr;gap:0}
.figure-card__media{position:relative;background:linear-gradient(160deg,#f4f3f0,#e4e3df);min-height:360px;display:flex;align-items:center;justify-content:center}
.figure-card__media img{width:100%;height:100%;object-fit:contain;max-height:460px}
.figure-card__media model-viewer{min-height:360px;height:100%;--poster-color:transparent}
.media-label{position:absolute;top:12px;left:12px;font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;font-weight:700;
  background:rgba(255,255,255,.85);color:var(--gold);padding:5px 11px;border-radius:999px;border:1px solid var(--line-soft);z-index:3}
.zoom-btn{position:absolute;top:10px;right:10px;background:rgba(255,255,255,.85);border:1px solid var(--line);color:var(--ink);
  width:38px;height:38px;border-radius:10px;cursor:pointer;font-size:1.05rem;z-index:3}
.zoom-btn:hover{border-color:var(--gold);color:var(--gold)}
.no-model{display:flex;flex-direction:column;gap:10px;align-items:center;justify-content:center;color:var(--muted);text-align:center;padding:30px;font-size:.92rem}
.no-model .big{font-size:2rem;opacity:.5}
.figure-card__body{padding:22px 26px 26px;border-top:1px solid var(--line)}
.figure-card__body h3{font-family:var(--cond);font-size:1.5rem;color:var(--ink);letter-spacing:.5px}
.meta-row{display:flex;flex-wrap:wrap;gap:8px;margin:6px 0 14px}
.meta-pill{font-size:.78rem;color:var(--muted);background:var(--panel-2);border:1px solid var(--line-soft);padding:4px 11px;border-radius:999px}
.figure-card__body p{color:var(--ink-soft);margin:0 0 14px}
.src{color:var(--muted);font-size:.8rem;border-top:1px dashed var(--line);padding-top:12px}
.src .lic{display:inline-block;margin-top:4px;color:var(--gold)}
.ar-row{display:flex;gap:10px;flex-wrap:wrap;margin-top:6px}
.gallery-controls{display:flex;gap:10px;flex-wrap:wrap;margin:8px 0 30px}

/* lightbox */
.lightbox{position:fixed;inset:0;background:rgba(20,20,22,.92);z-index:3000;display:none;align-items:center;justify-content:center;padding:30px}
.lightbox.open{display:flex}
.lightbox img{max-width:92vw;max-height:84vh;border-radius:10px;box-shadow:var(--shadow)}
.lightbox__cap{position:absolute;bottom:24px;left:0;right:0;text-align:center;color:#e7e6e2;font-size:.9rem;padding:0 20px}
.lightbox__close{position:absolute;top:20px;right:26px;background:none;border:none;color:#fff;font-size:2rem;cursor:pointer}

/* AR help */
.ar-help{border:1px solid var(--line);border-radius:var(--radius);background:var(--panel);padding:8px 22px;margin-top:28px}
.ar-help summary{cursor:pointer;font-family:var(--cond);font-size:1.25rem;letter-spacing:.5px;text-transform:uppercase;color:var(--ink);padding:14px 0;list-style:none}
.ar-help summary::-webkit-details-marker{display:none}
.ar-help summary::before{content:"▸ ";color:var(--gold)}
.ar-help[open] summary::before{content:"▾ "}
.ar-help__grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;padding:6px 0 20px}
.ar-help h4{color:var(--gold);font-family:var(--sans);font-size:1rem;margin:0 0 8px;text-transform:none;letter-spacing:0}
.ar-help ul{margin:0;padding-left:18px;color:var(--muted);font-size:.92rem}
.ar-help li{margin:5px 0}

/* ======================================================
   STREFA EDUKACJI
   ====================================================== */
.edu-tabs{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0 34px}
.edu-tab{border:1px solid var(--line);background:var(--panel);color:var(--muted);padding:11px 20px;border-radius:999px;cursor:pointer;
  font-weight:600;font-size:.9rem;letter-spacing:.4px;text-transform:uppercase;transition:.16s;font-family:var(--cond)}
.edu-tab:hover{color:var(--ink)}
.edu-tab.active{background:var(--ink);color:#fff;border-color:var(--ink)}
.edu-tab--jump{border-style:dashed}
.edu-pane{display:none}
.edu-pane.active{display:block;animation:fade .3s ease}
@keyframes fade{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

/* filtr kategorii fiszek */
.flash-cats{display:flex;flex-wrap:wrap;gap:9px;justify-content:center;margin:0 0 26px}
.flash-chip{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--line);background:var(--panel);color:var(--ink-soft);
  padding:8px 14px;border-radius:999px;cursor:pointer;font-size:.86rem;font-weight:600;transition:.15s}
.flash-chip::before{content:"";width:10px;height:10px;border-radius:50%;background:var(--c,var(--gold))}
.flash-chip:hover{border-color:var(--c,var(--gold));color:var(--ink)}
.flash-chip.active{background:var(--c,var(--ink));color:#fff;border-color:var(--c,var(--ink))}
.flash-chip.active::before{background:#fff}
.fc-count{font-variant-numeric:tabular-nums;opacity:.8;font-size:.8rem}
.flash-chip.active .fc-count{opacity:.9}

.flash-stage{display:flex;flex-direction:column;align-items:center;gap:18px}
.flash-cat{position:absolute;top:14px;left:50%;transform:translateX(-50%);font-family:var(--cond);text-transform:uppercase;
  letter-spacing:.6px;font-size:.74rem;font-weight:600;color:#fff;background:var(--c,var(--gold));padding:4px 12px;border-radius:999px}
.flashcard{width:min(620px,100%);height:300px;perspective:1600px;cursor:pointer}
.flashcard__inner{position:relative;width:100%;height:100%;transition:transform .55s cubic-bezier(.2,.8,.2,1);transform-style:preserve-3d}
.flashcard.flipped .flashcard__inner{transform:rotateY(180deg)}
.flash-face{position:absolute;inset:0;backface-visibility:hidden;border-radius:var(--radius);border:1px solid var(--line);
  display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:34px;box-shadow:var(--shadow-soft)}
.flash-front{background:var(--panel)}
.flash-back{background:linear-gradient(180deg,#fbf8f1,#f1ece0);transform:rotateY(180deg)}
.flash-face .role{font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);margin-bottom:14px;font-weight:700}
.flash-face .txt{font-family:var(--serif);font-size:1.5rem;color:var(--ink);line-height:1.35}
.flash-face .hintflip{position:absolute;bottom:12px;font-size:.78rem;color:var(--muted)}
.flash-controls{display:flex;align-items:center;gap:14px}
.flash-counter{color:var(--muted);font-variant-numeric:tabular-nums;min-width:90px;text-align:center}
.flash-progress{width:min(620px,100%);height:6px;border-radius:999px;background:rgba(0,0,0,.08);overflow:hidden}
.flash-progress span{display:block;height:100%;background:linear-gradient(90deg,var(--gold),var(--gold-soft));transition:width .3s}

.quiz{max-width:760px;margin:0 auto}
.quiz__bar{height:6px;border-radius:999px;background:rgba(0,0,0,.08);overflow:hidden;margin-bottom:22px}
.quiz__bar span{display:block;height:100%;background:linear-gradient(90deg,var(--gold),var(--gold-soft));transition:width .3s;width:0}
.quiz__dots{display:flex;gap:8px;justify-content:center;margin:0 0 20px;flex-wrap:wrap}
.qd{width:11px;height:11px;border-radius:50%;background:rgba(0,0,0,.12);transition:.2s}
.qd.current{box-shadow:0 0 0 3px rgba(169,128,47,.25);background:var(--gold)}
.qd.done{background:var(--faint)}
.qd.ok{background:#2f9e5c}
.qd.bad{background:#d3463e}
.q-card{border:1px solid var(--line);border-radius:var(--radius);background:var(--panel);padding:28px;box-shadow:var(--shadow-soft)}
.q-num{color:var(--gold);font-weight:700;letter-spacing:.14em;text-transform:uppercase;font-size:.78rem}
.q-text{font-family:var(--serif);font-size:1.5rem;margin:8px 0 18px;color:var(--ink)}
.opts{display:flex;flex-direction:column;gap:11px}
.opt{display:flex;gap:12px;align-items:flex-start;text-align:left;border:1px solid var(--line);background:var(--panel-2);
  color:var(--ink);padding:14px 16px;border-radius:12px;cursor:pointer;font-size:.98rem;transition:.14s}
.opt:hover:not([disabled]){border-color:var(--gold);background:#fbf6ec}
.opt .lbl{flex:0 0 28px;height:28px;border-radius:50%;background:rgba(0,0,0,.08);display:grid;place-items:center;font-weight:700;font-size:.85rem}
.opt.correct{border-color:#2f9e5c;background:#e7f6ec}
.opt.correct .lbl{background:#2f9e5c;color:#fff}
.opt.wrong{border-color:#d3463e;background:#fbe9e8}
.opt.wrong .lbl{background:#d3463e;color:#fff}
.opt .rationale{display:none;width:100%;margin-top:8px;font-size:.86rem;color:var(--muted)}
.opt.revealed .rationale{display:block}
.q-hint{margin:16px 0 0}
.q-hint summary{cursor:pointer;color:var(--gold);font-size:.9rem}
.q-hint p{color:var(--muted);font-size:.9rem;margin:8px 0 0}
.quiz__foot{display:flex;justify-content:space-between;align-items:center;margin-top:20px;gap:12px}
.quiz__score{text-align:center;padding:30px}
.quiz__score .big{font-family:var(--cond);font-size:3.4rem;color:var(--gold)}

/* paleta motywów lekcji (karta + czytnik) */
.lesson-card--kultura,.ls-theme--kultura{--acc:#b08968}
.lesson-card--renesans,.ls-theme--renesans{--acc:#9c6b9c}
.lesson-card--medycyna,.ls-theme--medycyna{--acc:#2f9e7a}
.lesson-card--prawo,.ls-theme--prawo{--acc:#3b6fb0}
.lesson-card--ekonomia,.ls-theme--ekonomia{--acc:#bd8a2e}
.lesson-card--astronomia,.ls-theme--astronomia{--acc:#4a5db0}
.lesson-card--rodzina,.ls-theme--rodzina{--acc:#b0533b}

.lesson-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:20px}
.lesson-card{position:relative;border:1px solid var(--line);border-top:3px solid var(--acc,var(--gold));border-radius:var(--radius);
  background:var(--panel);padding:22px 22px 20px;display:flex;flex-direction:column;gap:7px;box-shadow:var(--shadow-soft);transition:.18s}
.lesson-card:hover{transform:translateY(-3px);box-shadow:var(--shadow)}
.lesson-card__top{display:flex;align-items:center;justify-content:space-between;margin-bottom:2px}
.lesson-ic{width:46px;height:46px;border-radius:12px;display:grid;place-items:center;font-size:1.5rem;background:var(--acc,var(--ink));color:#fff;line-height:1}
.lesson-no{font-family:var(--cond);text-transform:uppercase;letter-spacing:.6px;color:var(--muted);font-size:.78rem}
.lesson-theme{font-family:var(--cond);text-transform:uppercase;letter-spacing:.7px;color:var(--acc,var(--gold));font-weight:600;font-size:.8rem}
.lesson-card h3{font-family:var(--cond);font-size:1.28rem;margin:0;color:var(--ink);letter-spacing:.3px;line-height:1.12}
.lesson-q{font-family:var(--serif);font-style:italic;color:var(--ink-soft);font-size:1.04rem;margin:2px 0 0;line-height:1.4}
.lesson-card .acts{margin-top:auto;display:flex;gap:10px;flex-wrap:wrap;padding-top:12px}

/* czytnik scenariusza */
.lesson-reader{position:fixed;inset:0;z-index:3200;background:rgba(20,20,22,.62);display:none;padding:30px;overflow-y:auto}
.lesson-reader.open{display:block}
.lesson-reader__inner{max-width:860px;margin:0 auto;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow)}
.ls-head{position:relative;display:flex;gap:18px;align-items:flex-start;padding:30px 34px;background:var(--panel-2);border-top:5px solid var(--acc,var(--gold));border-bottom:1px solid var(--line)}
.ls-ic{width:60px;height:60px;border-radius:14px;display:grid;place-items:center;font-size:2rem;background:var(--acc,var(--ink));color:#fff;flex:0 0 auto;line-height:1}
.ls-head__txt{flex:1;min-width:0}
.ls-kicker{font-family:var(--cond);text-transform:uppercase;letter-spacing:.7px;color:var(--acc,var(--gold));font-weight:600;font-size:.82rem}
.ls-head h2{font-family:var(--cond);font-size:1.95rem;color:var(--ink);margin:.08em 0;letter-spacing:.4px}
.ls-lead{font-family:var(--serif);font-style:italic;color:var(--ink-soft);margin:.2em 0 0;font-size:1.05rem}
.ls-dl{flex:0 0 auto}
.ls-content{padding:24px 34px 10px}
.ls-content p{color:var(--ink-soft);margin:.1em 0 .9em;line-height:1.66}
.ls-content>p:first-of-type{margin-top:0}
.ls-h2{font-family:var(--cond);text-transform:uppercase;letter-spacing:.5px;font-size:1.18rem;color:var(--ink);
  margin:26px 0 10px;padding-bottom:7px;border-bottom:2px solid var(--line);display:flex;align-items:center;gap:9px}
.ls-h2::before{content:"";width:11px;height:11px;border-radius:50%;background:var(--acc,var(--gold));flex:0 0 auto}
.ls-h3{font-family:var(--cond);font-size:1.05rem;color:var(--acc,var(--ink));margin:18px 0 5px;letter-spacing:.3px}
.ls-ul{margin:6px 0 16px;padding:0;list-style:none}
.ls-ul li{position:relative;padding:5px 0 5px 26px;color:var(--ink-soft);line-height:1.55}
.ls-ul li::before{content:"›";position:absolute;left:8px;top:3px;color:var(--acc,var(--gold));font-weight:700;font-size:1.1em}
.ls-content a{color:var(--acc,var(--gold));word-break:break-word}
.lesson-reader__close{position:fixed;top:18px;right:24px;background:var(--panel);border:1px solid var(--line);color:var(--ink);width:42px;height:42px;border-radius:50%;font-size:1.3rem;cursor:pointer;z-index:3300}
@media(max-width:560px){.ls-head{flex-wrap:wrap;padding:22px}.ls-content{padding:20px}}

/* ---------- footer ---------- */
.footer{border-top:1px solid var(--line);padding:40px 0 60px;color:var(--muted);font-size:.9rem;background:var(--panel-2)}
.footer .wrap{display:grid;grid-template-columns:1.4fr 1fr;gap:30px}
.footer h4{color:var(--ink);font-family:var(--cond);font-size:1.05rem;letter-spacing:.5px;text-transform:uppercase;margin:0 0 10px}

/* ---------- responsive ---------- */
@media(max-width:920px){
  .bio{grid-template-columns:1fr}
  .bio__toc{display:none}
  .bio-map__stage{grid-template-columns:1fr}
  .bio-map__info{border-left:none;border-top:1px solid var(--line)}
  .bio-figure{float:none;width:100%;max-width:100%;margin:10px 0 18px}
  .timeline-detail{flex-direction:column;gap:8px}
  .figure-card__top{grid-template-columns:1fr}
  .ar-help__grid{grid-template-columns:1fr}
  .footer .wrap{grid-template-columns:1fr}
  .stage__title{max-width:70%}
  .stage__menu{font-size:.9rem;top:auto;bottom:80px;transform:none}
  .stage__menu a{font-size:.92rem;padding:6px 2px}
  .stage__tools{right:12px;gap:10px}
  .tool{width:40px;height:40px}
  .nav__links{position:fixed;inset:54px 0 auto 0;flex-direction:column;background:var(--panel);border-bottom:1px solid var(--line);padding:14px 22px;display:none;z-index:1100}
  .nav__links.open{display:flex}
  .nav__toggle{display:inline-grid;place-items:center;margin-left:auto;background:var(--panel);border:1px solid var(--line);color:var(--ink);width:42px;height:38px;border-radius:10px;cursor:pointer;font-size:1.2rem}
}
@media(max-width:560px){
  .stage__menu{bottom:74px}
  .stage__title{top:70px}
}
/* okna o małej wysokości (np. laptop z niewielkim oknem) — tytuł i menu
   nachodziły na siebie, bo menu było wyśrodkowane/przyklejone do dołu.
   Tutaj menu dostaje stałą pozycję pod tytułem, z zapasem miejsca. */
@media(max-height:700px){
  .stage__title{top:16px;max-width:60%}
  .stage__menu{top:230px;bottom:auto;transform:none}
}
@media(max-height:560px){
  .stage__menu{top:200px}
}
