/**
 * Large-viewport scaling for Rebranding pages (index, index1–3).
 * Defines --ui-scale / --diagram-scale steps at 1700px, 2100px, 2500px and
 * layout/typography overrides for min-width: 1700px.
 * Load after twinx-graphics.css so diagram max-width rules can override defaults.
 */

@media (min-width: 1700px) {
    :root {
        --ui-scale: 1.08;
        --diagram-scale: 1.16;
        --nav-height: 108px;
        --nav-pad-x: clamp(22px, 4.2vw, 82px);
        --nav-icon-size: 50px;
    }
}

@media (min-width: 2100px) {
    :root {
        --ui-scale: 1.14;
        --diagram-scale: 1.22;
        --nav-height: 114px;
        --nav-pad-x: clamp(24px, 4.4vw, 92px);
        --nav-icon-size: 54px;
    }
}

@media (min-width: 2500px) {
    :root {
        --ui-scale: 1.2;
        --diagram-scale: 1.28;
        --nav-height: 120px;
        --nav-pad-x: clamp(28px, 4.8vw, 104px);
        --nav-icon-size: 58px;
    }
}

/* Section / hero / glass padding: one source of truth via theme-variables; scale with --ui-scale here */
@media (min-width: 1700px) {
    :root {
        --section-pad-top: calc(120px * var(--ui-scale));
        --section-pad-bottom: calc(120px * var(--ui-scale));
        --section-scroll-margin: calc(132px * var(--ui-scale));
        --hero-padding-top: calc(102px * var(--ui-scale));
        --glass-card-padding: clamp(calc(46px * var(--ui-scale)), 4.4vw, calc(60px * var(--ui-scale)));
        --glass-card-radius: calc(24px * var(--ui-scale));
    }
}

