/************************************************************Tech Page CSS****************************************************************************/

/* Loaded only on page-tech.php. Everything is scoped to .acm-tech. */

/* Same font files the site already loads (style.css declares them one family per weight);
   here they are declared once per family, as the variable fonts they are. */
@font-face {
    font-family: "Unbounded";
    font-style: normal;
    font-weight: 200 900;
    font-display: swap;
    src: url(https://fonts.gstatic.com/s/unbounded/v7/Yq6W-LOTXCb04q32xlpwu8ZfvRIkSQ.woff2) format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
    font-family: "Libre Franklin";
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    src: url(https://fonts.gstatic.com/s/librefranklin/v14/jizDREVItHgc8qDIbSTKq4XkRiUf2zcZiVbJ.woff2) format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

html {
    scroll-behavior: smooth;
}

/* The theme styles bare p, li and a (family, size, line-height, underline). Neutralised here at
   the same low specificity, so every class below still wins. */
:where(.acm-tech) p,
:where(.acm-tech) li {
    font: inherit;
    margin: 0;
}
:where(.acm-tech) a,
:where(.acm-tech) a:visited {
    font: inherit;
    text-decoration: none;
}

.acm-tech {
    --acm-navy: #112754;
    --acm-navy-2: #1B3566;
    --acm-navy-line: #2A4A7E;
    --acm-cyan: #0099C1;
    --acm-cyan-ink: #007A9B; /* cyan for text on white: --acm-cyan alone does not reach AA */
    --acm-cyan-lt: #9FE0F2;
    --acm-lime: #E6FB17;
    --acm-paper: #F6F8FC;
    --acm-ink: #152238;
    --acm-ink-2: #4A5670;
    --acm-line: #D8DFEC;
    --font-head: "Unbounded", sans-serif;
    --font-body: "Libre Franklin", sans-serif;
    --radius: 8px;
    --max-w: 1180px;
    --gutter: clamp(16px, 4vw, 48px);
    --ease-out: cubic-bezier(.2, .7, .2, 1);

    clear: both;
    overflow-x: clip;
    background-color: #FFFFFF;
    color: var(--acm-ink);
    font-family: var(--font-body);
    font-size: 16px;
    line-height: 1.6;
}
.acm-tech *,
.acm-tech *:before,
.acm-tech *:after {
    box-sizing: border-box;
}
.acm-tech h1,
.acm-tech h2,
.acm-tech h3 {
    width: auto;
    height: auto;
    margin: 0;
    font-family: var(--font-head);
    font-weight: 500;
    line-height: 1.2;
    color: var(--acm-navy);
}
.acm-tech h3 {
    font-size: 20px;
    line-height: 1.3;
}
.acm-tech p {
    margin: 0;
}
.acm-tech ul,
.acm-tech ol {
    margin: 0;
    padding: 0;
    list-style: none;
}
.acm-tech a {
    color: var(--acm-cyan-ink);
}
.acm-tech [id] {
    scroll-margin-top: 24px;
}
.acm-tech :focus-visible {
    outline: 2px solid var(--acm-cyan);
    outline-offset: 3px;
}

.tech-wrap {
    width: 100%;
    max-width: calc(var(--max-w) + var(--gutter) * 2);
    margin-left: auto;
    margin-right: auto;
    padding-left: var(--gutter);
    padding-right: var(--gutter);
}


/************************************************************Buttons and labels****************************************************************************/


.acm-tech .tech-btn {
    display: inline-block;
    padding: 14px 22px;
    border: 1px solid transparent;
    border-radius: 6px;
    font-family: var(--font-head);
    font-size: 12px;
    font-weight: 500;
    line-height: 1.2;
    text-decoration: none;
    transition: background-color .2s ease, border-color .2s ease, color .2s ease, transform .2s ease;
}
.acm-tech .tech-btn:hover {
    transform: translateY(-2px);
}
.acm-tech .tech-btn--lime {
    background-color: var(--acm-lime);
    color: var(--acm-navy);
}
.acm-tech .tech-btn--lime:hover {
    background-color: #FFFFFF;
}
.acm-tech .tech-btn--ghost {
    border-color: var(--acm-cyan);
    color: var(--acm-cyan-lt);
}
.acm-tech .tech-btn--ghost:hover {
    background-color: rgba(0, 153, 193, .18);
    color: #FFFFFF;
}
.acm-tech .tech-btn--outline {
    border-color: var(--acm-cyan);
    color: var(--acm-cyan-ink);
}
.acm-tech .tech-btn--outline:hover {
    background-color: var(--acm-navy);
    border-color: var(--acm-navy);
    color: #FFFFFF;
}

.tech-label {
    font-size: 12px;
    font-weight: 600;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--acm-cyan-lt);
}
.tech-label--lime {
    color: var(--acm-lime);
}
.tech-note {
    font-size: 14px;
    color: var(--acm-cyan-lt);
}
.acm-tech .tech-note a {
    color: #FFFFFF;
}
/* Stands in for a link whose page does not exist yet (e.g. the Labs experiments). */
.acm-tech .tech-soon {
    margin-top: 28px;
}

.tech-icon {
    display: block;
    width: 28px;
    height: 28px;
    color: var(--acm-cyan);
}
.tech-icon * {
    stroke-dasharray: 1;
    stroke-dashoffset: 0;
}
@keyframes tech-draw {
    from { stroke-dashoffset: 1; }
    to   { stroke-dashoffset: 0; }
}


/************************************************************Facts row****************************************************************************/


.tech-facts {
    background-color: var(--acm-navy);
    border-top: 1px solid var(--acm-navy-line);
    color: var(--acm-cyan-lt);
    font-size: 14px;
}
.tech-facts ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    padding-top: 20px;
    padding-bottom: 20px;
}
.tech-facts li + li:before {
    content: '\00B7';
    margin: 0 14px;
    color: var(--acm-cyan);
}


/************************************************************Sections****************************************************************************/


.tech-section {
    padding-top: clamp(64px, 9vw, 112px);
    padding-bottom: clamp(64px, 9vw, 112px);
    background-color: #FFFFFF;
    color: var(--acm-ink-2);
}
.tech-section--paper {
    background-color: var(--acm-paper);
}
.tech-section--dark {
    background-color: var(--acm-navy);
    color: #C9D6F2;
}
.tech-section--dark + .tech-section--dark { /* e.g. Labs straight into Contact while there are no articles */
    border-top: 1px solid var(--acm-navy-line);
}
.tech-section--air {
    padding-top: clamp(80px, 12vw, 160px);
    padding-bottom: clamp(80px, 12vw, 160px);
}
.tech-section--dark h2,
.tech-section--dark h3 {
    color: #FFFFFF;
}
.tech-section__head {
    max-width: 640px;
    margin-bottom: 48px;
}
.acm-tech .tech-lead {
    margin-top: 16px;
    font-size: 17px;
}

/* The one decorative motif: a cyan circle behind the first letter on light sections, a short cyan line on dark ones. */
.acm-tech .tech-h2 {
    text-wrap: balance; /* no single word left alone on the last line */
    position: relative;
    z-index: 0;
    font-size: clamp(24px, 3vw, 36px);
}
.tech-h2:before {
    content: '';
    position: absolute;
    top: -.15em;
    left: -.4em;
    z-index: -1;
    width: 1.5em;
    height: 1.5em;
    border-radius: 50%;
    background-color: var(--acm-cyan);
    opacity: .85;
}
.tech-section--dark .tech-h2:before {
    display: none;
}
.tech-section--dark .tech-h2:after {
    content: '';
    display: block;
    width: 56px;
    height: 3px;
    margin-top: 18px;
    background-color: var(--acm-cyan);
}

.tech-split {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: clamp(32px, 6vw, 88px);
    align-items: start;
}
.tech-split .tech-label {
    margin-bottom: 16px;
}
.tech-split .tech-h2 + p {
    margin-top: 22px;
    font-size: 17px;
}
.tech-split .tech-btn {
    margin-top: 28px;
}


/************************************************************Work: cases****************************************************************************/


/* Client cases: editorial, one per row, image and story side by side. */
.tech-case {
    display: grid;
    grid-template-columns: 1fr;
    overflow: hidden;
    margin-bottom: 32px;
    border: 1px solid var(--acm-line);
    border-radius: var(--radius);
    background-color: #FFFFFF;
}
.tech-case.has-image {
    grid-template-columns: 1.1fr 1fr;
}
.tech-case:nth-of-type(even).has-image .tech-case__media {
    order: 2;
}
.tech-case__media img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.tech-case__body {
    padding: clamp(28px, 4vw, 56px);
}
.tech-case .tech-label,
.tech-post__date,
.tech-svc__meta span {
    color: var(--acm-cyan-ink);
}
.acm-tech .tech-case h3 {
    margin-top: 12px;
    font-size: clamp(22px, 2.4vw, 30px);
    line-height: 1.25;
}
.acm-tech .tech-case dl {
    display: grid;
    gap: 18px;
    margin: 28px 0 0;
}
.acm-tech .tech-case:not(.has-image) dl { /* no image yet: the story runs in two columns instead of leaving half the card empty */
    grid-template-columns: 1fr 1fr;
    gap: 24px clamp(24px, 5vw, 72px);
}
.tech-case dt {
    font-size: 12px;
    font-weight: 600;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--acm-cyan-ink);
}
.tech-case dd {
    margin: 4px 0 0;
    color: var(--acm-ink);
}
.tech-case .tech-link {
    margin-top: 28px;
}

