
:root { --navy: #0B1F3A; --teal: #19B4A8; --white: #ffffff; --text: #0f172a; }
* { box-sizing: border-box; }
html, body { margin:0; padding:0; font-family: system-ui, -apple-system, "Segoe UI", Inter, Roboto, "Helvetica Neue", Arial; color: var(--text); }
a { color: var(--navy); }
header.hero { background: var(--navy); color: var(--white); padding: 64px 20px 48px; text-align: center; }
.brand { max-width: 1000px; margin: 0 auto; }
h1 { font-size: clamp(32px, 4vw, 52px); margin: 0 0 8px; line-height: 1.05; }
.tag { color: var(--teal); font-weight: 700; letter-spacing: .4px; }
p.lead { font-size: clamp(16px, 2.2vw, 22px); opacity:.9; margin: 0 0 18px }
.cta { display:inline-block; background: var(--teal); color: #042b27; padding: 12px 18px; border-radius: 10px; text-decoration: none; font-weight: 700; }
.cta:hover { filter: brightness(0.95); }
main { max-width: 1080px; margin: 36px auto; padding: 0 20px; }
.grid { display:grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 20px; }
.card { border: 1px solid #e5e7eb; border-radius: 14px; padding: 16px; background: #fff; }
.card h3 { margin: 0 0 8px; }
.muted { color:#64748b; font-size: 14px; }
footer { border-top: 1px solid #e5e7eb; margin-top: 48px; padding: 24px 20px; color:#475569; font-size:14px }
.og { display:block; max-width: 680px; width:100%; height:auto; margin: 16px auto; border-radius:12px; box-shadow: 0 10px 30px rgba(0,0,0,.22); }
section { margin-bottom: 28px; }
/* Contact form */
.form-card { background:#fff; border:1px solid #e5e7eb; border-radius:14px; padding:18px; }
form .row { display:grid; gap:14px; grid-template-columns:1fr; }
@media (min-width: 720px) { form .row.two { grid-template-columns:1fr 1fr; } }
label { font-weight:600; font-size:14px; display:block; margin-bottom:6px; }
input[type="text"], input[type="email"], input[type="tel"], textarea, select {
  width:100%; padding:10px 12px; border:1px solid #cbd5e1; border-radius:10px; font-size:16px; background:#fff;
}
textarea { min-height: 120px; resize: vertical; }
.checks { display:grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap:6px 16px; margin: 8px 0 2px; }
.checks label { font-weight:500; display:flex; align-items:center; gap:8px; }
.btn { display:inline-flex; align-items:center; gap:8px; background: var(--navy); color:#fff; border:none; padding:12px 16px; border-radius:10px; cursor:pointer; font-weight:700; }
.btn:disabled { opacity:.6; cursor: not-allowed; }
.note { font-size:12px; color:#64748b; }
.status { margin-top:10px; font-size:14px; }
.status.ok { color:#065f46; }
.status.err { color:#b91c1c; }


/* Mobile call button */
.call-fab {
  position: fixed;
  right: 18px;
  bottom: 18px;
  z-index: 50;
  display: none; /* mobile only */
  align-items: center;
  gap: 8px;
  padding: 12px 16px;
  border-radius: 9999px;
  background: var(--teal);
  color: #042b27;
  font-weight: 800;
  text-decoration: none;
  box-shadow: 0 10px 30px rgba(0,0,0,.24);
}
.call-fab svg { display:block }
@media (max-width: 720px) {
  .call-fab { display: inline-flex; }
}
