/* AI Systems Now — main site additions (candidate B, 2026-09-15)
   Loaded after the page's base styles. Reuses the live tokens: navy #081322,
   teal #00d4d4 / #087e83, gold #c9a84c, cream #fffdfa, Playfair + Inter. */

/* ---------- Texture: fine grain + gold hairlines (no image assets) ---------- */
.grain { position: relative; }
.grain::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: .16;
  mix-blend-mode: soft-light;
  background-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 .55 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23g)'/%3E%3C/svg%3E");
  background-size: 180px 180px;
  border-radius: inherit;
  z-index: 0;
}
.grain > * { position: relative; z-index: 1; }
.hairline-top::before,
.hairline-bottom::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(201, 168, 76, .62), transparent);
  pointer-events: none;
  z-index: 2;
}
.hairline-top::before { top: 0; }
.hairline-bottom::after { bottom: 0; }

/* ---------- Skip link: first body item, hidden until keyboard focus, high contrast on every page ---------- */
.skip-link { position: fixed; left: 16px; top: -120px; z-index: 200; padding: 12px 18px; border-radius: 999px; background: #081322; color: #fffdfa; font-weight: 800; font-size: .95rem; text-decoration: none; box-shadow: 0 12px 30px rgba(8, 19, 34, .3); transition: none; }
.skip-link:focus, .skip-link:focus-visible { top: 12px; outline: 3px solid #00d4d4; outline-offset: 3px; }
main[id] { scroll-margin-top: 90px; }
main:focus { outline: none; }
/* Narrow zoom (about 213 CSS px = 320 px at 150 %): the inherited chapter grid must shrink instead of overflowing. */
@media (max-width: 480px) {
  .service-chapter-grid { grid-template-columns: minmax(0, 1fr); }
  .service-chapter-grid > * { min-width: 0; }
  .service-chapter-copy h2, .service-chapter-index, .chapter-kicker, .service-chapter-notes b { overflow-wrap: anywhere; }
  .service-chapter .hero-actions .btn, .service-chapter .btn { white-space: normal; text-align: center; min-width: 0; max-width: 100%; }
}
/* Extreme narrow widths only (about 213 CSS px): a single long word in a section heading
   ("Consultation") is wider than the column, so allow it to wrap instead of widening the page. */
@media (max-width: 300px) {
  .section-head h2 { overflow-wrap: anywhere; }
}

/* ---------- Keyboard focus: every interactive control shows the teal ring (Home's inline CSS missed the menu toggle) ---------- */
.nav-inner > a:focus-visible, .nav-toggle:focus-visible, .footer a:focus-visible, .hero-editorial-link:focus-visible, .contact-tile-cta:focus-visible, .response-gap-links a:focus-visible, .stack-link:focus-visible, .motion-toggle:focus-visible, .nav-links a:focus-visible {
  outline: 3px solid #00d4d4;
  outline-offset: 3px;
  border-radius: 8px;
}

/* ---------- Booking control: honestly disabled until the owner supplies the new URL ---------- */
.booking-control:disabled,
.booking-control[disabled],
button.booking-control:disabled,
.nav-links .booking-control:disabled {
  --booking-fg: #0b1627;
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  font: inherit;
  font-weight: 850;
  border-radius: 999px;
  padding: 12px 20px;
  background: linear-gradient(135deg, rgba(201, 168, 76, .18), rgba(201, 168, 76, .08)) !important;
  color: var(--booking-fg) !important;
  border: 1px dashed rgba(201, 168, 76, .85) !important;
  box-shadow: none !important;
  filter: none !important;
  opacity: 1 !important;
  transform: none !important;
  cursor: not-allowed;
}
.booking-control:disabled::before {
  content: "";
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: #c9a84c;
  box-shadow: 0 0 0 3px rgba(201, 168, 76, .18);
  flex: 0 0 auto;
}
.booking-control:disabled:focus-visible { outline: 3px solid #00d4d4 !important; outline-offset: 4px; }
.on-dark .booking-control:disabled,
.booking-control.on-dark:disabled { --booking-fg: #fffdfa; }
.booking-status {
  display: block;
  margin-top: 7px;
  font-size: .68rem;
  font-weight: 800;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: #6e5a22;
  line-height: 1.35;
}
.on-dark .booking-status { color: rgba(255, 253, 250, .74); }
.booking-block { display: inline-grid; justify-items: start; }
.booking-block .booking-status { text-align: left; }
.nav-booking { display: inline-grid; justify-items: center; gap: 0; }
.nav-booking .booking-control:disabled { padding: 9px 16px; font-size: .92rem; }
.nav-booking .booking-status { margin-top: 4px; font-size: .58rem; letter-spacing: .12em; text-align: center; }
@media (max-width: 920px) {
  .nav-links.open .nav-booking { justify-items: start; }
  .nav-links.open .nav-booking .booking-status { text-align: left; }
}

/* ---------- Hero orb stage (decorative, reuses the live inline orb keyframes) ---------- */
.orb-stage { position: relative; display: grid; place-items: center; min-height: 430px; width: 100%; }
.orb-stage .vera-frame { width: 100%; max-width: 480px; }
.orb-static { cursor: default; }
.orb-chips { position: absolute; inset: 0; pointer-events: none; }
.orb-chip {
  position: absolute;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 9px 13px;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, .22);
  background: rgba(8, 19, 34, .55);
  color: #fffdfa;
  font-size: .76rem;
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
  box-shadow: 0 12px 30px rgba(0, 0, 0, .28), inset 0 1px 0 rgba(255, 255, 255, .12);
  backdrop-filter: blur(10px);
  animation: chipFloat 7s ease-in-out infinite;
}
.orb-chip::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: #00d4d4; box-shadow: 0 0 12px rgba(0, 212, 212, .8); }
.orb-chip:nth-child(2)::before { background: #c9a84c; box-shadow: 0 0 12px rgba(201, 168, 76, .8); }
.orb-chip-1 { left: 2%; top: 16%; animation-delay: 0s; }
.orb-chip-2 { right: 0; top: 44%; animation-delay: -2.4s; }
.orb-chip-3 { left: 0; top: 63%; animation-delay: -4.6s; }
@keyframes chipFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-9px); } }
.hero-halo {
  position: absolute;
  left: 50%;
  top: 50%;
  width: min(620px, 96vw);
  height: min(620px, 96vw);
  border-radius: 50%;
  transform: translate(-50%, -50%);
  background: radial-gradient(circle, rgba(0, 212, 212, .16), rgba(201, 168, 76, .1) 46%, transparent 72%);
  filter: blur(22px);
  pointer-events: none;
  will-change: transform;
}
.hero-halo-wrap { position: absolute; inset: 0; pointer-events: none; }
/* Discreet pause / resume for continuous orb, chip and halo motion */
.motion-toggle {
  position: relative;
  z-index: 3;
  margin-top: 14px;
  padding: 7px 12px 7px 10px;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, .26);
  background: rgba(8, 19, 34, .5);
  color: rgba(255, 253, 250, .82);
  font: inherit;
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  backdrop-filter: blur(8px);
  transition: border-color .2s ease, color .2s ease;
}
.motion-toggle::before { content: "❚❚"; font-size: .62rem; letter-spacing: -.1em; color: #c9a84c; }
.motion-toggle[aria-pressed="true"]::before { content: "▶"; }
.motion-toggle:hover { border-color: #00d4d4; color: #fff; }
.motion-toggle:focus-visible { outline: 3px solid #00d4d4; outline-offset: 4px; }
.motion-paused .vera-orb, .motion-paused .vera-orb::before, .motion-paused .vera-orb::after,
.motion-paused .vera-dot, .motion-paused .vera-orbit-ring, .motion-paused .vera-frame::before,
.motion-paused .hero-visual::before, .motion-paused .orb-chip, .motion-paused .hero-halo {
  animation-play-state: paused !important;
}
.motion-paused [data-parallax] { transform: none !important; }
@media (max-width: 560px) {
  .orb-stage { min-height: 360px; }
  .orb-chip { font-size: .66rem; padding: 7px 10px; }
  .orb-chip-1 { left: 0; top: 8%; }
  .orb-chip-2 { right: 0; top: 40%; }
  .orb-chip-3 { left: 0; top: 60%; }
}

/* ---------- Offer stack: sticky / stacking cards (adapted mechanism) ---------- */
.offer-stack { position: relative; display: grid; gap: 26px; --nav-h: 76px; padding-bottom: 6vh; }
.stack-card {
  position: sticky;
  top: calc(var(--nav-h) + 18px + var(--i, 0) * 16px);
  overflow: hidden;
  border-radius: 30px;
  padding: clamp(28px, 4.6vw, 54px);
  min-height: min(520px, 72vh);
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(280px, .8fr);
  gap: clamp(26px, 4vw, 54px);
  align-items: start;
  transform: scale(var(--stack-scale, 1));
  transform-origin: top center;
  transition: transform .12s linear, box-shadow .2s ease;
  will-change: transform;
}
.stack-card::before {
  content: "";
  position: absolute;
  inset: 14px;
  border: 1px solid currentColor;
  opacity: .14;
  border-radius: 20px;
  pointer-events: none;
}
.stack-card::after {
  content: "";
  position: absolute;
  inset: 0;
  background: #081322;
  opacity: var(--stack-dim, 0);
  pointer-events: none;
  transition: opacity .12s linear;
  border-radius: inherit;
  z-index: 3;
}
.stack-card > * { position: relative; z-index: 2; }
.stack-card.is-covered { box-shadow: none; }
/* Keyboard focus inside a card: the card is never dimmed/scaled and is lifted above later cards.
   The lift is driven by .is-focused (keyboard/focus-visible only, set in site.js), not :focus-within, so pointer
   focus left on a summary never lifts an earlier sticky card over the next card's summary. */
.stack-card { z-index: 1; }
.stack-card.is-focused {
  z-index: 6;
  --stack-dim: 0 !important;
  --stack-scale: 1 !important;
  transform: none !important;
  box-shadow: 0 0 0 3px #00d4d4, 0 30px 80px rgba(8, 19, 34, .28);
}
.stack-card.is-focused::after { opacity: 0 !important; }
.stack-navy {
  color: #fffdfa;
  background:
    radial-gradient(720px 360px at 86% 10%, rgba(0, 212, 212, .18), transparent 66%),
    radial-gradient(560px 320px at 10% 90%, rgba(201, 168, 76, .16), transparent 70%),
    linear-gradient(145deg, #081322, #0d2038 62%, #081322);
  box-shadow: 0 30px 80px rgba(8, 19, 34, .22);
}
.stack-cream {
  color: #0b1627;
  background:
    radial-gradient(640px 320px at 90% 0%, rgba(0, 212, 212, .12), transparent 70%),
    radial-gradient(520px 300px at 0% 100%, rgba(201, 168, 76, .2), transparent 70%),
    linear-gradient(135deg, #fffdfa, #f7f1df 58%, #fffdfa);
  border: 1px solid rgba(201, 168, 76, .34);
  box-shadow: 0 30px 80px rgba(8, 19, 34, .14);
}
.stack-teal {
  color: #fffdfa;
  background:
    radial-gradient(700px 340px at 12% 8%, rgba(0, 212, 212, .22), transparent 66%),
    radial-gradient(520px 300px at 92% 100%, rgba(201, 168, 76, .14), transparent 70%),
    linear-gradient(150deg, #06343a, #081322 64%, #0b1f3a);
  box-shadow: 0 30px 80px rgba(8, 19, 34, .22);
}
.stack-index {
  font-family: "Playfair Display", Georgia, serif;
  font-size: clamp(2.6rem, 5vw, 4.4rem);
  line-height: .9;
  color: #c9a84c;
  letter-spacing: -.04em;
  margin-bottom: 14px;
}
.stack-kicker {
  font-size: .72rem;
  font-weight: 900;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: #00d4d4;
  margin-bottom: 12px;
}
.stack-cream .stack-kicker { color: #087e83; }
.stack-card h3 {
  font-size: clamp(1.9rem, 3.6vw, 3.1rem);
  line-height: 1.04;
  max-width: 620px;
}
.stack-card .stack-body { margin-top: 16px; font-size: clamp(1.02rem, 1.4vw, 1.14rem); line-height: 1.68; max-width: 600px; }
.stack-navy .stack-body, .stack-teal .stack-body { color: rgba(255, 253, 250, .78); }
.stack-cream .stack-body { color: #33465f; }
.stack-actions { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 14px; margin-top: 26px; }
.stack-aside {
  align-self: stretch;
  border-radius: 22px;
  padding: clamp(20px, 2.6vw, 28px);
  border: 1px solid rgba(255, 255, 255, .14);
  background: rgba(255, 255, 255, .055);
  backdrop-filter: blur(8px);
}
.stack-cream .stack-aside { border-color: rgba(8, 126, 131, .22); background: rgba(255, 255, 255, .72); }
.stack-aside span {
  display: block;
  font-size: .7rem;
  font-weight: 900;
  letter-spacing: .15em;
  text-transform: uppercase;
  color: #c9a84c;
  margin-bottom: 14px;
}
.stack-aside ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.stack-aside li {
  position: relative;
  padding-left: 22px;
  line-height: 1.55;
  font-weight: 650;
  font-size: .98rem;
}
.stack-aside li::before {
  content: "";
  position: absolute;
  left: 0;
  top: .62em;
  width: 10px;
  height: 1px;
  background: #c9a84c;
}
.stack-navy .stack-aside li, .stack-teal .stack-aside li { color: rgba(255, 253, 250, .86); }
.stack-cream .stack-aside li { color: #26384f; }
.stack-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 48px;
  padding: 10px 16px;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, .26);
  color: inherit;
  font-weight: 800;
  text-decoration: none;
  transition: transform .2s ease, border-color .2s ease, color .2s ease;
}
.stack-link::after { content: "→"; color: #c9a84c; transition: transform .2s ease; }
.stack-link:hover { transform: translateY(-2px); border-color: #00d4d4; color: #00d4d4; }
.stack-link:hover::after { transform: translateX(3px); }
.stack-link:focus-visible { outline: 3px solid #00d4d4; outline-offset: 4px; }
.stack-cream .stack-link { border-color: rgba(8, 19, 34, .2); color: #0b1627; }
.stack-cream .stack-link:hover { border-color: #087e83; color: #06474b; }
@media (max-width: 920px) {
  .offer-stack { --nav-h: 70px; gap: 20px; }
  .stack-card { grid-template-columns: 1fr; min-height: 0; top: calc(var(--nav-h) + 12px + var(--i, 0) * 12px); }
}
@media (max-width: 560px) {
  .stack-card { border-radius: 22px; padding: 24px 20px; }
  .stack-card::before { inset: 9px; border-radius: 15px; }
  .stack-actions .btn, .stack-actions .booking-block, .stack-actions .booking-control, .stack-link { width: 100%; justify-content: center; }
  .stack-actions .booking-block { justify-items: stretch; }
  .stack-actions .booking-block .booking-status { text-align: center; }
}

/* ---------- Consultation & Training page additions ---------- */
.consult-card-feature .booking-block { margin-top: 8px; }
.session-steps { list-style: none; margin: 18px 0 0; padding: 0; display: grid; gap: 10px; }
.session-steps li { display: grid; grid-template-columns: 74px minmax(0, 1fr); gap: 14px; align-items: start; padding: 12px 0; border-top: 1px solid rgba(8, 19, 34, .09); }
.session-steps li span { font-size: .72rem; font-weight: 900; letter-spacing: .14em; text-transform: uppercase; color: #087e83; padding-top: 3px; }
.session-steps li p { color: #33465f; line-height: 1.55; }
.training-steps { display: grid; gap: 14px; }
.training-steps div { padding: 14px 16px 14px 20px; border-left: 3px solid rgba(201, 168, 76, .8); border-radius: 16px; background: rgba(255, 255, 255, .06); }
.training-steps b { display: block; color: #c9a84c; font-size: .72rem; letter-spacing: .14em; text-transform: uppercase; margin-bottom: 4px; }
.training-steps p { margin: 0 !important; color: rgba(255, 255, 255, .78) !important; font-size: .98rem !important; }
.hero-actions .booking-block { display: inline-grid; }
.consultation-hero .booking-status, .consult-card .booking-status { color: #6e5a22; }
.form-review-note { color: #5d6c81; font-size: .88rem; line-height: 1.5; }
@media (max-width: 640px) {
  .hero-actions .booking-block, .hero-actions .booking-control { width: 100%; }
  .hero-actions .booking-block .booking-status { text-align: center; }
  .session-steps li { grid-template-columns: 1fr; gap: 4px; }
}

/* ---------- Footer: navy footer everywhere, readable links ---------- */
.footer { background: #081322; color: #fff; border-top: 0; padding: 0; }
.footer-inner { display: flex; align-items: flex-start; justify-content: space-between; gap: 28px; padding: 40px 24px 36px; }
.footer-logo { height: 38px; width: auto; margin-bottom: 10px; }
.footer small { display: block; color: rgba(255, 255, 255, .66); max-width: 440px; margin-top: 8px; line-height: 1.5; }
.footer a { color: #fff; }
.footer-links { display: flex; gap: 18px; flex-wrap: wrap; margin-bottom: 8px; color: rgba(255, 255, 255, .84); font-size: .94rem; font-weight: 650; }
.footer-links a:hover, .footer a:hover { color: #00d4d4; }
.footer-links a:focus-visible, .footer a:focus-visible { outline: 3px solid #00d4d4; outline-offset: 3px; border-radius: 6px; }
.footer-legacy { display: flex; gap: 14px; flex-wrap: wrap; margin-top: 10px; font-size: .8rem; color: rgba(255, 255, 255, .5); }
.footer-legacy a { color: rgba(255, 255, 255, .62); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }
.footer-legacy a:hover { color: #00d4d4; }
@media (max-width: 920px) { .footer-inner { flex-direction: column; } }

/* ---------- Completion 2026-09-16: Founder & Team, Resources, Privacy pages ---------- */
/* Founder card on the Founder & Team page: the same rules Home carries inline, scoped to .about-page. */
.about-page .founder { display: grid; grid-template-columns: minmax(260px, 360px) minmax(0, 1fr); gap: clamp(28px, 5vw, 58px); align-items: center; background: linear-gradient(135deg, #fffdfa, #f7f4ea 58%, #fff); border: 1px solid rgba(8, 19, 34, .1); border-radius: 24px; padding: clamp(24px, 4vw, 44px); box-shadow: 0 18px 52px rgba(8, 19, 34, .06); }
.about-page .founder-photo { position: relative; isolation: isolate; border-radius: 20px; overflow: hidden; padding: 0; align-self: start; max-width: 360px; border: 1px solid rgba(8, 126, 131, .2); background: linear-gradient(145deg, #fffdfa, #fff 54%, #eefafa); box-shadow: 0 22px 54px rgba(8, 19, 34, .13), 0 0 0 1px rgba(201, 168, 76, .18), inset 0 1px 0 rgba(255, 255, 255, .86); }
.about-page .founder-photo::before { content: ""; position: absolute; inset: 10px; border: 1px solid rgba(201, 168, 76, .42); border-radius: 16px; pointer-events: none; z-index: 1; }
.about-page .founder-photo img { position: relative; z-index: 0; width: 100%; height: auto; aspect-ratio: 3/4; object-fit: cover; object-position: center center; border-radius: 20px; box-shadow: inset 0 0 0 1px rgba(8, 19, 34, .08); }
.about-page .founder-copy { border-left: 1px solid rgba(8, 19, 34, .12); padding-left: clamp(26px, 4vw, 48px); }
.about-page .founder-copy h2 { font-size: clamp(2rem, 4vw, 3.4rem); margin-bottom: 18px; }
.about-page .founder-copy p { color: #35475f; font-size: 1.05rem; max-width: 680px; line-height: 1.7; }
.about-page .founder-copy p + p { margin-top: 16px; }
.about-page .founder-quote { margin: 24px 0 0; padding: 18px 20px; border-left: 3px solid #c9a84c; border-radius: 0 18px 18px 0; background: rgba(255, 255, 255, .62); box-shadow: 0 14px 34px rgba(8, 19, 34, .055); }
.about-page .founder-quote p { color: #162842; font-size: clamp(1.08rem, 1.45vw, 1.18rem); font-weight: 650; line-height: 1.66; letter-spacing: -.006em; }
.about-page .founder-signature { font-family: "Brush Script MT", "Segoe Script", "Snell Roundhand", "Apple Chancery", cursive; color: #10213a !important; font-size: clamp(1.55rem, 3vw, 2.25rem) !important; line-height: 1.2 !important; margin-top: 14px; letter-spacing: .01em; }
@media (max-width: 920px) { .about-page .founder { grid-template-columns: 1fr; } .about-page .founder-photo { max-width: 420px; justify-self: start; } .about-page .founder-copy { border-left: 0; border-top: 1px solid rgba(8, 19, 34, .12); padding-left: 0; padding-top: 28px; } }
@media (max-width: 640px) { .about-page .founder { border-radius: 18px; padding: 20px; } .about-page .founder-copy { padding-top: 24px; } }
@media (max-width: 560px) { .about-page .founder-photo { border-radius: 18px; } .about-page .founder-photo::before { inset: 8px; border-radius: 14px; } }
.founder-more { margin-top: 22px; }
.founder-link { border-color: rgba(8, 19, 34, .2); color: #0b1627; }
.founder-link:hover { border-color: #087e83; color: #06474b; }
.commitments { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.commitments .contact-tile { min-height: 0; background: #fff; }
.commitments-note { margin-top: 22px; font-size: .95rem; }
.resource-disclaimer { margin-top: 18px; font-size: .88rem; color: #5d6c81 !important; border-left: 3px solid #c9a84c; padding-left: 14px; max-width: 560px !important; }
.resource-toc { position: relative; display: grid; gap: 4px; border: 1px solid rgba(8, 19, 34, .1); border-radius: 24px; padding: 24px; background: linear-gradient(145deg, #081322, #0d2038 62%, #081322); color: #fff; box-shadow: 0 24px 70px rgba(8, 19, 34, .12); }
.resource-toc > span { font-size: .7rem; font-weight: 900; letter-spacing: .15em; text-transform: uppercase; color: #c9a84c; margin-bottom: 10px; }
.resource-toc a { display: grid; grid-template-columns: 34px minmax(0, 1fr); gap: 10px; align-items: center; padding: 12px 6px; border-top: 1px solid rgba(255, 255, 255, .12); color: #fff; font-weight: 700; font-size: .96rem; line-height: 1.3; }
.resource-toc a b { font-family: "Playfair Display", Georgia, serif; color: #c9a84c; font-size: 1.1rem; }
.resource-toc a:hover span { color: #00d4d4; }
.resource-toc a:focus-visible { outline: 3px solid #00d4d4; outline-offset: 2px; border-radius: 8px; }
.resource-sections .service-chapter-copy h3 { font-family: Inter, sans-serif; font-size: .74rem; font-weight: 900; letter-spacing: .14em; text-transform: uppercase; margin: 28px 0 12px; color: #c9a84c; }
.resource-sections .cream .service-chapter-copy h3 { color: #087e83; }
.guide-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.guide-list li { position: relative; padding-left: 26px; font-size: 1rem; line-height: 1.6; }
.guide-list li::before { content: ""; position: absolute; left: 0; top: .72em; width: 12px; height: 1px; background: #c9a84c; }
.guide-list.check li::before { width: 10px; height: 10px; top: .5em; border-radius: 3px; background: transparent; border: 1.5px solid #c9a84c; }
.dark .guide-list li { color: rgba(255, 255, 255, .8); }
.cream .guide-list li { color: #33465f; }
.guide-note { font-size: .88rem !important; line-height: 1.65 !important; border-top: 1px solid rgba(255, 255, 255, .16); padding-top: 18px; margin-top: 26px !important; color: rgba(255, 255, 255, .7) !important; max-width: 640px; }
.guide-steps { list-style: none; padding: 0; margin: 0; }
.guide-steps li { display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 16px; padding: 16px 0; border-top: 1px solid rgba(8, 19, 34, .1); }
.guide-steps li > span { font-size: .72rem; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; color: #087e83; padding-top: 4px; }
.guide-steps h4 { font-family: "Playfair Display", Georgia, serif; font-size: 1.2rem; line-height: 1.25; margin: 0; }
.guide-steps li p { font-size: .96rem; line-height: 1.6; margin-top: 6px; color: #33465f; }
.resource-sections .service-chapter-notes a { color: inherit; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; }
.resource-sections .service-chapter-notes a:hover { color: #00d4d4; }
.resource-sections .cream .service-chapter-notes a:hover { color: #087e83; }
.legal-meta { margin-top: 16px !important; font-size: .95rem !important; }
.legal-meta a, .legal-wrap a { color: #06474b; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; }
.legal-section { padding: 60px 0; }
.legal-wrap { max-width: 780px; }
.legal-wrap h2 { font-size: clamp(1.9rem, 3.4vw, 2.8rem); margin-bottom: 16px; }
.legal-wrap h3 { font-size: 1.4rem; line-height: 1.25; margin: 32px 0 10px; }
.legal-wrap h3:first-of-type { margin-top: 0; }
.legal-wrap p, .legal-wrap li { color: #35475f; font-size: 1.02rem; line-height: 1.7; }
.legal-wrap ul { margin: 10px 0 0; padding-left: 22px; }
.legal-wrap li + li { margin-top: 6px; }
@media (max-width: 920px) { .commitments { grid-template-columns: 1fr; } .compliance-hero-grid { grid-template-columns: 1fr; } }
@media (max-width: 640px) { .guide-steps li { grid-template-columns: 1fr; gap: 4px; } .legal-section { padding: 44px 0; } }

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
  .orb-chip, .hero-halo { animation: none !important; transform: none !important; }
  .stack-card { transform: none !important; transition: none !important; }
  .stack-card::after { transition: none !important; }
  .stack-link, .stack-link::after { transition: none !important; }
  .stack-link:hover { transform: none; }
}

/* ---------- Owner update 2026-09-16: long chapter labels, topic controls, offer details, footer motion ---------- */
/* Long text labels in the chapter index column ("02 · Individual or team", "Other services") were set at the
   numeral size (clamp 3rem–5.8rem) inside an 88px column and overlapped the copy column. Give them label
   typography and a wider first column instead of hiding overflow. */
.service-chapter-grid > * { min-width: 0; }
.service-chapter-index.chapter-label {
  font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: .8rem;
  line-height: 1.35;
  letter-spacing: .14em;
  text-transform: uppercase;
  font-weight: 900;
  color: #c9a84c;
  opacity: 1;
  white-space: normal;
  overflow-wrap: normal;
  padding-top: 8px;
}
@media (min-width: 921px) {
  .service-chapter-grid.has-chapter-label { grid-template-columns: 150px minmax(0, 1fr) minmax(280px, .42fr); }
}
@media (max-width: 920px) {
  .service-chapter-index.chapter-label { padding-top: 0; margin-bottom: 4px; }
}

/* Topic controls: the three hero chips are real buttons that open the service-information panel. */
.orb-chip { pointer-events: auto; font: inherit; font-size: .76rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; cursor: pointer; transition: border-color .2s ease, background-color .2s ease; }
.orb-chip:hover, .orb-chip[aria-expanded="true"] { border-color: #00d4d4; background: rgba(8, 19, 34, .78); }
.orb-chip:focus-visible { outline: 3px solid #00d4d4; outline-offset: 4px; }
.orb-chip[aria-expanded="true"]::before { background: #fff; box-shadow: 0 0 12px rgba(255, 255, 255, .9); }
.topic-panel {
  grid-column: 1 / -1;
  position: relative;
  z-index: 2;
  max-width: 980px;
  margin-top: 6px;
  padding: clamp(22px, 3vw, 32px);
  border-radius: 22px;
  border: 1px solid rgba(255, 253, 250, .2);
  background: rgba(8, 19, 34, .72);
  backdrop-filter: blur(12px);
  color: #fffdfa;
  box-shadow: 0 24px 70px rgba(0, 0, 0, .28);
}
.topic-panel[hidden] { display: none; }
.topic-panel:focus { outline: none; }
.topic-panel:focus-visible { outline: 3px solid #00d4d4; outline-offset: 4px; }
.topic-panel-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 14px; }
.topic-panel-kicker { margin: 0; font-size: .7rem; font-weight: 900; letter-spacing: .15em; text-transform: uppercase; color: #c9a84c; }
.topic-panel-close { font: inherit; font-size: .82rem; font-weight: 800; padding: 8px 14px; border-radius: 999px; border: 1px solid rgba(255, 253, 250, .3); background: transparent; color: #fffdfa; cursor: pointer; }
.topic-panel-close:hover { border-color: #00d4d4; color: #00d4d4; }
.topic-panel-close:focus-visible { outline: 3px solid #00d4d4; outline-offset: 3px; }
.topic-panel-title { font-size: clamp(1.5rem, 2.6vw, 2.2rem); color: #fff; }
.topic-panel-welcome { margin-top: 12px; color: rgba(255, 253, 250, .84); font-size: 1.02rem; line-height: 1.65; max-width: 720px; }
.topic-panel-links { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 18px; }
.topic-panel-links a { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 9px 15px; border-radius: 999px; border: 1px solid rgba(255, 253, 250, .3); color: #fffdfa; font-weight: 800; }
.topic-panel-links a::after { content: "→"; color: #c9a84c; }
.topic-panel-links a:hover { border-color: #00d4d4; color: #00d4d4; }
.topic-panel-links a:focus-visible { outline: 3px solid #00d4d4; outline-offset: 3px; }
.topic-panel-note { margin-top: 16px; color: rgba(255, 253, 250, .62); font-size: .86rem; line-height: 1.5; max-width: 640px; }
@media (max-width: 920px) { .topic-panel { order: 4; } }

/* Offer stack details: semantic disclosure inside each card. Native details/summary handles Enter, Space,
   mouse and touch. While any card is expanded the stack drops to normal flow so nothing is covered. */
.stack-details > summary { list-style: none; cursor: pointer; display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.stack-details > summary::-webkit-details-marker { display: none; }
.stack-details > summary > span { margin-bottom: 0; }
.stack-details > summary::after { content: "+"; font-family: Inter, sans-serif; font-size: 1.15rem; font-weight: 700; line-height: 1; color: #c9a84c; width: 28px; height: 28px; border-radius: 50%; border: 1px solid rgba(201, 168, 76, .5); display: inline-grid; place-items: center; flex: 0 0 auto; }
.stack-details[open] > summary::after { content: "–"; }
.stack-details > summary:hover::after { border-color: #00d4d4; color: #00d4d4; }
.stack-details > summary:focus-visible { outline: 3px solid #00d4d4; outline-offset: 4px; border-radius: 10px; }
.stack-details[open] > summary { margin-bottom: 14px; }
.stack-details > ul { display: grid; }
/* Visual depth pass 2026-09-16: an open disclosure no longer forces the whole stack to normal flow. The measured
   content-fit check below (.needs-flow, set by site.js from the real card height) is the only authority. */
@media (max-height: 720px) { .stack-card { position: static; transform: none !important; min-height: 0; } .stack-card::after { opacity: 0 !important; } }
/* Content-fit fallback (set by site.js): a card taller than the space beneath its sticky offset, e.g. the narrow
   213 CSS px zoomed layout, cannot reveal its summary while pinned because later cards cover it. The stack uses
   normal flow instead. min-height is left alone so the measured height is the same in both states (no flip-flop). */
.offer-stack.needs-flow .stack-card { position: static; transform: none !important; --stack-dim: 0 !important; }
.offer-stack.needs-flow .stack-card::after { opacity: 0 !important; }

/* Discreet motion preference in the footer instead of the hero. */
.footer-motion { margin: 14px 0 0; }
.footer .motion-toggle { position: static; margin-top: 0; z-index: auto; padding: 6px 11px 6px 9px; font-size: .66rem; border-color: rgba(255, 255, 255, .22); background: rgba(255, 255, 255, .04); color: rgba(255, 255, 255, .7); backdrop-filter: none; }
.footer .motion-toggle:hover { color: #fff; }
@media (prefers-reduced-motion: reduce) { .orb-chip, .topic-panel-close, .topic-panel-links a { transition: none !important; } }

/* ---------- Owner editorial pass 2026-09-16 (afternoon): finite motion, topic cards, clear disclosures, Resources ---------- */
/* Decorative motion finishes within five seconds; no on-page pause control. Selectors match the inline hero rules so these
   later declarations win. Stored user opt-out (.motion-paused) and prefers-reduced-motion still apply. */
.vera-orb { animation: veraHeartbeat 4.8s ease-in-out 1; }
.vera-orb::before, .hero-visual::before, .vera-frame::before { animation: outerOrbPulse 4.5s ease-in-out 1; }
.vera-orb::after { animation: innerTealRing 4.8s ease-in-out 1; }
.vera-dot { animation: centerPulse 3.6s ease-in-out 1; }
.vera-orbit-ring { animation: goldOrbit 4.8s ease-in-out 1; } /* superseded by the visual depth pass block at the end of this file */
.orb-chip { animation: chipFloat 4.4s ease-in-out 1; }
.orb-chip-1 { animation-delay: 0s; } .orb-chip-2 { animation-delay: .2s; } .orb-chip-3 { animation-delay: .4s; }
/* Three hero topic cards: the whole header is the control (native details/summary handles Enter, Space, pointer, touch). */
.topic-cards { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin-top: 10px; max-width: 1040px; position: relative; z-index: 1; }
.topic-card { border: 1px solid rgba(255, 253, 250, .2); border-radius: 20px; background: rgba(8, 19, 34, .55); backdrop-filter: blur(10px); box-shadow: 0 16px 40px rgba(0, 0, 0, .22), inset 0 1px 0 rgba(255, 255, 255, .1); color: #fffdfa; transition: border-color .2s ease, background-color .2s ease, transform .2s ease; }
.topic-card:hover, .topic-card[open] { border-color: rgba(0, 212, 212, .7); background: rgba(8, 19, 34, .78); }
.topic-card:hover { transform: translateY(-2px); }
.topic-card-head { list-style: none; cursor: pointer; display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; min-height: 96px; padding: 20px 20px 18px; border-radius: 20px; }
.topic-card-head::-webkit-details-marker { display: none; }
.topic-card-head:focus { outline: none; }
.topic-card-head:focus-visible { outline: 3px solid #00d4d4; outline-offset: 3px; }
.topic-card-text { display: block; min-width: 0; }
.topic-card-text strong { display: block; color: #fff; font-size: 1rem; line-height: 1.3; }
.topic-card-text span { display: block; color: rgba(255, 255, 255, .66); font-size: .88rem; line-height: 1.45; margin-top: 5px; }
.topic-card-cue { display: inline-flex; align-items: center; gap: 8px; flex: 0 0 auto; padding-top: 2px; color: #e2c06a; font-size: .74rem; font-weight: 850; letter-spacing: .1em; text-transform: uppercase; white-space: nowrap; }
.topic-card-cue-text::before { content: "View details"; }
.topic-card[open] .topic-card-cue-text::before { content: "Hide"; }
.topic-card-chevron { width: 10px; height: 10px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg); transition: transform .2s ease; margin-top: -4px; }
.topic-card[open] .topic-card-chevron { transform: rotate(-135deg); margin-top: 4px; }
.topic-card-head:hover .topic-card-cue { color: #00d4d4; }
.topic-card-body { padding: 0 20px 20px; }
.topic-card-body p { color: rgba(255, 253, 250, .84); font-size: .96rem; line-height: 1.6; }
.topic-card-links { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 14px; }
.topic-card-links a { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 8px 14px; border-radius: 999px; border: 1px solid rgba(255, 253, 250, .3); color: #fffdfa; font-weight: 800; font-size: .92rem; }
.topic-card-links a::after { content: "→"; color: #c9a84c; }
.topic-card-links a:hover { border-color: #00d4d4; color: #00d4d4; }
.topic-card-links a:focus-visible { outline: 3px solid #00d4d4; outline-offset: 3px; }
@media (max-width: 920px) { .topic-cards { grid-template-columns: 1fr; order: 3; } .topic-card-head { min-height: 0; } }
@media (max-width: 560px) { .topic-card-head { padding: 16px; gap: 10px; } .topic-card-cue-text::before { content: "Details"; } .topic-card-body { padding: 0 16px 16px; } .topic-card-links a { width: 100%; justify-content: center; } }
/* Offer disclosures: the full header is the visible control, with text plus chevron instead of a plus/minus mark. */
.stack-details { padding: 0; overflow: hidden; }
.stack-details > summary { padding: clamp(18px, 2.4vw, 24px) clamp(20px, 2.6vw, 28px); margin: 0; border-radius: 22px; min-height: 64px; transition: background-color .2s ease; }
.stack-details > summary::after { content: none; }
.stack-details > summary:hover { background: rgba(255, 255, 255, .06); }
.stack-cream .stack-details > summary:hover { background: rgba(8, 126, 131, .06); }
.stack-details > summary:focus-visible { outline-offset: -3px; }
.stack-details[open] > summary { margin-bottom: 0; border-bottom: 1px solid rgba(255, 255, 255, .14); border-radius: 22px 22px 0 0; }
.stack-cream .stack-details[open] > summary { border-bottom-color: rgba(8, 126, 131, .22); }
.stack-details > summary > span:first-child { font-size: .8rem; letter-spacing: .14em; }
.stack-details-cue { display: inline-flex !important; align-items: center; gap: 8px; margin: 0 !important; font-size: .74rem !important; letter-spacing: .1em !important; color: #e2c06a !important; white-space: nowrap; }
.stack-cream .stack-details-cue { color: #087e83 !important; }
.stack-details-cue-text::before { content: "View details"; }
.stack-details[open] .stack-details-cue-text::before { content: "Hide details"; }
.stack-details-chevron { width: 9px; height: 9px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg); margin-top: -4px; transition: transform .2s ease; }
.stack-details[open] .stack-details-chevron { transform: rotate(-135deg); margin-top: 4px; }
.stack-details > summary:hover .stack-details-cue { color: #00d4d4 !important; }
.stack-details > ul { padding: 18px clamp(20px, 2.6vw, 28px) clamp(20px, 2.6vw, 28px); }
@media (max-width: 560px) { .stack-details-cue-text::before { content: "Details"; } .stack-details[open] .stack-details-cue-text::before { content: "Hide"; } }
/* Managed-services transition: private-draft control, semantically disabled until the landing URL is supplied. */
.link-placeholder, .link-placeholder:hover { cursor: not-allowed; opacity: .62; transform: none; box-shadow: none; }
.response-gap-links .link-placeholder { min-height: 48px; padding: 10px 22px; font: inherit; font-weight: 800; }
/* Resources: featured T² Now card first, then three curated reading cards. */
.resources-hero-copy { max-width: 820px; }
.featured-app { padding-top: 24px; }
.featured-app-card { position: relative; display: grid; grid-template-columns: minmax(0, .92fr) minmax(300px, .78fr); gap: clamp(26px, 4vw, 52px); align-items: center; border-radius: 30px; padding: clamp(28px, 4.5vw, 54px); color: #fffdfa; background: radial-gradient(720px 360px at 86% 10%, rgba(0, 212, 212, .2), transparent 66%), radial-gradient(560px 320px at 10% 92%, rgba(201, 168, 76, .16), transparent 70%), linear-gradient(145deg, #081322, #0d2038 62%, #081322); box-shadow: 0 30px 80px rgba(8, 19, 34, .22); overflow: hidden; }
.featured-app-card .eyebrow { color: #c9a84c; }
.featured-app-brand { display: inline-flex; align-items: center; gap: 10px; font-family: "Playfair Display", Georgia, serif; font-weight: 700; font-size: 1.35rem; color: #fff; margin-bottom: 14px; }
.featured-app-mark { display: inline-grid; place-items: center; width: 40px; height: 40px; border-radius: 12px; background: #0b1627; color: #00d4d4; border: 1px solid rgba(0, 212, 212, .5); font-size: 1rem; }
.featured-app-card h2 { font-size: clamp(2rem, 4.2vw, 3.4rem); line-height: 1.06; max-width: 620px; }
.featured-app-lede { margin-top: 18px; color: rgba(255, 253, 250, .82); font-size: clamp(1.02rem, 1.4vw, 1.14rem); line-height: 1.68; max-width: 600px; }
.featured-app-points { list-style: none; margin: 20px 0 0; padding: 0; display: grid; gap: 10px; }
.featured-app-points li { position: relative; padding-left: 22px; color: rgba(255, 253, 250, .86); font-weight: 650; line-height: 1.5; }
.featured-app-points li::before { content: ""; position: absolute; left: 0; top: .66em; width: 10px; height: 1px; background: #c9a84c; }
.featured-app-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; margin-top: 28px; }
.featured-app-cta { font-size: 1.02rem; padding: 15px 26px; }
.featured-app-cta::after { content: "↗"; margin-left: 8px; }
.featured-app-meta { color: rgba(255, 253, 250, .62); font-size: .88rem; }
.featured-app-preview { margin: 0; border-radius: 20px; overflow: hidden; border: 1px solid rgba(255, 253, 250, .22); background: #fbf8f1; box-shadow: 0 24px 60px rgba(0, 0, 0, .3); }
.featured-app-preview img { width: 100%; height: auto; display: block; }
.featured-app-preview figcaption { padding: 10px 14px; font-size: .78rem; color: #43536a; background: #fffdfa; border-top: 1px solid rgba(8, 19, 34, .08); }
.curated-reading { padding-top: 40px; }
.resource-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.resource-card { display: flex; flex-direction: column; gap: 10px; min-height: 240px; padding: 26px 24px; border-radius: 22px; border: 1px solid rgba(8, 19, 34, .12); background: linear-gradient(135deg, #fffdfa, #f7f4ea 58%, #fff); box-shadow: 0 18px 52px rgba(8, 19, 34, .06); color: #0b1627; text-decoration: none; transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease; }
.resource-card:hover { transform: translateY(-3px); border-color: rgba(8, 126, 131, .5); box-shadow: 0 24px 60px rgba(8, 19, 34, .1); }
.resource-card:focus-visible { outline: 3px solid #00d4d4; outline-offset: 4px; }
.resource-card-source { font-size: .7rem; font-weight: 900; letter-spacing: .14em; text-transform: uppercase; color: #087e83; }
.resource-card-title { font-family: "Playfair Display", Georgia, serif; font-size: 1.45rem; line-height: 1.2; color: #10213a; }
.resource-card-desc { color: #35475f; font-size: .98rem; line-height: 1.6; }
.resource-card-cue { margin-top: auto; padding-top: 10px; color: #06474b; font-weight: 850; }
.resource-card-cue::after { content: " ↗"; color: #c9a84c; }
/* Resources cleanup 2026-09-17: the hero subtitle carries the T² Now emphasis with existing type only; the reading
   section keeps a single "Curated reading" label (as the accessible heading) above the three cards. */
.resources-hero-lede { font-family: "Playfair Display", Georgia, serif; font-size: clamp(1.28rem, 2.1vw, 1.7rem); line-height: 1.42; letter-spacing: -.005em; color: rgba(255, 253, 250, .9) !important; max-width: 640px; margin-top: 26px; }
.resources-hero-brand { font-style: normal; font-weight: 700; color: #f3dfa2; padding-bottom: 2px; border-bottom: 2px solid rgba(201, 168, 76, .55); }
.resources-hero-name { color: #fff; font-weight: 600; white-space: nowrap; }
.section-head-compact { margin-bottom: 22px; }
.section-head h2.curated-reading-label { font-family: Inter, sans-serif; font-size: .78rem; font-weight: 850; letter-spacing: .18em; text-transform: uppercase; color: #087e83; margin: 0; line-height: 1.3; padding-bottom: 12px; border-bottom: 1px solid rgba(8, 19, 34, .1); }
.curated-note { margin-top: 26px; font-size: .95rem; }
.curated-note a { color: #06474b; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; font-weight: 700; }
@media (max-width: 920px) { .featured-app-card { grid-template-columns: 1fr; } .resource-cards { grid-template-columns: 1fr; } .resource-card { min-height: 0; } }
@media (max-width: 560px) { .featured-app-card { border-radius: 22px; padding: 24px 18px; } .featured-app-actions .btn { width: 100%; } }
@media (prefers-reduced-motion: reduce) { .topic-card, .topic-card-chevron, .stack-details > summary, .stack-details-chevron, .resource-card { transition: none !important; } .topic-card:hover, .resource-card:hover { transform: none; } }

/* ---------- Visual depth pass 2026-09-16 (evening): continuous orbit, stack depth, nav glass, bounded parallax ---------- */
/* 1. Decorative orbital ring + dot keep circling (slow, linear). Everything else stays finite. Paused when the hero is
      offscreen (.orb-offscreen, set by site.js), by the stored opt-out (.motion-paused) and by prefers-reduced-motion. */
.vera-orbit-ring { animation: goldOrbit 14s linear infinite; border-color: rgba(201, 168, 76, .46); box-shadow: 0 0 22px rgba(201, 168, 76, .14); }
.vera-orbit-ring::after { box-shadow: 0 0 12px rgba(201, 168, 76, .7), 0 0 0 3px rgba(201, 168, 76, .12); }
.orb-offscreen .vera-orbit-ring { animation-play-state: paused; }
.orb-stage { perspective: 1000px; }
.orb-stage .vera-frame { transform-style: preserve-3d; will-change: transform; }

/* 2. Stack depth: gold top edge, a shadow cast upward onto the card beneath, and a slightly larger step per layer. */
.offer-stack { --stack-base: 18px; --stack-step: 22px; }
.stack-card { top: calc(var(--nav-h) + var(--stack-base) + var(--i, 0) * var(--stack-step)); border-top: 1px solid rgba(201, 168, 76, .5); }
.stack-navy, .stack-teal { box-shadow: 0 -10px 30px rgba(8, 19, 34, .22), 0 30px 80px rgba(8, 19, 34, .28), inset 0 1px 0 rgba(255, 255, 255, .08); }
.stack-cream { box-shadow: 0 -10px 30px rgba(8, 19, 34, .16), 0 30px 80px rgba(8, 19, 34, .16), inset 0 1px 0 rgba(255, 255, 255, .9); }
.stack-card.is-covered { box-shadow: 0 -10px 30px rgba(8, 19, 34, .12); }
.stack-card.is-focused { box-shadow: 0 0 0 3px #00d4d4, 0 -10px 30px rgba(8, 19, 34, .2), 0 30px 80px rgba(8, 19, 34, .28); }
@media (max-width: 920px) { .offer-stack { --stack-base: 12px; --stack-step: 14px; } .stack-card { top: calc(var(--nav-h) + var(--stack-base) + var(--i, 0) * var(--stack-step)); } }

/* 3. Sticky nav: cream glass surface, champagne edge, soft depth. Same height, logo, links and breakpoints as before. */
.nav {
  background: linear-gradient(180deg, rgba(255, 253, 250, .94), rgba(255, 253, 250, .82));
  -webkit-backdrop-filter: blur(18px) saturate(1.35);
  backdrop-filter: blur(18px) saturate(1.35);
  border-bottom: 1px solid rgba(201, 168, 76, .38);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .85), 0 10px 30px rgba(8, 19, 34, .07), 0 1px 2px rgba(8, 19, 34, .05);
}
.nav::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 1px; background: linear-gradient(90deg, transparent 4%, rgba(201, 168, 76, .75) 40%, rgba(0, 212, 212, .45) 60%, transparent 96%); pointer-events: none; }
.nav-links a { position: relative; padding: 6px 2px; border-radius: 8px; color: #24344a; transition: color .2s ease; }
.nav-links a::after { content: ""; position: absolute; left: 2px; right: 2px; bottom: -1px; height: 2px; border-radius: 2px; background: linear-gradient(90deg, #c9a84c, #00d4d4); transform: scaleX(0); transform-origin: left center; transition: transform .22s ease; }
.nav-links a:hover { color: #06474b; }
.nav-links a:hover::after, .nav-links a.active::after { transform: scaleX(1); }
.nav-links a.active { color: #081322; font-weight: 750; }
.nav-links a:focus-visible { outline: 3px solid #00d4d4; outline-offset: 4px; }
.nav-toggle { border-radius: 10px; min-width: 44px; min-height: 44px; transition: background-color .2s ease; }
.nav-toggle:hover { background: rgba(201, 168, 76, .12); }
.nav-toggle[aria-expanded="true"] { background: rgba(201, 168, 76, .16); }
@media (max-width: 920px) {
  /* Menu sits under the real header height instead of a fixed 74px. */
  .nav-links.open { top: calc(100% + 6px); padding: 12px 14px; gap: 2px; background: linear-gradient(180deg, rgba(255, 253, 250, .98), rgba(255, 253, 250, .94)); -webkit-backdrop-filter: blur(18px); backdrop-filter: blur(18px); border: 1px solid rgba(201, 168, 76, .42); box-shadow: 0 24px 60px rgba(8, 19, 34, .16), inset 0 1px 0 rgba(255, 255, 255, .9); }
  .nav-links.open a { display: flex; align-items: center; width: 100%; min-height: 46px; padding: 10px 12px; border-radius: 12px; }
  .nav-links.open a::after { content: none; }
  .nav-links.open a:hover { background: rgba(201, 168, 76, .1); }
  .nav-links.open a.active { background: rgba(201, 168, 76, .16); }
}

/* 4. Parallax layers are transformed by site.js only (bounded, scroll-driven, optional fine-pointer tilt). Text and controls never move. */
@media (prefers-reduced-motion: reduce) {
  .vera-orbit-ring { animation: none !important; }
  .orb-stage .vera-frame, .hero-halo { transform: none !important; }
  .nav-links a, .nav-links a::after, .nav-toggle { transition: none !important; }
}

/* ---- Managed-card refinement pass (2026-09-16) ---- */

/* Offer disclosure headers: light cream-glass with champagne edging, dark readable text on both navy and cream cards. */
.stack-details > summary {
  background: linear-gradient(180deg, rgba(255, 253, 250, .96), rgba(255, 251, 243, .9));
  -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px);
  border: 1px solid rgba(201, 168, 76, .42);
  box-shadow: 0 10px 28px rgba(8, 19, 34, .1), inset 0 1px 0 rgba(255, 255, 255, .95);
  color: #0b1627;
  transition: background-color .2s ease, border-color .2s ease, box-shadow .2s ease;
}
.stack-details > summary > span:first-child { color: #0b1627; font-weight: 750; }
.stack-details > summary:hover, .stack-cream .stack-details > summary:hover { background: linear-gradient(180deg, #fffdfa, rgba(255, 248, 232, .96)); border-color: rgba(201, 168, 76, .7); box-shadow: 0 14px 34px rgba(8, 19, 34, .14), inset 0 1px 0 #fff; }
.stack-details-cue, .stack-cream .stack-details-cue { color: #7a5c14 !important; }
.stack-details > summary:hover .stack-details-cue, .stack-cream .stack-details > summary:hover .stack-details-cue { color: #06474b !important; }
.stack-details > summary:focus-visible { outline: 3px solid #06474b; outline-offset: -4px; box-shadow: 0 0 0 5px rgba(255, 253, 250, .95); }
.stack-details[open] > summary, .stack-cream .stack-details[open] > summary { border-bottom: 1px solid rgba(201, 168, 76, .5); border-radius: 22px 22px 0 0; }
.stack-navy .stack-details, .stack-teal .stack-details { border-color: rgba(201, 168, 76, .34); }
.stack-details-chevron { border-color: currentColor; }

/* Training routes: individual immersive session at a fixed package price, group training by quote. */
.training-routes { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 12px; margin: 18px 0 20px; }
.training-route { display: flex; flex-direction: column; gap: 6px; padding: 16px 18px; border-radius: 16px; border: 1px solid rgba(201, 168, 76, .4); background: linear-gradient(180deg, rgba(255, 253, 250, .96), rgba(255, 251, 243, .9)); box-shadow: 0 10px 26px rgba(8, 19, 34, .1), inset 0 1px 0 rgba(255, 255, 255, .95); color: #0b1627; }
.training-route-individual { border-color: rgba(201, 168, 76, .7); box-shadow: 0 12px 30px rgba(201, 168, 76, .18), inset 0 1px 0 #fff; }
.training-route-label { font-size: .72rem; font-weight: 750; letter-spacing: .14em; text-transform: uppercase; color: #7a5c14; }
.training-route-price { font-family: "Playfair Display", Georgia, serif; font-weight: 700; font-size: 1.9rem; line-height: 1.05; color: #081322; }
.training-route-currency { font-family: Inter, sans-serif; font-size: .8rem; font-weight: 750; letter-spacing: .08em; color: #33465f; vertical-align: .55em; margin-right: 2px; }
.training-route-price-text { font-size: 1.45rem; color: #06474b; }
.training-route-note { font-size: .9rem; line-height: 1.45; color: #33465f; }
.training-route-list { margin: 8px 0 0; padding-left: 18px; display: grid; gap: 5px; font-size: .92rem; line-height: 1.45; color: #26384f; }
.training-route .hero-actions { margin-top: 10px; }
.training-route .hero-actions .btn { width: 100%; }
.service-chapter .training-routes-page { max-width: 640px; }
.stack-cream .training-route { background: linear-gradient(180deg, #fffdfa, rgba(255, 251, 243, .94)); }

/* Next-step chooser: cream-glass container with champagne edging, mirroring the nav finish. */
.cta .contact-chooser {
  background: linear-gradient(180deg, rgba(255, 253, 250, .97), rgba(255, 251, 243, .92));
  -webkit-backdrop-filter: blur(18px); backdrop-filter: blur(18px);
  border: 1px solid rgba(201, 168, 76, .45);
  border-radius: 28px;
  box-shadow: 0 24px 60px rgba(8, 19, 34, .14), inset 0 1px 0 rgba(255, 255, 255, .95);
  color: #0b1627;
}
.cta .contact-chooser .contact-header h2 { color: #081322; }
.cta .contact-tile {
  position: relative; background: rgba(255, 255, 255, .78); border: 1px solid rgba(201, 168, 76, .34); border-radius: 20px; color: #0b1627;
  box-shadow: 0 10px 28px rgba(8, 19, 34, .08), inset 0 1px 0 #fff;
  transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}
.cta .contact-tile::before { content: ""; position: absolute; left: 18px; right: 18px; top: 0; height: 2px; border-radius: 2px; background: linear-gradient(90deg, #c9a84c, #00d4d4); opacity: .75; }
.cta .contact-tile:hover { transform: translateY(-3px); border-color: rgba(201, 168, 76, .7); box-shadow: 0 18px 40px rgba(8, 19, 34, .14), inset 0 1px 0 #fff; }
.cta .contact-tile h3 { color: #081322; }
.cta .contact-tile p { color: #33465f; }
.cta .contact-tile-cta { color: #06474b; }
.cta .contact-tile-cta:hover { color: #081322; }
.cta .contact-tile-cta:focus-visible { outline: 3px solid #06474b; outline-offset: 4px; }

/* Final managed-services showcase: larger dark card, clearly secondary to the two learning offers. */
.managed-showcase-section { padding-top: 0; }
.managed-showcase {
  position: relative; display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(26px, 4vw, 56px); align-items: start;
  border-radius: 30px; padding: clamp(30px, 4.5vw, 58px); color: #fffdfa; overflow: hidden;
  background: radial-gradient(720px 360px at 88% 8%, rgba(201, 168, 76, .2), transparent 66%), radial-gradient(560px 320px at 8% 94%, rgba(0, 212, 212, .16), transparent 70%), linear-gradient(145deg, #081322, #0d2038 62%, #081322);
  border: 1px solid rgba(201, 168, 76, .34);
  box-shadow: 0 30px 80px rgba(8, 19, 34, .26), inset 0 1px 0 rgba(255, 255, 255, .08);
}
.managed-showcase .eyebrow { color: #e2c06a; }
.managed-showcase h2 { color: #fff; margin-bottom: 12px; }
.managed-showcase-lede { color: rgba(255, 253, 250, .8); line-height: 1.6; max-width: 34ch; }
.managed-showcase-body { display: grid; gap: 18px; }
.managed-services { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.managed-services li { display: grid; gap: 3px; padding: 14px 16px; border-radius: 14px; background: rgba(255, 255, 255, .05); border: 1px solid rgba(255, 255, 255, .1); }
.managed-services strong { color: #fff; font-size: 1rem; }
.managed-services span { color: rgba(255, 253, 250, .78); font-size: .95rem; line-height: 1.5; }
.managed-bridge { color: rgba(255, 253, 250, .82); line-height: 1.6; margin: 0; }
/* 2026-09-17 depth pass: layered inner surface, champagne/teal accents, compact three-card arrangement (lead stat spans the
   first row on wide screens, the two supporting stats sit side by side beneath it). CSS only; no new widgets or images. */
.managed-showcase::before { content: ""; position: absolute; inset: 12px; border-radius: 22px; border: 1px solid rgba(201, 168, 76, .16); pointer-events: none; }
.managed-showcase::after { content: ""; position: absolute; left: clamp(30px, 4.5vw, 58px); right: clamp(30px, 4.5vw, 58px); top: 0; height: 2px; border-radius: 2px; background: linear-gradient(90deg, #c9a84c, #00d4d4 60%, transparent); opacity: .8; pointer-events: none; }
.managed-showcase-head, .managed-showcase-body { position: relative; z-index: 1; }
.managed-services li { position: relative; padding-left: 22px; border-color: rgba(255, 255, 255, .12); background: linear-gradient(180deg, rgba(255, 255, 255, .07), rgba(255, 255, 255, .03)); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .06); }
.managed-services li::before { content: ""; position: absolute; left: 0; top: 16px; bottom: 16px; width: 3px; border-radius: 3px; background: linear-gradient(180deg, #e2c06a, #00d4d4); }
.managed-stats { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; padding: 16px; border-radius: 20px; background: linear-gradient(180deg, rgba(255, 255, 255, .05), rgba(8, 19, 34, .18)); border: 1px solid rgba(255, 255, 255, .1); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08), 0 18px 40px rgba(0, 0, 0, .22); }
.managed-stat { position: relative; display: grid; gap: 6px; align-content: start; padding: 16px 18px; border-radius: 14px; border: 1px solid rgba(201, 168, 76, .28); background: linear-gradient(160deg, rgba(255, 255, 255, .08), rgba(255, 255, 255, .02)); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1); }
.managed-stat::before { content: ""; position: absolute; left: 14px; right: 14px; top: 0; height: 1px; background: linear-gradient(90deg, rgba(0, 212, 212, .7), transparent); }
.managed-stat-lead { grid-column: 1 / -1; grid-template-columns: auto minmax(0, 1fr); column-gap: 18px; align-items: center; border-color: rgba(201, 168, 76, .55); background: linear-gradient(135deg, rgba(201, 168, 76, .18), rgba(255, 255, 255, .04) 55%, rgba(0, 212, 212, .08)); }
.managed-stat-lead .managed-stat-value { grid-row: 1 / span 2; font-size: clamp(2.6rem, 4vw, 3.4rem); color: #f3dfa2; text-shadow: 0 2px 18px rgba(201, 168, 76, .28); }
.managed-stat-lead .managed-stat-text { font-size: 1rem; color: #fffdfa; }
.managed-stat-value { font-family: "Playfair Display", Georgia, serif; font-weight: 700; font-size: 1.7rem; line-height: 1.05; color: #e2c06a; }
.managed-stat-text { font-size: .86rem; line-height: 1.45; color: rgba(255, 253, 250, .82); }
.managed-stat-cite { font-size: .76rem; letter-spacing: .04em; color: rgba(255, 253, 250, .62); }
.managed-stat-cite a { color: #9be9e9; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }
.managed-stat-cite a:hover { color: #00d4d4; }
.managed-stat-cite a:focus-visible { outline: 3px solid #00d4d4; outline-offset: 3px; border-radius: 4px; }
.managed-stats-note { margin: 0; font-size: .8rem; line-height: 1.5; color: rgba(255, 253, 250, .6); }
.managed-cta-row { margin-top: 4px; }
/* Champagne CTA: attractive but semantically disabled; the destination URL is an owner input and has not been supplied. */
.managed-cta, .managed-cta.link-placeholder, .managed-cta.link-placeholder:hover {
  display: inline-flex; align-items: center; gap: 12px; min-height: 52px; padding: 12px 26px; border-radius: 999px;
  font: inherit; font-weight: 800; font-size: 1rem; letter-spacing: .01em; color: #081322;
  background: linear-gradient(135deg, #f3dfa2, #c9a84c 55%, #e2c06a); border: 1px solid rgba(255, 248, 224, .7);
  box-shadow: 0 12px 30px rgba(201, 168, 76, .32), inset 0 1px 0 rgba(255, 255, 255, .7);
  opacity: 1; cursor: not-allowed; transform: none;
}
.managed-cta-arrow { font-size: 1.15rem; line-height: 1; }
.managed-callout .managed-cta, .managed-callout .managed-cta.link-placeholder { box-shadow: 0 10px 26px rgba(201, 168, 76, .28), inset 0 1px 0 rgba(255, 255, 255, .7); }
@media (max-width: 920px) { .managed-showcase { grid-template-columns: 1fr; } .managed-showcase-lede { max-width: none; } }
@media (max-width: 560px) { .managed-showcase { border-radius: 22px; padding: 26px 18px; } .managed-showcase::before { inset: 8px; border-radius: 16px; } .managed-showcase::after { left: 18px; right: 18px; } .managed-stats { grid-template-columns: 1fr; padding: 12px; } .managed-stat-lead { grid-template-columns: 1fr; } .managed-stat-lead .managed-stat-value { grid-row: auto; } .managed-cta, .managed-cta.link-placeholder { width: 100%; justify-content: center; } .training-routes { grid-template-columns: 1fr; } }
@media (prefers-reduced-motion: reduce) { .cta .contact-tile { transition: none !important; } .cta .contact-tile:hover { transform: none; } }

/* Standard one-to-one courses (2026-09-16): three native details/summary disclosures in the cream-glass style.
   The whole header is the control (Enter, Space, pointer, touch); no plus/minus-only affordance. */
.course-list { display: grid; gap: 14px; max-width: 860px; }
.course-item { border: 1px solid rgba(201, 168, 76, .45); border-radius: 20px; background: linear-gradient(180deg, rgba(255, 253, 250, .97), rgba(255, 251, 243, .92)); backdrop-filter: blur(10px); box-shadow: 0 14px 36px rgba(8, 19, 34, .08), inset 0 1px 0 #fff; color: #0b1627; transition: border-color .2s ease, box-shadow .2s ease; }
.course-item:hover, .course-item[open] { border-color: rgba(201, 168, 76, .8); box-shadow: 0 18px 44px rgba(8, 19, 34, .12), inset 0 1px 0 #fff; }
.course-head { list-style: none; cursor: pointer; display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; min-height: 64px; padding: 20px 22px 18px; border-radius: 20px; }
.course-head::-webkit-details-marker { display: none; }
.course-head:focus { outline: none; }
.course-head:focus-visible { outline: 3px solid #06474b; outline-offset: -4px; box-shadow: 0 0 0 5px rgba(255, 253, 250, .95); }
.course-text { display: block; min-width: 0; }
.course-text strong { display: block; font-family: "Playfair Display", Georgia, serif; font-size: 1.28rem; line-height: 1.25; color: #081322; }
.course-text span { display: block; color: #33465f; font-size: .94rem; line-height: 1.5; margin-top: 6px; }
.course-cue { display: inline-flex; align-items: center; gap: 8px; flex: 0 0 auto; padding-top: 4px; color: #7a5c14; font-size: .74rem; font-weight: 850; letter-spacing: .1em; text-transform: uppercase; white-space: nowrap; }
.course-cue-text::before { content: "View course"; }
.course-item[open] .course-cue-text::before { content: "Hide"; }
.course-head:hover .course-cue { color: #06474b; }
.course-chevron { width: 10px; height: 10px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg); transition: transform .2s ease; margin-top: -4px; }
.course-item[open] .course-chevron { transform: rotate(-135deg); margin-top: 4px; }
.course-item[open] > .course-head { border-bottom: 1px solid rgba(201, 168, 76, .4); border-radius: 20px 20px 0 0; }
.course-body { padding: 16px 22px 22px; }
.course-label { margin: 0 0 8px; font-size: .72rem; font-weight: 850; letter-spacing: .14em; text-transform: uppercase; color: #087e83; }
.course-body ul { margin: 0; padding-left: 20px; display: grid; gap: 6px; font-size: .98rem; line-height: 1.55; color: #26384f; }
/* 2026-09-17: public "Where it stops" scope paragraphs retired; each course closes with a positive outcome line. */
.course-outcome { margin: 14px 0 0; padding: 10px 14px; border-left: 3px solid rgba(201, 168, 76, .8); border-radius: 0 12px 12px 0; background: rgba(255, 255, 255, .6); font-size: .94rem; line-height: 1.55; color: #33465f; }
.course-outcome strong { color: #0b1627; }
.training-route-note-lead { color: #0b1627; font-weight: 700; font-size: .98rem; margin-top: 4px; }
/* Customized training (individual or group): information block replacing the retired inline intake. The CTA is a
   semantically disabled private-draft control until the owner-supplied intake URL exists; it carries no href. */
.custom-training-card { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(240px, .7fr); gap: clamp(24px, 4vw, 48px); align-items: center; border: 1px solid rgba(201, 168, 76, .45); border-radius: 26px; padding: clamp(26px, 4vw, 44px); background: linear-gradient(135deg, #fffdfa, #f7f4ea 58%, #fff); box-shadow: 0 22px 60px rgba(8, 19, 34, .1), inset 0 1px 0 #fff; max-width: 1040px; }
.custom-training-copy h2 { font-size: clamp(1.8rem, 3.4vw, 2.6rem); color: #081322; }
.custom-training-copy p { margin-top: 16px; color: #33465f; line-height: 1.65; max-width: 620px; }
.custom-training-copy a { color: #06474b; font-weight: 700; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; }
.custom-training-copy a:focus-visible { outline: 3px solid #06474b; outline-offset: 3px; border-radius: 4px; }
.custom-training-actions { display: grid; gap: 12px; }
.custom-training-actions .btn { width: 100%; text-align: center; }
.custom-training-cta.link-placeholder { font: inherit; font-weight: 800; }
@media (max-width: 920px) { .custom-training-card { grid-template-columns: 1fr; } .custom-training-actions { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .custom-training-card { border-radius: 20px; padding: 22px 18px; } .custom-training-actions { grid-template-columns: 1fr; } }
/* AI Strategy Consultation card: restrained navy treatment with explicit light text, step labels, borders and focus
   colours (nothing inherited from the light card rules). The rest of the section and page stay cream/white. */
.consult-card.consult-card-navy { position: relative; overflow: hidden; color: #fffdfa; border: 1px solid rgba(201, 168, 76, .4); background: radial-gradient(620px 300px at 90% 0%, rgba(0, 212, 212, .16), transparent 66%), radial-gradient(480px 280px at 6% 100%, rgba(201, 168, 76, .16), transparent 70%), linear-gradient(150deg, #081322 0%, #0d2038 62%, #081322 100%); box-shadow: 0 26px 70px rgba(8, 19, 34, .24), inset 0 1px 0 rgba(255, 255, 255, .08); }
.consult-card.consult-card-navy::before { content: ""; position: absolute; inset: 10px; border-radius: 18px; border: 1px solid rgba(201, 168, 76, .2); pointer-events: none; }
.consult-card.consult-card-navy::after { content: ""; position: absolute; left: 28px; right: 28px; top: 0; height: 2px; border-radius: 2px; background: linear-gradient(90deg, #c9a84c, #00d4d4 60%, transparent); opacity: .85; pointer-events: none; }
.consult-card.consult-card-navy > * { position: relative; z-index: 1; }
.consult-card.consult-card-navy h3 { color: #fff; }
.consult-card.consult-card-navy > p { color: rgba(255, 253, 250, .84); }
.consult-card.consult-card-navy .session-steps { margin-top: 20px; padding: 6px 16px 4px; border-radius: 16px; background: rgba(255, 255, 255, .05); border: 1px solid rgba(255, 255, 255, .1); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .07); }
.consult-card.consult-card-navy .session-steps li { border-top-color: rgba(255, 255, 255, .12); }
.consult-card.consult-card-navy .session-steps li:first-child { border-top: 0; }
.consult-card.consult-card-navy .session-steps li span { color: #e2c06a; }
.consult-card.consult-card-navy .session-steps li p { color: rgba(255, 253, 250, .86); }
.consult-card.consult-card-navy a { color: #9be9e9; }
.consult-card.consult-card-navy a:focus-visible, .consult-card.consult-card-navy .btn:focus-visible { outline: 3px solid #00d4d4; outline-offset: 3px; }
.consult-card.consult-card-navy .btn-light { color: #fff; border-color: rgba(255, 253, 250, .4); }
.consult-card.consult-card-navy .btn-light:hover { border-color: #00d4d4; color: #fff; }
.course-costs { margin-top: 28px; max-width: 860px; }
.course-costs h3 { font-size: 1.2rem; margin: 0 0 10px; color: #081322; }
.course-costs p { margin: 0; color: #33465f; font-size: .98rem; line-height: 1.6; }
@media (max-width: 560px) { .course-head { padding: 18px 16px 16px; } .course-body { padding: 14px 16px 18px; } .course-cue-text::before { content: "View"; } .course-item[open] .course-cue-text::before { content: "Hide"; } }
@media (prefers-reduced-motion: reduce) { .course-item, .course-chevron { transition: none !important; } }

/* ---------- Mobile luminous pass 2026-09-17 (owner phone review): visible breathing orb, LED edge light, ambient
   drift and scroll fades. Touch-first: nothing here needs hover or pointer tilt. Light sits behind or beside text;
   the .led-edge overlay is pointer-events:none and screen-blended on dark hosts so it can only brighten, never darken. */
.vera-orb { animation: veraHeartbeat 4.6s ease-in-out infinite; }
.vera-orb::before { animation: outerOrbPulse 4.6s ease-in-out infinite; opacity: .9; background: radial-gradient(circle, rgba(0, 212, 212, .34), rgba(0, 212, 212, .1) 45%, transparent 66%); }
.vera-orb::after { animation: innerTealRing 9s linear infinite; }
.vera-dot { animation: centerPulse 2.3s ease-in-out infinite; }
.hero-visual::before, .vera-frame::before { animation: haloBreath 5.2s ease-in-out infinite; }
.hero-halo { animation: haloBreath 6.4s ease-in-out -2s infinite; background: radial-gradient(circle, rgba(0, 212, 212, .34), rgba(201, 168, 76, .18) 46%, transparent 72%); filter: blur(26px); }
.orb-chip { animation: chipFloat 6s ease-in-out infinite; }
.orb-chip-1 { animation-delay: 0s; } .orb-chip-2 { animation-delay: -2s; } .orb-chip-3 { animation-delay: -4s; }
/* LED ring: a conic light strip circling just outside the orb, with a soft blurred twin for bloom. */
.vera-orb-button::before, .vera-orb-button::after { content: ""; position: absolute; left: 50%; top: 50%; width: 118%; height: 118%; border-radius: 50%; translate: -50% -50%; pointer-events: none; z-index: -1;
  background: conic-gradient(from 0deg, transparent 0 58%, rgba(0, 212, 212, .95) 74%, rgba(243, 223, 162, 1) 84%, rgba(201, 168, 76, 0) 100%);
  -webkit-mask: radial-gradient(farthest-side, transparent calc(100% - 3px), #000 calc(100% - 2px)); mask: radial-gradient(farthest-side, transparent calc(100% - 3px), #000 calc(100% - 2px));
  animation: ledOrbit 7s linear infinite; }
.vera-orb-button::after { width: 126%; height: 126%; filter: blur(9px); opacity: .85; -webkit-mask: radial-gradient(farthest-side, transparent calc(100% - 14px), #000 calc(100% - 4px)); mask: radial-gradient(farthest-side, transparent calc(100% - 14px), #000 calc(100% - 4px)); }
.orb-offscreen .vera-orb, .orb-offscreen .vera-orb::before, .orb-offscreen .vera-orb::after, .orb-offscreen .vera-dot, .orb-offscreen .hero-halo,
.orb-offscreen .vera-frame::before, .orb-offscreen .vera-orb-button::before, .orb-offscreen .vera-orb-button::after, .orb-offscreen .orb-chip { animation-play-state: paused; }
/* Ambient hero light: the existing corner-light layer drifts slowly. */
.hero::before { animation: heroAmbient 16s ease-in-out infinite alternate; }
/* Nav hairline becomes a slow LED sweep. */
.nav::after { height: 2px; background: linear-gradient(90deg, transparent 0%, rgba(201, 168, 76, 0) 30%, rgba(201, 168, 76, .9) 42%, #00d4d4 50%, rgba(201, 168, 76, .9) 58%, transparent 70%, transparent 100%); background-size: 220% 100%; box-shadow: 0 0 10px rgba(0, 212, 212, .35); animation: navSweep 9s ease-in-out infinite; }
/* LED edge light on selected surfaces. Offer cards are excluded: .stack-card owns its positioning (sticky, or the
   static short-viewport/.needs-flow fallback above) and a sticky box already contains the absolute .led-edge.
   In the static fallbacks the card gets a relative box with no offset so the edge light still hugs the card. */
.led-host:not(.stack-card) { position: relative; }
.offer-stack.needs-flow .stack-card.led-host { position: relative; top: auto; }
@media (max-height: 720px) { .stack-card.led-host { position: relative; top: auto; } }
.led-edge { position: absolute; inset: 0; border-radius: inherit; overflow: hidden; pointer-events: none; z-index: 2; }
.led-edge::before { content: ""; position: absolute; top: 0; left: 0; width: 42%; height: 3px; border-radius: 3px;
  background: linear-gradient(90deg, transparent, #00d4d4 28%, #f3dfa2 62%, transparent); box-shadow: 0 0 10px 2px rgba(0, 212, 212, .75), 0 6px 22px 4px rgba(201, 168, 76, .45); animation: ledSweep 5.4s ease-in-out infinite; }
.led-host.stack-cream .led-edge::before, .custom-training-card .led-edge::before, .contact-chooser .led-edge::before { background: linear-gradient(90deg, transparent, #c9a84c 28%, #087e83 62%, transparent); box-shadow: 0 0 10px 2px rgba(201, 168, 76, .7), 0 6px 22px 4px rgba(8, 126, 131, .35); }
.led-edge.led-ambient::after { content: ""; position: absolute; left: -10%; top: -20%; width: 46%; aspect-ratio: 1; border-radius: 50%; background: radial-gradient(circle, rgba(0, 212, 212, .38), rgba(201, 168, 76, .16) 48%, transparent 72%); filter: blur(28px); mix-blend-mode: screen; animation: ambientDrift 13s ease-in-out infinite alternate; }
.stack-card .led-edge { z-index: 3; }
.topic-card .led-edge { z-index: 0; }
#offer-stack .stack-card.is-covered .led-edge { opacity: 0; transition: opacity .3s ease; }
/* Scroll fades: only active once site.js confirms IntersectionObserver and no reduced-motion preference. */
html.js-reveal [data-reveal] { opacity: 0; transform: translateY(18px); transition: opacity .8s ease, transform .8s ease; }
html.js-reveal [data-reveal].is-in { opacity: 1; transform: none; }
@keyframes haloBreath { 0%, 100% { opacity: .55; transform: translate(-50%, -50%) scale(.94); } 50% { opacity: 1; transform: translate(-50%, -50%) scale(1.1); } }
@keyframes ledOrbit { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
@keyframes ledSweep { 0% { left: -42%; opacity: 0; } 12% { opacity: 1; } 88% { opacity: 1; } 100% { left: 100%; opacity: 0; } }
@keyframes ambientDrift { 0% { transform: translate3d(0, 0, 0) scale(1); } 100% { transform: translate3d(140%, 60%, 0) scale(1.25); } }
@keyframes heroAmbient { 0% { transform: translate3d(-2%, 1%, 0); opacity: .7; } 100% { transform: translate3d(2%, -1.5%, 0); opacity: 1; } }
@keyframes navSweep { 0% { background-position: 110% 0; } 100% { background-position: -10% 0; } }
.motion-paused .vera-orb-button::before, .motion-paused .vera-orb-button::after, .motion-paused .led-edge::before, .motion-paused .led-edge::after,
.motion-paused .hero::before, .motion-paused .nav::after { animation-play-state: paused !important; }
@media (prefers-reduced-motion: reduce) {
  /* Static luminous fallback: the LED ring, edge light and halo stay lit but do not move. */
  .vera-orb, .vera-orb::before, .vera-orb::after, .vera-dot, .hero-visual::before, .vera-frame::before, .hero-halo, .orb-chip,
  .vera-orb-button::before, .vera-orb-button::after, .hero::before, .nav::after, .led-edge::before, .led-edge::after { animation: none !important; }
  .vera-orb-button::before { background: conic-gradient(from 200deg, rgba(0, 212, 212, .55), rgba(243, 223, 162, .9), rgba(0, 212, 212, .55)); }
  .hero-halo { opacity: .85; }
  .led-edge::before { left: 0; width: 100%; opacity: .9; background: linear-gradient(90deg, transparent, #00d4d4 30%, #f3dfa2 70%, transparent); }
  .led-edge.led-ambient::after { left: 60%; top: -20%; transform: none; }
  html.js-reveal [data-reveal] { opacity: 1; transform: none; transition: none; }
}
@media (max-width: 560px) { .vera-orb-button::before, .vera-orb-button::after { width: 122%; height: 122%; } .vera-orb-button::after { width: 132%; height: 132%; } .led-edge::before { width: 58%; height: 3px; } }

/* ---------- Laptop review pass 2026-09-17 (owner corrections) ---------- */
/* 1. Topic chips clear the orb and its LED ring through the whole motion cycle. The ring's blurred bloom spans about
      360 px on desktop (270 px button x 126 % + blur) and 290 px on phones, centred in the stage. Chips now sit in the
      bands ABOVE and BELOW that circle rather than beside it, so clearance no longer depends on column width: two chips
      on the top corners, the long "Customized training" chip centred underneath. The float (-9 px) and the bounded
      parallax drift are inside the reserved bands. Pulse, orbit, float and panel behaviour are unchanged. */
.orb-stage { min-height: 540px; }
.orb-chip-1 { left: 0; top: 4px; right: auto; bottom: auto; }
.orb-chip-3 { left: auto; right: 0; top: 4px; bottom: auto; }
.orb-chip-2 { left: 50%; right: auto; top: auto; bottom: 4px; translate: -50% 0; }
@media (max-width: 920px) { .orb-stage { min-height: 540px; } }
@media (max-width: 560px) {
  /* Phone band: the ring's bloom (132 % of the orb button + 9 px blur) plus the -9 px float and the +/-40 px parallax
     drift left the lower chip 7-10 px inside the glow at 320/390 px. An extra 35 px band above and below (430 -> 500 px)
     restores a real gap; labels, orb size and motion are unchanged. */
  /* 2026-09-17 owner: 500 px felt too far. 472 px keeps a 21 px band each side (about 11-14 px of audited clearance
     from the bloom through float + parallax) while looking compact. Orb, ring, labels and motion untouched. */
  .orb-stage { min-height: 472px; }
  .orb-chip { font-size: .7rem; padding: 8px 11px; }
  .orb-chip-1 { left: 0; top: 2px; }
  .orb-chip-3 { right: 0; top: 2px; }
  .orb-chip-2 { bottom: 2px; }
}
/* 2. Gap between the offer cards and Founder: the stack no longer reserves 6vh beneath the last card, the offers section
      keeps a short bottom padding and Founder a short top padding. No negative margins; nothing overlaps. */
#offers.section { padding-bottom: 28px; }
.offer-stack { padding-bottom: 0; }
#founder.section { padding-top: 44px; }
@media (max-width: 920px) { #offers.section { padding-bottom: 20px; } #founder.section { padding-top: 36px; } }
/* 3. Laptop heights (about 721-900 px inner height): tighter card padding and spacing so both cards fit under their sticky
      offset and stay sticky instead of falling back to normal flow. Below 720 px the existing static fallback applies. */
@media (min-height: 721px) and (max-height: 900px) {
  .stack-card { padding: clamp(24px, 3.2vw, 38px); min-height: 0; gap: clamp(20px, 3vw, 36px); }
  .stack-index { font-size: clamp(2.2rem, 4vw, 3.4rem); margin-bottom: 10px; }
  .stack-card h3 { font-size: clamp(1.7rem, 3vw, 2.6rem); }
  .stack-card .stack-body { margin-top: 12px; }
  .stack-actions { margin-top: 18px; }
  .training-routes { margin: 14px 0 14px; }
  .training-route { padding: 12px 14px; gap: 4px; }
  .stack-aside { padding: 16px; }
  .stack-details > summary { min-height: 56px; padding: 14px 18px; }
}
/* 4. AI Consultation & Training page (scoped to body.consultation-page so Resources and Home do not drift). */
body.consultation-page .page-hero-inner { padding-bottom: 72px; }
body.consultation-page .page-hero::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 2px; background: linear-gradient(90deg, transparent, rgba(201, 168, 76, .8) 35%, rgba(0, 212, 212, .6) 65%, transparent); pointer-events: none; }
body.consultation-page .consult-layout { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(260px, .7fr); gap: clamp(18px, 3vw, 32px); align-items: start; }
body.consultation-page .consult-card-grid-single { display: block; }
body.consultation-page .consult-card-feature { max-width: none; }
body.consultation-page .consult-covers { border: 1px solid rgba(201, 168, 76, .45); border-radius: 22px; padding: clamp(22px, 3vw, 30px); background: linear-gradient(180deg, rgba(255, 253, 250, .97), rgba(255, 251, 243, .92)); box-shadow: 0 14px 36px rgba(8, 19, 34, .08), inset 0 1px 0 #fff; }
body.consultation-page .consult-covers h3 { font-family: Inter, sans-serif; font-size: .74rem; font-weight: 900; letter-spacing: .14em; text-transform: uppercase; color: #087e83; margin: 0 0 14px; }
body.consultation-page .consult-covers ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
body.consultation-page .consult-covers li { position: relative; padding-left: 22px; color: #26384f; font-size: .98rem; line-height: 1.55; font-weight: 600; }
body.consultation-page .consult-covers li::before { content: ""; position: absolute; left: 0; top: .68em; width: 10px; height: 1px; background: #c9a84c; }
body.consultation-page .consult-covers p { margin-top: 16px; padding-top: 14px; border-top: 1px solid rgba(8, 19, 34, .1); color: #5d6c81; font-size: .9rem; line-height: 1.5; }
body.consultation-page .service-chapter-copy > p:not(.chapter-kicker) { max-width: 640px; }
body.consultation-page .training-routes-page { max-width: none; }
body.consultation-page .training-route-list { list-style: none; padding: 0; margin-top: 10px; gap: 6px; }
body.consultation-page .training-route-list li { position: relative; padding-left: 20px; }
body.consultation-page .training-route-list li::before { content: ""; position: absolute; left: 0; top: .66em; width: 10px; height: 1px; background: #c9a84c; }
body.consultation-page .training-route-group { border-color: rgba(0, 212, 212, .38); background: linear-gradient(180deg, rgba(255, 253, 250, .96), rgba(240, 250, 250, .92)); }
body.consultation-page .training-route-group .training-route-label { color: #06474b; }
body.consultation-page .training-route .btn-light { color: #0b1627; border-color: rgba(8, 19, 34, .22); }
body.consultation-page .training-route .btn-light:hover { border-color: #087e83; color: #06474b; }
body.consultation-page .training-steps div { background: rgba(255, 255, 255, .07); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08); }
body.consultation-page #standard-training { position: relative; overflow: hidden; background: radial-gradient(620px 320px at 90% 0%, rgba(0, 212, 212, .1), transparent 66%), radial-gradient(520px 300px at 4% 100%, rgba(201, 168, 76, .12), transparent 70%), linear-gradient(180deg, #fff, #f7f8fb); }
body.consultation-page .standard-head { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: clamp(18px, 3vw, 40px); align-items: end; max-width: none; }
body.consultation-page .course-list { max-width: none; gap: 16px; }
body.consultation-page .course-item { position: relative; }
body.consultation-page .course-item::after { content: ""; position: absolute; left: 22px; right: 22px; top: 0; height: 2px; border-radius: 2px; background: linear-gradient(90deg, #c9a84c, #00d4d4 60%, transparent); opacity: .55; pointer-events: none; transition: opacity .2s ease; }
body.consultation-page .course-item[open]::after, body.consultation-page .course-item:hover::after { opacity: .95; }
body.consultation-page .course-head { align-items: center; gap: 18px; padding: 22px 24px 20px; }
body.consultation-page .course-index { flex: 0 0 auto; font-family: "Playfair Display", Georgia, serif; font-size: 1.7rem; line-height: 1; color: #c9a84c; letter-spacing: -.03em; min-width: 42px; }
body.consultation-page .course-text { flex: 1 1 auto; }
body.consultation-page .course-body { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(240px, .8fr); gap: clamp(18px, 3vw, 32px); padding: 20px 24px 24px 24px; }
body.consultation-page .course-body ul { gap: 8px; }
body.consultation-page .course-outcome { margin: 0; align-self: start; padding: 16px 18px; border-left: 0; border: 1px solid rgba(0, 212, 212, .35); border-radius: 16px; background: linear-gradient(160deg, rgba(240, 250, 250, .9), rgba(255, 253, 250, .9)); box-shadow: inset 0 1px 0 #fff; }
body.consultation-page .course-outcome strong { display: block; font-size: .7rem; font-weight: 900; letter-spacing: .14em; text-transform: uppercase; color: #087e83; margin-bottom: 6px; }
body.consultation-page .prep-note { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 14px; align-items: start; max-width: 760px; margin-top: 22px; padding: 14px 18px; border-radius: 14px; border: 1px solid rgba(8, 126, 131, .28); border-left: 3px solid #087e83; background: rgba(255, 255, 255, .72); box-shadow: 0 8px 22px rgba(8, 19, 34, .05); }
body.consultation-page .prep-note h3 { font-family: Inter, sans-serif; font-size: .7rem; font-weight: 900; letter-spacing: .14em; text-transform: uppercase; color: #06474b; margin: 0; padding-top: 3px; white-space: nowrap; }
body.consultation-page .prep-note p { margin: 0; color: #2b3e57; font-size: .92rem; line-height: 1.55; }
body.consultation-page .custom-training-actions { gap: 10px; }
body.consultation-page .custom-training-actions .btn-light { color: #0b1627; }
@media (max-width: 920px) {
  body.consultation-page .consult-layout { grid-template-columns: 1fr; }
  body.consultation-page .standard-head { grid-template-columns: 1fr; align-items: start; }
  body.consultation-page .course-body { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
  body.consultation-page .course-head { padding: 18px 16px 16px; gap: 12px; }
  body.consultation-page .course-index { font-size: 1.3rem; min-width: 30px; }
  body.consultation-page .course-body { padding: 16px 16px 18px; }
  body.consultation-page .prep-note { grid-template-columns: 1fr; gap: 6px; padding: 14px; }
  body.consultation-page .prep-note h3 { white-space: normal; }
}
@media (prefers-reduced-motion: reduce) { body.consultation-page .course-item::after { transition: none !important; } }

/* ---------- Subtraction / imagery pass 2026-09-17 (owner: fewer words and boxes, images instead). Scoped to body.consultation-page. ---------- */
/* Consultation composition: the approved professional photo (own navy frame baked in, shown intact) beside a compact Before / During / After. */
body.consultation-page .consult-card-feature { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(18px, 3vw, 32px); align-items: center; }
/* Navigation correction 2026-09-17: `.consult-card.consult-card-navy > *` made the decorative .led-edge span position:relative, so it
   occupied the first grid cell (photo pushed upper-right, labels lower-left, one cell empty). Restore the overlay to its absolute inset
   box (inset/pointer-events/animation come from .led-edge itself) so the photo and labels take the two intended cells. */
body.consultation-page .consult-card.consult-card-navy > .led-edge { position: absolute; z-index: 2; }
/* Same-page targets on this page sit below the sticky header (matches the main[id] offset), for native and helper-driven anchor scrolls. */
body.consultation-page section[id], body.consultation-page #training { scroll-margin-top: 90px; }
body.consultation-page .consult-photo { display: block; width: 100%; height: auto; object-fit: contain; border-radius: 12px; }
body.consultation-page .consult-run h3 { margin: 0; }
/* Labels only (Before · During · After) in one compact row; no step paragraphs. */
body.consultation-page .consult-card.consult-card-navy .session-steps { margin-top: 14px; padding: 10px 14px; display: flex; flex-wrap: wrap; gap: 8px 22px; }
body.consultation-page .session-steps li { display: block; padding: 0; border-top: 0; }
/* Training overview: the process aside moved to #custom-training, so the copy column spans the chapter and both route cards grow (wide layout only; the label column collapses on narrow screens). */
@media (min-width: 921px) {
  body.consultation-page #training .service-chapter-grid.has-chapter-label { grid-template-columns: 150px minmax(0, 1fr); }
}
@media (max-width: 920px) {
  body.consultation-page #training .service-chapter-grid.has-chapter-label { grid-template-columns: minmax(0, 1fr); }
}
body.consultation-page .training-routes-page { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin: 22px 0 0; }
body.consultation-page .training-route { padding: clamp(20px, 2.6vw, 30px); gap: 8px; }
body.consultation-page .training-route .hero-actions { margin-top: auto; padding-top: 14px; }
body.consultation-page .training-route-list { font-size: .98rem; }
/* Both route CTAs: same gold family, same rendered box (full card width, fixed min-height so a wrapped label still matches). */
body.consultation-page .training-route-cta, body.consultation-page .training-route-cta:hover { display: inline-flex; align-items: center; justify-content: center; width: 100%; min-height: 64px; padding: 12px 18px; font-size: 1rem; font-weight: 800; line-height: 1.25; text-align: center; white-space: normal; background: linear-gradient(135deg, #f3dfa2, #c9a84c 55%, #e2c06a); color: #221802; border: 1px solid rgba(255, 248, 224, .7); box-shadow: 0 12px 30px rgba(201, 168, 76, .28), inset 0 1px 0 rgba(255, 255, 255, .7); }
body.consultation-page .training-route-cta:focus-visible { outline: 3px solid #00d4d4; outline-offset: 3px; }
/* Customized training: four-step process as a plain numbered list (no bubbles), branded controls. */
body.consultation-page .custom-process { list-style: none; margin: 18px 0 0; padding: 0; display: grid; gap: 0; max-width: 620px; }
body.consultation-page .custom-process li { display: grid; grid-template-columns: 118px minmax(0, 1fr); gap: 12px; align-items: start; padding: 10px 0; border-top: 1px solid rgba(8, 19, 34, .1); }
body.consultation-page .custom-process li:last-child { border-bottom: 1px solid rgba(8, 19, 34, .1); }
body.consultation-page .custom-process b { font-size: .7rem; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; color: #7a5c14; padding-top: 3px; }
body.consultation-page .custom-process p { margin: 0; color: #33465f; font-size: .96rem; line-height: 1.5; max-width: none; }
body.consultation-page .custom-training-copy > p:last-of-type { margin-top: 14px; font-size: .94rem; }
body.consultation-page .custom-training-cta:disabled, body.consultation-page .custom-training-cta[disabled], body.consultation-page .custom-training-cta:disabled:hover { opacity: 1; cursor: not-allowed; background: linear-gradient(180deg, rgba(0, 212, 212, .16), rgba(8, 126, 131, .14)) !important; color: #06474b !important; border-color: rgba(8, 126, 131, .5) !important; box-shadow: inset 0 1px 0 rgba(255, 255, 255, .8) !important; }
body.consultation-page .custom-training-session, body.consultation-page .custom-training-actions .custom-training-session { background: linear-gradient(150deg, #0d2038, #081322); color: #fffdfa; border-color: rgba(201, 168, 76, .7); box-shadow: 0 12px 30px rgba(8, 19, 34, .22); }
body.consultation-page .custom-training-session:hover { color: #fff; border-color: #c9a84c; }
body.consultation-page .custom-training-session:focus-visible { outline: 3px solid #06474b; outline-offset: 3px; }
/* "Need something built instead?": original branded illustration beside a short summary; the callout carries the traveling LED edge. */
body.consultation-page .managed-callout-visual { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(280px, .95fr); gap: clamp(22px, 4vw, 48px); align-items: center; position: relative; overflow: hidden; }
body.consultation-page .managed-callout-visual .led-edge::before { background: linear-gradient(90deg, transparent, #c9a84c 28%, #087e83 62%, transparent); box-shadow: 0 0 10px 2px rgba(201, 168, 76, .7), 0 6px 22px 4px rgba(8, 126, 131, .35); }
body.consultation-page .managed-callout-copy p { max-width: 520px; }
body.consultation-page .managed-callout-art { display: block; width: 100%; max-width: 560px; height: auto; margin: 0 auto; border-radius: 22px; box-shadow: 0 22px 60px rgba(8, 19, 34, .22); }
@media (max-width: 920px) {
  body.consultation-page .consult-card-feature { grid-template-columns: 1fr; }
  body.consultation-page .managed-callout-visual { grid-template-columns: 1fr; }
  body.consultation-page .managed-callout-art { order: -1; }
}
@media (max-width: 760px) {
  body.consultation-page .training-routes-page { grid-template-columns: 1fr; }
  /* Stacked cards: the longer label wraps to two lines; reserve two lines on both buttons so the boxes stay equal. */
  body.consultation-page .training-route-cta, body.consultation-page .training-route-cta:hover { min-height: calc(2 * 1.25em + 24px + 2px); }
}
@media (max-width: 560px) {
  body.consultation-page .custom-process li { grid-template-columns: 1fr; gap: 4px; }
}
@media (max-width: 400px) {
  /* Narrowest phones: slightly smaller CTA type and side padding so the longer label never needs a third line. */
  body.consultation-page .training-route-cta, body.consultation-page .training-route-cta:hover { font-size: .94rem; padding-left: 12px; padding-right: 12px; }
}