/* RMC Boxing — "The Kennel" component system.
   Colours/fonts bridge to theme.json preset CSS vars (single source of truth). */
:root {
  --ink: var(--wp--preset--color--base);
  --ink-2: var(--wp--preset--color--ink-2);
  --surf: var(--wp--preset--color--surface);
  --surf-2: var(--wp--preset--color--surface-2);
  --surf-3: var(--wp--preset--color--surface-3);
  --ox: var(--wp--preset--color--oxblood);
  --red: var(--wp--preset--color--accent);
  --red-bright: var(--wp--preset--color--accent-bright);
  --steel: var(--wp--preset--color--steel);
  --steel-lt: var(--wp--preset--color--steel-lt);
  --steel-deep: var(--wp--preset--color--steel-deep);
  --ice: var(--wp--preset--color--contrast);
  --mute: var(--wp--preset--color--muted);
  --mute-2: var(--wp--preset--color--muted-2);
  --line: var(--wp--preset--color--border);
  --disp: var(--wp--preset--font-family--oswald);
  --body: var(--wp--preset--font-family--hanken);
  --r: 8px;
  --r-lg: 14px;
}

/* eyebrow / kicker */
.rmc-eyebrow {
  font-family: var(--body); font-weight: 800; font-size: 13px;
  letter-spacing: 0.26em; text-transform: uppercase; color: var(--red);
  display: inline-flex; align-items: center; gap: 12px; white-space: nowrap;
}
.rmc-eyebrow.is-steel { color: var(--steel-lt); }
.rmc-eyebrow::before { content: ""; width: 28px; height: 2px; background: currentColor; }

/* ghost/secondary button (primary buttons inherit theme.json button styles) */
.rmc-btn-ghost a, a.rmc-btn-ghost {
  display: inline-flex; align-items: center; gap: 10px;
  font-family: var(--body); font-weight: 800; font-size: 14px;
  letter-spacing: 0.09em; text-transform: uppercase;
  padding: 15px 28px; border-radius: var(--r);
  color: var(--steel-lt); border: 1px solid var(--steel); background: transparent;
  transition: background .2s, border-color .2s, color .2s, transform .1s;
}
.rmc-btn-ghost a:hover, a.rmc-btn-ghost:hover {
  color: var(--ice); border-color: var(--steel-lt); background: rgba(110,132,147,0.12);
}

/* stats band */
.rmc-stats { background: var(--surf-2); border-top: 3px solid var(--red); }
.rmc-stats .rmc-stat .n { font-family: var(--disp); font-weight: 700; font-size: clamp(48px, 5.5vw, 72px); line-height: 0.82; color: var(--ice); }
.rmc-stats .rmc-stat .l { font-family: var(--body); font-weight: 800; font-size: 13px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--steel-lt); }
.rmc-stats .rmc-stat + .rmc-stat { border-left: 1px solid var(--line); }

/* generic card hover */
.rmc-card { background: var(--surf); border: 1px solid var(--line); border-radius: var(--r-lg); overflow: hidden; transition: border-color .2s, transform .2s; }
.rmc-card:hover { border-color: var(--steel); transform: translateY(-3px); }

/* service card icon tile */
.rmc-ico { width: 52px; height: 52px; border-radius: 10px; background: rgba(220,47,26,0.12); border: 1px solid rgba(220,47,26,0.35); display: grid; place-items: center; color: var(--red); }
.rmc-ico svg { width: 26px; height: 26px; }

/* fighter card */
.rmc-fighter { background: var(--surf); border: 1px solid var(--line); border-radius: var(--r-lg); overflow: hidden; transition: border-color .2s, transform .2s; }
.rmc-fighter:hover { border-color: var(--steel); transform: translateY(-3px); }
.rmc-fighter .photo { position: relative; aspect-ratio: 4/5; }
.rmc-fighter .photo img { width: 100%; height: 100%; object-fit: cover; }
.rmc-fighter .photo .grad { position: absolute; inset: 0; pointer-events: none; background: linear-gradient(180deg, transparent 45%, rgba(22,27,32,0.98)); }
.rmc-fighter .name { font-family: var(--disp); font-weight: 600; font-size: 27px; line-height: 0.95; }
.rmc-fighter .wc { font-family: var(--body); font-weight: 700; font-size: 12px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--steel-lt); margin-top: 5px; }
.rmc-fighter .rec { display: flex; align-items: baseline; gap: 9px; margin-top: 13px; border-top: 1px solid var(--line); padding-top: 12px; white-space: nowrap; }
.rmc-fighter .rec .r { font-family: var(--disp); font-weight: 700; font-size: 25px; color: var(--red); }
.rmc-fighter .rec .k { font-family: var(--body); font-weight: 600; font-size: 12px; letter-spacing: 0.06em; color: var(--mute); }

/* status / coach tags */
.rmc-tag { display: inline-flex; align-items: center; font-family: var(--body); font-weight: 800; font-size: 10.5px; letter-spacing: 0.12em; text-transform: uppercase; padding: 4px 9px; border-radius: 5px; white-space: nowrap; }
.rmc-tag.is-pro { background: var(--red); color: var(--ice); }
.rmc-tag.is-am { background: rgba(14,18,22,0.72); color: var(--steel-lt); border: 1px solid var(--line); }
.rmc-tag.is-coach { background: var(--steel); color: var(--ink); }
.rmc-fighter .photo .rmc-tag { position: absolute; top: 12px; }
.rmc-fighter .photo .rmc-tag.tl { left: 12px; }
.rmc-fighter .photo .rmc-tag.tr { right: 12px; }

/* post / news card */
.rmc-post .meta { font-family: var(--body); font-weight: 800; font-size: 12px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--red); }
.rmc-post img { aspect-ratio: 16/10; width: 100%; object-fit: cover; }

/* follow band */
.rmc-follow { background: var(--ox); position: relative; overflow: hidden; }
.rmc-follow::after { content: ""; position: absolute; right: -80px; top: -80px; width: 360px; height: 360px; border: 60px solid rgba(255,255,255,0.05); border-radius: 50%; pointer-events: none; }
.rmc-follow .soc-lg { width: 60px; height: 60px; border-radius: 12px; background: rgba(255,255,255,0.1); border: 1px solid rgba(255,255,255,0.2); display: grid; place-items: center; color: #fff; transition: background .15s; }
.rmc-follow .soc-lg:hover { background: rgba(255,255,255,0.22); }

/* interior page hero accent rule */
.rmc-page-hero { position: relative; border-bottom: 1px solid var(--line); }
.rmc-page-hero::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 6px; background: var(--red); }

/* sticky header solidify (class toggled by kennel.js; safe default = solid) */
.rmc-header { position: sticky; top: 0; z-index: 50; transition: background .3s, border-color .3s; border-bottom: 1px solid transparent; }
.rmc-header.is-solid { background: rgba(10,13,16,0.86); backdrop-filter: blur(12px); border-bottom-color: var(--line); }
.rmc-nav-link.is-active { border-bottom: 2px solid var(--red); }

/* scroll reveal — visible by default; JS hides below-fold via .pre */
.rmc-reveal { transition: opacity .55s cubic-bezier(.2,.8,.2,1), transform .55s cubic-bezier(.2,.8,.2,1); }
.rmc-reveal.pre { opacity: 0; transform: translateY(16px); }
@media (prefers-reduced-motion: reduce) { .rmc-reveal.pre { opacity: 1; transform: none; transition: none; } }

/* responsive helpers for pattern grids */
@media (max-width: 860px) { .rmc-stats .rmc-stat .n { font-size: clamp(40px, 9vw, 56px); } }