/* Prime Creation // Page 02 discipline cards v2
   Card existence is fail-open. Runtime enhances motion only and never owns visibility. */

body.prime-v2 #intro .tab01-services{position:relative;isolation:isolate}
body.prime-v2 #intro .service-grid{
  --discipline-gap:clamp(.58rem,1vw,.9rem);
  position:relative;display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));
  gap:var(--discipline-gap)!important;margin-top:clamp(1.6rem,3.5vw,3rem);border:0!important;perspective:1100px
}
body.prime-v2 #intro .service-card{
  --disc-x:50%;--disc-y:50%;--disc-rx:0deg;--disc-ry:0deg;--disc-delay:calc(var(--discipline-index,0) * 70ms);
  position:relative!important;isolation:isolate;display:flex!important;flex-direction:column;min-width:0;
  min-height:clamp(12.75rem,18vw,16rem)!important;padding:clamp(1rem,1.8vw,1.28rem)!important;overflow:hidden!important;
  border:1px solid color-mix(in srgb,var(--mood,#69e6ff) 22%,rgba(185,232,248,.12))!important;border-radius:1rem!important;
  background:radial-gradient(circle at var(--disc-x) var(--disc-y),color-mix(in srgb,var(--mood,#69e6ff) 10%,transparent),transparent 38%),linear-gradient(155deg,rgba(15,30,42,.94),rgba(4,10,16,.985) 72%)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.045),inset 0 0 0 1px rgba(255,255,255,.012),0 18px 42px rgba(0,0,0,.2);
  color:white;text-decoration:none;opacity:1!important;visibility:visible!important;
  transform:perspective(900px) rotateX(var(--disc-rx)) rotateY(var(--disc-ry)) translate3d(0,0,0);
  transform-style:preserve-3d;transition:transform .24s cubic-bezier(.2,.78,.2,1),border-color .24s ease,box-shadow .24s ease,background .24s ease;will-change:transform
}
body.prime-v2 #intro .service-card::before{
  content:""!important;position:absolute!important;z-index:3;top:0!important;right:10%!important;left:10%!important;width:auto!important;height:1px!important;
  background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--mood,#69e6ff) 84%,white),transparent)!important;
  box-shadow:0 0 16px color-mix(in srgb,var(--mood,#69e6ff) 32%,transparent);opacity:.64!important;pointer-events:none;
  animation:primeDisciplineEdge 3.9s ease-in-out calc(var(--discipline-index,0) * -310ms) infinite
}
body.prime-v2 #intro .service-card::after{
  content:"";position:absolute;z-index:2;inset:-30% -55%;border-radius:inherit;
  background:linear-gradient(112deg,transparent 39%,rgba(235,252,255,.13) 49%,transparent 59%);opacity:.65;
  transform:translate3d(-48%,0,0) rotate(4deg);pointer-events:none;
  animation:primeDisciplineScan 6.4s cubic-bezier(.25,.72,.2,1) calc(var(--discipline-index,0) * 260ms) infinite
}
body.prime-v2 #intro .service-card>*{position:relative;z-index:4}
body.prime-v2 #intro .service-card>span{display:inline-flex;width:max-content;align-items:center;gap:.4rem;color:color-mix(in srgb,var(--mood,#69e6ff) 88%,white);font:850 .61rem/1 ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:.14em}
body.prime-v2 #intro .service-card>span::after{content:"SIGNAL";color:rgba(180,202,214,.48);font-size:.43rem;letter-spacing:.12em}
body.prime-v2 #intro .service-card h3{margin:auto 0 0!important;max-width:16ch;color:#f4fbff;font-size:clamp(1.16rem,1.8vw,1.72rem)!important;font-weight:610!important;letter-spacing:-.045em;line-height:1.02;text-wrap:balance;transform:translateZ(14px)}
body.prime-v2 #intro .service-card p{margin:.66rem 0 0!important;max-width:31ch;color:#91a8b5!important;font-size:.79rem;line-height:1.5;transform:translateZ(10px)}
body.prime-v2 #intro .service-card>b{position:absolute!important;z-index:5;top:1rem!important;right:1rem!important;color:var(--mood,#69e6ff)!important;font-size:1rem;font-weight:600;opacity:.55;transform:translateZ(18px);transition:transform .22s ease,opacity .22s ease,text-shadow .22s ease}
body.prime-v2 #intro .service-orb{
  position:absolute!important;z-index:0!important;top:-2.6rem!important;right:-2.35rem!important;width:7.6rem!important;height:7.6rem!important;
  border:1px solid color-mix(in srgb,var(--mood,#69e6ff) 58%,transparent)!important;border-radius:50%!important;
  background:radial-gradient(circle at 31% 29%,color-mix(in srgb,var(--mood,#69e6ff) 68%,white),color-mix(in srgb,var(--mood,#69e6ff) 19%,transparent) 39%,transparent 67%)!important;
  box-shadow:0 0 32px color-mix(in srgb,var(--mood,#69e6ff) 28%,transparent),inset 0 0 22px color-mix(in srgb,var(--mood,#69e6ff) 10%,transparent)!important;
  filter:none!important;opacity:.48!important;transform-origin:center;
  animation:primeDisciplineOrb calc(6.8s + (var(--discipline-index,0) * .18s)) ease-in-out calc(var(--discipline-index,0) * -420ms) infinite!important;pointer-events:none
}
body.prime-v2 #intro .service-card:is(:hover,:focus-visible,[data-discipline-active="true"]){
  --disc-lift:-4px;border-color:color-mix(in srgb,var(--mood,#69e6ff) 52%,transparent)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.075),0 24px 58px rgba(0,0,0,.3),0 0 30px color-mix(in srgb,var(--mood,#69e6ff) 9%,transparent)!important;
  transform:perspective(900px) rotateX(var(--disc-rx)) rotateY(var(--disc-ry)) translate3d(0,var(--disc-lift),0) scale(1.012)!important;outline:0
}
body.prime-v2 #intro .service-card:is(:hover,:focus-visible,[data-discipline-active="true"])>b{opacity:1;transform:translate3d(3px,-3px,18px);text-shadow:0 0 12px color-mix(in srgb,var(--mood,#69e6ff) 52%,transparent)}
body.prime-v2 #intro .service-card:is(:hover,:focus-visible,[data-discipline-active="true"]) .service-orb{opacity:.68!important;animation-duration:4.7s!important}

/* Awakening is cosmetic only. Cards are already visible before this class exists. */
html[data-prime-discipline-runtime] body.prime-v2 #intro .service-card[data-discipline-awake="true"]{animation:primeDisciplineWake .56s cubic-bezier(.12,.86,.19,1.08) var(--disc-delay) both}
@keyframes primeDisciplineWake{0%{transform:perspective(900px) translate3d(0,.72rem,0) scale(.98);filter:brightness(.84)}64%{transform:perspective(900px) translate3d(0,-.1rem,0) scale(1.008);filter:brightness(1.08)}100%{transform:perspective(900px) translate3d(0,0,0) scale(1);filter:none}}
@keyframes primeDisciplineOrb{0%,100%{transform:translate3d(0,0,0) scale(.94) rotate(0deg)}35%{transform:translate3d(-.45rem,.7rem,0) scale(1.08) rotate(74deg)}68%{transform:translate3d(.35rem,1rem,0) scale(.98) rotate(166deg)}}
@keyframes primeDisciplineScan{0%,72%{transform:translate3d(-52%,0,0) rotate(4deg);opacity:0}78%{opacity:.52}91%{opacity:.52}100%{transform:translate3d(52%,0,0) rotate(4deg);opacity:0}}
@keyframes primeDisciplineEdge{0%,100%{opacity:.34;transform:scaleX(.42)}52%{opacity:.82;transform:scaleX(1)}}

@media(max-width:980px){body.prime-v2 #intro .service-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:720px){
  body.prime-v2 #intro .service-grid{grid-template-columns:minmax(0,1fr)!important;gap:.72rem!important}
  body.prime-v2 #intro .service-card{min-height:11.8rem!important;padding:1rem!important;transform:none}
  body.prime-v2 #intro .service-card h3{font-size:1.3rem!important;max-width:18ch}
  body.prime-v2 #intro .service-card p{font-size:.78rem;max-width:34ch}
  body.prime-v2 #intro .service-orb{width:6.7rem!important;height:6.7rem!important;top:-2.35rem!important;right:-2.1rem!important}
  body.prime-v2 #intro .service-card:is(:hover,:focus-visible,[data-discipline-active="true"]){transform:translate3d(0,-2px,0) scale(1.006)!important}
}
@media(hover:none),(pointer:coarse){body.prime-v2 #intro .service-card{--disc-rx:0deg!important;--disc-ry:0deg!important}}
@media(prefers-reduced-motion:reduce),(update:slow){
  body.prime-v2 #intro .service-card,body.prime-v2 #intro .service-card::before,body.prime-v2 #intro .service-card::after,body.prime-v2 #intro .service-orb{animation:none!important;transition-duration:.01ms!important}
  body.prime-v2 #intro .service-card{opacity:1!important;filter:none!important;transform:none!important}
}
