:root{--always-white:0 0% 100%;--always-black:0 0% 0%}
[data-theme=socrates][data-mode=dark]{--bg-000:42 4% 18%;--bg-100:40 3.3% 14.5%;--bg-200:36 3.6% 11.8%;--bg-300:39 3.2% 7.8%;--bg-400:0 0% 0%;--text-000:45 30% 96%;--text-100:45 30% 96%;--text-200:45 8% 72%;--text-300:45 8% 72%;--text-400:44 4.5% 58%;--text-500:44 4.5% 58%;--border-100:45 20% 82%;--border-200:45 20% 82%;--border-300:45 20% 82%;--border-400:45 20% 82%;--accent-000:43 77% 62%;--accent-100:43 77% 62%;--accent-900:43 40% 20%;--brand-000:36 60% 55%;--brand-100:36 65% 60%;--oncolor-100:0 0% 100%;--font-sans:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;--font-display:"Newsreader",ui-serif,Georgia,"Times New Roman",serif;--font-mono:"JetBrains Mono","Cascadia Code","Fira Code",ui-monospace,monospace;--ease-out:cubic-bezier(0.16,1,0.3,1);--ease-spring:cubic-bezier(0.34,1.3,0.64,1);--anim-slow:.6s;--anim-med:.4s;--anim-fast:.2s}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--font-sans);font-size:16px;line-height:1.6;color:hsl(var(--text-100));background:hsl(var(--bg-100));-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;letter-spacing:-0.01em;padding-top:77px}
.page{position:relative;z-index:1;width:100%;overflow-x:hidden}
a{color:hsl(var(--accent-000));text-decoration:none;transition:color .15s}
a:hover{color:hsl(var(--accent-100))}

.bg-grid{position:fixed;inset:0;pointer-events:none;z-index:0;background-image:linear-gradient(to right,hsl(var(--bg-300)) 1px,transparent 1px),linear-gradient(to bottom,hsl(var(--bg-300)) 1px,transparent 1px);background-size:64px 64px;opacity:0.12}
.bg-glow{position:fixed;left:0;top:0;width:240px;height:240px;margin:-120px 0 0 -120px;border-radius:50%;background:hsl(var(--accent-000)/0.12);filter:blur(60px);pointer-events:none;z-index:0;will-change:transform;animation:glowPulse 8s cubic-bezier(0.45,0,0.55,1) infinite}
@keyframes glowPulse{0%,100%{opacity:.3}50%{opacity:.85}}
.page{position:relative;z-index:1}

/* Nav - fixed position with frosted glass effect */
nav{position:fixed;top:0;left:0;right:0;z-index:100;display:flex;justify-content:center;padding:18px 32px;background:hsl(var(--bg-100)/0.72);-webkit-backdrop-filter:blur(18px) saturate(1.4);backdrop-filter:blur(18px) saturate(1.4);border-bottom:0.5px solid hsl(var(--border-300)/0.06)}
nav .nav-inner{display:flex;align-items:center;justify-content:space-between;width:100%;max-width:1040px}
.nav-logo{font-family:var(--font-display);font-size:24px;font-weight:400;color:hsl(var(--text-000));letter-spacing:-.03em;transition:opacity .15s}
.nav-logo:hover{opacity:.7}
.nav-logo em{font-style:italic;color:hsl(var(--accent-000))}
.nav-links{display:flex;align-items:center;gap:28px;font-size:13px}
.nav-links a{color:hsl(var(--text-400));transition:color .1s;position:relative}
.nav-links a.nav-active{color:hsl(var(--text-100))}
.nav-links a.nav-active::after{content:'';position:absolute;bottom:-2px;left:0;width:100%;height:1px;background:hsl(var(--accent-000))}
.nav-links a:not(.cta-btn)::after{content:'';position:absolute;bottom:-2px;left:0;width:0;height:1px;background:hsl(var(--accent-000));transition:width .25s}
.nav-links a:not(.cta-btn):hover::after{width:100%}
.nav-links a:hover{color:hsl(var(--text-100))}