.acm-tech .tech-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-family: var(--font-head);
    font-size: 12px;
    font-weight: 500;
    color: var(--acm-cyan-ink);
    text-decoration: none;
}
.tech-link .tech-icon {
    width: 16px;
    height: 16px;
    color: currentColor;
    transition: transform .2s ease;
}
.tech-link:hover .tech-icon {
    transform: translateX(4px);
}
/* Same call to action as the hero's "Explore our work": heading font, hairline underline, arrow. For dark sections. */
.acm-tech .tech-cta-link {
    display: inline-block;
    margin-top: 28px;
    padding-bottom: 5px;
    border-bottom: 1px solid rgba(255, 255, 255, .19);
    color: #F4F5F5;
    font: 500 13px/1.5 var(--font-head);
    text-decoration: none;
    transition: color .2s ease, border-color .2s ease;
}
.acm-tech .tech-cta-link:hover {
    border-bottom-color: var(--acm-lime);
    color: var(--acm-lime);
}
.acm-tech .tech-cta-link--light { /* the same link on white or paper */
    border-bottom-color: var(--acm-cyan);
    color: var(--acm-navy);
}
.acm-tech .tech-cta-link--light:hover {
    border-bottom-color: var(--acm-navy);
    color: var(--acm-cyan-ink);
}
.acm-tech .tech-ask {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 6px 18px;
    margin-top: 32px;
}
.tech-ask strong {
    font-family: var(--font-head);
    font-size: 17px;
    font-weight: 500;
    color: var(--acm-navy);
}
.acm-tech .tech-ask .tech-cta-link {
    margin-top: 0;
}
.acm-tech .tech-section--dark .tech-link {
    color: var(--acm-cyan-lt);
}


