.tutorial-page{background:#070812;color:var(--text);min-height:100vh;overflow:hidden}.tutorial-hero{position:relative;padding:8.5rem 0 5.5rem;background:radial-gradient(circle at 14% 5%,rgba(99,102,241,.18),transparent 36%),radial-gradient(circle at 86% 28%,rgba(20,184,166,.12),transparent 32%)}.tutorial-orbit{position:absolute;border:1px solid rgba(94,234,212,.09);border-radius:50%;pointer-events:none}.tutorial-orbit-one{width:480px;height:480px;right:-210px;top:-130px}.tutorial-orbit-two{width:280px;height:280px;right:-110px;top:-30px}.tutorial-hero-grid{display:grid;grid-template-columns:minmax(0,1.03fr) minmax(380px,.97fr);gap:4rem;align-items:center}.tutorial-back{display:inline-flex;align-items:center;gap:.5rem;color:var(--text-dim);font-size:.78rem;text-decoration:none;margin-bottom:1.6rem}.tutorial-back:hover{color:#5eead4}.tutorial-kicker{display:flex;align-items:center;gap:.55rem;color:#a5b4fc;font-size:.75rem;font-weight:750;letter-spacing:.06em;text-transform:uppercase}.tutorial-kicker i{color:#5eead4}.tutorial-kicker-dot{width:4px;height:4px;border-radius:50%;background:var(--text-dim)}.tutorial-hero h1{font-family:'Space Grotesk','Inter',sans-serif;font-size:clamp(2.65rem,5vw,4.65rem);font-weight:900;line-height:.99;letter-spacing:-.055em;margin:1rem 0 1.25rem;max-width:790px}.tutorial-hero-copy>p{color:var(--text-muted);font-size:1.05rem;line-height:1.75;max-width:680px}.tutorial-hero-actions{display:flex;gap:.75rem;flex-wrap:wrap;margin:2rem 0 1.35rem}.tutorial-proof-row{display:flex;gap:1rem 1.25rem;flex-wrap:wrap;color:var(--text-dim);font-size:.72rem}.tutorial-proof-row i{color:#2dd4bf;margin-right:.35rem}.tutorial-terminal{position:relative;border:1px solid rgba(129,140,248,.24);border-radius:18px;background:linear-gradient(160deg,rgba(18,20,38,.98),rgba(8,10,21,.98));box-shadow:0 28px 80px rgba(0,0,0,.38),0 0 80px rgba(45,212,191,.05);overflow:hidden;transform:rotate(.5deg)}.tutorial-terminal:after{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 1px rgba(255,255,255,.06);pointer-events:none}.tutorial-terminal-bar{height:42px;display:flex;align-items:center;gap:6px;padding:0 14px;border-bottom:1px solid rgba(255,255,255,.07);background:rgba(255,255,255,.025)}.tutorial-terminal-bar span{width:8px;height:8px;border-radius:50%;background:#36394e}.tutorial-terminal-bar span:first-child{background:#6d4561}.tutorial-terminal-bar span:nth-child(2){background:#6b6042}.tutorial-terminal-bar span:nth-child(3){background:#37645e}.tutorial-terminal-bar small{margin-left:auto;color:var(--text-dim);font-family:'Fira Code',monospace;font-size:.64rem}.tutorial-install-label{padding:1.25rem 1.4rem .25rem;color:#5eead4;text-transform:uppercase;letter-spacing:.1em;font-size:.62rem;font-weight:800}.tutorial-terminal pre{margin:0;padding:.45rem 1.4rem 1.25rem;white-space:pre-wrap;overflow-wrap:anywhere;color:#d8dcf6;font-family:'Fira Code',monospace;font-size:.76rem;line-height:1.7}.tutorial-terminal .tutorial-code{color:#c4b5fd;padding-top:1.25rem;max-height:360px;overflow:auto}.tutorial-code-divider{height:1px;background:rgba(255,255,255,.07);margin:0 1.4rem}.tutorial-journey{padding:6rem 0}.tutorial-section-heading{max-width:760px;margin:0 auto 4rem;text-align:center}.tutorial-section-heading>span,.tutorial-overline{color:#5eead4;font-size:.7rem;font-weight:800;letter-spacing:.11em;text-transform:uppercase}.tutorial-section-heading h2,.tutorial-production h2,.tutorial-next h2{font-family:'Space Grotesk','Inter',sans-serif;font-size:clamp(2rem,4vw,3.2rem);font-weight:850;letter-spacing:-.04em;margin:.65rem 0 1rem}.tutorial-section-heading p,.tutorial-production p,.tutorial-next p{color:var(--text-muted);line-height:1.75}.tutorial-steps{list-style:none;margin:0 auto;padding:0;max-width:1040px;counter-reset:steps}.tutorial-steps>li{position:relative;display:grid;grid-template-columns:76px 1fr;gap:1.4rem;padding:0 0 4.25rem}.tutorial-steps>li:not(:last-child):before{content:"";position:absolute;left:31px;top:58px;bottom:0;width:1px;background:linear-gradient(#6366f1,rgba(45,212,191,.26))}.tutorial-step-number{position:relative;z-index:1;width:64px;height:64px;border:1px solid rgba(129,140,248,.38);border-radius:18px;display:flex;align-items:center;justify-content:center;background:#0d0f1d;color:#a5b4fc;font-family:'Fira Code',monospace;font-size:.76rem;font-weight:800}.tutorial-step-body{padding:1.25rem 1.5rem 1.45rem;border-top:1px solid rgba(255,255,255,.1);background:linear-gradient(90deg,rgba(255,255,255,.025),transparent);border-radius:0 0 14px 14px}.tutorial-step-phase{color:#5eead4;font-size:.65rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase}.tutorial-step-body h3{font-family:'Space Grotesk','Inter',sans-serif;font-size:1.45rem;font-weight:800;letter-spacing:-.025em;margin:.45rem 0 .65rem}.tutorial-step-body>p{max-width:780px;color:var(--text-muted);line-height:1.72;font-size:.92rem}.tutorial-step-body ul{list-style:none;margin:1rem 0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.6rem 1.2rem}.tutorial-step-body li{display:flex;gap:.55rem;color:#cbd0e4;font-size:.82rem;line-height:1.5}.tutorial-step-body li i{color:#2dd4bf;font-size:.7rem;margin-top:.3rem}.tutorial-inline-code{display:flex;align-items:center;gap:1rem;max-width:720px;padding:.85rem 1rem;margin:1rem 0;border:1px solid rgba(129,140,248,.18);border-radius:10px;background:#090b16}.tutorial-inline-code code{min-width:0;overflow-wrap:anywhere;color:#c4b5fd;font-family:'Fira Code',monospace;font-size:.75rem}.tutorial-inline-code button{margin-left:auto;border:0;background:transparent;color:var(--text-dim);padding:.25rem;cursor:pointer}.tutorial-inline-code button:hover{color:#5eead4}.tutorial-text-link{display:inline-flex;gap:.45rem;align-items:center;color:#a5b4fc;text-decoration:none;font-size:.82rem;font-weight:700;margin-top:.5rem}.tutorial-text-link:hover{color:#5eead4}.tutorial-test-strip{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem;margin-top:1.25rem}.tutorial-test-strip a{display:flex;align-items:center;gap:.75rem;padding:.9rem;border:1px solid rgba(255,255,255,.08);border-radius:11px;background:rgba(0,0,0,.15);text-decoration:none;color:var(--text)}.tutorial-test-strip i{color:#5eead4}.tutorial-test-strip span{display:flex;flex-direction:column}.tutorial-test-strip strong{font-size:.82rem}.tutorial-test-strip small{color:var(--text-dim);font-size:.7rem}.tutorial-step-store{grid-template-columns:76px minmax(0,.88fr) minmax(300px,1.12fr)!important;align-items:center}.tutorial-store-shot{margin:0;border:1px solid rgba(45,212,191,.2);border-radius:15px;background:#0b0d18;overflow:hidden;box-shadow:0 20px 55px rgba(0,0,0,.3)}.tutorial-store-shot img{display:block;width:100%;height:auto}.tutorial-store-shot figcaption{padding:.75rem 1rem;color:var(--text-dim);font-size:.68rem;border-top:1px solid rgba(255,255,255,.06)}.tutorial-production{padding:5rem 0;background:linear-gradient(180deg,rgba(15,23,42,.72),rgba(7,8,18,0));border-top:1px solid rgba(255,255,255,.06)}.tutorial-production-grid{display:grid;grid-template-columns:.75fr 1.25fr;gap:4rem;align-items:start;max-width:1050px}.tutorial-production h2{font-size:clamp(1.8rem,3vw,2.6rem)}.tutorial-production ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem}.tutorial-production li{display:flex;gap:.7rem;padding:1rem;border-left:2px solid rgba(45,212,191,.5);background:rgba(255,255,255,.025);color:#cbd0e4;font-size:.82rem;line-height:1.5}.tutorial-production li i{color:#5eead4;margin-top:.18rem}.tutorial-next{padding:2rem 0 6rem}.tutorial-next-panel{max-width:1050px;margin:auto;padding:2.5rem;border:1px solid rgba(45,212,191,.22);border-radius:22px;background:linear-gradient(120deg,rgba(13,148,136,.13),rgba(99,102,241,.1));display:grid;grid-template-columns:1.2fr .8fr;gap:2rem;align-items:center}.tutorial-next h2{font-size:clamp(1.8rem,3vw,2.65rem)}.tutorial-next-actions{display:flex;flex-direction:column;align-items:flex-start;gap:1rem}.tutorial-next-actions>a:not(.btn-primary-custom){color:#a5b4fc;text-decoration:none;font-size:.82rem;font-weight:700}.tutorial-hub{background:#070812;min-height:100vh;color:var(--text)}.tutorial-hub-hero{padding:8.5rem 0 4rem;text-align:center;background:radial-gradient(circle at 50% 10%,rgba(99,102,241,.16),transparent 38%)}.tutorial-hub-hero h1{font-family:'Space Grotesk','Inter',sans-serif;font-size:clamp(2.7rem,6vw,4.8rem);font-weight:900;letter-spacing:-.055em;line-height:1;margin:.8rem auto 1.1rem;max-width:900px}.tutorial-hub-hero p{max-width:710px;margin:auto;color:var(--text-muted);font-size:1.05rem;line-height:1.75}.tutorial-hub-grid-section{padding:1rem 0 6rem}.tutorial-hub-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;max-width:1060px;margin:auto}.tutorial-hub-card{position:relative;display:grid;grid-template-columns:auto 1fr auto;gap:1rem;align-items:start;padding:1.4rem;border:1px solid rgba(255,255,255,.09);border-radius:15px;background:linear-gradient(135deg,rgba(255,255,255,.035),rgba(255,255,255,.012));text-decoration:none;color:var(--text);transition:.2s ease}.tutorial-hub-card:hover{transform:translateY(-3px);border-color:rgba(45,212,191,.42);color:var(--text)}.tutorial-hub-icon{width:42px;height:42px;border-radius:11px;display:flex;align-items:center;justify-content:center;background:rgba(99,102,241,.13);color:#a5b4fc}.tutorial-hub-card h2{font-size:1rem;font-weight:800;margin:.05rem 0 .4rem}.tutorial-hub-card p{color:var(--text-dim);font-size:.78rem;line-height:1.55;margin:0}.tutorial-hub-card>i{color:#5eead4;margin-top:.7rem}.tutorial-hub-path{max-width:1060px;margin:0 auto 1.25rem;display:flex;align-items:center;justify-content:center;gap:.75rem;color:var(--text-dim);font-size:.72rem}.tutorial-hub-path strong{color:#5eead4}.tutorial-hub-path i{font-size:.55rem;color:#6366f1}@media(max-width:900px){.tutorial-hero-grid{grid-template-columns:1fr;gap:2.5rem}.tutorial-terminal{max-width:720px}.tutorial-step-store{grid-template-columns:76px 1fr!important}.tutorial-store-shot{grid-column:2}.tutorial-production-grid,.tutorial-next-panel{grid-template-columns:1fr;gap:2rem}}@media(max-width:640px){.tutorial-hero{padding:7rem 1.1rem 4rem}.tutorial-hero h1{font-size:clamp(2.35rem,13vw,3.45rem)}.tutorial-hero-grid{display:block}.tutorial-terminal{margin-top:2.5rem;transform:none}.tutorial-terminal pre{font-size:.69rem;padding-left:1rem;padding-right:1rem}.tutorial-kicker{flex-wrap:wrap}.tutorial-journey{padding:4.5rem 1.1rem}.tutorial-section-heading{text-align:left;margin-bottom:2.5rem}.tutorial-steps>li,.tutorial-step-store{grid-template-columns:48px 1fr!important;gap:.75rem;padding-bottom:3rem}.tutorial-step-number{width:42px;height:42px;border-radius:12px;font-size:.65rem}.tutorial-steps>li:not(:last-child):before{left:20px;top:42px}.tutorial-step-body{padding:1rem}.tutorial-step-body ul,.tutorial-test-strip,.tutorial-production ul{grid-template-columns:1fr}.tutorial-store-shot{grid-column:2}.tutorial-production{padding:4rem 1.1rem}.tutorial-next{padding:1rem 1.1rem 4.5rem}.tutorial-next-panel{padding:1.5rem}.tutorial-hub-hero{padding:7rem 1.1rem 3rem}.tutorial-hub-grid-section{padding:1rem 1.1rem 4.5rem}.tutorial-hub-grid{grid-template-columns:1fr}.tutorial-hub-card{grid-template-columns:auto 1fr}.tutorial-hub-card>i{display:none}.tutorial-hub-path{flex-wrap:wrap;padding:0 1rem}}
