/* ============================================================
   MINK Design System — editorial homepage
   Self-hosted fonts · brand tokens · TWO themes (light default + dark)
   Source: MINK Design System handoff (tokens/*.css, ui_kits/website-editorial)
   ============================================================ */

/* ---------------- Fonts (self-hosted, no CDN) ---------------- */
@font-face{font-family:'DM Sans';font-style:normal;font-weight:400;font-display:swap;src:url('fonts/dm-sans-400.ttf') format('truetype');}
@font-face{font-family:'DM Sans';font-style:normal;font-weight:500;font-display:swap;src:url('fonts/dm-sans-500.ttf') format('truetype');}
@font-face{font-family:'DM Sans';font-style:normal;font-weight:600;font-display:swap;src:url('fonts/dm-sans-600.ttf') format('truetype');}
@font-face{font-family:'DM Sans';font-style:normal;font-weight:700;font-display:swap;src:url('fonts/dm-sans-700.ttf') format('truetype');}
@font-face{font-family:'Noto Serif Display';font-style:italic;font-weight:300;font-display:swap;src:url('fonts/nsd-300-i-cyrillic.woff2') format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;}
@font-face{font-family:'Noto Serif Display';font-style:italic;font-weight:300;font-display:swap;src:url('fonts/nsd-300-i-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'Noto Serif Display';font-style:italic;font-weight:300;font-display:swap;src:url('fonts/nsd-300-i-latin.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Noto Serif Display';font-style:normal;font-weight:300;font-display:swap;src:url('fonts/nsd-300-n-cyrillic.woff2') format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;}
@font-face{font-family:'Noto Serif Display';font-style:normal;font-weight:300;font-display:swap;src:url('fonts/nsd-300-n-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'Noto Serif Display';font-style:normal;font-weight:300;font-display:swap;src:url('fonts/nsd-300-n-latin.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}

/* ---------------- Brand constants (theme-independent) ---------------- */
:root{
  --serif:"Noto Serif Display",Georgia,serif;
  --sans:"DM Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --mag:#C740E0; --vio:#8B2FC0; --vio-soft:#B54FD4; --vio-dark:#531B73; --cyan:#22D3EE;
  --coin:#B78B2F; --coin-soft:#E2B23C; --star:#E8A838; --success:#1F8A5B;
  --grad:linear-gradient(135deg,#8B2FC0,#C740E0);
  --grad-sweep:linear-gradient(110deg,#531B73,#C740E0);
  --grad-premium:linear-gradient(135deg,#C740E0,#8B2FC0 55%,#6B1FA0);
  --ink:#0E0D10;            /* always-dark section bg */
  --ink-soft:#1A181D;
  --tx-light:#F4F1EC;       /* text on dark/image */
  --tx-light-mut:rgba(244,241,236,.66);
  --ease-out:cubic-bezier(0.22,1,0.36,1);
  --maxw:1280px; --pad:clamp(22px,5vw,80px);
}

/* ---------------- Single DARK theme ---------------- */
:root{
  --bg:#0E0D10; --bg-2:#15131A; --surface:#1A181D;
  --tx:#F5F3F7; --tx-mut:#A39DAB; --tx-faint:#8A828C;
  --line:rgba(255,255,255,.12); --line-soft:rgba(255,255,255,.07);
  --accent:var(--vio-soft);
  --topbar-bg:rgba(14,13,16,.8); --topbar-line:rgba(255,255,255,.1);
  --card:rgba(26,24,29,.86); --card-line:rgba(255,255,255,.1);
  --aurora-1:rgba(199,64,224,.34); --aurora-2:rgba(139,47,192,.32);
  --aurora-3:rgba(34,211,238,.14); --aurora-op:.85;
  color-scheme:dark;
}

/* ---------------- Base ---------------- */
*{box-sizing:border-box}
html{scroll-behavior:smooth}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
.lenis.lenis-stopped{overflow:hidden}
body{margin:0;background:var(--bg);color:var(--tx);font-family:var(--sans);
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:hidden;
  transition:background .6s var(--ease-out),color .6s var(--ease-out);}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
button{font:inherit;border:0;background:none;cursor:pointer;color:inherit}
::selection{background:rgba(199,64,224,.22)}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);border:0}
.skip-link{position:fixed;top:-60px;left:14px;z-index:200;background:var(--ink);color:#fff;padding:10px 16px;border-radius:8px;transition:top .25s}
.skip-link:focus{top:14px}
a:focus-visible,button:focus-visible,input:focus-visible{outline:2px solid var(--vio-soft);outline-offset:3px;border-radius:5px}

/* ---------------- Type primitives ---------------- */
.ey{margin:0;font:600 12px var(--sans);letter-spacing:.28em;text-transform:uppercase;color:var(--accent)}
.ey.light{color:rgba(255,255,255,.82)}
.grad-ey{background:var(--grad-sweep);-webkit-background-clip:text;background-clip:text;color:transparent}
.kicker{margin:0 0 22px;font:600 12.5px var(--sans);letter-spacing:.3em;text-transform:uppercase;color:rgba(255,255,255,.78)}
.idx{display:block;font:300 15px var(--serif);letter-spacing:.1em;margin-bottom:26px;
  background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.serif{font-family:var(--serif);font-weight:300}

/* ---------------- Buttons ---------------- */
.btn-grad{display:inline-flex;align-items:center;gap:10px;padding:15px 27px;border-radius:999px;
  background:var(--grad);color:#fff;font:600 12.5px var(--sans);letter-spacing:.14em;text-transform:uppercase;
  box-shadow:0 14px 36px rgba(199,64,224,.34);transition:transform .4s var(--ease-out),box-shadow .4s}
.btn-grad:hover{transform:translateY(-3px);box-shadow:0 20px 50px rgba(199,64,224,.48)}
.btn-grad svg{width:18px;height:18px;transition:transform .4s var(--ease-out)}
.btn-grad:hover svg{transform:translateX(5px)}
.btn-line{display:inline-flex;align-items:center;gap:12px;padding:6px 0;color:var(--tx);
  font:600 13px var(--sans);letter-spacing:.14em;text-transform:uppercase;position:relative}
.btn-line.on-dark{color:var(--tx-light)}
.btn-line::after{content:'';position:absolute;left:0;bottom:0;height:1px;width:100%;background:currentColor;
  transform-origin:left;transition:transform .5s var(--ease-out)}
.btn-line:hover::after{transform:scaleX(.4)}
.btn-line svg{width:18px;height:18px;transition:transform .4s var(--ease-out)}
.btn-line:hover svg{transform:translateX(5px)}
/* official-style store badges (minimal premium) */
.store-badge{display:inline-flex;align-items:center;gap:10px;min-height:54px;padding:0 18px 0 15px;border-radius:12px;
  background:rgba(0,0,0,.5);border:1px solid rgba(255,255,255,.24);color:#fff;backdrop-filter:blur(10px);
  transition:transform .3s var(--ease-out),background .3s,border-color .3s}
.store-badge:hover{transform:translateY(-3px);background:rgba(0,0,0,.68);border-color:rgba(255,255,255,.42)}
.sb-ic{width:26px;height:26px;flex:none}
.sb-txt{display:flex;flex-direction:column;line-height:1.1;text-align:left}
.sb-txt small{font:500 9.5px var(--sans);letter-spacing:.06em;text-transform:uppercase;color:rgba(255,255,255,.72)}
.sb-txt b{font:600 16px var(--sans);letter-spacing:.01em}

/* svg icon sizing default */
.ic{width:1em;height:1em;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;display:inline-block;vertical-align:middle}

/* ============================================================
   Shared shell (all pages): aurora · topbar · footer · toast
   ============================================================ */
.aurora{position:fixed;inset:0;z-index:-3;overflow:hidden;pointer-events:none}
.aurora i{position:absolute;border-radius:50%;filter:blur(90px);mix-blend-mode:screen;will-change:transform;opacity:var(--aurora-op);transition:background .6s var(--ease-out),opacity .6s}
.aurora i:nth-child(1){width:58vw;height:58vw;left:-12vw;top:-12vh;background:radial-gradient(circle,var(--aurora-1),transparent 64%);animation:adrift1 28s ease-in-out infinite alternate}
.aurora i:nth-child(2){width:54vw;height:54vw;right:-14vw;top:14vh;background:radial-gradient(circle,var(--aurora-2),transparent 64%);animation:adrift2 34s ease-in-out infinite alternate}
.aurora i:nth-child(3){width:46vw;height:46vw;left:20vw;bottom:-16vh;background:radial-gradient(circle,var(--aurora-3),transparent 62%);animation:adrift3 40s ease-in-out infinite alternate}
@keyframes adrift1{from{transform:translate3d(0,0,0) scale(1)}to{transform:translate3d(7vw,5vh,0) scale(1.18)}}
@keyframes adrift2{from{transform:translate3d(0,0,0) scale(1.1)}to{transform:translate3d(-6vw,8vh,0) scale(.92)}}
@keyframes adrift3{from{transform:translate3d(0,0,0) scale(1)}to{transform:translate3d(5vw,-6vh,0) scale(1.16)}}

.topbar{position:fixed;top:0;left:0;right:0;z-index:100;display:flex;align-items:center;justify-content:space-between;padding:24px var(--pad);transition:padding .4s,background .4s,box-shadow .4s}
.topbar.scrolled{padding:13px var(--pad);background:var(--topbar-bg);backdrop-filter:blur(16px);box-shadow:0 1px 0 var(--topbar-line)}
.logo img{height:21px;width:auto;filter:brightness(0) invert(1) drop-shadow(0 2px 14px rgba(0,0,0,.5));transition:height .4s}
.topbar.scrolled .logo img{height:19px}
.topnav{display:flex;gap:30px}
.topnav a{font:600 12px var(--sans);letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.82);transition:color .3s}
.topbar.scrolled .topnav a{color:var(--tx-mut)}
.topnav a:hover{color:#fff}.topbar.scrolled .topnav a:hover{color:var(--tx)}
.topright{display:flex;align-items:center;gap:18px}
.lang{display:flex;gap:2px}
.lang button{padding:5px 7px;font:600 11px var(--sans);letter-spacing:.06em;color:rgba(255,255,255,.5);transition:color .3s}
.lang button.active{color:#fff}
.topbar.scrolled .lang button{color:var(--tx-mut)}.topbar.scrolled .lang button.active{color:var(--tx)}
.link-cta{font:600 12px var(--sans);letter-spacing:.16em;text-transform:uppercase;color:#fff;padding-bottom:3px;border-bottom:1px solid currentColor}
.topbar.scrolled .link-cta{color:var(--accent)}

/* ---- Mobile menu: hamburger + full-screen drawer (engine in site.js) ---- */
.menu-btn{display:none;width:44px;height:44px;margin:-10px -10px -10px 2px;flex-direction:column;align-items:center;justify-content:center;gap:5px;background:none;border:0;cursor:pointer;-webkit-tap-highlight-color:transparent}
.menu-btn span{display:block;width:22px;height:2px;border-radius:2px;background:#fff;transition:transform .32s var(--ease-out),opacity .2s}
.topbar.scrolled .menu-btn span{background:var(--tx)}
.menu-btn.open span{background:var(--tx)}
.menu-btn.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.menu-btn.open span:nth-child(2){opacity:0}
.menu-btn.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.mobile-menu{position:fixed;inset:0;z-index:150;display:flex;flex-direction:column;justify-content:center;gap:2px;padding:0 var(--pad);background:rgba(12,11,14,.975);backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px)}
.mobile-menu[hidden]{display:none}
.mobile-menu a{font:300 italic clamp(2.1rem,9vw,3rem)/1.05 var(--serif);color:var(--tx);padding:11px 0;letter-spacing:-.01em;opacity:0;transform:translateY(16px);animation:mmIn .52s var(--ease-out) forwards}
.mobile-menu a:nth-child(1){animation-delay:.04s}
.mobile-menu a:nth-child(2){animation-delay:.09s}
.mobile-menu a:nth-child(3){animation-delay:.14s}
.mobile-menu a:nth-child(4){animation-delay:.19s}
.mobile-menu a:nth-child(5){animation-delay:.24s}
.mobile-menu .mm-cta{margin-top:22px;font:600 13px var(--sans);font-style:normal;letter-spacing:.18em;text-transform:uppercase;color:var(--mag)}
@keyframes mmIn{to{opacity:1;transform:none}}
body.nav-open{overflow:hidden}
body.nav-open .topbar{z-index:200}

.foot{background:var(--ink);color:var(--tx-light);padding:clamp(56px,8vh,90px) var(--pad) 34px;position:relative;z-index:1}
.foot-top{max-width:var(--maxw);margin:0 auto;display:flex;justify-content:space-between;align-items:flex-start;flex-wrap:wrap;gap:32px;padding-bottom:44px;border-bottom:1px solid rgba(255,255,255,.14)}
.foot-logo{height:20px;width:auto;filter:brightness(0) invert(1)}
.foot-nav{display:flex;gap:clamp(40px,7vw,88px);flex-wrap:wrap}
.foot-col{display:flex;flex-direction:column;gap:12px}
.foot-h{font:700 11px var(--sans);letter-spacing:.18em;text-transform:uppercase;color:var(--tx-light);opacity:.5;margin-bottom:2px}
.foot-nav a{font:500 13.5px var(--sans);letter-spacing:.01em;color:var(--tx-light-mut);transition:color .3s}
.foot-nav a:hover{color:#fff}
.foot-bottom{max-width:var(--maxw);margin:26px auto 0;display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;font:500 12.5px var(--sans);color:var(--tx-light-mut)}

.toast{position:fixed;left:50%;bottom:28px;transform:translateX(-50%) translateY(20px);z-index:300;padding:13px 22px;border-radius:999px;background:var(--ink);color:#fff;font:600 13.5px var(--sans);box-shadow:0 18px 50px rgba(0,0,0,.4);opacity:0;pointer-events:none;transition:opacity .3s,transform .3s}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}

@media (max-width:900px){ .topnav{display:none} .menu-btn{display:flex} }
@media (min-width:901px){ .mobile-menu{display:none!important} }
@media (max-width:540px){ .topright .link-cta{display:none} }
@media (prefers-reduced-motion:reduce){ .mobile-menu a{animation:none;opacity:1;transform:none} }
