:root{
  --band:#F2F0FC;
  --lift:clamp(36px,4vw,56px);
  --wv:clamp(22px,2.6vw,38px);
  --radius:20px;
  --shadow:0 14px 36px rgba(14,27,77,.10);
  --card-motion:opacity .75s ease-out, transform .5s cubic-bezier(.22,.61,.36,1), box-shadow .3s ease;

  --c-band:var(--purple);
  --c-block:var(--teal);
  --c-block-ink:var(--navy);
  --c-num:var(--teal-ink);
  --c-tab:var(--teal);
  --c-tab-ink:var(--navy);
  --c-strip:var(--teal);
  --c-wave:url(/assets/brand/wave-teal-fade.svg);
}

.eyebrow{color:var(--purple); display:flex; align-items:center; gap:12px}
.eyebrow::before{content:""; flex:none; width:28px; height:3px; border-radius:2px; background:var(--teal)}
.posts .eyebrow{display:block}
.posts .eyebrow::before{display:none}

.section--navy{background:var(--c-band); color:#fff}
.section--navy p,.section--navy li{color:#fff}
.section--navy .eyebrow{color:#fff}
.section--navy a:hover{color:#fff; text-decoration-thickness:2px}

.section.section--brand{background:var(--purple); color:#fff}
.section--brand h2,.section--brand .head p,.section--brand .eyebrow{color:#fff}
.section--brand .rule{border-top-color:rgba(255,255,255,.4)}
.section--brand :focus-visible{outline-color:#fff}

.numbered > li::before,.services > li::before{color:var(--c-num)}
.numbered > li::before{font-size:44px}
.trust > li::before{font-size:34px}

.page-hero{background:var(--c-wave) left -40px bottom -10px / min(900px,70%) auto no-repeat, var(--ground)}
@media (max-width:900px){ .page-hero{background-position:right -70px top 6px, 0 0; background-size:85% auto, auto} }

.frame::before{border:0; border-radius:var(--radius); background:var(--c-block)}
.frame img,.frame .ph{border-radius:calc(var(--radius) - 4px)}
.frame .map-credit,.frame .map-credit a{color:var(--c-block-ink); text-decoration-color:currentColor}

.page-hero.section:has(+ .trust-band){padding-bottom:calc(clamp(16px,2vw,28px) + var(--lift))}
.trust-band.section{position:relative; z-index:2; padding-bottom:calc(var(--wv) + clamp(28px,3vw,44px))}
.trust-band .trust.numbered{
  border-top:0;
  padding:clamp(22px,2.4vw,32px) clamp(22px,3vw,40px);
  background:#fff; border-radius:var(--radius);
  box-shadow:inset 0 5px 0 var(--c-strip), var(--shadow);
}
.page-hero + .trust-band .trust.numbered{margin-top:calc(-1 * var(--lift))}
@media (min-width:1101px){ .trust-band .trust.numbered{margin-inline:calc(-1 * clamp(22px,3vw,40px))} }
.trust-band .trust.numbered > li{display:grid; grid-template-columns:auto 1fr; column-gap:14px; align-items:start}

main > .section--tint,main > .section--brand,main > .section--navy{position:relative}
main > .section--tint::before,main > .section--brand::before,main > .section--navy::before{
  content:""; position:absolute; left:0; right:0; bottom:calc(100% - 1px); height:var(--wv);
  background:inherit; pointer-events:none;
  -webkit-mask:url(/assets/brand/wave-edge.svg) center bottom / 100% 100% no-repeat;
          mask:url(/assets/brand/wave-edge.svg) center bottom / 100% 100% no-repeat;
}

.section--brand .reasons{border-top:0; gap:24px; margin-top:28px}
.section--brand .reasons > li{
  background:#fff; border-radius:var(--radius); box-shadow:0 18px 40px rgba(14,27,77,.22);
  padding:28px 28px 30px; gap:12px;
}
.section--brand .reasons > li,.section--brand .reasons h3,.section--brand .reasons p{color:var(--ink)}
.section--brand .reasons p{color:var(--ink-2)}
.section--brand .step-figure{border-radius:12px; margin:6px 0 4px}

.services{column-gap:28px; row-gap:28px}
.services > li,.services > li:nth-last-child(-n+3),.services > li:nth-last-child(-n+2){
  background:#fff; border:0; border-radius:var(--radius); box-shadow:var(--shadow);
  padding:0 26px 28px; overflow:hidden; transition:var(--card-motion);
}
.services > li:hover{transform:translateY(-4px); box-shadow:0 20px 44px rgba(14,27,77,.14)}
.services .frame{margin:0 -26px 6px; padding:0}
.services .frame::before{display:none}
.services .frame img{border-radius:0}
@media (prefers-reduced-motion:reduce){ .services > li,.services > li:hover{transition:none; transform:none} }

.styles-row{border-top:0; gap:24px}
.styles-row > li{background:#fff; border:0; border-radius:var(--radius); box-shadow:var(--shadow); padding:0 0 26px; gap:16px; overflow:hidden}
.styles-row > li::before{display:none}
.styles-row h3{
  background:var(--c-tab); color:var(--c-tab-ink); margin:0; padding:14px 22px;
  font-family:Nunito,sans-serif; font-weight:700; font-size:18px; line-height:1.3;
}
.styles-six.styles-row .style-photo{margin:8px 20px 0; justify-content:center}
.styles-row p{padding:0 22px; text-align:center}

.cta-band p a.link{display:inline; min-height:0; padding:0; font-size:inherit; font-weight:700}

.section--navy:has(.brands) .head h2{font-size:clamp(40px,4.8vw,64px); line-height:1.05}

.section--brand:has(.reasons--cards)::after{
  content:""; position:absolute; inset:0; pointer-events:none; z-index:0;
  background:url(/assets/brand/wave-teal-fine.svg) center 2% / min(1700px,150%) auto no-repeat;
}
.section--brand:has(.reasons--cards) > .wrap{position:relative; z-index:1}
.section--brand:has(.reasons--cards) .reasons-head h2{background:var(--purple); padding:4px 22px; border-radius:10px}
.section--brand > .wrap > .rule{display:none}
.section--brand .reasons-head{padding-top:8px}
.section--brand .reasons--cards{gap:24px; margin-top:36px}
.section--brand .reasons--cards > li{padding:30px 30px 34px; gap:12px; transition:var(--card-motion)}
.section--brand .reasons--cards > li:hover{transform:translateY(-4px); box-shadow:0 26px 50px rgba(14,27,77,.30)}
.section--brand .reasons--cards h3{font-size:23px; line-height:1.25}
.section--brand .reasons--cards > li{position:relative}
.why-mark{position:absolute; top:24px; right:24px; width:64px; height:64px; padding:9px; box-sizing:border-box; background:#F2F0FC; border-radius:50%}
.section--brand .reasons-more{padding-top:44px; text-align:center}
@media (prefers-reduced-motion:reduce){ .section--brand .reasons--cards > li,.section--brand .reasons--cards > li:hover{transition:none; transform:none} }

.steps-head{border-bottom:0; padding-bottom:6px}
.steps-head + .numbered > li{grid-template-columns:56px 1fr; gap:22px; border-bottom:0; padding:12px 0 20px; position:relative}
.steps-head + .numbered > li::before{
  width:56px; height:56px; border-radius:50%; border:2px solid var(--teal); background:#fff;
  display:grid; place-items:center; font-size:22px; line-height:1; position:relative; z-index:1;
}
.steps-head + .numbered > li:not(:last-child)::after{
  content:""; position:absolute; left:27px; top:68px; bottom:-12px; width:2px; background:var(--teal);
}
.steps-head + .numbered > li > p{padding-top:12px}

.faqs{border-top:0; display:flex; flex-direction:column; gap:12px}
.faqs details{background:#fff; border:0; border-radius:16px; box-shadow:0 8px 24px rgba(14,27,77,.07); padding:0 26px; transition:box-shadow .2s ease}
.faqs details[open]{box-shadow:inset 0 3px 0 var(--teal), 0 12px 30px rgba(14,27,77,.10)}
.faqs summary{padding:22px 0}
.faqs summary::after{border:0; background:var(--teal); color:var(--navy); width:44px; height:44px}
.faqs details p{padding-bottom:24px}

.page-hero.hero h1{font-size:clamp(46px,6vw,80px); letter-spacing:-.01em}

.section:not(.page-hero) .wrap.split > .frame{isolation:isolate}
.section:not(.page-hero) .wrap.split > .frame::after{
  content:""; position:absolute; z-index:-1; top:-18px; right:-18px; width:58%; height:58%;
  border:2px solid var(--purple); border-radius:var(--radius); pointer-events:none;
}
@media (max-width:640px){ .section:not(.page-hero) .wrap.split > .frame::after{top:-10px; right:-6px} }

.services .frame{overflow:hidden}
.services .frame img{transition:transform .6s ease}
.services > li:hover .frame img{transform:scale(1.05)}
.services > li::before{
  align-self:flex-start; position:relative; z-index:1; margin-top:-46px;
  background:#fff; padding:10px 16px 0; margin-left:-16px; border-radius:14px 14px 0 0;
}

.section--navy .brands-row{background:transparent; padding:0}
.section--navy .brands{display:grid; grid-template-columns:repeat(6,1fr); gap:16px}
.section--navy .brands li{justify-content:center; background:#fff; border-radius:16px; padding:22px 16px; min-height:104px; transition:var(--card-motion)}
.section--navy .brands li:hover{transform:translateY(-4px); box-shadow:0 18px 36px rgba(14,27,77,.28)}
.section--navy .brands img{max-height:48px; max-width:100%; height:auto; object-fit:contain}
@media (max-width:1100px){ .section--navy .brands{grid-template-columns:repeat(3,1fr)} }
@media (max-width:640px){ .section--navy .brands{grid-template-columns:repeat(2,1fr); gap:12px} .section--navy .brands li{min-height:84px; padding:16px 12px} }

.section--navy:has(.brands)::after,.section--navy:has(.cta-band)::after{
  content:""; position:absolute; inset:0; pointer-events:none; z-index:0;
  background:url(/assets/brand/wave-teal-fine.svg) center 30% / min(1700px,150%) auto no-repeat;
}
.section--navy:has(.brands) > .wrap,.section--navy:has(.cta-band) > .wrap{position:relative; z-index:1}
.section--navy:has(.brands)::after{
  background:url(/assets/brand/wave-teal-fine-low.svg) center bottom calc(var(--gap-section) - 70px) / 100% 260px no-repeat;
}
.section--navy:has(.cta-band)::after{
  background:url(/assets/brand/wave-teal-fine-low.svg) center bottom 4px / 100% calc(var(--gap-section) - 16px) no-repeat;
}
.section--brand .reasons > li{transition:var(--card-motion)}
.section--brand .reasons > li:hover{transform:translateY(-4px); box-shadow:0 26px 50px rgba(14,27,77,.30)}

.site-foot{border-top:0; position:relative}
.site-foot::before{
  content:""; position:absolute; left:0; right:0; top:-16px; height:32px; pointer-events:none;
  background:url(/assets/brand/wave-line-teal.svg) center / 100% 100% no-repeat;
}

@media (prefers-reduced-motion:reduce){
  .services .frame img,.services > li:hover .frame img,.section--navy .brands li,.section--navy .brands li:hover,
  .section--brand .reasons > li,.section--brand .reasons > li:hover,.faqs details{transition:none; transform:none}
  .faqs summary::after{transition:none}
  *::before,*::after{transition:none !important; animation:none !important}
}

@keyframes hc-rise{from{opacity:0; transform:translateY(18px)} to{opacity:1; transform:none}}
@keyframes hc-settle{from{opacity:0; transform:scale(.97)} to{opacity:1; transform:none}}
.page-hero__copy > *{animation:hc-rise .8s cubic-bezier(.22,.61,.36,1) both}
.page-hero__copy > :nth-child(2){animation-delay:.08s}
.page-hero__copy > :nth-child(3){animation-delay:.16s}
.page-hero__copy > :nth-child(4){animation-delay:.24s}
.page-hero__copy > :nth-child(n+5){animation-delay:.32s}
.page-hero .frame{animation:hc-settle 1s cubic-bezier(.22,.61,.36,1) .2s both}
.page-hero + .trust-band .trust{animation:hc-rise .8s cubic-bezier(.22,.61,.36,1) .45s both}
.reveal{transform:translateY(24px)}
.frame.reveal:not(.is-in){transform:translateY(24px) scale(.975)}
.reveal.is-in{transition:opacity .75s ease-out, transform .75s cubic-bezier(.22,.61,.36,1)}
.section--brand .reasons > li.reveal.is-in,.services > li.reveal.is-in,.section--navy .brands li.reveal.is-in{transition:var(--card-motion)}
@media (prefers-reduced-motion:reduce){
  .page-hero__copy > *,.page-hero .frame,.page-hero + .trust-band .trust{animation:none}
}