/* ===========================================================================
   About page (page-id 62)
   Follows the same authoring convention as post-61.css: every rule is scoped
   to .sts-62 and targets a single .sts-element-<id>. Three section types are
   unique to this page and get their own component blocks at the bottom:
     ab-rgrid/ab-rpromo  "why choose us" icon-box grid + CTA panel
     .sts-beliefs      value cards
     .sts-capabilities labelled tag groups
   =========================================================================== */

/* ------------------------------------------ section top spacing ---------- */
/* The numbered label bars used to carry the leading padding for each section.
   With those removed,
the first block of each section owns that space itself. */
.sts-62 .sts-element.sts-element-ab-st-16fd7a,
.sts-62 .sts-element.sts-element-ab-why-head,
.sts-62 .sts-element.sts-element-ab-believe-head,
.sts-62 .sts-element.sts-element-ab-process,
.sts-62 .sts-element.sts-element-ab-numbers-head {
    --padding-top: 140px;
}

/* ------------------------------------------------------------- 3. WHY US -- */
.sts-62 .sts-element.sts-element-ab-why-head {
    --display: flex;
    --overflow: hidden;
    --margin-bottom: 18px;
}

.sts-62 .sts-element.sts-element-ab-why-h .states-side-heading {
    text-align: center;
    text-transform: capitalize;
    white-space: normal;
}

.sts-62 .sts-element.sts-element-ab-why {
    --display: block;
    --margin-bottom: 40px;
    --padding-top: 22px;
    --padding-bottom: 80px;
}

/* mountain backdrop behind the whole section, as on the home page */
.sts-62 .sts-element.sts-element-ab-why:not(.sts-motion-effects-element-type-background),
.sts-62 .sts-element.sts-element-ab-why > .sts-motion-effects-container > .sts-motion-effects-layer {
    background-image: url("../images/mountain.webp");
    background-position: bottom right;
    background-repeat: no-repeat;
    background-size: cover;
}

/* --------------------------------------------------------- 4. OUR STORY -- */
.sts-62 .sts-element.sts-element-ab-story {
    --display: flex;
    --flex-direction: row;
    --container-widget-width: initial;
    --container-widget-height: 100%;
    --container-widget-flex-grow: 1;
    --container-widget-align-self: stretch;
    --flex-wrap-mobile: wrap;
    --align-items: flex-start;
    --gap: 60px 60px;
    --row-gap: 60px;
    --column-gap: 60px;
    --padding-top: 140px;
    --padding-bottom: 140px;
}

.sts-62 .sts-element.sts-element-ab-story:not(.sts-motion-effects-element-type-background),
.sts-62 .sts-element.sts-element-ab-story > .sts-motion-effects-container > .sts-motion-effects-layer {
    background-color: #FFFFFF;
}

.sts-62 .sts-element.sts-element-ab-story-l,
.sts-62 .sts-element.sts-element-ab-story-r {
    --display: flex;
    --flex-direction: column;
    --gap: 34px 34px;
    --row-gap: 34px;
    --column-gap: 34px;
    --overflow: hidden;
}

.sts-62 .sts-element.sts-element-ab-story-h .states-side-heading {
    text-transform: capitalize;
    white-space: normal;
    color: #000000;
}

.sts-62 .sts-element.sts-element-ab-story-r { --padding-top: 14px; }

.sts-62 .sts-element.sts-element-ab-story-b1 .states-side-heading,
.sts-62 .sts-element.sts-element-ab-story-b2 .states-side-heading {
    white-space: normal;
    color: rgba(0, 0, 0, .68);
}

/* ------------------------------------------------------ 5. WHAT WE BELIEVE -- */
.sts-62 .sts-element.sts-element-ab-believe-head {
    --display: flex;
    --overflow: hidden;
    --margin-bottom: 56px;
}

.sts-62 .sts-element.sts-element-ab-believe-h .states-side-heading {
    text-align: center;
    text-transform: capitalize;
    white-space: normal;
}

.sts-62 .sts-element.sts-element-ab-believe { --display: block; }

