:root{
  --blue:#0a2a5f;
  --blue-2:#093f8c;
  --line:#cfd8e8;
  --line-2:#aebdd4;
  --muted:#526b94;
  --paper:#f8fbff;
  --white:#fff;
  --shadow:0 18px 46px rgba(8,35,78,.12);
  --radius:0;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body.home-page{
  /*
   * PVC-like page backdrop + white content surface (.site-shell).
   * Header stays flush to viewport top (padding-block top = 0).
   */
  --home-content-width:var(--storefront-content-max);
  --footer-w:var(--home-content-width);
  position:relative;
  margin:0;
  min-width:0;
  background-color:#f3f8fe;
  background-image:linear-gradient(135deg,#fbfdff 0%,#edf5ff 48%,#f7fbff 100%);
  padding-block:0 clamp(0px,1vw,22px);
}
/* Keep shared header dropdowns above the content surface stacking context. */
body.home-page > .bd-header-wrap{
  position:relative;
  z-index:100;
}
body.home-page .site-shell{
  color:var(--blue);
  font-family: var(--font-sans);
}
body.home-page .site-shell a{color:inherit;text-decoration:none}
body.home-page .site-shell button{font:inherit;color:inherit}
body.home-page .site-shell img{display:block;max-width:100%;height:auto}
/*
 * Content surface mirrors PVC .pvc-guide__surface (copied values only).
 * Keep overflow-y visible so category submenus are not clipped.
 * Corner radius is applied to first/last content so full-bleed hero
 * does not square off the white sheet.
 */
.site-shell,
body.home-page .site-shell{
  --home-shell-radius:12px;
  position:relative;
  isolation:isolate;
  width:min(var(--home-content-width,1248px),calc(100% - 32px));
  margin:18px auto 36px;
  background:#fff;
  border:1px solid rgba(116,156,204,.28);
  border-radius:var(--home-shell-radius);
  box-shadow:0 18px 48px rgba(23,73,130,.08);
  overflow-x:clip;
  overflow-y:visible;
}
/* PC depth B for home: storefront-shell-depth.css (base.html). Mobile unchanged. */

body.home-page .home-main > .hero.hero--image{
  border-top-left-radius:var(--home-shell-radius);
  border-top-right-radius:var(--home-shell-radius);
}
/* Bottom banner is inactive on all viewports; round benefits as sheet edge. */
body.home-page .cta-banner--before-footer{display:none}
body.home-page .home-main > .bd-benefits{
  border-bottom-left-radius:var(--home-shell-radius);
  border-bottom-right-radius:var(--home-shell-radius);
  overflow:hidden;
}
body.home-page .site-shell > *{
  position:relative;
  z-index:1;
}
/* Submenus / open cards must sit above sibling stacking contexts. */
body.home-page .home-category-card.is-submenu-open,
body.home-page .home-category-card:focus-within{
  z-index:50;
}
.blueprint{
  background-image:
    linear-gradient(rgba(10,42,95,.055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(10,42,95,.055) 1px, transparent 1px),
    radial-gradient(circle at 78% 58%, rgba(5,66,146,.10), transparent 28%),
    linear-gradient(180deg,#fbfdff 0%,#f8fbff 72%,#f1f6fc 100%);
  background-size:22px 22px,22px 22px,100% 100%,100% 100%;
}
/* Temporary image-only hero; CMS overlay returns when board asset has no baked text. */
.hero.hero--image{
  position:relative;
  isolation:isolate;
  display:block;
  padding:0;
  margin:0;
  border-bottom:1px solid rgba(10,42,95,.14);
  background:#f4f7fb;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.88),
    inset 0 -1px 0 rgba(10,42,95,.12),
    0 12px 28px rgba(8,31,67,.12);
  overflow:hidden;
  line-height:0;
}
.hero.hero--image .hero__picture,
.hero.hero--image picture,
body.home-page .hero.hero--image img{
  display:block;
  width:100%;
  height:auto;
  max-width:100%;
}
body.home-page .hero.hero--image img{
  filter:saturate(1.025) contrast(1.018);
}
.hero.hero--image .hero__visual{position:relative}
.hero.hero--image .hero__mobile-content,
.hero.hero--image .hero__mobile-pins,
.hero.hero--image .measure{display:none}
/* Glossy-paper finish scoped to the localized CMS hero. */
body.home-page .hero.hero--image::before,
body.home-page .hero.hero--image::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
}
body.home-page .hero.hero--image::before{
  z-index:2;
  background:
    radial-gradient(ellipse 74% 42% at 14% 2%,rgba(255,255,255,.42),transparent 58%),
    radial-gradient(ellipse 54% 34% at 92% 14%,rgba(235,246,255,.22),transparent 62%),
    repeating-linear-gradient(0deg,rgba(255,255,255,.018) 0 1px,rgba(7,28,61,.012) 1px 2px),
    repeating-linear-gradient(90deg,rgba(255,255,255,.012) 0 1px,transparent 1px 3px),
    linear-gradient(180deg,rgba(255,255,255,.13),transparent 24%,transparent 76%,rgba(5,25,55,.08));
  mix-blend-mode:soft-light;
  opacity:.92;
}
body.home-page .hero.hero--image::after{
  z-index:3;
  background:
    linear-gradient(108deg,transparent 20%,rgba(255,255,255,.025) 34%,rgba(255,255,255,.32) 43%,rgba(255,255,255,.08) 51%,transparent 64%),
    linear-gradient(118deg,transparent 57%,rgba(225,242,255,.12) 66%,rgba(255,255,255,.26) 70%,transparent 77%),
    radial-gradient(ellipse 34% 68% at 5% 48%,rgba(255,255,255,.14),transparent 72%);
  mix-blend-mode:screen;
  opacity:.72;
}
/* Screen-reader / SEO H1 — never a separate visible line above the image. */
body.home-page .hero.hero--image .visually-hidden,
.visually-hidden{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  padding:0!important;
  margin:-1px!important;
  overflow:hidden!important;
  clip:rect(0,0,0,0)!important;
  clip-path:inset(50%)!important;
  white-space:nowrap!important;
  border:0!important;
  font-size: var(--text-caption) !important;
  line-height:1px!important;
  color:transparent!important;
}
@media (max-width:767px){
  body.home-page .hero.hero--image::before{opacity:.72}
  body.home-page .hero.hero--image::after{opacity:.5}
}
body.home-page .home-categories{
  position:relative;
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:20px;
  padding:20px 16px 24px;
  background:#f8fbff;
}
body.home-page .home-category-card{
  position:relative;
  min-width:0;
  height:clamp(300px,88vw,340px);
  overflow:hidden;
  border:1px solid #bdcce2;
  border-radius:8px;
  background:#fff;
  box-shadow:
    0 0 0 1px rgba(125,201,255,.1),
    0 0 18px rgba(96,190,255,.11),
    0 8px 24px rgba(10,42,95,.07);
  transition:transform .28s ease,border-color .28s ease,box-shadow .28s ease;
}
body.home-page .home-category-card:focus-within{
  border-color:#9ebfe4;
  box-shadow:
    0 0 0 1px rgba(112,198,255,.2),
    0 0 24px rgba(84,181,255,.18),
    0 14px 30px rgba(10,42,95,.1);
}
body.home-page .home-category-card--has-submenu{overflow:visible}
body.home-page .home-category-card.is-submenu-open{z-index:30}
body.home-page .home-category-card__link{
  display:grid;
  grid-template-rows:minmax(0,1fr) auto;
  width:100%;
  height:100%;
  min-width:0;
  overflow:hidden;
  border-radius:inherit;
  background:#fff;
}
body.home-page .home-category-card__link:focus-visible{
  outline:3px solid #0a4b9f;
  outline-offset:-4px;
}
body.home-page .home-category-card__media{
  min-width:0;
  min-height:0;
  overflow:hidden;
  background:#d8e2ee;
}
body.home-page .home-categories .home-category-card__picture,
body.home-page .home-categories .home-category-card__placeholder{
  display:block;
  width:100%;
  height:100%;
}
body.home-page .home-categories .home-category-card__placeholder{
  background:
    linear-gradient(135deg,rgba(255,255,255,.45),rgba(189,204,226,.16)),
    repeating-linear-gradient(135deg,#d8e2ee 0,#d8e2ee 18px,#cfdaea 18px,#cfdaea 36px);
}
body.home-page .home-category-card__media img{
  width:100%;
  height:100%;
  max-width:none;
  object-fit:cover;
  transition:transform .42s ease;
}
body.home-page .home-category-card__content{
  display:grid;
  grid-template-columns:minmax(0,1fr) 44px;
  gap:16px;
  align-items:center;
  min-width:0;
  min-height:84px;
  padding:20px;
  border-top:1px solid #d7e1ef;
  background:#fff;
}
body.home-page .home-category-card__copy{min-width:0}
body.home-page .home-category-card h2{
  display:-webkit-box;
  overflow:hidden;
  margin:0;
  color:#0a2a5f;
  font-family: var(--font-sans);
  font-size: var(--text-xl);
  line-height:1.18;
  font-weight: var(--fw-title);
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
}
body.home-page .home-category-card p{
  display:-webkit-box;
  overflow:hidden;
  margin:8px 0 0;
  color:#526b94;
  font-size: var(--text-caption);
  line-height:1.4;
  font-weight: 500;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
}
/* Arrow only — no circle fill/border (all card types, incl. submenu trigger) */
body.home-page .home-category-card__arrow{
  display:grid;
  place-items:center;
  width:44px;
  height:44px;
  border-radius:0;
  color:#5a7399;
  background:transparent;
  border:0;
  box-shadow:none;
  outline:none;
  font-size: var(--text-2xl);
  line-height:1;
  transition:transform .28s ease,color .28s ease;
}
body.home-page .site-shell .home-category-card__menu-trigger,
body.home-page .site-shell .home-category-card__menu-trigger span{
  color:#5a7399;
  background:transparent;
  border:0;
  box-shadow:none;
}
body.home-page .home-category-card__menu-wrapper{
  position:absolute;
  right:20px;
  bottom:20px;
  z-index:4;
  width:44px;
  height:44px;
}
body.home-page .home-category-card__menu-trigger{
  position:relative;
  z-index:2;
  padding:0;
  border:0;
  cursor:pointer;
}
body.home-page .home-category-card__menu-trigger:focus-visible{
  outline:3px solid #2d72c6;
  outline-offset:3px;
}
body.home-page .home-category-card__submenu{
  --submenu-left:56px;
  --submenu-top:0px;
  --submenu-width:260px;
  position:absolute;
  left:var(--submenu-left);
  top:var(--submenu-top);
  z-index:1;
  width:var(--submenu-width);
  max-width:calc(100vw - 24px);
  max-height:min(60vh,360px);
  overflow-x:hidden;
  overflow-y:auto;
  visibility:hidden;
  padding:8px;
  border:1px solid #b9cce4;
  border-radius:10px;
  background:linear-gradient(180deg,#fff 0%,#f5faff 100%);
  box-shadow:0 18px 38px rgba(8,46,108,.18);
  opacity:0;
  pointer-events:none;
  transform:translateY(8px) scale(.98);
  transform-origin:top right;
  transition:opacity .22s ease,transform .22s ease,visibility 0s linear .22s;
}
/* CSS baseline open state (works without GSAP). */
body.home-page .home-category-card.is-submenu-open .home-category-card__submenu,
body.home-page .home-category-card__submenu.is-open{
  visibility:visible;
  opacity:1;
  pointer-events:auto;
  transform:none;
  transition:opacity .22s ease,transform .22s ease,visibility 0s;
}
body.home-page .home-category-card__submenu-list{
  display:grid;
  gap:3px;
  margin:0;
  padding:0;
  list-style:none;
}
body.home-page .home-category-card__submenu-link{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  min-height:38px;
  padding:8px 10px;
  border-radius:6px;
  color:#173f78!important;
  font-size: var(--text-caption);
  line-height:1.3;
  font-weight: var(--fw-title);
  transition:background-color .18s ease,color .18s ease;
}
body.home-page .home-category-card__submenu-link:hover{
  color:#fff!important;
  background:#0a438f;
}
body.home-page .home-category-card__submenu-link:focus-visible{
  outline:2px solid #2d72c6;
  outline-offset:-2px;
}
.page-delimiter{padding:24px 28px 26px;background:#f8fbff;border-top:1px solid var(--line)}.page-delimiter img{width:100%;height:auto}
.page-delimiter--top{margin:0 0 20px;padding:0;border:0;background:transparent;line-height:0}.page-delimiter--top img{width:100%;height:auto;display:block}
.page-delimiter--after-hero{margin:0;padding:0;border:0;background:transparent;line-height:0}.page-delimiter--after-hero img{width:100%;height:auto;display:block}
.cta-banner{padding:8px 0 32px;background:#f8fbff;border-top:1px solid var(--line);line-height:0;overflow:hidden}.cta-banner img{width:100%;height:auto;display:block}.cta-banner--after-hero{padding-top:0;border-top:0;margin-top:2px}
.reveal{opacity:0;transform:translateY(24px);transition:opacity .7s ease,transform .7s ease}.reveal.is-visible{opacity:1;transform:none}
/* Progressive enhancement: content visible without JS / with reduced motion. */
@media (scripting:none){
  .reveal{opacity:1;transform:none}
}
@media (prefers-reduced-motion:reduce){
  .reveal{opacity:1;transform:none;transition:none}
  body.home-page .home-category-card,
  body.home-page .home-category-card__media img,
  body.home-page .home-category-card__arrow,
  body.home-page .home-category-card__submenu,
  body.home-page .home-category-card__submenu-link{transition:none}
  html{scroll-behavior:auto}
}
@media (min-width:768px){
  body.home-page .home-categories{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;padding:24px 28px 28px}
  body.home-page .home-category-card{height:360px}
  body.home-page .home-category-card__content{padding:22px 24px;min-height:88px}
  body.home-page .home-category-card__menu-wrapper{right:24px;bottom:22px}
}
@media (min-width:1200px){
  body.home-page .home-categories{grid-template-columns:repeat(12,minmax(0,1fr))}
  body.home-page .home-category-card{grid-column:span 4;height:360px}
  body.home-page .home-category-card:nth-child(1),
  body.home-page .home-category-card:nth-child(2),
  body.home-page .home-category-card:nth-child(6),
  body.home-page .home-category-card:nth-child(7){grid-column:span 6;height:420px}
}
@media (hover:hover) and (pointer:fine){
  body.home-page .home-category-card:hover{
    transform:translateY(-4px);
    border-color:#9ebfe4;
    box-shadow:
      0 0 0 1px rgba(112,198,255,.2),
      0 0 24px rgba(84,181,255,.18),
      0 14px 30px rgba(10,42,95,.1);
  }
  body.home-page .home-category-card:hover .home-category-card__media img{transform:scale(1.03)}
  body.home-page .home-category-card:hover .home-category-card__arrow{
    transform:translateX(3px);
    background:transparent;
    border:0;
    box-shadow:none;
    color:#0a2a5f;
  }
  body.home-page .home-category-card:hover .home-category-card__arrow,
  body.home-page .home-category-card.is-submenu-open .home-category-card__menu-trigger,
  body.home-page .home-category-card.is-submenu-open .home-category-card__menu-trigger span{
    color:#0a2a5f;
    background:transparent;
  }
}
@media (max-width:920px){
  .page-delimiter{padding:18px 18px 22px}
  .cta-banner{padding:8px 0 22px}
}
@media (max-width:767px){
  body.home-page .cta-banner--after-hero{display:none}
}
@media (max-width:640px){
  body.home-page .site-shell{
    --home-shell-radius:8px;
    width:calc(100% - 16px);
    margin:8px auto 16px;
  }
  body.home-page .hero.hero--image{
    display:grid;
    grid-template-columns:minmax(0,1fr);
    padding:24px 16px 16px;
    line-height:normal;
    background-image:
      linear-gradient(rgba(10,42,95,.07) 1px,transparent 1px),
      linear-gradient(90deg,rgba(10,42,95,.07) 1px,transparent 1px),
      radial-gradient(circle at 78% 58%,rgba(5,66,146,.11),transparent 30%),
      linear-gradient(180deg,#fbfdff 0%,#f8fbff 72%,#eef4fb 100%);
    background-size:20px 20px,20px 20px,100% 100%,100% 100%;
  }
  body.home-page .hero.hero--image::before,
  body.home-page .hero.hero--image::after{display:none}
  body.home-page .hero.hero--image .hero__mobile-content{
    display:block;
    position:relative;
    z-index:2;
    max-width:360px;
    margin:0 auto;
    text-align:center;
  }
  body.home-page .hero.hero--image .eyebrow{
    margin:0 0 12px;
    color:#7890b3;
    font-size: var(--text-caption); /* was 10 — mobile hero −1–2px pack */
    font-weight: 800;
    letter-spacing:.16em;
    text-transform:uppercase;
  }
  body.home-page .hero.hero--image .hero__mobile-title{
    color:#071f4e;
    font-family: var(--font-display);
    /* Mobile only: −2px (was clamp(34px, 11vw, 46px)) — desktop image-only unchanged */
    font-size: clamp(36px, 4.5vw, 48px);
    font-weight: var(--fw-display);
    letter-spacing:-.035em;
    line-height:1.04;
  }
  body.home-page .hero.hero--image .title-line{
    display:block;
    width:38px;
    height:2px;
    margin:16px auto 14px;
    background:#153d7b;
  }
  body.home-page .hero.hero--image .hero__lead{
    margin:0 auto 18px;
    max-width:300px;
    color:#193d76;
    font-size: var(--text-caption); /* was 13 */
    font-weight: 500;
    line-height:1.55;
  }
  body.home-page .hero.hero--image .primary-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:18px;
    min-height:42px;
    padding:0 20px;
    border-radius:3px;
    background:#082e6c;
    color:#fff;
    box-shadow:0 12px 24px rgba(8,46,108,.2);
    font-size: var(--text-caption);
    font-weight: 800;
    letter-spacing:.04em;
    text-transform:uppercase;
  }
  body.home-page .hero.hero--image .hero__visual{
    display:grid;
    gap:10px;
    margin-top:22px;
  }
  body.home-page .hero.hero--image .hero__picture,
  body.home-page .hero.hero--image picture,
  body.home-page .hero.hero--image img{
    width:100%;
    height:auto;
  }
  body.home-page .hero.hero--image .measure{
    display:block;
    position:absolute;
    z-index:2;
    color:#4b74b4;
    font-size: var(--text-caption);
    font-weight: 700;
    letter-spacing:.06em;
  }
  body.home-page .hero.hero--image .measure--top{
    top:4px;
    right:16%;
    width:38%;
    padding-top:2px;
    border-top:1px dashed #4771ac;
    text-align:center;
  }
  body.home-page .hero.hero--image .measure--left{
    top:18%;
    left:2px;
    height:34%;
    padding-left:3px;
    border-left:1px dashed #4771ac;
    text-align:center;
    writing-mode:vertical-rl;
  }
  body.home-page .hero.hero--image .hero__mobile-pins{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
  }
  body.home-page .hero.hero--image .pin{
    display:grid;
    grid-template-columns:26px minmax(0,1fr);
    grid-template-rows:auto auto;
    column-gap:7px;
    align-items:center;
    min-width:0;
    min-height:58px;
    padding:8px 9px;
    border:1px solid #b9c8dd;
    background:rgba(255,255,255,.82);
    box-shadow:0 7px 18px rgba(10,42,95,.07);
    color:#0a2a5f;
    backdrop-filter:blur(3px);
  }
  body.home-page .hero.hero--image .pin picture,
  body.home-page .hero.hero--image .pin img{
    grid-row:1 / 3;
    width:26px;
    height:28px;
    object-fit:contain;
  }
  body.home-page .hero.hero--image .pin b{
    align-self:end;
    font-family: var(--font-sans);
    font-size: var(--text-body);
    line-height:1;
  }
  body.home-page .hero.hero--image .pin span{
    align-self:start;
    overflow-wrap:anywhere;
    font-size: var(--text-caption);
    font-weight: var(--fw-title);
    line-height:1.18;
  }
  .page-delimiter{padding:16px 14px 20px}
  .cta-banner{padding:8px 0 20px}
}