/* CryptoFrame — base: reset, typography, controls, utilities.
   Every colour, size and radius here resolves to a custom property emitted by
   inc/tokens.php. Editing a preset changes this file's output without touching
   the file itself. */

*,
*::before,
*::after { box-sizing: border-box; }

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

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
}

body {
  margin: 0;
  background: var(--cfx-background);
  color: var(--cfx-text);
  font-family: var(--cfx-font-body);
  font-size: var(--cfx-fs-base);
  line-height: var(--cfx-lh-body);
  font-synthesis-weight: none;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

/* Utility classes that set display must never defeat the hidden attribute. */
[hidden] { display: none !important; }

img, svg, video, canvas { max-width: 100%; height: auto; display: block; }

h1, h2, h3, h4, h5, h6 {
  margin: 0 0 .5em;
  font-family: var(--cfx-font-heading);
  font-weight: var(--cfx-weight-heading);
  line-height: var(--cfx-lh-heading);
  letter-spacing: var(--cfx-ls-heading);
  text-transform: var(--cfx-case-heading);
  color: var(--cfx-heading);
  text-wrap: balance;
}

h1 { font-size: var(--cfx-fs-5); }
h2 { font-size: var(--cfx-fs-3); }
h3 { font-size: var(--cfx-fs-2); }
h4 { font-size: var(--cfx-fs-1); }

p { margin: 0 0 1.1em; }
p:last-child { margin-bottom: 0; }

a { color: var(--cfx-link); text-decoration-thickness: 1px; text-underline-offset: .18em; }
a:hover, a:focus { color: var(--cfx-hover); }

:focus-visible {
  outline: 2px solid var(--cfx-primary);
  outline-offset: 2px;
  border-radius: 2px;
}

hr { border: 0; border-top: 1px solid var(--cfx-border); margin: 2rem 0; }

code, pre, kbd, samp { font-family: var(--cfx-font-data); font-size: .92em; }

pre {
  background: var(--cfx-surface);
  border: 1px solid var(--cfx-border);
  border-radius: var(--cfx-radius-card);
  padding: 1rem 1.1rem;
  overflow-x: auto;
}

blockquote {
  margin: 1.6rem 0;
  padding: .2rem 0 .2rem 1.2rem;
  border-left: 3px solid var(--cfx-primary);
  color: var(--cfx-heading);
  font-size: var(--cfx-fs-1);
}

table { width: 100%; border-collapse: collapse; }
th, td { padding: .6rem .7rem; border-bottom: 1px solid var(--cfx-border); text-align: left; }
th { font-family: var(--cfx-font-label); font-size: var(--cfx-fs-sm); color: var(--cfx-heading); }

/* Numerals in data contexts should line up column to column. */
.cfx-meta__date,
.cfx-meta__updated,
.cfx-slot,
.cfx-eventcard__date,
.cfx-card__rank {
  font-family: var(--cfx-font-data);
  font-variant-numeric: tabular-nums;
}

/* ---------- Controls ---------- */

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

input[type="text"],
input[type="search"],
input[type="email"],
input[type="url"],
input[type="number"],
input[type="date"],
select,
textarea {
  width: 100%;
  padding: .62rem .8rem;
  background: var(--cfx-card);
  color: var(--cfx-text);
  border: var(--cfx-border-width) solid var(--cfx-border);
  border-radius: var(--cfx-radius-input);
  transition: border-color .16s ease, box-shadow .16s ease;
}

input:focus, select:focus, textarea:focus {
  border-color: var(--cfx-primary);
  box-shadow: 0 0 0 3px rgba(var(--cfx-primary-rgb), .16);
  outline: none;
}

.cfx-btn,
button.cfx-btn,
input[type="submit"],
.wp-block-button__link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .45em;
  padding: .68em 1.25em;
  font-family: var(--cfx-font-button);
  font-size: var(--cfx-fs-sm);
  font-weight: 600;
  line-height: 1.1;
  border: var(--cfx-border-width) solid transparent;
  border-radius: var(--cfx-radius-button);
  cursor: pointer;
  text-decoration: none;
  transition: transform .14s ease, background-color .16s ease, border-color .16s ease, box-shadow .16s ease;
}

