/* Blu Dexter inner pages (generated).
   Part 1: homepage refinements, copied verbatim from the homepage. */
      /* ---------- blue strip + half-blue footer + responsive pass ---------- */
      .strip.dmb {
        background: var(--dmb);
        color: #fff
      }

      .strip.dmb .bmk {
        color: #fff
      }

      .strip.dmb .bmk i {
        color: #fff;
        opacity: .85
      }

      /* footer: bottom half navy (full-bleed band) */
      .ft {
        padding-bottom: 0
      }

      .ft-bot {
        background: var(--blk);
        margin: 26px calc(50% - 50vw) 0;
        padding: 30px calc(50vw - 50%) 96px
      }

      .ft-bot .addr {
        color: rgba(255, 255, 255, .6)
      }

      .ft-bot .addr b {
        color: #fff
      }

      .ft-soc a {
        border-color: rgba(255, 255, 255, .3);
        color: #fff
      }

      .ft-soc a:hover {
        background: var(--dmb);
        border-color: var(--dmb);
        color: #fff
      }

      .ft-bot .cop {
        color: rgba(255, 255, 255, .55)
      }

      .ft-bot .cop .reply {
        color: var(--dmb2)
      }

      /* responsive pass for page elements */
      @media(max-width:640px) {
        .phero {
          padding: 52px 0
        }

        .phero .dh {
          font-size: 22px;
          letter-spacing: .1em
        }

        .banner {
          aspect-ratio: 16/10
        }

        .mg {
          padding: 22px 18px
        }

        .mg .mono {
          margin-bottom: 16px
        }

        .dlv span {
          font-size: 8.5px;
          padding: 7px 10px;
          letter-spacing: .14em
        }

        .statrow .st {
          padding: 24px 16px
        }

        .statrow .v {
          font-size: 28px
        }

        .not {
          padding: 20px 16px
        }

        .tiers2 .t2 {
          padding: 26px 20px
        }

        .split h3 {
          letter-spacing: .12em;
          font-size: 15px
        }

        .ft-bot {
          padding-top: 26px;
          padding-bottom: 92px
        }
      }

      @media(min-width:641px) and (max-width:1080px) {
        .mgrid {
          grid-template-columns: 1fr 1fr
        }

        .split {
          grid-template-columns: 1fr 1fr;
          gap: 26px
        }
      }

      /* ---------- navy sections ---------- */
      .gr {
        font-weight: 300;
        font-size: clamp(19px, 2.6vw, 30px);
        letter-spacing: .12em;
        text-transform: uppercase;
        line-height: 1.75;
        color: var(--blk)
      }

      .dksec {
        background: var(--blk);
        color: #fff
      }

      .dksec .ey {
        color: rgba(255, 255, 255, .55)
      }

      .dksec .hx {
        color: #fff
      }

      .dksec .gr {
        color: #fff
      }

      .dksec .bd {
        color: rgba(255, 255, 255, .65)
      }

      .dksec .statrow {
        border-color: var(--hair-d)
      }

      .dksec .statrow .st {
        border-color: var(--hair-d)
      }

      .dksec .statrow .v {
        color: var(--dmb2)
      }

      .dksec .statrow .k {
        color: rgba(255, 255, 255, .72)
      }

      .dksec .split h3 {
        color: #fff
      }

      .dksec .split p {
        color: rgba(255, 255, 255, .68)
      }

      .dksec .mono {
        border: 1px solid var(--hair-d)
      }

      /* ---------- universal polish ---------- */
      .btn {
        min-height: 44px
      }

      a:focus-visible,
      button:focus-visible {
        outline: 2px solid var(--dmb);
        outline-offset: 3px
      }

      .lb-row {
        -webkit-overflow-scrolling: touch
      }

      html {
        -webkit-text-size-adjust: 100%
      }

      /* ---------- faq ---------- */
      .faq details {
        border-bottom: 1px solid var(--hair)
      }

      .faq summary {
        cursor: pointer;
        list-style: none;
        display: flex;
        justify-content: space-between;
        align-items: center;
        gap: 16px;
        padding: 20px 2px;
        font-size: 13px;
        font-weight: 500;
        letter-spacing: .06em;
        color: var(--blk)
      }

      .faq summary::-webkit-details-marker {
        display: none
      }

      .faq summary::after {
        content: "+";
        font-size: 16px;
        font-weight: 300;
        color: var(--dmb);
        transition: transform .25s
      }

      .faq details[open] summary::after {
        transform: rotate(45deg)
      }

      .faq details p {
        font-size: 13.5px;
        font-weight: 300;
        line-height: 1.8;
        color: var(--grey);
        padding: 0 2px 22px;
        max-width: 70ch
      }

      /* ---------- four ecosystems ---------- */
      @media(min-width:1081px) {
        .coll-grid {
          grid-template-columns: repeat(4, 1fr)
        }
      }

      @media(min-width:641px) and (max-width:1080px) {
        .coll:nth-child(3) {
          grid-column: auto
        }

        .coll:nth-child(3) .mono {
          aspect-ratio: 4/3
        }
      }

      /* ---------- mobile menu refinement ---------- */
      @media(max-width:1080px) {
        .m-nav {
          top: 70px;
          height: calc(100dvh - 70px);
          padding: 6px 22px 140px;
          overflow-y: auto;
          -webkit-overflow-scrolling: touch
        }

        .m-group {
          padding: 10px 0
        }

        .m-group .m-h {
          font-size: 10px;
          margin-bottom: 4px;
          letter-spacing: .24em
        }

        .m-group a {
          padding: 8px 0;
          font-size: 11px;
          letter-spacing: .14em
        }

        .m-cta {
          margin-top: 16px;
          gap: 8px
        }

        .m-cta .btn {
          padding: 13px 16px
        }
      }

      @media(max-width:400px) {
        .m-nav {
          top: 62px;
          height: calc(100dvh - 62px);
          padding: 4px 18px 140px
        }
      }

      /* ---------- universal audit form ---------- */
      .fbox {
        border: 1px solid var(--hair);
        padding: clamp(26px, 3.4vw, 46px);
        max-width: 880px;
        margin: 0 auto
      }

      .fgrid {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 4px 30px
      }

      .fgrid .full {
        grid-column: 1/-1
      }

      .fform2 .fl {
        display: block;
        font-size: 9.5px;
        font-weight: 600;
        letter-spacing: .26em;
        text-transform: uppercase;
        color: var(--grey);
        margin: 20px 0 4px
      }

      .fform2 input,
      .fform2 select,
      .fform2 textarea {
        width: 100%;
        border: 0;
        border-bottom: 1px solid var(--hair);
        background: transparent;
        padding: 9px 2px 11px;
        font-family: inherit;
        font-size: 14.5px;
        font-weight: 300;
        color: var(--blk);
        outline: none;
        border-radius: 0;
        transition: border-color .25s
      }

      .fform2 input:focus,
      .fform2 select:focus,
      .fform2 textarea:focus {
        border-color: var(--dmb)
      }

      .fform2 textarea {
        min-height: 84px;
        resize: vertical
      }

      .fform2 select {
        appearance: none;
        -webkit-appearance: none;
        background-image: linear-gradient(45deg, transparent 50%, var(--grey) 50%), linear-gradient(135deg, var(--grey) 50%, transparent 50%);
        background-position: calc(100% - 14px) 55%, calc(100% - 9px) 55%;
        background-size: 5px 5px;
        background-repeat: no-repeat
      }

      .fform2 .btn {
        width: 100%;
        margin-top: 28px
      }

      .fform2 .fine {
        margin-top: 12px;
        font-size: 10px;
        letter-spacing: .18em;
        text-transform: uppercase;
        color: var(--grey-2);
        text-align: center
      }

      @media(max-width:640px) {
        .fgrid {
          grid-template-columns: 1fr
        }

        .fbox {
          padding: 22px 18px
        }
      }

      /* first menu group fully visible */
      @media(max-width:1080px) {
        .m-nav {
          padding-top: 14px
        }

        .m-group:first-child {
          padding-top: 4px
        }
      }
          /* ---------- journal: blue band, thin white dividers ---------- */
      .jrn { background: var(--blk); color: var(--wht) }
      .jrn .ey { color: rgba(255, 255, 255, .6) }
      .jrn .hx { color: var(--wht) }
      .jrn a { border-bottom: 1px solid rgba(255, 255, 255, .28) }
      .jrn a:first-of-type { border-top: 1px solid rgba(255, 255, 255, .28) }
      .jrn h3 { color: var(--wht) }
      .jrn .dt, .jrn .cat { color: rgba(255, 255, 255, .62) }
      .jrn a:hover h3 { color: var(--dmb2) }
      .jrn + #audit-form { padding-top: clamp(78px, 9vw, 132px) !important }

      /* ---------- audit form: blue panel on white ---------- */
      #audit-form .fbox { background: var(--blk); border-color: var(--blk); color: var(--wht) }
      #audit-form .fform2 .fl { color: rgba(255, 255, 255, .72) }
      #audit-form .fform2 input, #audit-form .fform2 select, #audit-form .fform2 textarea {
        color: var(--wht); border-bottom-color: rgba(255, 255, 255, .3) }
      #audit-form .fform2 input:focus, #audit-form .fform2 select:focus, #audit-form .fform2 textarea:focus {
        border-bottom-color: var(--wht) }
      #audit-form .fform2 ::placeholder { color: rgba(255, 255, 255, .45) }
      #audit-form .fform2 select { background-image: linear-gradient(45deg, transparent 50%, #fff 50%), linear-gradient(135deg, #fff 50%, transparent 50%) }
      #audit-form .fform2 option { color: var(--blk); background: #fff }
      #audit-form .fform2 .btn-dmb { background: var(--wht); border-color: var(--wht); color: var(--blk) }
      #audit-form .fform2 .btn-dmb:hover { background: var(--dmb2); border-color: var(--dmb2); color: var(--wht) }
      #audit-form .fform2 .fine { color: rgba(255, 255, 255, .55) }
      #audit-form .fform2 input:-webkit-autofill { -webkit-text-fill-color: #fff; -webkit-box-shadow: 0 0 0 40px var(--blk) inset }
          /* photos in full colour */
      .mono img { filter: none }
      /* hero + quote readability over photos */
      .hero .mono img { opacity: .5 }
      .hero::after { background:
        radial-gradient(ellipse 62% 58% at 50% 52%, rgba(0, 16, 58, .62), rgba(0, 16, 58, 0) 72%),
        linear-gradient(180deg, rgba(1, 33, 105, .62), rgba(1, 33, 105, .48) 45%, rgba(1, 33, 105, .72)) }
      .hero .ey { color: #fff; text-shadow: 0 1px 10px rgba(0, 10, 40, .7) }
      .hero .dh { font-weight: 400; text-shadow: 0 2px 26px rgba(0, 10, 40, .6) }
      .hero .sb { color: #fff; font-size: 14.5px; text-shadow: 0 1px 12px rgba(0, 10, 40, .75) }
      .hero .hero-actions .btn-w:first-child { background: rgba(1, 33, 105, .35) }
      .hero .hslide:first-child .mono::after { content: ""; position: absolute; inset: 0;
        background: linear-gradient(180deg, rgba(0, 16, 58, .2), rgba(0, 16, 58, .5) 60%, rgba(0, 16, 58, .6)) }
      .hero .hslide:first-child .mono img { opacity: .42 }
      .brk .mono img { opacity: .45 }
      .brk blockquote, .brk .who { text-shadow: 0 2px 20px rgba(0, 10, 40, .6) }

      /* ===== image speed + even cards ===== */
      .mono.uv img { animation-duration: .6s }
      .coll { display: flex; flex-direction: column }
      .coll .mono, .coll:nth-child(3) .mono { aspect-ratio: 4/5 !important }
      .coll .cap { flex: 1; display: flex; flex-direction: column; align-items: center }
      .coll .cap p { flex: 1 }
      .coll .lnk { margin-top: auto }
      @media (max-width: 640px) { .coll .mono, .coll:nth-child(3) .mono { aspect-ratio: 4/4.4 !important } }

      /* ===== responsive + touch usability ===== */
      html { -webkit-text-size-adjust: 100%; text-size-adjust: 100% }
      #audit-form, #contact-form { scroll-margin-top: 96px }
      .xgrid { grid-template-columns: repeat(4, 1fr) }
      @media (max-width: 900px) { .xgrid { grid-template-columns: 1fr 1fr } }
      @media (max-width: 480px) { .xgrid { grid-template-columns: 1fr } }
      /* readable minimums everywhere */
      .ann, .ann a { font-size: 10.5px }
      .fform2 .fl, .fl { font-size: 10.5px }
      .lnk { font-size: 10.5px }
      /* slide dots: thin line, big tap area */
      .hdots { gap: 6px }
      .hdots button { width: 34px; height: 26px; padding: 12px 2px; background-clip: content-box !important; box-sizing: border-box; cursor: pointer }
      .hdots button.on { background-clip: content-box !important }
      /* touch devices + small screens: 44px targets, larger labels */
      @media (max-width: 1024px), (pointer: coarse) {
        .ann a { display: inline-block; padding: 10px 6px; margin: -10px 0 }
        .etab { min-height: 44px }
        .m-nav a { min-height: 44px; display: flex; align-items: center }
        .lnk, a.lnk { display: inline-block; padding: 10px 0 }
        footer li a, .ft a, .ft-col a { display: inline-block; padding: 8px 0 }
        details summary { min-height: 44px; display: flex; align-items: center }
        .hero-arr, .brk-ctl button, #wkPrev, #wkNext, #lbPrev, #lbNext { min-width: 44px; min-height: 44px }
        .btn { min-height: 46px }
      }
      @media (max-width: 768px) {
        .ann, .ann a { font-size: 11px !important }
        .fform2 .fl, .fl, .lnk, .cap, .dt, .cat, .eno, .no, .lb0, .enm, .tn, .fine, .k, .m-h, footer h6, .ey { font-size: 11px !important }
        .strip span, .strip i, .clstrip span, .bmk { font-size: 10px !important }
        .eng-grid b, .tier b, b { font-size: inherit }
        .md { font-size: 12px !important }
        .hd .btn { font-size: 10px !important; padding-left: 16px; padding-right: 16px }
        .fform2 input, .fform2 select, .fform2 textarea { font-size: 16px !important }  /* stops iPhone zooming into fields */
        .hero .dh { letter-spacing: .1em }
        .opts a { font-size: 10.5px !important; min-height: 44px; display: inline-flex; align-items: center; justify-content: center; line-height: 1.4 }
        .bookbar .btn { font-size: 10.5px !important }
      }
      @media (max-width: 420px) {
        .hero { min-height: 640px }
        .hero-in { padding-top: 24px; padding-bottom: 48px }
        .hero .ey { margin-bottom: 18px }
        .hero .sb { margin: 18px auto 28px }
        .hdots { bottom: 14px }
      }
      /* ===== studio / work carousel: even cards on every device ===== */
      #wkRow { gap: 14px; scroll-padding-left: 2px }
      #wkRow .wkk { flex: 0 0 calc((100% - 28px) / 3); min-width: 0 }
      #wkRow .wkk .mono { aspect-ratio: 4 / 5; overflow: hidden; height: auto }
      #wkRow .wkk .mono img { width: 100%; height: 100%; object-fit: cover; display: block }
      #wkRow .wkk .cap { padding-top: 14px; line-height: 1.6 }
      @media (max-width: 1080px) { #wkRow .wkk { flex-basis: calc((100% - 14px) / 2) } }
      @media (max-width: 640px) { #wkRow { gap: 10px } #wkRow .wkk { flex-basis: 78vw } #wkRow .wkk .cap { font-size: 9.5px !important; letter-spacing: .22em } }
      /* ===== footer: compact, aligned on every device ===== */
      .ft-soc a { display: flex !important; padding: 0 !important; margin: 0 !important; align-items: center; justify-content: center }
      .ft-bot .addr b { font-size: 9.5px !important; letter-spacing: .3em }
      .ft-bot .cop { font-size: 10px !important; letter-spacing: .14em }
      .ft-col h6 { font-size: 10px !important; letter-spacing: .26em; margin-bottom: 14px }
      .ft-col ul { gap: 11px }
      .ft-col li a, footer li a { font-size: 10.5px !important; letter-spacing: .1em }
      @media (max-width: 1024px) {
        .ft-col ul { gap: 2px }
        .ft-col li a, footer li a { font-size: 10px !important; letter-spacing: .09em; padding: 7px 0 }
        .ft-about p { font-size: 12.5px }
      }
      @media (max-width: 640px) {
        .ft-grid { gap: 28px }
        .ft-col li a, footer li a { font-size: 10px !important }
        .ft-bot .addr { font-size: 11px; line-height: 1.9 }
      }
      @media (max-width: 360px) {
        .hero .dh { font-size: 24px }
        .hero .ey { font-size: 10px !important; letter-spacing: .24em }
        .hero .sb { font-size: 13.5px }
        .wrap { padding-left: 16px; padding-right: 16px }
      }

      /* ===== enquiry form: blue panel on white (all pages) ===== */
      .fbox, .cgrid .fform { background: var(--blk); border-color: var(--blk); color: var(--wht) }
      .cgrid .fform { padding: clamp(26px, 3.4vw, 46px) }
      .fbox .fl, .cgrid .fform .fl { color: rgba(255, 255, 255, .72) }
      .fbox input, .fbox select, .fbox textarea,
      .cgrid .fform input, .cgrid .fform select, .cgrid .fform textarea {
        color: var(--wht); background-color: transparent; border-bottom-color: rgba(255, 255, 255, .3) }
      .fbox input:focus, .fbox select:focus, .fbox textarea:focus,
      .cgrid .fform input:focus, .cgrid .fform select:focus, .cgrid .fform textarea:focus { border-bottom-color: var(--wht) }
      .fbox ::placeholder, .cgrid .fform ::placeholder { color: rgba(255, 255, 255, .45) }
      .fbox select, .cgrid .fform select { background-image: linear-gradient(45deg, transparent 50%, #fff 50%), linear-gradient(135deg, #fff 50%, transparent 50%) }
      .fbox option, .cgrid .fform option { color: var(--blk); background: #fff }
      .fbox .btn-dmb, .cgrid .fform .btn-dmb { background: var(--wht); border-color: var(--wht); color: var(--blk) }
      .fbox .btn-dmb:hover, .cgrid .fform .btn-dmb:hover { background: var(--dmb2); border-color: var(--dmb2); color: var(--wht) }
      .fbox .fine, .cgrid .fform .fine { color: rgba(255, 255, 255, .55) }
      .fbox input:-webkit-autofill, .cgrid .fform input:-webkit-autofill { -webkit-text-fill-color: #fff; -webkit-box-shadow: 0 0 0 40px var(--blk) inset }

      /* where we work */
      .locs .loc-box { max-width: 980px; margin: clamp(26px, 3vw, 38px) auto 0; border-top: 1px solid var(--hair); border-bottom: 1px solid var(--hair) }
      .locs .loc-row { display: grid; grid-template-columns: 130px 1fr; align-items: center; gap: 20px; padding: 22px 0; text-align: left }
      .locs .loc-row + .loc-row { border-top: 1px solid var(--hair) }
      .locs .loc-k { font-size: 10.5px; font-weight: 500; letter-spacing: .3em; text-transform: uppercase; color: var(--grey) }
      .locs .loc-tags { display: flex; flex-wrap: wrap; gap: 8px }
      .locs .loc-tags a { font-size: 10.5px; letter-spacing: .16em; text-transform: uppercase; color: var(--blk); padding: 9px 14px; border: 1px solid var(--hair); transition: background .2s, color .2s, border-color .2s }
      .locs .loc-tags a:hover { background: var(--dmb); border-color: var(--dmb); color: #fff }
      @media (max-width: 760px) { .locs .loc-row { grid-template-columns: 1fr; gap: 12px; text-align: center } .locs .loc-tags { justify-content: center } }

      /* ---------- AI & people ---------- */
      .sec.aip { padding-top: 0 }   /* follows the white lookbook, so no double gap */
      .aip-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; margin-top: clamp(28px, 4vw, 46px); border-top: 1px solid var(--hair); text-align: left }
      .aip-col { padding: 26px 24px 8px; border-bottom: 1px solid var(--hair) }
      .aip-col + .aip-col { border-left: 1px solid var(--hair) }
      .aip-col h3 { font-size: 13px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; margin: 0 0 14px }
      .aip-col ul { margin: 0; padding-left: 18px } .aip-col li { margin-bottom: 9px; line-height: 1.6 }
      @media (max-width: 860px) { .aip-grid { grid-template-columns: 1fr } .aip-col + .aip-col { border-left: 0 } .aip-col { padding: 22px 4px 8px } }

      /* client strip: names only, smaller, faster */
      .clsleek { padding: 20px 0 }
      .clsleek-track { animation-duration: 58s }
      .clsleek span { font-size: clamp(11px, 1.05vw, 13px); font-weight: 400; letter-spacing: .2em; margin-right: clamp(34px, 4vw, 60px) }
      .clsleek span::after { content: none }
      @media (max-width: 640px) { .clsleek { padding: 15px 0 } .clsleek span { font-size: 10.5px; letter-spacing: .16em; margin-right: 30px } .clsleek-track { animation-duration: 44s } }
      a[hidden] { display: none !important }

      /* ---------- article cards ---------- */
      .jcards { display: grid; gap: clamp(18px, 2.2vw, 28px) }
      .jcards a.jc, .jcards a.jc:first-of-type, .jcards a.jc:hover { display: flex; flex-direction: column; padding: 0; border: 0; gap: 0; grid-template-columns: none; text-decoration: none; color: inherit }
      .jcards .jc-img { display: block; overflow: hidden; aspect-ratio: 3 / 2; background: #DCE5F2 }
      .jcards .jc-img img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .7s var(--ease) }
      .jcards a.jc:hover .jc-img img { transform: scale(1.045) }
      .jcards .jc-body { display: flex; flex-direction: column; flex: 1; padding: 20px 2px 0 }
      .jcards .jc-cat { display: inline-flex; align-items: center; gap: 8px; font-size: 10.5px; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; color: var(--dmb); margin-bottom: 12px }
      .jcards .jc-cat::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: currentColor }
      .jcards .jc-cat.jc-real-estate { color: #A9781F }
      .jcards .jc-cat.jc-healthcare { color: #1F7A7A }
      .jcards .jc-cat.jc-lifestyle { color: #9A4468 }
      .jcards .jc-cat.jc-strategy { color: #4A5568 }
      .jcards .jc h3 { font-size: clamp(18px, 1.6vw, 21px); font-weight: 500; letter-spacing: 0; text-transform: none; line-height: 1.35; color: var(--blk); margin: 0 0 10px }
      .jcards .jc-ex { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font-size: 15px; line-height: 1.6; color: var(--grey); margin-bottom: 18px }
      .jcards .jc-meta { margin-top: auto; display: flex; justify-content: space-between; align-items: center; gap: 12px; padding-top: 14px; border-top: 1px solid var(--hair); font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--grey-2) }
      .jcards .jc-go { color: var(--dmb); font-weight: 600; white-space: nowrap; transition: transform .3s var(--ease) }
      .jcards a.jc:hover .jc-go { transform: translateX(4px) }
      .jc-read { grid-template-columns: repeat(3, 1fr) }
      .jc-list { grid-template-columns: repeat(3, 1fr); row-gap: clamp(34px, 4vw, 52px) }
      .jc-home { grid-template-columns: 1.35fr 1fr; grid-template-rows: auto auto }
      .jc-home .jc-lead { grid-row: 1 / span 2 }
      .jc-home .jc-lead .jc-img { aspect-ratio: 16 / 11 }
      .jc-home .jc-lead h3 { font-size: clamp(22px, 2.2vw, 30px); font-weight: 400 }
      .jc-home a.jc:not(.jc-lead) { flex-direction: row; gap: 20px; align-items: stretch }
      .jc-home a.jc:not(.jc-lead) .jc-img { flex: 0 0 42%; aspect-ratio: auto; min-height: 190px }
      .jc-home a.jc:not(.jc-lead) .jc-body { padding-top: 4px }
      .jc-all { text-align: center; margin-top: clamp(28px, 3.4vw, 44px) }
      .jc-all a, .jrn .jc-all a, .jrn .jc-all a:first-of-type, .jrn .jc-all a:hover { grid-template-columns: none; border-top: 0; border-left: 0; border-right: 0; padding: 0 0 6px; display: inline-block; font-size: 11px; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; color: var(--dmb); border-bottom: 1px solid currentColor; padding-bottom: 6px }
      /* on the dark journal band of the homepage */
      .jc-home .jc h3 { color: var(--wht) }
      .jc-home .jc-ex { color: rgba(255, 255, 255, .72) }
      .jc-home .jc-meta { color: rgba(255, 255, 255, .6); border-top-color: rgba(255, 255, 255, .22) }
      .jc-home .jc-go, .jrn .jc-all a, .jrn .jc-all a:first-of-type, .jrn .jc-all a:hover { color: var(--wht) }
      .jc-home .jc-cat { color: #9DBCF5 }
      .jc-home .jc-cat.jc-real-estate { color: #E3C27D }
      .jc-home .jc-cat.jc-healthcare { color: #7FD3CF }
      .jc-home .jc-cat.jc-lifestyle { color: #F0A9C6 }
      .jc-home .jc-cat.jc-strategy { color: #C9D3E3 }
      /* the All page: one block per section */
      .jall { padding-top: clamp(30px, 4vw, 54px) }
      .jgroup + .jgroup { margin-top: clamp(56px, 7vw, 96px) }
      .jg-head { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; padding-bottom: 16px; margin-bottom: clamp(24px, 3vw, 34px); border-bottom: 1px solid var(--hair) }
      .jg-title { margin: 0; font-size: clamp(22px, 2.4vw, 30px); font-weight: 300; letter-spacing: .08em; text-transform: uppercase; line-height: 1.2 }
      .jg-title a { color: var(--blk); text-decoration: none }
      .jg-title a:hover { color: var(--dmb) }
      .jg-title span { margin-left: 10px; font-size: 13px; font-weight: 500; letter-spacing: 0; color: var(--dmb); vertical-align: super }
      .jrn .jg-head a, .jrn .jg-head a:first-of-type, .jrn .jg-head a:hover { display: inline; grid-template-columns: none; gap: 0; padding: 0; border: 0 }
      .jrn .jg-head a.jg-all, .jrn .jg-head a.jg-all:hover { display: inline-block; border-bottom: 1px solid currentColor; padding-bottom: 4px }
      .jg-all { flex: none; font-size: 11px; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; color: var(--dmb); text-decoration: none; border-bottom: 1px solid currentColor; padding-bottom: 4px }
      /* journal section tabs */
      .jtabs { padding: clamp(26px, 3.4vw, 40px) 0 0 }
      .jtabs-in { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px }
      .jtabs a { display: inline-flex; align-items: center; gap: 8px; padding: 11px 18px; border: 1px solid var(--hair); border-radius: 999px; font-size: 12px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--blk); text-decoration: none; transition: background .25s, color .25s, border-color .25s }
      .jtabs a span { font-size: 11px; font-weight: 500; letter-spacing: 0; color: var(--grey-2) }
      .jtabs a:hover { border-color: var(--dmb); color: var(--dmb) }
      .jtabs a.on { background: var(--dmb); border-color: var(--dmb); color: #fff }
      .jtabs a.on span { color: rgba(255, 255, 255, .75) }
      @media (max-width: 640px) {
        .jtabs-in { flex-wrap: nowrap; justify-content: flex-start; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; margin: 0 -16px; padding: 0 16px 4px }
        .jtabs-in::-webkit-scrollbar { display: none }
        .jtabs a { flex: none; padding: 10px 15px }
      }
      .jc-home .jc-img { background: rgba(255, 255, 255, .08) }
      @media (max-width: 900px) {
        .jc-read { grid-template-columns: 1fr 1fr }
        .jc-list { grid-template-columns: 1fr 1fr }
        .jc-read a.jc:nth-child(3) { display: none }
        .jc-home { grid-template-columns: 1fr }
        .jc-home .jc-lead { grid-row: auto }
      }
      @media (max-width: 640px) {
        .jc-read { grid-template-columns: 1fr }
        .jc-list { grid-template-columns: 1fr }
        .jc-read a.jc:nth-child(3) { display: flex }
        .jc-home a.jc:not(.jc-lead) { flex-direction: column; gap: 0 }
        .jc-home a.jc:not(.jc-lead) .jc-img { flex: none; aspect-ratio: 3 / 2; min-height: 0 }
        .jc-home a.jc:not(.jc-lead) .jc-body { padding-top: 18px }
      }

      /* speed: first view appears at once; moving parts start after the visitor interacts */
      .hero .hslide.on .mono img { animation: none }
      .hero-in > * { animation: none }
      html:not(.mv) .strip-track, html:not(.mv) .clsleek-track { animation-play-state: paused }

      /* ===== hero draft: inset dark panel with glass cards and a white dock ===== */
      .hx2 { padding: 14px clamp(10px, 1.4vw, 18px) 0; background: var(--wht) }
      .hx2-panel { position: relative; overflow: hidden; border-radius: 30px; background: #020C2B; color: #fff; min-height: min(86vh, 780px); display: flex; flex-direction: column }
      .hx2-bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .38 }
      .hx2-panel::before { content: ""; position: absolute; inset: 0; background: radial-gradient(ellipse at 78% 40%, rgba(60, 121, 232, .28), transparent 55%), linear-gradient(90deg, rgba(2, 12, 43, .92) 0%, rgba(2, 12, 43, .55) 55%, rgba(2, 12, 43, .7) 100%); z-index: 1 }
      .hx2-grid { position: relative; z-index: 2; flex: 1; display: grid; grid-template-columns: 1fr 1.05fr; gap: clamp(24px, 4vw, 64px); align-items: center; padding: clamp(56px, 7vw, 100px) clamp(24px, 5vw, 80px) clamp(130px, 13vw, 170px) }
      .hx2-pill { display: inline-block; padding: 7px 14px; border-radius: 999px; background: rgba(255, 255, 255, .1); border: 1px solid rgba(255, 255, 255, .16); font-size: 10.5px; font-weight: 500; letter-spacing: .24em; text-transform: uppercase; color: rgba(255, 255, 255, .85) }
      .hx2 h1 { margin: 26px 0 0; font-size: clamp(40px, 5.2vw, 76px); font-weight: 300; letter-spacing: -.02em; line-height: 1.04; color: #fff; text-transform: none }
      .hx2-copy p { margin: 24px 0 0; max-width: 46ch; font-size: clamp(14.5px, 1.1vw, 16.5px); line-height: 1.8; color: rgba(255, 255, 255, .74) }
      .hx2-act { display: flex; align-items: center; gap: 26px; flex-wrap: wrap; margin-top: 36px }
      .hx2-btn { display: inline-flex; align-items: center; height: 54px; padding: 0 30px; border-radius: 999px; background: rgba(255, 255, 255, .1); border: 1px solid rgba(255, 255, 255, .24); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); color: #fff; font-size: 11.5px; font-weight: 500; letter-spacing: .22em; text-transform: uppercase; text-decoration: none; transition: background .3s, color .3s }
      .hx2-btn:hover { background: #fff; color: var(--blk) }
      .hx2-link { font-size: 11.5px; font-weight: 500; letter-spacing: .22em; text-transform: uppercase; color: #fff; text-decoration: underline; text-underline-offset: 7px }
      .hx2-cards { position: relative; min-width: 0 }
      .hx2-nav { position: absolute; top: -58px; right: 0; display: flex; gap: 8px }
      .hx2-nav button { width: 38px; height: 38px; border-radius: 50%; border: 1px solid rgba(255, 255, 255, .3); background: rgba(255, 255, 255, .06); color: #fff; font-size: 14px; cursor: pointer }
      .hx2-nav button:hover { background: #fff; color: var(--blk) }
      .hx2-track { display: flex; gap: 16px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; padding: 4px 2px 10px; margin-right: calc(-1 * clamp(24px, 5vw, 80px)); padding-right: clamp(24px, 5vw, 80px) }
      .hx2-track::-webkit-scrollbar { display: none }
      .hx2-card { flex: 0 0 min(340px, 78%); scroll-snap-align: start; display: flex; flex-direction: column; gap: 12px; padding: 18px; border-radius: 22px; background: rgba(255, 255, 255, .07); border: 1px solid rgba(255, 255, 255, .14); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); color: #fff; text-decoration: none; transition: background .3s, border-color .3s }
      .hx2-card:hover { background: rgba(255, 255, 255, .12); border-color: rgba(255, 255, 255, .3) }
      .hx2-top { display: flex; align-items: center; gap: 12px; font-size: 10px; font-weight: 500; letter-spacing: .24em; text-transform: uppercase; color: rgba(255, 255, 255, .7) }
      .hx2-top img { width: 46px; height: 46px; border-radius: 12px; object-fit: cover }
      .hx2-card strong { font-size: 19px; font-weight: 400; letter-spacing: -.01em; line-height: 1.3 }
      .hx2-txt { font-size: 14px; line-height: 1.7; color: rgba(255, 255, 255, .72) }
      .hx2-tag { margin-top: 6px; padding-top: 14px; border-top: 1px solid rgba(255, 255, 255, .14); font-size: 10px; font-weight: 500; letter-spacing: .22em; text-transform: uppercase; color: #9DBCF5 }
      .hx2-foot { position: absolute; left: clamp(24px, 5vw, 80px); bottom: 34px; z-index: 3 }
      .hx2-reply { display: flex; align-items: center; gap: 14px; color: #fff; text-decoration: none }
      .hx2-reply b { display: block; font-size: 14px; font-weight: 500 }
      .hx2-reply small { display: block; font-size: 12.5px; color: rgba(255, 255, 255, .65) }
      .hx2-dot { width: 10px; height: 10px; border-radius: 50%; background: #3DDC84; box-shadow: 0 0 0 5px rgba(61, 220, 132, .18) }
      .hx2-dock { position: absolute; right: 0; bottom: 0; z-index: 4; width: min(58%, 720px); display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; padding: 14px 0 0 14px; background: var(--wht); border-top-left-radius: 30px }
      .hx2-dock::before, .hx2-dock::after { content: ""; position: absolute; width: 30px; height: 30px; background: radial-gradient(circle at 0 0, transparent 29.5px, var(--wht) 30px) }
      .hx2-dock::before { right: 0; top: -30px }
      .hx2-dock::after { left: -30px; bottom: 0 }
      .hx2-dock a { display: flex; flex-direction: column; justify-content: center; gap: 4px; height: 74px; padding: 0 20px; border: 1px solid var(--hair); border-radius: 18px; text-decoration: none; color: var(--blk); transition: border-color .25s, background .25s }
      .hx2-dock a:hover { border-color: var(--dmb); background: #F4F7FD }
      .hx2-dock b { font-size: 12px; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; color: var(--blk) }
      .hx2-dock small { font-size: 12.5px; color: var(--grey-2) }
      @media (max-width: 980px) {
        .hx2-grid { grid-template-columns: 1fr; padding-bottom: 210px }
        .hx2-nav { position: static; justify-content: flex-end; margin-bottom: 14px }
        .hx2-dock { width: calc(100% - 40px) }
        .hx2-foot { bottom: 120px }
      }
      @media (max-width: 640px) {
        .hx2-panel { border-radius: 22px }
        .hx2-grid { padding: 44px 20px 200px }
        .hx2-dock { grid-template-columns: repeat(3, 1fr); gap: 8px; padding: 10px 0 0 10px; border-top-left-radius: 22px; width: calc(100% - 24px) }
        .hx2-dock::before, .hx2-dock::after { width: 22px; height: 22px; background: radial-gradient(circle at 0 0, transparent 21.5px, var(--wht) 22px) }
        .hx2-dock::before { top: -22px } .hx2-dock::after { left: -22px }
        .hx2-dock a { height: 64px; padding: 0 10px; border-radius: 14px; gap: 2px }
        .hx2-dock b { font-size: 9.5px; letter-spacing: .1em }
        .hx2-dock small { font-size: 10.5px; line-height: 1.3 }
        .hx2-foot { left: 20px; bottom: 96px }
        .hx2-card { flex-basis: 82% }
      }
      .draft-flag { position: fixed; z-index: 99; right: 16px; top: 120px; background: var(--blk); color: #fff; font-size: 10.5px; letter-spacing: .2em; text-transform: uppercase; padding: 10px 16px }

      /* ===== section 2 draft ===== */
      .s2 { padding: clamp(64px, 7vw, 104px) 0 clamp(40px, 5vw, 70px); background: var(--wht) }
      .s2-head { display: grid; grid-template-columns: 1.15fr 1fr; gap: clamp(28px, 5vw, 80px); align-items: end }
      .s2-pill { display: inline-flex; align-items: center; gap: 8px; padding: 7px 14px; border-radius: 999px; background: #E6EEFC; color: var(--dmb); font-size: 12.5px; font-weight: 500 }
      .s2-pill i { width: 7px; height: 7px; border-radius: 50%; background: var(--dmb) }
      .s2 h2 { margin-top: 20px; font-size: clamp(32px, 3.9vw, 56px); font-weight: 400; letter-spacing: -.025em; line-height: 1.1; color: var(--blk); text-transform: none }
      .s2-side p { font-size: 15.5px; line-height: 1.75; color: var(--grey); max-width: 48ch }
      .s2-cta { display: flex; align-items: center; gap: 22px; flex-wrap: wrap; margin-top: 24px }
      .s2-btn { display: inline-flex; align-items: center; height: 50px; padding: 0 26px; border-radius: 999px; background: var(--dmb); color: #fff; font-size: 14.5px; font-weight: 500; text-decoration: none; transition: background .25s }
      .s2-btn:hover { background: var(--blk) }
      .s2-trust { display: inline-flex; align-items: center; gap: 10px; font-size: 13.5px; font-weight: 500; color: var(--blk) }
      .s2-av { display: inline-flex }
      .s2-av b { width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center; font-size: 11px; color: #fff; background: var(--blk); border: 2px solid #fff; margin-left: -8px }
      .s2-av b:first-child { margin-left: 0; background: var(--dmb) }
      .s2-av b:last-child { background: #3C79E8 }
      .s2-row { display: grid; grid-template-columns: 1.75fr 0.85fr 1fr 0.8fr; gap: 12px; margin-top: clamp(36px, 4vw, 56px); height: clamp(320px, 30vw, 420px) }
      .s2-tile { position: relative; display: block; border-radius: 20px; overflow: hidden; background: #E9EEF6 }
      .s2-tile img { width: 100%; height: 100%; object-fit: cover; transition: transform 1s var(--ease) }
      .s2-tile:hover img { transform: scale(1.04) }
      .s2-tile::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 55%, rgba(1, 20, 70, .55)) }
      .s2-cap { position: absolute; left: 18px; bottom: 18px; z-index: 2; color: #fff; font-size: 13.5px; line-height: 1.4 }
      .s2-stack { display: grid; grid-template-rows: 1fr auto; gap: 12px; min-height: 0 }
      .s2-card { position: relative; overflow: hidden; display: flex; flex-direction: column; justify-content: space-between; padding: 18px; border-radius: 20px; background: linear-gradient(150deg, #0A5BD6 0%, var(--dmb) 55%, #00337A 100%); color: #fff; text-decoration: none }
      .s2-card::before { content: ""; position: absolute; right: -40px; top: 30px; width: 190px; height: 190px; border: 28px solid rgba(255, 255, 255, .07); border-radius: 50% }
      .s2-card-top { display: flex; justify-content: space-between; align-items: center; font-size: 15px; font-weight: 600; letter-spacing: -.02em }
      .s2-card-top b { font-weight: 600; color: #9DC0FF }
      .s2-chip { width: 30px; height: 22px; border-radius: 5px; background: linear-gradient(135deg, #F1D8A0, #C9A45C) }
      .s2-card-mid { font-size: 19px; font-weight: 400; margin-top: 18px }
      .s2-steps { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px }
      .s2-steps span { font-size: 11.5px; padding: 4px 9px; border-radius: 999px; background: rgba(255, 255, 255, .12) }
      .s2-card-bot { display: flex; justify-content: space-between; margin-top: 16px; font-size: 12px; color: rgba(255, 255, 255, .78) }
      .s2-mini { display: flex; align-items: center; gap: 10px; padding: 12px 14px; border-radius: 18px; background: #F1F4F9; text-decoration: none; color: var(--blk) }
      .s2-ic { width: 34px; height: 34px; flex: none; border-radius: 50%; display: grid; place-items: center; background: #fff; color: var(--dmb); font-size: 15px }
      .s2-mini b { display: block; font-size: 13.5px; font-weight: 600 }
      .s2-mini small { display: block; font-size: 11.5px; color: var(--grey-2) }
      .s2-go { margin-left: auto; width: 28px; height: 28px; flex: none; border-radius: 50%; display: grid; place-items: center; border: 1px solid var(--hair); font-size: 13px }
      .s2-foot { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 20px; margin-top: clamp(28px, 3vw, 40px); font-size: 13px; color: var(--grey-2) }
      .s2-foot b { display: block; font-weight: 500; color: var(--blk); margin-bottom: 6px }
      .s2-foot div:first-child span { margin-right: 16px }
      .s2-scroll { display: flex; flex-direction: column; align-items: center; gap: 8px; color: var(--blk); text-decoration: none; font-size: 12.5px }
      .s2-mouse { width: 16px; height: 24px; border: 1.5px solid var(--blk); border-radius: 9px; position: relative }
      .s2-mouse::after { content: ""; position: absolute; left: 50%; top: 5px; width: 2px; height: 5px; margin-left: -1px; border-radius: 2px; background: var(--blk) }
      .s2-since { text-align: right; color: var(--blk) }
      @media (max-width: 980px) {
        .s2-head { grid-template-columns: 1fr; align-items: start }
        .s2-row { grid-template-columns: 1fr 1fr; height: auto }
        .s2-big { grid-column: 1 / -1; aspect-ratio: 16 / 9 }
        .s2-tile:not(.s2-big) { aspect-ratio: 3 / 4 }
        .s2-stack { grid-column: 1 / -1; grid-template-columns: 1fr 1fr; grid-template-rows: auto }
        .s2-card { min-height: 220px }
      }
      @media (max-width: 640px) {
        .s2-stack { grid-template-columns: 1fr }
        .s2-foot { grid-template-columns: 1fr; text-align: left }
        .s2-scroll { display: none }
        .s2-since { text-align: left }
      }

      /* ===== draft design language, whole page ===== */
      body * { text-transform: none !important }
      .hx2-dock b, .hx2-pill, .hx2-btn, .hx2-link, .hx2-top, .hx2-tag { letter-spacing: 0 !important }
      .hx2-pill { font-size: 12.5px !important } .hx2-btn, .hx2-link { font-size: 14.5px !important } .hx2-top, .hx2-tag { font-size: 12px !important } .hx2-dock b { font-size: 14px !important; font-weight: 600 }
      .hd .nav-btn, .hd .dd a, .hd .hd-phone, .m-nav a, .m-h { letter-spacing: 0 !important; font-size: 14.5px !important }
      .hd .dd a .s { font-size: 12.5px !important; letter-spacing: 0 !important }
      .hd .btn, .ann, .ann a { letter-spacing: 0 !important; font-size: 13.5px !important }
      .hd .btn { border-radius: 999px; padding: 0 22px }
      .btn { border-radius: 999px !important; letter-spacing: 0 !important; font-size: 14.5px !important; padding: 0 28px !important; min-height: 50px }
      .ey { display: inline-flex !important; align-items: center; gap: 8px; padding: 7px 14px; border-radius: 999px; background: #E6EEFC; color: var(--dmb) !important; letter-spacing: 0 !important; font-size: 12.5px !important; font-weight: 500 !important; margin-bottom: 18px }
      .ey::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: currentColor; display: inline-block }
      .mth .ey, .jrn .ey, .close .ey, .brk .ey { background: rgba(255, 255, 255, .1); color: #CFE0FF !important }
      .hx, .h-lg { letter-spacing: -.025em !important; font-weight: 400 !important; font-size: clamp(30px, 3.6vw, 52px) !important; line-height: 1.1 !important }
      .close h2 { letter-spacing: -.025em !important; font-weight: 300 !important; font-size: clamp(34px, 4.4vw, 64px) !important; line-height: 1.08 !important }
      .brk blockquote, .brk p, .brk q { letter-spacing: -.01em !important }
      .lnk, .coll .no, .epanel .eno, .tn, .md, .lb0, .loc-k, .loc-tags a, .fl, .fine, .dt, .cat, .k, .atl h4, .atl .t, .atl .n, .ft h6, .ft a, .cop, .addr b, .wkk p, .lbk p, .lbk span, .wkk span, .etab, .jc-meta, .jc-go, .jc-all a, .opts a { letter-spacing: 0 !important }
      .lnk, .jc-all a { font-size: 14px !important; font-weight: 500 !important }
      .coll .no, .epanel .eno, .tn, .md, .fl, .dt, .cat, .loc-k, .k, .jc-meta { font-size: 12.5px !important }
      .coll h3, .epanel h3, .eng h3, .aip-col h3, .mth h3 { letter-spacing: -.015em !important; font-size: clamp(18px, 1.6vw, 22px) !important; font-weight: 500 !important; line-height: 1.3 !important }
      .atl .t { font-size: 17px !important; font-weight: 400 !important }
      .atl h4, .lb0, .etab { font-size: 14px !important; font-weight: 500 !important }
      .ft h6 { font-size: 14px !important; font-weight: 600 !important }
      .ft a, .ft li { font-size: 14.5px !important }
      .mono { border-radius: 20px; overflow: hidden }
      .sec { padding: clamp(64px, 7.5vw, 112px) 0 }
      /* selection row: soft pills */
      .opts a { border: 0 !important; background: #F1F4F9; border-radius: 999px !important; font-size: 14.5px !important; padding: 13px 22px !important; color: var(--blk) !important }
      .opts a:hover { background: var(--dmb); color: #fff !important }
      /* industries: soft cards */
      .coll { background: #F4F7FB; border-radius: 24px; padding: 10px 10px 22px; text-align: left }
      .coll .mono { border-radius: 16px }
      .coll .cap { text-align: left; align-items: flex-start !important; padding: 18px 10px 0 !important }
      .coll .cap p { margin-left: 0 !important }
      /* dark sections as inset rounded panels */
      .mth, .jrn, .close, .brk { margin: 0 clamp(10px, 1.4vw, 18px); border-radius: 30px; overflow: hidden }
      .brk { margin-top: 0 }
      .mth .cell, .mth [class*="col"] { border-color: rgba(255, 255, 255, .14) !important }
      /* ecosystem selector */
      .etab { border-radius: 999px; padding: 10px 18px !important }
      .etab.on { background: #E6EEFC }
      .etab::after { display: none !important }
      .epanel .mono { border-radius: 24px }
      /* services list */
      .atl a { border-radius: 14px; padding-left: 14px !important; padding-right: 14px !important; transition: background .2s }
      .atl a:hover { background: #F4F7FB }
      /* process and lookbook */
      .wkk .mono, .lbk .mono { border-radius: 20px }
      .lb-ctl button, .brk-ctl button { border-radius: 50% !important; width: 44px; height: 44px }
      /* tiers */
      .eng-grid { gap: 14px !important; border: 0 !important }
      .eng { border-radius: 26px; background: #F4F7FB; border: 0 !important }
      .eng.dark { background: var(--blk) }
      /* AI and people */
      .aip-col { background: #F4F7FB; border-radius: 22px; padding: 26px !important; border: 0 !important }
      /* markets */
      .loc-box { border: 0 !important }
      .loc-row { border-color: var(--hair) !important }
      .loc-tags a { border-radius: 999px; font-size: 13.5px !important; background: #F4F7FB; border-color: transparent !important }
      /* audit form */
      .fbox { border-radius: 30px; padding: clamp(26px, 4vw, 52px) !important }
      .fbox input, .fbox select, .fbox textarea { background-color: rgba(255, 255, 255, .08) !important; border: 1px solid rgba(255, 255, 255, .18) !important; border-radius: 14px !important; padding: 13px 15px !important }
      .fbox .fl { font-size: 13px !important; margin-bottom: 6px }
      /* FAQ */
      .faq details { background: #F4F7FB; border-radius: 18px; padding: 4px 22px; margin-bottom: 10px; border: 0 !important }
      .faq summary { font-size: 16.5px !important; letter-spacing: -.01em !important }
      @media (max-width: 640px) {
        .hd .btn { min-height: 40px !important; padding: 0 16px !important; font-size: 13px !important }
        .hx2-dock b { font-size: 11px !important }
        .hx2-dock small { font-size: 10.5px !important }
      }
      /* footer */
      .ft-soc a { border-radius: 50% }

      /* ===== one screen per section, gaps instead of shared lines ===== */
      :root { --hh: 118px; --scr: calc(100svh - var(--hh)) }
      @media (min-width: 981px) {
        .sec, .s2, .brk { min-height: var(--scr); display: flex; flex-direction: column; justify-content: center; padding: clamp(28px, 4.2vh, 56px) 0 !important; box-sizing: border-box }
        .sec > .wrap, .s2 > .wrap { width: 100% }
        .hx2-panel { min-height: calc(var(--scr) - 14px) !important }
        .hx2-grid { padding-top: clamp(30px, 6vh, 100px) !important; padding-bottom: clamp(110px, 17vh, 170px) !important }
        .hx2 h1 { font-size: clamp(36px, min(5.2vw, 8.6vh), 76px) !important; margin-top: clamp(14px, 2.6vh, 26px) !important }
        .hx2-copy p { margin-top: clamp(14px, 2.4vh, 24px) !important }
        .hx2-act { margin-top: clamp(18px, 3.6vh, 36px) !important }
        .jc-home .jc-lead h3 { font-size: clamp(20px, min(2.2vw, 3.4vh), 30px) !important }
        .sec .center[style*="margin-bottom"], .sec > .wrap > .center { margin-bottom: clamp(18px, 3vh, 34px) !important }
        .ey { margin-bottom: 12px }
        .hx, .h-lg { font-size: clamp(28px, min(3.2vw, 5vh), 48px) !important }
        /* section 2 */
        .s2 h2 { font-size: clamp(28px, min(3.4vw, 5.4vh), 50px) !important; margin-top: 14px }
        .s2-row { height: clamp(200px, calc(100svh - 520px), 420px) !important; margin-top: clamp(20px, 3vh, 40px) !important }
        .s2-foot { margin-top: clamp(14px, 2.4vh, 30px) !important }
        /* industries */
        .coll .mono, .coll:nth-child(3) .mono { aspect-ratio: auto !important; height: clamp(130px, calc(100svh - 620px), 360px) }
        .coll .cap p { -webkit-line-clamp: 3; display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden; margin-bottom: 10px !important }
        /* ecosystem */
        .epanel .mono { aspect-ratio: auto !important; height: clamp(200px, calc(100svh - 530px), 480px) }
        .epanel .mono img { height: 100%; object-fit: cover }
        /* process and lookbook */
        .sec .wkk .mono, .sec .lbk .mono { aspect-ratio: auto !important; height: clamp(150px, calc(100svh - 470px), 470px) !important }
        .sec .wkk .mono img, .sec .lbk .mono img { height: 100% !important; width: 100%; object-fit: cover; aspect-ratio: auto !important }
        /* journal band */
        .jc-home .jc-lead .jc-img { aspect-ratio: auto !important; height: clamp(130px, calc(100svh - 640px), 340px) }
        .jc-home a.jc:not(.jc-lead) .jc-img { min-height: 0 !important; height: clamp(80px, calc(50svh - 300px), 200px) }
        .jc-home .jc-ex { -webkit-line-clamp: 2 }
        /* tiers */
        .eng { padding: clamp(22px, 3.4vh, 40px) clamp(20px, 2.4vw, 34px) !important }
        .eng ul { gap: 8px; margin-bottom: 20px }
        /* audit form */
        .fbox { padding: clamp(22px, 3.4vh, 40px) clamp(24px, 3vw, 44px) !important }
        .fbox textarea { min-height: 70px; height: 70px }
        .fgrid { gap: 0 22px }
        .fbox input, .fbox select { padding: 10px 14px !important }
        .fbox .fl { margin-bottom: 4px; margin-top: 8px }
        .faq summary { padding-top: clamp(10px, 1.6vh, 16px) !important; padding-bottom: clamp(10px, 1.6vh, 16px) !important }
        .wkk .cap, .lbk .cap { padding-top: 10px !important }
        .lb-ctl, .brk-ctl { margin-top: 12px !important }
        /* services */
        .atl a { padding-top: clamp(8px, 1.3vh, 14px) !important; padding-bottom: clamp(8px, 1.3vh, 14px) !important }
      }
      @media (min-width: 981px) and (max-height: 830px) {
        .jc-home a.jc:not(.jc-lead) .jc-ex { display: none !important }
        .jc-home .jc-ex { -webkit-line-clamp: 1 }
        .jc-all { margin-top: 14px !important }
        .fbox textarea { min-height: 52px; height: 52px }
        .fbox .fl { margin-top: 4px }
        .fbox .btn { min-height: 44px }
        .epanel .est, .epanel .enm { display: none !important }
        .fbox .fine { margin-top: 6px !important }
        .fbox .btn { margin-top: 10px !important }
      }
      /* gaps: every box stands on its own, no shared dividing lines */
      .mth-grid { gap: 14px !important; border: 0 !important }
      .mst { border: 0 !important; background: rgba(255, 255, 255, .06); border-radius: 22px; padding: clamp(22px, 3.4vh, 38px) 22px !important }
      .atl h4 { border-bottom: 0 !important; padding-bottom: 6px !important }
      .atl { display: flex; flex-direction: column; gap: 8px }
      .atl a { border-bottom: 0 !important; background: #F4F7FB }
      .atl a:hover { background: #E6EEFC }
      .aip-grid { gap: 14px !important; border-top: 0 !important }
      .aip-col + .aip-col { border-left: 0 !important }
      .loc-box { display: grid; gap: 10px }
      .loc-row { border: 0 !important; background: #F4F7FB; border-radius: 20px; padding: 14px 18px !important }
      .loc-tags a { background: #fff !important }
      .selrow { border-bottom: 0 !important }
      .etabs { border-bottom: 0 !important; gap: 8px !important }
      .eng .md { border-bottom: 0 !important; padding-bottom: 12px !important }
      .eng ul { border-top: 0 !important }
      .faq details + details { border-top: 0 !important }

      /* ===== polish pass (22 Oct): logo colours, compact sections, fixes ===== */
      :root { --logo1: #0038D0; --logo2: #0A7CF8 }
      .ey::before { background: var(--logo2) !important }
      .s2-btn, .hd .btn { background: var(--logo1) !important; border-color: var(--logo1) !important }
      .s2-btn:hover, .hd .btn:hover { background: var(--blk) !important; border-color: var(--blk) !important }
      .s2-card { background: linear-gradient(150deg, var(--logo2) 0%, var(--logo1) 58%, #00268F 100%) !important }
      .hx2-dock a:hover { border-color: var(--logo2) !important }
      .etab.on { background: #E6EEFC; color: var(--logo1) !important }
      .lnk:hover, .jc-all a:hover { color: var(--logo2) !important; border-color: var(--logo2) !important }
      /* links: underline sits under the text only */
      .lnk, a.lnk { display: inline-block !important; width: auto !important; padding: 0 0 3px !important; border-bottom: 1.5px solid currentColor !important; line-height: 1.4 !important; font-size: 14px !important }
      .coll .lnk { margin-top: 6px !important; align-self: flex-start }
      /* carousel arrows: separate round buttons */
      .lb-ctl, .brk-ctl { gap: 10px !important }
      .lb-ctl button, .brk-ctl button, .lb-ctl button + button, .brk-ctl button + button { margin: 0 !important; width: 46px !important; height: 46px !important; border-radius: 50% !important; border: 1px solid var(--blk) !important }
      .brk-ctl button, .brk-ctl button + button { border-color: rgba(255, 255, 255, .55) !important }
      .lb-ctl button:hover, .brk-ctl button:hover { background: var(--logo1) !important; border-color: var(--logo1) !important; color: #fff !important }
      /* markets: hover no longer hides the text */
      .loc-tags a:hover { background: var(--logo1) !important; color: #fff !important }
      /* "I am here to": one soft card, label left, choices right */
      .selrow { padding: clamp(18px, 3vh, 34px) 0 !important; border: 0 !important; background: transparent !important }
      .selrow-in { background: #F4F7FB; border-radius: 28px; padding: 18px 18px 18px 30px !important; display: flex !important; flex-direction: row !important; align-items: center; justify-content: space-between; gap: 20px; flex-wrap: wrap }
      .selrow .lb0 { padding: 0 !important; font-size: 20px !important; font-weight: 400 !important; letter-spacing: -.01em !important; color: var(--blk) !important }
      .selrow .opts { display: flex !important; flex-wrap: wrap; gap: 10px !important; width: auto !important }
      .selrow .opts a { display: inline-flex !important; align-items: center; gap: 12px; background: #fff !important; padding: 10px 10px 10px 20px !important; font-size: 14.5px !important; border-radius: 999px !important; border: 0 !important; color: var(--blk) !important; transition: background .25s, color .25s }
      .selrow .opts a::after { content: "↗"; width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center; background: #E6EEFC; color: var(--logo1); font-size: 13px; transition: background .25s, color .25s }
      .selrow .opts a:hover { background: var(--logo1) !important; color: #fff !important }
      .selrow .opts a:hover::after { background: #fff; color: var(--logo1) }
      @media (max-width: 760px) {
        .selrow-in { flex-direction: column !important; align-items: flex-start; padding: 20px !important }
        .selrow .opts { display: grid !important; grid-template-columns: 1fr; width: 100% !important }
        .selrow .opts a { justify-content: space-between; text-align: left !important }
      }
      /* compact: method, testimonial and services no longer take a full screen */
      .mth, .brk, .svc { min-height: 0 !important }
      .mth { padding: clamp(40px, 6vh, 64px) 0 !important }
      .mth .hx { font-size: clamp(26px, 2.8vw, 40px) !important }
      .mth-grid { margin-top: clamp(20px, 3vh, 30px) !important }
      .mst { padding: 22px 22px 24px !important; text-align: left !important }
      .mst .n { font-size: 15px !important; font-weight: 600 !important; letter-spacing: 0 !important; color: #8EC5FF !important; margin-bottom: 10px !important; display: inline-flex !important; align-items: center; justify-content: center; width: 38px; height: 38px; border-radius: 50%; background: rgba(10, 124, 248, .14) }
      .mst h3 { font-size: 19px !important; margin-bottom: 8px !important }
      .mst p { font-size: 14px !important; line-height: 1.65 !important }
      .mth .fine { margin-top: 18px !important; font-size: 13px !important; letter-spacing: 0 !important }
      .brk { height: clamp(320px, 44vh, 440px) !important; padding: 0 !important }
      .brk blockquote { font-size: clamp(22px, 2.3vw, 32px) !important; line-height: 1.4 !important; max-width: 30ch; margin: 0 auto 16px !important; letter-spacing: -.01em !important }
      .brk .who { font-size: 13.5px !important; letter-spacing: 0 !important }
      .brk-ctl { margin-top: 18px !important }
      .svc { padding: clamp(48px, 7vh, 80px) 0 !important }
      .svc .atl-grid { gap: clamp(20px, 3vw, 40px) !important; margin-top: 18px !important }
      .svc .atl { gap: 6px !important }
      .svc .atl h4 { font-size: 13px !important; color: var(--logo1) !important; font-weight: 600 !important; margin-bottom: 2px }
      .svc .atl a { padding: 11px 16px !important }
      .svc .atl .t { font-size: 15.5px !important }
      .svc .atl .n { font-size: 12px !important }
      /* journal band: images fill their frames, calm labels */
      .jc-home .jc-img { width: 100% }
      .jc-home .jc-img img { width: 100% !important; height: 100% !important; object-fit: cover }
      .jc-home a.jc:not(.jc-lead) .jc-img { flex: 0 0 38% !important }
      .jcards .jc-cat { letter-spacing: 0 !important; font-size: 12.5px !important; font-weight: 500 !important }
      .jc-home .jc h3 { letter-spacing: -.01em !important }
      /* draft label */
      .draft-flag { letter-spacing: 0 !important; font-size: 12px !important; border-radius: 999px; padding: 8px 14px !important; top: auto !important; bottom: 18px !important; right: auto !important; left: 18px !important; opacity: .92 }

      /* ===== 2026-10 redesign: What We Do / How To Work With Us / AI & People / Journal ===== */
      :root { --sky: #8FB4F5; --mist: #F3F6FA; --paper: #F8FAFC; --slate: #4A6488 }

      /* --- What We Do: bento --- */
      .wd { background: var(--mist) }

      /* --- How To Work With Us: notched tier cards --- */
      .hw { background: var(--blk); color: var(--wht) }
      .hw .ey { color: rgba(255, 255, 255, .7) }
      .hw .hx { color: var(--wht) }
      .hw-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(14px, 1.6vw, 22px) }
      .hw-card { background: var(--wht); color: var(--blk); border-radius: 30px; padding: 10px; display: flex; flex-direction: column; min-width: 0; transition: transform .5s var(--ease) }
      .hw-card:hover { transform: translateY(-6px) }
      .hw-band { position: relative; height: clamp(120px, 17vh, 160px); border-radius: 22px 22px 0 0; overflow: hidden; background: var(--dmb) }
      .hw-c2 .hw-band { background: var(--blk) } .hw-c3 .hw-band { background: var(--dmb2) }
      .hw-rib { position: absolute; border-radius: 999px; filter: blur(1.5px); opacity: .9 }
      .hw-rib.r1 { width: 120%; height: 70px; left: -10%; top: 12%; background: linear-gradient(90deg, transparent, var(--sky) 40%, #fff 55%, var(--dmb2) 75%, transparent) }
      .hw-rib.r2 { width: 110%; height: 46px; left: 5%; top: 52%; background: linear-gradient(90deg, transparent, var(--blk) 30%, var(--dmb2) 60%, transparent) }
      .hw-rib.r3 { width: 90%; height: 90px; left: -20%; top: 60%; background: linear-gradient(90deg, transparent, var(--sky) 50%, transparent); opacity: .55; filter: blur(6px) }
      .hw-rib.r4 { width: 70%; height: 30px; left: 40%; top: -4%; background: linear-gradient(90deg, transparent, #fff 50%, transparent); opacity: .5; filter: blur(4px) }
      .hw-c1 .hw-rib { transform: rotate(-14deg) } .hw-c2 .hw-rib { transform: rotate(10deg) } .hw-c3 .hw-rib { transform: rotate(-28deg) }
      .hw-c3 .hw-rib.r2 { background: linear-gradient(90deg, transparent, #fff 40%, var(--blk) 70%, transparent) }
      .hw-pill { position: absolute; top: 16px; left: 16px; z-index: 2; font-size: 11.5px; font-weight: 600; color: #fff; padding: 6px 12px; border-radius: 9px; background: rgba(255, 255, 255, .18); border: 1px solid rgba(255, 255, 255, .3); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px) }
      .hw-tab { position: absolute; right: 0; bottom: 0; z-index: 2; background: var(--wht); border-top-left-radius: 20px; padding: 10px 22px 2px 26px; display: flex; align-items: baseline; gap: 12px }
      .hw-tab::before { content: ""; position: absolute; left: -20px; bottom: 0; width: 20px; height: 20px; background: radial-gradient(circle at 0 0, transparent 20px, var(--wht) 20.5px) }
      .hw-tab small { font-size: 13px; color: var(--grey-2) }
      .hw-tab b { font-size: clamp(28px, 2.6vw, 36px); font-weight: 700; color: #7C8DAA; line-height: 1 }
      .hw-body { padding: clamp(20px, 2.2vw, 28px) clamp(16px, 1.8vw, 22px) clamp(14px, 1.6vw, 18px); display: flex; flex-direction: column; flex: 1; gap: 14px }
      .hw-body h3 { font-size: clamp(24px, 2.3vw, 32px); font-weight: 700; letter-spacing: -.02em; line-height: 1.08; margin: 0; text-transform: none }
      .hw-tags { display: flex; flex-wrap: wrap; gap: 6px }
      .hw-tags span { font-size: 11px; font-weight: 500; padding: 4px 10px; border-radius: 999px; background: var(--mist); border: 1px solid var(--hair); color: var(--grey) }
      .hw-foot { margin-top: auto; display: flex; justify-content: space-between; align-items: center; gap: 12px; padding-top: 6px }
      .hw-foot span { font-size: 12.5px; color: var(--grey-2) }
      .hw-foot a { display: inline-flex; padding: 11px 22px; border-radius: 999px; border: 1px solid var(--blk); font-size: 10px; font-weight: 500; letter-spacing: .22em; text-transform: uppercase; color: var(--blk); transition: .3s var(--ease); white-space: nowrap }
      .hw-foot a:hover, .hw-c2 .hw-foot a { background: var(--blk); color: #fff }
      .hw-c2 .hw-foot a:hover { background: var(--dmb); border-color: var(--dmb) }

      /* --- AI & People: checkerboard --- */
      .ai-tray { background: var(--wht); border: 1px solid var(--hair); border-radius: 26px; padding: 14px; box-shadow: 0 40px 80px -50px rgba(1, 33, 105, .45) }
      .ai-grid { display: grid; grid-template-columns: repeat(4, 1fr); grid-template-rows: 1fr 1fr; gap: 14px; height: clamp(400px, calc(var(--scr) - 250px), 560px); text-align: left }
      .ai-t { border-radius: 18px; overflow: hidden; position: relative; min-width: 0; min-height: 0; margin: 0 }
      .ai-tx { padding: clamp(18px, 2vw, 26px); display: flex; flex-direction: column; justify-content: space-between; border: 1px solid var(--hair); background: var(--paper) }
      .ai-tx h3 { font-weight: 300; font-size: clamp(17px, 1.6vw, 22px); letter-spacing: .12em; text-transform: uppercase; line-height: 1.3; margin: 0 }
      .ai-tx p { font-size: 13px; line-height: 1.6; color: var(--grey); max-width: 24ch; margin: 0 }
      .ai-tx.navy { background: var(--blk); border: 0; color: #fff } .ai-tx.navy h3 { color: #fff }
      .ai-tx.slate { background: var(--slate); border: 0; color: #fff } .ai-tx.slate h3 { color: #fff }
      .ai-tx.navy p, .ai-tx.slate p { color: rgba(255, 255, 255, .82) }
      .ai-ph { background: var(--blk) }
      .ai-ph img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform 1.6s var(--ease) }
      .ai-ph:hover img { transform: scale(1.05) }
      .ai-ph::before { content: ""; position: absolute; inset: 0; background: var(--blk); mix-blend-mode: color; opacity: .75; z-index: 1; pointer-events: none }
      .ai-ph::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(1, 33, 105, 0) 45%, rgba(1, 33, 105, .65)); z-index: 1; pointer-events: none }
      .ai-chip { position: absolute; left: 12px; right: 12px; bottom: 12px; z-index: 2; display: flex; align-items: center; gap: 10px; padding: 9px 12px; border-radius: 14px; color: #fff; font-size: 11.5px; font-weight: 500; line-height: 1.35; background: rgba(255, 255, 255, .14); border: 1px solid rgba(255, 255, 255, .28); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px) }
      .ai-chip svg { flex: none; width: 26px; height: 26px; padding: 6px; border-radius: 50%; background: rgba(255, 255, 255, .18); border: 1px solid rgba(255, 255, 255, .3) }
      .ai-sig canvas { position: absolute; inset: 0; width: 100%; height: 100%; display: block }
      .ai-lbl { position: absolute; left: 16px; bottom: 14px; font-size: 9.5px; font-weight: 500; letter-spacing: .24em; text-transform: uppercase; color: #fff; z-index: 1 }
      .ai-seal-t { background: linear-gradient(150deg, var(--sky), var(--dmb2) 45%, var(--blk)) }
      .ai-seal { position: absolute; left: 50%; top: 46%; transform: translate(-50%, -50%) rotate(-8deg); width: 52%; aspect-ratio: 1; max-width: 100%; border-radius: 50%; background: #fff; display: grid; place-items: center; box-shadow: 0 30px 60px -20px rgba(0, 10, 40, .6) }
      .ai-seal::before { content: ""; position: absolute; inset: 8px; border-radius: 50%; border: 1px dashed var(--hair) }
      .ai-seal svg { width: 38%; height: auto }


      @media (prefers-reduced-motion: no-preference) {
        .hw-rib.r1 { animation: xdrift 9s var(--ease) infinite alternate }
        .hw-rib.r2 { animation: xdrift 11s var(--ease) infinite alternate-reverse }
      }
      @keyframes xbob { 50% { translate: 0 -4px } }
      @keyframes xdash { to { stroke-dashoffset: -40 } }
      @keyframes xmq { to { transform: translateX(-50%) } }
      @keyframes xdrift { to { translate: 6% 8px } }

      @media (max-width: 1080px) {
        .ai-grid { grid-template-columns: 1fr 1fr; grid-template-rows: none; grid-auto-rows: 250px; height: auto }
      }
      @media (max-width: 900px) {
        .hw-cards { grid-template-columns: 1fr; max-width: 460px; margin-inline: auto }
      }
      @media (max-width: 640px) {
        .ai-grid { grid-template-columns: 1fr; grid-auto-rows: 230px }
      }

      /* --- What we do: two calm cards --- */
      .sv-grid { display: grid; grid-template-columns: 1fr 1.65fr; gap: 16px; align-items: stretch }
      .sv-card { border-radius: 24px; background: #F4F7FB; padding: clamp(22px, 3.2vh, 34px) clamp(20px, 2.4vw, 32px); display: flex; flex-direction: column; gap: clamp(16px, 2.6vh, 24px); min-width: 0 }
      .sv-head { display: flex; gap: 14px; align-items: flex-start }
      .sv-ic { flex: none; width: 44px; height: 44px; border-radius: 14px; display: grid; place-items: center; background: #E6EEFC; color: var(--logo1) }
      .sv-ic svg { width: 22px; height: 22px }
      .sv-head h3 { font-size: clamp(20px, 1.7vw, 24px); font-weight: 500; letter-spacing: -.015em; line-height: 1.2; margin: 0; text-transform: none; color: var(--blk) }
      .sv-head p { font-size: 14px; line-height: 1.5; color: var(--grey); margin: 4px 0 0 }
      .sv-list { display: grid; gap: 8px }
      .sv-two { grid-template-columns: 1fr 1fr }
      .sv-list a { display: flex; align-items: center; gap: 14px; padding: clamp(12px, 1.8vh, 16px) 16px; border-radius: 14px; background: var(--wht); color: var(--blk); text-decoration: none; transition: background .25s var(--ease), color .25s var(--ease), transform .25s var(--ease) }
      .sv-list .n { font-size: 12px; font-weight: 500; color: var(--grey-2); font-variant-numeric: tabular-nums; min-width: 18px }
      .sv-list .t { flex: 1; font-size: 15.5px; font-weight: 500; letter-spacing: -.005em; line-height: 1.3 }
      .sv-list i { font-style: normal; color: var(--logo1); opacity: 0; transform: translateX(-4px); transition: .25s var(--ease) }
      .sv-list a:hover { background: #E6EEFC }
      .sv-list a:hover i, .sv-list a:focus-visible i { opacity: 1; transform: none }
      .sv-list a:focus-visible { outline: 2px solid var(--logo2); outline-offset: 2px }
      .sv-dark { background: linear-gradient(155deg, var(--logo1) 0%, #00268F 55%, var(--blk) 100%); color: #fff }
      .sv-dark .sv-ic { background: rgba(255, 255, 255, .14); color: #fff }
      .sv-dark .sv-head h3 { color: #fff }
      .sv-dark .sv-head p { color: rgba(255, 255, 255, .78) }
      .sv-dark .sv-list a { background: rgba(255, 255, 255, .08); color: #fff }
      .sv-dark .sv-list .n { color: rgba(255, 255, 255, .55) }
      .sv-dark .sv-list i { color: #fff }
      .sv-dark .sv-list a:hover { background: rgba(255, 255, 255, .16) }
      .sv-cta { margin-top: auto; align-self: flex-start; display: inline-flex; align-items: center; min-height: 46px; padding: 0 24px; border-radius: 999px; background: #fff; color: var(--blk); font-size: 14px; font-weight: 500; text-decoration: none; transition: background .25s var(--ease), color .25s var(--ease) }
      .sv-cta:hover { background: #E6EEFC; color: var(--logo1) }
      .sv-cta:focus-visible { outline: 2px solid #fff; outline-offset: 3px }
      .sv-foot { margin-top: auto; display: flex; flex-wrap: wrap; gap: 8px; align-items: center }
      .sv-foot::before { content: "For"; font-size: 13px; color: var(--grey-2); margin-right: 2px }
      .sv-foot span { font-size: 13px; padding: 6px 12px; border-radius: 999px; background: #fff; color: var(--grey) }
      @media (max-width: 980px) { .sv-grid { grid-template-columns: 1fr } }
      @media (max-width: 600px) { .sv-two { grid-template-columns: 1fr } .sv-list .t { font-size: 15px } .sv-list i { opacity: 1; transform: none } }

      /* --- Industries: name only, arrow instead of underlined link --- */
      .coll { text-decoration: none }
      .coll .cap { display: flex !important; flex-direction: row !important; align-items: center !important; justify-content: space-between; gap: 12px; padding: 16px 10px 0 !important }
      .coll .cap h3 { margin: 0 !important; font-size: clamp(17px, 1.4vw, 20px) !important; line-height: 1.25 !important }
      .coll-go { flex: none; width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; background: #fff; color: var(--logo1); font-size: 17px; transition: background .25s var(--ease), color .25s var(--ease), transform .25s var(--ease) }
      .coll:hover .coll-go { background: var(--logo1); color: #fff; transform: translateX(2px) }
      .coll { padding-bottom: 16px !important }
      @media (min-width: 981px) {
        .coll .mono, .coll:nth-child(3) .mono { height: clamp(180px, calc(100svh - 440px), 480px) !important }
      }

      /* --- CTAs: no underline anywhere --- */
      .lnk, a.lnk, .jc-all a, .jrn .jc-all a, .jrn .jc-all a:first-of-type, .jrn .jc-all a:hover { border-bottom: 0 !important; padding-bottom: 0 !important; text-decoration: none !important; font-weight: 600 !important }
      .lnk:hover, .jc-all a:hover { border-bottom: 0 !important }

      /* --- tiers and AI on the shared one-screen system --- */
      .hw .ey { background: rgba(255, 255, 255, .1); color: #CFE0FF !important }
      .hw .hx { color: #fff !important }
      .hw-body h3 { font-weight: 600; letter-spacing: -.02em }
      .hw-foot a { font-size: 13px; letter-spacing: 0; text-transform: none; padding: 12px 22px }
      .hw-pill { font-weight: 500 }
      .ai-tx h3 { font-size: clamp(18px, 1.5vw, 22px); font-weight: 500; letter-spacing: -.015em; text-transform: none; line-height: 1.25 }
      .ai-lbl { letter-spacing: .08em }
      .x1-sub { font-size: 15px; color: var(--grey); margin: 12px auto 0; max-width: 60ch }
      .x1-sub a { color: var(--logo1); font-weight: 600; text-decoration: none; white-space: nowrap }
      .ai-tray { padding: 12px; border-radius: 24px; box-shadow: none; background: #F4F7FB; border: 0 }
      .ai-grid { gap: 12px }
      @media (max-width: 1080px) { .ai-grid { height: auto } }

      /* --- QA fixes: fill, fit and phone spacing --- */
      .sv-list { flex: 1; grid-auto-rows: 1fr }
      @media (min-width: 1081px) { .ai-grid { height: clamp(300px, calc(var(--scr) - 300px), 540px) } }
      .x1-sub { margin-top: 10px }
      @media (max-width: 980px) {
        .sv .center, .hw .center, .ai2 .center { margin-bottom: 26px }
        .sv-list { grid-auto-rows: auto }
      }
      @media (max-width: 640px) {
        .coll-grid { grid-template-columns: 1fr 1fr !important; gap: 10px !important }
        .coll { padding: 8px 8px 12px !important; border-radius: 20px }
        .coll .mono, .coll:nth-child(3) .mono { height: 150px !important; aspect-ratio: auto !important }
        .coll .mono img { height: 100% !important; object-fit: cover }
        .coll .cap { padding: 12px 6px 0 !important; align-items: flex-end !important }
        .coll .cap h3 { font-size: 15px !important }
        .coll-go { width: 32px; height: 32px; font-size: 14px }
        .ai-grid { grid-template-columns: 1fr 1fr; grid-auto-rows: 190px; gap: 8px }
        .ai-tray { padding: 8px; border-radius: 20px }
        .ai-tx { padding: 16px }
        .ai-tx h3 { font-size: 17px }
        .ai-tx p { font-size: 12.5px }
        .ai-chip { left: 8px; right: 8px; bottom: 8px; padding: 7px 9px; font-size: 10.5px; gap: 7px }
        .ai-chip svg { width: 22px; height: 22px; padding: 5px }
        .ai-lbl { left: 12px; bottom: 10px; font-size: 9px }
      }

      /* ===== 23 Oct pass 3: hero dock, AI colour photos, sign-off tile, journal on blue ===== */
      .hx2-link { text-decoration: none !important; font-weight: 600 }
      .hx2-link:hover { opacity: .75 }

      /* AI: true-colour photos, single-line titles, calmer sign-off tile */
      .ai-ph::before { display: none }
      .ai-ph::after { background: linear-gradient(180deg, rgba(0, 0, 0, 0) 50%, rgba(1, 20, 60, .55)) }
      .ai-tx { gap: 12px }
      .ai-tx h3 { font-size: clamp(18px, 1.45vw, 21px) }
      .ai-seal-t { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px; text-align: center; padding: 16px }
      .ai-ok { width: clamp(52px, 4.6vw, 64px); aspect-ratio: 1; border-radius: 50%; background: #fff; display: grid; place-items: center; box-shadow: 0 0 0 10px rgba(255, 255, 255, .16), 0 0 0 22px rgba(255, 255, 255, .08), 0 18px 34px -12px rgba(0, 10, 40, .55) }
      .ai-ok svg { width: 46%; height: auto }
      .ai-okt { color: #fff; margin-top: 10px }
      .ai-okt b { display: block; font-size: 15px; font-weight: 600; letter-spacing: -.005em }
      .ai-okt small { display: block; font-size: 12.5px; opacity: .8; margin-top: 2px }

      /* Journal: blue band, editorial split, topic filter (post markup is CMS-generated; restyled only) */
      .jrn { background: linear-gradient(160deg, var(--logo1) 0%, #00268F 48%, var(--blk) 100%) !important }
      .jr-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px 24px; flex-wrap: wrap; margin-bottom: clamp(18px, 3vh, 34px) }
      .jr-head .hx { color: #fff; margin: 0; text-align: left }
      .jr-head .ey { margin-bottom: 12px }
      .jr-tools { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; max-width: 100% }
      .jr-filters { display: flex; gap: 4px; padding: 4px; border-radius: 999px; background: rgba(255, 255, 255, .1); overflow-x: auto; max-width: 100%; scrollbar-width: none }
      .jr-filters::-webkit-scrollbar { display: none }
      .jr-filters[hidden] { display: none !important }
      .jr-filters button { flex: none; border: 0; background: transparent; color: rgba(255, 255, 255, .82); font: 500 13px/1 'Inter', sans-serif; padding: 10px 15px; border-radius: 999px; cursor: pointer; transition: background .25s var(--ease), color .25s var(--ease) }
      .jr-filters button:hover { color: #fff; background: rgba(255, 255, 255, .08) }
      .jr-filters button[aria-pressed="true"] { background: #fff; color: var(--blk) }
      .jr-filters button:focus-visible { outline: 2px solid #fff; outline-offset: 2px }
      .jr-all { color: #fff !important; font-size: 14px; font-weight: 600; text-decoration: none; white-space: nowrap }
      .jr-all:hover { opacity: .75 }
      .jrn .jc-all { display: none !important }
      .jrn .jcards.jc-home { display: grid; grid-template-columns: 1.2fr 1fr; grid-template-rows: 1fr 1fr; gap: 16px; height: clamp(400px, calc(var(--scr) - 230px), 600px) }
      .jrn .jc-home a.jc { transition: opacity .35s var(--ease), filter .35s var(--ease), transform .35s var(--ease), background .3s var(--ease) }
      .jrn .jc-home a.jc.dim { opacity: .3; filter: grayscale(1) }
      .jrn .jc-home a.jc.jc-lead { position: relative; grid-row: 1 / span 2; border-radius: 22px; overflow: hidden; min-height: 0; padding: 0 !important }
      .jrn .jc-home a.jc.jc-lead .jc-img { position: absolute !important; inset: 0; height: 100% !important; aspect-ratio: auto !important; border-radius: 0 }
      .jrn .jc-home a.jc.jc-lead::after { content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none; background: linear-gradient(180deg, rgba(0, 0, 0, .1), rgba(0, 0, 0, 0) 30%, rgba(1, 20, 60, .15) 50%, rgba(1, 20, 60, .9)) }
      .jrn .jc-home a.jc.jc-lead .jc-body { position: absolute; left: 0; right: 0; bottom: 0; z-index: 2; padding: clamp(20px, 2.6vw, 32px) !important }
      .jrn .jc-home a.jc.jc-lead .jc-cat { align-self: flex-start; padding: 6px 12px; border-radius: 999px; background: rgba(255, 255, 255, .16); border: 1px solid rgba(255, 255, 255, .28); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px) }
      .jrn .jc-home a.jc.jc-lead h3 { font-size: clamp(22px, min(2.2vw, 3.6vh), 32px) !important; font-weight: 600; letter-spacing: -.015em; line-height: 1.18; max-width: 22ch }
      .jrn .jc-home a.jc.jc-lead .jc-meta { border-top: 0; padding-top: 4px }
      .jrn .jc-home a.jc:not(.jc-lead) { flex-direction: row; gap: 16px; padding: 10px !important; border-radius: 20px; background: rgba(255, 255, 255, .08); border: 1px solid rgba(255, 255, 255, .14) !important; min-height: 0; overflow: hidden }
      .jrn .jc-home a.jc:not(.jc-lead):hover { background: rgba(255, 255, 255, .14); transform: translateX(4px) }
      .jrn .jc-home a.jc:not(.jc-lead) .jc-img { flex: 0 0 42%; height: auto !important; min-height: 0 !important; aspect-ratio: auto !important; border-radius: 14px; align-self: stretch }
      .jrn .jc-home a.jc:not(.jc-lead) .jc-body { padding: 8px 8px 6px 0 !important; min-width: 0 }
      .jrn .jc-home a.jc:not(.jc-lead) h3 { font-size: clamp(16px, 1.35vw, 19px) !important; font-weight: 600; line-height: 1.3 }
      .jrn .jc-home a.jc:not(.jc-lead) .jc-meta { padding-top: 10px }
      @media (max-width: 980px) {
        .jrn .jcards.jc-home { grid-template-columns: 1fr; grid-template-rows: none; height: auto }
        .jrn .jc-home a.jc.jc-lead { grid-row: auto; height: 420px }
        .jrn .jc-home a.jc:not(.jc-lead) .jc-img { flex-basis: 38%; min-height: 140px !important }
      }
      @media (max-width: 600px) {
        .jr-head { align-items: flex-start }
        .jr-tools { width: 100%; justify-content: space-between }
        .jrn .jc-home a.jc.jc-lead { height: 380px }
        .jrn .jc-home a.jc:not(.jc-lead) .jc-ex { display: none }
        .jrn .jc-home a.jc:not(.jc-lead) .jc-img { min-height: 120px !important }
      }

      /* one rhythm for every section: equal padding, content sized to fit a screen, no padding-out */
      @media (min-width: 981px) {
        .sec, .s2 { min-height: 0 !important; justify-content: flex-start !important; padding: clamp(56px, 9vh, 96px) 0 !important }
        .selrow { padding: clamp(22px, 3vh, 30px) 0 !important }
        .sec .center[style*="margin-bottom"], .sec > .wrap > .center, .jr-head { margin-bottom: clamp(24px, 3.6vh, 40px) !important }
      }
      @media (max-width: 980px) {
        .sec, .s2 { padding-top: 64px !important; padding-bottom: 64px !important }
        .sec > .wrap > .center, .jr-head { margin-bottom: 26px !important }
      }
      .ai2 .x1-sub { margin-top: 8px }

      /* journal on blue: keep titles white, kill legacy list borders, readable lead tag */
      .jrn .jc-home a.jc h3, .jrn .jc-home a.jc:hover h3 { color: #fff !important }
      .jrn .jc-home a.jc.jc-lead .jc-cat { color: #fff !important }
      .jrn .jr-all, .jrn .jr-all:first-of-type, .jrn .jr-all:hover { border: 0 !important; padding: 0 !important; display: inline-block }

      /* ===== pass 4: logo colours on services, one gap between sections ===== */
      .sv-dark { background: var(--logo1) !important }
      .sv-light { background: var(--logo2); color: #fff }
      .sv-light .sv-ic { background: rgba(255, 255, 255, .18); color: #fff }
      .sv-light .sv-head h3 { color: #fff }
      .sv-light .sv-head p { color: rgba(255, 255, 255, .88) }
      .sv-light .sv-list a { background: rgba(255, 255, 255, .14); color: #fff }
      .sv-light .sv-list .n { color: rgba(255, 255, 255, .7) }
      .sv-light .sv-list i { color: #fff }
      .sv-light .sv-list a:hover { background: rgba(255, 255, 255, .24) }
      .sv-light .sv-list a:focus-visible { outline-color: #fff }
      .sv-light .sv-foot::before { color: rgba(255, 255, 255, .85) }
      .sv-light .sv-foot span { background: rgba(255, 255, 255, .16); color: #fff }
      .sv-dark .sv-list a { background: rgba(255, 255, 255, .12) }
      .sv-dark .sv-list a:hover { background: rgba(255, 255, 255, .22) }
      .sv-dark .sv-cta { color: var(--logo1) }

      /* How to work with us matches the other coloured panels */
      .hw { margin: 0 clamp(10px, 1.4vw, 18px); border-radius: 30px; overflow: hidden }

      /* two plain sections in a row share one gap instead of stacking two paddings */
      @media (min-width: 981px) { .sec.sec-tight, .s2.sec-tight { padding-top: 0 !important } }
      @media (max-width: 980px) { .sec.sec-tight { padding-top: 8px !important } }

      /* anchor jumps land below the sticky header */
      section[id] { scroll-margin-top: 84px }

      @media (min-width: 981px) {
        .selrow { padding: 0 0 clamp(56px, 9vh, 96px) !important }
        .ft { padding-top: clamp(56px, 9vh, 96px) !important }
      }

      /* ===== pass 5: services in the Section 2 language ===== */
      .sv3 .s2-tile::after { background: linear-gradient(180deg, rgba(1, 20, 70, 0) 30%, rgba(1, 20, 70, .78)) }
      .sv3-cap { position: absolute; left: 16px; right: 16px; bottom: 16px; z-index: 2; color: #fff; display: flex; flex-direction: column; gap: 8px }
      .sv3-k { font-size: 11.5px; font-weight: 500; color: rgba(255, 255, 255, .82) }
      .sv3-cap h3 { margin: 0; font-size: clamp(16px, 1.3vw, 20px); font-weight: 500; line-height: 1.25; letter-spacing: -.01em; color: #fff; text-transform: none; text-wrap: balance }
      .s2-big .sv3-cap { left: 22px; right: 22px; bottom: 22px }
      .s2-big .sv3-cap h3 { font-size: clamp(19px, 1.7vw, 26px); max-width: 22ch }
      .sv3-chips { display: flex; flex-wrap: wrap; gap: 6px }
      .sv3-chips a, .sv3 .s2-steps a { font-size: 12px; font-weight: 500; line-height: 1.2; padding: 6px 11px; border-radius: 999px; color: #fff; text-decoration: none; background: rgba(255, 255, 255, .16); border: 1px solid rgba(255, 255, 255, .28); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); transition: background .25s var(--ease), color .25s var(--ease) }
      .sv3-chips a:hover, .sv3 .s2-steps a:hover { background: #fff; color: var(--blk) }
      .sv3-chips a:focus-visible, .sv3 .s2-steps a:focus-visible { outline: 2px solid #fff; outline-offset: 2px }
      .sv3 .s2-steps { gap: 6px }
      .sv3 .s2-card { cursor: default }
      .sv3-link { font-size: 14.5px; font-weight: 600; color: var(--logo1); text-decoration: none }
      .sv3-link:hover { color: var(--blk) }
      .sv3 .s2-foot div:first-child span { margin-right: 16px; white-space: nowrap }
      @media (max-width: 900px) {
        .sv3 .s2-tile:not(.s2-big) { aspect-ratio: 3 / 4 }
        .sv3-cap { left: 12px; right: 12px; bottom: 12px }
        .sv3-chips a { font-size: 11.5px; padding: 5px 9px }
      }
      .sv3 .s2-foot > * { min-width: 0 }
      .sv3 .s2-foot div:first-child { display: flex; flex-wrap: wrap; gap: 6px 16px }
      .sv3 .s2-foot div:first-child b { flex-basis: 100%; margin-bottom: 0 }
      .sv3 .s2-foot div:first-child span { margin-right: 0 }
      @media (max-width: 900px) {
        .sv3 .s2-big { aspect-ratio: auto !important; min-height: 360px }
        .sv3 .s2-tile:not(.s2-big) { aspect-ratio: auto !important; min-height: 300px }
        .sv3 .s2-tile::after { background: linear-gradient(180deg, rgba(1, 20, 70, 0) 20%, rgba(1, 20, 70, .85)) }
        .sv3 .s2-tile img { position: absolute; inset: 0 }
      }

      /* ===== pass 6: services, clean cards (no text over photos) ===== */
      .sv4-grid { display: grid; grid-template-columns: 1.15fr 1fr 1fr 1fr; gap: clamp(10px, 1.1vw, 16px); align-items: stretch }
      .sv4-card { display: flex; flex-direction: column; min-width: 0; border-radius: 24px; overflow: hidden; background: #F4F7FB; color: var(--blk) }
      .sv4-ph { flex: none; height: clamp(120px, 20vh, 200px); overflow: hidden; background: #E6EEFC }
      .sv4-ph img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .6s var(--ease) }
      .sv4-card:hover .sv4-ph img { transform: scale(1.04) }
      .sv4-body { flex: 1; display: flex; flex-direction: column; gap: 10px; padding: clamp(16px, 1.6vw, 22px) }
      .sv4-k { font-size: 12px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--logo2) }
      .sv4-card h3 { margin: 0; font-size: clamp(17px, 1.35vw, 21px); font-weight: 500; line-height: 1.25; letter-spacing: -.01em; text-transform: none; color: var(--blk); text-wrap: balance }
      .sv4-list { list-style: none; margin: auto 0 0; padding: 8px 0 0; display: grid; gap: 6px }
      .sv4-list a { display: flex; align-items: center; gap: 12px; padding: 11px 14px; border-radius: 12px; background: #fff; color: var(--blk); font-size: 14.5px; font-weight: 500; line-height: 1.25; text-decoration: none; transition: background .25s var(--ease), color .25s var(--ease) }
      .sv4-list i { font-style: normal; font-size: 11.5px; font-weight: 600; color: var(--grey-2); font-variant-numeric: tabular-nums; min-width: 18px }
      .sv4-list span { flex: 1; min-width: 0 }
      .sv4-list b { font-weight: 500; color: var(--logo1); opacity: 0; transform: translateX(-4px); transition: .25s var(--ease) }
      .sv4-list a:hover, .sv4-list a:focus-visible { background: #E6EEFC }
      .sv4-list a:hover b, .sv4-list a:focus-visible b { opacity: 1; transform: none }
      .sv4-list a:focus-visible { outline: 2px solid var(--logo2); outline-offset: 2px }
      .sv4-blue { background: linear-gradient(160deg, var(--logo1) 0%, #00268F 60%, var(--blk) 100%); color: #fff }
      .sv4-blue .sv4-k { color: #BFD6FF }
      .sv4-blue h3 { color: #fff; font-size: clamp(20px, 1.7vw, 26px); max-width: 16ch }
      .sv4-blue .sv4-body { padding: clamp(20px, 2vw, 28px) }
      .sv4-blue .sv4-list { gap: 8px }
      .sv4-blue .sv4-list a { background: rgba(255, 255, 255, .1); color: #fff }
      .sv4-blue .sv4-list i { color: rgba(255, 255, 255, .6) }
      .sv4-blue .sv4-list b { color: #fff }
      .sv4-blue .sv4-list a:hover, .sv4-blue .sv4-list a:focus-visible { background: rgba(255, 255, 255, .2) }
      .sv4-blue .sv4-list a:focus-visible { outline-color: #fff }
      .sv4 .s2-foot { margin-top: clamp(16px, 2.4vh, 26px) }
      .sv4 .s2-foot > * { min-width: 0 }
      .sv4 .s2-foot div:first-child { display: flex; flex-wrap: wrap; gap: 6px 16px }
      .sv4 .s2-foot div:first-child b { flex-basis: 100% }
      /* short desktop screens: keep it to one screen */
      @media (min-width: 1101px) and (max-height: 760px) { .sv4-ph { height: 100px } .sv4-list a { padding: 9px 12px } .sv4-body { gap: 8px } }
      /* tablet: 2 x 2 */
      @media (max-width: 1100px) {
        .sv4-grid { grid-template-columns: 1fr 1fr }
        .sv4-ph { height: clamp(150px, 24vw, 230px) }
        .sv4-blue h3 { max-width: none }
      }
      /* phone: single column, photo beside nothing, always-visible arrows */
      @media (max-width: 640px) {
        .sv4-grid { grid-template-columns: 1fr }
        .sv4-ph { height: 170px }
        .sv4-list b { opacity: 1; transform: none }
        .sv4-list a { padding: 13px 14px; font-size: 15px }
      }
      .sv4 .s2-head { margin-bottom: clamp(26px, 4.2vh, 44px) }
      .sv4-grid { margin-top: 0 }
      .sv4-list a { font-size: 14px }
      @media (max-width: 900px) { .sv4 .s2-head { margin-bottom: 28px } }
      /* narrow phones: footer rows of the s2 sections may not push the page sideways */
      .s2-foot > * { min-width: 0; max-width: 100% }
      @media (max-width: 480px) {
        .s2-foot { display: flex !important; flex-direction: column; align-items: flex-start; gap: 10px }
        .s2-foot > span:empty { display: none }
        .s2-foot div:first-child { display: flex; flex-wrap: wrap; gap: 6px 14px }
        .s2-foot div:first-child b { flex-basis: 100% }
        .s2-since { white-space: normal }
      }

      /* ===== tiers: three distinct banner colours: teal / gold / coral ===== */
      .hw-c1 { --bn: #CDD5B4; --b1: #EAEFD9; --b2: #A9B585 }
      .hw-c2 { --bn: #E6D3AC; --b1: #F6EBD2; --b2: #C9AB72 }
      .hw-c3 { --bn: #E2B9A0; --b1: #F4DDCF; --b2: #C58D6F }
      .hw .hw-c1 .hw-band, .hw .hw-c2 .hw-band, .hw .hw-c3 .hw-band { background: var(--bn) }
      .hw .hw-rib.r1 { background: linear-gradient(90deg, transparent, var(--b1) 40%, #fff 55%, var(--b2) 75%, transparent) }
      .hw .hw-rib.r2, .hw .hw-c3 .hw-rib.r2 { background: linear-gradient(90deg, transparent, var(--b2) 30%, var(--b1) 60%, transparent) }
      .hw .hw-rib.r3 { background: linear-gradient(90deg, transparent, var(--b1) 50%, transparent) }
      .hw .hw-pill { background: rgba(255, 255, 255, .88); color: var(--blk); border-color: rgba(255, 255, 255, .95) }
      .hw .hw-c1 .hw-tab b { color: #8E9A62 } .hw .hw-c2 .hw-tab b { color: #B8995C } .hw .hw-c3 .hw-tab b { color: #BE7F61 }

      /* services: header columns line up with the card columns below */
      @media (min-width: 1101px) {
        .sv4 .s2-head { grid-template-columns: 1.15fr 1fr 1fr 1fr; gap: clamp(10px, 1.1vw, 16px); align-items: end }
        .sv4 .s2-head > div:first-child { grid-column: 1 / 3 }
        .sv4 .s2-head .s2-side { grid-column: 3 / 5 }
      }
      @media (min-width: 901px) and (max-width: 1100px) {
        .sv4 .s2-head { grid-template-columns: 1fr 1fr; gap: clamp(10px, 1.1vw, 16px); align-items: end }
      }
      @media (min-width: 901px) {
        .sv4 .s2-head { align-items: stretch !important }
        .sv4 .s2-side { display: flex; flex-direction: column; justify-content: space-between }
        .sv4 .s2-side p { margin: 0 }
        .sv4 .s2-cta { margin-top: 18px }
        .sv4 .s2-head h2 { margin-bottom: 0 }
      }

      /* tiers: a more compact section */
      .hw-band { height: clamp(84px, 11vh, 108px) }
      .hw-body { gap: 10px; padding: clamp(14px, 1.5vw, 18px) clamp(14px, 1.6vw, 20px) clamp(10px, 1.2vw, 14px) }
      .hw-body h3 { font-size: clamp(21px, 1.9vw, 27px) }
      .hw-foot a { padding: 9px 20px }
      .hw-tab b { font-size: clamp(24px, 2.1vw, 30px) }
      .hw-tab { padding: 8px 20px 2px 24px }
      @media (min-width: 981px) { .hw .center, .hw > .wrap > .center { margin-bottom: clamp(18px, 3vh, 30px) !important } }

/* Part 2: styles for elements that only exist on inner pages */
:root { --logo1: #0038D0; --logo2: #0A7CF8; --sky: #8FB4F5; --mist: #F3F6FA; --paper: #F8FAFC; --slate: #4A6488; --hh: 118px; --pad: clamp(56px, 9vh, 96px) }
.phero { background: linear-gradient(160deg, var(--logo1) 0%, #00268F 48%, var(--blk) 100%); margin: 14px clamp(10px, 1.4vw, 18px) 0; border-radius: 30px; padding: clamp(72px, 12vh, 128px) 0 clamp(64px, 10vh, 112px); text-align: left; overflow: hidden; position: relative }
.phero .wrap { max-width: 1100px }
.phero .ey { background: rgba(255, 255, 255, .1); color: #CFE0FF !important; margin-bottom: 0 }
.phero .ey::before { background: var(--logo2) !important }
.phero .dh, .phero h1.dh { font-weight: 300 !important; font-size: clamp(36px, 5.2vw, 72px) !important; letter-spacing: -.02em !important; line-height: 1.05 !important; color: #fff; margin: 22px 0 18px !important; max-width: 20ch }
.phero .sb { font-size: clamp(15px, 1.3vw, 18px) !important; font-weight: 300 !important; letter-spacing: 0 !important; line-height: 1.7 !important; color: rgba(255, 255, 255, .8) !important; max-width: 56ch; margin: 0 !important }
.phero .chips { display: flex; flex-wrap: wrap; gap: 8px; justify-content: flex-start; margin-top: 28px }
.phero .chips span { border-radius: 999px; letter-spacing: 0 !important; font-size: 13px !important; padding: 8px 14px }
.art-hero .dh, .phero.art-hero .dh { font-size: clamp(30px, 4.2vw, 58px) !important; max-width: 24ch }
@media (max-width: 700px) {
.phero { padding: 64px 0 56px; border-radius: 24px }
.phero .dh { margin-top: 18px !important }
}
.strip span, .strip i, .clstrip span, .bmk { letter-spacing: .04em !important; font-size: 12.5px !important }
.strip .bmk { letter-spacing: .02em !important }
.gr, .maison p.gr { font-weight: 300 !important; letter-spacing: -.01em !important; line-height: 1.4 !important; font-size: clamp(26px, 3.2vw, 44px) !important; max-width: 24ch }
.fform { border-radius: 30px }
.fform { padding: clamp(26px, 4vw, 52px) }
.fform input, .fform select, .fform textarea { background-color: rgba(255, 255, 255, .08) !important; border: 1px solid rgba(255, 255, 255, .18) !important; border-radius: 14px !important; padding: 13px 15px !important }
.fform .btn-dmb { background: #fff !important; border-color: #fff !important; color: var(--blk) !important }
.fform .btn-dmb:hover { background: var(--sky) !important; border-color: var(--sky) !important }
.cgrid aside > *, .cgrid .side > * { border-radius: 24px }
.mgrid, .nots, .statrow { gap: clamp(12px, 1.4vw, 18px); border: 0 !important }
.mg, .not, .statrow .st { background: #F4F7FB; border: 0 !important; border-radius: 28px }
.mg { padding: clamp(20px, 2.4vw, 32px) }
.mg .rn { letter-spacing: 0 !important; font-weight: 300; font-size: clamp(26px, 2.6vw, 36px) }
.mg .wk { display: block; font-size: 12.5px !important; letter-spacing: 0 !important; font-weight: 500 !important; color: var(--grey-2) }
.mg h3 { letter-spacing: -.01em !important; font-size: clamp(20px, 1.8vw, 26px) !important; font-weight: 500 !important }
.mg .mono { border-radius: 20px }
.dlv span { font-size: 12.5px !important; letter-spacing: 0 !important; padding: 7px 13px !important; border-radius: 999px; background: #fff; border: 1px solid var(--hair) }
.not .x { font-size: 12.5px !important; letter-spacing: 0 !important; font-weight: 500 !important }
.not h4 { font-size: clamp(16px, 1.4vw, 19px) !important; letter-spacing: -.005em !important; font-weight: 500 !important; line-height: 1.3 }
.statrow .st { padding: clamp(22px, 2.6vw, 34px) 18px }
.art h2, .art h3 { letter-spacing: -.01em !important }
.art h2 { font-weight: 500; font-size: clamp(22px, 2vw, 28px) }
.rn, .tn, .dt, .cat, .t { letter-spacing: 0 !important }
.dksec { margin: 0 clamp(10px, 1.4vw, 18px); border-radius: 30px; overflow: hidden }
.dksec .ey, .phero .ey { background: rgba(255, 255, 255, .1); color: #CFE0FF !important }
.split .mono, .banner { border-radius: 24px }
.dksec .statrow .st { background: rgba(255, 255, 255, .08) }
.dksec .statrow .v { color: #fff !important; font-weight: 300 }
.uqg { gap: clamp(12px, 1.4vw, 18px); border: 0 !important }
.uqg > div { background: #F4F7FB; border: 0 !important; border-radius: 24px; padding: clamp(20px, 2.2vw, 30px) }
.uqg h3 { font-size: clamp(17px, 1.5vw, 20px) !important; font-weight: 500 !important; letter-spacing: -.01em !important }
.strip, .clstrip { margin: 18px clamp(10px, 1.4vw, 18px); border-radius: 999px; border: 0 !important; padding: 13px 0 }
.strip.wht, .clstrip { background: #F4F7FB !important; color: var(--blk) }
.phero + .strip, .phero + .clstrip { margin-top: 14px }
.phero { margin-bottom: 0 }
.qrow { padding: 18px 0 }
.qrow a { letter-spacing: 0 !important; font-size: 14px !important; border-radius: 999px !important; padding: 11px 22px !important }
.eno, .tn, .dt, .cat, .coll .no, .jg-all, .eng .md, .alsoin b, .rn, .not b, .dlv span { letter-spacing: .01em !important }
.eno, .tn, .dt, .cat, .eng .md { font-size: 13px !important }
#founder .epanel .eno { display: inline-block; background: #E6EEFC; color: var(--dmb) !important; padding: 6px 13px; border-radius: 999px; font-size: 12.5px !important; margin-bottom: 18px }
.btn-solid:hover { background: var(--blk) !important; border-color: var(--blk) !important; color: #fff !important }
.jg-title a:hover, .ft-legal a:hover { color: var(--logo2) !important; border-color: var(--logo2) !important; opacity: 1 !important }
.hero-arr:hover { background: var(--logo1) !important; border-color: var(--logo1) !important; color: #fff !important }
.qrow a:hover, .jtabs a:hover { background: #E6EEFC !important; border-color: var(--logo2) !important; color: var(--logo1) !important }
.mg:hover, .not:hover { background: #E6EEFC }
.mg:hover .dlv span { border-color: var(--logo2) !important; color: var(--logo1) !important }
.alsoin a:hover { background: var(--logo1) !important; color: #fff !important }
.clsleek span:hover, .clstrip span:hover { color: var(--logo1) !important }
.fform .btn-dmb:hover { background: var(--sky) !important; border-color: var(--sky) !important; color: var(--blk) !important }
.strip + section, .strip + .dksec, .strip + .sec { margin-top: 14px }
.dksec { margin-left: clamp(10px, 1.4vw, 18px); margin-right: clamp(10px, 1.4vw, 18px); border-radius: 30px; overflow: hidden }
.hero-arr { border-radius: 50% !important; width: 48px !important; height: 48px !important; border-width: 1px !important; margin: 0 5px !important; border-left-width: 1px !important }
.jc-top, .jc-date { letter-spacing: .01em !important }
:root { --pad: clamp(40px, 6vh, 74px) }
.mgrid { grid-template-columns: repeat(4, 1fr) !important; gap: 14px !important; border: 0 !important }
.mgrid .mg { border: 0 !important; background: #F4F7FB; border-radius: 24px !important; padding: clamp(16px, 1.5vw, 24px) !important; display: flex; flex-direction: column }
.mgrid .mg .mono { aspect-ratio: 16/11 !important; border-radius: 16px; margin-bottom: 14px }
.mgrid .mg .rn { font-size: clamp(22px, 2vw, 30px) !important; margin-bottom: 4px }
.mgrid .mg h3 { font-size: 16px !important; letter-spacing: -.01em !important; line-height: 1.3 }
.mgrid .mg p { font-size: 13.5px !important; line-height: 1.6; margin-bottom: 14px; max-width: none !important }
.mgrid .dlv { margin-top: auto }
@media (max-width: 1000px) {
.mgrid { grid-template-columns: 1fr 1fr !important }
}
@media (max-width: 560px) {
.mgrid { grid-template-columns: 1fr !important }
}
.jrd .jc-img { aspect-ratio: 16/10 !important }
.split .mono, .wrap.split .mono { aspect-ratio: 16/11 !important }
.fform .fgrid { gap: 14px !important }
.fform .fl { margin-bottom: 5px }
.fform textarea { min-height: 84px }
.fform { padding: clamp(22px, 3vw, 40px) !important }
.sec.jrd .center { margin-bottom: clamp(16px, 2.2vh, 26px) }
.banner img { width: 100% !important; height: 100% !important; object-fit: cover !important; display: block }
.phero .wrap { max-width: 1300px !important }
.phero { padding: clamp(56px, 8vh, 88px) 0 clamp(52px, 7vh, 80px) !important }
.phero .dh, .phero h1.dh { font-size: clamp(36px, 4.4vw, 62px) !important; margin: 18px 0 14px !important }
.gr, .maison p.gr { font-size: clamp(24px, 2.6vw, 38px) !important }
.banner { aspect-ratio: 16/5.6 !important; border-radius: 24px; overflow: hidden }
.mgrid .mg .mono { aspect-ratio: 16/10 !important; margin-bottom: 12px }
.mgrid .mg .rn { font-size: 22px !important; display: inline-block; margin: 0 8px 0 0 }
.mgrid .mg .wk { display: inline-block !important; margin: 0 0 8px !important }
.mgrid .mg h3 { margin-bottom: 6px !important }
.mgrid .mg p { margin-bottom: 12px }
.mgrid .dlv span { padding: 6px 11px !important; font-size: 12.5px !important }
.jrd .jc-img { aspect-ratio: 16/9 !important }
.dksec .statrow .v { font-size: clamp(34px, 3.2vw, 48px) !important }
.dksec .statrow .st { padding: 22px 18px !important }
.dksec.sec { padding: clamp(28px, 4vh, 44px) 0 !important }
.wrap.split { align-items: center !important; gap: clamp(28px, 4vw, 64px) !important }
.wrap.split .mono { aspect-ratio: 16/10 !important }
.wrap.split h3, .wrap.split h2 { font-size: clamp(26px, 2.4vw, 36px) !important; font-weight: 400 !important; letter-spacing: -.02em !important; line-height: 1.15 !important }
.wrap.split p { font-size: 16px !important; line-height: 1.7 !important; max-width: 46ch }
.fform textarea { min-height: 70px !important }
.mgrid .mg .rn { display: inline-block !important; vertical-align: baseline }
.mgrid .mg .wk { vertical-align: baseline }
.jrd .jc-img { border-radius: 18px; overflow: hidden }
.center .gr, .wrap.center > .gr, .maison .gr { margin-left: auto !important; margin-right: auto !important }
.dksec .gr + .bd, .dksec .center > .bd { letter-spacing: .01em !important; font-size: 14px !important; color: rgba(255, 255, 255, .72) !important; margin-top: 18px !important }
.fform { padding: 0 !important }
.mg:hover { background: #EDF2FA !important }
.mgrid .mg { display: block !important }
.mgrid .mg .wk { display: inline-block !important; margin: 0 0 8px !important }
.mgrid .dlv { margin-top: 0 }
:root { --r-panel: 28px; --r-card: 22px; --r-img: 16px; --r-field: 12px; --ink-2: #4A6488 }
.phero, .dksec, .fform { border-radius: var(--r-panel) !important }
.fform { border-radius: 0 !important }
.mg, .not, .statrow .st, .cgrid aside > *, .cgrid .side > * { border-radius: var(--r-card) !important }
.banner, .jrd .jc-img, .mgrid .mg .mono { border-radius: var(--r-img) !important }
.fform input, .fform select, .fform textarea { border-radius: var(--r-field) !important }
.banner.mono, section > .wrap > .mono.banner { border-radius: var(--r-card) !important }
.mg .wk { color: var(--ink-2) !important }
.fform .fine, .dksec .fine { color: rgba(255, 255, 255, .78) !important }
.phero .chips span { border: 0 !important; background: rgba(255, 255, 255, .12) !important; color: rgba(255, 255, 255, .9) !important; cursor: default }
.dlv span, .mg:hover .dlv span { border: 0 !important; background: #fff !important; color: var(--ink-2) !important; cursor: default }
.qt-who { letter-spacing: .01em !important; font-size: 14px !important; color: rgba(255, 255, 255, .75) !important; margin-top: 16px !important; text-transform: none !important }
.qt-ctl { display: flex; justify-content: center; gap: 10px; margin-top: 20px }
.qt-ctl button { width: 44px !important; height: 44px !important; border-radius: 50% !important; background: transparent; border: 1px solid rgba(255, 255, 255, .45) !important; color: #fff; font-size: 15px; cursor: pointer; transition: background .25s, border-color .25s }
.qt-ctl button:hover { background: #fff !important; color: var(--blk) !important; border-color: #fff !important }
.dksec .statrow { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 12px !important }
@media (max-width: 640px) {
.dksec .statrow { gap: 8px !important }
.dksec .statrow .st { padding: 16px 8px !important }
.dksec .statrow .v { font-size: 26px !important }
.dksec .statrow .k { font-size: 11.5px !important; line-height: 1.35 !important; display: block }
}
@media (max-width: 1000px) {
.mgrid { display: flex !important; overflow-x: auto; scroll-snap-type: x mandatory; gap: 12px !important; padding: 2px 2px 8px; scrollbar-width: none; -webkit-overflow-scrolling: touch }
.mgrid::-webkit-scrollbar { display: none }
.mgrid .mg { flex: 0 0 46%; scroll-snap-align: start }
}
@media (max-width: 640px) {
.mgrid .mg { flex-basis: 84% }
}
@media (max-width: 1000px) {
.banner { aspect-ratio: 16/8 !important }
}
@media (max-width: 640px) {
.banner { aspect-ratio: 4/3 !important }
}
.bookbar .t { font-size: 13px !important; letter-spacing: 0 !important }
:root { --pad: clamp(56px, 9vh, 96px) }
@media (min-width: 981px) {
.sec:not(.dksec):not(.close):not(.jrn) + .sec:not(.dksec):not(.close):not(.jrn) { padding-top: 0 !important }
}
@media (max-width: 980px) {
.sec:not(.dksec):not(.close):not(.jrn) + .sec:not(.dksec):not(.close):not(.jrn) { padding-top: 8px !important }
}
.phero, .dksec { margin-left: clamp(10px, 1.4vw, 18px) !important; margin-right: clamp(10px, 1.4vw, 18px) !important; border-radius: 30px !important }
:is(.phero, .dksec, .close, .jrn, .brk) + :is(.dksec, .close, .jrn, .brk) { margin-top: var(--pad) !important }
.dksec.sec { padding: var(--pad) 0 !important }
.mgrid .mg { border-radius: 24px !important }

/* Part 3: inner-page layout that follows the homepage rules */
/* ---- inner-page layout following the homepage's "one screen per section" rule ---- */
:root { --hh: 118px; --scr: calc(100svh - var(--hh)) }

/* page hero: one screen, copy centred vertically, key figures in the corner dock */
.phero { position: relative; overflow: hidden }
@media (min-width: 981px) {
  .phero:has(.pdock) { min-height: calc(var(--scr) - 14px); display: flex; flex-direction: column; justify-content: center; padding: clamp(40px, 7vh, 80px) 0 clamp(120px, 18vh, 170px) !important }
  .phero .dh, .phero h1.dh { font-size: clamp(40px, min(5.2vw, 8.6vh), 76px) !important; font-weight: 300 !important; line-height: 1.04 !important }
}
.pdock > div { display: flex; flex-direction: column; justify-content: center; gap: 4px; height: 74px; padding: 0 20px; border: 1px solid var(--hair); border-radius: 18px; color: var(--blk); text-align: left }
.pdock b { font-size: 15px !important; font-weight: 600; letter-spacing: 0 !important; color: var(--blk) }
.pdock small { font-size: 12.5px; color: var(--grey-2); line-height: 1.35 }
@media (max-width: 980px) {
  .phero:has(.pdock) { padding-bottom: 150px !important }
  .pdock > div { height: auto; min-height: 64px; padding: 10px 12px }
  .pdock b { font-size: 13.5px !important }
  .pdock small { font-size: 11.5px }
}

/* the stats band is gone where it moved into the hero; any left elsewhere stays compact */
.dksec { min-height: 0 !important }

/* statement + photo: one screen */
@media (min-width: 981px) {
  .maison .banner { aspect-ratio: auto !important; height: clamp(220px, calc(100svh - 470px), 520px) !important; margin-top: clamp(18px, 3vh, 34px) }
  .maison .banner img { height: 100% !important; object-fit: cover }
}
.maison > .wrap + .wrap { margin-top: 0 }

/* four-up cards fit one screen */
@media (min-width: 1001px) {
  .mgrid .mg .mono { aspect-ratio: auto !important; height: clamp(110px, calc(100svh - 640px), 230px) !important }
  .mgrid .mg .mono img { height: 100% !important; object-fit: cover }
}

/* image + text split fits one screen */
@media (min-width: 981px) {
  .wrap.split .mono { aspect-ratio: auto !important; height: clamp(260px, calc(100svh - 300px), 520px) !important }
  .wrap.split .mono img { height: 100% !important; object-fit: cover }
}

/* article pages: long reading sections are not forced to a screen */
.art-wrap { min-height: 0 !important; display: block !important }
.phero > .wrap { width: 100% }

/* journal listing page keeps a white page (the blue panel is only the homepage-style teaser) */
.jrn:not(:has(.jc-home)) { background: none !important; color: var(--blk) !important; margin: 0 !important; border-radius: 0 !important; min-height: 0 !important; display: block !important }
.jrn:not(:has(.jc-home)) .ey { background: #E6EEFC !important; color: var(--dmb) !important }
.jrn:not(:has(.jc-home)) .hx, .jrn:not(:has(.jc-home)) h2, .jrn:not(:has(.jc-home)) h3, .jrn:not(:has(.jc-home)) .jg-title a { color: var(--blk) !important }
.jrn:not(:has(.jc-home)) a.jc { background: transparent !important; color: var(--blk) !important }
.jrn:not(:has(.jc-home)) .jc-ex, .jrn:not(:has(.jc-home)) .jc-meta, .jrn:not(:has(.jc-home)) .jc-meta span { color: var(--grey) !important }
.jrn:not(:has(.jc-home)) .jc-cat { color: var(--dmb) !important }
.jrn:not(:has(.jc-home)) .jg-all, .jrn:not(:has(.jc-home)) .jc-go { color: var(--logo1) !important; border-color: var(--logo1) !important }

/* contact page: form panel and side notes in the homepage style */
.cgrid .fform { border-radius: 30px !important; padding: clamp(24px, 3.4vh, 40px) clamp(24px, 3vw, 44px) !important }
.cgrid .fform .fl { margin: 8px 0 4px !important; letter-spacing: 0 !important; font-size: 13px !important }
.cgrid .fform input, .cgrid .fform select, .cgrid .fform textarea { border-radius: 14px !important; background-color: rgba(255, 255, 255, .08) !important; border: 1px solid rgba(255, 255, 255, .18) !important; padding: 10px 14px !important }
.cgrid .fform .btn { margin-top: 22px !important }
.cgrid aside > *, .cgrid .side > * { border-radius: 22px !important }
.cgrid aside *, .cgrid .side * { letter-spacing: 0 !important }
.qrow a { letter-spacing: 0 !important; border-radius: 999px !important; font-size: 13.5px !important }

/* ===== equal gaps: exactly one --gap between every pair of sections ===== */
:root { --gap: clamp(56px, 9vh, 96px) }
@media (max-width: 980px) { :root { --gap: 56px } }
/* plain sections: no forced screen height, space only below the content */
body .sec { min-height: 0 !important; display: block !important; padding-top: 0 !important; padding-bottom: var(--gap) !important }
body .brk { min-height: 0 !important; display: flex !important; align-items: center; justify-content: center }
/* coloured panels: space inside is their own, the gap sits outside */
body .phero, body .brk, body .jrn:has(.jc-home), body .close, body .dksec { margin-top: 0 !important; margin-bottom: var(--gap) !important }
body .sec.jrn:has(.jc-home), body .sec.close, body .sec.dksec { padding-top: var(--gap) !important; padding-bottom: var(--gap) !important }
body .brk { padding: 0 !important }
body .phero { margin-top: 14px !important }
/* the closing panel sits on the footer, as on the homepage */
body .close:has(+ .ft), body .close:has(+ footer) { margin-bottom: 0 !important }
body #audit-form.sec, body .sec#audit-form { padding-top: 0 !important }
.faq details:last-of-type { margin-bottom: 0 !important }
/* nothing inside a section adds to the gap: first and last elements sit flush */
.sec > .wrap > :first-child, .sec > .wrap > :first-child > :first-child { margin-top: 0 !important }
.sec > .wrap > :last-child, .sec > .wrap > :last-child > :last-child, .sec > .wrap > :last-child > :last-child > :last-child { margin-bottom: 0 !important }
/* contact quick links row sits in the rhythm like a section */
body .qrow { padding: 0 !important; margin: 0 0 var(--gap) !important; border: 0 !important }

/* journal filter row keeps the standard gap */
.jtabs { margin: 0 0 var(--gap) !important; padding: 0 !important; border: 0 !important }
/* inline-coloured dark bands behave like the other panels */
.dksec { background: var(--blk); color: #fff }
.dksec .hx, .dksec h2, .dksec h3 { color: #fff }
/* about: founder card */
#founder .epanel.on { max-width: 920px !important; margin: 0 auto !important; background: #F4F7FB; border-radius: 30px; padding: clamp(26px, 4vw, 52px) !important; display: block !important }
#founder .epanel p { max-width: none !important; font-size: 15.5px; line-height: 1.85 }
#founder .epanel .eno { display: inline-block; background: #E6EEFC; color: var(--dmb) !important; padding: 6px 13px; border-radius: 999px; font-size: 12.5px !important; letter-spacing: 0 !important; margin-bottom: 18px }
#founder .epanel .est { background: #fff; border: 0; border-radius: 22px; padding: 18px 22px; margin: 24px 0 16px; align-items: center }
#founder .epanel .est .k { letter-spacing: 0 !important; font-size: 13.5px !important }
#founder .epanel .enm { letter-spacing: 0 !important; font-size: 13px !important; margin-bottom: 16px }
.qrow .wrap, .qrow .qrow-in { padding-top: 0 !important; padding-bottom: 0 !important; margin-top: 0 !important; margin-bottom: 0 !important }

/* Australia page: three industry cards in one row */
@media (min-width: 1001px) { .mgrid.mgrid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)) !important } }
/* "Working in Australia?" line on industry pages */
.au-note { margin-top: 14px !important; font-size: 14.5px !important; color: var(--grey) }
.au-note a { color: var(--logo1); font-weight: 600; text-decoration: none; border-bottom: 1.5px solid currentColor }
.au-note a:hover { color: var(--logo2) }

/* card links sit on one line across a row: the card is a column, the link is pushed to the bottom */
.mgrid .mg { display: flex !important; flex-direction: column !important }
.mgrid .mg > .wk { align-self: flex-start }
.mgrid .mg > p { margin-bottom: 18px !important }
.mgrid .mg > .lnk, .mgrid .mg > a:last-child { margin-top: auto !important; align-self: flex-start }
.mgrid .mg > :last-child:has(.lnk, .btn) { margin-top: auto !important }