:root { --navy:#031329; --navy2:#061f42; --blue:#075df2; --electric:#1685ff; --gold:#f5b51b; --silver:#d8e1eb; --white:#fff; --ink:#0b1b34; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:#fff; color:var(--ink); font-family:Arial,Helvetica,sans-serif; }
a { color:inherit; text-decoration:none; }
button { font:inherit; }
.site-header { height:86px; padding:0 4.4vw 0 21vw; position:relative; z-index:20; display:flex; align-items:center; justify-content:space-between; background:linear-gradient(90deg,#020f22,#061a38); color:#fff; border-bottom:1px solid rgba(255,255,255,.25); }
.brand { position:absolute; left:4.1vw; top:8px; width:200px; filter:drop-shadow(0 9px 10px rgba(0,0,0,.4)); z-index:3; }
.brand img { width:100%; height:auto; display:block; }
.nav { display:flex; gap:clamp(16px,2.6vw,42px); height:100%; align-items:center; }
.nav a { font-size:14px; font-weight:650; position:relative; white-space:nowrap; }
.nav a:first-child { color:#52a0ff; }
.nav a:first-child:after { content:""; position:absolute; left:0; right:0; bottom:-17px; height:3px; background:var(--electric); }
.header-actions { display:flex; align-items:center; gap:26px; }
.language { display:flex; align-items:center; gap:8px; font-size:14px; }
.language button { background:none; border:0; color:#a9b7cb; padding:5px 2px; cursor:pointer; font-weight:700; }
.language button.active { color:#4c9cff; }
.facebook-button { border:1px solid rgba(255,255,255,.6); border-radius:7px; padding:10px 14px; font-weight:650; font-size:14px; display:flex; align-items:center; gap:9px; }
.facebook-button span { width:22px; height:22px; background:#fff; color:#0b2855; border-radius:50%; display:grid; place-items:center; font-family:Georgia,serif; font-weight:bold; }
.menu-button { display:none; }

.hero { min-height:610px; background-image:linear-gradient(90deg,rgba(2,16,35,.98) 0%,rgba(3,23,50,.92) 31%,rgba(4,24,50,.52) 51%,rgba(2,15,32,.05) 76%),url('assets/images/hero-sunrise.webp'); background-size:cover; background-position:center; position:relative; color:#fff; display:flex; align-items:center; padding:100px 7vw 70px; }
.hero-copy { max-width:630px; }
.eyebrow { color:#75b6ff; text-transform:uppercase; letter-spacing:.18em; font-size:12px; font-weight:800; margin:0 0 15px; }
.hero h1 { font-family:Arial,Helvetica,sans-serif; font-size:clamp(50px,4.55vw,72px); font-weight:900; line-height:.96; letter-spacing:-.045em; text-transform:uppercase; max-width:700px; margin:0 0 25px; text-shadow:0 5px 24px rgba(0,0,0,.3); }
.hero h1 span { display:block; }
.hero-intro { font-size:17px; line-height:1.55; color:#e4ebf5; max-width:560px; margin:0 0 28px; }
.hero-buttons { display:flex; gap:18px; flex-wrap:wrap; }
.button { min-height:56px; padding:0 25px; display:inline-flex; align-items:center; justify-content:center; gap:24px; border-radius:6px; font-weight:760; transition:.2s ease; border:1px solid transparent; cursor:pointer; }
.button b { font-size:24px; font-weight:400; transition:transform .2s; }
.button:hover { transform:translateY(-2px); }
.button:hover b { transform:translateX(4px); }
.button.primary { background:linear-gradient(135deg,#0865ff,#0751d7); box-shadow:0 0 0 2px rgba(26,132,255,.3),0 12px 28px rgba(0,63,190,.35); color:#fff; }
.button.secondary { background:rgba(3,19,41,.72); border-color:rgba(255,255,255,.72); color:#fff; }
.hero-credit { position:absolute; right:22px; bottom:17px; color:rgba(255,255,255,.6); font-size:11px; }

.regions { margin-top:-2px; padding:32px 5vw 78px; background:linear-gradient(#fff,#f1f5fa); border-radius:54px 54px 0 0; position:relative; z-index:4; }
.section-heading { display:grid; grid-template-columns:1fr minmax(300px,700px) 1fr; align-items:center; gap:28px; text-align:center; margin:0 auto 28px; max-width:1340px; }
.section-heading>span { height:1px; background:linear-gradient(90deg,transparent,#aeb9c6); }
.section-heading>span:last-child { background:linear-gradient(90deg,#aeb9c6,transparent); }
.section-heading p:first-child { color:var(--blue); text-transform:uppercase; letter-spacing:.17em; font-size:11px; font-weight:800; margin:0 0 5px; }
.section-heading h2 { font-size:clamp(32px,3vw,46px); font-weight:900; text-transform:uppercase; letter-spacing:-.035em; margin:0; }
.section-intro { margin:8px auto 0; color:#617089; font-size:15px; line-height:1.5; max-width:630px; }
.region-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:18px; max-width:1450px; margin:auto; }
.region-card { min-height:255px; border-radius:14px; overflow:hidden; position:relative; color:#fff; box-shadow:0 12px 28px rgba(11,27,52,.16); transition:.22s ease; display:flex; flex-direction:column; justify-content:flex-end; background-color:#153665; }
.region-card:before { content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(5,23,48,.02) 28%,rgba(3,17,37,.94) 100%),linear-gradient(135deg,transparent 42%,rgba(27,114,255,.5) 43%,transparent 44%); }
.region-card { background-size:cover; background-position:center; }
.region-card.canada { background-image:url('assets/images/region-canada.webp'); }
.region-card.usa { background-image:url('assets/images/region-usa.webp'); }
.region-card.europe { background-image:url('assets/images/region-europe.webp'); }
.region-card.international { background-image:url('assets/images/region-international.webp'); }

[data-fr] { display:none; }
html[data-language="fr"] [data-en] { display:none; }
html[data-language="fr"] [data-fr] { display:revert; }
.region-card:hover { transform:translateY(-6px); box-shadow:0 18px 38px rgba(11,27,52,.26); }
.region-road { position:absolute; inset:0; overflow:hidden; opacity:.2; }
.region-road i:first-child { position:absolute; width:50%; height:120%; right:13%; top:27%; background:#1b2430; transform:perspective(300px) rotateX(70deg) rotateZ(-8deg); border-left:4px solid #e7edf2; border-right:4px solid #e7edf2; }
.region-road i:nth-child(2) { position:absolute; width:4px; height:80%; background:repeating-linear-gradient(#f7c42c 0 18px,transparent 18px 32px); right:36%; top:42%; transform:rotate(-8deg); }
.region-content { position:relative; z-index:2; padding:22px; }
.region-content h3 { text-transform:uppercase; font-size:30px; font-weight:900; letter-spacing:-.035em; margin:0 0 4px; }
.region-content p { font-size:12px; color:#d1dbea; min-height:33px; margin:0 0 12px; }
.region-content strong { font-size:12px; color:#fff; display:flex; justify-content:space-between; border-top:1px solid rgba(255,255,255,.25); padding-top:11px; }
.region-content strong span { color:#64a7ff; font-size:16px; }

.about { padding:88px 8vw; background:linear-gradient(115deg,#03152f 0%,#082a57 62%,#075ee1 140%); color:#fff; display:grid; grid-template-columns:minmax(250px,420px) minmax(300px,690px); align-items:center; justify-content:center; gap:8vw; overflow:hidden; }
.about-mark { position:relative; }
.about-mark:before { content:""; position:absolute; width:420px; height:420px; border:1px solid rgba(54,139,255,.35); border-radius:50%; left:50%; top:50%; transform:translate(-50%,-50%); box-shadow:0 0 70px rgba(21,112,245,.25); }
.about-mark img { width:100%; position:relative; filter:drop-shadow(0 20px 22px rgba(0,0,0,.35)); }
.about-copy h2 { font-size:clamp(40px,4.2vw,64px); font-weight:900; letter-spacing:-.045em; line-height:1.02; text-transform:uppercase; margin:0 0 22px; }
.about-copy>p:not(.eyebrow) { font-size:18px; color:#dce7f5; line-height:1.7; margin:0 0 26px; }
.about-copy>a { color:#77b5ff; font-weight:750; display:inline-flex; gap:18px; align-items:center; }
.about-copy>a span { font-size:24px; }
.eyebrow.blue { color:#68aaff; }

.features { padding:86px 6vw 100px; background:#fff; }
.section-heading.compact { margin-bottom:42px; }
.feature-grid { max-width:1240px; margin:auto; display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.feature-grid article { padding:34px; border:1px solid #dbe3ed; border-radius:14px; background:linear-gradient(145deg,#fff,#f4f7fb); position:relative; overflow:hidden; }
.feature-grid article:after { content:""; position:absolute; height:4px; left:0; right:0; bottom:0; background:linear-gradient(90deg,var(--blue),var(--electric),var(--gold)); }
.feature-number { font-weight:900; color:#c4d0df; font-size:52px; line-height:1; }
.feature-grid h3 { font-size:22px; margin:16px 0 10px; }
.feature-grid p { color:#627188; line-height:1.65; margin:0; }

.final-cta { padding:65px 8vw; background:linear-gradient(105deg,#061932,#0b3d80); color:#fff; display:flex; align-items:center; justify-content:space-between; gap:40px; }
.final-cta h2 { font-size:clamp(36px,3.5vw,56px); font-weight:900; letter-spacing:-.04em; text-transform:uppercase; margin:0 0 8px; }
.final-cta p:not(.eyebrow) { color:#d4e1f1; margin:0; }
.button.gold { background:linear-gradient(135deg,#ffd34f,#eda800); color:#06152d; white-space:nowrap; box-shadow:0 10px 25px rgba(226,157,0,.25); }
footer { background:#020d1e; color:#adbacd; padding:36px 6vw; display:grid; grid-template-columns:140px 1fr auto; align-items:center; gap:35px; font-size:12px; }
footer img { width:120px; }
footer p { margin:3px 0; }
.footer-links { display:flex; gap:24px; color:#fff; font-weight:650; }

@media (max-width:1100px) {
  .site-header { padding-left:230px; }
  .brand { left:25px; width:175px; }
  .nav { gap:17px; }
  .nav a:nth-child(4),.nav a:nth-child(5) { display:none; }
  .facebook-button { display:none; }
  .region-grid { grid-template-columns:repeat(2,1fr); }
}
@media (max-width:760px) {
  .site-header { height:72px; padding:0 22px; justify-content:flex-end; }
  .brand { left:16px; top:7px; width:115px; }
  .menu-button { display:flex; width:42px; height:42px; flex-direction:column; justify-content:center; gap:5px; background:transparent; border:0; margin-left:auto; margin-right:18px; cursor:pointer; }
  .menu-button span { width:25px; height:2px; background:#fff; }
  .nav { display:none; position:absolute; left:0; right:0; top:72px; background:#04152e; height:auto; padding:28px; flex-direction:column; align-items:flex-start; }
  .nav.open { display:flex; }
  .nav a:first-child:after { display:none; }
  .header-actions { gap:8px; }
  .hero { min-height:670px; padding:170px 24px 70px; align-items:flex-start; background-position:64% center; }
  .hero:before { content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(2,15,34,.26),rgba(2,15,34,.95) 68%); }
  .hero-copy { position:relative; z-index:2; }
  .hero h1 { font-size:48px; }
  .hero-intro { font-size:15px; }
  .hero-buttons { flex-direction:column; align-items:stretch; }
  .button { width:100%; }
  .regions { border-radius:30px 30px 0 0; padding:36px 20px 60px; }
  .section-heading { grid-template-columns:1fr; gap:0; }
  .section-heading>span { display:none; }
  .region-grid { grid-template-columns:1fr; }
  .about { grid-template-columns:1fr; padding:65px 28px; text-align:center; }
  .about-mark { max-width:280px; margin:auto; }
  .about-mark:before { width:300px; height:300px; }
  .feature-grid { grid-template-columns:1fr; }
  .features { padding:65px 22px; }
  .final-cta { flex-direction:column; text-align:center; padding:55px 25px; }
  footer { grid-template-columns:1fr; text-align:center; justify-items:center; }
  .footer-links { flex-wrap:wrap; justify-content:center; }
}

@media (prefers-reduced-motion:reduce) { html{scroll-behavior:auto} *{transition:none!important} }
