
  :root{
    --paper:#FAF8F4;
    --paper-2:#F3F1EC;
    --ink:#14110E;
    --muted:#6B655C;
    --faint:#6C685E;
    --rule:#E2DCD2;
    --accent:#55306E;
    --accent-dark:#3F2353;
    --accent-soft:#F2EEF5;
    --serif:"Iowan Old Style","Palatino Linotype",Palatino,"Book Antiqua",Georgia,"Times New Roman",serif;
    --sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Inter,Helvetica,Arial,sans-serif;
    --maxw:1120px;
    --bar:74px;
  }

  *{box-sizing:border-box;}
  html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;}
  @media (prefers-reduced-motion:reduce){html{scroll-behavior:auto;}}
  body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--serif);font-size:18px;line-height:1.6;-webkit-font-smoothing:antialiased;}
  a{color:inherit;}
  img{display:block;max-width:100%;}
  ::selection{background:var(--accent);color:#FAF8F4;}
  :focus-visible{outline:2px solid var(--accent);outline-offset:3px;}

  .wrap{max-width:var(--maxw);margin:0 auto;padding:0 40px;}

  /* ------------- Header ------------- */
  .site-header{position:sticky;top:0;z-index:60;background:rgba(250,248,244,.9);backdrop-filter:saturate(180%) blur(12px);-webkit-backdrop-filter:saturate(180%) blur(12px);border-bottom:1px solid var(--rule);}
  .site-header .wrap{min-height:var(--bar);display:flex;align-items:center;justify-content:space-between;gap:16px 32px;flex-wrap:wrap;padding-top:14px;padding-bottom:14px;}
  .brand{display:inline-flex;align-items:center;text-decoration:none;flex:none;}
  .brand svg{width:180px;height:auto;display:block;}
  nav.menu{display:flex;flex-wrap:wrap;align-items:center;gap:8px 26px;font-family:var(--sans);font-size:12px;letter-spacing:.11em;text-transform:uppercase;}
  nav.menu a{text-decoration:none;color:var(--muted);padding:4px 0;border-bottom:1px solid transparent;white-space:nowrap;transition:color .2s,border-color .2s;}
  nav.menu a:hover{color:var(--ink);border-bottom-color:var(--ink);}
  nav.menu a.cta{color:var(--accent);font-weight:600;}

  /* ------------- Hero ------------- */
  /* Split editorial hero. The old one floated centred text over a washed-out
     photograph, which read as a stock placeholder. Copy now sits on paper at
     the left with its own column, the photograph holds the right, and the
     one number that sells the service is stated on a card over the image. */
  /* section{padding:126px 0} would otherwise open a band of empty paper
     above and below the split, so the hero opts out and sets its own. */
  .hero{position:relative;padding:0;background:var(--paper);
        border-top:0;border-bottom:1px solid var(--rule);}
  .hero-in{display:grid;grid-template-columns:minmax(0,1.16fr) minmax(0,1fr);
           align-items:stretch;min-height:clamp(560px,74vh,760px);}

  /* The photograph bleeds to the right edge of the window while the copy
     stays on the same left margin as every other section on the site. */
  .hero-copy{display:flex;flex-direction:column;justify-content:center;
             padding-block:88px;
             padding-left:max(40px,calc((100vw - var(--maxw)) / 2 + 40px));
             padding-right:clamp(32px,3.2vw,52px);}
  .kicker{margin:0 0 26px;font-family:var(--sans);font-size:10.5px;letter-spacing:.2em;
          text-transform:uppercase;font-weight:600;color:var(--accent);
          display:flex;align-items:center;gap:12px;}
  .kicker::after{content:"";height:1px;flex:1;max-width:120px;background:var(--rule);}
  .hero h1{font-weight:600;font-size:clamp(2.1rem,3.6vw,3.35rem);line-height:1.05;
           letter-spacing:-0.03em;margin:0 0 24px;max-width:19ch;text-wrap:balance;}
  .hero .lede{margin:0;max-width:46ch;color:#463F37;
              font-size:clamp(1.02rem,1.35vw,1.14rem);line-height:1.6;text-wrap:pretty;}
  .hero-actions{display:flex;flex-wrap:wrap;gap:14px 16px;margin-top:36px;}
  .btn{font-family:var(--sans);font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;font-weight:600;
       text-decoration:none;padding:16px 26px;border:1px solid var(--accent);
       transition:background .22s,color .22s;white-space:nowrap;}
  .btn.solid{background:var(--accent);color:var(--paper);}
  .btn.solid:hover{background:var(--accent-dark);border-color:var(--accent-dark);}
  .btn.ghost{color:var(--accent);background:transparent;}
  .btn.ghost:hover{background:var(--accent);color:var(--paper);}

  /* Three facts on one line at full width, but the third wraps on a
     narrower window and a zero row gap left its label sitting on the
     line above it. */
  .hero-facts{display:grid;grid-template-columns:repeat(3,1fr);gap:24px 26px;
              margin:46px 0 0;
              padding-top:26px;border-top:1px solid var(--rule);}
  .hero-facts > div{display:flex;flex-direction:column;gap:5px;}
  .hero-facts dt{font-family:var(--sans);font-size:9.5px;letter-spacing:.18em;
                 text-transform:uppercase;color:var(--faint);}
  .hero-facts dd{margin:0;font-family:var(--sans);font-size:13.5px;font-weight:600;
                 letter-spacing:-0.005em;color:var(--ink);}

  /* The hero art is a player rather than a photograph. A stock picture of
     a clinician would be the one thing this brand should not put on its
     own site: an image of people we did not film. */
  /* This half used to be a darker panel because a photograph bled into
     it and needed an edge to sit against. The player is a card with its
     own shadow now, so the panel only put a seam down the middle of the
     hero. One continuous field, and the card does the work. */
  .hero-art{position:relative;background:transparent;display:flex;
            align-items:center;justify-content:center;padding:clamp(28px,4vw,56px);}
  .player{width:100%;max-width:440px;background:var(--accent);color:#F3EFF7;
          border:1px solid var(--accent-dark);box-shadow:0 18px 44px rgba(20,17,14,.14);}
  .player .pbar{display:flex;align-items:center;gap:7px;padding:12px 16px;
                border-bottom:1px solid rgba(255,255,255,.16);}
  .player .pbar i{width:7px;height:7px;border-radius:50%;background:rgba(255,255,255,.34);
                  display:block;flex:none;}
  .player .pbar p{margin:0 0 0 10px;font-family:var(--sans);font-size:9.5px;letter-spacing:.18em;
                  text-transform:uppercase;color:#CFC3DC;}
  .player .pstage{position:relative;overflow:hidden;isolation:isolate;
                  padding:52px 26px 46px;text-align:center;
                  min-height:236px;display:flex;flex-direction:column;
                  justify-content:center;background:#231230;}
  .player .pshot{position:absolute;inset:0;width:100%;height:100%;
                 object-fit:cover;object-position:60% 34%;z-index:0;}
  /* The scrim has two jobs that pull against each other: keep the nerve
     illustration readable at the top, and give the title a dark enough
     floor lower down. So it stays light through the upper third and
     only closes over the bottom half, where the words are. */
  .player .pstage::after{content:"";position:absolute;inset:0;z-index:1;
                         background:linear-gradient(180deg,
                           rgba(35,18,48,.18) 0%,
                           rgba(35,18,48,.32) 30%,
                           rgba(35,18,48,.84) 62%,
                           rgba(35,18,48,.95) 100%);}
  .player .pstage-in{position:relative;z-index:2;}
  .player .pstage svg{width:52px;height:52px;margin:0 auto 22px;display:block;
                      filter:drop-shadow(0 2px 8px rgba(20,8,30,.5));}
  .player .ptitle{margin:0 0 8px;font-size:1.22rem;line-height:1.28;color:#FFFFFF;
                  letter-spacing:-0.012em;text-shadow:0 1px 10px rgba(20,8,30,.55);}
  .player .psub{margin:0;font-family:var(--sans);font-size:12px;line-height:1.55;color:#D6CCE1;
                text-shadow:0 1px 8px rgba(20,8,30,.6);}
  .player .pfoot{display:flex;align-items:center;gap:14px;padding:14px 16px;
                 border-top:1px solid rgba(255,255,255,.16);
                 font-family:var(--sans);font-size:10px;letter-spacing:.14em;
                 text-transform:uppercase;color:#CFC3DC;}
  .player .track{flex:1;height:2px;background:rgba(255,255,255,.22);}
  .player .track i{display:block;height:2px;width:38%;background:#FFFFFF;}

  @media (max-width:1080px){
    .hero-in{grid-template-columns:1fr;min-height:0;}
    .hero-copy{padding:72px 32px 60px;}
    .hero-copy{padding-left:32px;padding-right:32px;}
    .hero h1{max-width:22ch;}
    /* Wide short crop of a tall portrait: centre on her and the laptop
       rather than the top of her head. */
    .hero-art{height:clamp(340px,52vw,460px);}
    .hero-art img{object-position:center 46%;}
    .hero-card{max-width:none;right:auto;width:min(400px,calc(100% - 40px));}
  }
  @media (max-width:620px){
    .hero-copy{padding:52px 28px 46px;}
    .hero-facts{gap:22px 32px;margin-top:38px;}
    /* On a phone the card covered the photograph it was meant to sit on,
       so the two stop overlapping and stack instead. */
    .hero-art{height:auto;overflow:visible;background:transparent;}
    .hero-art::after{display:none;}
    .hero-art img{position:static;width:100%;height:250px;object-fit:cover;object-position:center 46%;}
    .hero-card{position:static;max-width:none;width:auto;padding:24px 28px 26px;
               background:var(--paper-2);border:0;border-top:1px solid var(--rule);
               backdrop-filter:none;-webkit-backdrop-filter:none;}
    .hero-card .row b{font-size:14px;}
  }

  /* ------------- Trust strip ------------- */
  .strip{border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);background:var(--paper-2);}
  .strip .wrap{display:grid;grid-template-columns:repeat(4,1fr);gap:22px 36px;padding-top:38px;padding-bottom:38px;}
  .strip p{margin:0;font-family:var(--sans);font-size:11.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--muted);line-height:1.6;}

  /* ------------- Sections ------------- */
  section{padding:126px 0;border-top:1px solid var(--rule);scroll-margin-top:calc(var(--bar) + 8px);}
  section.no-rule{border-top:none;}
  .sec-head{display:block;margin-bottom:64px;}
  .eyebrow{font-family:var(--sans);font-size:clamp(1.45rem,3.6vw,2.6rem);font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--ink);margin:0;line-height:1.05;text-wrap:balance;}
  .sec-head .sub{margin:26px 0 0;color:var(--muted);font-size:1.02rem;max-width:62ch;line-height:1.62;text-wrap:pretty;}

  /* ------------- Services ------------- */
  .services{display:grid;grid-template-columns:repeat(2,1fr);gap:78px 88px;}
  .svc .num{font-family:var(--sans);font-size:11px;letter-spacing:.2em;color:var(--accent);margin-bottom:24px;}
  .svc h3{margin:0 0 14px;font-weight:400;font-size:1.3rem;line-height:1.26;letter-spacing:-0.01em;}
  .svc p{margin:0;color:var(--muted);font-size:.99rem;line-height:1.65;max-width:44ch;text-wrap:pretty;}

  /* ------------- Role groups ------------- */
  .rolegroup{margin-bottom:74px;}
  .rolegroup:last-child{margin-bottom:0;}
  .rolegroup > h3{font-family:var(--sans);font-size:11px;letter-spacing:.2em;text-transform:uppercase;
                  color:var(--accent);font-weight:600;margin:0 0 30px;padding-bottom:14px;border-bottom:1px solid var(--rule);}
  .rolelist{display:grid;grid-template-columns:repeat(4,1fr);gap:32px 36px;}
  .role h4{margin:0 0 5px;font-weight:400;font-size:1.02rem;line-height:1.3;}
  .role p{margin:0;color:var(--faint);font-family:var(--sans);font-size:11.5px;letter-spacing:.02em;line-height:1.55;}

  /* ------------- Role filter ------------- */
  .rolefilter{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:46px;}
  .rolefilter button{font-family:var(--sans);font-size:11.5px;letter-spacing:.13em;text-transform:uppercase;
    color:var(--muted);background:transparent;border:1px solid var(--rule);padding:9px 16px;cursor:pointer;
    transition:color .18s,border-color .18s,background .18s;}
  .rolefilter button:hover{color:var(--ink);border-color:var(--faint);}
  .rolefilter button[aria-pressed="true"]{background:var(--accent);border-color:var(--accent);color:var(--paper);}
  .rolegroup[hidden]{display:none;}
  .role{cursor:pointer;padding:14px 16px;margin:-14px -16px;border:1px solid transparent;
        transition:border-color .18s,background .18s,transform .18s;}
  .role:hover,.role:focus-visible{border-color:var(--rule);background:var(--paper-2);outline:none;}
  .role:hover h4,.role:focus-visible h4{color:var(--accent);}
  .role h4{transition:color .18s;}
  .role .pick{display:block;margin-top:8px;font-family:var(--sans);font-size:10.5px;letter-spacing:.14em;
              text-transform:uppercase;color:var(--accent);opacity:0;transition:opacity .18s;}
  .role:hover .pick,.role:focus-visible .pick{opacity:1;}
  @media (hover:none){ .role .pick{opacity:.8;} }

  /* ------------- Calculator ------------- */
  .calc{display:grid;grid-template-columns:0.92fr 1.08fr;gap:0;border:1px solid var(--rule);background:var(--paper-2);}
  .calc-in{padding:38px 36px;display:grid;gap:24px;align-content:start;border-right:1px solid var(--rule);}
  .calc-out{padding:38px 36px;background:var(--paper);display:flex;flex-direction:column;}
  .calc label{font-family:var(--sans);font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;
              color:var(--faint);font-weight:600;display:block;margin-bottom:9px;}
  .calc select,.calc input{width:100%;font-family:var(--sans);font-size:.94rem;color:var(--ink);
    background:var(--paper);border:1px solid var(--rule);padding:12px 13px;border-radius:0;
    -webkit-appearance:none;appearance:none;transition:border-color .18s;}
  .calc select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='7' viewBox='0 0 11 7'%3E%3Cpath d='M1 1l4.5 4.5L10 1' fill='none' stroke='%236B655C' stroke-width='1.4'/%3E%3C/svg%3E");
    background-repeat:no-repeat;background-position:right 13px center;padding-right:34px;}
  .calc select:focus,.calc input:focus{outline:none;border-color:var(--accent);}
  .calc .two{display:grid;grid-template-columns:1fr 1fr;gap:18px;}
  .calc .hint{font-family:var(--sans);font-size:11px;color:var(--faint);line-height:1.6;margin:2px 0 0;}

  .calc-out .lbl{font-family:var(--sans);font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;
                 color:var(--faint);font-weight:600;margin:0 0 10px;}
  .calc-out .big{font-size:clamp(1.6rem,3.4vw,2.3rem);line-height:1.08;letter-spacing:-0.02em;
                 margin:0;font-variant-numeric:tabular-nums;}
  .calc-out .sub{font-family:var(--sans);font-size:11.5px;color:var(--muted);margin:10px 0 0;line-height:1.6;}
  .calc-row{padding:22px 0;border-top:1px solid var(--rule);}
  .calc-row:first-of-type{padding-top:0;border-top:0;}
  .calc-out .mid{font-size:1.12rem;margin:0;font-variant-numeric:tabular-nums;line-height:1.35;}
  .calc-note{font-family:var(--sans);font-size:11.5px;color:var(--muted);line-height:1.7;
             margin:22px 0 0;padding-top:20px;border-top:1px solid var(--rule);}
  .calc-out .cta{margin-top:auto;padding-top:26px;}
  .calc-out .cta a{font-family:var(--sans);font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;
    font-weight:600;color:var(--accent);text-decoration:none;border-bottom:1px solid var(--accent);padding-bottom:3px;}
  .flash{animation:flash .5s ease;}
  @keyframes flash{from{background:var(--accent-soft);}to{background:transparent;}}

  /* ------------- Sticky CTA ------------- */
  .stickycta{position:fixed;left:0;right:0;bottom:0;z-index:70;background:var(--accent);color:var(--paper);
    transform:translateY(102%);transition:transform .32s cubic-bezier(.2,.7,.2,1);
    pointer-events:none;box-shadow:0 -1px 0 rgba(20,17,14,.10);}
  .stickycta.show{transform:translateY(0);pointer-events:auto;}
  .stickycta .wrap{display:flex;flex-wrap:wrap;gap:12px 24px;align-items:center;justify-content:space-between;
                   padding-top:14px;padding-bottom:14px;}
  .stickycta p{margin:0;font-family:var(--sans);font-size:12.5px;letter-spacing:.03em;color:#CFC3DC;}
  .stickycta a{font-family:var(--sans);font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;font-weight:600;
    text-decoration:none;color:var(--accent);background:var(--paper);padding:11px 20px;white-space:nowrap;
    transition:opacity .18s;}
  .stickycta a:hover{opacity:.86;}
  @media (max-width:620px){ .stickycta p{display:none;} .stickycta .wrap{justify-content:center;} }
  @media (prefers-reduced-motion:reduce){ .stickycta{transition:none;} }

  /* ------------- Rate tables ------------- */
  .ratewrap{margin-bottom:70px;}
  .ratewrap:last-of-type{margin-bottom:0;}
  .ratewrap > h3{font-family:var(--sans);font-size:11px;letter-spacing:.2em;text-transform:uppercase;
                 color:var(--accent);font-weight:600;margin:0 0 4px;}
  .ratewrap > .cap{font-family:var(--sans);font-size:11.5px;color:var(--faint);margin:0 0 24px;line-height:1.55;}
  .tablescroll{overflow-x:auto;-webkit-overflow-scrolling:touch;}
  /* Fixed layout with declared column widths, so every rate table on the
     page lines up with the one above it. Left to itself each table sizes
     its own columns from its own content, and the group headings, rates
     and notes end up on five different vertical lines. */
  table{width:100%;border-collapse:collapse;font-size:.97rem;min-width:520px;
        table-layout:fixed;}
  table th:nth-child(1),table td:nth-child(1){width:42%;}
  table th:nth-child(2),table td:nth-child(2){width:20%;}
  table th:nth-child(3),table td:nth-child(3){width:38%;}
  caption{caption-side:top;text-align:left;font-family:var(--sans);font-size:11.5px;color:var(--faint);padding-bottom:12px;}
  th,td{text-align:left;padding:17px 18px 17px 0;border-bottom:1px solid var(--rule);vertical-align:top;}
  thead th{font-family:var(--sans);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;
           color:var(--faint);font-weight:600;padding-top:0;border-bottom:1px solid var(--ink);}
  td.rate{font-variant-numeric:tabular-nums;white-space:nowrap;}
  /* The widest range, $66,800-$79,800, is 5px over its column at 390px.
     Tighten the figures rather than let the table scroll. */
  @media (max-width:430px){td.rate{font-size:.88rem;letter-spacing:-0.01em;}}
  th[scope="row"]{font-weight:400;overflow-wrap:break-word;}
  td.note{color:var(--muted);font-family:var(--sans);font-size:11.5px;line-height:1.5;}
  tbody tr:last-child th,tbody tr:last-child td{border-bottom:0;}
  tr.total th,tr.total td{border-top:1px solid var(--ink);border-bottom:0;padding-top:16px;font-weight:600;}
  th[scope="row"]{font-weight:400;padding-right:26px;}

  .included{display:grid;grid-template-columns:repeat(2,1fr);gap:42px 72px;margin-top:16px;}
  .inc h4{margin:0 0 7px;font-weight:400;font-size:1.06rem;line-height:1.3;}
  .inc p{margin:0;color:var(--muted);font-size:.95rem;line-height:1.6;text-wrap:pretty;}
  .footnote{margin:44px 0 0;color:var(--faint);font-family:var(--sans);font-size:11.5px;line-height:1.7;max-width:78ch;}
  .footnote a{color:var(--muted);}

  /* ------------- Split ------------- */
  .split{display:grid;grid-template-columns:repeat(2,1fr);gap:70px 88px;}
  .panel{border-top:2px solid var(--accent);padding-top:36px;}
  .panel h3{margin:0 0 16px;font-weight:400;font-size:1.34rem;line-height:1.26;}
  .panel p{margin:0 0 20px;color:var(--muted);font-size:1rem;line-height:1.66;text-wrap:pretty;}
  .panel ul{margin:0 0 26px;padding-left:1.1em;color:var(--muted);font-size:.99rem;line-height:1.62;}
  .panel li{margin-bottom:9px;}
  .panel a.more{font-family:var(--sans);font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;font-weight:600;
                color:var(--accent);text-decoration:none;border-bottom:1px solid var(--accent);padding-bottom:3px;}

  /* ------------- Steps ------------- */
  .steps{display:grid;grid-template-columns:repeat(3,1fr);gap:60px 80px;}
  .step .k{font-family:var(--sans);font-size:11px;letter-spacing:.2em;color:var(--accent);margin-bottom:16px;}
  .step h3{margin:0 0 12px;font-weight:400;font-size:1.16rem;line-height:1.3;}
  .step p{margin:0;color:var(--muted);font-size:.98rem;line-height:1.62;text-wrap:pretty;}

  /* ------------- FAQ ------------- */
  .faq{border-top:1px solid var(--rule);}
  .faq details{border-bottom:1px solid var(--rule);}
  .faq summary{list-style:none;cursor:pointer;padding:34px 44px 34px 0;position:relative;
               font-size:1.12rem;line-height:1.4;text-wrap:pretty;}
  .faq summary::-webkit-details-marker{display:none;}
  .faq summary::after{content:"";position:absolute;right:8px;top:50%;width:12px;height:12px;
    margin-top:-6px;border-right:1.5px solid var(--accent);border-bottom:1.5px solid var(--accent);
    transform:rotate(45deg) translateY(-25%);transition:transform .25s;}
  .faq details[open] summary::after{transform:rotate(-135deg) translateY(-25%);}
  .faq summary:hover{color:var(--accent);}
  .faq .a{padding:0 60px 38px 0;color:var(--muted);font-size:1rem;line-height:1.68;}
  .faq .a p{margin:0 0 14px;text-wrap:pretty;}
  .faq .a p:last-child{margin-bottom:0;}

  /* ------------- CTA band ------------- */
  .band{background:var(--accent);color:var(--paper);border-top:0;}
  .band .wrap{padding-top:110px;padding-bottom:110px;text-align:center;
              display:flex;flex-direction:column;align-items:center;}
  .band h2{margin:0 0 18px;font-weight:400;font-size:clamp(1.6rem,3.2vw,2.3rem);line-height:1.2;
           letter-spacing:-0.015em;max-width:20ch;text-wrap:balance;}
  .band p{margin:0 0 34px;max-width:52ch;color:#CFC3DC;font-size:1.02rem;line-height:1.66;text-wrap:pretty;}
  .band .btn{border-color:var(--paper);color:var(--accent);background:var(--paper);}
  .band .btn:hover{background:transparent;color:var(--paper);}

  /* ------------- Contact ------------- */
  .contact-layout{display:grid;grid-template-columns:1.15fr .85fr;gap:72px 88px;align-items:start;}
  form.enquiry{display:grid;gap:22px;}
  .field{display:grid;gap:8px;}
  .field label{font-family:var(--sans);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--faint);font-weight:600;}
  .field input,.field select,.field textarea{
    font-family:var(--serif);font-size:1rem;color:var(--ink);background:transparent;
    border:0;border-bottom:1px solid var(--rule);padding:10px 2px;width:100%;
    transition:border-color .2s;-webkit-appearance:none;appearance:none;border-radius:0;}
  .field select{font-family:var(--sans);font-size:.92rem;letter-spacing:.02em;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='7' viewBox='0 0 11 7'%3E%3Cpath d='M1 1l4.5 4.5L10 1' fill='none' stroke='%236B655C' stroke-width='1.4'/%3E%3C/svg%3E");
    background-repeat:no-repeat;background-position:right 4px center;padding-right:26px;}
  .field textarea{resize:vertical;min-height:110px;line-height:1.6;}
  .field input:focus,.field select:focus,.field textarea:focus{outline:none;border-bottom-color:var(--accent);}
  .field input::placeholder,.field textarea::placeholder{color:#B7B0A5;}
  .form-row{display:grid;grid-template-columns:repeat(2,1fr);gap:22px 28px;}
  button.submit{justify-self:start;font-family:var(--sans);font-size:12px;letter-spacing:.14em;text-transform:uppercase;
    font-weight:600;color:var(--paper);background:var(--accent);border:1px solid var(--accent);
    padding:15px 30px;cursor:pointer;transition:background .22s;}
  button.submit:hover{background:var(--accent-dark);border-color:var(--accent-dark);}
  button.submit[disabled]{opacity:.55;cursor:default;}
  .form-note{font-family:var(--sans);font-size:11.5px;color:var(--faint);line-height:1.6;margin:0;}
  .form-status{font-family:var(--sans);font-size:12.5px;line-height:1.6;margin:0;color:var(--accent);}
  .form-status.err{color:#8C2F1E;}
  .details h3{font-family:var(--sans);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--faint);font-weight:600;margin:0 0 14px;}
  .details p{margin:0 0 30px;line-height:1.8;font-size:1rem;}
  .details a{text-decoration:none;border-bottom:1px solid var(--rule);transition:border-color .2s;}
  .details a:hover{border-bottom-color:var(--accent);}
  .details .label{color:var(--faint);font-family:var(--sans);font-size:11.5px;letter-spacing:.03em;}

  /* ------------- Footer ------------- */
  footer{border-top:1px solid var(--rule);padding:38px 0 68px;font-family:var(--sans);font-size:11.5px;letter-spacing:.03em;color:var(--faint);}
  footer .wrap{display:flex;flex-wrap:wrap;gap:14px 30px;justify-content:space-between;align-items:center;}
  footer nav{display:flex;flex-wrap:wrap;gap:10px 24px;}
  footer a{text-decoration:none;border-bottom:1px solid transparent;}
  footer a:hover{color:var(--ink);border-bottom-color:var(--ink);}
  .parent{display:inline-flex;align-items:center;gap:9px;}
  .parent svg{width:16px;height:16px;flex:none;}

  /* ------------- Reveal ------------- */
  .reveal{opacity:0;transform:translateY(18px);
          transition:opacity .7s ease,transform .7s cubic-bezier(.2,.7,.2,1);
          transition-delay:var(--d,0ms);}
  .reveal.in{opacity:1;transform:none;}
  .svc,.role,.inc,.step,.panel,.strow{transition:transform .18s ease;}
  .svc:hover h3{color:var(--accent);}
  .svc h3{transition:color .18s;}
  @media (prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none;}}

  /* ------------- Responsive ------------- */
  @media (max-width:980px){
    .calc{grid-template-columns:1fr;}
    .calc-in{border-right:0;border-bottom:1px solid var(--rule);}
    .services{grid-template-columns:1fr;gap:68px;}
    .rolelist{grid-template-columns:repeat(2,1fr);gap:30px 36px;}
    .included{grid-template-columns:1fr;gap:38px;}
    .split{grid-template-columns:1fr;gap:60px;}
    .steps{grid-template-columns:1fr;gap:54px;}
    .contact-layout{grid-template-columns:1fr;gap:68px;}
    .strip .wrap{grid-template-columns:repeat(2,1fr);gap:16px 32px;}
  }
  @media (max-width:760px){
    :root{--bar:56px;}
    .wrap{padding:0 32px;}
    .site-header{position:static;background:var(--paper);}
    .site-header .wrap{justify-content:flex-start;gap:12px 22px;}
    .brand svg{width:158px;}
    nav.menu{width:100%;gap:8px 18px;font-size:11px;letter-spacing:.07em;}
    /* At phone widths the five links wrap and orphan CONTACT on its own
       line, which eats a third of the hero. Shrink them just enough. */
    @media (max-width:440px){
      nav.menu{gap:6px 10px;font-size:9.5px;letter-spacing:.03em;}
      .brand svg{width:144px;}
    }
    .faq .a{padding-right:0;}
  }
  @media (max-width:620px){
    body{font-size:17px;}
    .wrap{padding:0 28px;}
    section{padding:96px 0;}
    .sec-head{margin-bottom:50px;}
    .strip .wrap{grid-template-columns:1fr;gap:12px;}
    .rolelist{grid-template-columns:1fr;}
    .calc-in,.calc-out{padding:30px 26px;}
    .calc .two{grid-template-columns:1fr;}
    .form-row{grid-template-columns:1fr;}
    .btn{padding:14px 22px;font-size:11px;}
    .band .wrap{padding-top:64px;padding-bottom:64px;}
  }

  @media print{
    body{background:#fff;}
    .site-header{position:static;}
    .reveal{opacity:1;transform:none;}
    .faq details{display:block;}
  }


  /* ------------- Page header (interior pages) ------------- */
  .pagehead{padding:88px 0 0;}
  /* A page header is followed by the first section, whose top border would
     otherwise draw a rule straight under the intro paragraph. Belt and
     braces alongside the no-rule class on those sections. */
  .pagehead + section,
  .wrap:has(> .pagehead) + .wrap > section:first-child{border-top:0;}
  /* In a page head the eyebrow is a label, not a second headline. The
     large uppercase .eyebrow used for section headings competes with the
     h1 directly under it, so it is reset to a small tracked kicker. */
  .pagehead .eyebrow{margin:0 0 16px !important;font-family:var(--sans);font-size:11px;
                     letter-spacing:.2em;text-transform:uppercase;font-weight:700;
                     color:var(--accent);line-height:1.4;}
  .pagehead h1{font-weight:400;font-size:clamp(1.9rem,4vw,2.85rem);line-height:1.14;
               letter-spacing:-0.016em;margin:26px 0 0;max-width:20ch;text-wrap:balance;}
  .pagehead .lede{margin:24px 0 0;max-width:64ch;color:var(--muted);
                  font-size:1.04rem;line-height:1.68;text-wrap:pretty;}
  .pagehead .crumbs{font-family:var(--sans);font-size:11.5px;letter-spacing:.14em;
                    text-transform:uppercase;color:var(--faint);margin:0 0 20px;}
  .pagehead .crumbs a{color:var(--faint);text-decoration:none;border-bottom:1px solid transparent;}
  .pagehead .crumbs a:hover{color:var(--ink);border-bottom-color:var(--ink);}

  /* ------------- Audience cards (home) ------------- */
  .audience{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--rule);
            border:1px solid var(--rule);}
  .aud{background:var(--paper);padding:40px 36px;display:flex;flex-direction:column;
       text-decoration:none;color:inherit;transition:background .2s;}
  .aud:hover{background:var(--paper-2);}
  .aud .k{font-family:var(--sans);font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;
          color:var(--accent);margin:0 0 18px;}
  .aud h3{margin:0 0 14px;font-weight:400;font-size:1.5rem;line-height:1.24;letter-spacing:-0.012em;}
  .aud p{margin:0 0 24px;color:var(--muted);font-size:1rem;line-height:1.66;flex:1;text-wrap:pretty;}
  .aud .go{font-family:var(--sans);font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;
           font-weight:600;color:var(--accent);}
  .aud:hover .go{text-decoration:underline;text-underline-offset:4px;}

  /* ------------- Rate teaser (home) ------------- */
  .teaser{display:grid;grid-template-columns:repeat(4,1fr);gap:36px 40px;}
  .tz .v{font-size:clamp(1.45rem,2.9vw,2rem);line-height:1;letter-spacing:-0.02em;
         margin:0 0 12px;font-variant-numeric:tabular-nums;}
  .tz .l{font-family:var(--sans);font-size:11px;letter-spacing:.13em;text-transform:uppercase;
         color:var(--faint);line-height:1.55;margin:0;}
  .teaser-more{margin:52px 0 0;}
  .teaser-more a{font-family:var(--sans);font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;
    font-weight:600;color:var(--accent);text-decoration:none;border-bottom:1px solid var(--accent);padding-bottom:3px;}

  /* ------------- Checklist ------------- */
  .checks{display:grid;grid-template-columns:repeat(2,1fr);gap:34px 64px;}
  .chk{display:grid;grid-template-columns:22px 1fr;gap:0 16px;}
  .chk svg{width:15px;height:15px;margin-top:.4em;color:var(--accent);}
  .chk h3{margin:0 0 6px;font-weight:400;font-size:1.04rem;line-height:1.32;}
  .chk p{margin:0;color:var(--muted);font-size:.95rem;line-height:1.62;text-wrap:pretty;}

  /* ------------- Nav current page ------------- */
  nav.menu a[aria-current="page"]{color:var(--ink);border-bottom-color:var(--ink);}

  @media (max-width:980px){
    .audience{grid-template-columns:1fr;}
    .teaser{grid-template-columns:repeat(2,1fr);gap:32px;}
    .checks{grid-template-columns:1fr;gap:28px;}
  }
  @media (max-width:620px){
    .pagehead{padding-top:64px;}
    .teaser{grid-template-columns:1fr;gap:26px;}
    .aud{padding:32px 26px;}
  }


  /* ------------- Trust strip, stronger ------------- */
  .strip .wrap{padding-top:34px;padding-bottom:34px;}
  .strip p{font-size:12px;letter-spacing:.15em;color:var(--ink);opacity:.72;}

  /* ------------- Rate teaser, made a feature ------------- */
  .teaser{gap:44px 40px;}
  .tz .v{font-size:clamp(1.9rem,4.2vw,3.1rem);line-height:.98;letter-spacing:-0.028em;
         margin:0 0 14px;color:var(--accent);}
  .tz .l{font-size:11px;letter-spacing:.15em;color:var(--faint);}

  /* ------------- Full-bleed fact band ------------- */
  .fact{background:var(--accent);color:var(--paper);border-top:0;}
  .fact .wrap{padding-top:104px;padding-bottom:104px;
              display:grid;grid-template-columns:1fr 1fr;gap:36px 80px;align-items:center;}
  .fact .k{font-family:var(--sans);font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;
           color:#BBA9CC;margin:0 0 22px;}
  .fact .big{font-size:clamp(2.3rem,6.2vw,4.1rem);line-height:.95;letter-spacing:-0.035em;
             margin:0;color:#fff;font-variant-numeric:tabular-nums;text-wrap:balance;}
  .fact p.body{margin:0 0 22px;color:#CFC3DC;font-size:1.04rem;line-height:1.68;text-wrap:pretty;}
  .fact p.body:last-of-type{margin-bottom:26px;}
  .fact a.more{font-family:var(--sans);font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;
               font-weight:600;color:#fff;text-decoration:none;
               border-bottom:1px solid rgba(255,255,255,.5);padding-bottom:3px;transition:border-color .2s;}
  .fact a.more:hover{border-bottom-color:#fff;}

  /* ------------- Services, more presence ------------- */
  .services{gap:0;}
  .svc{padding:38px 0;border-top:1px solid var(--rule);display:grid;
       grid-template-columns:64px 1fr;gap:0 28px;align-items:start;}
  .services > .svc:nth-child(1),.services > .svc:nth-child(2){border-top:0;padding-top:0;}
  .svc .num{margin:0;padding-top:.35em;}
  .svc h3{font-size:1.24rem;margin:0 0 12px;}
  .svc p{max-width:40ch;}
  .svc > div{grid-column:2;}

  @media (max-width:980px){
    .fact .wrap{grid-template-columns:1fr;gap:26px;padding-top:76px;padding-bottom:76px;}
    .services > .svc:nth-child(2){border-top:1px solid var(--rule);padding-top:38px;}
  }
  @media (max-width:620px){
    .svc{grid-template-columns:1fr;gap:0;padding:30px 0;}
    .svc .num{padding-top:0;margin-bottom:14px;}
    .svc > div{grid-column:1;}
    .fact .wrap{padding-top:64px;padding-bottom:64px;}
  }

  /* ================= Home page, conversion layer ================= */

  /* Full-bleed bands already carry their own padding on .wrap.
     Without this they inherit the 150px section padding as well and
     open a hole the height of a laptop screen underneath the text. */
  .fact,.band{padding:0;}

  /* ------------- Hero trust badges ------------- */

  /* ------------- The bench ------------- */
  /* Each card is a subgrid spanning the same four rows, so the availability
     line, the role, the speciality and the fact list share baselines across
     all four cards no matter how differently the text wraps. Without this
     the cards align only at their outer edges and the insides read ragged. */
  .bench{display:grid;grid-template-columns:repeat(4,1fr);
         grid-template-rows:auto auto auto auto;
         gap:1px;background:var(--rule);border:1px solid var(--rule);}
  .bch{background:var(--paper);padding:30px 26px 30px;transition:background .2s;
       display:grid;grid-row:span 4;gap:0;align-content:start;}
  @supports (grid-template-rows:subgrid){
    .bch{grid-template-rows:subgrid;}
  }
  .bch:hover{background:var(--paper-2);}

  .bch .avail{display:flex;align-items:center;gap:8px;font-family:var(--sans);font-size:10px;
              letter-spacing:.16em;text-transform:uppercase;font-weight:600;color:#1E7A4B;
              margin:0 0 18px;align-self:start;}
  .bch .avail i{width:7px;height:7px;border-radius:50%;background:#1E7A4B;display:block;flex:none;}
  .bch h3{margin:0 0 7px;font-weight:400;font-size:1.16rem;line-height:1.24;
          letter-spacing:-0.012em;align-self:start;}
  .bch .spec{margin:0 0 20px;color:var(--muted);font-size:.92rem;line-height:1.5;
             align-self:start;}

  .bch .fx{margin:0;padding:0;list-style:none;align-self:start;
           border-top:1px solid var(--rule);}
  .bch .fx li{font-size:.885rem;line-height:1.45;color:var(--ink);
              padding:11px 0;border-bottom:1px solid var(--rule);}
  .bch .fx li:last-child{border-bottom:0;padding-bottom:0;}

  .bench-note{margin:22px 0 0;font-size:.88rem;color:var(--muted);line-height:1.6;max-width:74ch;}

  /* ------------- Systems we work in ------------- */
  .systems{border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);
           background:var(--paper-2);overflow:hidden;position:relative;
           -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 8%,#000 92%,transparent 100%);
           mask-image:linear-gradient(90deg,transparent 0,#000 8%,#000 92%,transparent 100%);}
  .systems .lbl{margin:0;padding:26px 40px 0;font-family:var(--sans);font-size:10.5px;
                letter-spacing:.18em;text-transform:uppercase;color:var(--muted);text-align:center;}
  .systrack{display:flex;width:max-content;animation:sysmarq 46s linear infinite;
            padding:20px 0 28px;}
  .systems:hover .systrack{animation-play-state:paused;}
  .systrack span{font-family:var(--sans);font-size:clamp(.95rem,1.7vw,1.18rem);font-weight:600;
                 letter-spacing:-0.005em;color:var(--ink);opacity:.5;padding:0 34px;white-space:nowrap;}
  @keyframes sysmarq{from{transform:translate3d(0,0,0);}to{transform:translate3d(-50%,0,0);}}
  @media (prefers-reduced-motion:reduce){
    .systrack{animation:none;flex-wrap:wrap;width:auto;justify-content:center;gap:10px 0;padding:20px 40px 28px;}
  }

  /* A list with an odd number of tiles leaves the last one alone on its
     row, so it takes the full width and its rule runs the whole way
     across. An even list is untouched. */
  .services > .svc:last-child:nth-child(odd){grid-column:1 / -1;grid-template-columns:64px 1fr;}
  .services > .svc:last-child:nth-child(odd) p{max-width:56ch;}

  @media (max-width:1180px){
    .bench{grid-template-columns:repeat(2,1fr);
           grid-template-rows:repeat(8,auto);}
  }

  @media (max-width:620px){
    .bench{grid-template-columns:1fr;grid-template-rows:repeat(16,auto);}
    .bch{padding:26px 24px 26px;}
    .services > .svc:last-child:nth-child(odd){grid-template-columns:1fr;}
  }

  .visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;
                   overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;}

  /* ---------------- Legal documents ---------------- */
  /* Privacy and terms use the group's shared copy, wrapped in this
     brand's own chrome so they do not look like a different website. */
  .doc{padding:56px 0 96px;max-width:var(--maxw);margin:0 auto;}
  .doc .updated{margin:0 0 44px;font-family:var(--sans);font-size:11px;letter-spacing:.1em;
                text-transform:uppercase;color:var(--faint);
                padding-bottom:22px;border-bottom:1px solid var(--rule);}
  .doc h2{margin:52px 0 16px;font-size:1.22rem;font-weight:400;letter-spacing:-0.012em;
          line-height:1.3;color:var(--ink);}
  .doc h3{margin:32px 0 10px;font-family:var(--sans);font-size:10.5px;letter-spacing:.14em;
          text-transform:uppercase;font-weight:700;color:var(--accent);}
  .doc p{margin:0 0 16px;max-width:72ch;color:var(--muted);font-size:1rem;
         line-height:1.72;text-wrap:pretty;}
  .doc strong{color:var(--ink);font-weight:600;}
  .doc a{color:var(--accent);text-decoration:none;border-bottom:1px solid var(--rule);}
  .doc a:hover{border-bottom-color:var(--accent);}
  .doc ul,.doc ol{margin:0 0 18px;padding-left:20px;max-width:72ch;color:var(--muted);}
  .doc li{margin-bottom:9px;line-height:1.66;font-size:1rem;}
  .doc .note{margin-top:44px;padding:20px 22px;background:var(--paper-2);
             border:1px solid var(--rule);font-family:var(--sans);font-size:12px;
             line-height:1.7;color:var(--muted);max-width:none;}
  @media (max-width:620px){
    .doc{padding:40px 0 72px;}
    .doc h2{margin-top:40px;}
  }

  /* ---------------- Embedded videos ---------------- */
  /* Vertical films, so the player is capped by height rather than width
     or a 9:16 master would push everything else off the screen. */
  .films{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:44px 56px;align-items:start;}
  .film{margin:0;}
  /* Width and height both auto, capped on both axes: the browser scales
     the film by its own aspect ratio, so there is nothing to letterbox
     against. Fixing the width and capping the height pillarboxes it. */
  .film video{display:block;margin:0 auto;width:auto;height:auto;
              max-width:100%;max-height:76vh;border:1px solid var(--rule);}

  .film figcaption{margin:16px 0 0;}
  .film .k{margin:0 0 6px;font-family:var(--sans);font-size:10px;letter-spacing:.18em;
           text-transform:uppercase;font-weight:700;color:var(--accent);}
  .film h3{margin:0 0 8px;font-weight:400;font-size:1.12rem;line-height:1.3;}
  .film p{margin:0;color:var(--muted);font-size:.95rem;line-height:1.62;text-wrap:pretty;}
  @media (max-width:860px){
    .films{grid-template-columns:1fr;gap:40px;}
    .film video{max-height:74vh;}
  }

  /* ---------------- Portfolio index ---------------- */
  .fgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:52px 40px;}
  .fcard img{width:100%;height:auto;display:block;border:1px solid var(--rule);
             background:var(--paper-2);}
  .fcard a{text-decoration:none;color:inherit;display:block;}
  .fcard .k{margin:18px 0 6px;font-family:var(--sans);font-size:10px;letter-spacing:.18em;
            text-transform:uppercase;font-weight:700;color:var(--accent);}
  .fcard h3{margin:0 0 10px;font-weight:400;font-size:1.16rem;line-height:1.28;}
  .fcard h3 a{border-bottom:1px solid transparent;}
  .fcard:hover h3 a{border-bottom-color:var(--ink);}
  .fcard p{margin:0;color:var(--muted);font-size:.95rem;line-height:1.62;text-wrap:pretty;}
  .fcard .more{margin-top:14px;}
  .fcard .more a{font-family:var(--sans);font-size:10.5px;letter-spacing:.14em;
                 text-transform:uppercase;font-weight:700;color:var(--accent);
                 border-bottom:1px solid var(--rule);padding-bottom:3px;display:inline-block;}
  .fcard .more a:hover{border-bottom-color:var(--accent);}

  /* ---------------- One film ---------------- */
  .fdetail{display:grid;grid-template-columns:minmax(0,380px) minmax(0,1fr);gap:56px 64px;
           align-items:start;}
  .fdetail .film video{max-height:none;width:100%;}
  .fdetail .film figcaption{margin-top:16px;}
  .fmeta{margin:0 0 38px;padding:0 0 30px;border-bottom:1px solid var(--rule);
         display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 32px;}
  .fmeta div{display:flex;flex-direction:column;gap:6px;}
  .fmeta dt{font-family:var(--sans);font-size:9.5px;letter-spacing:.18em;text-transform:uppercase;
            font-weight:700;color:var(--faint);}
  .fmeta dd{margin:0;font-size:.97rem;line-height:1.5;color:var(--ink-2);}
  .fruns{margin:30px 0 0;color:var(--muted);font-size:.99rem;line-height:1.68;}
  .fruns strong{color:var(--ink);font-weight:600;}
  .fmore{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:14px 34px;}
  .fmore a{font-family:var(--sans);font-size:11px;letter-spacing:.14em;text-transform:uppercase;
           font-weight:700;color:var(--accent);text-decoration:none;
           border-bottom:1px solid var(--rule);padding-bottom:3px;}
  .fmore a:hover{border-bottom-color:var(--accent);}

  @media (max-width:980px){
    .fgrid{grid-template-columns:repeat(2,minmax(0,1fr));gap:44px 32px;}
    .fdetail{grid-template-columns:1fr;gap:44px;}
    .fdetail .film{max-width:420px;}
  }
  @media (max-width:620px){
    .fgrid{grid-template-columns:1fr;gap:44px;}
    .fmeta{grid-template-columns:1fr;}
  }

  /* ---------------- Wide page head ---------------- */
  /* On a portfolio index the heading alone leaves half the page empty,
     so the lede sits beside it and the two share the measure. */
  .pagehead.wide{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);
                 gap:0 72px;align-items:end;padding-bottom:6px;}
  .pagehead.wide .crumbs,.pagehead.wide .eyebrow{grid-column:1;}
  .pagehead.wide h1{grid-column:1;max-width:none;}
  .pagehead.wide .lede{grid-column:2;grid-row:3;margin:0 0 10px;max-width:46ch;}
  @media (max-width:900px){
    .pagehead.wide{grid-template-columns:1fr;gap:0;}
    .pagehead.wide .lede{grid-column:1;grid-row:auto;margin-top:24px;}
  }

  /* ---------------- Film list ---------------- */
  /* One film per row, poster beside the copy. A grid of small cards
     leaves holes until there are six of them; a list never does. */
  .flist{border-top:1px solid var(--rule);}
  .frow{display:grid;grid-template-columns:232px minmax(0,1fr) minmax(0,200px);
        gap:0 48px;padding:38px 0;border-bottom:1px solid var(--rule);align-items:start;}
  .frow img{width:100%;height:auto;display:block;border:1px solid var(--rule);
            background:var(--paper-2);}
  .frow a{text-decoration:none;color:inherit;}
  .frow .k{margin:0 0 8px;font-family:var(--sans);font-size:10px;letter-spacing:.18em;
           text-transform:uppercase;font-weight:700;color:var(--accent);}
  .frow h3{margin:0 0 12px;font-weight:400;font-size:1.34rem;line-height:1.26;}
  .frow h3 a{border-bottom:1px solid transparent;}
  .frow:hover h3 a{border-bottom-color:var(--ink);}
  .frow .body > p{margin:0;color:var(--muted);font-size:.99rem;line-height:1.66;
                  max-width:58ch;text-wrap:pretty;}
  .frow .go{display:inline-block;margin-top:18px;font-family:var(--sans);font-size:10.5px;
            letter-spacing:.14em;text-transform:uppercase;font-weight:700;color:var(--accent);
            border-bottom:1px solid var(--rule);padding-bottom:3px;}
  .frow .go:hover{border-bottom-color:var(--accent);}
  .frow dl{margin:0;display:flex;flex-direction:column;gap:16px;}
  .frow dt{font-family:var(--sans);font-size:9.5px;letter-spacing:.18em;text-transform:uppercase;
           font-weight:700;color:var(--faint);margin-bottom:5px;}
  .frow dd{margin:0;font-size:.95rem;line-height:1.5;color:var(--ink-2);}
  @media (max-width:980px){
    .frow{grid-template-columns:180px minmax(0,1fr);gap:0 34px;}
    .frow dl{grid-column:2;flex-direction:row;flex-wrap:wrap;gap:18px 40px;margin-top:22px;}
  }
  @media (max-width:620px){
    .frow{grid-template-columns:1fr;gap:20px;}
    .frow img{max-width:240px;}
    .frow dl{grid-column:1;}
  }

  /* ============ Service and step grids, final word ============ */
  /* Six service tiles read as three across and two down on a wide
     screen, two across and three down on a laptop, and one column on a
     phone. The number sits above its heading rather than beside it,
     because a 64px gutter eats a third of a column once there are three
     of them. The top row never carries a rule, so the exceptions that
     strip the border have to move with the column count. */
  .services{grid-template-columns:repeat(3,1fr);column-gap:60px;row-gap:0;}
  /* align-content:start matters more than it looks. Each tile is stretched
     to the height of the tallest one in its row, and an auto-sized grid
     row will happily absorb that slack, which pushed the heading of every
     short tile down the column and left the row of headings ragged. */
  .svc{grid-template-columns:1fr;gap:0;padding:38px 0;align-content:start;
       border-top:1px solid var(--rule);}
  .svc .num{grid-column:1;padding-top:0;margin:0 0 18px;}
  .svc > div{grid-column:1;}
  .svc p{max-width:42ch;}
  .services > .svc:nth-child(-n+3){border-top:0;padding-top:0;}
  .services > .svc:last-child:nth-child(odd){grid-column:auto;
                                             grid-template-columns:1fr;}
  .services > .svc:last-child:nth-child(odd) p{max-width:42ch;}

  /* Four stages sit two by two. Three across left the fourth alone on a
     row of its own, which read as a mistake rather than a fourth stage. */
  .steps{grid-template-columns:repeat(2,1fr);gap:64px 88px;}

  @media (max-width:1180px){
    .services{grid-template-columns:repeat(2,1fr);column-gap:56px;}
    .services > .svc:nth-child(-n+3){border-top:1px solid var(--rule);
                                     padding-top:38px;}
    .services > .svc:nth-child(-n+2){border-top:0;padding-top:0;}
  }

  @media (max-width:760px){
    .services{grid-template-columns:1fr;}
    .services > .svc:nth-child(-n+2){border-top:1px solid var(--rule);
                                     padding-top:38px;}
    .services > .svc:first-child{border-top:0;padding-top:0;}
    /* One column is the full measure, so the 42ch cap that keeps three
       columns readable would leave half the row empty here. */
    .svc p,
    .services > .svc:last-child:nth-child(odd) p{max-width:60ch;}
    .steps{grid-template-columns:1fr;gap:52px;}
    .step p{max-width:60ch;}
  }

  /* ---------------- The claims strip ---------------- */
  /* It was inheriting the 126px section padding on top of its own, which
     opened a band of empty grey the height of a laptop screen with four
     small labels adrift in the middle of it. The padding now lives on
     the items, so each claim sits in its own column with a rule beside
     it and the band is only as tall as its content. */
  .strip{padding:0;}
  .strip .wrap{gap:0;padding-top:0;padding-bottom:0;}
  .strip p{display:flex;align-items:center;gap:11px;
           padding:32px 0 32px 32px;border-left:1px solid var(--rule);
           font-family:var(--sans);font-size:11px;letter-spacing:.14em;
           text-transform:uppercase;font-weight:600;
           color:var(--ink);opacity:.76;line-height:1.35;}
  .strip p::before{content:"";width:6px;height:6px;flex:none;
                   background:var(--accent);transform:rotate(45deg);}
  .strip p:first-child{padding-left:0;border-left:0;}

  @media (max-width:980px){
    .strip p{padding:26px 0 26px 26px;}
    .strip p:nth-child(2n+1){padding-left:0;border-left:0;}
  }
  @media (max-width:620px){
    .strip p{padding:18px 0;border-left:0;}
    .strip p:first-child{padding-top:28px;}
    .strip p:last-child{padding-bottom:28px;}
  }

  /* ---------------- The violet band ---------------- */
  /* Three stacked paddings met here: the section above ended with 126px
     of cream, the band opened with 110px of violet, and the section
     below began with another 126px. That is most of a laptop screen of
     nothing on either side of one short call to action. The band keeps
     enough air to feel deliberate, and the cream either side of it gives
     way, because a full-bleed colour change is already the separation
     that padding was being asked to provide. */
  .band .wrap{padding-top:82px;padding-bottom:82px;}
  .wrap:has(+ .band) > section:last-of-type{padding-bottom:64px;}
  .band + .wrap > section:first-of-type{padding-top:88px;}

  @media (max-width:760px){
    .band .wrap{padding-top:58px;padding-bottom:58px;}
    .wrap:has(+ .band) > section:last-of-type{padding-bottom:48px;}
    .band + .wrap > section:first-of-type{padding-top:64px;}
  }

  /* Three facts, three columns. As a wrapping flex row the third one
     dropped to a line of its own and the row read as a mistake. */
  @media (max-width:1080px){
    .hero-facts{grid-template-columns:repeat(3,1fr);}
  }
  @media (max-width:560px){
    .hero-facts{grid-template-columns:1fr;gap:20px;}
  }
