:root {
  --bg: #000000;
  --bg-alt: #101317;
  --bg-glass: rgba(255,255,255,0.04);
  --border-glass: rgba(255,255,255,0.08);
  --text: #e6eaef;
  --text-soft: #9aa4b1;
  --brand: #4f7cff;
  --brand-accent: #8b5cf6;
  --danger: #ff4f64;
  --radius-xs: 4px;
  --radius-sm: 6px;
  --radius: 12px;
  --radius-lg: 20px;
  --gradient: linear-gradient(90deg,var(--brand),var(--brand-accent));
  --gradient-soft: linear-gradient(145deg,var(--brand) 0%,var(--brand-accent) 55%,#ff8bd1 110%);
  --gradient-radial: radial-gradient(circle at 30% 20%,rgba(139,92,246,.25),transparent 60%),radial-gradient(circle at 80% 70%,rgba(79,124,255,.25),transparent 65%);
  --font-sans: 'Montserrat', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Helvetica Neue', Arial, sans-serif;
  --font-display: var(--font-sans);
  --shadow-sm: 0 1px 2px -1px rgba(0,0,0,0.4), 0 1px 3px 0 rgba(0,0,0,0.3);
  --shadow: 0 4px 16px -2px rgba(0,0,0,0.5), 0 2px 6px -1px rgba(0,0,0,0.4);
  --shadow-glow: 0 0 0 1px rgba(255,255,255,0.04), 0 4px 24px -4px rgba(79,124,255,0.35);
  --ease: cubic-bezier(.4,.0,.2,1);
  --ease-spring: cubic-bezier(.34,1.56,.64,1);
}

[data-theme="light"] {
  --bg: #ffffff;
  --bg-alt: #f5f7fb;
  --bg-glass: rgba(0,0,0,0.03);
  --border-glass: rgba(0,0,0,0.08);
  --text: #161b22;
  --text-soft: #5b6573;
  --shadow: 0 3px 14px -2px rgba(0,0,0,0.08), 0 2px 5px -1px rgba(0,0,0,0.06);
  --shadow-glow: 0 0 0 1px rgba(0,0,0,0.05), 0 4px 28px -6px rgba(79,124,255,0.25);
}

* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body {
  margin:0; font-family:var(--font-sans); background:var(--bg); color:var(--text); -webkit-font-smoothing:antialiased; position:relative; min-height:100vh; overflow-x:hidden; padding-top:0;
}
body::before { display:none; }
img { max-width:100%; display:block; }
a { color:var(--brand); text-decoration:none; position:relative; }
a:hover,a:focus-visible { text-decoration:underline; }

.container { width:min(1200px,95%); margin-inline:auto; }
.flex { display:flex; }
.between { justify-content:space-between; }
.center-v { align-items:center; }
.wrap { flex-wrap:wrap; }

/* Fixed floating header */
.site-header { position:fixed; top:18px; left:50%; transform:translateX(-50%); width:min(1180px,94%); background:linear-gradient(135deg,rgba(255,255,255,0.85),rgba(255,255,255,0.70)); backdrop-filter:saturate(180%) blur(22px); border:1px solid var(--border-glass); border-radius:56px; z-index:200; transition:.45s var(--ease); box-shadow:0 8px 28px -12px rgba(0,0,0,.35), 0 2px 6px -2px rgba(0,0,0,.4); padding:0 .85rem; }
/* App detail page layout offset for fixed header */
.app-detail { padding:150px 0 4rem; }
@media (max-width:800px){ .app-detail { padding-top:130px; } }
/* Dark theme override placed AFTER base header so it wins */
[data-theme="dark"] .site-header { background:linear-gradient(135deg,rgba(22,24,28,0.85),rgba(18,20,24,0.7)); box-shadow:0 8px 28px -12px rgba(0,0,0,.7), 0 2px 6px -2px rgba(0,0,0,.6); }
/* Scrolled state styling */
.site-header.scrolled { box-shadow:0 6px 22px -10px rgba(0,0,0,.55), 0 1px 4px -1px rgba(0,0,0,.6); transform:translateX(-50%) translateY(0); }
.site-header .brand { padding:.9rem 0; }
.site-header .nav__list { padding-right:.35rem; }
.site-header.scrolled { box-shadow:0 2px 10px -4px rgba(0,0,0,.6); backdrop-filter:saturate(180%) blur(26px); }
.site-header .brand { font-family:var(--font-display); font-size:1.35rem; font-weight:600; letter-spacing:.5px; display:flex; align-items:center; gap:.6rem; padding:.75rem 0; color:var(--text); }
.logo { width:34px; height:34px; filter:drop-shadow(0 2px 4px rgba(0,0,0,0.4)); }

.nav { position:relative; }
.nav__toggle { display:none; background:none; border:0; cursor:pointer; width:44px; height:44px; align-items:center; justify-content:center; flex-direction:column; gap:6px; }
.nav__toggle span { width:24px; height:2px; background:var(--text); border-radius:2px; transition:.4s var(--ease); }
.nav__list { list-style:none; display:flex; gap:1.6rem; padding:0; margin:0; align-items:center; }
.nav__list a { color:var(--text-soft); font-weight:500; font-size:.95rem; letter-spacing:.5px; }
.nav__list a:hover { color:var(--text); }

.theme-toggle { width:38px; height:38px; border-radius:50%; border:1px solid var(--border-glass); background:var(--bg-alt); cursor:pointer; position:relative; display:grid; place-items:center; transition:.4s var(--ease); }
.theme-toggle::before { content:""; width:18px; height:18px; background:var(--text); -webkit-mask:radial-gradient(circle at 30% 30%,#000 60%,transparent 61%); mask:radial-gradient(circle at 30% 30%,#000 60%,transparent 61%); border-radius:50%; transition:.4s var(--ease); }
[data-theme="light"] .theme-toggle::before { background:var(--brand); box-shadow:0 0 0 3px var(--bg) inset, 4px -4px 0 0 var(--bg); }
.theme-toggle:hover { box-shadow:var(--shadow-glow); }

.hero { position:relative; min-height:100vh; padding:0 0 5rem; display:grid; align-items:center; overflow:hidden; }
.hero .container { padding-top:140px; }
.hero::before { content:""; position:absolute; inset:0; background:radial-gradient(circle at 30% 40%,rgba(79,124,255,0.28),transparent 65%),radial-gradient(circle at 80% 70%,rgba(139,92,246,0.22),transparent 70%); filter:blur(80px) saturate(140%); opacity:.55; pointer-events:none; }
.hero__title { font-family:var(--font-display); font-size:clamp(2.8rem,6.2vw,4.6rem); line-height:1.02; margin:0 0 1.2rem; font-weight:700; letter-spacing:-1px; }
.hero__tagline { font-size:1.15rem; line-height:1.5; max-width:640px; margin:0; color:var(--text-soft); }
.rotator { display:inline-block; min-width:5.4ch; position:relative; height:1em; }
.rotator__word { position:absolute; left:0; top:0; opacity:0; transform:translateY(45%); animation:rotateWords 9s linear infinite; }
.rotator__word.is-active { opacity:1; transform:translateY(0); }
@keyframes rotateWords { 0% { opacity:1; transform:translateY(0);} 20% { opacity:1;} 25% { opacity:0; transform:translateY(-40%);} 100% { opacity:0;} }
.hero-metrics { margin:2.2rem 0 1.6rem; display:flex; gap:2.4rem; flex-wrap:wrap; }
.metric { display:flex; flex-direction:column; gap:.4rem; }
.metric__value { font-size:1.35rem; font-weight:600; letter-spacing:.5px; background:var(--gradient); -webkit-background-clip:text; background-clip:text; color:transparent; }
.metric__label { font-size:.65rem; letter-spacing:1.4px; text-transform:uppercase; font-weight:600; color:var(--text-soft); }
.hero-snippet { position:relative; padding:1.6rem 1.4rem 1.8rem; width:min(480px,100%); font-family: 'JetBrains Mono','SFMono-Regular',Consolas,monaco,monospace; font-size:.75rem; line-height:1.55; }
.hero-snippet pre { margin:0; overflow:auto; background:transparent; color:var(--text-soft); }
.hero-snippet code { white-space:pre; display:block; }
.hero-snippet .cmt { color:#6b7280; }
.snippet-accent { position:absolute; inset:0; pointer-events:none; background:linear-gradient(120deg,rgba(255,255,255,.15),rgba(255,255,255,0)); mix-blend-mode:overlay; opacity:.5; }
.hero-snippet::after { content:""; position:absolute; width:180%; height:160%; top:-40%; left:-40%; background:conic-gradient(from 0deg,rgba(79,124,255,.15),rgba(139,92,246,.15),rgba(255,255,255,0) 70%); animation:spin 18s linear infinite; opacity:.4; }
@keyframes spin { to { transform:rotate(360deg);} }
.hero::before, .hero::after { content:""; position:absolute; width:780px; height:780px; background:radial-gradient(circle at 50% 50%,rgba(139,92,246,.25),transparent 70%); top:-260px; left:-200px; filter:blur(40px); opacity:.6; pointer-events:none; animation:drift 22s linear infinite; }
.hero::after { top:auto; bottom:-320px; left:auto; right:-240px; background:radial-gradient(circle at 50% 50%,rgba(79,124,255,.25),transparent 70%); animation-direction:reverse; }
@keyframes drift { 0% { transform:rotate(0deg) scale(1);} 50% { transform:rotate(180deg) scale(1.15);} 100% { transform:rotate(360deg) scale(1);} }
.hero .container { display:grid; gap:3rem; grid-template-columns:repeat(auto-fit,minmax(320px,1fr)); align-items:center; }
.hero__content h1 { font-family:var(--font-display); font-size:clamp(2.8rem,6vw,4.2rem); line-height:1.05; margin:0 0 1rem; letter-spacing:-1px; }
.accent-gradient { background:var(--gradient); background-clip:text; -webkit-background-clip:text; color:transparent; }
.hero__content p { max-width:560px; font-size:1.15rem; line-height:1.5; color:var(--text-soft); }
.actions { margin:2rem 0 1.25rem; display:flex; gap:1rem; flex-wrap:wrap; }
.btn { --b:var(--brand); --c:var(--text); background:var(--bg-alt); color:var(--c); border:1px solid var(--border-glass); padding:.85rem 1.35rem; border-radius:var(--radius-sm); font-weight:600; font-size:.95rem; letter-spacing:.5px; display:inline-flex; align-items:center; gap:.55rem; cursor:pointer; position:relative; overflow:hidden; transition:.4s var(--ease); }
.btn.primary { background:var(--gradient); border:0; box-shadow:var(--shadow-glow); }
.btn.ghost { background:var(--bg-glass); }
.btn.w { width:100%; justify-content:center; }
.btn:hover { transform:translateY(-2px); box-shadow:var(--shadow); }
.btn:active { transform:translateY(0); }

.socials { display:flex; gap:.6rem; margin-top:1.25rem; }
.social { display:grid; place-items:center; width:38px; height:38px; background:var(--bg-glass); border:1px solid var(--border-glass); color:var(--text-soft); border-radius:50%; font-size:.75rem; font-weight:600; letter-spacing:.5px; transition:.35s var(--ease); }
.social:hover { color:var(--text); background:var(--bg-alt); }

.hero__visual { display:flex; justify-content:center; perspective:1200px; }
.glass { background:linear-gradient(160deg,rgba(255,255,255,0.05),rgba(255,255,255,0.02)); border:1px solid var(--border-glass); backdrop-filter:blur(18px) saturate(170%); border-radius:var(--radius-lg); padding:2rem; position:relative; box-shadow:var(--shadow); overflow:hidden; }
.glass::before { content:""; position:absolute; inset:-1px; background:linear-gradient(120deg,rgba(255,255,255,.15),rgba(255,255,255,0) 40%); mix-blend-mode:overlay; pointer-events:none; }
.card-stack { display:grid; gap:1.2rem; transform-style:preserve-3d; }
.card { background:linear-gradient(135deg,var(--bg-alt),rgba(255,255,255,0.04)); border:1px solid var(--border-glass); padding:1rem 1.15rem 1.2rem; border-radius:var(--radius); font-weight:600; letter-spacing:.5px; position:relative; overflow:hidden; isolation:isolate; transform:translateZ(0); transition:.45s var(--ease); }
.card::after { display:none; }
.card:hover { box-shadow:var(--shadow-glow); transform:translateY(-4px); }

.scroll-indicator { position:absolute; bottom:1rem; left:50%; transform:translateX(-50%); font-size:.75rem; letter-spacing:2px; text-transform:uppercase; color:var(--text-soft); animation:float 3.5s ease-in-out infinite; }
@keyframes float { 0%,100% { transform:translate(-50%,0); } 50% { transform:translate(-50%,-10px); } }

.section-head { margin-bottom:2.75rem; }
.section-head h2 { font-family:var(--font-display); font-size:clamp(2rem,4vw,2.75rem); letter-spacing:-.5px; margin:0 0 .5rem; }
.muted { color:var(--text-soft); margin:0; }

.apps { padding:5rem 0 5.5rem; background:linear-gradient(180deg,var(--bg) 0,var(--bg-alt) 100%); position:relative; }
.apps::before { content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(255,255,255,0.04),transparent 40%); pointer-events:none; }
.apps__grid { display:grid; gap:2.2rem; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); }
.apps__toolbar { display:flex; gap:1rem; align-items:center; margin:-1rem 0 2.5rem; flex-wrap:wrap; }
#appFilter { flex:1 1 240px; max-width:360px; background:var(--bg-alt); border:1px solid var(--border-glass); color:var(--text); font:inherit; padding:.85rem 1rem; border-radius:999px; box-shadow:0 2px 8px -3px rgba(0,0,0,.5); transition:.45s var(--ease); }
#appFilter:focus { outline:2px solid var(--brand); outline-offset:2px; }
.apps__count { font-size:.7rem; letter-spacing:1px; text-transform:uppercase; color:var(--text-soft); font-weight:600; }
.app-card { position:relative; display:flex; flex-direction:column; gap:1rem; background:linear-gradient(145deg,var(--bg-alt) 0%,var(--bg) 100%); border:1px solid var(--border-glass); border-radius:calc(var(--radius) + 2px); padding:1.55rem 1.35rem 1.7rem; overflow:hidden; box-shadow:var(--shadow-sm); transition:.4s var(--ease); cursor:pointer; }
[data-theme="dark"] .app-card { background:linear-gradient(145deg,var(--bg-alt) 0%,#1e2530 50%,rgba(255,255,255,0.04) 100%); }
.app-card::before { content:""; position:absolute; inset:0; background:linear-gradient(120deg,rgba(255,255,255,0.10),rgba(255,255,255,0) 40%); opacity:0; transition:.7s var(--ease); pointer-events:none; }
.app-card::after { content:""; position:absolute; width:140%; height:60%; top:-40%; left:-20%; background:linear-gradient(90deg,rgba(255,255,255,0.18),rgba(255,255,255,0)); transform:rotate(18deg) translateY(0); opacity:0; transition:.8s var(--ease); }
.app-card:hover { transform:translateY(-6px); box-shadow:var(--shadow-glow); }
.app-card:hover::before { opacity:1; }
.app-card:hover::after { opacity:1; transform:rotate(18deg) translateY(220%); }
.app-card.reveal { animation:slideFade .9s var(--ease-spring); }
@keyframes slideFade { from { opacity:0; transform:translateY(30px) scale(.96);} to { opacity:1; transform:translateY(0) scale(1);} }
.app-card__icon { width:54px; height:54px; border-radius:16px; display:grid; place-items:center; font-weight:600; font-size:1.1rem; background:var(--gradient); color:#fff; box-shadow:0 4px 14px -2px rgba(0,0,0,0.55); }
.app-card__icon img { width:100%; height:100%; object-fit:cover; border-radius:inherit; display:block; }
/* Screenshots gallery */
.screenshot-grid { display:grid; gap:.9rem; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); }
.screenshot { margin:0; position:relative; border-radius:12px; overflow:hidden; cursor:pointer; background:var(--bg-alt); border:1px solid var(--border-glass); box-shadow:0 2px 6px -2px rgba(0,0,0,.5); transition:.45s var(--ease); }
.screenshot img { width:100%; height:100%; display:block; object-fit:contain; background:var(--bg-alt); /* show full image without cropping */ transition:transform .7s var(--ease); }
.screenshot:hover img, .screenshot:focus-visible img { transform:scale(1.06); }
.screenshot:focus-visible { outline:2px solid var(--brand); outline-offset:3px; }
.screenshots-block h3 { margin-top:0; }

/* Lightbox */
#lightboxOverlay { position:fixed; inset:0; background:rgba(0,0,0,.68); backdrop-filter:blur(6px); display:flex; align-items:center; justify-content:center; opacity:0; pointer-events:none; transition:.4s var(--ease); z-index:400; padding:4vh 4vw; }
#lightboxOverlay.open { opacity:1; pointer-events:auto; }
#lightboxOverlay .lb-inner { position:relative; max-width:1280px; width:100%; }
#lightboxOverlay .lb-img { width:100%; max-height:82vh; object-fit:contain; display:block; border-radius:16px; box-shadow:0 12px 48px -8px rgba(0,0,0,.55); border:1px solid var(--border-glass); background:var(--bg-alt); }
#lightboxOverlay .lb-close { position:absolute; top:-44px; right:0; background:var(--bg-alt); color:var(--text); border:1px solid var(--border-glass); width:42px; height:42px; border-radius:12px; font-size:1.4rem; line-height:1; cursor:pointer; display:grid; place-items:center; box-shadow:var(--shadow); }
#lightboxOverlay .lb-close:hover { background:var(--bg); }
#lightboxOverlay .lb-zoom-hint { text-align:center; font-size:.6rem; letter-spacing:1px; text-transform:uppercase; color:var(--text-soft); margin-top:.65rem; }
.app-card h3 { margin:0; font-size:1.15rem; letter-spacing:.3px; font-weight:600; font-family:var(--font-sans); }
.app-badge { display:inline-block; vertical-align:middle; margin-left:.4rem; font-size:.55rem; letter-spacing:1px; text-transform:uppercase; padding:.25rem .45rem; border-radius:6px; background:var(--bg-glass); border:1px solid var(--border-glass); color:var(--text-soft); font-weight:700; position:relative; top:-2px; }
.app-badge--upcoming { background:linear-gradient(135deg,#3a2a00,#5f4300); color:#f5d27a; border-color:rgba(255,213,122,0.25); }
.app-badge--beta { background:linear-gradient(135deg,#102b46,#153654); color:#7cc4ff; border-color:rgba(124,196,255,0.3); }
.app-badge--live { background:linear-gradient(135deg,#053d2f,#0b5d45); color:#5ef2c2; border-color:rgba(94,242,194,0.35); }
.app-detail__panel ul, .app-detail__panel ol { margin:.4rem 0 0 1.1rem; padding:0; display:grid; gap:.35rem; font-size:.75rem; color:var(--text-soft); }
.features-list { font-size:.95rem; line-height:1.55; color:var(--text); margin-top:.55rem; }
.app-detail__panel h3 { font-size:.75rem; letter-spacing:1px; text-transform:uppercase; margin:0 0 .5rem; }
.changelog { display:grid; gap:.7rem; }
.cl-item { font-size:.7rem; line-height:1.3; background:var(--bg-glass); border:1px solid var(--border-glass); padding:.6rem .7rem .7rem; border-radius:8px; }
.cl-item strong { font-size:.65rem; letter-spacing:1px; text-transform:uppercase; background:var(--gradient); -webkit-background-clip:text; background-clip:text; color:transparent; }
.cl-date { font-size:.6rem; margin-left:.5rem; color:var(--text-soft); }
.cl-notes { margin-top:.25rem; color:var(--text-soft); }
.app-card p { margin:0; color:var(--text-soft); font-size:.9rem; line-height:1.4; }
.app-card .tags { display:flex; flex-wrap:wrap; gap:.4rem; margin-top:auto; }
.tag { font-size:.625rem; letter-spacing:.7px; text-transform:uppercase; padding:.35rem .55rem; background:var(--bg-glass); border:1px solid var(--border-glass); border-radius:var(--radius-xs); font-weight:600; color:var(--text-soft); }
.app-card .links { display:flex; gap:.6rem; margin-top:1rem; }
.inline-link { position:relative; font-size:.75rem; font-weight:600; letter-spacing:.7px; text-transform:uppercase; color:var(--brand); }
.inline-link::after { content:""; position:absolute; left:0; bottom:-2px; height:2px; width:100%; background:var(--gradient); transform:scaleX(.2); transform-origin:left; transition:.4s var(--ease); border-radius:2px; }
.inline-link:hover::after { transform:scaleX(1); }

/* New apps category filters */
.apps__categories { display:flex; gap:.6rem; flex-wrap:wrap; margin:0 0 2.2rem; }
.cat-btn { background:var(--bg-glass); border:1px solid var(--border-glass); color:var(--text-soft); font:inherit; font-size:.65rem; letter-spacing:1.1px; text-transform:uppercase; padding:.55rem .85rem; border-radius:999px; cursor:pointer; font-weight:600; transition:.35s var(--ease); }
.cat-btn:hover { color:var(--text); }
.cat-btn.is-active { background:var(--gradient); border-color:transparent; color:#fff; box-shadow:0 4px 20px -8px rgba(0,0,0,.5); }

.about { padding:5rem 0 4.5rem; position:relative; }
.about-grid { display:grid; gap:4rem; grid-template-columns:repeat(auto-fit,minmax(320px,1fr)); align-items:start; }
.about-intro .lead { font-size:1.05rem; line-height:1.55; color:var(--text-soft); }
.principles { margin:2.4rem 0 0; display:grid; gap:1.4rem; }
.principle { display:grid; gap:.45rem; grid-template-columns:auto 1fr; align-items:start; position:relative; padding-left:0; }
.principle .dot { width:10px; height:10px; border-radius:50%; background:var(--gradient); margin-top:.35rem; box-shadow:0 0 0 4px rgba(255,255,255,0.05); }
.principle h3 { margin:0; font-size:.9rem; letter-spacing:.5px; }
.principle p { margin:0; font-size:.75rem; color:var(--text-soft); line-height:1.4; }
.values-panel { display:grid; gap:1.2rem; grid-auto-rows:1fr; }
.value-card { background:var(--bg-glass); border:1px solid var(--border-glass); border-radius:var(--radius); padding:1rem 1rem 1.1rem; display:flex; flex-direction:column; gap:.6rem; font-size:.8rem; position:relative; overflow:hidden; }
.value-card::after { content:""; position:absolute; inset:0; background:linear-gradient(110deg,rgba(255,255,255,0.09),rgba(255,255,255,0) 60%); opacity:0; transition:.6s var(--ease); }
.value-card:hover::after { opacity:1; }
.value-card ul { list-style:none; margin:0; padding:0; display:grid; gap:.3rem; font-size:.7rem; color:var(--text-soft); }
.value-card.highlight { background:linear-gradient(135deg,var(--bg-glass),rgba(255,255,255,0.08)); border:1px solid var(--border-glass); }
.value-card h3 { margin:0; font-size:.75rem; letter-spacing:1px; text-transform:uppercase; font-weight:600; }
.value-card p { margin:0; color:var(--text-soft); }

.process { padding:5rem 0 5rem; background:linear-gradient(180deg,var(--bg-alt) 0,var(--bg) 100%); }
.stage-flow { display:grid; gap:1.6rem; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); }
.stage { background:var(--bg-glass); border:1px solid var(--border-glass); border-radius:var(--radius); padding:1.1rem 1rem 1.25rem; position:relative; display:flex; flex-direction:column; gap:.55rem; transition:.4s var(--ease); overflow:hidden; }
.stage::before { content:""; position:absolute; inset:0; background:linear-gradient(120deg,rgba(255,255,255,0.09),rgba(255,255,255,0) 55%); opacity:0; transition:.6s var(--ease); }
.stage:hover { transform:translateY(-6px); box-shadow:var(--shadow-glow); }
.stage:hover::before { opacity:1; }
.stage__head { display:flex; align-items:center; gap:.65rem; }
.stage__idx { width:34px; height:34px; border-radius:12px; background:var(--gradient); color:#fff; display:grid; place-items:center; font-size:.7rem; font-weight:600; letter-spacing:1px; }
.stage h3 { margin:0; font-size:.85rem; letter-spacing:.5px; }
.stage p { margin:0; font-size:.7rem; color:var(--text-soft); line-height:1.4; }

.contact { padding:5rem 0 5.5rem; }
.contact-grid { display:grid; gap:4rem; grid-template-columns:repeat(auto-fit,minmax(320px,1fr)); align-items:start; }
.contact-info .lead { font-size:1.05rem; line-height:1.55; color:var(--text-soft); margin:0 0 1.6rem; }
.contact-list { list-style:none; margin:0 0 1.6rem; padding:0; display:grid; gap:.65rem; font-size:.8rem; }
.contact-list li { display:flex; gap:.7rem; align-items:center; }
.contact-list a { color:var(--text-soft); }
.contact-list a:hover { color:var(--text); }
.contact-list .icon { width:28px; height:28px; border-radius:8px; background:var(--gradient); display:grid; place-items:center; font-size:.6rem; font-weight:600; letter-spacing:1px; color:#fff; }
.mini { font-size:.6rem; letter-spacing:1.2px; text-transform:uppercase; color:var(--text-soft); }
.panel { background:var(--bg-glass); border:1px solid var(--border-glass); border-radius:var(--radius); padding:1.4rem 1.35rem 1.7rem; box-shadow:var(--shadow-sm); }
.form-row { display:grid; gap:1.2rem; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); }
label { display:flex; flex-direction:column; gap:.45rem; font-size:.75rem; font-weight:600; letter-spacing:.7px; text-transform:uppercase; color:var(--text-soft); }
input,textarea { font:inherit; background:var(--bg-alt); border:1px solid var(--border-glass); border-radius:var(--radius-xs); padding:.85rem .9rem; color:var(--text); resize:vertical; box-shadow:0 1px 2px rgba(0,0,0,0.35) inset; transition:.35s var(--ease); }
input:focus,textarea:focus { outline:2px solid var(--brand); outline-offset:2px; }
input:invalid[focused],textarea:invalid[focused] { border-color:var(--danger); }
.form-foot { display:flex; flex-direction:column; gap:.75rem; }
.form-status { font-size:.75rem; min-height:1em; }

.site-footer { padding:2.2rem 0 2.4rem; background:var(--bg-alt); border-top:1px solid var(--border-glass); font-size:.75rem; letter-spacing:.5px; color:var(--text-soft); }
[data-theme="dark"] .site-footer { background:#0a0c0f; }
/* Scroll progress bar */
#scrollProgress { position:fixed; top:0; left:0; height:3px; width:0%; background:var(--gradient); z-index:140; transition:width .2s linear; }

/* Command palette */
.cmdk { position:fixed; inset:0; background:rgba(0,0,0,0.35); backdrop-filter:blur(4px); display:flex; align-items:flex-start; justify-content:center; padding:8vh 1rem 2rem; opacity:0; pointer-events:none; transition:.4s var(--ease); }
.cmdk[aria-hidden="false"] { opacity:1; pointer-events:auto; }
.cmdk__panel { width:min(760px,100%); background:var(--bg-alt); border:1px solid var(--border-glass); border-radius:24px; box-shadow:0 20px 60px -10px rgba(0,0,0,.3), var(--shadow); display:flex; flex-direction:column; overflow:hidden; animation:scaleIn .55s var(--ease-spring); }
[data-theme="dark"] .cmdk__panel { background:linear-gradient(140deg,var(--bg-alt),var(--bg)); }
@keyframes scaleIn { from { transform:translateY(14px) scale(.96); opacity:0;} to { transform:translateY(0) scale(1); opacity:1;} }
.cmdk__head { display:flex; align-items:center; gap:.75rem; padding:.9rem 1rem .75rem; border-bottom:1px solid var(--border-glass); }
#cmdkInput { flex:1; font:inherit; background:var(--bg); border:1px solid var(--border-glass); border-radius:12px; padding:.85rem 1rem; color:var(--text); box-shadow:0 2px 6px -2px rgba(0,0,0,.25) inset; }
#cmdkInput:focus { outline:2px solid var(--brand); outline-offset:2px; }
.cmdk__close { background:var(--bg-glass); border:1px solid var(--border-glass); color:var(--text-soft); font-size:.85rem; padding:.55rem .8rem; border-radius:10px; cursor:pointer; transition:.35s var(--ease); }
.cmdk__close:hover { color:var(--text); }
.cmdk__results { max-height:54vh; overflow:auto; padding:.35rem .4rem 1rem; display:grid; gap:.35rem; }
.cmdk__results::-webkit-scrollbar { width:10px; }
.cmdk__results::-webkit-scrollbar-thumb { background:linear-gradient(var(--bg-alt),var(--bg-glass)); border:3px solid var(--bg-alt); border-radius:20px; }
.cmdk__item { display:flex; align-items:center; gap:.9rem; padding:.8rem 1rem .85rem; background:var(--bg); border:1px solid transparent; border-radius:14px; cursor:pointer; position:relative; overflow:hidden; font-size:.85rem; letter-spacing:.3px; }
.cmdk__item:hover,.cmdk__item[aria-selected="true"] { background:var(--bg-glass); border-color:var(--border-glass); }
.cmdk__item kbd { margin-left:auto; font-size:.6rem; background:var(--bg-alt); padding:.25rem .45rem; border-radius:6px; border:1px solid var(--border-glass); letter-spacing:1px; }
.cmdk__hint { font-size:.65rem; letter-spacing:1px; text-transform:uppercase; padding:.6rem 1rem .9rem; color:var(--text-soft); border-top:1px solid var(--border-glass); }

.cmdk__empty { padding:1rem 1.1rem; font-size:.8rem; color:var(--text-soft); }

.site-footer a { color:var(--text-soft); }
.site-footer a:hover { color:var(--text); }
.footer-links { display:flex; gap:1rem; flex-wrap:wrap; }

/* Responsive nav */
@media (max-width: 860px) {
  .nav__toggle { display:flex; }
  .nav__list { position:absolute; top:110%; right:0; flex-direction:column; align-items:stretch; background:var(--bg-alt); padding:1rem 1.1rem; border:1px solid var(--border-glass); border-radius:var(--radius); min-width:200px; box-shadow:var(--shadow); opacity:0; pointer-events:none; transform:translateY(-6px); transition:.45s var(--ease); }
  .nav__list.open { opacity:1; transform:translateY(0); pointer-events:auto; }
  .nav__list li { padding:.4rem 0; }
}

/* Motion preferences */
@media (prefers-reduced-motion: reduce) {
  * { animation:none !important; transition:none !important; }
}

/* Scrollbar styling (webkit) */
::-webkit-scrollbar { width:12px; }
::-webkit-scrollbar-track { background:var(--bg); }
::-webkit-scrollbar-thumb { background:linear-gradient(var(--bg-alt),var(--bg-glass)); border:3px solid var(--bg); border-radius:20px; }
::-webkit-scrollbar-thumb:hover { background:linear-gradient(var(--brand),var(--brand-accent)); }
