:root {
    scroll-behavior: auto;
    --bs-font-sans-serif: "Midashi Go MB31", "見出ゴMB31", "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Yu Gothic", sans-serif;
    --bs-body-font-family: var(--bs-font-sans-serif);
    --c4c-font-heading: "Midashi Go MB31", "見出ゴMB31", var(--bs-font-sans-serif);
    --bs-body-font-size: 1rem;
    --bs-body-font-weight: 400;
    --bs-body-line-height: 1.75;
    --c4c-type-display: 3.5rem;
    --c4c-type-section: 2rem;
    --c4c-type-feature: 1.75rem;
    --c4c-type-lead: 1.25rem;
    --c4c-type-body: var(--bs-body-font-size);
    --c4c-type-small: 0.875rem;
    --c4c-type-caption: 0.75rem;
    --c4c-type-micro: 0.625rem;
    --c4c-type-logo-caption: 1rem;
    --c4c-type-icon: 1.25rem;
    --c4c-line-tight: 1.2;
    --c4c-line-heading: 1.45;
    --c4c-line-copy: 1.9;
    --c4c-paper: #f8f7f0;
    --c4c-grid: rgba(15, 28, 101, 0.075);
    --c4c-cyan: #138dff;
    --c4c-blue: #296ae6;
    --c4c-deep: #0400b4;
    --c4c-accent: #ad855f;
    --c4c-button-border: #ffffff;
    --c4c-grid-size: 48px;
    --c4c-header-height: 112px;
    --c4c-section-hold-default: 100vh;
    --c4c-section-hold-monitor: 100vh;
    --c4c-section-hold-overview: 100vh;
    --c4c-section-hold-realtime: 100vh;
    --c4c-section-hold-high-accuracy: 100vh;
    --c4c-section-hold-pinpoint: 100vh;
    --c4c-section-hold-simulation: 100vh;
    --c4c-content-occlusion-gap: 44px;
    --c4c-content-occlusion-fade: 44px;
    --c4c-wave-max: 50vw;
    --c4c-wave-section-3-max: 3vw;
    --c4c-left-wave-section-4-width: 3vw;
    --c4c-left-wave-residual-complexity: 1.35;
    --c4c-left-wave-section-5-width: 52vw;
    --c4c-left-wave-section-5-map-center: 21vw;
    --c4c-left-wave-section-5-map-y-offset: 0px;
    --c4c-left-wave-section-5-map-width: min(30vw, 560px);
    --c4c-left-wave-section-6-width: 5vw;
    --c4c-left-wave-section-7-width: 20vw;
    --c4c-left-wave-section-8-width: 2vw;
    --c4c-shell-padding: clamp(32px, 4vw, 76px);
    --c4c-shell-max-width: 1920px;
    --c4c-shell-content-start: max(
        var(--c4c-shell-padding),
        calc(
            ((100vw - var(--c4c-shell-max-width)) / 2) +
            var(--c4c-shell-padding)
        )
    );
    --c4c-footer-amplitude-mobile: 3.5vw;
    --c4c-footer-tide-mobile-min-width: 1200px;
    --c4c-footer-card-width: 600px;
    --c4c-contact-label-width: clamp(220px, 17vw, 260px);
    --c4c-contact-column-gap: clamp(22px, 2.3vw, 40px);
    --c4c-contact-row-space: clamp(22px, 2vw, 32px);
    --c4c-contact-control-height: 52px;
    --c4c-contact-message-height: clamp(180px, 16vw, 260px);
    --c4c-motion-fast: 220ms;
    --c4c-motion-base: 360ms;
    --c4c-motion-slow: 460ms;
    --c4c-motion-stagger: 56ms;
    --c4c-motion-ease-out: cubic-bezier(0.22, 0.78, 0.18, 1);
    --c4c-loader-zoom-duration: 1400ms;
    --c4c-loader-handoff-duration: 120ms;
    --c4c-hero-logo-top: 40dvh;
    --c4c-hero-logo-anchor-y: -50%;
    --c4c-hero-logo-width: min(86vw, calc(62svh * 2.078), 1620px);
}

html {
    scroll-behavior: auto;
    scroll-padding-top: 0;
    scrollbar-gutter: stable;
}

body {
    min-width: 320px;
    margin: 0;
    overflow-x: clip;
    color: var(--c4c-deep);
    background-color: var(--c4c-paper);
    background-image:
        linear-gradient(var(--c4c-grid) 1px, transparent 1px),
        linear-gradient(90deg, var(--c4c-grid) 1px, transparent 1px);
    background-size: var(--c4c-grid-size) var(--c4c-grid-size);
    background-attachment: fixed;
    font-family: var(--bs-body-font-family);
    font-size: var(--bs-body-font-size);
    font-weight: var(--bs-body-font-weight);
    line-height: var(--bs-body-line-height);
    letter-spacing: 0;
}

body.c4c-is-loading {
    overflow: hidden;
}

html.c4c-contact-anchor-handoff-pending body {
    visibility: hidden;
}

body.c4c-contact-anchor-handoff .c4c-loader {
    display: none;
}

body.c4c-contact-anchor-handoff #main-content,
body.c4c-contact-anchor-handoff .c4c-footer-card-wrap,
body.c4c-contact-anchor-handoff .c4c-footer {
    visibility: hidden;
}

a {
    color: inherit;
}

h1,
h2,
h3,
h4,
h5,
h6,
.c4c-section-label,
.c4c-intro__title-c4c span {
    font-family: var(--c4c-font-heading);
    font-kerning: normal;
    font-feature-settings: "palt" 1;
}

:is(
    .c4c-section-heading,
    .c4c-overview__heading,
    .c4c-detail-heading,
    .c4c-use-cases__heading,
    .c4c-use-case__title,
    .c4c-monitor-entry__heading,
    .c4c-service-roadmap__stage-title,
    .c4c-service-roadmap__support-lead h3,
    .c4c-display-heading
) {
    word-break: normal;
    word-break: auto-phrase;
    text-wrap: balance;
}

:is(
    .c4c-copy,
    .c4c-lead-copy,
    .c4c-detail-copy,
    .c4c-detail-download-copy,
    .c4c-use-case__audience,
    .c4c-use-case__body,
    .c4c-service-roadmap__stage-copy,
    .c4c-service-roadmap__support > p,
    .c4c-future__copy
) {
    line-break: strict;
    word-break: normal;
    text-wrap: pretty;
}

@supports (word-break: auto-phrase) {
    :is(
        .c4c-copy,
        .c4c-lead-copy,
        .c4c-detail-copy,
        .c4c-detail-download-copy,
        .c4c-use-case__audience,
        .c4c-use-case__body,
        .c4c-service-roadmap__stage-copy,
        .c4c-service-roadmap__support > p,
        .c4c-future__copy
    ) {
        word-break: auto-phrase;
    }
}

.c4c-copy-phrase {
    white-space: nowrap;
}

@media (max-width: 767.98px) {
    .c4c-copy-phrase {
        white-space: normal;
    }

    :is(
        .c4c-copy,
        .c4c-lead-copy,
        .c4c-detail-copy,
        .c4c-detail-download-copy,
        .c4c-use-case__audience,
        .c4c-use-case__body,
        .c4c-service-roadmap__stage-copy,
        .c4c-service-roadmap__support > p,
        .c4c-future__copy,
        .c4c-content-page__body :is(p, li)
    ) {
        text-align: justify;
        text-justify: inter-character;
    }
}

.c4c-shell {
    width: 100%;
    max-width: var(--c4c-shell-max-width);
    padding-right: var(--c4c-shell-padding);
    padding-left: var(--c4c-shell-padding);
    margin-right: auto;
    margin-left: auto;
}

.c4c-section-title {
    margin-inline-start: var(--c4c-shell-content-start);
}

[data-c4c-reveal] {
    opacity: 0;
    filter: blur(2px);
    transform: translate3d(0, 14px, 0);
    transition:
        opacity var(--c4c-motion-base) ease-out var(--c4c-reveal-delay, 0ms),
        filter var(--c4c-motion-base) ease-out var(--c4c-reveal-delay, 0ms),
        transform var(--c4c-motion-slow) var(--c4c-motion-ease-out)
            var(--c4c-reveal-delay, 0ms);
    will-change: opacity, filter, transform;
}

[data-c4c-reveal="from-left"] {
    transform: translate3d(-22px, 0, 0);
}

[data-c4c-reveal="from-right"] {
    transform: translate3d(22px, 0, 0);
}

[data-c4c-reveal-state="visible"] {
    opacity: 1;
    filter: blur(0);
    transform: translate3d(0, 0, 0);
}

/* Section identity must remain readable independently of entrance effects. */
:is(
    .c4c-section-label,
    .c4c-section-heading,
    .c4c-overview__heading,
    .c4c-detail-heading,
    .c4c-display-heading,
    .c4c-service-lockup,
    .c4c-use-cases__intro,
    .c4c-monitor-entry__intro
):is([data-c4c-reveal], [data-c4c-pinned-reveal]) {
    opacity: 1;
    filter: none;
    transform: none;
    transition: none;
    will-change: auto;
}

:is(
    .c4c-section-label,
    .c4c-section-heading,
    .c4c-overview__heading,
    .c4c-detail-heading,
    .c4c-display-heading,
    .c4c-use-cases__heading,
    .c4c-monitor-entry__heading
)[data-c4c-reveal-item] {
    opacity: 1;
    transform: none;
    transition: none;
}

@media (min-width: 768px) {
    main :is(
        p,
        h1,
        h2,
        h3,
        h4,
        h5,
        h6,
        .c4c-service-lockup,
        .c4c-use-cases__intro,
        .c4c-monitor-entry__intro,
        .c4c-service-roadmap__stage,
        .c4c-service-roadmap__support
    ):is([data-c4c-reveal], [data-c4c-pinned-reveal]) {
        opacity: 1;
        filter: none;
        transform: none;
        transition: none;
        will-change: auto;
    }

    main :is(
        p,
        h1,
        h2,
        h3,
        h4,
        h5,
        h6,
        .c4c-copy,
        .c4c-use-case__link-inner,
        .c4c-service-roadmap__support-lead
    )[data-c4c-reveal-item] {
        opacity: 1;
        transform: none;
        transition: none;
    }
}

[data-c4c-reveal-sequence] [data-c4c-reveal-item] {
    opacity: 0;
    transform: translate3d(0, 12px, 0);
    transition:
        opacity var(--c4c-motion-base) ease-out
            calc(var(--c4c-reveal-item-index, 0) * var(--c4c-motion-stagger)),
        transform var(--c4c-motion-slow) var(--c4c-motion-ease-out)
            calc(var(--c4c-reveal-item-index, 0) * var(--c4c-motion-stagger));
}

[data-c4c-reveal-sequence][data-c4c-reveal-state="visible"]
    [data-c4c-reveal-item] {
    opacity: 1;
    transform: translate3d(0, 0, 0);
}

:is(.c4c-monitor-entry__form-panel, .c4c-contact__form-panel)
    :is(.c4c-monitor-form, .c4c-contact-form, .wpcf7-form)
    > * {
    opacity: 0;
    transform: translate3d(0, 10px, 0);
    transition:
        opacity var(--c4c-motion-base) ease-out var(--c4c-form-reveal-delay, 0ms),
        transform var(--c4c-motion-slow) var(--c4c-motion-ease-out)
            var(--c4c-form-reveal-delay, 0ms);
}

:is(.c4c-monitor-entry__form-panel, .c4c-contact__form-panel)
    :is(.c4c-monitor-form, .c4c-contact-form, .wpcf7-form)
    > :nth-child(2) {
    --c4c-form-reveal-delay: var(--c4c-motion-stagger);
}

:is(.c4c-monitor-entry__form-panel, .c4c-contact__form-panel)
    :is(.c4c-monitor-form, .c4c-contact-form, .wpcf7-form)
    > :nth-child(3) {
    --c4c-form-reveal-delay: calc(var(--c4c-motion-stagger) * 2);
}

