/* PINPIN / public landing 2026. Only used by Views/Home/Landing.cshtml (Layout = null).
   Reusable CSS/SVG design components, no runtime framework, demo data explicitly labelled. */
:root{color-scheme:dark;--bg:#040a17;--deep:#071023;--elev:#09162e;--elev2:#0c1932;--border:rgba(81,135,208,.22);--border2:rgba(88,155,255,.36);--txt:#ecf4ff;--sub:#afc0d8;--muted:#7d91af;--blue:#2479ff;--lightblue:#5fb8ff;--green:#39d59a;--aqua:#40c6f8;--gold:#f4bd5f;--width:1200px;--gutter:clamp(20px,4.5vw,44px);--font:'Inter',ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:90px;-webkit-text-size-adjust:100%}
body.lp{margin:0;background:var(--bg);color:var(--txt);font:400 15px/1.64 var(--font);-webkit-font-smoothing:antialiased;overflow-x:hidden}
.lp button,.lp a{font:inherit}.lp a{color:inherit;text-decoration:none}.lp button{cursor:pointer}.lp strong{font-weight:650}.lp :focus-visible{outline:2px solid #67c4ff;outline-offset:4px;border-radius:5px}
.lp h1,.lp h2,.lp h3,.lp p,.lp ol,.lp ul{margin:0}.lp h1,.lp h2,.lp h3{letter-spacing:-.042em}.lp h2{font-size:clamp(32px,4vw,49px);line-height:1.13;font-weight:800}.lp h2 em,.lp h1 span{font-style:normal;color:#6cafff}.lp p{color:var(--sub)}.lp ul,.lp ol{padding:0;list-style:none}
.lp .shell{width:min(100%,calc(var(--width) + var(--gutter)*2));padding-inline:var(--gutter);margin-inline:auto}.lp .icon-sprite{position:absolute;width:0;height:0;overflow:hidden;pointer-events:none}
.lp .ic{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round;flex:none}.lp .ic.small-ic{width:18px;height:18px}.lp .ic.tiny{width:15px;height:15px}
.lp .skip{position:fixed;z-index:100;left:16px;top:-60px;background:var(--blue);padding:10px 16px;border-radius:8px}.lp .skip:focus{top:12px}
.lp .button{position:relative;display:inline-flex;gap:10px;align-items:center;justify-content:center;min-height:43px;padding:0 23px;border:1px solid transparent;border-radius:8px;font-weight:650;line-height:1.15;transition:transform .23s ease,box-shadow .23s ease,background .2s ease,border-color .2s ease;white-space:nowrap;isolation:isolate;overflow:hidden}
.lp .button:hover{transform:translateY(-2px)}.lp .button:active{transform:translateY(0)}.lp .button.main{background:linear-gradient(112deg,#1f6fea,#338cfd);border-color:#5ca3ff;color:white;box-shadow:0 10px 30px rgba(15,95,235,.2),inset 0 1px 0 rgba(255,255,255,.22)}.lp .button.main:hover{box-shadow:0 16px 38px rgba(32,107,255,.4)}.lp .button.main::after{content:'';position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.12) 50%,transparent 70%);transform:translateX(-120%);transition:transform .8s}.lp .button.main:hover::after{transform:translateX(120%)}
.lp .button.outline{border-color:rgba(98,155,231,.3);background:rgba(5,14,32,.68);color:#e5efff}.lp .button.outline:hover{background:rgba(42,93,176,.13);border-color:rgba(94,162,255,.7)}.lp .button.small{min-height:37px;padding:0 17px;font-size:13px}.lp .button.large{min-height:51px;padding:0 25px;font-size:14px}.lp .button.full{width:100%}
/* Navigation */
.lp .site-nav{position:sticky;z-index:60;top:0;border-bottom:1px solid rgba(81,137,229,.12);background:rgba(5,12,28,.84);backdrop-filter:blur(20px) saturate(130%);-webkit-backdrop-filter:blur(20px) saturate(130%)}.lp .site-nav.is-scrolled{border-bottom-color:rgba(91,157,255,.32);box-shadow:0 12px 35px rgba(0,0,0,.2)}.lp .nav-inner{height:72px;display:flex;align-items:center;gap:34px}.lp .brand{display:inline-flex;align-items:center;gap:12px;font-weight:800;font-size:19px;letter-spacing:-.02em;white-space:nowrap}.lp .brand-mark{display:inline-flex;align-items:flex-end;gap:5px;height:24px;width:24px}.lp .brand-mark span{position:relative;width:4px;height:18px;background:linear-gradient(#6eb9ff,#1c6bff);border-radius:5px;box-shadow:0 0 10px rgba(53,144,255,.5)}.lp .brand-mark span::before{content:'';position:absolute;top:-4px;left:-2px;width:8px;height:8px;border-radius:50%;background:#67b8ff;box-shadow:0 0 12px #2988ff}.lp .brand-mark span:nth-child(2){height:13px}.lp .brand-mark span:nth-child(3){height:22px}
.lp .nav-links{display:flex;align-items:center;gap:27px;margin-left:22px}.lp .nav-links a{color:#97abc8;font-size:13px;font-weight:500;transition:color .2s}.lp .nav-links a:hover{color:white}.lp .nav-actions{display:flex;align-items:center;gap:10px;margin-left:auto}.lp .nav-toggle{display:none;align-items:center;justify-content:center;width:41px;height:41px;border:1px solid var(--border2);border-radius:10px;color:#c4d9fa;background:#0b1830}
/* Hero */
.lp .hero{position:relative;min-height:730px;padding:clamp(95px,11vw,155px) 0 115px;isolation:isolate;background:radial-gradient(ellipse 68% 65% at 79% 29%,rgba(4,54,129,.49),transparent 70%),radial-gradient(ellipse 55% 50% at 51% 92%,rgba(0,75,160,.22),transparent 68%),#050c1c;overflow:hidden}.lp .hero::before{content:'';position:absolute;z-index:-1;inset:0;background-image:radial-gradient(rgba(113,179,255,.72) .6px,transparent .9px);background-size:70px 82px;mask-image:linear-gradient(90deg,transparent 15%,#000 95%);opacity:.17}
.lp .hero-mesh{position:absolute;inset:0;pointer-events:none;z-index:-1;background:repeating-linear-gradient(90deg,transparent 0,transparent 70px,rgba(37,96,193,.035) 71px),repeating-linear-gradient(0deg,transparent 0,transparent 70px,rgba(37,96,193,.025) 71px);mask-image:linear-gradient(#000,transparent 92%)}
.lp .hero-aurora{position:absolute;inset:-25% -20% auto auto;width:950px;height:640px;background:radial-gradient(ellipse at center,rgba(3,93,239,.15),transparent 70%);filter:blur(25px);animation:aurora 9s ease-in-out infinite alternate;pointer-events:none}
.lp .hero-mountains{position:absolute;z-index:-1;bottom:-2px;left:0;right:0;height:140px;background:linear-gradient(to top,rgba(2,9,20,.9),transparent),url('/img/pinpin-hero-mountains.svg') center bottom/cover no-repeat;opacity:.92;pointer-events:none}
.lp .hero-bottom-light{position:absolute;bottom:0;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,#247dff 45%,#3ea8ff 72%,transparent);box-shadow:0 0 28px #006dff,0 0 70px #006dff;opacity:.6;pointer-events:none}
.lp .hero-grid{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:clamp(40px,5.2vw,75px);align-items:center}.lp .hero-content{position:relative;z-index:2}.lp .eyebrow,.lp .section-label{display:inline-flex;align-items:center;gap:11px;font-size:11px;font-weight:800;letter-spacing:.145em;color:#55a9ff;text-transform:uppercase}.lp .eyebrow-line{width:25px;height:2px;background:#58b6ff;box-shadow:0 0 12px #267dff}
.lp .hero h1{font-size:clamp(43px,4.8vw,66px);font-weight:800;line-height:1.055;margin-top:25px;max-width:710px;letter-spacing:-.061em;text-wrap:balance}.lp .hero h1 span{background:linear-gradient(110deg,#7bc5ff,#3589ff 80%);background-clip:text;-webkit-background-clip:text;color:transparent}.lp .hero-lead{max-width:570px;font-size:16px;line-height:1.8;margin-top:24px;color:#aebfd8}.lp .hero-lead strong{color:#daeaff}.lp .hero-buttons{display:flex;gap:13px;flex-wrap:wrap;align-items:center;margin-top:30px}.lp .hero-buttons.center{justify-content:center}.lp .signed-message{margin-top:16px;font-size:13px}.lp .signed-message a{color:#70b8ff;text-decoration:underline}.lp .hero-chips{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px 18px;max-width:520px;margin-top:40px}.lp .hero-chips span{display:inline-flex;align-items:center;gap:9px;font-size:12px;color:#bfceea;white-space:nowrap}.lp .hero-chips i,.lp .blue-dot{width:7px;height:7px;display:inline-block;flex:none;border-radius:50%;background:#36dbab;box-shadow:0 0 0 3px rgba(54,219,171,.10),0 0 14px rgba(54,219,171,.55)}
/* Illustrative hero dashboard */
.lp .hero-visual{position:relative;padding:54px 40px 35px 4px;min-width:0;isolation:isolate}.lp .hero-visual::before{content:'';position:absolute;inset:12% 8% 12% 8%;background:radial-gradient(ellipse at center,rgba(17,105,253,.18),transparent 70%);filter:blur(25px);z-index:-1}.lp .dashboard-demo{position:relative;z-index:2;max-width:560px;margin:0 auto;border:1px solid rgba(69,130,234,.48);border-radius:17px;background:linear-gradient(160deg,rgba(13,35,71,.97),rgba(5,14,33,.96) 82%);box-shadow:0 35px 85px rgba(0,0,0,.53),0 0 42px rgba(24,94,234,.11),inset 0 1px 0 rgba(255,255,255,.08);overflow:hidden;transform:perspective(1000px) rotateY(-3deg) rotateX(1deg)}.lp .demo-top{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:19px 22px 15px;border-bottom:1px solid rgba(98,160,244,.15)}.lp .demo-logo{font-size:11px;font-weight:800;letter-spacing:.04em;color:#bcd3f8;display:flex;gap:5px;align-items:center}.lp .demo-logo b{font-weight:500;color:#7798c5;margin-left:3px}.lp .demo-mini-mark{color:#62afff;font-size:16px}.lp .demo-status{font-size:10px;color:#a9bfdd;background:rgba(51,116,221,.1);border:1px solid rgba(74,140,245,.2);border-radius:999px;padding:4px 8px}.lp .demo-status i{display:inline-block;width:5px;height:5px;border-radius:50%;background:#64a4ff;margin-right:6px}.lp .demo-overview{padding:19px 23px 0;display:flex;flex-direction:column;gap:2px}.lp .demo-overview span{color:#91a9d0;font-size:11px}.lp .demo-overview strong{color:#edf5ff;font-size:21px;letter-spacing:-.03em}.lp .demo-overview small{color:#6d91c7;font-size:10px}
.lp .demo-chart{position:relative;height:145px;margin:5px 18px 0;overflow:hidden}.lp .demo-chart svg{position:absolute;z-index:1;inset:0;width:100%;height:100%;filter:drop-shadow(0 0 5px rgba(28,134,255,.6))}.lp .chart-grid{position:absolute;inset:0;background:repeating-linear-gradient(to bottom,transparent 0,transparent 30px,rgba(110,154,217,.08) 31px),repeating-linear-gradient(to right,transparent 0,transparent 49px,rgba(110,154,217,.055) 50px)}.lp .chart-beam{position:absolute;top:10%;bottom:4%;width:1px;left:38%;background:linear-gradient(transparent,rgba(79,168,255,.6),transparent);box-shadow:0 0 10px #268aff;animation:sweep 9s linear infinite}.lp .demo-separator{display:flex;justify-content:space-between;gap:10px;color:#7b96be;padding:8px 22px 10px;font-size:10px;letter-spacing:.02em}.lp .demo-separator span:last-child{display:flex;gap:6px;align-items:center}.lp .demo-separator .blue-dot{background:#3b9bff;box-shadow:0 0 11px #307cfa;width:5px;height:5px}.lp .demo-row{display:flex;align-items:center;gap:11px;margin:0 13px 7px;padding:11px 11px;border:1px solid rgba(74,125,191,.16);background:rgba(25,48,86,.42);border-radius:8px}.lp .symbol-dot{display:grid;place-items:center;flex:none;width:29px;height:29px;border-radius:9px;font-size:10px;font-weight:700;color:#fff;background:#1566dd}.lp .symbol-dot.purple{background:#574bd3}.lp .symbol-dot.green{background:#0d976f}.lp .demo-row>span:nth-child(2){display:grid;gap:0;min-width:0;flex:1}.lp .demo-row b{font-size:12px;font-weight:700}.lp .demo-row small{font-size:10px;color:#8298b8}.lp .demo-tiny-bars{display:flex;align-items:end;height:20px;gap:3px}.lp .demo-tiny-bars i{display:block;width:3px;height:55%;background:#2689ff;border-radius:2px}.lp .demo-tiny-bars i:nth-child(2){height:80%}.lp .demo-tiny-bars i:nth-child(3){height:38%}.lp .demo-tiny-bars i:nth-child(4){height:95%}.lp .demo-tiny-bars i:nth-child(5){height:63%}.lp .demo-pill{font-size:10px;color:#79b7ff;background:rgba(43,125,252,.13);border:1px solid rgba(60,140,255,.35);padding:4px 8px;border-radius:6px}.lp .demo-pill.good{color:#5ff5b7;border-color:rgba(51,202,143,.28);background:rgba(43,156,107,.1)}.lp .demo-bottom{padding:9px 20px 12px;color:#738fba;font-size:10px;display:flex;gap:6px;align-items:center}.lp .demo-bottom span{display:flex;align-items:center;gap:6px}
.lp .float-note{position:absolute;z-index:4;display:flex;align-items:center;gap:12px;width:max-content;max-width:210px;padding:12px 15px;border:1px solid rgba(68,145,255,.36);border-radius:12px;background:linear-gradient(145deg,rgba(17,46,95,.95),rgba(8,23,53,.97));box-shadow:0 20px 50px rgba(0,0,0,.48),0 0 24px rgba(0,97,250,.12);animation:float 5s ease-in-out infinite}.lp .float-note .note-icon{width:35px;height:35px;display:grid;place-items:center;color:#81bbff;background:rgba(58,132,255,.14);border-radius:10px}.lp .float-note .note-icon.cyan{color:#3dc9fa;background:rgba(44,185,240,.12)}.lp .float-note .note-icon.green{color:#56e3bd;background:rgba(29,177,135,.13)}.lp .float-note .note-icon .ic{width:21px;height:21px}.lp .float-note>span:last-child{display:grid;gap:0}.lp .float-note b{font-size:11px}.lp .float-note small{font-size:10px;color:#83a6d9}.lp .note-top{right:-10px;top:5px;animation-delay:-1s}.lp .note-right{right:-28px;top:39%;animation-delay:-2.5s}.lp .note-bottom{right:4px;bottom:40px;animation-delay:-3.6s}.lp .orb{position:absolute;z-index:1;border:1px solid rgba(55,120,244,.18);border-radius:50%;pointer-events:none}.lp .orb-one{width:490px;height:490px;left:0;top:7%;transform:rotate(-12deg)}.lp .orb-two{width:320px;height:320px;left:15%;top:18%;border-style:dashed;animation:spin 45s linear infinite}.lp .mock-disclaimer{position:relative;z-index:2;max-width:490px;margin:12px auto 0;font-size:10px;text-align:center;color:#738bb0}
/* Sections */
.lp .section{position:relative;padding:100px 0;background:#061024;border-top:1px solid rgba(52,108,189,.15);overflow:hidden}.lp .section-why{background:radial-gradient(ellipse 70% 55% at 90% 0,rgba(10,64,135,.22),transparent 78%),#050d1f}.lp .section-steps{background:radial-gradient(ellipse 80% 100% at 25% 45%,rgba(5,38,88,.29),transparent 75%),#071228}.lp .section-strategy{background:#050d1d}.lp .section-features{background:linear-gradient(180deg,#071329,#061026)}.lp .section-pricing{background:#050c1c}.lp .section-security{background:radial-gradient(ellipse at 80% 50%,rgba(4,72,158,.21),transparent 54%),#071329}.lp .section-intro{max-width:725px;margin-bottom:42px}.lp .section-intro h2{margin-top:14px}.lp .section-intro p{margin-top:16px;font-size:16px;max-width:610px}.lp .section-intro em{font-style:normal;color:#7ab8ff}
.lp .value-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.lp .value-card,.lp .status-card{position:relative;border:1px solid rgba(70,126,202,.22);background:linear-gradient(145deg,rgba(15,31,61,.83),rgba(7,20,43,.7));border-radius:13px;min-width:0;transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease}.lp .value-card:hover,.lp .status-card:hover{transform:translateY(-5px);border-color:rgba(68,150,255,.59);box-shadow:0 18px 50px rgba(0,0,0,.23),0 0 35px rgba(26,102,224,.08)}.lp .value-card{padding:27px 25px 29px;min-height:196px}.lp .feature-icon{display:grid;place-items:center;width:48px;height:48px;border-radius:12px;background:linear-gradient(145deg,rgba(39,129,255,.21),rgba(20,54,109,.35));color:#56bdff;box-shadow:inset 0 0 0 1px rgba(91,156,255,.15),0 9px 22px rgba(13,86,190,.1)}.lp .feature-icon .ic{width:27px;height:27px}.lp .value-card h3{margin-top:21px;font-size:16px;font-weight:700;letter-spacing:-.02em}.lp .value-card p{margin-top:8px;color:#91a7c8;font-size:13px;line-height:1.7}
/* Flow steps */
.lp .step-list{position:relative;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:34px;margin-top:50px}.lp .step-list::before{content:'';position:absolute;top:39px;left:38px;right:38px;height:1px;background:linear-gradient(90deg,transparent,#2e83e8 15%,#2f89eb 85%,transparent);opacity:.65}.lp .step-item{position:relative;text-align:center;padding:0 3px}.lp .step-icon{position:relative;z-index:2;display:grid;place-items:center;width:78px;height:78px;margin:0 auto 15px;border:1px solid #2374d8;background:radial-gradient(circle at 35% 22%,rgba(25,97,191,.28),rgba(2,13,31,.9));box-shadow:0 0 22px rgba(21,110,250,.18),inset 0 0 18px rgba(22,116,246,.13);border-radius:50%;color:#5babff}.lp .step-icon .ic{width:32px;height:32px}.lp .step-item small{color:#408eff;font-weight:700;letter-spacing:.1em}.lp .step-item h3{font-size:16px;margin-top:7px;font-weight:750;letter-spacing:-.02em}.lp .step-item p{margin:11px auto 0;max-width:215px;font-size:13px;color:#9cacc9;line-height:1.7}
/* Strategy */
.lp .strategy-grid{display:grid;grid-template-columns:minmax(0,.91fr) minmax(0,1.09fr);align-items:center;gap:clamp(35px,7vw,90px)}.lp .strategy-copy h2{margin-top:14px}.lp .strategy-copy>p:not(.strategy-small-note){margin-top:18px;max-width:530px;font-size:16px}.lp .category-menu{display:grid;gap:7px;max-width:410px;margin-top:28px}.lp .category-menu>div{display:flex;gap:11px;align-items:center;padding:9px 14px;border:1px solid rgba(60,108,185,.21);border-radius:8px;background:rgba(11,26,52,.52);color:#b5c8e6;font-size:13px}.lp .category-menu>div:first-child{border-color:rgba(55,133,255,.75);background:rgba(37,95,196,.24);color:#f1f7ff}.lp .category-menu .ic{width:19px;height:19px;color:#61a8ff}.lp .category-menu b{margin-left:auto;color:#64b6ff;font-size:20px;line-height:1}.lp .strategy-small-note{display:flex;gap:8px;align-items:start;color:#78dbbc;margin-top:24px;font-size:12px}
.lp .strategy-panel{border:1px solid rgba(84,146,238,.35);border-radius:15px;background:linear-gradient(145deg,rgba(15,34,70,.92),rgba(5,16,36,.95));box-shadow:0 32px 90px rgba(0,0,0,.39),0 0 33px rgba(30,108,240,.08);padding:12px;min-width:0}.lp .strategy-head{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:13px 12px 21px}.lp .strategy-head>div{display:grid;gap:4px}.lp .strategy-head b{font-size:15px}.lp .strategy-head span{font-size:11px;color:#8198ba}.lp .preview-tag{border:1px solid rgba(72,137,225,.3);background:rgba(39,104,216,.13);border-radius:6px;padding:5px 9px;white-space:nowrap}.lp .filter-row{display:flex;align-items:center;gap:12px;min-height:77px;padding:11px 12px;margin-bottom:7px;border-radius:9px;border:1px solid rgba(74,130,214,.17);background:rgba(15,33,67,.75)}.lp .filter-title{min-width:0;display:grid;gap:4px;flex:1}.lp .filter-title b{font-size:12px;line-height:1.4;letter-spacing:0}.lp .filter-title small{font-size:11px;color:#8fa6c9;line-height:1.35}.lp .fake-switch{flex:none;width:37px;height:22px;background:#203553;border-radius:20px;position:relative;box-shadow:inset 0 0 0 1px rgba(130,164,210,.13)}.lp .fake-switch::before{content:'';position:absolute;top:3px;left:3px;width:16px;height:16px;border-radius:50%;background:#a1b4ce}.lp .fake-switch.on{background:#2677e6}.lp .fake-switch.on::before{transform:translateX(15px);background:white}.lp .fake-input{min-width:70px;text-align:center;border:1px solid rgba(59,123,227,.25);background:#071b3c;padding:8px 5px;border-radius:6px;color:#c2dfff;font-size:11px}.lp .filter-row.muted{opacity:.55}.lp .strategy-panel-foot{display:flex;justify-content:space-between;gap:10px;align-items:center;padding:17px 11px 8px;flex-wrap:wrap;font-size:11px;color:#a9c2e5}.lp .strategy-panel-foot span{display:flex;gap:6px;align-items:center}.lp .strategy-panel-foot a{display:inline-flex;align-items:center;gap:5px;color:#6fb6ff;font-weight:650}.lp .strategy-panel-foot a:hover{text-decoration:underline}
/* User product capabilities (no admin marketing) */
.lp .status-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.lp .status-card{min-height:230px;padding:22px 20px 20px}.lp .status-card .feature-icon{width:45px;height:45px}.lp .status-card .feature-icon .ic{width:25px;height:25px}.lp .brand-binance{color:#f3c45c;font-size:34px}.lp .status-tag{position:absolute;top:22px;right:17px;display:inline-flex;gap:6px;align-items:center;color:#68e5ab;font-size:10px;background:rgba(33,174,109,.1);border:1px solid rgba(68,215,155,.22);padding:4px 8px;border-radius:99px}.lp .status-tag::before{content:'';width:5px;height:5px;border-radius:50%;background:currentColor}.lp .status-tag.conditional{color:#d8c277;background:rgba(176,133,52,.09);border-color:rgba(226,172,60,.23)}.lp .status-tag.planned{color:#93acda;background:rgba(30,74,134,.09);border-color:rgba(100,137,205,.22)}.lp .status-card h3{font-size:15px;letter-spacing:-.015em;margin-top:22px}.lp .status-card p{margin-top:8px;font-size:12px;line-height:1.7;color:#91a8cc}.lp .status-card.road{grid-column:span 2;min-height:156px;border-style:dashed;display:grid;grid-template-columns:46px 1fr;column-gap:15px;align-content:center}.lp .status-card.road h3{margin:0;align-self:end}.lp .status-card.road p{grid-column:2;margin-top:4px}.lp .status-card.road .feature-icon{grid-row:span 2}.lp .status-card.road .status-tag{right:19px;top:12px}
/* Pricing */
.lp .pricing-intro{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:47px}.lp .pricing-intro h2{margin-top:14px}.lp .pricing-intro p{margin-top:13px;font-size:15px}.lp .price-period{display:inline-flex;gap:8px;align-items:center;color:#a7c3eb;font-size:12px;border:1px solid rgba(73,130,228,.3);border-radius:9px;padding:10px 13px;background:rgba(25,56,108,.22);white-space:nowrap}.lp .pricing-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px;align-items:stretch}.lp .price-card{position:relative;padding:28px 21px 20px;background:linear-gradient(170deg,rgba(12,30,59,.9),rgba(5,15,33,.95));border:1px solid rgba(74,130,203,.27);border-radius:13px;display:flex;flex-direction:column;min-width:0;transition:transform .25s,border-color .25s}.lp .price-card:hover{transform:translateY(-6px);border-color:rgba(70,147,255,.7)}.lp .price-card.is-featured{border-color:rgba(55,149,255,.97);box-shadow:0 0 0 1px rgba(57,134,255,.33),0 0 40px rgba(27,115,250,.2);background:linear-gradient(170deg,rgba(15,49,101,.94),rgba(6,18,39,.95))}.lp .price-card h3{font-size:17px;letter-spacing:0}.lp .popular{position:absolute;top:-13px;left:50%;transform:translateX(-50%);border-radius:99px;padding:5px 12px;font-size:10px;font-weight:750;background:#327eff;color:#fff;white-space:nowrap;box-shadow:0 5px 19px rgba(34,108,255,.35)}.lp .plan-price{display:flex;align-items:baseline;gap:6px;margin-top:17px}.lp .plan-price strong{font-weight:800;font-size:44px;line-height:1;letter-spacing:-.055em;color:#fff}.lp .plan-price span{color:#b9cdf0;font-size:13px}.lp .plan-duration{font-size:12px;margin-top:9px;color:#94a8c9}.lp .plan-highlight{display:flex;align-items:start;gap:6px;margin-top:23px;padding:14px 0;border-block:1px solid rgba(81,130,202,.2);min-height:71px;font-size:12px;line-height:1.55;color:#d0def7}.lp .plan-highlight .ic{color:#53d9ad}.lp .plan-list{display:grid;gap:12px;margin-top:19px;margin-bottom:27px;flex:1}.lp .plan-list li{position:relative;padding-left:19px;color:#aebfde;font-size:11px;line-height:1.4}.lp .plan-list li::before{content:'✓';position:absolute;left:0;top:0;color:#39d9a2;font-weight:800}.lp .price-card .button{font-size:12px}.lp .payment-note{display:flex;align-items:start;gap:9px;margin-top:21px;color:#8b9fbe;font-size:12px}.lp .payment-note .ic{color:#6eacff}
/* Security + ethical disclosures */
.lp .security-grid{display:grid;grid-template-columns:minmax(0,1.16fr) minmax(0,.84fr);gap:60px;align-items:center}.lp .security-copy h2{margin-top:17px}.lp .security-copy>p{font-size:16px;margin-top:18px;max-width:620px}.lp .security-points{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:30px 20px;margin-top:39px}.lp .security-points>div{display:flex;align-items:flex-start;gap:12px;min-width:0}.lp .security-points>div>span{width:38px;height:38px;flex:none;display:grid;place-items:center;color:#5fabff;background:rgba(32,108,209,.16);border-radius:11px}.lp .security-points>div>span .ic{width:21px;height:21px}.lp .security-points h3{font-size:13px;font-weight:700;letter-spacing:-.01em}.lp .security-points p{color:#94a9c8;font-size:12px;line-height:1.6;margin-top:6px}
.lp .shield-art{position:relative;height:380px;display:flex;align-items:center;justify-content:center;isolation:isolate}.lp .shield-halo{position:absolute;z-index:-1;width:360px;height:360px;border-radius:50%;background:radial-gradient(circle,rgba(30,134,255,.36) 0,rgba(7,79,170,.15) 44%,transparent 72%);filter:blur(25px)}.lp .security-shield{width:250px;position:relative;z-index:2;filter:drop-shadow(0 15px 20px rgba(0,0,0,.7)) drop-shadow(0 0 25px rgba(25,116,254,.58));animation:shieldFloat 7s ease-in-out infinite}.lp .security-shield svg{width:100%;height:auto}.lp .shield-ring{position:absolute;border:1px solid rgba(63,142,255,.35);border-radius:50%;transform:rotateX(70deg);width:330px;height:330px;z-index:1;box-shadow:0 0 15px rgba(47,116,235,.23)}.lp .shield-ring.one{margin-top:90px;animation:ring 7s linear infinite}.lp .shield-ring.two{width:415px;height:415px;border-color:rgba(38,97,196,.22);margin-top:80px;animation:ring 9s linear infinite reverse}.lp .shield-base{position:absolute;bottom:18px;width:300px;height:34px;border-radius:50%;background:#187efa;opacity:.17;filter:blur(23px)}.lp .shield-caption{position:absolute;bottom:6px;display:flex;align-items:center;gap:7px;color:#8fbbf6;font-size:11px}.lp .risk-note{margin-top:44px;display:grid;grid-template-columns:auto 1fr;gap:13px 20px;border:1px solid rgba(229,168,82,.22);border-radius:11px;padding:17px 21px;background:rgba(132,88,22,.065)}.lp .risk-note strong{color:#f3c97b;font-size:12px;white-space:nowrap}.lp .risk-note span{color:#b5b7c1;font-size:12px;line-height:1.65}
/* Closing */
.lp .last-cta{position:relative;overflow:hidden;isolation:isolate;padding:96px 0 111px;text-align:center;background:radial-gradient(ellipse 65% 115% at 50% 100%,rgba(7,65,156,.49),transparent 75%),#050d1f;border-top:1px solid rgba(69,123,215,.2)}.lp .last-beams{position:absolute;z-index:-1;inset:0;background:radial-gradient(circle at 2% 100%,rgba(32,129,255,.23),transparent 28%),radial-gradient(circle at 100% 100%,rgba(32,129,255,.23),transparent 27%);pointer-events:none}.lp .last-beams::after{content:'';position:absolute;inset:0;background:repeating-radial-gradient(ellipse at 50% 160%,transparent 0,transparent 36px,rgba(56,137,252,.12) 37px,transparent 38px);opacity:.7}.lp .last-content{max-width:850px}.lp .last-content h2{margin-top:16px;font-size:clamp(35px,4.8vw,55px)}.lp .last-content p{margin:18px auto 0;max-width:520px;font-size:15px}
/* Footer */
.lp .site-footer{background:#040a17;border-top:1px solid rgba(60,116,202,.17);padding:42px 0 24px}.lp .footer-main{display:flex;justify-content:space-between;gap:40px;align-items:start}.lp .footer-brand p{margin-top:13px;max-width:300px;font-size:12px}.lp .footer-main nav{display:flex;gap:15px 24px;flex-wrap:wrap}.lp .footer-main nav a{color:#8097b9;font-size:12px}.lp .footer-main nav a:hover{color:white}.lp .footer-bottom{display:flex;justify-content:space-between;gap:20px;margin-top:35px;padding-top:19px;border-top:1px solid rgba(80,119,183,.16);color:#7387a5;font-size:11px}
/* One-time section reveal; content is visible if JS unavailable. */
.js .reveal{opacity:0;transform:translateY(24px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.75,.2,1)}.js .reveal.is-visible{opacity:1;transform:none}.js .value-card:nth-child(2),.js .status-card:nth-child(2){transition-delay:70ms}.js .value-card:nth-child(3),.js .status-card:nth-child(3){transition-delay:140ms}.js .value-card:nth-child(4),.js .status-card:nth-child(4){transition-delay:90ms}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-11px)}}@keyframes aurora{0%{transform:translate(0,0)}100%{transform:translate(-50px,30px)}}@keyframes sweep{0%{left:12%;opacity:0}15%{opacity:1}85%{opacity:1}100%{left:95%;opacity:0}}@keyframes spin{from{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes shieldFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-14px)}}@keyframes ring{from{transform:rotateX(70deg) rotateZ(0)}to{transform:rotateX(70deg) rotateZ(360deg)}}
@media(max-width:1120px){.lp .nav-links{gap:15px;margin-left:0}.lp .hero-grid{gap:30px}.lp .float-note{display:none}.lp .hero-visual{padding:18px 0}.lp .dashboard-demo{transform:none}.lp .status-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.lp .status-card.road{grid-column:auto;display:block;min-height:230px}.lp .status-card.road .feature-icon{margin-bottom:20px}.lp .status-card.road h3{margin-top:20px}.lp .status-card.road p{margin-top:8px}}
@media(max-width:900px){.lp .nav-inner{gap:12px}.lp .nav-links{display:none;position:absolute;top:100%;left:0;right:0;background:rgba(5,14,32,.98);border-bottom:1px solid var(--border2);padding:15px var(--gutter) 24px;flex-direction:column;align-items:stretch;gap:0;box-shadow:0 20px 38px rgba(0,0,0,.4)}.lp .nav-links.open{display:flex}.lp .nav-links a{padding:12px 8px;font-size:14px}.lp .nav-toggle{display:grid}.lp .nav-actions{margin-left:auto}.lp .hero{padding:77px 0 90px}.lp .hero-grid{grid-template-columns:1fr}.lp .hero-content{max-width:720px;margin-inline:auto;text-align:center}.lp .hero h1{margin-inline:auto}.lp .hero-lead{margin-inline:auto}.lp .hero-buttons{justify-content:center}.lp .hero-chips{margin-inline:auto}.lp .hero-visual{width:min(100%,650px);margin-inline:auto}.lp .value-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.lp .strategy-grid,.lp .security-grid{grid-template-columns:1fr}.lp .strategy-copy,.lp .security-copy{max-width:740px}.lp .category-menu{max-width:none}.lp .shield-art{height:330px}.lp .step-list{gap:20px}.lp .pricing-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}}
@media(max-width:640px){.lp .nav-inner{height:63px}.lp .nav-actions{gap:6px}.lp .nav-actions .button.small{padding:0 10px;min-height:36px;font-size:12px}.lp .brand{font-size:17px;gap:8px}.lp .hero{padding:66px 0 75px;min-height:0}.lp .hero h1{font-size:clamp(39px,8.6vw,56px);line-height:1.08}.lp .eyebrow{font-size:9px}.lp .hero-lead{font-size:14px}.lp .hero-chips{grid-template-columns:repeat(2,minmax(0,1fr));gap:11px;margin-top:32px}.lp .hero-chips span{font-size:10px;white-space:normal}.lp .hero-buttons .button{flex:1;min-width:150px}.lp .hero-visual{padding:15px 0 0}.lp .dashboard-demo{margin:0 -5px}.lp .demo-row{gap:8px}.lp .demo-tiny-bars{display:none}.lp .demo-overview strong{font-size:18px}.lp .mock-disclaimer{font-size:9px}.lp .section{padding:72px 0}.lp .section-intro p,.lp .strategy-copy>p:not(.strategy-small-note),.lp .security-copy>p{font-size:14px}.lp .value-grid{grid-template-columns:1fr;gap:12px}.lp .value-card{min-height:0;padding:21px}.lp .value-card h3{margin-top:13px}.lp .step-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:30px 20px}.lp .step-list::before{display:none}.lp .step-icon{width:65px;height:65px}.lp .step-item h3{font-size:14px}.lp .step-item p{font-size:11px}.lp .status-grid{gap:10px}.lp .status-card,.lp .status-card.road{padding:15px;min-height:220px}.lp .status-card h3,.lp .status-card.road h3{font-size:13px;margin-top:18px}.lp .status-card p,.lp .status-card.road p{font-size:11px}.lp .status-card .feature-icon{width:38px;height:38px}.lp .status-tag{top:14px;right:10px;font-size:9px}.lp .pricing-intro{align-items:start;flex-direction:column}.lp .pricing-grid{grid-template-columns:1fr;gap:18px}.lp .price-card{padding:28px 24px 22px}.lp .plan-highlight{min-height:auto}.lp .security-points{grid-template-columns:1fr;gap:23px}.lp .security-grid{gap:20px}.lp .risk-note{grid-template-columns:1fr;gap:6px}.lp .last-cta{padding:78px 0}.lp .footer-main,.lp .footer-bottom{flex-direction:column;gap:18px}.lp .footer-main nav{gap:9px 20px}}
@media(max-width:380px){.lp .brand{font-size:15px}.lp .brand-mark{transform:scale(.86)}.lp .nav-actions .button.small{padding:0 8px;font-size:11px}.lp .nav-toggle{width:36px;height:36px}.lp .hero h1{font-size:34px}.lp .hero-buttons .button{width:100%}.lp .filter-row{gap:6px;padding:9px 7px}.lp .fake-input{min-width:52px;font-size:10px}.lp .step-list{gap:26px 12px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.lp *,.lp *::before,.lp *::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.js .reveal{opacity:1;transform:none}}

/* ================================================================
 PINPIN REFERENCE EDITION V3 · Premium visual art direction
 Reference user's concept artwork is used ONLY for illustrative
 art layers. All navigation, pricing, sections and CTAs remain HTML.
 ================================================================ */
:root{--bg:#020a19;--deep:#04142d;--elev:#081931;--elev2:#071e3b;--border:rgba(61,133,243,.28);--border2:rgba(84,158,255,.49);--txt:#f4f8ff;--sub:#b6c7e1;--muted:#85a2ca;--blue:#147bff;--lightblue:#67b9ff;--width:1220px;--gutter:clamp(20px,4.5vw,46px)}
body.lp{background:#020918;font-size:15px;letter-spacing:-.012em}
.lp h1,.lp h2,.lp h3{letter-spacing:-.05em}
.lp h2{font-size:clamp(36px,3.9vw,57px);font-weight:800;line-height:1.13}
.lp h2 em{color:#66b7ff}
.lp .section-label,.lp .eyebrow{color:#379dff;letter-spacing:.165em;font-weight:850;font-size:11px}
.lp .shell{max-width:1300px}
.lp .section{padding-block:110px 108px;border-top:1px solid rgba(34,100,188,.25)}
.lp .section-intro{position:relative;z-index:2;margin-bottom:46px}
.lp .section-intro p{color:#a9bfdf;max-width:620px}
.lp .button{border-radius:7px}
.lp .button.main{background:linear-gradient(115deg,#116efa,#3d9bff);box-shadow:0 9px 32px rgba(7,92,246,.25),inset 0 1px rgba(255,255,255,.28)}
.lp .button.outline{border-color:rgba(70,141,241,.40);background:rgba(2,11,28,.66)}
.lp .site-nav{background:rgba(3,13,30,.88);border-bottom-color:rgba(56,118,198,.28)}
.lp .nav-inner{height:73px}
.lp .nav-links a{color:#a7b8d4}
.lp .brand{letter-spacing:-.028em}
/* Hero lighting, foreground layout and cinematic edge */
.lp .hero{padding-top:112px;padding-bottom:93px;min-height:690px;background:
 radial-gradient(ellipse 62% 81% at 80% 38%,rgba(13,82,179,.25),transparent 75%),
 radial-gradient(ellipse 50% 56% at 48% 110%,rgba(8,83,177,.17),transparent 75%),
 linear-gradient(160deg,#020b1f 5%,#031127 65%,#031127 100%)}
.lp .hero:after{content:"";position:absolute;z-index:-1;inset:-48% -3% auto 39%;height:440px;transform:rotate(-31deg);opacity:.43;background:linear-gradient(90deg,transparent 30%,rgba(31,100,244,.12) 40%,rgba(50,154,255,.47) 49%,rgba(26,115,255,.12) 52%,transparent 63%);filter:blur(22px);pointer-events:none}
.lp .hero .hero-grid{grid-template-columns:minmax(0,.97fr) minmax(0,1.03fr);gap:22px;align-items:center}
.lp .hero-content{padding-block:15px 52px}
.lp .hero h1{font-size:clamp(44px,4.5vw,67px);line-height:1.075;letter-spacing:-.061em;margin-top:21px;text-wrap:initial}
.lp .hero h1 span{background:linear-gradient(100deg,#92d6ff 2%,#388cff 94%);background-clip:text;-webkit-background-clip:text;color:transparent}
.lp .hero-lead{font-size:15.5px;line-height:1.75;max-width:560px;margin-top:25px}
.lp .hero-buttons{margin-top:27px}
.lp .hero-chips{display:flex;flex-wrap:wrap;gap:13px 15px;margin-top:37px;max-width:590px}
.lp .hero-chips span{font-size:11px;background:rgba(8,30,58,.75);border:1px solid rgba(55,124,218,.2);box-shadow:inset 0 1px rgba(115,173,255,.06);border-radius:7px;padding:9px 10px}
.lp .hero-visual{padding:0;position:relative;max-width:none;width:100%;display:flex;align-items:center;justify-content:center;min-height:510px}
.lp .reference-panel-halo{position:absolute;inset:4% -13% 5% -9%;border-radius:50%;background:radial-gradient(ellipse at 45% 40%,rgba(20,98,252,.32),transparent 71%);filter:blur(40px);z-index:0;pointer-events:none}
.lp .reference-hero-board{position:relative;z-index:1;display:block;width:116%;max-width:none;height:auto;object-fit:contain;margin-left:0;transform:translateY(-8px);filter:drop-shadow(0 33px 42px rgba(0,0,0,.33));animation:artDrift 9s ease-in-out infinite alternate}
.lp .hero-visual .mock-disclaimer{position:absolute;z-index:2;bottom:9px;left:8%;width:84%;font-size:10px;line-height:1.5;color:#8aa5c8;text-align:center;text-shadow:0 1px 4px #020b1c}
.lp .hero-mountains{height:150px;opacity:.70;filter:drop-shadow(0 -1px 11px rgba(27,112,245,.15))}
.lp .hero-bottom-light{height:1px;opacity:.88;box-shadow:0 0 35px rgba(43,146,255,.8),0 0 80px rgba(30,115,254,.5)}
.lp .desktop-only{display:initial}
/* Wavelength visual, reference-like feature grid */
.lp .section-why{background:radial-gradient(ellipse at 76% 0,rgba(18,63,138,.35),transparent 62%),linear-gradient(180deg,#041026,#021027)}
.lp .wave-illustration{position:absolute;z-index:1;right:2%;top:12px;width:min(58%,840px);height:250px;pointer-events:none;background:url('/img/reference-market-wave-v3.webp?v=3') center / contain no-repeat;mix-blend-mode:screen;opacity:.80;mask-image:linear-gradient(90deg,transparent 0,#000 12%,#000 90%,transparent 100%)}
.lp .section-why .section-intro{max-width:590px;margin-bottom:56px}
.lp .value-grid{position:relative;z-index:2;gap:15px}
.lp .value-card{min-height:226px;border:1px solid rgba(57,120,218,.32);border-radius:9px;background:linear-gradient(145deg,rgba(5,22,45,.95),rgba(3,17,35,.93));padding:25px 24px;box-shadow:0 9px 25px rgba(0,0,0,.14)}
.lp .value-card:hover{border-color:rgba(75,166,255,.65);transform:translateY(-5px);box-shadow:0 19px 38px rgba(2,69,167,.18)}
.lp .feature-icon{width:49px;height:49px;border-radius:11px;background:linear-gradient(135deg,#092f60,#063c7a);color:#42aaff;box-shadow:inset 0 1px rgba(113,192,255,.14),0 0 18px rgba(9,90,216,.09)}
.lp .feature-icon .ic{stroke-width:2.1}
.lp .value-card h3{font-weight:800;font-size:17px}
.lp .value-card p{font-size:12.5px;line-height:1.65}
/* Four-step row mirrors the connected icon track */
.lp .section-steps{background:linear-gradient(115deg,#061733,#06142c 65%,#061934)}
.lp .section-steps .section-intro h2{max-width:850px}
.lp .step-list{padding-top:12px}
.lp .step-list:before{background:linear-gradient(90deg,transparent 1%,#1b63c6 12%,#3e9bff 51%,#1b63c6 86%,transparent 99%);opacity:.70}
.lp .step-icon{border:1px solid rgba(48,142,255,.62);color:#54b3ff;background:linear-gradient(180deg,rgba(7,42,95,.9),rgba(2,15,38,.9));box-shadow:0 0 22px rgba(14,104,247,.22)}
.lp .step-item h3{font-weight:750}
/* Improved strategy control sample: sleek dark well-defined native cards */
.lp .section-strategy{background:linear-gradient(180deg,#030f24,#041126)}
.lp .strategy-grid{gap:65px}
.lp .strategy-panel{border:1px solid rgba(60,134,235,.45);border-radius:11px;background:linear-gradient(160deg,rgba(8,26,56,.98),rgba(4,17,38,.98));box-shadow:0 28px 70px rgba(0,0,0,.27),0 0 32px rgba(20,90,185,.1)}
.lp .strategy-head{border-bottom-color:rgba(64,130,228,.25)}
.lp .filter-row{border-bottom-color:rgba(59,119,205,.22);background:rgba(4,14,31,.4)}
.lp .filter-row:hover{background:rgba(25,80,154,.12)}
.lp .category-menu>div{border-radius:7px;margin-bottom:5px;border:1px solid rgba(52,106,198,.36);background:linear-gradient(90deg,rgba(4,33,69,.92),rgba(4,21,44,.82))}
.lp .category-menu>div:first-child{border-color:#318afa;background:linear-gradient(90deg,#093a80,#06204a)}
.lp .category-menu .ic{color:#51b5ff}
/* Roadmap and service cards */
.lp .section-features{background:linear-gradient(180deg,#07142c,#031229)}
.lp .status-grid{gap:14px}
.lp .status-card{border-radius:10px;background:linear-gradient(150deg,rgba(8,27,56,.95),rgba(4,18,38,.97));border:1px solid rgba(61,131,233,.25)}
.lp .status-card.road{background:linear-gradient(130deg,rgba(5,20,41,.72),rgba(3,13,29,.9))}
.lp .status-tag{border-radius:18px}
.lp .status-card:hover{border-color:rgba(74,157,255,.6)}
/* Pricing: reference matched bright outline highlight, REAL DB limits */
.lp .section-pricing{background:linear-gradient(180deg,#030d21,#041127)}
.lp .pricing-grid{gap:13px}
.lp .price-card{background:linear-gradient(168deg,#081c3b,#04142b 85%);border:1px solid rgba(60,118,206,.38);border-radius:10px;box-shadow:inset 0 1px rgba(135,183,255,.045)}
.lp .price-card.is-featured{border:1px solid #2b9fff;box-shadow:0 0 0 1px rgba(60,148,255,.45),0 0 36px rgba(17,113,255,.25),inset 0 1px rgba(139,192,255,.14)}
.lp .popular{border-radius:14px;box-shadow:0 0 15px rgba(21,115,243,.3)}
.lp .price-card .button{min-height:44px}
.lp .plan-price strong{font-size:48px}
.lp .plan-list li{font-size:12px}
.lp .plan-list li::before{color:#35e3bd}
/* Visual matching for custody section (art is decorative only). */
.lp .section-security{background:radial-gradient(ellipse at 82% 48%,rgba(13,80,164,.35),transparent 47%),linear-gradient(180deg,#061832,#06142c)}
.lp .security-grid{gap:34px}
.lp .shield-art{height:400px;position:relative;isolation:isolate}
.lp .shield-glow{position:absolute;z-index:-1;inset:15%;background:radial-gradient(ellipse,rgba(22,103,235,.35),transparent 71%);filter:blur(38px)}
.lp .shield-art img{width:min(100%,465px);height:auto;max-height:360px;object-fit:contain;mix-blend-mode:screen;filter:drop-shadow(0 0 24px rgba(43,134,255,.25));animation:shieldFloat 8s ease-in-out infinite}
.lp .risk-note{margin-top:35px;border-color:rgba(225,178,86,.24);background:rgba(116,83,28,.055)}
/* Blue dotted beams from the exact reference, text always remains native HTML. */
.lp .last-cta{background:radial-gradient(ellipse at 50% 110%,rgba(18,92,214,.43),transparent 72%),linear-gradient(180deg,#061632,#071329);padding:96px 0 102px;isolation:isolate}
.lp .last-cta .cta-graphic-left,.lp .last-cta .cta-graphic-right{position:absolute;z-index:-1;top:16%;height:87%;width:35%;background-repeat:no-repeat;background-size:100% auto;opacity:.68;mix-blend-mode:screen;pointer-events:none}
.lp .last-cta .cta-graphic-left{left:0;background-image:url('/img/reference-footer-left-v3.webp?v=3');background-position:left bottom;mask-image:linear-gradient(90deg,#000,transparent 95%)}
.lp .last-cta .cta-graphic-right{right:0;background-image:url('/img/reference-footer-right-v3.webp?v=3');background-position:right bottom;mask-image:linear-gradient(270deg,#000,transparent 96%)}
.lp .last-cta h2 em{color:#60b0ff}
.lp .site-footer{background:#030b1a;border-top-color:rgba(71,144,245,.18)}
@keyframes artDrift{0%,100%{transform:translateY(-8px)}50%{transform:translateY(-19px)}}
@media(min-width:1450px){.lp .hero{padding-top:125px}.lp .hero-grid{gap:40px}.lp .hero-visual .reference-hero-board{width:125%}.lp .hero-visual{min-height:560px}}
@media(max-width:1120px){.lp .hero-visual{min-height:450px}.lp .reference-hero-board{width:111%}.lp .section{padding-block:88px}}
@media(max-width:900px){.lp .hero{padding:69px 0 75px}.lp .hero .hero-grid{grid-template-columns:1fr;gap:12px}.lp .hero-content{padding:8px 0 0}.lp .hero-visual{width:min(100%,650px);min-height:auto;padding:4px 0 38px}.lp .reference-hero-board{width:100%;transform:none;animation:none}.lp .hero-visual .mock-disclaimer{bottom:5px}.lp .wave-illustration{width:60%;top:15px;opacity:.42}.lp .section-why .section-intro{max-width:610px}.lp .strategy-grid{gap:35px}.lp .hero-chips{justify-content:center}.lp .desktop-only{display:none}}
@media(max-width:640px){.lp .site-nav{background:rgba(3,12,27,.98)}.lp .hero h1{font-size:clamp(37px,8.5vw,53px);line-height:1.07}.lp .hero .hero-grid{gap:14px}.lp .hero-visual{padding-top:9px}.lp .hero-chips{display:grid;gap:8px}.lp .hero-chips span{font-size:10.5px;padding:8px 7px}.lp .hero-visual .mock-disclaimer{font-size:9px;bottom:8px}.lp .section{padding-block:70px}.lp .section-why .section-intro{margin-bottom:36px}.lp .wave-illustration{right:-26%;width:98%;top:45px;opacity:.24}.lp .value-card{padding:20px;min-height:0}.lp .value-card .feature-icon{width:45px;height:45px}.lp .pricing-grid{gap:19px}.lp .shield-art{height:270px}.lp .shield-art img{max-height:260px;width:310px}.lp .last-cta .cta-graphic-left,.lp .last-cta .cta-graphic-right{opacity:.4;width:46%}.lp .last-cta{padding-block:79px}.lp .section-intro p{max-width:100%}}
@media(max-width:380px){.lp .hero h1{font-size:36px}.lp .reference-hero-board{width:106%}.lp .hero-visual .mock-disclaimer{font-size:8px}.lp .nav-inner{gap:7px}}
@media(prefers-reduced-motion:reduce){.lp .reference-hero-board,.lp .shield-art img{animation:none!important}}


/* ===========================================================================
PINPIN 2026 - Final visual alignment and crisp high-DPI mock dashboard.
Isolated to body.lp; no changes to Telegram Mini App or admin styles.
=========================================================================== */
.lp .brand{gap:10px;color:#f5faff}
.lp .brand-symbol{display:block;width:30px;height:35px;object-fit:contain;flex:none;filter:drop-shadow(0 0 10px rgba(52,213,242,.25))}
.lp .brand-word{color:#eafaff;font-size:19px;font-weight:850;letter-spacing:.015em}
.lp .nav-inner{min-width:0}
.lp .nav-links{min-width:0}
.lp .hero{overflow:hidden}
.lp .hero .hero-grid{grid-template-columns:minmax(0,1fr) minmax(0,1.02fr);gap:clamp(40px,5.6vw,88px);align-items:center}
.lp .hero-content{min-width:0;max-width:100%;position:relative;z-index:3;padding:0 0 32px}
.lp .hero h1{font-size:clamp(39px,4.0vw,62px);line-height:1.1;max-width:610px;overflow-wrap:normal;word-break:normal;text-wrap:balance;letter-spacing:-.052em}
.lp .hero h1 span{display:inline}
.lp .hero-lead{max-width:530px;font-size:14.4px}
.lp .hero-buttons{flex-wrap:wrap}
.lp .hero-chips{margin-top:28px;gap:8px}
.lp .hero-visual{max-width:100%;min-width:0;min-height:490px;padding:35px 0 42px;display:flex;align-items:center;justify-content:center;isolation:isolate}
.lp .hero-board-composition{position:relative;z-index:1;width:min(100%,540px);max-width:100%;margin:0;transform:translateX(-7px)}
.lp .reference-panel-halo{inset:5% -12% 6% -12%;background:radial-gradient(ellipse at 45% 45%,rgba(12,103,255,.21),transparent 72%);filter:blur(42px)}
.lp .hero-visual .mock-disclaimer{bottom:7px;left:0;width:100%;font-size:10px;letter-spacing:.01em}
.lp .premium-live{border:1px solid rgba(82,157,255,.53);border-radius:18px;background:linear-gradient(154deg,rgba(13,39,82,.99),rgba(4,15,35,.99) 75%);box-shadow:0 38px 72px rgba(0,0,0,.47),0 0 42px rgba(15,106,245,.12),inset 0 1px 0 rgba(167,213,255,.16);overflow:hidden;position:relative}
.lp .premium-live:before{content:"";position:absolute;inset:-120px auto auto -100px;width:330px;height:290px;border-radius:50%;background:radial-gradient(circle,rgba(29,126,255,.16),transparent 74%);pointer-events:none}
.lp .premium-live-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:19px 20px 14px;border-bottom:1px solid rgba(91,158,246,.19)}
.lp .premium-mini-brand{display:inline-flex;align-items:center;gap:7px;font-weight:800;color:#f0f8ff;font-size:13px;white-space:nowrap}
.lp .premium-mini-brand img{width:17px;height:21px;object-fit:contain}
.lp .premium-mini-brand b{font-weight:500;color:#9cb9e5}
.lp .premium-state{white-space:nowrap;padding:5px 9px;border:1px solid rgba(43,205,154,.27);background:rgba(25,160,112,.09);color:#8be8ce;font-size:10px;border-radius:100px}
.lp .premium-state i,.lp .premium-bottom i{display:inline-block;width:7px;height:7px;background:#34e0a4;border-radius:50%;margin-right:5px;box-shadow:0 0 9px rgba(42,228,157,.5)}
.lp .premium-live-graph{position:relative;height:176px;padding:20px 19px 2px;background:repeating-linear-gradient(0deg,transparent 0,transparent 36px,rgba(54,137,253,.075) 37px),repeating-linear-gradient(90deg,transparent 0,transparent 55px,rgba(54,137,253,.05) 56px)}
.lp .graph-topline,.lp .graph-counter{position:relative;z-index:2;display:inline-block;font-size:10px;color:#87abd9;letter-spacing:.05em}
.lp .graph-counter{float:right;letter-spacing:0}
.lp .graph-counter strong{color:#58c6ff;letter-spacing:.25em;margin-left:4px}
.lp .premium-live-graph svg{position:absolute;inset:37px 14px 0;width:calc(100% - 28px);height:139px;overflow:visible}
.lp .premium-sample-title{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:18px 20px 10px;border-top:1px solid rgba(88,151,232,.16)}
.lp .premium-sample-title strong{font-size:11.8px;color:#e0edff}
.lp .premium-sample-title span{font-size:9px;color:#7e9dc8}
.lp .premium-pairs{display:grid;gap:7px;padding:0 13px}
.lp .pair-line{min-width:0;display:flex;align-items:center;gap:11px;border-radius:10px;padding:10px 10px;background:linear-gradient(110deg,rgba(20,57,115,.55),rgba(13,36,71,.6));border:1px solid rgba(77,150,246,.17)}
.lp .coin-dot{display:inline-grid;place-items:center;width:30px;height:30px;flex:none;border-radius:50%;color:#fff;font-size:15px;font-weight:800}
.lp .coin-dot.yellow{background:linear-gradient(#ffb834,#ee8610)}.lp .coin-dot.blue{background:linear-gradient(#7a9aff,#2769db)}.lp .coin-dot.purple{background:linear-gradient(#a681f6,#7050df)}
.lp .pair-line>div{min-width:0;flex:1}.lp .pair-line b{display:block;font-size:11.5px;color:#f2f8ff;white-space:nowrap}.lp .pair-line small{display:block;font-size:9.5px;color:#88a7d0;white-space:nowrap}
.lp .pair-spark{width:61px;flex:none}.lp .pair-spark svg{display:block;width:60px;height:19px;fill:none;stroke:#4aaeff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.lp .candidate{white-space:nowrap;color:#78e5be;font-size:9px;padding:5px 8px;background:rgba(37,174,124,.1);border:1px solid rgba(37,174,124,.25);border-radius:7px}
.lp .candidate.neutral{color:#9fc1ee;background:rgba(53,116,220,.1);border-color:rgba(53,116,220,.25)}
.lp .premium-bottom{display:flex;justify-content:space-between;gap:8px;padding:14px 19px 16px;color:#7f9fc9;font-size:9.5px}
.lp .premium-bottom i{width:6px;height:6px}
.lp .floating-stat{position:absolute;z-index:2;right:-34px;display:flex;align-items:center;gap:11px;padding:12px 14px 12px 10px;min-width:176px;background:linear-gradient(130deg,rgba(14,38,78,.98),rgba(10,29,59,.97));border:1px solid rgba(80,166,255,.46);border-radius:12px;box-shadow:0 17px 40px rgba(0,0,0,.38),0 0 24px rgba(25,105,248,.1);animation:premiumFloat 8s ease-in-out infinite alternate}
.lp .floating-stat b{display:block;color:#f2f7ff;font-size:10.5px;white-space:nowrap}.lp .floating-stat small{display:block;color:#a0b9db;font-size:9.5px;white-space:nowrap}
.lp .float-icon{width:35px;height:35px;flex:none;display:grid;place-items:center;border-radius:9px;background:rgba(26,100,216,.28);color:#6dbbff;font-weight:800;font-size:23px}
.lp .float-icon.rise{color:#51ddb1;background:rgba(29,155,113,.14)}
.lp .floating-top{top:-24px;right:-25px}.lp .floating-middle{top:39%;right:-61px;animation-delay:-2s}.lp .floating-bottom{bottom:5%;right:-42px;animation-delay:-4s}
@keyframes premiumFloat{from{transform:translateY(0)}to{transform:translateY(-9px)}}
/* Remove sharp rectangular boundaries around illustrations; preserve atmospheric art. */
.lp .section-why{overflow:hidden;isolation:isolate}
.lp .wave-illustration{top:30px;right:0;width:min(62%,850px);height:320px;opacity:.5;background-size:cover;mask-image:radial-gradient(ellipse 60% 52% at 53% 48%,#000 25%,transparent 100%);-webkit-mask-image:radial-gradient(ellipse 60% 52% at 53% 48%,#000 25%,transparent 100%);mix-blend-mode:screen;filter:saturate(1.35)}
.lp .shield-art img{width:min(100%,410px);max-height:360px;object-fit:contain;mix-blend-mode:screen;mask-image:radial-gradient(ellipse 65% 60% at 50% 50%,#000 25%,transparent 98%);-webkit-mask-image:radial-gradient(ellipse 65% 60% at 50% 50%,#000 25%,transparent 98%)}
.lp .section-why .section-intro{max-width:630px}
.lp .section-intro h2{max-width:680px}
.lp .value-grid,.lp .status-grid,.lp .pricing-grid{min-width:0}
.lp .value-card,.lp .status-card,.lp .price-card{min-width:0}
.lp .hero-mountains{max-width:100%;pointer-events:none}
/* Tablet: give both columns separate rows before content can overlap. */
@media(max-width:1220px){.lp .hero .hero-grid{gap:38px;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.lp .hero h1{font-size:clamp(38px,4.2vw,56px)}.lp .floating-middle{right:-17px}.lp .floating-bottom{right:-12px}.lp .floating-top{right:-11px}}
@media(max-width:990px){.lp .hero .hero-grid{grid-template-columns:minmax(0,1fr);gap:32px}.lp .hero-content{text-align:center;max-width:680px;margin-inline:auto;padding:0}.lp .hero h1{max-width:680px;margin-inline:auto;font-size:clamp(42px,5.6vw,62px)}.lp .hero-lead{margin-inline:auto}.lp .hero-visual{max-width:600px;margin-inline:auto;min-height:500px}.lp .hero-board-composition{transform:none}.lp .hero-chips{justify-content:center}.lp .floating-middle{right:-9px}.lp .floating-bottom{right:-12px}.lp .floating-top{right:-4px}.lp .wave-illustration{width:76%;right:-10%;opacity:.35}}
@media(max-width:640px){.lp .brand-symbol{width:25px;height:30px}.lp .brand-word{font-size:17px}.lp .hero{padding-top:54px}.lp .hero h1{font-size:clamp(34px,8vw,47px);line-height:1.13;text-wrap:pretty}.lp .hero-visual{width:100%;min-height:auto;padding:24px 0 44px}.lp .hero-board-composition{width:100%;max-width:530px}.lp .floating-stat{min-width:0;padding:7px 8px;gap:5px;border-radius:8px;right:0;box-shadow:0 9px 16px rgba(0,0,0,.26)}.lp .floating-stat b{font-size:8.5px}.lp .floating-stat small{font-size:7px}.lp .float-icon{width:23px;height:23px;font-size:15px}.lp .floating-top{right:0;top:-14px}.lp .floating-middle,.lp .floating-bottom{display:none}.lp .premium-live-head{padding:15px 13px 11px}.lp .premium-live-graph{height:132px;padding:13px}.lp .premium-live-graph svg{height:106px;inset:26px 10px 0;width:calc(100% - 20px)}.lp .graph-topline,.lp .graph-counter{font-size:8px}.lp .premium-sample-title{padding:13px 12px 8px}.lp .premium-pairs{padding:0 7px;gap:5px}.lp .pair-line{padding:8px;gap:7px}.lp .coin-dot{width:25px;height:25px;font-size:13px}.lp .pair-line b{font-size:10px}.lp .pair-line small{font-size:8px}.lp .pair-spark{display:none}.lp .candidate{font-size:8px;padding:3px 6px;margin-left:auto}.lp .premium-bottom{padding:10px 12px;font-size:8px}.lp .hero-visual .mock-disclaimer{font-size:8px}.lp .wave-illustration{width:110%;right:-34%;height:250px;opacity:.24}}
@media(max-width:380px){.lp .hero h1{font-size:34px}.lp .premium-state{font-size:8px}.lp .premium-mini-brand{font-size:11px}}
@media(prefers-reduced-motion:reduce){.lp .floating-stat{animation:none!important}}

/* Brand wordmark in the cyan visual identity from the supplied logo. */
.lp .brand-word{background:linear-gradient(100deg,#5bf5ef,#36bef8);-webkit-background-clip:text;background-clip:text;color:transparent}
