/* Landing page styles.
   Loaded only by app/routes/_index (links export), so these globals never
   reach the embedded Polaris app.

   The design ships as inline-styled markup, so this file carries only what an
   inline style attribute cannot express: keyframes, :hover, focus rings and
   media queries. Hover rules are keyed on data-hov="N", converted from the
   artboard's `style-hover` attribute.

   Reveal is progressive enhancement by construction: nothing starts hidden,
   so a browser without animation-timeline (Safari, Firefox) simply shows the
   page, and prefers-reduced-motion disables the animation outright. */

html,body{margin:0;padding:0;background:#FFFFFF;color:#211A3A;-webkit-font-smoothing:antialiased;font-family:"Helvetica Neue",Helvetica,"Segoe UI",Arial,sans-serif;}
*{box-sizing:border-box;}
a{color:#0E7490;text-decoration:none;}
a:hover{color:#211A3A;}
@keyframes cl-spin{to{transform:rotate(360deg);}}
@keyframes cl-spin-rev{to{transform:rotate(-360deg);}}
@keyframes cl-breathe{0%,100%{opacity:.42;transform:scale(1);}50%{opacity:.9;transform:scale(1.06);}}
@keyframes cl-sweep{0%{transform:translateX(-120%) skewX(-18deg);}100%{transform:translateX(320%) skewX(-18deg);}}
@keyframes cl-ring{0%{transform:scale(.35);opacity:0;}12%{opacity:.85;}100%{transform:scale(1.5);opacity:0;}}
@keyframes cl-drift{0%,100%{transform:translate3d(0,0,0);}50%{transform:translate3d(0,-14px,0);}}
@keyframes cl-rise{from{opacity:0;transform:translate3d(0,20px,0);filter:blur(6px);}to{opacity:1;transform:none;filter:none;}}
@supports (animation-timeline: view()){
  @media (prefers-reduced-motion: no-preference){
    [data-reveal]{animation:cl-rise .8s cubic-bezier(.2,.7,.2,1) both;animation-timeline:view();animation-range:entry 5% cover 22%;}
  }
}
@media (prefers-reduced-motion: reduce){*{animation:none !important;transition:none !important;}}
/* Hover states, converted from the artboard's style-hover attributes. */
[data-hov="0"]:hover { color:#0E7490; }
[data-hov="1"]:hover { color:#0E7490; }
[data-hov="2"]:hover { color:#0E7490; }
[data-hov="3"]:hover { background:#0E7490; color:#FFFFFF; }
[data-hov="4"]:hover { transform:translateY(-2px); box-shadow:0 28px 50px -22px rgba(14,116,144,1),inset 0 0 0 1px rgba(231,198,124,.85); }
[data-hov="5"]:hover { border-color:#0E7490; color:#0E7490; }
[data-hov="6"]:hover { transform:translateY(-2px); box-shadow:0 30px 52px -20px rgba(14,116,144,1); }
[data-hov="7"]:hover { border-color:#0E7490; color:#0E7490; }
[data-hov="8"]:hover { transform:translateX(6px); box-shadow:0 18px 40px -28px rgba(14,116,144,.9); }
[data-hov="9"]:hover { transform:translateX(6px); box-shadow:0 18px 40px -28px rgba(14,116,144,.9); }
[data-hov="10"]:hover { transform:translateX(6px); box-shadow:0 18px 40px -28px rgba(231,198,124,.8); }
[data-hov="11"]:hover { transform:translateY(-3px); box-shadow:0 20px 44px -30px rgba(14,116,144,.95); }
[data-hov="12"]:hover { transform:translateY(-3px); box-shadow:0 20px 44px -30px rgba(14,116,144,.95); }
[data-hov="13"]:hover { transform:translateY(-3px); box-shadow:0 20px 44px -30px rgba(201,161,90,.9); }
[data-hov="14"]:hover { transform:translateY(-3px); box-shadow:0 24px 50px -34px rgba(14,116,144,.9); }
[data-hov="15"]:hover { transform:translateY(-3px); box-shadow:0 24px 50px -34px rgba(14,116,144,.9); }
[data-hov="16"]:hover { transform:translateY(-3px); box-shadow:0 24px 50px -34px rgba(201,161,90,.85); }
[data-hov="17"]:hover { transform:translateY(-2px); }

/* Keyboard users get the same affordance as mouse users. */
.cl-landing a:focus-visible,
.cl-landing button:focus-visible,
.cl-landing input:focus-visible,
.cl-landing summary:focus-visible {
  outline: 2px solid #0E7490;
  outline-offset: 3px;
  border-radius: 4px;
}

/* Touch / coarse pointers: the cursor glow never runs there (landing.js skips
   it on (hover: none)), so make sure its layer cannot intercept taps. */
@media (hover: none), (pointer: coarse) {
  .cl-landing [data-ref="glowC"] { display: none !important; }
}