/* NORYK — Local concept. Sora display + Inter text; all assets are local. */
@font-face {
  font-family:'Sora'; src:url('./assets/Sora.ttf') format('truetype');
  font-weight:100 800; font-style:normal; font-display:swap;
}
@font-face {
  font-family:'Inter'; src:url('./assets/Inter.ttf') format('truetype');
  font-weight:100 900; font-style:normal; font-display:swap;
}
:root {
  --purple:#9b62ff; --accent:#b88cff; --accent-hover:#caabff;
  --deep:#160d24; --dark:#100c18; --ink:#241533;
  --muted:#71657c; --subtle:#80718d; --paper:#fff; --lavender:#f6f3fb;
  --line:#e7dfef; --text-light:#f2ebff; --text-muted:#b4a7c3;
  --dark-line:#ffffff18; --font-text:'Inter',Arial,Helvetica,sans-serif;
  --font-display:'Sora',Arial,Helvetica,sans-serif; --wrap:1160px;
  --radius:16px; --space-1:8px; --space-2:16px; --space-3:24px;
  --space-4:32px; --space-5:48px; --space-6:64px;
  --space-7:88px; --space-section:120px;
}

/* Foundation ------------------------------------------------- */
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:32px; }
body { margin:0; background:var(--dark); color:var(--ink); font:400 16px/1.65 var(--font-text); -webkit-font-smoothing:antialiased; }
body.modal-open { overflow:hidden; }
h1,h2,h3,p { margin:0; }
h1,h2,h3 { font-family:var(--font-display); }
h1,h2 { font-weight:500; letter-spacing:-.045em; line-height:1.08; }
h2 { font-size:clamp(38px,4vw,52px); }
h3 { font-weight:500; letter-spacing:-.025em; line-height:1.3; }
a { color:inherit; text-decoration:none; }
button,input { font:inherit; }
button,a { -webkit-tap-highlight-color:transparent; }
button { cursor:pointer; color:inherit; }
img { max-width:100%; display:block; }
svg { display:block; }
button:focus-visible,a:focus-visible,summary:focus-visible,input:focus-visible { outline:3px solid var(--purple); outline-offset:5px; }
::selection { background:var(--accent); color:var(--deep); }
[hidden] { display:none!important; }
.wrap { width:min(var(--wrap),calc(100% - 80px)); margin-inline:auto; }
.section-light { background:var(--paper); }
.section-dark { background:var(--dark); color:var(--text-light); }
.subtle-text { color:var(--subtle); }
.eyebrow { display:flex; align-items:center; gap:12px; font-size:11px; line-height:1.5; font-weight:600; letter-spacing:.12em; color:var(--muted); }
.section-number { font-size:11px; color:var(--muted); }
.skip-link { position:fixed; z-index:50; left:20px; top:-100px; padding:12px 20px; background:var(--accent); color:var(--ink); }
.skip-link:focus { top:15px; }

