/* Heading face, embedded so it also loads when the pages are opened as local files
   (Safari treats a local file as having no origin and blocks font files, not data URIs).
   Archivo 800, latin subset only, SIL Open Font License; 14 KB WOFF2, 19 KB as base64. */
@font-face {
  font-family: "Archivo";
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url(data:font/woff2;base64,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) 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;
}

/* =========================================================================
   Futebolindo Soccer Training — site stylesheet
   Pure CSS, no framework, mobile-first. Cascade layers manage specificity so
   nothing here needs !important (the reduced-motion block is the one exception).
   ========================================================================= */

@layer reset, tokens, base, layout, components, utilities;

/* =========================================================================
   RESET
   ========================================================================= */
@layer reset {
  *, *::before, *::after { box-sizing: border-box; }

  * { margin: 0; }

  html {
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
  }

  body { min-height: 100svh; }

  img, picture, svg, video {
    display: block;
    max-width: 100%;
  }

  input, button, textarea, select {
    font: inherit;
    color: inherit;
    letter-spacing: inherit;
  }

  button {
    background: none;
    border: none;
    cursor: pointer;
  }

  a { color: inherit; }

  ul[class] {
    list-style: none;
    padding: 0;
  }
}

/* =========================================================================
   TOKENS
   ========================================================================= */
@layer tokens {
  :root {
    color-scheme: light;

    /* ---- Brand colour (from the shield logo: black, white, gold stars, gold-white-green stripe) ---- */
    --color-black:          oklch(0.12 0.005 150);   /* #050605 header, footer, dark bands */
    --color-black-surface:  oklch(0.20 0.008 150);   /* cards and panels on black */
    --color-black-border:   oklch(0.32 0.01 150);    /* hairlines on black */
    --color-on-black:       oklch(1 0 0);            /* white text on black */
    --color-on-black-muted: oklch(0.78 0.02 100);    /* #bab8aa secondary text on black, 9.9:1 */

    --color-ink:            oklch(0.15 0.01 150);    /* #080c09 body text on paper */
    --color-ink-muted:      oklch(0.40 0.02 150);    /* #404b42 secondary text on paper, 9.1:1 */
    --color-paper:          oklch(0.985 0.003 110);  /* #fafaf8 page background */
    --color-surface:        oklch(0.96 0.006 110);   /* cards on paper */
    --color-border:         oklch(0.88 0.006 110);   /* hairlines on paper */

    --color-gold:           oklch(0.80 0.16 99.5);   /* #d7bf1f primary buttons (black text 10.7:1), gold text on black 10:1. Never text on white. */
    --color-gold-hover:     oklch(from var(--color-gold) calc(l + 0.05) c h); /* l is a 0-1 number in relative colour syntax; a % here invalidates the whole value */
    --color-green:          oklch(0.50 0.17 146);    /* #007a14 fills with white text 5.5:1; green text on paper 5.5:1, on card surfaces 4.9:1 */
    --color-green-hover:    oklch(from var(--color-green) calc(l - 0.05) c h);
    --color-green-bright:   oklch(0.65 0.186 146);   /* #24aa3d, the live site's green; decorative on black only, never text */

    /* the three-band stripe from the foot of the shield */
    --stripe-on-black: linear-gradient(to right, var(--color-gold) 0 33.4%, var(--color-on-black) 33.4% 66.7%, var(--color-green-bright) 66.7%);
    --stripe-on-paper: linear-gradient(to right, var(--color-gold) 0 33.4%, var(--color-ink) 33.4% 66.7%, var(--color-green) 66.7%);
    --stripe-vertical-on-paper: linear-gradient(to bottom, var(--color-gold) 0 33.4%, var(--color-ink) 33.4% 66.7%, var(--color-green) 66.7%);

    /* ---- Spacing ---- */
    --gutter: clamp(1rem, 4vw, 2.5rem);
    --content-width: 72rem;

    --space-2xs: 0.5rem;
    --space-xs:  0.75rem;
    --space-sm:  1rem;
    --space-md:  1.5rem;
    --space-lg:  2.5rem;
    --space-xl:  clamp(3rem, 5vw + 1rem, 5rem);
    --space-2xl: clamp(3.5rem, 6vw + 1rem, 7rem);

    /* ---- Radii and shadows ---- */
    --radius-sm: 4px;
    --radius-md: 8px;
    --shadow-md: 0 14px 32px -12px oklch(0 0 0 / 0.35);

    /* ---- Type ---- */
    --font-display: "Archivo", "Helvetica Neue", Arial, sans-serif;
    --font-body: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;

    --step--1: clamp(0.8125rem, 0.78rem + 0.15vw, 0.875rem);
    --step-0:  1rem;
    --step-1:  clamp(1.125rem, 1.05rem + 0.3vw, 1.25rem);
    --step-2:  clamp(1.375rem, 1.25rem + 0.5vw, 1.75rem);
    --step-3:  clamp(1.75rem, 1.45rem + 1.2vw, 2.375rem);
    --step-4:  clamp(2.125rem, 1.6rem + 2.2vw, 3.25rem);
    --step-5:  clamp(2.5rem, 1.7rem + 3.6vw, 4.5rem);

    /* ---- Motion ---- */
    --transition-fast: 150ms ease;
    --transition-base: 220ms ease;

    --header-height: 4.5rem;

    /* focus ring colour follows the background; dark contexts override it */
    --focus-ring: var(--color-green);
  }
}