:is(.c4c-monitor-entry__form-panel, .c4c-contact__form-panel)
    :is(.c4c-monitor-form, .c4c-contact-form, .wpcf7-form)
    > :nth-child(n + 4) {
    --c4c-form-reveal-delay: calc(var(--c4c-motion-stagger) * 3);
}

:is(.c4c-monitor-entry__form-panel, .c4c-contact__form-panel)[data-c4c-reveal-state="visible"]
    :is(.c4c-monitor-form, .c4c-contact-form, .wpcf7-form)
    > * {
    opacity: 1;
    transform: translate3d(0, 0, 0);
}

[data-c4c-pinned-reveal] {
    opacity: 0;
    filter: blur(2px);
    transform: translate3d(0, 14px, 0);
    transition:
        opacity var(--c4c-motion-base) ease-out var(--c4c-pinned-reveal-delay, 0ms),
        filter var(--c4c-motion-base) ease-out var(--c4c-pinned-reveal-delay, 0ms),
        transform var(--c4c-motion-slow) var(--c4c-motion-ease-out)
            var(--c4c-pinned-reveal-delay, 0ms);
    will-change: opacity, filter, transform;
}

[data-c4c-pinned-reveal="from-left"] {
    transform: translate3d(-22px, 0, 0);
}

[data-c4c-pinned-reveal="from-right"] {
    transform: translate3d(22px, 0, 0);
}

.c4c-flow-section__pin[data-section-focus="true"]
    [data-c4c-pinned-reveal] {
    opacity: 1;
    filter: blur(0);
    transform: translate3d(0, 0, 0);
}

.c4c-loader {
    position: fixed;
    z-index: 100;
    inset: 0;
    overflow: hidden;
    background-color: var(--c4c-paper);
    background-image:
        linear-gradient(var(--c4c-grid) 1px, transparent 1px),
        linear-gradient(90deg, var(--c4c-grid) 1px, transparent 1px);
    background-position: center;
    background-size: calc(var(--c4c-grid-size) * 5.4) calc(var(--c4c-grid-size) * 5.4);
    opacity: 1;
    visibility: visible;
}

.c4c-loader__logo {
    position: absolute;
    top: 50%;
    left: 50%;
    display: block;
    width: var(--c4c-hero-logo-width);
    max-width: none;
    height: auto;
    filter: blur(10px);
    transform: translate(-50%, -50%) scale(5.4);
    transform-origin: center;
    will-change: filter, transform;
}

body[data-c4c-loading-state="zooming"] .c4c-loader {
    animation:
        c4c-loader-grid var(--c4c-loader-zoom-duration)
            cubic-bezier(0.22, 0.78, 0.18, 1) forwards,
        c4c-loader-fade var(--c4c-loader-handoff-duration)
            linear var(--c4c-loader-zoom-duration) forwards;
}

body[data-c4c-loading-state="zooming"] .c4c-loader__logo {
    animation: c4c-loader-logo var(--c4c-loader-zoom-duration)
        cubic-bezier(0.22, 0.78, 0.18, 1) forwards;
}

body[data-c4c-loading-state="complete"] .c4c-loader {
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
}

@keyframes c4c-loader-logo {
    0% {
        filter: blur(10px);
        transform: translate(-50%, -50%) scale(5.4);
    }
    100% {
        filter: blur(0);
        transform: translate(
            -50%,
            calc(
                -50dvh + var(--c4c-hero-logo-top) +
                var(--c4c-hero-logo-anchor-y)
            )
        ) scale(1);
    }
}

@keyframes c4c-loader-grid {
    0% {
        /* Keep the viewport center fixed while the 5.4x grid zooms out. */
        background-position: -220vw -220dvh;
        background-size: calc(var(--c4c-grid-size) * 5.4) calc(var(--c4c-grid-size) * 5.4);
    }
    100% {
        background-position: 0 0;
        background-size: var(--c4c-grid-size) var(--c4c-grid-size);
    }
}

@keyframes c4c-loader-fade {
    from {
        opacity: 1;
    }
    to {
        opacity: 0;
    }
}

.c4c-header {
    position: fixed;
    z-index: 50;
    top: 0;
    left: 0;
    width: 100%;
    min-height: var(--c4c-header-height);
    padding: 24px 0;
    background: transparent;
    border: 0;
    opacity: 0;
    pointer-events: none;
    transform: translateY(calc(-100% - 12px));
    transition:
        transform 680ms cubic-bezier(0.22, 0.78, 0.18, 1),
        opacity 360ms ease;
}

.c4c-header[data-visible="true"] {
    opacity: 1;
    pointer-events: auto;
    transform: translateY(0);
}

.c4c-header__brand {
    width: clamp(188px, 14vw, 264px);
    padding: 0;
    margin: 0;
}

.c4c-header__brand img {
    display: block;
    width: 100%;
    height: auto;
}

.c4c-nav {
    gap: clamp(8px, 1.05vw, 20px);
}

.c4c-nav .nav-link {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 46px;
    padding: 9px clamp(14px, 1.3vw, 26px) !important;
    color: #fffaf1;
    background: var(--c4c-accent);
    border: 1px solid var(--c4c-button-border);
    border-radius: 999px;
    font-size: var(--c4c-type-body);
    line-height: var(--c4c-line-tight);
    white-space: nowrap;
}

.c4c-nav .nav-link:focus-visible,
.c4c-nav .nav-link:hover {
    color: #ffffff;
    background: var(--c4c-deep);
    outline: none;
}

.c4c-nav .nav-link[aria-current] {
    color: #ffffff;
    background: var(--c4c-deep);
}

.c4c-header__toggle {
    position: relative;
    width: 44px;
    height: 44px;
    padding: 0;
    color: var(--c4c-deep);
    border: 1px solid currentColor;
    border-radius: 50%;
    box-shadow: none !important;
}

.c4c-header__toggle-icon {
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
    font-size: 1.75rem;
    line-height: 1;
    transition: opacity 180ms ease, transform 180ms ease;
}

.c4c-header__toggle-icon--menu {
    opacity: 1;
    transform: rotate(0deg);
}

.c4c-header__toggle-icon--close {
    opacity: 0;
    transform: rotate(-90deg);
}

.c4c-header__toggle[aria-expanded="true"] .c4c-header__toggle-icon--menu {
    opacity: 0;
    transform: rotate(90deg);
}

.c4c-header__toggle[aria-expanded="true"] .c4c-header__toggle-icon--close {
    opacity: 1;
    transform: rotate(0deg);
}

.c4c-wave-journey {
    position: relative;
    isolation: isolate;
}

.c4c-wave-journey[data-wave-blend="section-5"] {
    isolation: auto;
}

.c4c-wave-journey__visual {
    position: sticky;
    z-index: 5;
    top: 0;
    height: 100vh;
    height: 100dvh;
    margin-bottom: -100vh;
    margin-bottom: -100dvh;
    overflow: hidden;
    pointer-events: none;
}

.c4c-hero-intro {
    position: relative;
    height: 100svh;
}

.c4c-intro {
    position: relative;
    margin-top: -20svh;
}

.c4c-intro__stage {
    position: fixed;
    z-index: 4;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    height: 100dvh;
    overflow: hidden;
    pointer-events: none;
}

.c4c-wave {
    position: absolute;
    z-index: 5;
    inset: 0;
    pointer-events: none;
}

.c4c-wave__svg--cyan {
    opacity: 1;
    transition: opacity 360ms ease;
}

.c4c-wave-journey__visual[data-wave-blend="section-5"]
    .c4c-wave__svg--cyan {
    opacity: 0.5;
}

.c4c-wave svg {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
}

.c4c-wave__layer {
    will-change: d;
}

.c4c-intro__hero {
    position: absolute;
    z-index: 4;
    top: var(--c4c-hero-logo-top);
    left: 50%;
    width: var(--c4c-hero-logo-width);
    opacity: var(--c4c-hero-opacity, 1);
    transform:
        translateX(-50%)
        translateY(calc(
            var(--c4c-hero-logo-anchor-y) + var(--c4c-hero-y, 0px)
        ));
    will-change: opacity, transform;
}

.c4c-intro__hero img {
    display: block;
    width: 100%;
    height: auto;
}

.c4c-intro__title {
    --c4c-title-scale: 1;
    position: relative;
    z-index: 6;
    width: min(34vw, 620px);
    min-height: clamp(84px, 13.5vw, 198px);
    transform: scale(var(--c4c-title-scale));
    transform-origin: left top;
    will-change: transform;
}

.c4c-intro__title-coastal {
    display: grid;
    gap: 12px;
    opacity: 1;
    visibility: visible;
    filter: blur(0);
    transform: scale(1);
    transform-origin: left center;
    will-change: filter, transform;
}

.c4c-intro__title-coastal p {
    margin: 0;
    font-size: var(--c4c-type-lead);
    line-height: 1.5;
}

.c4c-intro__title-coastal img {
    display: block;
    width: 100%;
    height: auto;
}

.c4c-intro__title-c4c {
    position: absolute;
    top: 0;
    left: 0;
    display: flex;
    align-items: flex-end;
    width: 100%;
    margin: 0;
    opacity: 1;
    visibility: hidden;
    filter: blur(16px);
    transform: scale(1.015);
    transform-origin: left center;
    will-change: filter, transform;
}

.c4c-intro__title[data-title-state="c4c"] .c4c-intro__title-coastal {
    animation: c4c-title-coastal-out 480ms ease-in-out forwards;
}

.c4c-intro__title[data-title-state="c4c"] .c4c-intro__title-c4c {
    animation: c4c-title-c4c-in 480ms ease-in-out forwards;
}

.c4c-intro__title[data-title-state="coastal"] .c4c-intro__title-coastal {
    animation: c4c-title-coastal-in 480ms ease-in-out forwards;
}

.c4c-intro__title[data-title-state="coastal"] .c4c-intro__title-c4c {
    animation: c4c-title-c4c-out 480ms ease-in-out forwards;
}

.c4c-intro__title--instant .c4c-intro__title-coastal,
.c4c-intro__title--instant .c4c-intro__title-c4c {
    animation: none !important;
}

.c4c-intro__title--instant[data-title-state="coastal"] .c4c-intro__title-coastal,
.c4c-intro__title--instant[data-title-state="c4c"] .c4c-intro__title-c4c {
    opacity: 1;
    visibility: visible;
    filter: blur(0);
    transform: scale(1);
}

.c4c-intro__title--instant[data-title-state="coastal"] .c4c-intro__title-c4c,
.c4c-intro__title--instant[data-title-state="c4c"] .c4c-intro__title-coastal {
    opacity: 0;
    visibility: hidden;
    filter: blur(16px);
}

@keyframes c4c-title-coastal-out {
    0%, 45% {
        visibility: visible;
        filter: blur(0);
        transform: scale(1);
    }
    49% {
        visibility: visible;
        filter: blur(16px);
        transform: scale(0.985);
    }
    50%, 100% {
        visibility: hidden;
        filter: blur(16px);
        transform: scale(0.985);
    }
}

@keyframes c4c-title-coastal-in {
    0%, 49% {
        visibility: hidden;
        filter: blur(16px);
        transform: scale(0.985);
    }
    50% {
        visibility: visible;
        filter: blur(16px);
        transform: scale(0.985);
    }
    100% {
        visibility: visible;
        filter: blur(0);
        transform: scale(1);
    }
}

@keyframes c4c-title-c4c-in {
    0%, 49% {
        visibility: hidden;
        filter: blur(16px);
        transform: scale(1.015);
    }
    50% {
        visibility: visible;
        filter: blur(16px);
        transform: scale(1.015);
    }
    100% {
        visibility: visible;
        filter: blur(0);
        transform: scale(1);
    }
}

