/* 移动端（≤768px）：长页滚动 + 首页第 2 屏 Figma 布局，桌面端不受影响 */

@media (max-width: 768px) {
    html:has(body.home),
    html:has(body.stbledge-about-page),
    html:has(body.stbledge-product-page) {
        height: auto;
        scroll-behavior: smooth;
    }

    body.home,
    body.stbledge-about-page,
    body.stbledge-product-page {
        overflow-y: auto !important;
        overflow-x: hidden;
        height: auto !important;
        -webkit-overflow-scrolling: touch;
    }

    body.home .panel,
    body.stbledge-about-page .panel,
    body.stbledge-product-page .panel,
    .about-page .panel {
        min-height: 100vh;
        height: auto;
        overflow: visible;
        scroll-margin-top: 3.5rem;
    }

    /* 重置全局 section.panel 默认 padding，各屏单独设 */
    body.home section.panel {
        padding: 0;
        box-sizing: border-box;
    }

    body.home section.panel.hero {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: flex-start;
        padding: var(--frame-inset-x, 1.5rem);
        min-height: 100vh;
        box-sizing: border-box;
    }

    body.home section.panel.hero .hero-left {
        width: 100%;
    }

    body.home section.panel.product-section {
        padding: 4.5rem var(--frame-inset-x, 1.5rem) 2.5rem;
    }

    body.home section.panel.results-section {
        padding: 0;
    }

    /* ── 首页第 2 屏：Figma 移动端 ── */

    .product-section {
        overflow: visible;
    }

    .product-inner {
        display: grid;
        grid-template-areas:
            "header"
            "diagram"
            "accordion";
        gap: 1.75rem;
        justify-content: stretch;
        width: 100%;
        max-width: 100%;
    }

    .product-header {
        grid-area: header;
    }

    .product-body {
        display: contents;
    }

    .product-diagram {
        grid-area: diagram;
        position: relative;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 0.35rem;
        min-height: auto;
        max-height: none;
        margin: 0;
    }

    .product-diagram-svg {
        flex: 0 1 auto;
        width: auto;
        max-width: min(20rem, calc(100% - 3.25rem));
        margin: 0;
    }

    /* 首页图示右侧竖排英文（仅覆盖 style.css ≤900px 的隐藏） */
    .product-side-label {
        display: block;
        position: static;
        flex-shrink: 0;
        transform: none;
        writing-mode: vertical-rl;
        white-space: nowrap;
        font-family: 'Actor', sans-serif;
        font-size: clamp(1rem, 3.2vw, 1.375rem);
        line-height: 1.2;
        letter-spacing: 0.02em;
        color: #9D9D9D;
    }

    .product-tag-box {
        display: block;
        width: 100%;
        max-width: 100%;
        margin: 0 0 1.25rem;
        padding: 0.65rem 1rem;
        box-sizing: border-box;
    }

    .product-tag {
        font-size: 0.75rem;
        line-height: 1.6;
    }

    /* 不卖工具 / 交付数字劳动力 两行居中 */
    .product-title {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 0.35rem;
        font-size: clamp(1.625rem, 7.5vw, 2.125rem);
        text-align: center;
    }

    .product-title-muted,
    .product-title-rest {
        display: block;
    }

    .product-header__stars {
        top: -3rem;
        height: calc(100% + 3rem);
    }

    .product-accordion {
        grid-area: accordion;
    }

    .product-accordion-head {
        font-size: 0.875rem;
        gap: 0.75rem;
        padding: 1.125rem 0;
    }

    .product-acc-toggle svg {
        width: 2rem;
        height: 2rem;
    }

    .product-accordion-body {
        padding-left: 2rem;
        padding-right: 0;
    }

    /* ── Hero ── */

    .hero h1 {
        font-size: clamp(2rem, 10vw, 3rem);
    }

    /* ── 关于我们页 ──
       注意：不用 .about-page .panel 统一 padding（会压过各屏单独规则）。
       产品页 padding 只写在 body.stbledge-product-page 下，勿动此处。 ── */

    body.stbledge-about-page {
        --about-team-gutter: 2.25rem;
    }

    body.stbledge-about-page .about-page .about-panel-intro {
        padding: 5rem var(--frame-inset-x, 1.5rem) 2rem;
        min-height: 100vh;
        box-sizing: border-box;
    }

    body.stbledge-about-page .about-page .about-panel-story {
        padding: 3rem var(--frame-inset-x, 1.5rem) 2.5rem;
        box-sizing: border-box;
    }

    body.stbledge-about-page .about-page .about-panel-team {
        padding: 3rem var(--frame-inset-x, 1.5rem) 2.5rem;
        --about-team-gutter: 2.25rem;
        box-sizing: border-box;
    }

    body.stbledge-about-page .about-page .about-panel-contact {
        padding: 0;
        min-height: 100vh;
    }

    body.stbledge-about-page .about-hero-left {
        padding-left: var(--about-team-gutter);
        padding-right: var(--about-team-gutter);
        box-sizing: border-box;
    }

    body.stbledge-about-page .about-panel-story .about-story-wrap {
        padding-left: var(--about-team-gutter);
        padding-right: var(--about-team-gutter);
        box-sizing: border-box;
    }

    body.stbledge-about-page .about-team-grid {
        grid-template-columns: 1fr;
        gap: 2rem;
    }

    /* 团队屏：隐藏顶部横线与四角加号（仅移动端） */
    body.stbledge-about-page .about-panel-team .panel-frame__hline,
    body.stbledge-about-page .about-panel-team .panel-frame__corner {
        display: none;
    }

    /* 标题 → 英文 → Three.js → 列表 */
    body.stbledge-about-page .about-team-left {
        display: contents;
    }

    body.stbledge-about-page .about-team-title {
        order: 1;
        padding-left: var(--about-team-gutter);
        padding-right: var(--about-team-gutter);
        box-sizing: border-box;
    }

    body.stbledge-about-page .about-team-sub {
        order: 2;
        margin-bottom: 1.25rem;
        padding-left: var(--about-team-gutter);
        padding-right: var(--about-team-gutter);
        box-sizing: border-box;
    }

    body.stbledge-about-page .about-team-visual {
        order: 3;
        height: 14rem;
        padding-left: var(--about-team-gutter);
        padding-right: var(--about-team-gutter);
        box-sizing: border-box;
    }

    body.stbledge-about-page .about-team-list {
        order: 4;
        width: 100%;
        padding-left: var(--about-team-gutter);
        padding-right: var(--about-team-gutter);
        box-sizing: border-box;
    }

    body.stbledge-product-page .about-panel-contact {
        padding: 0;
        min-height: 100vh;
    }

    /* ── 产品页 ── */

    body.stbledge-product-page .product-page .panel {
        height: auto !important;
        min-height: 100vh;
        overflow: visible !important;
        padding: 4.5rem var(--frame-inset-x, 1.5rem) 2.5rem;
        box-sizing: border-box;
        scroll-margin-top: 3.5rem;
    }

    body.stbledge-product-page .product-page {
        height: auto;
        overflow: visible;
        touch-action: pan-y;
    }

    body.stbledge-product-page .about-panel-contact {
        overflow: visible !important;
    }

    body.stbledge-product-page .product-panel-hero {
        padding-top: 5rem;
    }

    body.stbledge-product-page .product-panel-feature .product-feature-grid {
        grid-template-columns: 1fr;
        gap: 2rem;
    }

    body.stbledge-product-page .product-panel-feature--text-right .product-feature-visual {
        order: -1;
    }

    /* Agent 屏：文字在上、SVG 在下 */
    body.stbledge-product-page #product-feature-2.product-panel-feature--text-right .product-feature-visual {
        order: unset;
    }
}

