:root {
  color-scheme: dark;
  --bg: #020811;
  --surface: #07101d;
  --surface-2: #040a13;
  --text: #f5f8fc;
  --muted: #aab9ca;
  --line: rgba(88, 138, 190, 0.23);
  --violet: #8b45ff;
  --mint: #55ead3;
  --focus: #8ff8e7;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  min-width: 320px;
  background: var(--bg);
  color: var(--text);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
}
body.menu-open { overflow: hidden; }
img { max-width: 100%; }
a { color: inherit; text-decoration: none; }
button { font: inherit; }
a:focus-visible,
button:focus-visible {
  outline: 3px solid var(--focus);
  outline-offset: 4px;
  border-radius: 6px;
}
.skip-link {
  position: fixed;
  left: 16px;
  top: -80px;
  z-index: 100;
  padding: 10px 16px;
  background: var(--mint);
  color: #031217;
  font-weight: 800;
  border-radius: 8px;
  transition: top 0.18s ease;
}
.skip-link:focus { top: 12px; }
.wrap { width: min(1240px, calc(100% - 64px)); margin-inline: auto; }

.topbar {
  min-height: 72px;
  border-bottom: 1px solid rgba(111, 160, 210, 0.13);
  background: rgba(2, 8, 17, 0.94);
  backdrop-filter: blur(14px);
  display: flex;
  align-items: center;
  position: sticky;
  top: 0;
  z-index: 50;
}
.topbar .wrap { display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.brand { flex: 0 0 auto; }
.brand img { width: 245px; height: auto; display: block; }
.nav { display: flex; align-items: center; gap: 24px; font-size: 13.5px; color: #cbd7e5; }
.nav a { padding: 10px 0; white-space: nowrap; }
.nav a:hover,
.nav a[aria-current="page"] { color: #fff; }
.nav a[aria-current="page"] { box-shadow: inset 0 -2px #41ddcc; }
.nav .cta {
  padding: 13px 22px;
  border-radius: 24px;
  font-weight: 800;
  color: #04121a;
  background: linear-gradient(90deg, #6bf4dc, #43e2cc);
  box-shadow: 0 5px 20px rgba(61, 226, 202, 0.14);
}
.menu-toggle {
  display: none;
  width: 44px;
  height: 44px;
  padding: 0;
  border: 1px solid rgba(138, 171, 206, 0.22);
  border-radius: 10px;
  background: #08111e;
  color: #fff;
  cursor: pointer;
}
.menu-toggle span {
  display: block;
  width: 20px;
  height: 2px;
  margin: 4px auto;
  border-radius: 2px;
  background: currentColor;
  transition: transform 0.18s ease, opacity 0.18s ease;
}
.menu-toggle[aria-expanded="true"] span:nth-child(1) { transform: translateY(6px) rotate(45deg); }
.menu-toggle[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.menu-toggle[aria-expanded="true"] span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }

.hero {
  position: relative;
  overflow: hidden;
  background: linear-gradient(180deg, #020811 0%, #030914 100%);
  border-bottom: 1px solid rgba(94, 148, 204, 0.08);
}
.hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at 71% 42%, rgba(83, 62, 238, 0.13), transparent 31%), radial-gradient(circle at 84% 52%, rgba(32, 221, 216, 0.08), transparent 25%);
  pointer-events: none;
}
.hero .wrap {
  min-height: 458px;
  display: grid;
  grid-template-columns: 0.9fr 1.1fr;
  gap: 34px;
  align-items: center;
  padding: 40px 0 28px;
  position: relative;
}
.hero-copy { z-index: 2; padding-left: 10px; }
.hero h1 {
  font-size: clamp(2.7rem, 4.3vw, 3.4rem);
  line-height: 1.03;
  letter-spacing: -0.035em;
  margin: 0 0 21px;
  max-width: 570px;
  font-weight: 850;
}
.hero h1 .accent {
  background: linear-gradient(90deg, #bd5af7, #7d73ff, #52e0ce);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.hero .lead { font-size: 16.5px; line-height: 1.62; color: #c8d3df; max-width: 545px; margin: 0 0 27px; }
.hero-actions { display: flex; gap: 14px; align-items: center; flex-wrap: wrap; }
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 46px;
  padding: 12px 24px;
  border-radius: 23px;
  font-weight: 800;
  font-size: 13px;
  transition: transform 0.18s ease, filter 0.18s ease;
}
.btn:hover,
.nav .cta:hover,
.social-cta:hover { transform: translateY(-1px); filter: brightness(1.06); }
.btn-primary { background: linear-gradient(90deg, #8b45ff, #6d5bff); box-shadow: 0 5px 20px rgba(108, 77, 255, 0.2); }
.btn-outline { border: 1px solid rgba(134, 93, 255, 0.75); background: rgba(6, 12, 24, 0.45); }
.disclaimer { margin-top: 20px; color: #a6b4c5; font-size: 12px; line-height: 1.5; max-width: 570px; }
.hero-visual { position: relative; z-index: 2; align-self: stretch; display: flex; align-items: center; justify-content: center; overflow: hidden; }
.hero-visual img { width: 103%; max-width: 735px; height: auto; display: block; object-fit: cover; object-position: center; filter: drop-shadow(0 18px 34px rgba(0, 0, 0, 0.28)); }

.cards-section { padding: 25px 0 12px; }
.cards { display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; }
.card,
.content-card {
  border: 1px solid var(--line);
  border-radius: 12px;
  background: linear-gradient(145deg, var(--surface), var(--surface-2));
}
.card {
  min-height: 195px;
  padding: 22px 20px;
  position: relative;
  overflow: hidden;
  transition: transform 0.18s ease, border-color 0.18s ease, background 0.18s ease;
}
.card::after { content: ""; position: absolute; right: -35px; bottom: -40px; width: 110px; height: 110px; border-radius: 50%; background: #6340ff; filter: blur(55px); opacity: 0.06; }
.card:hover { transform: translateY(-3px); border-color: rgba(138, 88, 255, 0.52); background: linear-gradient(145deg, #091525, #050b15); }
.card.acq { border-color: rgba(84, 225, 192, 0.58); background: radial-gradient(circle at 92% 10%, rgba(48, 215, 186, 0.13), transparent 32%), linear-gradient(145deg, var(--surface), var(--surface-2)); }
.card.acq:hover { border-color: rgba(84, 225, 192, 0.78); }
.card .tag { display: inline-block; background: rgba(84, 95, 189, 0.22); color: #a995ff; padding: 4px 10px; border-radius: 15px; font-size: 10px; margin-bottom: 10px; }
.icon { font-size: 29px; color: #a64cff; line-height: 1; }
.card h2,
.card h3 { font-size: 16px; margin: 17px 0 8px; line-height: 1.28; }
.card p { color: var(--muted); font-size: 12.5px; line-height: 1.6; margin: 0 0 14px; }
.card .more { position: relative; z-index: 1; font-size: 11.5px; color: #c776ff; font-weight: 750; }
.card.acq .btn-mini { display: inline-flex; position: relative; z-index: 1; background: linear-gradient(90deg, #6ff5dc, #49e5cc); color: #06161c; font-weight: 850; border-radius: 22px; padding: 10px 18px; font-size: 11px; }

.why { padding: 22px 0 25px; }
.why-grid { display: grid; grid-template-columns: 1.2fr 0.88fr; gap: 34px; align-items: center; }
.why h2 { font-size: 29px; margin: 0 0 8px; }
.why .intro { font-size: 14.5px; color: #bcc9d8; margin-bottom: 24px; }
.why-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
.stat .si { font-size: 24px; color: #9b4dff; }
.stat b { display: block; margin: 8px 0 4px; font-size: 12.5px; }
.stat span { font-size: 10.5px; color: #91a3b8; line-height: 1.45; }
.quote { min-height: 205px; border: 1px solid rgba(95, 142, 194, 0.22); border-radius: 14px; overflow: hidden; background: url("quote-card.png") center / cover no-repeat; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.012), 0 12px 30px rgba(0, 0, 0, 0.16); }

.newsletter { padding: 6px 0 30px; }
.newsletter-box { border: 1px solid rgba(65, 224, 196, 0.42); border-radius: 12px; min-height: 68px; display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 12px 18px 12px 20px; background: linear-gradient(90deg, rgba(63, 41, 143, 0.15), rgba(5, 20, 29, 0.3)); }
.newsletter-copy { display: flex; align-items: baseline; gap: 18px; min-width: 0; }
.newsletter-copy strong { font-size: 14.5px; white-space: nowrap; }
.newsletter-copy small { font-size: 11.5px; color: #9fb0c3; }
.social-cta { display: inline-flex; align-items: center; justify-content: center; min-height: 40px; padding: 0 18px; border-radius: 8px; background: linear-gradient(90deg, #70f3dc, #4ce4ca); color: #06151a; font-size: 11.5px; font-weight: 850; white-space: nowrap; box-shadow: 0 5px 18px rgba(67, 222, 198, 0.1); transition: transform 0.18s ease, filter 0.18s ease; }

.footer { padding: 30px 0 18px; border-top: 1px solid rgba(106, 152, 200, 0.09); }
.footer-grid { display: grid; grid-template-columns: 1.4fr 0.7fr 0.8fr 0.65fr; gap: 40px; }
.footer-brand img { width: 215px; height: auto; }
.footer p { font-size: 11px; color: #8191a5; max-width: 290px; line-height: 1.6; }
.footer h2 { font-size: 12px; margin: 0 0 10px; }
.footer-links { display: flex; flex-direction: column; align-items: flex-start; gap: 7px; font-size: 11px; color: #9caec2; }
.footer-links a:hover { color: #fff; }
.socials { display: flex; gap: 10px; margin-bottom: 10px; }
.social { width: 32px; height: 32px; border: 1px solid rgba(129, 156, 187, 0.23); border-radius: 7px; display: grid; place-items: center; font-size: 12px; }
.handle { font-size: 10.5px; color: #8495aa; }
.copyright { margin-top: 28px; font-size: 10px; color: #6f8296; display: flex; justify-content: space-between; gap: 20px; }

.subhero { padding: 72px 0 42px; background: radial-gradient(circle at 16% 0%, rgba(124, 71, 255, 0.1), transparent 35%); }
.subhero h1 { font-size: clamp(2.4rem, 5vw, 3rem); line-height: 1.1; letter-spacing: -0.03em; margin: 0 0 14px; }
.subhero p { color: #aebdd0; max-width: 760px; margin: 0; }
.content { padding: 0 0 64px; }
.content-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.content-card { padding: 24px; }
.content-card h2 { font-size: 17px; margin: 0 0 9px; }
.content-card p { font-size: 13px; color: #a8b9cc; line-height: 1.65; margin: 0; }
.content-card a,
.legal a { color: #7cebd8; text-decoration: underline; text-underline-offset: 3px; }
.legal { max-width: 860px; }
.legal h2 { font-size: 22px; margin-top: 30px; }
.legal h3 { font-size: 17px; margin-top: 24px; }
.legal p,
.legal li { color: #aebed0; font-size: 13px; line-height: 1.7; }
.warning { border: 1px solid rgba(255, 180, 70, 0.38); background: rgba(120, 75, 12, 0.12); padding: 15px; border-radius: 10px; color: #e6c17f; font-size: 12px; margin: 18px 0; }
.not-found { min-height: 60vh; display: grid; place-items: center; text-align: center; }
.not-found .legal { padding: 60px 0; }
.not-found .code { display: block; color: #9a63ff; font-size: 14px; font-weight: 800; letter-spacing: 0.2em; margin-bottom: 10px; }

@media (max-width: 1120px) {
  .menu-toggle { display: block; }
  .nav {
    display: none;
    position: fixed;
    inset: 72px 0 auto;
    max-height: calc(100vh - 72px);
    overflow-y: auto;
    padding: 18px 32px 28px;
    background: rgba(2, 8, 17, 0.99);
    border-bottom: 1px solid rgba(111, 160, 210, 0.16);
    flex-direction: column;
    align-items: stretch;
    gap: 4px;
  }
  .nav.open { display: flex; }
  .nav a { padding: 12px 2px; }
  .nav a[aria-current="page"] { box-shadow: none; color: var(--mint); }
  .nav .cta { text-align: center; margin-top: 8px; padding: 13px 18px; }
  .hero .wrap { grid-template-columns: 1fr; min-height: auto; }
  .hero-copy { padding: 15px 0 0; }
  .hero-visual { max-height: 560px; }
  .hero-visual img { width: 100%; max-width: 760px; }
  .cards { grid-template-columns: repeat(2, 1fr); }
  .cards .card:last-child { grid-column: 1 / -1; }
  .why-grid { grid-template-columns: 1fr; }
  .footer-grid { grid-template-columns: 1fr 1fr; }
  .newsletter-box { align-items: flex-start; flex-direction: column; }
  .newsletter-copy { align-items: flex-start; flex-direction: column; gap: 4px; }
  .why-stats { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 650px) {
  .wrap { width: min(100% - 30px, 1185px); }
  .topbar { min-height: 64px; }
  .brand img { width: 190px; }
  .nav { inset: 64px 0 auto; max-height: calc(100vh - 64px); padding-inline: 15px; }
  .hero .wrap { padding: 28px 0 20px; gap: 10px; }
  .hero h1 { font-size: clamp(2.25rem, 11vw, 2.6rem); }
  .hero .lead { font-size: 14.5px; }
  .hero-actions { align-items: stretch; flex-direction: column; }
  .btn { width: 100%; }
  .disclaimer { font-size: 11px; }
  .cards { grid-template-columns: 1fr; }
  .cards .card:last-child { grid-column: auto; }
  .why-stats { grid-template-columns: 1fr 1fr; }
  .newsletter-copy small { font-size: 11px; line-height: 1.45; }
  .social-cta { width: 100%; white-space: normal; text-align: center; }
  .footer-grid { grid-template-columns: 1fr; gap: 28px; }
  .copyright { flex-direction: column; gap: 6px; }
  .content-grid { grid-template-columns: 1fr; }
  .subhero { padding: 52px 0 34px; }
  .quote { min-height: 180px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: 0.01ms !important; animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; }
}

/* V9 independent operator notice and accessible learning panel */
.independence-bar{background:#071322;border-bottom:1px solid #233849;color:#c3d3e0;font-size:13px;line-height:1.6;padding:10px 0}.independence-bar .wrap{max-width:1240px}.learning-panel{border:1px solid #29415a;border-radius:16px;padding:32px;background:linear-gradient(135deg,#0b1b30,#101529);align-self:stretch}.learning-panel .eyebrow{color:#90d9ee;letter-spacing:.12em;font-size:12px}.learning-panel h2{font-size:26px;line-height:1.25}.learning-panel ol{padding-left:22px;line-height:2}.learning-panel p{font-size:14px;line-height:1.7;color:#b7c8d8}.learning-panel a,.content-card a{color:#a5dff1;text-decoration:underline;text-underline-offset:3px}.copyright{gap:16px;flex-wrap:wrap}.disclaimer{line-height:1.65} @media(max-width:600px){.independence-bar{font-size:12px}.learning-panel{padding:24px}.learning-panel h2{font-size:23px}}

/* =========================================================
   V9.2 — mobile polish & readability
   Base design/branding intentionally unchanged.
   ========================================================= */

/* Slightly calmer tablet/mobile header */
@media (max-width: 1120px) {
  .topbar .wrap { gap: 16px; }
  .nav {
    box-shadow: 0 18px 40px rgba(0,0,0,.38);
    overscroll-behavior: contain;
  }
  .nav a {
    min-height: 44px;
    display: flex;
    align-items: center;
  }
  .nav .cta {
    min-height: 46px;
    justify-content: center;
  }
}

/* iPhone / small-phone refinement */
@media (max-width: 650px) {
  .wrap { width: calc(100% - 30px); }

  .topbar {
    min-height: 62px;
  }
  .topbar .wrap {
    gap: 10px;
  }
  .brand img {
    width: 178px;
  }
  .menu-toggle {
    width: 42px;
    height: 42px;
    flex: 0 0 42px;
  }
  .nav {
    inset: 62px 0 auto;
    max-height: calc(100dvh - 62px);
    padding: 12px 15px 22px;
  }

  .independence-bar {
    padding: 8px 0;
    font-size: 11px;
    line-height: 1.45;
  }

  .hero .wrap {
    padding: 23px 0 16px;
    gap: 8px;
  }
  .hero-copy {
    padding-top: 4px;
  }
  .hero h1 {
    font-size: clamp(2.15rem, 10.4vw, 2.5rem);
    line-height: 1.035;
    margin-bottom: 16px;
  }
  .hero .lead {
    font-size: 15px;
    line-height: 1.58;
    margin-bottom: 21px;
  }
  .hero-actions {
    gap: 10px;
  }
  .btn {
    min-height: 45px;
    padding: 11px 18px;
    font-size: 12.5px;
  }
  .disclaimer {
    margin-top: 16px;
    font-size: 11.25px;
    line-height: 1.55;
  }
  .hero-visual {
    max-height: none;
    margin-top: 4px;
  }
  .hero-visual img {
    width: 100%;
    max-width: 620px;
    filter: drop-shadow(0 13px 24px rgba(0,0,0,.24));
  }

  .cards-section {
    padding-top: 18px;
  }
  .cards {
    gap: 10px;
  }
  .card {
    min-height: auto;
    padding: 20px 18px;
  }
  .card h2,
  .card h3 {
    font-size: 16.5px;
    margin-top: 14px;
  }
  .card p {
    font-size: 13px;
    line-height: 1.58;
  }

  .why {
    padding-top: 18px;
  }
  .why h2 {
    font-size: 25px;
    line-height: 1.18;
  }
  .why .intro {
    font-size: 14px;
    line-height: 1.6;
  }
  .why-stats {
    gap: 16px 12px;
  }
  .stat b {
    font-size: 13px;
  }
  .stat span {
    font-size: 11px;
  }
  .learning-panel {
    padding: 22px;
  }
  .learning-panel h2 {
    font-size: 22px;
    margin-bottom: 12px;
  }
  .learning-panel ol {
    line-height: 1.75;
  }

  .newsletter {
    padding-bottom: 24px;
  }
  .newsletter-box {
    gap: 14px;
    padding: 16px;
  }
  .newsletter-copy strong {
    font-size: 15px;
  }
  .newsletter-copy small {
    font-size: 11.5px;
  }
  .social-cta {
    min-height: 44px;
  }

  .footer {
    padding-top: 26px;
  }
  .footer-grid {
    gap: 24px;
  }
  .footer p,
  .footer-links {
    font-size: 11.5px;
  }
  .copyright {
    margin-top: 22px;
    font-size: 10.5px;
    line-height: 1.5;
  }

  .subhero {
    padding: 44px 0 30px;
  }
  .subhero h1 {
    font-size: clamp(2.05rem, 10vw, 2.45rem);
  }
  .subhero p {
    font-size: 14.5px;
    line-height: 1.65;
  }
  .content {
    padding-bottom: 50px;
  }
  .content-card {
    padding: 21px 19px;
  }
  .content-card h2 {
    font-size: 17px;
  }
  .content-card p,
  .legal p,
  .legal li {
    font-size: 13.5px;
  }
}

/* Very narrow iPhones / compact phones */
@media (max-width: 390px) {
  .wrap { width: calc(100% - 24px); }
  .brand img { width: 164px; }
  .hero h1 { font-size: 2.08rem; }
  .hero .lead { font-size: 14.5px; }
  .why-stats { grid-template-columns: 1fr; }
}

/* Modern touch devices should not rely on hover motion */
@media (hover: none) {
  .card:hover,
  .btn:hover,
  .nav .cta:hover,
  .social-cta:hover {
    transform: none;
  }
}


/* V10 editorial article */
.article-hero{padding:64px 0 40px}.article-hero .wrap{max-width:1040px}.article-kicker,.section-label{font-size:11px;font-weight:850;letter-spacing:.14em;text-transform:uppercase;color:#78ead8}.article-hero h1{font-size:clamp(3rem,7vw,5rem);margin:10px 0 16px}.article-deck{font-size:18px!important;line-height:1.68!important;max-width:880px!important;color:#c2cfdd!important}.article-meta{display:flex;flex-wrap:wrap;gap:8px 20px;margin-top:22px;color:#7f92a8;font-size:11px}.article-meta span{display:inline-flex;align-items:center;gap:6px}.article-meta span:not(:last-child)::after{content:"";width:3px;height:3px;border-radius:50%;background:#4f6378;margin-left:14px}.article-shell{padding:26px 0 74px}.article-layout{display:grid;grid-template-columns:220px minmax(0,820px);gap:54px;align-items:start;justify-content:center}.article-toc{position:sticky;top:102px}.toc-card{border:1px solid rgba(87,139,193,.2);border-radius:14px;background:linear-gradient(145deg,#07111f,#040a13);padding:18px}.toc-card strong{display:block;font-size:12px;margin-bottom:10px}.toc-card a{display:block;padding:6px 0;color:#91a5ba;font-size:11.5px;line-height:1.35;border-bottom:1px solid rgba(102,143,182,.07)}.toc-card a:last-child{border-bottom:0}.toc-card a:hover{color:#fff}.article-body{min-width:0}.article-section{scroll-margin-top:105px;padding:9px 0 36px;border-bottom:1px solid rgba(92,137,177,.13);margin-bottom:30px}.article-section:last-child{border-bottom:0;margin-bottom:0}.article-section h2{font-size:clamp(1.75rem,4vw,2.2rem);line-height:1.15;letter-spacing:-.025em;margin:8px 0 16px}.article-section h3{font-size:19px;line-height:1.3;margin:28px 0 10px}.article-section p{font-size:15px;line-height:1.78;color:#b7c5d5;margin:0 0 16px}.article-section strong{color:#f4f8fc}.fact-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:22px 0}.fact{border:1px solid rgba(99,147,193,.2);background:rgba(8,18,31,.76);border-radius:12px;padding:15px}.fact span{display:block;color:#7e91a8;font-size:10px;text-transform:uppercase;letter-spacing:.08em;margin-bottom:5px}.fact strong{font-size:13px}.callout,.note{border-radius:12px;padding:17px 18px;margin:22px 0;font-size:13px;line-height:1.65}.callout{border:1px solid rgba(112,86,255,.38);background:linear-gradient(90deg,rgba(91,62,214,.12),rgba(35,189,177,.07));color:#b9c9d9}.note{border:1px solid rgba(77,210,190,.25);background:rgba(25,123,113,.08);color:#9eb4c7}.process{display:grid;gap:10px;margin:22px 0 26px}.process-step{display:grid;grid-template-columns:34px 1fr;gap:14px;padding:15px;border:1px solid rgba(96,141,188,.18);border-radius:12px;background:#06101c}.process-step>b{width:34px;height:34px;display:grid;place-items:center;border-radius:50%;background:linear-gradient(135deg,#834cff,#42d7c7);color:#fff;font-size:12px}.process-step strong{display:block;font-size:13.5px;margin:2px 0 4px}.process-step p{font-size:12.5px;line-height:1.6;margin:0;color:#91a4b9}.concept-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:22px 0}.concept-card{border:1px solid rgba(105,148,190,.2);border-radius:13px;background:linear-gradient(145deg,#081423,#050b14);padding:18px}.concept-icon{width:35px;height:35px;display:grid;place-items:center;border-radius:9px;background:rgba(134,72,255,.14);color:#bc79ff;font-weight:850;font-size:12px}.concept-card h3{font-size:15px;margin:12px 0 7px}.concept-card p{font-size:12px;line-height:1.62;margin:0}.mini-table{border:1px solid rgba(99,145,190,.2);border-radius:12px;overflow:hidden;margin:22px 0}.mini-row{display:grid;grid-template-columns:170px 1fr;border-top:1px solid rgba(99,145,190,.12)}.mini-row:first-child{border-top:0}.mini-row span{padding:12px 14px;font-size:12.5px;color:#aebed0}.mini-row span:first-child{font-weight:750;color:#eef5fb;background:rgba(120,80,255,.04)}.mini-head{background:#0a1727}.mini-head span{font-size:10px!important;letter-spacing:.08em;text-transform:uppercase;color:#7fe5d6!important}.fee-box{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:22px 0}.fee-box>div{border:1px solid rgba(95,143,189,.2);border-radius:12px;background:#07111f;padding:18px}.fee-box span{display:block;color:#7fe5d6;font-size:10px;font-weight:850;text-transform:uppercase;letter-spacing:.08em}.fee-box strong{display:block;font-size:18px;margin:5px 0}.fee-box small{display:block;color:#899eb4;font-size:11px;line-height:1.5}.use-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin:22px 0}.use-grid>div{border:1px solid rgba(94,144,190,.18);border-radius:12px;padding:16px;background:rgba(6,16,28,.7)}.use-grid strong{display:block;font-size:13px;margin-bottom:5px}.use-grid span{display:block;color:#91a6ba;font-size:12px;line-height:1.55}.check-list{padding:0;margin:20px 0;list-style:none}.check-list li{position:relative;padding:0 0 14px 28px;color:#b2c2d2;font-size:13.5px;line-height:1.66}.check-list li::before{content:"✓";position:absolute;left:0;top:1px;color:#63e4d1;font-weight:900}.next-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-top:22px}.next-grid a{display:flex;flex-direction:column;border:1px solid rgba(96,146,192,.2);border-radius:13px;background:linear-gradient(145deg,#081423,#050b14);padding:18px;transition:transform .18s ease,border-color .18s ease}.next-grid a:hover{transform:translateY(-2px);border-color:rgba(99,226,207,.43)}.next-grid span{color:#71e5d3;text-transform:uppercase;letter-spacing:.08em;font-size:9.5px;font-weight:850}.next-grid strong{font-size:15px;margin:5px 0}.next-grid small{color:#8fa3b7;font-size:11.5px;line-height:1.5}.faq-list{display:grid;gap:9px;margin-top:22px}.faq-list details{border:1px solid rgba(97,145,190,.2);border-radius:12px;background:#07111f;padding:0 16px}.faq-list summary{cursor:pointer;padding:15px 24px 15px 0;font-size:13px;font-weight:800;position:relative}.faq-list summary::marker{color:#6ce7d4}.faq-list details p{font-size:12.5px;line-height:1.65;padding:0 0 15px;margin:0}.sources-section{padding-bottom:5px}.source-list{display:grid;gap:9px;margin:20px 0}.source-list a{display:flex;flex-direction:column;gap:4px;border:1px solid rgba(96,144,188,.18);border-radius:11px;padding:14px 16px;background:rgba(6,16,28,.68)}.source-list a:hover{border-color:rgba(93,223,204,.38)}.source-list strong{font-size:12.5px}.source-list span{color:#8398ad;font-size:11px;line-height:1.5}.editorial-note{font-size:11.5px!important;color:#7f93a8!important;border-top:1px solid rgba(96,144,188,.1);padding-top:16px}
@media(max-width:1000px){.article-layout{grid-template-columns:1fr;gap:24px;max-width:860px}.article-toc{position:static}.toc-card{display:flex;flex-wrap:wrap;gap:5px 15px;padding:15px}.toc-card strong{width:100%;margin-bottom:4px}.toc-card a{border:0;padding:3px 0}}
@media(max-width:650px){.article-hero{padding:42px 0 27px}.article-kicker{font-size:9.5px}.article-hero h1{font-size:2.75rem}.article-deck{font-size:15.5px!important;line-height:1.62!important}.article-meta{gap:6px 12px;margin-top:17px}.article-meta span:not(:last-child)::after{display:none}.article-shell{padding:18px 0 50px}.article-section{padding-bottom:27px;margin-bottom:24px}.article-section h2{font-size:1.7rem}.article-section h3{font-size:17px}.article-section p{font-size:14px;line-height:1.72}.fact-grid,.concept-grid,.fee-box,.use-grid,.next-grid{grid-template-columns:1fr}.mini-row{grid-template-columns:110px 1fr}.mini-row span{padding:11px;font-size:11.5px}.toc-card{gap:4px 12px}.toc-card a{font-size:10.5px}}


/* =========================================================
   V10.1 — Solana Tools editorial components
   ========================================================= */
.tool-map-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:22px 0}
.tool-map-card,.stack-card{border:1px solid rgba(96,145,190,.19);border-radius:13px;background:linear-gradient(145deg,#081423,#050b14);padding:17px}
.tool-map-card>span,.stack-card>span,.tool-feature>div>span,.status-card>span{display:block;color:#70e3d2;font-size:9px;font-weight:850;letter-spacing:.1em;text-transform:uppercase;margin-bottom:6px}
.tool-map-card strong{display:block;font-size:14px;margin-bottom:5px}
.tool-map-card p{font-size:11.5px;line-height:1.55;margin:0;color:#8fa3b8}
.warning-box{border:1px solid rgba(255,177,91,.28);background:rgba(113,64,16,.11);border-radius:12px;padding:16px 18px;margin:22px 0;color:#c6b49c;font-size:13px;line-height:1.62}
.warning-box strong{color:#ffd5a0}
.tool-feature{display:flex;align-items:center;justify-content:space-between;gap:20px;border:1px solid rgba(89,218,199,.24);border-radius:13px;background:linear-gradient(90deg,rgba(33,130,118,.08),rgba(79,50,157,.08));padding:17px 18px;margin:21px 0}
.tool-feature h3{font-size:15px;margin:0 0 4px}
.tool-feature p{font-size:11.5px;line-height:1.55;margin:0!important}
.tool-feature>a{display:inline-flex;align-items:center;justify-content:center;min-height:38px;padding:0 14px;border:1px solid rgba(101,228,208,.34);border-radius:8px;color:#8df0df;font-size:10.5px;font-weight:800;white-space:nowrap}
.decision-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:21px 0}
.decision-grid>div{border:1px solid rgba(96,145,190,.18);border-radius:12px;padding:16px;background:#07111f}
.decision-grid strong{display:block;font-size:13px;margin-bottom:5px}
.decision-grid span{display:block;color:#8da1b6;font-size:11.5px;line-height:1.5}
.status-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:22px 0}
.status-card{border:1px solid rgba(96,145,190,.19);border-radius:13px;padding:17px;background:#07111f}
.status-card.current{border-color:rgba(94,220,198,.25)}
.status-card.legacy{border-color:rgba(168,146,101,.24)}
.status-card.legacy>span{color:#c9af78}
.status-card h3{font-size:14px;margin:4px 0 7px}
.status-card p{font-size:11.5px;line-height:1.55;margin:0}
.layer-stack{display:grid;gap:7px;margin:22px 0}
.layer-stack>div{display:grid;grid-template-columns:82px 170px 1fr;gap:12px;align-items:center;border:1px solid rgba(95,143,189,.18);border-radius:10px;padding:12px 14px;background:rgba(7,17,31,.74)}
.layer-stack span{color:#6fe3d1;font-size:9px;font-weight:850;text-transform:uppercase;letter-spacing:.08em}
.layer-stack strong{font-size:12.5px}
.layer-stack small{color:#899db1;font-size:11px;line-height:1.4}
.stack-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin:22px 0}
.stack-card h3{font-size:15px;margin:4px 0 7px}
.stack-card p{font-size:12px;line-height:1.58;margin:0}
.article-section code{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.92em;color:#d4c2ff;background:rgba(129,79,255,.09);padding:.08em .32em;border-radius:4px}
@media(max-width:760px){
  .tool-map-grid,.decision-grid,.status-grid{grid-template-columns:1fr}
  .stack-grid{grid-template-columns:1fr}
  .tool-feature{align-items:flex-start;flex-direction:column}
  .tool-feature>a{width:100%}
  .layer-stack>div{grid-template-columns:72px 1fr}
  .layer-stack small{grid-column:1/-1}
}


/* =========================================================
   V10.2 — Developers editorial components
   ========================================================= */
.dev-roadmap{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:22px 0}
.road-step{position:relative;border:1px solid rgba(96,145,190,.19);border-radius:13px;background:linear-gradient(145deg,#081423,#050b14);padding:18px}
.road-step>b{width:28px;height:28px;display:grid;place-items:center;border-radius:50%;background:linear-gradient(135deg,#834cff,#42d7c7);font-size:10px;color:#fff;margin-bottom:11px}
.road-step>span,.dev-concepts>div>span,.setup-card>span,.compare-card>span,.architecture-box>div>span,.client-stack>div>span,.test-pyramid>div>span,.deployment-grid>div>span{display:block;color:#70e3d2;font-size:9px;font-weight:850;letter-spacing:.1em;text-transform:uppercase;margin-bottom:5px}
.road-step strong{display:block;font-size:13.5px;margin-bottom:5px}.road-step p{font-size:11.5px!important;line-height:1.55!important;margin:0!important}
.dev-concepts{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin:22px 0}
.dev-concepts>div{border:1px solid rgba(97,145,190,.18);border-radius:12px;padding:16px;background:#07111f}
.dev-concepts strong{display:block;font-size:14px;margin-bottom:5px}.dev-concepts p{font-size:11.5px!important;line-height:1.55!important;margin:0!important}
.setup-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin:22px 0}
.setup-card{border:1px solid rgba(95,145,190,.19);border-radius:13px;padding:18px;background:linear-gradient(145deg,#081423,#050b14)}
.setup-card h3{font-size:16px;margin:4px 0 7px}.setup-card p{font-size:12px!important;line-height:1.58!important;margin-bottom:13px!important}.setup-card a{font-size:10.5px;font-weight:800;color:#82ead9}
.compare-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin:22px 0}
.compare-card{border:1px solid rgba(98,145,190,.19);border-radius:13px;padding:19px;background:#07111f}.compare-card.recommended{border-color:rgba(96,225,204,.3);background:linear-gradient(145deg,rgba(18,64,62,.25),#07111f)}
.compare-card h3{font-size:17px;margin:4px 0 10px}.compare-card ul{margin:0;padding-left:18px;color:#9fb0c3;font-size:12px;line-height:1.75}
.architecture-box{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:22px 0}
.architecture-box>div{border:1px solid rgba(95,144,190,.18);border-radius:12px;padding:16px;background:rgba(7,17,31,.75)}
.architecture-box strong{display:block;font-size:13px;margin:4px 0}.architecture-box small{display:block;color:#8da1b5;font-size:11px;line-height:1.5}
.flow-strip{display:grid;grid-template-columns:1fr auto 1fr auto 1fr auto 1fr;gap:8px;align-items:center;margin:24px 0}
.flow-strip>div{border:1px solid rgba(95,145,190,.2);border-radius:11px;padding:14px;background:#07111f;text-align:center}.flow-strip span{display:block;color:#73e3d2;font-size:8.5px;font-weight:850;letter-spacing:.08em}.flow-strip strong{display:block;font-size:12px;margin-top:4px}.flow-strip i{font-style:normal;color:#6b7e93}
.client-stack{display:grid;gap:7px;margin:22px 0}.client-stack>div{display:grid;grid-template-columns:90px 185px 1fr;gap:12px;align-items:center;border:1px solid rgba(95,143,189,.18);border-radius:10px;padding:12px 14px;background:rgba(7,17,31,.74)}.client-stack strong{font-size:12.5px}.client-stack small{color:#899db1;font-size:11px;line-height:1.4}
.test-pyramid{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;margin:22px 0}.test-pyramid>div{border:1px solid rgba(95,145,190,.18);border-radius:12px;padding:15px;background:#07111f}.test-pyramid strong{display:block;font-size:12.5px;margin:4px 0}.test-pyramid p{font-size:11px!important;line-height:1.5!important;margin:0!important}
.deployment-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin:22px 0}.deployment-grid>div{border:1px solid rgba(96,145,190,.18);border-radius:12px;padding:16px;background:linear-gradient(145deg,#081423,#050b14)}.deployment-grid strong{display:block;font-size:13.5px;margin:4px 0}.deployment-grid p{font-size:11.5px!important;line-height:1.55!important;margin:0!important}
@media(max-width:850px){.dev-roadmap{grid-template-columns:repeat(2,1fr)}.architecture-box{grid-template-columns:1fr}.test-pyramid{grid-template-columns:repeat(2,1fr)}.flow-strip{grid-template-columns:1fr}.flow-strip i{transform:rotate(90deg);text-align:center}.client-stack>div{grid-template-columns:75px 1fr}.client-stack small{grid-column:1/-1}}
@media(max-width:650px){.dev-roadmap,.dev-concepts,.setup-grid,.compare-grid,.test-pyramid,.deployment-grid{grid-template-columns:1fr}.road-step,.setup-card,.compare-card{padding:16px}}


/* =========================================================
   V10.3 — Ecosystem editorial components
   ========================================================= */
.eco-map-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:22px 0}
.eco-map-grid>div,.principle-grid>div,.research-grid>div{border:1px solid rgba(96,145,190,.19);border-radius:13px;background:linear-gradient(145deg,#081423,#050b14);padding:17px}
.eco-map-grid span,.token-compare span,.research-grid span,.experience-stack span,.infra-stack span{display:block;color:#70e3d2;font-size:9px;font-weight:850;letter-spacing:.1em;text-transform:uppercase;margin-bottom:5px}
.eco-map-grid strong,.principle-grid strong,.research-grid strong{display:block;font-size:13.5px;margin-bottom:5px}
.eco-map-grid p,.research-grid p{font-size:11.5px!important;line-height:1.55!important;margin:0!important}
.eco-use-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin:22px 0}
.eco-use-grid>div{border:1px solid rgba(95,144,190,.18);border-radius:12px;padding:16px;background:#07111f}
.eco-use-grid strong{display:block;font-size:13px;margin-bottom:5px}.eco-use-grid span{display:block;color:#8fa3b7;font-size:11.5px;line-height:1.5}
.risk-layers{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:22px 0}
.risk-layers>div{border:1px solid rgba(154,96,207,.22);border-radius:11px;padding:14px;background:linear-gradient(145deg,rgba(92,53,145,.10),#07111f)}
.risk-layers span{display:block;color:#bd85ec;font-size:8.5px;font-weight:850;letter-spacing:.08em;text-transform:uppercase}.risk-layers strong{display:block;font-size:11.5px;margin-top:5px}
.token-compare{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin:22px 0}
.token-compare>div{border:1px solid rgba(96,145,190,.19);border-radius:13px;padding:18px;background:#07111f}.token-compare h3{font-size:16px;margin:4px 0 7px}.token-compare p{font-size:12px!important;line-height:1.58!important;margin:0!important}
.experience-stack,.infra-stack{display:grid;gap:7px;margin:22px 0}
.experience-stack>div,.infra-stack>div{display:grid;grid-template-columns:120px 190px 1fr;gap:12px;align-items:center;border:1px solid rgba(95,143,189,.18);border-radius:10px;padding:12px 14px;background:rgba(7,17,31,.74)}
.experience-stack strong,.infra-stack strong{font-size:12.5px}.experience-stack small,.infra-stack small{color:#899db1;font-size:11px;line-height:1.4}
.principle-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin:22px 0}.principle-grid span{display:block;color:#8fa3b7;font-size:11.5px;line-height:1.5}
.research-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin:22px 0}
@media(max-width:850px){.eco-map-grid{grid-template-columns:repeat(2,1fr)}.risk-layers{grid-template-columns:repeat(2,1fr)}.experience-stack>div,.infra-stack>div{grid-template-columns:100px 1fr}.experience-stack small,.infra-stack small{grid-column:1/-1}}
@media(max-width:650px){.eco-map-grid,.eco-use-grid,.risk-layers,.token-compare,.principle-grid,.research-grid{grid-template-columns:1fr}}


/* =========================================================
   V10.4 — Resources editorial components
   ========================================================= */
.resource-picker{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:22px 0}
.resource-picker>a,.doc-grid>a,.research-resource-grid>a{border:1px solid rgba(96,145,190,.19);border-radius:13px;background:linear-gradient(145deg,#081423,#050b14);padding:17px;transition:transform .18s ease,border-color .18s ease}
.resource-picker>a:hover,.doc-grid>a:hover,.research-resource-grid>a:hover{transform:translateY(-2px);border-color:rgba(99,226,207,.43)}
.resource-picker span,.doc-grid span,.research-resource-grid span,.cookbook-grid span,.example-grid span,.production-resource-grid span,.learning-path>span,.resource-feature>div>span{display:block;color:#70e3d2;font-size:9px;font-weight:850;letter-spacing:.1em;text-transform:uppercase;margin-bottom:5px}
.resource-picker strong,.doc-grid strong,.research-resource-grid strong{display:block;font-size:13.5px;margin-bottom:5px}
.resource-picker small,.doc-grid small,.research-resource-grid small{display:block;color:#8fa3b7;font-size:11.5px;line-height:1.5}
.resource-feature{display:flex;align-items:center;justify-content:space-between;gap:20px;border:1px solid rgba(89,218,199,.24);border-radius:13px;background:linear-gradient(90deg,rgba(33,130,118,.08),rgba(79,50,157,.08));padding:17px 18px;margin:21px 0}
.resource-feature h3{font-size:15px;margin:0 0 4px}.resource-feature p{font-size:11.5px!important;line-height:1.55!important;margin:0!important}.resource-feature>a{display:inline-flex;align-items:center;justify-content:center;min-height:38px;padding:0 14px;border:1px solid rgba(101,228,208,.34);border-radius:8px;color:#8df0df;font-size:10.5px;font-weight:800;white-space:nowrap}
.doc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:22px 0}
.cookbook-grid,.example-grid,.rpc-resource-grid,.production-resource-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin:22px 0}
.cookbook-grid>div,.example-grid>div,.rpc-resource-grid>div,.production-resource-grid>div{border:1px solid rgba(95,144,190,.18);border-radius:12px;padding:16px;background:#07111f}
.cookbook-grid strong,.example-grid strong,.production-resource-grid strong{display:block;font-size:13px;margin-bottom:5px}.cookbook-grid p,.example-grid p,.production-resource-grid p{font-size:11.5px!important;line-height:1.5!important;margin:0!important;color:#8fa3b7!important}
.rpc-resource-grid strong{display:block;font-size:13px;margin-bottom:5px}.rpc-resource-grid span{display:block;color:#8fa3b7;font-size:11.5px;line-height:1.5}
.research-resource-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:22px 0}
.learning-paths{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin:22px 0}
.learning-path{border:1px solid rgba(96,145,190,.19);border-radius:13px;background:linear-gradient(145deg,#081423,#050b14);padding:18px}
.learning-path h3{font-size:15px;margin:4px 0 10px}.learning-path ol{padding-left:20px;margin:0}.learning-path li{color:#8fa3b7;font-size:12px;line-height:1.8}.learning-path a{color:#c8d8e8}.learning-path a:hover{color:#80ead9}
@media(max-width:850px){.resource-picker,.doc-grid,.research-resource-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:650px){.resource-picker,.doc-grid,.cookbook-grid,.example-grid,.rpc-resource-grid,.production-resource-grid,.research-resource-grid,.learning-paths{grid-template-columns:1fr}.resource-feature{align-items:flex-start;flex-direction:column}.resource-feature>a{width:100%}}

/* =========================================================
   V11.0 — Focused SEO guide layer (main navigation unchanged)
   ========================================================= */
.guide-facts{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:22px 0}
.guide-facts>div{border:1px solid rgba(96,145,190,.19);border-radius:13px;background:linear-gradient(145deg,#081423,#050b14);padding:17px}
.guide-facts span,.formula-box span{display:block;color:#70e3d2;font-size:9px;font-weight:850;letter-spacing:.1em;text-transform:uppercase;margin-bottom:5px}
.guide-facts strong{display:block;font-size:13.5px;margin-bottom:5px}.guide-facts small{display:block;color:#8fa3b7;font-size:11px;line-height:1.5}
.formula-box{border:1px solid rgba(96,225,204,.28);border-radius:13px;background:linear-gradient(90deg,rgba(33,130,118,.08),rgba(79,50,157,.08));padding:18px;margin:22px 0}.formula-box strong{display:block;font-size:17px;margin:4px 0}.formula-box small{color:#8fa3b7;font-size:11px}
.guide-steps{margin:20px 0;padding-left:23px}.guide-steps li{padding:0 0 12px 5px;color:#afc0d1;font-size:13.5px;line-height:1.65}.guide-steps strong{color:#eef5fb}
.seo-guide-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:22px 0}.seo-guide-grid>a{display:flex;flex-direction:column;border:1px solid rgba(96,145,190,.19);border-radius:13px;background:linear-gradient(145deg,#081423,#050b14);padding:17px;transition:transform .18s ease,border-color .18s ease}.seo-guide-grid>a:hover{transform:translateY(-2px);border-color:rgba(99,226,207,.43)}.seo-guide-grid span{color:#70e3d2;font-size:9px;font-weight:850;letter-spacing:.1em}.seo-guide-grid strong{font-size:13.5px;margin:5px 0}.seo-guide-grid small{color:#8fa3b7;font-size:11.5px;line-height:1.5}
.seo-related-inline{margin-top:17px;padding:11px 13px;border-left:2px solid #62dccb;background:rgba(34,130,118,.06);font-size:11.5px;color:#8fa3b7}.seo-related-inline a{color:#86eadb;font-weight:800}
.comparison-table{border:1px solid rgba(96,145,190,.2);border-radius:12px;overflow:hidden;margin:22px 0}.comparison-row{display:grid;grid-template-columns:150px 1fr 1fr;border-top:1px solid rgba(96,145,190,.12)}.comparison-row:first-child{border-top:0}.comparison-row>*{padding:12px 14px;font-size:11.5px;line-height:1.5;color:#a8b9ca}.comparison-row>strong{color:#edf4fb;background:rgba(114,72,224,.04)}.comparison-head{background:#0a1727}.comparison-head span{color:#70e3d2;font-size:9px;font-weight:850;letter-spacing:.08em;text-transform:uppercase}
@media(max-width:760px){.guide-facts,.seo-guide-grid{grid-template-columns:1fr}.comparison-row{grid-template-columns:95px 1fr 1fr}.comparison-row>*{padding:10px 8px;font-size:10px}}

/* =========================================================
   V11.2 — Premium Motion
   Motion only: no content, URL, navigation or logo changes.
   ========================================================= */
.hero-visual::before,
.hero-visual::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  pointer-events: none;
  border-radius: 50%;
  z-index: -1;
}
.hero-visual::before {
  width: min(78%, 540px);
  aspect-ratio: 1;
  transform: translate(-50%, -50%);
  background: radial-gradient(circle, rgba(92,77,255,.18) 0%, rgba(42,224,210,.08) 38%, transparent 70%);
  filter: blur(24px);
  animation: sfGlowBreath 7.5s ease-in-out infinite;
}
.hero-visual::after {
  width: min(70%, 470px);
  aspect-ratio: 1;
  transform: translate(-50%, -50%) rotate(0deg);
  border: 1px solid rgba(101,229,216,.08);
  box-shadow: 0 0 42px rgba(111,72,255,.08), inset 0 0 34px rgba(62,224,207,.035);
  animation: sfHaloDrift 18s ease-in-out infinite;
}
.hero-visual img {
  transform-origin: 52% 52%;
  will-change: transform, filter;
  animation: sfPremiumFloat 9s cubic-bezier(.45,.05,.55,.95) infinite;
}
.hero::after {
  content: "";
  position: absolute;
  width: 44%;
  height: 180%;
  top: -40%;
  left: 52%;
  pointer-events: none;
  background: linear-gradient(105deg, transparent 38%, rgba(98,238,221,.025) 48%, rgba(133,78,255,.045) 52%, transparent 62%);
  transform: translateX(-130%) rotate(4deg);
  animation: sfAmbientSweep 13s ease-in-out infinite;
}
@keyframes sfPremiumFloat {
  0%,100% { transform: translate3d(0,0,0) rotate(-.7deg) scale(1); filter: drop-shadow(0 18px 34px rgba(0,0,0,.28)); }
  50% { transform: translate3d(0,-7px,0) rotate(.7deg) scale(1.006); filter: drop-shadow(0 22px 39px rgba(0,0,0,.30)) drop-shadow(0 0 10px rgba(92,232,218,.08)); }
}
@keyframes sfGlowBreath {
  0%,100% { opacity:.55; transform:translate(-50%,-50%) scale(.98); }
  50% { opacity:.9; transform:translate(-50%,-50%) scale(1.035); }
}
@keyframes sfHaloDrift {
  0%,100% { opacity:.35; transform:translate(-50%,-50%) rotate(-2deg) scale(.99); }
  50% { opacity:.68; transform:translate(-50%,-50%) rotate(2deg) scale(1.015); }
}
@keyframes sfAmbientSweep {
  0%,22% { transform:translateX(-135%) rotate(4deg); opacity:0; }
  38% { opacity:1; }
  62% { opacity:.8; }
  78%,100% { transform:translateX(105%) rotate(4deg); opacity:0; }
}
.sf-motion .sf-reveal {
  opacity: 0;
  transform: translateY(14px);
  transition: opacity .7s ease, transform .7s cubic-bezier(.2,.7,.2,1);
}
.sf-motion .sf-reveal.sf-visible { opacity:1; transform:none; }
@media (hover:hover) and (pointer:fine) {
  .card::before,
  .content-card::before {
    content:"";
    position:absolute;
    inset:0;
    pointer-events:none;
    opacity:0;
    background:linear-gradient(115deg,transparent 25%,rgba(100,237,220,.055) 48%,rgba(129,78,255,.065) 53%,transparent 72%);
    transform:translateX(-60%);
    transition:opacity .28s ease,transform .55s ease;
  }
  .card:hover::before,
  .content-card:hover::before { opacity:1; transform:translateX(35%); }
  .content-card { position:relative; overflow:hidden; }
}
@media (max-width:1120px) {
  .hero-visual img { animation-duration:10.5s; }
  .hero::after { display:none; }
}
@media (max-width:650px) {
  .hero-visual img { animation:sfMobileFloat 10s ease-in-out infinite; }
  .hero-visual::after { display:none; }
  .hero-visual::before { width:72%; opacity:.45; filter:blur(18px); }
  @keyframes sfMobileFloat {
    0%,100% { transform:translate3d(0,0,0) scale(1); }
    50% { transform:translate3d(0,-4px,0) scale(1.003); }
  }
}
@media (prefers-reduced-motion: reduce) {
  .hero-visual img,.hero-visual::before,.hero-visual::after,.hero::after { animation:none !important; transform:none; }
  .hero-visual::before { transform:translate(-50%,-50%); }
  .sf-motion .sf-reveal { opacity:1; transform:none; }
}

/* V11.2 STATIC HERO PATCH — 2026-09-23
   Reverts the continuous Hero artwork motion while keeping the rest of the
   premium UI effects intact. Replace only styles.css on the server. */
.hero-visual img {
  animation: none !important;
  transform: none !important;
  will-change: auto !important;
}
.hero-visual::before {
  animation: none !important;
  opacity: .55;
  transform: translate(-50%, -50%) scale(1) !important;
}
.hero-visual::after {
  animation: none !important;
  opacity: .35;
  transform: translate(-50%, -50%) rotate(0deg) scale(1) !important;
}
.hero::after {
  animation: none !important;
  opacity: 0 !important;
}


/* V11.3 MONETIZATION-READY LEGAL / DISCLOSURE LAYER */
.legal-callout,.commercial-notice{
  margin:20px 0 26px;
  padding:15px 17px;
  border:1px solid rgba(104,227,211,.22);
  border-left:3px solid #68e3d3;
  border-radius:12px;
  background:linear-gradient(120deg,rgba(38,145,132,.08),rgba(100,65,193,.055));
  color:#aebfd0;
  font-size:12.5px;
  line-height:1.65;
}
.legal-callout strong,.commercial-notice strong{color:#edf7f5}
.legal-callout a,.commercial-notice a{color:#84eadc;font-weight:800}
.legal-list{padding-left:20px;margin:12px 0 20px}
.legal-list li{margin:8px 0;color:#adbdcd;line-height:1.6}
.disclosure-label{
  display:inline-flex;align-items:center;gap:6px;
  padding:4px 8px;margin:0 6px 0 0;
  border:1px solid rgba(114,231,214,.28);border-radius:999px;
  background:rgba(52,157,143,.08);color:#87e8da;
  font-size:9px;font-weight:900;letter-spacing:.08em;text-transform:uppercase;
}
.affiliate-link{position:relative}
.affiliate-link::after{
  content:"Affiliate link";display:inline-block;margin-left:7px;vertical-align:middle;
  padding:2px 6px;border-radius:999px;border:1px solid rgba(114,231,214,.24);
  color:#82e7d9;background:rgba(52,157,143,.07);font-size:8px;font-weight:900;
  letter-spacing:.06em;text-transform:uppercase;
}
.sponsored-block{border:1px solid rgba(165,119,255,.24);background:rgba(118,73,200,.06)}
@media(max-width:650px){.legal-callout,.commercial-notice{padding:13px 14px;font-size:12px}}
.footer-legal-mini{display:flex;justify-content:center;gap:16px;flex-wrap:wrap;margin:0 0 16px}.footer-legal-mini a{color:#8fa6ba;font-size:11px}.footer-legal-mini a:hover{color:#86eadb}
