/* Owner-requested vivid water identity; extends the existing component system. */
.vivid-site { background: linear-gradient(180deg,#fff 0%,#f2f8fa 44%,#fff 100%); }
.vivid-site .site-header { box-shadow: 0 5px 28px #0a35450a; }
.vivid-site .hero { position:relative; isolation:isolate; overflow:hidden; margin-block:26px 34px; padding:56px; border:1px solid #174c65; border-radius:30px; background:#08293d; color:#fff; box-shadow:0 24px 64px #073c4926; gap:42px; }
.vivid-site .hero::before { content:""; position:absolute; inset:0; z-index:-2; background:linear-gradient(100deg,#061c32ed 10%,#082c44c9 55%,#063d5559),url('/assets/images/flow-atmosphere-1600.webp') center/cover; }
.vivid-site .hero::after { content:""; position:absolute; width:480px; height:480px; right:-180px; top:-240px; z-index:-1; border:1px solid #73f6ec50; border-radius:50%; box-shadow:0 0 0 42px #68f2ef0a,0 0 0 100px #68f2ef07; }
html[data-motion="full"] .vivid-site .hero::after { animation:water-orbit 14s ease-in-out infinite alternate; }
@keyframes water-orbit { from {transform:translate(-15px,0) scale(.95);} to {transform:translate(35px,65px) scale(1.15);} }
.vivid-site .hero .eyebrow { display:inline-flex; padding:7px 12px; border:1px solid #6ae8e14d; border-radius:99px; background:#55d7da12; color:#a2fff4; font-size:11px; letter-spacing:.12em; }
.vivid-site .hero h1 { font-size:clamp(38px,4.4vw,63px); letter-spacing:-.055em; }
.vivid-site .hero h1 span { color:#78f7dc; }
.vivid-site .hero .lead,.vivid-site .hero-copy > p:not(.eyebrow) { color:#d2e5ed; }
.vivid-site .hero .button.primary,.vivid-site .contact-band .button.primary { background:linear-gradient(110deg,#66edd2,#6abfff); color:#052d42; border-color:#8df5e5; box-shadow:0 8px 28px #22c7d044; }
.vivid-site .hero .button.secondary { background:#ffffff0c; color:#fff; border-color:#bbdce360; }
.vivid-site .hero .button.secondary:hover { background:#ffffff20; }
.vivid-site .hero-media { border:1px solid #b8ffff66; box-shadow:0 18px 45px #0007; transform:rotate(1.2deg); transition:transform .45s ease,box-shadow .45s ease; }
.vivid-site .hero-media img { aspect-ratio:5/4; }
.vivid-site .hero-media .image-caption { background:#0c3449; color:#d1e6ed; }
.vivid-site .hero-media:hover { transform:perspective(1000px) rotateY(-3deg) rotate(0) translateY(-4px); box-shadow:0 24px 50px #0008; }
.vivid-site .proof-strip { background:linear-gradient(110deg,#0a334a,#075b69); color:#fff; border:0; }
.vivid-site .proof-grid { padding-block:30px; }
.vivid-site .proof-grid > * { border-color:#9bebe336; }
.vivid-site .proof-grid strong { color:#a4ffeb; font-size:20px; }
.vivid-site .proof-grid p { color:#d3e9ed; }
.vivid-site .soft { background:radial-gradient(ellipse at 4% 0,#dff8f8,transparent 55%),#f1f6f7; }
.vivid-site .section-heading h2::after { content:""; display:block; width:54px; height:5px; border-radius:9px; margin-top:20px; background:linear-gradient(90deg,#15bfa4,#3a9bdf); }
.vivid-site .service-card,.vivid-site .guide-card,.vivid-site .region-card { border-color:#d0e2e6; box-shadow:0 8px 24px #12394b08; transition:transform .28s ease,box-shadow .28s ease,border-color .28s ease; }
.vivid-site .service-card:hover,.vivid-site .guide-card:hover,.vivid-site .region-card:hover { transform:translateY(-6px); border-color:#4fcbbd; box-shadow:0 18px 34px #12394b1c; }
.vivid-site .card-media img { transition:transform .55s ease; }
.vivid-site .service-card:hover .card-media img { transform:scale(1.045); }
.vivid-site .card-body .eyebrow { color:#087779; }
.vivid-site .answer-panel,.vivid-site .fact-card,.vivid-site .step { box-shadow:0 10px 30px #16495709; border-color:#cae0e4; }
.vivid-site .answer-panel { border-top:3px solid #22bba9; }
.vivid-site .step > span { display:inline-flex; width:38px; height:38px; align-items:center; justify-content:center; border-radius:12px; color:#fff; background:linear-gradient(135deg,#168b9d,#0c526c); }
.vivid-site .page-intro { margin-top:25px; padding:46px 38px; border:1px solid #cbe3e8; border-radius:24px; background:radial-gradient(ellipse at 100% 0,#b9eeea90,transparent 65%),#eff8fa; }
.vivid-site .contact-band { background:linear-gradient(100deg,#06293ef2,#06495be8),url('/assets/images/flow-atmosphere-1600.webp') right center/cover; }
.vivid-site .sticky-call { background:linear-gradient(110deg,#087d86,#12598e); box-shadow:0 8px 26px #064e6866; }
.motion-toggle { display:inline-flex; gap:7px; align-items:center; margin-top:8px; padding:7px 10px; min-height:36px; border:1px solid #c3e4e746; border-radius:9px; background:#ffffff09; color:#d7eef2; font:inherit; font-size:11px; cursor:pointer; }
.motion-toggle:focus-visible { outline:3px solid #80ffde; outline-offset:4px; }
.motion-toggle:disabled { cursor:default; }
html[data-motion="reduced"] .vivid-site *,html[data-motion="reduced"] .vivid-site *::before,html[data-motion="reduced"] .vivid-site *::after { animation:none!important; transition:none!important; }
@media(max-width:1100px) { .vivid-site .hero { padding:36px; gap:28px; } .vivid-site .hero h1 { font-size:42px; } }
@media(max-width:760px) { .vivid-site .hero { padding:30px 24px; margin-top:18px; border-radius:24px; gap:30px; } .vivid-site .hero h1 { font-size:40px; } .vivid-site .hero-media { transform:none; } .vivid-site .hero-media img,.vivid-site .hero-home .hero-media img { aspect-ratio:16/11; } .vivid-site .hero::before { background-position:70% center; } .vivid-site .page-intro { padding:32px 24px; } }
@media(max-width:360px) { .vivid-site .hero { padding:25px 18px; } .vivid-site .hero h1 { font-size:33px; } .vivid-site .hero .eyebrow { font-size:9px; } .vivid-site .hero .button { padding-inline:10px; font-size:14px; } }
/* The homepage is one continuous scene, with the image behind the copy. */
.vivid-site .hero-home { display:flex; align-items:center; width:100%; min-height:calc(100svh - 89px); margin:0; padding:72px max(32px,calc((100% - 1200px)/2)); border:0; border-radius:0; box-shadow:none; background:#061c32; }
.vivid-site .hero-home::before { z-index:-1; background:linear-gradient(90deg,#061c32fa 0%,#061c32ed 24%,#061c32b8 42%,#061c3220 66%,#061c3210 100%); }
.vivid-site .hero-home::after { display:none; }
.vivid-site .hero-home .hero-media,.vivid-site .hero-home .hero-media:hover { position:absolute; inset:0; z-index:-2; border:0; border-radius:0; box-shadow:none; transform:none; transition:none; background:transparent; }
.vivid-site .hero-home .hero-media .photo,.vivid-site .hero-home .hero-media picture { display:block; width:100%; height:100%; border-radius:0; }
.vivid-site .hero-home .hero-media img { width:100%; height:100%; aspect-ratio:auto; object-fit:cover; object-position:center 38%; }
.vivid-site .hero-home .hero-copy { width:100%; max-width:650px; }
.vivid-site .hero-home h1 { font-size:clamp(52px,5.15vw,76px); line-height:1.15; }
.vivid-site .hero-home .hero-copy > p:not(.eyebrow):not(.lead) { max-width:510px; font-size:15px; }
@media(max-width:1100px) { .vivid-site .hero-home { padding:60px 32px; min-height:calc(100svh - 97px); } .vivid-site .hero-home .hero-copy { max-width:590px; } .vivid-site .hero-home::before { background:linear-gradient(90deg,#061c32f5,#061c32d9 36%,#061c3233 100%); } }
@media(max-width:760px) {
  .vivid-site .hero-home { align-items:flex-end; min-height:calc(100svh - 93px); padding:230px 24px 32px; }
  .vivid-site .hero-home .hero-media { bottom:auto; height:65%; }
  .vivid-site .hero-home .hero-media img { object-position:72% 20%; }
  .vivid-site .hero-home::before { background:linear-gradient(180deg,#061c3205 0%,#061c3220 18%,#061c32c9 36%,#061c32 64%); }
  .vivid-site .hero-home h1 { max-width:550px; font-size:clamp(36px,8.7vw,54px); margin-bottom:18px; }
  .vivid-site .hero-home .eyebrow { margin-bottom:16px; }
  .vivid-site .hero-home .lead { margin-bottom:20px; }
  .vivid-site .hero-home .hero-actions { flex-direction:row; margin-top:20px; }
  .vivid-site .hero-home .hero-actions .button { flex:1 1 220px; }
  .vivid-site .hero-home .hero-copy > p:not(.eyebrow):not(.lead) { font-size:13px; margin-bottom:12px; }
}
@media(max-width:360px) { .vivid-site .hero-home { padding:190px 18px 26px; } .vivid-site .hero-home h1 { font-size:34px; } .vivid-site .hero-home .hero-actions .button { font-size:14px; min-height:49px; } }
@media(prefers-reduced-motion:reduce) { .vivid-site *, .vivid-site *::before,.vivid-site *::after { animation:none!important; transition:none!important; } }
@media print { .vivid-site .hero,.vivid-site .proof-strip,.vivid-site .contact-band,.vivid-site .page-intro { background:#fff; color:#142f45; box-shadow:none; } .vivid-site .hero::before,.vivid-site .hero::after,.motion-toggle { display:none; } }