/* iPad（769px–1194px）：首页 Hero / 第 2、3 屏适配，手机与桌面不受影响 */
@media (min-width: 769px) and (max-width: 1194px) {
    body.home section.panel.hero {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: flex-start;
        min-height: 100vh;
        padding: 0 var(--frame-inset-x, 3rem);
        box-sizing: border-box;
    }

    body.home section.panel.hero .hero {
        padding-top: 0;
        width: 100%;
    }

    body.home section.panel.hero .hero-left {
        width: 100%;
    }

    /* ── 首页第 2 屏：内容在竖线内侧留白，不贴边 ── */
    body.home section.panel.product-section {
        --product-ipad-gutter: 1.5rem;
        padding: 5rem calc(var(--frame-inset-x) + var(--product-ipad-gutter)) 3rem;
        box-sizing: border-box;
        overflow: hidden;
    }

    body.home .product-inner {
        max-width: 100%;
        width: 100%;
        gap: 2.25rem;
    }

    body.home .product-header__stars {
        left: 0;
        transform: none;
        width: 100%;
    }

    body.home .product-tag-box {
        max-width: 100%;
        box-sizing: border-box;
    }

    body.home .product-title {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        align-items: center;
        gap: 0.35rem 0.75rem;
        text-align: center;
    }

    body.home .product-title-muted,
    body.home .product-title-rest {
        display: inline-block;
    }

    body.home .product-body {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        gap: clamp(1.25rem, 2.5vw, 2rem);
        align-items: center;
    }

    body.home .product-accordion,
    body.home .product-diagram {
        min-width: 0;
    }

    body.home .product-accordion-head {
        font-size: clamp(0.75rem, 1.6vw, 0.875rem);
        gap: 0.75rem;
        padding: 1.125rem 0;
    }

    body.home .product-acc-toggle svg {
        width: 2rem;
        height: 2rem;
    }

    body.home .product-accordion-body {
        padding-left: 2rem;
        padding-right: 0;
    }

    body.home .product-diagram {
        position: relative;
        min-height: auto;
        padding-right: 2.25rem;
        box-sizing: border-box;
    }

    body.home .product-diagram-svg {
        width: 100%;
        max-width: 100%;
    }

    body.home .product-side-label {
        display: block;
        position: absolute;
        right: 0;
        top: 50%;
        transform: translateY(-50%);
        writing-mode: vertical-rl;
        white-space: nowrap;
        width: max-content;
        font-family: 'Actor', sans-serif;
        font-size: clamp(1.125rem, 2.2vw, 1.625rem);
        line-height: 1.2;
        letter-spacing: 0.01em;
        color: #9D9D9D;
    }

    /* ── 首页第 3 屏：使用成果，字号缩小并在竖线内侧留白 ── */
    body.home .results-section {
        --results-ipad-gutter: 1.5rem;
    }

    body.home .results-inner {
        max-width: 100%;
        padding-left: calc(var(--frame-inset-x) + var(--results-ipad-gutter));
        padding-right: calc(var(--frame-inset-x) + var(--results-ipad-gutter));
        box-sizing: border-box;
    }

    body.home .results-top-en {
        top: var(--frame-inset-y-top, 4.5rem);
        left: calc(var(--frame-inset-x) + var(--results-ipad-gutter));
        padding: 1.25rem 0 0;
        font-size: 1.25rem;
        line-height: 1.3;
        max-width: calc(100% - 2 * (var(--frame-inset-x) + var(--results-ipad-gutter)));
    }

    body.home .results-stats {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        column-gap: clamp(1.25rem, 3vw, 2.5rem);
        row-gap: 1.75rem;
        max-width: 100%;
        width: 100%;
        padding: 0;
        box-sizing: border-box;
    }

    body.home .results-stat-label {
        font-size: 1rem;
        margin-bottom: 0.75rem;
        line-height: 1.4;
    }

    body.home .results-stat-value {
        font-size: clamp(2rem, 4.2vw, 2.75rem);
        line-height: 1.1;
        letter-spacing: -0.02em;
    }

    body.home .results-side {
        left: calc(var(--frame-inset-x) + var(--results-ipad-gutter));
        bottom: var(--frame-inset-y-bottom, 4.5rem);
        padding: 0 0 1.25rem;
    }

    body.home .results-side-char,
    body.home .results-side-phrase {
        font-size: 1.875rem;
        line-height: 1.2;
    }

    /* ── 首页第 4 屏：联系我们，底部品牌 SVG 上移避免被裁切 ── */
    body.home .about-panel-contact--home .contact-footer-fx__brand {
        top: auto;
        bottom: calc(var(--frame-inset-y-bottom, 4.5rem) + 2.5rem);
    }

    /* ── 关于我们页 ── */
    body.stbledge-about-page {
        --about-ipad-gutter: 1.5rem;
    }

    body.stbledge-about-page .about-title-en {
        font-size: clamp(1.75rem, 4vw, 2.5rem);
    }

    body.stbledge-about-page .about-panel-story {
        padding: 6.25rem calc(var(--frame-inset-x) + var(--about-ipad-gutter)) 3rem;
        box-sizing: border-box;
        overflow: hidden;
    }

    body.stbledge-about-page .about-story-wrap {
        max-width: 100%;
        width: 100%;
        margin: 0 auto;
        padding: 0;
        box-sizing: border-box;
    }

    body.stbledge-about-page .about-story-grid {
        gap: 2rem;
    }

    body.stbledge-about-page .about-story-intro {
        grid-template-columns: minmax(0, 9rem) minmax(0, 1fr);
        gap: 1.5rem 2rem;
        align-items: start;
    }

    body.stbledge-about-page .about-heading {
        white-space: normal;
        font-size: clamp(1.375rem, 2.8vw, 1.75rem);
    }

    body.stbledge-about-page .about-story-lead,
    body.stbledge-about-page .about-paragraphs p {
        font-size: 0.8125rem;
        line-height: 1.75;
        overflow-wrap: anywhere;
    }

    /* ── 关于我们第 3 屏：关于团队 ── */
    body.stbledge-about-page .about-page .about-panel-team {
        padding: 5rem calc(var(--frame-inset-x) + var(--about-ipad-gutter)) 4rem;
        --about-team-gutter: 1.5rem;
        box-sizing: border-box;
    }

    body.stbledge-about-page .about-team-grid {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        gap: clamp(1.5rem, 3.5vw, 2.5rem);
        align-items: center;
    }

    body.stbledge-about-page .about-team-left {
        padding-left: var(--about-team-gutter);
        padding-right: 0;
        min-width: 0;
    }

    body.stbledge-about-page .about-team-title {
        font-size: clamp(1.75rem, 3.2vw, 2.25rem);
        line-height: 1.15;
        margin-bottom: 0.25rem;
    }

    body.stbledge-about-page .about-team-sub {
        font-size: 1rem;
        line-height: 1.2;
        margin-bottom: 1.5rem;
        white-space: nowrap;
    }

    body.stbledge-about-page .about-team-visual {
        height: clamp(13rem, 36vh, 20rem);
        min-height: 0;
        padding-right: var(--about-team-gutter);
        box-sizing: border-box;
    }

    body.stbledge-about-page .about-team-trigger {
        padding: 1.125rem 0;
        font-size: 0.875rem;
    }

    body.stbledge-about-page .about-team-text {
        font-size: 0.875rem;
        line-height: 1.5;
    }

    /* ── 产品页第 2 / 3 / 4 屏：文字缩小，内容在竖线内侧留白 ── */
    body.stbledge-product-page {
        --product-ipad-gutter: 1.5rem;
    }

    body.stbledge-product-page .product-page {
        --product-feature-gutter: 1.5rem;
    }

    body.stbledge-product-page .product-page .product-panel-feature {
        padding-left: calc(var(--frame-inset-x) + var(--product-ipad-gutter));
        padding-right: calc(var(--frame-inset-x) + var(--product-ipad-gutter));
        box-sizing: border-box;
    }

    body.stbledge-product-page .product-feature-grid {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        column-gap: clamp(1.5rem, 3.5vw, 2.5rem);
        row-gap: 1.5rem;
        align-items: center;
    }

    body.stbledge-product-page .product-panel-feature--text-left .product-feature-copy {
        padding-left: var(--product-feature-gutter);
        padding-right: 0;
    }

    body.stbledge-product-page .product-panel-feature--text-left .product-feature-visual {
        padding-right: var(--product-feature-gutter);
        padding-left: 0;
    }

    body.stbledge-product-page .product-panel-feature--text-right .product-feature-visual {
        padding-left: var(--product-feature-gutter);
        padding-right: 0;
        order: unset;
    }

    body.stbledge-product-page .product-panel-feature--text-right .product-feature-copy {
        padding-right: var(--product-feature-gutter);
        padding-left: 0;
        text-align: left;
    }

    body.stbledge-product-page .product-panel-feature--text-right .product-feature-label {
        justify-content: flex-start;
    }

    body.stbledge-product-page #product-feature-2.product-panel-feature--text-right .product-feature-copy {
        padding-left: 0;
        padding-right: var(--product-feature-gutter);
        text-align: left;
    }

    body.stbledge-product-page #product-feature-2.product-panel-feature--text-right .product-feature-label {
        justify-content: flex-start;
    }

    body.stbledge-product-page .product-feature-page-title {
        font-size: clamp(1.75rem, 3.2vw, 2.25rem);
        line-height: 1.15;
        margin-bottom: 1.25rem;
    }

    body.stbledge-product-page .product-feature-label {
        font-size: clamp(1rem, 2vw, 1.125rem);
        line-height: 1.4;
        margin-bottom: 0.75rem;
        gap: 0.5rem;
    }

    body.stbledge-product-page .product-feature-label-mark {
        width: 0.5rem;
        height: 0.5rem;
    }

    body.stbledge-product-page .product-feature-text {
        font-size: 0.875rem;
        line-height: 1.75;
        color: rgba(255, 255, 255, 0.82);
    }

    body.stbledge-product-page .product-feature-svg {
        max-width: clamp(14rem, 36vw, 22rem);
        max-height: min(42vh, 20rem);
    }

    body.stbledge-product-page .product-feature-svg svg {
        max-height: min(42vh, 20rem);
    }
}
