/* Stamina ExtraBold / SemiBold — jedyne dwa warianty faktycznie używane w
   CSS (patrz h1/h2/h3 i .font-semibold-stamina poniżej). "Stamina Regular"
   był w poprzedniej wersji dołączony jako trzeci base64-owy plik OTF, mimo
   że żadna reguła CSS go nie używała — usunięty jako martwy ciężar.
   Format: WOFF (nie WOFF2) — w tym środowisku budowania nie było dostępu
   do biblioteki brotli (wymaganej do kompresji WOFF2, offline/bez dostępu
   do PyPI/npm), więc użyto WOFF (kompresja zlib, brak dodatkowych zależności).
   WOFF ma pełne wsparcie we wszystkich współczesnych przeglądarkach; jedyna
   różnica to nieco większy rozmiar pliku niż dawałby WOFF2 dla tych samych
   glifów — podmiana na WOFF2 to trywialna zmiana jednej linii @font-face,
   gdy w docelowym środowisku CI/CD dostępny będzie pakiet brotli. */
@font-face {
  font-family: "Stamina ExtraBold";
  src: url("fonts/StaminaExtraBold.woff") format("woff");
  font-weight: normal; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Stamina SemiBold";
  src: url("fonts/StaminaSemiBold.woff") format("woff");
  font-weight: normal; font-style: normal; font-display: swap;
}


:root{
  --toffee:#6B4226;
  --egret:#F1E9DD;
  --cloud:#FAF7F2;
  --atrament:#201A16;
  --bordeaux:#7A2E2A;
  --muskmelon:#D3872A;
  --foxglove:#8B6478;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--cloud);
  color:var(--atrament);
  font-family:'Inter',system-ui,-apple-system,sans-serif;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,.font-display{font-family:'Stamina ExtraBold','Inter',sans-serif; font-weight:400; text-wrap:balance;}
.font-semibold-stamina{font-family:'Stamina SemiBold','Inter',sans-serif; font-weight:400;}
a{color:inherit}
::selection{background:var(--toffee);color:var(--egret)}

.tag{
  display:inline-flex; align-items:center; gap:.3em;
  border:1px solid currentColor; border-radius:2px;
  padding:.3em .7em; font-size:.68rem; letter-spacing:.08em;
  text-transform:uppercase; font-weight:600;
}
.hairline{height:1px; background:currentColor; opacity:.15}
.cta-link{
  text-decoration:underline; text-underline-offset:3px; text-decoration-thickness:1px;
  font-size:.75rem; letter-spacing:.06em; text-transform:uppercase; font-weight:700;
  transition:opacity .15s;
}
.cta-link:hover{opacity:.6}

.photo-ph{
  position:relative; overflow:hidden; display:flex; align-items:center; justify-content:center;
  text-align:center; text-transform:uppercase; letter-spacing:.08em; font-size:.68rem; font-weight:600;
  background-image:repeating-linear-gradient(135deg, currentColor 0, currentColor 1px, transparent 1px, transparent 14px);
}
.photo-ph span{
  background:var(--cloud); padding:.4em .8em; opacity:.75; border-radius:2px; color:var(--atrament);
}

/* nav dropdown */
.nav-item{position:relative}
.nav-drop{
  position:absolute; top:100%; left:0; margin-top:0;
  opacity:0; visibility:hidden; transform:translateY(4px);
  transition:opacity .15s ease, transform .15s ease, visibility .15s;
  pointer-events:none;
}
.nav-item:hover .nav-drop, .nav-drop.force-open{
  opacity:1; visibility:visible; transform:translateY(0); pointer-events:auto;
}

/* accordion chevron */
.acc-btn[aria-expanded="true"] .acc-chevron{transform:rotate(180deg)}
.acc-chevron{transition:transform .2s}
.acc-panel{display:grid; grid-template-rows:0fr; transition:grid-template-rows .25s ease;}
.acc-panel > div{overflow:hidden}
.acc-panel.open{grid-template-rows:1fr}

.underline-focus:focus-visible{outline:2px solid var(--toffee); outline-offset:3px}

@media (max-width:400px){
  .no-mobile-scroll{overflow-x:hidden}
}
