:root{
--hkp-yellow:#FFDE02;
--hkp-yellow-press:#E8CA00;
--hkp-yellow-wash:rgba(255,222,2,.14);
--hkp-black:#07070A;
--hkp-dark:#111114;
--hkp-paper:#FFFFFF;
--hkp-line-inv:rgba(255,255,255,.12);
--hkp-display:'Bebas Neue',sans-serif;
--hkp-sans:'Barlow',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
--hkp-alt:'Manrope',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
--hkp-ease:cubic-bezier(.22,.61,.36,1);
}

.hkp-nv-wrapper{
--hkp-yellow:#FFDE02;
--hkp-yellow-press:#E8CA00;
--hkp-yellow-wash:rgba(255,222,2,.14);
--hkp-black:#07070A;
--hkp-dark:#111114;
--hkp-paper:#FFFFFF;
--hkp-line-inv:rgba(255,255,255,.12);
--hkp-display:'Bebas Neue',sans-serif;
--hkp-sans:'Barlow',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
--hkp-alt:'Manrope',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
--hkp-ease:cubic-bezier(.22,.61,.36,1);
font-family:var(--hkp-sans);
-webkit-font-smoothing:antialiased;
}

.hkp-nv-wrapper *,
.hkp-nv-wrapper *::before,
.hkp-nv-wrapper *::after{box-sizing:border-box;}
.hkp-nv-wrapper ul,.hkp-nv-wrapper li,.hkp-nv-wrapper p{margin:0;padding:0;}
.hkp-nv-wrapper ul{list-style:none;}

/* the theme ships a white page background; the whole site sits on black, so set it here (nav loads on every page).
   Stops the translucent bar going grey and the 1px white seam showing under it. */
