
:root{
  /* Canada-inspired palette */
  --bg:#f7f7f9;         /* off-white */
  --paper:#ffffff;      /* cards */
  --ink:#0a0a0f;        /* text */
  --muted:#5b6472;
  --brand:#d32f2f;      /* maple red */
  --brand-dark:#b71c1c;
  --ring:rgba(211,47,47,.18);
  --nav:#0f1b2d;        /* deep navy for header contrast */
}

*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--bg);color:var(--ink);font:16px/1.6 system-ui,-apple-system,Segoe UI,Roboto,Arial}

/* Global subtle maple-leaf canvas */
body{
  background-image:
    radial-gradient(1200px 600px at 10% -10%, rgba(211,47,47,.06) 0%, rgba(211,47,47,0) 55%),
    url('/assets/bg-canada.svg');
  background-size: cover, 820px auto;
  background-repeat: no-repeat, repeat;
  background-attachment: fixed, fixed;
}

a{color:var(--brand);text-decoration:none}
a:hover{color:var(--brand-dark)}

.container{max-width:1100px;margin:0 auto;padding:0 18px}

/* Header */
.top{position:sticky;top:0;z-index:40;background:var(--nav);border-bottom:1px solid rgba(255,255,255,.06);backdrop-filter:saturate(140%) blur(6px)}
.nav{display:flex;align-items:center;justify-content:space-between;padding:14px 0}
.brand{display:flex;gap:10px;align-items:center;font-weight:700}
.brand .dot{width:12px;height:12px;border-radius:50%;background:linear-gradient(135deg,#ff8a80,#ff5252);box-shadow:0 0 0 4px rgba(255,82,82,.15)}
.menu a{margin:0 10px;color:#e6edf8}
.btn{display:inline-block;background:var(--brand);color:#fff;font-weight:600;padding:10px 14px;border-radius:12px;box-shadow:0 12px 30px var(--ring)}
.btn.ghost{background:transparent;border:1px solid var(--brand);color:#ffecec}

/* HERO */
.hero{
  min-height: 480px;
  color:#fff;
  background:
    linear-gradient(180deg, rgba(15,27,45,.92), rgba(15,27,45,.70)),
    radial-gradient(1000px 520px at 20% -20%, rgba(255,255,255,.06) 0%, rgba(255,255,255,0) 60%),
    url('/assets/bg-canada.svg');
  background-size: cover, 100% 100%, 720px auto;
  background-repeat: no-repeat, no-repeat, repeat;
  background-position: center, center, top left;
}
.hero .container{padding:88px 18px}
.hero h1{font-size:40px;margin:0 0 12px}
.hero p{max-width:760px;opacity:.95}

/* Sections & cards */
.section{padding:28px 0}
.grid{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.card{background:var(--paper);border:1px solid #eaecef;border-radius:16px;padding:16px;box-shadow:0 6px 18px rgba(15,27,45,.04)}
.card h3{margin-top:6px}
.card img{display:block;width:100%;height:220px;object-fit:cover;border-radius:12px;border:1px solid #eaecef;background:#fff}

/* Footer */
.foot{margin:36px 0 46px;text-align:center;color:#6b7280}
.small{color:#6b7280;font-size:14px}
