/* ─── TNTNetta · Design System v3 ─────────────────────────────────────────── */
@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700;800;900&family=JetBrains+Mono:wght@400;700&display=swap');

/* ─── Tokens ─────────────────────────────────────────────────────────────── */
:root {
  --c-bg:        #07090f;
  --c-surface:   rgba(255,255,255,0.04);
  --c-surface-2: rgba(255,255,255,0.08);
  --c-border:    rgba(255,255,255,0.08);
  --c-border-h:  rgba(255,255,255,0.18);

  --c-accent:    #7c5cfc;
  --c-accent-2:  #c084fc;
  --c-pink:      #f472b6;
  --c-teal:      #2dd4bf;
  --c-green:     #22c55e;

  --c-text:   #f0f2ff;
  --c-muted:  #576070;
  --c-subtle: #8892a4;

  --r-sm:   10px;
  --r-md:   16px;
  --r-lg:   24px;
  --r-xl:   32px;
  --r-pill: 999px;

  --ease: cubic-bezier(0.16,1,0.3,1);
  --dur:  200ms;
  --blur: blur(22px) saturate(160%);
}

/* ─── Keyframes ──────────────────────────────────────────────────────────── */
@keyframes fade-up  { from{opacity:0;transform:translateY(22px)} to{opacity:1;transform:none} }
@keyframes fade-in  { from{opacity:0} to{opacity:1} }
@keyframes scale-in { from{opacity:0;transform:scale(0.88)} to{opacity:1;transform:none} }

@keyframes spin-ring { to{transform:rotate(360deg)} }
@keyframes float     { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-7px)} }

@keyframes pulse-live {
  0%,100%{box-shadow:0 0 0 0 rgba(34,197,94,.6)}
  55%    {box-shadow:0 0 0 8px rgba(34,197,94,0)}
}

@keyframes shimmer-sweep {
  0%  {left:-80%}
  100%{left:140%}
}

@keyframes eq-1{0%,100%{height:5px}  45%{height:20px} 70%{height:10px}}
@keyframes eq-2{0%,100%{height:18px} 30%{height:5px}  70%{height:22px}}
@keyframes eq-3{0%,100%{height:9px}  40%{height:22px} 80%{height:3px} }
@keyframes eq-4{0%,100%{height:15px} 55%{height:4px}               }
@keyframes eq-5{0%,100%{height:7px}  25%{height:19px} 75%{height:11px}}

@keyframes drift {
  0%  {transform:translate(0,0)       scale(1)}
  100%{transform:translate(55px,38px) scale(1.1)}
}

@keyframes particle-rise {
  0%  {transform:translateY(0) translateX(0) scale(1);  opacity:0}
  8%  {opacity:var(--p-op,.55)}
  88% {opacity:.12}
  100%{transform:translateY(-95vh) translateX(var(--p-dx,20px)) scale(.25);opacity:0}
}

@keyframes toast-in  {from{transform:translateY(14px);opacity:0} to{opacity:1;transform:none}}
@keyframes toast-out {to  {transform:translateY(-8px);opacity:0}}
@keyframes ripple-anim{to {transform:scale(5);opacity:0}}

@keyframes live-blink {0%,100%{opacity:1} 50%{opacity:.55}}
@keyframes count-done {0%,100%{color:var(--c-text)} 50%{color:var(--c-accent-2)}}

@keyframes border-spin {
  to { --angle: 360deg; }
}

/* ─── Reset ──────────────────────────────────────────────────────────────── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img {display:block;max-width:100%}
a   {color:inherit;text-decoration:none}
button{cursor:pointer;border:none;background:none;font:inherit}

/* ─── Scrollbar ──────────────────────────────────────────────────────────── */
::-webkit-scrollbar{width:5px}
::-webkit-scrollbar-track{background:var(--c-bg)}
::-webkit-scrollbar-thumb{background:var(--c-accent);border-radius:99px}