/* Shared controls -------------------------------------------- */
.button { display:inline-flex; align-items:center; justify-content:center; gap:24px; min-height:52px; padding:12px 25px; border:1px solid transparent; border-radius:100px; font:600 14px/1.35 var(--font-text); text-align:center; white-space:nowrap; transition:transform .22s,background .22s,border-color .22s; }
.button>span { font-size:21px; line-height:1; font-weight:400; }
.button:hover { transform:translateY(-2px); }
.button-primary { background:var(--accent); color:var(--ink); box-shadow:0 8px 24px #9b62ff15; }
.button-primary:hover { background:var(--accent-hover); }
.button-glass { background:#ffffff05; border-color:#ffffff60; color:var(--text-light); backdrop-filter:blur(10px); }
.button-glass:hover { background:#b88cff14; border-color:var(--accent); }
.text-link { display:inline-flex; align-items:center; gap:22px; padding-bottom:6px; border-bottom:1px solid #a795b9; font-size:14px; line-height:1.5; font-weight:600; transition:color .2s,gap .2s; }
.text-link>span { font-size:21px; line-height:1; font-weight:400; }
.text-link:hover { color:#7441d2; gap:30px; }

/* Brand & header --------------------------------------------- */
.brand { position:relative; display:inline-flex; align-items:center; width:142px; flex:none; }
.brand-img { width:100%; height:auto; filter:brightness(0) invert(1); }
.brand-mark { position:absolute; inset:0; width:100%; height:auto; clip-path:inset(0 72.5% 0 0); pointer-events:none; }
.site-header { position:relative; z-index:10; display:flex; align-items:center; justify-content:space-between; gap:28px; height:104px; border-bottom:1px solid #ffffff18; }
.primary-nav { display:flex; align-items:center; gap:28px; margin-left:auto; margin-right:20px; }
.primary-nav a { color:#e9dff5c9; font-size:13px; line-height:1.4; font-weight:500; transition:color .2s; }
.primary-nav a:hover,.primary-nav .nav-current { color:var(--accent); }
.header-cta { min-height:44px; padding:10px 19px; gap:16px; font-size:13px; }
.header-cta>span { font-size:19px; }
.menu-toggle { display:none; }

/* Hero ------------------------------------------------------- */
.hero-shell { position:relative; isolation:isolate; overflow:hidden; color:var(--text-light); background:var(--deep); min-height:850px; }
.hero-image { position:absolute; z-index:-3; inset:0; width:100%; height:100%; object-fit:cover; object-position:center 41%; }
.hero-shade { position:absolute; z-index:-2; inset:0; background:linear-gradient(90deg,#100c18ed 0%,#100c18dc 21%,#100c18ba 36%,#100c1850 59%,#100c1800 80%),linear-gradient(0deg,#100c18d6 0%,transparent 36%,#100c185c 100%); }
.hero-shell::after { content:''; position:absolute; z-index:-1; inset:0; pointer-events:none; background:linear-gradient(180deg,#00000024,transparent 24%); }
.hero { position:relative; min-height:746px; padding-top:97px; padding-bottom:110px; }
.hero-copy { width:610px; position:relative; z-index:1; }
.hero .eyebrow { color:#d9cde8; margin-bottom:27px; }
.status-dot { display:inline-block; width:6px; height:6px; border-radius:50%; background:var(--accent); box-shadow:0 0 14px #b88cff90; }
.hero h1 { font-size:clamp(60px,5.5vw,78px); line-height:1.06; }
.hero h1>span { color:var(--accent); }
.hero-description { margin-top:27px; color:#e7dff0d6; font-size:16px; line-height:1.7; }
.hero-actions { display:flex; flex-wrap:wrap; gap:14px; margin-top:30px; }
.hero-caption { display:flex; align-items:center; gap:12px; margin-top:36px; color:#c6b8d4; font-size:12px; line-height:1.6; }
.tiny-arrow { display:grid; place-items:center; height:24px; width:24px; border:1px solid #ffffff40; border-radius:50%; font-size:15px; color:#e8def3; }
.hero-note { position:absolute; top:335px; right:0; display:flex; align-items:center; gap:12px; padding:16px; background:#160d2438; backdrop-filter:blur(7px); border:1px solid #ffffff18; border-radius:var(--radius); }
.note-orbit { display:grid; place-items:center; height:38px; width:38px; border:1px solid #b88cff70; border-radius:50%; color:var(--accent); font-size:23px; }
.hero-note p { color:#ded3ecc9; font-size:12px; line-height:1.55; }
.hero-note strong { color:var(--text-light); font-weight:500; }
.hero-bottom { position:absolute; bottom:28px; left:0; right:0; display:flex; align-items:center; gap:24px; color:#c2b4d0; font-size:11px; letter-spacing:.1em; line-height:1.5; }
.hero-line { height:1px; flex:1; background:#ffffff25; }

/* Experience / interactive preview --------------------------- */
.experience { padding:128px 0 112px; }
.experience-layout { display:grid; grid-template-columns:.95fr 1.15fr; align-items:center; gap:72px; }
.section-intro .eyebrow { margin-bottom:25px; }
.section-intro h2 { margin-bottom:26px; }
.section-intro>p:not(.eyebrow) { color:var(--muted); font-size:15px; line-height:1.8; max-width:365px; }
.section-intro .short-statement { margin-top:20px; color:#4f3c62; }
.short-statement>span { color:#7441d2; }
.tab-list { display:flex; gap:5px; width:max-content; margin-top:30px; padding:5px; border-radius:100px; background:#f0e9f8; }
.demo-tab { display:flex; align-items:center; gap:16px; min-height:43px; padding:10px 18px; border:0; border-radius:100px; background:transparent; color:#6c587e; font-size:13px; line-height:1.3; font-weight:500; transition:background .2s,color .2s; }
.demo-tab>span { font-size:17px; }
.demo-tab.is-active { background:var(--ink); color:#d2b8ff; }
.product-showcase { position:relative; isolation:isolate; display:flex; align-items:center; justify-content:center; min-height:490px; }
.showcase-grid { position:absolute; z-index:-3; inset:0; background-image:linear-gradient(#e9e0f160 1px,transparent 1px),linear-gradient(90deg,#e9e0f160 1px,transparent 1px); background-size:51px 51px; mask-image:radial-gradient(ellipse at center,black,transparent 69%); }
.product-showcase::after { content:''; position:absolute; z-index:-2; bottom:93px; left:18%; width:350px; height:190px; border-radius:50%; background:#b88cff55; filter:blur(42px); }
.fan { position:absolute; z-index:-1; top:100px; left:50px; width:222px; height:303px; border:1px solid #a87be2; border-radius:16px; transform-origin:75% 90%; background:linear-gradient(135deg,#dfcaff,#b88cff 38%,#7441d2 77%,#c29bff); box-shadow:0 10px 25px #40205b18; }
.fan-one { transform:rotate(-34deg) translate(-16px,2px); background:linear-gradient(135deg,#2b173f,#b88cff 50%,#7646ba); }
.fan-two { transform:rotate(-23deg) translate(10px,4px); }
.fan-three { transform:rotate(-12deg) translate(35px,6px); }
.fan-four { transform:rotate(-1deg) translate(57px,8px); background:linear-gradient(135deg,#30203f,#b88cff 40%,#d1b1ff); }
.demo-panel { position:relative; z-index:2; width:350px; margin-left:60px; }
.demo-panel.is-active { animation:panel-in .35s ease both; }
.pix-widget,.crypto-widget { padding:25px; border:1px solid #634684; border-radius:var(--radius); color:var(--text-light); background:linear-gradient(135deg,#160d24,#2a193f); box-shadow:0 26px 40px #301c462b; transform:rotate(7deg); }
.widget-head { display:flex; align-items:center; gap:9px; padding-bottom:24px; color:#c5b4d7; font-size:10px; line-height:1.4; letter-spacing:.055em; }
.widget-icon { display:grid; place-items:center; height:26px; width:26px; flex:none; border:1px solid #b88cff70; border-radius:7px; color:var(--accent); font-size:19px; }
.mini-dot { height:4px; width:4px; flex:none; margin-left:auto; border-radius:50%; background:var(--accent); }
.widget-label { display:block; color:#d7c7e8; font-size:12px; }
.widget-value { display:block; margin-top:2px; font-family:var(--font-display); font-size:41px; font-weight:500; line-height:1.4; letter-spacing:-.045em; font-variant-numeric:tabular-nums; }
.widget-value>span { color:var(--accent); font-size:28px; }
.widget-divider { height:1px; background:#ffffff20; margin:20px 0; }
.widget-row { display:flex; align-items:center; gap:10px; font-size:12px; line-height:1.5; }
.avatar { display:grid; place-items:center; height:36px; width:36px; flex:none; border-radius:50%; background:#b88cff20; color:#cfadff; }
.widget-row small { display:block; color:#bcabd0; font-size:11px; margin-top:3px; }
.check-badge { display:grid; place-items:center; width:22px; height:22px; margin-left:auto; flex:none; border:1px solid #b88cff80; border-radius:50%; color:var(--accent); font-size:12px; }
.widget-actions { display:flex; gap:8px; margin-top:24px; font-size:12px; }
.widget-actions>span { display:flex; align-items:center; justify-content:space-between; width:50%; padding:11px 13px; border:1px solid #ffffff20; border-radius:8px; background:#ffffff08; }
.widget-actions b { color:var(--accent); font-size:19px; font-weight:400; }
.showcase-caption,.demo-disclaimer { position:absolute; left:20px; right:0; text-align:center; color:#756384; font-size:11px; line-height:1.5; }
.showcase-caption { bottom:8px; letter-spacing:.1em; font-size:10px; }
.demo-disclaimer { bottom:-15px; }
.bank-card { position:relative; isolation:isolate; overflow:hidden; width:350px; height:220px; padding:24px; border:1px solid #7b5b98; border-radius:var(--radius); color:var(--text-light); background:linear-gradient(110deg,#160f20,#2b1b3f); box-shadow:0 25px 35px #25143b3b; }
.bank-card-top { display:flex; align-items:center; justify-content:space-between; }
.card-wordmark { display:block; line-height:0; }
.card-logo { width:112px; height:auto; filter:brightness(0) invert(1); }
.card-type { font-size:10px; letter-spacing:.1em; color:#ead9ff; }
.card-symbol { position:absolute; z-index:-1; top:-38px; right:-13px; width:140px; height:235px; clip-path:polygon(30% 0,100% 0,100% 65%,33% 100%,0 63%,50% 39%); transform:rotate(12deg); background:#b88cff; }
.card-chip { display:block; position:relative; width:32px; height:23px; margin-top:20px; border:1px solid #c6abde; border-radius:5px; background:linear-gradient(120deg,#614775,#c5a6e555); }
.card-chip::before,.card-chip::after { content:''; position:absolute; background:#c5a6e575; }
.card-chip::before { width:1px; height:100%; top:0; left:10px; }
.card-chip::after { height:1px; width:100%; top:10px; left:0; }
.card-digits { display:block; margin-top:16px; color:#e7d9f5; font-size:12px; letter-spacing:.08em; line-height:1.4; font-variant-numeric:tabular-nums; }
.bank-card-bottom { display:flex; align-items:center; justify-content:space-between; margin-top:9px; color:#ddcceeff; font-size:8px; line-height:1.5; letter-spacing:.1em; }
.contactless { margin-right:7px; transform:rotate(-7deg); color:#241533; font-size:17px; line-height:1; font-weight:600; }
.card-showcase { transform:rotate(8deg); }
.card-demo-controls { display:flex; align-items:center; justify-content:space-between; gap:10px; width:calc(100% + 20px); margin-top:40px; margin-left:-20px; padding:13px 12px; border:1px solid #e2d6ed; border-radius:12px; background:#ffffffed; box-shadow:0 10px 15px #25143b08; color:#6a557b; font-size:11px; line-height:1.4; }
.card-demo-controls>span { display:flex; align-items:center; gap:7px; }
.small-online-dot { height:5px; width:5px; flex:none; border-radius:50%; background:#8d4de7; }
.card-demo-controls button { display:flex; align-items:center; justify-content:center; gap:10px; padding:9px 10px; border:0; border-radius:8px; background:#f0e9f8; color:#523b69; font-size:11px; line-height:1.3; }
.card-demo-controls button>span:last-child { font-size:13px; }
.demo-card.is-locked { filter:grayscale(1); opacity:.7; }
.currency-line { display:flex; align-items:center; gap:12px; }
.currency-mark { display:grid; place-items:center; width:44px; height:44px; flex:none; border-radius:50%; background:var(--accent); color:#30173f; font-size:26px; }
.currency-line small { display:block; color:#c3aed6; font-size:12px; }
.currency-line strong { display:block; margin-top:3px; font-family:var(--font-display); font-size:24px; line-height:1.2; font-weight:500; letter-spacing:-.025em; }
.currency-network { margin-left:auto; padding:5px 8px; border:1px solid #ffffff30; border-radius:30px; color:#d8c3e9; font-size:10px; letter-spacing:.04em; }
.conversion-line { display:flex; align-items:center; gap:10px; margin:16px 0 16px 14px; }
.conversion-line>span { flex:1; height:1px; background:#ffffff20; }
.conversion-line b { display:grid; place-items:center; width:26px; height:26px; border:1px solid #b88cff70; border-radius:50%; color:var(--accent); font-size:15px; font-weight:400; }
.real-mark { background:#ffffff10; color:var(--accent); font-size:17px; }
.crypto-caption { margin-top:23px; padding-top:22px; border-top:1px solid #ffffff20; color:#c3afd5; font-size:12px; line-height:1.8; }

/* Solutions -------------------------------------------------- */
.solutions { padding:0 0 var(--space-section); }
.section-heading-row { display:flex; align-items:flex-end; justify-content:space-between; gap:48px; margin-bottom:42px; }
.section-heading-row .eyebrow { margin-bottom:24px; }
.section-heading-row h2 { font-size:46px; }
.heading-aside { margin-bottom:3px; color:var(--muted); font-size:14px; line-height:1.8; }
.solutions-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:16px; }
.solution-item { position:relative; padding:35px 37px; border:1px solid #eee7f5; border-radius:var(--radius); background:var(--lavender); transition:background .25s; }
.solution-item:hover { background:#f0e9f8; }
.square-icon { display:grid; place-items:center; width:36px; height:36px; margin-bottom:27px; border-radius:10px; background:#c9a6ff; color:#49305f; }
.square-icon svg { height:20px; width:20px; fill:none; stroke:currentColor; stroke-width:1.5; stroke-linejoin:round; stroke-linecap:round; }
.solution-number { position:absolute; right:35px; top:39px; color:var(--muted); font-size:11px; letter-spacing:.06em; }
.solution-item h3 { margin-bottom:14px; font-size:22px; }
.solution-item p { max-width:360px; color:var(--muted); font-size:15px; line-height:1.8; }
.solution-item ul { padding:0; margin:19px 0 28px; list-style:none; color:#6a587c; font-size:13px; line-height:1.9; }
.solution-item li::before { content:''; display:inline-block; width:3px; height:3px; margin-right:9px; margin-bottom:2px; border-radius:50%; background:#947aac; vertical-align:middle; }

/* Control / cascading virtual cards -------------------------- */
.control { overflow:hidden; padding:0 0 var(--space-section); }
.control-layout { display:grid; grid-template-columns:1fr 1.1fr; align-items:center; gap:80px; }
.control-copy .eyebrow { margin-bottom:25px; }
.control-copy h2 { font-size:50px; }
.control-copy>p:not(.eyebrow) { max-width:365px; margin-top:25px; color:var(--muted); font-size:15px; line-height:1.8; }
.control-features { display:grid; max-width:400px; margin-top:32px; }
.control-feature { display:flex; gap:18px; padding:22px 0; border-top:1px solid var(--line); }
.control-feature:last-child { border-bottom:1px solid var(--line); }
.control-feature>span { display:grid; place-items:center; width:32px; height:32px; flex:none; border-radius:9px; background:#c9a6ff; color:#543775; font-size:18px; }
.control-feature h3 { margin:1px 0 7px; font-size:15px; }
.control-feature p { max-width:310px; color:var(--muted); font-size:13px; line-height:1.75; }
.card-sculpture { position:relative; isolation:isolate; display:flex; align-items:center; justify-content:center; height:590px; perspective:1000px; }
.card-sculpture::after { content:''; position:absolute; z-index:-1; bottom:64px; width:310px; height:80px; border-radius:50%; transform:rotate(-15deg); background:#a675df3d; filter:blur(35px); }
.sculpture-orbit { position:absolute; top:49px; left:3px; width:435px; height:435px; border:1px solid #e6d8f1; border-radius:50%; transform:rotateX(40deg); }
.sculpture-orbit::before { content:''; position:absolute; inset:34px; border:1px dashed #ddcceb; border-radius:50%; }
.sculpture-card { position:absolute; z-index:12; top:51px; left:83px; width:325px; height:205px; transform:rotate(-53deg) skew(-3deg); background:#1b1028; box-shadow:0 8px 12px #22103245; }
.sculpture-card .card-symbol { top:-26px; right:-13px; width:160px; height:220px; }
.sculpture-card .card-chip { margin-top:17px; }
.sculpture-card .card-digits { margin-top:13px; font-size:11px; }
.sculpture-card .bank-card-bottom { font-size:7px; }
.sculpture-steps { position:absolute; inset:0; }
.sculpture-steps i { position:absolute; top:80px; left:91px; width:325px; height:205px; border:1px solid #9573ba; border-radius:var(--radius); transform:rotate(-48deg) skew(-3deg); background:linear-gradient(100deg,#22142f,#44315b); box-shadow:0 5px 7px #24133520; }
.sculpture-steps i:nth-child(2) { top:101px; left:99px; transform:rotate(-42deg); }
.sculpture-steps i:nth-child(3) { top:122px; left:104px; transform:rotate(-36deg); }
.sculpture-steps i:nth-child(4) { top:143px; left:109px; transform:rotate(-30deg); }
.sculpture-steps i:nth-child(5) { top:164px; left:113px; transform:rotate(-24deg); }
.sculpture-steps i:nth-child(6) { top:185px; left:117px; transform:rotate(-18deg); }
.sculpture-steps i:nth-child(7) { top:206px; left:120px; transform:rotate(-12deg); }
.sculpture-steps i:nth-child(8) { top:227px; left:122px; transform:rotate(-6deg); }
.sculpture-steps i:nth-child(9) { top:248px; left:124px; transform:rotate(0deg); }
.sculpture-steps i:nth-child(10) { top:269px; left:125px; transform:rotate(6deg); }
.sculpture-steps i:nth-child(11) { top:290px; left:126px; transform:rotate(12deg); }
.sculpture-steps i:nth-child(12) { top:311px; left:127px; transform:rotate(18deg); }
.sculpture-caption { position:absolute; bottom:0; right:0; display:flex; align-items:center; gap:14px; color:#806a93; font-size:10px; line-height:1.8; letter-spacing:.1em; }
.caption-line { width:39px; height:1px; background:#a78abd; }

/* Dark editorial sections ------------------------------------ */
.beyond { position:relative; isolation:isolate; overflow:hidden; padding:112px 0; }
.beyond::after { content:''; position:absolute; z-index:-1; bottom:0; left:-90px; width:650px; height:350px; background:radial-gradient(ellipse,#8d4ae71e,transparent 65%); }
.beyond-top .eyebrow { margin-bottom:25px; color:var(--text-muted); }
.beyond-top h2 { font-size:49px; }
.beyond-top h2>span { color:#a997b9; }
.beyond-top>p:last-child { margin-top:25px; color:var(--text-muted); font-size:15px; line-height:1.8; }
.lifestyle-grid { display:grid; grid-template-columns:repeat(3,1fr); margin-top:48px; border-top:1px solid var(--dark-line); border-bottom:1px solid var(--dark-line); }
.lifestyle-grid article { padding:32px 36px 34px 0; }
.lifestyle-grid article+article { padding-left:36px; border-left:1px solid var(--dark-line); }
.line-icon { display:grid; place-items:center; width:38px; height:38px; margin-bottom:24px; border:1px solid #ffffff25; border-radius:11px; background:#ffffff04; color:#d7c4e8; font-size:24px; }
.lifestyle-grid h3 { margin-bottom:12px; font-size:18px; }
.lifestyle-grid p { max-width:270px; color:var(--text-muted); font-size:14px; line-height:1.8; }
.why-heading { margin-top:88px; }
.why-heading .eyebrow { display:block; margin-bottom:18px; color:var(--text-muted); }
.why-heading h2 { font-size:38px; }
.why-heading h2>span { color:var(--accent); }
.why-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:20px; margin-top:35px; }
.why-grid article { min-height:205px; padding:25px 18px; border-top:1px solid #a06cdf70; border-radius:0 0 12px 12px; background:linear-gradient(150deg,#65279418,transparent); }
.why-grid article>span { display:block; margin-bottom:20px; color:var(--accent); font-size:26px; line-height:1; }
.why-grid h3 { margin-bottom:12px; font-size:15px; }
.why-grid p { color:var(--text-muted); font-size:13px; line-height:1.8; }

/* Support portrait — preserve the top of the source image ----- */
.support { position:relative; isolation:isolate; overflow:hidden; min-height:640px; }
.support-image { position:absolute; z-index:-3; inset:0; width:100%; height:100%; object-fit:cover; object-position:right top; }
.support-shade { position:absolute; z-index:-2; inset:0; background:linear-gradient(90deg,#100c18ec 0%,#100c18d4 32%,#100c1875 52%,#100c1810 80%),linear-gradient(0deg,#100c18b0 0%,transparent 70%); }
.support-inner { display:flex; align-items:center; justify-content:space-between; min-height:640px; gap:48px; }
.support-inner>div { width:555px; padding:80px 0; }
.support .eyebrow { margin-bottom:26px; color:#d0bce3; }
.support h2 { font-size:47px; }
.support h2>span { color:var(--accent); }
.support p:not(.eyebrow) { max-width:380px; margin-top:26px; color:#e1d6ec; font-size:15px; line-height:1.8; }
.light-link { margin-top:27px; color:var(--text-light); border-color:#dac6eb80; }
.light-link:hover { color:#d4b7ff; }
.support-label { align-self:flex-end; margin-bottom:32px; color:#e1d3ed; font-size:11px; line-height:1.8; letter-spacing:.1em; }

/* FAQ -------------------------------------------------------- */
.faq { padding:112px 0; }
.faq-layout { display:grid; grid-template-columns:1fr 1.1fr; gap:88px; }
.faq .eyebrow { margin-bottom:25px; }
.faq h2 { font-size:43px; }
.faq-layout>div>p:not(.eyebrow) { margin-top:25px; color:var(--muted); font-size:15px; line-height:1.8; }
.faq details { border-bottom:1px solid var(--line); }
.faq details:first-child { border-top:1px solid var(--line); }
.faq summary { display:flex; align-items:center; justify-content:space-between; gap:22px; padding:25px 0; list-style:none; cursor:pointer; font-size:15px; line-height:1.6; font-weight:500; }
.faq summary::-webkit-details-marker { display:none; }
.faq summary>span { position:relative; display:block; height:22px; width:22px; flex:none; }
.faq summary>span::before,.faq summary>span::after { content:''; position:absolute; left:5px; top:10px; width:12px; height:1px; background:#644083; transition:transform .2s; }
.faq summary>span::after { transform:rotate(90deg); }
.faq details[open] summary { color:#7441d2; }
.faq details[open] summary>span::after { transform:rotate(0); }
.faq details>p { max-width:540px; padding:0 34px 25px 0; color:var(--muted); font-size:14px; line-height:1.85; }

/* Closing & footer ------------------------------------------- */
.closing { padding:16px 0 88px; }
.closing-inner { position:relative; isolation:isolate; overflow:hidden; display:flex; flex-direction:column; align-items:center; min-height:445px; padding:66px 32px 62px; border:1px solid #ffffff18; border-radius:var(--radius); text-align:center; background:#1b1227; }
.closing-inner::after { content:''; position:absolute; z-index:-2; inset:0; background-image:linear-gradient(#ffffff05 1px,transparent 1px),linear-gradient(90deg,#ffffff05 1px,transparent 1px); background-size:70px 70px; }
.closing-glow { position:absolute; z-index:-1; bottom:-200px; left:calc(50% - 275px); width:550px; height:230px; border-radius:50%; background:#9b62ff; filter:blur(65px); }
.closing .eyebrow { display:block; margin-bottom:22px; color:#bca6cf; }
.closing h2 { position:relative; z-index:2; font-size:43px; line-height:1.15; }
.closing h2>span { color:var(--accent); }
.closing p:not(.eyebrow) { margin-top:23px; color:#c3afd4; font-size:15px; line-height:1.8; }
.closing .button { z-index:2; margin-top:28px; }
.closing-monogram { position:absolute; z-index:-1; right:57px; bottom:-53px; color:#bb8bff21; font:800 300px/1 Arial,sans-serif; transform:rotate(-3deg); }
.closing-bottom-label { position:absolute; bottom:18px; left:23px; color:#ae95c2; font-size:10px; line-height:1.4; letter-spacing:.1em; }
.site-footer { padding-top:56px; border-top:1px solid #ffffff0d; background:#140e1e; }
.footer-main { display:grid; grid-template-columns:1.2fr .8fr 1.2fr 1fr; gap:40px; padding-bottom:48px; }
.footer-brand .brand { width:132px; }
.footer-brand p { margin-top:18px; color:#b4a0c6; font-size:14px; line-height:1.8; }
.footer-links { display:flex; flex-direction:column; align-items:flex-start; gap:14px; padding-top:8px; }
.footer-links>span { margin-bottom:6px; color:#d3bfdf; font-size:11px; line-height:1.5; letter-spacing:.1em; font-weight:600; }
.footer-links>a,.footer-links>button { padding:0; border:0; background:transparent; color:#b8a4cb; font-size:13px; line-height:1.7; text-align:left; }
.footer-links>a:hover,.footer-links>button:hover { color:var(--accent); }
.footer-manifesto { padding-top:8px; }
.footer-manifesto>span:first-child { display:block; color:#b29ac5; font-size:11px; line-height:1.8; letter-spacing:.07em; }
.footer-arrow { display:block; margin-top:9px; color:var(--accent); font:400 65px/1.3 var(--font-display); }
.footer-bottom { display:flex; align-items:flex-start; justify-content:space-between; gap:25px; padding:25px 0; border-top:1px solid #ffffff12; color:#ad98c0; font-size:11px; line-height:1.8; }
.footer-bottom>span:last-child { font-size:10px; letter-spacing:.08em; }

/* Local demonstration dialog --------------------------------- */
.join-dialog { width:min(490px,calc(100% - 32px)); max-height:calc(100dvh - 32px); padding:42px; overflow-y:auto; border:1px solid #61457c; border-radius:20px; background:#1a1029; color:var(--text-light); box-shadow:0 40px 160px #0009; }
.join-dialog::backdrop { background:#100c18d9; backdrop-filter:blur(8px); }
.modal-close { position:absolute; top:14px; right:16px; padding:7px; border:0; background:transparent; color:#d6bfe9; font-size:28px; line-height:1; }
.modal-symbol { display:block; margin-bottom:20px; color:var(--accent); font-size:38px; line-height:1; }
.join-dialog .eyebrow { margin-bottom:18px; color:#c5afd7; font-size:10px; }
.join-dialog h2 { font-size:35px; }
.join-dialog p:not(.eyebrow) { margin-top:20px; color:#c3add5; font-size:14px; line-height:1.8; }
.join-dialog>form { display:block; margin:0; }
.join-dialog label { display:block; margin-top:22px; margin-bottom:8px; color:#d8c5e7; font-size:12px; line-height:1.5; font-weight:500; }
.join-dialog input { display:block; width:100%; height:50px; padding:0 14px; border:1px solid #6b4f83; border-radius:10px; background:#251637; color:var(--text-light); font-size:14px; }
.join-dialog input::placeholder { color:#ac95c0; }
.join-dialog form>.button { width:100%; margin-top:27px; }
.join-dialog small { display:block; margin-top:17px; color:#baa2cd; font-size:11px; line-height:1.8; text-align:center; }
.join-success { padding:24px 0 12px; }
.success-icon { display:grid; place-items:center; width:60px; height:60px; margin-bottom:28px; border-radius:50%; background:var(--accent); color:var(--ink); font-size:28px; }
.join-success h2 { max-width:360px; overflow-wrap:anywhere; }
.join-success h2>span { color:var(--accent); }
.join-success .button { width:100%; margin-top:28px; }
.toast { position:fixed; z-index:50; bottom:24px; left:50%; width:max-content; max-width:calc(100% - 32px); padding:14px 23px; border:1px solid #8f62bc; border-radius:50px; background:#25133bed; color:#ecdcf9; backdrop-filter:blur(12px); box-shadow:0 8px 30px #0003; text-align:center; font-size:13px; line-height:1.6; pointer-events:none; opacity:0; transform:translate(-50%,20px); transition:opacity .2s,transform .2s; }
.toast.is-visible { opacity:1; transform:translate(-50%,0); }
.reveal-ready { transition:opacity .6s,transform .6s; }
.reveal-ready.is-visible { opacity:1; transform:none; }
@keyframes panel-in { from { opacity:0; transform:translateY(12px); } to { opacity:1; transform:translateY(0); } }

/* Large screens ---------------------------------------------- */
@media (min-width:1500px) {
  .hero-shell { min-height:930px; }
  .hero { min-height:826px; padding-top:130px; }
  .hero h1 { font-size:82px; }
  .hero-image { object-position:center 43%; }
  .hero-note { top:375px; }
  .support-image { object-position:center top; }
}

/* Tablet & compact navigation -------------------------------- */
@media (max-width:1000px) {
  .wrap { width:calc(100% - 64px); }
  .site-header { height:88px; gap:20px; }
  .brand { width:126px; }
  .header-cta { margin-left:auto; padding-inline:16px; font-size:12px; }
  .menu-toggle { order:3; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px; height:36px; width:34px; padding:8px 4px; border:0; background:transparent; }
  .menu-toggle>span { display:block; width:22px; height:1px; background:var(--text-light); transition:transform .2s; }
  .menu-toggle[aria-expanded='true']>span:first-child { transform:translateY(3.5px) rotate(45deg); }
  .menu-toggle[aria-expanded='true']>span:last-child { transform:translateY(-3.5px) rotate(-45deg); }
  .primary-nav { position:absolute; top:78px; left:0; right:0; z-index:20; display:none; flex-direction:column; align-items:stretch; gap:0; margin:0; padding:12px 24px; border:1px solid #ffffff25; border-radius:var(--radius); background:#1d102df5; backdrop-filter:blur(18px); box-shadow:0 20px 30px #0004; }
  .primary-nav.is-open { display:flex; }
  .primary-nav a { padding:15px 0; border-bottom:1px solid #ffffff12; font-size:14px; }
  .primary-nav a:last-child { border-bottom:0; }
  .hero-shell { min-height:820px; }
  .hero { min-height:732px; padding-top:95px; }
  .hero-copy { width:570px; }
  .hero h1 { font-size:68px; }
  .hero-note { display:none; }
  .hero-shade { background:linear-gradient(90deg,#100c18ed,#100c18d2 29%,#100c1880 58%,#100c1800),linear-gradient(0deg,#100c18c0,transparent 45%); }
  .experience-layout { grid-template-columns:1fr 1.1fr; gap:24px; }
  .section-intro h2 { font-size:42px; }
  .section-intro>p:not(.eyebrow) { font-size:14px; }
  .demo-tab { padding-inline:14px; gap:12px; }
  .product-showcase { transform:scale(.8); margin-left:-35px; margin-right:-40px; }
  .demo-panel { margin-left:35px; }
  .fan { left:18px; }
  .section-heading-row h2 { font-size:40px; }
  .heading-aside { font-size:13px; }
  .solution-item { padding:30px; }
  .solution-item h3 { font-size:20px; }
  .control-layout { gap:16px; }
  .control-copy h2 { font-size:42px; }
  .control-copy>p:not(.eyebrow) { font-size:14px; }
  .card-sculpture { transform:scale(.74); margin-left:-85px; margin-right:-75px; }
  .beyond-top h2 { font-size:44px; }
  .lifestyle-grid article { padding-right:22px; }
  .lifestyle-grid article+article { padding-left:22px; }
  .lifestyle-grid h3 { font-size:16px; }
  .lifestyle-grid p { font-size:13px; }
  .why-grid { grid-template-columns:repeat(2,1fr); gap:22px; }
  .why-grid article { min-height:180px; padding:25px 20px; }
  .why-grid h3 { font-size:16px; }
  .why-grid p { font-size:14px; }
  .support-inner>div { width:495px; }
  .support h2 { font-size:43px; }
  .support p:not(.eyebrow) { max-width:335px; font-size:14px; }
  .faq-layout { gap:40px; }
  .faq h2 { font-size:35px; }
  .faq summary { font-size:14px; }
  .closing h2 { font-size:38px; }
  .footer-main { grid-template-columns:1.1fr .85fr 1.1fr; gap:26px; }
  .footer-manifesto { display:none; }
  .footer-bottom { flex-wrap:wrap; }
}

/* Mobile ----------------------------------------------------- */
@media (max-width:700px) {
  :root { --space-section:72px; }
  html { scroll-padding-top:24px; }
  body { font-size:15px; }
  .wrap { width:calc(100% - 40px); }
  h2 { font-size:38px; }
  .eyebrow,.section-number { font-size:10px; letter-spacing:.095em; }
  .button { min-height:50px; padding:12px 21px; gap:19px; font-size:13px; }
  .button>span { font-size:20px; }
  .text-link { font-size:13px; }
  .brand { width:clamp(92px,29vw,116px); }
  .site-header { height:80px; gap:8px; }
  .header-cta { min-height:44px; padding:9px 10px; gap:8px; font-size:clamp(10px,2.8vw,11px); }
  .header-cta>span { font-size:17px; }
  .primary-nav { top:72px; }
  .hero-shell { min-height:850px; }
  .hero { min-height:770px; padding-top:77px; padding-bottom:95px; }
  .hero-copy { width:100%; }
  .hero .eyebrow { margin-bottom:26px; font-size:10px; gap:8px; letter-spacing:.08em; }
  .hero h1 { font-size:clamp(42px,10.5vw,62px); line-height:1.08; letter-spacing:-.045em; }
  .hero-description { margin-top:25px; font-size:15px; line-height:1.75; }
  .hero-actions { gap:12px; margin-top:28px; }
  .hero-actions .button { min-height:50px; padding-inline:20px; font-size:13px; gap:20px; }
  .hero-caption { max-width:310px; margin-top:29px; font-size:11px; gap:10px; }
  .hero-bottom { bottom:24px; gap:14px; font-size:9px; letter-spacing:.05em; }
  .hero-image { top:auto; bottom:0; height:72%; object-position:78% center; }
  .hero-shade { background:linear-gradient(90deg,#100c18ed 0%,#100c18cc 24%,#100c1890 51%,#100c1824 100%),linear-gradient(0deg,#100c18dc 0%,transparent 45%,#100c1822); }
  .experience { padding:76px 0 72px; }
  .experience-layout { display:flex; flex-direction:column; align-items:stretch; gap:26px; }
  .section-intro .eyebrow { margin-bottom:25px; }
  .section-intro h2 { margin-bottom:24px; font-size:clamp(36px,10.75vw,42px); }
  .section-intro>p:not(.eyebrow) { max-width:365px; font-size:15px; line-height:1.8; }
  .section-intro .short-statement { margin-top:19px; }
  .tab-list { width:100%; max-width:350px; margin-top:27px; gap:4px; padding:5px; }
  .demo-tab { flex:1; min-width:0; justify-content:space-between; min-height:42px; padding:10px clamp(10px,3vw,16px); gap:clamp(6px,2vw,10px); font-size:clamp(12px,3.333vw,13px); }
  .product-showcase { align-self:center; width:100%; max-width:460px; min-height:445px; margin:0; transform:none; }
  .fan { top:91px; left:calc(50% - 155px); width:210px; height:286px; }
  .demo-panel { width:300px; margin-left:30px; }
  .pix-widget,.crypto-widget { padding:22px; }
  .widget-head { font-size:9px; padding-bottom:22px; gap:8px; }
  .widget-icon { height:24px; width:24px; }
  .widget-value { font-size:35px; }
  .widget-value>span { font-size:25px; }
  .widget-row { font-size:11px; }
  .widget-row small { font-size:10px; }
  .avatar { width:32px; height:32px; }
  .widget-actions { margin-top:22px; font-size:11px; }
  .widget-actions>span { padding:10px 11px; }
  .showcase-grid { inset:12px -20px 0; }
  .product-showcase::after { left:15%; bottom:90px; width:250px; height:150px; }
  .showcase-caption { left:0; bottom:0; font-size:8px; letter-spacing:.07em; }
  .demo-disclaimer { left:0; bottom:-22px; font-size:10px; }
  .bank-card { width:300px; height:196px; padding:21px; }
  .card-logo { width:103px; }
  .card-type { font-size:9px; }
  .card-chip { margin-top:14px; }
  .card-digits { margin-top:13px; font-size:11px; }
  .bank-card-bottom { font-size:7px; margin-top:8px; }
  .card-demo-controls { width:calc(100% + 12px); margin-left:-15px; padding:11px 10px; gap:8px; font-size:9px; }
  .card-demo-controls>span { gap:5px; }
  .card-demo-controls button { padding:9px 8px; gap:6px; font-size:9px; }
  .card-demo-controls button>span:last-child { font-size:11px; }
  .currency-mark { height:38px; width:38px; font-size:23px; }
  .currency-line { gap:10px; }
  .currency-line small { font-size:10px; }
  .currency-line strong { font-size:22px; }
  .currency-network { padding:4px 6px; font-size:9px; }
  .crypto-caption { font-size:11px; }
  .solutions { padding-bottom:72px; }
  .section-heading-row { display:block; margin-bottom:32px; }
  .section-heading-row .eyebrow { margin-bottom:25px; }
  .section-heading-row h2 { font-size:35px; }
  .heading-aside { margin-top:22px; font-size:14px; }
  .solutions-grid { grid-template-columns:1fr; gap:14px; }
  .solution-item { padding:30px 27px; }
  .solution-number { right:28px; top:34px; }
  .square-icon { margin-bottom:25px; }
  .solution-item h3 { font-size:21px; }
  .solution-item p { font-size:15px; }
  .solution-item ul { font-size:13px; margin:19px 0 26px; }
  .control { padding-bottom:72px; }
  .control-layout { display:flex; flex-direction:column; align-items:stretch; gap:20px; }
  .control-copy .eyebrow { margin-bottom:25px; }
  .control-copy h2 { font-size:40px; }
  .control-copy>p:not(.eyebrow) { max-width:365px; margin-top:25px; font-size:15px; }
  .control-features { max-width:none; margin-top:29px; }
  .control-feature { gap:16px; padding:23px 0; }
  .control-feature h3 { font-size:15px; }
  .control-feature p { font-size:13px; }
  .card-sculpture { width:480px; height:490px; align-self:center; margin:15px -65px -72px; transform:scale(.76); transform-origin:top center; }
  .sculpture-caption { bottom:-10px; right:19px; font-size:10px; }
  .sculpture-card { width:325px; height:205px; padding:24px; }
  .sculpture-card .card-chip { margin-top:17px; }
  .sculpture-card .card-digits { margin-top:13px; }
  .beyond { padding:76px 0 72px; }
  .beyond-top .eyebrow { margin-bottom:25px; }
  .beyond-top h2 { font-size:35px; }
  .beyond-top>p:last-child { margin-top:23px; font-size:15px; }
  .beyond-top>p:last-child br { display:none; }
  .lifestyle-grid { grid-template-columns:1fr; margin-top:34px; border-bottom:0; }
  .lifestyle-grid article,.lifestyle-grid article+article { display:grid; grid-template-columns:42px 1fr; column-gap:15px; padding:28px 0; border-left:0; border-bottom:1px solid var(--dark-line); }
  .line-icon { grid-row:1 / 3; width:36px; height:36px; margin:3px 0 0; font-size:22px; }
  .lifestyle-grid h3 { margin-bottom:9px; font-size:18px; }
  .lifestyle-grid p { max-width:285px; font-size:14px; }
  .why-heading { margin-top:57px; }
  .why-heading h2 { font-size:30px; }
  .why-grid { gap:20px 16px; margin-top:29px; }
  .why-grid article { min-height:205px; padding:22px 9px 10px 0; }
  .why-grid article>span { margin-bottom:19px; font-size:24px; }
  .why-grid h3 { font-size:14px; line-height:1.4; }
  .why-grid p { font-size:13px; line-height:1.8; }
  .support,.support-inner { min-height:920px; }
  .support-image { inset:auto 0 0; width:100%; height:500px; object-position:78% top; }
  .support-shade { background:linear-gradient(180deg,#100c18 0%,#100c18 39%,#100c18e0 46%,#100c1860 57%,#100c1800 73%,#100c1880 100%),linear-gradient(90deg,#100c1828,transparent 60%); }
  .support-inner { position:relative; display:block; }
  .support-inner>div { width:100%; max-width:370px; padding:66px 0 0; }
  .support .eyebrow { margin-bottom:25px; }
  .support h2 { font-size:36px; line-height:1.1; }
  .support p:not(.eyebrow) { max-width:335px; margin-top:23px; font-size:14px; line-height:1.8; }
  .light-link { margin-top:23px; }
  .support-label { position:absolute; right:0; bottom:24px; margin:0; font-size:10px; }
  .faq { padding:76px 0 72px; }
  .faq-layout { display:flex; flex-direction:column; gap:35px; }
  .faq .eyebrow { margin-bottom:25px; }
  .faq h2 { font-size:35px; }
  .faq-layout>div>p:not(.eyebrow) { margin-top:23px; font-size:15px; }
  .faq summary { padding:24px 0; gap:18px; font-size:14px; }
  .faq details>p { padding-right:18px; font-size:14px; }
  .closing { padding:16px 0 56px; }
  .closing .wrap { width:calc(100% - 24px); }
  .closing-inner { min-height:420px; padding:50px 23px 58px; }
  .closing .eyebrow { margin-bottom:23px; font-size:10px; }
  .closing h2 { font-size:29px; line-height:1.15; }
  .closing p:not(.eyebrow) { margin-top:23px; font-size:14px; }
  .closing .button { margin-top:27px; }
  .closing-monogram { right:-1px; bottom:-40px; font-size:215px; }
  .closing-bottom-label { left:18px; bottom:17px; font-size:8px; }
  .closing-glow { height:180px; bottom:-165px; filter:blur(55px); }
  .site-footer { padding-top:44px; }
  .footer-main { grid-template-columns:1fr 1fr; gap:34px 20px; padding-bottom:36px; }
  .footer-brand { grid-column:1 / -1; }
  .footer-brand .brand { width:125px; }
  .footer-brand p { margin-top:15px; font-size:14px; }
  .footer-links { gap:15px; padding-top:0; }
  .footer-links>span { margin-bottom:4px; }
  .footer-links>a,.footer-links>button { font-size:13px; }
  .footer-bottom { gap:15px; padding:24px 0; font-size:11px; }
  .footer-bottom>span:first-child { width:100%; }
  .footer-bottom p { flex-basis:100%; }
  .footer-bottom>span:last-child { font-size:10px; }
  .join-dialog { padding:34px 26px; }
  .join-dialog h2 { font-size:32px; }
  .join-dialog p:not(.eyebrow) { font-size:14px; }
  .join-dialog input { font-size:16px; }
  .toast { bottom:20px; font-size:12px; }
}

/* Compact card demonstration; the standard 390 px layout stays intact. */
@media (max-width:360px) {
  .product-showcase::after { left:50%; width:220px; transform:translateX(-50%); }
  .demo-panel[data-panel='cards'] { width:245px; margin-left:8px; flex:none; }
  .demo-card { width:245px; height:164px; padding:18px; }
  .demo-card .card-logo { width:88px; }
  .demo-card .card-symbol { top:-31px; right:-10px; width:110px; height:200px; }
  .demo-card .card-chip { width:28px; height:20px; margin-top:10px; }
  .demo-card .card-digits { margin-top:12px; font-size:10px; letter-spacing:.06em; }
  .demo-card .bank-card-bottom { margin-top:7px; font-size:6px; }
  .card-demo-controls { width:100%; margin-left:0; padding:10px 8px; gap:6px; }
  .card-demo-controls>span { flex:1; min-width:0; }
  .card-demo-controls button { flex:none; max-width:100%; padding:8px 7px; }
}

@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  *,*::before,*::after { animation:none!important; transition:none!important; }
  .button:hover { transform:none; }
}
