/* ================================================================
   PREMIUM POLISH — light, depth and non-square controls
   ================================================================ */

/* CTAs: capsule geometry, travelling reflection and animated arrow. */
.btn,.premium-btn{position:relative;isolation:isolate;overflow:hidden;border-radius:999px;translate:0 0;transition:color .25s ease,background-color .25s ease,border-color .25s ease,box-shadow .3s ease,transform .25s ease,translate .28s cubic-bezier(.2,.8,.2,1)}
.premium-btn:not(.btn-small){min-height:46px}
.premium-btn::before{content:"";position:absolute;z-index:0;top:-80%;bottom:-80%;left:-55%;width:36%;pointer-events:none;background:linear-gradient(90deg,transparent,rgba(255,255,255,.34),transparent);transform:skewX(-18deg) translateX(-260%);transition:transform .72s cubic-bezier(.2,.75,.2,1)}
.premium-btn::after{content:"";position:absolute;z-index:3;inset:0;pointer-events:none;border:1px solid rgba(255,255,255,.13);border-radius:inherit;box-shadow:inset 0 1px rgba(255,255,255,.11)}
.premium-btn:hover::before,.premium-btn:focus-visible::before{transform:skewX(-18deg) translateX(520%)}
.premium-btn:hover{box-shadow:0 12px 30px rgba(0,0,0,.22),0 0 22px rgba(66,210,42,.16)}
.premium-btn:active{transform:translateY(1px) scale(.985)}
.premium-btn>span{position:relative;z-index:2;transition:transform .28s ease}
.premium-btn:hover>span{transform:translateX(4px)}
.btn-primary,.experience-cta{box-shadow:0 8px 24px rgba(49,203,34,.18),inset 0 1px rgba(255,255,255,.2)}
.btn-primary::after,.experience-cta::after{border-color:rgba(7,16,8,.2)}
.btn-ghost,.btn-outline,.btn-outline-dark,.profile-cta{backdrop-filter:blur(5px)}

/* Compact controls: round instead of square. */
.field-navigation button,.story-controls button,.next-slide-arrows button,.play{border-radius:50%;box-shadow:inset 0 0 0 1px rgba(255,255,255,.035);transition:color .25s ease,background-color .25s ease,border-color .25s ease,box-shadow .3s ease,transform .25s ease}
.field-navigation button:hover,.story-controls button:hover,.next-slide-arrows button:hover,.play:hover{transform:translateY(-2px);box-shadow:0 9px 22px rgba(0,0,0,.2),0 0 17px rgba(65,210,42,.2)}
.menu-toggle{border-radius:13px;background:rgba(5,9,7,.5);box-shadow:inset 0 0 0 1px rgba(255,255,255,.035)}
.motion-menu button{border-radius:9px 0 0 9px}