@keyframes c4c-title-c4c-out {
    0%, 45% {
        visibility: visible;
        filter: blur(0);
        transform: scale(1);
    }
    49% {
        visibility: visible;
        filter: blur(16px);
        transform: scale(1.015);
    }
    50%, 100% {
        visibility: hidden;
        filter: blur(16px);
        transform: scale(1.015);
    }
}

.c4c-intro__title-c4c img {
    display: block;
    width: min(82%, 410px);
    height: auto;
}

.c4c-intro__title-c4c span {
    margin: 0 0 2% 14px;
    font-size: var(--c4c-type-logo-caption);
    font-weight: 700;
    line-height: 1;
    white-space: nowrap;
}

.c4c-flow-section {
    position: relative;
    overflow: clip;
    scroll-margin-top: 0;
}

.c4c-flow-section--pinned {
    --c4c-section-hold-distance: var(--c4c-section-hold-default);
    min-height: calc(
        100dvh - var(--c4c-header-height) +
        var(--c4c-section-hold-distance)
    );
    overflow: visible;
}

.c4c-flow-section__pin {
    position: sticky;
    z-index: 6;
    top: var(--c4c-header-height);
    height: calc(100dvh - var(--c4c-header-height));
    overflow: hidden;
}

.c4c-flow-section.c4c-flow-section--pinned .c4c-flow-section__content {
    height: 100%;
    min-height: 0;
}

.c4c-flow-section--service {
    --c4c-section-hold-distance: var(--c4c-section-hold-monitor);
}

.c4c-flow-section--overview {
    --c4c-section-hold-distance: var(--c4c-section-hold-overview);
}

.c4c-flow-section--realtime {
    --c4c-section-hold-distance: var(--c4c-section-hold-realtime);
}

.c4c-flow-section--high-accuracy {
    --c4c-section-hold-distance: var(--c4c-section-hold-high-accuracy);
}

.c4c-flow-section--pinpoint {
    --c4c-section-hold-distance: var(--c4c-section-hold-pinpoint);
}

.c4c-flow-section--simulation {
    --c4c-section-hold-distance: var(--c4c-section-hold-simulation);
}

.c4c-flow-section__content {
    position: relative;
    z-index: 6;
    display: flex;
    align-items: center;
    min-height: 100svh;
    padding-top: calc(var(--c4c-header-height) + clamp(42px, 6svh, 80px));
    padding-bottom: clamp(80px, 12svh, 150px);
}

:is(
    .c4c-intro__title,
    .c4c-flow-section__content,
    .c4c-realtime__map-layer,
    .c4c-feature-visual,
    .c4c-use-cases__grid,
    .c4c-monitor-entry__layout,
    .c4c-service-roadmap__content,
    .c4c-future__inner,
    .c4c-contact__layout,
    .c4c-content-page__layout
)[data-header-occlusion="active"] {
    -webkit-mask-image: linear-gradient(
        to bottom,
        transparent 0,
        transparent var(--c4c-content-occlusion-start),
        #000 var(--c4c-content-occlusion-end),
        #000 100%
    );
    mask-image: linear-gradient(
        to bottom,
        transparent 0,
        transparent var(--c4c-content-occlusion-start),
        #000 var(--c4c-content-occlusion-end),
        #000 100%
    );
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
}

.c4c-flow-section--about .c4c-flow-section__content {
    align-items: flex-start;
    min-height: 0;
    padding-top: clamp(48px, 6svh, 80px);
}

.c4c-flow-section--about {
    min-height: 0;
    overflow: visible;
}

.c4c-about__pin {
    position: relative;
    z-index: 6;
}

.c4c-flow-section--about[data-pin-state="enabled"] {
    min-height: calc(
        var(--c4c-about-pin-height) + var(--c4c-about-pin-distance)
    );
}

.c4c-flow-section--about[data-pin-state="enabled"] .c4c-about__pin {
    position: sticky;
    top: var(--c4c-about-pin-top);
}

.c4c-section-heading {
    margin: 0 0 clamp(28px, 4svh, 48px);
    font-size: var(--c4c-type-section);
    font-weight: 500;
    line-height: 1.55;
}

.c4c-copy {
    font-size: var(--c4c-type-body);
    font-weight: 500;
    line-height: 1.9;
}

.c4c-copy p {
    margin: 0 0 1.65em;
}

.c4c-join {
    margin: clamp(20px, 3svh, 36px) 0 0;
    font-size: var(--c4c-type-section);
    line-height: var(--c4c-line-tight);
}

.c4c-section-label {
    margin: 0 0 clamp(18px, 2.5svh, 30px);
    font-size: var(--c4c-type-body);
    font-weight: 500;
    line-height: 1.5;
}

.c4c-section-label::before {
    display: block;
    width: 96px;
    height: 3px;
    margin-bottom: 10px;
    background: currentColor;
    content: "";
}

.c4c-section-label--plain-bold {
    font-weight: 700;
}

.c4c-section-label--plain-bold::before {
    display: none;
}

.c4c-section-label--ruled {
    width: 128px;
    margin-bottom: clamp(28px, 4svh, 48px);
    padding: 9px 0;
    border-top: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    line-height: 1.15;
    text-align: center;
}

.c4c-section-label--ruled::before,
.c4c-section-label--ruled::after {
    display: none;
}

.c4c-display-heading {
    margin: 0 0 clamp(40px, 6svh, 72px);
    font-size: var(--c4c-type-display);
    font-weight: 500;
    line-height: var(--c4c-line-heading);
}

.c4c-flow-section--overview .c4c-flow-section__content {
    min-height: max(100svh, 760px);
}

.c4c-overview__copy {
    position: relative;
    z-index: 2;
    margin-left: auto;
}

.c4c-overview__heading {
    margin: 0;
    font-size: clamp(1.75rem, 2.55vw, 3.25rem);
    font-weight: 600;
    line-height: 1.55;
}

.c4c-flow-section--realtime .c4c-flow-section__content {
    padding-top: clamp(42px, 6svh, 80px);
    padding-bottom: clamp(42px, 6svh, 80px);
}

.c4c-detail-column {
    position: relative;
    z-index: 7;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.c4c-flow-section--realtime .c4c-detail-column {
    position: static;
}

.c4c-detail-heading {
    margin: 0 0 clamp(28px, 4svh, 48px);
    font-size: clamp(1.75rem, 2.45vw, 3rem);
    font-weight: 600;
    line-height: 1.5;
}

.c4c-detail-copy {
    max-width: 34em;
    margin: 0;
    font-size: var(--c4c-type-lead);
    font-weight: 500;
    line-height: 1.9;
}

.c4c-detail-download {
    margin-top: clamp(30px, 4svh, 48px);
}

.c4c-detail-download-copy {
    margin: 0;
}

.c4c-detail-download .c4c-detail-download-button {
    margin-top: clamp(12px, 1.5svh, 18px);
}

.c4c-detail-media {
    display: none;
}

.c4c-sample-image {
    position: relative;
    isolation: isolate;
}

.c4c-sample-image::after {
    content: "SAMPLE";
    position: absolute;
    z-index: 2;
    top: 50%;
    left: 50%;
    padding: 0.35em 0.7em;
    color: #fff;
    background: rgba(4, 0, 180, 0.72);
    border: 1px solid rgba(255, 255, 255, 0.88);
    font-size: clamp(1rem, 2.5vw, 2.25rem);
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0;
    text-shadow: 0 1px 8px rgba(0, 0, 64, 0.55);
    pointer-events: none;
    transform: translate(-50%, -50%);
}

.c4c-realtime__map-layer {
    position: absolute;
    z-index: 6;
    inset: 0;
    pointer-events: none;
}

.c4c-realtime__map {
    position: absolute;
    top: calc(50% + var(--c4c-left-wave-section-5-map-y-offset));
    left: var(--c4c-left-wave-section-5-map-center);
    display: block;
    width: var(--c4c-left-wave-section-5-map-width);
    max-width: calc(var(--c4c-left-wave-section-5-width) - 12vw);
    max-height: calc(100% - 64px);
    height: auto;
    opacity: 0;
    filter: blur(5px);
    object-fit: contain;
    transform: translate3d(calc(-50% - 72px), -50%, 0);
    transition:
        opacity 420ms ease-out,
        filter 620ms ease-out,
        transform 720ms cubic-bezier(0.16, 1, 0.3, 1);
    will-change: opacity, filter, transform;
}

.c4c-realtime__pin[data-map-visible="true"] .c4c-realtime__map {
    opacity: 1;
    filter: blur(0);
    transform: translate3d(-50%, -50%, 0);
}

.c4c-map-signal {
    transform-box: fill-box;
    transform-origin: center;
}

.c4c-realtime__pin[data-map-visible="true"] .c4c-map-signal {
    animation: c4c-map-signal-pulse var(--c4c-map-signal-duration, 3.4s)
        var(--c4c-map-signal-delay, 0s) ease-in-out infinite;
}

@keyframes c4c-map-signal-pulse {
    0%, 42%, 61%, 100% {
        opacity: 0.06;
        transform: scale(0.98);
    }

    44%, 57% {
        opacity: var(--c4c-map-signal-peak, 0.95);
        transform: scale(1);
    }

    59% {
        opacity: 0.18;
    }
}

.c4c-flow-section--feature {
    --c4c-feature-text-track: 50%;
}

.c4c-flow-section--feature .c4c-flow-section__content {
    padding-top: clamp(42px, 6svh, 80px);
    padding-bottom: clamp(42px, 6svh, 80px);
}

@media (min-width: 1200px) {
    .c4c-flow-section--feature {
        --c4c-feature-text-track: 41.66666667%;
    }

    .c4c-feature-visual {
        right: calc(
            var(--c4c-feature-text-track) +
            (var(--c4c-shell-padding) / 6)
        );
    }
}

.c4c-flow-section--feature .c4c-detail-heading {
    font-size: clamp(1.75rem, 2.15vw, 2.75rem);
}

.c4c-feature-visual {
    position: absolute;
    z-index: 6;
    top: 0;
    right: var(--c4c-feature-text-track);
    bottom: 0;
    left: var(--c4c-shell-content-start);
    display: flex;
    align-items: center;
    justify-content: flex-start;
    overflow: clip;
    pointer-events: none;
}

.c4c-feature-visual__picture {
    display: block;
    flex: 0 1 1040px;
    width: 100%;
    min-width: 0;
    max-width: 1040px;
}

.c4c-feature-visual__image {
    display: block;
    width: 100%;
    max-width: none;
    max-height: calc(100dvh - var(--c4c-header-height) - 96px);
    height: auto;
    object-fit: contain;
    object-position: left center;
    filter: drop-shadow(0 22px 42px rgba(4, 0, 180, 0.14));
}

@media (min-width: 768px) and (max-height: 720px) {
    #simulation-3d .c4c-feature-visual__image {
        object-position: center;
    }
}

.c4c-flow-section--high-accuracy .c4c-feature-visual {
    padding: clamp(28px, 3vw, 56px) clamp(30px, 3vw, 56px)
        clamp(28px, 3vw, 56px) 0;
}

.c4c-flow-section--high-accuracy .c4c-feature-visual__picture {
    box-sizing: border-box;
    line-height: 0;
}

.c4c-flow-section--high-accuracy .c4c-feature-visual__image {
    width: auto;
    max-width: 100%;
    border: 1px solid var(--c4c-deep);
    filter: none;
}

.c4c-detail-column--feature {
    margin-left: auto;
}

.c4c-use-cases {
    position: relative;
    z-index: 7;
    padding-top: var(--c4c-header-height);
    scroll-margin-top: 0;
}

.c4c-use-cases__grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    border-top: 2px solid var(--c4c-deep);
}

