/* RJA Custom Craftworks: the site layer (2026-10-13, walnut from 2026-10-14).
 *
 * 2026-10-14: Ron saw three mosaic look studies and picked the walnut one ("LOOOVE ther walnut one").
 * The site is now dark: a near-black walnut ground, rounded wood-toned tiles, cream type, one amber
 * for buttons and marks, charcoal CAD linework. The notes below are the 10-13 history it grew from.
 *
 * Ron, after seeing eight reference sites: "I like bennett awards. Simple, does the job." Then: "I want
 * to have a new look ... scrolling animations, things that help make it feel modern. I would love to
 * have a big hero image too with a message."
 *
 * So: white, a warm light grey and near-black. One typeface (Albert Sans) with a mono for specs and
 * dates. One signal yellow, as a fill and a line only. Flat: no shadows, no bezels, no gradients on
 * surfaces. The photographs and the product renders are the colour. Motion is a rise on scroll, a slow
 * drift behind the big photographs and a header that clears itself over the hero.
 *
 * This file is the tokens every other sheet reads (--ks-*), the base type, buttons, the header, the
 * footer and the motion primitives. It loads on every page, before ks.css / storefront.css / home.css.
 */

@font-face{
  font-family: 'Albert Sans'; font-style: normal; font-weight: 400 800; font-display: swap;
  src: url('fonts/AlbertSans-Variable.woff2') format('woff2');
}
@font-face{
  font-family: 'JetBrains Mono'; font-style: normal; font-weight: 500; font-display: swap;
  src: url('fonts/JetBrainsMono-Medium.woff2') format('woff2');
}

:root{
  /* grounds: near-black walnut, and the tiles that sit on it */
  --ks-paper:      #16120f;   /* the page */
  --ks-paper-warm: #1d1713;
  --ks-paper-sunk: #221b16;   /* "bench": tiles, the square behind a render, fields */
  --ks-band:       #110e0b;   /* header, footer */
  --ks-band-2:     #2a211b;
  --ks-on-band:    #f1e7d8;
  --ks-on-band-2:  #b3a28d;

  /* wood tiles */
  --ks-espresso: #201813;
  --ks-walnut-t: #3d2918;
  --ks-cognac:   #7a4f2e;
  --ks-oak:      #ebdfcb;   /* the one light tile: designs sit on it */
  --ks-on-oak:   #2a211b;

  /* ink: warm cream on walnut */
  --ks-ink:   #efe5d6;
  --ks-ink-2: #c9b9a3;
  --ks-ink-3: #a08f7a;

  /* lines */
  --ks-line:        #3a2f27;
  --ks-line-soft:   #2c241e;
  --ks-line-strong: #6e5f50;

  /* the one signal: amber, as a fill and a line */
  --ks-tape:      #f0cf9c;
  --ks-tape-deep: #f6dcb3;
  --ks-on-tape:   #1b1511;
  --ks-amber-2:   #c9864b;   /* the far end of the headline gradient */

  /* collections keep their own colour */
  --ks-seaford:      #0d6a2f;
  --ks-seaford-deep: #07471f;
  --ks-seaford-wash: #14261b;
  --ks-seaford-ink:  #8fd3a6;
  --ks-team:      #7a1c2e;
  --ks-team-deep: #561320;
  --ks-team-wash: #2a161a;
  --ks-team-ink:  #e6a0ad;

  /* names the older component rules still use, pointed at the new palette */
  --ks-walnut:      var(--ks-ink);
  --ks-walnut-deep: var(--ks-ink);
  --ks-brass:       var(--ks-tape);
  --ks-brass-lit:   var(--ks-tape);
  --ks-sh-1:    0 0 0 0 transparent;
  --ks-sh-2:    0 0 0 0 transparent;
  --ks-sh-lift: 0 0 0 0 transparent;
  --ks-inner:   0 0 0 0 transparent;

  --ks-r-shell: 22px;
  --ks-r-core:  14px;
  --ks-r-pill:  999px;

  --ks-ease:   cubic-bezier(0.2, 0.7, 0.2, 1);
  --ks-ease-s: cubic-bezier(0.22, 1, 0.36, 1);

  --ks-sans:  'Albert Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --ks-serif: var(--ks-sans);   /* there is one typeface now */
  --ks-mono:  'JetBrains Mono', ui-monospace, 'SF Mono', Menlo, monospace;

  --rs-gutter: clamp(1rem, 4vw, 2.5rem);
  --rs-max: 76rem;
  --rs-header-h: 4.5rem;
}