body{background:#07070A !important;}
/* selected text in brand colours instead of the browser's grey/blue block */
::selection{background:#FFDE02;color:#07070A;}
/* global styles saved in the Site Editor can paint a background on every heading; the pages own their heading styles */
h1,h2,h3,h4,h5,h6{background:transparent !important;}

/* ===== BAR ===== */
.hkp-nv-bar{
position:sticky;top:0;z-index:99980;
background:rgba(7,7,10,.86);
-webkit-backdrop-filter:saturate(180%) blur(14px);
backdrop-filter:saturate(180%) blur(14px);
border-bottom:1px solid transparent;
transition:border-color .35s ease,box-shadow .35s ease,background .35s ease;
}
.hkp-nv-bar.is-stuck{
border-bottom-color:var(--hkp-line-inv);
box-shadow:0 6px 26px rgba(0,0,0,.35);
background:rgba(7,7,10,.96);
}

.hkp-nv-inner{
width:100%;max-width:1320px;margin:0 auto;padding:0 22px;
display:flex;align-items:center;justify-content:space-between;gap:20px;
height:66px;transition:height .35s var(--hkp-ease);
}
.hkp-nv-bar.is-stuck .hkp-nv-inner{height:60px;}

/* animated gradient line, only once the bar is stuck (needs hikepresence-effects) */
.hkp-nv-bar .hkp-nv-line{position:absolute;left:0;right:0;bottom:-1px;opacity:0;transition:opacity .35s ease;}
.hkp-nv-bar.is-stuck .hkp-nv-line{opacity:.85;}

/* logo, forced white on the dark bar */
.hkp-nv-brand{display:flex;align-items:center;flex:none;text-decoration:none;padding:6px 0;}
.hkp-nv-wrapper .hkp-nv-logo{
display:block;width:auto;height:42px;
border:0 !important;outline:0 !important;box-shadow:none !important;border-radius:0 !important;
transition:height .35s var(--hkp-ease);
}
.hkp-nv-bar.is-stuck .hkp-nv-logo{height:38px;}

/* desktop menu */
.hkp-nv-menu{display:none;align-items:center;gap:4px;}
.hkp-nv-menu a{
position:relative;display:inline-block;padding:9px 14px;border-radius:9px;
font-size:14.5px;font-weight:500;letter-spacing:.01em;
color:rgba(255,255,255,.78);text-decoration:none;text-transform:none;
transition:color .3s ease,background .3s ease;
}
.hkp-nv-menu a::after{
content:'';position:absolute;left:14px;right:14px;bottom:4px;height:1.5px;
background:var(--hkp-yellow);border-radius:2px;
transform:scaleX(0);transform-origin:left;
transition:transform .4s var(--hkp-ease);
}
.hkp-nv-menu a:hover{color:#fff;background:rgba(255,255,255,.06);}
.hkp-nv-menu a:hover::after,
.hkp-nv-menu a.is-active::after{transform:scaleX(1);}
.hkp-nv-menu a.is-active{color:var(--hkp-yellow);}

/* nav action button */
.hkp-nv-actions{display:none;align-items:center;flex:none;}
.hkp-nav-cta{
display:inline-flex;align-items:center;justify-content:center;gap:9px;
min-height:44px;padding:0 22px;border-radius:12px;
background:var(--hkp-yellow);color:var(--hkp-black);border:1px solid var(--hkp-yellow);
font-family:var(--hkp-alt);font-size:14.5px;font-weight:700;letter-spacing:.01em;
text-transform:none;text-decoration:none;
box-shadow:0 6px 18px rgba(255,222,2,.18);
transition:transform .4s var(--hkp-ease),box-shadow .4s var(--hkp-ease),background .3s ease,border-color .3s ease;
}
.hkp-nav-cta:hover{
background:#fff;border-color:#fff;color:var(--hkp-black);
transform:translateY(-2px);box-shadow:0 12px 28px rgba(255,222,2,.24);
}
.hkp-nav-cta svg{width:15px;height:15px;flex:none;}

/* burger */
.hkp-nv-burger{
display:flex;flex-direction:column;justify-content:center;gap:5px;
width:44px;height:44px;padding:0 11px;flex:none;
background:none;border:1px solid rgba(255,255,255,.18);border-radius:12px;cursor:pointer;
transition:border-color .3s ease,background .3s ease;
}
.hkp-nv-burger:hover{border-color:rgba(255,222,2,.55);background:var(--hkp-yellow-wash);}
.hkp-nv-burger:focus-visible{outline:2px solid var(--hkp-yellow);outline-offset:2px;}
.hkp-nv-burger span{
display:block;height:1.8px;width:100%;background:#fff;border-radius:2px;
transition:transform .4s var(--hkp-ease),opacity .25s ease;
}
.hkp-nv-burger[aria-expanded="true"] span:nth-child(1){transform:translateY(6.8px) rotate(45deg);}
.hkp-nv-burger[aria-expanded="true"] span:nth-child(2){opacity:0;}
.hkp-nv-burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-6.8px) rotate(-45deg);}

/* ===== MOBILE DRAWER (portaled to body, literal values only, no vars) ===== */
.hkp-nv-scrim{
position:fixed !important;inset:0;z-index:999990 !important;
background:rgba(0,0,0,.62);
opacity:0;visibility:hidden;
transition:opacity .4s ease,visibility .4s ease;
}
.hkp-nv-scrim.is-open{opacity:1;visibility:visible;}
.hkp-nv-scrim[hidden],
.hkp-nv-drawer[hidden]{display:none !important;}

.hkp-nv-drawer{
position:fixed !important;top:0 !important;right:0 !important;bottom:0 !important;left:auto !important;
z-index:999991 !important;
width:min(86vw,340px);max-width:340px;
margin:0 !important;
background:#111114 !important;
box-shadow:-16px 0 44px rgba(0,0,0,.5);
transform:translateX(102%);
transition:transform .48s cubic-bezier(.22,.61,.36,1);
display:flex !important;flex-direction:column;
padding:18px 22px calc(26px + env(safe-area-inset-bottom,0px));
overflow-y:auto;
font-family:'Barlow',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
-webkit-font-smoothing:antialiased;
box-sizing:border-box;
}
.hkp-nv-drawer *,
.hkp-nv-drawer *::before,
.hkp-nv-drawer *::after{box-sizing:border-box;}
.hkp-nv-drawer ul,.hkp-nv-drawer li,.hkp-nv-drawer p{margin:0;padding:0;list-style:none;}
.hkp-nv-drawer.is-open{transform:translateX(0) !important;}

.hkp-nv-drawer-top{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:30px;}
.hkp-nv-drawer .hkp-nv-drawer-logo{
display:block;width:auto;height:38px;
border:0 !important;outline:0 !important;box-shadow:none !important;border-radius:0 !important;
}
.hkp-nv-close{
display:flex;align-items:center;justify-content:center;
width:42px;height:42px;flex:none;padding:0;
background:none;border:1px solid rgba(255,255,255,.16);border-radius:12px;
color:#FFFFFF;cursor:pointer;transition:background .3s ease,border-color .3s ease;
}
.hkp-nv-close:hover{background:rgba(255,222,2,.14);border-color:rgba(255,222,2,.55);}
.hkp-nv-close:focus-visible{outline:2px solid #FFDE02;outline-offset:2px;}
.hkp-nv-close svg{width:19px;height:19px;}

.hkp-nv-drawer-menu li{border-bottom:1px solid rgba(255,255,255,.10);}
.hkp-nv-drawer-menu li:last-child{border-bottom:none;}
.hkp-nv-drawer .hkp-nv-drawer-menu a{
display:flex !important;align-items:center;justify-content:space-between;gap:12px;
padding:17px 2px;font-size:17px;font-weight:500;letter-spacing:.01em;
color:#FFFFFF !important;text-decoration:none !important;text-transform:none;
visibility:visible !important;opacity:1 !important;
transition:color .3s ease,padding-left .35s cubic-bezier(.22,.61,.36,1);
}
.hkp-nv-drawer .hkp-nv-drawer-menu a:hover,
.hkp-nv-drawer .hkp-nv-drawer-menu a.is-active{color:#FFDE02 !important;padding-left:6px;}
.hkp-nv-drawer-menu svg{width:16px;height:16px;color:rgba(255,255,255,.5);flex:none;}
.hkp-nv-drawer-menu a:hover svg,
.hkp-nv-drawer-menu a.is-active svg{color:#FFDE02;}

.hkp-nv-drawer-foot{margin-top:auto;padding-top:32px;}
.hkp-nv-drawer-foot p{font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.5);margin-bottom:10px;}
.hkp-nv-drawer-mail{
display:inline-flex;align-items:center;gap:9px;
font-size:15px;font-weight:500;color:#FFFFFF !important;text-decoration:none !important;
border-bottom:1px solid rgba(255,255,255,.22);padding-bottom:4px;
transition:color .3s ease,border-color .3s ease;
}
.hkp-nv-drawer-mail:hover{color:#FFDE02 !important;border-color:#FFDE02;}
.hkp-nv-drawer-mail svg{width:16px;height:16px;flex:none;}

/* ===== BREAKPOINTS ===== */
@media (min-width:981px){
.hkp-nv-inner{padding:0 40px;height:76px;}
.hkp-nv-bar.is-stuck .hkp-nv-inner{height:66px;}
.hkp-nv-wrapper .hkp-nv-logo{height:50px;}
.hkp-nv-bar.is-stuck .hkp-nv-logo{height:44px;}
.hkp-nv-menu{display:flex;}
.hkp-nv-actions{display:flex;}
.hkp-nv-burger{display:none;}
}

/* nav action button never shows on mobile, sticky bar carries the CTA */
@media (max-width:980px){
.hkp-nv-wrapper .hkp-nav-cta{display:none !important;}
.hkp-nv-wrapper .hkp-nv-menu{display:none !important;}
}

@media (prefers-reduced-motion:reduce){
.hkp-nv-drawer,
.hkp-nv-scrim,
.hkp-nv-inner,
.hkp-nv-logo,
.hkp-nv-burger span{transition:none !important;}
}

:root{
  --hkp-yellow:#FFDE02;
  --hkp-yellow-press:#E8CA00;
  --hkp-black:#07070A;
  --hkp-dark:#111114;
  --hkp-paper:#FFFFFF;
  --hkp-display:'Bebas Neue',sans-serif;
  --hkp-sans:'Barlow',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --hkp-alt:'Manrope',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --hkp-ease:cubic-bezier(.22,.61,.36,1);
}

.hkp-ft-wrapper{
  --hkp-yellow:#FFDE02;
  --hkp-yellow-press:#E8CA00;
  --hkp-black:#07070A;
  --hkp-dark:#111114;
  --hkp-paper:#FFFFFF;
  --hkp-display:'Bebas Neue',sans-serif;
  --hkp-sans:'Barlow',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --hkp-alt:'Manrope',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --hkp-ease:cubic-bezier(.22,.61,.36,1);
  font-family:var(--hkp-sans);
  line-height:1.65;
  font-size:16px;
  -webkit-font-smoothing:antialiased;
}

.hkp-ft-wrapper *,
.hkp-ft-wrapper *::before,
.hkp-ft-wrapper *::after{box-sizing:border-box;}

.hkp-ft-wrapper p,
.hkp-ft-wrapper h2,
.hkp-ft-wrapper h3,
.hkp-ft-wrapper ul,
.hkp-ft-wrapper li{margin:0;padding:0;}
.hkp-ft-wrapper ul{list-style:none;}

.hkp-ft-shell{width:100%;max-width:1320px;margin:0 auto;padding:0 22px;}

/* ===== CLOSING BAND, yellow, no buttons per CTA placement rule ===== */
.hkp-ft-band{
  position:relative;overflow:hidden;
  background:linear-gradient(140deg,#F2CB00 0%,#FFDE02 55%,#F2CB00 100%);
  color:var(--hkp-black);padding:64px 0;text-align:center;
}
.hkp-ft-band::before,
.hkp-ft-band::after{
  content:'';position:absolute;border-radius:50%;pointer-events:none;
  background:radial-gradient(circle,rgba(7,7,10,.07) 0%,rgba(7,7,10,0) 70%);
}
.hkp-ft-band::before{width:420px;height:420px;top:-170px;left:-110px;animation:hkpFtDrift 16s ease-in-out infinite;}
.hkp-ft-band::after{width:520px;height:520px;bottom:-260px;right:-140px;animation:hkpFtDrift 20s ease-in-out infinite reverse;}
@keyframes hkpFtDrift{0%,100%{transform:translate3d(0,0,0);}50%{transform:translate3d(26px,-22px,0);}}

.hkp-ft-band-inner{position:relative;z-index:1;max-width:820px;margin:0 auto;}
.hkp-ft-band h2{
  font-family:var(--hkp-display);font-weight:400;font-size:42px;line-height:1.06;
  letter-spacing:.012em;text-transform:uppercase;color:var(--hkp-black);margin-bottom:24px;
}
.hkp-ft-band h2 em{font-style:normal;font-weight:400;color:rgba(7,7,10,.55);}
.hkp-ft-band p{font-size:16px;line-height:1.75;color:rgba(7,7,10,.78);margin-bottom:32px;}
.hkp-ft-mail{
  display:inline-flex;align-items:center;gap:10px;
  font-size:17px;font-weight:600;color:var(--hkp-black);text-decoration:none;
  border-bottom:1px solid rgba(7,7,10,.45);padding-bottom:5px;
  transition:border-color .35s ease,gap .4s var(--hkp-ease);
}
.hkp-ft-mail:hover{color:var(--hkp-black);border-color:var(--hkp-black);gap:15px;}
.hkp-ft-mail svg{width:17px;height:17px;flex:none;}

/* ===== FOOTER ===== */
.hkp-ft-main{background:var(--hkp-black);padding:56px 0 24px;color:rgba(255,255,255,.66);}
.hkp-ft-grid{display:grid;grid-template-columns:1fr;gap:38px;padding-bottom:34px;}

.hkp-ft-brand{max-width:400px;}
.hkp-ft-wrapper .hkp-ft-logo{
  display:block;width:auto;height:50px;margin-bottom:18px;
  border:0 !important;outline:0 !important;box-shadow:none !important;border-radius:0 !important;
}
.hkp-ft-brand p{font-size:14.5px;line-height:1.75;color:rgba(255,255,255,.62);}

.hkp-ft-col h3{
  font-family:var(--hkp-alt);font-size:12px;font-weight:600;letter-spacing:.14em;
  text-transform:uppercase;color:var(--hkp-yellow);margin-bottom:18px;
}
.hkp-ft-col li{margin-bottom:11px;}
.hkp-ft-col a{
  font-size:14.5px;color:rgba(255,255,255,.62);text-decoration:none;
  transition:color .3s ease,padding-left .35s var(--hkp-ease);display:inline-block;
}
.hkp-ft-col a:hover{color:var(--hkp-yellow);padding-left:5px;}

.hkp-ft-social{display:flex;gap:10px;margin-top:20px;}
.hkp-ft-social a{
  width:42px;height:42px;border-radius:12px;display:flex;align-items:center;justify-content:center;
  border:1px solid rgba(255,255,255,.16);color:rgba(255,255,255,.72);
  transition:transform .4s var(--hkp-ease),border-color .3s ease,color .3s ease,background .3s ease;
  padding:0;
}
.hkp-ft-social a:hover{
  transform:translateY(-4px);border-color:var(--hkp-yellow);
  color:var(--hkp-yellow);background:rgba(255,222,2,.12);padding-left:0;
}
.hkp-ft-social svg{width:17px;height:17px;}

.hkp-ft-main .hkp-fx-line{opacity:.45;}
.hkp-ft-main .hkp-fx-line + .hkp-ft-bottom{border-top-color:transparent;}
.hkp-ft-bottom{
  border-top:1px solid rgba(255,255,255,.09);padding-top:22px;
  display:flex;flex-direction:column;gap:12px;align-items:center;text-align:center;
}
.hkp-ft-bottom p{font-size:12.5px;color:rgba(255,255,255,.42);}
.hkp-ft-legal{display:flex;gap:20px;flex-wrap:wrap;justify-content:center;}
.hkp-ft-legal a{font-size:12.5px;color:rgba(255,255,255,.42);text-decoration:none;transition:color .3s ease;}
.hkp-ft-legal a:hover{color:var(--hkp-yellow);}

/* ===== MOBILE STICKY CTA BAR, literal hex only, no vars ===== */
.hkp-ft-sticky{
  display:none;
  position:fixed;left:0;right:0;bottom:0;z-index:99990;
  padding:10px 14px calc(10px + env(safe-area-inset-bottom,0px));
  background:#07070A;
  border-top:1px solid rgba(255,255,255,.14);
  box-shadow:0 -8px 26px rgba(0,0,0,.45);
}
.hkp-ft-sticky a{
  display:flex;align-items:center;justify-content:space-between;gap:9px;
  width:100%;min-height:52px;border-radius:12px;padding:0 22px;
  background:#FFDE02;color:#07070A;
  font-family:'Manrope',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  font-size:16px;font-weight:700;letter-spacing:.01em;
  text-transform:none;text-decoration:none;border:1px solid #FFDE02;
}
.hkp-ft-sticky a:active{background:#E8CA00;border-color:#E8CA00;}
.hkp-ft-sticky svg{width:17px;height:17px;flex:none;}

@media (max-width:980px){
  .hkp-ft-wrapper .hkp-ft-sticky{display:block !important;}
  body{padding-bottom:80px;}
}

@media (min-width:600px){
  .hkp-ft-band{padding:80px 0;}
  .hkp-ft-band h2{font-size:52px;}
  .hkp-ft-grid{grid-template-columns:repeat(2,1fr);gap:44px 36px;}
  .hkp-ft-brand{grid-column:1 / -1;}
}

@media (min-width:900px){
  .hkp-ft-shell{padding:0 40px;}
  .hkp-ft-band{padding:104px 0;}
  .hkp-ft-band h2{font-size:62px;}
  .hkp-ft-band p{font-size:17px;line-height:1.8;}
  .hkp-ft-main{padding:72px 0 30px;}
  .hkp-ft-grid{grid-template-columns:2.1fr 1fr 1fr 1.15fr;gap:52px;padding-bottom:46px;}
  .hkp-ft-brand{grid-column:auto;}
  .hkp-ft-bottom{flex-direction:row;justify-content:space-between;text-align:left;}
  .hkp-ft-legal{justify-content:flex-end;}
}

@media (prefers-reduced-motion:reduce){
  .hkp-ft-wrapper .hkp-ft-band::before,
  .hkp-ft-wrapper .hkp-ft-band::after{animation:none !important;}
}

:root{--hp-fx-accent:#FFDE02;}
/* Site effects (hp-fx): cursor dot, sparkle trail, click burst, card spotlight/edge/tilt, gradient lines.
   Loaded only when Appearance → SEO & Schema → Site effects is switched on. Colour comes from --hp-fx-accent
   (inline from settings, falls back to the theme accent). Class aliases hkp-fx-* are accepted too. */
@property --hp-fx-angle { syntax: '<angle>'; inherits: false; initial-value: 0deg; }
@keyframes hpFxSpin { to { --hp-fx-angle: 360deg; } }

:root {
  --hp-fx-accent: #FFDE02;
  --hp-fx-c1: var(--hp-fx-accent);
  --hp-fx-c2: color-mix(in srgb, var(--hp-fx-accent) 72%, #000);
  --hp-fx-c3: color-mix(in srgb, var(--hp-fx-accent) 45%, #fff);
  --hp-fx-c4: #fff;
  --hp-fx-ink: #0f1420;
}

/* ===== cursor dot ===== */
body.hp-fx-cursor,
body.hp-fx-cursor * { cursor: none !important; }
.hp-fx-dot {
  position: fixed; left: 0; top: 0; z-index: 2147483000;
  width: 8px; height: 8px; margin: -4px 0 0 -4px;
  pointer-events: none; opacity: 0; will-change: transform;
  mix-blend-mode: difference; transition: opacity .25s ease;
}
.hp-fx-dot.is-shown { opacity: 1; }
.hp-fx-dot i {
  display: block; width: 100%; height: 100%; border-radius: 50%; background: #fff;
  transform: scale(1); transition: transform .38s cubic-bezier(.34,1.56,.64,1);
}
.hp-fx-dot.is-hover i { transform: scale(2.6); }
.hp-fx-dot.is-press i { transform: scale(.6); transition-duration: .12s; }
.hp-fx-dot.is-hover.is-press i { transform: scale(2); }

/* ===== sparkle trail ===== */
.hp-fx-spark {
  position: fixed; left: 0; top: 0; z-index: 2147482990; pointer-events: none; border-radius: 50%;
  width: var(--s); height: var(--s); margin: calc(var(--s) / -2) 0 0 calc(var(--s) / -2);
  background: var(--c); box-shadow: 0 0 6px var(--c);
  animation: hpFxSpark var(--t) cubic-bezier(.1,.6,.3,1) forwards;
}
@keyframes hpFxSpark {
  0%   { transform: translate3d(var(--x), var(--y), 0) scale(.4); opacity: 0; }
  15%  { transform: translate3d(var(--x), var(--y), 0) scale(1); opacity: 1; }
  100% { transform: translate3d(calc(var(--x) + var(--dx)), calc(var(--y) + var(--dy)), 0) scale(.2); opacity: 0; }
}

/* ===== click burst ===== */
.hp-fx-burst { position: fixed; left: 0; top: 0; z-index: 2147482995; pointer-events: none; }
.hp-fx-burst i { display: block; position: absolute; border-radius: 50%; }
.hp-fx-burst-ring {
  width: 24px; height: 24px; margin: -12px 0 0 -12px;
  border: 1.5px solid var(--hp-fx-c1);
  animation: hpFxBurstRing .5s cubic-bezier(.2,.7,.3,1) forwards;
}
.hp-fx-burst-p {
  width: 5px; height: 5px; margin: -2.5px 0 0 -2.5px; background: var(--c, var(--hp-fx-c1));
  animation: hpFxBurstP .55s cubic-bezier(.1,.8,.3,1) forwards;
}
@keyframes hpFxBurstRing { from { transform: scale(0); opacity: 1; } to { transform: scale(3); opacity: 0; } }
@keyframes hpFxBurstP { from { transform: translate(0,0) scale(1); opacity: 1; } to { transform: translate(var(--dx), var(--dy)) scale(.2); opacity: 0; } }

/* ===== cards ===== */
.hp-fx-card, .hkp-fx-card { position: relative; isolation: isolate; overflow: visible !important; --hp-fx-mx: 50%; --hp-fx-my: 50%; }
.hp-fx-glow, .hp-fx-edge { position: absolute; z-index: -1; pointer-events: none; border-radius: inherit; opacity: 0; transition: opacity .35s ease; }
.hp-fx-glow {
  inset: 0;
  background: radial-gradient(360px circle at var(--hp-fx-mx) var(--hp-fx-my), color-mix(in srgb, var(--hp-fx-c1) 22%, transparent), color-mix(in srgb, var(--hp-fx-c1) 6%, transparent) 45%, transparent 70%);
}
/* light cards: accent spotlight over accent / dark / ink sweep */
.hp-fx-edge {
  inset: -1px; padding: 1px;
  background:
    radial-gradient(240px circle at var(--hp-fx-mx) var(--hp-fx-my), var(--hp-fx-c1), transparent 70%),
    conic-gradient(from var(--hp-fx-angle), var(--hp-fx-c2), var(--hp-fx-c1), var(--hp-fx-ink), var(--hp-fx-c2));
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
          mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
          mask-composite: exclude;
  animation: hpFxSpin 4s linear infinite; animation-play-state: paused;
}
/* dark glass cards: white spotlight over a dimmed accent / pale / white sweep */
.hp-fx-card--dark .hp-fx-edge, .hkp-fx-card--dark .hp-fx-edge {
  background:
    radial-gradient(260px circle at var(--hp-fx-mx) var(--hp-fx-my), rgba(255,255,255,.95), rgba(255,255,255,0) 70%),
    linear-gradient(rgba(0,0,0,.5), rgba(0,0,0,.5)),
    conic-gradient(from var(--hp-fx-angle), var(--hp-fx-c1), var(--hp-fx-c2), var(--hp-fx-c3), var(--hp-fx-c4), var(--hp-fx-c1));
}
.hp-fx-card:hover .hp-fx-glow, .hkp-fx-card:hover .hp-fx-glow { opacity: 1; }
.hp-fx-card:hover .hp-fx-edge, .hkp-fx-card:hover .hp-fx-edge { opacity: 1; animation-play-state: running; }
.hp-fx-card.is-tilting, .hkp-fx-card.is-tilting {
  transform: translateY(var(--hkp-lift, var(--hp-fx-lift, 0px))) perspective(900px) rotateX(var(--hp-fx-rx, 0deg)) rotateY(var(--hp-fx-ry, 0deg)) !important;
  transition-duration: .14s !important;
}

/* ===== gradient lines ===== */
.hp-fx-line, .hkp-fx-line {
  display: block; height: 1px; border: 0; margin: 0; padding: 0;
  background: conic-gradient(from var(--hp-fx-angle), var(--hp-fx-c1), var(--hp-fx-c2), var(--hp-fx-c4), var(--hp-fx-c1), var(--hp-fx-c2));
  animation: hpFxSpin 4s linear infinite; opacity: .75;
}

/* ===== guards ===== */
@media (pointer: coarse) {
  body.hp-fx-cursor, body.hp-fx-cursor * { cursor: auto !important; }
  .hp-fx-dot, .hp-fx-spark, .hp-fx-burst { display: none !important; }
}
@media (prefers-reduced-motion: reduce) {
  .hp-fx-spark, .hp-fx-burst { display: none !important; }
  .hp-fx-edge, .hp-fx-line, .hkp-fx-line { animation: none !important; }
  .hp-fx-card.is-tilting, .hkp-fx-card.is-tilting { transform: none !important; }
  .hp-fx-dot i { transition: none !important; }
}