.c4c-use-cases__intro,
.c4c-use-case {
    min-width: 0;
    min-height: clamp(520px, 42vw, 680px);
    padding: clamp(44px, 3.5vw, 64px);
    border-right: 2px solid var(--c4c-deep);
    border-bottom: 2px solid var(--c4c-deep);
}

.c4c-use-cases__grid > :nth-child(3n) {
    border-right: 0;
}

.c4c-use-cases__intro {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.c4c-use-cases__heading {
    margin: 0;
    font-size: clamp(2.5rem, 3.2vw, 3.5rem);
    font-weight: 500;
    line-height: 1.45;
}

.c4c-use-cases__heading span {
    display: block;
    white-space: nowrap;
}

.c4c-use-case {
    position: relative;
    display: flex;
    flex-direction: column;
    transition: background-color 180ms ease-out;
}

.c4c-use-case:hover,
.c4c-use-case:focus-within {
    background-color: #ebe7d8;
}

.c4c-use-case__icons {
    display: flex;
    flex-wrap: wrap;
    gap: clamp(8px, 0.8vw, 14px);
    min-height: 68px;
    margin-bottom: clamp(24px, 2.4vw, 38px);
}

.c4c-use-case__icons img {
    display: block;
    flex: 0 0 auto;
    width: clamp(54px, 4vw, 68px);
    height: auto;
    aspect-ratio: 1;
}

.c4c-use-case__title {
    margin: 0 0 8px;
    font-size: clamp(1.5rem, 1.65vw, 2rem);
    font-weight: 500;
    line-height: var(--c4c-line-heading);
}

.c4c-use-case__audience {
    min-height: 3em;
    margin: 0;
    font-size: var(--c4c-type-small);
    font-weight: 500;
    line-height: 1.65;
}

.c4c-use-case__body {
    margin: clamp(24px, 2.4vw, 38px) 0 32px;
    padding-top: clamp(24px, 2.4vw, 38px);
    border-top: 2px solid var(--c4c-deep);
    font-size: var(--c4c-type-body);
    font-weight: 500;
    line-height: var(--c4c-line-copy);
}

.c4c-use-case__link {
    display: block;
    width: fit-content;
    margin-top: auto;
    color: var(--c4c-blue);
    font-size: var(--c4c-type-body);
    font-weight: 500;
    line-height: 1.4;
    text-decoration: none;
}

.c4c-use-case__link-inner {
    display: inline-flex;
    align-items: center;
    gap: 12px;
}

.c4c-use-case__link i {
    display: inline-grid;
    flex: 0 0 38px;
    width: 38px;
    height: 38px;
    border: 2px solid currentColor;
    border-radius: 50%;
    place-items: center;
    transition: transform 180ms ease-out;
}

.c4c-use-case__link:focus-visible,
.c4c-use-case__link:hover {
    color: var(--c4c-deep);
}

.c4c-use-case__link:focus-visible i,
.c4c-use-case__link:hover i {
    transform: translateX(4px);
}

.c4c-monitor-entry {
    position: relative;
    z-index: 7;
    padding: calc(var(--c4c-header-height) + clamp(76px, 9vw, 150px)) 0
        clamp(120px, 12vw, 210px);
    scroll-margin-top: 0;
}

.c4c-monitor-entry__layout {
    display: grid;
    grid-template-columns: minmax(300px, 5fr) minmax(620px, 7fr);
    gap: clamp(56px, 6vw, 120px);
    align-items: start;
}

.c4c-monitor-entry__intro {
    padding-top: clamp(12px, 2vw, 36px);
}

.c4c-monitor-entry__heading {
    margin: 0 0 clamp(44px, 5vw, 76px);
    font-size: clamp(1.5rem, 1.8vw, 2.25rem);
    font-weight: 500;
    line-height: 1.6;
}

.c4c-monitor-entry__copy {
    max-width: 36rem;
}

.c4c-monitor-entry__form-panel {
    min-width: 0;
    padding: clamp(36px, 4vw, 72px);
    background: rgba(232, 227, 211, 0.9);
    border: 2px solid var(--c4c-deep);
    scroll-margin-top: calc(var(--c4c-header-height) + 24px);
}

.c4c-service-roadmap {
    position: relative;
    z-index: 7;
    padding: 0 0 clamp(120px, 11vw, 190px);
    scroll-margin-top: 0;
}

.c4c-service-roadmap__timeline {
    --c4c-roadmap-arrow-depth: clamp(76px, 7vw, 108px);
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    overflow: hidden;
    margin-bottom: clamp(40px, 4vw, 64px);
}

.c4c-service-roadmap__stage {
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-width: 0;
    min-height: clamp(400px, 35vw, 610px);
    padding: clamp(56px, 6vw, 108px);
    color: #ffffff;
}

.c4c-service-roadmap__stage--monitor {
    position: relative;
    z-index: 2;
    width: 108%;
    padding-right: calc(clamp(56px, 6vw, 108px) + 8%);
    background: var(--c4c-deep);
    clip-path: polygon(
        0 0,
        calc(100% - var(--c4c-roadmap-arrow-depth)) 0,
        100% 50%,
        calc(100% - var(--c4c-roadmap-arrow-depth)) 100%,
        0 100%
    );
}

.c4c-service-roadmap__stage--service {
    position: relative;
    z-index: 1;
    width: 112%;
    margin-left: -12%;
    padding-left: calc(clamp(56px, 6vw, 108px) + 23%);
    background: var(--c4c-cyan);
    clip-path: polygon(
        0 0,
        calc(100% - var(--c4c-roadmap-arrow-depth)) 0,
        100% 50%,
        calc(100% - var(--c4c-roadmap-arrow-depth)) 100%,
        0 100%
    );
}

.c4c-service-roadmap__date {
    margin: 0 0 22px;
    font-size: clamp(1.5rem, 1.8vw, 2rem);
    font-weight: 600;
    line-height: 1.35;
}

.c4c-service-roadmap__stage-title {
    width: min(100%, 360px);
    margin: 0 0 28px;
    padding: 10px 0;
    border-top: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    font-size: clamp(1.75rem, 2vw, 2.375rem);
    font-weight: 600;
    line-height: 1.25;
}

.c4c-service-roadmap__stage-copy {
    max-width: 31rem;
    margin: 0;
    font-size: 1.25rem;
    font-weight: 700;
    line-height: var(--c4c-line-copy);
}

.c4c-service-roadmap__support-list {
    display: grid;
    gap: clamp(28px, 2.5vw, 44px);
}

.c4c-service-roadmap__support {
    position: relative;
    isolation: isolate;
    display: grid;
    grid-template-columns: minmax(300px, 5fr) minmax(0, 7fr);
    gap: clamp(44px, 5vw, 96px);
    align-items: center;
    min-height: clamp(210px, 18vw, 300px);
    padding: clamp(40px, 4vw, 70px) clamp(76px, 7vw, 130px)
        clamp(40px, 4vw, 70px) clamp(48px, 5vw, 88px);
    clip-path: polygon(0 0, calc(100% - 52px) 0, 100% 50%, calc(100% - 52px) 100%, 0 100%);
}

.c4c-service-roadmap__support > h3 {
    grid-column: 1;
    grid-row: 1;
    align-self: end;
    margin: 0;
    font-size: clamp(1.5rem, 1.8vw, 2.125rem);
    font-weight: 600;
    line-height: 1.45;
}

.c4c-service-roadmap__support > p {
    grid-column: 2;
    grid-row: 1 / span 2;
    align-self: center;
}

.c4c-service-roadmap__support::before,
.c4c-service-roadmap__support::after {
    position: absolute;
    z-index: -2;
    inset: 0;
    background: var(--c4c-deep);
    clip-path: inherit;
    content: "";
}

.c4c-service-roadmap__support::after {
    z-index: -1;
    inset: 2px;
    background: var(--c4c-paper);
}

.c4c-service-roadmap__support > p {
    margin: 0;
    font-size: var(--c4c-type-body);
    font-weight: 500;
    line-height: var(--c4c-line-copy);
}

.c4c-service-roadmap__button {
    grid-column: 1;
    grid-row: 2;
    align-self: start;
    justify-self: start;
    margin-top: clamp(22px, 2.5vw, 36px);
}

.c4c-contact-page {
    min-height: 100svh;
}

.c4c-contact {
    padding: calc(var(--c4c-header-height) + clamp(72px, 8vw, 138px)) 0
        clamp(120px, 11vw, 190px);
}

.c4c-contact__layout {
    display: grid;
    grid-template-columns: minmax(230px, 3fr) minmax(0, 9fr);
    gap: clamp(48px, 6vw, 120px);
    align-items: start;
}

.c4c-contact__intro {
    padding-top: 2px;
}

.c4c-contact__intro .c4c-section-label--ruled {
    width: min(100%, 230px);
    margin-bottom: 0;
    font-size: clamp(1rem, 1.2vw, 1.25rem);
    white-space: nowrap;
}

.c4c-contact__form-panel {
    min-width: 0;
    padding: clamp(44px, 4.2vw, 72px);
    background: rgba(232, 227, 211, 0.9);
    border: 2px solid var(--c4c-deep);
}

.c4c-contact__form-panel .wpcf7,
.c4c-contact__form-panel .wpcf7-form,
.c4c-contact-form {
    width: 100%;
    margin: 0;
}

.c4c-contact-form__group,
.c4c-contact-form__row {
    display: grid;
    grid-template-columns: var(--c4c-contact-label-width) minmax(0, 1fr);
    gap: var(--c4c-contact-column-gap);
    align-items: center;
    min-width: 0;
    margin: 0 0 var(--c4c-contact-row-space);
    padding: 0;
    border: 0;
}

.c4c-contact-form__group legend,
.c4c-contact-form__row > label {
    width: auto;
    margin: 0;
    padding: 0;
    color: var(--c4c-deep);
    font-size: var(--c4c-type-body);
    font-weight: 600;
    line-height: 1.5;
    white-space: nowrap;
}

.c4c-contact-form__group legend span,
.c4c-contact-form__row > label span {
    display: block;
    font-size: var(--c4c-type-caption);
    font-weight: 500;
    text-indent: -0.6em;
}

.c4c-contact-form__choices,
.c4c-contact-form__choices .wpcf7-form-control {
    display: flex;
    flex-wrap: wrap;
    gap: 12px clamp(18px, 2.2vw, 36px);
}

.c4c-contact-form__choices .wpcf7-list-item {
    margin: 0;
}

.c4c-contact-form__choices label,
.c4c-contact-form__acceptance,
.c4c-contact-form__acceptance label,
.c4c-contact-form__actions .wpcf7-acceptance label {
    display: inline-flex;
    align-items: flex-start;
    gap: 9px;
    margin: 0;
    font-size: var(--c4c-type-body);
    font-weight: 500;
    line-height: 1.45;
    cursor: pointer;
}

.c4c-contact-form input[type="checkbox"],
.c4c-contact-form input[type="radio"] {
    flex: 0 0 auto;
    width: 1.1rem;
    height: 1.1rem;
    margin-top: 0.12em;
    accent-color: var(--c4c-deep);
}

.c4c-contact-form__row .wpcf7-form-control-wrap {
    display: block;
    width: 100%;
}

.c4c-contact-form__control {
    display: block;
    width: 100%;
    min-height: var(--c4c-contact-control-height);
    padding: 12px 16px;
    color: var(--c4c-deep);
    background: rgba(248, 247, 240, 0.96);
    border: 1.5px solid var(--c4c-deep);
    border-radius: 0;
    font: inherit;
    line-height: 1.4;
    transition: border-color 160ms ease-out, box-shadow 160ms ease-out;
}

textarea.c4c-contact-form__control {
    min-height: var(--c4c-contact-message-height);
    resize: vertical;
}

.c4c-contact-form__control:focus {
    border-color: var(--c4c-cyan);
    box-shadow: 0 0 0 3px rgba(19, 141, 255, 0.2);
    outline: 0;
}

.c4c-contact-form__control::placeholder {
    color: rgba(4, 0, 180, 0.32);
}

.c4c-contact-form__actions {
    display: flex;
    gap: 24px;
    align-items: center;
    justify-content: space-between;
    padding-left: calc(
        var(--c4c-contact-label-width) + var(--c4c-contact-column-gap)
    );
    margin-top: clamp(24px, 2.2vw, 36px);
}

.c4c-contact-form__actions .wpcf7-form-control-wrap,
.c4c-contact-form__actions .wpcf7-acceptance,
.c4c-contact-form__actions .wpcf7-list-item {
    margin: 0;
}

.c4c-contact-form__consent {
    display: grid;
    gap: 6px;
    min-width: 0;
}

.c4c-contact-form__policy-link {
    width: fit-content;
    color: inherit;
    font-size: var(--c4c-type-caption);
    line-height: 1.5;
    text-decoration: underline;
    text-underline-offset: 0.2em;
}

.c4c-contact-form__submit {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    gap: 12px;
    min-width: 132px;
    min-height: 54px;
    padding: 12px 18px 12px 24px;
    color: #fffaf1;
    background: var(--c4c-accent);
    border: 1px solid var(--c4c-button-border);
    border-radius: 999px;
    font-size: var(--c4c-type-body);
    font-weight: 500;
    line-height: 1;
    transition: background-color 160ms ease-out, transform 160ms ease-out;
}

.c4c-contact-form__submit:focus-visible,
.c4c-contact-form__submit:hover {
    color: #ffffff;
    background: var(--c4c-deep);
    transform: translateX(3px);
}

.c4c-contact__form-panel .wpcf7-not-valid-tip {
    margin-top: 6px;
    color: #a21822;
    font-size: var(--c4c-type-caption);
}

.c4c-contact__form-panel .wpcf7-response-output {
    margin: 28px 0 0;
    padding: 14px 16px;
    border-width: 1.5px;
    font-size: var(--c4c-type-small);
}

.c4c-content-page {
    min-height: 100svh;
}

.c4c-content-page__section {
    padding: calc(var(--c4c-header-height) + clamp(72px, 8vw, 138px)) 0
        clamp(120px, 11vw, 190px);
}

.c4c-content-page__layout {
    display: grid;
    grid-template-columns: minmax(230px, 3fr) minmax(0, 9fr);
    gap: clamp(48px, 6vw, 120px);
    align-items: start;
}

.c4c-content-page__intro {
    padding-top: 2px;
}

.c4c-content-page__intro .c4c-section-label--ruled {
    width: min(100%, 230px);
    margin-bottom: 0;
    font-size: clamp(1rem, 1.2vw, 1.25rem);
    white-space: normal;
}

.c4c-content-page__body {
    min-width: 0;
    padding: clamp(44px, 4.2vw, 72px);
    background: rgba(232, 227, 211, 0.9);
    border: 2px solid var(--c4c-deep);
    font-size: var(--c4c-type-body);
    font-weight: 500;
    line-height: var(--c4c-line-copy);
}

.c4c-content-page__body > :first-child {
    margin-top: 0;
}

.c4c-content-page__body > :last-child {
    margin-bottom: 0;
}

.c4c-content-page__body > h1:first-child {
    display: none;
}

.c4c-content-page__body h2 {
    margin: clamp(42px, 4vw, 64px) 0 0.8em;
    font-size: clamp(1.25rem, 1.6vw, 1.75rem);
    font-weight: 600;
    line-height: var(--c4c-line-heading);
}

.c4c-content-page__body h3 {
    margin: clamp(32px, 3vw, 48px) 0 0.7em;
    font-size: clamp(1.125rem, 1.35vw, 1.5rem);
    font-weight: 600;
    line-height: var(--c4c-line-heading);
}

.c4c-content-page__body p,
.c4c-content-page__body ul,
.c4c-content-page__body ol {
    margin: 0 0 1.5em;
}

.c4c-content-page__body li + li {
    margin-top: 0.45em;
}

body:not(.c4c-front-page) .c4c-footer {
    background: var(--c4c-deep);
    opacity: 1;
    transform: none;
}

.c4c-monitor-entry .wpcf7,
.c4c-monitor-entry .wpcf7-form,
.c4c-monitor-form {
    width: 100%;
    margin: 0;
}

.c4c-monitor-form__header {
    margin-bottom: clamp(42px, 4vw, 68px);
}

.c4c-monitor-form__title {
    width: fit-content;
    margin: 0 0 clamp(24px, 2.5vw, 38px);
    padding: 10px 4px;
    border-top: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    font-size: clamp(1.25rem, 1.45vw, 1.625rem);
    font-weight: 600;
    line-height: 1.2;
}

.c4c-monitor-form__header p {
    max-width: 58rem;
    margin: 0;
    font-size: var(--c4c-type-body);
    font-weight: 500;
    line-height: var(--c4c-line-copy);
}

.c4c-monitor-form__group {
    display: grid;
    grid-template-columns: clamp(110px, 10vw, 160px) minmax(0, 1fr);
    gap: 14px clamp(20px, 2vw, 36px);
    min-width: 0;
    margin: 0 0 clamp(26px, 2.4vw, 38px);
    padding: 0;
    border: 0;
}

.c4c-monitor-form__group legend,
.c4c-monitor-form__row > label {
    width: auto;
    margin: 0;
    padding: 0;
    color: var(--c4c-deep);
    font-size: var(--c4c-type-body);
    font-weight: 600;
    line-height: 1.45;
}

.c4c-monitor-form__group legend span,
.c4c-monitor-form__row > label span {
    display: block;
    font-size: var(--c4c-type-caption);
    font-weight: 500;
    text-indent: -0.6em;
}

.c4c-monitor-form__choices,
.c4c-monitor-form__choices .wpcf7-form-control {
    display: flex;
    flex-wrap: wrap;
    gap: 12px clamp(18px, 2vw, 32px);
    min-width: 0;
    width: 100%;
}

.c4c-monitor-form__choices {
    grid-column: -2 / -1;
}

.c4c-monitor-form__choices .wpcf7-list-item {
    margin: 0;
}

.c4c-monitor-form__choices .wpcf7-list-item.has-free-text {
    display: grid;
    grid-template-columns: max-content minmax(100px, 260px);
    gap: 12px;
    align-items: center;
    flex-basis: 100%;
    width: fit-content;
    max-width: 100%;
}

.c4c-monitor-form__choices .wpcf7-list-item.has-free-text label {
    display: inline-flex;
    align-items: center;
}

.c4c-monitor-form__choices .wpcf7-free-text {
    width: 260px;
    max-width: 100%;
    min-height: 54px;
    padding: 12px 16px;
    color: var(--c4c-deep);
    background: var(--c4c-paper);
    border: 1.5px solid var(--c4c-deep);
    border-radius: 0;
}

.c4c-monitor-form__choices label,
.c4c-monitor-form__acceptance,
.c4c-monitor-form__acceptance label,
.c4c-monitor-form__actions .wpcf7-acceptance label {
    display: inline-flex;
    align-items: flex-start;
    gap: 9px;
    margin: 0;
    font-size: var(--c4c-type-body);
    font-weight: 500;
    line-height: 1.45;
    cursor: pointer;
}

.c4c-monitor-form input[type="checkbox"],
.c4c-monitor-form input[type="radio"] {
    flex: 0 0 auto;
    width: 1.1rem;
    height: 1.1rem;
    margin-top: 0.12em;
    accent-color: var(--c4c-deep);
}

.c4c-monitor-form__other {
    display: grid;
    grid-column: -2 / -1;
    grid-template-columns: max-content minmax(100px, 260px);
    gap: 12px;
    align-items: center;
    width: fit-content;
    max-width: 100%;
    font-size: var(--c4c-type-body);
    font-weight: 500;
}

.c4c-monitor-form__other label {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    margin: 0;
    cursor: pointer;
}

.c4c-monitor-form__other .wpcf7-form-control-wrap,
.c4c-monitor-form__row .wpcf7-form-control-wrap {
    display: block;
    width: 100%;
}

.c4c-monitor-form__row {
    display: grid;
    grid-template-columns: clamp(110px, 10vw, 160px) minmax(0, 1fr);
    gap: clamp(20px, 2vw, 36px);
    align-items: center;
    margin-bottom: clamp(24px, 2.2vw, 34px);
}

.c4c-monitor-form__student[hidden] {
    display: none !important;
}

.c4c-monitor-form__control {
    display: block;
    width: 100%;
    min-height: 54px;
    padding: 12px 16px;
    color: var(--c4c-deep);
    background: rgba(248, 247, 240, 0.96);
    border: 1.5px solid var(--c4c-deep);
    border-radius: 0;
    font: inherit;
    line-height: 1.4;
    transition: border-color 160ms ease-out, box-shadow 160ms ease-out;
}

textarea.c4c-monitor-form__control {
    min-height: 150px;
    resize: vertical;
}

.c4c-monitor-form__control:focus {
    border-color: var(--c4c-cyan);
    box-shadow: 0 0 0 3px rgba(19, 141, 255, 0.2);
    outline: 0;
}

.c4c-monitor-form__control::placeholder {
    color: rgba(4, 0, 180, 0.32);
}

.c4c-monitor-form__actions {
    display: flex;
    gap: 24px;
    align-items: center;
    justify-content: space-between;
    margin-top: clamp(32px, 3vw, 52px);
}

.c4c-monitor-form__actions .wpcf7-form-control-wrap,
.c4c-monitor-form__actions .wpcf7-acceptance,
.c4c-monitor-form__actions .wpcf7-list-item {
    margin: 0;
}

.c4c-monitor-form__consent {
    display: grid;
    gap: 10px;
    min-width: 0;
}

.c4c-monitor-form__policy-links {
    display: flex;
    flex-wrap: wrap;
    gap: 2px;
    padding-left: calc(1.1rem + 9px);
    font-size: var(--c4c-type-small);
    line-height: 1.5;
}

.c4c-monitor-form__policy-links a {
    color: inherit;
    text-decoration: underline;
    text-underline-offset: 0.2em;
}

.c4c-monitor-form__submit {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    gap: 12px;
    min-width: 132px;
    min-height: 54px;
    padding: 12px 18px 12px 24px;
    color: #fffaf1;
    background: var(--c4c-accent);
    border: 1px solid var(--c4c-button-border);
    border-radius: 999px;
    font-size: var(--c4c-type-body);
    font-weight: 500;
    line-height: 1;
    transition: background-color 160ms ease-out, transform 160ms ease-out;
}

.c4c-monitor-form__submit i {
    font-size: var(--c4c-type-icon);
}

.c4c-monitor-form__submit:focus-visible,
.c4c-monitor-form__submit:hover {
    color: #fff;
    background: var(--c4c-deep);
    transform: translateX(3px);
}

.c4c-monitor-entry .wpcf7-not-valid-tip {
    margin-top: 6px;
    color: #a21822;
    font-size: var(--c4c-type-caption);
}

.c4c-monitor-entry .wpcf7-response-output {
    margin: 28px 0 0;
    padding: 14px 16px;
    border-width: 1.5px;
    font-size: var(--c4c-type-small);
}

.c4c-monitor-entry .wpcf7-spinner {
    margin: 0 0 0 10px;
}

.c4c-service-lockup {
    display: flex;
    align-items: flex-end;
    gap: clamp(16px, 1.6vw, 30px);
    width: 100%;
    margin-bottom: clamp(36px, 5svh, 64px);
}

.c4c-service-lockup__symbol,
.c4c-service-lockup__wordmark {
    display: block;
    width: 47%;
    height: auto;
}

.c4c-service-lockup__wordmark {
    margin-bottom: 7%;
}

.c4c-flow-section--service .c4c-flow-section__content {
    min-height: max(100svh, 860px);
}

.c4c-service__layout {
    display: grid;
    grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
    grid-template-areas:
        "heading visual"
        "body visual";
    column-gap: 0;
    align-items: center;
}

.c4c-service__layout > * {
    width: 100%;
    max-width: none;
}

.c4c-service__heading {
    grid-area: heading;
    align-self: end;
}

.c4c-service__body {
    grid-area: body;
    align-self: start;
}

.c4c-service__visual {
    grid-area: visual;
}

.c4c-service__copy {
    position: relative;
    z-index: 2;
}

.c4c-service__visual {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    min-width: 0;
    padding: clamp(18px, 2vw, 36px) clamp(18px, 2.5vw, 44px);
}

.c4c-service__picture {
    position: relative;
    display: block;
    width: min(60vw, 1040px);
    transform: translateX(-6%);
}

.c4c-flow-section--service .c4c-service__picture {
    box-sizing: border-box;
    overflow: hidden;
    width: min(58vw, 1000px);
    border: 1px solid var(--c4c-deep);
    line-height: 0;
    transform: translateX(-3%);
}

.c4c-service__preview {
    display: block;
    width: 100%;
    max-width: none;
    height: auto;
}

.c4c-service__poster {
    display: block;
    transition: opacity 160ms ease;
}

.c4c-service__video {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 0;
    transition: opacity 160ms ease;
    pointer-events: none;
}

.c4c-service__picture:is(
        [data-c4c-video-state="ready"],
        [data-c4c-video-state="playing"],
        [data-c4c-video-state="paused"]
    ) .c4c-service__poster {
    opacity: 0;
}

.c4c-service__picture:is(
        [data-c4c-video-state="ready"],
        [data-c4c-video-state="playing"],
        [data-c4c-video-state="paused"]
    ) .c4c-service__video {
    opacity: 1;
}

.c4c-flow-section--service .c4c-service__preview {
    filter: none;
}

@media (min-width: 1200px) and (min-height: 721px) {
    .c4c-flow-section--service .c4c-service__visual {
        padding: clamp(36px, 3.5vw, 56px) clamp(44px, 4.5vw, 72px);
    }

    .c4c-flow-section--service .c4c-service__picture {
        width: 100%;
        max-width: 880px;
        margin: 0 auto;
        transform: none;
    }

    .c4c-flow-section--feature .c4c-feature-visual {
        padding: clamp(40px, 4vw, 64px) clamp(48px, 4.5vw, 72px);
    }

    .c4c-flow-section--feature .c4c-feature-visual__picture {
        flex-basis: 900px;
        max-width: 900px;
    }
}

.c4c-lead-copy {
    margin: 0;
    font-size: var(--c4c-type-lead);
    font-weight: 500;
    line-height: 1.85;
}

.c4c-button {
    display: inline-flex;
    align-items: center;
    gap: 14px;
    min-height: 54px;
    margin-top: clamp(28px, 4svh, 46px);
    padding: 12px 16px 12px 20px;
    color: #fffaf1;
    background: var(--c4c-accent);
    border: 1px solid var(--c4c-button-border);
    border-radius: 6px;
    font-size: var(--c4c-type-small);
    line-height: var(--c4c-line-tight);
    text-decoration: none;
}

.c4c-button__icon {
    display: grid;
    flex: 0 0 32px;
    place-items: center;
    width: 32px;
    min-width: 32px;
    height: 32px;
    aspect-ratio: 1;
    border: 2px solid currentColor;
    border-radius: 50%;
    font-size: var(--c4c-type-icon);
    line-height: 1;
}

.c4c-button:focus-visible,
.c4c-button:hover {
    color: #ffffff;
    background: var(--c4c-deep);
}

.c4c-button--rich {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    transition:
        color 180ms ease,
        transform 360ms cubic-bezier(0.22, 1, 0.36, 1),
        box-shadow 360ms cubic-bezier(0.22, 1, 0.36, 1);
}

.c4c-button--rich::before {
    position: absolute;
    z-index: -1;
    inset: -1px;
    background: var(--c4c-deep);
    content: "";
    transform: translateX(-112%);
    transition: transform 460ms cubic-bezier(0.22, 1, 0.36, 1);
}

.c4c-button--rich > span,
.c4c-button--rich .c4c-button__icon {
    position: relative;
    z-index: 1;
}

.c4c-button--rich .c4c-button__icon {
    transition:
        color 180ms ease,
        background-color 180ms ease,
        transform 420ms cubic-bezier(0.22, 1, 0.36, 1);
}

.c4c-button--rich:focus-visible,
.c4c-button--rich:hover {
    color: #ffffff;
    background: var(--c4c-accent);
    box-shadow: 0 12px 24px rgb(4 0 180 / 18%);
    transform: translateY(-2px);
}

.c4c-button--rich:focus-visible::before,
.c4c-button--rich:hover::before {
    transform: translateX(0);
}

.c4c-button--rich:focus-visible .c4c-button__icon,
.c4c-button--rich:hover .c4c-button__icon {
    color: var(--c4c-deep);
    background: #ffffff;
    transform: translateX(4px);
}

.c4c-button--rich:active {
    box-shadow: 0 6px 12px rgb(4 0 180 / 14%);
    transform: translateY(0);
}

.c4c-future {
    position: relative;
    z-index: 2;
    padding: clamp(120px, 16svh, 210px) var(--c4c-shell-padding)
        clamp(150px, 14svh, 210px);
    scroll-margin-top: 0;
}

.c4c-footer-journey {
    position: relative;
    isolation: isolate;
    overflow: clip;
}

.c4c-footer-tide {
    position: absolute;
    z-index: 1;
    inset: 0;
    pointer-events: none;
}

.c4c-footer-tide svg {
    display: block;
    width: 100%;
    height: 100%;
}

@media (max-width: 1199.98px) {
    .c4c-footer-tide svg {
        position: absolute;
        left: 50%;
        width: 100%;
        min-width: var(--c4c-footer-tide-mobile-min-width);
        max-width: none;
        transform: translateX(-50%);
    }
}

.c4c-footer-tide__layer {
    will-change: d;
}

.c4c-future__inner {
    position: relative;
    max-width: 1200px;
    container-type: inline-size;
}

.c4c-future .c4c-section-label--ruled {
    margin: 0 0 clamp(28px, 4svh, 48px);
}

.c4c-future .c4c-display-heading {
    width: min(100%, var(--c4c-footer-card-width));
    margin-right: auto;
    margin-left: auto;
    font-size: clamp(1.125rem, calc(0.75rem + 2.4cqi), 2.5rem);
    font-weight: 600;
    line-height: 1.55;
    white-space: nowrap;
}

.c4c-future__copy {
    width: min(100%, var(--c4c-footer-card-width));
    max-width: var(--c4c-footer-card-width);
    margin: 0 auto;
    font-size: var(--c4c-type-body);
    text-align: center;
}

@media (min-width: 1200px) {
    .c4c-future .c4c-section-label--ruled {
        position: absolute;
        top: 12px;
        left: calc(50% - 480px);
        margin: 0;
    }
}

@media (max-width: 1199.98px) {
    .c4c-future .c4c-section-label--ruled {
        margin-top: 0;
    }
}

.c4c-footer-card-wrap {
    position: relative;
    z-index: 3;
    display: grid;
    place-items: center;
    padding: 0 var(--c4c-shell-padding);
    margin-top: clamp(72px, 8svh, 112px);
}

.c4c-footer-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: min(
        var(--c4c-footer-card-width),
        calc(100vw - (var(--c4c-shell-padding) * 2))
    );
    min-height: 500px;
    padding: 52px 48px;
    color: var(--c4c-deep);
    background: var(--c4c-paper);
    opacity: var(--c4c-footer-card-opacity, 0);
    filter: blur(var(--c4c-footer-card-blur, 8px));
    transform: translate3d(
        0,
        var(--c4c-footer-card-y, 72px),
        0
    ) scale(var(--c4c-footer-card-scale, 0.94));
    transform-origin: 50% 75%;
    will-change: opacity, filter, transform;
}