/* ---------------------------------------------------------------- base */
html{ scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
@media (prefers-reduced-motion: reduce){ html{ scroll-behavior: auto; } }

body.rs{
  background: var(--ks-paper); color: var(--ks-ink);
  font-family: var(--ks-sans); font-size: 1rem; line-height: 1.6;
  -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility;
}
body.rs #page{ padding-top: var(--rs-header-h); overflow-x: clip; }
body.rs .site-content{ background: var(--ks-paper); }
body.rs .site-content:focus{ outline: none; }

/* One measure for every page, and the header lines up with it. */
body.rs .col-full{
  box-sizing: content-box; max-width: var(--rs-max);
  margin-left: auto; margin-right: auto; padding-left: var(--rs-gutter); padding-right: var(--rs-gutter);
}
.rs-wrap{
  box-sizing: border-box; width: 100%; max-width: calc(var(--rs-max) + var(--rs-gutter) * 2);
  margin-left: auto; margin-right: auto; padding-left: var(--rs-gutter); padding-right: var(--rs-gutter);
}
body.rs .col-full .col-full{ padding-left: 0; padding-right: 0; }

body.rs h1, body.rs h2, body.rs h3, body.rs h4, body.rs h5, body.rs h6,
body.rs .alpha, body.rs .beta, body.rs .gamma, body.rs .delta{
  font-family: var(--ks-sans); font-weight: 800; color: var(--ks-ink);
  letter-spacing: -0.02em; line-height: 1.1; text-wrap: balance;
}
body.rs h3, body.rs h4, body.rs h5, body.rs h6{ font-weight: 700; letter-spacing: -0.01em; }
/* Storefront gives a link inside a heading its own light weight */
body.rs h1 a, body.rs h2 a, body.rs h3 a, body.rs h4 a{ font-weight: inherit; }
body.rs p{ text-wrap: pretty; }
body.rs button, body.rs input, body.rs select, body.rs textarea{ font-family: var(--ks-sans); }

body.rs a{ color: var(--ks-ink); text-decoration-color: var(--ks-tape-deep); text-underline-offset: 0.2em; }
body.rs a:hover{ color: var(--ks-ink); }
body.rs a:focus, body.rs button:focus:not(:focus-visible){ outline: none; }
body.rs a:focus-visible, body.rs button:focus-visible, body.rs input:focus-visible,
body.rs select:focus-visible, body.rs textarea:focus-visible{ outline: 3px solid var(--ks-ink); outline-offset: 3px; }
body.rs ::selection{ background: var(--ks-tape); color: var(--ks-on-tape); }

/* Plain pages (a policy, contact): one readable column under a big title. */
body.rs.page:not(.ks-home-page):not(.rw-page) .site-main{ padding: clamp(2rem, 5vw, 4rem) 0 clamp(3rem, 7vw, 6rem); }
body.rs .content-area{ width: 100%; float: none; margin: 0; }
body.rs #secondary{ display: none; }
body.rs .hentry{ margin: 0; padding: 0; border: 0; }
body.rs.page .entry-header{ margin: 0 0 clamp(1.25rem, 3vw, 2rem); border: 0; padding: 0; }
body.rs.page .entry-title{
  font-size: clamp(2.2rem, 1.4rem + 3.2vw, 4rem); line-height: 1.02; letter-spacing: -0.03em; margin: 0;
}
body.rs.page:not(.ks-home-page):not(.rw-page):not(.page-template-template-fullwidth):not(.woocommerce-cart):not(.woocommerce-checkout):not(.woocommerce-account) .entry-content > *{ max-width: 44rem; }

/* ---------------------------------------------------------------- small type */
.rs-spec, .rs-eyebrow{
  font-family: var(--ks-mono); font-weight: 500; font-size: 0.75rem; line-height: 1.4;
  letter-spacing: 0.08em; text-transform: uppercase; color: var(--ks-ink-3);
}
.rs-eyebrow{ display: flex; align-items: center; gap: 0.75rem; margin: 0 0 1rem; }
.rs-eyebrow > span{ color: var(--ks-ink); }
.rs-eyebrow > span::after{
  content: ''; display: inline-block; vertical-align: middle; width: 2rem; height: 3px; margin-left: 0.75rem; background: var(--ks-tape);
}
.rs-eyebrow--on{ color: var(--ks-on-band-2); }
.rs-eyebrow--on > span{ color: var(--ks-on-band); }

.rs-h2{
  font-size: clamp(2rem, 1.3rem + 2.8vw, 3.5rem); line-height: 1.02; letter-spacing: -0.03em;
  font-weight: 800; margin: 0; max-width: 17ch;
}
.rs-h3{ font-size: clamp(1.25rem, 1.1rem + 0.7vw, 1.6rem); line-height: 1.15; letter-spacing: -0.015em; font-weight: 700; margin: 0; }
.rs-lede{ font-size: clamp(1rem, 0.95rem + 0.3vw, 1.15rem); line-height: 1.55; color: var(--ks-ink-2); margin: 0; max-width: 46ch; }

/* ---------------------------------------------------------------- buttons and links */
.rs-btn, body.rs .rs-btn{
  display: inline-flex; align-items: center; justify-content: center; gap: 0.6rem;
  min-height: 2.9rem; padding: 0.7rem 1.3rem; border: 0; border-radius: var(--ks-r-pill);
  background: var(--ks-tape); color: var(--ks-on-tape);
  font: 700 0.95rem/1.1 var(--ks-sans); letter-spacing: 0; text-decoration: none; cursor: pointer;
  transition: background-color 220ms var(--ks-ease), color 220ms var(--ks-ease), box-shadow 220ms var(--ks-ease), transform 220ms var(--ks-ease);
}
.rs-btn:hover, body.rs .rs-btn:hover{ background: var(--ks-tape-deep); color: var(--ks-on-tape); }
.rs-btn:active{ transform: translateY(1px); }
.rs-btn .rs-arrow, .rs-link .rs-arrow{ flex: none; transition: transform 320ms var(--ks-ease); }
.rs-btn:hover .rs-arrow, .rs-link:hover .rs-arrow, a:hover > .rs-btn .rs-arrow{ transform: translateX(4px); }
.rs-btn--sm, body.rs .rs-btn--sm{ min-height: 2.4rem; padding: 0.5rem 1rem; font-size: 0.875rem; }
.rs-btn--lg, body.rs .rs-btn--lg{ min-height: 3.4rem; padding: 0.9rem 1.6rem; font-size: 1.02rem; }
.rs-btn--ghost, body.rs .rs-btn--ghost{ background: transparent; color: var(--ks-on-band); box-shadow: inset 0 0 0 1.5px rgb(255 255 255 / 0.55); }
.rs-btn--ghost:hover, body.rs .rs-btn--ghost:hover{ background: var(--ks-ink); color: var(--ks-on-tape); box-shadow: inset 0 0 0 1.5px var(--ks-ink); }
.rs-btn--dark, body.rs .rs-btn--dark{ background: var(--ks-ink); color: var(--ks-on-tape); }
.rs-btn--dark:hover, body.rs .rs-btn--dark:hover{ background: var(--ks-tape); color: var(--ks-on-tape); }

.rs-link, body.rs .rs-link{
  display: inline-flex; align-items: center; gap: 0.5rem; color: var(--ks-ink);
  font-weight: 700; font-size: 0.95rem; text-decoration: none;
  background: linear-gradient(var(--ks-tape), var(--ks-tape)) 0 100% / 100% 3px no-repeat; padding-bottom: 0.3rem;
  transition: background-size 320ms var(--ks-ease);
}
.rs-link:hover, body.rs .rs-link:hover{ background-size: 100% 100%; color: var(--ks-on-tape); }
.rs-actions{ display: flex; flex-wrap: wrap; align-items: center; gap: 0.75rem 1rem; }

/* WooCommerce's own buttons, everywhere they appear. */
body.rs .button, body.rs button.button, body.rs input[type="submit"], body.rs .added_to_cart,
body.rs .wc-block-components-button:not(.is-link){
  border: 0; border-radius: var(--ks-r-pill); background: var(--ks-ink); color: var(--ks-on-tape);
  font: 700 0.95rem/1.1 var(--ks-sans); padding: 0.85rem 1.3rem; box-shadow: none;
  transition: background-color 220ms var(--ks-ease), color 220ms var(--ks-ease);
}
body.rs .button:hover, body.rs button.button:hover, body.rs input[type="submit"]:hover, body.rs .added_to_cart:hover{ background: var(--ks-tape); color: var(--ks-on-tape); }
body.rs .button.alt, body.rs button.button.alt, body.rs .checkout-button, body.rs #place_order,
body.rs .single_add_to_cart_button, body.rs .wc-proceed-to-checkout .button{
  background: var(--ks-tape); color: var(--ks-on-tape);
}
body.rs .button.alt:hover, body.rs button.button.alt:hover, body.rs .checkout-button:hover, body.rs #place_order:hover,
body.rs .single_add_to_cart_button:hover, body.rs .wc-proceed-to-checkout .button:hover{ background: var(--ks-tape-deep); color: var(--ks-on-tape); }
body.rs .button.disabled, body.rs .button:disabled{ opacity: 0.5; }

/* Fields */
body.rs input[type="text"], body.rs input[type="email"], body.rs input[type="tel"], body.rs input[type="number"],
body.rs input[type="password"], body.rs input[type="search"], body.rs input[type="url"], body.rs textarea, body.rs select,
body.rs .input-text{
  background: var(--ks-paper-sunk); color: var(--ks-ink); border: 1px solid var(--ks-line-strong); border-radius: 10px;
  box-shadow: none; padding: 0.7rem 0.85rem; font-size: 1rem;
}
body.rs input:focus, body.rs textarea:focus, body.rs select:focus, body.rs .input-text:focus{ background: var(--ks-band-2); border-color: var(--ks-tape); }
body.rs ::placeholder{ color: var(--ks-ink-3); opacity: 1; }
body.rs label{ font-weight: 600; color: var(--ks-ink-2); font-size: 0.9rem; }

/* Notices */
body.rs .woocommerce-message, body.rs .woocommerce-info, body.rs .woocommerce-error, body.rs .woocommerce-noreviews, body.rs p.no-comments{
  background: var(--ks-paper-sunk); color: var(--ks-ink); border: 0; border-left: 3px solid var(--ks-tape); border-radius: 4px var(--ks-r-core) var(--ks-r-core) 4px;
}
body.rs .woocommerce-error{ border-left-color: #e07a5f; }
body.rs .woocommerce-message a, body.rs .woocommerce-info a, body.rs .woocommerce-error a{ color: var(--ks-ink); }
body.rs .woocommerce-message .button, body.rs .woocommerce-info .button{ background: var(--ks-tape); color: var(--ks-on-tape); border: 0; }
body.rs .woocommerce-message::before, body.rs .woocommerce-info::before, body.rs .woocommerce-error::before{ color: var(--ks-ink); }

/* Tables (cart, order review) */
body.rs table th{ font-weight: 700; color: var(--ks-ink); background: transparent; }
body.rs table td, body.rs table th{ background: transparent; border-bottom: 1px solid var(--ks-line); }
body.rs table tbody tr:nth-child(2n) td{ background: transparent; }
body.rs .cart_totals h2, body.rs #order_review_heading, body.rs .woocommerce-billing-fields h3{ font-size: 1.4rem; }
body.rs #payment, body.rs #payment .payment_methods li, body.rs #payment .place-order{ background: var(--ks-paper-sunk); }
body.rs .storefront-breadcrumb{ background: transparent; }

/* ---------------------------------------------------------------- header */
body.rs #masthead.site-header{
  position: fixed; top: var(--wp-admin--admin-bar--height, 0px); left: 0; right: 0; z-index: 60;
  margin: 0; padding: 0; border: 0; background: var(--ks-band); color: var(--ks-on-band);
  transition: background-color 380ms var(--ks-ease), box-shadow 380ms var(--ks-ease);
}
body.rs #masthead.site-header.is-stuck{
  background: rgb(17 14 11 / 0.9); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
  box-shadow: 0 1px 0 rgb(255 240 220 / 0.07);
}
.rs-header-in{ display: flex; align-items: center; gap: clamp(1rem, 3vw, 2.5rem); height: var(--rs-header-h); }
.rs-brand{ display: block; flex: none; }
.rs-brand-img{ display: block; height: 1.9rem; width: auto; }
.rs-nav{ flex: 1; display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; }
.rs-nav-list{ list-style: none; margin: 0; padding: 0; display: flex; align-items: center; gap: clamp(0.25rem, 1.5vw, 1.25rem); }
.rs-nav-list > li{ position: relative; margin: 0; }
body.rs .rs-nav-a{
  display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.6rem 0.5rem; color: var(--ks-on-band);
  font-weight: 600; font-size: 0.95rem; text-decoration: none; position: relative;
}
.rs-nav-a::after{
  content: ''; position: absolute; left: 0.5rem; right: 0.5rem; bottom: 0.25rem; height: 3px; background: var(--ks-tape);
  transform: scaleX(0); transform-origin: 0 50%; transition: transform 320ms var(--ks-ease);
}
.rs-nav-a:hover::after, .rs-nav-a[aria-current="page"]::after, .rs-nav-has:focus-within > .rs-nav-a::after, .rs-nav-has:hover > .rs-nav-a::after{ transform: scaleX(1); }
body.rs .rs-nav-a:hover{ color: var(--ks-on-band); }
body.rs .rs-nav-a:focus-visible, body.rs .rs-cart:focus-visible, body.rs .rs-brand:focus-visible,
body.rs .rs-nav-sub a:focus-visible, body.rs .rs-burger:focus-visible, body.rs .rs-footer a:focus-visible,
body.rs .rs-header .rs-btn:focus-visible{ outline: 3px solid var(--ks-tape); outline-offset: 3px; }

