@font-face { font-family: 'General Sans'; font-style: normal; font-weight: 300; font-display: swap; src: url(../fonts/general-sans-1.woff2) format('woff2'); }
@font-face { font-family: 'General Sans'; font-style: normal; font-weight: 400; font-display: swap; src: url(../fonts/general-sans-2.woff2) format('woff2'); }
@font-face { font-family: 'General Sans'; font-style: normal; font-weight: 500; font-display: swap; src: url(../fonts/general-sans-3.woff2) format('woff2'); }
@font-face { font-family: 'General Sans'; font-style: normal; font-weight: 600; font-display: swap; src: url(../fonts/general-sans-4.woff2) format('woff2'); }
@font-face { font-family: 'General Sans'; font-style: normal; font-weight: 700; font-display: swap; src: url(../fonts/general-sans-5.woff2) format('woff2'); }

:root {
      /* Shared design values: brand, type, spacing, shape, and interaction. */
      /* Warm yellow scale: pale surfaces through stronger action states. */
      --yellow-50: #fffdf4;
      --yellow-100: #fff8df;
      --yellow-200: #fff0b5;
      --yellow-300: #ffe785;
      --yellow-500: #fedb4f;
      --yellow-600: #f4cc32;
      --yellow-700: #e8bf24;
      --brand-yellow: var(--yellow-500);
      --button-hover: var(--yellow-300);
      --button-pressed: var(--yellow-700);
      --gold-glow: rgb(254 219 79 / 18%);
      --section-warm: linear-gradient(135deg, var(--yellow-100), var(--yellow-200));
      --font-heading: 'General Sans', Arial, sans-serif;
      --font-body: 'General Sans', Arial, sans-serif;
      /* Typography scale: all sizes in one place. */
      --weight-regular: 400;
      --weight-medium: 500;
      --weight-semibold: 600;
      --weight-bold: 700;
      --text-note: 13px;
      --text-caption: 14px;
      --text-secondary: 16px;
      --text-xs: 14px;
      --text-sm: 16px;
      --text-menu: 16px;
      --text-button: 16px;
      --text-body: 18px;
      --text-lead: 20px;
      --heading-1: 56px;
      --heading-2: 36px;
      --heading-3: 28px;
      --heading-4: 24px;
      --heading-5: 20px;
      --heading-6: 18px;
      --space-1: 4px;
      --space-2: 8px;
      --space-3: 12px;
      --space-4: 16px;
      --space-6: 24px;
      --space-8: 32px;
      --space-10: 40px;
      /* UrusGold DNA: generous whitespace and room to breathe. */
      --navbar-padding: 24px 48px;
      --footer-padding: 48px;
      --radius-container: 24px;
      --radius-pill: 999px;
      --motion-interaction: 180ms ease;
      --control-hover: rgb(45 45 37 / 6%);
      --control-pressed: rgb(45 45 37 / 12%);
      --brand-cream: #f7f4ec;
      --brand-sand: #f2ead7;
      --about-panel: var(--brand-sand);
      --eyebrow-color: #6b6b60;
      --brand-charcoal: #2d2d25;
      --page: var(--brand-cream);
      --surface: #ffffff;
      --loader-dim: rgb(247 244 236 / 98%);
      --error-color: #a33126;
      --input-background: var(--brand-cream);
      --text: var(--brand-charcoal);
      --logo-color: var(--brand-charcoal);
      --divider: #e8e5dc;
      --nav-ink: #000000;
      --navbar-shadow: 0 6px 18px -8px rgb(45 45 37 / 6%);
      --footer-shadow: 0 -6px 18px -8px rgb(45 45 37 / 6%);
      color-scheme: light;
    }

    :root[data-theme="dark"] {
      --page: var(--brand-charcoal);
      --surface: #38382f;
      --about-panel: #423e30;
      --eyebrow-color: #b8b8ac;
      --loader-dim: rgb(20 20 16 / 98%);
      --error-color: #ffb4a8;
      --input-background: #424239;
      --gold-glow: rgb(254 219 79 / 7%);
      --section-warm: linear-gradient(135deg, #38382f, #403b2c);
      --control-hover: rgb(247 244 236 / 8%);
      --control-pressed: rgb(247 244 236 / 14%);
      --text: var(--brand-cream);
      --logo-color: var(--brand-cream);
      --divider: #505047;
      --nav-ink: var(--brand-cream);
      --navbar-shadow: 0 6px 18px -8px rgb(0 0 0 / 16%);
      --footer-shadow: 0 -6px 18px -8px rgb(0 0 0 / 16%);
      color-scheme: dark;
    }

    * {
      box-sizing: border-box;
    }

    html,
    body {
      min-height: 100%;
      margin: 0;
      background-color: var(--page);
    }

    body {
      min-height: 100vh;
      min-height: 100svh;
      font-family: var(--font-body);
      font-size: var(--text-body);
      font-weight: var(--weight-regular);
      line-height: 1.6;
      color: var(--text);
      padding: 48px 20px;
    }

    .container {
      width: 100%;
      max-width: 800px;
      min-height: 400px;
      margin: 0 auto;
      padding: var(--space-8);
      background-color: var(--surface);
      border-radius: var(--radius-container);
    }

    .navbar {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: var(--space-6);
      position: sticky;
      top: 0;
      z-index: 10;
      margin: -32px -32px 0;
      padding: var(--navbar-padding);
      background: var(--surface);
      border-radius: var(--radius-container) var(--radius-container) 0 0;
      box-shadow: var(--navbar-shadow);
      transition: transform 220ms ease;
    }

    .navbar.is-hidden {
      transform: translateY(-100%);
      visibility: hidden;
      transition: transform 220ms ease, visibility 0s 220ms;
    }

    .brand-logo {
      overflow: visible;
      color: var(--logo-color);
      display: block;
      width: 156px;
      max-width: 100%;
      height: auto;
    }

    .nav-actions, .nav-links {
      display: flex;
      align-items: center;
      gap: 20px;
    }

    .nav-links {
      color: var(--nav-ink);
      font-size: var(--text-menu);
      font-weight: var(--weight-medium);
    }

    .nav-placeholder {
      opacity: 1;
      cursor: default;
    }

    .nav-links a {
      display: inline-flex;
      align-items: center;
      min-height: 44px;
      color: inherit;
      text-decoration: underline;
      text-decoration-color: transparent;
      text-decoration-thickness: 1px;
      text-underline-offset: 6px;
      transition: text-decoration-color var(--motion-interaction);
    }

    .nav-links a:not([aria-disabled="true"]):hover,
    .nav-links a:not([aria-disabled="true"]):active,
    .nav-links a[aria-current]:not([aria-current="false"]) {
      text-decoration-color: currentColor;
    }

    a:focus-visible,
    button:focus-visible {
      outline: 2px solid var(--text);
      outline-offset: var(--space-1);
    }

    button {
      font: inherit;
    }

    .waitlist-button {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      text-decoration: none;
      border: 0;
      border-radius: var(--radius-pill);
      padding: 10px 24px;
      min-height: 44px;
      line-height: 1.5;
      background: var(--brand-yellow);
      color: var(--brand-charcoal);
      font-size: var(--text-menu);
      font-weight: var(--weight-semibold);
      white-space: nowrap;
      cursor: pointer;
      transition: background-color var(--motion-interaction);
    }

    .waitlist-button:not(:disabled):hover {
      background-color: var(--button-hover);
    }

    .waitlist-button:not(:disabled):active {
      background-color: var(--button-pressed);
    }

    .waitlist-button:disabled {
      cursor: default;
      opacity: 1;
    }

    .theme-toggle {
      display: grid;
      place-items: center;
      width: 40px;
      height: 40px;
      flex-shrink: 0;
      padding: 0;
      border: 0;
      border-radius: 50%;
      background: transparent;
      color: var(--text);
      cursor: pointer;
      transition: color var(--motion-interaction);
    }

    .theme-toggle:not(:disabled):hover {
      color: var(--brand-yellow);
    }

    .theme-toggle:not(:disabled):active {
      color: var(--yellow-600);
    }

    .icon {
      width: 20px;
      height: 20px;
      flex-shrink: 0;
      fill: currentColor;
    }

    .theme-toggle svg { width: 20px; height: 20px; }

    .sun, [data-theme="dark"] .moon { display: none; }
    [data-theme="dark"] .sun { display: block; }

    .nav-panel { display: flex; align-items: center; gap: 20px; }
    .menu-toggle {
      display: none; width: 44px; height: 44px; padding: 10px;
      border: 0; background: transparent; color: var(--text); cursor: pointer;
    }
    .menu-toggle svg { width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }
    .menu-toggle:hover { color: var(--brand-yellow); }
    @media (max-width: 700px) {
      body { padding: 24px 16px; }
      .container { padding: 24px; }
      .navbar { gap: 12px; margin: -24px -24px 0; padding: 18px 24px; }
      .nav-actions { gap: 4px; width: auto; }
      .menu-toggle { display: grid; place-items: center; }
      .nav-panel {
        display: none; position: absolute; top: 100%; left: 0; right: 0;
        padding: 16px 24px 24px; background: var(--surface);
        box-shadow: var(--navbar-shadow); gap: 16px;
      }
      .navbar.menu-open .nav-panel { display: flex; flex-direction: column; align-items: stretch; }
      .nav-links { flex-direction: column; align-items: stretch; gap: 0; }
      .nav-panel .waitlist-button { align-self: flex-start; }
    }
    @media (prefers-reduced-motion: reduce) {
      .navbar, .navbar.is-hidden, .nav-links a, .waitlist-button, .theme-toggle { transition: none; }
    }
    h1, h2, h3, h4, h5, h6 {
      font-family: var(--font-heading);
      font-weight: var(--weight-semibold);
    }

    /* Full-width section surfaces within the shared outer container. */
    h1 { font-size: var(--heading-1); }
    h2 { font-size: var(--heading-2); }
    h3 { font-size: var(--heading-3); }
    h4 { font-size: var(--heading-4); }
    h5 { font-size: var(--heading-5); }
    h6 { font-size: var(--heading-6); }

    .section-warm {
      background: var(--section-warm);
    }

    .surface-card {
      background: var(--surface);
      border-radius: var(--radius-container);
      padding: var(--space-8);
    }

    .hero {
      margin: 0 -32px;
      padding: 96px 48px;
      text-align: center;
      background: radial-gradient(ellipse at 75% 70%, var(--gold-glow), transparent 65%), var(--surface);
    }

    .hero h1 {
      max-width: 620px;
      margin: 0 auto 24px;
      font-family: var(--font-heading);
      font-size: var(--heading-1);
      font-weight: var(--weight-semibold);
      line-height: 1.18;
      letter-spacing: -.025em;
      text-wrap: balance;
    }

    .hero-description {
      font-weight: var(--weight-regular);
      max-width: 580px;
      margin: 0 auto 32px;
      font-size: var(--text-body);
      line-height: 1.7;
      text-wrap: balance;
    }

    .hero .waitlist-button {
      padding: 15px 40px;
      font-size: var(--text-button);
    }

    .hero-note {
      font-weight: var(--weight-regular);
      max-width: 360px;
      margin: 16px auto 0;
      font-size: var(--text-note);
      line-height: 1.6;
      opacity: .7;
    }

    @media (max-width: 700px) {
      .hero { margin: 0 -24px; padding: 48px 24px; }
      .hero-description { font-size: var(--text-body); }
    }
    .keep-together { white-space: nowrap; }

    .site-footer {
      margin: 40px -32px -32px;
      padding: var(--footer-padding);
      background: var(--surface);
      box-shadow: var(--footer-shadow);
      border-radius: 0 0 var(--radius-container) var(--radius-container);
    }

    .footer-grid {
      display: grid;
      grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr) minmax(0, 1fr);
      gap: 32px;
      padding-bottom: 0;
    }

    .footer-logo-tile {
      display: grid;
      place-items: center;
      width: 56px;
      height: 56px;
      margin-bottom: 16px;
      border-radius: 14px;
      background: var(--brand-yellow);
    }

    .footer-mark {
      display: block;
      width: 48px;
      height: 48px;
      color: var(--brand-charcoal);
      margin: 0;
    }

    .footer-statement {
      margin: 0;
      font-size: var(--text-button);
      font-weight: var(--weight-regular);
      line-height: 1.65;
    }

    .footer-heading {
      margin: 0 0 8px;
      font-family: var(--font-body);
      font-size: var(--text-caption);
      font-weight: var(--weight-semibold);
      opacity: 1;
    }

    .footer-links {
      display: grid;
      gap: 0;
      margin: 0;
      padding: 0;
      list-style: none;
      font-size: var(--text-menu);
      line-height: 1.5;
    }

    .footer-links a {
      display: inline-flex;
      align-items: center;
      min-height: 32px;
      color: inherit;
      text-decoration: underline;
      text-decoration-color: transparent;
      text-underline-offset: 5px;
      transition: text-decoration-color var(--motion-interaction);
    }

    .footer-links a:not([aria-disabled="true"]):hover,
    .footer-links a:not([aria-disabled="true"]):active {
      text-decoration-color: currentColor;
    }

    .footer-copyright {
      margin: 0;
      padding: 24px 0;
      text-align: center;
      font-size: var(--text-xs);
      opacity: .75;
      line-height: 1.6;
    }

    @media (max-width: 700px) {
      .site-footer { margin: 32px -24px -24px; padding: 40px 24px; }
      .footer-grid { grid-template-columns: 1fr 1fr; gap: 32px 24px; }
      .footer-brand { grid-column: 1 / -1; }
    }

    .signup {
      margin: 0 -32px;
      padding: 80px 48px;
      background: var(--surface);
      text-align: center;
      scroll-margin-top: 120px;
    }

    .signup h2 {
      max-width: 440px;
      margin: 0 auto 16px;
      font-size: var(--heading-2);
      font-weight: var(--weight-semibold);
      line-height: 1.15;
      letter-spacing: -.025em;
      text-wrap: balance;
    }

    .signup-description {
      margin: 0 auto 28px;
      font-size: var(--text-body);
      font-weight: var(--weight-regular);
      line-height: 1.6;
    }

    .signup-form {
      max-width: 440px;
      margin: 0 auto;
      text-align: left;
    }

    .signup-form label {
      display: block;
      margin-bottom: 10px;
      font-size: var(--text-menu);
      font-weight: var(--weight-medium);
    }

    .signup-fields {
      display: flex;
      flex-direction: column;
      align-items: stretch;
      gap: 12px;
    }

    .signup-fields input {
      min-width: 0;
      flex: 1;
      border: 0;
      border-radius: var(--radius-pill);
      padding: 15px 20px;
      min-height: 54px;
      background: var(--input-background);
      color: var(--text);
      font: var(--weight-regular) var(--text-body) var(--font-body);
      transition: box-shadow var(--motion-interaction);
    }

    .signup-fields input::placeholder { color: var(--text); opacity: .5; }
    .signup-fields input:hover { box-shadow: inset 0 0 0 1px var(--divider); }
    .signup-fields input[aria-invalid="true"] { box-shadow: inset 0 0 0 2px var(--error-color); }
    .signup-feedback { margin: 12px 0 0; font-size: var(--text-caption); line-height: 1.5; color: var(--text); }
    .signup-feedback:empty { display: none; }
    .signup-feedback.is-error { color: var(--error-color); }
    .signup-fields input:focus-visible { outline: 2px solid var(--text); outline-offset: 4px; }
    .signup-fields .waitlist-button { width: 100%; min-height: 52px; padding: 15px 28px; }
    .signup-fields .waitlist-button:disabled { opacity: .55; cursor: not-allowed; }
    .signup-note { margin: 16px 0 0; font-size: var(--text-xs); line-height: 1.6; opacity: .7; text-align: center; }

    @media (max-width: 700px) {
      .signup { margin: 0 -24px; padding: 56px 24px; scroll-margin-top: 180px; }
      .signup-fields { flex-direction: column; }
    }

    @media (prefers-reduced-motion: reduce) {
      .signup-fields input { transition: none; }
    }

    .footer-social {
      display: flex;
      gap: 8px;
      margin-top: 16px;
      margin-left: 0;
    }

    .social-link {
      display: grid;
      place-items: center;
      width: 22px;
      height: 22px;
      border-radius: 50%;
      color: var(--text);
      text-decoration: none;
      transition: color var(--motion-interaction);
    }

    .social-link .icon { width: 22px; height: 22px; }

    .social-link:hover { color: var(--brand-yellow); }
    .social-link:active { color: var(--yellow-600); }
    @media (prefers-reduced-motion: reduce) {
      .social-link { transition: none; }
    }
    @media (max-width: 700px) {
      :root {
        --heading-1: 34px;
        --heading-2: 30px;
        --heading-3: 24px;
        --heading-4: 22px;
        --heading-5: 18px;
        --heading-6: 17px;
        --text-lead: 18px;
      }
    }

    .footer-mark #urusgold-monomark-sparkle {
      transform-box: fill-box;
      transform-origin: center;
      animation: none;
    }
    @keyframes twinkle{0%{transform:scale(1.000000);opacity:1}0.5%{transform:scale(1.003769);opacity:1}1%{transform:scale(1.007535);opacity:1}1.5%{transform:scale(1.011293);opacity:1}2%{transform:scale(1.015040);opacity:1}2.5%{transform:scale(1.018772);opacity:1}3%{transform:scale(1.022486);opacity:1}3.5%{transform:scale(1.026177);opacity:1}4%{transform:scale(1.029843);opacity:1}4.5%{transform:scale(1.033479);opacity:1}5%{transform:scale(1.037082);opacity:1}5.5%{transform:scale(1.040649);opacity:1}6%{transform:scale(1.044175);opacity:1}6.5%{transform:scale(1.047658);opacity:1}7%{transform:scale(1.051094);opacity:1}7.5%{transform:scale(1.054479);opacity:1}8%{transform:scale(1.057810);opacity:1}8.5%{transform:scale(1.061085);opacity:1}9%{transform:scale(1.064299);opacity:1}9.5%{transform:scale(1.067450);opacity:1}10%{transform:scale(1.070534);opacity:1}10.5%{transform:scale(1.073549);opacity:1}11%{transform:scale(1.076491);opacity:1}11.5%{transform:scale(1.079357);opacity:1}12%{transform:scale(1.082146);opacity:1}12.5%{transform:scale(1.084853);opacity:1}13%{transform:scale(1.087476);opacity:1}13.5%{transform:scale(1.090013);opacity:1}14%{transform:scale(1.092462);opacity:1}14.5%{transform:scale(1.094819);opacity:1}15%{transform:scale(1.097082);opacity:1}15.5%{transform:scale(1.099250);opacity:1}16%{transform:scale(1.101319);opacity:1}16.5%{transform:scale(1.103289);opacity:1}17%{transform:scale(1.105157);opacity:1}17.5%{transform:scale(1.106921);opacity:1}18%{transform:scale(1.108579);opacity:1}18.5%{transform:scale(1.110131);opacity:1}19%{transform:scale(1.111573);opacity:1}19.5%{transform:scale(1.112906);opacity:1}20%{transform:scale(1.114127);opacity:1}20.5%{transform:scale(1.115235);opacity:1}21%{transform:scale(1.116230);opacity:1}21.5%{transform:scale(1.117110);opacity:1}22%{transform:scale(1.117874);opacity:1}22.5%{transform:scale(1.118523);opacity:1}23%{transform:scale(1.119054);opacity:1}23.5%{transform:scale(1.119467);opacity:1}24%{transform:scale(1.119763);opacity:1}24.5%{transform:scale(1.119941);opacity:1}25%{transform:scale(1.120000);opacity:1}25.5%{transform:scale(1.119941);opacity:1}26%{transform:scale(1.119763);opacity:1}26.5%{transform:scale(1.119467);opacity:1}27%{transform:scale(1.119054);opacity:1}27.5%{transform:scale(1.118523);opacity:1}28%{transform:scale(1.117874);opacity:1}28.5%{transform:scale(1.117110);opacity:1}29%{transform:scale(1.116230);opacity:1}29.5%{transform:scale(1.115235);opacity:1}30%{transform:scale(1.114127);opacity:1}30.5%{transform:scale(1.112906);opacity:1}31%{transform:scale(1.111573);opacity:1}31.5%{transform:scale(1.110131);opacity:1}32%{transform:scale(1.108579);opacity:1}32.5%{transform:scale(1.106921);opacity:1}33%{transform:scale(1.105157);opacity:1}33.5%{transform:scale(1.103289);opacity:1}34%{transform:scale(1.101319);opacity:1}34.5%{transform:scale(1.099250);opacity:1}35%{transform:scale(1.097082);opacity:1}35.5%{transform:scale(1.094819);opacity:1}36%{transform:scale(1.092462);opacity:1}36.5%{transform:scale(1.090013);opacity:1}37%{transform:scale(1.087476);opacity:1}37.5%{transform:scale(1.084853);opacity:1}38%{transform:scale(1.082146);opacity:1}38.5%{transform:scale(1.079357);opacity:1}39%{transform:scale(1.076491);opacity:1}39.5%{transform:scale(1.073549);opacity:1}40%{transform:scale(1.070534);opacity:1}40.5%{transform:scale(1.067450);opacity:1}41%{transform:scale(1.064299);opacity:1}41.5%{transform:scale(1.061085);opacity:1}42%{transform:scale(1.057810);opacity:1}42.5%{transform:scale(1.054479);opacity:1}43%{transform:scale(1.051094);opacity:1}43.5%{transform:scale(1.047658);opacity:1}44%{transform:scale(1.044175);opacity:1}44.5%{transform:scale(1.040649);opacity:1}45%{transform:scale(1.037082);opacity:1}45.5%{transform:scale(1.033479);opacity:1}46%{transform:scale(1.029843);opacity:1}46.5%{transform:scale(1.026177);opacity:1}47%{transform:scale(1.022486);opacity:1}47.5%{transform:scale(1.018772);opacity:1}48%{transform:scale(1.015040);opacity:1}48.5%{transform:scale(1.011293);opacity:1}49%{transform:scale(1.007535);opacity:1}49.5%{transform:scale(1.003769);opacity:1}50%{transform:scale(1.000000);opacity:1}50.5%{transform:scale(0.996231);opacity:1}51%{transform:scale(0.992465);opacity:1}51.5%{transform:scale(0.988707);opacity:1}52%{transform:scale(0.984960);opacity:1}52.5%{transform:scale(0.981228);opacity:1}53%{transform:scale(0.977514);opacity:1}53.5%{transform:scale(0.973823);opacity:1}54%{transform:scale(0.970157);opacity:1}54.5%{transform:scale(0.966521);opacity:1}55%{transform:scale(0.962918);opacity:1}55.5%{transform:scale(0.959351);opacity:1}56%{transform:scale(0.955825);opacity:1}56.5%{transform:scale(0.952342);opacity:1}57%{transform:scale(0.948906);opacity:1}57.5%{transform:scale(0.945521);opacity:1}58%{transform:scale(0.942190);opacity:1}58.5%{transform:scale(0.938915);opacity:1}59%{transform:scale(0.935701);opacity:1}59.5%{transform:scale(0.932550);opacity:1}60%{transform:scale(0.929466);opacity:1}60.5%{transform:scale(0.926451);opacity:1}61%{transform:scale(0.923509);opacity:1}61.5%{transform:scale(0.920643);opacity:1}62%{transform:scale(0.917854);opacity:1}62.5%{transform:scale(0.915147);opacity:1}63%{transform:scale(0.912524);opacity:1}63.5%{transform:scale(0.909987);opacity:1}64%{transform:scale(0.907538);opacity:1}64.5%{transform:scale(0.905181);opacity:1}65%{transform:scale(0.902918);opacity:1}65.5%{transform:scale(0.900750);opacity:1}66%{transform:scale(0.898681);opacity:1}66.5%{transform:scale(0.896711);opacity:1}67%{transform:scale(0.894843);opacity:1}67.5%{transform:scale(0.893079);opacity:1}68%{transform:scale(0.891421);opacity:1}68.5%{transform:scale(0.889869);opacity:1}69%{transform:scale(0.888427);opacity:1}69.5%{transform:scale(0.887094);opacity:1}70%{transform:scale(0.885873);opacity:1}70.5%{transform:scale(0.884765);opacity:1}71%{transform:scale(0.883770);opacity:1}71.5%{transform:scale(0.882890);opacity:1}72%{transform:scale(0.882126);opacity:1}72.5%{transform:scale(0.881477);opacity:1}73%{transform:scale(0.880946);opacity:1}73.5%{transform:scale(0.880533);opacity:1}74%{transform:scale(0.880237);opacity:1}74.5%{transform:scale(0.880059);opacity:1}75%{transform:scale(0.880000);opacity:1}75.5%{transform:scale(0.880059);opacity:1}76%{transform:scale(0.880237);opacity:1}76.5%{transform:scale(0.880533);opacity:1}77%{transform:scale(0.880946);opacity:1}77.5%{transform:scale(0.881477);opacity:1}78%{transform:scale(0.882126);opacity:1}78.5%{transform:scale(0.882890);opacity:1}79%{transform:scale(0.883770);opacity:1}79.5%{transform:scale(0.884765);opacity:1}80%{transform:scale(0.885873);opacity:1}80.5%{transform:scale(0.887094);opacity:1}81%{transform:scale(0.888427);opacity:1}81.5%{transform:scale(0.889869);opacity:1}82%{transform:scale(0.891421);opacity:1}82.5%{transform:scale(0.893079);opacity:1}83%{transform:scale(0.894843);opacity:1}83.5%{transform:scale(0.896711);opacity:1}84%{transform:scale(0.898681);opacity:1}84.5%{transform:scale(0.900750);opacity:1}85%{transform:scale(0.902918);opacity:1}85.5%{transform:scale(0.905181);opacity:1}86%{transform:scale(0.907538);opacity:1}86.5%{transform:scale(0.909987);opacity:1}87%{transform:scale(0.912524);opacity:1}87.5%{transform:scale(0.915147);opacity:1}88%{transform:scale(0.917854);opacity:1}88.5%{transform:scale(0.920643);opacity:1}89%{transform:scale(0.923509);opacity:1}89.5%{transform:scale(0.926451);opacity:1}90%{transform:scale(0.929466);opacity:1}90.5%{transform:scale(0.932550);opacity:1}91%{transform:scale(0.935701);opacity:1}91.5%{transform:scale(0.938915);opacity:1}92%{transform:scale(0.942190);opacity:1}92.5%{transform:scale(0.945521);opacity:1}93%{transform:scale(0.948906);opacity:1}93.5%{transform:scale(0.952342);opacity:1}94%{transform:scale(0.955825);opacity:1}94.5%{transform:scale(0.959351);opacity:1}95%{transform:scale(0.962918);opacity:1}95.5%{transform:scale(0.966521);opacity:1}96%{transform:scale(0.970157);opacity:1}96.5%{transform:scale(0.973823);opacity:1}97%{transform:scale(0.977514);opacity:1}97.5%{transform:scale(0.981228);opacity:1}98%{transform:scale(0.984960);opacity:1}98.5%{transform:scale(0.988707);opacity:1}99%{transform:scale(0.992465);opacity:1}99.5%{transform:scale(0.996231);opacity:1}100%{transform:scale(1.000000);opacity:1}}
    @media (prefers-reduced-motion: reduce) {
      .footer-mark #urusgold-monomark-sparkle { animation: none; }
    }

    .about-section { margin: 0 -32px; padding: 72px 48px; }
    .about-intro { padding-top: 96px; padding-bottom: 72px; }
    .about-section > :last-child { margin-bottom: 0; }
    .about-section h1 { font-size: var(--heading-1); line-height: 1.12; letter-spacing: -.035em; margin: 0 0 32px; text-wrap: balance; }
    .about-section h2 { line-height: 1.18; letter-spacing: -.025em; margin: 0 0 28px; text-wrap: balance; }
    .eyebrow { margin: 0 0 24px; font-size: var(--text-note); font-weight: var(--weight-semibold); letter-spacing: .08em; text-transform: uppercase; }
    .about-lead { font-size: var(--text-lead); line-height: 1.6; margin: 0 0 24px; max-width: 610px; }
    .about-copy { max-width: 590px; font-size: var(--text-body); line-height: 1.7; }
    .about-copy p { margin: 0 0 20px; }
    .about-warm {
      margin: 0 -32px;
      padding: 80px 48px;
      border-radius: 0;
      background: var(--section-warm);
    }
    .direction-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; margin-top: 40px; }
    .direction-grid h3, .brand-colours h3, .shade-title { font-family: var(--font-body); font-size: var(--text-body); font-weight: var(--weight-semibold); margin: 0 0 12px; }
    .direction-grid p { font-size: var(--text-body); line-height: 1.7; margin: 0; }
    .identity-preview {
      display: flex; align-items: center; justify-content: space-between;
      gap: 32px; margin-top: 32px; padding: 40px 32px;
      background: var(--page); border-radius: 24px;
    }
    .identity-preview .brand-logo { width: 300px; max-width: 65%; }
    .about-logo-tile { display: grid; place-items: center; width: 88px; height: 88px; flex-shrink: 0; border-radius: 22px; background: transparent; color: var(--brand-charcoal); }
    .about-mark { width: 56px; height: 56px; }
    .about-mark #about-monomark-sparkle { transform-box: fill-box; transform-origin: center; animation: none; }
    .identity-caption { font-size: var(--text-caption); line-height: 1.6; opacity: .75; margin: 20px 0 0; }
    .brand-colours { display: grid; grid-template-columns: repeat(2,1fr); gap: 32px 24px; margin: 32px 0 40px; }
    .brand-chip { height: 104px; border-radius: 16px; margin-bottom: 16px; }
    .brand-colours code, .shade code { font-family: var(--font-body); font-size: var(--text-caption); }
    .brand-colours p { font-size: var(--text-caption); margin: 8px 0 0; }
    .shade-description { font-size: var(--text-secondary); margin: 0 0 24px; }
    .shade-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 24px 16px; }
    .shade-chip { height: 64px; border-radius: 12px; margin-bottom: 12px; }
    .shade strong, .shade code, .shade span { display: block; }
    .shade strong { font-size: var(--text-caption); }
    .shade span { font-size: var(--text-note); margin-top: 4px; }
    .palette-example { margin-top: 48px; border-radius: 24px; padding: 32px; background: var(--about-panel); color: var(--text); }
    .palette-example h3 { font-size: var(--heading-4); margin: 16px 0 12px; }
    .palette-example p { font-size: var(--text-secondary); line-height: 1.6; margin: 0 0 24px; }
    .about-closing { text-align: center; background: var(--surface); padding-top: 80px; padding-bottom: 80px; }
    .about-closing p:not(.eyebrow) { margin: 0 0 24px; font-size: var(--text-note); line-height: 1.6; opacity: .7; }
    @media (max-width: 700px) {
      .about-section { margin: 0 -24px; padding: 56px 24px; }
      .about-intro { padding-top: 64px; }
      .about-warm { margin: 0 -24px; padding: 56px 24px; }
      .about-lead { font-size: var(--text-lead); }
      .direction-grid { grid-template-columns: 1fr; gap: 28px; }
      .brand-colours { gap: 24px 16px; }
      .brand-chip { height: 80px; }
      .shade-grid { grid-template-columns: repeat(2,1fr); }
      .identity-preview { gap: 20px; padding: 28px 20px; }
      .about-logo-tile { width: 64px; height: 64px; border-radius: 16px; }
      .about-mark { width: 40px; height: 40px; }
      .palette-example { padding: 24px; }
    }
    @media (prefers-reduced-motion: reduce) { .about-mark #about-monomark-sparkle { animation: none; } }

    .page-loader {
      position: fixed; inset: 0; z-index: 100;
      display: grid; place-items: center;
      background: var(--loader-dim); color: var(--brand-yellow);
      opacity: 0; visibility: hidden; pointer-events: none;
      transition: opacity 150ms ease, visibility 0s 150ms;
    }
    .is-page-loading .page-loader {
      opacity: 1; visibility: visible; pointer-events: auto;
      transition: opacity 150ms ease;
    }
    .page-loader-sparkles { display: flex; align-items: center; gap: 8px; }
    .page-loader-sparkle {
      width: 24px; height: 24px; overflow: visible;
      animation: loading-sparkles 1.2s ease-in-out infinite;
    }
    .page-loader-sparkle:nth-child(2) { animation-delay: .15s; }
    .page-loader-sparkle:nth-child(3) { animation-delay: .3s; }
    @keyframes loading-sparkles {
      0%, 60%, 100% { transform: translateY(0) scale(.85); opacity: 1; }
      30% { transform: translateY(-5px) scale(1); opacity: 1; }
    }
    @media (prefers-reduced-motion: reduce) {
      .page-loader, .is-page-loading .page-loader { transition: none; }
      .page-loader-sparkle { animation: none; opacity: 1; }
    }
    .brand-logo.logo-dark { display: none; }
    [data-theme="dark"] .brand-logo.logo-primary { display: none; }
    [data-theme="dark"] .brand-logo.logo-dark { display: block; }
    .footer-mark { margin-bottom: 20px; }

    .shade-reference { margin: 0 0 40px; }
    .shade-reference summary {
      padding: 16px 0; cursor: pointer; font-size: var(--text-secondary); font-weight: var(--weight-medium);
      list-style-position: inside;
    }
    .shade-reference summary:hover { text-decoration: underline; text-underline-offset: 5px; }
    .shade-reference summary:focus-visible { outline: 2px solid var(--text); outline-offset: 4px; }
    .shade-reference-content { padding-top: 20px; }
    .about-main + .site-footer { margin-top: 0; }
    .footer-mark.mark-dark { display: none; }
    [data-theme="dark"] .footer-mark.mark-primary { display: none; }
    [data-theme="dark"] .footer-mark.mark-dark { display: block; }

    /* Typography roles: identical on every page. */
    h1, .about-section h1 { font-weight: var(--weight-semibold); }
    .about-lead {
      font-size: var(--text-lead); font-weight: var(--weight-regular); line-height: 1.65;
    }
    .hero-description, .about-copy, .direction-grid p, .signup-description {
      font-size: var(--text-body); font-weight: var(--weight-regular); line-height: 1.7;
    }
    .nav-links, .signup-form label {
      font-size: var(--text-menu); font-weight: var(--weight-medium);
    }
    .waitlist-button, .hero .waitlist-button {
      font-size: var(--text-button); font-weight: var(--weight-semibold);
    }
    .footer-statement, .footer-links {
      font-size: var(--text-secondary); font-weight: var(--weight-regular);
    }
    .footer-heading, .eyebrow {
      font-size: var(--text-caption); font-weight: var(--weight-semibold);
    }
    .hero-note, .about-closing p:not(.eyebrow) {
      font-size: var(--text-note); font-weight: var(--weight-regular); line-height: 1.6;
    }
    .signup-note, .signup-feedback, .identity-caption, .footer-copyright,
    .brand-colours code, .brand-colours p, .shade code, .shade span {
      font-size: var(--text-caption); font-weight: var(--weight-regular); line-height: 1.6;
    }
    .about-mark.identity-mark-dark { display: none; }
    [data-theme="dark"] .about-mark.identity-mark-primary { display: none; }
    [data-theme="dark"] .about-mark.identity-mark-dark { display: block; }

    /* Approved typography framework — desktop and mobile roles. */
    h1, .hero h1, .about-section h1 {
      font-size: var(--heading-1); font-weight: var(--weight-semibold);
    }
    h2, .signup h2, .about-section h2 {
      font-size: var(--heading-2); font-weight: var(--weight-semibold);
    }
    h3, .direction-grid h3, .brand-colours h3, .shade-title, .palette-example h3 {
      font-size: var(--heading-3); font-weight: var(--weight-semibold);
    }
    h4 { font-size: var(--heading-4); font-weight: var(--weight-semibold); }
    h5 { font-size: var(--heading-5); font-weight: var(--weight-semibold); }
    h6 { font-size: var(--heading-6); font-weight: var(--weight-semibold); }
    /* These labels are navigation headings rather than section headlines. */
    .footer-heading {
      font-size: var(--text-caption); font-weight: var(--weight-semibold);
    }

    /* Editorial typography for the About page. */
    .about-main .eyebrow {
      font-size: 13px;
      font-weight: var(--weight-medium);
      text-transform: uppercase;
      letter-spacing: 2px;
      color: var(--eyebrow-color);
    }
    .about-main .about-lead {
      font-size: 18px;
      font-weight: var(--weight-regular);
      line-height: 1.7;
    }
    .about-main .about-copy,
    .about-main .direction-grid p {
      font-size: 17px;
      font-weight: var(--weight-regular);
      line-height: 1.7;
    }

    /* A short story followed by a compact personal brand reference. */
    .about-intro { padding-top: 96px; padding-bottom: 64px; }
    .about-brand { padding-top: 48px; padding-bottom: 64px; }
    .about-inline-link {
      display: inline-flex; align-items: center; gap: 12px;
      margin-top: 12px; min-height: 44px; color: var(--text);
      font-size: 16px; font-weight: var(--weight-medium);
      text-decoration: underline; text-underline-offset: 5px;
    }
    .identity-preview { margin-top: 28px; background: var(--page); }
    .brand-colours { margin: 28px 0; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
    .brand-chip { height: 88px; margin-bottom: 12px; }
    .colour-name { display: block; margin-bottom: 6px; font-size: 16px; font-weight: var(--weight-medium); }
    .brand-colours p { font-size: 13px; margin-top: 6px; line-height: 1.5; }
    .shade-reference { margin: 20px 0 0; }
    .about-main + .site-footer { margin-top: 0; }
    @media (max-width: 700px) {
      .about-intro { padding-top: 64px; padding-bottom: 40px; }
      .about-brand { padding-top: 40px; padding-bottom: 48px; }
      .brand-colours { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 16px; }
    }
    .about-story-cta { margin-top: 24px; padding: 15px 40px; }

    .identity-preview { position: relative; overflow: hidden; }
    .identity-flight { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
    .identity-toolbar { display: flex; justify-content: flex-end; margin-top: 12px; }
    .identity-replay {
      border: 0; background: transparent; color: var(--text);
      font: var(--weight-medium) 14px var(--font-body);
      padding: 8px 0; min-height: 40px; cursor: pointer;
    }
    .identity-replay span { margin-left: 8px; }
    .identity-replay:hover { text-decoration: underline; text-underline-offset: 5px; }

    .identity-section { background: var(--section-warm); padding-top: 80px; padding-bottom: 80px; }
    .identity-section .identity-preview {
      display: grid;
      grid-template-columns: minmax(0, 2fr) minmax(0, 1fr);
      gap: 20px;
      padding: 0;
      background: transparent;
      border-radius: 0;
      overflow: visible;
    }
    .identity-wordmark-panel, .identity-section .about-logo-tile {
      display: flex;
      align-items: center;
      justify-content: center;
      min-width: 0;
      min-height: 184px;
      width: auto;
      height: auto;
      padding: 32px 24px;
      background: var(--surface);
      border-radius: 24px;
    }
    .identity-wordmark-panel .brand-logo { width: 100%; max-width: 300px; }
    .identity-section .about-mark { width: 64px; height: 64px; flex-shrink: 0; }
    @media (max-width: 700px) {
      .identity-section { padding-top: 56px; padding-bottom: 56px; }
      .identity-section .identity-preview { grid-template-columns: 1fr; gap: 16px; }
      .identity-wordmark-panel, .identity-section .about-logo-tile { min-height: 152px; padding: 32px 24px; }
    }

    .identity-toolbar { margin-top: 20px; }
    .identity-replay {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
      min-height: 40px;
      padding: 8px 16px;
      border: 0;
      border-radius: var(--radius-pill);
      background: var(--surface);
      color: var(--text);
      font: var(--weight-medium) 14px var(--font-body);
      line-height: 1.5;
      text-decoration: none;
      transition: background-color var(--motion-interaction);
    }
    .identity-replay span { margin: 0; }
    .identity-replay svg {
      width: 18px; height: 18px; fill: none;
      stroke: currentColor; stroke-width: 1.8;
      stroke-linecap: round; stroke-linejoin: round;
    }
    .identity-replay:hover { background: var(--button-hover); text-decoration: none; color: var(--brand-charcoal); }
    .identity-replay:active { background: var(--button-pressed); }
    @media (prefers-reduced-motion: reduce) { .identity-replay { transition: none; } }

    /* Compact navbar typography; form labels and other buttons keep their own sizes. */
    .navbar .nav-links { font-size: 14px; }
    .navbar .waitlist-button { font-size: 14px; padding: 10px 24px; }

    .skip-link { position: fixed; top: 8px; left: 8px; z-index: 200; padding: 12px 20px; background: var(--brand-yellow); color: var(--brand-charcoal); border-radius: 12px; transform: translateY(-160%); }
    .skip-link:focus { transform: translateY(0); }
    .home-link { display: block; flex-shrink: 0; }
    #main-content:focus { outline: none; }
    @media (max-width: 360px) {
      .brand-logo { width: 140px; }
      .navbar { padding-left: 20px; padding-right: 20px; }
      .footer-grid { gap: 28px 16px; }
      .footer-links { font-size: 15px; }
    }
      /* Compact footer navigation on every screen size. */
    .site-footer .footer-links { font-size:14px; font-weight:400; line-height:1.6; }
    .site-footer .footer-heading { font-size:14px; font-weight:600; }
  
.legal-main {background:var(--surface);padding:72px 48px 80px;margin:0 -32px;}
.legal-main h1 {margin:16px 0 20px;font-size:var(--heading-1);font-weight:600;line-height:1.12;letter-spacing:-.04em;}
.legal-eyebrow {font-size:13px;font-weight:500;letter-spacing:2px;text-transform:uppercase;opacity:.7;}
.legal-intro {font-size:20px;line-height:1.65;max-width:60ch;}
.legal-meta {font-size:14px;opacity:.75;margin:20px 0 28px;}
.legal-draft {padding:16px 20px;border:0;border-radius:16px;font-size:14px;line-height:1.6;margin-bottom:32px;}
.legal-toc {display:flex;flex-wrap:wrap;gap:12px 24px;padding:24px 0;border:0;margin:32px 0 40px;}
.legal-main a {color:inherit;text-underline-offset:4px;}
.legal-main section {margin:36px 0;scroll-margin-top:112px;}
.legal-main h2 {font-size:24px;font-weight:600;line-height:1.3;margin:0 0 16px;letter-spacing:-.02em;}
.legal-main section p,.legal-main li {font-size:17px;line-height:1.75;margin:0 0 16px;}
.legal-main ul {padding-left:22px;}
.legal-main details {margin-top:40px;border:0;padding-top:24px;}
.legal-main summary {cursor:pointer;font-size:16px;font-weight:500;}
@media(max-width:700px){.legal-main{padding:48px 24px;margin:0 -24px;}.legal-main h1{font-size:34px;}.legal-intro{font-size:18px;}.legal-main h2{font-size:22px;}}

    /* Compact footer navigation on every screen size. */
    .site-footer .footer-links { font-size:14px; font-weight:400; line-height:1.6; }
    .site-footer .footer-heading { font-size:14px; font-weight:600; }
  
/* Opaque page-colour backing keeps scrolling sections out of rounded navbar corners. */
.navbar { isolation:isolate; background:transparent; }
.navbar::before,.navbar::after { content:"";position:absolute;inset:0;pointer-events:none; }
.navbar::before { background:var(--page);z-index:-2; }
.navbar::after { background:var(--surface);border-radius:inherit;z-index:-1; }

/* Motion foundation: calm feedback, without animating layout dimensions. */
@media(prefers-reduced-motion:no-preference) {
  html {scroll-behavior:smooth;}
  body,.container,.navbar::before,.navbar::after,.site-footer {transition:background-color 180ms ease,color 180ms ease;}
  .navbar.menu-open .nav-panel {animation:menu-enter 200ms ease-out both;}
}
@keyframes menu-enter {from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}
main [id],#main-content,#waitlist {scroll-margin-top:112px;}
@media(prefers-reduced-motion:reduce) {html{scroll-behavior:auto;}.nav-panel{animation:none!important;}}

/* Shared interaction timing: target paint properties, never transition all. */
:root { --motion-colour:180ms ease; }
@media(prefers-reduced-motion:no-preference) {
  a,button,input,select,textarea,summary,[role="button"] {
    transition-property:color,background-color,text-decoration-color,box-shadow,opacity;
    transition-duration:180ms;
    transition-timing-function:ease;
  }
}
@media(prefers-reduced-motion:reduce) {
  a,button,input,select,textarea,summary,[role="button"] {transition:none!important;}
}

/* Canonical brand roles used by both website and component documentation. */
:root {
  --text-primary:var(--brand-charcoal);
  --text-secondary:#626258;
  --text-muted:#626258;
  --surface-muted:var(--brand-cream);
  --surface-supporting:var(--brand-sand);
  --focus-colour:var(--brand-charcoal);
  --link-colour:var(--text-primary);
  --link-hover:var(--text-primary);
  --link-accent:var(--brand-yellow);
  --motion-interaction:180ms ease;
}
[data-theme="dark"] {
  --text-primary:var(--brand-cream);
  --text-secondary:#d8d8cf;
  --text-muted:#b8b8ac;
  --surface-muted:#424239;
  --surface-supporting:#38382f;
  --focus-colour:var(--brand-yellow);
  --link-colour:var(--brand-yellow);
  --link-hover:var(--yellow-300);
}
.hero-description,.about-copy,.about-lead,.signup-description,.legal-main section p,.legal-intro {color:var(--text-secondary);}
.hero-note,.signup-note,.identity-caption,.footer-copyright,.legal-meta,.legal-eyebrow {color:var(--text-muted);opacity:1;}
.legal-eyebrow {font-size:11px;font-weight:500;letter-spacing:1.5px;}
.legal-draft {border:0;background:var(--surface-muted);}
.legal-toc,.legal-main details {border:0;}
/* Links retain one clear cue and a restrained colour transition. */
.legal-main a:not(.waitlist-button) {color:var(--link-colour);text-decoration:underline;text-decoration-color:currentColor;text-decoration-thickness:1px;text-underline-offset:4px;overflow-wrap:anywhere;}
.legal-main a:not(.waitlist-button):hover {color:var(--link-hover);text-decoration-color:var(--link-accent);}
.nav-links a:not(.waitlist-button) {color:var(--text-primary);}
.nav-links a:not(.waitlist-button):hover,.nav-links a[aria-current] {text-decoration-color:var(--link-accent);}
.footer-links a {color:var(--text-secondary);text-decoration-color:transparent;}
.footer-links a:hover {color:var(--text-primary);text-decoration-color:var(--link-accent);}
:where(a,button,input,select,textarea,summary,[role="button"]):focus-visible {outline:2px solid var(--focus-colour);outline-offset:4px;}
a:focus-visible,button:focus-visible,.signup-fields input:focus-visible,.shade-reference summary:focus-visible {outline-color:var(--focus-colour);}

/* Shared navigation cue; override the footer's earlier currentColor selector. */
.nav-links a:not(.waitlist-button),.footer-links a {
  text-decoration-line:underline;
  text-decoration-thickness:1px;
  text-underline-offset:6px;
  text-decoration-color:transparent;
}
.nav-links a:not(.waitlist-button):hover,
.nav-links a:not(.waitlist-button):active,
.nav-links a:not(.waitlist-button)[aria-current],
.footer-links a:not([aria-disabled="true"]):hover,
.footer-links a:not([aria-disabled="true"]):active,
.footer-links a[aria-current] {
  text-decoration-color:var(--brand-yellow);
}

@media(min-width:701px) { .navbar .brand-logo {width:172px;} }

.signup-description a {color:var(--link-colour);text-decoration:underline;text-decoration-color:currentColor;text-decoration-thickness:1px;text-underline-offset:4px;}

/* Footer hierarchy: the brand statement sits on the same 14px scale as the links; primary colour (not size) marks it as the lead. */
.site-footer .footer-statement {font-size:var(--text-caption);font-weight:var(--weight-regular);line-height:1.6;color:var(--text-primary);}
.site-footer .footer-logo-tile + .footer-statement,.site-footer .footer-mark + .footer-statement {margin-top:0;}

/* Copyright line: small uppercase fine print, colour stays on the muted role (Charcoal 450, 5.61:1). */
.site-footer .footer-copyright, .footer-copyright {font-size:11px;font-weight:var(--weight-regular);line-height:1.6;letter-spacing:1px;text-transform:uppercase;}