/* CCB-EFFECTS-V9: assets linked directly from the MVC layout. */
:root { --fx-cyan: #79ead9; --fx-lime: #dbff9a; }
.site-header { background: linear-gradient(180deg,rgba(3,23,22,.9),rgba(3,23,22,.08)); }
.section-heading h2, .page-hero h1, .about-text h2, .story-copy h2, .coins-copy h2, .final-cta h2 {
  font-family: 'Arial Black', Impact, 'Segoe UI', sans-serif;
  font-weight: 900; letter-spacing: -.055em; text-wrap: balance;
}
.section-heading h2::after { background: var(--fx-cyan); box-shadow: 0 0 18px rgba(121,234,217,.45); }
.feature-card, .story-video-frame, .detail-image, .form-panel { border-color: rgba(134,229,209,.4); }
.feature-card { --fx-x: 50%; --fx-y: 50%; }
.feature-card::before { content: ''; position: absolute; inset: 0; z-index: 2; pointer-events: none; opacity: 0; background: radial-gradient(circle 150px at var(--fx-x) var(--fx-y),rgba(132,255,218,.27),transparent 76%); transition: opacity .28s ease; }
.feature-card:hover::before { opacity: 1; }
.feature-card:hover { border-color: var(--fx-cyan); }
.feature-card .feature-photo { background-repeat: no-repeat; }
/* Unlike CSS-only reveal rules, V9 keeps content visible if JS fails. */
.fx9-cursor, .fx9-dot { position: fixed; top: 0; left: 0; pointer-events: none; z-index: 9999; opacity: 0; visibility: hidden; border-radius: 50%; }
@media (hover: hover) and (pointer: fine) {
  body.fx9-pointer, body.fx9-pointer a, body.fx9-pointer button { cursor: none !important; }
  body.fx9-pointer input, body.fx9-pointer textarea, body.fx9-pointer select { cursor: text !important; }
  .fx9-cursor { display: grid; place-items: center; height: 55px; width: 55px; border: 2px solid #adffe7; background: rgba(4,28,27,.23); box-shadow: 0 0 24px rgba(63,241,210,.35),inset 0 0 16px rgba(87,240,218,.18); backdrop-filter: blur(2px); transform: translate3d(-90px,-90px,0) translate(-50%,-50%); transition: height .25s,width .25s,background .25s,opacity .15s; }
  .fx9-dot { width: 8px; height: 8px; background: var(--fx-lime); box-shadow: 0 0 16px var(--fx-lime); transform: translate3d(-90px,-90px,0) translate(-50%,-50%); }
  body.fx9-pointer .fx9-cursor, body.fx9-pointer .fx9-dot { visibility: visible; opacity: 1; }
  .fx9-cursor.is-link { width: 84px; height: 84px; background: rgba(3,35,32,.88); }
  .fx9-cursor.is-link::after { content: attr(data-label); font: 900 11px/1 'Arial Narrow',Arial,sans-serif; letter-spacing: .12em; color: var(--fx-lime); }
  .fx9-cursor.is-link + .fx9-dot { opacity: 0; }
}
@media (max-width: 980px) {
  .main-nav.open { position: fixed; inset: 70px 0 0; z-index: 100; width: 100%; max-height: calc(100dvh - 70px); padding: 20px 6% 44px; background: rgba(4,27,26,.98); overflow-y: auto; backdrop-filter: blur(18px); }
  .main-nav.open a { display: block; font-family: 'Arial Black',Arial,sans-serif; text-transform: uppercase; font-size: clamp(16px,4.3vw,23px); padding: 14px 5px; letter-spacing: -.035em; border-bottom: 1px solid rgba(112,230,211,.2); }
  .main-nav.open .mobile-join { margin-top: 15px; font-size: 14px; padding: 16px; color: #062d26; background: var(--fx-lime); border: 0; text-align: center; }
  body.fx9-menu-open { overflow: hidden; }
}
@media (max-width: 700px) {
  .wrap { width: calc(100% - 32px); }
  .hero-content { padding-top: 108px; padding-bottom: 72px; }
  .hero-title { font-size: clamp(27px,7.7vw,47px); line-height: 1; }
  .hero-main > p { font-size: 14px; }
  .hero-main .actions { flex-wrap: wrap; }
  .hero-main .actions .button { white-space: normal; }
  .feature-grid { grid-template-columns: 1fr; gap: 16px; }
  .feature-card { height: 306px; }
  .feature-card .feature-card-body { inset: auto 12px 14px; }
  .feature-copy strong { font-size: 14px; }
  .section-heading h2, .story-copy h2 { font-size: clamp(28px,7.6vw,42px); }
  .story-video-frame, .story-video { max-width: 100%; }
  .coins-layout, .split-panel, .contact-layout { grid-template-columns: 1fr; }
}
@media (max-width: 360px) { .hero-title { font-size: 26px; } .feature-card { height: 325px; } }


/* TYPOGRAPHY-ONLY PATCH: slight font-size increase across all pages; no other styles changed. */
body { font-size: 16px; }
.section-kicker { font-size: 11px; }
.main-nav a { font-size: 13px; }
.button { font-size: 14px; }
.button-small { font-size: 13px; }
.video-eyebrow { font-size: 11px; }
.hero-main > p { font-size: clamp(15px, 1.2vw, 19px); }
.hero-metrics small { font-size: 11px; }
.dashboard-top { font-size: 13px; }
.dashboard-top small { font-size: 10px; }
.dashboard-main small { font-size: 11px; }
.dashboard-sectors div { font-size: 10px; }
.dashboard-sectors small { font-size: 12px; }
.about-points strong, .coins-points strong { font-size: 15px; }
.about-points small, .coins-points small { font-size: 12px; }
.section-heading > p { font-size: 14px; }
.section-heading > .button { font-size: 12px; }
.feature-copy strong { font-size: 15px; }
.feature-copy small { font-size: 13px; }
.coins-copy p { font-size: 14px; }
.trust-layout p, .trust-grid > div { font-size: 12px; }
.steps strong { font-size: 12px; }
.steps small { font-size: 11px; }
.terms-grid strong, .terms-grid small { font-size: 10.5px; }
.final-cta-inner p { font-size: 13px; }
.footer-brand { font-size: 12px; }
.footer-links, .footer-note { font-size: 11px; }
.contact-aside small { font-size: 13px; }
.field label { font-size: 13px; }
.field span, .form-note { font-size: 12px; }
.legal-layout aside a { font-size: 14px; }
.story-video-label { font-size: 11px; }
.eco-scroll-hint { font-size: 11px; }
.eco-count { font-size: 13px; }
@media (max-width: 700px) {
  .brand { font-size: 14px; }
  .header-join { font-size: 11px; }
  .section-kicker { font-size: 10px; }
  .video-eyebrow { font-size: 10px; }
  .hero-main > p, .page-hero p, .story-copy p { font-size: 15px; }
  .feature-copy strong { font-size: 16px; }
  .feature-copy small { font-size: 13px; }
  .eco-panel p { font-size: 16px; }
  .story-video-label { font-size: 10px; }
  .main-nav.open .mobile-join { font-size: 15px; }
}
