.guide-page{overflow:clip}.guide-wrap{width:min(1160px,100% - 48px);margin-inline:auto}.guide-display{font-family:var(--font-heading);letter-spacing:-.055em}.guide-eyebrow{letter-spacing:.2em;text-transform:uppercase;align-items:center;gap:10px;font-size:10px;font-weight:800;display:flex}.guide-eyebrow:before{content:"";background:currentColor;width:20px;height:1px}.guide-glass{border:1px solid color-mix(in srgb, var(--primary) 22%, var(--border));background:linear-gradient(135deg, color-mix(in srgb, var(--card) 85%, transparent), color-mix(in srgb, var(--secondary) 32%, var(--card)));backdrop-filter:blur(18px);box-shadow:inset 0 1px 0 color-mix(in srgb, var(--primary) 9%, transparent)}.guide-hero{isolation:isolate;position:relative}.guide-hero:before{content:"";z-index:-1;background:radial-gradient(ellipse at 68% 30%, color-mix(in srgb, var(--primary) 18%, transparent), transparent 56%), radial-gradient(ellipse at 90% 74%, color-mix(in srgb, var(--chart-2) 16%, transparent), transparent 50%);pointer-events:none;position:absolute;inset:-140px -180px -60px 25%}.guide-hero-title{font-size:clamp(44px,5.8vw,78px);font-weight:700;line-height:1.035}.guide-gradient-text{background:linear-gradient(100deg, var(--primary), var(--chart-2));color:#0000;-webkit-background-clip:text;background-clip:text}.guide-primary{box-shadow:0 4px 28px color-mix(in srgb, var(--primary) 20%, transparent);transition:box-shadow var(--transition-fast), transform var(--transition-fast)}.guide-primary:hover{box-shadow:0 6px 36px color-mix(in srgb, var(--primary) 32%, transparent);transform:translateY(-2px)}.guide-visual{justify-content:center;align-items:center;min-height:430px;display:flex;position:relative}.guide-orbit{border:1px solid color-mix(in srgb, var(--primary) 24%, transparent);background:repeating-linear-gradient(0deg, transparent, transparent 29px, color-mix(in srgb, var(--primary) 7%, transparent) 30px);border-radius:50%;width:390px;height:390px;position:absolute;transform:rotate(-24deg)scaleY(.88)}.guide-orbit:before,.guide-orbit:after{content:"";border:1px solid color-mix(in srgb, var(--primary) 16%, transparent);border-radius:inherit;position:absolute;inset:35px}.guide-orbit:after{border-style:dashed;inset:-38px}.guide-preview{width:min(340px,100%);box-shadow:var(--shadow-lg);border-radius:22px;position:relative;transform:rotate(-4deg)}.guide-preview-note{box-shadow:var(--shadow-md);position:absolute;bottom:32px;right:-8px;transform:rotate(4deg)}.guide-feature{transition:border-color var(--transition-normal), transform var(--transition-normal)}.guide-feature:hover{border-color:color-mix(in srgb, var(--primary) 60%, var(--border));transform:translateY(-4px)}.guide-faq-answer{opacity:0;max-height:0;transition:max-height .3s ease-out,opacity .3s ease-out;overflow:hidden}.guide-faq-answer[data-open=true]{opacity:1;max-height:420px}.guide-faq-chevron{transition:transform .3s ease-out}.guide-faq-chevron[data-open=true]{transform:rotate(180deg)}.guide-closing{background:radial-gradient(ellipse at 90% 0%, color-mix(in srgb, var(--primary) 24%, transparent), transparent 65%), linear-gradient(115deg, var(--secondary), color-mix(in srgb, var(--chart-2) 10%, var(--card)))}.guide-progress{transform-origin:0;transition:transform 80ms linear}.guide-code{tab-size:2;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}@media (width<=767px){.guide-wrap{width:min(1160px,100% - 36px)}.guide-hero-title{font-size:clamp(42px,10.5vw,64px)}.guide-visual{min-height:365px}.guide-orbit{width:300px;height:300px}.guide-preview{width:285px}.guide-preview-note{bottom:22px;right:2px}}@media (prefers-reduced-motion:reduce){.guide-page *,.guide-page :before,.guide-page :after{scroll-behavior:auto!important;transition:none!important}.guide-feature:hover,.guide-primary:hover{transform:none}}