/* ------------------------------------------------------- 6. HOW WE WORK -- */
.sts-62 .sts-element.sts-element-ab-process {
    --display: flex;
    --flex-direction: column;
    --gap: 56px 56px;
    --row-gap: 56px;
    --column-gap: 56px;
    --padding-bottom: 40px;
}

.sts-62 .sts-element.sts-element-ab-process-h .states-side-heading {
    text-align: center;
    text-transform: capitalize;
    white-space: normal;
}

.sts-62 .sts-element.sts-element-ab-process-cta { text-align: center; }

/* ----------------------------------------------------- 7. INSIDE NUMBERS -- */
.sts-62 .sts-element.sts-element-ab-numbers-head {
    --display: flex;
    --gap: 24px 24px;
    --row-gap: 24px;
    --column-gap: 24px;
    --overflow: hidden;
    --margin-bottom: 54px;
}

.sts-62 .sts-element.sts-element-ab-numbers-h .states-side-heading {
    text-align: center;
    text-transform: capitalize;
    white-space: normal;
}

.sts-62 .sts-element.sts-element-ab-numbers-b .states-side-heading {
    text-align: center;
    white-space: normal;
    max-width: 640px;
    margin-inline: auto;
}

.sts-62 .sts-element.sts-element-ab-stats {
    --display: grid;
    --e-con-grid-template-columns: repeat(3, 1fr);
    --e-con-grid-template-rows: repeat(1, 1fr);
    --gap: 12px 12px;
    --row-gap: 12px;
    --column-gap: 12px;
    --grid-auto-flow: row;
    --align-items: end;
    --overflow: hidden;
    --padding-bottom: 80px;
}

.sts-62 .sts-element.sts-element-ab-stat1 .states-side-counter-card__text-top { margin-bottom: 120px; }
.sts-62 .sts-element.sts-element-ab-stat2 .states-side-counter-card__text-top { margin-bottom: 168px; }
.sts-62 .sts-element.sts-element-ab-stat3 .states-side-counter-card__text-top { margin-bottom: 120px; }

/* --------------------------------------------------------- 8. WHO WE ARE -- */
/* Heading and intro sit left-aligned above a four-column strip naming the
   disciplines, so this section reads differently from the centred
   heading+paragraph pattern used elsewhere on the page. */
.sts-62 .sts-element.sts-element-ab-who {
    --display: flex;
    --gap: 26px 26px;
    --row-gap: 26px;
    --column-gap: 26px;
    --overflow: hidden;
    --padding-top: 40px;
    --padding-bottom: 40px;
    --margin-bottom: 20px;
}

.sts-62 .sts-element.sts-element-ab-who-h .states-side-heading {
    text-align: left;
    text-transform: capitalize;
    white-space: normal;
}

.sts-62 .sts-element.sts-element-ab-who-b .states-side-heading {
    text-align: left;
    white-space: normal;
    max-width: 760px;
}

/* four discipline cards, using the same card treatment as the Why Us grid */
.sts-62 .sts-disciplines {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
    width: 100%;
    margin-top: 26px;
}

.sts-62 .sts-discipline {
    display: flex;
    flex-direction: column;
    gap: 14px;
    padding: 32px 28px 36px;
    background-color: rgba(26, 26, 26, .7);
    border: 1px solid #FFFFFF29;
    border-radius: 14px;
    transition: background-color .35s ease, border-color .35s ease;
}

.sts-62 .sts-discipline:hover {
    background-color: rgba(33, 33, 33, .82);
    border-color: #FFFFFF3D;
}

.sts-62 .sts-discipline__num {
    font-size: 14px;
    font-weight: 600;
    line-height: 1;
    letter-spacing: .08em;
    color: #ffffff;
}

.sts-62 .sts-discipline__title {
    font-size: clamp(17px, 1.35vw, 22px);
    font-weight: 500;
    line-height: 1.2;
    letter-spacing: -.01em;
}

.sts-62 .sts-discipline__text {
    color: #FFFFFF99;
    font-size: 14px;
    line-height: 1.6;
}