/* Buttons */
.cta-btn{display:inline-flex;align-items:center;gap:6px;padding:10px 24px;border-radius:8px;font-size:14px;font-weight:500;background:hsl(var(--accent-000));color:hsl(var(--bg-400))!important;transition:background var(--anim-fast),transform var(--anim-fast),box-shadow var(--anim-fast)}
.cta-btn:hover{background:hsl(var(--accent-100));transform:translateY(-2px);box-shadow:0 4px 20px hsl(var(--accent-000)/0.3)}
.cta-btn:active{transform:translateY(0)}
.cta-btn.sm{font-size:13px;padding:8px 18px}
.cta-btn.ghost{background:transparent;color:hsl(var(--text-100))!important;border:0.5px solid hsl(var(--border-300)/0.2)}
.cta-btn.ghost:hover{background:hsl(var(--bg-300));box-shadow:none}
.cta-btn.outline{background:transparent;color:hsl(var(--accent-000))!important;border:0.5px solid hsl(var(--accent-000)/0.4)}
.cta-btn.outline:hover{background:hsl(var(--accent-900));border-color:hsl(var(--accent-000));box-shadow:0 4px 20px hsl(var(--accent-000)/0.15)}

/* Sections */
section{padding:100px 32px}
.section-inner{max-width:720px;margin:0 auto}
section.wide .section-inner{max-width:960px}

/* Scroll-reveal base */
.sr{opacity:0;transform:translateY(30px) scale(0.97);transition:opacity var(--anim-slow) cubic-bezier(0.22,1,0.36,1),transform var(--anim-slow) cubic-bezier(0.22,1,0.36,1)}
.sr.in{opacity:1;transform:translateY(0) scale(1)}
.sr-d1{transition-delay:0s}
.sr-d2{transition-delay:.1s}
.sr-d3{transition-delay:.2s}
.sr-d4{transition-delay:.3s}