.rs-nav-sub{
  position: absolute; top: 100%; left: -0.75rem; min-width: 15rem; padding: 0.75rem;
  background: var(--ks-band); border-radius: 0 0 var(--ks-r-core) var(--ks-r-core); border-top: 2px solid var(--ks-tape);
  opacity: 0; visibility: hidden; transform: translateY(-6px);
}
/* It eases in and leaves at once: nothing lingers half-shown when the pointer has moved on. */
.rs-nav-has:hover > .rs-nav-sub, .rs-nav-has:focus-within > .rs-nav-sub{
  opacity: 1; visibility: visible; transform: none;
  transition: opacity 220ms var(--ks-ease), transform 220ms var(--ks-ease);
}
.rs-nav-sub ul{ list-style: none; margin: 0; padding: 0; }
body.rs .rs-nav-sub a{
  display: block; padding: 0.55rem 0.75rem; border-radius: var(--ks-r-pill); color: var(--ks-on-band); font-weight: 600; font-size: 0.95rem; text-decoration: none;
}
body.rs .rs-nav-sub a:hover{ background: rgb(255 255 255 / 0.1); color: var(--ks-on-band); }
.rs-nav-sub-h{
  margin: 0.6rem 0 0.2rem; padding: 0.75rem 0.75rem 0; border-top: 1px solid rgb(255 255 255 / 0.14);
  font-family: var(--ks-mono); font-size: 0.7rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--ks-on-band-2);
}