/* =========================================================================
   BASE — element defaults
   ========================================================================= */
@layer base {
  html { scroll-padding-top: calc(var(--header-height) + 1rem); }

  body {
    background: var(--color-paper);
    color: var(--color-ink);
    font-family: var(--font-body);
    font-size: var(--step-0);
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
  }

  h1, h2, h3, h4 {
    font-family: var(--font-display);
    font-weight: 800;
    line-height: 1.05;
    letter-spacing: -0.01em;
    text-wrap: balance;
  }

  h1 { font-size: var(--step-5); }
  h2 { font-size: var(--step-4); }
  h3 { font-size: var(--step-2); }

  p { text-wrap: pretty; }

  a {
    text-decoration-thickness: 0.08em;
    text-underline-offset: 0.18em;
    transition: color var(--transition-fast);
  }

  :focus-visible {
    outline: 3px solid var(--focus-ring);
    outline-offset: 3px;
  }

  ::selection {
    background: var(--color-gold);
    color: var(--color-black);
  }

  /* Facts the owner still has to confirm. Loud on purpose: they must not survive to launch. */
  mark.todo {
    background: oklch(0.93 0.19 100);
    color: var(--color-black);
    padding: 0.05em 0.3em;
    border-radius: var(--radius-sm);
    outline: 2px dashed oklch(0.55 0.15 60);
    outline-offset: 1px;
    font-style: normal;
    box-decoration-break: clone;
  }
}

/* =========================================================================
   LAYOUT
   ========================================================================= */
@layer layout {
  .container {
    width: min(100% - 2 * var(--gutter), var(--content-width));
    margin-inline: auto;
  }

  .section {
    padding-block: var(--space-xl);

    & + & { padding-block-start: 0; }
  }

  .section--dark {
    --focus-ring: var(--color-gold);
    background: var(--color-black);
    color: var(--color-on-black);

    & + .section--dark { padding-block-start: var(--space-xl); }
  }

  .section__head {
    max-width: 44rem;
    margin-block-end: var(--space-lg);

    & > * + * { margin-block-start: var(--space-sm); }
  }

  /* two columns from 48rem, stacked below */
  .split {
    display: grid;
    gap: var(--space-lg);
    align-items: start;

    @media (min-width: 48rem) {
      grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
      gap: var(--space-xl);
    }
  }

  .flow > * + * { margin-block-start: var(--space-sm); }

  .actions {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-xs) var(--space-sm);
    align-items: center;
    margin-block-start: var(--space-md);
  }
}

/* =========================================================================
   COMPONENTS
   ========================================================================= */