.c4c-footer-journey[data-footer-card="hidden"] .c4c-footer-card {
    pointer-events: none;
}

.c4c-footer-card__lockup {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 18px;
    width: 100%;
}

.c4c-footer-card__symbol {
    display: block;
    width: min(280px, 78%);
    height: auto;
}

.c4c-footer-card__wordmark {
    display: block;
    width: min(250px, 72%);
    height: auto;
}

.c4c-footer-card__actions {
    display: grid;
    gap: 18px;
    width: min(310px, 100%);
    margin-top: 42px;
}

.c4c-footer-card__button {
    justify-content: space-between;
    width: 100%;
    margin-top: 0;
    font-size: var(--c4c-type-small);
}

.c4c-footer {
    position: relative;
    z-index: 2;
    color: #ffffff;
    background: transparent;
    opacity: var(--c4c-footer-content-reveal, 0);
    transform: translateY(var(--c4c-footer-content-y, 24px));
    will-change: opacity, transform;
}

.c4c-footer__inner {
    padding-top: clamp(76px, 9svh, 120px);
    padding-bottom: clamp(46px, 6svh, 76px);
}

.c4c-footer__nav {
    display: grid;
    grid-template-columns: repeat(3, max-content);
    gap: 22px 34px;
    font-size: var(--c4c-type-small);
}

