/* ============================================================
   Cyrene Labs — cyrenelabs.com
   Shared site styles. Tokens from the Cyrene Labs Design System
   (cyrene-labs-design-system/project/colors_and_type.css).
   Cool · clinical · premium.
   ============================================================ */

/* ---------- Fonts: Poppins via Google Fonts (linked in header.php) ---------- */

/* ---------- Tokens ---------- */
:root {
  --cy-navy:#0B1A2E; --cy-navy-900:#0E2138; --cy-navy-800:#14304F; --cy-navy-700:#1B3D63; --cy-navy-600:#25527F;
  --cy-blue:#3BA4DC; --cy-blue-600:#2E8DC1; --cy-blue-400:#5FB7E4; --cy-blue-100:#E6F4FB;
  --cy-gold:#D4A843; --cy-gold-600:#B98E2F; --cy-gold-400:#E0BC68; --cy-gold-100:#F8EFD7;
  --cy-white:#FFFFFF; --cy-cream:#F4F0E6;
  --cy-bg:#F6F8FA; --cy-bg-soft:#EDF1F5; --cy-stroke:#E2E8EE; --cy-stroke-strong:#C8D2DC;
  --ink-1:#0B1A2E; --ink-2:#2C3E55; --ink-3:#5A6B80; --ink-4:#8696A8;
  --on-navy-1:#FFFFFF; --on-navy-2:#C8D6E4; --on-navy-3:#8AA0B7;
  --success:#2F9E66; --danger:#C5453B;
  --grad-hero:radial-gradient(120% 120% at 80% 20%, #143257 0%, #0B1A2E 60%);
  --grad-pulse:linear-gradient(90deg,#3BA4DC 0%,#D4A843 100%);
  --font-sans:"Poppins","Helvetica Neue",Arial,system-ui,sans-serif;
  --shadow-card:0 2px 6px rgba(11,26,46,.05),0 12px 28px rgba(11,26,46,.06);
  --shadow-lg:0 24px 48px rgba(11,26,46,.12),0 8px 16px rgba(11,26,46,.06);
  --radius:10px; --radius-lg:16px; --radius-xl:20px;
  --ease:cubic-bezier(.2,.7,.2,1);
}

/* ---------- Base ---------- */
.cy26-page *, .cy26-page *::before, .cy26-page *::after { box-sizing:border-box; }
html { scroll-behavior:smooth; }
.cy26-page {
  margin:0; font-family:var(--font-sans) !important; font-weight:400 !important; color:var(--ink-1) !important; background:var(--cy-bg);
  font-size:16px; line-height:1.6 !important; -webkit-font-smoothing:antialiased;
}
.cy26-page * { font-family:inherit !important; }
/* Theme has `body, p, a { font-family: Helvetica !important; }` injected via a Redux customizer
   setting — that's a DIRECT rule on <a>/<p>, so it beats inherited values from any ancestor
   regardless of that ancestor's specificity. The wildcard rules above/below use a class + universal
   selector, which is specificity (0,1,0) — higher than the theme's bare-element (0,0,1) — so with
   matching !important, ours wins outright rather than depending on cascade order. */
.site-header, .site-header *,
.site-footer, .site-footer *,
.audience-strip, .audience-strip *,
.private-banner, .private-banner *,
.cy26-modal, .cy26-modal * {
  font-family:var(--font-sans) !important;
}
.cy26-page img { max-width:100%; display:block; }
.cy26-page a { color:inherit !important; }
/* Accent-colored inline links (e.g. "brand kit" inside body copy) need their own class here —
   a plain style="color:..." attribute loses to the !important rule above. */
.cy26-page a.link-blue { color:var(--cy-blue-400) !important; }
.cy26-page a.link-blue-strong { color:var(--cy-blue-400) !important; font-weight:600 !important; }
.cy26-page a.link-blue-600 { color:var(--cy-blue-600) !important; font-weight:600 !important; }
.cy26-page a.link-on-navy { color:var(--on-navy-2) !important; }
.cy26-page h1, .cy26-page h2, .cy26-page h3, .cy26-page h4, .cy26-page h5, .cy26-page h6 {
  margin:0; line-height:1.12 !important; letter-spacing:-.01em; text-wrap:balance;
  text-transform:none !important; font-family:var(--font-sans) !important;
}
.cy26-page p { margin:0; color:inherit !important; }
.cy26-page .wrap { max-width:1120px; margin:0 auto; padding:0 24px; }
.cy26-page .wrap--narrow { max-width:880px; }
.cy26-page section { padding:80px 0; }
@media (max-width:720px){ .cy26-page section { padding:56px 0; } }

.cy26-page .eyebrow {
  font-size:13px; font-weight:600 !important; letter-spacing:.18em; text-transform:uppercase;
  color:var(--cy-blue) !important; margin-bottom:16px;
}
.cy26-page .eyebrow--gold { color:var(--cy-gold) !important; }
.cy26-page .h1 { font-size:clamp(36px,4.4vw,60px); font-weight:800 !important; line-height:1.3 !important; }
@media (max-width:600px){ .cy26-page .h1 { line-height:1.3em !important; } }
.cy26-page .h2 { font-size:clamp(28px,3vw,42px); font-weight:700 !important; line-height:1.15 !important; }
.cy26-page .h3 { font-size:22px; font-weight:700 !important; }
.cy26-page .lead { font-size:18px; line-height:1.7 !important; color:var(--ink-2) !important; max-width:62ch; }
.cy26-page .small { font-size:14px; color:var(--ink-3) !important; }
.cy26-page .hl-blue { color:var(--cy-blue) !important; }
.cy26-page .hl-gold { color:var(--cy-gold) !important; }
.cy26-page .center { text-align:center; }
.cy26-page .center .lead { margin-left:auto; margin-right:auto; }
.cy26-page .mt-2 {margin-top:8px;} .cy26-page .mt-4 {margin-top:16px;} .cy26-page .mt-5 {margin-top:24px;} .cy26-page .mt-6 {margin-top:32px;} .cy26-page .mt-7 {margin-top:48px;}
/* Training section's "Open the Trusted Doctors Community" CTA reads as crowded/overlapping the
   card grid above it on mobile — give it clearer top and bottom breathing room there specifically. */
#training .center.mt-6 { margin-top:56px; margin-bottom:16px; }

/* Pulse rule */
.cy26-page .rule { width:64px; height:3px; border-radius:3px; background:var(--grad-pulse); border:0; margin:20px 0 0; }
.cy26-page .center .rule { margin-left:auto; margin-right:auto; }

/* ---------- Buttons ---------- */
.cy26-page .btn {
  display:inline-block; font-family:var(--font-sans) !important; font-size:15px; font-weight:600 !important; letter-spacing:.04em;
  padding:14px 28px; border-radius:var(--radius); border:0; cursor:pointer; text-decoration:none;
  transition:background var(--ease) 220ms, transform var(--ease) 140ms;
  text-transform:inherit !important;
}
.cy26-page .btn:active { transform:translateY(1px); }
@media (max-width:600px){
  .cy26-page .btn { max-width:100%; white-space:normal; }
}
.cy26-page .btn--gold, .site-header .nav__links a.nav__cta {
  background:#D4A843 !important; border:1px solid #D4A843 !important; color:#0B1A2E !important;
}
.cy26-page .btn--gold:hover, .site-header .nav__links a.nav__cta:hover {
  color:#FFFFFF !important;
}
.cy26-page .btn--blue { background:var(--cy-blue); color:var(--cy-navy) !important; }
.cy26-page .btn--blue:hover { background:var(--cy-blue-400); }
.cy26-page .btn--ghost, .cy26-page .btn--ghost-light {
  background:transparent !important; border:1px solid #D4A843 !important; color:#D4A843 !important;
}
.cy26-page .btn--ghost:hover, .cy26-page .btn--ghost-light:hover {
  background:#D4A843 !important; border-color:#D4A843 !important; color:#0B1A2E !important;
}
.cy26-page .btn--lg {font-size:17px;padding: 17px clamp(15px, 8.203vw + -48.000px, 36px);}

/* ---------- Header / nav ---------- */
.site-header { background:var(--cy-navy); position:sticky; top:0; z-index:50; box-shadow:0 1px 0 rgba(255,255,255,.06); font-family:var(--font-sans) !important; }
/* position:relative — without it, .nav__links' position:absolute (mobile open state) anchors to
   .site-header instead (the next positioned ancestor up), which has no padding and spans full
   width edge-to-edge, unlike .nav's own inset padding/max-width. That mismatch is what reads as
   the open menu (and the CTA inside it) not lining up / appearing to shift. */
.nav { display:flex; align-items:center; gap:0; padding:14px 20px; max-width:1200px; margin:0 auto; position:relative; }
.nav__logo { flex:0 0 auto; }
.nav__logo img { height:34px; width:auto; }
.nav__links { display:flex; align-items:center; gap:18px; margin-left:auto; flex-wrap:nowrap; }
.site-header .nav__links > a {
  color:var(--on-navy-2) !important; font-size:14.5px; font-weight:500 !important; text-decoration:none;
  transition:color 180ms; white-space:nowrap; flex:0 0 auto;
}
.site-header .nav__links > a:hover, .site-header .nav__links > a[aria-current="page"] { color:var(--on-navy-1) !important; }
.nav__cta {
  font-weight:600 !important; font-size:14.5px; padding:10px 20px; border-radius:8px; text-decoration:none;
  white-space:nowrap; flex:0 0 auto; text-transform:inherit !important;
}
/* Colors for .nav__cta are set by the .site-header .nav__cta rule above (CTA solid spec). */

/* CY26-FEATURE: account-cart-nav — cart icon + live count badge. Roll back: delete this block
   plus the matching markup in header.php and the cy26_cart_count_fragment() hook in functions.php
   (all three are tagged "CY26-FEATURE: account-cart-nav"). */
.nav__cart {
  position:relative; display:inline-flex; align-items:center; justify-content:center;
  color:#FFFFFF !important; text-decoration:none; font-size:19px; padding:6px; margin:0 -2px;
  flex:0 0 auto;
}
.nav__cart:hover { color:var(--cy-gold) !important; }
/* Mobile cart icon is only switched on inside the @media(max-width:1140px) block below — without
   this default off-state it inherits .nav__cart's display:inline-flex and shows on every screen
   size, duplicating the desktop cart icon. */
.nav__cart--mobile { display:none; }
.nav__cart-icon { width:21px; height:21px; display:block; }
.nav__cart-count {
  position:absolute; top:-2px; right:-4px; min-width:17px; height:17px; padding:0 4px;
  background:var(--cy-gold) !important; color:var(--cy-navy) !important; font-size:10.5px !important; font-weight:700 !important;
  line-height:17px !important; text-align:center; border-radius:999px; font-family:var(--font-sans) !important;
}

/* Login dropdown */
.dropdown { position:relative; flex:0 0 auto; }
.dropdown > button {
  background:none; border:1px solid var(--cy-navy-600); color:var(--on-navy-2) !important; font:inherit; font-size:14.5px;
  font-weight:500 !important; padding:9px 16px; border-radius:8px; cursor:pointer; white-space:nowrap;
}
.dropdown > button:hover { color:var(--on-navy-1) !important; border-color:var(--cy-blue); }
.dropdown__menu {
  display:none; position:absolute; right:0; top:calc(100% + 10px); min-width:230px; background:var(--cy-white);
  border:1px solid var(--cy-stroke); border-radius:12px; box-shadow:var(--shadow-lg); padding:8px; z-index:60;
}
.dropdown.open .dropdown__menu { display:block; }
.dropdown__menu a { display:block; padding:11px 14px; border-radius:8px; font-size:14.5px; color:var(--ink-2) !important; text-decoration:none; }
.dropdown__menu a:hover { background:var(--cy-blue-100); color:var(--ink-1) !important; }
.dropdown__menu .menu-note { display:block; padding:4px 14px 8px; font-size:12px; color:var(--ink-4) !important; }

/* Mobile nav — breakpoint widened from the original 920px since My Account + the cart icon
   need more room than the original Log-in-only nav did; this avoids a cramped middle zone on
   tablet/small-laptop widths before the hamburger menu kicks in. */
.nav__toggle {
  display:none; position:relative; background:none; border:0; color:var(--on-navy-1) !important;
  cursor:pointer; margin-left:auto; padding:0; width:26px; height:20px; flex-shrink:0;
}
.nav__toggle-bar {
  position:absolute; left:0; width:100%; height:2px; background:currentColor; border-radius:2px;
  transition:transform 220ms ease, opacity 220ms ease, top 220ms ease;
}
.nav__toggle-bar:nth-child(1) { top:0; }
.nav__toggle-bar:nth-child(2) { top:9px; }
.nav__toggle-bar:nth-child(3) { top:18px; }
/* .nav.open drives this — same class site.js already toggles for the menu itself, so no JS
   changes needed. Bars 1 and 3 rotate into an X shape; the middle bar fades out. */
.nav.open .nav__toggle-bar:nth-child(1) { top:9px; transform:rotate(45deg); }
.nav.open .nav__toggle-bar:nth-child(2) { opacity:0; }
.nav.open .nav__toggle-bar:nth-child(3) { top:9px; transform:rotate(-45deg); }
@media (max-width:1140px){
  .nav { gap:8px; padding:14px 16px; }
  .nav__toggle { display:block;background:none !important}
  .nav__links {
    display:none; position:absolute; top:100%; left:0; right:0; background:var(--cy-navy-900);
    flex-direction:column; align-items:flex-start; padding:16px 24px 24px; gap:18px; box-shadow:var(--shadow-lg);
    max-height:calc(100vh - 70px); overflow-y:auto;
  }
  .nav.open .nav__links { display:flex; }
  .site-header .nav__links > a { white-space:normal; }
  .nav__cta { white-space:normal; text-align:center; width:100%; }
  .dropdown, .nav__cart--desktop { width:100%; }
  .dropdown > button { width:100%; text-align:left; }
  /* Animated accordion instead of an absolute-positioned overlay: display can't be transitioned,
     so this stays display:block always on mobile and animates max-height 0 -> open instead. It's
     back in normal flow (position:static), so it pushes "Become a Cyrene Partner" down as it
     opens — but smoothly now, and .nav__links' own overflow-y:auto (already set above) scrolls
     the whole mobile menu if the expanded dropdown makes the total content taller than the
     screen, so nothing becomes unreachable. */
  .dropdown__menu {
    display:block; position:static; top:auto; right:auto; box-shadow:none; border:0;
    width:100%; box-sizing:border-box; background:var(--cy-navy-800);
    max-height:0; overflow:hidden; opacity:0; padding:0 8px; margin-top:0;
    transition:max-height 280ms ease, opacity 200ms ease, margin-top 280ms ease, padding 280ms ease;
  }
  .dropdown.open .dropdown__menu { max-height:400px; opacity:1; margin-top:8px; padding:8px; }
  .dropdown__menu a { color:var(--on-navy-2) !important; }
  .dropdown__menu a:hover { background:var(--cy-navy-700); color:var(--on-navy-1) !important; }
  .dropdown__menu .menu-note { color:var(--on-navy-3) !important; }
  /* CY26-FEATURE: account-cart-nav mobile relocation — cart moves out of the collapsible
     dropdown and sits persistently between the logo and hamburger on mobile/tablet.
     margin-left:auto goes on the cart icon (not .nav__toggle) so it alone absorbs the free
     space after the logo — with both auto, flexbox splits the space evenly between them and
     pushes them apart instead of keeping the cart snug against the hamburger. */
  .nav__cart--desktop { display:none; }
  .nav__cart--mobile { display:inline-flex; margin-left:auto; }
  .nav__cart--mobile + .nav__toggle { margin-left:0; }
}

/* ---------- Hero ---------- */
.cy26-page .hero { background:var(--grad-hero); color:var(--on-navy-1) !important; padding:96px 0 104px; position:relative; overflow:hidden; }
.cy26-page .hero::after {
  content:""; position:absolute; right:-140px; top:-140px; width:480px; height:480px; border-radius:50%;
  background:radial-gradient(circle, rgba(59,164,220,.14), transparent 70%); pointer-events:none;
}
.cy26-page .hero .eyebrow { color:var(--cy-gold) !important; }
.cy26-page .hero h1 { color:var(--cy-white) !important; max-width:17ch;line-height:1.3em }
.cy26-page .hero .lead { color:var(--on-navy-2) !important; margin-top:24px; }
.cy26-page .hero__ctas { display:flex; gap:14px; flex-wrap:wrap; margin-top:36px; }
@media (max-width:600px){
  .cy26-page .hero__ctas { flex-direction:column; }
  .cy26-page .hero__ctas .btn { width:100%; text-align:center; }
}
.cy26-page .hero__trust { margin-top:28px; font-size:13.5px; color:var(--on-navy-3) !important; }
.cy26-page .hero--page { padding:72px 0; }

/* ---------- Cards & grids ---------- */
.cy26-page .grid { display:grid; gap:22px; margin-top:44px; }
.cy26-page .grid--2 { grid-template-columns:repeat(2,1fr); }
.cy26-page .grid--3 { grid-template-columns:repeat(3,1fr); }
.cy26-page .grid--4 { grid-template-columns:repeat(4,1fr); }
@media (max-width:920px){ .cy26-page .grid--3, .cy26-page .grid--4 { grid-template-columns:repeat(2,1fr);} }
@media (max-width:640px){ .cy26-page .grid--2, .cy26-page .grid--3, .cy26-page .grid--4 { grid-template-columns:1fr;} }

/* White surfaces reset their own ink so they stay legible inside navy .band sections */
.cy26-page .card { background:var(--cy-white); color:var(--ink-1) !important; border:1px solid var(--cy-stroke); border-radius:var(--radius-lg); padding:28px; box-shadow:var(--shadow-card); }
.cy26-page .card .num { font-size:13px; font-weight:700 !important; color:var(--cy-gold) !important; letter-spacing:.08em; }
.cy26-page .card h3 { font-size:18px; margin:12px 0 8px; }
.cy26-page .card p { color:var(--ink-3) !important; font-size:14.5px; line-height:1.65 !important; }
.cy26-page .card--navy { background:var(--cy-navy-800); border-color:var(--cy-navy-700); }
.cy26-page .card--navy h3 { color:var(--on-navy-1) !important; }
.cy26-page .card--navy p { color:var(--on-navy-2) !important; }

/* ---------- Navy band sections ---------- */
.cy26-page .band { background:var(--cy-navy); color:var(--on-navy-1) !important; }
.cy26-page .band .h2 { color:var(--cy-white) !important; }
.cy26-page .band .lead { color:var(--on-navy-2) !important; }
.cy26-page .band--gradient { background:var(--grad-hero); }

/* ---------- Creed / tenets ---------- */
.cy26-page .tenets { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; margin-top:44px; text-align:left; }
@media (max-width:860px){ .cy26-page .tenets { grid-template-columns:1fr; } }
.cy26-page .tenet { border:1px solid var(--cy-navy-700); border-radius:var(--radius-lg); padding:28px; background:rgba(255,255,255,.03); }
.cy26-page .tenet .num { font-size:13px; font-weight:700 !important; color:var(--cy-gold) !important; letter-spacing:.08em; }
.cy26-page .tenet h3 { color:var(--cy-white) !important; font-size:19px; margin:12px 0 8px; }
.cy26-page .tenet p { color:var(--on-navy-2) !important; font-size:14.5px; }

/* ---------- Steps ---------- */
.cy26-page .steps { counter-reset:step; display:grid; gap:16px; margin-top:44px; }
.cy26-page .step { display:flex; gap:20px; align-items:flex-start; background:var(--cy-white); color:var(--ink-1) !important; border:1px solid var(--cy-stroke); border-radius:var(--radius-lg); padding:24px 26px; box-shadow:var(--shadow-card); }
.cy26-page .step__num {
  counter-increment:step; flex:0 0 auto; width:40px; height:40px; border-radius:50%;
  background:var(--cy-gold-100); color:var(--cy-gold-600) !important; font-weight:800 !important; display:grid; place-items:center;
}
.cy26-page .step__num::before { content:counter(step); }
.cy26-page .step h3 { font-size:17px; }
.cy26-page .step p { color:var(--ink-3) !important; font-size:14.5px; margin-top:4px; }

/* ---------- Split layouts ---------- */
.cy26-page .split { display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:center; }
.cy26-page .split--photo-narrow { grid-template-columns:340px 1fr; }
@media (max-width:860px){ .cy26-page .split, .cy26-page .split--photo-narrow { grid-template-columns:1fr; gap:36px; } }
.cy26-page .photo-frame { border-radius:var(--radius-xl); overflow:hidden; box-shadow:var(--shadow-lg); }
.cy26-page .photo-frame img { width:100%; height:100%; object-fit:cover; }

.cy26-page .pills { display:flex; gap:10px; flex-wrap:wrap; margin-top:20px; }
.cy26-page .pill { font-size:13px; font-weight:600 !important; padding:7px 14px; border-radius:999px; background:var(--cy-blue-100); color:var(--cy-blue-600) !important; }
.cy26-page .pill--gold { background:var(--cy-gold-100); color:var(--cy-gold-600) !important; }
/* A pill badge inline inside a heading (e.g. the toolkit page's "Awaiting Dr. G's green light")
   wraps onto the same tight heading line-height on narrow screens and visually overlaps the text
   above it — drop it to its own line with breathing room below that width. */
@media (max-width:600px){
  .cy26-page h3 .pill { display:block; width:fit-content; margin:10px 0 0 !important; }
}

/* ---------- Checklist ---------- */
.cy26-page .checks { list-style:none; padding:0; margin:24px 0 0; display:grid; gap:12px; }
.cy26-page .checks li { display:flex; gap:12px; align-items:flex-start; color:var(--ink-2) !important; font-size:15.5px; line-height:1.55 !important; }
.cy26-page .checks li::before {
  content:"✓"; flex:0 0 auto; width:22px; height:22px; border-radius:50%; margin-top:2px;
  background:var(--cy-gold-100); color:var(--cy-gold-600) !important; font-size:13px; font-weight:700 !important; display:grid; place-items:center;
}
.cy26-page .band .checks li { color:var(--on-navy-2) !important; }
.cy26-page .band .card .checks li, .cy26-page .card .checks li { color:var(--ink-2) !important; }

/* ---------- Pricing ---------- */
.cy26-page .price-cards { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; margin-top:44px; align-items:stretch; }
@media (max-width:860px){ .cy26-page .price-cards { grid-template-columns:1fr; } }
.cy26-page .price-card { background:var(--cy-white); color:var(--ink-1) !important; border:1px solid var(--cy-stroke); border-radius:var(--radius-lg); padding:32px 28px; box-shadow:var(--shadow-card); display:flex; flex-direction:column; }
.cy26-page .price-card--feature { border:2px solid var(--cy-gold); position:relative; }
.cy26-page .price-card .tag { position:absolute; top:-13px; left:24px; background:var(--cy-gold); color:var(--cy-navy) !important; font-size:12px; font-weight:700 !important; letter-spacing:.06em; text-transform:uppercase; padding:4px 12px; border-radius:999px; }
.cy26-page .price-card .amount { font-size:42px; font-weight:800 !important; letter-spacing:-.02em; margin-top:8px; }
.cy26-page .price-card .amount span { font-size:16px; font-weight:600 !important; color:var(--ink-3) !important; letter-spacing:0; }
.cy26-page .price-card .what { color:var(--ink-3) !important; font-size:14.5px; margin-top:6px; }

/* ---------- Tables ---------- */
.cy26-page .table-scroll { overflow-x:auto; margin-top:36px; border-radius:var(--radius-lg); border:1px solid var(--cy-stroke); box-shadow:var(--shadow-card); }
.cy26-page table { border-collapse:collapse; width:100%; background:var(--cy-white); color:var(--ink-1) !important; font-size:15px; min-width:560px; margin-bottom:0; }
.cy26-page th, .cy26-page td { text-align:left; padding:14px 18px; border-bottom:1px solid var(--cy-stroke); vertical-align:top; }
.cy26-page thead th { background:var(--cy-navy); color:var(--on-navy-1) !important; font-weight:600 !important; font-size:14px; letter-spacing:.02em; }
.cy26-page tbody tr:last-child td { border-bottom:0; }
.cy26-page td.good { color:var(--success) !important; font-weight:600 !important; }
.cy26-page td.bad { color:var(--danger) !important; }
.cy26-page tr.total td { background:var(--cy-gold-100); font-weight:700 !important; font-family:var(--font-sans) !important; }

/* ---------- ROI calculator ---------- */
.cy26-page .calc { background:var(--cy-navy-800); border:1px solid var(--cy-navy-700); border-radius:var(--radius-xl); padding:36px; margin-top:44px; }
.cy26-page .calc label { display:block; color:var(--on-navy-2) !important; font-weight:600 !important; font-size:15px; }
.cy26-page .calc input[type=range] { width:100%; margin:18px 0 8px; accent-color:var(--cy-gold); }
.cy26-page .calc__value { color:var(--cy-white) !important; font-size:18px; font-weight:700 !important; }
.cy26-page .calc__stats { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin-top:26px; }
@media (max-width:720px){ .cy26-page .calc__stats { grid-template-columns:1fr; } }
.cy26-page .calc__stat { background:rgba(255,255,255,.04); border:1px solid var(--cy-navy-700); border-radius:var(--radius-lg); padding:20px; }
.cy26-page .calc__stat .label {text-align:left;padding-left:0;padding-right:0; display:block !important; white-space:normal !important; font-size:12.5px; letter-spacing:.12em; text-transform:uppercase; color:var(--on-navy-3) !important; font-weight:600 !important; }
.cy26-page .calc__stat .value { font-size:clamp(26px,3vw,36px); font-weight:800 !important; color:var(--cy-gold) !important; margin-top:6px; letter-spacing:-.02em; }
.cy26-page .calc__note { color:var(--on-navy-3) !important; font-size:13px; margin-top:20px; }

/* ---------- Stat band ---------- */
.cy26-page .stats { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; margin-top:44px; }
@media (max-width:720px){ .cy26-page .stats { grid-template-columns:1fr; } }
.cy26-page .stat { text-align:center; padding:28px 20px; border-radius:var(--radius-lg); background:rgba(255,255,255,.03); border:1px solid var(--cy-navy-700); }
.cy26-page .stat .value { font-size:clamp(34px,4vw,52px); font-weight:800 !important; color:var(--cy-gold) !important; letter-spacing:-.02em; line-height:1 !important; }
.cy26-page .stat .label { display:block !important; white-space:normal !important; color:var(--on-navy-2) !important; font-size:14.5px; margin-top:10px;
font-weight:500;line-height:1.2em}

/* ---------- FAQ ---------- */
.cy26-page .faq { margin-top:44px; display:grid; gap:14px; }
.cy26-page .faq details { background:var(--cy-white); color:var(--ink-1) !important; border:1px solid var(--cy-stroke); border-radius:var(--radius-lg); padding:0; box-shadow:var(--shadow-card); }
.cy26-page .faq summary { cursor:pointer; font-weight:600 !important; font-size:16.5px; padding:20px 24px; list-style:none; position:relative; }
.cy26-page .faq summary::-webkit-details-marker { display:none; }
.cy26-page .faq summary::after { content:"+"; position:absolute; right:24px; top:50%; transform:translateY(-50%); color:var(--cy-blue) !important; font-size:22px; font-weight:400 !important; }
.cy26-page .faq details[open] summary::after { content:"–"; }
.cy26-page .faq .faq__body { padding:0 24px 22px; color:var(--ink-2) !important; font-size:15px; line-height:1.7 !important; max-width:72ch; }

/* ---------- CTA panel ---------- */
.cy26-page .cta-panel { background:var(--grad-hero); color:var(--on-navy-1) !important; border-radius:var(--radius-xl); padding:56px 48px; text-align:center; box-shadow:var(--shadow-lg); }
@media (max-width:720px){ .cy26-page .cta-panel { padding:40px 24px; } }
.cy26-page .cta-panel h2 { color:var(--cy-white) !important; font-size:clamp(26px,3.2vw,38px); max-width:26ch; margin:0 auto; }
.cy26-page .cta-panel p { color:var(--on-navy-2) !important; max-width:56ch; margin:18px auto 30px; font-size:16.5px; }

/* ---------- Quote ---------- */
.cy26-page .quote { border-left:3px solid var(--cy-gold); padding:8px 0 8px 26px; margin:36px 0 0; }
.cy26-page .quote p { font-size:20px; font-style:italic; line-height:1.6 !important; color:var(--ink-2) !important; max-width:60ch; }
.cy26-page .quote cite { display:block; margin-top:14px; font-style:normal; font-size:14px; font-weight:600 !important; color:var(--ink-3) !important; }
.cy26-page .band .quote p { color:var(--on-navy-2) !important; }
.cy26-page .band .quote cite { color:var(--on-navy-3) !important; }

/* ---------- Footer ---------- */
.cy26-footer-outer { background:var(--cy-bg); padding-top:96px; }
.site-footer {
  background:var(--cy-navy); color:var(--on-navy-3) !important; padding:56px 0 40px; font-size:14px;
  max-width:unset; margin:0; border-radius:0 0 0 0; font-family:var(--font-sans) !important;
}
.site-footer .wrap { max-width:1120px; margin:0 auto; padding:0 24px; }
.site-footer a { color:var(--on-navy-2) !important; text-decoration:none; }
.site-footer a:hover { color:var(--cy-white) !important; }
.footer-grid { display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:40px; }
@media (max-width:860px){ .footer-grid { grid-template-columns:1fr 1fr; } }
@media (max-width:560px){ .footer-grid { grid-template-columns:1fr; } }
.footer-grid h4 { color:var(--cy-white) !important; font-size:13px; letter-spacing:.14em; text-transform:uppercase; margin-bottom:16px; }
.footer-grid ul { list-style:none; margin:0; padding:0; display:grid; gap:10px; }
.site-footer .logo img { height:30px; width:auto; margin-bottom:16px; }
.legal { border-top:1px solid var(--cy-navy-700); margin-top:44px; padding-top:28px; font-size:12.5px; line-height:1.7 !important; color:var(--on-navy-3) !important; }
.legal p + p { margin-top:10px; }

/* ---------- Toolkit: copy blocks, swatches, link cards ---------- */
.cy26-page .copyblock { background:var(--cy-white); color:var(--ink-1) !important; border:1px solid var(--cy-stroke); border-radius:var(--radius-lg); padding:22px 24px; box-shadow:var(--shadow-card); position:relative; }
.cy26-page .copyblock h3 { font-size:15.5px; padding-right:88px; }
.cy26-page .copyblock .copy-target { color:var(--ink-2) !important; font-size:14.5px; line-height:1.7 !important; margin-top:10px; white-space:pre-line; }
.cy26-page .copy-btn { position:absolute; top:18px; right:18px; background:var(--cy-blue-100); color:var(--cy-blue-600) !important; border:0; font:inherit; font-size:12.5px; font-weight:600 !important; padding:7px 14px; border-radius:999px; cursor:pointer; }
.cy26-page .copy-btn:hover { background:var(--cy-blue); color:var(--cy-navy) !important; }
.cy26-page .copy-btn.copied { background:var(--success); color:#fff !important; }
.cy26-page .swatches { display:flex; gap:14px; flex-wrap:wrap; margin-top:24px; }
.cy26-page .swatch { width:132px; border:1px solid var(--cy-stroke); border-radius:12px; overflow:hidden; background:var(--cy-white); box-shadow:var(--shadow-card); }
.cy26-page .swatch .chip { height:64px; }
.cy26-page .swatch .meta { padding:10px 12px; font-size:12px; color:var(--ink-3) !important; }
.cy26-page .swatch .meta b { display:block; color:var(--ink-1) !important; font-size:12.5px; }
.cy26-page .link-card { background:var(--cy-white); color:var(--ink-1) !important; border:1px solid var(--cy-stroke); border-radius:var(--radius-lg); padding:22px 24px; box-shadow:var(--shadow-card); display:block; text-decoration:none; transition:transform 140ms var(--ease), box-shadow 140ms var(--ease); }
.cy26-page .link-card:hover { transform:translateY(-2px); box-shadow:var(--shadow-lg); }
.cy26-page .link-card h3 { font-size:16px; color:var(--cy-blue-600) !important; }
.cy26-page .link-card p { color:var(--ink-3) !important; font-size:13.5px; margin-top:6px; }
.cy26-page .link-card .url { display:block; margin-top:10px; font-size:12.5px; color:var(--ink-4) !important; word-break:break-all; }
.cy26-page .dl-row { display:flex; gap:12px; flex-wrap:wrap; margin-top:18px; }
.cy26-page .dl-row a { display:inline-block; background:var(--cy-white); border:1px solid var(--cy-stroke-strong); border-radius:999px; padding:9px 18px; font-size:13.5px; font-weight:600 !important; color:var(--ink-2) !important; text-decoration:none; }
.cy26-page .dl-row a:hover { border-color:var(--cy-blue); color:var(--cy-blue-600) !important; }

/* ---------- Quick Start: parts & video slots ---------- */
.cy26-page .part { background:var(--cy-white); color:var(--ink-1) !important; border:1px solid var(--cy-stroke); border-radius:var(--radius-xl); padding:32px; box-shadow:var(--shadow-card); margin-top:28px; }
.cy26-page .part__head { display:flex; gap:18px; align-items:center; }
.cy26-page .part__num { flex:0 0 auto; width:46px; height:46px; border-radius:50%; background:var(--cy-navy); color:var(--cy-gold) !important; font-weight:800 !important; font-size:18px; display:grid; place-items:center; }
.cy26-page .part__head h3 { font-size:20px; }
.cy26-page .part__head .part-label { font-size:12px; letter-spacing:.16em; text-transform:uppercase; color:var(--cy-blue-600) !important; font-weight:700 !important; }
.cy26-page .part__body { margin-top:18px; color:var(--ink-2) !important; font-size:15px; line-height:1.7 !important; }
.cy26-page .part__body a { color:var(--cy-blue-600) !important; font-weight:600 !important; }
.cy26-page .video-row { display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-top:18px; }
.cy26-page .video-slot > iframe{width: 100%;height: auto;aspect-ratio: 16 / 9;}
.cy26-page .video-slot > video{width: 100%;height: auto;aspect-ratio: 16 / 9;display:block;background:#000;}
@media (max-width:680px){ .cy26-page .video-row { grid-template-columns:1fr; } }
.cy26-page .video-slot { display:block; border:1px solid var(--cy-stroke); border-radius:12px; overflow:hidden; text-decoration:none; background:var(--cy-bg-soft); }
.cy26-page .video-slot .thumb { position:relative; aspect-ratio:16/9; background:var(--cy-navy); display:grid; place-items:center; background-position:center center }
.cy26-page .video-slot .thumb::after { content:"▶"; width:52px; height:52px; border-radius:50%; background:rgba(255,255,255,.92); color:var(--cy-navy) !important; display:grid; place-items:center; font-size:18px; padding-left:4px; box-sizing:border-box; }
.cy26-page .video-slot .cap { padding:12px 14px; font-size:13.5px; font-weight:600 !important; color:var(--ink-2) !important;display:inline-block}
.cy26-page .video-slot .cap .tag { display:inline-block; margin-left:6px; font-size:11px; font-weight:700 !important; letter-spacing:.06em; text-transform:uppercase; color:var(--cy-gold-600) !important; background:var(--cy-gold-100); border-radius:999px; padding:2px 8px; }
.cy26-page .video-slot.placeholder .thumb { background:repeating-linear-gradient(45deg,var(--cy-bg-soft),var(--cy-bg-soft) 12px,var(--cy-stroke) 12px,var(--cy-stroke) 13px); }
.cy26-page .video-slot.placeholder .thumb::after { content:"🎬"; background:transparent; font-size:30px; padding:0; }
.cy26-page .script-card { background:var(--cy-blue-100); border:1px solid var(--cy-stroke); border-radius:12px; padding:22px 24px; margin-top:18px; font-size:15px; line-height:1.75 !important; color:var(--ink-2) !important; }
.cy26-page .script-card p + p { margin-top:12px; }

/* ---------- Office media: posters ---------- */
/* grid-template-columns:minmax(0,1fr) — without this, an implicit grid track sizes itself to fit
   .poster's intrinsic 8.5in width before max-width:100% can apply, overflowing narrow viewports
   even though .poster itself looks "responsive". minmax(0,...) caps the track at the container. */
.cy26-page .poster-stage { display:grid; grid-template-columns:minmax(0,1fr); place-items:center; padding:48px 16px; background:var(--cy-bg-soft); overflow-x:hidden; }
/* aspect-ratio:8.5/11 is a *preferred* shape, not a hard cap — on screen, once wrapped text needs
   more room than that ratio gives at a given width (long copy at narrow mobile widths), the box
   should grow taller rather than clip. overflow:hidden previously suppressed that growth, silently
   cutting off content instead. Dropped here; print still gets its own fixed 8.5in/11in size below,
   where pagination (not clipping) handles anything that doesn't fit one physical page. */
.cy26-page .poster {
  width:8.5in; max-width:100%; aspect-ratio:8.5/11; background:linear-gradient(165deg,#143257 0%,#0B1A2E 55%);
  background-color:#0B1A2E; color:#fff !important; display:flex; flex-direction:column; box-shadow:var(--shadow-lg); position:relative;
  -webkit-print-color-adjust:exact !important; print-color-adjust:exact !important;
}
.cy26-page .poster__inner { flex:1; padding:0.55in 0.6in 0.3in; display:flex; flex-direction:column; }
@media (max-width:600px){
  .cy26-page .poster__inner { padding:28px 20px 16px; }
	.cy26-page .poster{width:100%; max-width:100%; aspect-ratio:unset}
	.cy26-page .poster__inner{width:100%; max-width:100%; aspect-ratio:unset}
}
.cy26-page .poster__eyebrow { font-size:15px; font-weight:700 !important; letter-spacing:.24em; text-transform:uppercase; color:#D4A843 !important; }
.cy26-page .poster__head { font-size:46px; font-weight:800 !important; line-height:1.08 !important; letter-spacing:-.015em; margin-top:18px; max-width:12ch; }
.cy26-page .poster__head em { font-style:normal; color:#5FB7E4 !important; }
.cy26-page .poster__big { font-size:96px; font-weight:800 !important; letter-spacing:-.03em; line-height:1 !important; color:#D4A843 !important; margin-top:22px; }
.cy26-page .poster__sub { font-size:17.5px; line-height:1.55 !important; color:#C8D6E4 !important; margin-top:18px; max-width:44ch; }
.cy26-page .poster__sub strong { color:#fff !important; }
.cy26-page .poster__drg { display:flex; gap:18px; align-items:center; margin-top:26px; }
.cy26-page .poster__drg img { display:block; width:1.35in; height:1.35in; border-radius:50%; object-fit:cover; object-position:top; border:3px solid #D4A843; }
.cy26-page .poster__drg .who { margin:0; font-size:14px; line-height:1.5 !important; color:#C8D6E4 !important; max-width:36ch; }
.cy26-page .poster__drg .who b { display:block; color:#fff !important; font-size:16px; margin:15px 0; }
.cy26-page .poster__drg--compact { margin-top:auto; padding-top:20px; }
.cy26-page .poster__drg--compact img { width:1in; height:1in; }
@media (max-width:700px){
  /* display:block on the image rules out the classic inline-image baseline gap (images default to
     inline, reserving descender space below them, unless told otherwise) — belt-and-suspenders
     since flex children are normally auto-blockified anyway, but this has shown up as a gap on a
     real device even with gap:0 set, so ruling out every plausible source explicitly. */
  .cy26-page .poster__drg { flex-direction:column; align-items:center; gap:0; }
  .cy26-page .poster__drg .who { margin-top:0; text-align:center; }
}
.cy26-page .poster__points { list-style:none; margin:20px 0; padding:0; display:grid; gap:10px;position:relative;}
.cy26-page .poster__points li { display:flex; gap:12px; font-size:15.5px; color:#EAF2FB !important; align-items:baseline; padding-left:30px }
.cy26-page .poster__points li::before { content:"✓"; color:#D4A843 !important; font-weight:800 !important;position: absolute;left: 0;}
.cy26-page .poster__points--offer { margin-top:24px; gap:0; }
.cy26-page .poster__points--offer li { display:block; font-size:17px; line-height:1.5 !important; padding:11px 0 11px 30px; border-bottom:1px solid #1B3D63;position:relative}
.cy26-page .poster__points--offer li::before { margin-right:12px; }
.cy26-page .poster__points--offer li:last-child { border-bottom:0; }
.cy26-page .poster__points--offer li strong { color:#fff !important; }
.cy26-page .poster__cta { display:block; margin-top:auto; background:#D4A843; color:#0B1A2E !important; text-align:center; font-weight:800 !important; font-size:20px; padding:16px 20px; border-radius:12px; letter-spacing:.01em; overflow-wrap:anywhere; text-decoration:none; }
.cy26-page .poster__points--offer + .poster__cta, .cy26-page .poster__drg--compact + .poster__cta { margin-top:20px; }
@media (max-width:600px){
  .cy26-page .poster__cta { font-size:16px; padding:12px 16px; }
}
@media (max-width:360px){
  .cy26-page .poster__cta { font-size:13px; padding:12px 16px; }
}
.cy26-page .poster__foot { background:#fff; color:#5A6B80 !important; padding:14px 0.6in 12px; display:flex; align-items:center; justify-content:space-between; gap:16px; }
.cy26-page .poster__foot img { height:20px; width:auto; }
.cy26-page .poster__foot .logo-slot { font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:#8696A8 !important; border:1.5px dashed #C8D2DC; border-radius:8px; padding:8px 18px; white-space:nowrap; }
.cy26-page .poster__foot .fine { font-size:8.5px; max-width:3.4in; line-height:1.45 !important; color:#8696A8 !important; }
@media (max-width:900px){ .cy26-page .poster__head { font-size:6.2vw; max-width:20ch;line-height:1.3em} .cy26-page .poster__big { font-size:11vw; } }
/* .poster__foot is an un-wrapped flex row (logo + fine print + the "Your practice logo" nowrap
   pill) — at narrow poster widths (poster scales down with the viewport per .poster's own
   max-width:100%) those three items don't fit on one line. Stack them at the width where the
   poster itself is already narrow enough for this to matter. */
@media (max-width:500px){
  .cy26-page .poster__foot { flex-direction:column; align-items:center; text-align:center; gap:10px; }
  .cy26-page .poster__foot .fine { max-width:100%; }
.cy26-page .badge{padding:6px 5px!important; font-size:11px !important;}
}

/* Posters are designed as light text on the .poster's dark navy background — but printing/saving
   as PDF with "Background graphics" unchecked (a browser toggle no CSS can force on) drops that
   background to white, leaving light text nearly invisible. print-color-adjust:exact only affects
   whether the browser *tries* to print backgrounds when the user allows it; it can't override the
   user's own checkbox. So: force these to a dark, readable-on-white palette specifically for print,
   accepting that the poster looks less "branded" without its background rather than illegible. */
@media print {
  .cy26-page .poster__eyebrow, .cy26-page .poster__big { color:#B98E2F !important; }
  .cy26-page .poster__head, .cy26-page .poster__sub, .cy26-page .poster__sub strong,
  .cy26-page .poster__points li, .cy26-page .poster__points--offer li, .cy26-page .poster__points--offer li strong,
  .cy26-page .poster__drg .who, .cy26-page .poster__drg .who b,
  .cy26-page .kit-feature h3, .cy26-page .kit-feature p {
    color:#0B1A2E !important;
  }
  .cy26-page .poster__head em { color:#1B3D63 !important; }
  .cy26-page .kit-feature .kf-label { color:#B98E2F !important; }
}

/* ---------- Audience routing strip ---------- */
.audience-strip { background:var(--cy-blue-100); color:var(--ink-2) !important; text-align:center; font-size:13.5px; padding:9px 16px; font-family:var(--font-sans) !important; }
.audience-strip a { color:var(--cy-blue-600) !important; font-weight:600 !important; text-decoration:none; }
.audience-strip a:hover { text-decoration:underline; }
.audience-strip__break { display:none; }
@media (max-width:450px){ .audience-strip__break { display:block; } }

/* ---------- Banner (private pages) ---------- */
.private-banner { background:var(--cy-gold); color:var(--cy-navy) !important; text-align:center; font-size:12.5px; font-weight:600 !important; padding:9px 16px; font-family:var(--font-sans) !important; }

/* ---------- A11y ---------- */
.skip-link { position:absolute; left:-9999px; top:0; background:var(--cy-white); color:var(--ink-1) !important; padding:10px 16px; z-index:100; border-radius:0 0 8px 0; font-family:var(--font-sans) !important; }
.skip-link:focus { left:0; }
.cy26-page :focus-visible { outline:3px solid var(--cy-blue); outline-offset:2px; }
@media (prefers-reduced-motion:reduce){ html { scroll-behavior:auto; } .cy26-page * { transition:none !important; } }

/* ---------- Modal (partner application popup) ---------- */
.cy26-modal {
  position:fixed; inset:0; z-index:1000; display:none; align-items:center; justify-content:center;
  padding:24px; font-family:var(--font-sans) !important;
}
.cy26-modal.open { display:flex; }
.cy26-modal__backdrop { position:absolute; inset:0; background:rgba(11,26,46,.72); }
.cy26-modal__panel {
  position:relative; background:var(--cy-white) !important; color:var(--ink-1) !important; border-radius:var(--radius-xl);
  max-width:600px; width:100%; max-height:88vh; overflow-y:auto; box-shadow:var(--shadow-lg); padding:44px 20px 20px;
}
.cy26-modal__close {
position: absolute;
    top: 10px;
    right: 10px;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    border: 0;
    background: #ed2100 !important;
    color: #ffffff !important;
    font-size: 15px;
    line-height: 0 !important;
    cursor: pointer;
    display: grid;
    place-items: center;
    z-index: 2;
    font-family: var(--font-sans) !important;
    padding: 0 !important;
}
.cy26-modal__close:hover { background:#ed2100 !important;color:#000}
.cy26-modal__body { min-height:200px; }

/* Kajabi partner-application form (injected via document.write, not an iframe — reskinned to
   match brand). Selectors are prefixed with .cy26-modal to guarantee higher specificity than
   Kajabi's own #kajabi-form rules, since their <style> tag is written into the DOM after ours. */
.cy26-modal #kajabi-form { font-family:var(--font-sans) !important; }
.cy26-modal #kajabi-form .kajabi-form__title {
  font-family:var(--font-sans) !important; color:var(--ink-1) !important; font-size:26px !important;
  font-weight:800 !important; text-transform:none !important; letter-spacing:-.01em !important;
  text-align:center !important; line-height:1.2 !important;
}
.cy26-modal #kajabi-form .kajabi-form__subtitle {
  font-family:var(--font-sans) !important; color:var(--ink-3) !important; font-size:15px !important;
  margin-top:8px !important; margin-bottom:28px !important; text-align:center !important;
}
.cy26-modal #kajabi-form .kajabi-form__subtitle p { color:var(--ink-3) !important; font-family:var(--font-sans) !important; margin:0 !important; }
.cy26-modal #kajabi-form .kajabi-form__content { max-width:none !important; }
.cy26-modal #kajabi-form fieldset {
  display:grid !important; grid-template-columns:1fr 1fr !important; gap:14px !important;
  margin:0 !important; padding:0 !important; border:0 !important;
}
@media (max-width:768px) {
  .cy26-modal #kajabi-form fieldset { grid-template-columns:1fr !important; gap:8px !important; }
  /* Tighten vertical rhythm on mobile so Submit lands closer to the first fold —
     7 stacked fields can't fully fit above the fold, but this gets it much closer.
     Scoped to #kajabi-form's own elements only — do not touch the shared
     .cy26-modal__panel class, it's also used by the unrelated mailto-gate modal. */
  .cy26-modal #kajabi-form { padding-top:0 !important; }
  .cy26-modal #kajabi-form .kajabi-form__title { font-size:20px !important; }
  .cy26-modal #kajabi-form .kajabi-form__subtitle { font-size:13px !important; margin-top:4px !important; margin-bottom:14px !important; }
  .cy26-modal #kajabi-form .kajabi-form__form-item input { padding:10px 14px !important; }
}
.cy26-modal #kajabi-form .kajabi-form__form-item { margin-bottom:0 !important; }
.cy26-modal #kajabi-form .kajabi-form__form-item input {
  width:100% !important; font-family:var(--font-sans) !important; font-size:16px !important;
  padding:13px 16px !important; border:1px solid var(--cy-stroke) !important; border-radius:var(--radius) !important;
  background:var(--cy-bg-soft) !important; color:var(--ink-1) !important; box-sizing:border-box !important;
  transition:border-color 180ms, background 180ms !important;
}
.cy26-modal #kajabi-form .kajabi-form__form-item input::placeholder { color:var(--ink-4) !important; opacity:1 !important; }
.cy26-modal #kajabi-form .kajabi-form__form-item input:focus {
  outline:none !important; border-color:var(--cy-blue) !important; background:var(--cy-white) !important;
}
/* Odd number of fields leaves the last one alone on a row with an empty gap next to it —
   stretch it across both columns instead of leaving that gap. */
.cy26-modal #kajabi-form .kajabi-form__form-item:last-of-type { grid-column:1 / -1 !important; }
.cy26-modal #kajabi-form .kajabi-form__btn {
  grid-column:1 / -1 !important; width:100% !important; font-family:var(--font-sans) !important; font-size:15px !important; font-weight:600 !important;
  background:#D4A843 !important; border:1px solid #D4A843 !important; color:#0B1A2E !important;
  padding:14px 28px !important; border-radius:var(--radius) !important; cursor:pointer !important;
  text-transform:none !important; letter-spacing:.04em !important; margin-top:8px !important; transition:color 180ms !important;
}
.cy26-modal #kajabi-form .kajabi-form__btn:hover,
.cy26-modal #kajabi-form .kajabi-form__btn:not(.kajabi-form__btn--disabled):hover {
  color:#FFFFFF !important; background:#D4A843 !important;
}

/* ---------- Atlas Panel: marker cards ---------- */
.cy26-page .marker { background:var(--cy-white); color:var(--ink-1); border:1px solid var(--cy-stroke); border-radius:var(--radius-lg); padding:24px 28px; box-shadow:var(--shadow-card); margin-top:16px; }
.cy26-page .marker__head { display:flex; align-items:baseline; gap:14px; flex-wrap:wrap; }
.cy26-page .marker__head h3 { font-size:17.5px; }
.cy26-page .marker__code { font-size:12px; font-weight:600 !important; color:var(--ink-4); letter-spacing:.04em; }
.cy26-page .marker p { font-size:14.5px; line-height:1.7 !important; color:var(--ink-2); margin-top:8px; }
.cy26-page .marker p b { color:var(--cy-blue-600); font-weight:700 !important; }
.cy26-page .print-footer { display:none; }

/* ---------- Supplements poster: kit feature + ingredient badges ---------- */
.cy26-page .kit-feature { border:2px solid #D4A843; border-radius:14px; padding:18px 22px; margin-top:22px;margin-bottom:22px; background:rgba(212,168,67,.08); }
.cy26-page .kit-feature .kf-label { font-size:11.5px; font-weight:700 !important; letter-spacing:.2em; text-transform:uppercase; color:#D4A843; }
.cy26-page .kit-feature h3 { color:#fff; font-size:21px; margin-top:6px; letter-spacing:-.01em; }
.cy26-page .kit-feature p { color:#C8D6E4; font-size:13.5px; line-height:1.55 !important; margin-top:8px; }
.cy26-page .kf-grid { display:grid; grid-template-columns:1fr 3in; gap:16px; align-items:center; }
@media (max-width:700px){ .cy26-page .kf-grid { grid-template-columns:1fr; } }
.cy26-page .kit-feature .kf-img { background:#fff; border-radius:10px; padding:8px 10px; }
.cy26-page .kit-feature .kf-img img { width:100%; height:auto; display:block; }
.cy26-page .badges { display:flex; gap:10px; flex-wrap:wrap; margin-top:18px;margin-bottom:10px; }
.cy26-page .badge { background:none; border:1.5px solid #D4A843; color:#F8EFD7; border-radius:999px; padding:6px 16px; font-size:12px; font-weight:700 !important; letter-spacing:.1em; text-transform:uppercase; }
/* letter-spacing on the badge adds equal space after every character, including a hyphen — on
   "Non-GMO" that reads as an uneven "N O N - G M O" instead of a clean compound word. Isolating
   the hyphen in its own span and zeroing its tracking fixes just that character. */
.cy26-page .badge__hyphen { letter-spacing:normal; }
.cy26-page .badge-note { font-size:10px; color:#8AA0B7; margin-top:8px; }

/* Print rules for posters and the Atlas Panel handout live inline on each of those
   page templates (not here) — each needs its own @page margin, and @page can't be
   scoped per-class, so a shared rule here would fight between poster (margin:0) and
   handout (14mm margins). See page-cyrene-partner-poster-*.php / -atlas-panel.php. */

/* CAPTCHA gate: a small variant of the existing .cy26-modal system (same overlay,
   same backdrop-click-to-close, same Escape handling), just a narrower panel. */
.cy26-modal__panel.mailto-gate { max-width:300px; padding:0; text-align:center; overflow:hidden; }
.mailto-gate__bar { background:var(--cy-navy-800); color:var(--on-navy-1); font-size:11.5px; font-weight:700; letter-spacing:.05em; text-transform:uppercase; padding:10px 12px; }
.mailto-gate__canvas { display:block; width:100%; height:auto; }
.mailto-gate__row { display:flex; gap:8px; padding:14px 16px; }
/* font-size must stay >=16px — iOS Safari auto-zooms the whole page on focus for any
   input under 16px, which is the "zoomed in, feels unresponsive" bug on mobile. */
.cy26-modal .mailto-gate__input, .mailto-gate__input { flex:1; min-width:0; padding:8px 10px; border-radius:6px; border:1px solid var(--cy-stroke-strong); font-size:16px !important; }
.mailto-gate__go { padding:8px 16px; border-radius:6px; border:0; background:var(--cy-gold); color:var(--cy-navy); font-weight:700; cursor:pointer; font-size:13px; white-space:nowrap; }
.mailto-gate__err { color:var(--danger); font-size:12px; margin:0; padding:0 16px 14px; }