:root{
  --bg:#031335;
  --bg-end:#025BAE;
  --bg-2:#0e2148;
  --ink:#A7B4C2;
  --ink-soft:rgba(167,180,194,0.78);
  --ink-mute:rgba(167,180,194,0.5);
  --cream:rgba(167,180,194,0.9);
  --accent:#158EFF;
  --accent-2:#5aaeff;
  --line:rgba(167,180,194,0.18);
  --display:'Space Grotesk',-apple-system,BlinkMacSystemFont,sans-serif;
  --logo:'Unbounded','Space Grotesk',-apple-system,sans-serif;
  --sans:'Space Grotesk',-apple-system,sans-serif;
  --pad:clamp(24px,5vw,72px);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  background:linear-gradient(135deg, var(--bg) 0%, var(--bg-end) 100%);
  background-attachment:fixed;
  color:var(--ink);
  font-family:var(--sans);
  font-weight:300;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
::selection{background:var(--accent);color:var(--bg)}

#wind{position:fixed;inset:0;width:100%;height:100%;z-index:0;pointer-events:none}
.vignette{position:fixed;inset:0;z-index:1;pointer-events:none;background:radial-gradient(ellipse at center, transparent 35%, rgba(8,18,42,0.5) 95%)}
.grain{
  position:fixed;inset:0;z-index:2;pointer-events:none;opacity:0.08;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.9'/%3E%3C/svg%3E");
  mix-blend-mode:overlay;
}
main, header, footer{position:relative;z-index:3}
.wrap{max-width:1320px;margin:0 auto;padding:0 var(--pad)}

header{
  position:fixed;top:0;left:0;right:0;z-index:50;
  padding:24px var(--pad);
  display:flex;align-items:center;justify-content:space-between;
}
.brand{
  font-family:var(--logo);
  font-size:1.38rem;font-weight:800;
  letter-spacing:-0.02em;
  text-decoration:none;color:var(--ink);
  display:flex;align-items:center;gap:8px;
}
.brand em{font-style:normal;font-weight:800;color:var(--accent)}
.brand-dot{
  width:7px;height:7px;border-radius:50%;
  background:var(--accent);display:inline-block;
  margin-left:4px;animation:pulse 3s ease-in-out infinite;
}
@keyframes pulse{0%,100%{opacity:0.6;transform:scale(1)}50%{opacity:1;transform:scale(1.2)}}
.lang-switch{
  display:flex;gap:18px;align-items:center;
  font-size:0.82rem;letter-spacing:0.18em;
  text-transform:uppercase;font-weight:500;
}
.lang-switch a{
  color:var(--ink-mute);text-decoration:none;
  transition:color .3s;
}
.lang-switch a:hover{color:var(--ink)}
.lang-switch a.active{color:var(--accent)}

.hero{
  min-height:100vh;
  display:flex;flex-direction:column;justify-content:center;
  padding:120px var(--pad) 60px;
  position:relative;
}
.hero-tag{
  font-size:0.75rem;letter-spacing:0.24em;text-transform:uppercase;
  color:var(--accent);margin-bottom:48px;
  display:flex;align-items:center;gap:14px;
  font-weight:500;
}
.hero-tag::before{content:'';width:32px;height:1px;background:var(--accent)}
.hero h1{
  font-family:var(--display);
  font-size:clamp(3rem,10vw,10rem);
  font-weight:400;
  line-height:0.92;
  letter-spacing:-0.055em;
  max-width:14ch;
  color:var(--ink);
}
.hero h1 em{
  font-style:normal;font-weight:500;
  color:transparent;
  background-image:linear-gradient(90deg,
    rgba(21,142,255,1) 0%,
    rgba(21,142,255,1) 18%,
    rgba(21,142,255,0.6) 32%,
    rgba(21,142,255,1) 50%,
    rgba(21,142,255,0.6) 68%,
    rgba(21,142,255,1) 82%,
    rgba(21,142,255,1) 100%
  );
  background-size:200% 100%;
  -webkit-background-clip:text;
  background-clip:text;
  animation:airFlow 12s linear infinite;
}
@keyframes airFlow{
  from{background-position:0% 0}
  to{background-position:-200% 0}
}
.hero-bottom{
  position:absolute;bottom:48px;left:var(--pad);right:var(--pad);
  display:flex;justify-content:space-between;align-items:flex-end;
  font-size:0.78rem;letter-spacing:0.18em;text-transform:uppercase;
  color:var(--ink-mute);
}
.hero-bottom span{display:block}
.scroll-dot{
  width:24px;height:38px;border:1px solid var(--ink-mute);border-radius:14px;
  position:relative;
}
.scroll-dot::after{
  content:'';position:absolute;top:8px;left:50%;
  width:3px;height:6px;background:var(--accent);
  border-radius:2px;transform:translateX(-50%);
  animation:scrollD 2s ease-in-out infinite;
}
@keyframes scrollD{0%{opacity:0;transform:translate(-50%,0)}50%{opacity:1}100%{opacity:0;transform:translate(-50%,16px)}}

.statement{
  min-height:80vh;
  display:flex;align-items:center;
  padding:120px var(--pad);
  position:relative;
}
.statement-inner{max-width:1320px;margin:0 auto;width:100%}
.label{
  font-size:0.72rem;letter-spacing:0.22em;text-transform:uppercase;
  color:var(--ink-mute);margin-bottom:32px;
  display:flex;align-items:center;gap:12px;
}
.label .num{color:var(--accent);font-family:var(--display);font-style:normal;letter-spacing:0;font-size:0.95rem;font-weight:500}
.big{
  font-family:var(--display);
  font-size:clamp(2.2rem,6vw,5rem);
  font-weight:400;line-height:1.02;letter-spacing:-0.04em;
  max-width:18ch;
  color:var(--ink);
}
.big em{font-style:normal;color:var(--accent);font-weight:500}

/* Canada section with subtle flag */
.statement-canada .statement-inner{
  display:grid;
  grid-template-columns:1fr auto;
  gap:clamp(40px,6vw,100px);
  align-items:center;
}
.statement-canada .big{max-width:20ch}

/* Philosophy section with product image */
.statement-philosophy .statement-inner{
  display:grid;
  grid-template-columns:auto 1fr;
  gap:clamp(40px,6vw,100px);
  align-items:center;
}
.statement-philosophy .big{max-width:20ch}
.product-img-wrap{width:clamp(220px,26vw,380px)}
.product-img{width:100%;height:auto;display:block}
@media(max-width:880px){
  .statement-philosophy .statement-inner{grid-template-columns:1fr}
  .product-img-wrap{width:240px;margin-bottom:24px}
}
.ca-flag-wrap{
  width:clamp(220px,26vw,380px);
}
.ca-flag{
  width:100%;height:auto;display:block;
}
@media(max-width:880px){
  .statement-canada .statement-inner{grid-template-columns:1fr}
  .ca-flag-wrap{width:240px;margin-top:24px}
}

.pillars{
  padding:140px var(--pad);
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
  background:rgba(3, 19, 53, 0.25);
}
.pillars-grid{
  max-width:1320px;margin:0 auto;
  display:grid;grid-template-columns:repeat(3,1fr);
  gap:0;
}
.pillar{
  padding:40px 32px;
  border-right:1px solid var(--line);
  transition:background .4s;
}
.pillar:last-child{border-right:none}
.pillar:hover{background:var(--bg-2)}
.pillar-num{
  font-family:var(--display);font-style:normal;
  color:var(--accent);font-size:0.95rem;font-weight:500;
  margin-bottom:32px;display:block;letter-spacing:0.02em;
}
.pillar h3{
  font-family:var(--display);
  font-size:1.8rem;font-weight:400;
  letter-spacing:-0.03em;line-height:1.1;
  color:var(--ink);
}
.pillar h3 em{font-style:normal;color:var(--accent);font-weight:500}

.cta{
  min-height:90vh;
  display:flex;align-items:center;justify-content:center;
  padding:120px var(--pad);
  text-align:center;
  border-top:1px solid var(--line);
  background:rgba(3, 19, 53, 0.25);
}
.cta a{
  text-decoration:none;color:var(--ink);
  display:inline-flex;flex-direction:column;align-items:center;gap:32px;
  transition:transform .6s ease;
}
.cta a:hover{transform:translateY(-4px)}
.cta .label{justify-content:center}
.cta .big-link{
  font-family:var(--display);
  font-size:clamp(2.5rem,8vw,7rem);
  font-weight:400;letter-spacing:-0.05em;line-height:1;
  display:inline-flex;align-items:baseline;gap:24px;
  flex-wrap:wrap;justify-content:center;
  color:var(--ink);
}
.cta .big-link em{font-style:normal;color:var(--accent);font-weight:500}
.cta .arrow{
  font-family:var(--display);font-style:normal;
  transition:transform .5s ease;
  display:inline-block;
  color:var(--accent);
}
.cta a:hover .arrow{transform:translateX(16px)}

footer{
  padding:60px var(--pad) 32px;
  border-top:1px solid var(--line);
}
.footer-row{
  max-width:1320px;margin:0 auto;
  display:flex;justify-content:space-between;align-items:center;
  flex-wrap:wrap;gap:24px;
  font-size:0.78rem;letter-spacing:0.14em;text-transform:uppercase;
  color:var(--ink-mute);
}
.footer-row a{color:var(--ink-soft);text-decoration:none;transition:color .3s}
.footer-row a:hover{color:var(--accent)}

.reveal{opacity:0;transform:translateY(40px);transition:opacity 1.4s cubic-bezier(.2,.7,.2,1),transform 1.4s cubic-bezier(.2,.7,.2,1)}
.reveal.in{opacity:1;transform:translateY(0)}

@media(max-width:880px){
  .lang-switch{gap:14px;font-size:0.75rem}
  .hero{padding-top:100px}
  .hero h1{font-size:clamp(2.8rem,14vw,6rem)}
  .pillars-grid{grid-template-columns:1fr}
  .pillar{border-right:none;border-bottom:1px solid var(--line);padding:36px 0}
  .pillar:last-child{border-bottom:none}
  .hero-bottom{position:static;margin-top:60px;flex-direction:column;gap:24px;align-items:flex-start}
}
