/* Veltrion interaction layer. Loaded last so it settles behaviour across every page. */

:root{ --v-blue:#C0392B; --v-blue-d:#9C2E22; --v-gold:#E2A72E; --v-ink:#14213D; }

/* ---------- prose links: visible, not guessable ---------- */
.prose a:not(.cta):not(.btn):not(.brand),
main p a:not(.cta):not(.btn):not(.arrow):not(.ext),
main li a:not(.cta):not(.btn),
.qa p a, .callout a, .disclosure a, .mi-foot a, .sfine a, .fine a{
  color:var(--v-blue);
  text-decoration:underline;
  text-decoration-thickness:1px;
  text-underline-offset:2px;
  transition:color .18s ease, text-decoration-color .18s ease;
}
.prose a:hover, main p a:hover, main li a:hover,
.qa p a:hover, .callout a:hover{ color:var(--v-blue-d); text-decoration-thickness:2px; }
footer .disclosure a, footer .fine a{ color:rgba(244,239,227,.85) }

/* ---------- one focus ring, everywhere, keyboard only ---------- */
a:focus-visible, button:focus-visible, input:focus-visible,
select:focus-visible, textarea:focus-visible, summary:focus-visible,
[tabindex]:focus-visible{
  outline:2px solid var(--v-gold);
  outline-offset:3px;
  border-radius:3px;
}
a:focus:not(:focus-visible), button:focus:not(:focus-visible){ outline:none }

/* ---------- every button answers the same way ---------- */
.cta,.btn,.btn-primary,.btn-ghost,.btn-g,.btn-o,.solid,.sbtn,button[type=submit]{
  transition:background-color .18s ease, color .18s ease, transform .16s ease,
             box-shadow .18s ease, border-color .18s ease;
  cursor:pointer;
}
.cta:hover,.btn:hover,.btn-primary:hover,.btn-g:hover,.solid:hover,
.sbtn:hover,button[type=submit]:hover{ transform:translateY(-1px) }
.cta:active,.btn:active,.btn-primary:active,.btn-g:active,.solid:active,
.sbtn:active,button[type=submit]:active{ transform:translateY(0); box-shadow:none }

/* legacy leaf pages used their own button names: bring them to the same look */
.btn-primary{ background:var(--v-blue); color:#fff; border-radius:999px; border:0 }
.btn-primary:hover{ background:var(--v-blue-d) }
.btn-ghost{ border-radius:999px }

/* ---------- clickable cards feel clickable ---------- */
a.door,a.ml,a.pol,a.pi,a.d,a.gv{ transition:transform .2s cubic-bezier(.2,.7,.3,1),
  box-shadow .2s ease, border-color .2s ease, background-color .2s ease }
a.door:hover,a.ml:hover,a.pol:hover,a.pi:hover,a.d:hover,a.gv:hover{
  transform:translateY(-2px); box-shadow:0 16px 34px -22px rgba(10,37,64,.45) }
.go,.ext{ transition:gap .2s ease, color .18s ease }

/* ---------- table of contents on policy pages ---------- */
.toc a{ transition:color .18s ease, border-left-color .18s ease, padding-left .18s ease }
.toc a:hover{ padding-left:16px }

/* ---------- summary/details ---------- */
summary{ transition:color .18s ease }
summary:hover{ color:var(--v-blue) }

/* ---------- form fields settle rather than jump ---------- */
input,select,textarea{ transition:border-color .2s ease, background-color .2s ease }

/* ---------- respect the user ---------- */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{ transition:none!important; animation:none!important }
  .cta:hover,.btn:hover,.sbtn:hover,a.door:hover,a.pi:hover,a.d:hover{ transform:none }
}

/* ---------- header: defined here so it is identical on every page ---------- */
header{background:rgba(251,248,242,.94)!important;backdrop-filter:saturate(160%) blur(12px);
  border-bottom:1px solid #E4DCCB!important;position:sticky;top:0;z-index:80}
header .wrap{display:flex!important;align-items:center;justify-content:space-between;
  height:64px;gap:18px;flex-wrap:nowrap}
header a{text-decoration:none}
header .brand{display:flex!important;align-items:center;gap:10px;flex:0 0 auto}
header .brand img{width:34px;height:34px;display:block;flex:0 0 34px}
header .brand span{display:block;line-height:1}
header .brand b{font-family:'Poppins',sans-serif;font-weight:600;font-size:16px;line-height:1;
  display:block;color:#14213D}
header .brand i{display:block;font-style:normal;font-size:7.5px;letter-spacing:.24em;
  color:#C0392B;font-weight:600;margin-top:3px}
header .hnav{display:flex!important;gap:22px;align-items:center}
header .hnav a{font-size:14px;color:rgba(20,33,61,.62);font-weight:500;transition:color .18s}
header .hnav a:hover{color:#14213D}
header .cta{display:inline-block!important;background:#C0392B!important;color:#fff!important;
  padding:10px 20px!important;border-radius:999px!important;font-weight:600;font-size:13.5px;
  white-space:nowrap;border:0}
header .cta:hover{background:#9C2E22!important}
@media(max-width:900px){header .hnav{display:none!important}}

/* ---------- display type: editorial serif, body stays as built ---------- */
h1, h2, .pull, .stmt p, .sqh h2, .usp-h h2, .fh h2, .wh h2, .dh h2, .sleft h2,
.close h2, .lev h2, .band h2, .sec-head h2, .ph2 h1, .ch h1, .mk h1, .policy-hero h1{
  font-family:'Newsreader',Georgia,'Times New Roman',serif!important;
  font-weight:300!important;
  letter-spacing:-.018em;
}
h1{ line-height:1.08 }
h2, .sec-head h2, .fh h2, .wh h2, .usp-h h2, .sqh h2, .lev h2, .band h2{ line-height:1.18 }
h1 b, h2 b, h1 strong, h2 strong{ font-weight:400 }
h1 .it, h2 .it, .it{ font-family:'Newsreader',Georgia,serif!important; font-style:italic;
  font-weight:300!important; }
/* h3 and smaller stay in the sans, which keeps the interface legible */
h3,h4,h5,.item h3,.cap h3,.stage h3,.d h3,.u h3,.f h3,.w h3,.sb h2,.wn h2,.rung h3,.layer h3,.st h3{
  font-family:'Poppins',sans-serif!important; font-weight:600!important; letter-spacing:-.012em }
