/* New homepage: who we are, industry AI, products, risks, FAQ, plus polish for inherited sections.
   Follows the modern VOCSO pages: SF Pro Display headings with the red sparkle, black sections with
   charcoal cards, soft grey panels, red primary + forest-green secondary. 1rem = 10px on this site.
   This file only loads on the new homepage. */
@font-face{font-family:"SF Pro Display";src:url(../fonts/SFProDisplay-Bold-latin.woff2) format("woff2");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:"SF Pro Display";src:url(../fonts/SFProDisplay-Medium-latin.woff2) format("woff2");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"SF Pro Display";src:url(../fonts/SFProDisplay-Regular-latin.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}

:root{
  --ha-red:#fd3a30;--ha-red-deep:#e42c22;
  --ha-green:#0a4a36;--ha-green-deep:#083b2b;
  --ha-ink:#090909;--ha-muted:#5f6368;--ha-soft:#f4f5f6;--ha-line:#ececec;--ha-card:#fff;
  --ha-black:#000;--ha-line-dark:rgba(255,255,255,.14);
  --ha-display:"SF Pro Display",-apple-system,BlinkMacSystemFont,"Montserrat",sans-serif;
  --ha-ease:cubic-bezier(.2,.7,.2,1);
  --ha-r:1.6rem;--ha-r-sm:1rem;
}
.darkmode{--ha-ink:#f5f5f7;--ha-muted:#a1a1a6;--ha-soft:#161719;--ha-line:#2a2c30;--ha-card:#1b1d20}

/* ---------- shared ---------- */
.home-h2{font-family:var(--ha-display);font-weight:700;font-size:5.6rem;line-height:1.08;letter-spacing:-.025em;color:var(--ha-ink);margin:0;text-wrap:balance}
.home-sparkle{display:block;width:4rem;height:4rem;margin:0 0 2rem}
.home-head{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:6rem;align-items:end;margin:0 0 6.4rem}
.home-head p{font-size:1.8rem;line-height:1.65;color:var(--ha-muted);margin:0;max-width:48ch;text-wrap:pretty}
.home-head--dark .home-h2{color:#fff}
.home-head--dark p{color:rgba(255,255,255,.66)}
.home-pill{display:inline-flex;align-items:center;gap:.8rem;font-size:1.4rem;font-weight:600;color:var(--ha-ink);background:#fff;
  border:1px solid var(--ha-line);border-radius:10rem;padding:.8rem 1.6rem .8rem 1.2rem;margin:0 0 2.8rem}
.home-btn{display:inline-flex;align-items:center;gap:1rem;background:var(--ha-red);color:#fff;font-size:1.6rem;font-weight:600;line-height:1;
  padding:1.6rem 2.6rem;border-radius:10rem;text-decoration:none;margin-top:3.2rem;transition:background .2s,transform .2s var(--ha-ease),box-shadow .2s}
.home-btn:after{content:"";width:.8rem;height:.8rem;border-top:2px solid currentColor;border-right:2px solid currentColor;transform:rotate(45deg);transition:transform .2s var(--ha-ease)}
.home-btn:hover{background:var(--ha-red-deep);color:#fff;text-decoration:none;box-shadow:0 1.2rem 2.8rem -1rem rgba(253,58,48,.6)}
.home-btn:hover:after{transform:translateX(.3rem) rotate(45deg)}
.home-btn:active{transform:translateY(1px)}
.home-btn--light{background:#fff;color:var(--ha-black);margin-top:2.8rem}
.home-btn--light:hover{background:#fff;color:var(--ha-red);box-shadow:none}
.home-btn:focus-visible,.home-products__card:focus-visible,.home-industries__toggle:focus-visible,.home-faq__item summary:focus-visible{outline:3px solid var(--ha-red);outline-offset:4px}
.home-industries__toggle:focus:not(:focus-visible),.home-faq__item summary:focus:not(:focus-visible){outline:0;box-shadow:none}

@keyframes haPulseR{0%{box-shadow:0 0 0 0 rgba(253,58,48,.55)}70%,100%{box-shadow:0 0 0 .6rem rgba(253,58,48,0)}}

/* ---------- services explorer (forest green) ---------- */
.home-sparkle,.home-pill__icon{color:var(--ha-red);flex:none}
.home-caps{padding:9rem 0;background:var(--ha-green);color:#fff}
.home-caps .home-head p{color:rgba(255,255,255,.72)}
.home-textlink{display:inline-flex;align-items:center;gap:1.4rem;margin-top:2rem;font-size:1.6rem;font-weight:600;color:#fff;text-decoration:none}
.home-textlink__arrow{display:inline-flex;align-items:center;justify-content:center;flex:none;width:3.6rem;height:3.6rem;border-radius:50%;background:rgba(255,255,255,.1);transition:background-color .2s,transform .3s var(--ha-ease)}
.home-textlink__arrow svg{width:1.6rem;height:1.6rem}
.home-textlink:hover{color:#fff;text-decoration:none}
.home-textlink:hover .home-textlink__arrow{background-color:var(--ha-red);transform:rotate(45deg)}

.home-caps__explorer{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:6.4rem;align-items:start}
.home-caps__intro{margin:0 0 4.8rem}
.home-caps__intro .home-h2{color:#fff;margin:0 0 2.4rem}
.home-caps__intro p{font-size:1.8rem;line-height:1.65;color:rgba(255,255,255,.72);margin:0;max-width:52ch}
.home-caps__list{list-style:none;margin:0;padding:0;border-top:1px solid var(--ha-line-dark)}
.home-caps__row{border-bottom:1px solid var(--ha-line-dark)}
.home-caps__link{display:grid;grid-template-columns:5.6rem minmax(0,1fr) 4.4rem;align-items:center;gap:1.6rem;padding:2.2rem 0;color:rgba(255,255,255,.55);text-decoration:none;transition:color .25s}
.home-caps__link:hover,.home-caps__row.is-active .home-caps__link{color:#fff;text-decoration:none}
.home-caps__num{font-size:1.4rem;font-weight:600;font-variant-numeric:tabular-nums;color:rgba(255,255,255,.45);transition:color .25s}
.home-caps__row.is-active .home-caps__num{color:var(--ha-red)}
.home-caps__title{font-family:var(--ha-display);font-weight:700;font-size:3rem;line-height:1.15;letter-spacing:-.02em;transition:transform .35s var(--ha-ease)}
.home-caps__row.is-active .home-caps__title{transform:translateX(.8rem)}
.home-caps__arrow{width:4.4rem;height:4.4rem;border-radius:50%;display:grid;place-items:center;border:1px solid var(--ha-line-dark);opacity:0;transform:translateX(-.8rem);transition:opacity .25s,transform .35s var(--ha-ease),background .25s,border-color .25s}
.home-caps__row.is-active .home-caps__arrow{opacity:1;transform:none;background:var(--ha-red);border-color:var(--ha-red);color:#fff}
.home-caps__inline{display:none}
.home-caps__link:focus-visible{outline:3px solid #fff;outline-offset:4px;border-radius:.4rem}

.home-caps__stage{position:sticky;top:11rem;min-height:72rem;display:grid}
.home-caps__panel{grid-area:1/1;display:flex;flex-direction:column;background:var(--ha-black);color:#fff;border-radius:var(--ha-r);padding:3.2rem 3.2rem 3.6rem;
  opacity:0;visibility:hidden;transform:translateY(1.2rem);transition:opacity .4s var(--ha-ease),transform .4s var(--ha-ease),visibility .4s}
.home-caps__panel.is-active{opacity:1;visibility:visible;transform:none}
.home-caps__panel-top{display:flex;align-items:center;justify-content:space-between}
.home-caps__icon{width:5.2rem;height:5.2rem;border-radius:var(--ha-r-sm);background:#fff;color:var(--ha-red);display:grid;place-items:center}
.home-caps__icon svg{width:2.8rem!important;height:2.8rem!important}
.home-caps__count{font-size:1.3rem;font-weight:600;color:rgba(255,255,255,.5);font-variant-numeric:tabular-nums}
.home-caps__visual{flex:1;position:relative;display:grid;place-items:center;min-height:44rem;margin:2.4rem 0 3.6rem;border-radius:var(--ha-r-sm);overflow:hidden;
  background-color:#0a0a0b;box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}
.home-caps__ghost{opacity:.9;filter:brightness(0) invert(1)}
.home-caps__ghost svg{width:9.6rem!important;height:9.6rem!important}
.home-caps__panel h3{font-family:var(--ha-display);font-weight:700;font-size:3.2rem;line-height:1.15;letter-spacing:-.02em;margin:0 0 1rem;color:#fff}
.home-caps__panel p{font-size:1.7rem;line-height:1.6;color:rgba(255,255,255,.7);margin:0;max-width:48ch}
.home-caps__panel .home-btn{align-self:flex-start;margin-top:2.4rem}

.home-caps__more{margin-top:8rem;padding-top:4.8rem;border-top:1px solid var(--ha-line-dark)}
.home-caps__more-label{font-family:var(--ha-display);font-weight:700;font-size:2.4rem;letter-spacing:-.015em;color:#fff;margin:0 0 2.4rem}
.home-caps__more ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));column-gap:3.2rem}
.home-caps__more li{border-top:1px solid var(--ha-line-dark)}
.home-caps__more a{display:flex;align-items:center;justify-content:space-between;gap:1.2rem;padding:1.8rem 0;font-size:1.6rem;font-weight:500;color:rgba(255,255,255,.78);text-decoration:none;transition:color .2s,padding .3s var(--ha-ease)}
.home-caps__more a:after{content:"";flex:none;width:2.8rem;height:2.8rem;border-radius:50%;background:rgba(255,255,255,.08) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 17L17 7M9 7h8v8'/%3E%3C/svg%3E") center/1.4rem no-repeat;transition:background-color .2s,transform .3s var(--ha-ease)}
.home-caps__more a:hover{color:#fff;text-decoration:none;padding-left:.6rem}
.home-caps__more a:hover:after{background-color:var(--ha-red);transform:rotate(45deg)}

@media (max-width:1199px){.home-caps__title{font-size:2.6rem}.home-caps__more ul{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:575px){.home-caps__more ul{grid-template-columns:1fr}}
@media (max-width:991px){
  .home-caps{padding:6rem 0}
  .home-caps__explorer{grid-template-columns:1fr}
  .home-caps__stage{display:none}
  .home-caps__link{grid-template-columns:4rem minmax(0,1fr) 3.6rem;padding:2rem 0 .8rem;color:#fff}
  .home-caps__title{font-size:2.2rem}
  .home-caps__row.is-active .home-caps__title{transform:none}
  .home-caps__arrow{opacity:1;transform:none;width:3.6rem;height:3.6rem}
  .home-caps__inline{display:block;font-size:1.5rem;line-height:1.55;color:rgba(255,255,255,.7);margin:0 0 2rem 5.6rem}
}
@media (prefers-reduced-motion:reduce){.home-caps__panel,.home-caps__title,.home-caps__arrow{transition:none}}

/* ---------- industry AI (black, tabs + photo) ---------- */
.home-industries{background:var(--ha-black);padding:9rem 0}
.home-industries__body{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:4rem;align-items:stretch}
.home-industries__tabs{display:flex;flex-direction:column;align-items:stretch;align-self:start}
.home-industries__tab{width:100%}
.home-industries__toggle{all:unset;box-sizing:border-box;width:100%;cursor:pointer;display:flex;align-items:center;gap:1.4rem;margin:6px 0;padding:1.6rem 2.6rem 1.6rem 1.8rem;
  background:#232325;border-radius:var(--ha-r);font-weight:600;font-size:1.9rem;line-height:1.3;color:#fff;white-space:nowrap;transition:all .35s ease}
.home-industries__toggle:hover{background:#2d2d30}
.home-industries__tab.is-active .home-industries__toggle{display:none}
.home-industries__plus{flex:none;width:2.4rem;height:2.4rem;border-radius:50%;border:1.5px solid #fff;position:relative}
.home-industries__plus:before,.home-industries__plus:after{content:"";position:absolute;left:50%;top:50%;width:1rem;height:1.5px;background:#fff;transform:translate(-50%,-50%)}
.home-industries__plus:after{transform:translate(-50%,-50%) rotate(90deg)}
.home-industries__detail{background:var(--ha-green);border-radius:var(--ha-r);padding:0 4.4rem;max-height:0;overflow:hidden;opacity:0;transform:translateY(-8px);contain:inline-size;
  transition:max-height .45s ease,opacity .35s ease,transform .35s ease,padding .35s ease}
.home-industries__tab.is-active .home-industries__detail{max-height:calc(var(--h,52rem) + 8.8rem);padding:4.4rem;margin:5px 0 12px;opacity:1;transform:translateY(0)}
.home-industries__count{margin:0 0 2rem;font-size:1.4rem;font-weight:600;letter-spacing:.06em;color:#fff;font-variant-numeric:tabular-nums}
.home-industries__count span{color:rgba(255,255,255,.5)}
.home-industries__lead{margin:0 0 1.4rem;font-family:var(--ha-display);font-size:3rem;line-height:1.12;font-weight:700;letter-spacing:-.02em;color:#fff}
.home-industries__detail .home-industries__text{font-size:1.8rem;line-height:1.6;color:rgba(255,255,255,.82);margin:0 0 2.8rem;text-wrap:pretty}
.home-industries__detail ul{list-style:none;margin:0 0 2.8rem;padding:0;border-top:1px solid rgba(255,255,255,.14)}
.home-industries__detail li{display:flex;gap:1.4rem;align-items:center;font-size:1.6rem;line-height:1.4;font-weight:500;color:#fff;margin:0;padding:1.5rem 0;border-bottom:1px solid rgba(255,255,255,.14)}
.home-industries__detail li>span:first-child{flex:none;width:2.6rem;height:2.6rem;border-radius:50%;background:rgba(111,207,151,.16);color:#6fcf97;display:grid;place-items:center}
.home-industries__visual{position:relative;border-radius:var(--ha-r);overflow:hidden;min-height:56rem;background:#111}
.home-industries__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.04);transition:opacity .6s var(--ha-ease),transform 1.2s var(--ha-ease)}
.home-industries__img.is-active{opacity:1;transform:scale(1)}
.home-industries__visual:after{content:"";position:absolute;inset:auto 0 0 0;height:40%;background:linear-gradient(to top,rgba(0,0,0,.6),transparent);pointer-events:none}
.home-industries__caption{position:absolute;left:2.4rem;bottom:2.4rem;z-index:1;display:inline-flex;align-items:center;gap:1.2rem;margin:0;background:rgba(0,0,0,.55);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.12);border-radius:10rem;padding:1rem 2rem 1rem 1rem;color:#fff}
.home-industries__caption span{width:3.6rem;height:3.6rem;border-radius:50%;background:var(--ha-red);display:grid;place-items:center;font-size:1.3rem;font-weight:700;font-variant-numeric:tabular-nums}
.home-industries__caption strong{font-size:1.5rem;font-weight:600}
.home-industries__stat{position:absolute;top:2.4rem;right:2.4rem;z-index:1;margin:0;max-width:30rem;opacity:0;transform:translateY(-.8rem);transition:opacity .4s var(--ha-ease),transform .5s var(--ha-ease);pointer-events:none;padding:1.8rem 2.2rem;border-radius:var(--ha-r-sm);background:rgba(12,12,12,.5);border:1px solid rgba(255,255,255,.14);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);color:#fff;display:flex;flex-direction:column;gap:.4rem}
.home-industries__stat strong{white-space:nowrap;font-family:var(--ha-display);font-size:2.8rem;line-height:1.05;font-weight:700;letter-spacing:-.02em}
.home-industries__stat span{font-size:1.3rem;line-height:1.4;color:rgba(255,255,255,.72)}
.home-industries__stat.is-active{opacity:1;transform:none;transition-delay:.15s}

/* ---------- products (art from each product's own brand assets, copy on a panel or revealed on hover) ---------- */
.home-products{padding:9rem 0;position:relative}
.home-products__grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:2rem}
.home-products__item{min-width:0}
.home-products__card--datasense{--ac:#15924a}.home-products__card--peoplegrid{--ac:#2c8a57}.home-products__card--stackroom{--ac:#e5480f}.home-products__card--vocso-learn{--ac:#f0561d}
.home-products__card{position:relative;display:block;height:100%;border-radius:var(--ha-r);overflow:hidden;isolation:isolate;color:var(--ha-ink);text-decoration:none;background:var(--ha-soft);
  transition:transform .45s var(--ha-ease),box-shadow .45s var(--ha-ease)}
.home-products__card:hover{color:var(--ha-ink);text-decoration:none;transform:translateY(-.6rem);box-shadow:0 2.8rem 5rem -3.2rem rgba(0,0,0,.35)}

/* art */
.home-products__art{position:relative;display:grid;place-items:start center;height:100%;min-height:100%;overflow:hidden}
.home-products__art:after{content:"";position:absolute;inset:0;z-index:3;pointer-events:none;opacity:0;transition:opacity .4s;
  background:radial-gradient(26rem circle at var(--mx,50%) var(--my,30%),rgba(255,255,255,.18),transparent 60%)}
.home-products__card:hover .home-products__art:after{opacity:1}
.home-products__art>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 1.4s var(--ha-ease)}
.home-products__art--datasense{background:url(/media/products/pattern-datasense-dark.svg) 100% 50%/cover no-repeat,radial-gradient(90% 120% at 100% 0%,#0b3b33 0%,transparent 65%),#03161b;transition:background-position 1.8s var(--ha-ease)}
.home-products__card:hover .home-products__art--datasense{background-position:calc(100% + 6rem) 40%,0 0,0 0}
.home-products__art--peoplegrid{background:radial-gradient(70% 60% at 25% 15%,#ff9b55 0%,transparent 70%),radial-gradient(70% 60% at 85% 90%,#d9480f 0%,transparent 70%),#f26a21}
.home-products__art--peoplegrid .pg-ring svg>circle:first-of-type{stroke:#fff;stroke-opacity:.5}
.home-products__art--peoplegrid .pg-ring__line{stroke:#fff}
.home-products__art--peoplegrid .pg-ring__node circle{fill:#fff}
.home-products__art--peoplegrid .pg-ring__node path{stroke:#e8590c}
.home-products__art--vocso-learn{background:radial-gradient(70% 60% at 85% 85%,rgba(255,106,36,.45),transparent 70%),radial-gradient(60% 50% at 10% 0%,rgba(255,140,60,.16),transparent 70%),#1a0d07}
.home-products__card:hover .home-products__art--stackroom>img{transform:scale(1.06) translate(2%,-1%)}
.vl-art{position:absolute;inset:0;display:block;perspective:120rem}
.vl-paper{position:absolute;left:12%;right:12%;top:13%;aspect-ratio:1.42/1;display:flex;flex-direction:column;align-items:center;text-align:center;padding:7% 8% 0;border-radius:.6rem;
  background:linear-gradient(160deg,#fffdf9,#f8efe4);color:#2b1d14;box-shadow:inset 0 0 0 .5rem #fffaf3,inset 0 0 0 .6rem #e9c9a8,0 2.4rem 4.8rem -2rem rgba(0,0,0,.65);
  transform:rotate(-5deg);transition:transform .9s var(--ha-ease)}
.vl-paper--back{background:#f1e4d4;box-shadow:0 2rem 4rem -2rem rgba(0,0,0,.6);transform:rotate(4deg) translate(3%,2%);opacity:.55;padding:0}
.home-products__card:hover .vl-paper:not(.vl-paper--back){transform:rotate(-1deg) translateY(-.6rem)}
.home-products__card:hover .vl-paper--back{transform:rotate(7deg) translate(5%,3%)}
.vl-paper__brand{font-size:.85rem;font-weight:700;letter-spacing:.24em;text-transform:uppercase;color:#e2531c}
.vl-paper__title{margin-top:.7rem;font-family:Georgia,"Times New Roman",serif;font-size:1.65rem;line-height:1.1;color:#2b1d14}
.vl-paper__to{margin-top:.9rem;font-family:Georgia,serif;font-style:italic;font-size:1rem;color:#8a7262}
.vl-paper__name{margin-top:.2rem;font-family:Georgia,serif;font-style:italic;font-size:2rem;line-height:1.1;color:#2b1d14;padding:0 1.2rem .3rem;border-bottom:1px solid #e3cbb3}
.vl-paper__meta{display:flex;flex-direction:column;align-items:flex-start;gap:.2rem;align-self:stretch;text-align:left;margin-top:auto;padding:0 28% 7% 0;font-size:.95rem;font-weight:600;letter-spacing:.04em;color:#8a7262}
.vl-paper__seal{position:absolute;right:-7%;bottom:-11%;width:30%;height:auto;filter:drop-shadow(0 .8rem 1.4rem rgba(140,40,0,.45));transition:transform 1.4s var(--ha-ease)}
.home-products__card:hover .vl-paper__seal{transform:rotate(45deg) scale(1.06)}
.pg-ring{display:block;width:86%;max-width:34rem;margin-top:9%}
.pg-ring svg{display:block;width:100%;height:auto;overflow:visible}
.pg-ring__label{font:600 15px/1 var(--ha-display);fill:#fff}
.pg-ring__core{fill:#fff}
.pg-ring__big{font:700 34px/1 var(--ha-display);fill:#1b1340;letter-spacing:-.03em}
.pg-ring__small{font:600 11px/1 var(--ha-display);fill:#e8590c;letter-spacing:.14em;text-transform:uppercase}
.pg-ring__line{opacity:.4;transition:opacity .3s}
.home-products__card:hover .pg-ring__line{opacity:1;animation:pgFlow .9s linear infinite}
.pg-ring__node{transform-box:fill-box;transform-origin:center;transform:scale(.4);opacity:0;transition:transform .5s cubic-bezier(.3,1.5,.5,1) var(--d),opacity .3s var(--d)}
.is-in .pg-ring__node{transform:none;opacity:1}
.home-products__card:hover .pg-ring__node{transform:scale(1.12)}
@keyframes pgFlow{to{stroke-dashoffset:-16}}

/* chip: a moment from the product, the result appears on hover */
.home-products__chip{position:absolute;z-index:4;top:1.2rem;left:1.2rem;right:1.2rem;opacity:0;transform:translateY(-.8rem);transition:opacity .35s,transform .45s var(--ha-ease);display:flex;flex-direction:column;gap:.4rem;padding:1rem 1.2rem;border-radius:1rem;
  background:rgba(3,22,27,.72);color:#fff;box-shadow:inset 0 0 0 1px rgba(255,255,255,.12);backdrop-filter:blur(10px)}
.home-products__chip small{font-size:1.2rem;font-weight:500;line-height:1.35;color:rgba(255,255,255,.78)}
.home-products__chip b{display:flex;align-items:center;gap:.6rem;font-size:1.3rem;font-weight:600;line-height:1.3;max-height:0;opacity:0;transform:translateY(.4rem);
  transition:max-height .4s var(--ha-ease),opacity .3s .1s,transform .4s var(--ha-ease) .1s}
.home-products__chip i{flex:none;display:grid;place-items:center;width:1.8rem;height:1.8rem;border-radius:50%;background:var(--ac);color:#fff}
.home-products__card--datasense .home-products__chip i{background:#9ff07a;color:#03161b}
.home-products__card:hover .home-products__chip,.home-products__card:focus-visible .home-products__chip{opacity:1;transform:none}
.home-products__card:hover .home-products__chip b,.home-products__card:focus-visible .home-products__chip b{max-height:4rem;opacity:1;transform:none;transition-delay:.35s}

/* copy */
.home-products__body{position:absolute;z-index:5;display:block}
.home-products__head{display:flex;align-items:center;gap:.9rem}
.home-products__mark{width:2.4rem;height:2.4rem;object-fit:contain}
.home-products__head strong{font-family:var(--ha-display);font-size:1.7rem;font-weight:700;letter-spacing:-.01em}
.home-products__arrow{margin-left:auto;width:3.2rem;height:3.2rem;border-radius:50%;display:grid;place-items:center;background:var(--ha-soft);color:var(--ha-ink);transition:background .3s,color .3s,transform .35s var(--ha-ease)}
.home-products__card:hover .home-products__arrow{background:var(--ha-red);color:#fff;transform:rotate(45deg)}
.home-products__cat{display:block;margin-top:1.8rem;font-size:1.1rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--ha-muted)}
.home-products__title{display:block;margin:.6rem 0 0;font-family:var(--ha-display);font-size:2.1rem;font-weight:700;line-height:1.12;letter-spacing:-.025em;text-wrap:balance}
.home-products__title em{display:block;font-style:normal}
.home-products__text{display:block;font-size:1.4rem;line-height:1.55;color:var(--ha-muted);text-wrap:pretty;max-height:0;opacity:0;overflow:hidden;
  transition:max-height .5s var(--ha-ease),opacity .35s,margin .4s}
.home-products__card:hover .home-products__text,.home-products__card:focus-visible .home-products__text{max-height:12rem;opacity:1;margin-top:1.2rem}
.home-products__tags{display:none}

/* 1: overlay, four tall cards with the copy on a floating panel */
.home-products .home-products__card{aspect-ratio:4/5.6}
.home-products .home-products__body{left:1rem;right:1rem;bottom:1rem;padding:1.8rem 1.8rem 2rem;border-radius:1.2rem;background:rgba(255,255,255,.96);backdrop-filter:blur(10px);box-shadow:0 1.2rem 2.8rem -2rem rgba(0,0,0,.45)}

/* dark mode */
.darkmode .home-products__card:hover{box-shadow:0 2.8rem 5rem -3.2rem rgba(0,0,0,.9)}
.darkmode .home-products .home-products__body{background:rgba(22,23,25,.95)}
.darkmode .home-products .home-products__arrow{background:#2a2c30;color:#f5f5f7}


@media (max-width:1199px){
  .home-products .home-products__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:767px){
  .home-products__text{max-height:none;opacity:1;margin-top:1.2rem}
  .home-products .home-products__grid{grid-template-columns:1fr}
  .home-products .home-products__card{aspect-ratio:4/4.6}
}
@media (prefers-reduced-motion:reduce){
  .home-products__card,.home-products__art>img,.home-products__art--datasense,.pg-ring__node,.home-products__chip b,.home-products__text,.home-products__tags{transition:none}
  .pg-ring__line{animation:none!important}
}

.darkmode .home-pill{background:#2a2c30;border-color:#3a3d42;color:#f5f5f7}

/* ---------- why projects stall (white; problems first, hover crosses one off and shows how we handle it) ---------- */
.home-risks{position:relative;padding:9rem 0;color:var(--ha-ink);background:#fff}
.home-risks .rkC{display:grid}
.rk-tag{display:inline-flex;align-items:center;gap:.7rem;width:max-content;font-size:1.1rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--ha-red)}
.rk-tag--fix{color:var(--ha-green)}
.rk-tag i{display:grid;place-items:center;width:1.9rem;height:1.9rem;border-radius:50%;background:var(--ha-green);color:#fff}
.rk-proof{display:block;font-size:1.4rem;font-weight:600;line-height:1.5;color:var(--ha-green)}
/* the strike: one line per wrapped line, drawn left to right */
.rk-strike{display:inline;background:linear-gradient(var(--ha-red),var(--ha-red)) no-repeat 0 55%/0% 2px;-webkit-box-decoration-break:clone;box-decoration-break:clone;
  transition:background-size .5s cubic-bezier(.65,0,.35,1),color .5s ease}
.is-open .rk-strike{background-size:100% 2px;color:#a0a3a8}
.rk-hint{margin:2.4rem 0 0;text-align:center;font-size:1.3rem;font-weight:500;color:var(--ha-muted)}
@media (hover:none){.rk-hint{display:none}}

/* 3: 2x2 tiles */
.rkC{list-style:none;margin:0;padding:0;grid-template-columns:repeat(2,minmax(0,1fr));gap:2rem}
.rkC__tile{position:relative;display:flex;flex-direction:column;gap:2.8rem;min-height:40rem;padding:4rem 4.4rem;border-radius:var(--ha-r);background:#fff;box-shadow:inset 0 0 0 1.5px #e3e5e8;cursor:pointer;outline:none;overflow:hidden;
  transition:box-shadow .45s ease,transform .45s cubic-bezier(.2,.8,.2,1)}
.rkC__tile:not(.is-open):hover{box-shadow:inset 0 0 0 1.5px #c9ccd0}
.rkC__tile.is-open{box-shadow:inset 0 0 0 2px var(--ha-ink),0 2.8rem 5.6rem -3.6rem rgba(0,0,0,.28);transform:translateY(-.4rem);cursor:default}
.rkC__tile:after{content:"";position:absolute;left:0;right:0;top:0;height:6px;background:var(--ha-red);transform-origin:left;transform:scaleX(0);transition:transform .6s cubic-bezier(.2,.8,.2,1) .1s}
.rkC__tile.is-open:after{transform:none}
.rkC__tile:focus-visible{box-shadow:inset 0 0 0 2px var(--ha-red)}
.rkC__top{display:flex;justify-content:space-between;align-items:flex-start;font-size:1.2rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--ha-muted)}
.rkC__top b{font:700 4.8rem/1 var(--ha-display);letter-spacing:-.04em;color:var(--ha-red);transition:color .45s ease}
.rkC__tile.is-open .rkC__top b{color:var(--ha-muted)}
.rkC__stage{display:inline-flex;align-items:center;gap:1.4rem}
/* tickbox: empty at rest; on open it fills green and the tick draws itself */
.rk-box{display:grid;place-items:center;width:3rem;height:3rem;border-radius:.9rem;box-shadow:inset 0 0 0 2px #cfd2d6;transition:background .35s ease,box-shadow .35s ease,transform .45s cubic-bezier(.3,1.6,.5,1)}
.rk-box svg{width:1.8rem;height:1.8rem;fill:none;stroke:#fff;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:24;stroke-dashoffset:24;transition:stroke-dashoffset .45s cubic-bezier(.65,0,.35,1) .2s}
.rk-tag .rk-box{transition-delay:.45s,.45s,.45s}
.is-open .rk-box{background:var(--ha-green);box-shadow:none}
.is-open .rk-box svg{stroke-dashoffset:0;transition-delay:.65s}
.darkmode .rk-box{box-shadow:inset 0 0 0 2px rgba(255,255,255,.25)}
/* dark mode: the brand forest green is too dark on black, so the "how we handle it" accents use a lighter green */
.darkmode .rk-tag--fix,.darkmode .rk-proof{color:#4fc38f}
.darkmode .is-open .rk-box{background:#1f9d68}
.rkC__risk{display:block}
.rkC__risk .rk-tag{display:flex;margin-bottom:1.2rem;transition:opacity .4s ease}
.rkC__risk strong{font-family:var(--ha-display);font-size:3.6rem;font-weight:700;line-height:1.1;letter-spacing:-.03em;color:var(--ha-ink)}
.rkC__risk small{display:block;margin-top:1.2rem;font-size:1.55rem;line-height:1.6;color:var(--ha-muted);max-width:48ch;transition:opacity .4s ease}
.rkC__tile.is-open .rkC__risk small{opacity:.45}
.rkC__tile.is-open .rkC__risk .rk-tag{opacity:.5}
.rkC__fix{display:flex;flex-direction:column;gap:1rem;margin-top:auto;padding-top:2.4rem;border-top:1.5px solid var(--ha-ink);opacity:0;transform:translateY(1.6rem);transition:opacity .4s ease,transform .55s cubic-bezier(.2,.8,.2,1);pointer-events:none}
.rkC__fix strong{font-family:var(--ha-display);font-size:2.8rem;font-weight:700;line-height:1.15;letter-spacing:-.02em;color:var(--ha-ink)}
.rkC__tile.is-open .rkC__fix{opacity:1;transform:none;pointer-events:auto;transition-delay:.3s}

/* dark mode */
.darkmode .home-risks{background:var(--color-black-fixed,#000);color:#f5f5f7}
.darkmode .rkC__risk strong,.darkmode .rkC__fix strong{color:#f5f5f7}
.darkmode .rkC__tile{background:#131417;box-shadow:inset 0 0 0 1px rgba(255,255,255,.07)}.darkmode .rkC__tile.is-open{background:#1a1b1f;box-shadow:inset 0 0 0 1px rgba(255,255,255,.16)}
.darkmode .rkC__fix{border-color:rgba(255,255,255,.14)}

@media (max-width:991px){
  .rkC{grid-template-columns:1fr}
  .rkC__fix{opacity:1;transform:none}
  /* every answer is already showing here, so the boxes show ticked and the hover hint goes */
  .rk-box{background:var(--ha-green);box-shadow:none}
  .rk-box svg{stroke-dashoffset:0}
  .darkmode .rk-box{background:#1f9d68}
  .rk-hint{display:none}
}
@media (max-width:767px){
  .home-risks{padding:6rem 0}
  .rkC__tile{padding:2.8rem 2.4rem}.rkC__risk strong{font-size:2.6rem}.rkC__top b{font-size:3.6rem}
}
@media (prefers-reduced-motion:reduce){.rk-box,.rk-box svg,.rk-strike,.rkC__fix,.rkC__tile{transition:none}}

/* ---------- FAQ ---------- */
.home-faq{padding:9rem 0}
.home-faq__wrap{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:8rem;align-items:start}
.home-faq__intro{position:sticky;top:12rem}
.home-faq__intro h2{font-family:var(--ha-display);font-weight:700;font-size:5.6rem;line-height:1.08;letter-spacing:-.025em;color:var(--ha-ink);margin:0 0 2rem}
.home-faq__intro p{font-size:1.7rem;line-height:1.6;color:var(--ha-muted);margin:0;max-width:40ch}
.home-faq__list{border-top:1px solid var(--ha-line);interpolate-size:allow-keywords}
.home-faq__item{border-bottom:1px solid var(--ha-line)}
.home-faq__item summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:2.4rem;padding:2.6rem 0}
.home-faq__item summary::-webkit-details-marker{display:none}
.home-faq__item summary h3{font-family:var(--ha-display);font-size:2.2rem;line-height:1.35;font-weight:600;letter-spacing:-.015em;margin:0;color:var(--ha-ink);transition:color .2s}
.home-faq__item summary:hover h3{color:var(--ha-red)}
.home-faq__icon{flex:none;width:4rem;height:4rem;border-radius:50%;background:transparent;box-shadow:inset 0 0 0 1px var(--ha-line);position:relative;transition:background .3s ease,box-shadow .3s ease,transform .45s cubic-bezier(.2,.8,.2,1)}
.home-faq__item summary:hover .home-faq__icon{box-shadow:inset 0 0 0 1px var(--ha-ink)}
.home-faq__icon:before,.home-faq__icon:after{content:"";position:absolute;left:50%;top:50%;width:1.4rem;height:1.5px;background:var(--ha-ink);transform:translate(-50%,-50%)}
.home-faq__icon:after{transform:translate(-50%,-50%) rotate(90deg)}
.home-faq__item[open] .home-faq__icon{background:var(--ha-ink);box-shadow:none;transform:rotate(45deg)}
.home-faq__item[open] .home-faq__icon:before,.home-faq__item[open] .home-faq__icon:after{background:#fff}
.home-faq__item::details-content{block-size:0;overflow:hidden;transition:block-size .45s cubic-bezier(.2,.8,.2,1),content-visibility .45s allow-discrete}
.home-faq__item[open]::details-content{block-size:auto}
.home-faq__answer{padding:0 6rem 2.8rem 0}
.home-faq__answer p{font-size:1.7rem;line-height:1.7;color:var(--ha-muted);margin:0 0 1rem;max-width:64ch}
.home-faq__answer a{color:var(--ha-ink);text-decoration:underline;text-decoration-color:var(--ha-red);text-decoration-thickness:1.5px;text-underline-offset:.35rem}
.home-faq__answer a:hover{color:var(--ha-red)}
.home-faq__intro h2 .home-sparkle{display:block;margin-bottom:1.6rem}
.darkmode .home-faq__item[open] .home-faq__icon:before,.darkmode .home-faq__item[open] .home-faq__icon:after{background:#000}


/* dark mode: the site paints dark backgrounds per section, so the light bands bring their own */
.darkmode .home-summary,.darkmode .home-products,.darkmode .home-faq{background:var(--color-black-fixed,#000)}

/* ---------- responsive ---------- */
@media (max-width:991px){
  .home-h2,.home-faq__intro h2{font-size:4rem}
  .home-head{grid-template-columns:1fr;gap:2rem;margin-bottom:4.8rem}
  .home-industries__body{grid-template-columns:1fr}
  .home-industries__visual{min-height:36rem;order:-1}
  .home-faq__wrap{grid-template-columns:1fr;gap:4rem}
  .home-faq__intro{position:static}
  .home-industries,.home-products,.home-risks,.home-faq{padding:6rem 0}
}
@media (max-width:575px){
  .home-h2,.home-faq__intro h2{font-size:3.2rem}
  .home-sparkle{width:3.2rem;height:3.2rem;margin-bottom:1.6rem}
  .home-industries__toggle{font-size:1.8rem}.home-industries__lead{font-size:2rem}
  .home-industries__detail{padding:0 2.6rem}.home-industries__tab.is-active .home-industries__detail{padding:2.8rem 2.6rem;max-height:calc(var(--h,60rem) + 5.6rem)}
  .home-industries__visual{min-height:24rem}
  .home-industries__lead{font-size:2.6rem}
  .home-industries__stat{top:1.6rem;right:1.6rem;padding:1.2rem 1.6rem}.home-industries__stat strong{font-size:2.4rem}
  .home-faq__item summary h3{font-size:1.8rem}
  .home-faq__answer{padding-right:0}
}
@media (prefers-reduced-motion:reduce){
  .home-products__card,.home-industries__img,.home-industries__detail,.home-industries__tab,.home-industries__toggle,.home-btn,.home-faq__icon,.home-faq__icon:after{transition:none}
}

/* ---------- polish for sections inherited from the current homepage ---------- */

/* how an engagement runs: one accent, no hand-drawn underlines */
/* step numbers: a small "Step 01" label above each heading, like the labels elsewhere on the page */
.homeGuidetopicBlock h3 .bluenumbers,.homeGuidetopicBlock .content-blockscroll h3 .bluenumbers{position:static!important;display:block!important;width:auto!important;height:auto!important;margin:0 0 1.2rem!important;
  background:none!important;box-shadow:none!important;border-radius:0!important;color:var(--ha-red)!important;font-size:1.2rem!important;font-weight:700!important;line-height:1!important;letter-spacing:.16em;text-transform:uppercase;font-variant-numeric:tabular-nums}
.homeGuidetopicBlock h3 .bluenumbers:before{content:"Step 0"}
.homeGuidetopicBlock .content-blockscroll h3{text-align:left!important}
.homeGuidetopicBlock .content-blockscroll h3,.homeGuidetopicBlock .content-blockscroll>p,.homeGuidetopicBlock .content-blockscroll>ul{padding-left:0!important}
.homeGuidetopicBlock h3 span:not(.bluenumbers){background-image:none!important;padding-bottom:0}
.homeGuidetopicBlock .scheduleCall-btn{background:var(--ha-red);border-radius:10rem;font-weight:600!important;font-size:1.6rem;padding:1.6rem 2.8rem!important;transition:background .2s,transform .2s var(--ha-ease),box-shadow .2s}
.homeGuidetopicBlock .scheduleCall-btn:hover{background:var(--ha-red-deep);box-shadow:0 1.2rem 2.8rem -1rem rgba(253,58,48,.6)}
.homeGuidetopicBlock .scheduleCall-btn:active{transform:translateY(1px)}
.homeGuidetopicBlock .nav-link.active{color:var(--ha-red)!important;border-left-color:var(--ha-red)!important;font-weight:600}
.homeGuidetopicBlock #section0 img{border-radius:var(--ha-r)}

/* project bands: give the summary room instead of a 190px column */
.body-color .projectabout{gap:6rem;align-items:flex-end}
.body-color .projectabout h2{flex:1 1 auto;max-width:none;text-wrap:balance}
.body-color .projectabout p{flex:0 0 40rem;max-width:40rem;font-size:1.7rem;line-height:1.6}

/* blog: red dots, softer cards */
.blog .blog-dotcolor{background:var(--ha-red)!important}
.blog .card{border-radius:2rem;transition:transform .3s var(--ha-ease),box-shadow .3s var(--ha-ease)}
.blog .card:hover{transform:translateY(-.4rem);box-shadow:0 2rem 4rem -2rem rgba(37,40,44,.25)}

@media (max-width:991px){
  .body-color .projectabout{flex-direction:column;align-items:flex-start;gap:2rem}
  .body-color .projectabout p{flex:none;max-width:60ch}
}

/* ---------- enquiry popup (new homepage only: shown when the popup has a side panel) ---------- */
.popuptransbg{position:fixed!important;background:rgba(0,0,0,.66)!important;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.popup .popupscroll.has-aside{width:min(98rem,92vw)!important;max-height:calc(100vh - 4rem);overflow:auto;padding:0!important;border-radius:var(--ha-r);text-align:left;
  display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);box-shadow:0 4rem 10rem -2rem rgba(0,0,0,.6);background:#fff}
.popup-aside{background:var(--ha-green);color:#fff;padding:5.6rem 4.8rem;display:flex;flex-direction:column;gap:2.8rem}
.popup-aside.has-photo{padding:0;gap:0;background:var(--ha-green)}
.popup-aside__photo{display:block;width:100%;flex:1;min-height:0;height:100%;max-height:44rem;object-fit:cover;object-position:50% 15%;background:#eef0f2}
.popup-aside__body{display:flex;flex-direction:column;gap:1.2rem}
.has-photo .popup-aside__body{padding:3.2rem 4rem 3.6rem}
.popup-aside__quote{margin:0;font-family:var(--ha-display);font-weight:700;font-size:2.6rem;line-height:1.2;letter-spacing:-.015em;color:#fff}
.popup-aside__who{margin:0;display:flex;flex-direction:column;gap:.2rem;font-size:1.4rem;color:rgba(255,255,255,.7)}
.popup-aside__who strong{font-size:1.5rem;font-weight:600;color:#fff}
.popup-aside__eyebrow{align-self:flex-start;margin:0;font-size:1.3rem;font-weight:600;color:#fff;background:rgba(255,255,255,.12);border-radius:.6rem;padding:.6rem 1.1rem}
.popup-aside__intro{margin:0;font-family:var(--ha-display);font-weight:700;font-size:2.8rem;line-height:1.2;letter-spacing:-.015em;color:#fff}
.popup-aside ul{list-style:none;margin:auto 0 0;padding:0;display:flex;flex-direction:column;gap:1.4rem}
.popup-aside li{display:flex;gap:1.2rem;align-items:flex-start;font-size:1.5rem;line-height:1.45;color:rgba(255,255,255,.88)}
.popup-aside li>span:first-child{flex:none;width:2.2rem;height:2.2rem;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.16);color:#fff;margin-top:.05rem}

.has-aside #form,.has-aside #thank-you{padding:5.6rem 4.8rem 4.4rem}
.has-aside #new_proposal_form{display:grid;grid-template-columns:1fr 1fr;gap:3rem 3.2rem}
.has-aside #new_proposal_form .clearfix{display:none}
.popup .has-aside h4{grid-column:1/-1;font-family:var(--ha-display)!important;font-size:3.2rem!important;font-weight:700!important;letter-spacing:-.02em;line-height:1.15;margin:0 0 .8rem!important;color:var(--ha-ink)}
.has-aside .input-field{margin:0!important;float:none!important;display:flex;flex-direction:column-reverse;gap:.8rem}
.has-aside .input-field:has(#bussiness_name),.has-aside .input-field:has(#full_name),.has-aside .input-field:has(.g-recaptcha-quote2){grid-column:1/-1}
.has-aside .input-field label{position:static!important;transform:none!important;max-width:none!important;font-size:1.5rem!important;font-weight:400!important;color:var(--ha-ink)!important;cursor:default}
.has-aside .input-field input{height:4.4rem;border:0!important;border-bottom:1px solid rgba(151,151,151,.35)!important;border-radius:0!important;background:transparent!important;padding:0!important;
  font-size:1.8rem!important;color:#495057!important;transition:border-color .2s}
.has-aside .input-field input::placeholder{font-size:1.5rem!important;color:#b0b3b8!important;opacity:1!important}
.has-aside .input-field input:hover{border-bottom-color:rgba(151,151,151,.7)!important}
.has-aside .input-field input:focus{outline:0;border-bottom-color:var(--ha-red)!important;box-shadow:none!important}
.has-aside .input-field .error{position:absolute;bottom:-1.8rem;left:.2rem;font-size:1.15rem}
.has-aside .submit-box{grid-column:1/-1;margin:1rem 0 0!important}
.has-aside .submit-box #submit_btn{display:flex;align-items:center;justify-content:center;gap:1rem;width:100%;padding:1.7rem 2.4rem;border:0;border-radius:10rem;background:var(--ha-red);color:#fff;font-size:1.6rem;font-weight:600;
  transition:background .2s,transform .2s var(--ha-ease),box-shadow .2s}
.has-aside .submit-box #submit_btn:after{content:"\2192";transition:transform .2s var(--ha-ease)}
.has-aside .submit-box #submit_btn:hover{background:var(--ha-red-deep);box-shadow:0 1.2rem 2.8rem -1rem rgba(253,58,48,.6)}
.has-aside .submit-box #submit_btn:hover:after{transform:translateX(.3rem)}
.has-aside .submit-box #submit_btn:active{transform:translateY(1px)}
.popup-note{grid-column:1/-1;margin:0;text-align:center;font-size:1.25rem;color:var(--ha-muted)}
.has-aside .close-btn{position:absolute;top:1.6rem;right:1.6rem;z-index:3;width:4rem;height:4rem;border-radius:50%;background:var(--ha-soft);display:grid;place-items:center;font-size:2.4rem;line-height:1;cursor:pointer;transition:background .2s}
.has-aside .close-btn:hover{background:#e7e9ec}
.has-aside #thank-you{text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center}
.has-aside #thank-you h2{font-family:var(--ha-display);font-weight:700;font-size:3.2rem;margin:0 0 1rem}
.has-aside #thank-you img{max-width:22rem;margin:1.6rem auto}
.has-aside #thank-you .btn-proposal{display:inline-flex;border-radius:10rem;background:var(--ha-red);color:#fff;padding:1.4rem 2.4rem;font-weight:600;font-size:1.5rem;text-decoration:none}

.darkmode .popup .popupscroll.has-aside{background:#0d0e10}
.darkmode .popup .has-aside h4,.darkmode .has-aside .input-field label{color:#f5f5f7!important}
.darkmode .has-aside .input-field input{border-bottom-color:rgba(255,255,255,.25)!important;color:#f5f5f7!important}
.darkmode .has-aside .close-btn{background:#1f2124;color:#fff}

@media (max-width:767px){
  .popup .popupscroll.has-aside{grid-template-columns:1fr;width:94vw!important;max-height:calc(100vh - 2rem)}
  .popup-aside{padding:3.2rem 2.4rem;gap:1.6rem}
  .popup-aside.has-photo{flex-direction:row;align-items:center;padding:1.6rem 2rem;gap:1.6rem}
  .popup-aside__photo{width:6.4rem;height:6.4rem;flex:none;border-radius:50%;max-height:none}
  .has-photo .popup-aside__body{padding:0;gap:.4rem}
  .popup-aside__quote{font-size:1.6rem}
  .popup-aside__intro{font-size:2rem}
  .popup-aside ul{display:none}
  .has-aside #form,.has-aside #thank-you{padding:3.2rem 2.4rem}
  .has-aside #new_proposal_form{grid-template-columns:1fr}
  .popup .has-aside h4{font-size:2.6rem!important}
  .has-aside .close-btn{background:rgba(255,255,255,.16);color:#fff}
}
.has-aside #RecaptchaField2:empty{min-height:0!important;height:0!important}
.has-aside .input-field:has(#RecaptchaField2:empty){margin-top:-3rem!important}

/* ---------- technology stack (white, flat; preview: data-v picks a concept) ---------- */
.home-stack{position:relative;padding:9rem 0;background:#fff;color:var(--ha-ink);overflow-x:clip}
/* all tools in two rows gliding in opposite directions */
.st45{display:flex;flex-direction:column;gap:0;margin:0 calc(50% - 50vw);padding:0}
.st45__track{overflow:hidden;padding:1.2rem 0 2.8rem;-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.st45__run{list-style:none;margin:0;padding:0;display:flex;gap:1.6rem;width:max-content;animation:stRun var(--d,60s) linear infinite}
.st45__track.is-rev .st45__run{animation-direction:reverse}
.st45__track:hover .st45__run{animation-play-state:paused}
.st45__run li{flex:none}
@keyframes stRun{to{transform:translateX(calc(-50% - .8rem))}}
/* tile: white card lifted by a soft shadow (no border); logo straight on the card, name below */
.st-big{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1.6rem;width:16rem;height:17rem;padding:2rem 1.2rem;border-radius:1.6rem;background:#fff;color:var(--ha-ink);box-shadow:0 1px 2px rgba(9,9,9,.04),0 .8rem 2.4rem -1.2rem rgba(9,9,9,.14);transition:background .35s ease,box-shadow .35s ease,transform .35s cubic-bezier(.2,.8,.2,1)}
.st-big__logo{display:grid;place-items:center;width:8.4rem;height:8.4rem;border-radius:1.6rem;background:transparent;transition:background .35s ease}
.st-big__logo img{width:6.4rem;height:6.4rem;object-fit:contain;transition:transform .35s cubic-bezier(.2,.8,.2,1)}
.st-big__name{font-size:1.45rem;font-weight:600;letter-spacing:-.01em;text-align:center;line-height:1.2}
.st-big:hover{box-shadow:0 1px 2px rgba(9,9,9,.04),0 2.4rem 4rem -2rem rgba(9,9,9,.28);transform:translateY(-.4rem)}
.st-big:hover .st-big__logo img{transform:scale(1.08)}
/* filter: one quiet segmented bar */
.st-filter{position:relative;display:inline-flex;flex-wrap:wrap;gap:.2rem;margin:-1.6rem 0 3.6rem;padding:.4rem;border-radius:10rem;box-shadow:inset 0 0 0 1px var(--ha-line)}
.st-filter button{all:unset;cursor:pointer;padding:.9rem 1.6rem;border-radius:10rem;font-size:1.35rem;font-weight:500;color:var(--ha-muted);transition:background .25s,color .25s}
.st-filter button:hover{color:var(--ha-ink)}
.st-filter button.is-on{background:var(--ha-ink);color:#fff;font-weight:600}
.st-filter button:focus-visible{outline:2px solid var(--ha-red);outline-offset:2px}
.st-filter button{position:relative;z-index:1}
.st-filter__pill{position:absolute;top:.4rem;bottom:.4rem;left:0;width:0;border-radius:10rem;background:var(--ha-ink);opacity:0;transition:transform .5s cubic-bezier(.3,1.25,.5,1),width .5s cubic-bezier(.3,1.25,.5,1)}
.st-filter.has-pill .st-filter__pill{opacity:1}
.st-filter.has-pill button.is-on{background:transparent;transition:color .3s ease .08s}
/* filter styles (section setting): pill (default), underline, track, words */
.st-n{display:none}
.st-fs--underline .st-filter{display:flex;gap:3.2rem;padding:0;border-radius:0;box-shadow:inset 0 -1px 0 var(--ha-line)}
.st-fs--underline .st-filter button{padding:0 0 1.6rem;border-radius:0;font-size:1.6rem;color:#8a8d92}
.st-fs--underline .st-filter button.is-on{color:var(--ha-ink);background:transparent}
.st-fs--underline .st-filter__pill{top:auto;bottom:0;height:2px;border-radius:0;background:var(--ha-red)}
.st-fs--track .st-filter{padding:.5rem;border-radius:1.4rem;background:#f4f5f6;box-shadow:none}
.st-fs--track .st-filter button{padding:1rem 1.6rem;border-radius:1rem}
.st-fs--track .st-filter button.is-on{color:var(--ha-ink);background:#fff}
.st-fs--track .st-filter__pill{top:.5rem;bottom:.5rem;border-radius:1rem;background:#fff;box-shadow:0 1px 2px rgba(9,9,9,.06),0 .4rem 1.2rem -.4rem rgba(9,9,9,.16)}
.st-fs--words .st-filter{display:flex;flex-wrap:wrap;align-items:baseline;gap:.6rem 2.2rem;padding:0;border-radius:0;box-shadow:none}
.st-fs--words .st-filter button{padding:0;border-radius:0;font-family:var(--ha-display);font-size:2.2rem;font-weight:700;letter-spacing:-.03em;color:#cfd1d4}
.st-fs--words .st-filter button:hover{color:#8a8d92}
.st-fs--words .st-filter button.is-on{color:var(--ha-ink);background:transparent;font-weight:700}
.st-fs--words .st-filter__pill{display:none}
.st-fs--words .st-n{display:inline;margin-left:.3rem;font-family:Montserrat,sans-serif;font-size:1.1rem;font-weight:600;letter-spacing:0;vertical-align:super;color:inherit;opacity:.8}
.st-fs--words .st-filter button.is-on .st-n{color:var(--ha-red);opacity:1}
.darkmode .st-fs--underline .st-filter{box-shadow:inset 0 -1px 0 #2a2c30}.darkmode .st-fs--underline .st-filter button{color:#7d8086}.darkmode .st-fs--underline .st-filter button.is-on{color:#f5f5f7}.darkmode .st-fs--underline .st-filter__pill{background:var(--ha-red)}
.darkmode .st-fs--track .st-filter{background:#16171a;box-shadow:none}.darkmode .st-fs--track .st-filter button.is-on{color:#fff;background:transparent}.darkmode .st-fs--track .st-filter__pill{background:#2a2c31;box-shadow:none}
.darkmode .st-fs--words .st-filter{box-shadow:none}.darkmode .st-fs--words .st-filter button{color:#3a3c41}.darkmode .st-fs--words .st-filter button:hover{color:#7d8086}.darkmode .st-fs--words .st-filter button.is-on{color:#f5f5f7}
@media (max-width:767px){.st-fs--underline .st-filter{gap:2.4rem;overflow-x:auto}.st-fs--words .st-filter button{font-size:1.8rem}}
.darkmode .st-filter__pill{background:#f5f5f7}.darkmode .st-filter.has-pill button.is-on{background:transparent}
/* a chosen layer: its tools stay bright and lifted, the rest dim */
.st-big{transition:background .35s ease,box-shadow .35s ease,transform .35s cubic-bezier(.2,.8,.2,1),opacity .45s ease,filter .45s ease}
.home-stack.is-filtered .st-big:not(.is-match){opacity:.22;filter:grayscale(1)}
.home-stack.is-filtered .st-big.is-match{box-shadow:inset 0 0 0 1.5px var(--ha-ink),0 2.4rem 4rem -2rem rgba(9,9,9,.28);transform:translateY(-.4rem)}
.darkmode .home-stack.is-filtered .st-big.is-match{background:#1c1d21;box-shadow:inset 0 0 0 1px rgba(255,255,255,.22),0 2.4rem 4rem -2rem rgba(0,0,0,.9)}
.darkmode .home-stack.is-filtered .st-big:not(.is-match){opacity:.18}
.darkmode .st-filter{box-shadow:inset 0 0 0 1px rgba(255,255,255,.14)}.darkmode .st-filter button{color:#a8abb0}.darkmode .st-filter button:hover{color:#f5f5f7}.darkmode .st-filter button.is-on{background:#f5f5f7;color:#000}
.darkmode .home-stack .st-big{background:#131417;color:#f5f5f7;box-shadow:inset 0 0 0 1px rgba(255,255,255,.07)}
.darkmode .home-stack .st-big__logo{background:transparent}
/* near-black logos get a light version in dark mode; the hue turn keeps brand colours (AWS orange) close */
.darkmode .home-stack .st-big__logo img.is-inv{filter:invert(1) hue-rotate(180deg)}
.darkmode .home-stack .st-big:hover{background:#1a1b1f;box-shadow:inset 0 0 0 1px rgba(255,255,255,.16)}
.darkmode .home-stack .st-big:hover .st-big__logo{background:transparent}
@media (max-width:767px){.st-big{width:13.6rem;height:13.6rem;gap:1.2rem}.st-big__logo{width:5.6rem;height:5.6rem}.st-big__logo img{width:4.4rem;height:4.4rem}.st-big__name{font-size:1.3rem}.st-filter{display:flex;flex-wrap:nowrap;overflow-x:auto;border-radius:1.2rem;scrollbar-width:none}.st-filter button{white-space:nowrap}}
@media (prefers-reduced-motion:reduce){.st45__run{animation:none}}

/* dark mode */
.darkmode .home-stack{background:var(--color-black-fixed,#000);color:#f5f5f7}

}
@media (max-width:767px){.home-stack{padding:6rem 0}}

/* ---------- holo scenes (service visuals) ---------- */
.home-caps__visual{background-color:#0a0a0b}
.holo{position:absolute;inset:0;padding:6.4rem 3.6rem 3.6rem;display:grid;place-items:center}
.holo svg{width:100%;height:100%;overflow:visible;font-family:Montserrat,"Montserrat Fallback",sans-serif}
.home-caps__panel:not(.is-active) .holo *{animation-play-state:paused!important}
.holo-cap{position:absolute;left:2rem;top:2rem;display:inline-flex;align-items:center;gap:.8rem;font-size:1.25rem;font-weight:600;color:#fff;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);border-radius:.6rem;padding:.7rem 1.1rem}
.holo-cap i{width:.7rem;height:.7rem;border-radius:50%;background:var(--ha-red);animation:haPulseR 2s infinite}
.hl-panel rect{fill:rgba(255,255,255,.035);stroke:rgba(255,255,255,.42);stroke-width:1.2}
.hl-panel.hl-r rect{fill:rgba(10,74,54,.42);stroke:#fd3a30;stroke-width:1.4}
.hl-title{fill:rgba(255,255,255,.88);font-size:10.5px;font-weight:600;letter-spacing:.18em}
.hl-label{fill:rgba(255,255,255,.85);font-size:12px;font-weight:600}
.hl-small{fill:rgba(255,255,255,.55);font-size:10.5px;font-weight:500}
.hl-avatar{fill:#fff;font-size:11px;font-weight:700}
.hl-flow{fill:none;stroke-width:1.3;stroke-dasharray:3 5;opacity:.75;animation:hlDash 1.2s linear infinite}
@keyframes hlDash{to{stroke-dashoffset:-16}}
.hl-link{stroke:rgba(255,255,255,.32);stroke-width:1}.hl-link.faint{stroke:rgba(255,255,255,.1)}
.hl-node circle{fill:#0a0b0c;stroke:rgba(255,255,255,.62);stroke-width:1.2}
.hl-node.hl-r circle{fill:#fd3a30;stroke:#ff8a83}
.hl-core polygon,.hl-core circle{fill:#fd3a30;stroke:#ff8a83;stroke-width:1.5}
.hl-core{transform-box:fill-box;transform-origin:center;animation:hlBreath 3s ease-in-out infinite}
.hl-core text{fill:#fff;font-size:28px;font-weight:700;font-family:var(--ha-display)}
@keyframes hlBreath{0%,100%{transform:scale(1)}50%{transform:scale(1.06)}}
.hl-orbit{fill:none;stroke:rgba(255,255,255,.16);stroke-width:1;stroke-dasharray:2 6}
.hl-orbit.spin{transform-box:fill-box;transform-origin:center;animation:hlSpin 40s linear infinite}
@keyframes hlSpin{to{transform:rotate(360deg)}}
.hl-line rect{fill:rgba(255,255,255,.2)}
.hl-type rect{fill:rgba(255,255,255,.6);transform-box:fill-box;transform-origin:left;animation:hlType 6s infinite;animation-delay:calc(var(--i) * .35s)}
@keyframes hlType{0%{transform:scaleX(0)}12%,88%{transform:scaleX(1)}96%,100%{transform:scaleX(0)}}
.hl-rows rect{fill:rgba(255,255,255,.14)}
.hl-rows .is-new{animation:hlNew 5s infinite}
@keyframes hlNew{0%,40%{fill:rgba(255,255,255,.14)}50%,90%{fill:#fd3a30}100%{fill:rgba(255,255,255,.14)}}
.hl-pop{transform-box:fill-box;transform-origin:center;animation:hlPop 5s var(--ha-ease) infinite}
@keyframes hlPop{0%,50%{transform:scale(0);opacity:0}60%,92%{transform:scale(1);opacity:1}100%{transform:scale(0);opacity:0}}
.hl-step{fill:none;stroke:#fd3a30;stroke-width:2.4;opacity:0;animation:hlStep 4s infinite;animation-delay:calc(var(--i) * .8s)}
@keyframes hlStep{0%,100%{opacity:0}5%,22%{opacity:1}35%{opacity:0}}
.hl-pt{fill:rgba(255,255,255,.42);animation:hlTw 3s ease-in-out infinite;animation-delay:calc(var(--i) * .3s)}
.hl-pt.is-hit{fill:#fd3a30}
@keyframes hlTw{0%,100%{opacity:.35}50%{opacity:1}}
.hl-ping{fill:none;stroke:#fd3a30;stroke-width:1.5;transform-box:fill-box;transform-origin:center;animation:hlPing 2.4s ease-out infinite}
@keyframes hlPing{0%{transform:scale(.6);opacity:1}100%{transform:scale(3);opacity:0}}
.hl-cites g{opacity:0;animation:hlIn 6s infinite;animation-delay:calc(2.2s + var(--i) * .4s)}
.hl-cites rect,.hl-evals rect{fill:rgba(10,74,54,.75);stroke:rgba(255,255,255,.3)}
.hl-cites text,.hl-evals text{fill:#fff;font-size:10.5px;font-weight:600}
.hl-evals g{opacity:0;animation:hlIn 6s infinite;animation-delay:calc(2.4s + var(--i) * .35s)}
@keyframes hlIn{0%{opacity:0}8%,85%{opacity:1}95%,100%{opacity:0}}
.hl-bar{fill:rgba(255,255,255,.42);transform-box:fill-box;transform-origin:bottom;animation:hlGrow 5s var(--ha-ease) infinite;animation-delay:calc(var(--i) * .12s)}
.hl-bar.is-red{fill:#fd3a30}
@keyframes hlGrow{0%{transform:scaleY(0)}18%,86%{transform:scaleY(1)}96%,100%{transform:scaleY(0)}}
.hl-spark{fill:none;stroke:#fd3a30;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:240;stroke-dashoffset:240;animation:hlDraw 5s infinite}
@keyframes hlDraw{0%{stroke-dashoffset:240}30%,88%{stroke-dashoffset:0}98%,100%{stroke-dashoffset:240}}
.hl-neuron{fill:#0a0b0c;stroke:rgba(255,255,255,.7);stroke-width:1.2;animation:hlFire 2.4s infinite;animation-delay:calc(var(--i) * .35s)}
@keyframes hlFire{0%,100%{fill:#0a0b0c}15%,30%{fill:#fd3a30}}
.hl-app rect{fill:rgba(255,255,255,.05);stroke:rgba(255,255,255,.22);opacity:0;animation:hlIn 7s infinite;animation-delay:calc(var(--i) * .2s)}
.hl-app rect.side{fill:rgba(10,74,54,.6)}
.hl-app circle{fill:rgba(255,255,255,.35)}
.hl-spark.draw{animation-duration:7s;animation-delay:1.4s}
.hl-lane{fill:rgba(255,255,255,.035);stroke:rgba(255,255,255,.12)}
.hl-card{fill:rgba(255,255,255,.14)}
.hl-ticket{fill:#fd3a30;animation:hlTicket 6s var(--ha-ease) infinite}
@keyframes hlTicket{0%,15%{transform:translateX(0)}30%,50%{transform:translateX(70px)}65%,92%{transform:translateX(140px)}100%{transform:translateX(0)}}
.hl-belt{fill:rgba(255,255,255,.12)}
.hl-part{fill:rgba(255,255,255,.1);stroke:rgba(255,255,255,.35)}
.hl-box rect{fill:none;stroke:#6fcf97;stroke-width:1.6;opacity:0;animation:hlIn 6s infinite;animation-delay:calc(.6s + var(--i) * .5s)}
.hl-box text{fill:#6fcf97;font-size:10px;font-weight:700;opacity:0;animation:hlIn 6s infinite;animation-delay:calc(.6s + var(--i) * .5s)}
.hl-box.is-red rect{stroke:#fd3a30}.hl-box.is-red text{fill:#fd3a30}
.hl-defect{fill:#fd3a30;animation:hlTw 1.6s ease-in-out infinite}
.hl-scan{fill:#fd3a30;opacity:.8;animation:hlScan 3s ease-in-out infinite}
@keyframes hlScan{0%{transform:translateY(0)}50%{transform:translateY(240px)}100%{transform:translateY(0)}}
.hl-cites rect.is-red{fill:rgba(253,58,48,.25);stroke:#fd3a30}
@media (prefers-reduced-motion:reduce){.holo *{animation:none!important}}

/* enquiry popup: full-bleed founder portrait on black, statement quote and proof figures */
.popup .popupscroll.has-aside{width:min(104rem,94vw)!important;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);border-radius:var(--ha-r);overflow:hidden auto}
.popup-aside.has-photo{position:relative;overflow:hidden;padding:0;gap:0;min-height:62rem;background:#0b0b0c;justify-content:flex-end}
.popup-aside.has-photo .popup-aside__photo{position:absolute;inset:0;width:100%;height:100%;max-height:none;border-radius:0;object-fit:cover;object-position:50% 12%;transform:none}
.popup-aside.has-photo:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(11,11,12,0) 30%,rgba(11,11,12,.72) 55%,#0b0b0c 78%);pointer-events:none}
.has-photo .popup-aside__body{position:relative;z-index:1;margin:0;padding:0 4.4rem 4.4rem;gap:0;background:none;box-shadow:none;border:0;-webkit-backdrop-filter:none;backdrop-filter:none}
.has-photo .popup-aside__quote{position:relative;margin:0 0 2.4rem;padding:0;border:0;font-family:var(--ha-display);font-weight:700;font-size:3.4rem;line-height:1.12;letter-spacing:-.025em;color:#fff}
.has-photo .popup-aside__quote:before{content:"\201C";display:block;height:3.6rem;margin-bottom:.4rem;font-size:7.2rem;line-height:1;color:var(--ha-red)}
.has-photo .popup-aside__quote p{margin:0}
.has-photo .popup-aside__who{flex-direction:row;align-items:baseline;flex-wrap:wrap;gap:.4rem 1rem;margin:0;font-size:1.4rem;color:rgba(255,255,255,.6)}
.has-photo .popup-aside__who strong{font-size:1.6rem;font-weight:600;color:#fff}
.has-photo .popup-aside__who span{background:none;padding:0;border-radius:0;color:rgba(255,255,255,.6);font-size:1.4rem}
.popup-aside__proof{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2rem;margin:3.2rem 0 0;padding:2.4rem 0 0;border-top:1px solid rgba(255,255,255,.14)}
.popup-aside__proof dt{font-family:var(--ha-display);font-size:2.2rem;font-weight:700;letter-spacing:-.02em;line-height:1.1;color:#fff;white-space:nowrap}
.popup-aside__proof dd{margin:.4rem 0 0;font-size:1.25rem;line-height:1.35;color:rgba(255,255,255,.55)}
.has-aside #form{display:flex;flex-direction:column;justify-content:center;padding:6.4rem 5.6rem 4.8rem}
.popup .has-aside h4{font-size:3.6rem!important;margin-bottom:1.2rem!important}
.has-aside #new_proposal_form{gap:3.2rem 3.2rem}
.darkmode .popup-aside.has-photo{background:#0b0b0c}
@media (max-width:767px){
  .popup .popupscroll.has-aside{grid-template-columns:1fr;width:94vw!important}
  .popup-aside.has-photo{min-height:30rem;flex-direction:column;align-items:stretch;padding:0}
  .popup-aside.has-photo .popup-aside__photo{position:absolute;inset:0;width:100%;height:100%;border-radius:0}
  .popup-aside.has-photo:after{background:linear-gradient(180deg,rgba(11,11,12,0) 20%,rgba(11,11,12,.8) 62%,#0b0b0c 90%)}
  .has-photo .popup-aside__body{position:relative;padding:0 2.4rem 2.4rem}
  .has-photo .popup-aside__quote{font-size:2.2rem;margin-bottom:1.2rem}
  .has-photo .popup-aside__quote:before{font-size:5rem;height:2.6rem}
  .popup-aside__proof{display:none}
  .has-aside #form{padding:3.2rem 2.4rem}
  .popup .has-aside h4{font-size:2.6rem!important}
}


/* ---------- who we are ---------- */
.home-summary{padding:9rem 0 6rem;background:#fff}
.who{text-align:center}
.who-kicker{display:inline-flex;align-items:center;gap:.8rem;margin:0 0 2.8rem;font-size:1.4rem;font-weight:600;color:var(--ha-ink)}
.who-kicker svg{color:var(--ha-red)}
.who-title{margin:0 auto;font-family:var(--ha-display);font-size:6.4rem;line-height:1.24;font-weight:700;letter-spacing:-.04em;color:var(--ha-ink);max-width:18ch;text-wrap:balance}
.who-title em{font-style:normal;color:var(--ha-red)}
.who-sub{margin:3.2rem auto 0;font-size:2rem;line-height:1.6;color:var(--ha-muted);max-width:58ch}
.who-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:4rem;margin:8rem 0 0}
.who-stat{position:relative;outline:0;cursor:default}
.who-num{position:relative;display:inline-flex;align-items:flex-start;justify-content:center;padding-bottom:1.4rem;font-family:var(--ha-display);font-size:9.6rem;line-height:1;font-weight:300;letter-spacing:-.05em;color:var(--ha-ink);font-variant-numeric:tabular-nums}
.who-num em{font-style:normal;font-weight:300;line-height:1.2;margin:-.1em 0}
.who-num:after{content:"";position:absolute;left:50%;bottom:0;width:4rem;height:2px;background:var(--ha-red);transform:translateX(-50%) scaleX(.25);opacity:.4;transition:transform .45s var(--ha-ease),opacity .3s}
.who-label{margin:1.6rem 0 0;font-size:1.2rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:#8e8e93}
.who-proof{margin:1.2rem auto 0;max-width:24ch;font-size:1.45rem;line-height:1.45;font-weight:500;color:var(--ha-ink);opacity:0;transform:translateY(-.6rem);transition:opacity .35s,transform .45s var(--ha-ease)}
.who-stat:hover .who-num:after,.who-stat:focus-visible .who-num:after{transform:translateX(-50%) scaleX(1);opacity:1}
.who-stat:hover .who-proof,.who-stat:focus-visible .who-proof{opacity:1;transform:none}
.who-stat:focus-visible{outline:2px solid var(--ha-red);outline-offset:.8rem;border-radius:.6rem}
.who-links{display:flex;align-items:center;justify-content:center;gap:1rem 2.4rem;flex-wrap:wrap;margin:6.4rem 0 0;padding:3.2rem 0 0;list-style:none;border-top:1px solid rgba(0,0,0,.1)}
.who-links a{display:inline-flex;align-items:center;gap:.8rem;font-size:1.6rem;font-weight:600;color:var(--ha-ink);text-decoration:none}
.who-links a:after{content:"→";color:var(--ha-red);transition:transform .25s}
.who-links a:hover:after{transform:translateX(4px)}
/* verbs act out what they say (final state by default; .fx-ready + .is-in plays it) */
.vb{position:relative;display:inline-block}
.vb-see:before{content:"";position:absolute;inset:-.06em -.12em -.02em;border:2px solid var(--ha-red);border-radius:.12em;pointer-events:none}
.vb-see i{position:absolute;left:-.12em;bottom:100%;margin-bottom:.1em;font-style:normal;font-family:var(--ha-display);font-size:1.3rem;font-weight:600;letter-spacing:.02em;line-height:1;white-space:nowrap;color:#fff;background:var(--ha-red);padding:.4rem .7rem;border-radius:.4rem .4rem .4rem 0}
.vb-read{background:linear-gradient(rgba(10,74,54,.14),rgba(10,74,54,.14)) 0 0/100% 100% no-repeat;border-radius:.1em}
.vb-read:after{content:"";position:absolute;top:-.04em;bottom:-.04em;left:100%;width:2px;background:var(--ha-green);opacity:0}
.vb-act i{position:absolute;right:-.42em;top:.02em;width:.4em;height:.4em;border-radius:50%;background:var(--ha-green)}
.vb-act i:after{content:"";position:absolute;left:32%;top:20%;width:24%;height:42%;border:solid #fff;border-width:0 .07em .07em 0;transform:rotate(45deg)}
.fx-ready .vb-see:before{clip-path:inset(0 100% 100% 0);transition:clip-path .7s var(--ha-ease) .3s}
.fx-ready .vb-see i{opacity:0;transform:translateY(.4rem);transition:opacity .3s .9s,transform .4s var(--ha-ease) .9s}
.fx-ready .vb-read{background-size:0 100%;transition:background-size .8s var(--ha-ease) 1.3s}
.fx-ready .vb-read:after{left:0;transition:left .8s var(--ha-ease) 1.3s,opacity .2s 1.3s}
.fx-ready .vb-act i{transform:scale(0);transition:transform .45s cubic-bezier(.34,1.56,.64,1) 2.2s}
.fx-ready.is-in .vb-see:before{clip-path:inset(0)}
.fx-ready.is-in .vb-see i{opacity:1;transform:none}
.fx-ready.is-in .vb-read{background-size:100% 100%}
.fx-ready.is-in .vb-read:after{left:100%;opacity:0;transition:left .8s var(--ha-ease) 1.3s,opacity .3s 2s}
.fx-ready.is-in .vb-act i{transform:scale(1)}
/* rolling digits */
.roll{display:inline-block;height:1.2em;overflow:hidden;vertical-align:top;line-height:1.2;margin:-.1em 0;-webkit-mask-image:linear-gradient(transparent,#000 22%,#000 78%,transparent);mask-image:linear-gradient(transparent,#000 22%,#000 78%,transparent)}
.roll__s{display:flex;flex-direction:column;transform:translateY(calc(var(--d) * -1.2em))}
.roll__s span{display:block;height:1.2em;line-height:1.2}
.roll__c{display:inline-block;line-height:1.2;vertical-align:top;margin:-.1em 0}
.fx-ready .roll__s{transform:translateY(0);transition:transform 1.8s cubic-bezier(.16,1,.3,1);transition-delay:calc(.15s + var(--i) * .12s)}
.fx-ready.is-in .roll__s{transform:translateY(calc(var(--d) * -1.2em))}
@media (hover:none){.who-proof{opacity:1;transform:none}.who-num:after{transform:translateX(-50%) scaleX(1);opacity:1}}
@media (max-width:1199px){.who-stats{grid-template-columns:1fr 1fr;row-gap:5.6rem}.who-num{font-size:7.2rem}.who-title{font-size:5.2rem}}
@media (max-width:767px){
  .home-summary{padding:8rem 0 5.6rem}
  .who-title{font-size:3.8rem;line-height:1.3}.who-sub{font-size:1.7rem}
  .vb-see i{display:none}
  .who-stats{gap:4rem 2rem;margin-top:5.6rem}.who-num{font-size:5.6rem}
}
@media (prefers-reduced-motion:reduce){.who-proof,.who-num:after{transition:none}}
.darkmode .home-summary{background:var(--color-black-fixed,#000)}
.darkmode .who-kicker,.darkmode .who-title,.darkmode .who-num,.darkmode .who-proof,.darkmode .who-links a{color:#f5f5f7}
.darkmode .who-links{border-color:rgba(255,255,255,.12)}

/* ---------- hero (new homepage only: section gets .hx) — flat white, giant type, image on a forest-green stage ---------- */
.vocso-main-hero-banner.hx{background:#fff;animation:none;padding:5.6rem 0 5.6rem}
.vocso-main-hero-banner.hx:after{display:none}
.hx .dynamic-heading .heading h1,.hx .dynamic-heading .heading h2{font-family:var(--ha-display);font-size:7.6rem!important;line-height:.98!important;letter-spacing:-.05em;font-weight:700!important;color:var(--ha-ink);margin-top:2.4rem;max-width:9.5em}
.hx .hero-slide-subtitle{font-size:1.9rem;line-height:1.6;color:var(--ha-muted);max-width:54ch;margin-top:2.4rem}
.hx .dynamic-heading{min-height:42rem;max-height:none;margin-bottom:2.4rem}
.hx .getstarted-block a{border-radius:99rem;padding:2rem 5.6rem 2rem 3rem}
.hx .getstarted-block a:after{display:none}
.hx .hero-figure{position:relative;isolation:isolate}
.hx .hero-figure:before{content:"";position:absolute;z-index:-1;left:6%;right:0;top:9%;bottom:0;border-radius:var(--ha-r);background:var(--ha-green)}
.hx .hero-figure:before{transition:opacity .6s var(--ha-ease)}
/* the green stage sits behind the people cutouts only; the vision photo and the BI visual carry their own design */
.hx .hero-figure:has(.slider-image:nth-of-type(2).active):before,.hx .hero-figure:has(.slider-image:nth-of-type(3).active):before{opacity:0}
.hx .slider-image{position:relative;z-index:1}
.hx .slider-image:not(.active){position:absolute;inset:0}
/* dark mode: the cutouts carry a soft white glow made for a white page; swap in copies with the glow taken out */
.darkmode .hx .slider-image:nth-of-type(1){content:url(/media/hero/software-engineering-hero-dark.webp)}
.darkmode .hx .slider-image:nth-of-type(3){content:url(/media/hero/conversational-bi-hero-dark.webp)}
.darkmode .hx .slider-image:nth-of-type(4){content:url(/media/hero/dedicated-teams-hero-dark.webp)}
/* computer vision slide: a wide image, so centre it in the figure and let it grow past the column a little on desktop */
@media (min-width:1200px){.hx .slider-image:nth-of-type(2){transform:scale(1.12);transform-origin:30% 50%}.hx .slider-image:nth-of-type(2).active{align-self:center}}
.hx .hero-main-tabs{border-radius:0;margin-top:3.2rem;border-top:1px solid rgba(0,0,0,.1)}
.hx .hero-main-tabs .tab{background:transparent!important;border-right:0;border-radius:0!important;overflow:visible!important;padding:2.4rem 2.4rem 0 0;font-size:1.6rem;opacity:.55;transition:opacity .3s}
.hx .hero-main-tabs .tab.active,.hx .hero-main-tabs .tab:hover{opacity:1}
.hx .hero-main-tabs .tab svg{width:3.2rem;height:3.2rem;margin-right:1.4rem}
.hx .hero-main-tabs .tab p{margin:0;color:var(--ha-ink);line-height:1.3}
.hx .progress-bar{top:-1px;bottom:auto;height:2px;background:var(--ha-green)}
@media (max-width:1366px){.hx .dynamic-heading .heading h1,.hx .dynamic-heading .heading h2{font-size:6.4rem!important}.hx .dynamic-heading{min-height:38rem}}
@media (max-width:1199px){.hx .dynamic-heading .heading h1,.hx .dynamic-heading .heading h2{font-size:5.6rem!important}.hx .dynamic-heading{min-height:34rem}}
@media (max-width:767px){
  .vocso-main-hero-banner.hx{padding:7.2rem 0 4rem}
  .hx .dynamic-heading .heading h1,.hx .dynamic-heading .heading h2{font-size:3.8rem!important;line-height:1.05!important}
  .hx .dynamic-heading{min-height:30rem}
  .hx .hero-slide-subtitle{font-size:1.6rem}
  .hx .hero-main-tabs .tab{padding:1.6rem 1rem 0 0;font-size:1.3rem}.hx .hero-main-tabs .tab svg{width:2.4rem;height:2.4rem;margin-right:.8rem}
}
.darkmode .vocso-main-hero-banner.hx{background:var(--color-black-fixed,#000)}
.darkmode .hx .dynamic-heading .heading h1,.darkmode .hx .dynamic-heading .heading h2,.darkmode .hx .hero-main-tabs .tab p{color:#f5f5f7}
.darkmode .hx .hero-main-tabs{border-top-color:rgba(255,255,255,.18)}
.darkmode .vocso-main-hero-banner.hx .hero-figure:before{background:var(--ha-green)}

/* ---------- engagement (white; five steps on one line, then the add-engineers strip) ---------- */
.home-eng{padding:9rem 0;background:#fff;color:var(--ha-ink)}
.home-eng .home-head .home-btn{margin-top:2.8rem}
.home-eng__steps{position:relative;list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(var(--n,5),minmax(0,1fr));gap:2.4rem}
.home-eng__steps:before,.home-eng__steps:after{content:"";position:absolute;left:2.2rem;right:2.2rem;top:2.2rem;height:2px;border-radius:2px}
.home-eng__steps:before{background:var(--ha-line)}
.home-eng__steps:after{background:var(--ha-green);transform-origin:left;transform:scaleX(0);transition:transform 2s cubic-bezier(.4,0,.2,1) .2s}
.is-in .home-eng__steps:after{transform:none}
.home-eng__step{position:relative;display:flex;flex-direction:column;gap:1rem;padding-top:7.2rem}
.home-eng__node{position:absolute;top:0;left:0;z-index:1;display:grid;place-items:center;width:4.4rem;height:4.4rem;border-radius:50%;background:#fff;box-shadow:inset 0 0 0 2px var(--ha-line);
  font:700 1.3rem/1 var(--ha-display);font-variant-numeric:tabular-nums;color:var(--ha-muted);transition:background .45s ease,color .45s ease,box-shadow .45s ease;transition-delay:calc(.3s + var(--i) * .38s)}
.is-in .home-eng__node{background:var(--ha-green);color:#fff;box-shadow:0 0 0 .6rem #fff}
.home-eng__label{font-size:1.15rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--ha-green)}
.home-eng__step h3{font-family:var(--ha-display);font-size:2.2rem;font-weight:700;line-height:1.15;letter-spacing:-.02em;margin:0;color:var(--ha-ink)}
.home-eng__step p{font-size:1.5rem;line-height:1.6;color:var(--ha-muted);margin:.2rem 0 0}
.home-eng__alt{display:flex;align-items:center;justify-content:space-between;gap:3.2rem;margin-top:6.4rem;padding:3.2rem 4rem;border-radius:var(--ha-r);text-decoration:none;color:#fff;
  background:radial-gradient(70% 140% at 100% 0%,rgba(159,240,122,.16),transparent 60%),var(--ha-green);transition:transform .45s cubic-bezier(.2,.8,.2,1),box-shadow .45s ease}
.home-eng__alt:hover{color:#fff;text-decoration:none;transform:translateY(-.4rem);box-shadow:0 2.4rem 4.8rem -3.2rem rgba(10,74,54,.6)}
.home-eng__alt-copy{display:flex;flex-direction:column;gap:.6rem}
.home-eng__alt-copy strong{font-family:var(--ha-display);font-size:2.6rem;font-weight:700;letter-spacing:-.025em;line-height:1.15}
.home-eng__alt-copy span{font-size:1.6rem;line-height:1.55;color:rgba(255,255,255,.78)}
.home-eng__alt-go{flex:none;display:inline-flex;align-items:center;gap:1rem;padding:1.4rem 2.2rem;border-radius:10rem;background:#fff;color:var(--ha-green);font-size:1.5rem;font-weight:700;transition:background .3s,color .3s}
.home-eng__alt-go i{display:grid;transition:transform .35s cubic-bezier(.2,.8,.2,1)}
.home-eng__alt:hover .home-eng__alt-go{background:#9ff07a}
.home-eng__alt:hover .home-eng__alt-go i{transform:translateX(.4rem)}
.darkmode .home-eng{background:var(--color-black-fixed,#000);color:#f5f5f7}
.darkmode .home-eng__node{background:#16171a}.darkmode .is-in .home-eng__node{background:var(--ha-green);box-shadow:0 0 0 .6rem #000}
.darkmode .home-eng__step h3{color:#f5f5f7}.darkmode .home-eng__label{color:#7fd6a2}
@media (max-width:1199px){
  .home-eng__steps{grid-template-columns:1fr;gap:0}
  .home-eng__steps:before,.home-eng__steps:after{left:2.1rem;right:auto;top:2.2rem;bottom:2.2rem;width:2px;height:auto}
  .home-eng__steps:after{transform:scaleY(0);transform-origin:top}
  .is-in .home-eng__steps:after{transform:none}
  .home-eng__step{padding:0 0 4rem 7.2rem}
  .home-eng__step:last-child{padding-bottom:0}
}
@media (max-width:767px){
  .home-eng{padding:6rem 0}
  .home-eng__alt{flex-direction:column;align-items:flex-start;padding:2.8rem}
}
@media (prefers-reduced-motion:reduce){.home-eng__steps:after,.home-eng__node,.home-eng__alt{transition:none}}

/* ---------- selected work (case studies led by their results; preview: data-v picks a concept) ---------- */
.home-work{position:relative;padding:9rem 0;background:#fff;color:var(--ha-ink)}
.wk-all{display:inline-flex;align-items:center;gap:.8rem;margin-top:2.4rem;font-size:1.6rem;font-weight:600;color:var(--ha-ink);text-decoration:none;border-bottom:1.5px solid currentColor;padding-bottom:.3rem}
.wk-all:hover{color:var(--ha-red);text-decoration:none}
.wk-meta{display:flex;align-items:center;flex-wrap:wrap;gap:1rem;font-size:1.3rem;font-weight:600;color:rgba(255,255,255,.72)}
.wk-meta b{font:700 1.3rem/1 var(--ha-display);color:#fff;font-variant-numeric:tabular-nums}
.wk-meta i{width:.4rem;height:.4rem;border-radius:50%;background:currentColor;opacity:.6}
.wk-link{display:inline-flex;align-items:center;gap:1rem;width:max-content;padding:1.4rem 2.2rem;border-radius:10rem;background:#fff;color:var(--c,#111);font-size:1.5rem;font-weight:700;text-decoration:none;transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s ease}
.wk-link:hover{color:var(--c,#111);text-decoration:none;transform:translateY(-.2rem);box-shadow:0 1.6rem 3.2rem -1.6rem rgba(0,0,0,.45)}
.wk-link span{display:grid;transition:transform .35s cubic-bezier(.2,.8,.2,1)}
.wk-link:hover span{transform:rotate(45deg)}
/* browser frame */
.wk-frame{display:block;border-radius:1rem;overflow:hidden;background:#fff;box-shadow:0 3.2rem 6.4rem -3.2rem rgba(0,0,0,.5),0 0 0 1px rgba(0,0,0,.06)}
.wk-frame__bar{display:flex;align-items:center;gap:.6rem;height:3.6rem;padding:0 1.4rem;background:#f3f4f6;border-bottom:1px solid #e5e7eb}
.wk-frame__bar i{width:1rem;height:1rem;border-radius:50%;background:#d6d8dc}
.wk-frame__bar i:nth-child(1){background:#ff5f57}.wk-frame__bar i:nth-child(2){background:#febc2e}.wk-frame__bar i:nth-child(3){background:#28c840}
.wk-frame__bar span{margin-left:1.2rem;padding:.4rem 1.2rem;border-radius:.6rem;background:#fff;font-size:1.15rem;font-weight:500;color:#6b7280}
.wk-frame__view{display:block;position:relative;overflow:hidden}
.wk-frame__view img{display:block;width:100%;height:auto}

/* stacked showcase: wide cards that stick and stack as the page scrolls */
.wk1{list-style:none;margin:0 calc(50% - min(80rem, 50vw - 3.2rem));padding:0;display:grid;gap:3.2rem}
.wk1__card{position:sticky;top:11rem;transform-origin:50% 0;transform:scale(calc(1 - var(--s,0) * .07));display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);gap:8rem;align-items:center;min-height:66rem;padding:8rem 8rem;border-radius:var(--ha-r);
  background:var(--c);color:#fff;will-change:transform}
/* stacking: every card sticks at the same top, so nothing peeks out; as the next card slides over, the one
   behind shrinks a little and dims (--s from 0 to 1, set by the script) */
.wk1__card:after{content:"";position:absolute;inset:0;z-index:3;border-radius:inherit;background:#000;opacity:calc(var(--s,0) * .5);pointer-events:none}
.wk1__card:last-child{margin-bottom:0}
.wk1__copy{display:flex;flex-direction:column;gap:3.2rem;min-width:0}
.wk1__copy h3{font-family:var(--ha-display);font-size:4.8rem;font-weight:700;line-height:1.05;letter-spacing:-.04em;margin:0;color:#fff;text-wrap:balance}
.wk-metrics{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:3.2rem;margin:0;padding-top:3.2rem;border-top:1px solid rgba(255,255,255,.18)}
.wk-metrics div{display:flex;flex-direction:column;gap:.8rem}
.wk-metrics dt{font-family:var(--ha-display);font-size:6.4rem;font-weight:700;line-height:.95;letter-spacing:-.05em;color:#fff}
.wk-metrics dd{margin:0;font-size:1.5rem;line-height:1.45;color:rgba(255,255,255,.7)}
.wk1__screen .wk-frame__view{height:52rem}
.wk1__screen img{transition:transform 6s cubic-bezier(.45,0,.55,1)}
.wk1__card:hover .wk1__screen img{transform:translateY(calc(-100% + 52rem))}

/* dark mode */
.darkmode .home-work{background:var(--color-black-fixed,#000);color:#f5f5f7}
.darkmode .wk-all{color:#f5f5f7}

@media (max-width:1199px){
  .wk1{margin:0}
  .wk1__card{grid-template-columns:1fr;gap:4rem;padding:5.6rem;min-height:0}
  .wk1__screen .wk-frame__view{height:38rem}
  .wk1__card:hover .wk1__screen img{transform:translateY(calc(-100% + 38rem))}
}
@media (max-width:767px){
  .home-work{padding:6rem 0}
  .wk1__card{position:relative;top:auto;transform:none;padding:3.2rem;gap:3.2rem}
  .wk1__card:after{display:none}
  .wk1__copy h3{font-size:3rem}.wk-metrics dt{font-size:4.4rem}
  .wk1__screen .wk-frame__view{height:24rem}
}
@media (prefers-reduced-motion:reduce){.wk1__screen img,.wk-link{transition:none}.wk1__card{transform:none}.wk1__card:after{display:none}}
/* phone mockup for projects with a mobile app, overlapping the browser frame's corner */
.wk1__screen{position:relative}
.wk1__screen.has-phone{padding-right:7rem}
.wk-phone{position:absolute;right:0;bottom:-4rem;z-index:2;width:21rem;aspect-ratio:9/19;padding:.9rem;border-radius:3.4rem;background:#0c0d0f;box-shadow:0 3.2rem 6.4rem -2.4rem rgba(0,0,0,.6),inset 0 0 0 1.5px rgba(255,255,255,.12)}
.wk-phone:before{content:"";position:absolute;top:1.6rem;left:50%;width:7rem;height:2rem;margin-left:-3.5rem;border-radius:2rem;background:#0c0d0f;z-index:2}
.wk-phone__screen{display:block;width:100%;height:100%;border-radius:2.6rem;overflow:hidden;background:#fff}
.wk-phone__screen video,.wk-phone__screen img{display:block;width:100%;height:100%;object-fit:cover;object-position:top}
@media (max-width:1199px){.wk-phone{width:16rem;bottom:-3rem}.wk1__screen.has-phone{padding-right:5rem}}
@media (max-width:767px){.wk-phone{width:11rem;right:-1rem;bottom:-2rem;border-radius:2.4rem;padding:.6rem}.wk-phone__screen{border-radius:1.8rem}.wk-phone:before{width:4.4rem;height:1.2rem;margin-left:-2.2rem;top:1rem}.wk1__screen.has-phone{padding-right:3rem}}

/* ---------------- latest articles (shared blog band, polished for this page only) ---------------- */
.serviceTabBlock.blog.padding-130{padding:9rem 0}
.serviceTabBlock.blog h2{font-family:var(--ha-display);font-weight:700;font-size:5.6rem;line-height:1.08;letter-spacing:-.025em;color:var(--ha-ink);text-align:left;margin:0 0 5.6rem}
.serviceTabBlock.blog h2:before{content:"";display:block;width:4rem;height:4rem;margin-bottom:1.6rem;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' fill='%23fd3a30'%3E%3Cpath d='m13.294 7.436.803 2.23c.892 2.475 2.841 4.424 5.316 5.316l2.23.803c.201.073.201.358 0 .43l-2.23.803c-2.475.892-4.424 2.841-5.316 5.316l-.803 2.23c-.073.201-.358.201-.43 0l-.803-2.23c-.892-2.475-2.841-4.424-5.316-5.316l-2.23-.803c-.201-.073-.201-.358 0-.43l2.23-.803c2.475-.892 4.424-2.841 5.316-5.316l.803-2.23c.072-.202.357-.202.43 0z'/%3E%3Cpath d='m23.332 2.077.407 1.129c.452 1.253 1.439 2.24 2.692 2.692l1.129.407c.102.037.102.181 0 .218l-1.129.407c-1.253.452-2.24 1.439-2.692 2.692l-.407 1.129c-.037.102-.181.102-.218 0l-.407-1.129c-.452-1.253-1.439-2.24-2.692-2.692l-1.129-.407c-.102-.037-.102-.181 0-.218l1.129-.407c1.253-.452 2.24-1.439 2.692-2.692l.407-1.129c.037-.103.182-.103.218 0z'/%3E%3Cpath d='m23.332 21.25.407 1.129c.452 1.253 1.439 2.24 2.692 2.692l1.129.407c.102.037.102.181 0 .218l-1.129.407c-1.253.452-2.24 1.439-2.692 2.692l-.407 1.129c-.037.102-.181.102-.218 0l-.407-1.129c-.452-1.253-1.439-2.24-2.692-2.692l-1.129-.407c-.102-.037-.102-.181 0-.218l1.129-.407c1.253-.452 2.24-1.439 2.692-2.692l.407-1.129c.037-.102.182-.102.218 0z'/%3E%3C/svg%3E") no-repeat center/contain}
.serviceTabBlock.blog .swiper-container{padding:1.2rem 1.2rem 8rem;margin:-1.2rem -1.2rem 0}
.serviceTabBlock.blog .card{height:26rem;padding:3.6rem;border:0;border-radius:var(--ha-r);background:#fff;box-shadow:0 1px 2px rgba(9,9,9,.04),0 .8rem 2.4rem -1.2rem rgba(9,9,9,.14);transition:box-shadow .35s ease,transform .35s cubic-bezier(.2,.8,.2,1)}
.serviceTabBlock.blog .card:before,.serviceTabBlock.blog .card:after{display:none}
.serviceTabBlock.blog .card:hover{box-shadow:0 1px 2px rgba(9,9,9,.04),0 2.4rem 4rem -2rem rgba(9,9,9,.28);transform:translateY(-.4rem)}
.serviceTabBlock.blog .card-body{display:flex;flex-direction:column;height:100%}
.serviceTabBlock.blog .card-text{margin:0}
.serviceTabBlock.blog .card-text a{font-family:var(--ha-display);font-size:2.2rem;line-height:1.3;font-weight:600;letter-spacing:-.02em;color:var(--ha-ink);text-decoration:none;text-wrap:balance;transition:color .25s ease}
.serviceTabBlock.blog .card:hover .card-text a{color:var(--ha-red)}
.serviceTabBlock.blog .readarticle-btn{margin-top:auto;align-self:flex-start;font-size:1.5rem;font-weight:600;color:var(--ha-ink)}
.serviceTabBlock.blog .blog-dotcolor{display:none}
.serviceTabBlock.blog .swiper-scrollbar{height:1px;background:var(--ha-line)}
.serviceTabBlock.blog .swiper-scrollbar-drag{background:var(--ha-ink)}
.serviceTabBlock.blog .swiper-button-prev,.serviceTabBlock.blog .swiper-button-next{width:4.4rem;height:4.4rem;border-radius:50%;box-shadow:inset 0 0 0 1px var(--ha-line);background-size:1.2rem;background-position:center;background-repeat:no-repeat;transition:box-shadow .25s ease}
.serviceTabBlock.blog .swiper-button-prev:hover,.serviceTabBlock.blog .swiper-button-next:hover{box-shadow:inset 0 0 0 1px var(--ha-ink)}
.darkmode .serviceTabBlock.blog h2,.darkmode .serviceTabBlock.blog .card-text a,.darkmode .serviceTabBlock.blog .readarticle-btn{color:#f5f5f7}
.darkmode .serviceTabBlock.blog .card{background:#131417;box-shadow:inset 0 0 0 1px rgba(255,255,255,.07)}
.darkmode .serviceTabBlock.blog .card:hover{background:#1a1b1f;box-shadow:inset 0 0 0 1px rgba(255,255,255,.16)}
.darkmode .serviceTabBlock.blog .swiper-scrollbar{background:#2a2c30}.darkmode .serviceTabBlock.blog .swiper-scrollbar-drag{background:#f5f5f7}
.darkmode .serviceTabBlock.blog .swiper-button-prev,.darkmode .serviceTabBlock.blog .swiper-button-next{box-shadow:inset 0 0 0 1px #2a2c30}
@media (max-width:991px){.serviceTabBlock.blog h2{font-size:4rem}}
@media (max-width:767px){.serviceTabBlock.blog.padding-130{padding:6rem 0}.serviceTabBlock.blog h2{font-size:3.2rem;margin-bottom:3.2rem}.serviceTabBlock.blog .card{height:22rem;padding:2.8rem}.serviceTabBlock.blog .card-text a{font-size:1.9rem}}


/* FAQ: the shared FAQ section (as on the product pages), heading set like there and centred */
.vocso-faq-section.padding-130{padding:9rem 0}
.vocso-faq-section h2{font-family:var(--ha-display);font-size:5.6rem;font-weight:600;line-height:1.2;text-align:center;margin:0}
.vocso-faq-section .vocso-faq-lead{text-align:center;max-width:60ch;margin:1.6rem auto 0;color:var(--ha-muted)}
@media (max-width:991px){.vocso-faq-section h2{font-size:4rem}}
@media (max-width:767px){.vocso-faq-section.padding-130{padding:6rem 0}.vocso-faq-section h2{font-size:3.2rem}}
.vocso-faq-section .vocso-faq-question{min-height:0;padding:2.6rem 3.2rem;font-size:1.9rem;line-height:1.4;letter-spacing:-.01em}
.vocso-faq-section .vocso-faq-answer-inner{padding:0 3.2rem}
.vocso-faq-section .vocso-faq-item.active .vocso-faq-answer-inner{padding-bottom:3.2rem}
.vocso-faq-section .vocso-faq-answer p{font-size:1.6rem;line-height:1.7;font-weight:500}
.vocso-faq-section .vocso-faq-icon{width:1.1rem;height:1.1rem;flex-basis:1.1rem;border-width:1.5px}
@media (max-width:767px){.vocso-faq-section .vocso-faq-question{padding:2rem;font-size:1.7rem}.vocso-faq-section .vocso-faq-answer-inner{padding:0 2rem}}

/* blog band, modern cards: cover, category and read time, title, date with a go arrow */
.bb-modern .swiper-slide{height:auto}
.serviceTabBlock.blog.bb-modern .card.bb-card{display:flex;flex-direction:column;height:100%;padding:0;overflow:hidden;text-decoration:none;color:var(--ha-ink)}
.bb-card__img{display:block;aspect-ratio:1200/630;overflow:hidden;background:#f4f5f6}
.bb-card__img img,.bb-card__img svg{display:block;width:100%;height:100%;object-fit:cover;transition:transform .7s cubic-bezier(.2,.8,.2,1)}
.bb-card:hover .bb-card__img img,.bb-card:hover .bb-card__img svg{transform:scale(1.04)}
.bb-card__body{display:flex;flex-direction:column;gap:1.2rem;flex:1;padding:2.4rem 2.8rem 2.4rem}
.bb-meta{display:flex;align-items:center;gap:.9rem;font-size:1.25rem;font-weight:600;color:#8a8d92}
.bb-meta b{color:var(--ha-red);font-weight:700}
.bb-meta i{width:.35rem;height:.35rem;border-radius:50%;background:currentColor;opacity:.6}
.serviceTabBlock.blog .bb-card__title{font-family:var(--ha-display);font-size:2rem;line-height:1.3;font-weight:600;letter-spacing:-.015em;color:var(--ha-ink);margin:0 0 .8rem;text-wrap:balance;transition:color .25s ease}
.bb-card:hover .bb-card__title{color:var(--ha-red)}
.bb-card__foot{display:flex;align-items:center;justify-content:space-between;margin-top:auto;padding-top:1.6rem;border-top:1px solid var(--ha-line);font-size:1.3rem;font-weight:500;color:#8a8d92}
.bb-go{display:grid;place-items:center;width:3.2rem;height:3.2rem;border-radius:50%;box-shadow:inset 0 0 0 1px var(--ha-line);color:var(--ha-ink);transition:background .25s ease,color .25s ease,box-shadow .25s ease}
.bb-go svg{transition:transform .35s cubic-bezier(.2,.8,.2,1)}
.bb-card:hover .bb-go{background:var(--ha-red);color:#fff;box-shadow:none}
.bb-card:hover .bb-go svg{transform:rotate(45deg)}
.darkmode .serviceTabBlock.blog.bb-modern .card.bb-card{color:#f5f5f7}
.darkmode .serviceTabBlock.blog .bb-card__title{color:#f5f5f7}.darkmode .bb-card:hover .bb-card__title{color:var(--ha-red)}
.darkmode .bb-card__img{background:#16171a}.darkmode .bb-card__foot{border-top-color:#2a2c30}
.darkmode .bb-go{box-shadow:inset 0 0 0 1px #2a2c30;color:#f5f5f7}.darkmode .bb-card:hover .bb-go{background:var(--ha-red);color:#fff}
@media (max-width:767px){.bb-card__body{padding:2rem}.serviceTabBlock.blog .bb-card__title{font-size:1.8rem}}