.c4c-footer__nav a {
    color: #ffffff;
    text-decoration: none;
}

.c4c-footer__nav a:hover,
.c4c-footer__nav a:focus-visible {
    text-decoration: underline;
}

.c4c-footer__company {
    font-size: var(--c4c-type-caption);
    line-height: 1.65;
}

.c4c-footer__company p:last-child {
    margin-bottom: 0;
}

.c4c-footer__department {
    margin-left: 1em;
}

.c4c-footer__policies {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 18px;
    margin-top: 18px;
    font-size: var(--c4c-type-micro);
    line-height: 1.5;
}

.c4c-footer__policies a {
    color: inherit;
    text-decoration: none;
}

.c4c-footer__policies a:hover,
.c4c-footer__policies a:focus-visible {
    text-decoration: underline;
}

.c4c-footer__copyright {
    margin: 8px 0 0;
    font-size: var(--c4c-type-micro);
    line-height: 1.5;
}

.c4c-footer__mol-logo {
    display: inline-block;
    width: min(270px, 100%);
    height: auto;
}

.c4c-footer__brand-link {
    display: inline-block;
    color: inherit;
    line-height: 0;
    text-decoration: none;
}

.c4c-footer__brand-link:focus-visible {
    outline: 2px solid #ffffff;
    outline-offset: 6px;
}

@media (max-width: 1199px) {
    :root {
        --c4c-type-display: 3rem;
        --c4c-type-section: 1.75rem;
        --c4c-type-feature: 1.5rem;
        --c4c-type-lead: 1.125rem;
        --c4c-header-height: 92px;
        --c4c-wave-max: 35vw;
        --c4c-left-wave-section-5-width: 95vw;
        --c4c-shell-padding: 30px;
    }

    .c4c-nav {
        gap: 7px;
    }

    .c4c-nav .nav-link {
        padding-right: 12px !important;
        padding-left: 12px !important;
    }

    .c4c-use-cases__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .c4c-use-cases__grid > * {
        border-right: 0;
    }

    .c4c-use-cases__grid > .c4c-use-case:nth-of-type(odd) {
        border-right: 2px solid var(--c4c-deep);
    }

    .c4c-use-cases__intro {
        grid-column: 1 / -1;
        min-height: auto;
    }

    .c4c-monitor-entry__layout {
        grid-template-columns: minmax(0, 1fr);
    }

    .c4c-monitor-entry__intro,
    .c4c-monitor-entry__form-panel {
        width: min(100%, 920px);
    }

    .c4c-monitor-entry__form-panel {
        margin-left: auto;
    }

    .c4c-service-roadmap__stage {
        min-height: 430px;
        padding-top: 58px;
        padding-bottom: 58px;
    }

    .c4c-service-roadmap__support {
        grid-template-columns: minmax(260px, 5fr) minmax(0, 7fr);
        gap: 42px;
        padding-left: 42px;
    }

    .c4c-contact__layout {
        grid-template-columns: minmax(0, 1fr);
    }

    .c4c-contact__intro,
    .c4c-content-page__intro {
        width: fit-content;
    }

    .c4c-content-page__layout {
        grid-template-columns: minmax(0, 1fr);
    }

}