/************************************************************Why AC&M Tech****************************************************************************/


.tech-reasons {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: clamp(24px, 4vw, 56px);
}
.tech-reason {
    padding-top: 24px;
    border-top: 1px solid var(--acm-line);
}
.tech-reason h3 {
    font-size: 18px;
}
.tech-reason p {
    margin-top: 12px;
}
.tech-reason .tech-link {
    margin-top: 20px;
}


/************************************************************Capabilities****************************************************************************/


/* Rows, not a grid of cards: what it solves on the left, how on the right. */
.tech-capabilities {
    border-top: 1px solid var(--acm-line);
}
.tech-svc {
    display: grid;
    grid-template-columns: minmax(0, 5fr) minmax(0, 6fr);
    gap: clamp(20px, 5vw, 72px);
    position: relative;
    padding: 36px 20px;
    margin: 0 -20px;
    border: 1px solid transparent;
    border-radius: var(--radius);
    transition: transform .2s ease, border-color .2s ease, background-color .2s ease;
}
.tech-svc:after { /* row separator, kept straight: the rounded border is only for hover */
    content: '';
    position: absolute;
    right: 20px;
    bottom: -1px;
    left: 20px;
    height: 1px;
    background-color: var(--acm-line);
}
.tech-svc__title {
    display: flex;
    align-items: flex-start;
    gap: 18px;
}
.tech-svc__title .tech-icon {
    flex-shrink: 0;
    margin-top: 1px;
}
.tech-svc h3 {
    position: relative;
    font-size: 19px;
}
.tech-svc__body p + p {
    margin-top: 12px;
}
.tech-svc__meta {
    font-size: 14px;
    color: var(--acm-ink-2);
}
.tech-svc__meta span {
    display: inline-block;
    margin-right: 10px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: .12em;
    text-transform: uppercase;
}
.acm-tech .tech-svc__meta a {
    color: var(--acm-cyan-ink);
    text-decoration: underline;
    text-underline-offset: 3px;
}

