.insights-hub { background: #fff; }
.hub-shell { width: min(1180px, calc(100% - 64px)); margin-inline: auto; }
/* The hero follows the supplied KAINDLY layout; the finder remains fully interactive. */
.hub-hero { position: relative; isolation: isolate; overflow: hidden; background: linear-gradient(125deg, #f3efff 0%, #e7dfff 49%, #d3c6fa 100%); padding: clamp(64px, 6.6vw, 136px) 0; }
.hub-hero::before { content: ""; position: absolute; z-index: -1; inset: -22% -3% -28%; background: url("../brand/icon-violet.svg") center / 100% auto no-repeat; opacity: .055; filter: blur(5px); pointer-events: none; }
.hub-hero-grid { width: min(1760px, calc(100% - 15.3%)); display: grid; grid-template-columns: 1.3fr 1fr; align-items: center; gap: clamp(48px, 8vw, 164px); }
.hub-kicker { font: 500 .74rem var(--font-accent); text-transform: uppercase; letter-spacing: .13em; color: #5a439e; margin-bottom: 24px; }
.hub-hero h1 { color: var(--violet); font-size: clamp(3.6rem, 4.7vw, 6rem); line-height: .92; font-weight: 700; letter-spacing: -.035em; margin: 0 0 34px; }
.hub-hero h1 em { color: var(--periwinkle, #8c6efc); font-family: var(--font-accent); font-weight: 300; white-space: nowrap; }
.hub-intro { max-width: min(610px, 31vw); font-size: clamp(1.25rem, 1.55vw, 2rem); line-height: 1.27; color: #38353d; }
.hub-hero-links { display: flex; flex-wrap: wrap; gap: 16px; align-items: center; margin-top: 42px; }
.hub-link { color: #513aa5; text-underline-offset: 5px; font-size: .95rem; }
button.hub-link { border: 0; padding: 0; cursor: pointer; background: none; text-decoration: underline; }
.hub-hero-links .hub-link { display: inline-flex; align-items: center; justify-content: center; gap: 12px; min-height: 54px; padding: 14px clamp(18px, 2vw, 42px); border: 1px solid var(--violet); border-radius: 5px; font-size: clamp(1rem, 1.35vw, 1.75rem); font-weight: 600; line-height: 1.25; text-decoration: none; }
.hub-hero-links .hub-hero-primary { color: #fff; background: var(--violet); }
.hub-hero-links .hub-hero-secondary { color: var(--violet); background: #fff; }
.hub-hero-primary:hover { background: #513aa5; }
.hub-hero-secondary:hover { background: #f6f2ff; }
.finder { background: #fff; border: 1px solid #f4f0ff; border-radius: 6px; padding: clamp(28px, 2.3vw, 48px); min-width: 0; box-shadow: 0 18px 65px #634cc808; }
.finder-progress { display: flex; align-items: center; justify-content: space-between; gap: 16px; font: 500 clamp(.72rem, .8vw, 1rem) var(--font-accent); text-transform: uppercase; letter-spacing: .15em; color: #7658df; margin-bottom: 24px; }
.finder-track { display: block; width: 64px; height: 4px; flex-shrink: 0; border-radius: 4px; overflow: hidden; background: #eeecf1; }
.finder-track > span { display: block; width: 33.333%; height: 100%; background: var(--violet); }
[data-finder-stage="goal"] .finder-track > span { width: 66.667%; }
[data-finder-stage="result"] .finder-track > span { width: 100%; }
.finder h2 { color: var(--violet); font-weight: 700; font-size: clamp(1.85rem, 2.1vw, 2.7rem); line-height: 1.1; letter-spacing: -.025em; margin-bottom: 5px; }
.finder-intro { color: #757575; font-size: clamp(1.05rem, 1.35vw, 1.75rem); line-height: 1.3; margin-bottom: 24px; }
.finder fieldset { border: 0; margin: 0; padding: 0; min-width: 0; }
.finder legend { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.finder-options { display: grid; gap: 10px; }
.finder-choice { position: relative; display: flex; gap: 16px; align-items: center; padding: clamp(13px, 1vw, 21px) clamp(16px, 1.2vw, 25px); border: 1px solid #dcd9e2; border-radius: 5px; cursor: pointer; transition: border-color 120ms, background 120ms; }
.finder-choice:hover { background: #f8f6fc; border-color: #ad9ad5; }
.finder-choice:has(input:checked) { background: #f0ebfc; border-color: #634cc8; box-shadow: inset 0 0 0 1px #634cc8; }
.finder-choice:has(input:focus-visible) { outline: 3px solid #8c6efc; outline-offset: 3px; }
.finder-choice input { accent-color: #634cc8; width: 18px; height: 18px; flex-shrink: 0; margin: 0; }
.finder-choice strong { display: block; font-size: clamp(.95rem, 1.25vw, 1.6rem); font-weight: 700; line-height: 1.3; color: #303030; }
.finder-choice small { display: block; font-size: clamp(.85rem, 1.08vw, 1.4rem); line-height: 1.35; color: #757575; margin-top: 2px; }
.finder-footer { display: flex; align-items: center; justify-content: space-between; gap: 15px; margin-top: 24px; }
.finder-footer .button { margin-left: auto; font-family: var(--font-body); font-size: clamp(.95rem, 1.2vw, 1.55rem); letter-spacing: 0; border-radius: 5px; padding: 10px 20px; }
.finder .button:disabled { background: #b9ace9; color: #fff; border-color: #b9ace9; cursor: default; transform: none; box-shadow: none; }
.finder-note { color: #76717c; font-size: clamp(.85rem, 1.05vw, 1.35rem); line-height: 1.35; margin: 18px 0 0; }
.finder-result-title { font-size: 2.15rem !important; color: #634cc8 !important; margin-top: 12px; }
.finder-result-reason { font-size: .98rem; line-height: 1.6; color: #5e536c; }
.finder-result-label { font: 500 .7rem var(--font-accent); text-transform: uppercase; letter-spacing: .1em; color: #4f3c86; }
.finder-result-actions { display: grid; gap: 10px; margin: 24px 0; }
.finder-result-actions .hub-link { text-align: center; margin-top: 4px; }
.finder-selections { border-top: 1px solid #e6deef; padding-top: 18px; font-size: .75rem; color: #726779; margin-bottom: 12px; }
.hub-status { margin: 0; color: #5a4882; font-size: .8rem; }
.hub-status:not(:empty) { padding: 12px 0; }
.hub-section { padding: 80px 0; scroll-margin-top: 100px; }
.hub-section-top { display: flex; align-items: end; justify-content: space-between; gap: 36px; margin-bottom: 35px; }
.hub-section-top h2 { font-size: clamp(2.1rem, 4vw, 3.3rem); font-weight: 500; line-height: 1.08; color: #2d263e; margin-bottom: 12px; }
.hub-section-top p { margin-bottom: 0; color: #6a6073; max-width: 640px; font-size: 1.05rem; }
.hub-section-top .hub-kicker { color: #5a439e; font-size: .74rem; margin-bottom: 17px; }
.hub-section-top { margin-bottom: 52px; }
.hub-section-top .hub-kicker { font-size: .85rem; letter-spacing: .14em; font-weight: 500; color: var(--violet); }
.hub-section-top p { max-width: 740px; font-size: clamp(1.15rem, 1.7vw, 1.5rem); line-height: 1.4; color: #757575; }
.case-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; }
.case-card { border: 1px solid #dcd4e6; border-radius: 6px; overflow: hidden; display: flex; flex-direction: column; }
.case-art { color: #fff; aspect-ratio: 1.53; min-height: 360px; padding: 28px; display: flex; flex-direction: column; justify-content: space-between; position: relative; isolation: isolate; background-size: cover; background-position: center; }
.case-art::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, #180d301a 20%, #190d35b8 100%); }
.case-art--readiness { background-image: url("../images/report-design/readiness-cover.png"); }
.case-art--fluency { background-image: url("../images/report-design/fluency-cover.jpg"); }
.case-art-top { display: flex; align-items: center; justify-content: space-between; font: 500 .7rem var(--font-accent); text-transform: uppercase; letter-spacing: .15em; gap: 14px; }
.case-art-top img { width: 36px; height: 36px; }
.case-art-evidence { padding-top: 48px; padding-bottom: 20px; }
.case-stat { display: flex; flex-direction: column; gap: 10px; }
.case-stat strong { font: 700 clamp(4.5rem, 6.4vw, 6rem)/.95 var(--font-heading); letter-spacing: -.035em; }
.case-stat span { font-size: clamp(1.2rem, 1.7vw, 1.5rem); max-width: 310px; line-height: 1.3; }
.case-art small { display: block; font-size: .95rem; margin-top: 14px; color: #e0d8ec; }
.case-guidance-toggle { position: absolute; right: 18px; bottom: 12px; padding: 6px 10px; border: 1px solid #ffffff80; border-radius: 4px; background: #1b103ac9; color: #fff; font: 500 .72rem var(--font-body); cursor: pointer; }
.case-guidance-toggle:hover, .case-guidance-toggle[aria-expanded="true"] { background: var(--violet); }
.case-guidance { position: absolute; z-index: 1; left: 18px; right: 18px; bottom: 50px; margin: 0; padding: 22px; border: 1px solid #ffffff70; border-radius: 5px; background: #251744f5; box-shadow: 0 12px 28px #0a051a40; color: #fff; font-size: 1.12rem; line-height: 1.5; }
.case-guidance strong { display: block; color: #d4f489; font-size: 1.2rem; margin-bottom: 6px; }
.case-body { padding: 28px; display: flex; flex-direction: column; flex: 1; }
.case-category { font: 500 .8rem var(--font-accent); letter-spacing: .07em; text-transform: uppercase; color: var(--violet); margin-bottom: 10px; }
.case-body h3 { font-size: clamp(1.7rem, 2.45vw, 2.2rem); font-weight: 700; line-height: 1.1; margin-bottom: 12px; }
.case-body > p:not(.case-category) { color: #38353d; font-size: 1.15rem; line-height: 1.4; }
.case-actions { display: flex; gap: 20px; flex-wrap: wrap; align-items: center; margin-top: auto; padding-top: 12px; }
.case-actions .button { font-family: var(--font-body); font-size: 1rem; letter-spacing: 0; padding: 12px 20px; }
.case-actions .hub-link { font-size: 1rem; font-weight: 600; text-decoration: none; }
.case-actions .hub-link:hover { text-decoration: underline; }
.hub-bundle { margin-top: 28px; padding: 26px 30px; border: 1px solid #d8cee6; background: #f7f3fd; border-radius: 6px; display: flex; justify-content: space-between; align-items: center; gap: 26px; }
.hub-bundle h3 { color: #392c50; font-size: 1.5rem; font-weight: 500; line-height: 1.2; margin-bottom: 7px; }
.hub-bundle p { font-size: .92rem; color: #685b75; margin: 0; max-width: 690px; }
.hub-bundle .button { flex-shrink: 0; }
.hub-connect { background: #302144; color: #fff; padding: 68px 0; }
.hub-connect-grid { display: grid; grid-template-columns: 1.25fr 1fr; gap: 90px; align-items: center; }
.hub-connect .hub-kicker { color: #d1c1f2; }
.hub-connect h2 { font-size: clamp(2.4rem, 4.7vw, 4rem); line-height: 1.06; font-weight: 500; color: #fff; margin-bottom: 20px; }
.hub-connect p { color: #d7cde4; max-width: 570px; }
.hub-connect .button { background: #dcf3a6; border-color: #dcf3a6; color: #28351d; margin-top: 12px; }
.connect-list { padding: 0; list-style: none; margin: 0; }
.connect-list li { padding: 18px 0; border-top: 1px solid #5d4a72; display: grid; grid-template-columns: 28px 1fr; gap: 18px; }
.connect-list li > span { font: 500 .75rem var(--font-accent); color: #bba2e0; padding-top: 4px; }
.connect-list strong { display: block; font-weight: 500; font-size: 1.08rem; margin-bottom: 4px; }
.connect-list small { color: #c6b8d5; font-size: .85rem; }
.hub-publication { display: grid; grid-template-columns: 1fr 1fr; gap: 60px; padding: 56px 0; align-items: center; }
.hub-publication h2 { font-size: 2rem; line-height: 1.15; color: #34273f; font-weight: 500; margin-bottom: 12px; }
.hub-publication p { color: #685c73; font-size: .95rem; margin: 0; max-width: 530px; }
.hub-publication > div:last-child { justify-self: end; }
.hub-publication small { display: block; margin-top: 12px; font-size: .75rem; color: #786b82; }
.hub-lead-dialog { width: min(620px, calc(100% - 32px)); }
.lead-context { font-size: .78rem !important; padding: 12px 14px; border-left: 3px solid #b79ce4; background: #f7f3fb; color: #625171; }
.lead-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 0 18px; }
.lead-context-fields { border-top: 1px solid #e4daed; border-bottom: 1px solid #e4daed; padding: 6px 0 12px; margin-top: 12px; }
.lead-context-fields summary { padding: 10px 0; cursor: pointer; color: #59407e; font-size: .9rem; font-weight: 600; }
.lead-context-fields label { font-size: .83rem !important; }
.lead-context-fields select, .lead-context-fields textarea { width: 100%; min-height: 46px; border: 1px solid #a99ab8; border-radius: 4px; padding: 9px; margin-top: 6px; color: #302639; background: #fff; font: inherit; font-size: .9rem; }
.lead-context-fields textarea { min-height: 90px; resize: vertical; }
.lead-context-fields > p { color: #72627e; font-size: .78rem; margin: 10px 0 0; }
.lead-purpose { font-size: .78rem !important; color: #6a5e75; margin: 16px 0 0; }
.success-report { padding: 18px; border: 1px solid #ded3e9; border-radius: 4px; margin-bottom: 12px; }
.success-report p { font-size: 1rem; font-weight: 600; color: #4c3573; margin-bottom: 12px; }
.success-report a { display: inline-block; color: #51358c; font-size: .86rem; margin: 0 16px 5px 0; text-underline-offset: 3px; }
@media (max-width: 1000px) { .hub-hero-grid { gap: 35px; } .hub-connect-grid { gap: 40px; } .hub-shell { width: calc(100% - 48px); } .hub-hero-grid { grid-template-columns: 1.1fr 1fr; } .hub-hero h1 { font-size: 3.6rem; } }
@media (max-width: 760px) { .hub-hero-grid { grid-template-columns: 1fr; gap: 38px; } .hub-hero h1 { font-size: clamp(3rem, 10vw, 4.8rem); } .hub-hero::before { inset: 0 -70%; background-size: auto 100%; } .hub-hero { padding: 44px 0; } .hub-hero-links { margin-top: 28px; } .hub-intro { max-width: 580px; } .hub-section { padding: 50px 0; } .hub-section-top { align-items: start; flex-direction: column; gap: 12px; } .case-grid { grid-template-columns: 1fr; } .hub-connect-grid { grid-template-columns: 1fr; gap: 35px; } .hub-bundle { align-items: start; flex-direction: column; } .hub-publication { grid-template-columns: 1fr; gap: 24px; } .hub-publication > div:last-child { justify-self: start; } }
@media (max-width: 440px) { .hub-shell { width: calc(100% - 36px); } .finder { padding: 22px 18px; } .hub-intro { font-size: 1.12rem; } .finder-choice { padding: 12px; } .finder-choice strong { font-size: .87rem; } .case-body, .case-art { padding: 24px; } .case-stat strong { font-size: 4.7rem; } .case-stat span { font-size: 1.18rem; } .case-art { min-height: 370px; } .case-art small { font-size: .82rem; } .case-guidance { font-size: 1rem; padding: 18px; } .lead-fields { grid-template-columns: 1fr; } .hub-lead-dialog { padding: 24px; } .case-actions .button { width: 100%; } .hub-hero-links { gap: 12px; } .hub-hero-links .hub-link { width: 100%; } .finder h2 { font-size: 1.7rem; } .finder-footer .button { padding-inline: 12px; } }
@media (prefers-reduced-motion: reduce) { .finder-choice { transition: none; } }