
:root {
  --navy: #092C5C;
  --orange: #FF7A1A;
  --ink: #1C232B;
  --muted: #6D7884;
  --pale: #F3F6FB;
  --bg: #FFFFFF;
}

* { box-sizing: border-box; }
body { margin:0; font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; color:var(--ink); background:var(--bg); }
a { color: var(--navy); text-decoration: none; }
a:hover { text-decoration: underline; }

.container { width: min(1100px, 92%); margin: 0 auto; }

.site-header { position: sticky; top: 0; z-index: 50; background: rgba(255,255,255,.96); backdrop-filter: saturate(180%) blur(6px); border-bottom: 1px solid #eee; }
.nav { display:flex; align-items:center; justify-content:space-between; padding: .6rem 0; gap: 1rem; }
.brand { display:flex; align-items:center; gap:.5rem; font-weight:700; color:var(--navy); }
.main-nav { display:flex; gap:1rem; align-items:center; }
.main-nav a { padding:.35rem .6rem; border-radius: 6px; }
.main-nav .cta { background: var(--orange); color: #fff; }
.hamburger { display:none; background:none; border:none; font-size:1.5rem; }

.hero { padding: 4.5rem 0 2.5rem; background: linear-gradient(180deg, #fff, var(--pale)); }
.hero h1 { font-size: clamp(28px, 4vw, 44px); color: var(--navy); margin:0 0 .5rem; line-height:1.15; }
.hero .sub { color: var(--muted); max-width: 800px; }
.actions { display:flex; gap:.75rem; margin-top:1rem; flex-wrap:wrap; }

.page-hero { padding: 2.25rem 0 1.25rem; background: linear-gradient(180deg, #fff, var(--pale)); border-bottom:1px solid #e9eef6; }
.page-hero h1 { font-size: clamp(26px, 3vw, 36px); color: var(--navy); margin:0 0 .3rem; }
.page-hero .sub { color: var(--muted); max-width: 800px; }

.btn { display:inline-block; padding:.65rem 1rem; border-radius:8px; border:1px solid var(--navy); font-weight:600; }
.btn.primary { background: var(--navy); color:#fff; border-color:var(--navy); }
.btn.ghost { background:#fff; color:var(--navy); }
.price { color: var(--navy); margin-top:.6rem; }

.tiles { display:grid; grid-template-columns: repeat(auto-fit,minmax(240px,1fr)); gap:1rem; margin:2rem auto; }
.tile { background:#fff; border:1px solid #eee; border-radius:12px; padding:1rem; }
.tile h3 { margin-top:.2rem; color: var(--navy); }
.tile ul { margin:.5rem 0 0 1rem; }

.section { padding: 2rem 0; }
.section h2, .section h1 { color: var(--navy); margin-bottom:.5rem; }
.strip { background: var(--pale); padding:2rem 0; border-top:1px solid #e9eef6; border-bottom:1px solid #e9eef6; }
.strip-grid { display:grid; grid-template-columns: repeat(auto-fit,minmax(260px,1fr)); gap:1.2rem; }

.cards { display:grid; grid-template-columns: repeat(auto-fit,minmax(280px,1fr)); gap:1rem; margin:1rem 0; }
.card { background:#fff; border:1px solid #eee; border-radius:12px; padding:1rem; }
.card h3 { color: var(--navy); margin-top: .2rem; }
.card .price { margin-top:.6rem; }

.note { margin-top:1rem; color: var(--muted); font-size:.95rem; }

.site-footer { background:#fafbfe; border-top:1px solid #eee; margin-top:2rem; }
.site-footer .footer-grid { display:grid; grid-template-columns: repeat(auto-fit,minmax(200px,1fr)); gap:1rem; padding:1.3rem 0; }
.site-footer .legal { color:#8a94a1; font-size:.9rem; padding: .6rem 0 1.2rem; border-top:1px solid #eee; }

.sticky-cta { position: fixed; bottom: 16px; right: 16px; display:flex; gap:.5rem; z-index: 60; }
.sticky-cta a { background: var(--orange); color:#fff; padding:.55rem .8rem; border-radius:999px; box-shadow: 0 6px 18px rgba(255,122,26,.25); font-weight:600; }
.sticky-cta a:nth-child(2) { background: #fff; color: var(--navy); border: 1px solid var(--navy); box-shadow: 0 6px 18px rgba(9,44,92,.12); }

details { background:#fff; border:1px solid #eee; border-radius:10px; padding:.8rem 1rem; margin:.5rem 0; }
details[open] summary { color: var(--navy); }
summary { cursor:pointer; font-weight:600; }

.muted { color: var(--muted); font-size:.95rem; }

@media (max-width: 860px) {
  .main-nav { display:none; }
  .hamburger { display:block; }
}