.rs-nav-actions{ display: flex; align-items: center; gap: 1.25rem; }
body.rs .rs-cart{ display: inline-flex; align-items: center; gap: 0.5rem; color: var(--ks-on-band); font-weight: 600; font-size: 0.95rem; text-decoration: none; }
body.rs .rs-cart:hover{ color: var(--ks-on-band); }
.rs-cart-n{
  display: inline-grid; place-items: center; min-width: 1.5rem; height: 1.5rem; padding: 0 0.35rem; border-radius: 999px;
  background: var(--ks-tape); color: var(--ks-on-tape); font-family: var(--ks-mono); font-size: 0.75rem; line-height: 1;
}
.rs-cart-n.is-empty{ background: rgb(255 255 255 / 0.16); color: var(--ks-on-band); }

.rs-burger{ display: none; }

@media (max-width: 860px){
  :root{ --rs-header-h: 4rem; }
  .rs-brand-img{ height: 1.6rem; }
  body.rs .rs-burger{
    display: grid; place-items: center; margin-left: auto; width: 2.75rem; height: 2.75rem; padding: 0; border: 0; border-radius: var(--ks-r-pill);
    background: transparent; color: var(--ks-on-band); cursor: pointer; box-shadow: none;
  }
  body.rs .rs-burger:hover{ background: rgb(255 255 255 / 0.1); }
  .rs-burger-bars{ position: relative; width: 1.4rem; height: 0.7rem; }
  .rs-burger-bars i{ position: absolute; left: 0; right: 0; height: 2px; background: currentColor; transition: transform 320ms var(--ks-ease), top 320ms var(--ks-ease); }
  .rs-burger-bars i:first-child{ top: 0; }
  .rs-burger-bars i:last-child{ top: calc(100% - 2px); }
  .rs-header.is-open .rs-burger-bars i:first-child{ top: calc(50% - 1px); transform: rotate(45deg); }
  .rs-header.is-open .rs-burger-bars i:last-child{ top: calc(50% - 1px); transform: rotate(-45deg); }

  .rs-nav{
    position: fixed; top: calc(var(--rs-header-h) + var(--wp-admin--admin-bar--height, 0px)); left: 0; right: 0; bottom: 0;
    flex-direction: column; align-items: stretch; justify-content: flex-start; gap: 1.5rem;
    padding: 1.5rem var(--rs-gutter) 2rem; background: var(--ks-band); overflow-y: auto;
    opacity: 0; visibility: hidden; transform: translateY(-8px);
    transition: opacity 260ms var(--ks-ease), transform 260ms var(--ks-ease), visibility 0s linear 260ms;
  }
  .rs-header.is-open .rs-nav{ opacity: 1; visibility: visible; transform: none; transition-delay: 0s; }
  body.rs.rs-menu-open{ overflow: hidden; }
  body.rs.rs-menu-open #masthead.site-header{ background: var(--ks-band); }
  .rs-nav-list{ flex-direction: column; align-items: stretch; gap: 0; }
  .rs-nav-list > li{ border-bottom: 1px solid rgb(255 255 255 / 0.12); }
  body.rs .rs-nav-a{ display: flex; justify-content: space-between; padding: 1.1rem 0; font-size: 1.6rem; font-weight: 800; letter-spacing: -0.02em; }
  .rs-nav-a::after{ display: none; }
  .rs-nav-a svg{ display: none; }
  .rs-nav-sub{
    position: static; min-width: 0; padding: 0 0 1rem; border: 0; border-radius: 0; background: transparent;
    opacity: 1; visibility: visible; transform: none; transition: none;
  }
  body.rs .rs-nav-sub a{ padding: 0.5rem 0; color: var(--ks-on-band-2); font-size: 1.05rem; }
  .rs-nav-sub-h{ padding-left: 0; padding-right: 0; }
  .rs-nav-actions{ flex-direction: column; align-items: stretch; gap: 1rem; margin-top: auto; }
  body.rs .rs-cart{ justify-content: space-between; padding: 0.5rem 0; font-size: 1.05rem; }
  body.rs .rs-nav-actions .rs-btn{ min-height: 3.2rem; font-size: 1rem; }
}

