:root{
  --bg:#f7f9fc;
  --surface:#ffffff;
  --text:#0f172a;
  --muted:#475569;
  --primary:#2563eb;
  --primary-2:#06b6d4;
  --ring:#cbd5e1;
  --radius:16px;
  --shadow: 0 10px 26px rgba(2,6,23,.08);
}
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji", "Segoe UI Emoji";
  background: var(--bg);
  color: var(--text);
  line-height:1.6;
}
.container{max-width:1100px;margin:0 auto;padding:22px}
/* Header */
.site-header{
  position:sticky;top:0;z-index:20;
  background: rgba(255,255,255,.9);
  backdrop-filter: blur(8px);
  border-bottom:1px solid var(--ring);
}
.header-inner{display:flex;align-items:center;justify-content:space-between;gap:18px}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--text);font-weight:800}
.brand-logo{width:40px;height:40px;object-fit:contain; border-radius:10px}
.brand-text{letter-spacing:.2px}
.nav{display:flex;gap:16px;flex-wrap:wrap}
.nav a{color:var(--muted);text-decoration:none;padding:8px 12px;border-radius:12px}
.nav a:hover,.nav a.active{color:var(--text);background:#eef2ff}

/* Hero */
.hero{position:relative;max-height:360px;overflow:hidden;border-bottom:1px solid var(--ring)}
.hero-img{display:block;width:100%;height:360px;object-fit:cover;filter:saturate(1.1) contrast(1.05)}
.hero-overlay{
  position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;
  padding:24px; background: linear-gradient(90deg, rgba(255,255,255,.86), rgba(255,255,255,.0));
}
.hero-overlay h1{margin:0 0 8px;font-size:clamp(28px,4vw,40px)}
.hero-overlay p{margin:0;color:var(--muted);font-size:clamp(14px,2vw,18px)}

/* Cards & layout */
.section{margin-top:28px}
.card{
  background:var(--surface);
  border:1px solid var(--ring);
  border-radius:var(--radius);
  padding:20px;
  box-shadow:var(--shadow);
}
.grid{display:grid;gap:18px;grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}

/* Typography */
h1,h2,h3{line-height:1.2;margin:0 0 10px}
.lead{font-size:1.1rem;color:var(--muted)}
.kicker{letter-spacing:.12em;color:var(--primary);font-weight:800;font-size:.85rem}

/* Buttons */
.button, button, input[type=submit]{
  appearance:none;border:none;cursor:pointer;
  padding:12px 16px;border-radius:12px;
  background: linear-gradient(135deg,var(--primary),var(--primary-2));
  color:white;font-weight:800;text-decoration:none;box-shadow:var(--shadow)
}
.button.secondary{
  background:#e2e8f0;color:#0f172a;font-weight:700;
}

/* Form */
.form{display:grid;gap:14px;max-width:720px}
.form label{font-weight:700}
.form input[type=text], .form input[type=email], .form input[type=tel], .form textarea{
  width:100%;padding:12px 14px;border-radius:12px;background:#fff;color:#111;
  border:1px solid var(--ring);
}
.form textarea{min-height:140px;resize:vertical}
.notice{background:#ecfeff;border:1px solid #67e8f9;color:#0e7490;padding:12px 14px;border-radius:12px}
.error{background:#fee2e2;border:1px solid #fecaca;color:#7f1d1d;padding:12px 14px;border-radius:12px}

/* Footer */
.site-footer{margin-top:40px;border-top:1px solid var(--ring);background:var(--surface)}
.footer-inner{padding:18px 22px}
.footer-link{color:var(--primary);text-decoration:none}
.footer-link:hover{text-decoration:underline}

@media (max-width:720px){
  .header-inner{flex-direction:column;align-items:flex-start}
  .hero-overlay{align-items:flex-start}
}


/* Contact form extras */
.captcha-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.captcha-img{border:1px solid var(--ring);border-radius:12px}
.hp{position:absolute;left:-99999px;width:1px;height:1px;overflow:hidden}
.timehint{font-size:.85rem;color:var(--muted)}