/* Dynamic card-edge light. A real element avoids colliding with card artwork pseudos. */
.premium-card{--glow-x:50%;--glow-y:50%;position:relative;isolation:isolate;transition:border-color .3s ease,box-shadow .4s ease,filter .4s ease}
.premium-edge-light{position:absolute!important;z-index:25!important;inset:0!important;width:auto!important;height:auto!important;margin:0!important;padding:1px!important;display:block!important;pointer-events:none!important;border:0!important;border-radius:inherit!important;opacity:.32;background:radial-gradient(290px circle at var(--glow-x) var(--glow-y),rgba(87,255,62,.9),rgba(42,211,38,.24) 32%,transparent 64%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;transition:opacity .3s ease}
.premium-edge-light::before,.premium-edge-light::after{content:"";position:absolute;width:19px;height:19px;opacity:.48;filter:drop-shadow(0 0 6px rgba(65,216,43,.45));transition:opacity .3s ease,width .3s ease,height .3s ease}
.premium-edge-light::before{left:6px;top:6px;border-left:1px solid #55e83c;border-top:1px solid #55e83c}
.premium-edge-light::after{right:6px;bottom:6px;border-right:1px solid #55e83c;border-bottom:1px solid #55e83c}
.premium-card:hover .premium-edge-light,.premium-card:focus-within .premium-edge-light{opacity:1}
.premium-card:hover .premium-edge-light::before,.premium-card:hover .premium-edge-light::after,.premium-card:focus-within .premium-edge-light::before,.premium-card:focus-within .premium-edge-light::after{width:27px;height:27px;opacity:.9}
.premium-card:not(.video-card):not(.inside-card):hover{border-color:rgba(71,220,47,.48);box-shadow:0 24px 54px rgba(3,9,5,.16),0 0 28px rgba(59,210,39,.09)}

/* Section-level luminous separators add rhythm without flooding the page. */
.journey,.profile,.next-gen,.stories-carousel{background-image:linear-gradient(90deg,transparent,rgba(65,207,43,.09) 50%,transparent)}
.method-footer i,.motion-status i,.experience-status i,.next-footer-line i{position:relative;overflow:hidden}
.method-footer i::after,.motion-status i::after,.experience-status i::after,.next-footer-line i::after{content:"";position:absolute;inset:0;width:22%;background:linear-gradient(90deg,transparent,rgba(105,255,80,.9),transparent);animation:premium-line-scan 5.5s ease-in-out infinite}
@keyframes premium-line-scan{0%{transform:translateX(-130%)}70%,100%{transform:translateX(560%)}}

/* Hero HUD: transparent floating glass with cursor-responsive depth. */
.hero-hud{--hud-tilt-x:0deg;--hud-tilt-y:0deg;--hud-light-x:72%;--hud-light-y:24%;isolation:isolate;background:linear-gradient(145deg,rgba(7,13,9,.58),rgba(3,7,5,.34))!important;border-color:rgba(226,240,229,.42)!important;backdrop-filter:blur(18px) saturate(125%);box-shadow:0 24px 70px rgba(0,0,0,.42),inset 0 1px rgba(255,255,255,.1),0 0 32px rgba(50,210,34,.08)!important;animation:hero-hud-float 5.2s ease-in-out infinite}
.hero-hud::after{content:"";position:absolute;z-index:-1;inset:0;pointer-events:none;background:radial-gradient(170px circle at var(--hud-light-x) var(--hud-light-y),rgba(104,255,80,.16),transparent 62%),linear-gradient(115deg,rgba(255,255,255,.08),transparent 28%);clip-path:inherit;opacity:.8;transition:background-position .2s ease}
.motion-ready.hero-ready .hero-hud{transform:perspective(900px) rotateX(var(--hud-tilt-x)) rotateY(var(--hud-tilt-y))}
.hero-hud:hover{border-color:rgba(90,235,66,.68)!important;box-shadow:0 30px 85px rgba(0,0,0,.48),inset 0 1px rgba(255,255,255,.14),0 0 38px rgba(50,216,34,.14)!important}
.hero-hud .hud-score strong{text-shadow:0 0 24px rgba(67,220,43,.34)}
.hero-hud .stat-bar>i::after{box-shadow:0 0 9px rgba(81,245,56,.72)}
@keyframes hero-hud-float{0%,100%{translate:0 -3px}50%{translate:0 7px}}

/* Social rail: illuminated touchpoints with compact tooltips. */
.hero-social-rail a{position:relative;isolation:isolate;overflow:visible;translate:0 0;scale:1;animation:social-orbit-glow 3.8s ease-in-out infinite;transition:opacity .45s ease,transform .55s ease,translate .3s cubic-bezier(.2,.8,.2,1),scale .3s cubic-bezier(.2,.8,.2,1),border-color .2s,color .2s,background-color .2s,box-shadow .3s ease}
.hero-social-rail a:nth-child(2){animation-delay:-1.25s}.hero-social-rail a:nth-child(3){animation-delay:-2.5s}
.hero-social-rail a::before{content:"";position:absolute;z-index:-1;inset:-5px;border:1px solid rgba(84,236,59,.24);border-radius:50%;opacity:0;transform:scale(.72);transition:opacity .28s ease,transform .35s cubic-bezier(.2,.8,.2,1)}
.hero-social-rail a::after{content:attr(data-label);position:absolute;right:40px;top:50%;padding:6px 9px;border:1px solid rgba(255,255,255,.13);border-radius:999px;background:rgba(4,9,6,.8);backdrop-filter:blur(8px);color:#fff;font:700 7px/1 var(--font-ui);letter-spacing:.1em;text-transform:uppercase;white-space:nowrap;opacity:0;transform:translate(7px,-50%);pointer-events:none;transition:opacity .25s ease,transform .3s ease}
.hero-social-rail a:hover,.hero-social-rail a:focus-visible{translate:-4px 0;scale:1.11;box-shadow:0 0 0 1px rgba(67,219,44,.12),0 0 24px rgba(68,224,43,.3)}
.hero-social-rail a:hover::before,.hero-social-rail a:focus-visible::before{opacity:1;transform:scale(1)}
.hero-social-rail a:hover::after,.hero-social-rail a:focus-visible::after{opacity:1;transform:translate(0,-50%)}
.hero-social-rail a:hover svg{filter:drop-shadow(0 0 5px rgba(90,255,65,.72))}
@keyframes social-orbit-glow{0%,100%{box-shadow:0 4px 14px rgba(0,0,0,.38)}50%{box-shadow:0 4px 14px rgba(0,0,0,.38),0 0 14px rgba(63,215,41,.16)}}

/* Journey cards: the background, athlete and interface react on separate planes. */
.journey .player-cards:has(.player-card:hover) .player-card:not(:hover){filter:saturate(.72) brightness(.78);transform:perspective(950px) scale(.985)}
.motion-ready .journey.is-inview .player-card:hover{transition-delay:0s!important;transition-duration:.18s,.18s,.3s!important}
.journey .player-card .person-slot img{transform:translate3d(var(--athlete-x),var(--athlete-y),0) scale(var(--athlete-scale))!important;transition:transform .22s cubic-bezier(.2,.75,.2,1),filter .3s ease!important}
.journey .player-card .card-background img{transform:translate3d(var(--bg-x),var(--bg-y),0) scale(1.09)!important;transition:transform .28s cubic-bezier(.2,.75,.2,1),filter .35s ease!important}
.journey .player-card:hover .person-slot img{filter:drop-shadow(0 26px 22px rgba(0,0,0,.72)) drop-shadow(0 0 14px rgba(59,217,40,.16))}
.journey .player-card:hover .card-background img{filter:brightness(1.08) saturate(1.09)}
.journey .player-card .card-head i{transition:color .25s ease,border-color .25s ease,background-color .25s ease,box-shadow .3s ease,transform .3s ease}
.journey .player-card:hover .card-head i{color:#071008;border-color:var(--green);background:var(--green);box-shadow:0 0 20px rgba(65,222,43,.42);transform:rotate(8deg) scale(1.08)}
.journey .player-card .card-copy,.journey .player-card .journey-stats,.journey .player-card .card-footer{transition:transform .32s cubic-bezier(.2,.75,.2,1),opacity .3s ease}
.journey .player-card:hover .card-copy{transform:translateY(-3px)}
.journey .player-card:hover .journey-stats{transform:translateX(4px)}
.journey .player-card:hover .card-footer{transform:translateY(-4px)}
.journey .player-card:hover .premium-edge-light{background:radial-gradient(360px circle at var(--glow-x) var(--glow-y),rgba(103,255,76,.98),rgba(45,220,38,.32) 34%,transparent 66%)}

/* Electric neon border — irregular energy bands travel around the clipped card. */
@property --electric-angle{syntax:"<angle>";initial-value:0deg;inherits:false}
.journey .player-card:hover{animation:electric-card-pulse .78s ease-in-out infinite alternate}
.journey .player-card:hover .premium-edge-light{padding:2px!important;opacity:1;filter:drop-shadow(0 0 3px #55ff3f) drop-shadow(0 0 9px rgba(49,255,37,.92)) drop-shadow(0 0 19px rgba(37,220,32,.52));background:radial-gradient(260px circle at var(--glow-x) var(--glow-y),rgba(195,255,178,.95),rgba(76,255,51,.25) 32%,transparent 62%),repeating-conic-gradient(from var(--electric-angle),transparent 0deg 13deg,rgba(84,255,57,.22) 14deg 18deg,#b7ff9e 19deg 21deg,#34ff24 22deg 25deg,transparent 26deg 47deg);animation:electric-border-run 1.15s linear infinite,electric-border-flicker .16s steps(2,end) infinite}
.journey .player-card:hover .premium-edge-light::before,.journey .player-card:hover .premium-edge-light::after{width:34px;height:34px;opacity:1;border-width:2px;filter:drop-shadow(0 0 3px #d1ffc6) drop-shadow(0 0 9px #43ff2c);animation:electric-corner-spark .42s steps(2,end) infinite alternate}
.journey .player-card:hover .premium-edge-light::after{animation-delay:-.21s}
@keyframes electric-border-run{to{--electric-angle:360deg}}
@keyframes electric-border-flicker{0%,100%{opacity:.88}45%{opacity:1}50%{opacity:.68}58%{opacity:1}}
@keyframes electric-corner-spark{0%{transform:scale(.84);filter:drop-shadow(0 0 2px #d1ffc6) drop-shadow(0 0 6px #43ff2c)}100%{transform:scale(1.08);filter:drop-shadow(0 0 5px #e4ffdc) drop-shadow(0 0 15px #43ff2c)}}
@keyframes electric-card-pulse{0%{box-shadow:0 28px 58px rgba(4,10,5,.3),0 0 13px rgba(53,255,37,.3)}100%{box-shadow:0 34px 70px rgba(4,10,5,.38),0 0 25px rgba(53,255,37,.56),0 0 46px rgba(43,211,35,.18)}}

@media(max-width:640px){
  .btn,.premium-btn{border-radius:18px}
  .premium-edge-light{opacity:.42;background:linear-gradient(125deg,rgba(80,233,58,.5),transparent 22%,transparent 78%,rgba(80,233,58,.34))}
  .premium-edge-light::before,.premium-edge-light::after{opacity:.65}
  .motion-menu button{border-radius:8px}
  .hero-social-rail a::after{display:none}
}

@media(prefers-reduced-motion:reduce){
  .premium-btn,.premium-btn::before,.premium-btn>span,.premium-card,.premium-edge-light,.premium-edge-light::before,.premium-edge-light::after{transition:none}
  .hero-hud,.hero-social-rail a{animation:none}
  .journey .player-card:hover,.journey .player-card:hover .premium-edge-light,.journey .player-card:hover .premium-edge-light::before,.journey .player-card:hover .premium-edge-light::after{animation:none}
  .motion-ready.hero-ready .hero-hud{transform:none}
  .journey .player-card .person-slot img,.journey .player-card .card-background img{transform:none!important;transition:none!important}
  .method-footer i::after,.motion-status i::after,.experience-status i::after,.next-footer-line i::after{animation:none;display:none}
}

/* Process × Result — balanced scale and breathing room across viewports. */
.process-result{
  min-height:clamp(440px,42vw,520px);
  padding:clamp(56px,5vw,72px) var(--gutter);
}
.process-main{
  width:100%;
  max-width:1500px;
  margin:auto;
  gap:clamp(18px,2.25vw,42px);
}
.process-main strong{
  font-size:clamp(86px,13.5vw,250px);
  line-height:.76;
  letter-spacing:-.055em;
}
.process-main i{
  flex:none;
  font-size:clamp(38px,5vw,86px);
  line-height:1;
}
.process-words{
  position:relative;
  z-index:2;
  width:100%;
  max-width:1440px;
  margin-inline:auto;
  gap:24px;
  font-size:7px;
  line-height:1.3;
  letter-spacing:.15em;
}
@media(max-width:900px){
  .process-result{min-height:400px}
}
@media(max-width:640px){
  .process-result{min-height:370px;padding-block:48px;padding-inline:20px}
  .process-main{flex-direction:column;gap:10px}
  .process-main strong{font-size:25vw;line-height:.74}
  .process-main i{position:absolute;font-size:42px}
  .process-words{align-items:center;gap:12px;font-size:6px;letter-spacing:.1em}
}