/* ---------------------------------------------------------------- footer */
body.rs .site-footer{
  background: var(--ks-band); color: var(--ks-on-band-2); border: 0; margin: 0;
  padding: clamp(3rem, 7vw, 5.5rem) 0 2rem; border-top: 1px solid var(--ks-line);
}
.rs-footer-top{
  display: grid; grid-template-columns: minmax(0, 1.6fr) repeat(3, minmax(0, 1fr)); gap: clamp(1.5rem, 4vw, 4rem);
  padding-bottom: clamp(2rem, 5vw, 3.5rem);
}
.rs-footer-logo{ display: block; height: 2.2rem; width: auto; }
.rs-footer-brand p{ margin: 1.25rem 0 1.5rem; max-width: 34ch; color: var(--ks-on-band-2); line-height: 1.55; }
body.rs .site-footer .rs-footer .rs-footer-col h2{
  margin: 0 0 1rem; font-family: var(--ks-mono); font-weight: 500; font-size: 0.75rem; letter-spacing: 0.08em;
  text-transform: uppercase; color: var(--ks-on-band-2);
}
.rs-footer-col ul{ list-style: none; margin: 0; padding: 0; display: grid; gap: 0.6rem; }
body.rs .site-footer .rs-footer .rs-footer-col a:not(.button){
  color: var(--ks-on-band); font-weight: 600; text-decoration: none; padding-bottom: 2px;
  background: linear-gradient(var(--ks-tape), var(--ks-tape)) 0 100% / 0 2px no-repeat; transition: background-size 320ms var(--ks-ease);
}
body.rs .site-footer .rs-footer .rs-footer-col a:not(.button):hover{ color: var(--ks-on-band); background-size: 100% 2px; }
body.rs .site-footer .rs-footer a.rs-btn:not(.button){ color: var(--ks-on-tape); }
.rs-footer-base{
  margin: 0; padding-top: 1.5rem; border-top: 1px solid rgb(255 255 255 / 0.14);
  font-family: var(--ks-mono); font-size: 0.75rem; letter-spacing: 0.06em; text-transform: uppercase; color: var(--ks-on-band-2);
}
.rs-footer-base span{ color: var(--ks-tape); margin: 0 0.5rem; }
@media (max-width: 860px){
  .rs-footer-top{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .rs-footer-brand{ grid-column: 1 / -1; }
}

/* ---------------------------------------------------------------- motion
 * A rise on scroll, fired once. The start state exists only when the script is running (html.rs-js)
 * and the visitor has not asked for less motion, so the page is complete without either.
 */
@media (prefers-reduced-motion: no-preference){
  .rs-js [data-rs-reveal]{
    opacity: 0; transform: translateY(28px);
    transition: opacity 800ms var(--ks-ease), transform 800ms var(--ks-ease);
    transition-delay: var(--rs-d, 0ms);
  }
  .rs-js [data-rs-reveal].is-in{ opacity: 1; transform: none; }

  /* Things that arrive with the page (the hero): a cascade, no scrolling needed. */
  [data-rs-load]{ animation: rs-rise 900ms var(--ks-ease) both; animation-delay: calc(var(--i, 0) * 110ms + 200ms); }
  .rs-line{ display: inline-block; overflow: hidden; vertical-align: bottom; padding-bottom: 0.08em; margin-bottom: -0.08em; }
  .rs-line > span{ display: inline-block; animation: rs-line 1000ms var(--ks-ease-s) both; animation-delay: calc(var(--i, 0) * 110ms + 200ms); }
}
@keyframes rs-rise{ from{ opacity: 0; transform: translateY(26px); } to{ opacity: 1; transform: none; } }
@keyframes rs-line{ from{ transform: translateY(105%); } to{ transform: none; } }
@keyframes rs-kenburns{ from{ transform: scale(1.08); } to{ transform: scale(1); } }
@keyframes rs-marquee{ to{ transform: translateX(-50%); } }
@keyframes rs-drop{ 0%{ transform: scaleY(0); transform-origin: 50% 0; } 50%{ transform: scaleY(1); transform-origin: 50% 0; } 51%{ transform-origin: 50% 100%; } 100%{ transform: scaleY(0); transform-origin: 50% 100%; } }