@media (min-width: 1200px) {
    .c4c-use-cases .c4c-shell {
        max-width: none;
        padding-right: 0;
        padding-left: 0;
    }

    .c4c-use-case__link-inner {
        gap: 0;
    }

    .c4c-use-case__link-inner > span {
        display: block;
        overflow: hidden;
        max-width: 0;
        opacity: 0;
        white-space: nowrap;
        transform: translateX(-18px);
        transition:
            max-width 520ms cubic-bezier(0.16, 1, 0.3, 1),
            margin-right 520ms cubic-bezier(0.16, 1, 0.3, 1),
            opacity 180ms ease-out 70ms,
            transform 420ms cubic-bezier(0.16, 1, 0.3, 1);
    }

    .c4c-use-case:hover .c4c-use-case__link-inner > span,
    .c4c-use-case:focus-within .c4c-use-case__link-inner > span {
        max-width: 16.5em;
        margin-right: 8px;
        opacity: 1;
        transform: translateX(0);
    }

    .c4c-use-case__link i {
        transform: translateX(0);
    }

    .c4c-use-case:hover .c4c-use-case__link i,
    .c4c-use-case:focus-within .c4c-use-case__link i {
        transform: translateX(0);
    }
}

@media (max-width: 991px) {
    .c4c-header {
        min-height: 76px;
        padding: 16px 0;
    }

    .c4c-header__brand {
        width: 176px;
    }

    .c4c-header__brand,
    .c4c-header__toggle {
        z-index: 2;
    }

    .c4c-header .navbar-collapse {
        position: fixed;
        z-index: 1;
        inset: 0;
        width: 100%;
        min-height: 100dvh;
        padding: calc(var(--c4c-header-height) + 44px)
            var(--c4c-shell-padding) 48px;
        overflow-y: auto;
        background: rgba(248, 247, 240, 0.97);
        border: 0;
        border-radius: 0;
        backdrop-filter: blur(12px);
    }

    .c4c-header .navbar-collapse.collapsing {
        height: 100dvh;
        transition: opacity 220ms ease, transform 280ms var(--c4c-motion-ease-out);
    }

    .c4c-header .navbar-collapse:not(.show) {
        opacity: 0;
        transform: translate3d(0, -16px, 0);
    }

    .c4c-header .navbar-collapse.show {
        opacity: 1;
        transform: translate3d(0, 0, 0);
    }

    .c4c-nav {
        gap: 0;
        align-items: stretch !important;
    }

    .c4c-nav .nav-item {
        border-bottom: 1px solid rgba(4, 0, 180, 0.24);
    }

    .c4c-nav .nav-item:first-child {
        border-top: 1px solid rgba(4, 0, 180, 0.24);
    }

    .c4c-nav .nav-link {
        justify-content: flex-start;
        min-height: 68px;
        padding: 16px 4px !important;
        color: var(--c4c-deep);
        background: transparent;
        border: 0;
        border-radius: 0;
        font-size: clamp(1.125rem, 5vw, 1.375rem);
    }

    .c4c-nav .nav-link:focus-visible,
    .c4c-nav .nav-link:hover,
    .c4c-nav .nav-link[aria-current] {
        color: var(--c4c-deep);
        background: rgba(19, 141, 255, 0.1);
    }

    body.c4c-navigation-open {
        overflow: hidden;
    }
}

/*
 * 1920x1080 at 150% browser zoom exposes roughly a 1280x720 CSS viewport.
 * Keep desktop navigation and typography, but release section pins so short
 * effective viewports cannot crop content or trap it behind sticky stages.
 */
@media (min-width: 1200px) and (max-width: 1400px) and (max-height: 720px) {
    :root {
        /* Mirror the col-xl-5 text track across the viewport center. */
        --c4c-left-wave-section-5-map-center: calc(
            20.833333vw + clamp(40px, 3.2vw, 45px)
        );
    }

    .c4c-flow-section--pinned {
        min-height: 0;
        overflow: clip;
    }

    .c4c-flow-section--pinned > .c4c-flow-section__pin {
        position: relative;
        top: auto;
        height: auto;
        overflow: visible;
    }

    .c4c-flow-section--pinned .c4c-flow-section__content {
        height: auto;
        min-height: max(760px, calc(100svh - var(--c4c-header-height)));
        padding-top: calc(var(--c4c-header-height) + 56px);
        padding-bottom: 72px;
    }

    .c4c-flow-section--about,
    .c4c-flow-section--about[data-pin-state="enabled"] {
        min-height: 0;
    }

    .c4c-flow-section--about .c4c-about__pin,
    .c4c-flow-section--about[data-pin-state="enabled"] .c4c-about__pin {
        position: relative;
        top: auto;
    }

    .c4c-flow-section--overview .c4c-flow-section__content,
    .c4c-flow-section--service .c4c-flow-section__content {
        min-height: max(760px, calc(100svh - var(--c4c-header-height)));
    }

}

/*
 * Tablet and compact-laptop composition for sections 5-8. Release only the
 * sticky behavior; preserve the desktop visual and desktop column layout.
 */
@media (min-width: 768px) and (max-width: 1199px) {
    :root {
        /* Mirror the col-md-6 text track across the viewport center. */
        --c4c-left-wave-section-5-map-center: calc(
            25vw + (var(--c4c-shell-padding) / 2) + 12px
        );
        --c4c-left-wave-section-5-map-y-offset: 31px;
    }

    .c4c-flow-section--pinned {
        min-height: 0;
        overflow: clip;
    }

    .c4c-flow-section--pinned > .c4c-flow-section__pin {
        position: relative;
        top: auto;
        height: auto;
        overflow: visible;
    }

    .c4c-flow-section--pinned .c4c-flow-section__content {
        height: auto;
        min-height: max(760px, calc(100svh - var(--c4c-header-height)));
        padding-top: calc(var(--c4c-header-height) + clamp(56px, 7vw, 88px));
        padding-bottom: clamp(88px, 10vw, 136px);
    }
}

