/* ==========================================================
   enhance.css — animacje i dopracowanie wyglądu
   Dołącz w <head> PO istniejących arkuszach stylów:
   <link rel="stylesheet" href="enhance.css">
   ========================================================== */
:root{
  --enh-gold:#b69a62; --enh-gold-light:#e3cf9c; --enh-maroon:#60251f;
  --enh-ease:cubic-bezier(.2,.8,.2,1);
}

/* ---------- Pasek postępu przewijania ---------- */
#enh-progress{position:fixed;top:0;left:0;height:3px;width:100%;transform-origin:0 50%;transform:scaleX(0);
  background:linear-gradient(90deg,var(--enh-maroon),var(--enh-gold),var(--enh-gold-light));z-index:1000;pointer-events:none}

/* ---------- Tło strony głównej: powolny „oddech” zdjęcia ---------- */
body.is-home .archive-shell{background:none!important;isolation:isolate;overflow:clip}
body.is-home .archive-shell::before,
body.is-home .archive-shell::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none}
body.is-home .archive-shell::before{background:url("archive-background.png") center/cover no-repeat;
  animation:enh-kenburns 38s ease-in-out infinite alternate;transform-origin:60% 40%}
body.is-home .archive-shell::after{background:
  radial-gradient(ellipse at 50% 18%,rgba(182,154,98,.16),transparent 55%),
  linear-gradient(rgba(13,33,29,.533),rgba(13,33,29,.333) 55%,rgba(13,33,29,.8))}
@keyframes enh-kenburns{from{transform:scale(1)}to{transform:scale(1.09) translate(-1%,1%)}}
#enh-dust{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:0}
body:not(.is-home) #enh-dust{display:none}
body.is-home .archive-header,body.is-home #content,body.is-home .archive-footer{position:relative;z-index:1}

/* ---------- Wejście nagłówka (herby + tytuł) ---------- */
.enh .heraldry{opacity:0;transform:translateY(26px) scale(.94);
  transition:opacity 1.3s ease,transform 1.5s var(--enh-ease)}
.enh .heraldry:nth-child(2){transition-delay:.25s}
.enh .site-title{opacity:0;transform:translateY(16px);display:inline-block;
  transition:opacity 1.2s ease .55s,transform 1.4s var(--enh-ease) .55s}
.enh-ready .heraldry,.enh-ready .site-title{opacity:1;transform:none}

/* herby: uniesienie i złota poświata */
.heraldry img{transition:transform .7s var(--enh-ease),filter .7s ease;will-change:transform}
.heraldry a:hover img,.heraldry a:focus-visible img{transform:translateY(-6px) scale(1.04);
  filter:drop-shadow(0 10px 18px rgba(0,0,0,.45)) drop-shadow(0 0 14px rgba(227,207,156,.45))}
.heraldry figcaption{transition:letter-spacing .6s var(--enh-ease),color .4s}
.heraldry:hover figcaption{letter-spacing:.32em;color:var(--enh-gold-light)}

/* ornament pod tytułem */
.site-title{position:relative;text-decoration:none}
.site-title::after{content:"";display:block;height:1px;width:100%;margin:.35em auto 0;
  background:linear-gradient(90deg,transparent,var(--enh-gold),transparent);
  transform:scaleX(0);transition:transform 1.4s var(--enh-ease) 1.1s}
.enh-ready .site-title::after{transform:scaleX(1)}

/* ---------- Cytat: słowa rozjaśniają się kolejno ---------- */
.family-quote .enh-w{opacity:.08;transition:opacity .7s ease;display:inline}
.family-quote .enh-w.lit{opacity:1}

/* ---------- Kontakt ---------- */
.home-contact address a{text-decoration:none;background:linear-gradient(currentColor,currentColor) 0 100%/100% 1px no-repeat;
  transition:background-size .5s var(--enh-ease),color .3s;padding-bottom:2px}
.home-contact address a:hover{background-size:0 1px;color:var(--enh-gold-light)}
.ornament-rider{animation:enh-ride 7s ease-in-out infinite;transform-origin:50% 100%}
@keyframes enh-ride{0%,100%{transform:translate(0,0) rotate(0)}25%{transform:translate(3px,-5px) rotate(-.6deg)}50%{transform:translate(0,-8px) rotate(0)}75%{transform:translate(-3px,-4px) rotate(.6deg)}}

