:root{
  --bg:#f6f7fb; --panel:#ffffff; --fg:#0f172a; --muted:#64748b;
  --brand:#0ea5e9; --brand-2:#22c55e; --line:#e2e8f0;
  --shadow:0 1px 2px rgba(15,23,42,.06), 0 8px 24px rgba(15,23,42,.08);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--bg);color:var(--fg);font:16px/1.55 system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif}
h1,h2,h3,h4{line-height:1.2;margin:0 0 .5rem 0}
.container{max-width:1100px;margin:0 auto;padding:0 20px}
.brand-ribbon{height:6px;background:linear-gradient(90deg,var(--brand),var(--brand-2));}
.site-header{position:sticky;top:0;z-index:20;border-bottom:1px solid var(--line);}
.site-header::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;background: rgba(255,255,255,.92);}
.site-header::after{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;background: url('assets/nav_watermark.png') right center / cover no-repeat;opacity:.65;}
.site-header .nav{position:relative;z-index:1;background:transparent;backdrop-filter:saturate(140%) blur(8px);}
.nav{display:flex;align-items:center;justify-content:space-between;padding:12px 0}
.brand{display:flex;align-items:center;gap:12px}
.logo{display:inline-grid;place-items:center;padding:0 14px;height:42px;border-radius:12px;background:linear-gradient(135deg,var(--brand),var(--brand-2));color:#fff;font-weight:800;letter-spacing:.5px;box-shadow:var(--shadow)}
.brand-text .tagline{color:var(--muted);margin:2px 0 0 0}
nav a{margin:0 10px;color:var(--fg);text-decoration:none;font-weight:600;opacity:.9}
nav a:hover{color:var(--brand);opacity:1}
nav button{margin-left:10px;border:1px solid var(--line);background:var(--panel);border-radius:10px;padding:6px 10px;cursor:pointer}
.hero{
  background:
    radial-gradient(1200px 400px at -10% -10%, rgba(14,165,233,.15), transparent 60%),
    radial-gradient(900px 300px at 110% 10%, rgba(34,197,94,.12), transparent 50%),
    linear-gradient(180deg,#f0f9ff,#fff);
  padding:70px 0;border-bottom:1px solid var(--line)
}
.hero-inner{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:24px;align-items:center}
.hero-card{background:var(--panel);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);padding:16px}
.hero .cta{display:flex;gap:12px;margin-top:16px}
.button{background:var(--brand);color:#fff;border:none;border-radius:12px;padding:12px 16px;text-decoration:none;display:inline-block;box-shadow:var(--shadow);transition:transform .08s ease}
.button:hover{transform:translateY(-1px)}
.button.ghost{background:var(--panel);color:var(--brand);border:1px solid var(--brand);box-shadow:none}
.section{padding:56px 0;position:relative}
.section.alt{background:#f1f5f9}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px}
.card{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:16px;box-shadow:var(--shadow)}
.grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px;align-items:start}
.panel,.about-card,.contact-card{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:16px;box-shadow:var(--shadow)}
.checklist li{margin:8px 0}
.form-row{display:flex;flex-direction:column;margin:10px 0}
input,textarea,select{padding:12px;border:1px solid var(--line);border-radius:12px;background:#fff}
input[type="file"]{padding:10px;background:#fff}
.contact-list{list-style:none;padding:0;margin:0}
.small{color:var(--muted)}
.site-footer{border-top:1px solid var(--line);padding:24px 0;margin-top:20px;text-align:center;color:var(--muted)}
/* Manual dark mode */
body.manual-dark{--bg:#0b1220;--panel:#0f172a;--fg:#eef2ff;--muted:#94a3b8;--line:#1f2940}
body.manual-dark .section.alt{background:#0c1529}
body.manual-dark .button.ghost{background:transparent;color:#7dd3fc;border-color:#7dd3fc}
body.manual-dark .site-header::before{background: rgba(11,18,32,.96)}
body.manual-dark .site-header::after{opacity:.35}
.hidden{position:absolute;left:-10000px;}