@media (max-width: 767px), (max-width: 900px) and (max-height: 500px) {
    :root {
        --c4c-type-display: 2.5rem;
        --c4c-type-section: 1.5rem;
        --c4c-type-feature: 1.25rem;
        --c4c-type-lead: 1rem;
        --c4c-type-logo-caption: 0.75rem;
        --c4c-type-icon: 1.125rem;
        --c4c-line-copy: 1.8;
        --c4c-header-height: 76px;
        --c4c-content-occlusion-gap: 30px;
        --c4c-content-occlusion-fade: 30px;
        --c4c-wave-max: 20vw;
        --c4c-left-wave-section-4-width: 15vw;
        --c4c-left-wave-section-5-width: 100vw;
        --c4c-mobile-detail-media-width: min(72vw, 340px);
        --c4c-grid-size: 32px;
        --c4c-shell-padding: 24px;
        --c4c-hero-logo-top: 50dvh;
        --c4c-hero-logo-anchor-y: -50%;
        --c4c-hero-logo-width: min(92vw, calc(53svh * 2.078));
    }

    .c4c-wave-journey__visual[data-mobile-left-wave="true"] .c4c-wave__svg {
        opacity: 0.5;
    }

    .c4c-use-cases .c4c-shell {
        padding-right: 0;
        padding-left: 0;
    }

    .c4c-use-cases__grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .c4c-use-cases__grid > *,
    .c4c-use-cases__grid > .c4c-use-case:nth-of-type(odd) {
        border-right: 0;
    }

    .c4c-use-cases__intro {
        grid-column: auto;
    }

    .c4c-use-cases__intro,
    .c4c-use-case {
        min-height: 0;
        padding: 48px 24px;
        border-right: 0;
    }

    .c4c-use-cases__heading {
        font-size: clamp(2.375rem, 11vw, 3.25rem);
    }

    .c4c-use-case__icons {
        min-height: 0;
    }

    .c4c-use-case__audience {
        min-height: 0;
    }

    .c4c-use-case__link {
        margin-top: 12px;
    }

    .c4c-monitor-entry {
        padding-top: calc(var(--c4c-header-height) + 72px);
        padding-bottom: 120px;
    }

    .c4c-monitor-entry__layout {
        gap: 56px;
    }

    .c4c-monitor-entry__heading {
        font-size: clamp(1.75rem, 8.4vw, 2.5rem);
    line-height: 1.55;
}

    .c4c-monitor-entry__form-panel {
        padding: 36px 22px;
    }

    .c4c-service-roadmap {
        padding-top: 0;
        padding-bottom: 120px;
    }

    .c4c-service-roadmap__timeline {
        grid-template-columns: minmax(0, 1fr);
        gap: 16px;
    }

    .c4c-service-roadmap__stage,
    .c4c-service-roadmap__stage--monitor,
    .c4c-service-roadmap__stage--service {
        width: 100%;
        margin-left: 0;
        min-height: 330px;
        padding: 48px 54px 48px 28px;
        clip-path: polygon(0 0, calc(100% - 34px) 0, 100% 50%, calc(100% - 34px) 100%, 0 100%);
    }

    .c4c-service-roadmap__stage-title {
        width: min(100%, 280px);
    }

    .c4c-service-roadmap__support {
        grid-template-columns: minmax(0, 1fr);
        gap: 28px;
        min-height: 0;
        padding: 42px 52px 42px 28px;
        clip-path: polygon(0 0, calc(100% - 30px) 0, 100% 50%, calc(100% - 30px) 100%, 0 100%);
    }

    .c4c-service-roadmap__support > h3 {
        font-size: clamp(1.5rem, 7.4vw, 2rem);
    }

    .c4c-service-roadmap__button {
        width: 100%;
        max-width: 350px;
        justify-content: space-between;
    }

    .c4c-service-roadmap__button > span {
        min-width: 0;
    }

    .c4c-contact {
        padding-top: calc(var(--c4c-header-height) + 72px);
        padding-bottom: 120px;
    }

    .c4c-content-page__section {
        padding-top: calc(var(--c4c-header-height) + 72px);
        padding-bottom: 120px;
    }

    .c4c-contact__layout,
    .c4c-content-page__layout {
        gap: 44px;
    }

    .c4c-contact__intro .c4c-section-label--ruled,
    .c4c-content-page__intro .c4c-section-label--ruled {
        width: fit-content;
        max-width: calc(100vw - (var(--c4c-shell-padding) * 2));
        padding-right: 8px;
        padding-left: 8px;
        white-space: normal;
    }

    .c4c-contact__form-panel {
        padding: 36px 22px;
    }

    .c4c-content-page__body {
        padding: 36px 22px;
    }

    .c4c-contact-form__group,
    .c4c-contact-form__row {
        grid-template-columns: minmax(0, 1fr);
        gap: 12px;
    }

    .c4c-contact-form__actions {
        align-items: stretch;
        flex-direction: column;
        padding-left: 0;
    }

    .c4c-contact-form__submit {
        align-self: flex-end;
    }

    .c4c-monitor-form__group,
    .c4c-monitor-form__row {
        grid-template-columns: minmax(0, 1fr);
        gap: 12px;
    }

    .c4c-monitor-form__other {
        grid-column: 1;
    }

    .c4c-monitor-form__actions {
        align-items: stretch;
        flex-direction: column;
    }

    .c4c-monitor-form__submit {
        align-self: flex-end;
    }

    .c4c-intro__title {
        width: min(78vw, 430px);
        min-height: clamp(68px, 30.8vw, 198px);
    }

    .c4c-intro__title-coastal {
        gap: 8px;
    }

    .c4c-intro__title-c4c span {
        margin-bottom: 2%;
        margin-left: 10px;
    }

    .c4c-flow-section__content {
        align-items: flex-start;
        padding-top: calc(var(--c4c-header-height) + 100px);
        padding-bottom: 100px;
    }

    .c4c-flow-section--about .c4c-flow-section__content {
        padding-top: 48px;
    }

    .c4c-copy {
        line-height: var(--c4c-line-copy);
    }

    .c4c-flow-section--overview .c4c-flow-section__content {
        min-height: max(92svh, 680px);
    }

    .c4c-overview__heading {
        font-size: clamp(1.625rem, 7.1vw, 2.25rem);
        line-height: 1.6;
    }

    .c4c-detail-heading {
        font-size: clamp(1.5rem, 6.6vw, 2rem);
        line-height: 1.6;
    }

    .c4c-detail-copy {
        font-size: var(--c4c-type-body);
        line-height: var(--c4c-line-copy);
    }

    .c4c-flow-section--pinned {
        min-height: 0;
        overflow: clip;
    }

    .c4c-flow-section--pinned > .c4c-flow-section__pin {
        position: relative;
        top: auto;
        height: auto;
        overflow: visible;
    }

    .c4c-flow-section--pinned .c4c-flow-section__content {
        height: auto;
        min-height: 0;
        padding-top: calc(var(--c4c-header-height) + 72px);
        padding-bottom: 104px;
    }

    .c4c-flow-section--left-wave .c4c-flow-section__content {
        padding-right: var(--c4c-shell-padding);
        padding-left: var(--c4c-shell-padding);
    }

    .c4c-flow-section--left-wave .c4c-flow-section__content > .row {
        width: 100%;
        margin-right: 0;
        margin-left: 0;
    }

    .c4c-flow-section--left-wave :is(
        .c4c-overview__copy,
        .c4c-detail-column
    ) {
        width: 100%;
        margin-left: 0;
        padding-right: 0;
        padding-left: 0 !important;
    }

    .c4c-flow-section--about,
    .c4c-flow-section--about[data-pin-state="enabled"] {
        min-height: 0;
    }

    .c4c-flow-section--about .c4c-about__pin,
    .c4c-flow-section--about[data-pin-state="enabled"] .c4c-about__pin {
        position: relative;
        top: auto;
    }

    .c4c-flow-section--realtime .c4c-detail-column,
    .c4c-detail-column--feature {
        width: 100%;
        padding-left: 0 !important;
        margin-left: 0;
    }

    .c4c-feature-visual {
        display: none;
    }

    .c4c-realtime__map-layer {
        position: relative;
        inset: auto;
        display: block;
        width: 100%;
        height: min(92vw, 420px);
        margin: 24px 0 32px;
    }

    .c4c-realtime__map {
        left: 50%;
        width: var(--c4c-mobile-detail-media-width);
        max-width: 100%;
        max-height: 100%;
        transform: translate3d(calc(-50% - 24px), -50%, 0);
    }

    .c4c-realtime__pin[data-map-visible="true"] .c4c-realtime__map {
        transform: translate3d(-50%, -50%, 0);
    }

    .c4c-detail-media {
        display: block;
        width: var(--c4c-mobile-detail-media-width);
        max-width: 100%;
        margin: 0 auto clamp(28px, 8vw, 40px);
    }

    .c4c-detail-media img {
        display: block;
        width: 100%;
        height: auto;
    }

    .c4c-detail-media--feature {
        width: var(--c4c-mobile-detail-media-width);
        margin-right: auto;
        margin-left: auto;
    }

    .c4c-flow-section--high-accuracy .c4c-detail-media--feature {
        box-sizing: border-box;
        margin: 0 auto clamp(32px, 9vw, 44px);
        line-height: 0;
    }

    .c4c-flow-section--high-accuracy .c4c-detail-media--feature > img {
        border: 1px solid var(--c4c-deep);
    }

    .c4c-flow-section--feature .c4c-detail-heading {
        font-size: clamp(1.5rem, 6.6vw, 2rem);
    }

    .c4c-service-lockup {
        gap: 12px;
        margin-bottom: 28px;
    }

    .c4c-flow-section--service .c4c-flow-section__content {
        min-height: auto;
        padding-bottom: 120px;
    }

    .c4c-service__layout {
        grid-template-columns: minmax(0, 1fr);
        grid-template-areas:
            "heading"
            "visual"
            "body";
        width: 100%;
        margin-right: 0;
        margin-left: 0;
        row-gap: 0;
    }

    .c4c-service__layout > * {
        margin-top: 0;
    }

    .c4c-service__heading,
    .c4c-service__body {
        width: 100%;
        padding-right: 0;
        padding-left: 0;
    }

    .c4c-service__body {
        margin-top: 32px;
    }

    .c4c-service__visual {
        width: 100%;
        margin-left: 0;
        padding: 32px 0 28px;
        overflow: visible;
    }

    .c4c-service__heading .c4c-service-lockup {
        margin-bottom: 0;
    }

    .c4c-flow-section--service .c4c-service__picture {
        width: var(--c4c-mobile-detail-media-width);
        max-width: 100%;
        margin-right: auto;
        margin-left: auto;
        transform: none;
    }

    .c4c-service__preview {
        width: 100%;
        max-width: 100%;
    }

    .c4c-detail-download .c4c-detail-download-button {
        margin-top: 12px;
    }

    .c4c-service-roadmap__support {
        display: flex;
        flex-direction: column;
        align-items: stretch;
    }

    .c4c-service-roadmap__support > h3 {
        order: 1;
        align-self: stretch;
    }

    .c4c-service-roadmap__support > p {
        order: 2;
    }

    .c4c-service-roadmap__support > .c4c-service-roadmap__button {
        order: 3;
        align-self: flex-start;
        margin-top: 0;
    }

    .c4c-lead-copy {
        line-height: var(--c4c-line-copy);
    }

    .c4c-button {
        min-height: 48px;
        padding: 9px 12px 9px 16px;
    }

    .c4c-button__icon {
        flex-basis: 28px;
        width: 28px;
        min-width: 28px;
        height: 28px;
    }

    .c4c-future {
        padding-right: 24px;
        padding-bottom: 240px;
        padding-left: 24px;
    }

    .c4c-future__inner {
        padding-right: 0;
        padding-left: 0;
    }

    .c4c-future .c4c-section-label--ruled {
        margin-top: 0;
    }

    .c4c-footer-card-wrap {
        padding-right: 24px;
        padding-left: 24px;
        margin-top: -72px;
    }

    .c4c-footer-card {
        min-height: 430px;
        padding: 42px 24px;
        opacity: 1;
        filter: none;
        transform: none;
        will-change: auto;
    }

    .c4c-footer-journey[data-footer-card="hidden"] .c4c-footer-card {
        pointer-events: auto;
    }

    .c4c-footer-card__actions {
        margin-top: 34px;
    }

    .c4c-footer__nav {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 18px 16px;
        width: min(100%, 330px);
        margin: 0 auto;
        text-align: center;
    }

    .c4c-footer__nav-column {
        order: 1;
    }

    .c4c-footer__brand-column {
        order: 2;
    }

    .c4c-footer__company-column {
        order: 3;
    }

    .c4c-footer__nav a:last-child {
        grid-column: 1 / -1;
    }

    .c4c-footer__company {
        width: min(100%, 330px);
        margin: 0 auto;
        line-height: 1.75;
        text-align: left;
        text-wrap: pretty;
    }

    .c4c-footer__company p {
        margin-bottom: 20px;
    }

    .c4c-footer__company-address {
        font-size: var(--c4c-type-micro);
        line-height: 1.65;
    }

    .c4c-footer__company-name,
    .c4c-footer__department {
        display: block;
    }

    .c4c-footer__department {
        margin-left: 0;
    }

    .c4c-footer__policies {
        justify-content: center;
        width: min(100%, 330px);
        margin-right: auto;
        margin-left: auto;
        text-align: center;
    }

    .c4c-footer__policies span {
        flex-basis: 100%;
    }

    .c4c-footer__inner .text-lg-end {
        text-align: center;
    }

    .c4c-footer__mol-logo {
        width: min(250px, 76vw);
    }

}

.c4c-footer__layout {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.c4c-footer__nav {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px 0;
    width: 100%;
    margin: 0;
    text-align: center;
}

.c4c-footer__nav a {
    display: inline-flex;
    align-items: center;
    white-space: nowrap;
}

.c4c-footer__nav a:not(:last-child)::after {
    content: "｜";
    margin: 0 0.45em;
}

.c4c-footer__service-note {
    width: min(100%, 760px);
    margin: 28px 0 0;
    font-size: var(--c4c-type-small);
    font-weight: 400;
    line-height: 1.6;
    text-align: center;
    text-wrap: pretty;
}

.c4c-footer__brand-link {
    margin-top: 30px;
    text-align: center;
}

.c4c-footer__company-address {
    width: min(100%, 760px);
    margin: 28px 0 0;
    font-size: var(--c4c-type-micro);
    line-height: 1.65;
    text-align: center;
    text-wrap: pretty;
}

.c4c-footer__company-name,
.c4c-footer__department,
.c4c-footer__postal-address {
    display: block;
}

.c4c-footer__department {
    margin-left: 0;
}

.c4c-footer__policies {
    justify-content: center;
    gap: 0;
    width: 100%;
    margin: 24px 0 0;
    text-align: center;
}

.c4c-footer__policies span {
    flex-basis: auto;
    margin: 0 0.45em;
}

.c4c-footer__copyright {
    width: 100%;
    margin: 12px 0 0;
    text-align: center;
}

.c4c-footer__mol-logo {
    width: min(230px, 64vw);
}

@media (min-width: 1200px) {
    .c4c-footer__layout {
        display: grid;
        grid-template-columns: minmax(250px, 0.9fr) minmax(420px, 1.55fr) minmax(250px, 0.9fr);
        grid-template-areas:
            "nav service brand"
            "nav company brand"
            "nav policies brand"
            "nav copyright brand";
        column-gap: clamp(36px, 4vw, 72px);
        align-items: end;
        text-align: left;
    }

    .c4c-footer__nav {
        grid-area: nav;
        display: grid;
        grid-template-columns: repeat(2, max-content);
        justify-content: start;
        gap: 18px 28px;
        width: auto;
        text-align: left;
    }

    .c4c-footer__nav a:not(:last-child)::after {
        content: none;
    }

    .c4c-footer__service-note {
        grid-area: service;
        width: 100%;
        margin: 0;
        text-align: left;
    }

    .c4c-footer__brand-link {
        grid-area: brand;
        align-self: end;
        width: 100%;
        margin: 0;
        text-align: right;
    }

    .c4c-footer__company-address {
        grid-area: company;
        width: 100%;
        margin: 22px 0 0;
        text-align: left;
    }

    .c4c-footer__policies {
        grid-area: policies;
        justify-content: flex-start;
        width: auto;
        margin: 18px 0 0;
        text-align: left;
    }

    .c4c-footer__copyright {
        grid-area: copyright;
        width: auto;
        text-align: left;
    }

    .c4c-footer__mol-logo {
        width: min(230px, 100%);
    }
}

@media (max-width: 767px) {
    .c4c-footer__company {
        text-align: center;
    }
}

@media (orientation: landscape) and (max-height: 720px) {
    :root {
        --c4c-hero-logo-top: 50dvh;
        --c4c-hero-logo-anchor-y: -50%;
    }
}

@media (orientation: landscape) and (max-height: 500px) and (hover: none) and (pointer: coarse) {
    :root {
        --c4c-hero-logo-width: calc(90dvh * 2.078);
    }

    .c4c-hero-intro {
        height: 120svh;
    }
}