/* ---------- Menu katalogów ---------- */
.catalog-menu summary{transition:background-color .35s,transform .35s var(--enh-ease),box-shadow .35s;cursor:pointer}
.catalog-menu summary:hover{transform:translateY(-2px);box-shadow:0 8px 20px rgba(0,0,0,.25)}
.catalog-menu summary svg path{transition:d .4s}
.catalog-menu[open] summary{background:var(--enh-gold-light)}
.catalog-menu[open] .catalog-nav{animation:enh-drop .45s var(--enh-ease)}
@keyframes enh-drop{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:none}}
.catalog-nav a{position:relative;transition:padding-left .35s var(--enh-ease),color .3s}
.catalog-nav a::before{content:"✦";position:absolute;left:0;opacity:0;color:var(--enh-gold);font-size:.7em;top:50%;
  transform:translate(-6px,-50%);transition:opacity .3s,transform .35s var(--enh-ease)}
.catalog-nav a:hover{padding-left:1.2em;color:var(--enh-maroon)}
.catalog-nav a:hover::before{opacity:1;transform:translate(0,-50%)}

/* ---------- Widok katalogu ---------- */
/* usuwa pomarańczową ramkę wokół tytułu po przejściu na podstronę (zostaje dla klawiatury) */
[tabindex="-1"]:focus{outline:none}
.catalog-heading h1{position:relative}
.catalog-heading h1::after{content:"";position:absolute;left:0;bottom:-.25em;height:2px;width:3.5em;
  background:linear-gradient(90deg,var(--enh-gold),transparent);transform-origin:left;animation:enh-line 1.1s var(--enh-ease) .25s both}
@keyframes enh-line{from{transform:scaleX(0)}to{transform:scaleX(1)}}

.enh-in{animation:enh-rise .8s var(--enh-ease) both;animation-delay:calc(var(--i,0) * 70ms)}
@keyframes enh-rise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}

#subcatalog-grid a{position:relative;text-decoration-color:rgba(182,154,98,.6);transition:color .3s,text-decoration-color .3s,transform .4s var(--enh-ease)}
#subcatalog-grid a:hover{color:var(--enh-maroon);text-decoration-color:var(--enh-maroon);transform:translateX(6px)}
#subcatalog-grid a::after{content:" →";opacity:0;transition:opacity .3s,margin .3s}
#subcatalog-grid a:hover::after{opacity:1;margin-left:.25em}

.catalog-back,.tree-zoom button,.tree-return{transition:background-color .3s,color .3s,transform .3s var(--enh-ease),box-shadow .3s}
.catalog-back:hover,.tree-zoom button:hover{transform:translateY(-2px);box-shadow:0 6px 16px rgba(96,37,31,.15)}
.catalog-back:hover span{display:inline-block;animation:enh-nudge .6s ease}
@keyframes enh-nudge{50%{transform:translateX(-4px)}}
.tree-return:hover{transform:translateY(-2px);box-shadow:0 8px 20px rgba(96,37,31,.3)}

/* treść artykułów i zdjęcia pojawiają się przy przewijaniu */
.enh-reveal{opacity:0;transform:translateY(24px);transition:opacity .9s ease,transform 1s var(--enh-ease)}
.enh-reveal.enh-shown{opacity:1;transform:none}
.catalog-text img,.tree-documents img{transition:transform .8s var(--enh-ease),box-shadow .8s}
.catalog-text a:hover img,.tree-documents a:hover img{transform:scale(1.02);box-shadow:0 14px 34px rgba(0,0,0,.2)}

/* ---------- Drzewo genealogiczne ---------- */
.tree-person{transition:transform .35s var(--enh-ease),box-shadow .35s,background-color .35s,border-color .35s}
.tree-person:hover{transform:translateY(-3px);box-shadow:0 8px 18px rgba(96,37,31,.18);border-color:var(--enh-gold)}
.tree-person[aria-pressed="true"]{box-shadow:0 0 0 2px var(--enh-gold),0 0 22px rgba(182,154,98,.55);animation:enh-glow 2.6s ease-in-out infinite}
@keyframes enh-glow{50%{box-shadow:0 0 0 2px var(--enh-gold-light),0 0 30px rgba(182,154,98,.8)}}
.person-panel.enh-flash{animation:enh-rise .6s var(--enh-ease)}
.person-document-list a{transition:color .3s}
.person-document-list a:hover{color:var(--enh-maroon)}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
  .enh .heraldry,.enh .site-title,.enh-reveal{opacity:1!important;transform:none!important}
  .family-quote .enh-w{opacity:1}
  #enh-dust{display:none}
}