/* Service artwork lives inside the card surface, with copy protected by a deep gradient. */
.service,.route-card,.page-hero{overflow:hidden}
.service,.route-card{position:relative;isolation:isolate}
.service{min-height:510px;justify-content:flex-end}
.route-card{min-height:500px;justify-content:flex-end}
.service-visual{display:block;position:absolute;z-index:-2;inset:0;height:auto;margin:0;overflow:hidden;background:#090909;pointer-events:none}
.service-visual::before{content:"";position:absolute;z-index:1;inset:0;background:linear-gradient(180deg,#08080805 0%,#08080810 30%,#0d0c0ba8 58%,#0d0c0bf5 82%,#0d0c0b 100%),linear-gradient(105deg,#0d0c0b45 0%,transparent 58%);transition:background .45s ease}
.service-visual::after{content:"";position:absolute;z-index:2;inset:-40% -60%;background:linear-gradient(110deg,transparent 38%,#ffffff12 49%,transparent 58%);transform:translateX(-55%) rotate(4deg);opacity:0;transition:transform .7s cubic-bezier(.16,1,.3,1),opacity .22s ease;pointer-events:none}
.service-visual img{display:block;width:100%;height:100%;object-fit:cover;object-position:center 26%;transition:transform .7s cubic-bezier(.16,1,.3,1),filter .45s ease,opacity .45s ease;filter:saturate(.82) contrast(1.06);opacity:.82}
.service>:not(.service-visual),.route-card>:not(.service-visual){position:relative;z-index:2}
.service .card-top{margin-bottom:auto;padding-bottom:92px;width:100%}
.service .tags{min-height:30px}
.featured .service-visual::before{background:linear-gradient(180deg,#08080805,#140b0760 42%,#130d0acd 65%,#0d0c0bf7 87%,#0d0c0b)}
.route-card .service-visual{height:auto;margin:0}
.route-card small{margin-top:auto;padding-top:190px}
.route-service-icon{position:absolute!important;z-index:3!important;top:24px;right:24px;width:48px;height:48px;border:1px solid #ffffff22;border-radius:14px;display:grid;place-items:center;color:#ff936c;background:#0a0908a8;backdrop-filter:blur(12px);box-shadow:inset 0 1px 0 #ffffff16,0 10px 30px #0005;transition:transform .28s cubic-bezier(.16,1,.3,1),border-color .2s,background .2s}
.route-service-icon svg{width:23px;height:23px}
.service-link-icon{width:17px;height:17px;display:inline-grid;place-items:center;flex:0 0 auto;color:#ff8b63;transition:transform .22s cubic-bezier(.16,1,.3,1)}
.service-link-icon svg{width:15px;height:15px;display:block}
.service .tags li:has(a){border:0;background:transparent}
.service .tags a,.related-links a{display:inline-flex!important;align-items:center;gap:7px}
.service .tags a{min-height:34px;padding:6px 11px!important;border:1px solid #ffffff24;border-radius:999px;background:linear-gradient(180deg,#ffffff0d,#ffffff05);color:#ded8d3;box-shadow:inset 0 1px 0 #ffffff0d;cursor:pointer;transition:transform .22s cubic-bezier(.16,1,.3,1),border-color .2s ease,background .2s ease,color .2s ease,box-shadow .22s ease}
.service .tags a::after{content:"↗";font-size:11px;line-height:1;color:#ff936c;opacity:.82;transition:transform .22s cubic-bezier(.16,1,.3,1),opacity .2s ease}
.service .tags a:active{transform:scale(.96)}
.service .tags a:focus-visible{outline:2px solid #ff7b4d;outline-offset:3px;border-color:#ff936c}
.detail-hero-visual{position:absolute;z-index:0;inset:0;margin:0;pointer-events:none}
.detail-hero-visual img{width:100%;height:100%;object-fit:cover;object-position:center;opacity:.48;filter:saturate(.9) contrast(1.04)}
.detail-hero-visual::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#0a0a0a 0%,#0a0a0add 37%,#0a0a0a66 76%,#0a0a0acc 100%),linear-gradient(0deg,#0a0a0a 0%,transparent 28%,transparent 72%,#0a0a0a 100%)}
.page-hero>:not(.detail-hero-visual){position:relative;z-index:1}
@media(hover:hover) and (pointer:fine){
  .service:hover .service-visual img,.route-card:hover .service-visual img{transform:scale(1.065);filter:saturate(1.02) contrast(1.08);opacity:.98}
  .service:hover .service-visual::after,.route-card:hover .service-visual::after{transform:translateX(45%) rotate(4deg);opacity:1}
  .service:hover .service-link-icon,.related-links a:hover .service-link-icon{transform:scale(1.14) rotate(-4deg)}
  .service .tags a:hover{transform:translateY(-2px);border-color:#ff8b6380;background:linear-gradient(180deg,#ff8b6324,#ff8b630b);color:#fff;box-shadow:0 8px 22px #0005,inset 0 1px 0 #ffffff1c}
  .service .tags a:hover::after{transform:translate(2px,-2px);opacity:1}
  .route-card:hover .route-service-icon{transform:translateY(-3px) rotate(3deg);border-color:#ff8b6370;background:#17100dcf}
}
@media(max-width:680px){
  .service{min-height:485px}.route-card{min-height:475px}
  .service-visual,.route-card .service-visual{height:auto;margin:0}
  .service-visual img{object-position:center 22%;opacity:.86}
  .service .card-top{padding-bottom:112px}.route-card small{padding-top:180px}
  .route-service-icon{top:20px;right:20px;width:44px;height:44px}
  .detail-hero-visual img{object-position:62% center;opacity:.4}
  .detail-hero-visual::after{background:linear-gradient(90deg,#0a0a0aee 0%,#0a0a0aaa 68%,#0a0a0acc 100%),linear-gradient(0deg,#0a0a0a 0%,transparent 35%,#0a0a0a88 100%)}
}
@media(prefers-reduced-motion:reduce){.service-visual img,.service-visual::after,.route-service-icon,.service-link-icon{transition:none!important}.service:hover .service-visual img,.route-card:hover .service-visual img{transform:none}}
.motion-paused .service-visual img,.motion-paused .service-visual::after,.motion-paused .route-service-icon,.motion-paused .service-link-icon{transition:none!important;transform:none!important}