.cfx-btn--lg { padding: .85em 1.6em; font-size: var(--cfx-fs-base); }

.cfx-btn--primary,
input[type="submit"],
.wp-block-button__link {
  background: var(--cfx-primary);
  color: var(--cfx-on-primary);
  border-color: var(--cfx-primary);
}

.cfx-btn--primary:hover,
input[type="submit"]:hover { filter: brightness(1.07); color: var(--cfx-on-primary); }

.cfx-btn--ghost {
  background: transparent;
  color: var(--cfx-heading);
  border-color: var(--cfx-border);
}
.cfx-btn--ghost:hover { border-color: var(--cfx-primary); color: var(--cfx-primary); }

/* Button styles selected by preset or override. */
.cfx-buttons-outline .cfx-btn--primary {
  background: transparent;
  color: var(--cfx-primary);
  border-color: var(--cfx-primary);
}
.cfx-buttons-outline .cfx-btn--primary:hover { background: var(--cfx-primary); color: var(--cfx-on-primary); }

.cfx-buttons-gradient .cfx-btn--primary {
  background: linear-gradient(120deg, var(--cfx-primary), var(--cfx-accent));
  border-color: transparent;
  color: #fff;
}

.cfx-buttons-soft .cfx-btn--primary {
  background: rgba(var(--cfx-primary-rgb), .14);
  color: var(--cfx-primary);
  border-color: transparent;
}

.cfx-iconbtn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.35rem;
  height: 2.35rem;
  background: transparent;
  border: var(--cfx-border-width) solid var(--cfx-border);
  border-radius: var(--cfx-radius-button);
  cursor: pointer;
  font-size: 1.05rem;
  color: inherit;
}
.cfx-iconbtn:hover { border-color: var(--cfx-primary); color: var(--cfx-primary); }

/* ---------- Utilities ---------- */

.screen-reader-text {
  position: absolute !important;
  width: 1px; height: 1px;
  margin: -1px; padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}

.cfx-skip-link:focus {
  position: fixed !important;
  top: .6rem; left: .6rem;
  z-index: 999;
  width: auto; height: auto;
  clip: auto; clip-path: none;
  padding: .7rem 1rem;
  background: var(--cfx-primary);
  color: var(--cfx-on-primary);
  border-radius: var(--cfx-radius-button);
}

.cfx-eyebrow {
  display: inline-block;
  margin-bottom: .4rem;
  font-family: var(--cfx-font-label);
  font-size: var(--cfx-fs-xs);
  font-weight: 600;
  letter-spacing: var(--cfx-ls-label);
  text-transform: var(--cfx-case-label);
  color: var(--cfx-primary);
  text-decoration: none;
}

.cfx-empty,
.cfx-noresults {
  padding: 1.4rem 0;
  color: var(--cfx-muted);
}

.cfx-progress {
  position: fixed;
  inset: 0 0 auto 0;
  height: 3px;
  z-index: 200;
  pointer-events: none;
}
.cfx-progress__bar {
  display: block;
  height: 100%;
  width: 0;
  background: var(--cfx-primary);
  transition: width .1s linear;
}

.cfx-to-top {
  position: fixed;
  right: 1.1rem; bottom: 1.1rem;
  z-index: 90;
  width: 2.7rem; height: 2.7rem;
  border: var(--cfx-border-width) solid var(--cfx-border);
  border-radius: var(--cfx-radius-button);
  background: var(--cfx-card);
  color: var(--cfx-heading);
  cursor: pointer;
  box-shadow: var(--cfx-shadow-2);
}

@media (max-width: 782px)  { .cfx-hide-mobile  { display: none !important; } }
@media (min-width: 783px) and (max-width: 1024px) { .cfx-hide-tablet { display: none !important; } }
@media (min-width: 1025px) { .cfx-hide-desktop { display: none !important; } }

@media print {
  .cfx-header, .cfx-footer, .cfx-sidebar, .cfx-share, .cfx-to-top,
  .cfx-ad, .cfx-ticker, .cfx-progress, .cfx-readertools { display: none !important; }
  body { background: #fff; color: #000; }
  .cfx-content { width: 100% !important; }
}