/* Code Vertex Elite — unified responsive UI system, release 2026-09-26.
   Scoped to preserve the existing cinematic homepage hero. */
:root{--cvu-bg:#f7f7f5;--cvu-ink:#151c25;--cvu-dark:#151c25;--cvu-accent:#ed3546;--cvu-muted:#65717e;--cvu-line:#dde2e5;--cvu-radius:20px}
:where(.editorial-header,.cx-header,.op-header){box-shadow:0 1px 0 #1018200d;backdrop-filter:saturate(160%) blur(12px);-webkit-backdrop-filter:saturate(160%) blur(12px)}
:where(.cx-page,.op-page) :is(button,input,select,textarea):focus-visible,:where(.cx-page,.op-page) a:focus-visible{outline:3px solid #fb6977;outline-offset:3px}
:where(.cx-page,.op-page) :is(input,select,textarea){font-size:16px}
:where(.cx-page,.op-page) :is(.cx-btn,.op-btn){transition:background-color .18s ease,border-color .18s ease,transform .18s ease,box-shadow .18s ease}
:where(.cx-page,.op-page) :is(.cx-btn,.op-btn):hover:not(:disabled){box-shadow:0 8px 22px #1219231a}
/* Shared, viewport-safe navigation. Kept outside each React root to avoid hydration conflicts. */
.cvu-menu-button{position:fixed;right:17px;top:12px;z-index:30020;height:43px;min-width:91px;border:1px solid #d9dfe2;background:#fff;color:#18212c;border-radius:12px;align-items:center;justify-content:center;gap:9px;padding:0 13px;font:750 13px/1 Inter,ui-sans-serif,system-ui,sans-serif;box-shadow:0 4px 18px #0c172011;display:none}
.cvu-menu-button svg{width:17px;height:17px;stroke:currentColor;stroke-width:2;fill:none;stroke-linecap:round;stroke-linejoin:round}
.cvu-menu-button[aria-expanded=true]{background:#151c25;color:white;border-color:#151c25}
.cvu-mobile-sheet[hidden]{display:none!important}
.cvu-mobile-sheet{display:none;position:fixed;inset:64px 0 0;z-index:30010;background:#121922a1;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);padding:10px 14px 20px}
.cvu-mobile-panel{margin-inline:auto;max-width:490px;width:100%;background:#fff;border:1px solid #e2e6e9;border-radius:22px;padding:14px;box-shadow:0 32px 80px #0004;max-height:calc(100dvh - 92px);overflow-y:auto}
.cvu-mobile-caption{font-size:10px;font-weight:830;letter-spacing:.17em;color:#a6aeb6;margin:5px 11px 12px}
.cvu-mobile-link{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:12px 14px;min-height:47px;color:#202a34!important;font:720 14px/1.35 Inter,ui-sans-serif,system-ui,sans-serif;text-decoration:none!important;border-radius:12px}
.cvu-mobile-link:hover,.cvu-mobile-link:focus-visible{background:#f1f3f4;color:#c92b3c!important}
.cvu-mobile-link small{color:#8a949e;font-size:12px}
.cvu-mobile-divider{border-top:1px solid #e5e9eb;margin:9px 6px}
.cvu-mobile-link--main{background:#ef3546;color:#fff!important;margin-top:8px}
.cvu-mobile-link--main small{color:#fff}.cvu-mobile-link--main:hover{background:#c72c3c;color:#fff!important}
body.cvu-menu-open{overflow:hidden}
.cvu-skip{position:fixed;left:-1000px;top:4px;z-index:32000;background:#fff;color:#111;padding:10px 14px;border-radius:9px}
.cvu-skip:focus{left:9px}
.cvu-mobile-sheet :focus-visible,.cvu-menu-button:focus-visible{outline:3px solid #ed3546;outline-offset:3px}
/* Marketing: cleaner portfolio cards and project reading rhythm */
.cve-featured__card{border-radius:24px}
.cve-featured__cta{min-height:49px}
.cve-featured__content h3{overflow-wrap:anywhere}
.cve-featured__card--diamond .cve-featured__content h3{color:#f9f7f3}
.cx-featured-case{min-height:39px;align-items:center}
.cx-next__tile,.cx-next__casepanel,.cx-panel{box-shadow:0 12px 38px #111b2510}
.cx-next__tile img,.cx-next__casepanel img{object-position:center top}
.cx-next__cta h2,.cx-next__dark .cx-next__head h2{color:#fff!important}
.cx-next__casepanel a:focus-visible,.cx-next__links a:focus-visible{outline:3px solid #ff6977;outline-offset:3px}
/* Portfolio hero — correct min-content grid sizing without truncation. */
.page-hero__inner{grid-template-columns:minmax(0,1.3fr) minmax(0,.66fr)}
.page-hero__inner>*{min-width:0}
.page-hero__inner h1{font-size:clamp(3.2rem,6vw,6.25rem);line-height:1.03;letter-spacing:-.065em;overflow-wrap:normal;word-break:normal;max-width:980px}
.page-hero__inner p{overflow-wrap:anywhere}
.page-hero__aside{min-width:0;max-width:100%}
.page-hero__inner{align-items:center}
/* Product/project detail: constrain captured screenshot dimensions. */
.cx-hero__figure img{height:auto!important;width:100%;aspect-ratio:16/10;object-fit:cover;object-position:top}
.cx-shot img{height:auto;width:100%}
.cx-shot--mobile img{height:auto}
.cx-hero__figure{max-width:760px}
.cx-hero__grid{min-width:0}
.cx-hero__grid>*{min-width:0}
.cx-page--estimate .cx-form fieldset[hidden],.cx-page--estimate .cvu-step-panel[hidden]{display:none!important}
/* A coherent multistep quotation flow. */
.cvu-stepper{display:flex;align-items:center;gap:8px;margin:0 0 24px;padding:15px;border-radius:16px;background:#f5f6f6;border:1px solid #e3e6e8}
.cvu-step{min-width:0;flex:1;display:flex;align-items:center;gap:8px;color:#929ba5;font-size:11px;font-weight:780;line-height:1.2}
.cvu-step-num{flex:0 0 27px;width:27px;height:27px;display:grid;place-items:center;border-radius:100%;border:1px solid #d4dadd;background:#fff;font-variant-numeric:tabular-nums}
.cvu-step[aria-current=step]{color:#161e28}
.cvu-step[aria-current=step] .cvu-step-num{background:#ef3546;color:#fff;border-color:#ef3546}
.cvu-step[data-complete=true] .cvu-step-num{background:#18232d;color:#fff;border-color:#18232d}
.cvu-step-actions{display:flex;align-items:center;justify-content:space-between;gap:9px;margin:16px 0 0}
.cvu-step-actions button{min-height:45px}
.cvu-step-caption{font-size:12px;color:#737e88;margin-top:13px}
.cvu-form-helper{font-size:12px;color:#7b8690;margin:7px 0 0}
.cx-form-layout>*{min-width:0}
.cx-form textarea{max-width:100%}
.cx-summary strong{overflow-wrap:anywhere}
.cx-page--estimate .cx-summary__band{background:#ffffff0c}
.cx-page--estimate .cx-form{box-shadow:0 24px 60px #111b240a}
.cx-page--estimate .cx-form:focus-within{border-color:#d9dfe2}
.cx-page--estimate .cx-form__actions{margin-top:17px}
.cx-page--estimate .cx-summary .cx-btn{min-height:45px}
.cx-page--estimate .cx-hero .cx-lead{max-width:650px}
/* Operations pages: predictable visual hierarchy and concise mobile flows */
.op-header .op-brand{white-space:nowrap;gap:8px}
.op-header .op-brand b{margin-left:-6px}
.op-page :is(.op-panel,.op-card,.op-list-row,.op-metric){border-color:#e3e6e8}
.op-page .op-panel{box-shadow:0 17px 55px #15202c0b}
.op-page .op-field :is(input,select,textarea){border-radius:12px;min-height:47px;background:#fff}
.op-page .op-field :is(input,select,textarea):focus{outline:3px solid #ed35461a;border-color:#ed3546}
.op-page .op-status{line-height:1.55}
.op-page .op-btn{min-height:44px}
.op-page .op-art{background:linear-gradient(145deg,#2b3441,#121a24)}
.op-page .op-hero__in>div{min-width:0}
.op-page .op-main{scroll-margin-top:80px}
.op-page .op-auth .op-panel{box-shadow:0 28px 80px #14202c12}
.op-page .op-viewhead p{font-size:14px;line-height:1.65}
.op-page .op-list-row p{overflow-wrap:anywhere}
.op-page .op-sidebar button{min-height:44px}
.op-page .op-empty{background:#f9fafa}
.op-page .op-tablewrap{max-width:100%}
.op-page .op-btn--red{background:#ed3546;color:#fff}
.op-page .op-btn--red:hover{background:#d12639}
/* Direct request form anchor from hero; do not force browsing portfolio first. */
#op-lead-form,#op-book-form,#cx-brief-form{scroll-margin-top:90px}
.op-page .op-main>.op-wrap>div:first-child{min-width:0}
/* Compact desktop portfolio hero */
@media(min-width:1025px){
 .page-hero__inner{padding:clamp(44px,5vw,74px)!important;min-height:0}
 .page-hero__inner h1{font-size:clamp(3.5rem,5.6vw,5.6rem)}
 .page-hero__aside{align-self:center}
 .page-hero{padding-top:22px}
 .cx-page--estimate .cx-hero__grid{min-height:480px}
}
/* Tablet and phone */
@media(max-width:1024px){
 .page-hero__inner{grid-template-columns:minmax(0,1fr)!important;padding:clamp(26px,5vw,52px)!important;gap:22px!important}
 .page-hero__inner h1{font-size:clamp(2.65rem,7.1vw,5rem)!important;line-height:1.08!important;letter-spacing:-.06em!important;overflow-wrap:break-word!important}
 .page-hero__aside{max-width:670px!important}
}
@media(max-width:800px){
 .cvu-menu-button{display:flex}
 .cvu-mobile-sheet:not([hidden]){display:block}
 .editorial-header__nav,.editorial-header [id="hover-mega-menu"],.cx-header .cx-menu,.cx-header .cx-nav,.op-header nav{display:none!important}
 .editorial-header,.cx-header,.op-header{height:64px!important;min-height:64px!important}
 .editorial-header__inner,.cx-header__in,.op-header .op-wrap{height:64px!important;min-height:64px!important;align-items:center!important}
 .editorial-header__inner{padding-right:112px!important}
 .editorial-header__inner .editorial-brand{flex:0 0 auto!important;min-width:0}
 .editorial-brand .brand-mark{height:32px!important;width:32px!important}
 .editorial-brand .brand-wordmark{font-size:clamp(10px,3vw,13px)!important}
 .cx-header__in,.op-header .op-wrap{padding-right:113px!important}
 .cx-brand{font-size:12px!important;letter-spacing:-.03em}
 .cx-brand img,.op-brand img{height:34px!important;width:34px!important}
 .cx-page .cx-header{position:sticky}
 .op-header{position:sticky}
 .page-inner,.page-home{padding-top:64px!important}
 .editorial-hero-wrap{padding-top:0}
 .page-hero{padding-top:12px!important}
 .page-hero__inner h1{font-size:clamp(2.5rem,9vw,3.75rem)!important;line-height:1.04!important}
 .page-hero__inner{padding:clamp(22px,5vw,34px)!important}
 .page-hero__aside{padding:20px!important}
 .cx-hero__figure img{height:auto!important}
 .cx-hero__grid{min-height:0;padding:34px 0 55px;gap:25px}
 .cx-display{font-size:clamp(2.65rem,8.2vw,4.6rem);letter-spacing:-.064em}
 .cx-section{padding:48px 0}
 .cx-head h2{font-size:clamp(2.1rem,8vw,3.3rem)}
 .cx-next{padding:54px 0}
 .cx-next__head h2{font-size:clamp(2.1rem,7.8vw,3.5rem)}
 .cx-hero__figure:before{display:none}
 .cx-page--estimate .cx-hero__figure{display:none!important}
 .cx-page--estimate .cx-hero__grid{padding:28px 0 33px;min-height:0}
 .cx-page--estimate .cx-hero .cx-lead{line-height:1.55}
 .cx-page--estimate .cx-crumb{padding-top:9px}
 .cx-page--estimate .cx-section{padding:34px 0}
 .cx-page--estimate .cx-head{margin-bottom:18px}
 .cx-page--estimate .cx-form{padding:21px!important;border-radius:19px}
 .cx-page--estimate .cx-form fieldset{margin-bottom:21px}
 .cx-page--estimate .cx-summary{padding:22px}
 .op-hero__in{grid-template-columns:1fr!important;min-height:0;padding:28px 0 34px!important;gap:18px}
 .op-hero h1{font-size:clamp(2.2rem,7.9vw,3.55rem)!important;line-height:1.07}
 .op-hero p{font-size:14px;line-height:1.6}
 .op-hero .op-art{display:none!important}
 .op-hero .op-btn{margin-top:16px!important}
 .op-main{padding:24px 0 49px}
 .op-auth{margin-top:27px;margin-bottom:55px}
 .op-panel{padding:clamp(18px,4vw,28px)}
 .op-workspace{padding-top:15px}
 .op-sidebar{position:sticky;top:64px;z-index:25;display:flex;flex-wrap:nowrap;width:100%;border-radius:14px;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:thin;gap:4px;box-shadow:0 8px 22px #16222e18}
 .op-sidebar button{min-height:43px;white-space:nowrap;flex:0 0 auto}
 .op-mainview{min-height:55vh}
}
@media(max-width:480px){
 .page-hero__inner h1{font-size:clamp(2.3rem,10vw,3.1rem)!important;hyphens:none!important}
 .page-hero__inner p{font-size:14px!important;line-height:1.62!important}
 .page-hero__aside{font-size:13px}
 .cx-hero__grid{padding:25px 0 35px}
 .cx-hero__figure img{max-height:330px;object-fit:cover}
 .cx-display{font-size:clamp(2.45rem,11vw,3.3rem)}
 .cx-hero .cx-lead{font-size:14px}
 .cx-page--estimate .cx-hero__grid{padding:19px 0 25px}
 .cx-page--estimate .cx-display{font-size:clamp(2.4rem,10.5vw,3.1rem)}
 .cx-page--estimate .cx-trail{display:none}
 .cvu-stepper{gap:3px;padding:10px 8px}
 .cvu-step{flex-direction:column;gap:5px;text-align:center;font-size:9px}
 .cvu-step-num{width:25px;height:25px;flex-basis:25px}
 .cvu-step-actions .cx-btn{padding:10px 15px;min-width:110px;justify-content:center}
 .cx-page--estimate .cx-summary{padding:20px}
 .op-main{padding:19px 0 44px}
 .op-hero__in{padding:23px 0 27px!important}
 .op-hero h1{font-size:clamp(2.15rem,9.2vw,2.8rem)!important;margin:8px 0 10px}
 .op-panel h2{font-size:clamp(23px,6vw,29px)!important}
 .op-page .op-grid2{gap:13px}
 .op-page .op-auth h1{font-size:31px}
 .op-page .op-footer{margin-top:0}
 .op-page .op-hero .op-kicker{font-size:10px}
}
@media(prefers-reduced-motion:reduce){
 .cvu-menu-button,.cvu-mobile-panel,.cx-page .cx-btn,.op-page .op-btn{transition:none!important}
 .cve-featured__card:hover,.cx-btn:hover,.op-btn:hover{transform:none!important}
 html{scroll-behavior:auto}
}

/* Shared desktop navigation for agency operations pages. */
@media(min-width:801px){
 .op-header nav{display:flex;align-items:center;gap:clamp(12px,1.8vw,27px)}
 .op-header nav a:not(.op-btn){font-size:12px;font-weight:720;color:#3b4551;white-space:nowrap}
 .op-header nav a:not(.op-btn):hover{color:#d22d3f}
 .op-header nav .op-btn{white-space:nowrap}
}
@media(min-width:801px) and (max-width:1090px){
 .op-header nav{gap:11px}
 .op-header nav a:nth-child(3),.op-header nav a:nth-child(5){display:none}
}
@media(max-width:800px){
 .op-header nav{display:none!important}
}

.cvu-wizard-reset{display:inline-flex;align-items:center;justify-content:center;min-height:39px;margin-top:7px;padding:7px 10px;border:0;background:none;color:#68737e;font-size:12px;font-weight:730;text-decoration:underline;text-underline-offset:3px}
.cvu-wizard-reset:hover{color:#ce3040}

/* Work page: put real featured projects ahead of generic process context on mobile. */
@media(max-width:800px){
 .cvu-work-page .page-hero__aside{display:none!important}
 .cvu-work-page .page-hero__inner h1{font-size:clamp(2.18rem,8.8vw,3.15rem)!important;line-height:1.1!important;letter-spacing:-.052em!important}
 .cvu-work-page .page-hero__inner{padding:28px 24px!important;gap:0!important}
}

/* Remove old min-height from Selected Work only: show actual work sooner. */
.cvu-work-page .page-hero__inner{min-height:0!important}
@media(max-width:800px){
 .cvu-work-page .page-hero__inner{align-items:start!important}
}

/* Correct dark portfolio section contrast and shorten desktop introduction. */
.cve-featured__heading h2{color:#f7f8fb!important}
.cve-featured__heading h2 em{color:#fb4a57!important}
@media(min-width:801px){
 .cvu-work-page .page-hero__inner h1{font-size:clamp(2.8rem,4.4vw,4rem)!important;line-height:1.055!important;letter-spacing:-.052em!important}
}

/* Five-step brief, mobile safe. */
.cx-page--estimate .cvu-stepper{overflow-x:auto;max-width:100%;scrollbar-width:thin}
.cx-page--estimate .cvu-step{flex:1 1 0;min-width:0}
.cx-page--estimate #cve-save-enquiry[hidden]{display:none!important}
@media(max-width:500px){.cx-page--estimate .cvu-stepper{padding:9px 5px;gap:2px}.cx-page--estimate .cvu-step{font-size:8px}.cx-page--estimate .cvu-step-num{width:24px;height:24px;flex-basis:24px}}