/* HumanoSys final responsive layer.
   Loaded after page-specific styles so narrow-screen rules win consistently. */

html,
body.hs-body {
    max-width: 100%;
}

body.hs-body {
    overflow-x: clip;
}

body.hs-menu-open {
    overflow: hidden;
    touch-action: none;
}

img,
picture,
video,
canvas,
svg,
iframe {
    max-width: 100%;
}

img,
picture,
video,
canvas,
svg {
    height: auto;
}

.hs-page-hero__grid > *,
.hs-page-section__head > *,
.hs-page-cta__grid > *,
.hs-cinema-hero__grid > *,
.hs-contact-grid > *,
.hs-resource-hero__grid > *,
.hs-footer__grid > * {
    min-width: 0;
}

.hs-page h1,
.hs-page h2,
.hs-page h3,
.hs-cinema-title,
.hs-spectrum-title,
.hs-footer h2,
.hs-nav-popover a,
.hs-footer a {
    overflow-wrap: anywhere;
}

pre,
code,
.table-responsive,
.hs-scroll-x {
    max-width: 100%;
}

pre,
.table-responsive,
.hs-scroll-x {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

@media (max-width: 980px) {
    :root {
        --hs-header-h: 72px;
    }

    .hs-header {
        background: rgba(9, 10, 12, .94);
        border-bottom: 1px solid var(--hs-line);
        backdrop-filter: blur(18px);
    }

    .hs-nav-panel {
        inset: var(--hs-header-h) 0 0;
        width: 100%;
        height: calc(100dvh - var(--hs-header-h));
        max-height: none;
        overflow-y: auto;
        overflow-x: hidden;
        overscroll-behavior: contain;
        padding: 12px 17px 28px;
    }

    .hs-nav-links {
        display: block;
        width: 100%;
    }

    .hs-nav-group,
    .hs-nav-popover,
    .hs-nav-popover--wide {
        width: 100%;
        max-width: 100%;
    }

    .hs-nav-group > summary {
        justify-content: space-between;
        width: 100%;
        min-height: 56px;
        padding-inline: 2px;
    }

    .hs-nav-popover,
    .hs-nav-popover--wide {
        position: static;
        grid-template-columns: 1fr;
        padding: 0 0 12px;
        border: 0;
        background: transparent;
        box-shadow: none;
    }

    .hs-nav-popover a {
        width: 100%;
        padding: 11px 8px;
    }

    .hs-nav-actions {
        display: grid;
        grid-template-columns: 1fr;
        gap: 10px;
        width: 100%;
        margin: 18px 0 0;
        padding: 0 0 max(10px, env(safe-area-inset-bottom));
    }

    .hs-nav-actions .hs-text-link,
    .hs-nav-actions .hs-nav-cta {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 100%;
        min-height: 46px;
    }

    .hs-page-hero {
        min-height: auto;
        padding-top: calc(var(--hs-header-h) + 42px);
    }

    .hs-page-hero__grid,
    .hs-cinema-hero__grid,
    .hs-resource-hero__grid,
    .hs-contact-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .hs-page-hero__copy,
    .hs-cinema-copy,
    .hs-spectrum-copy,
    .hs-contact-copy {
        max-width: 100%;
        padding-left: 0;
    }

    .hs-page-visual,
    .hs-hero-stage,
    .hs-spectrum-stage {
        width: 100%;
        max-width: 760px;
        margin-inline: auto;
    }

    .hs-page-visual {
        min-height: clamp(390px, 62vw, 520px);
    }

    .hs-page-visual__frame {
        inset: 4% 0 10%;
    }

    .hs-page-visual__chip {
        right: 0;
        width: min(58%, 360px);
    }

    .hs-page-section__head,
    .hs-page-cta__grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .hs-page-cta__grid {
        align-items: start;
        gap: 30px;
    }

    .hs-module-editorial {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .hs-page-strip__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .hs-footer__top {
        gap: 28px;
    }

    .hs-modal .modal-dialog {
        width: calc(100% - 28px);
        max-width: 760px;
        margin-inline: auto;
    }
}

@media (max-width: 768px) {
    :root {
        --hs-header-h: 68px;
    }

    .hs-container,
    .hs-nav-shell {
        width: min(calc(100% - 32px), var(--hs-max));
    }

    .hs-brand {
        gap: 9px;
        font-size: .94rem;
    }

    .hs-brand img {
        width: 34px;
        height: 34px;
    }

    .hs-menu-toggle {
        width: 42px;
        height: 42px;
    }

    .hs-page-hero {
        padding: calc(var(--hs-header-h) + 30px) 0 58px;
    }

    .hs-page-hero__grid,
    .hs-cinema-hero__grid,
    .hs-resource-hero__grid,
    .hs-contact-grid {
        gap: 38px;
    }

    .hs-page-eyebrow {
        margin-bottom: 18px;
        font-size: .6rem;
        line-height: 1.45;
    }

    .hs-page-hero h1,
    .hs-resource-hero h1,
    .hs-contact-copy h1 {
        font-size: clamp(2.55rem, 11vw, 4rem);
        line-height: .98;
        letter-spacing: -.055em;
    }

    .hs-page-lead,
    .hs-resource-hero p,
    .hs-contact-copy > p {
        font-size: .94rem;
        line-height: 1.68;
    }

    .hs-page-actions,
    .hs-actions {
        gap: 12px;
    }

    .hs-page-visual {
        min-height: clamp(330px, 72vw, 430px);
    }

    .hs-page-visual__frame {
        inset: 0 0 12%;
    }

    .hs-page-visual__meta {
        left: 14px;
        right: 14px;
        top: 14px;
        gap: 10px;
        font-size: .52rem;
    }

    .hs-page-visual__chip {
        right: 8px;
        bottom: 2%;
        width: min(66%, 320px);
        padding: 12px 13px;
    }

    .hs-page-visual__chip strong {
        font-size: .8rem;
    }

    .hs-page-strip__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .hs-page-strip article {
        min-height: auto;
        padding: 20px 16px;
    }

    .hs-page-section {
        padding: 76px 0;
    }

    .hs-page-section__head {
        gap: 16px;
        margin-bottom: 42px;
    }

    .hs-page-section__head h2,
    .hs-page-cta h2,
    .hs-footer__top h2 {
        font-size: clamp(2.15rem, 9.8vw, 3.55rem);
        line-height: 1;
        letter-spacing: -.05em;
    }

    .hs-module-editorial {
        grid-template-columns: minmax(0, 1fr);
    }

    .hs-module-entry,
    .hs-module-entry:nth-child(n) {
        min-height: 0;
        border-right: 0;
    }

    .hs-module-entry__media {
        height: clamp(190px, 52vw, 290px);
    }

    .hs-feature-row {
        grid-template-columns: minmax(0, 1fr);
        gap: 9px;
        min-height: 0;
        padding: 24px 0;
    }

    .hs-feature-row p {
        grid-column: auto;
    }

    .hs-page-cta {
        padding: 70px 0;
    }

    .hs-page-cta::after {
        font-size: 22vw;
        bottom: -6%;
    }

    .hs-cinema-hero {
        min-height: auto;
        padding: calc(var(--hs-header-h) + 30px) 0 66px;
    }

    .hs-cinema-title,
    .hs-spectrum-title {
        font-size: clamp(2.65rem, 12vw, 4rem);
        line-height: 1;
    }

    .hs-cinema-copy__lower {
        grid-template-columns: minmax(0, 1fr);
    }

    .hs-hero-stage {
        min-height: clamp(310px, 76vw, 430px);
    }

    .hs-stage-frame {
        width: 100%;
        max-width: 100%;
    }

    .hs-spectrum-stage {
        min-height: 390px;
    }

    .hs-spectrum-main {
        left: 2%;
        width: 90%;
    }

    .hs-spectrum-switcher {
        left: 2%;
        right: 2%;
        max-width: calc(100% - 4%);
        overflow-x: auto;
        overflow-y: hidden;
        -webkit-overflow-scrolling: touch;
    }

    .hs-contact-form {
        width: 100%;
        padding: 26px 20px;
    }

    .hs-contact-form-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .hs-contact-field--full {
        grid-column: auto;
    }

    .hs-careers-filter__grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .hs-resource-toolbar {
        display: block;
    }

    .hs-resource-toolbar p {
        margin-top: 10px;
        text-align: left;
    }

    .hs-resource-card,
    .hs-resource-card:first-child,
    .hs-podcast-card,
    .hs-podcast-card:first-child {
        grid-column: 1 / -1;
        grid-template-columns: minmax(0, 1fr);
    }

    .hs-footer__grid {
        grid-template-columns: minmax(0, 1fr);
        gap: 34px;
    }

    .hs-footer__top,
    .hs-footer__bottom {
        flex-direction: column;
        align-items: flex-start;
    }

    .hs-product-modal {
        align-items: flex-start;
        padding: 10px;
        overflow-y: auto;
    }

    .hs-product-modal__panel {
        max-height: none;
    }

    .hs-product-modal__body {
        grid-template-columns: minmax(0, 1fr);
        gap: 24px;
        padding: 22px 18px 26px;
    }
}

@media (max-width: 560px) {
    :root {
        --hs-header-h: 64px;
    }

    .hs-container,
    .hs-nav-shell {
        width: min(calc(100% - 24px), var(--hs-max));
    }

    .hs-brand img {
        width: 31px;
        height: 31px;
    }

    .hs-menu-toggle {
        width: 40px;
        height: 40px;
    }

    .hs-nav-panel {
        padding-inline: 12px;
    }

    .hs-page-hero {
        padding-top: calc(var(--hs-header-h) + 25px);
        padding-bottom: 48px;
    }

    .hs-page-hero h1,
    .hs-resource-hero h1,
    .hs-contact-copy h1,
    .hs-cinema-title,
    .hs-spectrum-title {
        font-size: clamp(2.25rem, 12.5vw, 3.35rem);
        letter-spacing: -.05em;
    }

    .hs-page-actions,
    .hs-actions {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        width: 100%;
    }

    .hs-page-actions .hs-btn,
    .hs-actions .hs-btn,
    .hs-page-cta .hs-btn {
        width: 100%;
    }

    .hs-page-actions .hs-link-arrow,
    .hs-actions .hs-link-arrow {
        min-height: 44px;
        justify-content: center;
    }

    .hs-page-visual {
        min-height: 300px;
    }

    .hs-page-visual__frame {
        inset: 0 0 15%;
    }

    .hs-page-visual__meta span:last-child {
        display: none;
    }

    .hs-page-visual__chip {
        left: 10px;
        right: 10px;
        bottom: 0;
        width: auto;
    }

    .hs-page-strip__grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .hs-page-strip article,
    .hs-page-strip article:nth-child(n) {
        border-right: 0;
        border-bottom: 1px solid rgba(255,255,255,.08);
    }

    .hs-page-strip article:last-child {
        border-bottom: 0;
    }

    .hs-page-section {
        padding: 62px 0;
    }

    .hs-page-section__head h2,
    .hs-page-cta h2,
    .hs-footer__top h2 {
        font-size: clamp(2rem, 10.5vw, 3rem);
    }

    .hs-company-split article {
        min-height: 0;
        padding: 34px 20px;
    }

    .hs-value-item,
    .hs-team-card,
    .hs-jobs-grid .job-card {
        min-height: 0;
    }

    .hs-contact-shell {
        padding: calc(var(--hs-header-h) + 32px) 0 72px;
    }

    .hs-contact-details div {
        grid-template-columns: minmax(0, 1fr);
        gap: 5px;
    }

    .hs-resource-hero {
        padding: calc(var(--hs-header-h) + 28px) 0 34px;
    }

    .hs-resource-card__body,
    .hs-resource-card:first-child .hs-resource-card__body,
    .hs-podcast-card__body,
    .hs-podcast-card:first-child .hs-podcast-card__body {
        padding: 20px 18px;
    }

    .hs-podcast-tabs {
        width: 100%;
        max-width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .hs-podcast-tabs button {
        flex: 0 0 auto;
        min-width: 105px;
    }

    .hs-hero-stage {
        min-height: 285px;
    }

    .hs-stage-orbit--a,
    .hs-stage-orbit--b,
    .hs-spectrum-orbit--outer,
    .hs-spectrum-orbit--inner {
        display: none;
    }

    .hs-stage-caption {
        left: 12px;
        right: 12px;
        bottom: 10px;
        gap: 8px;
        font-size: .5rem;
    }

    .hs-spectrum-stage {
        min-height: 330px;
    }

    .hs-spectrum-main__media {
        height: 210px;
    }

    .hs-spectrum-float--right {
        display: none;
    }

    .hs-spectrum-switcher button {
        min-width: 76px;
    }

    .hs-modal .modal-dialog {
        width: calc(100% - 16px);
        margin: 8px auto;
    }

    .hs-modal .modal-header,
    .hs-modal .modal-body {
        padding: 20px 16px;
    }

    .hs-demo-form .row > [class*="col-"] {
        width: 100%;
    }

    .hs-footer {
        overflow: hidden;
    }

    .hs-footer__grid {
        padding-block: 36px;
    }

    .hs-footer-mail {
        max-width: 100%;
        overflow-wrap: anywhere;
    }
}

@media (max-width: 390px) {
    .hs-container,
    .hs-nav-shell {
        width: min(calc(100% - 20px), var(--hs-max));
    }

    .hs-brand {
        font-size: .88rem;
    }

    .hs-page-hero h1,
    .hs-resource-hero h1,
    .hs-contact-copy h1,
    .hs-cinema-title,
    .hs-spectrum-title {
        font-size: clamp(2.05rem, 12.5vw, 2.85rem);
    }

    .hs-page-visual {
        min-height: 270px;
    }

    .hs-page-visual__meta {
        left: 10px;
        right: 10px;
        top: 10px;
    }

    .hs-page-visual__chip strong {
        font-size: .74rem;
    }

    .hs-page-section__head h2,
    .hs-page-cta h2,
    .hs-footer__top h2 {
        font-size: clamp(1.85rem, 10vw, 2.6rem);
    }

    .hs-product-modal__hero {
        height: 200px;
    }
}

@media (hover: none) and (pointer: coarse) {
    .hs-module-entry:hover,
    .hs-resource-card:hover,
    .hs-team-card:hover,
    .hs-jobs-grid .job-card:hover {
        transform: none !important;
    }

    [data-magnetic] {
        transform: none !important;
    }
}
