/*
File: caddy-core-landing.css
Semantic version: 1.1.0
Purpose: Present the Caddy Core pre-launch landing from brand tokens alone.
Project: Dirty Birdies 2026 tournament platform
Relative path: web/dist/assets/caddycore/caddy-core-landing.css
Created: 2026-09-06 06:31:04 -0400
Last modified: 2026-09-21 19:16:43 -0400
*/
/* The landing deliberately does not load site.css. That sheet paints the Dirty
   Birdies emerald over the page (`body::before`, `.hero::before`) with literal
   colours no brand variable can remap, so the only way the Caddy Core palette
   wins on this surface is to not inherit the other brand at all. Every value
   below resolves to a token from caddy-core-design-tokens.css. */

* { box-sizing: border-box; }

body {
  min-height: 100svh;
  margin: 0;
  display: grid;
  place-items: center;
  background: var(--cc-surface);
  color: var(--cc-ink);
  font-family: var(--cc-font-ui);
  font-synthesis: none;
  text-align: center;
}

.brand-landing {
  width: min(calc(100% - 2rem), 34rem);
  padding: 3rem 0;
}

.brand-landing__logo {
  display: block;
  margin-inline: auto;
}

.brand-landing h1 {
  margin: 1.75rem 0 0;
  color: var(--cc-navy-900);
  font-family: var(--cc-font-display);
  font-size: clamp(2.25rem, 8vw, 3.25rem);
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.05;
}

.brand-landing__note {
  margin: 0.75rem 0 0;
  color: var(--cc-muted);
  font-size: clamp(1rem, 3.5vw, 1.125rem);
  line-height: 1.5;
}

.brand-landing__eyebrow {
  margin: 1.75rem 0 0;
  color: var(--cc-navy-700);
  font-size: 0.875rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

/* The eyebrow already opens the block, so the heading under one must not add
   its own top margin on top of that. */
.brand-landing__eyebrow + h1 {
  margin-top: 0.5rem;
}

.brand-landing__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  justify-content: center;
  margin-top: 2rem;
}

.brand-landing__action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  /* 0.875rem of vertical padding over a 1.5 line box clears the 44px pointer
     target the smallest declared viewport is measured at. */
  min-height: 2.75rem;
  padding: 0.875rem 1.5rem;
  border: 2px solid var(--cc-navy-700);
  border-radius: var(--cc-radius-md);
  background: var(--cc-white);
  color: var(--cc-navy-900);
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.5;
  text-decoration: none;
}

/* Emphasis is positional: the first action in the row is the one the page is
   for, so a page that prepends its own action needs no emphasis flag. */
.brand-landing__action:first-child {
  border-color: var(--cc-navy-900);
  background: var(--cc-navy-900);
  color: var(--cc-white);
}

.brand-landing__action:hover {
  border-color: var(--cc-navy-900);
}

/* --cc-focus-on-navy is the ring for navy chrome and only reaches 2.1:1 against
   --cc-surface, so this light page takes its ring from navy 900 (13.2:1). */
:focus-visible {
  outline: 3px solid var(--cc-navy-900);
  outline-offset: 2px;
}