@media (min-width: 961px) {
    :root{
        --wrapper-width: clamp(900px, calc(72.9167vw + 200px), 1600px);
    }
}

body.action--site-strategic-consulting {
    --sc-bg: #000000;
    --sc-gold: #d2b28c;
    --sc-cream: #ffe4c3;
    --sc-white: #ffffff;
    --sc-nav-h: calc(60 * var(--rpx));
    --sc-panel-inner-h: calc(100vh - var(--sc-nav-h));
    background: var(--sc-bg);
    color: var(--sc-white);
}

body.action--site-strategic-consulting .site-header {
    transition: transform 0.35s cubic-bezier(0.7, 0, 0.3, 1), opacity 0.3s ease;
}

body.action--site-strategic-consulting.sc-header-hidden .site-header {
    transform: translateY(-100%);
    opacity: 0;
    pointer-events: none;
}

body.action--site-strategic-consulting.sc-header-hidden .nav-sub-mask-layer {
    display: none;
}

/* ========= Hero（63:107 1080px） ========= */
.sec1 {
    position: relative;
    height: 100vh;
    min-height: 520px;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}

.sec1 .sec-back {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    z-index: 190;
}

.sec1 .sec-back .sec-back-fallback {
    display: block;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    margin: 0;
}

.sec1 .sec-back .sec-back-fallback img {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    object-fit: cover;
}

.sec1 .sec-back .sec-back-video {
    display: none;
}

@media (min-width: 751px) {
    .sec1 .sec-back .sec-back-fallback {
        display: none;
    }

    .sec1 .sec-back .sec-back-video {
        display: block;
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
        pointer-events: none;
    }
}

.sec1 .sec-mask {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.5) 0%, transparent 42%, rgba(0, 0, 0, 0.35) 100%);
    pointer-events: none;
    z-index: 195;
}

.sec1 .sec-inner {
    position: relative;
    width: var(--wrapper-width);
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-end;
    height: 100%;
    padding-top: calc(var(--header-height-max) + 8vh);
    padding-bottom: calc(200vh / 10.8);
    box-sizing: border-box;

    z-index: 200;
}

.sec1 .article {
    text-align: center;
    max-width: 90%;
}

.sec1 .line1 {
    margin: 0 0 calc(20 * var(--rpx));
    font-size: calc(68 * var(--fpx-50));
    line-height: calc(80 * var(--fpx-50));
    font-weight: 300;
    color: var(--sc-white);
}

.sec1 .line2 {
    margin: 0;
    font-size: calc(68 * var(--fpx-50));
    line-height: calc(80 * var(--fpx-50));
    font-weight: 700;
}

.sec1 .btn-scroll-hint {
    position: absolute;
    right: var(--wrapper-margin);
    bottom: calc(70 * var(--rpx));
    z-index: 200;
}

/* ========= 顶栏导航（63:266 FRAME 1920×60） ========= */
.chapter-stack {
    background: var(--sc-bg);
}

.page-nav {
    position: sticky;
    top: 0;
    z-index: 550;
    height: var(--sc-nav-h);
    display: flex;
    align-items: center;
    background: rgba(255, 255, 255, 0.05);
    border-bottom: 1px solid rgba(210, 178, 140, 0.25);
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.25);
    -webkit-backdrop-filter: blur(30px);
    backdrop-filter: blur(30px);
}

.page-nav .nav-inner {
    height: 100%;
    width: 100%;
    display: flex;
    align-items: stretch;
}

.page-nav .nav-link {
    width: 25%;
    flex: 0 0 auto;
    font-size: calc(18 * var(--fpx-75));
    line-height: calc(21 * var(--fpx-75));
    font-weight: 400;
    color: var(--sc-white);
    padding: calc(6 * var(--rpx)) 0;
    position: relative;
    transition: color 0.25s;

    display: flex;
    justify-content: center;
    align-items: center;
}

.page-nav .nav-link:hover {
    color: var(--sc-gold);
}

.page-nav .nav-link.is-active {
    color: var(--sc-gold);
    background-color: #fff2;
}

.page-nav .nav-link.is-active::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 2px;
    background: var(--sc-gold);
}

