/* HAPYCH CONNECT: three restrained, local effects inspired by Vue Bits.
   No remote resources or runtime dependencies. */
@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference) {
  /* 1. Spotlight Card: a discreet warm trace behind existing tariff content. */
  .hc-spotlight { position:relative; isolation:isolate; --hc-x:50%; --hc-y:50% }
  .hc-spotlight::before {
    content:""; position:absolute; inset:0; z-index:0; pointer-events:none;
    background:radial-gradient(250px circle at var(--hc-x) var(--hc-y),
      rgba(255,157,75,.145), rgba(248,112,42,.07) 28%, transparent 70%);
    opacity:0; transition:opacity .23s ease;
  }
  .hc-spotlight.hc-spotlight-on::before { opacity:1 }
  .hc-spotlight > * { position:relative; z-index:1 }

  /* 2. Magnet: only the miniature brand marks move, not interactive hit boxes. */
  .site-header .brand-mark, .footer-brand img {
    translate:var(--hc-mx,0px) var(--hc-my,0px);
    transition:translate .16s ease-out;
    will-change:auto;
  }

  /* 4. Decrypted Text: the footer remains motionless until discovered. */
  [data-hc-decrypt] {
    display:inline-block;
    min-width:132px;
    text-align:right;
    white-space:nowrap;
    cursor:default;
    font-variant-numeric:tabular-nums;
  }
  [data-hc-decrypt].hc-decrypted [data-hc-decrypt-label] {
    color:#efb37c;
  }

  /* 3. Click Spark: surprising yet short-lived reaction only on mascot. */
  .hero-art .art-emblem[data-hc-spark] {
    display:block; appearance:none; border:0; padding:0; margin:0;
    background:transparent; cursor:pointer; line-height:0;
  }
  .hero-art .art-emblem[data-hc-spark] img { display:block; width:100%; height:auto }
  .hc-click-spark { position:absolute; width:0; height:0; z-index:6; pointer-events:none }
  .hc-click-spark i {
    position:absolute; top:-5px; left:-2px; display:block; width:3px; height:10px;
    border-radius:2px; background:linear-gradient(#fff0b6,#ff922c);
    box-shadow:0 0 7px #e87a3880;
    animation:hc-spark-fly .58s cubic-bezier(.15,.7,.26,1) both;
  }
  @keyframes hc-spark-fly {
    0% { opacity:1; transform:translate3d(0,0,0) rotate(var(--hc-angle)) scale(1) }
    80% { opacity:.77 }
    100% { opacity:0; transform:translate3d(var(--hc-dx),var(--hc-dy),0)
                            rotate(var(--hc-angle)) scale(.12) }
  }
}
/* Preserve focus visibility even when motion is switched off. */
.hero-art .art-emblem[data-hc-spark]:focus-visible {
  outline:2px solid #ffb56c; outline-offset:9px; border-radius:10px;
}
@media (hover:none), (pointer:coarse), (prefers-reduced-motion:reduce) {
  .hc-click-spark { display:none }
  .hc-spotlight::before { display:none }
  .site-header .brand-mark, .footer-brand img { translate:0 0 !important }
  .hero-art .art-emblem[data-hc-spark] {
    display:block; appearance:none; border:0; padding:0; margin:0;
    background:transparent; line-height:0;
  }
  .hero-art .art-emblem[data-hc-spark] img { display:block; width:100%; height:auto }
}

