/* ============================================================
   COP remediation layer — impeccable audit fixes (2026-07-24)
   Additive overrides only; cop-wp.css stays the pristine export.
   Fold these into the Claude Design source on next re-export.
   ============================================================ */

/* --- A11y: eyebrow contrast on light surfaces (WCAG 1.4.3) ---
   Azure #2896D2 = 3.1:1 and gold #F5C518 = 1.6:1 on light bgs.
   Darkened same-hue values ≥4.5:1; dark surfaces keep brand values. */
.cop-eyebrow { color: #1A628E; }
.cop-eyebrow--gold { color: #8F6400; }
.cop-section--dark .cop-eyebrow:not(.cop-eyebrow--gold),
.cop-card--ink .cop-eyebrow:not(.cop-eyebrow--gold),
footer.elementor-location-footer .cop-eyebrow:not(.cop-eyebrow--gold),
:is(section, div):has(> .cop-lightfield) .cop-eyebrow:not(.cop-eyebrow--gold) {
  color: var(--c-azure);
}
.cop-section--dark .cop-eyebrow--gold,
.cop-card--ink .cop-eyebrow--gold,
footer.elementor-location-footer .cop-eyebrow--gold,
:is(section, div):has(> .cop-lightfield) .cop-eyebrow--gold {
  color: var(--c-gold);
}

/* --- Responsive: footer stacks on small screens ------------- */
@media (max-width: 880px) {
  footer.elementor-location-footer .e-flexbox-base,
  footer.elementor-location-footer .e-div-block-base,
  footer.elementor-location-footer .e-con {
    flex-direction: column !important;
    width: 100% !important;
    min-width: 0;
    align-items: center;
  }
  footer.elementor-location-footer .e-flexbox-base { gap: 32px; }
  footer.elementor-location-footer img { max-width: 100%; height: auto; }
  /* certification badges: keep side by side, centered */
  footer.elementor-location-footer .e-div-block-base:has(> .e-image-base) {
    flex-direction: row !important;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
  }
  footer.elementor-location-footer .elementor-widget-theme-site-logo img {
    max-width: 200px;
  }
  footer.elementor-location-footer .elementor-widget-text-editor,
  footer.elementor-location-footer .elementor-widget-heading,
  footer.elementor-location-footer .e-heading-base {
    text-align: center;
  }
}

/* --- Responsive: overflow guard ----------------------------- */
footer.elementor-location-footer { overflow-x: clip; }
footer.elementor-location-footer .e-con,
footer.elementor-location-footer .e-div-block { min-width: 0; }

/* --- Theming: pillar cards missing the base class ------------
   Homepage M³ cards ship only the modifier (cop-pillar--message
   etc.) without .cop-pillar, so the DS radius, padding, and white
   text never applied — sharp corners + washed-out text. This shim
   applies the base recipe to any pillar modifier. */
[class*="cop-pillar--"] {
  position: relative;
  overflow: hidden;
  border-radius: var(--radius-lg);
  padding: 24px !important; /* element-level 10px overrides the shim otherwise */
  min-height: 240px;
  color: #fff;
  border: 1px solid rgba(255, 255, 255, 0.10);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 24px;
  box-shadow: var(--shadow-md);
  transition: var(--transition);
}
[class*="cop-pillar--"]:hover { transform: translateY(-4px); box-shadow: var(--shadow-xl); }
[class*="cop-pillar--"] :is(h3, .cop-h3) { color: #FFFFFF; }
[class*="cop-pillar--"] :is(p, .cop-body) { color: rgba(255, 255, 255, 0.85); }

/* --- A11y: stat blocks on light surfaces ---------------------
   .cop-stat ships dark-surface colors (white value / white-55 label);
   on light sections that renders white-on-white. Ink values on light,
   original values re-asserted on dark contexts. */
.cop-stat__value { color: #0A1F44; }
.cop-stat__label { color: rgba(2, 26, 60, 0.68); }
.cop-stat__delta { color: #157A52; }
:is(.cop-section--dark, .cop-card--ink, .cop-glass,
    section:has(> .cop-lightfield), div:has(> .cop-lightfield)) .cop-stat__value {
  color: #FFFFFF;
}
:is(.cop-section--dark, .cop-card--ink, .cop-glass,
    section:has(> .cop-lightfield), div:has(> .cop-lightfield)) .cop-stat__label {
  color: rgba(255, 255, 255, 0.55);
}
:is(.cop-section--dark, .cop-card--ink, .cop-glass,
    section:has(> .cop-lightfield), div:has(> .cop-lightfield)) .cop-stat__delta {
  color: #1F9D6B;
}

/* --- A11y: touch targets ≥44px (WCAG 2.5.8) ----------------- */
.elementor-menu-toggle { min-width: 44px; min-height: 44px; }
footer.elementor-location-footer .elementor-icon-list-item a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
}
@media (max-width: 1024px) {
  .elementor-nav-menu a {
    display: flex;
    align-items: center;
    min-height: 44px;
  }
}

/* --- Theming: footer typography onto brand faces ------------
   Retires Inter / Roboto / Montserrat from the footer so the
   Google Fonts kit can be switched off. Column labels follow the
   eyebrow spec (mono · uppercase · tracked). */
footer.elementor-location-footer h2.elementor-heading-title,
footer.elementor-location-footer .e-heading-base {
  font-family: 'IBM Plex Mono', ui-monospace, monospace !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}
footer.elementor-location-footer .elementor-icon-list-text,
footer.elementor-location-footer .elementor-widget-text-editor p {
  font-family: 'Open Sans', system-ui, sans-serif !important;
  font-size: 13px;
  line-height: 1.6;
}
/* Brand tagline: readable light ink, never gold body text */
footer.elementor-location-footer .elementor-widget-text-editor p,
footer.elementor-location-footer .elementor-widget-text-editor p strong,
footer.elementor-location-footer .elementor-widget-text-editor p em {
  color: rgba(255, 255, 255, 0.82) !important;
}

/* --- Theming: ink cards on light sections keep light text ----- */
.cop-card--ink .cop-body { color: rgba(255, 255, 255, 0.78); }
.cop-card--ink :is(h2, h3, .cop-h2, .cop-h3) { color: #FFFFFF; }

/* launch-list form on ink cards */
.cop-card--ink .elementor-field-group .elementor-field-label,
.cop-card--ink .elementor-form .elementor-field-label { color: rgba(255,255,255,0.85); }
.cop-card--ink .elementor-message.elementor-message-success { color: #A7E3C9; }
.cop-card--ink .elementor-form { max-width: 560px; }

/* ===== COP v2 components (2026-07-25) ===== */
/* Italics policy: italic is reserved for the footer tagline, the hero H1 accent, and book titles. */
.cop-accent-em { font-style: italic; }
.cop-btn, .cop-chip, .cop-eyebrow, .cop-kicker { font-style: normal !important; }

/* Deep-indigo frame */
.s-gh-nav, .s-gh-nav-in { background-color: #020B22 !important; }

/* Card header: icon tile + tag, then small gold rule + kicker */
.cop-card-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 6px; }
.cop-card-head__icon { width: 44px; height: 44px; border-radius: 12px; display: grid; place-items: center; flex: none;
  background: linear-gradient(135deg, #1056A5, #2896D2); color: #fff; box-shadow: 0 8px 20px rgba(16,86,165,.35); }
.cop-card-head__icon svg { width: 22px; height: 22px; }
.cop-card-head__icon--gold { background: linear-gradient(135deg, #B78600, #F5C518); color: #0A0814; box-shadow: 0 8px 20px rgba(245,197,24,.28); }
.cop-card-head__icon--violet { background: linear-gradient(135deg, #4C2A85, #7B4FD0); box-shadow: 0 8px 20px rgba(123,79,208,.32); }
.cop-card-head__tag { font-size: 11px; font-weight: 700; letter-spacing: .14em; color: #8F6400; }
:is(.cop-section--dark, .cop-card--ink, [class*="cop-pillar--"]) .cop-card-head__tag { color: #F5C518; }
.cop-rule--sm { display: block; width: 34px; height: 3px; border-radius: 2px; background: #F5C518; margin: 14px 0 10px; }
.cop-kicker { display: block; font-size: 12px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: #1A628E; margin-bottom: 6px; }
:is(.cop-section--dark, .cop-card--ink, [class*="cop-pillar--"]) .cop-kicker { color: #7FC5EE; }

/* Border beam: one per viewport. Gold = primary spotlight, blue = featured-but-calm. */
@property --cop-beam { syntax: '<angle>'; initial-value: 0deg; inherits: false; }
.cop-beam { position: relative; }
.cop-beam::before { content: ''; position: absolute; inset: -2px; border-radius: inherit; padding: 2px; pointer-events: none;
  background: conic-gradient(from var(--cop-beam), transparent 0deg 300deg, rgba(245,197,24,.25) 325deg, #F5C518 345deg, #FFEFAF 352deg, transparent 360deg);
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0); -webkit-mask-composite: xor; mask-composite: exclude;
  animation: cop-beam-spin 6s linear infinite; }
.cop-beam--blue::before { background: conic-gradient(from var(--cop-beam), transparent 0deg 300deg, rgba(40,150,210,.25) 325deg, #2896D2 345deg, #BFE4F7 352deg, transparent 360deg); animation-duration: 9s; }
@keyframes cop-beam-spin { to { --cop-beam: 360deg; } }
@media (prefers-reduced-motion: reduce) { .cop-beam::before { animation: none; background: linear-gradient(135deg, rgba(245,197,24,.7), rgba(245,197,24,.15)); } }

/* Image bands + image cards: photo reads as texture, never as stock. Overlay 65-75% ink, always. */
.cop-imgband { position: relative; isolation: isolate; overflow: hidden; }
.cop-imgband__bg { position: absolute; inset: 0; z-index: 0; background-size: cover; background-position: center; }
.cop-imgband__bg::after { content: ''; position: absolute; inset: 0; background: linear-gradient(160deg, rgba(2,10,28,.82) 0%, rgba(2,16,44,.68) 55%, rgba(6,10,30,.78) 100%); }
.cop-imgband > :not(.cop-imgband__bg) { position: relative; z-index: 1; }
.cop-imgband--tint .cop-imgband__bg::after { background: linear-gradient(160deg, rgba(2,10,28,.85) 0%, rgba(16,86,165,.55) 60%, rgba(2,10,28,.85) 100%); }
[class*="cop-pillar--"] .cop-pillar__bg { position: absolute; inset: 0; z-index: 0; border-radius: inherit; background-size: cover; background-position: center; opacity: .35; }
[class*="cop-pillar--"] .cop-pillar__bg::after { content: ''; position: absolute; inset: 0; border-radius: inherit; background: linear-gradient(180deg, rgba(4,8,22,.55), rgba(4,8,22,.88)); }
[class*="cop-pillar--"] > :not(.cop-pillar__bg) { position: relative; z-index: 1; }

/* Seven C's tabs (About) */
.cop-tabs__list { display: flex; flex-wrap: wrap; gap: 10px; padding: 0; margin: 0 0 22px; list-style: none; }
.cop-tabs__tab { font: 600 14px/1 inherit; letter-spacing: .02em; padding: 10px 18px; border-radius: 999px; cursor: pointer;
  border: 1px solid #C9D6E8; background: #fff; color: #0A1F44; transition: all .18s ease; }
.cop-tabs__tab:hover { border-color: #1056A5; }
.cop-tabs__tab[aria-selected="true"] { background: #0E2A6B; border-color: #0E2A6B; color: #fff; box-shadow: 0 10px 24px rgba(14,42,107,.28); }
.cop-tabs__panel { border-left: 3px solid #F5C518; padding: 6px 0 6px 20px; }
.cop-tabs__panel[hidden] { display: none; }
.cop-tabs__panel h3 { margin: 0 0 6px; }
.cop-tabs__panel p { margin: 0; max-width: 62ch; }
/* ===== Celebration OnPoint hero-light system (reusable; Joe 2026-07-25) =====
   Any dark hero section becomes a light-hero: add class .onpoint-light-hero plus a --shotN modifier.
   Artwork is a static center-bottom cover background; two near-invisible layers pulse only scaleY + opacity.
   Default artwork = shot 2 (balanced blue/gold). Swap per hero with .onpoint-light-hero--shotN. */

.onpoint-light-hero {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background-color: #04060f;
  background-image: var(--hero-art, url("https://oht2i9g1qy-staging.onrocket.site/wp-content/uploads/2026/07/COP_lightshow2.webp"));
  background-position: center bottom !important;
  background-size: cover !important;
  background-repeat: no-repeat !important;
}

/* Hero artwork library (all live in the media library, sized 1672x941) */
.onpoint-light-hero--shot1 { --hero-art: url("https://oht2i9g1qy-staging.onrocket.site/wp-content/uploads/2026/07/COP_lightshow1.png"); }
.onpoint-light-hero--shot2 { --hero-art: url("https://oht2i9g1qy-staging.onrocket.site/wp-content/uploads/2026/07/COP_lightshow2.webp"); }
.onpoint-light-hero--shot3 { --hero-art: url("https://oht2i9g1qy-staging.onrocket.site/wp-content/uploads/2026/07/COP_lightshow3.webp"); }
.onpoint-light-hero--shot4 { --hero-art: url("https://oht2i9g1qy-staging.onrocket.site/wp-content/uploads/2026/07/COP_lightshow4.webp"); }
.onpoint-light-hero--shot5 { --hero-art: url("https://oht2i9g1qy-staging.onrocket.site/wp-content/uploads/2026/07/COP_lightshow5.webp"); }
.onpoint-light-hero--shot6 { --hero-art: url("https://oht2i9g1qy-staging.onrocket.site/wp-content/uploads/2026/07/COP_lightshow6.webp"); }
.onpoint-light-hero--shot7 { --hero-art: url("https://oht2i9g1qy-staging.onrocket.site/wp-content/uploads/2026/07/COP_lightshow7.webp"); }
.onpoint-light-hero--shot8 { --hero-art: url("https://oht2i9g1qy-staging.onrocket.site/wp-content/uploads/2026/07/COP_lightshow8.webp"); }
.onpoint-light-hero--shot9 { --hero-art: url("https://oht2i9g1qy-staging.onrocket.site/wp-content/uploads/2026/07/COP_lightshow9.png"); }
.onpoint-light-hero--shot10 { --hero-art: url("https://oht2i9g1qy-staging.onrocket.site/wp-content/uploads/2026/07/COP_lightshow10.webp"); }

/* Shared light-layer behavior */
.onpoint-light-hero::before,
.onpoint-light-hero::after {
  content: "";
  position: absolute;
  bottom: -6%;
  width: 38%;
  height: 86%;
  z-index: 1;
  pointer-events: none;
  filter: blur(10px);
  mix-blend-mode: screen;
  transform-origin: 50% 100%;
  will-change: transform, opacity;
}

/* Subtle blue pulse (left source) */
.onpoint-light-hero::before {
  left: -7%;
  background:
    radial-gradient(ellipse 16% 88% at 50% 100%, rgba(73,222,255,.52) 0%, rgba(0,140,255,.22) 27%, rgba(0,86,235,.07) 56%, transparent 76%),
    radial-gradient(ellipse 75% 100% at 50% 100%, rgba(0,103,255,.18) 0%, rgba(0,58,180,.08) 42%, transparent 72%);
  animation: onpoint-blue-pulse 12s ease-in-out infinite;
}

/* Subtle gold pulse (right source) */
.onpoint-light-hero::after {
  right: -5%;
  background:
    radial-gradient(ellipse 16% 88% at 50% 100%, rgba(255,224,103,.48) 0%, rgba(255,169,38,.20) 27%, rgba(194,102,12,.06) 56%, transparent 76%),
    radial-gradient(ellipse 75% 100% at 50% 100%, rgba(255,151,28,.16) 0%, rgba(139,69,10,.07) 42%, transparent 72%);
  animation: onpoint-gold-pulse 13s ease-in-out infinite;
}

.onpoint-light-hero > .e-con-inner,
.onpoint-light-hero > .elementor-container,
.onpoint-light-hero > .e-div-block-base,
.onpoint-light-hero > .e-flexbox-base,
.onpoint-light-hero > .elementor-element,
.onpoint-light-hero > .elementor-widget {
  position: relative;
  z-index: 2;
}

@keyframes onpoint-blue-pulse {
  0%, 100% { opacity: .20; transform: scaleY(.985); }
  50% { opacity: .30; transform: scaleY(1.025); }
}
@keyframes onpoint-gold-pulse {
  0%, 100% { opacity: .18; transform: scaleY(.985); }
  50% { opacity: .27; transform: scaleY(1.025); }
}

@media (prefers-reduced-motion: reduce) {
  .onpoint-light-hero::before, .onpoint-light-hero::after { animation: none; transform: none; }
}

/* ===== Italics: ONLY inside H1 headers (Joe ruled 2026-07-25) ===== */
em, i, cite, dfn, var, address, .cop-accent-em,
.cop-body em, .cop-lead em, p em, li em, blockquote em,
.elementor-widget-text-editor em, .elementor-widget-text-editor i { font-style: normal; }
/* keep the accent italic only where it belongs: inside an H1 */
h1 em, h1 i, h1 cite, h1 .cop-accent-em,
.cop-h1 em, .cop-h1 i, .cop-h1 .cop-accent-em { font-style: italic; }

/* ===== Open Sans upright, self-declared (kills the Elementor italic-face collision; Joe 2026-07-25) ===== */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url('https://oht2i9g1qy-staging.onrocket.site/wp-content/uploads/2026/07/OpenSans-VariableFont_wdthwght.ttf') format('truetype');
}





/* ===== BEGIN single-post 2-col + TOC (2026-07-27) ===== */
.s-sp-layout, .e-con.s-sp-layout, .elementor .s-sp-layout{display:grid !important;grid-template-columns:minmax(0,1fr) 300px !important;gap:clamp(28px,4vw,56px) !important;align-items:start !important;width:100% !important;flex-direction:unset !important;}
.s-sp-main, .e-con.s-sp-main, .elementor .s-sp-main{min-width:0 !important;width:auto !important;max-width:100% !important;}
.s-sp-main, .e-con.s-sp-main, .elementor .s-sp-main > *{max-width:100%;}
.s-sp-aside, .e-con.s-sp-aside, .elementor .s-sp-aside{position:sticky !important;top:96px !important;align-self:start !important;width:auto !important;max-width:100% !important;}
@media (max-width:1024px){
  .s-sp-layout, .e-con.s-sp-layout, .elementor .s-sp-layout{grid-template-columns:1fr !important;}
  .s-sp-aside, .e-con.s-sp-aside, .elementor .s-sp-aside{position:static !important;top:auto !important;order:-1 !important;}
}
/* TOC card */
.s-sp-aside .elementor-widget-table-of-contents{width:100%;}
.s-sp-aside .elementor-widget-table-of-contents .elementor-widget-container{background:#FFFFFF;border:1px solid rgba(14,42,107,.12);border-radius:14px;overflow:hidden;box-shadow:0 6px 24px rgba(14,42,107,.07);}
.s-sp-aside .elementor-toc__header{background:#0E2A6B;border:0;padding:14px 18px;}
.s-sp-aside .elementor-toc__header-title{color:#FFFFFF;font-family:'Poppins',sans-serif;font-weight:600;font-size:15px;letter-spacing:.01em;margin:0;}
.s-sp-aside .elementor-toc__toggle-button i,.s-sp-aside .elementor-toc__toggle-button svg{color:#F5C518;fill:#F5C518;}
.s-sp-aside .elementor-toc__body{padding:16px 18px;max-height:min(70vh,620px);overflow-y:auto;}
.s-sp-aside .elementor-toc__list-wrapper{padding-left:1.1em;margin:0;}
.s-sp-aside .elementor-toc__list-item{margin:0 0 9px;}
.s-sp-aside .elementor-toc__list-item-text{color:#243352;font-family:'Open Sans',sans-serif;font-size:14.5px;line-height:1.5;text-decoration:none;border:0;}
.s-sp-aside .elementor-toc__list-item-text:hover,.s-sp-aside .elementor-toc__list-item-text-wrapper:hover{color:#0E2A6B;}
.s-sp-aside .elementor-item-active>.elementor-toc__list-item-text{color:#0E2A6B;font-weight:600;}
.s-sp-aside .elementor-toc__list-item .elementor-toc__list-wrapper{margin-top:8px;}
.s-sp-article .elementor-widget-author-box{border-top:1px solid rgba(14,42,107,.12);padding-top:28px;margin-top:12px;}
/* ===== END single-post 2-col + TOC ===== */


/* ===== BEGIN post authorbox + disclosure (2026-07-27) ===== */
.cop-authorbox{display:flex;gap:26px;align-items:flex-start;background:#FFFFFF;border:1px solid rgba(14,42,107,.12);border-radius:16px;padding:28px 30px;margin:36px 0 0;box-shadow:0 6px 24px rgba(14,42,107,.06);}
.cop-authorbox__media{flex:0 0 auto;display:flex;flex-direction:column;align-items:center;gap:12px;}
.cop-authorbox__img{width:124px;height:124px;border-radius:12px;object-fit:cover;display:block;}
.cop-authorbox__social{display:flex;gap:8px;}
.cop-authorbox__social a{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:50%;background:#0E2A6B;color:#FFFFFF;text-decoration:none;transition:background .15s ease,transform .15s ease;}
.cop-authorbox__social a:hover{background:#C79E50;transform:translateY(-1px);}
.cop-authorbox__body{min-width:0;}
.cop-authorbox__kicker{font-family:'Poppins',sans-serif;font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:#7A879F;margin:0 0 4px;}
.cop-authorbox__name{font-family:'Poppins',sans-serif;font-size:19px;font-weight:700;color:#0E2A6B;margin:0 0 12px;letter-spacing:-0.01em;}
.cop-authorbox__bio{font-family:'Open Sans',sans-serif;font-size:15px;line-height:1.65;color:#3A4761;margin:0;}
.cop-disclosure{background:#F1F5FA;border:1px solid rgba(14,42,107,.10);border-radius:12px;padding:16px 20px;margin:22px 0 0;}
.cop-disclosure p{font-family:'Open Sans',sans-serif;font-size:13px;line-height:1.6;color:#5A6880;margin:0;}
.cop-disclosure strong{color:#0E2A6B;}
.cop-disclosure a{color:#0E2A6B;text-decoration:underline;}
@media (max-width:640px){ .cop-authorbox{flex-direction:column;gap:18px;padding:22px;} .cop-authorbox__media{flex-direction:row;gap:16px;align-items:center;} .cop-authorbox__img{width:88px;height:88px;} }
/* ===== END post authorbox + disclosure ===== */


/* BEGIN beam-on-imgband clip fix (2026-08-01) */
/* .cop-imgband sets overflow:hidden, which clips .cop-beam::before at inset:-2px.
   When both are on the same element, draw the ring just inside the edge instead.
   Tripled selector + !important per the Elementor v4 atomic-container rule. */
.cop-beam.cop-imgband::before,
.e-con.cop-beam.cop-imgband::before,
.elementor .cop-beam.cop-imgband::before {
  inset: 0 !important;
  border-radius: inherit !important;
  z-index: 2 !important;
}
/* keep the ring above the image scrim, which sets its own stacking context */
.cop-imgband.cop-beam > :not(.cop-imgband__bg) { position: relative; z-index: 3; }
/* END beam-on-imgband clip fix */