/* closing note under the strip */
.sts-62 .sts-who-note {
    font-size: 14px;
    color: #FFFFFFCC;
    white-space: normal;
}

/* ------------------------------------------------------ 10. CAPABILITIES -- */
.sts-62 .sts-element.sts-element-ab-tech {
    --display: flex;
    --flex-direction: column;
    --gap: 40px 40px;
    --row-gap: 40px;
    --column-gap: 40px;
    --padding-top: 140px;
    --padding-bottom: 140px;
}

.sts-62 .sts-element.sts-element-ab-tech:not(.sts-motion-effects-element-type-background),
.sts-62 .sts-element.sts-element-ab-tech > .sts-motion-effects-container > .sts-motion-effects-layer {
    background-color: #FFFFFF;
}

/* Dotted earth backdrop. The artwork is light dots meant for a dark band, so
   it is inverted here to read as dark dots on white, and held behind the
   content on its own layer. */
.sts-62 .sts-element.sts-element-ab-tech { position: relative; }

.sts-62 .sts-element.sts-element-ab-tech::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image: url("../images/earth-full.avif");
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    filter: invert(1);
    opacity: .18;
    pointer-events: none;
    z-index: 0;
}

.sts-62 .sts-element.sts-element-ab-tech > .e-con-inner {
    position: relative;
    z-index: 1;
}

.sts-62 .sts-element.sts-element-ab-tech-h .states-side-heading {
    text-align: center;
    text-transform: capitalize;
    white-space: normal;
    max-width: 22ch;
    margin-inline: auto;
    color: #000000;
}

.sts-62 .sts-element.sts-element-ab-tech-b .states-side-heading {
    text-align: center;
    white-space: normal;
    max-width: 820px;
    margin-inline: auto;
    color: rgba(0, 0, 0, .68);
}

.sts-62 .sts-element.sts-element-ab-tech-cta { text-align: center; }

/* ------------------------------------------------------- 11. CLOSING CTA -- */
.sts-62 .sts-element.sts-element-ab-cta {
    --display: flex;
    --gap: 30px 30px;
    --row-gap: 30px;
    --column-gap: 30px;
    --overflow: hidden;
    --padding-top: 150px;
    --padding-bottom: 60px;
}

.sts-62 .sts-element.sts-element-ab-cta-h .states-side-heading {
    text-align: center;
    text-transform: capitalize;
    white-space: normal;
}

.sts-62 .sts-element.sts-element-ab-cta-b .states-side-heading {
    text-align: center;
    white-space: normal;
    max-width: 640px;
    margin-inline: auto;
}

.sts-62 .sts-element.sts-element-ab-cta-btn { text-align: center; }

/* ===========================================================================
   "Why businesses choose" - icon-box grid + gradient promo panel.
   Built on the theme's own states-side-icon-box widget, mirroring the structure of
   the theme's "effortless setup" block (2x2 boxes beside a tall CTA panel).
   =========================================================================== */

/* the row that holds the icon-box grid and the promo panel side by side */
/* Three equal columns. The card block holds two columns plus its own inner
   gap, so a plain 2fr/1fr would leave the promo one gap-width too wide -
   calc() gives the promo exactly a third of the space minus both gaps. */
.sts-62 .sts-element.sts-element-ab-why > .e-con-inner {
    display: grid;
    grid-template-columns: minmax(0, 1fr) calc((100% - 36px) / 3);
    align-items: stretch;
    gap: 18px;
}

.sts-62 .sts-element.sts-element-ab-rgrid {
    --display: grid;
    --e-con-grid-template-columns: repeat(2, 1fr);
    --gap: 18px 18px;
    --row-gap: 18px;
    --column-gap: 18px;
    --grid-auto-flow: row;
}

/* each icon box becomes a card: icon on top, copy beneath */
/* half-transparent cards so the mountain reads through them. The alpha is on
   the background colour, not `opacity`, so the icon and copy stay solid. */
