/* Skin "college" (setting skin = college): the old collegepredictionmarkets.com look, "crypto-cool" near-black with
   an orange #ff5c39 + teal #0d9488 duo, giant uppercase Inter Black slogan, JetBrains Mono micro-labels, glass-style
   trading cards and a live ticker. Loaded after site.css on every page of a site that names this skin. Tokens, fonts
   and site-wide pieces first; the home page (templates/partials/home/showcase-college.php, -end.php, classes .cpm-*)
   below. Values: Brand & Design restore spec v1 (hub/handoffs/cms/2026-10-15-college-restore-spec.md) and the source
   inventory (old root font 17px: every rem value converted to px). Network fixes F1-F9 of the spec are marked "F". */

/* Fonts of the original design, self-hosted (SIL Open Font License 1.1, licence texts in public/assets/fonts/):
   Inter (text and the black slogan), JetBrains Mono (labels, prices, ticker), Instrument Serif (tile titles). Latin only. */
@font-face { font-family: "Inter"; font-style: normal; font-weight: 100 900; font-display: swap; src: url("../../fonts/inter-latin.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "JetBrains Mono"; font-style: normal; font-weight: 400 700; font-display: swap; src: url("../../fonts/jetbrains-mono-latin.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Instrument Serif"; font-style: normal; font-weight: 400; font-display: swap; src: url("../../fonts/instrument-serif-latin.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

/* Tokens (hub/brand/college/tokens.css) */
body.skin-college {
  --cpm-bg: #050505; --cpm-surface: #0d0d0d; --cpm-surface-2: #0b0b0f;
  --cpm-text: #fafafa; --cpm-text-2: #a1a1aa; --cpm-muted: #8a8a93; /* F1: muted #71717a -> #8a8a93 (AA) */
  --cpm-orange: #ff5c39; --cpm-orange-ink: #0a0a0a; /* F2: dark text on orange (6.6:1) */
  --cpm-peach: #ffb39a; --cpm-teal: #0d9488; --cpm-teal-text: #14b8a6;
  --cpm-line: rgb(255 255 255 / .08); --cpm-line-strong: rgb(255 255 255 / .15); --cpm-hairline: rgb(255 255 255 / .06);
  --cpm-gradient-text: linear-gradient(90deg, #ff5c39 0%, #ffb39a 50%, #0d9488 100%);
  --cpm-card-hover: 0 20px 60px -20px rgb(255 92 57 / .35), inset 0 0 0 1px rgb(255 92 57 / .18);
  --cpm-card-hover-teal: 0 20px 60px -20px rgb(13 148 136 / .35), inset 0 0 0 1px rgb(13 148 136 / .18);
  --cpm-ease: cubic-bezier(.4, 0, .2, 1);
  --sans: "Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --mono: "JetBrains Mono", ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;
  --cpm-serif: "Instrument Serif", ui-serif, Georgia, serif;
  --serif: var(--sans); --serif-text: var(--sans); --serif-display: var(--sans);
  --paper: #050505; --paper-2: #0d0d0d; --ink: #fafafa; --line: rgb(255 255 255 / .08); --muted: #8a8a93; --accent: #ff5c39;
  --wrap: 1180px; --gutter: 24px; --radius: 10px;
  /* fixed two-glow backdrop */
  background: radial-gradient(900px 600px at 8% -10%, rgb(13 148 136 / .10), transparent 60%), radial-gradient(900px 600px at 110% 10%, rgb(255 92 57 / .10), transparent 60%), #050505;
  background-attachment: fixed;
  color: var(--cpm-text); font-family: var(--sans); font-size: 17px; line-height: 1.6; -webkit-font-smoothing: antialiased;
}
body.skin-college ::selection { background: #ff5c39; color: #0a0a0a; }
body.skin-college :focus-visible { outline: 2px solid #ff5c39; outline-offset: 2px; border-radius: 4px; }
body.skin-college a { color: inherit; }

/* B1 header: 68px, sticky, transparent at the top; background, blur and a hairline after 4px of scroll (site.js
   puts is-scrolled on the header) */
body.skin-college .site-header { position: sticky; top: 0; z-index: 50; background: transparent; border-bottom: 1px solid transparent; transition: background-color 200ms var(--cpm-ease), border-color 200ms var(--cpm-ease), backdrop-filter 200ms var(--cpm-ease); }
body.skin-college .site-header.is-scrolled { background: rgb(5 5 5 / .72); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); border-bottom-color: var(--cpm-hairline); }
body.skin-college .header-top { min-height: 68px; }
body.skin-college .brand-logo { max-height: 32px; width: auto; }
body.skin-college .header-top .brand { display: inline-flex; align-items: center; min-height: 44px; }
body.skin-college .search-form input { background: rgb(255 255 255 / .03); border: 1px solid var(--cpm-line); color: var(--cpm-text); border-radius: 8px; min-height: 44px; font-size: 15px; }
body.skin-college .search-form button, body.skin-college .menu-toggle { min-width: 47px; min-height: 47px; color: var(--cpm-text); background: transparent; border: 1px solid var(--cpm-line); border-radius: 10px; }
body.skin-college .menu-toggle-label { font-family: var(--mono); font-size: 13px; text-transform: uppercase; letter-spacing: .16em; }
body.skin-college .primary-nav { border-top: 0; }
body.skin-college .nav-list a { font-family: var(--mono); font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .16em; color: rgb(255 255 255 / .7); min-height: 44px; display: flex; align-items: center; transition: color 150ms var(--cpm-ease); }
body.skin-college .nav-list a:hover { color: #fff; }
@media (max-width: 899px) {
  .js body.skin-college .primary-nav.is-open { background: rgb(5 5 5 / .92); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); border-top: 1px solid var(--cpm-hairline); }
  .js body.skin-college .nav-list a { min-height: 48px; font-size: 13px; border-bottom-color: var(--cpm-hairline); }
}
@media (min-width: 900px) {
  body.skin-college .nav-list { gap: 0 26px; flex-wrap: nowrap; } body.skin-college .nav-list a { padding-inline: 0; }
  /* the old header had no search: on wide screens the CMS search is its button, the field opens on focus */
  body.skin-college .search-form { position: relative; }
  body.skin-college .search-form input { width: 0; min-width: 0; padding: 0; border-width: 0; opacity: 0; transition: width 200ms var(--cpm-ease), opacity 200ms var(--cpm-ease); }
  body.skin-college .search-form:focus-within input { width: 180px; padding: 0 12px; border-width: 1px; opacity: 1; }
}
@media (min-width: 1200px) { body.skin-college .nav-list { gap: 0 34px; } }

/* Site-wide text, cards and footer in the skin's colours */
body.skin-college h1, body.skin-college h2, body.skin-college h3 { font-family: var(--sans); }
body.skin-college .article-title, body.skin-college .section-title { font-weight: 900; text-transform: uppercase; letter-spacing: -.04em; line-height: 1.05; }
body.skin-college .section-title { font-size: clamp(28px, 3.2vw, 40px); }
body.skin-college .kicker, body.skin-college .meta { font-family: var(--mono); font-size: 12px; letter-spacing: .12em; text-transform: uppercase; color: var(--cpm-muted); }
body.skin-college .card-title { font-weight: 700; }
body.skin-college .card-title a, body.skin-college a.kicker { display: inline-flex; align-items: center; min-height: 44px; }
body.skin-college .card-title a:hover { color: var(--cpm-orange); }
body.skin-college .card-excerpt, body.skin-college .standfirst { color: var(--cpm-text-2); }
body.skin-college .prose a { color: var(--cpm-orange); }
body.skin-college .site-footer { background: rgb(0 0 0 / .5); border-top: 1px solid var(--cpm-hairline); }
body.skin-college .footer-title { font-family: var(--mono); font-size: 12px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--cpm-teal-text); }
body.skin-college .footer-links a { display: flex; align-items: center; min-height: 44px; font-size: 14px; color: rgb(255 255 255 / .7); text-decoration: none; }
body.skin-college .footer-links a:hover { color: #fff; }
@media (min-width: 1024px) { body.skin-college .footer-links a { min-height: 32px; } }
body.skin-college .rg-notice, body.skin-college .footer-bottom { font-size: 12px; color: var(--cpm-muted); }
body.skin-college .rg-notice strong { font-size: 13px; }

/* Sticky phone bar: #050505 at 95%, an orange line on top, orange button with dark text */
body.skin-college .sticky-cta:not([hidden]) { background: rgb(5 5 5 / .95); border-top: 1px solid rgb(255 92 57 / .4); color: var(--cpm-text); font-size: 13px; padding-bottom: calc(8px + env(safe-area-inset-bottom)); }
body.skin-college .sticky-cta .button-primary { background: var(--cpm-orange); color: var(--cpm-orange-ink); border-radius: 8px; min-height: 48px; font-weight: 700; }
body.skin-college .sticky-cta .sticky-terms summary, body.skin-college .sticky-cta .sticky-close { min-height: 44px; min-width: 44px; font-size: 12px; color: var(--cpm-muted); }

/* ---- Home page --------------------------------------------------------------------------------------------- */
body.skin-college.t-home main { overflow-x: clip; }
.cpm-blob { position: absolute; border-radius: 50%; pointer-events: none; z-index: 0; }
.cpm-dot { display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: var(--cpm-teal); vertical-align: middle; animation: cpm-pulse 2s ease-in-out infinite; }
.cpm-dot--still { animation: none; }
.cpm-dot--grey { background: #52525b; animation: none; }
@keyframes cpm-pulse { 0%, 100% { opacity: 1; box-shadow: 0 0 0 0 rgb(13 148 136 / .5); } 50% { opacity: .6; box-shadow: 0 0 0 6px rgb(13 148 136 / 0); } }
.cpm-eyebrow { margin: 0; font-family: var(--mono); font-size: 12px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--cpm-teal-text); } /* F3: 10px -> 12px */
.cpm-eyebrow--orange { color: var(--cpm-orange); }
.cpm-h2 { margin: 12.75px 0 0; font-size: clamp(28px, 3.2vw, 40px); font-weight: 900; line-height: 1.1; letter-spacing: -.04em; text-transform: uppercase; color: #fff; }
.cpm-h2--sm { font-size: 24px; }
@media (min-width: 768px) { .cpm-h2--sm { font-size: 32px; } }
.cpm-h2--primer { font-size: 32px; line-height: 1.05; letter-spacing: -.025em; }
@media (min-width: 768px) { .cpm-h2--primer { font-size: 48px; } }
.cpm-intro { margin-top: 12.75px; max-width: 640px; color: var(--cpm-text-2); }
.cpm-intro p { margin: 0 0 8px; }
.cpm-intro a { color: var(--cpm-orange); }
.cpm-fine { margin: 6px 0 0; font-size: 12px; line-height: 1.45; color: var(--cpm-muted); } /* F3: 11px -> 12px */
.cpm-avail { margin: 6.4px 0 0; font-size: 12px; color: var(--cpm-muted); }
.cpm-code { font-family: var(--mono); color: var(--cpm-teal-text); background: none; padding: 0; font-size: 13px; }
.cpm-only-wide { display: none; }
@media (min-width: 768px) { .cpm-only-phone { display: none; } .cpm-only-wide { display: block; } }

/* B2 hero */
.cpm-hero { position: relative; isolation: isolate; padding: 40px 0 56px; }
/* desktop top padding 64 (old 119): with the 104px slogan the two hero buttons must stay on a 1280x800 first screen (spec acceptance 1) */
@media (min-width: 768px) { .cpm-hero { padding: 64px 0 102px; } }
.cpm-hero::before { content: ""; position: absolute; inset: 0; z-index: -1; opacity: .5; pointer-events: none;
  background-image: linear-gradient(rgb(255 255 255 / .04) 1px, transparent 1px), linear-gradient(90deg, rgb(255 255 255 / .04) 1px, transparent 1px); background-size: 48px 48px; }
.cpm-blob--teal { width: 520px; height: 520px; top: -120px; left: -120px; background: radial-gradient(circle, rgb(13 148 136 / .35), transparent 70%); z-index: -1; }
.cpm-blob--orange { width: 560px; height: 560px; top: -60px; right: -160px; background: radial-gradient(circle, rgb(255 92 57 / .30), transparent 70%); z-index: -1; }
.cpm-hero-in { position: relative; }
.cpm-pill { display: inline-flex; align-items: center; gap: 8px; margin: 0; padding: 4.25px 12.75px; border: 1px solid rgb(13 148 136 / .45); background: rgb(13 148 136 / .08); border-radius: 999px;
  font-family: var(--mono); font-size: 12px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--cpm-teal-text); line-height: 1.5; max-width: 100%; }
.cpm-slogan { margin: 25.5px 0 0; font-size: clamp(40px, 7.4vw, 104px); font-weight: 900; line-height: .92; letter-spacing: -.04em; text-transform: uppercase; color: #fff; overflow-wrap: anywhere; }
.cpm-grad { background: var(--cpm-gradient-text); background-size: 200% 200%; -webkit-background-clip: text; background-clip: text; color: transparent; animation: cpm-gradient 6s ease infinite; }
@keyframes cpm-gradient { 0%, 100% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } }
.cpm-lede { margin: 34px 0 0; max-width: 640px; font-size: 18px; line-height: 1.55; color: var(--cpm-text-2); }
@media (min-width: 768px) { .cpm-lede { margin-top: 25.5px; font-size: 20px; } }
.cpm-notice { margin: 25.5px 0 0; font-size: 14px; font-weight: 500; color: var(--cpm-text-2); }
.cpm-cta { display: flex; flex-wrap: wrap; gap: 17px; margin-top: 25.5px; }
.cpm-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 50px; padding: 12.75px 25.5px; border-radius: 8px; background: var(--cpm-orange); color: var(--cpm-orange-ink) !important;
  font-size: 15px; font-weight: 700; text-decoration: none; transition: opacity 150ms var(--cpm-ease), box-shadow 150ms var(--cpm-ease); }
.cpm-btn:hover { opacity: .9; box-shadow: 0 0 24px rgb(255 92 57 / .55); }
.cpm-btn--ghost { background: rgb(13 148 136 / .10); border: 1px solid var(--cpm-teal); color: #fff !important; }
.cpm-btn--ghost:hover { box-shadow: 0 0 24px rgb(13 148 136 / .45); }
.cpm-hero .cpm-btn:hover, .cpm-hero .cpm-btn--ghost:hover { box-shadow: none; } /* motion audit #4: the original hero buttons only dim on hover */
.cpm-btn--sm { min-height: 44px; padding: 8.5px 17px; font-size: 13px; border-radius: 6px; }
.cpm-codes { display: flex; flex-wrap: wrap; gap: 4px 25.5px; margin: 12.75px 0 0; font-size: 13px; color: var(--cpm-text-2); }
.cpm-hero-disclosure { margin: 8.5px 0 0; font-size: 14px; line-height: 1.45; color: var(--cpm-text-2); } /* BD-058: 14px on phones too */
.cpm-terms { margin-top: 12.75px; max-width: 640px; }
.cpm-terms summary { display: flex; align-items: center; min-height: 44px; cursor: pointer; font-family: var(--mono); font-size: 12px; letter-spacing: .12em; text-transform: uppercase; color: var(--cpm-muted); }
.cpm-terms-open { margin-top: 12.75px; max-width: 640px; }

/* B3 ticker: 48px band, 45s marquee, paused on hover and focus */
.cpm-ticker { position: relative; overflow: hidden; height: 48px; background: rgb(0 0 0 / .4); border-block: 1px solid var(--cpm-hairline); }
.cpm-ticker-run { display: flex; width: max-content; height: 100%; animation: cpm-marquee 45s linear infinite; }
.cpm-ticker:hover .cpm-ticker-run, .cpm-ticker:focus-within .cpm-ticker-run, .cpm-ticker:focus .cpm-ticker-run { animation-play-state: paused; }
.cpm-ticker ul { display: flex; margin: 0; padding: 0; list-style: none; }
.cpm-ticker li a { display: flex; align-items: center; gap: 12.75px; height: 48px; padding: 0 25.5px; white-space: nowrap; text-decoration: none; font-family: var(--mono); }
.cpm-tk-name { font-size: 12px; letter-spacing: .12em; text-transform: uppercase; color: var(--cpm-muted); }
.cpm-ticker strong { font-size: 13px; color: #fff; }
.cpm-tk-change { font-size: 12px; font-weight: 700; }
.is-up { color: var(--cpm-teal-text); } .is-down { color: var(--cpm-orange); }
@keyframes cpm-marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }

/* B4 at a glance */
.cpm-glance-wrap { padding-top: 51px; }
.cpm-glance { padding: 25.5px; border-left: 4px solid var(--cpm-orange); border-radius: 10px; background: var(--cpm-surface); }
.cpm-glance-label { margin: 0; font-family: var(--mono); font-size: 12px; font-weight: 400; letter-spacing: .15em; text-transform: uppercase; color: var(--cpm-muted); }
.cpm-glance-text { margin-top: 12.75px; font-size: 20px; line-height: 1.45; color: var(--cpm-text); }
.cpm-glance-text p { margin: 0; }
.cpm-reviewed { margin: 17px 0 0; font-family: var(--mono); font-size: 12px; letter-spacing: .1em; text-transform: uppercase; color: var(--cpm-muted); }

/* B5 offer row */
.cpm-offers { padding-top: 51px; }
.cpm-offer-row { display: grid; grid-template-columns: minmax(0, 1fr); gap: 17px; margin: 0; padding: 0; list-style: none; }
@media (min-width: 1024px) { .cpm-offer-row { grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: start; } }
.cpm-creative { display: block; border: 1px solid var(--cpm-line); border-radius: 10px; overflow: hidden; transition: opacity 150ms var(--cpm-ease); }
.cpm-creative:hover { opacity: .95; }
.cpm-creative img { display: block; width: 100%; height: auto; }
.cpm-cr-big { display: none !important; }
@media (min-width: 640px) { .cpm-cr-small { display: none !important; } .cpm-cr-big { display: block !important; } .cpm-creative:not(:has(.cpm-cr-big)) .cpm-cr-small { display: block !important; } }
.cpm-textbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 48px; padding: 12.75px 17px; border: 1px solid var(--cpm-line); border-radius: 10px; background: rgb(255 92 57 / .08); text-decoration: none; }
.cpm-textbar strong { font-size: 14px; color: #fff; }
.cpm-chip { flex-shrink: 0; padding: 6.4px 12.75px; border-radius: 6px; background: var(--cpm-orange); color: var(--cpm-orange-ink); font-size: 12px; font-weight: 500; }
.cpm-disclosure { margin-top: 17px; }

/* B6 live grid and the shared card */
.cpm-live { position: relative; margin-top: 68px; padding-block: 85px; }
.cpm-blob--soft { width: 600px; height: 600px; top: 80px; left: 30%; background: radial-gradient(circle, rgb(255 92 57 / .10), transparent 70%); }
.cpm-blob--soft-teal { width: 500px; height: 500px; top: 100px; left: 10%; background: radial-gradient(circle, rgb(13 148 136 / .10), transparent 70%); }
.cpm-head-row { position: relative; display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 12px; margin-bottom: 42.5px; }
.cpm-updated { margin: 0; font-family: var(--mono); font-size: 12px; color: rgb(255 255 255 / .5); }
.cpm-grid { position: relative; display: grid; grid-template-columns: minmax(0, 1fr); gap: 25.5px; margin: 0; padding: 0; list-style: none; } /* BD-055: one column can shrink below its content on phones */
@media (min-width: 768px) { .cpm-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .cpm-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.cpm-card { display: flex; flex-direction: column; gap: 21.25px; padding: 25.5px; border: 1px solid var(--cpm-line); border-radius: 17px; background: var(--cpm-surface);
  transition: transform 250ms var(--cpm-ease), border-color 250ms var(--cpm-ease), box-shadow 250ms var(--cpm-ease), background-color 250ms var(--cpm-ease); } /* F5: solid, no backdrop blur */
.cpm-card--live:hover { transform: translateY(-4px); border-color: rgb(255 92 57 / .5); box-shadow: var(--cpm-card-hover); background: #101010; }
.cpm-card--watch { gap: 17px; }
.cpm-card--watch:hover { transform: translateY(-4px); border-color: rgb(13 148 136 / .5); box-shadow: var(--cpm-card-hover-teal); background: #101010; }
.cpm-card--watch:hover .cpm-card-title { color: var(--cpm-teal-text); }
.cpm-meta { display: flex; align-items: center; gap: 8px; margin: 0; font-family: var(--mono); font-size: 12px; letter-spacing: .12em; text-transform: uppercase; color: rgb(255 255 255 / .6); }
.cpm-meta-cat { color: var(--cpm-teal-text); font-weight: 700; }
.cpm-card-title { margin: 0; font-size: 20px; font-weight: 700; line-height: 1.2; color: #fff; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; transition: color 150ms var(--cpm-ease); }
.cpm-card--live:hover .cpm-card-title { color: var(--cpm-orange); }
.cpm-prices { display: flex; align-items: flex-end; gap: 25.5px; padding-top: 21.25px; border-top: 1px solid var(--cpm-hairline); }
.cpm-price { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.cpm-price-label { font-family: var(--mono); font-size: 12px; line-height: 1.3; letter-spacing: .1em; text-transform: uppercase; color: rgb(255 255 255 / .6); max-width: 130px; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; overflow: hidden; overflow-wrap: break-word; } /* up to 2 lines, then … (Brand BD-054 follow-up) */
.cpm-price-val { font-family: var(--mono); font-size: 28px; font-weight: 900; line-height: 1; letter-spacing: -.04em; font-variant-numeric: tabular-nums; color: #fff; }
.cpm-price-val small { font-size: 16px; color: var(--cpm-teal-text); }
.cpm-price--b .cpm-price-val small { color: var(--cpm-orange); }
.cpm-spark { margin-left: auto; color: rgb(255 255 255 / .65); flex-shrink: 0; }
.cpm-spark polyline { stroke-dasharray: 1; stroke-dashoffset: 1; }
.cpm-grid:not(.will-reveal) .cpm-spark polyline, .cpm-grid.is-in .cpm-spark polyline, html:not(.js) .cpm-spark polyline { animation: cpm-draw 1.2s ease-out forwards; } /* motion audit #13: also when the grid is on screen at load */
@keyframes cpm-draw { to { stroke-dashoffset: 0; } }
.cpm-trade { display: flex; align-items: center; justify-content: center; min-height: 48px; margin-top: auto; border-radius: 16px; background: var(--cpm-orange); color: var(--cpm-orange-ink) !important;
  font-family: var(--mono); font-size: 12px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; text-decoration: none; transition: box-shadow 150ms var(--cpm-ease); } /* F4: 43 -> 48px */
.cpm-trade:hover { box-shadow: 0 0 24px rgb(255 92 57 / .55); }
.cpm-gridnote { position: relative; margin-top: 17px; }
.cpm-gridnote a { color: var(--cpm-muted); text-decoration: underline; }

/* the rise-in of cards and tiles (the network [data-reveal] pattern: is-in once in view; nothing hidden without JS) */
.js [data-reveal].will-reveal:not(.is-in) > * { opacity: 0; transform: translateY(24px); } /* motion audit #7: only blocks below the fold wait (site.js marks them will-reveal); on screen at load = shown */
.js [data-reveal].will-reveal.is-in > * { opacity: 1; transform: none; transition: opacity 450ms var(--cpm-ease), transform 450ms var(--cpm-ease); }
.js [data-reveal].will-reveal.is-in > :nth-child(2) { transition-delay: 80ms; } .js [data-reveal].will-reveal.is-in > :nth-child(3) { transition-delay: 160ms; }
.js [data-reveal].will-reveal.is-in > :nth-child(4) { transition-delay: 240ms; } .js [data-reveal].will-reveal.is-in > :nth-child(5) { transition-delay: 320ms; }
.js [data-reveal].will-reveal.is-in > :nth-child(n+6) { transition-delay: 400ms; }

/* sections: B7 campus, B8 primer, B9 watchlist, B10 schools */
.cpm-sec { position: relative; padding-top: 102px; }
.cpm-sec--text { padding-block: 68px; }
.cpm-sec-head { position: relative; margin-bottom: 42.5px; }
.cpm-grid--tiles, .cpm-grid--schools { gap: 17px; }
.cpm-tile { display: flex; flex-direction: column; gap: 8.5px; height: 100%; min-height: 44px; padding: 21.25px; border: 1px solid var(--cpm-line); border-radius: 10px; background: var(--cpm-surface);
  text-decoration: none; transition: transform 150ms var(--cpm-ease), border-color 150ms var(--cpm-ease); box-sizing: border-box; }
.cpm-tile:hover { transform: translateY(-2px); border-color: var(--cpm-line-strong); }
.cpm-tile-venue { font-family: var(--mono); font-size: 12px; letter-spacing: .16em; text-transform: uppercase; color: var(--cpm-muted); }
.cpm-tile-title { font-family: var(--cpm-serif); font-size: 19px; line-height: 1.375; color: var(--cpm-text); transition: color 150ms var(--cpm-ease); }
.cpm-tile:hover .cpm-tile-title { color: var(--cpm-orange); }
.cpm-grid--schools { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 768px) { .cpm-grid--schools { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .cpm-grid--schools { grid-template-columns: repeat(5, minmax(0, 1fr)); } }
.cpm-tile--school .cpm-tile-title { font-size: 20px; line-height: 1.25; }
.cpm-tile-rate { font-family: var(--mono); font-size: 12px; letter-spacing: .15em; color: var(--cpm-muted); }
.cpm-summary { margin: 0; font-size: 14px; line-height: 1.5; color: var(--cpm-text-2); }
.cpm-watch-foot { display: flex; justify-content: space-between; gap: 12px; margin: auto 0 0; padding-top: 17px; border-top: 1px solid var(--cpm-hairline); font-family: var(--mono); font-size: 12px; letter-spacing: .1em; text-transform: uppercase; color: var(--cpm-muted); }
.cpm-watching { color: var(--cpm-teal-text); }
.cpm-frame { position: relative; padding: 34px 25.5px; border: 1px solid rgb(255 255 255 / .10); border-radius: 17px; background: #000; box-shadow: 0 30px 80px rgb(0 0 0 / .6); font-size: 18px; color: var(--cpm-text-2); }
.cpm-frame p { margin: 0 0 17px; max-width: 640px; }
.cpm-frame p:last-child { margin-bottom: 0; }
.cpm-frame a { display: inline-flex; align-items: center; min-height: 44px; font-family: var(--mono); font-size: 12px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--cpm-orange); text-decoration: none; }
.cpm-more { margin-top: 25.5px; }

/* B11 editorial teaser */
.cpm-article { padding-top: 102px; }
.cpm-article-in { max-width: 760px; margin: 0 auto; padding-inline: var(--gutter); }
.cpm-cover { display: block; width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 17px; }
.cpm-cover--grad { background: radial-gradient(120% 80% at 20% 20%, rgb(255 92 57 / .45), transparent 60%), radial-gradient(100% 60% at 80% 80%, rgb(13 148 136 / .45), transparent 60%), #0b0b0f; }
.cpm-article .cpm-eyebrow { margin-top: 25.5px; }
.cpm-article-title { margin: 12.75px 0 0; font-size: 32px; font-weight: 900; line-height: 1.05; letter-spacing: -.04em; text-transform: uppercase; color: #fff; }
@media (min-width: 768px) { .cpm-article-title { font-size: 44px; } }
.cpm-article-title a { text-decoration: none; transition: color 200ms var(--cpm-ease); }
.cpm-article-title a:hover { color: var(--cpm-orange); }
.cpm-dek { margin: 17px 0 0; font-size: 18px; line-height: 1.55; color: var(--cpm-text-2); }
.cpm-byline { margin: 12.75px 0 0; font-family: var(--mono); font-size: 12px; letter-spacing: .12em; text-transform: uppercase; color: var(--cpm-muted); }

/* B12 sources */
.cpm-sources-wrap { padding-top: 51px; }
.cpm-sources { padding: 25.5px; border-radius: 10px; background: var(--cpm-surface); }
.cpm-sources-head { margin: 0 0 12.75px; font-family: var(--mono); font-size: 12px; font-weight: 400; letter-spacing: .15em; text-transform: uppercase; color: var(--cpm-muted); }
.cpm-sources ul { margin: 0; padding: 0; list-style: none; font-size: 14px; line-height: 1.5; }
.cpm-sources li { padding-block: 6px; }
.cpm-sources li a { color: var(--cpm-orange); text-decoration: underline; }
.cpm-by { display: block; font-family: var(--mono); font-size: 12px; color: var(--cpm-muted); }

/* B13 promo codes */
.cpm-promos { padding-block: 51px; }
.cpm-promo-list { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12.75px; margin: 25.5px 0 0; padding: 0; list-style: none; }
@media (min-width: 640px) { .cpm-promo-list { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .cpm-promo-list { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.cpm-promo-list a { display: flex; align-items: center; height: 100%; min-height: 61px; padding: 17px; border: 1px solid var(--cpm-line); border-radius: 10px; color: #fff; font-size: 17px; text-decoration: none; box-sizing: border-box; }
.cpm-promo-list a:hover { opacity: .9; }

/* B14a offer strips (end of the home page, above the footer) */
.cpm-strips { margin-top: 68px; padding-block: 68px 51px; background: rgb(0 0 0 / .5); border-top: 1px solid var(--cpm-hairline); }
.cpm-strips-title { margin-bottom: 25.5px; }
.cpm-strip-row { display: grid; grid-template-columns: minmax(0, 1fr); gap: 17px; margin: 0; padding: 0; list-style: none; }
@media (min-width: 768px) { .cpm-strip-row { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .cpm-strip-row--4, .cpm-strip-row--5 { grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); } }
.cpm-strip { display: flex; flex-direction: column; gap: 10px; padding: 17px; border: 1px solid var(--cpm-line); border-radius: 10px; }
.cpm-strip-offer { margin: 0; font-size: 14px; color: #fff; }
.cpm-strip .cpm-btn { align-self: flex-start; }
.cpm-strip .cpm-fine, .cpm-strip .cpm-avail { margin: 0; }
body.skin-college.t-home .site-footer { border-top: 0; }

/* the CMS article lists of the home page in the skin */
body.skin-college.t-home .home-top, body.skin-college.t-home .section { padding-top: 51px; }
body.skin-college .card { background: var(--cpm-surface); border: 1px solid var(--cpm-line); border-radius: 17px; overflow: hidden; }
body.skin-college .card-body { padding: 17px 21px 21px; }
body.skin-college .page-updated { display: none; }
/* the lead story of the CMS list: picture and text side by side on wide screens, title in the card size */
@media (min-width: 1024px) {
  body.skin-college.t-home .home-lead .card { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center; }
  body.skin-college.t-home .home-lead .card-media { margin: 0; height: 100%; }
  body.skin-college.t-home .home-lead .card-media img { height: 100%; object-fit: cover; }
  body.skin-college.t-home .home-lead .card-body { padding: 34px; }
}
body.skin-college.t-home .home-lead .card-title { font-size: clamp(24px, 2.4vw, 32px); line-height: 1.15; letter-spacing: -.02em; }

/* Reduced motion: no animation, nothing hidden */
@media (prefers-reduced-motion: reduce) {
  body.skin-college *, body.skin-college *::before, body.skin-college *::after { animation: none !important; transition: none !important; }
  .cpm-ticker { overflow-x: auto; } .cpm-ticker-run { width: max-content; }
  .cpm-ticker-run > ul[aria-hidden="true"] { display: none; }
  .js [data-reveal] > * { opacity: 1 !important; transform: none !important; }
  .cpm-spark polyline { stroke-dashoffset: 0; }
  .cpm-card:hover, .cpm-tile:hover { transform: none; }
  .cpm-grad { background-position: 0% 50%; }
}
/* without featured stories next to it the lead story takes the full width */
body.skin-college.t-home .home-top:not(:has(.home-featured)) { grid-template-columns: minmax(0, 1fr); }
body.skin-college .section-title { color: #fff; }
@media (min-width: 1024px) { body.skin-college.t-home .home-lead .card .card-body { padding: 34px 40px; } }
body.skin-college .sticky-cta .button-primary { text-decoration: none; display: inline-flex; align-items: center; padding-inline: 20px; }
body.skin-college small { font-size: max(12px, .8em); }

/* Round 1 QA (Brand, 15 Oct): F2 dark ink on every orange fill, terms at 12px, 44px link areas */
body.skin-college .prose a.button, body.skin-college .prose a.button:hover, body.skin-college .promo-button, body.skin-college .promo-button:hover,
body.skin-college .button-primary, body.skin-college .button-primary:hover, body.skin-college .code-box a.button { background: var(--cpm-orange); color: var(--cpm-orange-ink) !important; text-decoration: none; }
body.skin-college .promo-disclaimer, body.skin-college .promo-disclaimer p { font-size: 12px; }
body.skin-college .prose li > a[href*="/go/"]:not(.button), body.skin-college .prose p > a[href*="/go/"]:only-child:not(.button) { display: inline-flex; align-items: center; min-height: 44px; }
body.skin-college .footer-links a, body.skin-college .footer-social a { min-width: 44px; }
.cpm-why > summary, .cpm-strip-terms > summary { display: flex; align-items: center; min-height: 44px; cursor: pointer; font-family: var(--mono); font-size: 12px; letter-spacing: .12em; text-transform: uppercase; color: var(--cpm-muted); }
@media (min-width: 640px) { .js .cpm-why > summary { display: none; } }
.cpm-strip-act { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.cpm-strip-code { font-size: 13px; color: var(--cpm-text-2); }
.cpm-strip .cpm-btn { align-self: auto; }
@media (max-width: 639px) { .cpm-strip { gap: 6px; padding: 12px 14px; } .cpm-strip-row { gap: 10px; } .cpm-strips { padding-block: 40px 32px; } }
/* Phones (<640): denser spacing so the page stays near 18,500px without removing content (Brand QA round 1) */
@media (max-width: 639px) {
  .cpm-sec { padding-top: 64px; } .cpm-sec--text { padding-block: 48px; } .cpm-article { padding-top: 64px; }
  .cpm-sec-head { margin-bottom: 25.5px; }
  .cpm-live { margin-top: 34px; padding-block: 51px; } .cpm-head-row { margin-bottom: 25.5px; }
  .cpm-grid { gap: 12px; }
  .cpm-card { padding: 17px; gap: 12px; } .cpm-card--watch { gap: 8px; } .cpm-watch-foot { padding-top: 10px; }
  .cpm-tile { padding: 14px 16px; gap: 6px; } .cpm-tile-title { font-size: 18px; line-height: 1.3; }
  .cpm-glance-wrap, .cpm-offers { padding-top: 34px; } .cpm-glance-text { font-size: 18px; }
  .cpm-promos { padding-block: 34px; } .cpm-promo-list a { min-height: 52px; padding: 12px 16px; font-size: 16px; }
  body.skin-college .footer-cols { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 16px; }
}
body.skin-college .prose > a[href*="/go/"]:not(.button), body.skin-college .prose .box > a[href*="/go/"]:not(.button) { display: inline-flex; align-items: center; min-height: 44px; }
@media (max-width: 639px) { body.skin-college .footer-links { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 16px; } }
/* Brand sign-off fixes: full watchlist questions on phones, a chevron on "Why we're watching" */
@media (max-width: 639px) { .cpm-card--watch .cpm-card-title { display: block; -webkit-line-clamp: unset; overflow: visible; } }
.cpm-why > summary { list-style: none; gap: 8px; }
.cpm-why > summary::-webkit-details-marker { display: none; }
.cpm-why > summary::after { content: ""; width: 8px; height: 8px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg) translateY(-2px); transition: transform 200ms var(--cpm-ease); }
.cpm-why[open] > summary::after { transform: rotate(225deg) translateY(-2px); }
@media (prefers-reduced-motion: reduce) { .cpm-why > summary::after { transition: none; } }
.cpm-strip-act { flex-wrap: wrap; } .cpm-strip .cpm-btn { white-space: nowrap; }
/* BD-054 13:3x: under 400px the price chart goes, so each label keeps ~130px and long team names fit on 2 lines */
@media (max-width: 399px) { .cpm-spark { display: none; } }

/* C19 (Brand 24 Oct): on phones the see-through header keeps its blur at 90% opacity at least */
@media (max-width: 767px) {
  body.skin-college .site-header.is-scrolled { background: rgb(5 5 5 / .9); }
}