/* ─── Base ───────────────────────────────────────────────────────────────── */
body{
  font-family:'Outfit',ui-sans-serif,system-ui,sans-serif;
  background:var(--c-bg);
  color:var(--c-text);
  min-height:100dvh;
  overflow-x:hidden;
  position:relative;
}

/* Noise grain */
body::before{
  content:'';
  position:fixed;
  inset:0;z-index:0;
  pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  background-size:200px;
  opacity:.028;
}

/* Scanlines */
body::after{
  content:'';
  position:fixed;
  inset:0;z-index:1;
  pointer-events:none;
  background:repeating-linear-gradient(0deg,transparent,transparent 2px,rgba(0,0,0,.03) 2px,rgba(0,0,0,.03) 3px);
}

/* ─── Background ─────────────────────────────────────────────────────────── */
.bg-canvas{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden}

.bg-orb{
  position:absolute;border-radius:50%;
  filter:blur(110px);opacity:.12;
  animation:drift ease-in-out infinite alternate;
  will-change:transform;
}
.bg-orb:nth-child(1){width:900px;height:900px;top:-300px;left:-250px;background:var(--c-accent);animation-duration:26s}
.bg-orb:nth-child(2){width:700px;height:700px;top:25%;right:-220px;background:var(--c-pink);animation-duration:32s;animation-delay:-12s}
.bg-orb:nth-child(3){width:550px;height:550px;bottom:-120px;left:15%;background:var(--c-teal);animation-duration:22s;animation-delay:-18s}

/* Floating particles */
.particle{
  position:absolute;border-radius:50%;
  pointer-events:none;will-change:transform,opacity;
  animation:particle-rise linear infinite;
}

/* ─── Cursor glow ────────────────────────────────────────────────────────── */
#cursor-glow{
  position:fixed;
  width:450px;height:450px;
  margin:-225px 0 0 -225px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(124,92,252,.07) 0%,transparent 70%);
  pointer-events:none;
  z-index:1;
  will-change:left,top;
  transition:opacity .4s;
}

/* ─── Toast ──────────────────────────────────────────────────────────────── */
#toast-container{
  position:fixed;bottom:28px;left:50%;transform:translateX(-50%);
  z-index:200;display:flex;flex-direction:column;align-items:center;gap:8px;
  pointer-events:none;
}
.toast{
  display:flex;align-items:center;gap:10px;
  padding:12px 22px;
  border-radius:var(--r-pill);
  background:rgba(14,18,30,.96);
  border:1px solid var(--c-border-h);
  backdrop-filter:var(--blur);
  font-size:.875rem;font-weight:600;color:var(--c-text);
  box-shadow:0 8px 36px rgba(0,0,0,.55);
  animation:toast-in .28s var(--ease) both;
}
.toast.out{animation:toast-out .22s var(--ease) both}
.toast-icon{font-size:1rem}

/* ─── Accessibility ──────────────────────────────────────────────────────── */
.skip-link{
  position:fixed;top:12px;left:12px;z-index:300;
  padding:10px 18px;border-radius:var(--r-pill);
  background:var(--c-accent);color:#fff;font-weight:700;
  transform:translateY(-160%);
  transition:transform var(--dur) var(--ease);
}
.skip-link:focus{transform:translateY(0)}
:focus-visible{outline:2px solid var(--c-accent);outline-offset:3px}

/* ─── Layout ─────────────────────────────────────────────────────────────── */
.page{
  position:relative;z-index:2;
  width:min(100% - 24px,1100px);
  margin-inline:auto;
}
.page-home{
  display:grid;min-height:100dvh;
  place-items:center;padding:52px 0;
}
.profile-shell{
  width:min(100%,462px);
  display:flex;flex-direction:column;gap:10px;
}

