/* KallisToys archive popup: dark, full-bleed, matches the homepage banners */
.promo-museum[role="button"],.kcb[role="button"]{cursor:pointer}
.promo-museum[role="button"]:focus-visible{outline:3px solid var(--red);outline-offset:4px}
.archive-panel{--gold:#e6c88f;--cream:#fbf4ea;--ease:cubic-bezier(.22,.61,.36,1);box-sizing:border-box;width:min(1180px,calc(100vw - 48px));max-height:calc(100dvh - 36px);padding:0;border:1px solid rgba(201,166,107,.3);border-radius:16px;background:#130e0b;color:var(--cream);box-shadow:0 40px 120px rgba(8,4,2,.7);overflow:hidden;scrollbar-color:#4a3a2c #130e0b;outline:0;font-family:'Manrope',system-ui,sans-serif}
.archive-panel::backdrop{background:rgba(14,9,7,.72);backdrop-filter:blur(6px)}
.archive-panel .sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.archive-top{position:absolute;z-index:4;top:22px;left:26px;margin:0;pointer-events:none}
.archive-eyebrow{display:block;font:700 11px/1.3 'Manrope',system-ui,sans-serif;letter-spacing:.18em;text-transform:uppercase;color:var(--gold)}
.archive-close{position:absolute;z-index:5;top:16px;right:16px;display:grid;place-items:center;width:42px;height:42px;padding:0;border:1px solid rgba(251,244,234,.28);border-radius:50%;background:rgba(19,14,11,.55);backdrop-filter:blur(6px);color:var(--cream);cursor:pointer;transition:background .25s,color .25s,transform .35s var(--ease)}
.archive-close svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}
.archive-close:hover{background:var(--cream);color:#130e0b;transform:rotate(90deg)}

.archive-choices{display:flex;gap:10px;height:min(560px,calc(100dvh - 60px));padding:10px}
.archive-choice{position:relative;flex:1 1 0;display:flex;align-items:flex-end;min-width:0;overflow:hidden;border-radius:10px;color:var(--cream);text-decoration:none;isolation:isolate;transition:flex-grow .8s var(--ease)}
.archive-choice-image{position:absolute;inset:0;z-index:-2;background-size:cover;background-position:center;transform:scale(1.02);transition:transform 1.4s var(--ease),filter .8s var(--ease);filter:saturate(.9) brightness(.92)}
.archive-museum .archive-choice-image{background-image:url(../images/hero-workshop.webp);background-position:62% 45%}
.archive-catalogues .archive-choice-image{background-image:url(../images/archive-catalogue.webp);background-position:60% 45%}
.archive-choice::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,rgba(14,9,7,.96) 0%,rgba(14,9,7,.78) 28%,rgba(14,9,7,.15) 62%,rgba(14,9,7,.35) 100%)}
.archive-choice::after{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 0 0 1px rgba(240,217,166,.14);transition:box-shadow .5s var(--ease);pointer-events:none}
.archive-choice-body{display:flex;flex-direction:column;align-items:flex-start;gap:8px;width:100%;padding:30px 30px 28px}
.archive-choice strong{font:500 clamp(30px,3vw,44px)/1.05 'Source Serif 4',Georgia,serif;letter-spacing:-.02em;color:#fdf7ee}
.archive-choice strong em{font-style:italic;color:#f0d3a8}
.archive-choice-text{max-width:40ch;font-size:15px;line-height:1.5;color:rgba(251,244,234,.75)}
.archive-choice-action{display:flex;align-items:center;justify-content:space-between;align-self:stretch;margin-top:12px;padding-top:16px;border-top:1px solid rgba(240,217,166,.18);font-size:14px;font-weight:700;color:var(--cream)}
.archive-go{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;border:1px solid rgba(251,244,234,.4);transition:background .3s,color .3s,border-color .3s,transform .4s var(--ease)}
.archive-go svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}

@media (hover:hover) and (min-width:761px){
  .archive-choices:hover .archive-choice{flex-grow:.82}
  .archive-choices .archive-choice:hover{flex-grow:1.18}
}
.archive-choice:hover .archive-choice-image,.archive-choice:focus-visible .archive-choice-image{transform:scale(1.07);filter:saturate(1.05) brightness(1)}
.archive-choice:hover::after{box-shadow:inset 0 0 0 1px rgba(240,217,166,.45)}
.archive-choice:hover .archive-go,.archive-choice:focus-visible .archive-go{background:var(--cream);border-color:var(--cream);color:#130e0b;transform:translateX(3px)}
.archive-panel :focus-visible{outline:2px solid var(--gold);outline-offset:3px}

@media (prefers-reduced-motion:no-preference){
  .archive-panel[open] .archive-choice{animation:archiveUp .9s var(--ease) both}
  .archive-panel[open] .archive-choice+.archive-choice{animation-delay:.08s}
  .archive-panel[open] .archive-choice-body>*{animation:archiveUp .8s var(--ease) both;animation-delay:.25s}
  .archive-panel[open] .archive-choice+.archive-choice .archive-choice-body>*{animation-delay:.33s}
}
@keyframes archiveUp{from{opacity:0;transform:translateY(14px)}}

@media (max-width:760px){
  .archive-panel{width:calc(100vw - 20px);max-height:calc(100dvh - 20px);border-radius:14px;overflow-y:auto}
  .archive-choices{flex-direction:column;height:auto;gap:8px;padding:8px}
  .archive-choice{flex:none;min-height:300px}
  .archive-top{top:18px;left:20px}
  .archive-choice-body{padding:22px 20px 20px}
  .archive-choice strong{font-size:30px}
  .archive-choice-text{font-size:14px}
}
@media (prefers-reduced-motion:reduce){.archive-choice,.archive-choice-image,.archive-go,.archive-close{transition:none}.archive-choice:hover .archive-choice-image{transform:scale(1.02)}}
