/* ==========================================================================
   weavery.co.uk — generated by tools/build.py. Edit tools/css/*.css and
   rebuild; the hover block at the end comes from style-hover attributes in
   the design templates.
   ========================================================================== */

/* Self-hosted webfonts (SIL Open Font License, see OFL.txt). Downloaded from
   Google Fonts as variable woff2, latin + latin-ext subsets only. */

/* Rubik — latin-ext */
@font-face {
  font-family: 'Rubik';
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
  src: url("../fonts/rubik-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* Rubik — latin */
@font-face {
  font-family: 'Rubik';
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
  src: url("../fonts/rubik-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* Archivo — latin-ext */
@font-face {
  font-family: 'Archivo';
  font-style: normal;
  font-weight: 400 700;
  font-stretch: 62% 125%;
  font-display: swap;
  src: url("../fonts/archivo-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* Archivo — latin */
@font-face {
  font-family: 'Archivo';
  font-style: normal;
  font-weight: 400 700;
  font-stretch: 62% 125%;
  font-display: swap;
  src: url("../fonts/archivo-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* Caveat — latin-ext */
@font-face {
  font-family: 'Caveat';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url("../fonts/caveat-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* Caveat — latin */
@font-face {
  font-family: 'Caveat';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url("../fonts/caveat-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* --------------------------------------------------------------- base -- */
/* The pages carry their layout inline, exactly as authored in Claude Design.
   This file only adds what the design runtime used to provide (hover states,
   see the generated block at the end) plus the few things a real site needs
   that a 1280px design preview does not. */

html { scroll-behavior: smooth; }
body { margin: 0; }
img, svg { max-width: 100%; }
img { height: auto; }
.brand-endorse img { height: 0.85em; width: auto; }

/* Focus is visible everywhere; the design's inline styles never remove it. */
:focus-visible { outline: 2px solid var(--color-primary-ring); outline-offset: 2px; }

/* Hover transitions — the same 150ms ease the design system uses. Inline
   `transition` on an element (the lifted cards) still wins over this. */
[class*="hv-"] {
  transition: color 150ms ease, background-color 150ms ease, border-color 150ms ease,
    box-shadow 150ms ease, transform 150ms ease, gap 150ms ease;
}

/* ----------------------------------------------------------- header -- */
/* The 66px header row was designed at desktop width. Below 760px the nav
   drops onto its own line instead of overflowing the sticky bar. */
@media (max-width: 760px) {
  .site-header-row {
    height: auto !important;
    min-height: 66px;
    flex-wrap: wrap;
    gap: 8px 16px !important;
    padding-top: 10px;
    padding-bottom: 10px;
  }
  .site-nav { order: 3; width: 100%; margin-left: 0 !important; gap: 0 !important; }
  .site-nav a { padding: 6px 10px !important; }
}

/* Dense data mock-ups (queues, boards, matrices) keep their desktop column
   widths; on a phone they scroll sideways inside their card rather than clip. */
@media (max-width: 640px) {
  .scroll-x { overflow-x: auto !important; }
}

/* ---------------------------------------------------------- not found -- */
.nf { max-width: 720px; margin: 0 auto; padding: clamp(64px, 12vw, 140px) clamp(20px, 5vw, 48px); text-align: center; }
.nf h1 { font-size: clamp(2rem, 5vw, 3rem); font-weight: 800; letter-spacing: -0.03em; line-height: 1.05; margin: 0 0 14px; }
.nf p { font-size: 1.05rem; color: #4b5866; margin: 0 auto 28px; max-width: 44ch; }
.nf a.btn { display: inline-block; background: var(--accent, #0369a1); color: #fff; font-weight: 600; padding: 13px 24px; border-radius: 12px; text-decoration: none; }
.nf a.btn:hover { background: var(--accent-strong, #075985); text-decoration: none; color: #fff; }

/* ------------------------------------------------------------- print -- */
@media print {
  .site-header, .site-footer, .announce { display: none !important; }
}

/* -------------------------------------------------- hover states -- */
.hv-1c4366:hover { color:#fff !important; }
.hv-2d8eb7:hover { background:var(--accent-strong,#075985) !important; }
.hv-3aaee1:hover { color:#bae6fd !important; }
.hv-41c8e9:hover { color:#0f1922 !important; }
.hv-431eca:hover { background:rgba(255,255,255,.12) !important; }
.hv-8ccc9f:hover { background:#eff2f5 !important; color:#0f1922 !important; }
.hv-914746:hover { box-shadow:0 22px 44px -26px rgba(14,14,20,.26) !important; transform:translateY(-4px) !important; }
.hv-92868e:hover { gap:11px !important; }
.hv-a39d08:hover { background:#24313c !important; }
.hv-afff10:hover { color:#ffffff !important; }
.hv-c55da5:hover { background:#f7f9fb !important; }
.hv-c61b4c:hover { box-shadow:0 24px 48px -24px rgba(14,14,20,.24) !important; transform:translateY(-4px) !important; }
.hv-ce24dc:hover { gap:10px !important; }
.hv-efd92f:hover { background:rgba(255,255,255,.06) !important; border-color:rgba(255,255,255,.2) !important; }