/* Neytom Vision — design system (tokens aligned with neytom.com homepage) */
:root{
  --nv-accent:#0071e3;
  --nv-accent-light:#e8f0fe;
  --nv-accent-glow:#5ac8fa;
  --nv-text:#1d1d1f;
  --nv-muted:#86868b;
  --nv-bg:#f5f5f7;
  --nv-card:#ffffff;
  --nv-border:#e5e5ea;
  --nv-green:#34c759;
  --nv-orange:#ff9500;
  --nv-purple:#5856d6;
  --nv-glass:rgba(255,255,255,.72);
  --nv-glass-strong:rgba(255,255,255,.92);
  --nv-shadow:0 24px 80px rgba(15,23,42,.1);
  --nv-radius:22px;
  --nv-dur:.4s;
  --nv-ease:cubic-bezier(.16,1,.3,1);
  --accent:var(--nv-accent);
  --text:var(--nv-text);
  --muted:var(--nv-muted);
  --line:var(--nv-border);
  --glass:var(--nv-glass);
  --glass-strong:var(--nv-glass-strong);
  --shadow:var(--nv-shadow);
  --tstd:var(--nv-orange);
  --tperf:var(--nv-accent);
  --tacc:var(--nv-purple);
  --custom:#6366f1;
  --fx-dur:var(--nv-dur);
  --fx-ease:var(--nv-ease);
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body.nv-app{
  font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
  color:var(--nv-text);
  min-height:100vh;
  background:var(--nv-bg);
  line-height:1.6;
  overflow-x:hidden;
}
body.nv-app::before{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:0;
  background:
    radial-gradient(ellipse 70% 45% at 50% -15%, rgba(0,113,227,.18), transparent 65%),
    radial-gradient(600px 320px at 100% 20%, rgba(90,200,250,.12), transparent 55%),
    radial-gradient(500px 280px at 0% 90%, rgba(88,86,214,.06), transparent 50%);
}
body.nv-app::after{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:0;opacity:.35;
  background-image:linear-gradient(rgba(0,113,227,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(0,113,227,.04) 1px,transparent 1px);
  background-size:40px 40px;mask-image:linear-gradient(180deg,#000 0%,transparent 88%);
}
body.nv-app > header,body.nv-app > main,body.nv-app > footer{position:relative;z-index:1;}
a{color:var(--nv-accent);text-decoration:none;}
a:hover{text-decoration:underline;}
.nv-wrap{max-width:1180px;margin:0 auto;padding:0 24px 88px;}
.nv-header{
  position:sticky;top:0;z-index:100;
  background:rgba(255,255,255,.88);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);
  border-bottom:1px solid var(--nv-border);box-shadow:0 1px 0 rgba(255,255,255,.8) inset;
}
.nv-header-inner{max-width:1180px;margin:0 auto;padding:12px 24px;display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;}
.nv-brand{font-weight:800;font-size:1.15rem;letter-spacing:-.03em;color:var(--nv-text);text-decoration:none;}
.nv-brand span{color:var(--nv-accent);}
.nv-nav{display:flex;flex-wrap:wrap;align-items:center;gap:8px 20px;font-size:.88rem;font-weight:600;}
.nv-nav > a{color:var(--nv-muted);text-decoration:none;transition:color .25s ease;}
.nv-nav > a:hover{color:var(--nv-accent);text-decoration:none;}
.nv-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:10px 20px;border-radius:980px;font-weight:700;font-size:.86rem;border:none;cursor:pointer;
  background:linear-gradient(135deg,var(--nv-accent),#0058b0);color:#fff;
  box-shadow:0 8px 24px rgba(0,113,227,.28);text-decoration:none;
  transition:transform var(--nv-dur) var(--nv-ease),box-shadow var(--nv-dur) ease,filter .2s ease;
}
.nv-btn:hover{transform:translateY(-2px);box-shadow:0 12px 32px rgba(0,113,227,.38);filter:brightness(1.05);text-decoration:none;color:#fff;}
.nv-btn:active{transform:translateY(0);}
.nv-btn--ghost{background:var(--nv-card);color:var(--nv-text);border:1.5px solid var(--nv-border);box-shadow:0 4px 14px rgba(0,0,0,.04);}
.nv-btn--ghost:hover{border-color:var(--nv-accent);color:var(--nv-accent);}
.nv-reveal{opacity:1;transform:none;}
.nv-reveal--motion{opacity:1;transform:translateY(0);transition:opacity var(--nv-dur) var(--nv-ease),transform var(--nv-dur) var(--nv-ease);}
@media(prefers-reduced-motion:no-preference){
  .nv-reveal--motion:not(.is-in){opacity:0;transform:translateY(16px);}
}
@media(prefers-reduced-motion:reduce){
  .nv-reveal--motion{opacity:1!important;transform:none!important;transition:none!important;}
}
.nv-hero{padding:48px 0 24px;}
.nv-hero-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:32px;align-items:center;}
@media(max-width:920px){.nv-hero-grid{grid-template-columns:1fr;}}
.nv-hero h1{font-size:clamp(1.9rem,4.2vw,2.85rem);font-weight:800;letter-spacing:-.04em;line-height:1.08;margin-bottom:14px;}
.nv-hero-lead{color:var(--nv-muted);font-size:1.05rem;max-width:56ch;}
.nv-pills{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:18px;}
.nv-pill{font-size:.68rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:6px 12px;border-radius:980px;background:var(--nv-accent-light);color:var(--nv-accent);border:1px solid rgba(0,113,227,.15);}
.nv-panel{
  background:var(--nv-glass-strong);border:1px solid var(--nv-border);border-radius:var(--nv-radius);
  box-shadow:var(--nv-shadow);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);
}
.nv-visual{position:relative;padding:20px;border-radius:20px;overflow:hidden;border:1px solid rgba(0,113,227,.12);background:linear-gradient(145deg,#fff,rgba(232,240,254,.9));}
.nv-visual svg{display:block;width:100%;height:auto;position:relative;z-index:1;}
.nv-chip-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:24px;}
@media(max-width:900px){.nv-chip-grid{grid-template-columns:repeat(2,1fr);}}
.nv-chip{
  display:flex;align-items:center;gap:10px;padding:14px;border-radius:16px;background:var(--nv-card);
  border:1px solid var(--nv-border);font-weight:700;font-size:.82rem;color:var(--nv-text);text-decoration:none;
  transition:transform var(--nv-dur) var(--nv-ease),border-color .25s ease,box-shadow .25s ease;
}
.nv-chip:hover{border-color:rgba(0,113,227,.35);transform:translateY(-3px);box-shadow:0 10px 28px rgba(0,113,227,.1);color:var(--nv-accent);text-decoration:none;}
.nv-chip-ico{width:36px;height:36px;border-radius:10px;display:flex;align-items:center;justify-content:center;background:var(--nv-accent-light);flex-shrink:0;}
.nv-section{margin-top:48px;}
.nv-section > h2{font-size:1.5rem;font-weight:800;letter-spacing:-.03em;margin-bottom:8px;}
.nv-section > p.lead{color:var(--nv-muted);font-size:.94rem;max-width:72ch;margin-bottom:22px;}
.nv-hub-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}
@media(max-width:960px){.nv-hub-grid{grid-template-columns:1fr;}}
.nv-hub-card{padding:22px 20px;}
.nv-hub-card h3{font-size:.72rem;font-weight:800;text-transform:uppercase;letter-spacing:.1em;color:var(--nv-accent);margin-bottom:12px;padding-bottom:10px;border-bottom:1px solid var(--nv-border);}
.nv-hub-card ul{list-style:none;}
.nv-hub-card li{margin:0 0 8px;}
.nv-hub-link{
  display:flex;justify-content:space-between;align-items:flex-start;gap:10px;padding:12px 14px;border-radius:14px;
  font-size:.88rem;font-weight:650;color:var(--nv-text);text-decoration:none;border:1px solid var(--nv-border);background:rgba(255,255,255,.7);
  transition:transform .3s var(--nv-ease),border-color .25s ease,background .25s ease;
}
.nv-hub-link:hover{border-color:rgba(0,113,227,.35);background:#fff;color:var(--nv-accent);transform:translateX(4px);text-decoration:none;}
.nv-hub-meta{display:block;font-size:.76rem;font-weight:600;color:var(--nv-muted);margin-top:4px;}
.nv-tabs-wrap{padding:28px 24px 32px;margin-top:40px;}
.nv-tablist{display:flex;flex-wrap:wrap;gap:6px;padding-bottom:12px;border-bottom:1px solid var(--nv-border);margin-bottom:0;}
.nv-tab{
  border:none;background:transparent;font:inherit;font-weight:700;font-size:.8rem;padding:10px 14px;border-radius:12px;
  cursor:pointer;color:var(--nv-muted);transition:color .25s ease,background .25s ease,transform .3s var(--nv-ease);
}
.nv-tab:hover{color:var(--nv-accent);background:rgba(0,113,227,.06);}
.nv-tab.is-active{color:var(--nv-accent);background:var(--nv-accent-light);box-shadow:0 2px 12px rgba(0,113,227,.12);}
.nv-tabpanels{padding:24px 4px 8px;min-height:280px;}
.nv-tabpanel{display:none;animation:nvTabIn .35s var(--nv-ease);}
.nv-tabpanel.is-active{display:block;}
@keyframes nvTabIn{from{opacity:0;transform:translateY(8px);}to{opacity:1;transform:none;}}
.nv-tabpanel h3{font-size:1.08rem;font-weight:800;margin-bottom:10px;}
.nv-tabpanel p,.nv-tabpanel li{color:var(--nv-muted);font-size:.9rem;line-height:1.62;}
.nv-tabpanel ul{margin:0 0 14px 1.15rem;}
.nv-official{font-size:.86rem;font-weight:650;margin-top:16px;}
.nv-video{margin-top:20px;border-radius:16px;overflow:hidden;aspect-ratio:16/9;background:#000;border:1px solid var(--nv-border);}
.nv-video iframe{width:100%;height:100%;border:0;}
.nv-pricing{padding:36px 28px;}
.nv-price-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;}
@media(max-width:960px){.nv-price-grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:560px){.nv-price-grid{grid-template-columns:1fr;}}
.nv-price-card{padding:20px 18px;border-radius:18px;background:var(--nv-card);border:1px solid var(--nv-border);display:flex;flex-direction:column;gap:8px;}
.nv-price-card.featured{border-color:rgba(0,113,227,.4);background:linear-gradient(165deg,rgba(0,113,227,.06),#fff);box-shadow:0 16px 40px rgba(0,113,227,.1);}
.nv-footer{margin-top:56px;padding:28px 0 40px;border-top:1px solid var(--nv-border);color:var(--nv-muted);font-size:.84rem;}
.nv-footer-inner{max-width:1180px;margin:0 auto;padding:0 24px;display:flex;flex-wrap:wrap;gap:14px;justify-content:space-between;}
.nv-strip{font-size:.84rem;padding:12px 16px;border-radius:14px;background:linear-gradient(100deg,rgba(52,199,89,.15),rgba(0,113,227,.08));border:1px solid rgba(52,199,89,.25);margin-bottom:18px;}
.nv-dd{position:relative;}
.nv-dd-btn{border:none;background:var(--nv-accent-light);color:var(--nv-accent);font:inherit;font-weight:700;padding:8px 14px;border-radius:980px;cursor:pointer;}
.nv-dd-panel{display:none;position:absolute;left:0;top:calc(100% + 8px);min-width:min(520px,92vw);z-index:90;padding:16px;border-radius:18px;background:var(--nv-glass-strong);border:1px solid var(--nv-border);box-shadow:var(--nv-shadow);}
.nv-dd.open .nv-dd-panel{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;}
@media(max-width:780px){.nv-dd.open .nv-dd-panel{grid-template-columns:1fr;}}
.nv-dd-col h4{font-size:.68rem;text-transform:uppercase;letter-spacing:.1em;color:var(--nv-muted);margin-bottom:8px;}
.nv-dd-col a{display:block;padding:8px 10px;border-radius:10px;font-size:.86rem;font-weight:600;color:var(--nv-text);text-decoration:none;}
.nv-dd-col a:hover{background:var(--nv-accent-light);color:var(--nv-accent);}
/* Tutorial page aliases */
.tut-wrap,.wrap{max-width:1180px;margin:0 auto;padding:0 24px 88px;}
.tut-hero,.tut-main,.tut-aside,.hub-card,.seo-learning-tabs,.pricing-section,.contact-section,.card,.seo-editorial,.price-card,.guides-hub,.hero,.header-inner,.brand,.nav-top,.btn,.nav-dd,.nav-dd-btn,.nav-dd-panel,.nav-dd-col,.vision-live-strip,.tutorial-hub-grid,.hub-card,.hub-tut,.seo-tabs,.seo-tablist,.seo-tab,.seo-tab-panels,.seo-tab-panel,.seo-editorial,.seo-card,.contact-pill,.foot-inner,.header-inner,.wrap{/* legacy class hooks — mapped via shared-styles import */}