.tech-svc:hover,
.tech-svc:focus-within {
    border-color: var(--acm-cyan);
    background-color: var(--acm-paper);
}
.tech-section--paper .tech-svc:hover,
.tech-section--paper .tech-svc:focus-within {
    background-color: #FFFFFF;
}
.tech-svc:hover .tech-icon * {
    animation: tech-draw .5s ease both;
}

/* Arrival. The hidden state only exists once tech.js adds it, so the page is complete without JS. */
.tech-svc.is-entering,
.tech-reveal.is-entering {
    transition: opacity .45s var(--ease-out) calc(var(--i) * 80ms), transform .45s var(--ease-out) calc(var(--i) * 80ms);
}
.tech-svc.is-hidden,
.tech-reveal.is-hidden {
    opacity: 0;
    transform: translateY(16px);
}

/* Arriving from a deep link: the border pulses once. */
@keyframes tech-pulse-border {
    0%, 100% { border-color: rgba(0, 153, 193, 1); }
    50%      { border-color: rgba(0, 153, 193, .3); }
}
.tech-svc.is-target,
.tech-case.is-target {
    animation: tech-pulse-border 1.2s ease 1;
}


/************************************************************Agencies****************************************************************************/


.tech-iconlist li {
    display: flex;
    align-items: center;
    gap: 18px;
    padding: 20px 0;
    border-bottom: 1px solid var(--acm-line);
    color: var(--acm-ink);
    font-weight: 600;
}
.tech-iconlist li:first-child {
    border-top: 1px solid var(--acm-line);
}
.tech-iconlist .tech-icon {
    flex-shrink: 0;
}


.acm-tech .tech-iconlist__title {
    margin-bottom: 20px;
    font-size: 17px;
}


/************************************************************Prisma****************************************************************************/


/* Product block linking to the Prisma landing: a navy card on the white section, copy left, film poster right.
   Lime is kept for the Prisma mark and MEASURE, as in the film. */
