/* Original paper-cut coastal artwork. All decorative layers stay behind content. */
.coastal-shoreline,.coastal-hero-art,.coastal-section-edge{pointer-events:none;user-select:none;overflow:hidden}
.coastal-shoreline{position:relative;height:clamp(230px,27vw,500px);isolation:isolate;background:#fffefa;margin-top:-1px}
.coastal-shore-wash{position:absolute;inset:20% 0 0;background:radial-gradient(ellipse at 28% 100%,#b9deda80,transparent 65%)}
.coastal-horizon{position:absolute;bottom:-1px;left:-2%;width:104%;max-width:none;height:auto;display:block;transform-origin:bottom center;animation:coastal-shore-drift 16s ease-in-out infinite;animation-play-state:paused}
.coastal-tide-lines{position:absolute;bottom:0;left:-3%;width:106%;height:95px;fill:none;stroke:#d9e9dd;stroke-width:1.2;opacity:.5;animation:coastal-ripple 14s ease-in-out infinite alternate;animation-play-state:paused}
body#top #main .coastal-hero-surface{background:radial-gradient(ellipse at 88% 65%,#afd5ca70,transparent 49%),linear-gradient(120deg,#fffefa 20%,#eef6f0 100%)!important;border-bottom:0;isolation:isolate}
.coastal-hero-art{position:absolute;inset:72px 0 0;z-index:0}
.coastal-botanical{position:absolute;right:-24px;bottom:20px;height:clamp(280px,34vw,500px);width:auto;max-width:none;opacity:.75;transform-origin:95% 100%;animation:coastal-frond 13s ease-in-out infinite alternate;animation-play-state:paused}
.coastal-wave{position:absolute;left:-2%;bottom:-1px;width:104%;height:80px;overflow:visible}
.coastal-wave-back{fill:#bfdcd0;stroke:#fffefa;stroke-width:2;animation:coastal-ripple 15s ease-in-out infinite alternate;animation-play-state:paused}
.coastal-wave-front{fill:#fffefa;stroke:#719c9533;stroke-width:1;animation:coastal-ripple 19s ease-in-out -6s infinite alternate-reverse;animation-play-state:paused}
body#top #main .coastal-section{isolation:isolate}
body#top #main .coastal-section:nth-of-type(even){background:linear-gradient(135deg,#e6f0e8,#f1eee0)!important}
.coastal-section-edge{position:absolute;z-index:-1;inset:0 0 auto;height:65px;transform:rotate(180deg)}
.coastal-section-edge .coastal-wave{height:60px}
.coastal-section-edge .coastal-wave-back{fill:#d4e7dd;stroke:#fffefa;stroke-width:3}
.coastal-section-edge .coastal-wave-front{fill:#fffefa;stroke:none}
body#top #main .interior-cta.coastal-section{background:radial-gradient(ellipse at 90% 90%,#b8d8c8,transparent 55%),linear-gradient(130deg,#e3eee4,#f2eddf)!important;border-top:0}
body#top #main .interior-cta.coastal-section::after{content:"";position:absolute;z-index:-1;right:-40px;bottom:-10px;width:240px;height:390px;background:url('/assets/coastal-pages-20261021/tropical-corner.webp') right bottom/contain no-repeat;opacity:.6;pointer-events:none}
/* A quiet tide line ties the directory cards to the larger coastal scene. */
body#top.route-services .directory{background:linear-gradient(#fffefa,#eef4ec)!important}
body#top.route-services .directory-group{position:relative}
body#top.route-services .directory-heading{padding-top:30px;border-top:1px solid #7daba06b}
body#top.route-services .directory-heading::before{content:"";position:absolute;top:-6px;left:0;width:104px;height:14px;background:#82b7a7;border-radius:50% 38% 45% 40%;clip-path:polygon(0 45%,10% 25%,20% 40%,30% 62%,40% 50%,50% 30%,60% 45%,70% 64%,80% 45%,90% 28%,100% 40%,100% 58%,90% 47%,80% 62%,70% 82%,60% 65%,50% 49%,40% 68%,30% 80%,20% 59%,10% 43%,0 62%)}
body#top.route-services .directory-card{border-radius:6px 6px 36px 6px;box-shadow:0 7px 0 #73958a12}
body#top.route-services .directory-card::after{border-radius:6px 6px 36px 6px}
body#top.route-services .service-guide::before{background:linear-gradient(160deg,#c5e0d04d,#fffefa33);border-color:#719d9277}
.coastal-in-view .coastal-wave path,.coastal-in-view .coastal-botanical,.coastal-in-view .coastal-horizon,.coastal-in-view .coastal-tide-lines{animation-play-state:running}
.motion-off [class*="coastal-"] ,.coastal-page-hidden [class*="coastal-"]{animation-play-state:paused!important}
@keyframes coastal-ripple{from{transform:translateX(-12px)}to{transform:translateX(12px)}}
@keyframes coastal-frond{from{transform:rotate(-1deg)}to{transform:rotate(1deg)}}
@keyframes coastal-shore-drift{0%,100%{transform:translateX(-.4%) rotate(-.15deg)}50%{transform:translateX(.4%) rotate(.15deg)}}
@media(min-width:1800px){.coastal-horizon{width:100%;left:0}}
@media(max-width:900px){.coastal-botanical{right:-45px;bottom:20px;height:360px;opacity:.65}.coastal-hero-art{inset:64px 0 0}.coastal-shoreline{height:225px}.coastal-horizon{height:300px;width:auto;min-width:100%;left:auto;right:-140px}.coastal-section-edge{height:45px}.coastal-section-edge .coastal-wave{height:42px}.coastal-tide-lines{height:68px}body#top #main .interior-cta.coastal-section::after{right:-55px;width:200px;height:370px;opacity:.5}}
@media(max-width:480px){.coastal-shoreline{height:210px}.coastal-horizon{height:285px;right:-165px}.coastal-botanical{right:-50px;height:310px;opacity:.7}.coastal-hero-art>.coastal-wave{height:52px}}
@media(prefers-reduced-motion:reduce){[class*="coastal-"]{animation:none!important}}

body.route-service .chrome-hero>.coastal-hero-art{top:-88px;left:calc(-1 * var(--chrome-inset));right:calc(-1 * var(--chrome-inset));z-index:-1}
@media(max-width:900px){body.route-service .chrome-hero>.coastal-hero-art{top:-40px}}
@media(max-width:900px){.coastal-horizon{right:-14px}body.route-service .coastal-hero-art .coastal-botanical{top:210px;bottom:auto;height:410px;right:-55px}}
body.route-service .chrome-hero>.coastal-hero-art{left:calc(50% - 50vw);right:auto;width:100vw}

/* Carry the final section into the cream sky behind the shared shoreline. */
body#top #main .interior-cta.coastal-section{
 background:linear-gradient(to bottom,transparent calc(100% - 190px),#fffefa 100%),radial-gradient(ellipse at 90% 90%,#b8d8c8,transparent 55%),linear-gradient(130deg,#e3eee4,#f2eddf)!important;
}
body#top #main .interior-cta.coastal-section::after{
 -webkit-mask-image:linear-gradient(to bottom,#000 calc(100% - 190px),transparent 100%);
 mask-image:linear-gradient(to bottom,#000 calc(100% - 190px),transparent 100%);
}
body[data-homepage]#top #main .flow-closing{
 background:linear-gradient(to bottom,transparent calc(100% - 160px),#fffefa 100%),radial-gradient(ellipse at 50% 130%,#c4dcbf,transparent 70%),#f1eedf;
}
.client-u{font:inherit;line-height:inherit;color:#132b30;background:#dfff00;padding:.02em .14em;box-decoration-break:clone;-webkit-box-decoration-break:clone}