@layer components {

  /* ---- Skip link ---- */
  .skip-link {
    position: absolute;
    inset-inline-start: var(--gutter);
    top: -100%;
    z-index: 100;
    padding: 0.75rem 1rem;
    background: var(--color-gold);
    color: var(--color-black);
    font-weight: 700;
    border-radius: 0 0 var(--radius-md) var(--radius-md);
    text-decoration: none;

    &:focus-visible {
      top: 0;
      outline-color: var(--color-black);
    }
  }

  /* ---- Kicker, stripe ---- */
  .kicker {
    display: block;
    font-size: var(--step--1);
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--color-green);

    .section--dark &, .hero &, .page-head &, .site-footer & { color: var(--color-gold); }
  }

  .stripe {
    display: block;
    width: 4.5rem;
    height: 6px;
    border-radius: 3px;
    background: var(--stripe-on-paper);

    .section--dark &, .hero &, .page-head & { background: var(--stripe-on-black); }
  }

  /* ---- Buttons ---- */
  .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    min-height: 3rem;
    padding: 0.6rem 1.5rem;
    border: 2px solid transparent;
    border-radius: var(--radius-md);
    font-weight: 700;
    line-height: 1.2;
    text-decoration: none;
    transition: background-color var(--transition-fast), color var(--transition-fast), border-color var(--transition-fast), transform var(--transition-fast);

    &:hover { transform: translateY(-1px); }
    &:active { transform: translateY(0); }

    & .icon { flex: none; }
  }

  .btn--primary {
    background: var(--color-gold);
    border-color: var(--color-gold);
    color: var(--color-black);

    &:hover, &:focus-visible {
      background: var(--color-gold-hover);
      border-color: var(--color-gold-hover);
    }
  }

  .btn--secondary {
    background: var(--color-green);
    border-color: var(--color-green);
    color: var(--color-on-black);

    &:hover, &:focus-visible {
      background: var(--color-green-hover);
      border-color: var(--color-green-hover);
    }
  }

  /* white outline, for use on black only */
  .btn--outline {
    background: transparent;
    border-color: var(--color-on-black);
    color: var(--color-on-black);

    &:hover, &:focus-visible {
      background: var(--color-on-black);
      color: var(--color-black);
    }
  }

  /* ---- Icons (inline SVG, currentColor) ---- */
  .icon {
    width: 1.25em;
    height: 1.25em;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.75;
    stroke-linecap: round;
    stroke-linejoin: round;
  }

  .icon--lg {
    width: 2.5rem;
    height: 2.5rem;
    stroke-width: 1.5;
  }

  /* ---- Arrow link ---- */
  .link-arrow {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    min-height: 2.75rem;
    font-weight: 700;
    color: var(--color-green);
    text-decoration: none;

    & .icon { transition: transform var(--transition-fast); }

    &:hover {
      text-decoration: underline;

      & .icon { transform: translateX(3px); }
    }

    .section--dark & { color: var(--color-gold); }
  }

  /* ---- Header ---- */
  .site-header {
    --focus-ring: var(--color-gold);
    position: sticky;
    top: 0;
    z-index: 50;
    background: var(--color-black);
    color: var(--color-on-black);
    border-block-end: 1px solid var(--color-black-border);
  }

  .site-header__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-sm);
    min-height: var(--header-height);
  }

  .brand {
    display: inline-flex;
    align-items: center;
    gap: 0.75rem;
    min-height: 2.75rem;
    text-decoration: none;

    &:hover .brand__name { color: var(--color-gold); }

    & img {
      width: auto;
      height: 2.75rem;
    }
  }

  .brand__name {
    font-family: var(--font-display);
    font-weight: 800;
    font-size: var(--step-1);
    line-height: 1.05;
    letter-spacing: -0.01em;
    max-width: 9rem;
    text-wrap: balance;
    transition: color var(--transition-fast);

    @media (min-width: 30rem) { max-width: none; }
  }

  .nav-toggle {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    min-height: 2.75rem;
    min-width: 2.75rem;
    padding: 0.5rem 0.75rem;
    border-radius: var(--radius-md);
    font-weight: 700;
    color: var(--color-on-black);

    &:hover { background: var(--color-black-surface); }

    & .icon { width: 1.5rem; height: 1.5rem; }

    /* the two icons swap with aria-expanded */
    & .icon--close { display: none; }
    &[aria-expanded="true"] .icon--menu { display: none; }
    &[aria-expanded="true"] .icon--close { display: block; }

    @media (min-width: 50rem) { display: none; }
  }

  /* The panel is absolutely positioned against the header, which is sticky and therefore
     a containing block; without that it would measure against the viewport. */
  .primary-nav {
    display: none;
    position: absolute;
    inset-inline: 0;
    top: 100%;
    background: var(--color-black);
    border-block-end: 1px solid var(--color-black-border);
    box-shadow: var(--shadow-md);

    &.is-open { display: block; }

    @media (min-width: 50rem) {
      display: block;
      position: static;
      background: none;
      border: 0;
      box-shadow: none;
    }
  }

  .nav-list {
    display: flex;
    flex-direction: column;
    padding: var(--space-xs) var(--gutter) var(--space-md);
    gap: 0.25rem;

    & a:not(.btn) {
      display: flex;
      align-items: center;
      min-height: 2.75rem;
      padding: 0.5rem 0.75rem;
      border-radius: var(--radius-md);
      font-weight: 700;
      text-decoration: none;
      transition: background-color var(--transition-fast), color var(--transition-fast);

      &:hover { background: var(--color-black-surface); text-decoration: underline; text-decoration-color: var(--color-gold); }

      &[aria-current="page"] {
        color: var(--color-gold);
        text-decoration: underline;
        text-decoration-thickness: 2px;
      }
    }

    & .btn { margin-block-start: var(--space-xs); }

    @media (min-width: 50rem) {
      flex-direction: row;
      align-items: center;
      padding: 0;
      gap: 0.25rem;

      & .btn {
        margin-block-start: 0;
        margin-inline-start: 0.75rem;
        min-height: 2.75rem;
        padding-block: 0.4rem;
        white-space: nowrap;
      }
    }
  }

  /* ---- Hero (homepage) ---- */
  .hero {
    --focus-ring: var(--color-gold);
    position: relative;
    isolation: isolate;
    display: flex;
    align-items: flex-end;
    height: min(78svh, 46rem);    /* explicit height; aspect-ratio + max-height makes WebKit shrink the width */
    min-height: 32rem;
    background: var(--color-black);
    color: var(--color-on-black);

    & .hero__media,
    & .hero__media img {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      z-index: 0;
    }

    & .hero__media img {
      object-fit: cover;
      object-position: 50% 62%;
    }

    /* overlay: z-index 1, above the photo, below the text */
    &::after {
      content: "";
      position: absolute;
      inset: 0;
      z-index: 1;
      background:
        linear-gradient(to top, oklch(0.12 0.005 150 / 0.94) 0%, oklch(0.12 0.005 150 / 0.72) 42%, oklch(0.12 0.005 150 / 0.2) 100%),
        linear-gradient(to right, oklch(0.12 0.005 150 / 0.55), transparent 70%);
    }
  }

  .hero .container {
    position: relative;
    z-index: 2;
  }

  /* the one-page layout uses the photo as a shorter band with a heading, not a full hero */
  .hero--short {
    height: min(60svh, 34rem);
    min-height: 24rem;
  }

  .hero__content {
    padding-block: var(--space-lg) var(--space-xl);
    max-width: 44rem;
    animation: rise 600ms ease-out both;

    & > * + * { margin-block-start: var(--space-sm); }

    & h1 { margin-block-start: var(--space-xs); }

    & .actions { margin-block-start: var(--space-md); }
  }

  @keyframes rise {
    from { opacity: 0; transform: translateY(12px); }
    to   { opacity: 1; transform: none; }
  }

  /* ---- Page head (inner pages, no photo) ---- */
  .page-head {
    --focus-ring: var(--color-gold);
    background: var(--color-black);
    color: var(--color-on-black);
    padding-block: var(--space-xl);
    background-image:
      radial-gradient(circle at 92% 50%, transparent 0 7.5rem, oklch(1 0 0 / 0.07) 7.5rem calc(7.5rem + 2px), transparent calc(7.5rem + 2px)),
      linear-gradient(to right, transparent calc(92% - 1px), oklch(1 0 0 / 0.07) calc(92% - 1px) calc(92% + 1px), transparent calc(92% + 1px));

    & .container > * + * { margin-block-start: var(--space-sm); }
    & h1 { margin-block-start: var(--space-xs); }
    & p { max-width: 40rem; font-size: var(--step-1); color: var(--color-on-black-muted); }
  }

  /* ---- Cards ---- */
  .cards {
    display: grid;
    gap: var(--space-md);
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 18rem), 1fr));
  }

  /* each card is its own query container; the inner wrapper is what changes layout */
  .card {
    container-type: inline-size;
    padding: var(--space-md);
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    transition: border-color var(--transition-fast);

    &:hover { border-color: var(--color-green); }
  }

  /* photo on the card: 3:4 so a portrait subject is shown whole; bleeds to the card edge */
  .card__media {
    margin: calc(-1 * var(--space-md)) calc(-1 * var(--space-md)) var(--space-sm);
    border-radius: var(--radius-md) var(--radius-md) 0 0;
    overflow: hidden;
    aspect-ratio: 3 / 4;
    background: var(--color-border);

    & picture { height: 100%; }
    & img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 50%; }
  }

  .card__inner {
    display: flex;
    flex-direction: column;
    height: 100%;

    /* when the card is wide enough, the photo stands on the left at full card height */
    @container (min-width: 30rem) {
      display: grid;
      grid-template-columns: 13rem 1fr;
      column-gap: var(--space-md);

      & .card__media {
        margin: calc(-1 * var(--space-md)) 0 calc(-1 * var(--space-md)) calc(-1 * var(--space-md));
        border-radius: var(--radius-md) 0 0 var(--radius-md);
        aspect-ratio: auto;
        min-height: 17rem;
        height: calc(100% + 2 * var(--space-md));
      }
    }
  }

  .card__body {
    display: flex;
    flex-direction: column;
    gap: var(--space-xs);
    height: 100%;

    & .icon--lg { color: var(--color-green); }
    & h3 { margin-block-start: var(--space-2xs); }
    & p { color: var(--color-ink-muted); }
    & .link-arrow { margin-block-start: auto; padding-block-start: var(--space-2xs); }
  }

  /* ---- Pricing band (black, pitch lines) ---- */
  .band {
    --focus-ring: var(--color-gold);
    background-color: var(--color-black);
    background-image:
      radial-gradient(circle at 88% 50%, transparent 0 9rem, oklch(1 0 0 / 0.08) 9rem calc(9rem + 2px), transparent calc(9rem + 2px)),
      linear-gradient(to right, transparent calc(88% - 1px), oklch(1 0 0 / 0.08) calc(88% - 1px) calc(88% + 1px), transparent calc(88% + 1px)),
      linear-gradient(to bottom, oklch(1 0 0 / 0.08) 0 2px, transparent 2px 100%);
    color: var(--color-on-black);
    padding-block: var(--space-xl);

    & .band__inner {
      max-width: 44rem;

      & > * + * { margin-block-start: var(--space-sm); }
      & h2 { margin-block-start: var(--space-xs); }
      & p { font-size: var(--step-1); }
      & p + p { color: var(--color-on-black-muted); font-size: var(--step-0); }
    }
  }

  /* ---- Contact card ---- */
  .contact-card {
    container-type: inline-size;
    padding: var(--space-md) var(--space-md) var(--space-md) calc(var(--space-md) + 6px);
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-left: 0;
    border-radius: var(--radius-md);
    position: relative;
    isolation: isolate;
    overflow: hidden;

    /* the stripe as a left edge */
    &::before {
      content: "";
      position: absolute;
      inset-block: 0;
      inset-inline-start: 0;
      width: 6px;
      z-index: 1;
      background: var(--stripe-vertical-on-paper);
    }

    & .contact-card__who {
      display: flex;
      align-items: center;
      gap: var(--space-sm);
    }

    & .contact-card__avatar {
      flex: none;
      width: 4.5rem;
      height: 4.5rem;
      border-radius: 50%;
      overflow: hidden;

      & picture { height: 100%; }
      & img { width: 100%; height: 100%; object-fit: cover; }
    }

    & .contact-card__name {
      font-family: var(--font-display);
      font-weight: 800;
      font-size: var(--step-2);
      line-height: 1.1;
    }

    & ul {
      margin-block-start: var(--space-sm);
      display: grid;
      gap: 0.25rem;
    }

    & li {
      display: flex;
      align-items: center;
      gap: 0.6rem;
      min-height: 2.75rem;
      color: var(--color-ink-muted);

      & .icon { color: var(--color-green); flex: none; }
    }

    & a:not(.btn) {
      display: inline-flex;
      align-items: center;
      min-height: 2.75rem;       /* the inline link is the tap target, not the row around it */
      color: var(--color-ink);
      font-weight: 600;
      overflow-wrap: anywhere;

      &:hover { color: var(--color-green); }
    }

    & .actions { margin-block-start: var(--space-sm); }

    @container (max-width: 28rem) {
      & .actions .btn { width: 100%; }
    }

    @container (min-width: 30rem) {
      & ul { grid-template-columns: 1fr 1fr; }
    }
  }

  /* ---- Service sections (training page) ---- */
  .service {
    display: grid;
    gap: var(--space-md);
    padding: var(--space-lg);
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);

    & + & { margin-block-start: var(--space-md); }

    & .service__icon { color: var(--color-green); }

    & .service__media {
      border-radius: var(--radius-md);
      overflow: hidden;
      aspect-ratio: 3 / 4;
      background: var(--color-border);

      & picture { height: 100%; }
      & img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 50%; }
    }

    @media (min-width: 48rem) {
      grid-template-columns: 4rem 1fr minmax(14rem, 20rem);
      column-gap: var(--space-lg);
      align-items: start;

      & .service__media { grid-column: 3; grid-row: 1; }
    }
  }

  .service__body {
    & > * + * { margin-block-start: var(--space-sm); }
    & .lead { font-size: var(--step-1); font-weight: 600; }
    & p:not(.lead) { color: var(--color-ink-muted); }
    & .actions { margin-block-start: var(--space-md); }
  }

  /* a row of photos: portrait tiles at 2:3, the one landscape frame spans two columns at 4:3;
     grid rows stretch every tile in a row to the same height. Two columns on phones, four from 48rem */
  .gallery {
    display: grid;
    gap: var(--space-xs);
    grid-template-columns: repeat(2, 1fr);
    grid-auto-flow: dense;
    margin-block-start: var(--space-lg);

    & figure {
      margin: 0;
      border-radius: var(--radius-md);
      overflow: hidden;
      aspect-ratio: 2 / 3;          /* keeps 84% of a phone-portrait frame */
      background: var(--color-border);
    }
    & .gallery__wide { grid-column: span 2; aspect-ratio: 11 / 8; }   /* two 2:3 tiles plus the gap, to the pixel at 276px tiles */
    & picture { height: 100%; }
    & img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 50%; }

    @media (min-width: 48rem) { grid-template-columns: repeat(4, 1fr); gap: var(--space-sm); }
  }

  .note {
    margin-block-start: var(--space-lg);
    max-width: 44rem;
    color: var(--color-ink-muted);
  }

  .where {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.6rem;
    padding-block-start: var(--space-md);
    border-block-start: 1px solid var(--color-border);

    & .icon { color: var(--color-green); }
    & .where__label { font-weight: 700; }
  }

  /* ---- Form ---- */
  .form {
    display: grid;
    gap: var(--space-sm);
    padding: var(--space-md);
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);

    & h2 { font-size: var(--step-2); }
  }

  .form-field {
    display: grid;
    gap: 0.35rem;

    & label { font-weight: 700; }

    & input, & textarea {
      width: 100%;
      min-height: 3rem;
      padding: 0.65rem 0.85rem;
      background: var(--color-paper);
      border: 1px solid oklch(0.62 0.01 150);
      border-radius: var(--radius-md);
      transition: border-color var(--transition-fast), box-shadow var(--transition-fast);

      &:hover { border-color: var(--color-ink-muted); }

      &:focus-visible {
        outline: 3px solid var(--color-green);
        outline-offset: 0;
        border-color: var(--color-green);
      }
    }

    & textarea { min-height: 9rem; resize: vertical; }
  }

  .form-row {
    display: grid;
    gap: var(--space-sm);

    @media (min-width: 36rem) { grid-template-columns: 1fr 1fr; }
  }

  /* honeypot: off-screen, never display:none so bots still fill it */
  .hp {
    position: absolute;
    left: -10000px;
    top: auto;
    width: 1px;
    height: 1px;
    overflow: hidden;
  }

  .required-note {
    font-size: var(--step--1);
    color: var(--color-ink-muted);
  }

  .notice {
    padding: var(--space-sm) var(--space-md);
    border-radius: var(--radius-md);
    border: 1px solid var(--color-green);
    background: oklch(0.95 0.04 146);
    color: var(--color-ink);
    font-weight: 600;

    &[data-state="error"] {
      border-color: oklch(0.55 0.2 30);
      background: oklch(0.95 0.03 30);
    }
  }

  /* ---- Footer ---- */
  .site-footer {
    --focus-ring: var(--color-gold);
    background: var(--color-black);
    color: var(--color-on-black-muted);
    border-block-start: 6px solid;
    border-image: var(--stripe-on-black) 1;
    padding-block: var(--space-xl) var(--space-lg);

    & a {
      color: var(--color-on-black);
      text-decoration: none;

      &:hover { text-decoration: underline; text-decoration-color: var(--color-gold); }
    }
  }

  .footer__grid {
    display: grid;
    gap: var(--space-lg);

    @media (min-width: 40rem) { grid-template-columns: 1.4fr 1fr 1fr; }
  }

  .footer__brand {
    display: inline-flex;
    align-items: center;
    gap: 0.75rem;
    min-height: 2.75rem;
    font-family: var(--font-display);
    font-weight: 800;
    font-size: var(--step-1);
    line-height: 1.05;

    &:hover { color: var(--color-gold); text-decoration: none; }

    & img { width: auto; height: 3.5rem; }
  }

  .footer__where {
    margin-block-start: var(--space-sm);
    display: flex;
    align-items: center;
    gap: 0.5rem;

    & .icon { color: var(--color-gold); flex: none; }
  }

  .footer__heading {
    font-family: var(--font-body);
    font-size: var(--step--1);
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--color-gold);
    margin-block-end: var(--space-xs);
  }

  .footer__list {
    display: grid;
    gap: 0.15rem;

    & a, & li {
      display: inline-flex;
      align-items: center;
      gap: 0.5rem;
      min-height: 2.75rem;
    }

    & .icon { color: var(--color-gold); flex: none; }

    & a[aria-current="page"] { color: var(--color-gold); }
  }

  .footer__bottom {
    margin-block-start: var(--space-lg);
    padding-block-start: var(--space-sm);
    border-block-start: 1px solid var(--color-black-border);
    font-size: var(--step--1);
  }

  /* ---- 404 ---- */
  .oops {
    padding-block: var(--space-2xl);
    text-align: center;

    & .oops__code {
      font-family: var(--font-display);
      font-weight: 800;
      font-size: var(--step-5);
      color: var(--color-green);
      line-height: 1;
    }

    & h1 { margin-block-start: var(--space-xs); }
    & .actions { justify-content: center; }
  }
}

/* =========================================================================
   UTILITIES
   ========================================================================= */
@layer utilities {
  .sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
  }

  .measure { max-width: 44rem; }
  .muted { color: var(--color-ink-muted); }
  .section--dark .muted { color: var(--color-on-black-muted); }
}

/* The one place !important is allowed: switch every animation and transition off. */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}