/* Shared layout, contrast, and form fixes for the static landing pages. */

.topbar{
  min-height:36px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  padding:8px 16px;
  background:#b0f3dd;
  color:#062824;
  font-weight:800;
  letter-spacing:.08em;
  font-size:12px;
  line-height:1.35;
  flex-wrap:wrap;
  text-align:center;
  text-transform:uppercase;
}

.site-header{
  background:#07172b;
  border-bottom:1px solid #a1c3d81f;
  position:sticky;
  top:0;
  z-index:40;
}
.header-bar{
  display:flex;
  align-items:center;
  gap:14px;
  min-height:68px;
  padding:8px 0;
  flex-wrap:nowrap;
}
.brand{
  display:inline-flex;
  align-items:center;
  gap:12px;
  color:#f5f4ed;
  text-decoration:none;
  flex:0 0 auto;
}
.brand img{height:34px;width:auto;display:block;flex:0 0 auto}
.brand strong{
  display:block;
  font-weight:850;
  font-size:16px;
  letter-spacing:-.45px;
  line-height:1.1;
  white-space:nowrap;
}
.brand-meta{
  display:block;
  color:#d7efe8;
  font-size:11px;
  font-weight:750;
  letter-spacing:.1em;
  text-transform:uppercase;
  margin-top:3px;
  line-height:1.3;
}
.header-bar .nav{
  display:flex;
  gap:14px;
  align-items:center;
  justify-content:center;
  flex:1 1 auto;
  min-width:0;
}
.header-bar .nav > a{white-space:nowrap}
.nav-extra{display:none}
.header-tools{
  display:flex;
  align-items:center;
  gap:8px;
  flex:0 0 auto;
  margin-left:auto;
}
.header-tools .lang{flex-wrap:nowrap}
.header-tools .lang a{
  min-height:34px;
  padding:0 8px;
  letter-spacing:.04em;
}
.header-cta{
  background:#94f0d9;
  color:#052936 !important;
  min-height:40px;
  padding:8px 14px;
  white-space:nowrap;
  font-size:12.5px;
  gap:8px;
}
.header-cta:hover{color:#052936 !important;background:#bbffe9}
.menu-toggle{
  display:none;
  align-items:center;
  justify-content:center;
  min-height:40px;
  padding:0 12px;
  border-radius:100px;
  border:1px solid #d9efea80;
  background:transparent;
  color:#edf9f5;
  font:inherit;
  font-size:12px;
  font-weight:750;
  letter-spacing:.04em;
  cursor:pointer;
}
.menu-toggle[aria-expanded="true"]{background:#12384a}

@media (max-width:1240px){
  .header-bar .nav{
    display:none;
    position:absolute;
    left:0;
    right:0;
    top:100%;
    background:#07172b;
    border-bottom:1px solid #a1c3d81f;
    flex-direction:column;
    align-items:stretch;
    justify-content:flex-start;
    padding:4px 22px 12px;
    gap:0;
    box-shadow:0 18px 40px #00000055;
  }
  .header-bar .nav.is-open{display:flex}
  .header-bar .nav > a{
    padding:13px 2px;
    border-bottom:1px solid #a1c3d826;
    font-size:15px;
    white-space:normal;
  }
  .menu-toggle{display:inline-flex;flex:0 0 auto}
}

@media (max-width:860px){
  .header-tools .lang,
  .header-tools .header-cta{display:none}
  .nav-extra{
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    gap:14px;
    padding:16px 2px 6px;
  }
  .nav-extra .header-cta{min-height:46px}
  .header-bar{gap:10px}
  .brand{flex:0 0 auto;min-width:0;max-width:none}
}
@media (max-width:480px){
  .brand{gap:8px}
  .brand img{height:28px}
  .brand strong{font-size:14px;letter-spacing:-.3px}
  .brand > span[aria-hidden="true"]{display:none}
  .menu-toggle{min-height:38px;padding:0 11px}
}

.hero{
  position:relative;
  overflow:hidden;
  background:#061223;
}
.hero-layout{
  position:relative;
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:36px 56px;
}
.hero-layout.sec{
  padding-top:72px;
  padding-bottom:84px;
}
.hero-copy{
  flex:1.15 1 500px;
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:22px;
}
.hero-copy .section-topline{margin-bottom:0}
.hero-copy h1{
  margin:0;
  font-size:clamp(46px, 5.4vw, 78px);
  font-weight:700;
  letter-spacing:-2.4px;
  line-height:1.02;
  max-width:13em;
}
.hero-lead{
  margin:0;
  max-width:38rem;
  font-size:18px;
  line-height:1.65;
  color:#e6f4ef;
}
.hero-actions{display:flex;gap:18px;flex-wrap:wrap;align-items:center}
.hero-actions .textlink{
  margin-top:0;
  align-items:center;
  min-height:54px;
  font-size:15px;
}
.hero-figure{
  flex:0.85 1 420px;
  min-width:0;
  margin:0;
  background:#102d42;
  border:1px solid #a1c3d82d;
  border-radius:22px;
  overflow:hidden;
}
.hero-figure-bar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:16px 20px;
  border-bottom:1px solid #a1c3d82d;
}
.hero-figure-canvas{background:#061223}
.hero-figure-canvas svg{display:block;width:100%;height:auto}
.hero-figure figcaption{
  margin:0;
  padding:16px 20px 18px;
  font-size:13px;
  line-height:1.65;
  color:#d7ebe6;
}
.trust-strip{background:#e7f4ee;color:#173637}
section[id]{scroll-margin-top:84px}

@media (max-width:900px){
  .hero-layout{flex-direction:column;align-items:stretch;flex-wrap:nowrap}
  .hero-layout.sec{padding-top:52px;padding-bottom:60px}
  .hero-copy{flex-basis:auto}
  .hero-copy h1{font-size:clamp(40px, 9vw, 60px);letter-spacing:-1.8px}
  .hero-figure{flex-basis:auto;width:100%}
}
.figure-caption{
  position:absolute;
  left:50%;
  bottom:18px;
  transform:translateX(-50%);
  font-size:12px;
  letter-spacing:.1em;
  font-weight:750;
  color:#e7f6f1;
  white-space:nowrap;
  text-transform:uppercase;
}
.float-kicker{
  display:block;
  font-size:11px;
  letter-spacing:.08em;
  margin-bottom:3px;
  font-weight:800;
  text-transform:uppercase;
  line-height:1.35;
}
.limit-note{
  border-top:1px solid #abc6bd7a;
  padding-top:14px;
  color:#1b453d;
  font-size:12px;
  letter-spacing:.05em;
  font-weight:760;
  margin-top:auto;
  line-height:1.45;
  text-transform:uppercase;
}
.limit-note.warn{color:#6a4322}
.role-pill{
  font-size:11px;
  letter-spacing:.07em;
  color:#163e37;
  font-weight:800;
  border:1px solid #6f9d8d;
  padding:8px 12px;
  border-radius:100px;
  text-transform:uppercase;
  line-height:1.3;
  text-align:center;
}

a.textlink{
  display:inline-flex;
  align-items:flex-end;
  gap:8px;
  margin-top:auto;
  max-width:100%;
  line-height:1.35;
  font-size:14px;
}
a.textlink .link-label{min-width:0}
a.textlink .link-arrow{flex:0 0 auto;line-height:1}

.field-error{
  margin:0;
  min-height:0;
  font-size:13px;
  line-height:1.4;
  color:#8d2d22;
  font-weight:680;
}
.field-error[hidden]{display:none !important}
.field[aria-invalid="true"]{
  border-color:#a33b32;
  background:#fff7f5;
}
.form-status{
  margin:0;
  padding:12px 14px;
  background:#e5f8f0;
  color:#123c37;
  border-radius:12px;
  font-weight:680;
  font-size:14px;
  line-height:1.45;
}
.form-status[hidden]{display:none !important}
.form-privacy{
  margin:0;
  font-size:13px;
  line-height:1.55;
  color:#2c4741;
}
.form-privacy a{color:#145c4c;font-weight:750;text-decoration:underline}
.form-note{
  margin:0;
  font-size:13px;
  line-height:1.55;
  color:#3d534d;
}

@media (max-width:700px){
  .brand-meta{display:none}
}

@media (prefers-reduced-motion:reduce){
  .menu-toggle,.header-cta{transition:none}
}