/* ─── Reveal ─────────────────────────────────────────────────────────────── */
[data-reveal]{
  opacity:0;transform:translateY(20px);
  transition:opacity .65s var(--ease),transform .65s var(--ease);
}
[data-reveal].visible{opacity:1;transform:none}

/* ─── Profile card ───────────────────────────────────────────────────────── */
.profile-card{
  display:flex;flex-direction:column;align-items:center;text-align:center;
  padding:40px 20px 30px;
  animation:fade-in .9s var(--ease) .05s both;
}

/* Avatar */
.avatar-wrap{
  position:relative;width:116px;height:116px;
  margin-bottom:24px;
  animation:scale-in .7s var(--ease) .15s both;
}
.avatar-floater{animation:float 4.5s ease-in-out infinite}

.avatar-ring{
  position:absolute;inset:-5px;border-radius:50%;
  background:conic-gradient(var(--c-accent) 0%,var(--c-pink) 38%,var(--c-teal) 68%,var(--c-accent) 100%);
  animation:spin-ring 5.5s linear infinite;
}
.avatar-ring::before{
  content:'';position:absolute;inset:4px;border-radius:50%;
  background:var(--c-bg);
}
.avatar{
  position:relative;z-index:1;
  width:100%;height:100%;border-radius:50%;object-fit:cover;
}

/* Live dot */
.live-dot{
  position:absolute;bottom:5px;right:5px;z-index:2;
  width:15px;height:15px;border-radius:50%;
  background:var(--c-green);
  border:3px solid var(--c-bg);
  animation:pulse-live 2.4s ease-in-out infinite;
}

/* Handle + copy */
.handle-row{
  display:flex;align-items:center;gap:8px;margin-bottom:8px;
  animation:fade-up .6s var(--ease) .25s both;
}
.handle{
  font-family:'JetBrains Mono',monospace;
  font-size:.77rem;font-weight:700;
  color:var(--c-accent-2);letter-spacing:.1em;text-transform:uppercase;
}
.copy-btn{
  display:grid;place-items:center;
  width:22px;height:22px;border-radius:6px;
  border:1px solid var(--c-border);background:var(--c-surface);
  color:var(--c-muted);cursor:pointer;
  transition:color var(--dur),border-color var(--dur),background var(--dur),transform var(--dur) var(--ease);
}
.copy-btn:hover{color:var(--c-text);border-color:var(--c-border-h);background:var(--c-surface-2);transform:scale(1.1)}
.copy-btn svg{width:11px;height:11px}