.tech-prisma {
    display: grid;
    grid-template-columns: 1fr 1.25fr;
    align-items: center;
    gap: clamp(28px, 4vw, 56px);
    overflow: hidden;
    padding: clamp(28px, 4vw, 56px);
    border-radius: 14px;
    background:
        radial-gradient(ellipse 60% 70% at 100% 100%, rgba(0, 153, 193, .22), transparent 70%),
        var(--acm-navy);
    color: #C9D6F2;
}
.tech-prisma__lockup {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    margin-bottom: 28px;
}
.tech-prisma .prisma-mark {
    display: block;
    width: 58px;
    height: auto;
    fill: var(--acm-lime);
    stroke: var(--acm-lime);
}
.tech-prisma__lockup img {
    display: block;
    width: 168px;
    height: auto;
    margin-top: 1px;
}
.acm-tech .tech-prisma__lockup p {
    margin-top: 6px;
    font: 600 13px/1 var(--font-head);
    color: var(--acm-cyan-lt);
}
.tech-prisma__lockup b {
    font-weight: 600;
    color: var(--acm-cyan);
}
.acm-tech .tech-prisma h2 {
    color: #FFFFFF;
}
.tech-prisma .tech-h2:before {
    display: none;
}
.acm-tech .tech-prisma .tech-h2 + p {
    margin-top: 18px;
    font-size: 17px;
}
.acm-tech .tech-prisma__pillars {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 18px;
    margin-top: 24px;
}
.acm-tech .tech-prisma__pillars li {
    font: 700 13px/1.4 var(--font-head);
    letter-spacing: .1em;
    text-transform: uppercase;
    color: #FFFFFF;
}
.acm-tech .tech-prisma__pillars li:last-child {
    color: var(--acm-lime);
}
.tech-prisma__film {
    position: relative;
    display: block;
    overflow: hidden;
    border: 1px solid var(--acm-navy-line);
    border-radius: 10px;
    box-shadow: 0 30px 60px -30px rgba(0, 0, 0, .6);
}
.tech-prisma__film img {
    display: block;
    width: 100%;
    height: auto;
    transition: transform .8s var(--ease-out);
}
.tech-prisma__film:hover img {
    transform: scale(1.03);
}
.acm-tech .tech-prisma__play {
    position: absolute;
    inset: auto 0 0;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 48px 20px 18px;
    background: linear-gradient(transparent, rgba(11, 28, 64, .95) 70%);
    color: #FFFFFF;
    font: 500 13px/1 var(--font-head);
}
.tech-prisma__play small {
    font: inherit;
    color: var(--acm-cyan-lt);
}
.tech-prisma__play > span {
    position: relative;
    flex-shrink: 0;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background-color: var(--acm-cyan);
    transition: transform .25s var(--ease-out);
}
.tech-prisma__play > span:after {
    content: '';
    position: absolute;
    top: 50%;
    left: 54%;
    border-style: solid;
    border-width: 7px 0 7px 11px;
    border-color: transparent transparent transparent #FFFFFF;
    transform: translate(-50%, -50%);
}
.tech-prisma__film:hover .tech-prisma__play > span {
    transform: scale(1.08);
}


/************************************************************Labs****************************************************************************/


