/* Single palette — Maersk style */
:root{
  --color-bg:#FFFFFF;--color-alt:#EAF3F8;--color-surface:#FFFFFF;--color-deep:#06212F;
  --color-primary:#0B2C3D;--color-accent:#42B0D5;
  --color-text:#0B2C3D;--color-muted:#5A7383;--color-line:#DCE7EE;
  --font-heading:'Archivo',sans-serif;--font-drama:'Space Grotesk',sans-serif;--font-mono:'JetBrains Mono',monospace;
  --motion-duration:0.5;--motion-ease:power2.out;--motion-stagger:0.07;
  --radius-card:0.5rem;--section-py:6.5rem;--content-max-w:60rem;
}
html{scroll-behavior:smooth;}
body{background:var(--color-bg);color:var(--color-text);font-family:var(--font-heading);overflow-x:hidden;}

#progress{position:fixed;top:0;left:0;height:3px;width:0%;background:var(--color-accent);z-index:60;}

#navbar{transition:all .35s ease;background:transparent;}
#navbar.scrolled{background:color-mix(in srgb,var(--color-deep) 85%,transparent);backdrop-filter:blur(14px);box-shadow:0 6px 20px -10px rgba(0,0,0,.4);}

.btn-cta{position:relative;display:inline-flex;align-items:center;gap:.5rem;border-radius:var(--radius-card);
  transition:transform .3s ease,box-shadow .3s ease,filter .3s ease;}
.btn-cta:hover{transform:translateY(-2px);filter:brightness(1.08);box-shadow:0 14px 32px -12px rgba(11,44,61,.5);}
.lift{transition:transform .25s ease;}.lift:hover{transform:translateY(-2px);}

.reveal{opacity:0;}
.cap-card{transition:transform .3s ease,border-color .3s ease,box-shadow .3s ease;}
.cap-card:hover{transform:translateY(-4px);border-color:var(--color-accent);box-shadow:0 18px 40px -20px rgba(11,44,61,.35);}

.ken{animation:ken 24s ease-in-out infinite alternate;}
@keyframes ken{from{transform:scale(1)}to{transform:scale(1.08)}}

/* ── Hero overlay ────────────────────────────────────── */
.hero-overlay{
  background:linear-gradient(90deg,rgba(6,33,47,.90) 0%,rgba(6,33,47,.62) 45%,rgba(6,33,47,.15) 100%);
}

/* ── Mobile & tablet (< 768 px) ─────────────────────── */
@media(max-width:767px){
  :root{ --section-py:3.5rem; }
  /* Portrait mobile: left→right gradient leaves right side too bright */
  .hero-overlay{ background:rgba(6,33,47,.78); }
  a,button{ -webkit-tap-highlight-color:transparent; }
}

/* ── Prevent iOS auto-zoom on input focus (needs ≥ 16px) */
input,textarea,select{ font-size:1rem; }

/* ── Respect prefers-reduced-motion ─────────────────── */
@media(prefers-reduced-motion:reduce){
  .ken{ animation:none; }
  .reveal{ opacity:1!important; }
}