.profile-card h1{
  font-size:clamp(3.4rem,14vw,6rem);font-weight:900;
  line-height:.87;letter-spacing:-.048em;
  background:linear-gradient(145deg,#fff 0%,#ede0ff 45%,var(--c-accent-2) 100%);
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
  margin-bottom:14px;
  animation:fade-up .7s var(--ease) .32s both;
}
.bio{
  font-size:.95rem;font-weight:400;color:var(--c-subtle);
  line-height:1.65;max-width:340px;margin-bottom:6px;
  animation:fade-up .7s var(--ease) .4s both;
}
.micro{
  font-size:.77rem;font-weight:600;color:var(--c-muted);letter-spacing:.04em;
  animation:fade-up .7s var(--ease) .46s both;
}

/* ─── Stats ──────────────────────────────────────────────────────────────── */
.stats-strip{
  display:grid;grid-template-columns:repeat(3,1fr);gap:8px;
  animation:fade-up .7s var(--ease) .54s both;
}
.stat-card{
  background:var(--c-surface);border:1px solid var(--c-border);
  border-radius:var(--r-md);backdrop-filter:var(--blur);
  padding:14px 10px;text-align:center;cursor:default;
  transition:border-color var(--dur) var(--ease),background var(--dur) var(--ease),transform var(--dur) var(--ease);
}
.stat-card:hover{border-color:var(--c-border-h);background:var(--c-surface-2);transform:translateY(-3px)}
.stat-card strong{
  display:block;font-size:1.4rem;font-weight:800;color:var(--c-text);
  line-height:1;margin-bottom:5px;font-variant-numeric:tabular-nums;
}
.stat-card small{
  font-size:.67rem;font-weight:700;color:var(--c-muted);
  text-transform:uppercase;letter-spacing:.07em;
}

/* ─── Section divider ────────────────────────────────────────────────────── */
.section-divider{
  display:flex;align-items:center;gap:10px;margin-top:2px;
}
.section-divider span{
  font-size:.67rem;font-weight:800;color:var(--c-muted);
  text-transform:uppercase;letter-spacing:.15em;white-space:nowrap;
}
.section-divider::before,.section-divider::after{
  content:'';flex:1;height:1px;background:var(--c-border);
}

/* ─── Featured links ─────────────────────────────────────────────────────── */
.featured-links{
  display:flex;flex-direction:column;gap:8px;
  animation:fade-up .7s var(--ease) .62s both;
}

/* Ripple */
.feat-link,.social-item{position:relative;overflow:hidden}
.ripple-wave{
  position:absolute;border-radius:50%;
  background:rgba(255,255,255,.15);transform:scale(0);
  pointer-events:none;
  animation:ripple-anim .6s linear;
}

.feat-link{
  display:flex;align-items:center;gap:14px;
  padding:16px 18px;
  border-radius:var(--r-md);
  border:1px solid transparent;
  background:var(--c-surface);backdrop-filter:var(--blur);
  cursor:pointer;
  transition:
    transform       var(--dur) var(--ease),
    border-color    var(--dur) var(--ease),
    box-shadow      var(--dur) var(--ease),
    background      var(--dur) var(--ease);
}

/* Background gradient overlay per-platform */
.feat-link::before{
  content:'';position:absolute;inset:0;
  background:var(--feat-grad,none);
  opacity:0;transition:opacity var(--dur) var(--ease);pointer-events:none;
  border-radius:inherit;
}
.feat-link:hover::before,.feat-link:focus-visible::before{opacity:1}

.feat-link:hover,.feat-link:focus-visible{
  transform:translateY(-4px) scale(1.01);
  border-color:var(--feat-color,var(--c-border-h));
  box-shadow:
    0 12px 44px rgba(0,0,0,.45),
    0 0 0 1px var(--feat-color,rgba(255,255,255,.1)),
    0 0 40px var(--feat-glow,transparent);
}

/* Platform vars */
.feat-link[data-platform="kick"]{
  --feat-color:rgba(83,185,0,.5);
  --feat-grad:linear-gradient(135deg,rgba(83,185,0,.14) 0%,transparent 70%);
  --feat-glow:rgba(83,185,0,.12);
}
.feat-link[data-platform="spotify"],
.feat-link[data-platform="music"]{
  --feat-color:rgba(29,185,84,.5);
  --feat-grad:linear-gradient(135deg,rgba(29,185,84,.14) 0%,transparent 70%);
  --feat-glow:rgba(29,185,84,.12);
}
.feat-link[data-platform="tiktok"]{
  --feat-color:rgba(254,44,85,.45);
  --feat-grad:linear-gradient(135deg,rgba(254,44,85,.1) 0%,rgba(0,242,234,.06) 70%);
  --feat-glow:rgba(254,44,85,.1);
}
.feat-link[data-platform="mediakit"]{
  --feat-color:rgba(124,92,252,.5);
  --feat-grad:linear-gradient(135deg,rgba(124,92,252,.12) 0%,transparent 70%);
  --feat-glow:rgba(124,92,252,.1);
}

/* Primary Kick button */
.feat-link--primary{
  background:linear-gradient(135deg,#4c28c4 0%,var(--c-accent) 45%,#a78bfa 100%);
  border-color:transparent !important;
}
.feat-link--primary::before{display:none}
.feat-link--primary:hover,.feat-link--primary:focus-visible{
  transform:translateY(-5px) scale(1.012);
  box-shadow:0 18px 60px rgba(124,92,252,.55),0 0 80px rgba(124,92,252,.2);
}

/* Shimmer sweep */
.shimmer{
  position:absolute;top:0;bottom:0;width:55%;
  background:linear-gradient(105deg,transparent 20%,rgba(255,255,255,.22) 50%,transparent 80%);
  animation:shimmer-sweep 3.2s ease-in-out infinite;
  pointer-events:none;border-radius:inherit;
}

/* Icons */
.feat-icon{
  width:44px;height:44px;border-radius:var(--r-sm);
  background:rgba(255,255,255,.12);
  display:grid;place-items:center;flex-shrink:0;color:#fff;
  transition:transform var(--dur) var(--ease),background var(--dur);
}
.feat-icon svg{width:22px;height:22px}
.feat-link:hover .feat-icon{transform:scale(1.1) rotate(-2deg)}

/* Platform icon colors for non-primary */
.feat-link[data-platform="spotify"] .feat-icon,
.feat-link[data-platform="music"] .feat-icon{background:rgba(29,185,84,.18);color:#1db954}
.feat-link[data-platform="tiktok"]  .feat-icon{background:rgba(254,44,85,.15);color:#fe2c55}
.feat-link[data-platform="mediakit"] .feat-icon{background:rgba(124,92,252,.18);color:#c084fc}

.feat-body{flex:1;display:flex;flex-direction:column;gap:2px;min-width:0}
.feat-label{font-size:.69rem;font-weight:700;color:var(--c-muted);text-transform:uppercase;letter-spacing:.1em}
.feat-title{font-size:1rem;font-weight:700;color:var(--c-text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

.feat-link--primary .feat-label,
.feat-link--primary .feat-title{color:#fff}
.feat-link--primary .feat-label{color:rgba(255,255,255,.72)}

.feat-right{display:flex;align-items:center;gap:8px;flex-shrink:0}
.feat-arrow{
  color:var(--c-muted);font-size:1rem;
  transition:transform var(--dur) var(--ease),color var(--dur);
}
.feat-link:hover .feat-arrow{transform:translateX(4px);color:var(--c-text)}
.feat-link--primary .feat-arrow{color:rgba(255,255,255,.7)}
.feat-link--primary:hover .feat-arrow{color:#fff}

/* LIVE badge */
.live-badge{
  display:inline-flex;align-items:center;gap:5px;
  padding:3px 9px;border-radius:var(--r-pill);
  background:rgba(239,68,68,.18);border:1px solid rgba(239,68,68,.38);
  font-size:.63rem;font-weight:900;letter-spacing:.09em;
  color:#f87171;text-transform:uppercase;
  animation:live-blink 2.2s ease-in-out infinite;
}
.live-badge::before{
  content:'';width:5px;height:5px;border-radius:50%;
  background:#ef4444;flex-shrink:0;
}

/* Equalizer bars */
.eq-bars{
  display:flex;align-items:flex-end;gap:2.5px;
  height:22px;padding:0 2px;
}
.eq-bar{
  width:3px;border-radius:2px;
  background:#1db954;
  animation-timing-function:ease-in-out;
  animation-iteration-count:infinite;
  transform-origin:bottom;
}
.eq-bar:nth-child(1){animation-name:eq-1;animation-duration:1.0s;animation-delay:0s}
.eq-bar:nth-child(2){animation-name:eq-2;animation-duration:1.2s;animation-delay:.18s}
.eq-bar:nth-child(3){animation-name:eq-3;animation-duration:0.9s;animation-delay:.06s}
.eq-bar:nth-child(4){animation-name:eq-4;animation-duration:1.1s;animation-delay:.28s}
.eq-bar:nth-child(5){animation-name:eq-5;animation-duration:1.3s;animation-delay:.12s}

/* ─── Social list ────────────────────────────────────────────────────────── */
.social-list{display:flex;flex-direction:column;gap:6px}

.social-item{
  display:flex;align-items:center;gap:13px;
  padding:12px 14px;
  background:var(--c-surface);border:1px solid var(--c-border);
  border-radius:var(--r-md);backdrop-filter:var(--blur);
  transition:
    transform        var(--dur) var(--ease),
    border-color     var(--dur) var(--ease),
    background       var(--dur) var(--ease),
    box-shadow       var(--dur) var(--ease);
  opacity:0;transform:translateX(-10px);   /* staggered by JS */
}
.social-item.visible{opacity:1;transform:none}

.social-item:hover,.social-item:focus-visible{
  transform:translateX(5px) !important;
  border-color:var(--si-color,var(--c-border-h));
  background:var(--c-surface-2);
  box-shadow:0 4px 24px var(--si-glow,transparent),inset 0 0 0 1px var(--si-color-dim,transparent);
}

.social-icon{
  width:36px;height:36px;border-radius:10px;
  display:grid;place-items:center;flex-shrink:0;
  background:var(--si-bg,rgba(255,255,255,.06));
  color:var(--si-color,var(--c-text));
  transition:transform var(--dur) var(--ease),background var(--dur),box-shadow var(--dur);
}
.social-icon svg{width:18px;height:18px}
.social-item:hover .social-icon{
  transform:scale(1.12) rotate(-4deg);
  background:var(--si-bg-h,var(--si-bg));
  box-shadow:0 0 12px var(--si-glow,transparent);
}

.social-body{flex:1}
.social-body strong{display:block;font-size:.875rem;font-weight:700;color:var(--c-text)}
.social-body small{font-size:.72rem;color:var(--c-muted)}

.social-stat{
  font-family:'JetBrains Mono',monospace;
  font-size:.72rem;font-weight:700;
  color:var(--si-color,var(--c-muted));
  opacity:.7;
  flex-shrink:0;
}

.social-arrow{
  color:var(--c-muted);font-size:.88rem;
  transition:transform var(--dur) var(--ease),color var(--dur);
}
.social-item:hover .social-arrow{transform:translateX(3px);color:var(--c-text)}

/* Platform colors */
.si-kick     {--si-bg:rgba(83,185,0,.1)  ;--si-bg-h:rgba(83,185,0,.2)  ;--si-color:#53b900;--si-glow:rgba(83,185,0,.14) ;--si-color-dim:rgba(83,185,0,.2) }
.si-spotify  {--si-bg:rgba(29,185,84,.1) ;--si-bg-h:rgba(29,185,84,.2) ;--si-color:#1db954;--si-glow:rgba(29,185,84,.14);--si-color-dim:rgba(29,185,84,.2)}
.si-tiktok   {--si-bg:rgba(254,44,85,.08);--si-bg-h:rgba(254,44,85,.16);--si-color:#fe2c55;--si-glow:rgba(254,44,85,.1) ;--si-color-dim:rgba(254,44,85,.18)}
.si-youtube  {--si-bg:rgba(255,0,0,.08)  ;--si-bg-h:rgba(255,0,0,.16)  ;--si-color:#ff4444;--si-glow:rgba(255,68,68,.1) ;--si-color-dim:rgba(255,68,68,.18)}
.si-instagram{--si-bg:rgba(225,48,108,.08);--si-bg-h:rgba(225,48,108,.16);--si-color:#e1306c;--si-glow:rgba(225,48,108,.1);--si-color-dim:rgba(225,48,108,.18)}
.si-x        {--si-bg:rgba(255,255,255,.05);--si-bg-h:rgba(255,255,255,.1);--si-color:#e7e9ea;--si-glow:rgba(255,255,255,.05);--si-color-dim:rgba(255,255,255,.1)}
.si-twitch   {--si-bg:rgba(145,70,255,.1) ;--si-bg-h:rgba(145,70,255,.2) ;--si-color:#9146ff;--si-glow:rgba(145,70,255,.14);--si-color-dim:rgba(145,70,255,.2)}
.si-discord  {--si-bg:rgba(88,101,242,.1) ;--si-bg-h:rgba(88,101,242,.2) ;--si-color:#5865f2;--si-glow:rgba(88,101,242,.14);--si-color-dim:rgba(88,101,242,.2)}

/* ─── Footer ─────────────────────────────────────────────────────────────── */
.simple-footer{
  display:flex;justify-content:space-between;align-items:center;gap:12px;
  font-size:.74rem;color:var(--c-muted);
  border-top:1px solid var(--c-border);padding-top:14px;margin-top:2px;
  animation:fade-in .7s var(--ease) 1.1s both;
}
.simple-footer a{color:var(--c-accent-2);font-weight:600;transition:color var(--dur)}
.simple-footer a:hover{color:var(--c-text)}

/* ─── Media Kit ──────────────────────────────────────────────────────────── */
.media-page{padding-bottom:72px}
.kit-nav{
  display:flex;justify-content:space-between;align-items:center;
  padding:24px 0 36px;
  animation:fade-in .5s var(--ease) .1s both;
}
.kit-nav a{
  padding:9px 18px;border:1px solid var(--c-border);border-radius:var(--r-pill);
  background:var(--c-surface);backdrop-filter:var(--blur);
  font-size:.85rem;font-weight:700;
  transition:border-color var(--dur),background var(--dur),transform var(--dur) var(--ease);
}
.kit-nav a:hover{border-color:var(--c-border-h);background:var(--c-surface-2);transform:translateY(-1px)}

.kit-hero{
  display:grid;grid-template-columns:1fr auto;gap:32px;align-items:center;
  padding:clamp(28px,5vw,56px);
  border:1px solid var(--c-border);border-radius:var(--r-xl);
  background:var(--c-surface);backdrop-filter:var(--blur);
  margin-bottom:24px;
  animation:fade-up .7s var(--ease) .2s both;
}
.kit-hero h1{
  font-size:clamp(2.4rem,6vw,4.5rem);font-weight:900;
  letter-spacing:-.04em;line-height:.9;
  background:linear-gradient(145deg,#fff 0%,#ede0ff 48%,var(--c-accent-2) 100%);
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
  margin-bottom:14px;
}
.kit-hero .handle{display:block;margin-bottom:10px;cursor:default}
.kit-hero p:not(.handle){color:var(--c-subtle);line-height:1.65;font-size:.97rem}
.kit-avatar{width:140px;height:140px;border-radius:var(--r-lg);object-fit:cover;border:1px solid var(--c-border)}

.kit-summary{
  display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:56px;
  animation:fade-up .7s var(--ease) .35s both;
}
.kit-summary article{
  padding:20px 18px;border:1px solid var(--c-border);border-radius:var(--r-md);
  background:var(--c-surface);backdrop-filter:var(--blur);
  transition:border-color var(--dur),transform var(--dur) var(--ease);
}
.kit-summary article:hover{border-color:var(--c-border-h);transform:translateY(-2px)}
.kit-summary span{display:block;font-size:.69rem;font-weight:700;color:var(--c-muted);text-transform:uppercase;letter-spacing:.1em;margin-bottom:8px}
.kit-summary strong{display:block;font-size:1.7rem;font-weight:800;color:var(--c-accent-2);line-height:1}

.kit-section{
  display:grid;grid-template-columns:minmax(0,.75fr) minmax(0,1.25fr);
  gap:28px;align-items:start;margin-top:56px;
}
.section-label{font-size:.69rem;font-weight:800;color:var(--c-accent-2);text-transform:uppercase;letter-spacing:.14em;margin-bottom:10px}
.section-copy{color:var(--c-subtle);line-height:1.7;font-size:.92rem}
.kit-section h2,.contact-card h2{
  font-size:clamp(2rem,5vw,3.6rem);font-weight:900;
  letter-spacing:-.04em;line-height:.95;margin-bottom:12px;
}

.metrics-table{
  border:1px solid var(--c-border);border-radius:var(--r-md);
  overflow:hidden;background:var(--c-surface);backdrop-filter:var(--blur);
}
.metric-row{
  display:grid;grid-template-columns:1fr auto;gap:16px;
  padding:13px 18px;border-bottom:1px solid var(--c-border);
  align-items:center;transition:background var(--dur);
}
.metric-row:last-child{border-bottom:none}
.metric-row:hover{background:var(--c-surface-2)}
.metric-row span{font-size:.87rem;color:var(--c-subtle)}
.metric-row strong{font-size:1rem;font-weight:800;color:var(--c-text);font-variant-numeric:tabular-nums}

.value-grid{display:flex;flex-direction:column;gap:10px}
.value-grid article{
  padding:20px;border:1px solid var(--c-border);border-radius:var(--r-md);
  background:var(--c-surface);backdrop-filter:var(--blur);
  transition:border-color var(--dur),background var(--dur),transform var(--dur) var(--ease);
}
.value-grid article:hover{border-color:var(--c-border-h);background:var(--c-surface-2);transform:translateX(4px)}
.value-grid strong{display:block;margin-bottom:8px;color:var(--c-accent-2);font-size:.93rem}
.value-grid p{color:var(--c-subtle);line-height:1.65;font-size:.9rem;margin:0}

.contact-card{
  display:grid;grid-template-columns:1fr auto;gap:24px;
  align-items:center;margin-top:60px;padding:32px;
  border:1px solid var(--c-border);border-radius:var(--r-xl);
  background:var(--c-surface);backdrop-filter:var(--blur);
}
.contact-actions{display:flex;flex-direction:column;gap:10px;min-width:200px}
.contact-actions a{
  display:flex;align-items:center;justify-content:center;
  min-height:46px;padding:12px 20px;border-radius:var(--r-pill);
  font-weight:800;font-size:.9rem;
  transition:transform var(--dur) var(--ease),box-shadow var(--dur);
}
.contact-actions a:first-child{background:linear-gradient(135deg,var(--c-accent),var(--c-accent-2));color:#fff}
.contact-actions a:first-child:hover{transform:translateY(-2px);box-shadow:0 10px 36px rgba(124,92,252,.5)}
.contact-actions a:not(:first-child){background:var(--c-surface-2);color:var(--c-text);border:1px solid var(--c-border)}
.contact-actions a:not(:first-child):hover{border-color:var(--c-border-h);transform:translateY(-2px)}

.kit-footer{
  display:flex;justify-content:space-between;gap:12px;
  margin-top:24px;font-size:.8rem;color:var(--c-muted);
  border-top:1px solid var(--c-border);padding-top:16px;
}
.kit-footer a{color:var(--c-accent-2);font-weight:600}

/* ─── Responsive ─────────────────────────────────────────────────────────── */
@media (max-width:720px){
  .page{width:min(100% - 20px,1100px)}
  .page-home{padding:28px 0 36px;align-items:start}
  .kit-hero,.kit-section,.contact-card{grid-template-columns:1fr}
  .kit-summary{grid-template-columns:1fr 1fr}
  .kit-avatar{width:100px;height:100px}
  .contact-actions{min-width:0}
}
@media (max-width:440px){
  .stats-strip{grid-template-columns:1fr 1fr}
  .stats-strip .stat-card:last-child{grid-column:span 2}
  .kit-summary{grid-template-columns:1fr}
  .simple-footer,.kit-footer{flex-direction:column;gap:6px}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}
  [data-reveal]{opacity:1;transform:none}
  .social-item{opacity:1;transform:none}
}
