/* Adapted from Uiverse.io by joe-watson-sbf / honest-bullfrog-6.
   Existing React button = .container; ::after = .box visual layer.
   No React children or immutable chunks are replaced. Typography/layout kept. */
.services-section .film-card{background:transparent;border-radius:.7rem;border:0;transform:none;box-shadow:none;isolation:isolate;-webkit-backdrop-filter:none;backdrop-filter:none}
.services-section .film-card::before{content:"";background-color:#fab5704c;position:absolute;border-radius:50%;width:6rem;height:6rem;top:30%;right:7%;z-index:-2}
.services-section .film-card::after{content:"";position:absolute;inset:0;z-index:-1;background-color:rgba(255,255,255,.074);border:1px solid rgba(255,255,255,.222);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-radius:.7rem;transition:box-shadow .3s ease,border-color .3s ease}
.services-section .film-card:is(:hover,:focus-visible){transform:none;border:0;box-shadow:none}
.services-section .film-card:is(:hover,:focus-visible)::after{box-shadow:0 0 20px 1px #ffbb763f;border:1px solid rgba(255,255,255,.454)}
.services-section .film-number{position:static}
.services-section .film-number::after{content:"";position:absolute;height:3rem;top:8%;right:5%;border-left:1px solid #fff;pointer-events:none}
.services-section .art-orbit{display:none}
/* Adapted from Uiverse.io by chase2k25 / rare-bear-68; original empty SVG
   contains gradient definitions only, with no cube geometry to fabricate. */
.catalog-section{position:relative;isolation:isolate}
.catalog-section::before{content:"";position:absolute;top:0;bottom:0;left:calc(50% - 50vw);right:calc(50% - 50vw);z-index:-1;pointer-events:none;background:repeating-linear-gradient(135deg,#232526 0px,#232526 60px,#23252699 70px,#414345 130px);mask-image:linear-gradient(transparent,#000 100px,#000 calc(100% - 120px),transparent)}
.catalog-section .store-catalog-pattern{position:absolute;inset:0;z-index:-1;pointer-events:none;overflow:hidden;background:transparent;contain:paint}
.store-catalog-pattern .pattern-bg{width:100%;height:100%;overflow:hidden}
.store-catalog-pattern .cube-svg{position:absolute;width:200%;height:200%;left:-30%;top:-20%;background:transparent;opacity:.7;z-index:1;animation:storeCubeMove 18s linear infinite alternate}
@keyframes storeCubeMove{from{transform:translateY(0) scale(1)}to{transform:translateY(-20%) scale(1.02) rotate(1deg)}}

/* Source: InfinityLoopGames / rotten-dog-63 (user supplied). */
/* From Uiverse.io by InfinityLoopGames */
:is(.button.button-blue,body.tutorial-apple .support,body.tutorial-apple .help-button.primary,body.tutorial-apple .reader-button,body.tutorial-apple .ac-button) {
  --glow-color: rgb(176, 252, 255);
  --glow-spread-color: rgba(123, 251, 255, 0.781);
  --enhanced-glow-color: rgb(206, 255, 255);
  --btn-color: rgb(61, 127, 136);
  border: 0.25em solid var(--glow-color);
  padding: 1em 3em;
  color: var(--glow-color);
  font-size: 15px;
  font-weight: bold;
  background-color: var(--btn-color);
  border-radius: 1em;
  outline: none;
  box-shadow: 0 0 1em 0.25em var(--glow-color),
    0 0 4em 1em var(--glow-spread-color),
    inset 0 0 0.75em 0.25em var(--glow-color);
  text-shadow: 0 0 0.5em var(--glow-color);
  position: relative;
  transition: all 0.3s;
}
:is(.button.button-blue,body.tutorial-apple .support,body.tutorial-apple .help-button.primary,body.tutorial-apple .reader-button,body.tutorial-apple .ac-button)::after {
  pointer-events: none;
  content: "";
  position: absolute;
  top: 120%;
  left: 0;
  height: 100%;
  width: 100%;
  background-color: var(--glow-spread-color);
  filter: blur(2em);
  opacity: 0.7;
  transform: perspective(1.5em) rotateX(35deg) scale(1, 0.6);
}
:is(.button.button-blue,body.tutorial-apple .support,body.tutorial-apple .help-button.primary,body.tutorial-apple .reader-button,body.tutorial-apple .ac-button):is(:hover,:focus-visible) {
  color: var(--btn-color);
  background-color: var(--glow-color);
  box-shadow: 0 0 1em 0.25em var(--glow-color),
    0 0 4em 2em var(--glow-spread-color),
    inset 0 0 0.75em 0.25em var(--glow-color);
}
:is(.button.button-blue,body.tutorial-apple .support,body.tutorial-apple .help-button.primary,body.tutorial-apple .reader-button,body.tutorial-apple .ac-button):active {
  box-shadow: 0 0 0.6em 0.25em var(--glow-color),
    0 0 2.5em 2em var(--glow-spread-color),
    inset 0 0 0.5em 0.25em var(--glow-color);
}

/* Responsive integration: source glow colors/shadows remain intact; compact
   navigation keeps a normal 44px touch target instead of 3em side padding. */
body.tutorial-apple .nav .support{display:inline-flex;align-items:center;justify-content:center;min-height:40px;font-size:12px;padding:.65em 1em;line-height:1.2;white-space:nowrap}
:is(.button.button-blue,body.tutorial-apple .support,body.tutorial-apple .help-button.primary,body.tutorial-apple .reader-button,body.tutorial-apple .ac-button):focus-visible{outline:2px solid #fff;outline-offset:5px}
.support-avatar,.support-dialog>img,body.tutorial-apple .ac-contact-top img{width:260px;height:auto;aspect-ratio:1122/1402;object-fit:contain!important;border-radius:12px!important;max-width:100%;cursor:zoom-in;flex:none;box-shadow:none}
.support-avatar:not(.store-support-qr),.support-dialog>img:not(.store-support-qr){visibility:hidden}
.support-dialog{max-height:90dvh;overflow:auto}
.support-dialog>img{width:min(220px,62vw);margin-left:auto;margin-right:auto}
body.tutorial-apple .ac-contact-top{flex-wrap:wrap;align-items:center}
body.tutorial-apple .ac-contact-top img{width:144px;height:auto!important}
.store-support-qr:focus-visible{outline:2px solid #a8edea;outline-offset:5px}
@media(max-width:540px){.button.button-blue{font-size:14px;padding:.9em 1.4em}.support-avatar{width:220px}body.tutorial-apple .nav .support{font-size:11px;padding:.55em .8em;min-height:40px}}
@media(prefers-reduced-motion:reduce){.store-catalog-pattern .cube-svg{animation:none!important}.services-section .film-card::after{transition:none}}
[data-hakimi-shader-preview][data-paused=true] .cube-svg{animation-play-state:paused}

/* Constrain the perspective reflection on touch widths; the source border,
   main glow and interaction stay unchanged, without horizontal overflow. */
@media(max-width:820px){:is(.button.button-blue,body.tutorial-apple .support,body.tutorial-apple .help-button.primary,body.tutorial-apple .reader-button,body.tutorial-apple .ac-button)::after{width:70%;left:15%}}
