/* ============================
File: crypto-howto.css (отдельный файл)
Все селекторы — только внутри .chowto
============================ */
.chowto { --bg:#ffffff; --panel:#151a22; --panel-2:#ffffff; --stroke:#263045; --text:#0e0e0e; --muted:#0e0e0e; --brand:#6ea8ff; --brand-2:#8fd8ff; font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; color: var(--text); background: radial-gradient(1200px 600px at 10% -10%, rgba(110,168,255,.18), transparent 60%), radial-gradient(900px 500px at 90% 0%, rgba(143,216,255,.12), transparent 50%), var(--bg); padding: clamp(16px, 3vw, 32px);}


.chowto * { box-sizing: border-box; }


.chowto-container { max-width: 1100px; margin: 0 auto; }


/* Hero */
.chowto-hero { text-align: left; margin-bottom: clamp(16px, 3vw, 28px); }
.chowto-title { font-size: clamp(28px, 4vw, 42px); line-height: 1.1; margin: 0 0 8px; letter-spacing: -0.02em; }
.chowto-sub { margin: 0; color: var(--muted); font-size: clamp(14px, 2vw, 16px); }


/* Card */
.chowto-card { background: linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.0)); border: 1px solid var(--stroke); border-radius: 16px; padding: clamp(14px, 2.4vw, 22px); margin-bottom: 18px; box-shadow: 0 10px 30px rgba(0,0,0,.25), inset 0 1px 0 rgba(255,255,255,.04); }
.chowto-h2 { font-size: clamp(18px, 2.6vw, 22px); margin: 0 0 12px; }


/* Steps */
.chowto-steps { list-style: none; padding: 0; margin: 0; display: grid; gap: 10px; }
.chowto-step { display: grid; grid-template-columns: 36px 1fr; gap: 12px; align-items: start; background: var(--panel-2); border: 1px solid var(--stroke); border-radius: 12px; padding: 12px; }
.chowto-step-num { width: 36px; height: 36px; border-radius: 10px; background: linear-gradient(135deg, var(--brand), var(--brand-2)); color: #0a0f1a; display: grid; place-items: center; font-weight: 700; box-shadow: 0 6px 16px rgba(110,168,255,.35); }
.chowto-step-title { margin: 2px 0 6px; font-size: 16px; }
.chowto-text { margin: 0; color: var(--muted); font-size: 14px; }


/* Highlights */
.chowto-highlights { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin: 18px 0; }
.chowto-highlight { background: linear-gradient(180deg, rgba(255,255,255,0.03), rgba(255,255,255,0.0)); border: 1px solid var(--stroke); border-radius: 16px; padding: 14px; display: grid; gap: 6px; align-content: start; min-height: 120px; }
.chowto-ico { font-size: 22px; width: 40px; height: 40px; border-radius: 12px; display: grid; place-items: center; background: rgba(110,168,255,.12); border: 1px solid rgba(110,168,255,.35); }
.chowto-highlight-title { margin: 0; font-size: 15px; }


/* Responsive */
@media (max-width: 960px) {
.chowto-highlights { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 560px) {
.chowto-step { grid-template-columns: 32px 1fr; }
.chowto-highlights { grid-template-columns: 1fr; }
.chowto-card { padding: 14px; }
}