/* ========= 分屏 Panel（设计单屏 1080） ========= */
.panel.snap {
    height: 100vh;
    min-height: 100vh;
    padding-top: 0;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.sec2.snap {
    min-height: 100vh;
}

.sec2{
    background: url("../images/strategic_consulting/sec2_back.webp") center/cover no-repeat;
}

.sec-title {
    margin: 0 0 calc(40 * var(--rpx));
    font-size: calc(48 * var(--fpx-50));
    line-height: calc(58 * var(--fpx-50));
    font-weight: 700;
    color: var(--sc-white);
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.sec2 .sec-title{
    display: flex;
    flex-direction: column;
    align-items: stretch;
}

.sec-title.is-split {
    font-weight: 300;
}

.part.light {
    font-weight: 300;
}

.part.bold {
    font-weight: 700;
}

.sec-title.is-solo {
    margin-top: 0;
}

.body-text {
    font-size: calc(20 * var(--fpx-75));
    line-height: calc(38 * var(--fpx-75));
    font-weight: 400;
    color: var(--sc-white);
    max-width: calc(540 * var(--rpx));
    text-align: justify;
}

.body-text strong{
    font-weight: bold;
}

.body-text p + p {
    margin-top: 1.5em;
}

.sec2 .sec-inner {
    display: grid;
    grid-template-columns: minmax(280px, 1fr) minmax(320px, 1.15fr);
    gap: calc(60 * var(--rpx));
    align-items: center;
    min-height: var(--sc-panel-inner-h);
}

.sec-head {
    margin-bottom: calc(36 * var(--rpx));
}

.sec3 .wrapper.sec-head,
.sec4 .wrapper.sec-head {
    margin-bottom: calc(24 * var(--rpx));
}

.sec3 {
    position: relative;
    overflow: hidden;
}

.sec4 {
    position: relative;
    overflow: hidden;
}

/* ========= 图示占位 + 热区 ========= */
.figure {
    position: relative;
    width: 100%;
    border-radius: calc(4 * var(--rpx));
    overflow: hidden;
}

.figure-three {
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    margin: 0;
    width: 100%;
    aspect-ratio: 16 / 9;
    transform: translateY(-50%);
}

.sec3 .figure-three .sec3-back-layers {
    position: absolute;
    inset: 0;
    pointer-events: none;
}

.sec3 .figure-three .sec3-back-still {
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    margin: 0;
}

.sec3 .figure-three .sec3-back-still img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.sec3 .figure-three .sec3-back-video {
    display: none;
}

@media (min-width: 751px) {
    .sec3 .figure-three .sec3-back-video {
        display: block;
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        object-fit: contain;
        transform: translateX(-1%);
        z-index: 1;
        pointer-events: none;
        opacity: 0;
        visibility: hidden;
    }

    .sec3 .figure-three.is-sec3-back-video-phase .sec3-back-video {
        opacity: 1;
        visibility: visible;
    }

    .sec3 .figure-three .sec3-back-still {
        position: absolute;
        z-index: 0;
    }
}

.sec4 .figure-three.figure-four .sec4-back-layers {
    position: absolute;
    inset: 0;
    pointer-events: none;
}

.sec4 .figure-three.figure-four .sec4-back-still {
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    margin: 0;
}

.sec4 .figure-three.figure-four .sec4-back-still img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.sec4 .figure-three.figure-four .sec4-back-video {
    display: none;
}

@media (min-width: 751px) {
    .sec4 .figure-three.figure-four .sec4-back-video {
        display: block;
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        object-fit: contain;
        z-index: 1;
        pointer-events: none;
        opacity: 0;
        visibility: hidden;
    }

    .sec4 .figure-three.figure-four.is-sec4-back-video-phase .sec4-back-video {
        opacity: 1;
        visibility: visible;
    }

    .sec4 .figure-three.figure-four .sec4-back-still {
        position: absolute;
        z-index: 0;
    }
}

.figure-three > img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.sec3 .sec3-fig-title {
    position: absolute;
    left: var(--wrapper-margin);
    top: calc(120% / 10.8 + var(--sc-nav-h));
    z-index: 4;
    margin: 0;
}

.sec4 .sec4-fig-title {
    position: absolute;
    left: var(--wrapper-margin);
    top: calc(120% / 10.8 + var(--sc-nav-h));
    z-index: 4;
    margin: 0;
}

.figure-placeholder {
    aspect-ratio: 16 / 10;
    width: 100%;
    background:
        linear-gradient(135deg, rgba(210, 178, 140, 0.06) 0%, transparent 50%),
        repeating-linear-gradient(
            -45deg,
            rgba(255, 255, 255, 0.03) 0,
            rgba(255, 255, 255, 0.03) 1px,
            transparent 1px,
            transparent 12px
        ),
        #111;
    border: 1px solid rgba(210, 178, 140, 0.45);
    box-sizing: border-box;
}

.figure-pentagon .figure-placeholder {
    aspect-ratio: 1 / 1;
    max-height: min(72vh, 820px);
    margin-left: auto;
}

.figure-pentagon {
    position: relative;
    width: 100%;
    max-width: 944px;
    aspect-ratio: 944 / 605;
    margin-left: auto;
}


.figure-pentagon .pent-layers {
    position: absolute;
    inset: 0;
    pointer-events: none;
}

.figure-pentagon .pent-layer {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    object-fit: contain;
    opacity: 0;
    transition: none;
}

.figure-pentagon .pent-layer.is-visible {
    opacity: 1;
}

.figure-pentagon .pent-layer.img-default {
    z-index: 1;
}

.figure-pentagon .pent-layer.img-active {
    z-index: 2;
}

.figure-pentagon .pent-in-video {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    object-fit: contain;
    z-index: 3;
    pointer-events: none;
    opacity: 0;
    visibility: hidden;
}

@media (min-width: 751px) {
    body.action--site-strategic-consulting .figure-pentagon.is-pent-in-pending .pent-in-video {
        opacity: 1;
        visibility: visible;
        mix-blend-mode: screen;
    }

    body.action--site-strategic-consulting
        .figure-pentagon.is-pent-in-pending:not(.is-pent-crossfading)
        .pent-layer {
        opacity: 0 !important;
    }
}

.figure-pentagon .pent-copy-wrap {
    position: absolute;
    z-index: 4;
    left: 49.95%;
    top: 59.77%;
    width: 31.8%;
    max-width: 300px;
    transform: translate(-50%, -50%);
    pointer-events: none;
}

.figure-pentagon .pent-copy {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 80%;
    margin: 0;
    transform: translate(-50%, -50%);
    text-align: center;
    color: #fff;
    font-size: calc(20 * var(--fpx-75));
    line-height: 1.7;
    text-shadow: 0 2px 16px rgba(0, 0, 0, 0.4);
    opacity: 0;
}

.figure-pentagon .pent-copy.is-visible {
    opacity: 1;
}

.figure-pentagon .pent-copy.is-enter {
    animation: pent-copy-enter 0.36s ease-out forwards;
}

.figure-pentagon .pent-copy.is-leave {
    animation: pent-copy-leave 0.36s ease-in forwards;
}

@keyframes pent-copy-enter {
    0% {
        opacity: 0;
        transform: translate(-50%, calc(-50% + 10px));
    }
    100% {
        opacity: 1;
        transform: translate(-50%, -50%);
    }
}

@keyframes pent-copy-leave {
    0% {
        opacity: 1;
        transform: translate(-50%, -50%);
    }
    100% {
        opacity: 0;
        transform: translate(-50%, calc(-50% - 10px));
    }
}

.hotzone {
    position: absolute;
    z-index: 2;
    border-radius: 50%;
    cursor: pointer;
    background: transparent;
    border: none;
    box-shadow: none;
    transition: background 0.2s, box-shadow 0.2s;
}

body.action--site-strategic-consulting .hotzone[aria-disabled="true"] {
    pointer-events: none;
    cursor: default;
}

.hotzone:hover {
    background: rgba(210, 178, 140, 0.14);
    box-shadow: 0 0 24px rgba(210, 178, 140, 0.12);
}

.figure-pentagon .hotzone.is-active {
    background: transparent;
    box-shadow: none;
}

.figure-pentagon .p1 {
    width: 21.19%;
    height: 13.22%;
    left: 0;
    top: 36.36%;
    border-radius: 999px;
}

.figure-pentagon .p2 {
    width: 21.19%;
    height: 13.22%;
    left: 39.30%;
    top: 0;
    border-radius: 999px;
}

.figure-pentagon .p3 {
    width: 21.19%;
    height: 13.22%;
    left: 78.81%;
    top: 36.36%;
    border-radius: 999px;
}

.figure-pentagon .p4 {
    width: 21.19%;
    height: 13.22%;
    left: 72.88%;
    top: 86.78%;
    border-radius: 999px;
}

.figure-pentagon .p5 {
    width: 21.19%;
    height: 13.22%;
    left: 6.78%;
    top: 86.78%;
    border-radius: 999px;
}

.figure-three .t1 {
    width: calc(289% / 19.2);
    height: calc(289% / 10.8);
    left: calc(389% / 19.2);
    top: 50%;
    transform: translateY(-50%);
    border-radius: 50%;
}

.figure-three .t2 {
    width: calc(400% / 19.2);
    height: calc(400% / 10.8);
    left: calc(678% / 19.2);
    top: 50%;
    transform: translateY(-50%);
    border-radius: 50%;
}

.figure-three .t3 {
    width: calc(520% / 19.2);
    height: calc(520% / 10.8);
    left: calc(1077% / 19.2);
    top: 50%;
    transform: translateY(-50%);
    border-radius: 50%;
}

.figure-four .g1 {
    width: calc(484% / 19.2);
    height: calc(484% / 10.8);
    left: calc(660% / 19.2);
    top: 50%;
    transform: translateY(-50%);
    border-radius: 50%;
}

.figure-four .g2 {
    width: calc(484% / 19.2);
    height: calc(484% / 10.8);
    left: calc(1044% / 19.2);
    top: 50%;
    transform: translateY(-50%);
    border-radius: 50%;
}

.sc-sec3-layer {
    position: fixed;
    inset: 0;
    z-index: 1200;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(32, 27, 20, 0.8);
    -webkit-backdrop-filter: blur(30px);
    backdrop-filter: blur(30px);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.25s ease;
}

.sc-sec3-layer.is-active {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

.sc-sec4-layer {
    position: fixed;
    inset: 0;
    z-index: 1200;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(32, 27, 20, 0.8);
    -webkit-backdrop-filter: blur(30px);
    backdrop-filter: blur(30px);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.25s ease;
}

.sc-sec4-layer.is-active {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

.sc-sec3-dialog {
    position: relative;
    width: min(calc(1600 * var(--rpx-50)), calc(100vw - 80 * var(--rpx-50)));
    height: min(calc(861 * var(--rpx-50)), calc(100vh - 80 * var(--rpx-50)));
}

.sc-sec4-dialog {
    position: relative;
    width: min(calc(1600 * var(--rpx-50)), calc(100vw - 80 * var(--rpx-50)));
    height: min(calc(861 * var(--rpx-50)), calc(100vh - 80 * var(--rpx-50)));
}

.sc-sec3-stage {
    width: calc(1600 * var(--rpx-50));
    height: calc(861 * var(--rpx-50));
    max-width: 100%;
    max-height: 100%;
    position: relative;
    overflow: visible;
}

.sc-sec4-stage {
    width: calc(1600 * var(--rpx-50));
    height: calc(861 * var(--rpx-50));
    max-width: 100%;
    max-height: 100%;
    position: relative;
    overflow: visible;
}

.sc-sec3-hotzones {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: calc(60 * var(--rpx-50));
    z-index: 2;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.sc-sec4-hotzones {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: calc(60 * var(--rpx-50));
    z-index: 2;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.sc-sec3-hotzone {
    border: 0;
    background: transparent;
    cursor: pointer;
    outline: none;
    box-shadow: none;
}

.sc-sec4-hotzone {
    border: 0;
    background: transparent;
    cursor: pointer;
    outline: none;
    box-shadow: none;
}

.sc-sec3-image {
    position: absolute;
    inset: 0;
    width: 100%;
    height: auto;
    top: 0;
    opacity: 0;
    transition: opacity 0.2s ease;
}

.sc-sec4-image {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: auto;
    opacity: 0;
    transition: opacity 0.2s ease;
}

.sc-sec3-image.is-active {
    opacity: 1;
}

.sc-sec4-image.is-active {
    opacity: 1;
}

.sc-sec4-image--wide {
    width: calc(1878 * var(--rpx-50));
    left: calc(-124 * var(--rpx-50));
    top: 0;
}

.sc-sec3-close,
.sc-sec4-close {
    position: absolute;
    top: 0;
    left: calc(100% + 20 * var(--rpx-50));
    transform: none;
    width: calc(60 * var(--rpx-50));
    height: calc(60 * var(--rpx-50));
    border: calc(1 * var(--rpx-50)) solid rgba(255, 255, 255, 0.65);
    border-radius: 50%;
    background: rgba(0, 0, 0, 0.45);
    cursor: pointer;
    z-index: 2;
}

.sc-sec3-close::before,
.sc-sec3-close::after,
.sc-sec4-close::before,
.sc-sec4-close::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    width: calc(18 * var(--rpx-50));
    height: calc(1.5 * var(--rpx-50));
    background: #fff;
}

.sc-sec3-close::before,
.sc-sec4-close::before {
    transform: translate(-50%, -50%) rotate(45deg);
}

.sc-sec3-close::after,
.sc-sec4-close::after {
    transform: translate(-50%, -50%) rotate(-45deg);
}

/* ========= 合作洽询区块 ========= */
.sec5 {
    padding-top: calc(80 * var(--rpx-50));
    padding-bottom: calc(72 * var(--rpx-50));
    background: var(--sc-bg);
} 

.sec5 .wrapper{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.sec5 .inquiry-title {
    margin: 0 0 calc(12 * var(--rpx));
    font-size: calc(48 * var(--fpx-50));
    line-height: calc(58 * var(--fpx-50));
    font-weight: 700;
}

.sec5 .inquiry-hint {
    margin: 0 0 calc(36 * var(--rpx));
    font-size: calc(20 * var(--fpx-75));
    line-height: calc(38 * var(--fpx-75));
    color: var(--sc-white);
}

.sec5 .star {
    color: var(--sc-gold);
}

body.action--site-strategic-consulting .site-footer {
    border-top-color: rgba(210, 178, 140, 0.25);
}

/* ========= FormContact 黑金覆写（选择器特异性高于表单 partial 内联样式） ========= */
body.action--site-strategic-consulting .sec5 .form-contact {
    margin-top: 0;
}

body.action--site-strategic-consulting .sec5 .form-group {
    border-bottom: 1px solid rgba(210, 178, 140, 0.15);
    padding-bottom: calc(32 * var(--rpx));
}

body.action--site-strategic-consulting .sec5 .form-group:last-of-type{
    border-bottom: none;
}

body.action--site-strategic-consulting .sec5 .group-name {
    color: var(--sc-white);
    font-weight: 700;
    font-size: calc(28 * var(--fpx-67));
}

body.action--site-strategic-consulting .sec5 .group-field input[type='text'],
body.action--site-strategic-consulting .sec5 .group-field textarea,
body.action--site-strategic-consulting .sec5 .group-field .dropdown-ctn {
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.35);
    color: var(--sc-white);
    min-height: calc(50 * var(--rpx));
}

body.action--site-strategic-consulting .sec5 .group-field input[type='text']:focus,
body.action--site-strategic-consulting .sec5 .group-field textarea:focus {
    border-color: var(--sc-gold);
    outline: none;
}

body.action--site-strategic-consulting .sec5 .revenue-dropdown .dropdown-option {
    border-bottom-color: rgba(255, 255, 255, 0.12);
    color: rgba(255, 255, 255, 0.9);
}

body.action--site-strategic-consulting .sec5 .revenue-dropdown .dropdown-option:hover {
    color: var(--sc-gold);
}

body.action--site-strategic-consulting .sec5 .external-dropdown.dropdown-options {
    background: #101010;
    border: 1px solid rgba(210, 178, 140, 0.45);
}

body.action--site-strategic-consulting .sec5 .label-text {
    color: rgba(255, 255, 255, 0.75);
    background-color: #0a0a0a;
}

body.action--site-strategic-consulting .sec5 label.has-value .label-text,
body.action--site-strategic-consulting .sec5 label:has(input:focus) .label-text {
    background-color: #0a0a0a;
    color: var(--sc-gold);
}

body.action--site-strategic-consulting .sec5 .field-list input[type='text'],
body.action--site-strategic-consulting .sec5 .field-list textarea {
    color: #ffffff;
}

body.action--site-strategic-consulting .sec5 .field-list input[type='text']::placeholder,
body.action--site-strategic-consulting .sec5 .field-list input[type='text']::-webkit-input-placeholder,
body.action--site-strategic-consulting .sec5 .field-list textarea::placeholder,
body.action--site-strategic-consulting .sec5 .field-list textarea::-webkit-input-placeholder {
    color: rgba(255, 255, 255, 0.45);
}

body.action--site-strategic-consulting .sec5 .radio-text {
    color: rgba(255, 255, 255, 0.9);
    font-size: calc(20 * var(--fpx-75));
}

body.action--site-strategic-consulting .sec5 .field-list a {
    color: var(--sc-gold);
}

body.action--site-strategic-consulting .sec5 .btn-submit.btn-more {
    background: transparent;
    color: var(--sc-gold);
    border: 1px solid var(--sc-gold);
    min-width: calc(180 * var(--rpx));
    min-height: calc(50 * var(--rpx));
    font-size: calc(18 * var(--fpx-75));
    font-weight: 700;
}

body.action--site-strategic-consulting .sec5 .btn-submit.btn-more:hover {
    background: rgba(210, 178, 140, 0.12);
}

body.action--site-strategic-consulting .sec5 .btn-submit::after {
    filter: brightness(0) saturate(100%) invert(75%) sepia(23%) saturate(458%) hue-rotate(348deg) brightness(93%) contrast(87%);
}

body.action--site-strategic-consulting .sec5 input[type="radio"] + i.radio-mock {
    position: relative;
    border: 1px solid rgba(255, 255, 255, 0.75);
    background: rgba(255, 255, 255, 0.08);
}

body.action--site-strategic-consulting .sec5 input[type="radio"] + i.radio-mock::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    width: calc(11em / 18);
    height: calc(6em / 18);
    border-left: 2px solid #111111;
    border-bottom: 2px solid #111111;
    transform: translate(-50%, -60%) rotate(-45deg);
    opacity: 0;
}

body.action--site-strategic-consulting .sec5 input:checked[type="radio"] + i.radio-mock {
    border: 1px solid var(--sc-gold);
    background: var(--sc-gold);
}

body.action--site-strategic-consulting .sec5 input:checked[type="radio"] + i.radio-mock::after {
    opacity: 1;
}

body.action--site-strategic-consulting .sec5 .mail-hint {
    color: rgba(255, 255, 255, 0.55);
    font-size: calc(18 * var(--fpx-75));
}

body.action--site-strategic-consulting .sec5 .mail-hint a {
    color: var(--sc-white);
}

body.action--site-strategic-consulting .sec5 .error:not(.has-value) .label-text {
    color: #ff6b6b;
}

body.action--site-strategic-consulting .sec5 .error:not(.has-value) input[type='text'],
body.action--site-strategic-consulting .sec5 .error:not(.has-value) textarea,
body.action--site-strategic-consulting .sec5 .error:not(.has-value) .dropdown-ctn {
    border-color: rgba(255, 107, 107, 0.85);
}

@media (max-width: 960px) {
    .sec2 .sec-inner {
        grid-template-columns: 1fr;
    }

    .page-nav .nav-inner {
        gap: calc(20 * var(--rpx));
        justify-content: flex-start;
        overflow-x: auto;
        flex-wrap: nowrap;
        -webkit-overflow-scrolling: touch;
        padding-bottom: calc(4 * var(--rpx));
    }

    .page-nav .nav-link {
        white-space: nowrap;
    }

    .sec1 .line1,
    .sec1 .line2 {
        line-height: 1.2;
    }

    .sec-title,
    .sec5 .inquiry-title {
        line-height: 1.25;
    }

    .body-text {
        max-width: none;
    }

    .figure-pentagon {
        max-width: 100%;
    }
}

@media (max-width: 750px) {
    .figure-pentagon .pent-in-video {
        display: none !important;
    }

    .sec2{
        background-image: url("../images/strategic_consulting/sec2_back_mobile.webp");
    }

    .page-nav {
        display: none;
    }

    .panel.snap {
        height: 100vh;
        min-height: 100vh;
        padding-top: 0;
        padding-bottom: 0;
    }

    .sec2.snap {
        min-height: 100vh;
    }

    .sec2 .sec-inner {
        grid-template-columns: 1fr;
        grid-template-rows: auto auto;
        align-content: center;
        gap: calc(40 * var(--rpx));
    }

    .sec2 .article {
        order: 1;
    }

    .sec2 .figure-pentagon {
        order: 2;
        width: calc(787vw / 8.28);
        max-width: 100%;
        aspect-ratio: 787 / 605;
        margin-top: 0;
        margin-right: calc((var(--wrapper-width) - 787 * var(--rpx)) / 2);
        margin-bottom: 0;
        margin-left: calc((var(--wrapper-width) - 787 * var(--rpx)) / 2);
    }

    .sec2 .figure-pentagon .pent-copy-wrap {
        display: none;
    }

    .sec2 .figure-pentagon .p1,
    .sec2 .figure-pentagon .p2,
    .sec2 .figure-pentagon .p3,
    .sec2 .figure-pentagon .p4,
    .sec2 .figure-pentagon .p5 {
        width: 27.95%;
        height: 13.22%;
        border-radius: 999px;
    }

    .sec2 .figure-pentagon .p1 {
        left: 0;
        top: 29.26%;
    }

    .sec2 .figure-pentagon .p2 {
        left: 36.59%;
        top: 0;
    }

    .sec2 .figure-pentagon .p3 {
        left: 72.05%;
        top: 29.26%;
    }

    .sec2 .figure-pentagon .p4 {
        left: 72.05%;
        top: 86.78%;
    }

    .sec2 .figure-pentagon .p5 {
        left: 0;
        top: 86.78%;
    }

    .sec3.snap,
    .sec4.snap {
        height: auto;
        min-height: unset;
        padding-top: 0;
        padding-bottom: 0;
    }

    .sec3 .figure-three,
    .sec4 .figure-three.figure-four {
        position: relative;
        left: auto;
        right: auto;
        top: auto;
        bottom: auto;
        margin: 0;
        width: 100%;
        max-height: none;
        aspect-ratio: 828 / 1792;
        transform: none;
    }

    .sec3 .figure-three .sec3-back-video {
        display: none !important;
    }

    .sec4 .figure-three.figure-four .sec4-back-video {
        display: none !important;
    }

    .sec3 .figure-three .t1,
    .sec3 .figure-three .t2,
    .sec3 .figure-three .t3,
    .sec4 .figure-three.figure-four .g1,
    .sec4 .figure-three.figure-four .g2 {
        border-radius: 50%;
        transform: none;
    }

    .sec3 .figure-three .t1 {
        width: calc(277% / 8.28);
        height: calc(277% / 17.92);
        left: calc(275.5% / 8.28);
        top: calc(342% / 17.92);
    }

    .sec3 .figure-three .t2 {
        width: calc(402% / 8.28);
        height: calc(402% / 17.92);
        left: calc(213% / 8.28);
        top: calc(619% / 17.92);
    }

    .sec3 .figure-three .t3 {
        width: calc(521% / 8.28);
        height: calc(521% / 17.92);
        left: calc(153.5% / 8.28);
        top: calc(1021% / 17.92);
    }

    .sec4 .figure-three.figure-four .g1 {
        width: calc(484% / 8.28);
        height: calc(484% / 17.92);
        left: calc(172% / 8.28);
        top: calc(523% / 17.92);
    }

    .sec4 .figure-three.figure-four .g2 {
        width: calc(484% / 8.28);
        height: calc(484% / 17.92);
        left: calc(172% / 8.28);
        top: calc(907% / 17.92);
    }

    .sec5 {
        min-height: unset;
        height: auto;
    }
}

@media (max-width: 750px) {
    .sc-sec3-layer,
    .sc-sec4-layer {
        align-items: center;
        justify-content: flex-start;
        padding-top: 0;
        box-sizing: border-box;
    }

    .sc-sec3-dialog,
    .sc-sec4-dialog {
        width: 100%;
        max-width: 100%;
        height: 100%;
        padding: calc(60vw / 8.28) calc(40vw / 8.28) calc(40vw / 8.28);
        overflow-y: auto;
        box-sizing: border-box;
    }

    .sc-sec3-stage,
    .sc-sec4-stage {
        width: 100%;
        height: auto;
        max-height: none;
    }

    .sc-sec3-hotzones,  
    .sc-sec4-hotzones {
        width: calc(100% - 90 * var(--rpx));
        height: calc(80 * var(--rpx))
    }

    .sc-sec3-image,
    .sc-sec4-image {
        position: relative;
        display: none;
        opacity: 1;
        transition: none;
    }

    .sc-sec3-image.is-active,
    .sc-sec4-image.is-active {
        display: block;
    }

    .sc-sec4-image--wide {
        width: 100%;
        left: 0;
        top: 0;
    }

    .sc-sec3-mobile-hotzones {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        z-index: 3;
        pointer-events: none;
        display: none;
    }

    .sc-sec3-mobile-hotzones.is-active {
        display: block;
    }

    .sc-sec3-mobile-hotzone {
        position: absolute;
        border-radius: calc(30 * var(--rpx));
        background: transparent;
        border: none;
        box-shadow: none;
        pointer-events: auto;
        cursor: pointer;
    }

    .sc-sec3-mobile-hotzone.is-active {
        background: rgba(210, 178, 140, .14);
        box-shadow: 0 0 calc(24 * var(--rpx)) rgba(210, 178, 140, .18);
    }

    .sc-sec3-mobile-expand-source {
        display: none !important;
    }

    .sc-sec3-mobile-expand {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: auto;
        z-index: 2;
        display: none;
        pointer-events: none;
    }

    .sc-sec3-mobile-expand.is-active {
        display: block;
    }

    .sc-sec3-close,
    .sc-sec4-close {
        left: auto;
        right: calc(40vw / 8.28);
        top: calc(60vw / 8.28);
        width: calc(80 * var(--rpx));
        height: calc(80 * var(--rpx));
    }
}

.sc-sec2-drawer {
    position: fixed;
    inset: 0;
    z-index: 1250;
    display: block;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity .28s ease, visibility 0s linear .28s;
}

.sc-sec2-drawer.is-active {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transition: opacity .28s ease;
}

.sc-sec2-drawer-mask {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.45);
    animation: scDrawerMaskOut .28s ease forwards;
}

.sc-sec2-drawer.is-active .sc-sec2-drawer-mask {
    animation: scDrawerMaskIn .28s ease forwards;
}

.sc-sec2-drawer-panel {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    min-height: calc(546 * var(--rpx));
    background: linear-gradient(180deg, #E3C9AB 0%, #FFF6EB 100%);
    border-radius: calc(60 * var(--rpx)) calc(60 * var(--rpx)) 0 0;
    padding: calc(40 * var(--rpx)) calc(34 * var(--rpx)) calc(48 * var(--rpx));
    transform: translateY(100%);
    opacity: 0;
    animation: scDrawerPanelOut .32s cubic-bezier(.7, 0, .3, 1) forwards;

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.sc-sec2-drawer.is-active .sc-sec2-drawer-panel {
    animation: scDrawerPanelIn .32s cubic-bezier(.7, 0, .3, 1) forwards;
}

@keyframes scDrawerMaskIn {
    0% { opacity: 0; }
    100% { opacity: 1; }
}

@keyframes scDrawerMaskOut {
    0% { opacity: 1; }
    100% { opacity: 0; }
}

@keyframes scDrawerPanelIn {
    0% {
        opacity: 0;
        transform: translateY(100%);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes scDrawerPanelOut {
    0% {
        opacity: 1;
        transform: translateY(0);
    }
    100% {
        opacity: 0;
        transform: translateY(100%);
    }
}

.sc-sec2-drawer-close {
    position: absolute;
    top: calc(22 * var(--rpx));
    right: calc(24 * var(--rpx));
    width: calc(80 * var(--rpx));
    height: calc(80 * var(--rpx));
    border: 0;
    border-radius: 50%;
    background: url("../images/btn_close_dark.svg") center/contain no-repeat;
    cursor: pointer;
}

.sc-sec2-drawer-title {
    font-size: calc(36 * var(--fpx-67));
    line-height: 1.4;
    color: #252525;
    margin-bottom: calc(16 * var(--rpx));
    font-weight: 700;
    text-align: center;
}

.sc-sec2-drawer-content {
    font-size: calc(28 * var(--fpx-67));
    line-height: calc(46 * var(--fpx-67));
    color: #252525;
    white-space: pre-wrap;
    text-align: center;
    max-width: calc(480 * var(--rpx));
}