.sts-62 .sts-element.sts-element-ab-rgrid > .sts-widget-states-side-icon-box {
    padding: 32px 32px 36px;
    background-color: rgba(26, 26, 26, .7);
    border: 1px solid #FFFFFF29;
    border-radius: 14px;
    transition: background-color .35s ease, border-color .35s ease;
}

.sts-62 .sts-element.sts-element-ab-rgrid > .sts-widget-states-side-icon-box:hover {
    background-color: rgba(33, 33, 33, .82);
    border-color: #FFFFFF3D;
}

/* the widget ships as a horizontal row - stack it and space it out */
.sts-62 .sts-element.sts-element-ab-rgrid .states-side-icon-box {
    flex-direction: column;
    align-items: flex-start;
    gap: 0;
    height: 100%;
    text-align: left;
}

.sts-62 .sts-element.sts-element-ab-rgrid .states-side-icon-box .states-side-svg-icon {
    font-size: 32px;
    color: var(--color-heading, #ffffff);
}

/* icon stays pinned at the top; margin-top:auto pushes the copy block to the
   bottom so every card's text baseline aligns whatever the description length */
.sts-62 .sts-element.sts-element-ab-rgrid .states-side-icon-box__content {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-top: auto;
    padding-top: 46px;
}

.sts-62 .sts-element.sts-element-ab-rgrid .states-side-icon-box__title {
    text-transform: capitalize;
    line-height: 1.3;
    font-weight: 500;
}

.sts-62 .sts-element.sts-element-ab-rgrid .states-side-icon-box__description {
    color: #FFFFFF99;
    font-size: 14px;
    line-height: 1.65;
}

/* promo panel: title pinned top, copy + button pushed to the bottom */
.sts-62 .sts-element.sts-element-ab-rpromo {
    --display: flex;
    --flex-direction: column;
    --justify-content: space-between;
    --gap: 24px 24px;
    --row-gap: 24px;
    --column-gap: 24px;
    --padding-top: 36px;
    --padding-bottom: 38px;
    --padding-left: 34px;
    --padding-right: 34px;
    --overflow: hidden;
    border-radius: 14px;
    border: 1px solid #FFFFFF29;
    position: relative;
}

/* the theme's radial gradient, applied as an overlay layer */
.sts-62 .sts-element.sts-element-ab-rpromo::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    background: radial-gradient(204.03% 102.75% at 50.17% 0%, #000000 44.82%, #C83C00 82.29%, #F67300 90.48%, #FAE5B4 100%);
    border-radius: inherit;
    z-index: 1;
}

/* keep the heading, copy and button above the gradient layer */
.sts-62 .sts-element.sts-element-ab-rpromo > * {
    position: relative;
    z-index: 2;
}

.sts-62 .sts-element.sts-element-ab-rpromo-h .states-side-heading {
    text-transform: capitalize;
    white-space: normal;
    font-weight: 500;
}

.sts-62 .sts-element.sts-element-ab-rpromo-b {
    --display: flex;
    --flex-direction: column;
    --align-items: flex-start;
    --gap: 20px 20px;
    --row-gap: 20px;
    --column-gap: 20px;
}

.sts-62 .sts-element.sts-element-ab-rpromo-t .states-side-heading {
    color: #FFFFFFCC;
    white-space: normal;
}

/* ===========================================================================
   Section type: belief cards (.sts-beliefs)
   A dark rounded card with a white pill header sitting on top, carrying an
   orange numbered badge and the title. The header is inset slightly so the
   pill reads as a separate layer floating over the card.
   =========================================================================== */
.sts-62 .sts-beliefs {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 24px;
    align-items: start;
}

.sts-62 .sts-belief {
    display: flex;
    flex-direction: column;
    /* pill sits flush to the top and side edges */
    padding: 0 0 30px;
    border-radius: 46px;
    background-color: #1a1a1a;
    border: 1px solid #FFFFFF29;
    transition: background-color .35s ease, border-color .35s ease;
}

.sts-62 .sts-belief:hover {
    background-color: #212121;
    border-color: #FFFFFF3D;
}

/* white pill: badge + title. Uses the theme's own primary-button shadow so
   it reads as the same raised surface as the buttons elsewhere on the page. */
.sts-62 .sts-belief__header {
    display: flex;
    align-items: center;
    gap: 20px;
    padding: 14px 38px 14px 14px;
    border-radius: 999px;
    background-color: var(--color-snow-white, #ffffff);
    box-shadow: -5px -5px 5px 0px #62260052 inset, 8px -1px 14px 0px #FFFFFF3D inset;
}

.sts-62 .sts-belief__num {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 58px;
    height: 58px;
    border-radius: 50%;
    background-color: var(--color-primary, #f25b09);
    color: #ffffff;
    font-size: 22px;
    font-weight: 700;
    line-height: 1;
}

.sts-62 .sts-belief__title {
    color: #000000;
    font-size: clamp(15px, 1.15vw, 18px);
    font-weight: 500;
    line-height: 1.25;
    letter-spacing: -.01em;
}

/* the card has no side padding, so the copy carries the full inset */
.sts-62 .sts-belief__text {
    color: #ffffff;
    font-size: 14px;
    line-height: 1.65;
    padding: 26px 30px 0;
}

/* ===========================================================================
   Section type: labelled tag groups (.sts-capabilities). Each column is a
   card using the same treatment as the Why Us grid, sitting over the earth
   backdrop.
   =========================================================================== */
.sts-62 .sts-capabilities {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
    width: 100%;
}

/* light-band variant of the site card: same shape, inverted palette */
.sts-62 .sts-capabilities__group {
    display: flex;
    flex-direction: column;
    gap: 20px;
    padding: 32px 30px 36px;
    background-color: rgba(255, 255, 255, .72);
    border: 1px solid #0000001F;
    border-radius: 14px;
    transition: background-color .35s ease, border-color .35s ease;
}

.sts-62 .sts-capabilities__group:hover {
    background-color: #ffffff;
    border-color: #00000033;
}

.sts-62 .sts-capabilities__label {
    font-size: 14px;
    letter-spacing: .12em;
    color: #00000099;
}

/* Chips scroll as a marquee inside each card. Two rows run in opposite
   directions; each row's chip set is duplicated in the markup so the
   -50% translate loops seamlessly. */
.sts-62 .sts-cap-marquee {
    display: flex;
    flex-direction: column;
    gap: 10px;
    width: 100%;
    overflow: hidden;
    -webkit-mask-image: linear-gradient(90deg, transparent, #000 7%, #000 93%, transparent);
    mask-image: linear-gradient(90deg, transparent, #000 7%, #000 93%, transparent);
}

.sts-62 .sts-cap-row {
    display: flex;
    width: max-content;
    gap: 8px;
    padding-right: 8px;
    will-change: transform;
    animation: sts-cap-marq var(--dur, 34s) linear infinite;
}

/* Column 1 rows alternate left, right, left. */
.sts-62 .sts-cap-row--a { --dur: 34s; }
.sts-62 .sts-cap-row--b { --dur: 40s; animation-direction: reverse; }
.sts-62 .sts-cap-row--c { --dur: 30s; }

/* Column 2 mirrors it - right, left, right - so the two columns always run
   against each other rather than drifting the same way. */
.sts-62 .sts-capabilities__group:nth-child(2) .sts-cap-row--a,
.sts-62 .sts-capabilities__group:nth-child(2) .sts-cap-row--c {
    animation-direction: reverse;
}

.sts-62 .sts-capabilities__group:nth-child(2) .sts-cap-row--b {
    animation-direction: normal;
}

.sts-62 .sts-cap-marquee:hover .sts-cap-row { animation-play-state: paused; }

@keyframes sts-cap-marq {
    from { transform: translateX(0); }
    to   { transform: translateX(-50%); }
}

.sts-62 .sts-cap-chip {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 16px 26px;
    border-radius: 999px;
    background-color: rgba(255, 255, 255, .5);
    border: 1px solid #0000001F;
    color: #000000;
    font-size: 18px;
    font-weight: 500;
    line-height: 1;
    letter-spacing: -.01em;
    white-space: nowrap;
    transition: background-color .25s ease, border-color .25s ease;
}

.sts-62 .sts-cap-chip:hover {
    background-color: rgba(255, 255, 255, .85);
    border-color: #00000033;
}

@media (prefers-reduced-motion: reduce) {
    .sts-62 .sts-cap-row { animation: none; }
    .sts-62 .sts-cap-marquee { overflow-x: auto; }
}

/* --------------------------------------------------------------- page ---- */

body.sts-page-62 .site-content {
    padding-top: 0;
    padding-bottom: 0;
}

/* ------------------------------------------------------------- tablet ---- */
@media (max-width: 1024px) {
    .sts-62 .sts-element.sts-element-ab-why-head,
    .sts-62 .sts-element.sts-element-ab-believe-head,
    .sts-62 .sts-element.sts-element-ab-process,
    .sts-62 .sts-element.sts-element-ab-numbers-head {
        --padding-top: 96px;
    }

    .sts-62 .sts-element.sts-element-ab-stats {
        --e-con-grid-template-columns: repeat(2, 1fr);
        --e-con-grid-template-rows: repeat(2, 1fr);
    }

    .sts-62 .sts-element.sts-element-ab-stat1 .states-side-counter-card__text-top,
    .sts-62 .sts-element.sts-element-ab-stat2 .states-side-counter-card__text-top,
    .sts-62 .sts-element.sts-element-ab-stat3 .states-side-counter-card__text-top {
        margin-bottom: 90px;
    }

    .sts-62 .sts-element.sts-element-ab-story {
        --flex-direction: column;
        --gap: 40px 40px;
        --row-gap: 40px;
        --column-gap: 40px;
        --padding-top: 96px;
        --padding-bottom: 100px;
    }

    .sts-62 .sts-element.sts-element-ab-tech { --padding-top: 96px; }

    .sts-62 .sts-beliefs { grid-template-columns: repeat(1, minmax(0, 1fr)); }

    /* disciplines: 2x2 on tablet */
    .sts-62 .sts-disciplines { grid-template-columns: repeat(2, minmax(0, 1fr)); }

    /* side-by-side doesn't fit on tablet: 2x2 boxes, promo drops below */
    .sts-62 .sts-element.sts-element-ab-why > .e-con-inner {
        grid-template-columns: minmax(0, 1fr);
    }
}

/* ------------------------------------------------------------- mobile ---- */
@media (max-width: 767px) {
    .sts-62 .sts-belief { padding: 0 0 26px; border-radius: 28px; }
    .sts-62 .sts-belief__header { gap: 16px; padding: 12px 28px 12px 12px; }
    .sts-62 .sts-belief__num { width: 50px; height: 50px; font-size: 20px; }
    .sts-62 .sts-belief__text { padding: 22px 24px 0; }


    .sts-62 .sts-element.sts-element-ab-why-head,
.sts-62 .sts-element.sts-element-ab-believe-head,
.sts-62 .sts-element.sts-element-ab-process,
.sts-62 .sts-element.sts-element-ab-numbers-head {
        --padding-top: 70px;
    }

    /* single column of icon boxes on mobile */
    .sts-62 .sts-element.sts-element-ab-rgrid {
        --e-con-grid-template-columns: repeat(1, 1fr);
    }
    .sts-62 .sts-element.sts-element-ab-rgrid > .sts-widget-states-side-icon-box {
        padding: 28px 24px 30px;
    }
    .sts-62 .sts-element.sts-element-ab-rgrid .states-side-icon-box__content {
        padding-top: 28px;
    }
    .sts-62 .sts-element.sts-element-ab-rpromo {
        --padding-top: 30px;
        --padding-bottom: 32px;
        --padding-left: 24px;
        --padding-right: 24px;
    }
    .sts-62 .sts-capabilities { grid-template-columns: repeat(1, minmax(0, 1fr)); gap: 30px; }

    /* disciplines: single column */
    .sts-62 .sts-disciplines { grid-template-columns: repeat(1, minmax(0, 1fr)); }
    .sts-62 .sts-discipline { padding: 26px 24px 30px; }

    .sts-62 .sts-element.sts-element-ab-stats {
        --e-con-grid-template-columns: repeat(1, 1fr);
        --e-con-grid-template-rows: auto;
    }

    .sts-62 .sts-element.sts-element-ab-stat1 .states-side-counter-card__text-top,
    .sts-62 .sts-element.sts-element-ab-stat2 .states-side-counter-card__text-top,
    .sts-62 .sts-element.sts-element-ab-stat3 .states-side-counter-card__text-top {
        margin-bottom: 60px;
    }

    .sts-62 .sts-element.sts-element-ab-cta {
        --padding-top: 90px;
        --padding-bottom: 50px;
    }

    .sts-62 .sts-element.sts-element-ab-tech {
        --padding-top: 70px;
        --padding-bottom: 90px;
    }

    .sts-62 .sts-element.sts-element-ab-story { --padding-top: 70px; }
}

/* =======================================================================
   "Services in all 50 states" - ported from the home page (post-61.css).
   Element ids are prefixed ab-st- so these rules cannot collide with the
   home page instances of the same section.
   ======================================================================= */
.sts-62 .sts-element.sts-element-ab-st-16fd7a{--display:flex;--overflow:hidden;--margin-top:0px;--margin-bottom:27px;--margin-left:0px;--margin-right:0px;}
.sts-62 .sts-element.sts-element-ab-st-6da453 .states-side-heading{text-align:center;text-transform: capitalize;white-space:normal;line-height:0.82;}
.sts-62 .sts-element.sts-element-ab-st-4c7860{--display:flex;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--overflow:hidden;--margin-top:0px;--margin-bottom:64px;--margin-left:0px;--margin-right:0px;}
.sts-62 .sts-element.sts-element-ab-st-6d9209 .states-side-heading{text-align:center;white-space:normal;max-width:760px;margin-left:auto;margin-right:auto;}
.sts-62 .sts-element.sts-element-ab-st-560ec6{--display:flex;--overflow:hidden;}
.sts-62 .sts-element.sts-element-ab-st-2062dc{text-align:center;}/* End custom CSS */
/* Section top spacing (replaces removed [ 0X ] eyebrow blocks) */
.sts-62 .sts-element.sts-element-639882bf,
.sts-62 .sts-element.sts-element-58fe31b2,
.sts-62 .sts-element.sts-element-ab-st-16fd7a,
.sts-62 .sts-element.sts-element-74b6ce1b,
.sts-62 .sts-element.sts-element-24aeff4f,
.sts-62 .sts-element.sts-element-71847952,
.sts-62 .sts-element.sts-element-1af57dff,
.sts-62 .sts-element.sts-element-5649c808,
.sts-62 .sts-element.sts-element-4025e600,
.sts-62 .sts-element.sts-element-30e3cf4b,
.sts-62 .sts-element.sts-element-64a73c19{--padding-top:120px}

@media (max-width:767px) {
    .sts-62 .sts-element.sts-element-ab-st-16fd7a{--margin-top:0px;--margin-bottom:16px;--margin-left:0px;--margin-right:0px;}
    
    .sts-62 .sts-element.sts-element-ab-st-4c7860{--margin-top:0px;--margin-bottom:45px;--margin-left:0px;--margin-right:0px;}
    .sts-62 .sts-element.sts-element-ab-st-6d9209 > .sts-widget-container{padding:0px 52px 0px 52px;}
}

/* map + state pills, ported from the home page */
.sts-62 .sts-element.sts-element-ab-st-1215b8{--display:flex;--padding-top:140px;--padding-bottom:80px;--padding-left:0px;--padding-right:0px;}
.sts-62 .sts-element.sts-element-ab-st-1ddbab{--display:flex;--position:absolute;--min-height:100%;bottom:0px;}
.sts-62 .sts-element.sts-element-ab-st-1ddbab:not(.sts-motion-effects-element-type-background), .sts-62 .sts-element.sts-element-ab-st-1ddbab > .sts-motion-effects-container > .sts-motion-effects-layer{background-image:url("../images/earth-full.avif");background-position:center center;background-repeat:no-repeat;}
body:not(.rtl) .sts-62 .sts-element.sts-element-ab-st-1ddbab{left:0px;}
body.rtl .sts-62 .sts-element.sts-element-ab-st-1ddbab{right:0px;}
.sts-62 .sts-element.sts-element-ab-st-6004e0{--display:flex;--overflow:hidden;}
.sts-62 .sts-element.sts-element-ab-st-58b572 .swiper-button{opacity:1;margin-left:0 !important;margin-right:0 !important;}
/* End custom CSS */
/* map section: no background gradient (removed) */
@media (max-width:767px) {
    .sts-62 .sts-element.sts-element-ab-st-1215b8{--padding-top:52px;--padding-bottom:40px;--padding-left:0px;--padding-right:0px;}
    .sts-62 .sts-element.sts-element-ab-st-1ddbab:not(.sts-motion-effects-element-type-background), .sts-62 .sts-element.sts-element-ab-st-1ddbab > .sts-motion-effects-container > .sts-motion-effects-layer{background-image:url("../images/earth-full-mb.avif");}
    .sts-62 .sts-element.sts-element-ab-st-58b572.sts-element{--align-self:center;}
    .sts-62 .sts-element.sts-element-ab-st-58b572 .swiper{padding:0px 61px 0px 61px;}
    .sts-62 .sts-element.sts-element-ab-st-58b572 .swiper-button-prev{--swiper-navigation-sides-offset:3%;}
    .sts-62 .sts-element.sts-element-ab-st-58b572 .swiper-button-next{--swiper-navigation-sides-offset:3%;}
}

/* ===========================================================================
   Section headings: every H2 on the page renders at the same 92px display
   size (the H1 caps at 104px, so the hierarchy still reads).
   =========================================================================== */
.sts-62 .sts-element .states-side-heading:is(h2),
.sts-62 h2.states-side-heading {
    font-size: clamp(34px, 5.6vw, 92px);
    line-height: 1.0;
}

@media (max-width: 767px) {
    .sts-62 .sts-element .states-side-heading:is(h2),
    .sts-62 h2.states-side-heading {
        font-size: clamp(30px, 8.4vw, 46px);
    }
}

/* ===========================================================================
   "CONTACT ME" marquee (ported from the home page). Sits full-width below the
   story section, on the same white band, so the type can run at the theme's
   large display scale.
   =========================================================================== */
.sts-62 .sts-element.sts-element-ab-mq-wrap {
    --display: flex;
    --overflow: hidden;
    /* continues the white story band */
    background-color: #FFFFFF;
    border-style: solid;
    --border-style: solid;
    border-width: 2px 0 0 0;
    --border-top-width: 2px;
    --border-right-width: 0px;
    --border-bottom-width: 0px;
    --border-left-width: 0px;
    border-color: #0000001F;
    --border-color: #0000001F;
    width: 100%;
}

.sts-62 .sts-element.sts-element-ab-mq .states-side-marquee__primary {
    padding: 96px 0 88px 0;
}

.sts-62 .sts-element.sts-element-ab-mq .states-side-marquee__primary .states-side-marquee__items {
    gap: 140px;
    margin-inline-end: 140px;
}

.rtl .sts-62 .sts-element.sts-element-ab-mq .states-side-marquee__primary .states-side-marquee__items {
    gap: 140px;
    margin-inline-start: 140px;
    margin-inline-end: 0;
}

.sts-62 .sts-element.sts-element-ab-mq .states-side-marquee__primary .states-side-marquee__icon {
    font-size: 43px;
    color: #00000014;
}

.sts-62 .sts-element.sts-element-ab-mq .states-side-marquee__primary .states-side-marquee__text {
    font-size: clamp(64px, 17vw, 272px);
    color: #00000014;
}

.states-side-hover-cursor__ab-mq {
    --icon-position: column;
    --content-vertical-alignment: center;
    --text-align: center;
}