/* CentreVisa case study. Scoped to preserve the shared site and existing cases. */
.centrevisa-page { background: #fff; }
.cv-case { --cv-ink: #191620; --cv-purple: #713bc2; --cv-muted: #655f70; color: var(--cv-ink); padding: 20px 0 72px; }
.cv-case *, .cv-case *::before, .cv-case *::after { box-sizing: border-box; }
/* The case shares the header container, including its responsive gutters. */
.cv-case .breadcrumb { margin-bottom: 26px; flex-wrap: wrap; row-gap: 8px; }
.cv-case p { font-size: 17px; line-height: 1.75; margin: 0 0 20px; }
.cv-case h2 { font-size: clamp(30px, 3.6vw, 48px); font-weight: 600; line-height: 1.12; letter-spacing: -.045em; margin: 0 0 28px; }
.cv-case h3 { font-size: 22px; font-weight: 600; line-height: 1.25; margin: 0 0 12px; }
.cv-case em { color: var(--cv-purple); font-style: normal; }
.cv-case a { color: inherit; }
.cv-case .breadcrumb__link--current { color: #9581ed; }
.cv-case .cv-eyebrow { font-size: 13px; line-height: 1.5; font-weight: 600; letter-spacing: .11em; text-transform: uppercase; margin-bottom: 26px; }
.cv-skip { position: fixed; top: -100px; left: 20px; padding: 16px; background: #fff; color: #321250; z-index: 9999; }
.cv-skip:focus { top: 16px; }
.cv-case a:focus-visible,.cv-case button:focus-visible { outline: 3px solid #9861e9; outline-offset: 6px; }
.cv-hero { position: relative; display: grid; grid-template-columns: 1.12fr 1fr; background: #17131e; color: #fff; border-radius: 30px; overflow: hidden; padding: 58px 50px 0; isolation: isolate; }
.cv-hero::before { content: ''; position: absolute; inset: 0; z-index: -1; background: radial-gradient(ellipse at 85% 55%, #6e399957, transparent 52%); }
.cv-hero-copy { padding: 0 0 60px; position: relative; z-index: 2; }
.cv-dot { display: inline-block; width: 8px; height: 8px; background: #c7a6ff; border-radius: 50%; margin-right: 8px; vertical-align: 1px; }
.cv-tags { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 35px; }
.cv-tags span { font-size: 12px; line-height: 1.4; border: 1px solid #ffffff30; color: #ded4eb; border-radius: 99px; padding: 8px 12px; }
.cv-case .project-title { color: #fff; font-size: clamp(38px,4.1vw,58px); font-weight: 600; letter-spacing: -.055em; line-height: 1.06; margin: 0 0 28px; }
.cv-hero em { color: #cdaaff; }
.cv-case .cv-lead { max-width: 510px; font-size: 18px; color: #d3cadc; line-height: 1.7; margin-bottom: 30px; }
.cv-text-link { display: inline-flex; align-items: center; gap: 30px; font-size: 15px; border-bottom: 1px solid #9f84b5; padding-bottom: 9px; text-decoration: none; }
.cv-text-link span { font-size: 24px; }
.cv-hero-visual { display: flex; position: relative; align-items: flex-start; justify-content: center; gap: 16px; padding: 16px 0 60px 32px; min-width: 0; }
.cv-screen { display: block; min-width: 0; transition: transform .25s ease; }
.cv-screen img { display: block; width: 100%; height: auto; }
.cv-hero-visual .cv-screen { width: 46%; max-width: 220px; filter: drop-shadow(0 20px 30px #09050e60); }
.cv-screen-home { transform: rotate(-7deg); }
.cv-screen-requests { transform: translateY(58px) rotate(7deg); }
.cv-visual-label { position: absolute; bottom: 10px; left: 40px; color: #bfaacf; font-size: 12px; line-height: 1.5; }
.cv-hero-bottom { grid-column: 1/-1; display: flex; justify-content: space-between; gap: 16px; border-top: 1px solid #ffffff24; padding: 22px 0; color: #bdadce; font-size: 12px; line-height: 1.5; margin-top: 12px; }
.cv-summary { display: grid; grid-template-columns: repeat(3,1fr); border-bottom: 1px solid #e9e5ed; padding: 38px 0; gap: 28px; }
.cv-summary>div { position: relative; padding-left: 48px; }
.cv-summary>div+div { border-left: 1px solid #e9e5ed; padding-left: 68px; }
.cv-summary-sign { position: absolute; left: 0; top: 4px; color: #8c66b6; font-size: 13px; }
.cv-summary>div+div .cv-summary-sign { left: 20px; }
.cv-summary strong { display: block; font-size: 20px; font-weight: 600; margin-bottom: 8px; }
.cv-summary p { font-size: 14px; color: var(--cv-muted); margin: 0; line-height: 1.6; }
.cv-section { margin: 110px 0; }
.cv-intro { display: grid; grid-template-columns: 1fr 2fr; gap: 80px; padding: 0 32px; }
.cv-intro>div { max-width: 780px; }
.cv-intro p:not(.cv-eyebrow) { color: var(--cv-muted); }
.cv-intro .cv-pullquote { color: var(--cv-ink)!important; font-size: 24px; line-height: 1.45; font-weight: 500; padding-left: 26px; border-left: 3px solid #9a6ce0; margin: 36px 0 0; }
.cv-flow-section { background: #f6f3fa; border: 1px solid #eee6f7; padding: 58px 40px 30px; border-radius: 28px; scroll-margin-top: 35px; }
.cv-section-top { max-width: 740px; }
.cv-solution-figure { margin: 30px 0 0; }
.cv-solution-figure a { display: block; border-radius: 20px; overflow: hidden; }
.cv-solution-figure img { display: block; width: 100%; height: auto; }
.cv-solution-figure figcaption { margin-top: 20px; color: #554b61; font-size: 16px; line-height: 1.65; }
.cv-solution-figure figcaption span { display: block; margin-top: 6px; font-size: 13px; color: #70647b; }
.cv-section-top>p:not(.cv-eyebrow) { color: var(--cv-muted); max-width: 640px; }
.cv-feature { display: grid; grid-template-columns: .9fr 1.1fr; gap: 70px; align-items: center; }
.cv-feature-copy { padding: 0 0 0 32px; }
.cv-feature-copy>p:not(.cv-eyebrow) { color: var(--cv-muted); }
.cv-benefit { margin-top: 30px; border-top: 1px solid #e6dfed; padding-top: 22px; }
.cv-benefit>span { font-size: 12px; text-transform: uppercase; letter-spacing: .09em; color: var(--cv-purple); font-weight: 600; }
.cv-benefit p { font-size: 17px; line-height: 1.6; margin: 12px 0 0; }
.cv-screen-stage { display: flex; gap: 20px; padding: 52px 38px; align-items: center; justify-content: center; border-radius: 26px; min-width: 0; }
.cv-screen-stage-light { background: #f0eafb; }
.cv-screen-stage-purple { background: #dfd0f4; }
.cv-screen-stage .cv-screen { width: calc(50% - 10px); max-width: 230px; filter: drop-shadow(0 14px 17px #5532731c); }
.cv-screen-stage .cv-screen:nth-child(2) { margin-top: 60px; }
.cv-art { margin: 0; }
.cv-art img { width: 100%; height: auto; display: block; border-radius: 26px; }
.cv-art figcaption { color: var(--cv-muted); font-size: 13px; margin: 14px 4px 0; line-height: 1.6; }
.cv-feature-reverse { grid-template-columns: 1.1fr .9fr; }
.cv-feature-reverse .cv-feature-copy { grid-column: 2; grid-row: 1; padding: 0 24px 0 0; }
.cv-feature-reverse .cv-screen-stage { grid-column: 1; grid-row: 1; }
.cv-results { padding: 64px 52px; border-radius: 28px; background: #1b1425; color: #fff; }
.cv-results em { color: #cdaaff; }
.cv-results .cv-eyebrow { color: #bfa4db; }
.cv-case .cv-results-lead { color: #d0c4da; max-width: 790px; font-size: 19px; }
.cv-result-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 38px; margin-top: 46px; }
.cv-result-grid>div { border-top: 1px solid #ffffff30; padding-top: 25px; }
.cv-result-grid>div>span { display: block; color: #cdaaff; font-size: 46px; margin-bottom: 18px; line-height: 1; }
.cv-result-grid p { color: #cbbfd5; font-size: 15px; margin-bottom: 0; }
.cv-material-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 26px; margin-top: 36px; }
.cv-material-grid figure { margin: 0; }
.cv-material-grid img { width: 100%; height: auto; display: block; border-radius: 18px; }
.cv-material-grid figcaption { display: flex; justify-content: space-between; gap: 20px; font-size: 15px; line-height: 1.6; margin-top: 16px; }
.cv-material-grid figcaption span { color: var(--cv-purple); }
.cv-cta { display: grid; grid-template-columns: 1.5fr 1fr; align-items: center; gap: 70px; background: #f0e8fc; border-radius: 28px; padding: 58px 52px; }
.cv-cta p:last-child { color: #635470; margin-bottom: 0; max-width: 650px; }
.cv-cta-actions { display: flex; flex-direction: column; gap: 24px; align-items: stretch; }
.cv-button { font: inherit; font-size: 16px; font-weight: 500; border: 0; border-radius: 99px; background: #21132f; color: #fff; padding: 24px 28px; cursor: pointer; display: flex; align-items: center; justify-content: space-between; gap: 25px; text-align: left; }
.cv-button span { font-size: 25px; }
.cv-back-link { text-decoration: none; display: flex; justify-content: center; gap: 18px; font-size: 14px; }
@media (hover:hover) { .cv-screen:hover { transform: translateY(-6px); } .cv-button:hover { background: #713bc2; } .cv-text-link:hover { color: #cdaaff; } }
@media (max-width:1100px) {
 .cv-hero { padding: 42px 30px 0; }
 .cv-hero-visual { padding-left: 10px; }
 .cv-hero .project-title { font-size: 46px; }
 .cv-hero-copy { padding-bottom: 32px; }
 .cv-feature { gap: 32px; }
 .cv-feature-copy { padding-left: 0; }
 .cv-screen-stage { padding: 38px 22px; gap: 12px; }
 .cv-intro { gap: 40px; padding: 0; }
 .cv-cta { gap: 30px; }
}
@media (max-width:800px) {
 .cv-hero { grid-template-columns: 1fr; padding: 36px 30px 0; }
 .cv-hero .project-title { font-size: clamp(38px,7vw,56px); }
 .cv-hero .cv-lead { max-width: 570px; }
 .cv-hero-visual { max-width: 500px; width: 100%; margin: 0 auto; padding: 15px 20px 90px; }
 .cv-visual-label { bottom: 8px; }
 .cv-hero-bottom { font-size: 11px; }
 .cv-summary { gap: 16px; }
 .cv-summary strong { font-size: 16px; }
 .cv-summary>div { padding-left: 0; }
 .cv-summary>div+div { padding-left: 16px; }
 .cv-summary-sign { position: static; display: block; margin-bottom: 12px; }
 .cv-section { margin: 76px 0; }
 .cv-intro { grid-template-columns: 1fr; gap: 0; }
 .cv-flow-section { padding: 36px 26px 26px; }
 .cv-feature,.cv-feature-reverse { grid-template-columns: 1fr; gap: 32px; }
 .cv-feature-reverse .cv-feature-copy,.cv-feature-reverse .cv-screen-stage { grid-column: auto; grid-row: auto; padding-right: 0; }
 .cv-feature-reverse .cv-screen-stage { padding: 38px 22px; }
 .cv-screen-stage { padding: 40px; }
 .cv-results { padding: 42px 30px; }
 .cv-result-grid { gap: 22px; }
 .cv-result-grid h3 { font-size: 20px; }
 .cv-result-grid p { font-size: 14px; }
 .cv-material-grid { gap: 18px; }
 .cv-cta { grid-template-columns: 1fr; padding: 38px 30px; }
 .cv-cta-actions { max-width: 380px; width: 100%; }
}
@media (max-width:480px) {
 .cv-case > .cv-shell { padding-right: 15px; }
 .cv-case { padding-top: 10px; padding-bottom: 40px; }
 .cv-case .breadcrumb { font-size: 11px; margin-bottom: 20px; }
 .cv-hero { border-radius: 22px; padding: 30px 22px 0; }
 .cv-case .cv-eyebrow { font-size: 12px; margin-bottom: 22px; }
 .cv-tags { margin-bottom: 28px; }
 .cv-tags span { font-size: 11px; padding: 7px 9px; }
 .cv-hero .project-title { font-size: clamp(30px,8.8vw,42px); }
 .cv-case .cv-lead { font-size: 16px; }
 .cv-hero-visual { gap: 10px; padding: 10px 6px 78px; }
 .cv-screen-requests { transform: translateY(35px) rotate(7deg); }
 .cv-visual-label { left: 10px; font-size: 11px; bottom: 5px; }
 .cv-hero-bottom { flex-direction: column; gap: 5px; padding: 17px 0; }
 .cv-summary { grid-template-columns: 1fr; gap: 22px; padding: 30px 6px; }
 .cv-summary>div,.cv-summary>div+div { padding-left: 40px; border: 0; }
 .cv-summary-sign,.cv-summary>div+div .cv-summary-sign { position: absolute; left: 0; top: 2px; }
 .cv-summary strong { font-size: 18px; }
 .cv-case h2 { font-size: 32px; }
 .cv-case p { font-size: 16px; }
 .cv-intro .cv-pullquote { font-size: 21px; padding-left: 20px; }
 .cv-flow-section { padding: 30px 20px 24px; border-radius: 22px; }
 .cv-flow-section h2 { font-size: 28px; }
 .cv-screen-stage,.cv-feature-reverse .cv-screen-stage { padding: 30px 15px; gap: 10px; border-radius: 20px; }
 .cv-screen-stage .cv-screen { width: calc(50% - 5px); }
 .cv-screen-stage .cv-screen:nth-child(2) { margin-top: 36px; }
 .cv-art img { border-radius: 20px; }
 .cv-results { border-radius: 22px; padding: 34px 24px; }
 .cv-results h2 { font-size: 29px; }
 .cv-case .cv-results-lead { font-size: 17px; }
 .cv-result-grid { grid-template-columns: 1fr; gap: 28px; margin-top: 30px; }
 .cv-result-grid>div>span { font-size: 36px; }
 .cv-result-grid p { font-size: 16px; }
 .cv-material-grid { grid-template-columns: 1fr; gap: 30px; }
 .cv-cta { padding: 32px 24px; border-radius: 22px; }
 .cv-button { font-size: 15px; padding: 22px; }
}
@media (prefers-reduced-motion:reduce) { .cv-case *, .cv-case *::before,.cv-case *::after { animation: none!important; transition: none!important; scroll-behavior: auto!important; } }