@media (min-width: 1700px) {
    .content-wrapper {
        max-width: calc(1600px * var(--ui-scale));
        padding: 0 clamp(48px, 4.5vw, 104px);
    }

    .logo-container {
        max-width: min(52vw, calc(760px * var(--ui-scale)));
    }

    .logo-svg {
        width: clamp(38px, calc(3.5vw * var(--ui-scale)), 62px);
        height: clamp(38px, calc(3.5vw * var(--ui-scale)), 62px);
    }

    .logomark {
        font-size: clamp(24px, calc(2.4vw * var(--ui-scale)), 38px);
    }

    .btn-text {
        font-size: calc(11px * var(--ui-scale));
        letter-spacing: calc(4px * var(--ui-scale));
    }

    .nav-links {
        gap: clamp(12px, calc(1.5vw * var(--ui-scale)), 26px);
    }

    .section-kicker,
    .hero-meta span {
        font-size: calc(10.5px * var(--ui-scale));
    }

    .eyebrow {
        font-size: calc(11px * var(--ui-scale));
        margin-bottom: calc(24px * var(--ui-scale));
    }

    .hero-panel {
        max-width: min(calc(980px * var(--ui-scale)), calc(100% - 2vw));
        margin-left: clamp(0px, 5vw, calc(72px * var(--ui-scale)));
    }

    .hero-panel p {
        font-size: clamp(20px, calc(1.15vw + 4px), 29px);
        line-height: 1.66;
        max-width: 58rem;
    }

    .manifesto-panel {
        max-width: calc(1280px * var(--ui-scale));
    }

    .manifesto-grid h2 {
        font-size: clamp(40px, 4.3vw, 56px);
        line-height: 1.14;
    }

    .manifesto-grid p {
        font-size: calc(19px * var(--ui-scale));
        line-height: 1.9;
    }

    .protocol {
        margin-bottom: calc(120px * var(--ui-scale));
    }

    .protocol-content h2 {
        font-size: clamp(44px, 4.8vw, 64px);
        line-height: 1.14;
    }

    .protocol-content p,
    .thesis-copy p,
    .twinx-copy p,
    .trust-copy p,
    .contact-panel p,
    .contact-data-column p:not(#contact-body),
    .architecture-intro {
        font-size: calc(17px * var(--ui-scale));
        line-height: 1.88;
    }

    #contact #contact-body {
        font-size: calc(17px * var(--ui-scale));
        font-weight: 400;
        line-height: 1.85;
    }

    #contact #contact-points.signal-list li {
        font-size: calc(17px * var(--ui-scale));
        font-weight: 400;
        line-height: 1.45;
        margin-top: calc(10px * var(--ui-scale));
    }

    #contact .contact-hybrid-lead {
        font-size: calc(17px * var(--ui-scale));
        font-weight: 400;
        line-height: 1.85;
    }

    .contact-switcher {
        padding-bottom: calc(18px * var(--ui-scale));
        border-bottom: 1px solid var(--brand-blue);
    }

    .contact-switcher .switcher-btn.is-active {
        background: var(--field-switcher-active-bg);
        border-color: var(--brand-blue);
        color: var(--brand-blue);
        box-shadow: var(--field-switcher-active-inset);
    }

    /* Match adjacent body copy: signal bullets scale with --ui-scale */
    .signal-list {
        margin-top: calc(26px * var(--ui-scale));
        gap: calc(14px * var(--ui-scale));
    }

    .signal-list li {
        padding-left: calc(22px * var(--ui-scale));
        font-size: calc(14px * var(--ui-scale));
    }

    .signal-list li::before {
        width: calc(8px * var(--ui-scale));
        height: calc(8px * var(--ui-scale));
    }

    .thesis-copy .signal-list li,
    .twinx-copy .signal-list li {
        font-size: calc(17px * var(--ui-scale));
        line-height: 1.88;
    }

    .thesis-diagram svg {
        max-width: calc(556px * var(--diagram-scale));
    }

    .architecture-grid {
        grid-template-columns: minmax(0, 1.1fr) minmax(320px, 0.9fr);
        gap: clamp(28px, 4vw, 60px);
    }

    .field-detail {
        grid-template-columns: minmax(0, 1.14fr) minmax(320px, 0.86fr);
        gap: clamp(28px, 4vw, 60px);
    }

    .trust-grid,
    .contact-grid {
        grid-template-columns: minmax(0, 1.16fr) minmax(320px, 0.84fr);
        gap: clamp(28px, 4vw, 62px);
    }

    .contact-main-grid {
        grid-template-columns: minmax(0, 1.34fr) minmax(280px, 0.66fr);
        gap: clamp(28px, 4vw, 62px);
    }

    .hero-actions,
    .drawer-links,
    .contact-links,
    .field-switcher,
    .contact-switcher,
    .media-reference-bar {
        gap: calc(14px * var(--ui-scale));
    }

    .btn-solid,
    .btn-ghost,
    .drawer-trigger,
    .switcher-btn {
        padding: calc(15px * var(--ui-scale)) calc(24px * var(--ui-scale));
        font-size: calc(11px * var(--ui-scale));
        letter-spacing: calc(2.4px * var(--ui-scale));
    }

    .contact-hybrid-step label,
    .contact-hybrid-panel .brief-field label {
        font-size: calc(10px * var(--ui-scale));
        margin-bottom: calc(8px * var(--ui-scale));
    }

    .contact-hybrid-step input,
    .contact-hybrid-panel .brief-field input,
    .contact-hybrid-panel .brief-field textarea {
        font-size: calc(17px * var(--ui-scale));
        padding: calc(13px * var(--ui-scale)) calc(15px * var(--ui-scale));
    }

    .contact-hybrid-step textarea {
        font-size: calc(17px * var(--ui-scale));
        padding: calc(15px * var(--ui-scale)) calc(17px * var(--ui-scale));
        min-height: calc(120px * var(--ui-scale));
    }

    .submit-preview-card {
        width: min(calc(760px * var(--ui-scale)), 100%);
        padding: calc(26px * var(--ui-scale)) calc(24px * var(--ui-scale)) calc(22px * var(--ui-scale));
    }

    .submit-preview-card h3 {
        font-size: clamp(24px, calc(2vw + 2px), 40px);
        line-height: 1.28;
    }

    .media-viewer-card {
        width: min(calc(1040px * var(--ui-scale)), calc(100vw - 72px));
        max-height: min(84vh, calc(100dvh - 140px));
        padding: calc(28px * var(--ui-scale)) calc(30px * var(--ui-scale)) calc(24px * var(--ui-scale));
    }

    .media-viewer-card[data-media-type="audio"] .media-viewer-frame,
    .media-viewer-card[data-media-type="embed"] .media-viewer-frame,
    .media-viewer-card[data-media-type="document"] .media-viewer-frame {
        min-height: calc(440px * var(--ui-scale));
    }

    .media-dock > summary {
        min-height: calc(46px * var(--ui-scale));
        padding: calc(10px * var(--ui-scale)) calc(14px * var(--ui-scale));
    }

    .media-dock-summary-label {
        font-size: calc(10px * var(--ui-scale));
        letter-spacing: calc(3px * var(--ui-scale));
    }

    .media-dock-body {
        width: min(calc(600px * var(--ui-scale)), calc(100vw - 40px));
        max-height: min(80vh, calc(100dvh - 124px));
        border-radius: calc(20px * var(--ui-scale));
    }

    .media-dock-scroll {
        grid-template-columns: minmax(0, 1.04fr) minmax(260px, 0.96fr);
    }

    .insight-drawer {
        width: min(calc(540px * var(--ui-scale)), 100vw);
        padding: calc(124px * var(--ui-scale)) calc(32px * var(--ui-scale)) calc(28px * var(--ui-scale));
    }

    .drawer-card {
        border-radius: calc(28px * var(--ui-scale));
        padding: calc(28px * var(--ui-scale)) calc(28px * var(--ui-scale)) calc(24px * var(--ui-scale));
    }

    .drawer-card h3 {
        font-size: clamp(34px, calc(2.1vw + 6px), 46px);
        line-height: 1.22;
        margin-bottom: calc(26px * var(--ui-scale));
    }

    .drawer-card p,
    .drawer-card li {
        font-size: calc(16px * var(--ui-scale));
        line-height: 1.84;
    }

    .architecture-visual svg {
        max-width: calc(560px * var(--diagram-scale));
    }

    .field-map svg {
        max-width: calc(452px * var(--diagram-scale));
    }

    .twinx-visual svg {
        max-width: calc(376px * var(--diagram-scale));
    }

    .trust-visual svg {
        max-width: calc(596px * var(--diagram-scale));
    }

    .contact-visual svg {
        max-width: calc(580px * var(--diagram-scale));
    }

    .architecture-visual {
        min-height: calc(336px * var(--diagram-scale));
    }

    .field-map {
        min-height: calc(344px * var(--diagram-scale));
    }

    .trust-visual {
        min-height: calc(318px * var(--diagram-scale));
        padding: calc(10px * var(--diagram-scale)) 0 calc(14px * var(--diagram-scale));
    }

    .contact-visual {
        min-height: calc(360px * var(--diagram-scale));
        padding: calc(14px * var(--diagram-scale)) 0 calc(18px * var(--diagram-scale));
    }

    .twinx-copy .twinx-visual {
        width: clamp(270px, 45%, 580px);
        shape-margin: clamp(16px, 2vw, 28px);
    }

    .thesis-diagram {
        width: clamp(270px, 60%, calc(560px * var(--diagram-scale)));
        shape-margin: clamp(16px, 2vw, 28px);
    }

    /* Keep label text optically centered when padding/font scale with --ui-scale */
    .card-bottom-media .media-reference-bar > .btn-ghost,
    .card-bottom-media .media-reference-bar > .media-ref-btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        line-height: 1.25;
    }
}
