/**
 * Domino 2026 — base. Reset-light, typography scale, focus, forms.
 * Mobile-first; desktop enhancements at the bottom.
 */

/* Reset-light */
*, *::before, *::after { box-sizing: border-box; }
* { margin: 0; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; }
}
body {
  background: var(--domino-paper);
  color: var(--domino-ink);
  font-family: var(--font-body);
  font-size: 1.0625rem;
  line-height: 1.65;
  min-height: 100vh;
}
/* Sticky-footer pin, hardened (LocalWP runtime: paper showed below footer).
 * Three independent mechanisms so no single override breaks the pin:
 * 1. body.domino flex column (class-qualified: beats bare-element plugin
 *    rules like `body{display:block}` that would silently unpin the footer).
 * 2. .site-content flex-grow absorbs slack (see below).
 * 3. .site-footer margin-top:auto re-pins even if main's grow is neutralised.
 * svh covers mobile browser chrome; admin-bar calc compensates WP's
 * html margin-top (32px desktop / 46px small screens). Sticky bar + consent
 * are position:fixed and unaffected; admin bar offset stacks above body. */
body.domino {
  min-height: 100vh;
  min-height: 100svh;
  display: flex;
  flex-direction: column;
}
body.domino.admin-bar {
  min-height: calc(100vh - 32px);
  min-height: calc(100svh - 32px);
}
@media screen and (max-width: 782px) {
  body.domino.admin-bar {
    min-height: calc(100vh - 46px);
    min-height: calc(100svh - 46px);
  }
}
.site-content { flex: 1 0 auto; width: 100%; min-width: 0; }
img, video { max-width: 100%; height: auto; display: block; }

/* Type scale (mobile-first; desktop grows H1/H2) */
h1, .h1 {
  font-family: var(--font-display);
  font-weight: 500;
  font-size: 2.375rem;
  line-height: 1.08;
  color: var(--domino-sea);
  letter-spacing: 0.005em;
}
h2, .h2 {
  font-family: var(--font-display);
  font-weight: 500;
  font-size: 1.75rem;
  line-height: 1.15;
  color: var(--domino-sea);
}
h3, .h3 { font-size: 1.25rem; line-height: 1.25; font-weight: 600; color: var(--domino-sea); }
h4 { font-size: 1.125rem; line-height: 1.3; font-weight: 600; }
@media (min-width: 64rem) {
  h1, .h1 { font-size: 3.5rem; }
  h2, .h2 { font-size: 2.25rem; }
  h3, .h3 { font-size: 1.5rem; }
}
.eyebrow {
  font-family: var(--font-label);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--domino-blue);
}

/* Focus: always visible, theme-aware */
:focus-visible {
  outline: 3px solid var(--domino-focus);
  outline-offset: 2px;
  border-radius: 4px;
}
.on-dark :focus-visible, .site-header :focus-visible { outline-color: var(--domino-focus-dark); }

/* Links */
a { color: var(--domino-blue); text-underline-offset: 0.15em; }
a:hover { color: var(--domino-sea); }

/* Forms */
label { display: block; font-weight: 600; font-size: 0.9375rem; margin-bottom: var(--s8); }
input[type="text"], input[type="email"], input[type="tel"], input[type="date"],
input[type="number"], select, textarea {
  width: 100%;
  min-height: 3rem;
  padding: 0.625rem 0.875rem;
  font: inherit;
  color: var(--domino-ink);
  background: var(--domino-card);
  border: 1px solid var(--domino-line);
  border-radius: var(--radius-field);
}
input[aria-invalid="true"], select[aria-invalid="true"], textarea[aria-invalid="true"] {
  border-color: var(--domino-error);
}
.field-error { color: var(--domino-error); font-size: 0.875rem; margin-top: var(--s4); }

/* Buttons */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: var(--s8);
  min-height: 3rem;
  padding: 0.75rem 1.75rem;
  font-family: var(--font-body);
  font-size: 0.9375rem; font-weight: 700;
  letter-spacing: 0.04em; text-transform: uppercase; text-decoration: none;
  border-radius: var(--radius-pill);
  border: 2px solid transparent;
  cursor: pointer;
  transition: background-color 0.18s ease, color 0.18s ease, border-color 0.18s ease, transform 0.12s ease;
}
.btn--primary { background: var(--domino-blue); color: #fff; }
.btn--primary:hover { background: var(--domino-sea); color: #fff; }
.btn--primary:active { transform: translateY(1px); }
.btn--gold { background: var(--domino-gold); color: var(--domino-sea); }
.btn--gold:hover { background: #d4af4e; color: var(--domino-sea); }
.btn--secondary { background: transparent; color: var(--domino-blue); border-color: var(--domino-blue); }
.btn--secondary:hover { background: var(--domino-blue); color: #fff; }
.btn--small { min-height: 2.5rem; padding: 0.5rem 1.25rem; font-size: 0.8125rem; }
.btn[disabled] { opacity: 0.5; cursor: not-allowed; }
.on-dark .btn--secondary { color: #fff; border-color: #fff; }
.on-dark .btn--secondary:hover { background: #fff; color: var(--domino-sea); }

/* Utilities */
.screen-reader-text {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
.skip-link {
  position: absolute; left: var(--s16); top: -100px; z-index: 200;
  background: var(--domino-sea); color: #fff; padding: var(--s8) var(--s16);
  border-radius: var(--radius-field); text-decoration: none;
}
.skip-link:focus { top: var(--s16); }