/* Notmining brand experience — geometric, clear and quietly optimistic. */
:root {
  --dark-navy: #061522;
  --navy: #0a2032;
  --navy-mid: #102c42;
  --electric-blue: #159fd3;
  --electric-blue-light: #52c6e8;
  --cyan: #20d9b4;
  --brand-blue: #159fd3;
  --brand-mint: #20d9b4;
  --brand-azure: #367fc1;
  --ice: #edf8fa;
  --ink: #0a2438;
  --ink-soft: #456274;
  --white: #f4fbfd;
  --gray-100: #e4f0f3;
  --gray-200: #c5d8e0;
  --gray-300: #9db6c2;
  --gray-400: #86a3b2;
  --gray-600: #557182;
  --rule: rgba(151, 204, 220, .2);
  --surface: #0d2639;
  --surface-raised: #123248;
  --gradient-hero: #061522;
  --gradient-card: linear-gradient(145deg, #102c41, #0b2234);
  --gradient-accent: linear-gradient(120deg, #159fd3, #20d9b4);
  --gradient-featured: linear-gradient(145deg, #123b4d, #102a43);
  --font-main: 'Manrope', 'Inter', 'Segoe UI', system-ui, sans-serif;
  --radius-sm: 8px;
  --radius-md: 14px;
  --radius-lg: 22px;
  --shadow-card: 0 22px 60px rgba(0, 10, 20, .2);
  --shadow-featured: 0 24px 70px rgba(0, 10, 20, .28);
  --transition: 180ms ease;
  --content-width: 1240px;
  --section-space: clamp(56px, 6vw, 88px);
  --hero-pad: clamp(104px, 10.5vw, 132px) 0 clamp(44px, 4.5vw, 60px);
}

html { scroll-padding-top: 96px; }
body {
  background: var(--dark-navy);
  color: var(--white);
  font-family: var(--font-main);
  font-size: 16px;
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
}
::selection { background: rgba(32, 217, 180, .28); color: inherit; }
a, button, input, select, textarea { font-family: inherit; }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible {
  outline: 3px solid var(--brand-mint) !important;
  outline-offset: 4px;
}
.container { max-width: var(--content-width); }
h1, h2, h3, h4, h5 { text-wrap: balance; }
p { text-wrap: pretty; }

/* Shared navigation */
.navbar {
  background: rgba(6, 21, 34, .82);
  border-bottom-color: rgba(151, 204, 220, .14);
  backdrop-filter: blur(20px) saturate(1.25);
  -webkit-backdrop-filter: blur(20px) saturate(1.25);
}
.navbar.scrolled { background: rgba(6, 21, 34, .97); box-shadow: 0 10px 40px rgba(0, 8, 16, .18); }
.nav-inner { height: 80px; }
.nav-logo img { height: 40px !important; }
.nav-link { font-size: .9rem; font-weight: 600; border-radius: 8px; }
.nav-link[aria-current="page"] { box-shadow: inset 0 -2px var(--brand-mint); }
.nav-dropdown-toggle { border-radius: 8px; }
.nav-lang-link { border-radius: 999px; }
.nav-lang-link.is-active { color: var(--brand-mint); border-color: rgba(32, 217, 180, .5); background: rgba(32, 217, 180, .08); }
.dropdown {
  border-color: var(--rule) !important;
  border-radius: 16px !important;
  background: rgba(11, 34, 51, .98) !important;
  box-shadow: 0 28px 80px rgba(0, 8, 16, .46) !important;
}
.dropdown a { border-radius: 9px !important; }
.dropdown a:hover { background: rgba(32, 217, 180, .08) !important; }
.dropdown a .d-icon { color: var(--brand-mint); }
.dropdown-col-title, .dropdown-section-title { color: var(--gray-300) !important; }

/* Actions */
.btn-primary {
  min-height: 50px;
  padding: 13px 25px;
  border: 1px solid var(--brand-mint);
  border-radius: 12px;
  background: var(--brand-mint);
  color: #042c2a;
  box-shadow: 0 12px 32px rgba(32, 217, 180, .14);
  font-weight: 750;
  letter-spacing: -.01em;
}
.btn-primary:hover { border-color: #5be7ca; background: #5be7ca; color: #042c2a; box-shadow: 0 16px 36px rgba(32, 217, 180, .22); }
.btn-primary:active { background: #5be7ca; }
.btn-outline {
  min-height: 50px;
  padding: 13px 25px;
  border-color: rgba(197, 222, 232, .34);
  border-radius: 12px;
  background: rgba(255, 255, 255, .025);
  font-weight: 650;
}
.btn-outline:hover { border-color: var(--brand-mint); background: rgba(32, 217, 180, .07); }
.tag {
  padding: 5px 12px;
  border: 1px solid rgba(32, 217, 180, .16);
  border-radius: 999px;
  background: rgba(32, 217, 180, .07);
  color: var(--brand-mint);
  font-size: .74rem;
  font-weight: 700;
  letter-spacing: 0;
  text-transform: none;
}
.highlight { color: var(--brand-mint); background: none; -webkit-text-fill-color: currentColor; }

/* Contextual artwork is selected in PHP for every page. */
:where(.co-hero, .pr-hero, .sl-hero, .p-hero, .sc-hero, .nw-hero, .gl-hero, .ss-hero, .su-hero, .bl-hero, .pp-hero, .sp-hero) {
  background: var(--dark-navy) !important;
}
:where(.co-hero-bg, .pr-hero-bg, .sl-hero-bg, .p-hero-bg, .sc-hero-bg, .nw-hero-bg, .gl-hero-bg, .ss-hero-bg, .su-hero-bg, .bl-hero-bg, .pp-hero-bg, .sp-hero-bg, .bp-header-bg, .legal-hero-bg, .home-hero-bg) {
  position: absolute;
  inset: 0;
  overflow: hidden;
  background: var(--dark-navy) !important;
}
:where(.co-hero-bg, .pr-hero-bg, .sl-hero-bg, .p-hero-bg, .sc-hero-bg, .nw-hero-bg, .gl-hero-bg, .ss-hero-bg, .su-hero-bg, .bl-hero-bg, .pp-hero-bg, .sp-hero-bg, .bp-header-bg, .legal-hero-bg, .home-hero-bg)::after {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(90deg, rgba(6,21,34,.98) 0%, rgba(6,21,34,.93) 48%, rgba(6,21,34,.88) 100%) !important;
}
:where(.pp-hero-bg, .sp-hero-bg, .bl-hero-bg, .gl-hero-bg, .nw-hero-bg, .ss-hero-bg, .su-hero-bg) img,
.home-hero-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
/* Internal heroes follow the index hero composition: centered, taller, bright copy. */
:where(.pp-hero, .sp-hero, .bl-hero, .gl-hero, .nw-hero, .ss-hero, .su-hero) {
  display: flex;
  align-items: center;
  min-height: min(560px, 62vh);
  padding-top: clamp(104px, 10.5vw, 132px);
  padding-bottom: clamp(44px, 4.5vw, 60px);
}
.pp-hero h1, .sp-hero h1, .bl-hero h1, .gl-hero h1, .nw-hero h1, .ss-hero h1, .su-hero h1, .co-hero h1, .pr-hero h1, .sl-hero h1, .p-hero h1, .sc-hero h1, .bp-header-inner h1, .legal-hero h1 {
  color: var(--white);
  font-size: clamp(2.3rem, 4vw, 3.2rem);
  font-weight: 750;
  letter-spacing: -.05em;
  line-height: 1.08;
  text-wrap: balance;
}
@media (max-width: 640px) {
  .pp-hero h1, .sp-hero h1, .bl-hero h1, .gl-hero h1, .nw-hero h1, .ss-hero h1, .su-hero h1, .co-hero h1, .pr-hero h1, .sl-hero h1, .p-hero h1, .sc-hero h1, .bp-header-inner h1, .legal-hero h1 { font-size: clamp(2rem, 8.5vw, 2.6rem); }
}
.pp-hero-lead, .sp-hero-desc, .bl-hero-desc, .gl-hero-desc, .nw-hero-desc, .ss-hero-desc, .su-hero-desc {
  color: var(--gray-200);
  font-size: clamp(1rem, 1.35vw, 1.12rem);
  line-height: 1.75;
}
:where(.pp-hero, .sp-hero) { overflow: hidden; }
.pp-hero-type, .sp-hero-type { color: var(--brand-mint); }
/* Hero copy takes the full width now that platform mock panels are gone. */
.pp-hero-inner, .sp-hero-inner, .p-hero-inner { grid-template-columns: minmax(0, 1fr); }
.pp-hero-content, .sp-hero-content, .p-hero-content { position: relative; z-index: 1; }

/* Hero figures: the index banner design (clipped figure + module illustration) on every page. */
:where(.sp-hero-figure, .pp-hero-figure, .bl-hero-figure, .gl-hero-figure, .nw-hero-figure, .ss-hero-figure, .su-hero-figure, .co-hero-figure, .pr-hero-figure, .sl-hero-figure, .p-hero-figure, .sc-hero-figure) {
  position: relative;
  overflow: hidden;
  margin: 0;
  border: 1px solid rgba(128, 216, 234, .24);
  border-radius: 30px;
  background: var(--navy);
  box-shadow: 0 40px 100px rgba(0, 8, 16, .38);
  clip-path: polygon(5% 0, 100% 0, 95% 100%, 0 100%);
}
:where(.sp-hero-figure, .pp-hero-figure, .bl-hero-figure, .gl-hero-figure, .nw-hero-figure, .ss-hero-figure, .su-hero-figure, .co-hero-figure, .pr-hero-figure, .sl-hero-figure, .p-hero-figure, .sc-hero-figure) img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 10;
  object-fit: cover;
}
@media (min-width: 981px) {
  .sp-hero-inner, .pp-hero-inner, .bl-hero-inner, .gl-hero-inner, .nw-hero-inner, .ss-hero-inner, .su-hero-inner, .co-hero-inner, .pr-hero-inner, .sl-hero-inner, .p-hero-inner, .sc-hero-inner {
    display: grid;
    grid-template-columns: minmax(0, 1.04fr) minmax(300px, .96fr);
    align-items: center;
    gap: clamp(42px, 6vw, 88px);
    max-width: var(--content-width);
    margin-inline: auto;
  }
  .hero-copy { position: relative; z-index: 1; }
  .hero-visual { position: relative; }
}
@media (max-width: 980px) {
  .sp-hero-inner, .pp-hero-inner, .bl-hero-inner, .gl-hero-inner, .nw-hero-inner, .ss-hero-inner, .su-hero-inner, .co-hero-inner, .pr-hero-inner, .sl-hero-inner, .p-hero-inner, .sc-hero-inner {
    display: flex;
    flex-direction: column;
  }
  .hero-visual {
    width: min(100%, 660px);
    margin: 8px auto 0;
    order: 10;
  }
}
/* Hero eyebrows adopt the index kicker: mint label with glowing dot. */
.sp-hero-type, .pp-hero-type {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 18px;
  color: var(--brand-mint);
  font-size: .84rem;
  font-weight: 700;
  letter-spacing: 0;
  text-transform: none;
}
.sp-hero-type::before, .pp-hero-type::before {
  content: '';
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--brand-mint);
  box-shadow: 0 0 0 6px rgba(32, 217, 180, .1);
}
.hero-eyebrow { color: var(--brand-mint); font-size: .84rem; font-weight: 700; }
.hero-eyebrow .dot { width: 8px; height: 8px; background: var(--brand-mint); box-shadow: 0 0 0 6px rgba(32, 217, 180, .1); animation: none; }
:where(.bl-hero-inner, .ss-hero-inner, .sc-hero-inner, .sl-hero-inner) > .tag {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  width: fit-content;
  margin-bottom: 18px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: none;
  color: var(--brand-mint);
  font-size: .84rem;
  font-weight: 700;
}
:where(.bl-hero-inner, .ss-hero-inner, .sc-hero-inner, .sl-hero-inner) > .tag::before {
  content: '';
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--brand-mint);
  box-shadow: 0 0 0 6px rgba(32, 217, 180, .1);
}
.gl-eyebrow, .nw-eyebrow, .su-eyebrow, .co-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 18px;
  color: var(--brand-mint);
  font-size: .84rem;
  font-weight: 700;
}
.gl-eyebrow svg, .nw-eyebrow svg, .su-eyebrow svg, .co-eyebrow svg { width: 14px; height: 14px; }

/* Section rhythm and cards */
.section-header { text-align: left; margin-bottom: clamp(28px, 3.5vw, 44px); }
.section-header h2 { max-width: 24ch; font-size: clamp(1.7rem, 2.9vw, 2.6rem); font-weight: 750; line-height: 1.12; letter-spacing: -.045em; }
.section-header p { max-width: 66ch; margin-inline: 0; line-height: 1.75; }
.section-header--split { grid-template-columns: minmax(160px, .45fr) minmax(0, 1fr); }
.section-header--split .section-header-eyebrow { border-bottom-color: rgba(32, 217, 180, .35); }
:where(.card, .sol-card, .sl-card, .pp-feature-card, .sp-challenge-card, .sp-product-card, .p-value-card, .pr-card, .co-value-card, .ss-card) {
  border-color: var(--rule);
  border-radius: var(--radius-md);
  background: var(--gradient-card);
}
:where(.card, .sol-card, .sl-card, .pp-feature-card, .sp-challenge-card, .sp-product-card, .p-value-card, .pr-card, .co-value-card, .ss-card):hover {
  border-color: rgba(32, 217, 180, .38);
  box-shadow: 0 20px 50px rgba(0, 10, 20, .16);
}
:where(.card-icon, .sol-icon, .sl-card-icon, .pp-feature-icon, .sp-challenge-icon, .sp-product-icon, .p-value-icon) { color: var(--brand-mint); }
.card-link, .sp-product-link, .sl-card-link { color: var(--brand-mint); }
.cta-section, .p-final-cta { background: var(--navy); }
/* CTAs follow the index pattern: left-aligned copy, actions on the left row. */
.sp-cta, .pp-cta, .gl-cta, .cta-section, .p-final-cta { text-align: left; }
.sp-cta-inner, .pp-cta-inner, .gl-cta-inner, .p-final-cta-inner { max-width: none; margin-inline: 0; }
.sp-cta-actions, .pp-cta-actions, .gl-cta-actions, .p-final-cta-actions, .cta-actions { justify-content: flex-start; }
.sp-cta h2, .pp-cta h2, .gl-cta h2, .cta-section h2, .p-final-cta-inner h2 { font-size: clamp(1.7rem, 2.9vw, 2.6rem); font-weight: 750; letter-spacing: -.045em; }
/* Quiet-navy action band: subtle surface, mint accents carry the colour. */
.cta-section, .p-final-cta, .pp-cta, .sp-cta, .gl-cta { background: linear-gradient(120deg, #102c42, #16405a); color: #f4fbfd; }
.cta-section::before, .sp-cta::before, .pp-cta::before, .gl-cta::before, .p-final-cta-inner::before { content: ''; background: repeating-radial-gradient(circle at 50% 150%, rgba(255, 255, 255, .07) 0 1px, transparent 1px 64px); }
.cta-section :where(h2, h3, strong), .p-final-cta :where(h2, h3, strong), .pp-cta :where(h2, h3, strong), .sp-cta :where(h2, h3, strong), .gl-cta :where(h2, h3, strong) { color: #f4fbfd; }
.cta-section p, .p-final-cta p, .pp-cta p, .sp-cta p, .gl-cta p, .p-final-cta-inner p,
.cta-section li, .p-final-cta li, .pp-cta li, .sp-cta li, .gl-cta li { color: #e9f4f9; }
.cta-section .tag, .p-final-cta .tag, .pp-cta .tag, .sp-cta .tag, .gl-cta .tag { border-color: transparent; background: #f4fbfd; color: #0a2438; }
.cta-section .btn-primary, .p-final-cta .btn-primary, .pp-cta .btn-primary, .sp-cta .btn-primary, .gl-cta .btn-primary { border-color: #f4fbfd; background: #f4fbfd; color: #0a2438; box-shadow: none; }
.cta-section .btn-primary:hover, .p-final-cta .btn-primary:hover, .pp-cta .btn-primary:hover, .sp-cta .btn-primary:hover, .gl-cta .btn-primary:hover { border-color: #e2eef4; background: #e2eef4; color: #0a2438; }
.cta-section .btn-outline, .p-final-cta .btn-outline, .pp-cta .btn-outline, .sp-cta .btn-outline, .gl-cta .btn-outline { border-color: rgba(244, 251, 253, .5); background: transparent; color: #f4fbfd; }
.cta-section .btn-outline:hover, .p-final-cta .btn-outline:hover, .pp-cta .btn-outline:hover, .sp-cta .btn-outline:hover, .gl-cta .btn-outline:hover { border-color: #f4fbfd; background: rgba(244, 251, 253, .12); color: #f4fbfd; }

/* Editorial pages: light reading surfaces inside the dark shell. */
.bp-header { background: var(--dark-navy); }
.bp-header-inner { position: relative; z-index: 1; }
.bp-header h1 { max-width: 20ch; }
.bp-subtitle { max-width: 68ch; }
.bp-layout { gap: clamp(30px, 4vw, 54px); }
.bp-content {
  padding: clamp(26px, 4.5vw, 58px);
  border: 1px solid var(--rule);
  border-radius: 24px;
  background: var(--surface);
  color: var(--white);
  box-shadow: 0 26px 70px rgba(0, 10, 20, .16);
}
.bp-content :where(h2, h3, h4, strong) { color: var(--white); }
.bp-content :where(p, li) { color: var(--gray-200); }
.bp-content .bp-lead { color: var(--white); }
.bp-content a { color: var(--brand-mint); text-decoration: underline; text-underline-offset: 3px; }
.bp-content :where(.bp-callout, .bp-checklist, .bp-quote) { color: var(--white); }
.bp-content :where(.bp-callout p, .bp-checklist li, .bp-quote p) { color: var(--gray-200); }
.bp-content .bp-callout { border-color: rgba(32, 217, 180, .3); background: rgba(32, 217, 180, .06); }
.bp-content .bp-callout--warning { border-color: rgba(255, 160, 0, .3); background: rgba(255, 160, 0, .07); }
.bp-content :where(pre, code) { font-family: 'SFMono-Regular', Consolas, monospace; }
.bp-content img, .bp-content video { border-radius: 14px; }
.bp-related-card, .bp-toc { border-color: var(--rule); background: var(--surface); }
.bp-toc-link.active, .bp-toc-link:hover { color: var(--brand-mint); }

/* Legal reading */
.legal-content {
  padding: clamp(24px, 4vw, 48px);
  border-color: var(--rule);
  border-radius: 22px;
  background: var(--surface);
  color: var(--white);
}
.legal-content :where(h2, h3, strong) { color: var(--white); }
.legal-content :where(p, li) { color: var(--gray-200); }
.legal-content a { color: var(--brand-mint); }
.legal-identity { border-color: var(--rule); background: rgba(32, 217, 180, .06); }
.legal-infobox { border-color: rgba(32, 217, 180, .32); background: rgba(32, 217, 180, .08); color: var(--white); }
.legal-toc { border-color: var(--rule); border-radius: 16px; }

/* Forms and feedback */
:where(.sc-field input, .sc-field select, .sc-field textarea, .su-input, .su-textarea, .newsletter-fields input) {
  border-color: rgba(32, 217, 180, .25);
  border-radius: 10px;
  background: rgba(244, 251, 253, .055);
}
:where(.sc-field input, .sc-field select, .sc-field textarea, .su-input, .su-textarea, .newsletter-fields input):focus { border-color: var(--brand-mint); }
.cookie-banner {
  max-width: 920px;
  margin-inline: auto;
  border-color: var(--rule) !important;
  border-radius: 16px !important;
  background: rgba(12, 38, 55, .98) !important;
  box-shadow: 0 24px 70px rgba(0, 8, 16, .5) !important;
}
footer { background: #04101b !important; }
.footer-col h3, .footer-col h5 { color: var(--white); letter-spacing: 0; text-transform: none; }
.footer-brand p, .footer-col a, .footer-legal a { line-height: 1.7; }

/* ===== Homepage ===== */
.nm-home { background: var(--dark-navy); }
.home-hero {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: clamp(112px, 11vw, 144px) 0 clamp(52px, 5.5vw, 76px);
  background:
    radial-gradient(circle at 83% 24%, rgba(21,159,211,.16), transparent 32%),
    radial-gradient(circle at 14% 86%, rgba(32,217,180,.08), transparent 30%),
    var(--dark-navy);
}
.home-hero::before {
  content: '';
  position: absolute;
  z-index: -1;
  top: 0;
  right: -8vw;
  width: 46vw;
  height: 100%;
  background: linear-gradient(140deg, rgba(21,159,211,.06), rgba(32,217,180,.025));
  clip-path: polygon(22% 0, 100% 0, 100% 100%, 0 100%);
}
.home-hero-grid { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 1.04fr) minmax(390px, .96fr); align-items: center; gap: clamp(42px, 6vw, 88px); }
.home-hero-copy { position: relative; z-index: 2; }
.home-kicker { display: flex; align-items: center; gap: 10px; margin-bottom: 18px; color: var(--brand-mint); font-size: .84rem; font-weight: 700; }
.home-kicker span { width: 8px; height: 8px; border-radius: 50%; background: var(--brand-mint); box-shadow: 0 0 0 6px rgba(32,217,180,.1); }
.home-hero h1 { max-width: 16ch; margin-bottom: 20px; color: var(--white); font-size: clamp(2.3rem, 4vw, 3.2rem); font-weight: 750; line-height: 1.08; letter-spacing: -.05em; }
.home-hero-lead { max-width: 59ch; color: var(--gray-200); font-size: clamp(1rem, 1.4vw, 1.14rem); line-height: 1.78; }
.home-hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }
.home-hero-assurances { display: flex; flex-wrap: wrap; gap: 12px 24px; margin-top: 24px; list-style: none; color: var(--gray-300); font-size: .8rem; }
.home-hero-assurances li { display: flex; align-items: center; gap: 8px; }
.home-hero-assurances li::before { content: ''; width: 15px; height: 15px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Ccircle cx='10' cy='10' r='9' fill='%2320d9b4' fill-opacity='.12'/%3E%3Cpath d='m6 10 2.5 2.5L14 7' fill='none' stroke='%2320d9b4' stroke-width='1.8'/%3E%3C/svg%3E") center/contain no-repeat; }
.home-hero-visual { position: relative; padding: 8px 0 28px; }
.home-hero-figure { position: relative; overflow: hidden; border: 1px solid rgba(128,216,234,.24); border-radius: 30px; background: var(--navy); box-shadow: 0 40px 100px rgba(0,8,16,.38); clip-path: polygon(5% 0,100% 0,95% 100%,0 100%); }
.home-hero-figure img { width: 100%; height: auto; aspect-ratio: 16 / 10; object-fit: cover; }
.home-live-panel { position: absolute; right: -12px; bottom: 0; left: 38px; padding: 18px 22px; border: 1px solid rgba(126,216,234,.24); border-radius: 16px; background: rgba(9,34,49,.9); box-shadow: 0 20px 50px rgba(0,8,16,.3); backdrop-filter: blur(16px); }
.home-live-heading { display: flex; align-items: center; gap: 9px; margin-bottom: 12px; color: var(--white); font-size: .82rem; font-weight: 700; }
.home-live-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--brand-mint); box-shadow: 0 0 0 5px rgba(32,217,180,.1); }
.home-live-channels { display: flex; flex-wrap: wrap; gap: 7px; }
.home-live-channels span { padding: 4px 9px; border: 1px solid rgba(151,204,220,.14); border-radius: 999px; color: var(--gray-200); font-size: .68rem; }
.home-credentials { border-top: 1px solid var(--rule); border-bottom: 1px solid var(--rule); background: #081c2b; }
.home-credentials-inner { display: flex; align-items: center; justify-content: space-between; gap: 28px; padding-block: 20px; }
.home-credentials p { max-width: 290px; color: var(--gray-300); font-size: .76rem; line-height: 1.5; }
.home-credential-list { display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: 12px 28px; color: var(--gray-200); font-size: .78rem; font-weight: 650; }
.home-section-heading { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(280px, .9fr); align-items: end; gap: 36px; margin-bottom: clamp(28px, 3.5vw, 44px); }
.home-section-heading h2 { max-width: 17ch; font-size: clamp(1.7rem, 2.9vw, 2.6rem); font-weight: 750; line-height: 1.1; letter-spacing: -.045em; }
.home-section-heading p { max-width: 55ch; line-height: 1.75; }
.home-problems { padding: var(--section-space) 0; background: var(--navy); color: var(--white); }
.home-problems .home-section-heading h2 { color: var(--white); }
.home-problems .home-section-heading p { color: var(--gray-300); }
.home-problem-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.home-problem-card { position: relative; overflow: hidden; padding: 18px 20px; border: 1px solid var(--rule); border-radius: 18px; background: var(--gradient-card); box-shadow: var(--shadow-card); transition: border-color var(--transition), box-shadow var(--transition); }
.home-problem-card > img { position: absolute; right: 0; bottom: 0; width: 66%; height: 74%; border: 0; border-radius: 0; object-fit: cover; -webkit-mask-image: linear-gradient(to top left, #000 32%, transparent 70%); mask-image: linear-gradient(to top left, #000 32%, transparent 70%); transition: transform 350ms ease; }
.home-problem-card:hover { border-color: rgba(32, 217, 180, .38); box-shadow: 0 20px 50px rgba(0, 10, 20, .28); }
.home-problem-card:hover > img { transform: scale(1.03); }
.home-problem-content { position: relative; z-index: 1; display: flex; min-height: 150px; padding: 0; flex-direction: column; justify-content: flex-end; }
.home-problem-content h3 { margin-bottom: 8px; color: var(--white); font-size: 1.06rem; font-weight: 750; line-height: 1.35; letter-spacing: -.02em; }
.home-problem-content p { margin-bottom: 14px; color: var(--gray-300); font-size: .86rem; line-height: 1.65; }
.home-text-link { display: inline-flex; align-items: center; width: fit-content; margin-top: auto; color: var(--brand-mint); font-size: .82rem; font-weight: 750; text-decoration: underline; text-decoration-color: rgba(32, 217, 180, .35); text-underline-offset: 5px; }
.home-workflow { padding: var(--section-space) 0; background: var(--dark-navy); }
.home-workflow-grid { display: grid; grid-template-columns: minmax(0, .96fr) minmax(0, 1.04fr); align-items: center; gap: clamp(48px, 7vw, 96px); }
.home-workflow-visual { position: relative; }
.home-workflow-visual::before { content: ''; position: absolute; inset: 10% -5% -5% 10%; border: 1px solid rgba(32,217,180,.18); border-radius: 28px; }
.home-workflow-visual img { position: relative; width: 100%; max-height: 440px; object-fit: cover; border: 1px solid rgba(128,216,234,.2); border-radius: 28px; box-shadow: 0 30px 80px rgba(0,8,16,.3); }
.home-workflow-copy h2 { max-width: 19ch; margin-bottom: 20px; font-size: clamp(1.7rem, 2.8vw, 2.5rem); font-weight: 750; line-height: 1.12; letter-spacing: -.045em; }
.home-section-lead { max-width: 55ch; color: var(--gray-300); }
.home-steps { margin-top: 34px; list-style: none; border-top: 1px solid var(--rule); }
.home-steps li { display: grid; grid-template-columns: 38px 1fr; gap: 18px; padding: 18px 0; border-bottom: 1px solid var(--rule); }
.home-steps li > span { display: flex; align-items: center; justify-content: center; width: 32px; height: 32px; margin-top: 2px; border: 1px solid rgba(32,217,180,.35); border-radius: 50%; color: var(--brand-mint); font-size: .8rem; font-weight: 750; }
.home-steps h3 { margin-bottom: 6px; font-size: 1rem; font-weight: 750; }
.home-steps p { max-width: 52ch; color: var(--gray-300); font-size: .88rem; line-height: 1.7; }
.home-workflow-cta { margin-top: 30px; }
.home-products { padding: var(--section-space) 0; background: var(--navy); color: var(--white); }
.home-products .home-section-heading h2 { color: var(--white); }
.home-products .home-section-heading p { color: var(--gray-300); }
.home-product-list { border-top: 1px solid var(--rule); }
.home-product-row { display: grid; grid-template-columns: minmax(220px, .8fr) minmax(0, 1.6fr) auto; align-items: center; gap: 24px; padding: 24px 16px; border-bottom: 1px solid var(--rule); }
.home-product-row--featured { margin-top: 12px; border: 1px solid rgba(32, 217, 180, .35); border-radius: 18px; background: var(--surface-raised); }
.home-product-identity { display: flex; align-items: center; gap: 15px; }
.home-product-identity img { width: 38px; height: 38px; object-fit: contain; }
.home-product-identity h3 { color: var(--white); font-size: 1.05rem; font-weight: 800; letter-spacing: -.02em; }
.home-product-row > p { color: var(--gray-300); font-size: .9rem; line-height: 1.7; }
.home-product-group { margin: 32px 0 2px; color: var(--brand-mint); font-size: .78rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.home-product-row--service { padding: 16px; }
.home-service-icon-img { width: 40px; height: 40px; flex-shrink: 0; }
.home-suite-mark { width: 38px; height: 38px; background: linear-gradient(135deg, var(--brand-mint), var(--brand-blue)); clip-path: polygon(0 0,50% 36%,100% 0,86% 100%,50% 66%,14% 100%); }
.home-products-note { max-width: 86ch; margin-top: 30px; color: var(--gray-300); font-size: .84rem; }
.home-products-note a { color: var(--brand-mint); font-weight: 700; text-decoration: underline; text-underline-offset: 4px; }

/* Statement band: quiet navy strip — the mint accents carry the colour. */
.home-statement { position: relative; overflow: hidden; padding: clamp(44px, 5.5vw, 72px) 0; background: linear-gradient(120deg, #102c42, #16405a); color: #f4fbfd; text-align: center; }
.home-statement::before { content: ''; position: absolute; inset: 0; background: repeating-radial-gradient(circle at 50% 150%, rgba(255, 255, 255, .07) 0 1px, transparent 1px 64px); pointer-events: none; }
.home-statement .container { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; }
.home-statement-kicker { display: inline-flex; align-items: center; gap: 10px; margin-bottom: 18px; color: #f4fbfd; font-size: .8rem; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; }
.home-statement-kicker span { width: 8px; height: 8px; border-radius: 50%; background: var(--brand-mint); box-shadow: 0 0 0 5px rgba(32, 217, 180, .28); }
.home-statement h2 { max-width: 24ch; margin-inline: auto; color: #f4fbfd; font-size: clamp(1.5rem, 3.1vw, 2.45rem); font-weight: 800; line-height: 1.12; letter-spacing: -.02em; text-wrap: balance; }
.home-statement-chips { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-top: 26px; padding: 0; list-style: none; }
.home-statement-chips li { padding: 9px 22px; border-radius: 999px; background: #f4fbfd; color: #0a2438; font-size: .88rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.home-statement-sub { margin-top: 18px; color: #f4fbfd; font-size: 1.05rem; font-weight: 600; }

/* Guide strip: how to use this page, in one slim bar. */
.home-guide { padding: 22px 0; background: var(--navy); border-bottom: 1px solid var(--rule); }
.home-guide-inner { display: flex; flex-wrap: wrap; align-items: center; gap: 18px 40px; }
.home-guide-title { margin: 0; color: var(--brand-mint); font-size: .78rem; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }
.home-guide-grid { display: flex; flex-wrap: wrap; gap: 14px 40px; }
.home-guide-grid a { display: flex; align-items: center; gap: 12px; }
.home-guide-grid a > span { display: grid; place-items: center; width: 26px; height: 26px; flex-shrink: 0; border: 1px solid rgba(32, 217, 180, .4); border-radius: 50%; color: var(--brand-mint); font-size: .78rem; font-weight: 800; }
.home-guide-grid .home-guide-h { margin: 0 0 2px; color: var(--white); font-size: .92rem; font-weight: 750; letter-spacing: -.01em; }
.home-guide-grid p { color: var(--gray-300); font-size: .8rem; line-height: 1.5; }
@media (max-width: 820px) {
  .home-guide-inner { flex-direction: column; align-items: flex-start; gap: 14px; }
  .home-guide-grid { flex-direction: column; gap: 12px; }
}
.home-audiences { padding: var(--section-space) 0; background: var(--dark-navy); }
.home-audiences .home-section-heading p { color: var(--gray-300); }
.home-audience-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; border-top: 1px solid var(--rule); border-bottom: 1px solid var(--rule); }
.home-audience-grid > a { padding: 26px 30px 28px 0; }
.home-audience-grid > a + a { padding-left: 34px; border-left: 1px solid var(--rule); }
.home-audience-grid h3 { margin-bottom: 10px; font-size: 1.16rem; font-weight: 750; }
.home-audience-grid p { color: var(--gray-300); font-size: .9rem; line-height: 1.75; }
.home-audience-grid a:hover h3 { color: var(--brand-mint); }
.home-newsletter { position: relative; overflow: hidden; padding: clamp(44px, 5vw, 64px) 0; background: linear-gradient(120deg, #102c42, #16405a); color: #f4fbfd; }
.home-newsletter::before { content: ''; position: absolute; inset: 0; background: repeating-radial-gradient(circle at 50% 150%, rgba(255, 255, 255, .07) 0 1px, transparent 1px 64px); pointer-events: none; }
.home-newsletter-inner { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(330px, .9fr); align-items: center; gap: 60px; }
.home-newsletter h2 { max-width: 20ch; margin-bottom: 12px; color: #f4fbfd; font-size: clamp(1.5rem, 2.4vw, 2rem); font-weight: 800; line-height: 1.16; letter-spacing: -.04em; }
.home-newsletter p { max-width: 55ch; color: #e9f4f9; font-size: .9rem; }
.home-newsletter .newsletter-fields { display: flex; gap: 10px; }
.home-newsletter .newsletter-fields input { min-width: 0; min-height: 52px; flex: 1; padding: 12px 16px; border: 1px solid rgba(244, 251, 253, .35); background: rgba(255, 255, 255, .94); color: var(--ink); }
.home-newsletter .newsletter-fields input::placeholder { color: #5b7a83; }
.home-newsletter .btn-primary { border-color: #0a2438; background: #0a2438; color: #f4fbfd; box-shadow: none; }
.home-newsletter .btn-primary:hover { border-color: #0e2c42; background: #0e2c42; color: #f4fbfd; }
.home-newsletter .newsletter-note { margin-top: 12px; font-size: .7rem; color: #e9f4f9; }
.home-newsletter .newsletter-note a { color: #f4fbfd; text-decoration: underline; }
.home-newsletter .newsletter-success { padding: 16px; border: 1px solid rgba(244, 251, 253, .35); border-radius: 12px; color: #f4fbfd; font-weight: 700; }
.home-final-cta { padding: clamp(52px, 6vw, 76px) 0; background: var(--dark-navy); }
.home-final-cta-inner { display: flex; align-items: center; justify-content: space-between; gap: 48px; }
.home-final-cta h2 { max-width: 20ch; margin-bottom: 12px; font-size: clamp(1.7rem, 2.9vw, 2.5rem); font-weight: 750; line-height: 1.12; letter-spacing: -.045em; }
.home-final-cta p { max-width: 60ch; color: var(--gray-300); }
.home-final-cta .btn-primary { flex-shrink: 0; }

@keyframes home-enter {
  from { opacity: 0; transform: translateY(18px); }
  to { opacity: 1; transform: translateY(0); }
}
.home-hero-copy { animation: home-enter .65s ease both; }
.home-hero-visual { animation: home-enter .75s .08s ease both; }

@media (max-width: 1080px) {
  .home-hero-grid { grid-template-columns: 1fr 1fr; gap: 38px; }
  .home-hero h1 { font-size: clamp(2.2rem, 4.4vw, 3rem); }
  .home-problem-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .home-product-row { grid-template-columns: minmax(200px, .8fr) minmax(0, 1.4fr); }
  .home-product-row > .home-text-link { grid-column: 2; }
  .home-credentials-inner { align-items: flex-start; flex-direction: column; }
  .home-credential-list { justify-content: flex-start; }
}
@media (max-width: 820px) {
  .home-hero { padding-top: 104px; }
  .home-hero-grid, .home-workflow-grid, .home-newsletter-inner { grid-template-columns: 1fr; }
  .home-hero-copy { max-width: 680px; }
  .home-hero h1 { max-width: 14ch; }
  .home-hero-visual { width: min(100%, 660px); margin: 8px auto 0; }
  .home-live-panel { right: 16px; }
  .home-section-heading { grid-template-columns: 1fr; gap: 18px; }
  .home-section-heading h2 { max-width: 22ch; }
  .home-workflow-visual { width: min(100%, 620px); }
  .home-workflow-copy { max-width: 680px; }
  .home-audience-grid { grid-template-columns: 1fr; }
  .home-audience-grid > a { padding: 26px 0; }
  .home-audience-grid > a + a { padding-left: 0; border-top: 1px solid var(--rule); border-left: 0; }
  .home-final-cta-inner { align-items: flex-start; flex-direction: column; }
  .home-newsletter-inner { gap: 30px; }
  :where(.co-hero-bg, .pr-hero-bg, .sl-hero-bg, .p-hero-bg, .sc-hero-bg, .nw-hero-bg, .gl-hero-bg, .ss-hero-bg, .su-hero-bg, .bl-hero-bg, .pp-hero-bg, .sp-hero-bg, .bp-header-bg, .legal-hero-bg, .home-hero-bg)::after { background: rgba(6,21,34,.88) !important; }
}
@media (max-width: 640px) {
  .nav-logo img { height: 34px !important; }
  .home-hero { padding: 96px 0 56px; }
  .home-hero h1 { font-size: clamp(2rem, 8.5vw, 2.6rem); }
  .home-hero-actions { flex-direction: column; }
  .home-hero-assurances { align-items: flex-start; flex-direction: column; }
  .home-hero-figure { border-radius: 20px; clip-path: none; }
  .home-live-panel { position: relative; right: auto; bottom: auto; left: auto; margin: -18px 12px 0; }
  .home-live-channels span { font-size: .64rem; }
  .home-credential-list { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
  .home-problem-grid { grid-template-columns: 1fr; }
  .home-problem-content { min-height: 132px; }
  .home-problem-card { padding: 16px; }
  .home-problem-card > img { width: 82%; height: 70%; }
  .home-product-row { grid-template-columns: 1fr; gap: 16px; padding: 26px 8px; }
  .home-product-row--featured { padding: 24px; }
  .home-product-row > .home-text-link { grid-column: auto; }
  .home-newsletter .newsletter-fields { flex-direction: column; }
  .home-final-cta .btn-primary { width: 100%; }
  .bp-content { padding: 24px 20px; border-radius: 16px; }
  .cookie-banner { align-items: stretch; flex-direction: column; }
  .cookie-banner-actions { margin-left: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .home-hero-copy, .home-hero-visual { animation: none; }
  .home-problem-card > img { transition: none; }
}

/* "Cómo ayuda Notmining" cards adopt the index card look: blended art in the corner. */
.sp-solutions-list, .sp-help-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); gap: 16px; margin-top: 4px; border: 0; border-radius: 0; overflow: visible; background: none; }
.sp-solution-row { position: relative; overflow: hidden; display: block; direction: ltr; border: 1px solid var(--rule); border-radius: 18px; background: var(--gradient-card); box-shadow: var(--shadow-card); transition: border-color var(--transition), box-shadow var(--transition); }
.sp-solution-row:nth-child(even) { direction: ltr; }
.sp-solution-row:hover { border-color: rgba(32, 217, 180, .38); background: var(--gradient-card); box-shadow: 0 20px 50px rgba(0, 10, 20, .28); }
.sp-solution-content { position: relative; z-index: 1; box-sizing: border-box; min-height: 216px; padding: 22px; gap: 10px; justify-content: flex-end; }
.sp-solution-visual { display: none; }
.sp-help-card { position: relative; padding: 22px; gap: 10px; border-radius: 18px; }
.sp-help-card__icon { display: none; }
.sp-help-card > *:not(.sp-card-art):not(.sp-help-card__num) { position: relative; z-index: 1; }
.sp-card-art { position: absolute; right: 0; bottom: 0; width: 66%; height: 74%; border: 0; border-radius: 0; object-fit: cover; -webkit-mask-image: linear-gradient(to top left, #000 32%, transparent 70%); mask-image: linear-gradient(to top left, #000 32%, transparent 70%); }

/* Blog: editorial listing with blended art (index card style), sidebar on the right. */
.bl-layout { grid-template-columns: minmax(0, 1fr) 300px; }
.bl-grid { grid-column: 1; grid-row: 1; }
.bl-sidebar { grid-column: 2; grid-row: 1; }
@media (max-width: 1024px) {
  .bl-layout { grid-template-columns: 1fr; }
  .bl-grid { grid-column: 1; grid-row: 1; }
  .bl-sidebar { grid-column: 1; grid-row: 2; }
}
.bl-featured-card { position: relative; overflow: hidden; display: flex; flex-direction: column; justify-content: center; min-height: 300px; padding: 30px; }
.bl-featured-art { position: absolute; right: 0; bottom: 0; width: 54%; height: 94%; border: 0; object-fit: cover; -webkit-mask-image: linear-gradient(to top left, #000 30%, transparent 68%); mask-image: linear-gradient(to top left, #000 30%, transparent 68%); }
.bl-featured-label, .bl-featured-card h2, .bl-featured-card > p, .bl-featured-meta { position: relative; z-index: 1; max-width: 58%; }
.bl-card { position: relative; overflow: hidden; min-height: 232px; padding: 56px 20px 20px; display: flex; flex-direction: column; justify-content: flex-end; }
.bl-card-art { position: absolute; right: 0; bottom: 0; width: 66%; height: 72%; border: 0; object-fit: cover; -webkit-mask-image: linear-gradient(to top left, #000 32%, transparent 70%); mask-image: linear-gradient(to top left, #000 32%, transparent 70%); }
.bl-card > *:not(.bl-card-art) { position: relative; z-index: 1; }
.bl-card .bl-card-top { position: absolute; top: 18px; left: 20px; }

/* Success stories: the same editorial card language (blended art, chip on top). */
.ss-hero-inner .ss-filters { margin-top: 22px; }
.ss-card { position: relative; overflow: hidden; min-height: 280px; padding: 58px 22px 20px; display: flex; flex-direction: column; justify-content: flex-end; }
.ss-card-art { position: absolute; right: 0; bottom: 0; width: 66%; height: 70%; border: 0; object-fit: cover; -webkit-mask-image: linear-gradient(to top left, #000 32%, transparent 70%); mask-image: linear-gradient(to top left, #000 32%, transparent 70%); }
.ss-card > *:not(.ss-card-art) { position: relative; z-index: 1; }
.ss-card .ss-card-header { position: absolute; top: 18px; left: 22px; right: 22px; z-index: 2; }

/* News: the same editorial card grid as blog and success stories. */
.nw-board-inner { max-width: none; margin: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 16px; }
.nw-board-inner::before { display: none; }
.nw-entry.nw-card { position: relative; overflow: hidden; display: flex; flex-direction: column; justify-content: flex-end; min-height: 250px; padding: 56px 20px 20px; border: 1px solid var(--rule); border-bottom: 1px solid var(--rule); border-radius: 18px; background: var(--gradient-card); box-shadow: var(--shadow-card); transition: border-color var(--transition), box-shadow var(--transition); }
.nw-entry.nw-card::before { display: none; }
.nw-entry.nw-card:hover { border-color: rgba(32, 217, 180, .38); box-shadow: 0 20px 50px rgba(0, 10, 20, .28); }
.nw-card-art { position: absolute; right: 0; bottom: 0; width: 66%; height: 70%; border: 0; object-fit: cover; -webkit-mask-image: linear-gradient(to top left, #000 32%, transparent 70%); mask-image: linear-gradient(to top left, #000 32%, transparent 70%); }
.nw-entry.nw-card > *:not(.nw-card-art) { position: relative; z-index: 1; }
.nw-entry.nw-card .nw-card-top { position: absolute; top: 18px; left: 20px; right: 20px; z-index: 2; display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.nw-card-top time { color: var(--gray-300); font-size: .78rem; }
/* Filtering and pagination must be able to hide the cards (JS toggles these classes). */
.nw-entry.nw-card.hidden, .nw-entry.nw-card.nw-page-hidden { display: none; }
/* Pagination and empty state span the full grid row. */
.nw-board-inner .nw-empty, .nw-board-inner .nw-pagination { grid-column: 1 / -1; }
.nw-board-inner .nw-pagination { padding: 22px 0 0; justify-content: center; }
.nw-board-inner .nw-pagination .nw-page-spacer { flex: 0; }

/* ===== Accessibility utilities ===== */
/* Skip link: first focusable element, hidden until keyboard focus. */
.skip-link { position: fixed; top: 14px; left: 14px; z-index: 9999; padding: 13px 20px; border-radius: 12px; background: var(--brand-mint); color: #042c2a; font-size: .92rem; font-weight: 800; text-decoration: none; transform: translateY(-220%); transition: transform .18s ease; }
.skip-link:focus { transform: translateY(0); }

/* WhatsApp floating contact button. */
.wa-fab { position: fixed; right: 22px; bottom: 22px; z-index: 900; display: grid; place-items: center; width: 56px; height: 56px; border-radius: 50%; background: #25D36A; color: #ffffff; box-shadow: 0 14px 34px rgba(0, 10, 20, .4); transition: transform .2s ease, box-shadow .2s ease; }
.wa-fab:hover { transform: translateY(-3px) scale(1.05); box-shadow: 0 18px 40px rgba(0, 10, 20, .45); }
.wa-fab svg { width: 30px; height: 30px; }
/* While the cookie notice is open, the button floats above it (height measured in JS). */
body.cookies-pending .wa-fab { bottom: var(--cookie-shift, 118px); }
@media (max-width: 640px) {
  .wa-fab { right: 16px; bottom: 16px; width: 50px; height: 50px; }
  .wa-fab svg { width: 26px; height: 26px; }
}

/* Inputs never below 16px (avoids unwanted zoom on mobile browsers). */
input, textarea, select { font-size: 1rem; }

/* Legal pages: readable breadcrumb and clearly marked links. */
.legal-breadcrumb span, .bp-breadcrumb span { color: var(--gray-300); }
.legal-content a { color: var(--brand-mint); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }

/* Video facade (company): no third-party cookies until the visitor asks for playback. */
.co-video-facade {
  position: relative;
  display: grid;
  place-items: center;
  cursor: pointer;
  background:
    radial-gradient(ellipse 60% 70% at 50% 40%, rgba(32, 217, 180, .16), transparent 72%),
    var(--gradient-card);
}
.co-video-play {
  display: inline-flex;
  align-items: center;
  gap: 14px;
  padding: 15px 26px 15px 22px;
  border: 1px solid rgba(128, 216, 234, .3);
  border-radius: 999px;
  background: rgba(6, 21, 34, .7);
  color: var(--white);
  font: inherit;
  font-weight: 700;
  cursor: pointer;
  transition: border-color var(--transition), background var(--transition), color var(--transition), transform var(--transition);
}
.co-video-play svg { flex-shrink: 0; }
.co-video-facade:hover .co-video-play,
.co-video-facade:focus-visible .co-video-play { border-color: var(--brand-mint); background: var(--brand-mint); color: var(--dark-navy); transform: translateY(-2px); }
@media (max-width: 640px) {
  .co-video-play { padding: 13px 20px 13px 18px; }
}