/* V8 — Warm Comfort Blue + mobile experience-card interaction */
:root{
  --vl-blue-paper:#dfeaf0;
  --vl-blue-ivory:#eef3f4;
  --vl-blue-warm:#e7eef1;
  --vl-blue-border:rgba(38,73,94,.14);
  --vl-blue-accent:#315d78;
  --vl-blue-deep:#173d68;
}

html{background:var(--vl-blue-ivory)!important;}
body{background:var(--vl-blue-paper)!important;color:#202d35;}

main > div > section.vl-soft-surface-a,
main > div > section.vl-soft-surface-b,
main section.vl-soft-surface-a,
main section.vl-soft-surface-b{
  background:var(--vl-blue-paper)!important;
  background-image:none!important;
  border-top:1px solid var(--vl-blue-border);
}
main > div > section.vl-soft-surface-b,
main section.vl-soft-surface-b{background:var(--vl-blue-ivory)!important;}

main > div > section.vl-soft-surface-a::before,
main > div > section.vl-soft-surface-a::after,
main > div > section.vl-soft-surface-b::before,
main > div > section.vl-soft-surface-b::after{display:none!important;}

.vl-atmospheric:not(.vl-cinematic)::before,
.vl-atmospheric:not(.vl-cinematic)::after{display:none!important;}
.vl-atmospheric:not(.vl-cinematic){background:var(--vl-blue-paper)!important;}

.vl-page-explore .bg-surface,
.vl-page-experience .bg-surface,
.vl-page-insight .bg-surface,
.vl-page-partner .bg-surface,
.vl-page-business .bg-surface{
  background:#f8faf9!important;
  border-color:var(--vl-blue-border)!important;
  box-shadow:0 10px 30px rgba(34,57,70,.055)!important;
}

/* Warm/deep blue header sweep */
header nav a::before{
  background:linear-gradient(90deg,transparent,#173d68 20%,#315d78 50%,#173d68 80%,transparent)!important;
  box-shadow:0 0 7px rgba(23,61,104,.46),0 0 13px rgba(23,61,104,.16)!important;
}
header nav a::after{
  background:linear-gradient(90deg,transparent,#173d68,#6f98bd,transparent)!important;
  box-shadow:0 0 7px rgba(23,61,104,.32)!important;
}
header nav a:hover,
header nav a:focus-visible{color:#173d68!important;text-shadow:0 0 10px rgba(23,61,104,.13)!important;}

html{scrollbar-color:#718d9d #d5e1e7!important;}
::-webkit-scrollbar-track{background:#d5e1e7!important;}
::-webkit-scrollbar-thumb{background:#718d9d!important;border-color:#d5e1e7!important;}
::-webkit-scrollbar-thumb:hover{background:#557386!important;}

/* Make experience cards reliably tappable on touch devices. */
.experience-card{
  position:relative;
  z-index:1;
  pointer-events:auto!important;
  -webkit-tap-highlight-color:transparent;
  touch-action:manipulation;
}
.experience-card img,
.experience-card .absolute,
.experience-card h3,
.experience-card p{pointer-events:none;}
.experience-card button{pointer-events:auto;position:relative;z-index:4;}

@media (max-width:767px){
  .experience-card{cursor:pointer;transform:none!important;}
  .experience-card:active{transform:scale(.992)!important;}
  #quote-modal{align-items:flex-start!important;padding:12px!important;padding-top:max(12px,env(safe-area-inset-top))!important;}
  #quote-modal > div{width:100%!important;max-width:none!important;margin:12px 0!important;max-height:calc(100dvh - 24px)!important;overflow-y:auto!important;-webkit-overflow-scrolling:touch;}
  #quote-modal > div > button{position:sticky!important;top:0;float:right;z-index:30;background:rgba(255,255,255,.96);}
}

@media (prefers-reduced-motion:reduce){
  .experience-card:active{transform:none!important;}
}