/* ProGlide site styles — full token set (ProGlide navy/green palette) */
:root {
  /* type */
  --font-sans: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --fw-regular:400; --fw-medium:500; --fw-semibold:600; --fw-bold:700; --fw-extra:800;

  /* brand ramps */
  --violet-50:#f2f9e8; --violet-100:#e3f2cc; --violet-200:#c8e79c; --violet-300:#aad971; --violet-400:#9ad04f;
  --violet-500:#8cc63f; --violet-600:#7ab332; --violet-700:#669929; --violet-800:#527a21; --violet-900:#3d5c19;
  --blue-50:#eef0f3; --blue-100:#cfd6de; --blue-200:#a3aebb; --blue-300:#6b7c8f; --blue-400:#445868;
  --blue-500:#0d1b2a; --blue-600:#0a1522; --blue-700:#08111b; --blue-800:#060d15; --blue-900:#04080d;

  /* neutrals */
  --gray-50:#f9fafb; --gray-100:#f3f4f6; --gray-200:#e5e7eb; --gray-300:#d1d5db; --gray-400:#9ca3af;
  --gray-500:#6b7280; --gray-600:#4b5563; --gray-700:#374151; --gray-800:#142534; --gray-900:#0d1b2a;

  /* status */
  --green-600:#059669; --green-50:#ecfdf5;
  --red-600:#dc2626; --red-50:#fef2f2;
  --orange-600:#d97706; --orange-50:#fffbeb;
  --yellow-400:#fbbf24;

  /* gradients */
  --gradient-brand: linear-gradient(135deg, #0d1b2a 0%, #8cc63f 100%);
  --gradient-violet: linear-gradient(135deg, #0d1b2a 0%, #527a21 100%);
  --gradient-surface: linear-gradient(135deg, #f2f9e8 0%, #eef0f3 100%);

  /* semantic aliases */
  --color-primary:#7ab332; --color-primary-hover:#669929; --color-primary-press:#527a21;
  --color-primary-soft:#f2f9e8; --color-primary-softer:#e3f2cc; --color-secondary:#0d1b2a;
  --color-on-primary:#ffffff;
  --surface-app:#f4f6f9; --surface-card:#ffffff; --surface-sunken:#f8fafc; --surface-hover:#f2f9e8;
  --border-default:#e5e7eb; --border-strong:#d1d5db; --border-brand:#c8e79c;
  --text-strong:#0d1b2a; --text-body:#4b5563; --text-muted:#9ca3af; --text-on-primary:#ffffff; --text-link:#7ab332;
  --status-success:#059669; --status-success-bg:#ecfdf5;
  --status-danger:#dc2626; --status-danger-bg:#fef2f2;
  --status-warning:#d97706; --status-warning-bg:#fffbeb;
  --status-info:#7ab332; --status-info-bg:#f2f9e8;

  /* radii */
  --radius-xs:3px; --radius-sm:5px; --radius-md:8px; --radius-lg:12px; --radius-xl:16px; --radius-2xl:24px; --radius-pill:9999px;

  /* shadows */
  --shadow-xs:0 1px 2px rgba(0,0,0,.04);
  --shadow-sm:0 1px 3px rgba(0,0,0,.06),0 1px 2px rgba(0,0,0,.04);
  --shadow-md:0 4px 16px rgba(0,0,0,.08);
  --shadow-lg:0 10px 30px rgba(0,0,0,.10);
  --shadow-xl:0 20px 60px rgba(0,0,0,.18);
  --shadow-brand:0 20px 40px rgba(140,198,63,.22);
  --shadow-brand-sm:0 2px 8px rgba(13,27,42,.30);
  --shadow-brand-md:0 8px 24px rgba(140,198,63,.30);

  --container:80rem;
  --dur-fast:.12s; --dur-base:.3s; --ease-standard:ease;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:var(--font-sans);color:var(--text-strong);background:#fff;line-height:1.6;-webkit-font-smoothing:antialiased}
h1,h2,h3,h4,h5,h6{font-family:var(--font-sans)}
a{text-decoration:none;color:inherit;transition:color var(--dur-fast) var(--ease-standard),opacity var(--dur-fast) var(--ease-standard)}
img{max-width:100%;height:auto}
details summary::-webkit-details-marker{color:var(--violet-600)}
details summary{outline:none}

/* interactivity */
nav a[href]:hover{color:var(--violet-600) !important}
footer a[href]:hover{color:var(--violet-400) !important}
a[href^="tel:"]:hover, a[href^="https://wa.me"]:hover{opacity:.8}
section a[style*="background:var(--gradient-brand)"]:hover,
a[style*="background:var(--gradient-brand)"]:hover{
  box-shadow:var(--shadow-brand) !important; transform:translateY(-2px); transition:all var(--dur-base) var(--ease-standard)
}
a[style*="border:2px solid"]:hover{background:rgba(255,255,255,.12) !important; transition:all var(--dur-base) var(--ease-standard)}
a[style*="background:#fff"]:hover{transform:translateY(-2px); transition:all var(--dur-base) var(--ease-standard)}
section div[style*="box-shadow:var(--shadow-lg)"]:hover,
a[style*="box-shadow:var(--shadow-lg)"]:hover{
  transform:translateY(-4px); box-shadow:var(--shadow-xl) !important; transition:all var(--dur-base) var(--ease-standard)
}
details{transition:background var(--dur-fast) var(--ease-standard)}
details:hover{background:var(--gray-50)}
img{transition:transform var(--dur-base) var(--ease-standard)}
div[style*="overflow:hidden"] img:hover{transform:scale(1.04)}
input:focus, textarea:focus{outline:none; border-color:var(--violet-500) !important; box-shadow:0 0 0 3px rgba(140,198,63,.2)}
button:hover{filter:brightness(1.05)}

/* ============ Responsive (mobile-friendly) ============ */
@media (max-width: 900px) {
  header{height:auto !important;min-height:520px;padding:80px 0 !important}
  header img[style*="position:absolute;inset:0"]{position:absolute !important}
  header div[style*="max-width:600px"]{max-width:100% !important}
  h1{font-size:36px !important}
  nav > div{flex-wrap:wrap;height:auto !important;padding:12px 20px !important;row-gap:10px}
  nav div[style*="display:flex;gap:32px"]{gap:14px !important;flex-wrap:wrap;justify-content:center;width:100%;order:3}
  nav a[style*="margin-right:6px;color:var(--violet-600)"]{display:none}
  nav a[href^="tel:"]{display:none}
  [style*="grid-template-columns:repeat(3,1fr)"]{grid-template-columns:1fr !important}
  [style*="grid-template-columns:repeat(4,1fr)"]{grid-template-columns:repeat(2,1fr) !important}
  [style*="grid-template-columns:1.05fr .95fr"]{grid-template-columns:1fr !important}
  [style*="grid-template-columns:.9fr 1.1fr"]{grid-template-columns:1fr !important}
  [style*="grid-template-columns:1fr 1fr"]{grid-template-columns:1fr !important}
  [style*="grid-template-columns:2fr 1fr 1fr"]{grid-template-columns:1fr !important;text-align:center}
  section div[style*="padding:80px 32px"]{padding:48px 20px !important}
  div[style*="max-width:1280px"]{padding-left:20px !important;padding-right:20px !important}
  div[style*="max-width:1000px"]{padding-left:20px !important;padding-right:20px !important}
  div[style*="max-width:920px"]{padding-left:20px !important;padding-right:20px !important}
  div[style*="max-width:900px"]{padding-left:20px !important;padding-right:20px !important}
  section[style*="padding:56px 0 96px"]{padding:40px 0 64px !important}
  footer div[style*="display:grid;grid-template-columns:2fr 1fr 1fr"] > div{margin:0 auto}
}
@media (max-width: 520px) {
  h1{font-size:28px !important}
  header{min-height:440px !important}
  a[style*="padding:14px 28px"]{padding:12px 20px !important;font-size:14px !important}
}
