/* Shared motion extends the planner's existing timing tokens. */
:root{--ease-out:cubic-bezier(.23,1,.32,1);--duration-press:120ms}
:is(button,a.action,a.button,.quick-links a,.quick-groups button):not(.open-destination,.photo-card,[data-gallery]):not(:disabled,[aria-disabled="true"]){background-image:linear-gradient(180deg,#ffffff1f,#ffffff00 52%,#0000000a);box-shadow:inset 0 1px 0 #ffffff70,inset 0 -2px 0 #0000001a,0 3px 0 #30231e20,0 6px 12px #30231e12;isolation:isolate}
button:disabled,[aria-disabled="true"]{box-shadow:none}
@media(prefers-reduced-motion:no-preference){
 body[data-input="pointer"] :is(button,a.action,a.button,.quick-links a,.quick-groups button):not(.open-destination,.photo-card,[data-gallery]):not(:disabled,[aria-disabled="true"]){transition:transform var(--duration-press) var(--ease-out)}
 body[data-input="pointer"] :is(button,a.action,a.button,.quick-links a,.quick-groups button):not(.open-destination,.photo-card,[data-gallery]):not(:disabled,[aria-disabled="true"]):active{transform:translateY(2px) scale(.98);box-shadow:inset 0 2px 3px #00000024,0 1px 0 #30231e20}
}
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
 :is(button,a.action,a.button,.quick-links a,.quick-groups button):not(.open-destination,.photo-card,[data-gallery]):not(:disabled,[aria-disabled="true"]){transition:transform var(--duration-press) var(--ease-out)}
 :is(button,a.action,a.button,.quick-links a,.quick-groups button):not(.open-destination,.photo-card,[data-gallery]):not(:disabled,[aria-disabled="true"]):hover{transform:translateY(-2px)}
 .portal-card,.route-card,.discovery-card,.country-list>article,.browse-card{transition:transform 200ms var(--ease-out)}
 .portal-card:hover,.route-card:hover,.discovery-card:hover,.country-list>article:hover,.browse-card:hover{transform:translateY(-3px)}
}
.motion-image-frame{overflow:clip;border-radius:18px;min-width:0;line-height:0;background:#f3eee9}
.motion-image-frame>img{display:block;width:100%;border-radius:0}
.hero>.motion-planner-hero-frame{grid-column:2;grid-row:1/5;align-self:center}
@supports(animation-timeline:view()){
 @media(min-width:761px) and (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
  body:not([data-input="keyboard"]) .motion-image-frame>img{animation:travel-parallax linear both;animation-timeline:view();animation-range:entry 0% exit 100%}
 }
}
@keyframes travel-parallax{from{transform:translateY(-12px) scale(1.12)}to{transform:translateY(12px) scale(1.12)}}
@media(prefers-reduced-motion:reduce){
 .motion-image-frame>img,.motion-reveal{animation:none!important;transform:none!important;opacity:1!important}
}
@media print{
 .motion-image-frame{overflow:visible;background:transparent}
 .motion-image-frame>img,.motion-reveal{animation:none!important;transform:none!important;opacity:1!important}
 button,a.action,a.button,.quick-links a{box-shadow:none!important;background-image:none!important}
}