/* Hero */
.hero{text-align:center;padding:140px 32px 80px;position:relative}
.parallax-base{will-change:transform;translate:0 var(--parallax-y,0px)}
.hero-label{font-size:12px;font-weight:500;color:hsl(var(--accent-000));letter-spacing:.12em;text-transform:uppercase;margin-bottom:24px;display:inline-flex;align-items:center;gap:8px}
.hero-label::before,.hero-label::after{content:'';display:inline-block;width:24px;height:0.5px;background:hsl(var(--accent-000)/0.5)}
.hero h1{font-family:var(--font-display);font-size:clamp(44px,7vw,72px);font-weight:300;line-height:1.08;color:hsl(var(--text-000));margin-bottom:24px;letter-spacing:-.035em}
.hero h1 strong{font-weight:500;color:hsl(var(--accent-000))}
.hero h1 .gradient{background:linear-gradient(135deg,hsl(var(--accent-000)),hsl(var(--brand-100)));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.hero p{font-size:clamp(16px,1.8vw,18px);color:hsl(var(--text-400));max-width:560px;margin:0 auto 40px;line-height:1.8}
.hero-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.hero-note{font-size:13px;color:hsl(var(--text-500));margin-top:16px}
.hero.sub{text-align:center;padding:80px 32px 40px}
.hero.sub h1{font-size:clamp(32px,5vw,48px)}

/* Page header */
.page-header{text-align:center;padding:80px 32px 40px}
.page-header .section-eyebrow{margin-bottom:12px}
.page-header h1{font-family:var(--font-display);font-size:clamp(32px,5vw,48px);font-weight:300;line-height:1.15;color:hsl(var(--text-000));letter-spacing:-.03em;margin-bottom:12px}
.page-header h1 strong{font-weight:500;color:hsl(var(--accent-000))}
.page-header p{font-size:15px;color:hsl(var(--text-400));max-width:480px;margin:0 auto}

/* Section headers */
.section-eyebrow{font-size:11px;font-weight:500;color:hsl(var(--accent-000));letter-spacing:.12em;text-transform:uppercase;margin-bottom:12px}
.section-title{font-family:var(--font-display);font-size:clamp(30px,4vw,40px);font-weight:300;color:hsl(var(--text-000));line-height:1.2;letter-spacing:-.03em;margin-bottom:48px}
.section-title strong{font-weight:500;color:hsl(var(--text-000))}

/* Two-column narrative */
.narrative-row{display:grid;grid-template-columns:1fr 1fr;gap:64px;margin-bottom:80px;align-items:start}
.narrative-row:last-child{margin-bottom:0}
.narrative-caption{font-size:12px;font-weight:500;color:hsl(var(--text-500));letter-spacing:.08em;text-transform:uppercase;margin-bottom:12px}
.narrative-heading{font-family:var(--font-display);font-size:clamp(18px,2vw,24px);font-weight:400;color:hsl(var(--text-000));line-height:1.3;letter-spacing:-.02em;margin-bottom:12px;transition:color var(--anim-fast)}
.narrative-row:hover .narrative-heading{color:hsl(var(--accent-000))}
.narrative-text{font-size:15px;color:hsl(var(--text-400));line-height:1.8}
.narrative-divider{width:32px;height:1px;background:hsl(var(--accent-000)/0.4);margin:24px 0;transition:width .4s}
.narrative-row:hover .narrative-divider{width:64px}

/* Pull quote */
.pull-quote{padding:48px 0;margin:80px 0;border-top:0.5px solid hsl(var(--border-300)/0.08);border-bottom:0.5px solid hsl(var(--border-300)/0.08);position:relative}
.pull-quote::before{content:'';position:absolute;top:-1px;left:50%;transform:translateX(-50%);width:0;height:0.5px;background:hsl(var(--accent-000)/0.3);transition:width var(--anim-slow)}
.pull-quote.in::before{width:120px}
.pull-quote blockquote{font-family:var(--font-display);font-size:clamp(22px,3vw,30px);font-weight:300;font-style:italic;color:hsl(var(--text-200));line-height:1.4;letter-spacing:-.02em;text-align:center;max-width:640px;margin:0 auto;transition:color var(--anim-slow)}
.pull-quote:hover blockquote{color:hsl(var(--text-000))}
.pull-quote cite{display:block;font-family:var(--font-sans);font-size:13px;font-style:normal;color:hsl(var(--text-500));margin-top:16px;letter-spacing:.03em}

/* Visual divider */
.visual-divider{width:100%;height:0.5px;background:hsl(var(--border-300)/0.06);margin:0}

/* Pricing — timeline hierarchy with visual accents */
.pricing-stack{max-width:520px;margin:0 auto 16px;position:relative}
.pricing-stack::before{content:'';position:absolute;left:12px;top:20px;bottom:20px;width:1px;background:linear-gradient(to bottom,hsl(var(--border-300)/0.2),hsl(var(--accent-000)/0.08),hsl(var(--border-300)/0.1));border-radius:1px}
.pricing-block{position:relative;padding:28px 0 28px 44px;transition:padding var(--anim-med)}
.pricing-block::before{content:'';position:absolute;left:7px;top:34px;width:11px;height:11px;border-radius:50%;background:hsl(var(--bg-300));border:1.5px solid hsl(var(--border-300)/0.15);z-index:1;transition:background var(--anim-med),border-color var(--anim-med),box-shadow var(--anim-med)}
.pricing-block:hover::before{background:hsl(var(--accent-900));border-color:hsl(var(--accent-000)/0.5);box-shadow:0 0 12px hsl(var(--accent-000)/0.15)}
.pricing-block:first-child::before{background:hsl(var(--text-500)/0.3);border-color:hsl(var(--text-500)/0.15)}
.pricing-block.premium{padding-left:48px}
.pricing-block.premium::before{width:15px;height:15px;left:6px;top:36px;background:hsl(var(--accent-000));border-color:hsl(var(--accent-000)/0.4);box-shadow:0 0 16px hsl(var(--accent-000)/0.2)}
.pricing-block.premium:hover::before{box-shadow:0 0 24px hsl(var(--accent-000)/0.35)}
.pricing-block:last-child,.pricing-block:first-child{border-bottom:none}
.pricing-block-badge{display:inline-flex;font-size:9px;font-weight:600;text-transform:uppercase;letter-spacing:.08em;padding:3px 12px;border-radius:3px;background:linear-gradient(135deg,hsl(var(--accent-000)/0.15),hsl(var(--accent-000)/0.08));color:hsl(var(--accent-000));margin-bottom:12px;border:0.5px solid hsl(var(--accent-000)/0.1)}
.pricing-block-top{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:10px}
.pricing-block-name{font-family:var(--font-display);font-size:26px;font-weight:400;color:hsl(var(--text-000));letter-spacing:-.02em;line-height:1.15;margin-bottom:2px;transition:color var(--anim-fast)}
.pricing-block:hover .pricing-block-name{color:hsl(var(--accent-000))}
.pricing-block.premium .pricing-block-name{color:hsl(var(--accent-000));font-size:28px}
.pricing-block.premium:hover .pricing-block-name{color:hsl(var(--brand-100))}
.pricing-block-price{font-size:15px;font-weight:300;color:hsl(var(--text-400));margin-top:4px}
.pricing-block-price strong{font-weight:500;font-size:22px;color:hsl(var(--text-000));transition:color var(--anim-fast)}
.pricing-block:hover .pricing-block-price strong{color:hsl(var(--accent-000))}
.pricing-block-price span{font-size:13px;color:hsl(var(--text-500))}
.pricing-block-tags{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:6px}
.pricing-block-tag{font-size:11px;padding:3px 12px;border-radius:999px;border:0.5px solid hsl(var(--border-300)/0.08);color:hsl(var(--text-400));background:hsl(var(--bg-300)/0.3);transition:border-color var(--anim-fast),color var(--anim-fast),background var(--anim-fast)}
.pricing-block:hover .pricing-block-tag{border-color:hsl(var(--border-300)/0.2);color:hsl(var(--text-300));background:hsl(var(--bg-200)/0.5)}
.pricing-block-tag:hover{border-color:hsl(var(--accent-000)/0.25)!important;color:hsl(var(--accent-000))!important;background:hsl(var(--accent-900)/0.3)!important}
.pricing-block-annual{font-size:11px;color:hsl(var(--text-500));display:block;margin-top:4px;font-style:italic}
.pricing-note{text-align:center;font-size:12px;color:hsl(var(--text-500));margin-top:16px}

/* Comparison table — clean, no card */
.pricing-compare{margin-top:48px}
.pricing-compare h3{font-family:var(--font-display);font-size:20px;font-weight:400;color:hsl(var(--text-000));margin-bottom:20px;text-align:center;letter-spacing:-.02em}
.compare-table{width:100%;border-collapse:collapse;font-size:13px}
.compare-table th,.compare-table td{padding:12px 16px;text-align:left;border-bottom:0.5px solid hsl(var(--border-300)/0.06)}
.compare-table tr:last-child td{border-bottom:none}
.compare-table th{font-size:11px;font-weight:600;color:hsl(var(--text-500));text-transform:uppercase;letter-spacing:.05em}
.compare-table td{color:hsl(var(--text-400))}
.compare-table td:first-child{font-weight:500;color:hsl(var(--text-100))}

/* FAQ */
.faq-list{max-width:640px;margin:0 auto}
.faq-item{border-bottom:0.5px solid hsl(var(--border-300)/0.06);padding:0;overflow:hidden}
.faq-q{width:100%;background:none;border:none;padding:18px 0;font-size:15px;font-weight:500;color:hsl(var(--text-100));text-align:left;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:16px;font-family:inherit;transition:color var(--anim-fast)}
.faq-q:hover{color:hsl(var(--accent-000))}
.faq-q svg{width:14px;height:14px;flex-shrink:0;color:hsl(var(--text-500));transition:transform var(--anim-med)}
.faq-item.open .faq-q svg{transform:rotate(180deg)}
.faq-a{padding:0 0 18px;font-size:14px;color:hsl(var(--text-400));line-height:1.7;display:none}
.faq-item.open .faq-a{display:block;animation:faqIn var(--anim-med) var(--ease-out)}
@keyframes faqIn{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}

/* Feature list — diamond-bullet vertical hierarchy */
.feat-list{max-width:580px;margin:0 auto;position:relative}
.feat-list::before{content:'';position:absolute;left:7px;top:18px;bottom:18px;width:0.5px;background:linear-gradient(to bottom,transparent,hsl(var(--accent-000)/0.08),transparent)}
.feat-item{display:flex;gap:16px;padding:20px 0;align-items:flex-start;position:relative;transition:padding var(--anim-fast)}
.feat-item:hover{padding-left:12px}
.feat-bullet{width:8px;height:8px;flex-shrink:0;margin-top:7px;border:1px solid hsl(var(--accent-000)/0.3);background:hsl(var(--bg-200));transform:rotate(45deg);border-radius:1.5px;transition:background var(--anim-fast),border-color var(--anim-fast),transform var(--anim-fast)}
.feat-item:hover .feat-bullet{background:hsl(var(--accent-000)/0.15);border-color:hsl(var(--accent-000)/0.6);transform:rotate(135deg)}
.feat-item-title{font-size:16px;font-weight:500;color:hsl(var(--text-100));margin-bottom:4px;letter-spacing:-.01em;transition:color var(--anim-fast)}
.feat-item:hover .feat-item-title{color:hsl(var(--accent-000))}
.feat-item-desc{font-size:14px;color:hsl(var(--text-400));line-height:1.7}

/* Guide */
.guide-steps{max-width:600px;margin:0 auto}
.guide-step{display:flex;gap:20px;padding:32px 0;border-bottom:0.5px solid hsl(var(--border-300)/0.06);transition:transform var(--anim-fast)}
.guide-step:hover{transform:translateX(4px)}
.guide-step:last-child{border-bottom:none}
.guide-step-num{flex-shrink:0;width:34px;height:34px;border-radius:50%;border:0.5px solid hsl(var(--accent-000)/0.3);color:hsl(var(--accent-000));display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:500;font-family:var(--font-display);margin-top:2px;transition:background var(--anim-fast),color var(--anim-fast)}
.guide-step:hover .guide-step-num{background:hsl(var(--accent-900));color:hsl(var(--accent-000))}
.guide-step h3{font-size:16px;font-weight:500;color:hsl(var(--text-100));margin-bottom:4px}
.guide-step p{font-size:14px;color:hsl(var(--text-400));line-height:1.7}

/* Contact — vertical blocks with accent bars */
.contact-stack{max-width:520px;margin:0 auto}
.contact-block{position:relative;padding:28px 0 28px 24px;border-bottom:0.5px solid hsl(var(--border-300)/0.06);transition:padding var(--anim-fast)}
.contact-block:last-child{border-bottom:none}
.contact-block::before{content:'';position:absolute;left:0;top:24px;bottom:24px;width:2px;background:linear-gradient(to bottom,hsl(var(--accent-000)/0.25),transparent);border-radius:2px;transition:opacity var(--anim-fast)}
.contact-block:hover::before{opacity:0.7}
.contact-block-label{font-size:11px;font-weight:500;color:hsl(var(--text-500));text-transform:uppercase;letter-spacing:.06em;margin-bottom:6px}
.contact-block-email{font-size:22px;font-weight:500;margin-bottom:6px}
.contact-block-email a{color:hsl(var(--text-000));transition:color var(--anim-fast)}
.contact-block-email a:hover{color:hsl(var(--accent-000))}
.contact-block-desc{font-size:13px;color:hsl(var(--text-500));line-height:1.7}
.contact-note{text-align:center;margin-top:40px;font-size:13px;color:hsl(var(--text-500));line-height:1.7}

/* CTA */
.cta-section{text-align:center;padding:100px 32px 120px}
.cta-section h2{font-family:var(--font-display);font-size:clamp(30px,4vw,38px);font-weight:300;color:hsl(var(--text-000));margin-bottom:12px;letter-spacing:-.03em}
.cta-section h2 strong{font-weight:500;color:hsl(var(--accent-000))}
.cta-section p{color:hsl(var(--text-400));margin-bottom:28px;font-size:15px}
.cta-section .cta-btn{font-size:15px;padding:14px 32px}

/* Footer */
footer{padding:48px 32px 56px;border-top:0.5px solid hsl(var(--border-300)/0.06)}
.footer-inner{max-width:960px;margin:0 auto;display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:32px}
.footer-brand .footer-tag{font-family:var(--font-display);font-size:18px;color:hsl(var(--text-000));margin-bottom:8px}
.footer-brand .footer-tag em{font-style:italic;color:hsl(var(--accent-000))}
.footer-brand p{font-size:12px;color:hsl(var(--text-500));line-height:1.6;max-width:240px}
.footer-col-title{font-size:11px;font-weight:600;color:hsl(var(--text-400));text-transform:uppercase;letter-spacing:.06em;margin-bottom:12px}
.footer-col{display:flex;flex-direction:column;gap:8px}
.footer-col a{font-size:13px;color:hsl(var(--text-500));transition:color var(--anim-fast),transform var(--anim-fast);display:inline-block}
.footer-col a:hover{color:hsl(var(--text-300));transform:translateX(2px)}
.footer-bottom{grid-column:1/-1;border-top:0.5px solid hsl(var(--border-300)/0.06);padding-top:20px;margin-top:8px;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px}
.footer-bottom p{font-size:11px;color:hsl(var(--text-500))}

/* Responsive — stacked on mobile */
@media(max-width:720px){
  nav{padding:16px 20px}
  .nav-links a:not(.cta-btn){display:none}
  .hero{padding:100px 20px 60px}
  .hero h1{font-size:clamp(36px,10vw,48px)}
  .page-header{padding:60px 20px 32px}
  section{padding:64px 20px}
  .narrative-row{grid-template-columns:1fr;gap:24px;margin-bottom:48px}
  .pricing-block.premium{padding-left:0}
  .pricing-compare{overflow-x:auto}
  .cta-section{padding:64px 20px 80px}
  footer{padding:32px 20px 40px}
  .footer-inner{grid-template-columns:1fr 1fr}
}