/* Shared presentation; reference pages retain their established design. */
body.visual-refresh { --bg:#fff; --bg-alt:#f3f5f9; --card-bg:#fff; --text:#17233b; --text-light:#536078; --text-muted:#536078; --muted:#536078; --line:#dde3ee; --border:#dde3ee; --border-light:#e8ecf3; background:#fff!important; -webkit-font-smoothing:antialiased; }
.visual-refresh :is(h1,h2,h3) { word-break:keep-all; overflow-wrap:anywhere; text-wrap:balance; letter-spacing:-.045em; }
.visual-refresh :is(p,li,dd) { word-break:keep-all; overflow-wrap:anywhere; }
.visual-refresh :is(.section,.answer-section,.about-section,.lxp-section) { padding-block:clamp(48px,6vw,88px); }
.visual-refresh :is(.section-inner,.wrap,.cobs-visual-inner) { max-width:1200px; }
.visual-refresh :is(.section h2,.section-title,.answer-heading h2,.about-section h2,.lxp-section h2) { font-size:clamp(1.75rem,3.2vw,2.8rem); line-height:1.25; }
.visual-refresh :is(.lead,.section-desc) { max-width:740px; font-size:clamp(1rem,1.25vw,1.125rem); line-height:1.7; }
.visual-refresh :is(.kicker,.section-label) { font-size:.75rem; font-weight:700; letter-spacing:.08em; }
body.visual-refresh :is(.hero:not(.edu-hero),.about-intro) { background:#f5f7fc!important; }
body.visual-refresh :is(.hero:not(.edu-hero),.about-intro)::before { background:none!important; }
body.visual-refresh :is(.section.band,.about-values) { background:#f3f5f9!important; }
.visual-refresh .motion-section-line,.visual-refresh .motion-section-head::after { display:none; }
.visual-refresh :is(.hero h1,.lxp-hero h1) { font-size:clamp(2.15rem,4.5vw,4.25rem); line-height:1.18; }
.visual-refresh :is(.hero .wrap,.lxp-shell,.story-shell) { min-width:0; }
.visual-refresh .hero { padding-block:clamp(112px,10vw,152px) clamp(48px,6vw,80px); }
body.visual-refresh :is(.intro-card,.program-card,.detail-deliverable,.service-card) { border-radius:14px; box-shadow:none; background:#fff!important; }
.visual-refresh .intro-grid { gap:0; border-block:1px solid #dce3ed; }
.visual-refresh .intro-card { border:0; border-radius:0; padding:26px 24px; background:transparent!important; }
.visual-refresh .intro-card + .intro-card { border-left:1px solid #dce3ed; }
.visual-refresh .intro-card p { font-size:.9375rem; line-height:1.7; }
.visual-refresh :is(.answer-list,.faq) { gap:0; }
.visual-refresh .answer-item { border:0; border-bottom:1px solid #dce3ed; border-radius:0; background:transparent!important; box-shadow:none; }
.visual-refresh .answer-item summary { padding-block:22px; }
.visual-refresh .topic-links { gap:0; }
.visual-refresh .topic-links a { border-radius:0; box-shadow:none; }
.visual-refresh .edu-hero { background:#f2f5fc!important; }
.visual-refresh .edu-hero .hero-grid { grid-template-columns:1.12fr .88fr; gap:56px; }
.visual-refresh .edu-hero .hero-panel { position:relative; overflow:hidden; padding:0; border:0; background:#fff!important; border-radius:16px; box-shadow:0 20px 60px -35px #24395f; }
.visual-refresh .edu-hero .hero-panel::before { content:''; display:block; height:220px; background:url('/assets/images/cobslab-education-workshop-wide-2026.webp') center/cover; }
.visual-refresh .edu-hero .panel-row { margin:0 24px; padding:14px 0; }
.visual-refresh .edu-hero .panel-row:last-child { border-bottom:0; }
.visual-refresh .edu-hero .proof-row { margin-top:28px; }
.visual-refresh .edu-photo-grid { gap:16px; }
.visual-refresh .edu-photo { border-radius:14px; }
.visual-refresh .detail-scope { grid-template-columns:.85fr 1.15fr; padding-bottom:28px; border-bottom:1px solid #dde3ee; }
.visual-refresh .detail-scope p { margin-top:0; }
.visual-refresh .detail-note { border-radius:0 12px 12px 0; font-size:.9375rem; }
.visual-refresh .detail-deliverables { margin-top:0; }
.visual-refresh.detail-page .hero .wrap { position:relative; }
.visual-refresh.detail-page .hero .kicker { color:#2457d6; }
.visual-refresh.detail-page .hero .lead { max-width:700px; }
.visual-refresh .detail-steps { gap:0; counter-reset:detail-step; }
.visual-refresh .detail-steps li { position:relative; padding:28px; border-top:1px solid #ccd7e7; }
.visual-refresh .detail-steps li + li { border-left:1px solid #dce3ed; }
.visual-refresh .detail-steps li::before { counter-increment:detail-step; content:'0' counter(detail-step); display:block; margin-bottom:22px; color:#2457d6; font-size:2.75rem; font-weight:700; letter-spacing:-.05em; }
.visual-refresh .detail-steps b { font-size:1.125rem; }
.visual-refresh .detail-steps p { font-size:.9375rem; }
.visual-refresh .visual-tabs { display:flex; flex-wrap:wrap; gap:8px; margin:28px 0 20px; }
.visual-refresh .visual-tabs button { min-height:48px; padding:12px 18px; border:1px solid #d8dfeb; border-radius:8px; background:#fff; color:#42516b; font:inherit; font-size:.9375rem; font-weight:650; cursor:pointer; transition:background .2s,color .2s; }
.visual-refresh .visual-tabs button[aria-selected=true] { background:#1d4ed8; color:#fff; border-color:#1d4ed8; }
.visual-refresh .visual-tabs button:focus-visible,.visual-refresh [role=tabpanel]:focus-visible { outline:3px solid #3e7dee; outline-offset:4px; }
.visual-refresh .visual-tab-panels { display:block; }
body.visual-refresh .visual-tab-panels > [data-visual-panel] { position:relative; display:grid; grid-template-columns:1fr 1fr; column-gap:48px; padding:clamp(24px,4vw,48px); min-height:260px; border:1px solid #dce3ed; border-radius:16px; background:#fff!important; box-shadow:none!important; transform:none!important; }
.visual-refresh .visual-tab-panels > [data-visual-panel] > :is(.pill,small,h3,p,.program-detail) { grid-column:1; }
.visual-refresh .visual-tab-panels > [data-visual-panel] > ul { grid-column:2; grid-row:1 / span 5; align-self:stretch; display:flex; flex-direction:column; justify-content:center; gap:16px; margin:0; padding:28px 32px; border-radius:12px; background:#eef3ff; color:#244895; list-style-position:inside; }
.visual-refresh .visual-tab-panels > [data-visual-panel] h3 { font-size:clamp(1.5rem,2.4vw,2rem); margin:16px 0; }
.visual-refresh .visual-tab-panels > [data-visual-panel] p { line-height:1.8; color:#536078; }
body.visual-refresh .detail-deliverables.visual-tab-panels > [data-visual-panel] { min-height:190px; grid-template-columns:80px .85fr 1.15fr; align-items:center; gap:28px; }
.visual-refresh .detail-deliverables.visual-tab-panels > [data-visual-panel] small { grid-column:1; font-size:3rem; color:#9bb1e5; }
.visual-refresh .detail-deliverables.visual-tab-panels > [data-visual-panel] h3 { grid-column:2; font-size:1.5rem; }
.visual-refresh .detail-deliverables.visual-tab-panels > [data-visual-panel] p { grid-column:3; margin:0; }
.visual-refresh [data-visual-panel]:not([hidden]),.visual-refresh [data-visual-panel]:not([hidden]) :is(.motion-enter,.reveal) { opacity:1!important; translate:none!important; clip-path:none!important; }
body.visual-refresh [data-visual-panel][hidden] { display:none!important; }
body.visual-refresh .scroll-story { padding:clamp(48px,6vw,88px) 0; background:#101e38!important; }
.visual-refresh .scroll-story > .story-intro { width:min(1180px,calc(100% - 40px)); margin:0 auto 28px; }
.visual-refresh .scroll-story > .story-intro h2 { max-width:760px; font-size:clamp(1.7rem,3vw,2.6rem)!important; }
.visual-refresh .story-tabs { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:0; width:min(1180px,calc(100% - 40px)); margin:0 auto 32px; border-bottom:1px solid #435069; }
.visual-refresh .story-tabs button { display:flex; gap:14px; align-items:center; min-height:62px; border:0; border-bottom:3px solid transparent; padding:12px 14px; background:none; color:#bbc8df; font:inherit; font-size:.9375rem; font-weight:650; cursor:pointer; }
.visual-refresh .story-tabs button span { font-size:.75rem; opacity:.65; }
.visual-refresh .story-tabs button[aria-selected=true] { color:#fff; border-bottom-color:#75b5ff; background:#1c3150; }
.visual-refresh .story-tabs button:focus-visible { outline:3px solid #83b7ff; outline-offset:-4px; }
.visual-refresh .story-interactive .story-shell { grid-template-columns:.9fr 1.1fr; align-items:center; gap:clamp(28px,6vw,72px); }
.visual-refresh .story-interactive .story-visual { position:relative; top:auto; min-height:350px; padding:24px; border-radius:16px; box-shadow:none; }
.visual-refresh .story-interactive .story-canvas { min-height:240px; }
.visual-refresh .story-interactive .story-ring { width:190px; height:190px; }
.visual-refresh .story-interactive .story-core { width:120px; }
.visual-refresh .story-interactive .story-satellite { min-width:88px; padding:9px; }
.visual-refresh .story-interactive .story-copy { padding-bottom:0; min-width:0; }
body.visual-refresh .story-interactive .story-step { min-height:0; padding:20px 0; border:0; opacity:1; transform:none; }
.visual-refresh .story-interactive .story-step h3 { font-size:clamp(1.5rem,2.5vw,2.125rem); }
body.visual-refresh .story-step[hidden] { display:none!important; }
.visual-refresh .story-interactive .story-step:focus-visible { outline:3px solid #83b7ff; outline-offset:8px; }
@media (prefers-reduced-motion:no-preference) {
  .visual-refresh .story-step.is-active,.visual-refresh [data-visual-panel]:not([hidden]) { animation:visual-panel-enter .25s ease-out both; }
  @keyframes visual-panel-enter { from { opacity:.4; transform:translateY(6px); } to { opacity:1; transform:translateY(0); } }
}
@media (max-width:900px) {
  .visual-refresh .edu-hero .hero-grid { grid-template-columns:1fr; gap:32px; }
  .visual-refresh .edu-hero .hero-panel { max-width:680px; }
  .visual-refresh .intro-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .visual-refresh .intro-card:nth-child(3) { border-left:0; }
  .visual-refresh .intro-card:nth-child(n+3) { border-top:1px solid #dce3ed; }
  .visual-refresh .story-interactive .story-shell { grid-template-columns:.9fr 1.1fr; gap:24px; }
  .visual-refresh .story-interactive .story-visual { padding:18px; }
  .visual-refresh .story-interactive .story-satellite { font-size:.65rem; min-width:74px; }
}
@media (max-width:640px) {
  .visual-refresh :is(.section,.answer-section,.about-section,.lxp-section) { padding-block:48px; }
  .visual-refresh .hero { padding-top:106px; padding-bottom:44px; }
  .visual-refresh .intro-grid,.visual-refresh .detail-scope { grid-template-columns:1fr; }
  .visual-refresh .intro-card + .intro-card { border-left:0; border-top:1px solid #dce3ed; }
  .visual-refresh .intro-card { padding:22px 0; }
  .visual-refresh .detail-scope { gap:20px; }
  .visual-refresh .visual-tabs { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
  .visual-refresh .visual-tabs button { padding:12px 10px; font-size:.8125rem; }
  body.visual-refresh .visual-tab-panels > [data-visual-panel] { display:block; min-height:0; padding:24px; }
  .visual-refresh .visual-tab-panels > [data-visual-panel] > ul { margin:24px 0 0; padding:22px; }
  body.visual-refresh .detail-deliverables.visual-tab-panels > [data-visual-panel] { display:block; min-height:0; }
  .visual-refresh .detail-steps { grid-template-columns:1fr; }
  .visual-refresh .detail-steps li { padding:24px 0 24px 58px; }
  .visual-refresh .detail-steps li + li { border-left:0; }
  .visual-refresh .detail-steps li::before { position:absolute; left:0; top:24px; font-size:2rem; }
  .visual-refresh .story-tabs { grid-template-columns:repeat(2,minmax(0,1fr)); margin-bottom:24px; }
  .visual-refresh .story-tabs button { min-height:54px; font-size:.8125rem; gap:10px; }
  .visual-refresh .story-interactive .story-shell { grid-template-columns:1fr; gap:8px; }
  .visual-refresh .story-interactive .story-visual { min-height:0; padding:18px 20px; }
  .visual-refresh .story-interactive .story-canvas { min-height:150px; transform:none; }
  .visual-refresh .story-interactive .story-ring { width:130px; height:130px; }
  .visual-refresh .story-interactive .story-core { width:100px; font-size:.875rem; }
  .visual-refresh .story-interactive .story-satellite { font-size:.6875rem; padding:6px; }
  .visual-refresh .story-interactive .story-step { padding:22px 0 0; }
}
/* These scale rules supersede the older desktop-only editorial overrides. */
body.visual-refresh:not(.cases-page) :is(.section h2,.section-title,.about-section h2,.lxp-section h2) { font-size:clamp(1.75rem,3.2vw,2.8rem)!important; line-height:1.25!important; }
body.visual-refresh:not(.cases-page) .hero h1 { font-size:clamp(2.15rem,4.5vw,4.25rem)!important; line-height:1.18!important; }
body.visual-refresh :is(.lead,.section-desc) { font-size:clamp(1rem,1.25vw,1.125rem)!important; line-height:1.7!important; }