/* AC&M Group > AC&M Tech > AC&M Tech Labs */
.acm-tech .tech-path {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 0;
    margin-bottom: 20px;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--acm-cyan-lt);
}
.tech-path li + li:before {
    content: '\2192';
    margin: 0 12px;
    color: var(--acm-cyan);
}
.tech-path li[aria-current] {
    color: #FFFFFF;
}
.tech-nowrap {
    white-space: nowrap;
}
.tech-narrow > div {
    max-width: 760px;
}
.tech-narrow .tech-h2 + p {
    margin-top: 22px;
    font-size: 17px;
}
.acm-tech .tech-timeline a {
    color: inherit;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.acm-tech .tech-timeline {
    position: relative;
    padding-left: 28px;
}
.tech-timeline:before {
    content: '';
    position: absolute;
    top: 10px;
    bottom: 10px;
    left: 4px;
    width: 1px;
    background-color: var(--acm-navy-line);
}
.tech-timeline li {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 4px 14px;
    padding: 12px 0;
}
.tech-timeline li:before {
    content: '';
    position: absolute;
    top: 1.35em;
    left: -28px;
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background-color: var(--acm-cyan);
    box-shadow: 0 0 0 4px var(--acm-navy);
}
.tech-timeline strong {
    font-family: var(--font-head);
    font-size: 16px;
    font-weight: 500;
    color: #FFFFFF;
}
.tech-timeline span {
    font-size: 15px;
    color: var(--acm-cyan-lt);
}
.tech-timeline + .tech-note {
    margin-top: 24px;
}


/************************************************************Articles****************************************************************************/


.tech-posts {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 32px;
}
.acm-tech .tech-post a {
    display: block;
    color: inherit;
    text-decoration: none;
}
.tech-post__media {
    overflow: hidden;
    margin-bottom: 20px;
    border-radius: var(--radius);
}
.tech-post__media img {
    display: block;
    width: 100%;
    aspect-ratio: 3 / 2;
    object-fit: cover;
    transition: transform .4s var(--ease-out);
}
.tech-post a:hover .tech-post__media img {
    transform: scale(1.03);
}
.tech-post__date {
    font-size: 12px;
    font-weight: 600;
    letter-spacing: .12em;
    text-transform: uppercase;
}
.tech-post h3 {
    margin-top: 8px;
    font-size: 18px;
}
.tech-post a:hover h3 {
    color: var(--acm-cyan-ink);
}
.tech-post h3 + p {
    margin-top: 10px;
    font-size: 15px;
    color: var(--acm-ink-2);
}
.tech-posts__all {
    margin-top: 40px;
}


/************************************************************Contact****************************************************************************/


.tech-contact .tech-btn {
    margin-top: 0;
}
.tech-contact .tech-note {
    margin-top: 20px;
}
/* HubSpot form (rendered inline, not in an iframe) */
.tech-contact__form label {
    display: block;
    margin-bottom: 6px;
    font-size: 13px;
    color: var(--acm-cyan-lt);
}
.tech-contact__form .hs-form-field {
    margin-bottom: 16px;
}
.tech-contact__form .hs-input:not([type="checkbox"]):not([type="radio"]) {
    width: 100%;
    padding: 12px 14px;
    border: 1px solid var(--acm-navy-line);
    border-radius: 6px;
    background-color: var(--acm-navy-2);
    color: #FFFFFF;
    font-family: var(--font-body);
    font-size: 16px;
}
.tech-contact__form .hs-input:focus {
    border-color: var(--acm-cyan);
    outline: none;
}
.tech-contact__form .hs-error-msg {
    color: var(--acm-lime);
}
.tech-contact__form .hs-button {
    padding: 14px 28px;
    border: 0;
    border-radius: 6px;
    background-color: var(--acm-lime);
    color: var(--acm-navy);
    font-family: var(--font-head);
    font-size: 12px;
    font-weight: 500;
    cursor: pointer;
}


/************************************************************Responsive****************************************************************************/


@media screen and (max-width: 1000px) {
    .tech-facts ul { /* the row wraps here: a separator would open the second line */
        gap: 6px 32px;
    }
    .tech-facts li + li:before {
        display: none;
    }
    .tech-case.has-image,
    .acm-tech .tech-case:not(.has-image) dl {
        grid-template-columns: 1fr;
    }
    .tech-case:nth-of-type(even).has-image .tech-case__media {
        order: 0;
    }
    .tech-case__media {
        max-height: 360px;
    }
    .tech-reasons,
    .tech-posts {
        grid-template-columns: 1fr;
    }
}

@media screen and (max-width: 900px) {
    .tech-split,
    .tech-prisma,
    .tech-svc {
        grid-template-columns: 1fr;
    }
    .tech-svc {
        gap: 16px;
        padding: 28px 16px;
        margin: 0 -16px;
    }
    .tech-svc:after {
        right: 16px;
        left: 16px;
    }
}

@media screen and (max-width: 720px) {
    .tech-facts ul {
        flex-direction: column;
        align-items: center;
        gap: 4px;
    }
}

@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }
    .acm-tech *,
    .acm-tech *:before,
    .acm-tech *:after {
        transition: none !important;
        animation: none !important;
    }
}