*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html:focus-within{scroll-behavior:smooth}
body{min-height:100vh;text-rendering:optimizeSpeed;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
img,picture,video,canvas,svg{display:block;max-width:100%}
input,button,textarea,select{font:inherit}
p,h1,h2,h3,h4,h5,h6{overflow-wrap:break-word}
ul,ol{list-style:none}
a{text-decoration:none;color:inherit}
button{cursor:pointer;border:none;background:none}
:root{
--color-primary:#6366f1;
--color-primary-hover:#4f46e5;
--color-primary-light:rgba(99,102,241,0.1);
--color-primary-glow:rgba(99,102,241,0.25);
--color-secondary:#22d3ee;
--color-secondary-hover:#06b6d4;
--color-bg:#0d1117;
--color-bg-elevated:#11161d;
--color-bg-card:#161c25;
--color-bg-card-hover:#1b2230;
--color-text:#e2e8f0;
--color-text-muted:#94a3b8;
--color-text-heading:#f1f5f9;
--color-border:rgba(148, 163, 184, 0.09);
--color-border-light:#3d3d6e;
--color-success:#22c55e;
--color-error:#ef4444;
--color-warning:#f59e0b;
--font-sans:'Inter',system-ui,-apple-system,sans-serif;
--font-mono:'JetBrains Mono','Fira Code',monospace;
--space-1:0.25rem;
--space-2:0.5rem;
--space-3:0.75rem;
--space-4:1rem;
--space-5:1.25rem;
--space-6:1.5rem;
--space-8:2rem;
--space-10:2.5rem;
--space-12:3rem;
--space-14:3.5rem;
--space-16:4rem;
--space-20:5rem;
--space-24:6rem;
--space-48:12rem;
--radius-sm:0.375rem;
--radius-md:0.5rem;
--radius-lg:0.75rem;
--radius-xl:1rem;
--radius-2xl:1.5rem;
--shadow-sm:0 1px 2px rgba(0,0,0,0.3);
--shadow-md:0 4px 6px rgba(0,0,0,0.3);
--shadow-lg:0 10px 15px rgba(0,0,0,0.3);
--shadow-xl:0 20px 25px rgba(0,0,0,0.4);
--shadow-glow:0 0 20px var(--color-primary-glow);
--transition:200ms ease;
--transition-slow:400ms ease;
--max-width:1200px;
--navbar-height:64px
}
@media(prefers-reduced-motion:no-preference){
:root{--transition:200ms ease}
}
body{font-family:var(--font-sans);font-size:1rem;line-height:1.6;color:var(--color-text);background:var(--color-bg)}
h1,h2,h3,h4,h5,h6{color:var(--color-text-heading);font-weight:600;line-height:1.3}
h1{font-size:2.5rem;letter-spacing:-0.02em}
h2{font-size:2rem;letter-spacing:-0.01em}
h3{font-size:1.25rem}
h4{font-size:1.125rem}
p{margin-bottom:1rem}
a{color:var(--color-primary);transition:color var(--transition)}
a:hover{color:var(--color-primary-hover)}
small,.text-sm{font-size:0.875rem}
.text-muted{color:var(--color-text-muted)}
code{font-family:var(--font-mono);font-size:0.875em;background:var(--color-bg-elevated);padding:0.125rem 0.375rem;border-radius:var(--radius-sm)}
@media(min-width:768px){
h1{font-size:3.5rem}
h2{font-size:2.5rem}
h3{font-size:1.5rem}
}
.page-width{width:100%;max-width:var(--max-width);margin:0 auto;padding:0 var(--space-6)}
@media(min-width:768px){
.page-width{padding:0 var(--space-8)}
}
.page{padding-top:calc(var(--navbar-height) + var(--space-8));padding-bottom:var(--space-16)}
.page-title{text-align:center;margin-bottom:var(--space-3)}
.page-lead{text-align:center;color:var(--color-text-muted);font-size:1.125rem;max-width:640px;margin:0 auto var(--space-12)}
.page-content{max-width:720px;margin:0 auto;line-height:1.8}
.page-content h2{margin-top:var(--space-10);margin-bottom:var(--space-4)}
.page-content p{margin-bottom:var(--space-4)}
@media(min-width:768px){
.page{padding-top:calc(var(--navbar-height) + var(--space-12));padding-bottom:var(--space-20)}
}
.navbar{position:fixed;top:0;left:0;right:0;z-index:1000;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom:1px solid var(--color-border);height:var(--navbar-height);transition:transform var(--transition)}
.navbar.hidden{transform:translateY(-100%)}
.nav-inner{display:flex;align-items:center;height:100%;gap:var(--space-8)}
.nav-logo{display:flex;align-items:center;gap:var(--space-2);font-weight:700;font-size:1.125rem;color:var(--color-text-heading)}
.nav-logo img{width:28px;height:28px;border-radius:var(--radius-sm)}
.nav-links{display:none;gap:var(--space-1)}
.nav-link{padding:var(--space-2) var(--space-3);border-radius:var(--radius-md);color:var(--color-text-muted);font-size:0.9375rem;transition:color var(--transition),background var(--transition)}
.nav-link:hover,.nav-link[aria-current=page]{color:var(--color-text-heading);background:var(--color-primary-light)}
.nav-actions{display:none;align-items:center;gap:var(--space-3);margin-left:auto}
.mobile-menu-toggle{display:flex;align-items:center;justify-content:center;width:40px;height:40px;margin-left:auto;color:var(--color-text);border-radius:var(--radius-md)}
.mobile-menu-toggle svg{width:24px;height:24px}
.mobile-menu{display:none;position:fixed;top:var(--navbar-height);left:0;right:0;background:var(--color-bg-elevated);border-bottom:1px solid var(--color-border);padding:var(--space-4) var(--space-6);flex-direction:column;gap:var(--space-1);z-index:999}
.mobile-menu.open{display:flex}
.mobile-menu .nav-link{display:block;padding:var(--space-3) var(--space-4);font-size:1rem}
.mobile-menu .nav-actions{display:contents;margin-top:var(--space-4)}
@media(min-width:768px){
.nav-links{display:flex}.nav-actions{display:flex}.mobile-menu-toggle{display:none}.mobile-menu{display:none!important}
}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);font-weight:600;font-size:0.9375rem;padding:var(--space-3) var(--space-6);border-radius:var(--radius-lg);transition:all var(--transition);white-space:nowrap}
.btn:active{transform:scale(0.97)}
.btn-primary{background:var(--color-primary);color:#fff}
.btn-primary:hover{background:var(--color-primary-hover);box-shadow:var(--shadow-glow);color:#fff}
.btn-secondary{background:transparent;border:1px solid var(--color-border);color:var(--color-text-heading)}
.btn-secondary:hover{border-color:var(--color-primary);color:var(--color-primary)}
.btn-ghost{background:transparent;color:var(--color-text-muted)}
.btn-ghost:hover{background:var(--color-primary-light);color:var(--color-primary)}
.btn-lg{padding:var(--space-4) var(--space-8);font-size:1.0625rem;border-radius:var(--radius-xl)}
.btn-sm{padding:var(--space-2) var(--space-4);font-size:0.875rem}
.btn-block{width:100%}
.skip-link{position:absolute;top:-100%;left:var(--space-4);padding:var(--space-2) var(--space-4);background:var(--color-primary);color:#fff;border-radius:var(--radius-md);z-index:9999;font-weight:600;font-size:0.875rem}
.skip-link:focus{top:var(--space-4)}
.hero{position:relative;min-height:100vh;display:flex;align-items:center;overflow:hidden;padding-top:calc(var(--navbar-height) + var(--space-8))}
.hero-bg-animated{position:absolute;inset:0;background:radial-gradient(ellipse at 20% 50%,var(--color-primary-light) 0%,transparent 50%),radial-gradient(ellipse at 80% 50%,rgba(34,211,238,0.08) 0%,transparent 50%);background-blend-mode:overlay;z-index:0;animation:gradientShift 15s ease infinite;background-size:200% 200%}
.candles-layer{position:absolute;inset:0;width:100%;height:100%;display:block;pointer-events:none;z-index:0}
#candles-back{filter:blur(3px)}
.hero-fade{position:absolute;inset:0;pointer-events:none;z-index:0;background:linear-gradient(to bottom,var(--color-bg) 0%,transparent 16%,transparent 78%,var(--color-bg) 100%)}
.hero-grid{position:relative;z-index:1;display:grid;gap:var(--space-10);align-items:center}
.hero-title{font-size:2.25rem;margin-bottom:var(--space-4);background:linear-gradient(135deg,var(--color-text-heading),var(--color-primary));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.hero-subtitle{font-size:1.125rem;color:var(--color-text-muted);max-width:540px;margin-bottom:var(--space-8);line-height:1.7}
.hero-actions{display:flex;flex-wrap:wrap;gap:var(--space-4)}
.hero-visual{display:none}
.hero-screenshot{width:100%;border-radius:var(--radius-xl);box-shadow:var(--shadow-xl);border:1px solid var(--color-border)}
@media(min-width:768px){
.hero-title{font-size:3.5rem}
.hero-subtitle{font-size:1.25rem}
}
@media(min-width:1024px){
.hero-grid{grid-template-columns:1fr 1fr;gap:var(--space-16)}
.hero-visual{display:block}
.hero{padding-top:calc(var(--navbar-height) + var(--space-12))}
}
.card-hover{transition:transform var(--transition),box-shadow var(--transition),background var(--transition);background:var(--color-bg-card);border:1px solid var(--color-border);border-radius:var(--radius-xl);padding:var(--space-8)}
.card-hover:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg);border-color:var(--color-border-light);background:var(--color-bg-card-hover)}
.edge-section{padding:var(--space-16) 0}
.section-title{text-align:center;margin-bottom:var(--space-3)}
.section-lead{text-align:center;color:var(--color-text-muted);font-size:1.125rem;max-width:600px;margin:0 auto var(--space-10)}
.process-flow{display:flex;flex-direction:column;gap:0;position:relative}
.process-node{text-align:center;padding:var(--space-6) var(--space-4);background:var(--color-bg-card);border:1px solid var(--color-border);border-radius:var(--radius-xl);position:relative;transition:transform var(--transition),box-shadow var(--transition),border-color var(--transition)}
.process-node:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg);border-color:var(--color-primary)}
.process-icon{font-size:2rem;margin-bottom:var(--space-3);line-height:1}
.process-title{margin-bottom:var(--space-2);font-size:1.0625rem}
.process-desc{color:var(--color-text-muted);font-size:0.875rem;line-height:1.7;margin-bottom:0}
.process-connector{width:2px;height:28px;background:linear-gradient(to bottom,var(--color-primary),var(--color-primary-hover));margin:0 auto;opacity:0.25;position:relative;flex-shrink:0}
.process-connector::after{content:"";position:absolute;bottom:-4px;left:50%;transform:translateX(-50%);border:5px solid transparent;border-top-color:var(--color-primary);opacity:0.25}
@media(min-width:768px){
.process-flow{flex-direction:row;align-items:stretch}
.process-node{flex:1;padding:var(--space-8) var(--space-5);display:flex;flex-direction:column;justify-content:center}
.process-node+.process-node{margin-left:0}
.process-connector{width:48px;height:2px;margin:auto 0;background:linear-gradient(to right,var(--color-primary),var(--color-primary-hover));opacity:0.25;align-self:center}
.process-connector::after{content:"";position:absolute;right:-4px;top:50%;transform:translateY(-50%);border:5px solid transparent;border-left-color:var(--color-primary);opacity:0.25;bottom:auto;left:auto}
}
@media(min-width:1024px){
.process-flow{max-width:1100px;margin:0 auto}
}
.timeline{position:relative;max-width:900px;margin:0 auto;padding:var(--space-4) 0}
.timeline::before{content:"";position:absolute;left:28px;top:0;bottom:0;width:2px;background:linear-gradient(to bottom,var(--color-primary),transparent);opacity:0.2}
.timeline-item{position:relative;padding-left:72px;padding-bottom:var(--space-10)}
.timeline-item:last-child{padding-bottom:0}
.timeline-marker{position:absolute;left:12px;top:6px;width:34px;height:34px;border-radius:50%;background:var(--color-bg-card);border:2px solid var(--color-primary);display:flex;align-items:center;justify-content:center;font-size:0.875rem;font-weight:700;color:var(--color-primary);z-index:1;transition:background var(--transition),color var(--transition),box-shadow var(--transition)}
.timeline-item:hover .timeline-marker{background:var(--color-primary);color:#fff;box-shadow:0 0 0 4px var(--color-primary-light)}
.timeline-content{background:var(--color-bg-card);border:1px solid var(--color-border);border-radius:var(--radius-xl);padding:var(--space-6);transition:transform var(--transition),box-shadow var(--transition),border-color var(--transition)}
.timeline-content:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg);border-color:var(--color-border-light)}
.timeline-content h3{font-size:1.0625rem;margin-bottom:var(--space-2)}
.timeline-content p{color:var(--color-text-muted);font-size:0.9375rem;line-height:1.7;margin-bottom:0}
@media(min-width:768px){
.timeline{padding:var(--space-8) 0}
.timeline::before{left:50%;transform:translateX(-50%)}
.timeline-item{padding-left:0;width:50%}
.timeline-item:nth-child(odd){padding-right:calc(var(--space-10) + 20px);text-align:right;margin-left:0}
.timeline-item:nth-child(even){margin-left:50%;padding-left:calc(var(--space-10) + 20px)}
.timeline-item:nth-child(odd) .timeline-marker{right:-17px;left:auto}
.timeline-item:nth-child(even) .timeline-marker{left:-17px}
.timeline-content{text-align:left}
}
@media(min-width:1024px){
.timeline-item:nth-child(odd){padding-right:calc(var(--space-16) + 20px)}
.timeline-item:nth-child(even){padding-left:calc(var(--space-16) + 20px)}
}
.comparison{max-width:900px;margin:0 auto}
.comparison-grid{display:grid;grid-template-columns:1fr;gap:var(--space-3)}
.comparison-row{display:grid;grid-template-columns:1fr 1fr 1fr;gap:var(--space-3);align-items:center;padding:var(--space-4) var(--space-5);background:var(--color-bg-card);border:1px solid var(--color-border);border-radius:var(--radius-lg);transition:transform var(--transition),box-shadow var(--transition)}
.comparison-row:hover{transform:translateY(-2px);box-shadow:var(--shadow-md)}
.comparison-header{background:transparent;border-color:transparent;cursor:default}
.comparison-header:hover{transform:none;box-shadow:none}
.comparison-label{font-weight:500;font-size:0.9375rem;color:var(--color-text-heading)}
.comparison-header .comparison-label{font-weight:600;font-size:1rem}
.comparison-cell{font-size:0.9375rem;padding:var(--space-1) var(--space-2);border-radius:var(--radius-md)}
.comparison-cell.positive{color:var(--color-success);font-weight:600}
.comparison-cell.positive::before{content:"\2713";margin-right:var(--space-1)}
.comparison-cell.negative{color:var(--color-text-muted)}
.comparison-cell.negative::before{content:"\2717";margin-right:var(--space-1)}
.comparison-header .comparison-cell{font-weight:600;color:var(--color-text-heading)}
.comparison-header .comparison-cell::before{content:"";margin:0}
@media(max-width:639px){
.comparison-row{display:flex;flex-flow: column;gap:var(--space-2);padding:var(--space-3) var(--space-4)}
.comparison-cell{width:100%;font-size:0.8125rem;padding:var(--space-1)}
.comparison-header{display:none}
}
.staircase{max-width:800px;margin:0 auto}
.staircase-step{display:grid;grid-template-columns:auto 1fr;gap:var(--space-5);padding:var(--space-5) 0;position:relative;border-bottom:1px solid var(--color-border)}
.staircase-step:last-child{border-bottom:none}
.staircase-visual{display:flex;flex-direction:column;align-items:flex-end;gap:var(--space-2);padding-right:var(--space-5);border-right:3px solid;padding-top:var(--space-1)}
.staircase-dot{width:16px;height:16px;border-radius:50%;flex-shrink:0;margin-top:3px}
.staircase-bar{width:100%;height:4px;border-radius:2px;transition:width var(--transition)}
.staircase-step-info{display:flex;flex-direction:column;gap:var(--space-1)}
.staircase-step-info h3{font-size:1.125rem;font-weight:700;margin:0}
.staircase-step-info p{color:var(--color-text-muted);font-size:0.9375rem;line-height:1.7;margin:0}
.staircase-step.level-easy .staircase-visual{border-color:var(--color-success)}
.staircase-step.level-easy .staircase-dot{background:var(--color-success)}
.staircase-step.level-easy .staircase-bar{background:var(--color-success)}
.staircase-step.level-easy h3{color:var(--color-success)}
.staircase-step.level-medium .staircase-visual{border-color:var(--color-warning)}
.staircase-step.level-medium .staircase-dot{background:var(--color-warning)}
.staircase-step.level-medium .staircase-bar{background:var(--color-warning)}
.staircase-step.level-medium h3{color:var(--color-warning)}
.staircase-step.level-hard .staircase-visual{border-color:#f97316}
.staircase-step.level-hard .staircase-dot{background:#f97316}
.staircase-step.level-hard .staircase-bar{background:#f97316}
.staircase-step.level-hard h3{color:#f97316}
.staircase-step.level-expert .staircase-visual{border-color:var(--color-error)}
.staircase-step.level-expert .staircase-dot{background:var(--color-error)}
.staircase-step.level-expert .staircase-bar{background:var(--color-error)}
.staircase-step.level-expert h3{color:var(--color-error)}
.staircase-step.level-easy .staircase-bar{width:100%}
.staircase-step.level-medium .staircase-bar{width:75%}
.staircase-step.level-hard .staircase-bar{width:50%}
.staircase-step.level-expert .staircase-bar{width:25%}
@media(min-width:640px){
.staircase-step{padding:var(--space-6) 0}
.staircase-visual{padding-right:var(--space-8)}
.staircase-step-info h3{font-size:1.25rem}
}
@media(min-width:768px){
.staircase-step{grid-template-columns:auto 1fr;gap:var(--space-8)}
}
.stats-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--space-6);padding:var(--space-12) var(--space-6);max-width:var(--max-width);margin:0 auto;position:relative;z-index:1}
.stat-item{text-align:center}
.stat-number{display:block;font-size:2rem;font-weight:700;color:var(--color-primary);line-height:1.2}
.stat-label{display:block;font-size:0.875rem;color:var(--color-text-muted);margin-top:var(--space-1)}
@media(min-width:768px){
.stats-grid{grid-template-columns:repeat(4,1fr);padding:var(--space-16) var(--space-8)}
.stat-number{font-size:2.5rem}
}
.pricing-toggle{display:flex;justify-content:center;gap:var(--space-1);margin-bottom:var(--space-8);background:var(--color-bg-elevated);padding:var(--space-1);border-radius:var(--radius-lg);border:1px solid var(--color-border);max-width:320px;margin-left:auto;margin-right:auto}
.toggle-btn{padding:var(--space-2) var(--space-5);border-radius:var(--radius-md);font-size:0.9375rem;font-weight:500;color:var(--color-text-muted);transition:all var(--transition);cursor:pointer}
.toggle-btn.active{background:var(--color-primary);color:#fff}
.toggle-save{display:none;font-size:0.75rem;font-weight:600;color:var(--color-success);margin-left:var(--space-1);vertical-align:middle}
.toggle-btn.active .toggle-save{display:none}
.toggle-btn[data-period="yearly"] .toggle-save{display:inline}
.pricing-grid{display:grid;gap:var(--space-6);grid-template-columns:1fr;max-width:1100px;margin:0 auto}
.pricing-card{position:relative;padding:var(--space-6);background:var(--color-bg-card);border:1px solid var(--color-border);border-radius:var(--radius-xl);text-align:center;transition:transform var(--transition),box-shadow var(--transition),background var(--transition);display:flex;flex-direction:column}
.pricing-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg);border-color:var(--color-border-light);background:var(--color-bg-card-hover)}
.pricing-featured{border-color:var(--color-primary);background:var(--color-bg-elevated)}
.pricing-featured:hover{border-color:var(--color-primary-hover)}
.pricing-badge{position:absolute;top:-12px;left:50%;transform:translateX(-50%);background:var(--color-primary);color:#fff;font-size:0.75rem;font-weight:700;padding:var(--space-1) var(--space-4);border-radius:999px;text-transform:uppercase;letter-spacing:0.05em}
.pricing-name{font-size:1.125rem;margin-bottom:var(--space-2)}
.pricing-amount{font-size:2.25rem;font-weight:700;color:var(--color-text-heading);line-height:1.1}
.pricing-period{color:var(--color-text-muted);font-size:0.8125rem;margin-bottom:var(--space-6);min-height:1.25rem}
.yearly-note{color:var(--color-success);font-size:0.75rem;font-weight:600;display:block;margin-top:var(--space-1)}
.pricing-features{text-align:left;margin-bottom:var(--space-6);flex:1}
.pricing-features li{padding:var(--space-1) 0;color:var(--color-text-muted);font-size:0.875rem;white-space:nowrap;}
.pricing-features li::before{content:"\2713";color:var(--color-success);margin-right:var(--space-2);font-weight:700}
@media(min-width:640px){
.pricing-grid{grid-template-columns:repeat(2,1fr)}
.pricing-card{padding:var(--space-8)}
.pricing-amount{font-size:2.75rem}
}
@media(min-width:1024px){
.pricing-grid{grid-template-columns:repeat(4,1fr)}
.pricing-amount{font-size:2.25rem}
}
.cta-section{text-align:center;padding:var(--space-16) var(--space-6);position:relative;z-index:1}
.cta-headline{font-size:2rem;margin-bottom:var(--space-3)}
.cta-lead{color:var(--color-text-muted);font-size:1.125rem;margin-bottom:var(--space-6);max-width:500px;margin-left:auto;margin-right:auto}
@media(min-width:768px){
.cta-section{padding:var(--space-48) var(--space-8)}
.cta-headline{font-size:2.5rem}
}
.faq-list{max-width:720px;margin:0 auto;display:flex;flex-direction:column;gap:var(--space-3)}
.faq-category{font-size:1.125rem;margin:var(--space-8) 0 var(--space-4);padding-top:var(--space-4);border-top:1px solid var(--color-border)}
.screenshots-grid{display:grid;gap:var(--space-6);grid-template-columns:1fr}
.screenshot-card{background:var(--color-bg-card);border:1px solid var(--color-border);border-radius:var(--radius-xl);overflow:hidden;transition:transform var(--transition),box-shadow var(--transition)}
.screenshot-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg);border-color:var(--color-border-light)}
.screenshot-card img{display:block;width:100%;height:auto}
.screenshot-card figcaption{padding:var(--space-4) var(--space-6);color:var(--color-text-muted);font-size:0.875rem;text-align:center}
.screenshots-cta{text-align:center;margin-top:var(--space-6)}
.accordion{border:1px solid var(--color-border);border-radius:var(--radius-lg);overflow:hidden;background:var(--color-bg-card);transition:border-color var(--transition)}
.accordion.open{border-color:var(--color-primary)}
.accordion-btn{display:flex;align-items:center;justify-content:space-between;width:100%;padding:var(--space-5) var(--space-6);text-align:left;font-size:1rem;font-weight:600;color:var(--color-text-heading);background:none;gap:var(--space-4)}
.accordion-btn svg{flex-shrink:0;transition:transform var(--transition);color:var(--color-text-muted)}
.accordion.open .accordion-btn svg{transform:rotate(180deg)}
.accordion-panel{max-height:0;overflow:hidden;transition:max-height var(--transition-slow),padding var(--transition-slow)}
.accordion.open .accordion-panel{max-height:500px}
.accordion-panel-inner{padding:0 var(--space-6) var(--space-6)}
.accordion-panel-inner p:last-child{margin-bottom:0}
.form-group{margin-bottom:var(--space-5)}
.form-group label{display:block;color:var(--color-text-heading);font-weight:500;font-size:0.9375rem;margin-bottom:var(--space-2)}
.input,.form-group input,.form-group select,.form-group textarea{width:100%;padding:var(--space-3) var(--space-4);background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-md);color:var(--color-text);font-size:1rem;transition:border-color var(--transition),box-shadow var(--transition)}
.input:focus,.form-group input:focus,.form-group select:focus,.form-group textarea:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-primary-light)}
.form-row{display:grid;gap:var(--space-5)}
.form-status{padding:var(--space-3) var(--space-4);border-radius:var(--radius-md);font-size:0.9375rem;margin-bottom:var(--space-4)}
.form-status.error{background:rgba(239,68,68,0.1);color:var(--color-error);border:1px solid rgba(239,68,68,0.2)}
.form-status.success{background:rgba(34,197,94,0.1);color:var(--color-success);border:1px solid rgba(34,197,94,0.2)}
@media(min-width:640px){
.form-row{grid-template-columns:1fr 1fr}
}
.contact-grid{display:grid;gap:var(--space-10);max-width:900px;margin:0 auto}
.contact-form-wrap{order:1}
.contact-info{order:2}
.contact-info h2{margin-bottom:var(--space-6);font-size:1.25rem}
.contact-info-item{display:flex;gap:var(--space-4);margin-bottom:var(--space-6)}
.contact-info-item svg{width:24px;height:24px;color:var(--color-primary);flex-shrink:0;margin-top:2px}
.contact-info-item h3{font-size:1rem;margin-bottom:var(--space-1)}
.contact-info-item p{color:var(--color-text-muted);font-size:0.9375rem;margin-bottom:0}
.contact-info-item a{color:var(--color-primary)}
@media(min-width:768px){
.contact-grid{grid-template-columns:1fr 1fr}
}
.footer{background:var(--color-bg-elevated);border-top:1px solid var(--color-border);padding:var(--space-12) 0 var(--space-8);margin-top:var(--space-8)}
.footer-grid{display:grid;gap:var(--space-8);grid-template-columns:repeat(2,1fr);margin-bottom:var(--space-8)}
.footer-heading{font-size:0.875rem;text-transform:uppercase;letter-spacing:0.08em;color:var(--color-text-muted);margin-bottom:var(--space-4)}
.footer-column ul{display:flex;flex-direction:column;gap:var(--space-2)}
.footer-link{font-size:0.9375rem;color:var(--color-text-muted);transition:color var(--transition)}
.footer-link:hover{color:var(--color-primary)}
.footer-link-btn{background:none;border:none;cursor:pointer;font-size:0.9375rem;color:var(--color-text-muted);transition:color var(--transition);padding:0;text-align:left}
.footer-link-btn:hover{color:var(--color-primary)}
.footer-social{display:flex;gap:var(--space-3)}
.footer-social a{display:flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:var(--radius-md);background:var(--color-bg);color:var(--color-text-muted);transition:all var(--transition)}
.footer-social a:hover{background:var(--color-primary);color:#fff}
.footer-social svg{width:18px;height:18px}
.footer-bottom{text-align:center;padding-top:var(--space-8);border-top:1px solid var(--color-border);color:var(--color-text-muted);font-size:0.875rem}
.footer-version{opacity:0.5;font-size:0.75rem;font-family:var(--font-mono)}
@media(min-width:640px){
.footer-grid{grid-template-columns:repeat(3,1fr)}
}
@media(min-width:1024px){
.footer-grid{grid-template-columns:repeat(5,1fr)}
}
.cookie-banner{position:fixed;bottom:0;left:0;right:0;z-index:9000;background:var(--color-bg-elevated);border-top:1px solid var(--color-border);padding:var(--space-4) 0;box-shadow:0 -4px 20px rgba(0,0,0,0.3);display:none}
.cookie-banner.visible{display:block}
.cookie-banner-inner{display:flex;flex-direction:column;gap:var(--space-4)}
.cookie-banner-text p{font-size:0.9375rem;color:var(--color-text-muted);margin-bottom:0}
.cookie-banner-text a{color:var(--color-primary);text-decoration:underline}
.cookie-btn-group{display:flex;flex-wrap:wrap;gap:var(--space-3)}
.cookie-overlay{position:fixed;inset:0;z-index:8000;background:rgba(0,0,0,0.6);display:none}
.cookie-overlay.visible{display:block}
.cookie-preferences{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);z-index:9001;background:var(--color-bg-elevated);border:1px solid var(--color-border);border-radius:var(--radius-xl);padding:var(--space-8);max-width:540px;width:calc(100% - var(--space-8));max-height:80vh;overflow-y:auto;display:none}
.cookie-preferences.visible{display:block}
.cookie-preferences-inner h2{margin-bottom:var(--space-3)}
.cookie-preferences-inner>p{color:var(--color-text-muted);font-size:0.9375rem;margin-bottom:var(--space-6)}
.cookie-preference-item{display:flex;align-items:center;justify-content:space-between;gap:var(--space-4);padding:var(--space-4) 0;border-bottom:1px solid var(--color-border)}
.cookie-preference-item:last-child{border-bottom:none}
.cookie-preference-info h3{font-size:1rem;margin-bottom:var(--space-1)}
.cookie-preference-info p{color:var(--color-text-muted);font-size:0.875rem;margin-bottom:0}
.cookie-badge{font-size:0.75rem;font-weight:600;padding:var(--space-1) var(--space-3);border-radius:999px;white-space:nowrap}
.cookie-badge-always{background:var(--color-primary-light);color:var(--color-primary)}
.cookie-toggle{position:relative;width:44px;height:24px;flex-shrink:0;cursor:pointer}
.cookie-toggle input{position:absolute;opacity:0;width:0;height:0}
.cookie-toggle-slider{position:absolute;inset:0;background:var(--color-border);border-radius:999px;transition:background var(--transition)}
.cookie-toggle-slider::before{content:"";position:absolute;top:3px;left:3px;width:18px;height:18px;background:#fff;border-radius:50%;transition:transform var(--transition)}
.cookie-toggle input:checked+.cookie-toggle-slider{background:var(--color-primary)}
.cookie-toggle input:checked+.cookie-toggle-slider::before{transform:translateX(20px)}
.cookie-preferences-actions{display:flex;flex-wrap:wrap;gap:var(--space-3);margin-top:var(--space-6)}
@media(min-width:640px){
.cookie-banner-inner{flex-direction:row;align-items:center}
.cookie-btn-group{margin-left:auto;flex-shrink:0}
}
.legal-content{max-width:720px;margin:0 auto;line-height:1.8}
.legal-content h1{margin-bottom:var(--space-2);font-size:2rem}
.legal-content .last-updated{color:var(--color-text-muted);font-size:0.9375rem;margin-bottom:var(--space-8)}
.legal-content h2{margin-top:var(--space-10);margin-bottom:var(--space-4)}
.legal-content h3{margin-top:var(--space-8);margin-bottom:var(--space-3)}
.legal-content p,.legal-content li{color:var(--color-text-muted);margin-bottom:var(--space-3)}
.legal-content ul,.legal-content ol{padding-left:var(--space-6);margin-bottom:var(--space-4)}
.legal-content ul{list-style:disc}
.legal-content ol{list-style:decimal}
.legal-content li{margin-bottom:var(--space-2)}
.legal-content a{color:var(--color-primary);text-decoration:underline}
.legal-toc{background:var(--color-bg-card);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-6);margin-bottom:var(--space-8)}
.legal-toc h2{font-size:1rem;margin-top:0;margin-bottom:var(--space-3)}
.legal-toc ol{padding-left:var(--space-5);margin-bottom:0}
.legal-toc li{margin-bottom:var(--space-1);font-size:0.9375rem}
.legal-toc a{text-decoration:none}
.form-status[hidden]{display:none}
@keyframes fadeUp{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
@keyframes glowPulse{0%,100%{opacity:0.15}50%{opacity:0.3}}
@keyframes gradientShift{0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}}
.fade-up{opacity:0}
.fade-up.visible{animation:fadeUp 0.6s ease forwards}
.fade-in{opacity:0}
.fade-in.visible{animation:fadeIn 0.6s ease forwards}
.stagger-children>*{opacity:0}
.stagger-children.visible>*{animation:fadeUp 0.5s ease forwards}
.stagger-children.visible>*:nth-child(1){animation-delay:0s}
.stagger-children.visible>*:nth-child(2){animation-delay:0.1s}
.stagger-children.visible>*:nth-child(3){animation-delay:0.2s}
.stagger-children.visible>*:nth-child(4){animation-delay:0.3s}
.stagger-children.visible>*:nth-child(5){animation-delay:0.4s}
.stagger-children.visible>*:nth-child(6){animation-delay:0.5s}
@media(prefers-reduced-motion:reduce){
*,*::before,*::after{animation-duration:0.01ms!important;animation-iteration-count:1!important;transition-duration:0.01ms!important;scroll-behavior:auto!important}
.fade-up,.fade-in,.stagger-children>*{opacity:1}
.mouse-glow{display:none!important}
}
html{scroll-padding-top:80px}
:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px;border-radius:var(--radius-sm)}
::selection{background:var(--color-primary);color:#fff}
.hidden{display:none!important}