/* zhiyuan-tool DESIGN.md implementation */

:root {
    --ink: #171717;
    --ink-2: #2B2E31;
    --paper: #FBFAF7;
    --panel: #FFFFFF;
    --line: #E7E1D8;
    --muted: #76716A;
    --muted-2: #A49B8F;
    --gray-500: #76716A;
    --accent: #8F2F2A;
    --accent-2: #0F5E57;
    --accent-soft: #F6E8E4;
    --teal-soft: #E7F1EE;
    --danger: #9E2F25;
    --success: #0F6B4B;
    --shadow: 0 20px 60px rgba(23, 23, 23, .08);
    --shadow-sm: 0 8px 24px rgba(23, 23, 23, .06);
    --r-sm: 6px;
    --r-md: 8px;
    --max: 1160px;
    --font: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei", sans-serif;
}

/* front-v4 apple-google buyer-facing redesign */
.front-v4 {
    --v4-ink: #111111;
    --v4-text: #202124;
    --v4-muted: #5F6368;
    --v4-soft: #F5F7F8;
    --v4-panel: #FFFFFF;
    --v4-line: #DADDE1;
    --v4-blue: #1A73E8;
    --v4-blue-dark: #1558B0;
    --v4-green: #188038;
    --v4-shadow: 0 28px 80px rgba(60, 64, 67, .12);
    --v4-shadow-sm: 0 10px 32px rgba(60, 64, 67, .08);
    --v4-radius-lg: 24px;
    --v4-radius-md: 16px;
    --v4-radius-sm: 12px;
    background:
        linear-gradient(180deg, #fff 0%, #f7f9fb 48%, #fff 100%);
    color: var(--v4-text);
    font-family: ui-sans-serif, -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
    font-variant-numeric: tabular-nums;
}

.front-v4 a { text-decoration-thickness: 1px; text-underline-offset: 4px; }
.front-v4 .v4-kicker,
.front-v4 .eyebrow {
    margin: 0 0 12px;
    color: var(--v4-blue);
    font-size: .76rem;
    font-weight: 760;
    letter-spacing: 0;
    text-transform: none;
}

.front-v4 .btn-primary,
.front-v4 .btn-secondary,
.front-v4 .input-group button,
.front-v4 .send-btn {
    border-radius: 999px;
    min-height: 46px;
    padding: 12px 22px;
    font-weight: 760;
    transition: transform .2s ease, background .2s ease, border-color .2s ease, box-shadow .2s ease;
}

.front-v4 .btn-primary,
.front-v4 .input-group button,
.front-v4 .send-btn {
    background: var(--v4-blue);
    color: #fff;
    box-shadow: 0 10px 24px rgba(26, 115, 232, .18);
}

.front-v4 .btn-primary:hover,
.front-v4 .input-group button:hover,
.front-v4 .send-btn:hover {
    background: var(--v4-blue-dark);
    transform: translateY(-1px);
}

.front-v4 .btn-primary:active,
.front-v4 .btn-secondary:active,
.front-v4 .input-group button:active,
.front-v4 .send-btn:active { transform: translateY(1px) scale(.99); }

.front-v4 .btn-secondary {
    background: rgba(255,255,255,.84);
    color: var(--v4-text);
    border-color: var(--v4-line);
    box-shadow: none;
}

.front-v4 .btn-secondary:hover {
    border-color: rgba(32,33,36,.42);
    background: #fff;
}

.front-v4 input[type=text],
.front-v4 textarea {
    border-radius: var(--v4-radius-sm);
    border-color: var(--v4-line);
    background: #fff;
}

.front-v4 input:focus,
.front-v4 textarea:focus {
    border-color: var(--v4-blue);
    box-shadow: 0 0 0 4px rgba(26,115,232,.12);
}

.front-v4 .card,
.front-v4 .section-panel,
.front-v4 .auth-card,
.front-v4 .checkout-panel,
.front-v4 .status-card,
.front-v4 .blog-card,
.front-v4 .blog-article,
.front-v4 .ui-card {
    border-color: rgba(218,221,225,.82);
    border-radius: var(--v4-radius-md);
    box-shadow: var(--v4-shadow-sm);
    background: rgba(255,255,255,.92);
}

.site-header {
    border-radius: 999px;
    border-color: rgba(218,221,225,.78);
    background: rgba(255,255,255,.84);
    backdrop-filter: blur(20px);
    box-shadow: 0 14px 44px rgba(60,64,67,.08);
}

.site-header__logo { color: #111; letter-spacing: 0; }
.site-header__tagline { color: #6b7280; font-weight: 650; }
.site-header__nav a,
.site-header__login,
.site-header__cta {
    border-radius: 999px;
    min-height: 38px;
    font-weight: 700;
    letter-spacing: 0;
}

.site-header__nav a:hover,
.site-header__nav a[aria-current="page"] {
    background: #F1F3F4;
    color: #111;
}

.site-header__login { background: #fff; border-color: #DADDE1; color: #202124; }
.site-header__cta { background: #111; color: #fff; }

.v4-hero {
    width: min(100%, 1240px);
    margin: 0 auto;
    padding: clamp(44px, 7vw, 92px) 0 34px;
    display: grid;
    grid-template-columns: minmax(0, .92fr) minmax(360px, 1.08fr);
    gap: clamp(24px, 5vw, 68px);
    align-items: center;
}

.v4-hero__copy h1 {
    margin: 0;
    max-width: 760px;
    color: var(--v4-ink);
    font-size: clamp(3rem, 6.3vw, 6.7rem);
    line-height: .96;
    font-weight: 820;
    letter-spacing: 0;
    text-wrap: balance;
}

.v4-hero__lead {
    max-width: 540px;
    margin: 22px 0 0;
    color: var(--v4-muted);
    font-size: clamp(1.04rem, 1.35vw, 1.22rem);
    line-height: 1.75;
    text-wrap: pretty;
}

.v4-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 30px;
}

.v4-boundary {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 28px;
}

.v4-boundary span {
    color: var(--v4-muted);
    border: 1px solid var(--v4-line);
    background: #fff;
    border-radius: 999px;
    padding: 8px 13px;
    font-size: .9rem;
}

.v4-hero__media {
    position: relative;
    margin: 0;
    min-height: min(640px, 64vw);
    border-radius: 32px;
    overflow: hidden;
    background: #EEF2F6;
    box-shadow: var(--v4-shadow);
}

.v4-hero__media img {
    width: 100%;
    height: 100%;
    min-height: 620px;
    object-fit: cover;
    filter: saturate(.92) contrast(1.02);
}

.v4-hero__media::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(255,255,255,0) 42%, rgba(17,17,17,.72) 100%);
    pointer-events: none;
}

.v4-hero__media figcaption {
    position: absolute;
    left: 24px;
    right: 24px;
    bottom: 22px;
    z-index: 1;
    color: #fff;
    display: grid;
    gap: 4px;
}

.v4-hero__media figcaption strong { font-size: 1.08rem; }
.v4-hero__media figcaption span { max-width: 420px; color: rgba(255,255,255,.78); font-size: .94rem; }

.v4-strip,
.v4-method,
.v4-products,
.v4-content-grid,
.front-v4 .premium-compliance {
    width: min(100%, 1240px);
    margin: 0 auto clamp(34px, 5vw, 72px);
}

.v4-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0;
    border-top: 1px solid var(--v4-line);
    border-bottom: 1px solid var(--v4-line);
}

.v4-strip article {
    padding: 22px 20px;
    border-right: 1px solid var(--v4-line);
    display: grid;
    gap: 5px;
}

.v4-strip article:last-child { border-right: 0; }
.v4-strip strong { color: var(--v4-text); font-size: 1rem; }
.v4-strip span { color: var(--v4-muted); font-size: .92rem; line-height: 1.7; }

.v4-section-title {
    max-width: 800px;
    margin-bottom: 28px;
}

.v4-section-title.compact {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 24px;
    max-width: none;
}

.v4-section-title h2 {
    margin: 0;
    color: var(--v4-ink);
    font-size: clamp(2rem, 4.6vw, 4.8rem);
    line-height: 1.02;
    font-weight: 800;
    letter-spacing: 0;
    text-wrap: balance;
}

.v4-section-title p {
    max-width: 600px;
    margin: 16px 0 0;
    color: var(--v4-muted);
    line-height: 1.8;
}

.v4-flow {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}

.v4-flow article {
    min-height: 210px;
    padding: 22px;
    border: 1px solid var(--v4-line);
    border-radius: var(--v4-radius-md);
    background: #fff;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.v4-flow span {
    color: var(--v4-blue);
    font-size: .84rem;
    font-weight: 760;
}

.v4-flow strong { font-size: 1.32rem; color: var(--v4-ink); }
.v4-flow small { color: var(--v4-muted); font-size: .92rem; line-height: 1.6; }

.v4-products .products-grid { align-items: stretch; }
.v4-products .product-card {
    border-radius: 22px;
    border-color: var(--v4-line);
    box-shadow: none;
    background: #fff;
}

.v4-products .product-card.is-recommended {
    border-color: rgba(26,115,232,.42);
    box-shadow: 0 18px 56px rgba(26,115,232,.13);
}

.v4-products .product-badge {
    background: rgba(26,115,232,.1);
    color: var(--v4-blue);
    border-radius: 999px;
}

.v4-products .product-price strong { color: var(--v4-ink); font-size: 3.4rem; }
.v4-products .product-features li::before { color: var(--v4-green); }

.v4-content-grid {
    display: grid;
    grid-template-columns: 1.2fr .8fr;
    gap: 12px;
}

.v4-index-card {
    min-height: 230px;
    padding: clamp(22px, 3vw, 34px);
    border: 1px solid var(--v4-line);
    border-radius: var(--v4-radius-lg);
    background: #fff;
    color: var(--v4-text);
    text-decoration: none;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}

.v4-index-card:hover {
    transform: translateY(-3px);
    border-color: rgba(26,115,232,.36);
    box-shadow: var(--v4-shadow-sm);
}

.v4-index-card.is-large {
    min-height: 472px;
    grid-row: span 2;
    background: #111;
    color: #fff;
}

.v4-index-card span {
    color: var(--v4-blue);
    font-weight: 760;
}

.v4-index-card.is-large span { color: #8AB4F8; }
.v4-index-card h2,
.v4-index-card h3 { margin: 0; line-height: 1.05; letter-spacing: 0; }
.v4-index-card h2 { max-width: 540px; font-size: clamp(2.2rem, 4.4vw, 4.8rem); }
.v4-index-card h3 { font-size: clamp(1.5rem, 2.3vw, 2.3rem); }
.v4-index-card p { margin: 14px 0 0; color: var(--v4-muted); line-height: 1.75; }
.v4-index-card.is-large p { color: rgba(255,255,255,.72); }

.v4-blog-card .blog-mini { display: grid; gap: 12px; margin: 12px 0; }
.v4-blog-card .blog-mini-item { display: grid; gap: 3px; padding-top: 12px; border-top: 1px solid var(--v4-line); }
.v4-blog-card .blog-mini-item a { color: var(--v4-text); font-weight: 760; text-decoration: none; }
.v4-blog-card .blog-mini-item span { color: var(--v4-muted); font-weight: 400; font-size: .9rem; }

.front-v4 .premium-compliance {
    border: 1px solid var(--v4-line);
    border-radius: var(--v4-radius-lg);
    background: #fff;
    box-shadow: none;
}

.checkout-v4,
.status-v4,
.redeem-v4 {
    background: linear-gradient(180deg, #fff 0%, #F5F7F8 100%);
}

.checkout-v4 .checkout-shell {
    width: min(100%, 1180px);
    gap: 14px;
}

.checkout-v4 .checkout-summary,
.status-v4 .status-card,
.redeem-v4 .auth-card,
.checkout-v4 .checkout-panel {
    border-radius: 28px;
    border-color: var(--v4-line);
    box-shadow: var(--v4-shadow);
}

.checkout-v4 .checkout-summary {
    background: #111;
    color: #fff;
}

.checkout-v4 .checkout-summary p,
.checkout-v4 .checkout-steps li { color: rgba(255,255,255,.76); }
.checkout-v4 .amount-display { background: rgba(255,255,255,.08); border-color: rgba(255,255,255,.14); }
.checkout-v4 .amount-display strong { color: #fff; letter-spacing: 0; }
.checkout-v4 .checkout-steps span { background: #fff; color: #111; }
.checkout-v4 .front-pay-alert {
    border-radius: var(--v4-radius-sm);
    background: rgba(26,115,232,.08);
    color: var(--v4-blue-dark);
    border: 1px solid rgba(26,115,232,.16);
}
.checkout-v4 .qr-tab { border-radius: 999px; }
.checkout-v4 .qr-tab.active { background: var(--v4-blue); color: #fff; }
.checkout-v4 .qr-frame {
    border-radius: 24px;
    border-color: var(--v4-line);
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.8);
}
.checkout-v4 .upload-placeholder {
    border-radius: 22px;
    border-color: rgba(26,115,232,.28);
    background: #F8FAFF;
}

.status-v4 .status-timeline-v3 {
    gap: 8px;
}

.status-v4 .status-timeline-v3 span {
    border-radius: 999px;
    background: #F1F3F4;
    border-color: transparent;
    color: var(--v4-muted);
}

.status-v4 .status-timeline-v3 span.is-active {
    background: rgba(26,115,232,.1);
    color: var(--v4-blue);
}

.status-v4 .success-state h2,
.redeem-v4 .auth-card h1 {
    color: var(--v4-ink);
    letter-spacing: 0;
}

.redeem-v4 .front-login-benefits {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}

.redeem-v4 .front-login-benefits span {
    border-radius: 999px;
    background: #F1F3F4;
    border: 0;
    color: var(--v4-text);
}

.chat-v4 {
    background: #F5F7F8;
    border: 0;
    border-radius: 0;
    width: 100%;
    max-width: none;
    height: 100dvh;
    display: grid;
    grid-template-columns: minmax(260px, 340px) minmax(0, 1fr);
    grid-template-rows: auto 1fr auto;
}

.chat-v4 .chat-header {
    grid-column: 1 / -1;
    background: #111;
    color: #fff;
    border: 0;
    border-radius: 0 0 28px 28px;
    padding: 22px clamp(18px, 4vw, 48px);
}

.chat-v4 .chat-header p { color: rgba(255,255,255,.72); }
.chat-v4 .chat-header h1 { letter-spacing: 0; }
.chat-v4 .text-link { color: inherit; }
.chat-v4 .quota-badge {
    background: rgba(255,255,255,.1);
    color: #fff;
    border: 1px solid rgba(255,255,255,.16);
    border-radius: 999px;
}

.chat-v4 .chat-framework-bar {
    grid-column: 1;
    grid-row: 2 / 4;
    align-self: stretch;
    margin: 18px 0 18px 18px;
    padding: 16px;
    border: 1px solid var(--v4-line);
    border-radius: 24px;
    background: #fff;
    box-shadow: var(--v4-shadow-sm);
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.chat-v4 .chat-framework-bar span {
    min-height: 44px;
    display: flex;
    align-items: center;
    border-radius: 14px;
    background: #F5F7F8;
    color: var(--v4-text);
    border: 0;
}

.chat-v4 .messages-container {
    grid-column: 2;
    padding: 24px clamp(16px, 3vw, 44px);
}

.chat-v4 .message { max-width: 860px; }
.chat-v4 .message.assistant .bubble,
.chat-v4 .message.user .bubble {
    border-radius: 22px;
    box-shadow: none;
    line-height: 1.82;
}

.chat-v4 .message.assistant .bubble {
    background: #fff;
    border: 1px solid var(--v4-line);
}

.chat-v4 .message.user .bubble {
    background: var(--v4-blue);
    color: #fff;
}

.chat-v4 .avatar {
    border-radius: 14px;
    background: #111;
    color: #fff;
}

.chat-v4 .starter-grid button {
    border-radius: 999px;
    border-color: var(--v4-line);
    background: #F8FAFF;
    color: var(--v4-blue-dark);
}

.chat-v4 .input-area {
    grid-column: 2;
    border: 0;
    background: rgba(245,247,248,.92);
    backdrop-filter: blur(18px);
    padding: 14px clamp(16px, 3vw, 44px) 18px;
}

.chat-v4 .input-row {
    background: #fff;
    border: 1px solid var(--v4-line);
    border-radius: 24px;
    padding: 8px;
    box-shadow: var(--v4-shadow-sm);
}

.chat-v4 .input-row textarea {
    border: 0;
    box-shadow: none;
    background: transparent;
}

.content-v4 .sub-hero,
.content-v4 .guide-hero {
    background: #111;
    border-radius: 28px;
}

.content-v4 .sub-hero .eyebrow,
.content-v4 .guide-hero .eyebrow { color: #8AB4F8; }

.content-v4 .section-panel,
.content-v4 .blog-card,
.content-v4 .blog-article {
    border-radius: 22px;
    border-color: var(--v4-line);
    box-shadow: none;
}

.content-v4 .blog-hero,
.content-v4 .article-header {
    border-color: var(--v4-line);
}

@keyframes v4-rise {
    from { opacity: 0; transform: translateY(14px); }
    to { opacity: 1; transform: translateY(0); }
}

.front-v4 .v4-hero__copy,
.front-v4 .v4-hero__media,
.front-v4 .v4-strip,
.front-v4 .v4-method,
.front-v4 .v4-products,
.front-v4 .v4-content-grid,
.front-v4 .auth-card,
.front-v4 .checkout-shell,
.front-v4 .status-card {
    animation: v4-rise .55s ease both;
}

@media (prefers-reduced-motion: reduce) {
    .front-v4 *,
    .front-v4 *::before,
    .front-v4 *::after {
        animation: none !important;
        transition-duration: .01ms !important;
        scroll-behavior: auto !important;
    }
}

@media (max-width: 900px) {
    .v4-hero {
        grid-template-columns: 1fr;
        padding-top: 28px;
    }
    .v4-hero__media { min-height: 420px; }
    .v4-hero__media img { min-height: 420px; }
    .v4-strip,
    .v4-flow,
    .redeem-v4 .front-login-benefits { grid-template-columns: 1fr 1fr; }
    .v4-section-title.compact {
        display: block;
    }
    .v4-content-grid {
        grid-template-columns: 1fr;
    }
    .v4-index-card.is-large {
        min-height: 340px;
        grid-row: auto;
    }
    .chat-v4 {
        grid-template-columns: 1fr;
        grid-template-rows: auto auto 1fr auto;
    }
    .chat-v4 .chat-framework-bar {
        grid-column: 1;
        grid-row: 2;
        margin: 14px 14px 0;
        display: grid;
        grid-template-columns: repeat(5, minmax(140px, 1fr));
        overflow-x: auto;
    }
    .chat-v4 .messages-container {
        grid-column: 1;
        grid-row: 3;
        padding: 16px;
    }
    .chat-v4 .input-area {
        grid-column: 1;
        grid-row: 4;
        padding: 12px;
    }
}

@media (max-width: 560px) {
    .front-v4.site-page,
    .front-v4.blog-page,
    .front-v4.blog-post-page { padding: 12px; }
    .site-header {
        border-radius: 22px;
    }
    .v4-hero {
        padding-top: 18px;
        gap: 22px;
    }
    .v4-hero__copy h1 {
        font-size: 2.72rem;
        line-height: 1;
    }
    .v4-hero__lead {
        font-size: 1rem;
        line-height: 1.65;
    }
    .v4-actions {
        display: grid;
        grid-template-columns: 1fr;
    }
    .v4-boundary span {
        flex: 1 1 calc(50% - 8px);
        text-align: center;
    }
    .v4-hero__media,
    .v4-hero__media img {
        min-height: 340px;
        border-radius: 24px;
    }
    .v4-strip,
    .v4-flow,
    .redeem-v4 .front-login-benefits {
        grid-template-columns: 1fr;
    }
    .v4-strip article {
        border-right: 0;
        border-bottom: 1px solid var(--v4-line);
    }
    .v4-strip article:last-child { border-bottom: 0; }
    .v4-section-title h2 {
        font-size: 2.15rem;
    }
    .v4-flow article {
        min-height: 160px;
    }
    .v4-index-card {
        min-height: 210px;
        border-radius: 20px;
    }
    .checkout-v4 .checkout-summary,
    .checkout-v4 .checkout-panel,
    .status-v4 .status-card,
    .redeem-v4 .auth-card {
        border-radius: 22px;
    }
    .chat-v4 .chat-header {
        border-radius: 0 0 22px 22px;
        padding: 18px 14px;
    }
    .chat-v4 .chat-framework-bar {
        grid-template-columns: repeat(5, minmax(120px, 1fr));
        margin: 10px 10px 0;
        padding: 10px;
        border-radius: 18px;
    }
    .chat-v4 .message {
        max-width: 100%;
    }
    .chat-v4 .input-row {
        border-radius: 20px;
    }
}

*, *::before, *::after { box-sizing: border-box; }
html { font-size: 16px; -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body { margin: 0; min-height: 100vh; background: var(--paper); color: var(--ink); font-family: var(--font); line-height: 1.6; -webkit-font-smoothing: antialiased; }
img { max-width: 100%; display: block; }
a { color: inherit; }
button, input, textarea { font: inherit; }
[hidden] { display: none !important; }

.muted, .hint, .subtitle { color: var(--muted); }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.eyebrow { margin: 0 0 10px; color: var(--accent); font-size: .72rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.text-link { color: var(--ink); text-decoration: none; font-weight: 750; border-bottom: 1px solid currentColor; }
.card, .section-panel, .auth-card, .checkout-panel, .status-card, .blog-card, .blog-article {
    background: rgba(255,255,255,.86);
    border: 1px solid var(--line);
    border-radius: var(--r-md);
    box-shadow: var(--shadow-sm);
}

.btn-primary, .btn-secondary, .btn-submit, .input-group button {
    min-height: 44px;
    border-radius: var(--r-sm);
    border: 1px solid transparent;
    padding: 11px 18px;
    font-weight: 850;
    cursor: pointer;
    text-align: center;
    text-decoration: none;
    transition: transform .18s ease, background .18s ease, border-color .18s ease;
}
.btn-primary, .btn-submit, .input-group button { background: var(--accent); color: #fff; }
.btn-primary:hover, .btn-submit:hover, .input-group button:hover { background: #762620; transform: translateY(-1px); }
.btn-secondary { background: var(--panel); color: var(--ink); border-color: var(--line); }
.btn-secondary:hover { border-color: var(--ink); transform: translateY(-1px); }
.btn-primary:disabled, .btn-submit:disabled, .send-btn:disabled { opacity: .48; cursor: not-allowed; transform: none; }
.block { display: block; width: 100%; }

input[type=text], input[type=password], input[type=number], textarea {
    width: 100%;
    min-height: 44px;
    border: 1px solid var(--line);
    border-radius: var(--r-sm);
    background: #fff;
    color: var(--ink);
    padding: 12px 13px;
    outline: none;
}
textarea { resize: vertical; }
input:focus, textarea:focus { border-color: var(--accent-2); box-shadow: 0 0 0 3px rgba(15,94,87,.12); }
.alert { padding: 12px 14px; border-radius: var(--r-sm); margin: 12px 0; }
.alert-error { color: var(--danger); background: var(--accent-soft); border: 1px solid rgba(143,47,42,.18); }
.disclaimer-inline, .disclaimer-box, .compliance-band, .blog-disclaimer {
    color: var(--muted);
    font-size: .84rem;
    border-top: 1px solid var(--line);
}
.disclaimer-inline { margin-top: 18px; padding-top: 14px; text-align: center; }
.disclaimer-box, .blog-disclaimer { border: 1px solid var(--line); border-left: 3px solid var(--accent); padding: 14px; background: var(--accent-soft); border-radius: var(--r-sm); }

/* Component system */
.site-header {
    position: sticky;
    top: 14px;
    z-index: 30;
    width: min(calc(100% - 32px), var(--max));
    min-height: 58px;
    margin: 14px auto 18px;
    padding: 8px 10px 8px 16px;
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 16px;
    background: rgba(251,250,247,.86);
    border: 1px solid rgba(231,225,216,.92);
    border-radius: var(--r-md);
    box-shadow: 0 14px 42px rgba(23,23,23,.08);
    backdrop-filter: blur(18px);
}
.site-header--compact { margin-bottom: 8px; }
.site-header__brand { display: grid; gap: 1px; text-decoration: none; min-width: 128px; }
.site-header__logo { font-weight: 950; line-height: 1.1; }
.site-header__tagline { color: var(--muted); font-size: .72rem; font-weight: 780; }
.site-header__nav { justify-self: center; display: flex; align-items: center; gap: 8px; }
.site-header__nav a, .site-header__login, .site-header__cta {
    min-height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--r-sm);
    padding: 0 12px;
    text-decoration: none;
    font-size: .9rem;
    font-weight: 820;
}
.site-header__nav a { color: var(--muted); }
.site-header__nav a:hover, .site-header__nav a[aria-current="page"] { color: var(--ink); background: #fff; }
.site-header__actions { display: flex; align-items: center; gap: 8px; }
.site-header__login { color: var(--ink); background: #fff; border: 1px solid var(--line); }
.site-header__cta { color: #fff; background: var(--ink); }
.site-header__menu {
    display: none;
    width: 40px;
    height: 40px;
    border: 1px solid var(--line);
    border-radius: var(--r-sm);
    background: #fff;
    cursor: pointer;
}
.site-header__menu span { display: block; width: 17px; height: 2px; margin: 4px auto; background: var(--ink); border-radius: 2px; }

.site-footer {
    width: min(calc(100% - 32px), var(--max));
    margin: 18px auto 32px;
    padding: 28px;
    display: grid;
    grid-template-columns: 1.2fr .8fr 1fr;
    gap: 22px;
    border: 1px solid var(--line);
    border-radius: var(--r-md);
    background: var(--ink);
    color: #fff;
}
.site-footer p { margin: 8px 0 0; color: rgba(255,255,255,.68); }
.site-footer__links { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 14px; align-content: start; }
.site-footer__links a { color: rgba(255,255,255,.86); text-decoration: none; font-weight: 760; }
.site-footer__links a:hover { color: #fff; text-decoration: underline; }
.site-footer__compliance { font-size: .86rem; }

.site-sidebar, .admin-sidebar {
    border: 1px solid var(--line);
    border-radius: var(--r-md);
    background: rgba(255,255,255,.9);
    box-shadow: var(--shadow-sm);
}
.site-sidebar { padding: 16px; position: sticky; top: 92px; }
.site-sidebar__title, .admin-sidebar__brand strong { display: block; margin-bottom: 10px; font-weight: 920; }
.site-sidebar__nav, .admin-sidebar__nav { display: grid; gap: 6px; }
.site-sidebar__nav a, .admin-sidebar__nav a {
    min-height: 36px;
    display: flex;
    align-items: center;
    padding: 0 10px;
    border-radius: var(--r-sm);
    color: var(--muted);
    text-decoration: none;
    font-weight: 760;
}
.site-sidebar__nav a:hover, .site-sidebar__nav a[aria-current="page"], .admin-sidebar__nav a:hover { color: var(--ink); background: var(--accent-soft); }
.site-sidebar__cta { margin-top: 12px; display: flex; min-height: 40px; align-items: center; justify-content: center; border-radius: var(--r-sm); background: var(--accent); color: #fff; text-decoration: none; font-weight: 850; }
.admin-sidebar { padding: 14px; align-self: start; }
.admin-sidebar__brand span { display: block; color: var(--muted); font-size: .82rem; }

.ui-card {
    background: rgba(255,255,255,.9);
    border: 1px solid var(--line);
    border-radius: var(--r-md);
    box-shadow: var(--shadow-sm);
    padding: 22px;
}
.ui-card__eyebrow { margin: 0 0 8px; color: var(--accent); font-size: .72rem; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.ui-card__title { margin: 0; line-height: 1.08; }
.ui-card__description { margin: 10px 0 0; color: var(--muted); }
.ui-card:hover, .blog-card--component:hover, .product-card--component:hover { transform: translateY(-2px); border-color: rgba(143,47,42,.28); transition: transform .18s ease, border-color .18s ease; }
.status-badge { display: inline-flex; align-items: center; min-height: 26px; padding: 0 9px; border-radius: 999px; font-size: .78rem; font-weight: 850; background: var(--teal-soft); color: var(--accent-2); }
.status-badge--error, .status-badge--rejected { background: var(--accent-soft); color: var(--danger); }
.status-badge--pending { background: #FFF4E2; color: #9A5B11; }
.status-badge--success, .status-badge--confirmed { background: var(--teal-soft); color: var(--success); }

.ui-search { display: grid; grid-template-columns: 1fr auto auto; gap: 10px; align-items: center; }
.ui-search input[type=search] {
    width: 100%;
    min-height: 44px;
    border: 1px solid var(--line);
    border-radius: var(--r-sm);
    background: #fff;
    padding: 12px 13px;
    outline: none;
}
.ui-search input[type=search]:focus { border-color: var(--accent-2); box-shadow: 0 0 0 3px rgba(15,94,87,.12); }
.ui-filter-tabs { display: flex; flex-wrap: wrap; gap: 8px; }
.ui-filter-tab {
    min-height: 38px;
    border: 1px solid var(--line);
    border-radius: var(--r-sm);
    background: #fff;
    color: var(--muted);
    padding: 0 12px;
    font-weight: 800;
    cursor: pointer;
}
.ui-filter-tab.is-active, .ui-filter-tab:hover { color: var(--ink); border-color: rgba(143,47,42,.35); background: var(--accent-soft); }
.empty-state { padding: 24px; border: 1px dashed var(--line); border-radius: var(--r-md); background: rgba(255,255,255,.72); text-align: center; color: var(--muted); }
.empty-state strong { display: block; color: var(--ink); margin-bottom: 6px; }

/* Home */
.site-page { max-width: var(--max); margin: 0 auto; padding: 28px 20px 56px; }
.home-v2 { max-width: 1240px; }
.floating-nav {
    position: sticky;
    top: 14px;
    z-index: 20;
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 14px;
    min-height: 56px;
    margin: 0 auto 18px;
    padding: 8px 10px 8px 16px;
    background: rgba(251,250,247,.82);
    border: 1px solid rgba(231,225,216,.9);
    border-radius: var(--r-md);
    box-shadow: 0 14px 42px rgba(23,23,23,.08);
    backdrop-filter: blur(18px);
}
.brand-mark { font-weight: 950; text-decoration: none; letter-spacing: 0; }
.nav-links { justify-self: center; display: flex; align-items: center; gap: 8px; }
.nav-links a, .nav-cta {
    min-height: 36px;
    display: inline-flex;
    align-items: center;
    border-radius: var(--r-sm);
    text-decoration: none;
    font-weight: 820;
    font-size: .9rem;
    padding: 0 12px;
}
.nav-links a { color: var(--muted); }
.nav-links a:hover, .nav-links a[aria-current="page"] { color: var(--ink); background: #fff; }
.nav-cta { color: #fff; background: var(--ink); }
.hero-composed { min-height: 680px; display: flex; flex-direction: column; justify-content: center; padding: clamp(26px, 4vw, 58px) 0; }
.hero-kicker { display: flex; justify-content: space-between; gap: 12px; margin-bottom: 12px; color: var(--muted); font-size: .82rem; font-weight: 850; text-transform: uppercase; letter-spacing: .08em; }
.hero-composed-grid { display: grid; grid-template-columns: 1.05fr .95fr; gap: 16px; align-items: stretch; }
.hero-composed-copy {
    min-height: 540px;
    padding: clamp(30px, 5vw, 70px);
    border-radius: var(--r-md);
    background: var(--ink);
    color: #fff;
    display: flex;
    flex-direction: column;
    justify-content: center;
    position: relative;
    overflow: hidden;
}
.hero-composed-copy::after {
    content: "";
    position: absolute;
    inset: auto 32px 28px auto;
    width: 170px;
    height: 1px;
    background: rgba(255,255,255,.34);
}
.hero-composed-copy h1 { margin: 0; font-size: clamp(2.7rem, 6vw, 6.4rem); line-height: .92; font-weight: 950; letter-spacing: 0; max-width: 820px; }
.hero-composed-copy p { max-width: 650px; margin: 24px 0 0; color: rgba(255,255,255,.76); font-size: 1.05rem; }
.hero-composed-copy .btn-secondary { background: transparent; color: #fff; border-color: rgba(255,255,255,.24); }
.hero-editorial-card { margin: 0; min-height: 540px; border-radius: var(--r-md); overflow: hidden; position: relative; background: #fff; box-shadow: var(--shadow); }
.hero-editorial-card img { width: 100%; height: 100%; min-height: 540px; object-fit: cover; transition: transform .8s cubic-bezier(.2,.8,.2,1); }
.hero-editorial-card:hover img { transform: scale(1.035); }
.hero-editorial-card figcaption {
    position: absolute;
    left: 18px;
    right: 18px;
    bottom: 18px;
    display: grid;
    gap: 4px;
    padding: 14px;
    background: rgba(255,255,255,.84);
    border: 1px solid rgba(255,255,255,.72);
    border-radius: var(--r-sm);
    backdrop-filter: blur(14px);
}
.hero-editorial-card figcaption span { color: var(--muted); font-size: .88rem; }
.confluence-lab { overflow: hidden; }
.confluence-stage {
    position: relative;
    min-height: 560px;
    margin-top: 24px;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    grid-template-rows: repeat(3, minmax(110px, auto));
    gap: 14px;
    isolation: isolate;
}
.confluence-canvas { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 0; pointer-events: none; }
.signal-card, .decision-hub {
    position: relative;
    z-index: 1;
    border-radius: var(--r-md);
    border: 1px solid var(--line);
    background: rgba(255,255,255,.9);
    box-shadow: 0 16px 44px rgba(23,23,23,.06);
}
.signal-card {
    text-align: left;
    padding: 18px;
    cursor: pointer;
    color: var(--ink);
    transition: transform .22s ease, border-color .22s ease, background .22s ease, box-shadow .22s ease;
}
.signal-card span { display: block; color: var(--accent); font-size: .72rem; text-transform: uppercase; letter-spacing: .08em; font-weight: 900; }
.signal-card strong { display: block; margin-top: 12px; font-size: 1.05rem; line-height: 1.15; }
.signal-card small { display: block; margin-top: 8px; color: var(--muted); line-height: 1.5; }
.signal-card:hover, .signal-card.is-active { transform: translateY(-4px); border-color: rgba(143,47,42,.5); box-shadow: 0 22px 56px rgba(143,47,42,.13); }
.signal-card.is-active { background: var(--accent-soft); }
.signal-card[data-signal="score"] { grid-column: 1; grid-row: 1; }
.signal-card[data-signal="major"] { grid-column: 3; grid-row: 1; }
.signal-card[data-signal="city"] { grid-column: 1; grid-row: 3; }
.signal-card[data-signal="verify"] { grid-column: 3; grid-row: 3; }
.decision-hub { grid-column: 2; grid-row: 2; padding: 24px; align-self: center; background: var(--ink); color: #fff; }
.decision-hub .eyebrow { color: #E7B8AD; }
.decision-hub h3 { margin: 0 0 10px; font-size: 1.45rem; line-height: 1.1; }
.decision-hub p { margin: 0 0 16px; color: rgba(255,255,255,.75); }
.decision-hub .text-link { color: #fff; }
.curated-index { display: grid; grid-template-columns: 1.2fr .8fr; gap: 14px; margin: 18px 0; }
.index-tile {
    min-height: 260px;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding: clamp(20px, 4vw, 40px);
    color: var(--ink);
    text-decoration: none;
    border: 1px solid var(--line);
    border-radius: var(--r-md);
    background: #fff;
    box-shadow: var(--shadow-sm);
    transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}
.index-tile.large { grid-row: span 2; min-height: 540px; background: var(--ink); color: #fff; }
.index-tile.large .eyebrow { color: #E7B8AD; }
.index-tile:hover { transform: translateY(-4px); border-color: rgba(143,47,42,.35); box-shadow: var(--shadow); }
.index-tile h2, .index-tile h3 { margin: 0; line-height: 1.02; letter-spacing: 0; }
.index-tile h2 { font-size: clamp(2rem, 4vw, 4rem); }
.index-tile h3 { font-size: clamp(1.45rem, 2.6vw, 2.3rem); }
.index-tile p { max-width: 580px; margin: 16px 0 0; color: var(--muted); }
.index-tile.large p { color: rgba(255,255,255,.74); }
.compact-products .product-card { min-height: 360px; }
.home-bottom-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-top: 18px; }
.live-preview { overflow: hidden; min-height: 300px; display: flex; flex-direction: column; justify-content: space-between; }
.live-preview h2 { margin: 0; max-width: 560px; font-size: clamp(1.5rem, 3vw, 2.5rem); line-height: 1.05; }
.prompt-marquee { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; padding-bottom: 4px; }
.prompt-marquee span {
    padding: 14px;
    border: 1px solid var(--line);
    border-radius: var(--r-sm);
    background: #fff;
    font-weight: 760;
}
.premium-compliance { background: var(--ink); color: #fff; }
.premium-compliance p { color: rgba(255,255,255,.72); }
.hero-shell { display: grid; grid-template-columns: minmax(0, 1.02fr) minmax(320px, .98fr); gap: 28px; align-items: stretch; min-height: 620px; }
.hero-copy { background: var(--ink); color: #fff; border-radius: var(--r-md); padding: clamp(28px, 5vw, 64px); display: flex; flex-direction: column; justify-content: center; }
.hero-copy .eyebrow { color: #E7B8AD; }
.hero-copy h1 { margin: 0; max-width: 720px; font-size: clamp(2.3rem, 5vw, 5.1rem); line-height: .96; font-weight: 900; letter-spacing: 0; }
.hero-desc { max-width: 620px; margin: 22px 0 0; color: rgba(255,255,255,.78); font-size: 1.04rem; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }
.hero-actions .btn-secondary { background: transparent; color: #fff; border-color: rgba(255,255,255,.28); }
.hero-proof { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 28px; color: rgba(255,255,255,.74); font-size: .84rem; }
.hero-proof span { border: 1px solid rgba(255,255,255,.16); border-radius: 999px; padding: 7px 11px; }
.hero-visual { margin: 0; position: relative; border-radius: var(--r-md); overflow: hidden; min-height: 420px; background: var(--panel); box-shadow: var(--shadow); }
.hero-visual img { width: 100%; height: 100%; object-fit: cover; min-height: 620px; }
.hero-visual figcaption { position: absolute; left: 18px; right: 18px; bottom: 18px; padding: 12px 14px; background: rgba(255,255,255,.82); backdrop-filter: blur(10px); border: 1px solid rgba(255,255,255,.7); border-radius: var(--r-sm); color: var(--ink-2); font-weight: 750; }
.studio-strip { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin: 18px 0; }
.studio-strip div { background: var(--panel); border: 1px solid var(--line); border-radius: var(--r-sm); padding: 14px; }
.studio-strip strong { display: block; color: var(--accent); font-size: .78rem; margin-bottom: 6px; }
.studio-strip span { font-weight: 720; }
.section-panel { padding: clamp(22px, 4vw, 42px); margin: 18px 0; }
.section-heading { max-width: 650px; }
.section-heading.centered { text-align: center; margin: 0 auto 22px; }
.section-heading.compact { margin-bottom: 18px; }
.section-heading h2 { margin: 0; font-size: clamp(1.65rem, 3.2vw, 3rem); line-height: 1.05; letter-spacing: 0; }
.section-heading p { color: var(--muted); margin: 12px 0 0; }
.split-panel { display: grid; grid-template-columns: .8fr 1.2fr; gap: 28px; align-items: start; }
.framework-grid, .value-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.framework-grid article, .value-grid article { border: 1px solid var(--line); border-radius: var(--r-sm); padding: 18px; background: #fff; }
.framework-grid span { color: var(--accent); font-weight: 900; font-size: .78rem; }
.framework-grid h3, .value-grid h3 { margin: 8px 0 6px; font-size: 1rem; }
.framework-grid p, .value-grid p { margin: 0; color: var(--muted); font-size: .92rem; }
.prompt-panel { display: grid; grid-template-columns: .7fr 1.3fr; gap: 24px; }
.prompt-list { display: grid; gap: 10px; }
.prompt-list p { margin: 0; padding: 15px 16px; background: #fff; border: 1px solid var(--line); border-radius: var(--r-sm); font-weight: 680; }
.products-section { margin: 28px 0; }
.products-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.product-card { position: relative; padding: 22px; background: #fff; border: 1px solid var(--line); border-radius: var(--r-md); box-shadow: var(--shadow-sm); display: flex; flex-direction: column; min-height: 410px; }
.product-recommend { border-color: rgba(143,47,42,.58); box-shadow: 0 18px 45px rgba(143,47,42,.11); }
.product-badge { position: absolute; top: 14px; right: 14px; color: var(--accent); background: var(--accent-soft); border-radius: 999px; padding: 4px 9px; font-size: .72rem; font-weight: 850; }
.product-topline h3 { margin: 0 0 4px; font-size: 1.2rem; }
.product-topline p { margin: 0; color: var(--muted); min-height: 48px; }
.product-price { margin: 22px 0 12px; }
.product-price span { color: var(--accent); font-weight: 850; }
.product-price strong { font-size: 3rem; line-height: 1; color: var(--accent); }
.product-features { list-style: none; padding: 0; margin: 0 0 22px; display: grid; gap: 9px; color: var(--ink-2); flex: 1; }
.product-features li { padding-left: 18px; position: relative; }
.product-features li::before { content: ""; position: absolute; left: 0; top: .65em; width: 7px; height: 7px; border-radius: 50%; background: var(--accent-2); }
.geo-panel { background: var(--ink); color: #fff; }
.geo-panel .section-heading p, .geo-panel .value-grid p { color: rgba(255,255,255,.72); }
.geo-panel .value-grid article { background: rgba(255,255,255,.07); border-color: rgba(255,255,255,.14); }
.faq-panel details { border-top: 1px solid var(--line); padding: 16px 0; }
.faq-panel summary { cursor: pointer; font-weight: 850; }
.faq-panel p { color: var(--muted); max-width: 760px; }
.blog-mini { display: grid; gap: 10px; }
.blog-mini-item { padding: 14px 0; border-top: 1px solid var(--line); }
.blog-mini-item a { display: block; font-weight: 850; text-decoration: none; }
.blog-mini-item span { display: block; color: var(--muted); margin-top: 4px; }
.compliance-band { margin-top: 18px; border: 1px solid var(--line); border-left: 3px solid var(--accent); border-radius: var(--r-md); background: #fff; padding: 18px; }
.compliance-band p { margin: 6px 0 0; color: var(--muted); }

/* Auth, checkout, order */
.auth-page, .checkout-page, .status-page { min-height: 100vh; display: grid; place-items: center; padding: 22px; }
.auth-card, .status-card { width: min(100%, 520px); padding: clamp(24px, 5vw, 46px); }
.auth-card h1, .status-card h1 { margin: 10px 0 8px; font-size: clamp(1.8rem, 4vw, 3rem); line-height: 1.02; }
.redeem-form { margin: 22px 0; }
.redeem-form label, .field label { display: block; margin-bottom: 7px; color: var(--ink-2); font-weight: 800; font-size: .86rem; }
.input-group { display: flex; gap: 8px; }
.input-group input { flex: 1; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; letter-spacing: .08em; text-transform: uppercase; }
.checkout-shell { width: min(100%, var(--max)); display: grid; grid-template-columns: .85fr 1.15fr; gap: 18px; }
.checkout-summary { background: var(--ink); color: #fff; border-radius: var(--r-md); padding: clamp(24px, 4vw, 46px); }
.checkout-summary .eyebrow { color: #E7B8AD; }
.checkout-summary p { color: rgba(255,255,255,.76); }
.checkout-summary h1 { margin: 10px 0; font-size: clamp(2rem, 4vw, 4rem); line-height: 1; }
.amount-display { margin: 24px 0; padding: 18px; border-radius: var(--r-sm); background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.12); }
.amount-display span { display: block; color: rgba(255,255,255,.68); font-size: .82rem; font-weight: 800; }
.amount-display strong, .amount-value { display: block; color: #fff; font-size: clamp(2.2rem, 5vw, 4rem); line-height: 1; font-weight: 950; margin-top: 6px; }
.checkout-steps { padding: 0; margin: 0; list-style: none; display: grid; gap: 10px; }
.checkout-steps li { display: flex; gap: 10px; align-items: center; color: rgba(255,255,255,.8); }
.checkout-steps span { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: #fff; color: var(--ink); font-weight: 900; flex: 0 0 auto; }
.checkout-panel { padding: clamp(20px, 3vw, 34px); }
.qr-section, .upload-section, .submitted-box { padding-bottom: 24px; margin-bottom: 24px; border-bottom: 1px solid var(--line); }
.qr-tabs { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 14px 0; }
.qr-tab { min-height: 42px; border-radius: var(--r-sm); border: 1px solid var(--line); background: #fff; cursor: pointer; font-weight: 850; }
.qr-tab.active { background: var(--ink); color: #fff; border-color: var(--ink); }
.qr-frame { display: grid; place-items: center; min-height: 270px; border: 1px solid var(--line); border-radius: var(--r-sm); background: linear-gradient(180deg, #fff, #F7F4EF); }
.qr-img { display: none; width: min(240px, 72vw); aspect-ratio: 1; object-fit: contain; border-radius: var(--r-sm); }
.qr-img.active { display: block; }
.upload-placeholder { width: 100%; min-height: 124px; border: 1.5px dashed var(--muted-2); border-radius: var(--r-sm); background: #fff; color: var(--ink); cursor: pointer; display: grid; place-items: center; gap: 2px; }
.upload-placeholder span { font-weight: 900; }
.upload-placeholder small { color: var(--muted); }
.upload-preview { width: 100%; max-height: 360px; object-fit: contain; border: 1px solid var(--line); border-radius: var(--r-sm); background: #fff; margin: 12px 0; }
.upload-msg { color: var(--danger); text-align: center; min-height: 1.4em; }
.order-number { color: var(--muted); word-break: break-all; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; }
.status-block { padding: 24px 0; }
.status-block h2 { margin: 0 0 8px; font-size: 1.5rem; }
.status-block p { color: var(--muted); }
.spinner { width: 42px; height: 42px; border: 3px solid var(--line); border-top-color: var(--accent); border-radius: 50%; margin-bottom: 18px; animation: spin .85s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }
.code-reveal { margin: 18px 0; padding: 16px; border-radius: var(--r-sm); background: var(--teal-soft); border: 1px solid rgba(15,94,87,.18); }
.code-reveal span { color: var(--muted); font-weight: 800; font-size: .8rem; }
.code-box { display: flex; gap: 10px; align-items: center; margin: 8px 0; }
.code-box strong { font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 1.15rem; word-break: break-all; }
.btn-copy { border: 1px solid var(--line); background: #fff; border-radius: var(--r-sm); padding: 7px 10px; cursor: pointer; font-weight: 800; }

/* Chat */
.chat-app { height: 100vh; max-width: 980px; margin: 0 auto; display: grid; grid-template-rows: auto 1fr auto; background: var(--panel); border-left: 1px solid var(--line); border-right: 1px solid var(--line); }
.chat-header { display: flex; justify-content: space-between; gap: 18px; align-items: center; padding: 18px 20px; background: var(--ink); color: #fff; }
.chat-header h1 { margin: 4px 0; font-size: 1.18rem; }
.chat-header p { margin: 0; color: rgba(255,255,255,.68); font-size: .86rem; }
.chat-header .text-link { color: #fff; }
.quota-badge { white-space: nowrap; border: 1px solid rgba(255,255,255,.22); border-radius: var(--r-sm); padding: 9px 12px; font-weight: 800; }
.quota-badge.low { background: var(--accent); border-color: var(--accent); }
.messages-container { overflow-y: auto; padding: 20px; background: var(--paper); display: flex; flex-direction: column; gap: 14px; }
.message { display: flex; gap: 10px; max-width: 86%; }
.message.user { align-self: flex-end; flex-direction: row-reverse; }
.message.assistant { align-self: flex-start; }
.avatar { width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; background: #fff; border: 1px solid var(--line); font-size: .78rem; font-weight: 900; flex: 0 0 auto; }
.bubble { padding: 12px 14px; border-radius: var(--r-md); background: #fff; border: 1px solid var(--line); color: var(--ink-2); white-space: pre-wrap; word-break: break-word; }
.message.user .bubble { background: var(--ink); color: #fff; border-color: var(--ink); }
.starter-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-top: 12px; }
.starter-grid button { min-height: 42px; border-radius: var(--r-sm); border: 1px solid var(--line); background: var(--paper); cursor: pointer; font-weight: 800; color: var(--ink); }
.input-area { padding: 12px 16px; border-top: 1px solid var(--line); background: #fff; }
.input-row { display: flex; align-items: flex-end; gap: 10px; }
.input-row textarea { min-height: 46px; max-height: 128px; resize: none; background: var(--paper); }
.send-btn { min-height: 46px; border: 0; border-radius: var(--r-sm); background: var(--accent); color: #fff; padding: 0 18px; cursor: pointer; font-weight: 900; }
.input-hint { margin: 7px 0 0; text-align: center; color: var(--muted); font-size: .78rem; }

/* Blog */
.blog-page, .blog-post-page { max-width: 920px; margin: 0 auto; padding: 32px 20px 60px; }
.blog-hero { padding: 42px 0 26px; border-bottom: 1px solid var(--line); margin-bottom: 18px; }
.blog-hero h1, .article-header h1 { margin: 0; font-size: clamp(2rem, 5vw, 4.2rem); line-height: 1; letter-spacing: 0; }
.blog-hero p, .article-summary { color: var(--muted); max-width: 680px; }
.blog-list { display: grid; gap: 12px; }
.blog-card { padding: 18px; display: grid; grid-template-columns: 1fr auto; gap: 18px; align-items: center; }
.blog-card h2 { margin: 4px 0 8px; font-size: 1.25rem; }
.blog-card h2 a { text-decoration: none; }
.blog-card p { margin: 0; color: var(--muted); }
.blog-card time, .blog-article time { color: var(--accent); font-size: .8rem; font-weight: 850; }

/* front-v3 buyer-facing visibility pass */
.front-v3 { --front-blue: #12324F; --front-gold: #C9A35B; --front-mint: #E7F1EE; }
.front-version-pill {
    width: fit-content;
    margin: 0 0 14px;
    padding: 6px 10px;
    border-radius: 999px;
    background: rgba(201,163,91,.16);
    color: #F4D28C;
    border: 1px solid rgba(244,210,140,.24);
    font-size: .76rem;
    font-weight: 900;
}
.front-hero-v3 { position: relative; padding-top: 28px; }
.front-hero-v3::before {
    content: "";
    position: absolute;
    inset: 0 0 auto;
    height: 14px;
    border-radius: 999px;
    background: linear-gradient(90deg, var(--accent), var(--front-gold), var(--accent-2));
}
.front-hero-v3 .hero-composed-copy {
    background: linear-gradient(135deg, rgba(18,50,79,.96), rgba(23,23,23,.98)), var(--ink);
}
.front-hero-v3 .hero-composed-copy h1 {
    max-width: 760px;
    font-size: clamp(3rem, 6.2vw, 6.9rem);
}
.front-trust-row { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 22px; }
.front-trust-row span {
    min-height: 34px;
    display: inline-flex;
    align-items: center;
    padding: 0 12px;
    border-radius: 999px;
    background: rgba(255,255,255,.08);
    border: 1px solid rgba(255,255,255,.16);
    color: rgba(255,255,255,.86);
    font-weight: 850;
    font-size: .82rem;
}
.front-framework-strip {
    margin-top: 14px;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
}
.front-framework-strip article {
    min-height: 118px;
    display: grid;
    align-content: space-between;
    padding: 16px;
    border-radius: var(--r-md);
    border: 1px solid var(--line);
    background: #fff;
    box-shadow: var(--shadow-sm);
}
.front-framework-strip span { color: var(--accent); font-weight: 950; font-size: .76rem; }
.front-framework-strip strong { display: block; font-size: 1.08rem; }
.front-framework-strip small { color: var(--muted); line-height: 1.5; }
.checkout-v3 .checkout-summary,
.status-v3 .status-card,
.redeem-v3 .auth-card { border-top: 6px solid var(--front-gold); }
.checkout-v3 .front-version-pill,
.status-v3 .front-version-pill,
.redeem-v3 .front-version-pill,
.chat-v3 .front-version-pill {
    color: var(--front-blue);
    background: rgba(201,163,91,.16);
    border-color: rgba(201,163,91,.28);
}
.front-mini-proof,
.front-pay-alert,
.front-login-benefits,
.status-timeline-v3 {
    border: 1px solid var(--line);
    border-radius: var(--r-md);
    background: var(--paper);
}
.front-mini-proof { margin-top: 18px; padding: 14px; }
.front-mini-proof strong { display: block; margin-bottom: 4px; }
.front-mini-proof p { margin: 0; color: rgba(255,255,255,.76); }
.front-pay-alert {
    margin: 12px 0;
    padding: 12px 14px;
    color: var(--accent);
    font-weight: 850;
    background: var(--accent-soft);
}
.status-timeline-v3 {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 6px;
    padding: 8px;
    margin: 18px 0;
}
.status-timeline-v3 span {
    min-height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--r-sm);
    color: var(--muted);
    font-size: .78rem;
    font-weight: 850;
    background: #fff;
}
.status-timeline-v3 span.is-active { background: var(--ink); color: #fff; }
.front-login-benefits {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    padding: 8px;
    margin: 18px 0 6px;
}
.front-login-benefits span {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    border-radius: var(--r-sm);
    background: #fff;
    font-weight: 850;
    font-size: .8rem;
}
.chat-v3 {
    max-width: 1160px;
    grid-template-rows: auto auto 1fr auto;
    border: 1px solid var(--line);
    box-shadow: var(--shadow);
}
.chat-v3 .chat-header {
    background: linear-gradient(135deg, rgba(18,50,79,.96), rgba(23,23,23,.98)), var(--ink);
    color: #fff;
}
.chat-v3 .chat-header p { color: rgba(255,255,255,.76); }
.chat-v3 .text-link { color: #fff; border-color: rgba(255,255,255,.55); }
.chat-v3 .quota-badge { background: rgba(255,255,255,.1); color: #fff; border: 1px solid rgba(255,255,255,.18); }
.chat-framework-bar {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 1px;
    background: var(--line);
    border-bottom: 1px solid var(--line);
}
.chat-framework-bar span {
    min-height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #fff;
    color: var(--ink-2);
    font-size: .82rem;
    font-weight: 850;
}
.read-more { text-decoration: none; font-weight: 900; color: var(--accent); white-space: nowrap; }
.empty-state { padding: 26px; border: 1px solid var(--line); border-radius: var(--r-sm); background: #fff; color: var(--muted); }
.blog-pagination { display: flex; justify-content: center; gap: 14px; margin: 22px 0; }
.blog-article { padding: clamp(24px, 5vw, 58px); }
.article-header { border-bottom: 1px solid var(--line); padding-bottom: 22px; margin-bottom: 24px; }
.blog-content { color: var(--ink-2); font-size: 1.02rem; line-height: 1.86; }
.blog-content h2 { margin-top: 32px; font-size: 1.5rem; line-height: 1.2; }
.blog-content h3 { margin-top: 24px; font-size: 1.2rem; }
.blog-content p { margin: 0 0 16px; }
.blog-content ul, .blog-content ol { padding-left: 22px; }
.post-nav { display: flex; gap: 12px; justify-content: space-between; border-top: 1px solid var(--line); margin-top: 28px; padding-top: 18px; }
.post-nav a { color: var(--ink); font-weight: 850; text-decoration: none; }

/* Admin and utility pages */
.page-center { min-height: 100vh; display: grid; place-items: center; padding: 22px; }
.admin-page { max-width: 1320px; margin: 0 auto; padding: 20px; }
.admin-header { display: flex; justify-content: space-between; align-items: center; background: var(--ink); color: #fff; border-radius: var(--r-md); padding: 18px; margin-bottom: 16px; }
.admin-header h1 { margin: 0; font-size: 1.15rem; }
.admin-shell { display: grid; grid-template-columns: 230px minmax(0, 1fr); gap: 16px; align-items: start; max-width: 100%; min-width: 0; }
.admin-main { min-width: 0; max-width: 100%; display: grid; gap: 16px; }
.admin-panel { display: none; min-width: 0; max-width: 100%; overflow: hidden; }
.admin-panel.is-active { display: block; }
.admin-panel__header { display: flex; justify-content: space-between; align-items: start; gap: 16px; margin-bottom: 16px; }
.admin-panel__header--toolbar { align-items: end; }
.admin-panel__header h2 { margin: 0; font-size: 1.55rem; line-height: 1.1; }
.admin-panel__header p:not(.eyebrow) { margin: 6px 0 0; color: var(--muted); }
.admin-toolbar { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; justify-content: flex-end; }
.admin-blog-editor {
    display: grid;
    gap: 14px;
    padding: 16px;
    border: 1px solid var(--line);
    border-radius: var(--r-md);
    background: linear-gradient(180deg, #fff, var(--paper));
}
.admin-blog-editor__head,
.admin-blog-editor__footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 14px;
}
.admin-blog-editor__head strong { display: block; font-size: 1rem; }
.admin-blog-editor__head p { margin: 4px 0 0; color: var(--muted); font-size: .86rem; }
.admin-blog-editor textarea { width: 100%; min-height: 220px; font-family: ui-monospace, SFMono-Regular, Consolas, "Liberation Mono", monospace; line-height: 1.7; }
.admin-checkbox { display: inline-flex; align-items: center; gap: 8px; color: var(--ink); font-weight: 800; }
.admin-sidebar { position: sticky; top: 14px; min-width: 0; max-width: 100%; }
.admin-sidebar__nav button {
    min-height: 38px;
    border: 0;
    border-radius: var(--r-sm);
    background: transparent;
    color: var(--muted);
    text-align: left;
    padding: 0 10px;
    font-weight: 800;
    cursor: pointer;
}
.admin-sidebar__nav button:hover, .admin-sidebar__nav button.is-active { background: var(--accent-soft); color: var(--ink); }
.admin-quick-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 14px; }
.admin-risk-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.admin-risk-grid article { border: 1px solid var(--line); border-radius: var(--r-sm); padding: 14px; background: var(--paper); }
.admin-risk-grid strong { display: block; margin-bottom: 6px; }
.admin-risk-grid p { margin: 0; color: var(--muted); }
.stats-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(120px,1fr)); gap: 10px; }
.stat-item { padding: 14px; border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--paper); }
.stat-item strong { display: block; font-size: 1.35rem; }
.form-row { display: flex; flex-wrap: wrap; gap: 12px; }
.field { flex: 1; min-width: 140px; }
.admin-inline-note { margin-bottom: 12px; color: var(--muted); font-size: .84rem; }
.admin-desktop-table { display: block; }
.admin-mobile-list { display: none; }
.admin-mobile-card {
    display: grid;
    gap: 12px;
    padding: 14px;
    border: 1px solid var(--line);
    border-radius: var(--r-sm);
    background: #fff;
    box-shadow: 0 10px 28px rgba(15,23,42,.05);
}
.admin-mobile-card__top { display: flex; justify-content: space-between; gap: 12px; align-items: flex-start; }
.admin-mobile-card__title-wrap { min-width: 0; display: grid; gap: 4px; }
.admin-mobile-card__eyebrow { color: var(--muted); font-size: .72rem; font-weight: 900; letter-spacing: .06em; text-transform: uppercase; }
.admin-mobile-card__title { min-width: 0; font-size: .98rem; font-weight: 850; line-height: 1.3; word-break: break-word; }
.admin-mobile-card__title code { white-space: pre-wrap; word-break: break-all; }
.admin-mobile-card__badge { flex: 0 0 auto; }
.admin-mobile-card__amount { font-size: 1.55rem; font-weight: 950; line-height: 1; }
.admin-mobile-card__summary { margin: 0; color: var(--ink-2); line-height: 1.55; }
.admin-mobile-card__meta { display: flex; flex-wrap: wrap; gap: 8px; }
.admin-meta-pill {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 30px;
    padding: 0 10px;
    border-radius: 999px;
    background: var(--paper);
    color: var(--muted);
    font-size: .77rem;
}
.admin-meta-pill strong { color: var(--ink); font-size: .73rem; }
.admin-meta-pill.is-success { background: var(--teal-soft); color: var(--success); }
.admin-meta-pill.is-warning { background: rgba(217,119,6,.12); color: #92400E; }
.admin-mobile-card__grid { display: grid; gap: 10px; }
.admin-mobile-card__grid--three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.admin-mobile-card__grid > div {
    padding: 11px;
    border-radius: var(--r-sm);
    background: var(--paper);
    display: grid;
    gap: 4px;
}
.admin-mobile-card__grid > div span { color: var(--muted); font-size: .74rem; }
.admin-mobile-card__grid > div strong { font-size: 1.05rem; line-height: 1.1; }
.admin-mobile-card__actions { display: flex; flex-wrap: wrap; gap: 8px; }
.admin-mobile-card__notice {
    padding: 10px 12px;
    border-radius: var(--r-sm);
    font-size: .82rem;
    line-height: 1.5;
    background: var(--paper);
}
.admin-mobile-card__notice--danger { background: rgba(185,28,28,.08); color: #991B1B; }
.admin-progress {
    height: 8px;
    border-radius: 999px;
    background: var(--paper);
    overflow: hidden;
}
.admin-progress span { display: block; height: 100%; border-radius: inherit; background: var(--ink); }
.admin-inline-editor { border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--paper); }
.admin-table-actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.admin-table-actions input { width: 160px; min-height: 36px; }
.admin-inline-editor summary {
    padding: 10px 12px;
    cursor: pointer;
    font-weight: 800;
    color: var(--ink);
}
.admin-inline-editor input {
    width: calc(100% - 24px);
    margin: 0 12px 12px;
}
.text-link { color: var(--ink); font-weight: 800; text-decoration: none; }
.text-link:hover { text-decoration: underline; }
.admin-muted { color: var(--muted); }
.table-wrapper, #orders-table, #blog-table, #codes-table { overflow-x: auto; max-width: 100%; -webkit-overflow-scrolling: touch; }
#orders-table table, #codes-table table, #blog-table table { min-width: 760px; }
.admin-orders-table { min-width: 940px; table-layout: fixed; }
.admin-orders-table th:nth-child(1), .admin-orders-table td:nth-child(1) { width: 26%; }
.admin-orders-table th:nth-child(2), .admin-orders-table td:nth-child(2) { width: 8%; }
.admin-orders-table th:nth-child(3), .admin-orders-table td:nth-child(3) { width: 8%; }
.admin-orders-table th:nth-child(4), .admin-orders-table td:nth-child(4) { width: 12%; }
.admin-orders-table th:nth-child(5), .admin-orders-table td:nth-child(5) { width: 9%; }
.admin-orders-table th:nth-child(6), .admin-orders-table td:nth-child(6) { width: 11%; }
.admin-orders-table th:nth-child(7), .admin-orders-table td:nth-child(7) { width: 26%; }
.admin-orders-table td { vertical-align: middle; }
.admin-orders-table td code { white-space: normal; word-break: break-all; }
table { width: 100%; border-collapse: collapse; font-size: .86rem; }
th, td { padding: 9px 10px; border-bottom: 1px solid var(--line); text-align: left; }
th { background: var(--paper); color: var(--ink); font-size: .76rem; text-transform: uppercase; }
td code { background: var(--paper); padding: 3px 6px; border-radius: 4px; }
.badge { padding: 3px 8px; border-radius: 999px; font-size: .72rem; font-weight: 850; }
.badge-active { background: var(--teal-soft); color: var(--success); }
.badge-inactive { background: var(--line); color: var(--muted); }
.badge-warning { background: rgba(217,119,6,.12); color: #92400E; }
.badge-danger { background: rgba(185,28,28,.1); color: #991B1B; }
.tab-row { display: flex; flex-wrap: wrap; gap: 8px; }
.tab-btn, .btn-sm { border: 1px solid var(--line); background: #fff; border-radius: var(--r-sm); padding: 7px 10px; cursor: pointer; font-weight: 800; }
.tab-btn.active, .btn-green { background: var(--ink); color: #fff; border-color: var(--ink); }
.btn-red { background: var(--accent); color: #fff; border-color: var(--accent); }
.result-area { margin-top: 10px; padding: 12px; background: var(--paper); border: 1px solid var(--line); border-radius: var(--r-sm); }
.success { color: var(--success); font-weight: 850; }
.reply-card { max-width: 460px; padding: 26px; }
.msg-bubble { background: var(--paper); border: 1px solid var(--line); border-radius: var(--r-sm); padding: 12px; }

/* Support widget */
#support-widget { position: fixed; right: 18px; bottom: 18px; z-index: 9999; }
#support-toggle { width: 52px; height: 52px; border-radius: 50%; border: 1px solid rgba(255,255,255,.18); background: var(--ink); color: #fff; cursor: pointer; box-shadow: var(--shadow); font-size: 0; }
#support-toggle::before { content: "客服"; font-size: .82rem; font-weight: 900; }
#support-panel { position: fixed; right: 18px; bottom: 82px; width: min(340px, calc(100vw - 36px)); height: 420px; max-height: 62vh; background: #fff; border: 1px solid var(--line); border-radius: var(--r-md); box-shadow: var(--shadow); display: flex; flex-direction: column; overflow: hidden; }
.support-header { background: var(--ink); color: #fff; padding: 12px 14px; display: flex; justify-content: space-between; align-items: center; font-weight: 850; }
.support-messages { flex: 1; overflow-y: auto; padding: 12px; background: var(--paper); display: flex; flex-direction: column; gap: 8px; }
.support-msg { max-width: 86%; }
.support-msg.buyer { align-self: flex-end; }
.support-msg.seller { align-self: flex-start; }
.bubble-text { padding: 9px 12px; border-radius: var(--r-sm); background: #fff; border: 1px solid var(--line); font-size: .86rem; }
.support-msg.buyer .bubble-text { background: var(--ink); color: #fff; border-color: var(--ink); }
.support-input-row { display: flex; gap: 8px; padding: 10px; border-top: 1px solid var(--line); }
.support-input-row input { min-height: 40px; background: var(--paper); }
.support-input-row button { border: 0; border-radius: var(--r-sm); background: var(--accent); color: #fff; padding: 0 14px; cursor: pointer; font-weight: 850; }

/* Subpages */
.subpage { max-width: 1160px; }
.sub-hero {
    min-height: 440px;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding: clamp(34px, 6vw, 74px);
    border-radius: var(--r-md);
    background: var(--ink);
    color: #fff;
    margin-bottom: 18px;
}
.sub-hero h1 { margin: 0; max-width: 920px; font-size: clamp(2.4rem, 5.5vw, 5.4rem); line-height: .94; letter-spacing: 0; }
.sub-hero p:not(.eyebrow) { max-width: 760px; margin: 18px 0 0; color: rgba(255,255,255,.74); font-size: 1.03rem; }
.sub-hero .eyebrow { color: #E7B8AD; }
.method-river {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0;
    padding: 0;
    overflow: hidden;
}
.river-step { padding: 26px; border-right: 1px solid var(--line); min-height: 320px; display: flex; flex-direction: column; justify-content: space-between; }
.river-step:last-child { border-right: 0; }
.river-step span, .proof-grid span, .timeline-panel span { color: var(--accent); font-size: .78rem; font-weight: 950; letter-spacing: .08em; }
.river-step h2 { margin: 24px 0 10px; font-size: clamp(1.35rem, 2.5vw, 2.1rem); line-height: 1.05; }
.river-step p { margin: 0; color: var(--muted); }
.contrast-panel { display: grid; grid-template-columns: .7fr 1.3fr; gap: 24px; align-items: start; }
.comparison-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.comparison-grid article { border: 1px solid var(--line); border-radius: var(--r-md); padding: 22px; background: #fff; }
.comparison-grid article.featured { background: var(--teal-soft); border-color: rgba(15,94,87,.24); }
.comparison-grid h3 { margin: 0 0 14px; font-size: 1.2rem; }
.comparison-grid ul { margin: 0; padding-left: 18px; color: var(--ink-2); }
.comparison-grid li + li { margin-top: 8px; }
.compliance-deep { background: var(--accent-soft); }
.compliance-deep h2 { margin: 0; font-size: clamp(1.8rem, 4vw, 3.3rem); line-height: 1.02; }
.compliance-deep p { max-width: 760px; color: var(--muted); }
.case-lab { padding: 0; overflow: hidden; }
.case-tabs { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; border-bottom: 1px solid var(--line); }
.case-tab { min-height: 58px; border: 0; border-right: 1px solid var(--line); background: #fff; color: var(--muted); cursor: pointer; font-weight: 900; }
.case-tab:last-child { border-right: 0; }
.case-tab.is-active { background: var(--ink); color: #fff; }
.case-stage { display: grid; grid-template-columns: .78fr 1.22fr; min-height: 470px; }
.case-brief, .case-output { padding: clamp(22px, 4vw, 42px); }
.case-brief { background: var(--paper); border-right: 1px solid var(--line); display: flex; flex-direction: column; justify-content: center; }
.case-brief h2 { margin: 0; font-size: clamp(1.8rem, 4vw, 3.3rem); line-height: 1.02; }
.case-brief p:not(.eyebrow) { color: var(--muted); }
.case-output { background: #fff; }
.case-output h3 { margin: 0 0 8px; color: var(--ink); }
.case-output p { margin: 0 0 22px; color: var(--muted); line-height: 1.8; }
.proof-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.proof-grid article { border: 1px solid var(--line); border-radius: var(--r-md); background: #fff; padding: 22px; }
.proof-grid h3 { margin: 12px 0 8px; font-size: 1.15rem; }
.proof-grid p { margin: 0; color: var(--muted); }
.guide-hero { background: linear-gradient(135deg, var(--ink) 0%, #2A1D1A 100%); }
.timeline-panel { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 0; padding: 0; overflow: hidden; }
.timeline-panel article { min-height: 280px; padding: 22px; border-right: 1px solid var(--line); background: #fff; display: flex; flex-direction: column; justify-content: space-between; }
.timeline-panel article:last-child { border-right: 0; }
.timeline-panel h2 { margin: 20px 0 8px; line-height: 1.05; font-size: 1.35rem; }
.timeline-panel p { margin: 0; color: var(--muted); font-size: .92rem; }
.guide-faq { background: #fff; }

@media (max-width: 900px) {
    .site-header { grid-template-columns: 1fr auto; width: min(calc(100% - 20px), var(--max)); top: 8px; }
    .site-header__menu { display: block; grid-column: 2; grid-row: 1; }
    .site-header__nav {
        grid-column: 1 / -1;
        justify-self: stretch;
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
        padding-top: 8px;
    }
    .site-header__actions { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr 1fr; width: 100%; }
    .site-footer { grid-template-columns: 1fr; padding: 22px; }
    .site-footer__links { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .site-sidebar, .admin-sidebar { position: static; }
    .admin-shell { grid-template-columns: minmax(0, 1fr); width: 100%; max-width: 100%; min-width: 0; }
    .admin-main, .admin-panel, .admin-panel.is-active { width: 100%; max-width: 100%; min-width: 0; }
    .admin-sidebar { width: 100%; max-width: 100%; min-width: 0; overflow: hidden; }
    .admin-sidebar__nav { display: flex; gap: 8px; overflow-x: auto; padding-bottom: 3px; }
    .admin-sidebar__nav button { flex: 0 0 auto; white-space: nowrap; text-align: center; border: 1px solid transparent; }
    .admin-risk-grid { grid-template-columns: 1fr; }
    .table-wrapper, #orders-table, #codes-table, #blog-table { width: 100%; max-width: 100%; overflow-x: auto; }
    .ui-search { grid-template-columns: 1fr; }
    .site-page { padding: 14px; }
    .hero-shell, .split-panel, .prompt-panel, .checkout-shell { grid-template-columns: 1fr; min-height: 0; }
    .hero-visual img { min-height: 380px; }
    .studio-strip, .products-grid { grid-template-columns: 1fr 1fr; }
    .framework-grid, .value-grid { grid-template-columns: 1fr; }
    .starter-grid { grid-template-columns: 1fr; }
    .floating-nav { grid-template-columns: 1fr auto; }
    .nav-links { order: 3; grid-column: 1 / -1; justify-self: stretch; overflow-x: auto; justify-content: space-between; }
    .hero-composed-grid, .curated-index, .home-bottom-grid, .contrast-panel, .case-stage { grid-template-columns: 1fr; }
    .hero-composed { min-height: 0; padding-top: 10px; }
    .hero-composed-copy, .hero-editorial-card, .hero-editorial-card img { min-height: 420px; }
    .confluence-stage { grid-template-columns: 1fr 1fr; grid-template-rows: auto; min-height: 0; }
    .signal-card[data-signal], .decision-hub { grid-column: auto; grid-row: auto; }
    .confluence-canvas { display: none; }
    .index-tile.large { min-height: 320px; grid-row: auto; }
    .method-river, .timeline-panel { grid-template-columns: 1fr 1fr; }
    .river-step, .timeline-panel article { border-right: 0; border-bottom: 1px solid var(--line); }
    .comparison-grid, .proof-grid { grid-template-columns: 1fr; }
    .case-brief { border-right: 0; border-bottom: 1px solid var(--line); }
    .prompt-marquee { grid-template-columns: 1fr; }
    .front-framework-strip { grid-template-columns: 1fr 1fr; }
    .chat-framework-bar { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 560px) {
    .site-header { gap: 10px; padding: 8px; }
    .site-header__tagline { display: none; }
    .site-header__nav { grid-template-columns: 1fr; }
    .site-header__actions { grid-template-columns: 1fr; }
    .site-footer__links { grid-template-columns: 1fr 1fr; }
    .ui-card { padding: 18px; }
    .admin-page { width: 100%; max-width: 100%; padding: 12px; overflow-x: hidden; }
    .admin-header { align-items: flex-start; flex-direction: column; }
    .admin-panel__header { display: block; }
    .admin-toolbar { justify-content: flex-start; margin-top: 10px; }
    .admin-blog-editor { padding: 14px; }
    .admin-blog-editor__head,
    .admin-blog-editor__footer { align-items: flex-start; flex-direction: column; }
    .admin-blog-editor__footer .admin-toolbar { width: 100%; display: grid; grid-template-columns: 1fr 1fr; }
    .admin-quick-actions { display: grid; }
    .admin-desktop-table { display: none; }
    .admin-mobile-list { display: grid; gap: 12px; }
    .admin-mobile-card__grid--three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .admin-mobile-card__actions .btn-sm,
    .admin-mobile-card__actions a.btn-sm { min-height: 38px; min-width: 56px; display: inline-flex; align-items: center; justify-content: center; text-decoration: none; }
    .hero-copy { padding: 28px 20px; }
    .hero-copy h1 { font-size: 2.25rem; }
    .hero-actions, .input-group, .code-box, .chat-header, .input-row { flex-direction: column; align-items: stretch; }
    .studio-strip, .products-grid { grid-template-columns: 1fr; }
    .checkout-page, .auth-page, .status-page { padding: 12px; }
    .checkout-summary, .checkout-panel, .auth-card, .status-card { padding: 20px; }
    .amount-display strong, .amount-value { font-size: 2.45rem; }
    .chat-app { height: 100dvh; border: 0; }
    .message { max-width: 96%; }
    .blog-card { grid-template-columns: 1fr; }
    .post-nav { flex-direction: column; }
    .floating-nav { top: 8px; }
    .brand-mark { font-size: .95rem; }
    .nav-links a, .nav-cta { padding: 0 9px; font-size: .82rem; }
    .hero-kicker { flex-direction: column; }
    .hero-composed-copy h1, .sub-hero h1 { font-size: 2.35rem; }
    .hero-composed-copy, .hero-editorial-card, .hero-editorial-card img { min-height: 380px; }
    .confluence-stage { grid-template-columns: 1fr; }
    .method-river, .timeline-panel, .case-tabs { grid-template-columns: 1fr; }
    .case-tab { border-right: 0; border-bottom: 1px solid var(--line); }
    .sub-hero { min-height: 360px; padding: 28px 20px; }
    .front-framework-strip,
    .front-login-benefits,
    .status-timeline-v3 { grid-template-columns: 1fr; }
    .front-hero-v3 .hero-composed-copy h1 { font-size: 2.45rem; }
    .front-trust-row span { width: calc(50% - 4px); justify-content: center; }
    .chat-framework-bar { grid-template-columns: 1fr; }
}

/* front-v4 final override layer: keep this after legacy front-v3 rules */
.front-v4 {
    background: linear-gradient(180deg, #fff 0%, #F5F7F8 54%, #fff 100%);
    color: #202124;
    font-family: ui-sans-serif, -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
    font-variant-numeric: tabular-nums;
}
.front-v4 .front-version-pill { display: none; }
.front-v4 .eyebrow,
.front-v4 .v4-kicker {
    color: #1A73E8;
    letter-spacing: 0;
    text-transform: none;
    font-weight: 760;
}
.front-v4 .btn-primary,
.front-v4 .btn-secondary,
.front-v4 .input-group button,
.front-v4 .send-btn {
    border-radius: 999px;
    min-height: 46px;
    font-weight: 760;
}
.front-v4 .btn-primary,
.front-v4 .input-group button,
.front-v4 .send-btn {
    background: #1A73E8;
    color: #fff;
    box-shadow: 0 10px 24px rgba(26,115,232,.18);
}
.front-v4 .btn-primary:hover,
.front-v4 .input-group button:hover,
.front-v4 .send-btn:hover { background: #1558B0; }
.front-v4 .btn-secondary {
    background: #fff;
    color: #202124;
    border-color: #DADDE1;
}
.site-header {
    border-radius: 999px;
    border-color: rgba(218,221,225,.78);
    background: rgba(255,255,255,.86);
    backdrop-filter: blur(20px);
    box-shadow: 0 14px 44px rgba(60,64,67,.08);
}
.site-header__cta { background: #111; color: #fff; }
.site-header__nav a:hover,
.site-header__nav a[aria-current="page"] {
    background: #F1F3F4;
    color: #111;
}
.front-v4 .v4-hero,
.front-v4 .v4-strip,
.front-v4 .v4-method,
.front-v4 .v4-products,
.front-v4 .v4-content-grid,
.front-v4 .premium-compliance {
    width: min(100%, 1240px);
    margin-left: auto;
    margin-right: auto;
}
.front-v4 .v4-hero {
    padding: clamp(44px, 7vw, 92px) 0 34px;
    display: grid;
    grid-template-columns: minmax(0, .92fr) minmax(360px, 1.08fr);
    gap: clamp(24px, 5vw, 68px);
    align-items: center;
}
.front-v4 .v4-hero__copy h1 {
    margin: 0;
    color: #111;
    font-size: clamp(3rem, 5.2vw, 5.6rem);
    line-height: .96;
    font-weight: 820;
    letter-spacing: 0;
    text-wrap: balance;
}
.front-v4 .v4-hero__copy h1 span { display: block; }
.front-v4 .v4-hero__lead {
    max-width: 540px;
    margin: 22px 0 0;
    color: #5F6368;
    font-size: clamp(1.04rem, 1.35vw, 1.22rem);
    line-height: 1.75;
}
.front-v4 .v4-actions,
.front-v4 .v4-boundary {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}
.front-v4 .v4-actions { margin-top: 30px; }
.front-v4 .v4-boundary { margin-top: 28px; }
.front-v4 .v4-boundary span {
    color: #5F6368;
    border: 1px solid #DADDE1;
    background: #fff;
    border-radius: 999px;
    padding: 8px 13px;
}
.front-v4 .v4-hero__media {
    position: relative;
    margin: 0;
    min-height: min(640px, 64vw);
    border-radius: 32px;
    overflow: hidden;
    background: #EEF2F6;
    box-shadow: 0 28px 80px rgba(60,64,67,.12);
}
.front-v4 .v4-hero__media img {
    width: 100%;
    height: 100%;
    min-height: 620px;
    object-fit: cover;
    filter: saturate(.92) contrast(1.02);
}
.front-v4 .v4-hero__media::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(255,255,255,0) 42%, rgba(17,17,17,.72) 100%);
}
.front-v4 .v4-hero__media figcaption {
    position: absolute;
    left: 24px;
    right: 24px;
    bottom: 22px;
    z-index: 1;
    color: #fff;
    display: grid;
    gap: 4px;
}
.front-v4 .v4-hero__media figcaption span { color: rgba(255,255,255,.78); }
.front-v4 .v4-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0;
    margin-bottom: clamp(34px, 5vw, 72px);
    border-top: 1px solid #DADDE1;
    border-bottom: 1px solid #DADDE1;
}
.front-v4 .v4-strip article {
    padding: 22px 20px;
    border-right: 1px solid #DADDE1;
    display: grid;
    gap: 5px;
}
.front-v4 .v4-strip article:last-child { border-right: 0; }
.front-v4 .v4-strip span,
.front-v4 .v4-section-title p,
.front-v4 .v4-index-card p { color: #5F6368; }
.front-v4 .v4-method,
.front-v4 .v4-products,
.front-v4 .v4-content-grid { margin-bottom: clamp(34px, 5vw, 72px); }
.front-v4 .v4-section-title {
    max-width: 800px;
    margin-bottom: 28px;
}
.front-v4 .v4-section-title.compact {
    max-width: none;
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 24px;
}
.front-v4 .v4-section-title h2 {
    margin: 0;
    color: #111;
    font-size: clamp(2rem, 4.6vw, 4.8rem);
    line-height: 1.02;
    font-weight: 800;
    letter-spacing: 0;
    text-wrap: balance;
}
.front-v4 .v4-flow {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}
.front-v4 .v4-flow article,
.front-v4 .v4-index-card,
.front-v4 .product-card {
    border: 1px solid #DADDE1;
    border-radius: 22px;
    background: #fff;
    box-shadow: none;
}
.front-v4 .v4-flow article {
    min-height: 210px;
    padding: 22px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.front-v4 .v4-flow span { color: #1A73E8; font-weight: 760; }
.front-v4 .v4-flow strong { color: #111; font-size: 1.32rem; }
.front-v4 .v4-flow small { color: #5F6368; line-height: 1.6; }
.front-v4 .product-card.is-recommended {
    border-color: rgba(26,115,232,.42);
    box-shadow: 0 18px 56px rgba(26,115,232,.13);
}
.front-v4 .product-badge {
    background: rgba(26,115,232,.1);
    color: #1A73E8;
    border-radius: 999px;
}
.front-v4 .product-price strong { color: #111; }
.front-v4 .v4-content-grid {
    display: grid;
    grid-template-columns: 1.2fr .8fr;
    gap: 12px;
}
.front-v4 .v4-index-card {
    min-height: 230px;
    padding: clamp(22px, 3vw, 34px);
    color: #202124;
    text-decoration: none;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.front-v4 .v4-index-card.is-large {
    min-height: 472px;
    grid-row: span 2;
    background: #111;
    color: #fff;
}
.front-v4 .v4-index-card span { color: #1A73E8; font-weight: 760; }
.front-v4 .v4-index-card.is-large span { color: #8AB4F8; }
.front-v4 .v4-index-card h2,
.front-v4 .v4-index-card h3 { margin: 0; line-height: 1.05; letter-spacing: 0; }
.front-v4 .v4-index-card h2 { font-size: clamp(2.2rem, 4.4vw, 4.8rem); }
.front-v4 .v4-index-card h3 { font-size: clamp(1.5rem, 2.3vw, 2.3rem); }
.front-v4 .v4-index-card.is-large p { color: rgba(255,255,255,.72); }
.front-v4 .premium-compliance {
    border: 1px solid #DADDE1;
    border-radius: 24px;
    background: #fff;
    box-shadow: none;
}
.checkout-v4 .checkout-summary,
.checkout-v4 .checkout-panel,
.status-v4 .status-card,
.redeem-v4 .auth-card {
    border-radius: 28px;
    border-color: #DADDE1;
    box-shadow: 0 28px 80px rgba(60,64,67,.12);
}
.checkout-v4 .checkout-summary,
.chat-v4 .chat-header {
    background: #111;
    color: #fff;
}
.checkout-v4 .qr-tab.active { background: #1A73E8; color: #fff; }
.checkout-v4 .front-pay-alert {
    border-radius: 12px;
    background: rgba(26,115,232,.08);
    color: #1558B0;
    border: 1px solid rgba(26,115,232,.16);
}
.redeem-v4 .front-login-benefits span,
.status-v4 .status-timeline-v3 span {
    border-radius: 999px;
    background: #F1F3F4;
    border-color: transparent;
    color: #202124;
}
.chat-v4 {
    background: #F5F7F8;
    border: 0;
    border-radius: 0;
    width: 100%;
    max-width: none;
    height: 100dvh;
    display: grid;
    grid-template-columns: minmax(260px, 340px) minmax(0, 1fr);
    grid-template-rows: auto 1fr auto;
}
.chat-v4 .chat-header {
    grid-column: 1 / -1;
    border: 0;
    border-radius: 0 0 28px 28px;
}
.chat-v4 .chat-framework-bar {
    grid-column: 1;
    grid-row: 2 / 4;
    align-self: stretch;
    margin: 18px 0 18px 18px;
    padding: 16px;
    border: 1px solid #DADDE1;
    border-radius: 24px;
    background: #fff;
    box-shadow: 0 10px 32px rgba(60,64,67,.08);
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.chat-v4 .chat-framework-bar span {
    background: #F5F7F8;
    color: #202124;
    border: 0;
    border-radius: 14px;
}
.chat-v4 .messages-container {
    grid-column: 2;
    padding: 24px clamp(16px, 3vw, 44px);
}
.chat-v4 .input-area {
    grid-column: 2;
    border: 0;
    background: rgba(245,247,248,.92);
    backdrop-filter: blur(18px);
}
.chat-v4 .input-row {
    background: #fff;
    border: 1px solid #DADDE1;
    border-radius: 24px;
    padding: 8px;
    box-shadow: 0 10px 32px rgba(60,64,67,.08);
}
.content-v4 .sub-hero,
.content-v4 .guide-hero {
    background: #111;
    border-radius: 28px;
}
.content-v4 .sub-hero .eyebrow,
.content-v4 .guide-hero .eyebrow { color: #8AB4F8; }
@media (max-width: 900px) {
    .front-v4 .v4-hero,
    .front-v4 .v4-content-grid,
    .chat-v4 { grid-template-columns: 1fr; }
    .front-v4 .v4-hero__media,
    .front-v4 .v4-hero__media img { min-height: 420px; }
    .front-v4 .v4-strip,
    .front-v4 .v4-flow,
    .redeem-v4 .front-login-benefits { grid-template-columns: 1fr 1fr; }
    .front-v4 .v4-section-title.compact { display: block; }
    .front-v4 .v4-index-card.is-large { min-height: 340px; grid-row: auto; }
    .chat-v4 { grid-template-rows: auto auto 1fr auto; }
    .chat-v4 .chat-framework-bar {
        grid-column: 1;
        grid-row: 2;
        margin: 14px 14px 0;
        display: grid;
        grid-template-columns: repeat(5, minmax(140px, 1fr));
        overflow-x: auto;
    }
    .chat-v4 .messages-container { grid-column: 1; grid-row: 3; }
    .chat-v4 .input-area { grid-column: 1; grid-row: 4; }
}
@media (min-width: 901px) {
    .front-v4 .v4-hero__copy h1 span { white-space: nowrap; }
}
@media (max-width: 560px) {
    .front-v4 .v4-hero__copy h1 { font-size: 2.72rem; line-height: 1; }
    .front-v4 .v4-actions { display: grid; grid-template-columns: 1fr; }
    .front-v4 .v4-strip,
    .front-v4 .v4-flow,
    .redeem-v4 .front-login-benefits { grid-template-columns: 1fr; }
    .front-v4 .v4-strip article { border-right: 0; border-bottom: 1px solid #DADDE1; }
    .front-v4 .v4-section-title h2 { font-size: 2.15rem; }
    .front-v4 .v4-hero__media,
    .front-v4 .v4-hero__media img { min-height: 340px; border-radius: 24px; }
    .chat-v4 .chat-framework-bar {
        grid-template-columns: repeat(5, minmax(120px, 1fr));
        margin: 10px 10px 0;
        padding: 10px;
        border-radius: 18px;
    }
}

/* front-v5 wildchina-education buyer-facing redesign */
:root {
    --wild-ink: #16231f;
    --wild-green: #174135;
    --wild-green-2: #244f42;
    --wild-terracotta: #d56f2a;
    --wild-terracotta-dark: #b75520;
    --wild-ivory: #fbf5eb;
    --wild-paper: #fffaf2;
    --wild-sand: #efe4d4;
    --wild-line: rgba(22, 35, 31, .16);
    --wild-muted: #6d756f;
    --wild-shadow: 0 26px 80px rgba(32, 28, 21, .14);
    --wild-serif: "Source Han Serif SC", "Noto Serif SC", "Songti SC", "SimSun", serif;
    --wild-sans: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
}

.front-v5 {
    color: var(--wild-ink);
    background: var(--wild-ivory);
    font-family: var(--wild-sans);
    letter-spacing: 0;
    overflow-x: clip;
}

.front-v5 *, .front-v5 *::before, .front-v5 *::after { box-sizing: border-box; }
.front-v5 a { color: inherit; text-decoration-thickness: 1px; text-underline-offset: 5px; }
.front-v5 .muted { color: var(--wild-muted); }
.front-v5 .wild-kicker,
.front-v5 .v4-kicker,
.front-v5 .eyebrow {
    margin: 0 0 14px;
    color: var(--wild-terracotta);
    font-size: .76rem;
    font-weight: 850;
    letter-spacing: .14em;
    text-transform: uppercase;
}
.front-v5 h1, .front-v5 h2, .front-v5 h3 { letter-spacing: -.02em; }
.front-v5 h1, .front-v5 h2 { font-family: var(--wild-serif); font-weight: 680; }

.front-v5 .btn-primary,
.front-v5 .btn-secondary,
.front-v5 .input-group button,
.front-v5 .send-btn {
    min-height: 48px;
    border-radius: 0;
    border: 1px solid transparent;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 13px 22px;
    font-weight: 800;
    cursor: pointer;
    transition: transform .22s ease, background .22s ease, border-color .22s ease, box-shadow .22s ease;
}
.front-v5 .btn-primary,
.front-v5 .input-group button,
.front-v5 .send-btn {
    background: var(--wild-green);
    color: #fff;
    box-shadow: 0 16px 34px rgba(23, 65, 53, .22);
}
.front-v5 .btn-primary:hover,
.front-v5 .input-group button:hover,
.front-v5 .send-btn:hover {
    background: var(--wild-terracotta);
    transform: translateY(-1px);
}
.front-v5 .btn-secondary {
    background: rgba(255, 250, 242, .9);
    color: var(--wild-ink);
    border-color: rgba(22, 35, 31, .22);
}
.front-v5 .btn-secondary:hover { border-color: var(--wild-green); transform: translateY(-1px); }
.front-v5 .block { width: 100%; }

.site-header {
    position: sticky;
    top: 0;
    z-index: 40;
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 18px clamp(20px, 5vw, 72px);
    background: rgba(251, 245, 235, .92);
    border-bottom: 1px solid rgba(22, 35, 31, .12);
    backdrop-filter: blur(18px);
}
.site-header__logo { color: var(--wild-green); font-family: var(--wild-serif); font-size: 1.25rem; letter-spacing: .08em; }
.site-header__tagline { color: var(--wild-muted); font-weight: 700; }
.site-header__nav a, .site-header__login, .site-header__cta { border-radius: 0; font-weight: 750; }
.site-header__nav a:hover, .site-header__nav a[aria-current="page"] { color: var(--wild-terracotta); background: rgba(213, 111, 42, .08); }
.site-header__login { background: transparent; border: 1px solid rgba(22,35,31,.2); color: var(--wild-ink); }
.site-header__cta { background: var(--wild-green); color: #fff; border: 1px solid var(--wild-green); }

.wild-hero {
    width: 100vw;
    min-height: calc(100vh - 78px);
    margin-left: calc(50% - 50vw);
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(420px, .95fr);
    align-items: stretch;
    background: var(--wild-terracotta);
    overflow: hidden;
}
.wild-hero__image {
    position: absolute;
    inset: 0 0 0 48%;
    opacity: .78;
    overflow: hidden;
}
.wild-hero__image::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    background: linear-gradient(90deg, var(--wild-terracotta) 0%, rgba(213,111,42,.82) 20%, rgba(23,65,53,.18) 72%);
}
.wild-hero__image img {
    width: 100%;
    height: 100%;
    min-height: 100%;
    object-fit: cover;
    filter: saturate(.92) contrast(1.03);
    transform: scale(1.03);
}
.wild-hero__content {
    position: relative;
    z-index: 2;
    padding: clamp(64px, 9vw, 132px) clamp(24px, 5vw, 76px) 120px;
    max-width: 780px;
    color: #fff;
}
.wild-hero__content .wild-kicker { color: rgba(255,255,255,.76); }
.wild-hero h1 {
    margin: 0;
    max-width: 760px;
    color: #fff;
    font-size: clamp(3.6rem, 7vw, 7.8rem);
    line-height: .94;
    letter-spacing: -.055em;
}
.wild-hero__lead {
    max-width: 640px;
    margin: 28px 0 0;
    color: rgba(255,255,255,.88);
    font-size: clamp(1.05rem, 1.4vw, 1.35rem);
    line-height: 1.72;
}
.wild-actions { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 34px; }
.wild-hero .btn-primary { background: #fff; color: var(--wild-ink); box-shadow: 0 16px 46px rgba(0,0,0,.16); }
.wild-hero .btn-secondary { background: rgba(255,255,255,.08); color: #fff; border-color: rgba(255,255,255,.38); }
.wild-boundary { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 28px; }
.wild-boundary span {
    border: 1px solid rgba(255,255,255,.26);
    padding: 9px 12px;
    color: rgba(255,255,255,.82);
    background: rgba(255,255,255,.08);
}
.wild-hero__tracks {
    position: relative;
    z-index: 3;
    align-self: stretch;
    grid-column: 2;
    display: grid;
    grid-template-columns: repeat(4, minmax(100px, 1fr));
    min-height: 100%;
}
.wild-hero__tracks a {
    min-height: 100%;
    padding: clamp(24px, 4vw, 54px) 18px;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    align-items: center;
    gap: 14px;
    color: #fff;
    text-decoration: none;
    border-left: 1px solid rgba(255,255,255,.28);
    background: rgba(22, 35, 31, .08);
    transition: background .24s ease, transform .24s ease;
}
.wild-hero__tracks a:hover { background: rgba(22,35,31,.24); transform: translateY(-3px); }
.wild-hero__tracks span { font-variant-numeric: tabular-nums; color: rgba(255,255,255,.62); }
.wild-hero__tracks strong {
    writing-mode: vertical-rl;
    text-orientation: mixed;
    font-size: clamp(2rem, 3.2vw, 4.2rem);
    line-height: .95;
    letter-spacing: -.02em;
}
.wild-hero__tracks small { color: rgba(255,255,255,.72); font-weight: 750; }

.wild-section-intro {
    max-width: none;
    padding: clamp(64px, 8vw, 110px) clamp(24px, 5vw, 76px) 36px;
}
.wild-section-intro h2, .wild-belief h2, .wild-journal h2 {
    margin: 0;
    max-width: 860px;
    color: var(--wild-ink);
    font-size: clamp(2.4rem, 4.8vw, 5.8rem);
    line-height: .98;
}
.wild-section-intro p, .wild-belief p, .wild-journal p {
    max-width: 760px;
    color: var(--wild-muted);
    font-size: 1.05rem;
    line-height: 1.75;
}
.wild-section-intro.wide { display: grid; grid-template-columns: minmax(0, .9fr) minmax(320px, .55fr); gap: 44px; align-items: end; }

.wild-finder { width: 100vw; margin-left: calc(50% - 50vw); background: var(--wild-ivory); }
.wild-finder__panel {
    margin: 0 clamp(24px, 5vw, 76px) clamp(72px, 8vw, 120px);
    display: grid;
    grid-template-columns: 310px 1fr;
    min-height: 540px;
    background: #fffaf2;
    border: 1px solid var(--wild-line);
    box-shadow: var(--wild-shadow);
}
.wild-filter { padding: 28px; border-right: 1px solid var(--wild-line); background: rgba(23,65,53,.04); display: flex; flex-direction: column; gap: 10px; }
.wild-filter button {
    width: 100%;
    border: 1px solid transparent;
    background: transparent;
    color: var(--wild-ink);
    text-align: left;
    padding: 15px 14px;
    font-weight: 850;
    cursor: pointer;
}
.wild-filter button.is-active, .wild-filter button:hover { border-color: rgba(213,111,42,.35); background: #fff; color: var(--wild-terracotta-dark); }
.wild-path-grid { display: grid; grid-template-columns: 1.2fr .8fr; grid-auto-rows: 1fr; gap: 1px; background: var(--wild-line); }
.wild-path-card {
    min-height: 250px;
    padding: clamp(24px, 3vw, 46px);
    background: #fffaf2;
    color: var(--wild-ink);
    text-decoration: none;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
}
.wild-path-card.is-featured { grid-row: span 2; background: var(--wild-green); color: #fff; }
.wild-path-card span { color: var(--wild-terracotta); font-weight: 850; }
.wild-path-card.is-featured span { color: rgba(255,255,255,.68); }
.wild-path-card h3 { margin: 18px 0 10px; font-size: clamp(1.55rem, 2.2vw, 2.8rem); line-height: 1.08; }
.wild-path-card p { margin: 0 0 22px; color: inherit; opacity: .76; line-height: 1.7; }
.wild-path-card a { font-weight: 850; color: inherit; }

.wild-belief {
    width: 100vw;
    margin-left: calc(50% - 50vw);
    display: grid;
    grid-template-columns: minmax(0, .95fr) minmax(380px, .65fr);
    gap: clamp(24px, 5vw, 76px);
    padding: clamp(76px, 9vw, 132px) clamp(24px, 5vw, 76px);
    background: var(--wild-green);
    color: #fff;
}
.wild-belief h2 { color: #fff; }
.wild-belief p { color: rgba(255,255,255,.76); }
.wild-belief .wild-kicker { color: #f3bb8e; }
.wild-proof-stack { display: grid; gap: 14px; align-content: center; }
.wild-proof-stack article { padding: 26px; border: 1px solid rgba(255,255,255,.18); background: rgba(255,255,255,.06); }
.wild-proof-stack strong { display: block; margin-bottom: 8px; font-size: 1.18rem; }
.wild-proof-stack span { color: rgba(255,255,255,.72); line-height: 1.65; }

.wild-programs { width: 100vw; margin-left: calc(50% - 50vw); background: #fffaf2; padding-bottom: clamp(70px, 8vw, 120px); }
.wild-products-grid { padding: 0 clamp(24px, 5vw, 76px); max-width: none; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.front-v5 .product-card {
    border-radius: 0;
    border: 1px solid var(--wild-line);
    background: #fff;
    box-shadow: none;
    min-height: 100%;
    padding: clamp(24px, 3vw, 42px);
}
.front-v5 .product-card.is-recommended { border-color: var(--wild-terracotta); box-shadow: 0 26px 70px rgba(213,111,42,.12); }
.front-v5 .product-badge { background: var(--wild-terracotta); color: #fff; border-radius: 0; }
.front-v5 .product-price strong { color: var(--wild-green); font-variant-numeric: tabular-nums; }

.wild-destinations { width: 100vw; margin-left: calc(50% - 50vw); background: var(--wild-ivory); padding-bottom: clamp(72px, 8vw, 120px); }
.wild-case-row { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1px; margin: 0 clamp(24px, 5vw, 76px); background: var(--wild-line); }
.wild-case-card {
    min-height: 360px;
    padding: 34px;
    background: #fffaf2;
    text-decoration: none;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    transition: background .24s ease, color .24s ease;
}
.wild-case-card:hover { background: var(--wild-terracotta); color: #fff; }
.wild-case-card b { font-family: var(--wild-serif); font-size: clamp(3rem, 5vw, 6rem); font-weight: 700; line-height: 1; }
.wild-case-card span { color: var(--wild-muted); font-weight: 800; }
.wild-case-card:hover span { color: rgba(255,255,255,.72); }
.wild-case-card strong { font-size: 1.5rem; line-height: 1.18; }

.wild-journal {
    width: 100vw;
    margin-left: calc(50% - 50vw);
    padding: clamp(76px, 9vw, 132px) clamp(24px, 5vw, 76px);
    display: grid;
    grid-template-columns: minmax(0, .75fr) minmax(420px, 1fr);
    gap: clamp(28px, 5vw, 80px);
    background: #fffaf2;
}
.wild-journal__list { display: grid; gap: 1px; background: var(--wild-line); align-self: start; }
.wild-journal-item { display: grid; gap: 8px; padding: 24px; background: #fff; }
.wild-journal-item a { font-size: 1.12rem; font-weight: 850; text-decoration: none; }
.wild-journal-item span { color: var(--wild-muted); line-height: 1.65; }
.wild-compliance {
    width: 100vw;
    margin-left: calc(50% - 50vw);
    padding: 30px clamp(24px, 5vw, 76px);
    background: var(--wild-ink);
    color: rgba(255,255,255,.78);
    display: grid;
    grid-template-columns: 220px 1fr;
    gap: 28px;
    line-height: 1.7;
}
.wild-compliance strong { color: #fff; font-size: 1.15rem; }
.wild-compliance p { margin: 0; }

.front-v5.checkout-page,
.front-v5.status-page,
.front-v5.auth-page {
    width: 100vw;
    margin-left: calc(50% - 50vw);
    min-height: calc(100vh - 80px);
    background: linear-gradient(135deg, var(--wild-ivory) 0%, #fffaf2 45%, #ead7c1 100%);
    padding: clamp(28px, 5vw, 72px) clamp(20px, 5vw, 76px);
}
.checkout-v5 .checkout-shell {
    max-width: none;
    display: grid;
    grid-template-columns: minmax(0, .9fr) minmax(420px, .72fr);
    gap: clamp(24px, 4vw, 64px);
}
.checkout-v5 .checkout-summary,
.checkout-v5 .checkout-panel,
.front-v5 .auth-card,
.front-v5 .status-card {
    border-radius: 0;
    border: 1px solid var(--wild-line);
    background: rgba(255,250,242,.94);
    box-shadow: var(--wild-shadow);
}
.checkout-v5 .checkout-summary { background: var(--wild-green); color: #fff; }
.checkout-v5 .checkout-summary p, .checkout-v5 .checkout-steps li { color: rgba(255,255,255,.76); }
.checkout-v5 .amount-display { background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.16); border-radius: 0; }
.checkout-v5 .amount-display strong { color: #fff; font-family: var(--wild-serif); }
.checkout-v5 .qr-frame { border-radius: 0; border-color: var(--wild-line); background: #fff; }
.checkout-v5 .upload-placeholder { border-radius: 0; border-color: rgba(23,65,53,.26); background: rgba(23,65,53,.04); }
.checkout-v5 .qr-tab { border-radius: 0; }
.checkout-v5 .qr-tab.active { background: var(--wild-green); color: #fff; }

.status-v5 .status-card, .redeem-v5 .auth-card { max-width: 980px; margin: 0 auto; }
.status-v5 .status-card h1, .redeem-v5 .auth-card h1 { font-size: clamp(2.2rem, 4vw, 4.6rem); line-height: 1; }
.status-timeline-v3 span.is-active { background: var(--wild-green); color: #fff; }
.front-v5 .code-box { border-radius: 0; background: #fff; border: 1px solid var(--wild-line); }
.redeem-v5 .front-login-benefits span { border-radius: 0; background: rgba(23,65,53,.06); border: 1px solid var(--wild-line); }
.front-v5 input[type=text], .front-v5 textarea { border-radius: 0; border-color: rgba(22,35,31,.22); background: #fffaf2; }

.chat-v5 {
    width: 100vw;
    min-height: 100vh;
    margin-left: calc(50% - 50vw);
    display: grid;
    grid-template-columns: minmax(260px, 340px) minmax(0, 1fr);
    grid-template-rows: auto 1fr auto;
    background: var(--wild-ivory);
    color: var(--wild-ink);
}
.chat-v5 .chat-header {
    grid-column: 1 / -1;
    border-radius: 0;
    background: var(--wild-green);
    color: #fff;
    padding: 28px clamp(20px, 5vw, 72px);
}
.chat-v5 .chat-header p { color: rgba(255,255,255,.72); }
.chat-v5 .quota-badge { background: #fff; color: var(--wild-green); border-radius: 0; }
.chat-v5 .chat-framework-bar {
    grid-row: 2 / 4;
    min-height: 0;
    border-radius: 0;
    margin: 0;
    padding: 28px;
    background: #fffaf2;
    border-right: 1px solid var(--wild-line);
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
}
.chat-v5 .chat-framework-bar span { border-radius: 0; background: rgba(23,65,53,.06); color: var(--wild-green); border: 1px solid var(--wild-line); }
.chat-v5 .messages-container { margin: 0; border-radius: 0; background: #fff; min-height: 0; }
.chat-v5 .message { max-width: 980px; }
.chat-v5 .message.assistant .bubble, .chat-v5 .message.user .bubble { border-radius: 0; }
.chat-v5 .message.assistant .bubble { background: #fffaf2; border: 1px solid var(--wild-line); }
.chat-v5 .message.user .bubble { background: var(--wild-green); color: #fff; }
.chat-v5 .avatar { border-radius: 0; background: var(--wild-terracotta); color: #fff; }
.chat-v5 .input-area { grid-column: 2; border-radius: 0; margin: 0; border-top: 1px solid var(--wild-line); background: #fffaf2; }
.chat-v5 .starter-grid button { border-radius: 0; border-color: var(--wild-line); background: #fff; }

.content-v5, .wild-content {
    width: 100vw;
    margin-left: calc(50% - 50vw);
    background: var(--wild-ivory);
    color: var(--wild-ink);
}
.content-v5 .sub-hero, .content-v5 .guide-hero, .content-v5 .blog-hero {
    border-radius: 0;
    margin: 0;
    padding: clamp(70px, 9vw, 132px) clamp(24px, 5vw, 76px);
    background: var(--wild-green);
    color: #fff;
}
.content-v5 .sub-hero h1, .content-v5 .guide-hero h1, .content-v5 .blog-hero h1 { color: #fff; font-size: clamp(2.6rem, 5vw, 6rem); line-height: .98; }
.content-v5 .sub-hero p, .content-v5 .guide-hero p, .content-v5 .blog-hero p { color: rgba(255,255,255,.74); }
.content-v5 .blog-card, .content-v5 .blog-article, .content-v5 .section-panel, .content-v5 .ui-card { border-radius: 0; border: 1px solid var(--wild-line); box-shadow: none; }
.content-v5 .content-grid, .content-v5 .cards-grid, .content-v5 .blog-list, .content-v5 .blog-article { margin-left: clamp(20px, 5vw, 76px); margin-right: clamp(20px, 5vw, 76px); max-width: none; }

.site-footer {
    width: 100%;
    max-width: none;
    margin: 0;
    border-radius: 0;
    background: var(--wild-ink);
    color: rgba(255,255,255,.76);
    padding: 46px clamp(24px, 5vw, 76px);
}
.site-footer a, .site-footer strong { color: #fff; }

@media (min-width: 1500px) {
    .wild-hero h1 { font-size: clamp(6rem, 7.4vw, 9rem); }
    .wild-hero__content { padding-left: 6vw; }
    .wild-section-intro, .wild-belief, .wild-journal, .wild-compliance { padding-left: 6vw; padding-right: 6vw; }
    .wild-finder__panel, .wild-case-row, .wild-products-grid { margin-left: 6vw; margin-right: 6vw; padding-left: 0; padding-right: 0; }
}

@media (max-width: 980px) {
    .wild-hero { min-height: auto; grid-template-columns: 1fr; }
    .wild-hero__image { inset: 0; opacity: .25; }
    .wild-hero__image::before { background: linear-gradient(180deg, rgba(213,111,42,.96), rgba(213,111,42,.86)); }
    .wild-hero__content { padding-bottom: 42px; }
    .wild-hero h1 { font-size: clamp(3rem, 12vw, 5.2rem); }
    .wild-hero__tracks { grid-column: 1; grid-template-columns: repeat(2, 1fr); min-height: auto; }
    .wild-hero__tracks a { min-height: 160px; }
    .wild-hero__tracks strong { writing-mode: horizontal-tb; font-size: 1.8rem; }
    .wild-finder__panel, .wild-belief, .wild-journal, .checkout-v5 .checkout-shell { grid-template-columns: 1fr; }
    .wild-filter { border-right: 0; border-bottom: 1px solid var(--wild-line); flex-direction: row; overflow-x: auto; }
    .wild-filter button { min-width: 140px; }
    .wild-path-grid { grid-template-columns: 1fr; }
    .wild-path-card.is-featured { grid-row: auto; }
    .wild-products-grid, .wild-case-row { grid-template-columns: 1fr; }
    .wild-case-card { min-height: 240px; }
    .wild-section-intro.wide { grid-template-columns: 1fr; }
    .wild-compliance { grid-template-columns: 1fr; }
    .chat-v5 { grid-template-columns: 1fr; }
    .chat-v5 .chat-framework-bar { grid-row: auto; flex-direction: row; overflow-x: auto; border-right: 0; border-bottom: 1px solid var(--wild-line); }
    .chat-v5 .chat-framework-bar span { min-width: max-content; }
    .chat-v5 .input-area { grid-column: 1; }
}

@media (max-width: 760px) {
    .site-header { padding: 14px 18px; }
    .site-header__nav { background: #fffaf2; border-radius: 0; border-color: var(--wild-line); }
    .wild-actions, .wild-boundary { align-items: stretch; }
    .wild-actions a { flex: 1 1 160px; }
    .wild-hero__tracks { grid-template-columns: 1fr; }
    .wild-hero__tracks a { align-items: flex-start; min-height: 118px; }
    .wild-section-intro { padding-top: 54px; }
    .wild-section-intro h2, .wild-belief h2, .wild-journal h2 { font-size: clamp(2rem, 11vw, 3.4rem); }
    .wild-finder__panel { margin-left: 18px; margin-right: 18px; }
    .wild-belief, .wild-journal, .front-v5.checkout-page, .front-v5.status-page, .front-v5.auth-page { padding-left: 18px; padding-right: 18px; }
    .wild-products-grid, .wild-case-row { margin-left: 18px; margin-right: 18px; padding-left: 0; padding-right: 0; }
    .wild-case-card b { font-size: 3.8rem; }
    .checkout-v5 .checkout-summary, .checkout-v5 .checkout-panel, .front-v5 .auth-card, .front-v5 .status-card { padding: 22px; }
    .chat-v5 .chat-header { padding: 22px 18px; }
    .chat-v5 .messages-container { padding: 16px; }
    .chat-v5 .input-area { position: sticky; bottom: 0; padding: 14px; }
}

@media (prefers-reduced-motion: reduce) {
    .front-v5 *, .front-v5 *::before, .front-v5 *::after { transition: none !important; animation: none !important; }
}

/* front-v5 visual corrections after browser audit */
@media (min-width: 981px) {
    .wild-hero h1 {
        font-size: clamp(3.4rem, 5.4vw, 6.4rem);
        line-height: 1.02;
        max-width: 820px;
    }
    .wild-hero__content {
        padding-left: clamp(72px, 6vw, 112px);
        max-width: 880px;
    }
    .wild-hero__tracks strong {
        font-size: clamp(2rem, 2.6vw, 3.6rem);
    }
}

/* front-v5 payment proof contrast fix */
.checkout-v5 .checkout-summary .front-mini-proof,
.checkout-v5 .checkout-summary .v4-mini-proof {
    background: rgba(255,255,255,.08);
    border: 1px solid rgba(255,255,255,.18);
    color: rgba(255,255,255,.82);
    border-radius: 0;
}
.checkout-v5 .checkout-summary .front-mini-proof strong,
.checkout-v5 .checkout-summary .v4-mini-proof strong { color: #fff; }
.checkout-v5 .checkout-summary .front-mini-proof p,
.checkout-v5 .checkout-summary .v4-mini-proof p { color: rgba(255,255,255,.74); }

/* front-v5 fix2: true full-bleed WildChina-inspired repair */
:root {
    --wild-fix-ink: #14221d;
    --wild-fix-green: #174135;
    --wild-fix-green-deep: #12372d;
    --wild-fix-clay: #cf6c25;
    --wild-fix-clay-soft: #e88b42;
    --wild-fix-paper: #fbf5ea;
    --wild-fix-card: #fffaf2;
    --wild-fix-line: rgba(20,34,29,.16);
    --wild-fix-muted: #647069;
    --wild-fix-sans: ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", "Noto Sans CJK SC", sans-serif;
}

html, body { width: 100%; max-width: none; overflow-x: hidden; }
body:has(.front-v5) { margin: 0; background: var(--wild-fix-paper); }
body:has(.front-v5) > .site-footer { margin: 0; }

.front-v5,
.front-v5.site-page,
.front-v5.subpage,
.front-v5.content-v5,
.front-v5.blog-page,
.front-v5.checkout-page,
.front-v5.status-page,
.front-v5.auth-page,
.front-v5.chat-app {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow-x: hidden !important;
    background: var(--wild-fix-paper);
    color: var(--wild-fix-ink);
    font-family: var(--wild-fix-sans);
}

.front-v5 h1,
.front-v5 h2,
.front-v5 h3 {
    font-family: var(--wild-fix-sans) !important;
    letter-spacing: -0.035em !important;
    font-weight: 820 !important;
    text-wrap: balance;
}
.front-v5 .wild-kicker,
.front-v5 .v4-kicker,
.front-v5 .eyebrow {
    color: var(--wild-fix-clay);
    letter-spacing: .16em;
    font-weight: 900;
}

body:has(.front-v5) .site-header {
    position: sticky;
    top: 0;
    z-index: 50;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    border-radius: 0 !important;
    padding: 18px clamp(24px, 5vw, 88px) !important;
    background: var(--wild-fix-card) !important;
    border: 0 !important;
    border-bottom: 1px solid var(--wild-fix-line) !important;
    box-shadow: none !important;
    display: grid;
    grid-template-columns: minmax(180px, 1fr) auto minmax(230px, 1fr);
    gap: 28px;
    align-items: center;
}
body:has(.front-v5) .site-header__brand { justify-self: start; }
body:has(.front-v5) .site-header__logo {
    font-family: var(--wild-fix-sans) !important;
    font-size: 1.25rem;
    font-weight: 900;
    color: var(--wild-fix-green) !important;
    letter-spacing: .02em;
}
body:has(.front-v5) .site-header__tagline { color: var(--wild-fix-muted) !important; }
body:has(.front-v5) .site-header__nav { justify-self: center; }
body:has(.front-v5) .site-header__nav a {
    border-radius: 0 !important;
    padding: 12px 16px;
    color: var(--wild-fix-ink) !important;
    background: transparent !important;
}
body:has(.front-v5) .site-header__nav a:hover,
body:has(.front-v5) .site-header__nav a[aria-current="page"] {
    color: var(--wild-fix-clay) !important;
    background: rgba(207,108,37,.08) !important;
}
body:has(.front-v5) .site-header__actions { justify-self: end; }
body:has(.front-v5) .site-header__login,
body:has(.front-v5) .site-header__cta {
    border-radius: 0 !important;
    min-height: 46px;
    padding: 12px 18px;
}
body:has(.front-v5) .site-header__cta { background: var(--wild-fix-green) !important; color: #fff !important; }

.front-v5 .btn-primary,
.front-v5 .btn-secondary,
.front-v5 .input-group button,
.front-v5 .send-btn {
    border-radius: 0 !important;
    font-weight: 850;
}
.front-v5 .btn-primary,
.front-v5 .input-group button,
.front-v5 .send-btn { background: var(--wild-fix-green) !important; color: #fff !important; }
.front-v5 .btn-secondary { background: transparent !important; border-color: rgba(255,255,255,.45); }

.wild-hero {
    width: 100% !important;
    max-width: none !important;
    min-height: calc(100dvh - 82px);
    margin: 0 !important;
    padding: 0 !important;
    display: grid;
    grid-template-columns: minmax(0, 58vw) minmax(420px, 42vw);
    background: var(--wild-fix-clay);
    overflow: hidden;
    position: relative;
}
.wild-hero__image {
    position: absolute;
    inset: 0 0 0 44%;
    opacity: .82;
}
.wild-hero__image::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    background: linear-gradient(90deg, rgba(207,108,37,.96) 0%, rgba(207,108,37,.78) 30%, rgba(20,34,29,.2) 100%);
}
.wild-hero__image img { width: 100%; height: 100%; object-fit: cover; filter: saturate(.9) contrast(1.02); }
.wild-hero__content {
    position: relative;
    z-index: 2;
    grid-column: 1;
    align-self: center;
    width: 100% !important;
    max-width: none !important;
    padding: clamp(64px, 7vw, 110px) clamp(32px, 6vw, 104px) clamp(44px, 5vw, 78px) !important;
    color: #fff;
}
.wild-hero h1 {
    margin: 0;
    width: min(100%, 880px);
    max-width: 880px !important;
    color: #fff;
    font-size: clamp(56px, 5.2vw, 96px) !important;
    line-height: 1.04 !important;
    letter-spacing: -0.045em !important;
    overflow: visible !important;
}
.wild-hero h1 span { display: block; white-space: normal; }
.wild-hero__lead {
    max-width: 680px !important;
    margin: 26px 0 0;
    color: rgba(255,255,255,.88);
    font-size: clamp(18px, 1.35vw, 23px);
    line-height: 1.7;
}
.wild-actions { margin-top: 32px; display: flex; flex-wrap: wrap; gap: 14px; }
.wild-hero .btn-primary { background: #fff !important; color: var(--wild-fix-ink) !important; box-shadow: none; }
.wild-hero .btn-secondary { color: #fff !important; border: 1px solid rgba(255,255,255,.48) !important; }
.wild-boundary { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 28px; }
.wild-boundary span { border: 1px solid rgba(255,255,255,.32); padding: 10px 13px; color: rgba(255,255,255,.86); }
.wild-hero__tracks {
    position: relative !important;
    z-index: 2;
    grid-column: 2;
    width: 100%;
    min-height: 100%;
    display: grid;
    grid-template-columns: 1fr;
    align-self: stretch;
}
.wild-hero__tracks a {
    min-height: 0 !important;
    padding: clamp(20px, 3vw, 42px) clamp(18px, 3vw, 36px) !important;
    border-left: 1px solid rgba(255,255,255,.22);
    border-bottom: 1px solid rgba(255,255,255,.18);
    background: rgba(20,34,29,.12);
    color: #fff;
    text-decoration: none;
    display: grid;
    grid-template-columns: 56px 1fr;
    grid-template-areas: "num title" "num meta";
    align-content: center;
    gap: 4px 18px;
}
.wild-hero__tracks a:hover { background: rgba(20,34,29,.26); transform: none; }
.wild-hero__tracks span { grid-area: num; color: rgba(255,255,255,.62); font-variant-numeric: tabular-nums; }
.wild-hero__tracks strong {
    grid-area: title;
    writing-mode: horizontal-tb !important;
    text-orientation: mixed;
    font-size: clamp(28px, 2.7vw, 48px) !important;
    line-height: 1.05;
    letter-spacing: -0.04em;
}
.wild-hero__tracks small { grid-area: meta; color: rgba(255,255,255,.72); font-weight: 800; }

.wild-finder,
.wild-belief,
.wild-programs,
.wild-destinations,
.wild-journal,
.wild-compliance,
.content-v5 .sub-hero,
.content-v5 .guide-hero,
.content-v5 .blog-hero {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
}
.wild-section-intro,
.wild-belief,
.wild-journal,
.wild-compliance,
.content-v5 .sub-hero,
.content-v5 .guide-hero,
.content-v5 .blog-hero {
    padding-left: clamp(32px, 5vw, 88px) !important;
    padding-right: clamp(32px, 5vw, 88px) !important;
}
.wild-finder__panel,
.wild-products-grid,
.wild-case-row,
.content-v5 .content-grid,
.content-v5 .cards-grid,
.content-v5 .blog-list,
.content-v5 .blog-article {
    width: calc(100% - clamp(64px, 10vw, 176px)) !important;
    max-width: none !important;
    margin-left: clamp(32px, 5vw, 88px) !important;
    margin-right: clamp(32px, 5vw, 88px) !important;
}
.content-v5 .sub-hero h1,
.content-v5 .guide-hero h1,
.content-v5 .blog-hero h1 {
    max-width: 1040px !important;
    font-size: clamp(52px, 5.2vw, 96px) !important;
    line-height: 1.06 !important;
    letter-spacing: -0.045em !important;
}
.content-v5 .sub-hero p,
.content-v5 .guide-hero p,
.content-v5 .blog-hero p { max-width: 880px !important; }

.front-v5.checkout-page,
.front-v5.status-page,
.front-v5.auth-page {
    min-height: calc(100dvh - 82px);
    padding: clamp(38px, 5vw, 78px) clamp(32px, 5vw, 88px) !important;
    background: linear-gradient(135deg, var(--wild-fix-paper), #f0dfc9) !important;
}
.checkout-v5 .checkout-shell {
    width: min(100%, 1360px) !important;
    max-width: 1360px !important;
    margin: 0 auto !important;
    grid-template-columns: minmax(0, 1fr) minmax(430px, .8fr) !important;
}
.status-v5 .status-card,
.redeem-v5 .auth-card { width: min(100%, 920px) !important; max-width: 920px !important; margin: 0 auto !important; }

.chat-v5 {
    width: 100% !important;
    min-height: 100dvh;
    margin: 0 !important;
    grid-template-columns: minmax(280px, 360px) minmax(0, 1fr) !important;
}

.site-footer { width: 100% !important; max-width: none !important; margin: 0 !important; }

@media (min-width: 1600px) {
    .wild-hero { grid-template-columns: minmax(0, 57vw) minmax(520px, 43vw); }
    .wild-hero h1 { font-size: clamp(70px, 5vw, 104px) !important; }
    .wild-hero__content { padding-left: 6vw !important; }
}

@media (max-width: 980px) {
    body:has(.front-v5) .site-header {
        grid-template-columns: 1fr auto;
        padding: 16px 20px !important;
    }
    body:has(.front-v5) .site-header__nav { grid-column: 1 / -1; justify-self: stretch; }
    body:has(.front-v5) .site-header__actions { grid-column: 1 / -1; justify-self: stretch; display: grid; grid-template-columns: 1fr 1fr; }
    .wild-hero { grid-template-columns: 1fr; min-height: auto; }
    .wild-hero__image { inset: 0; opacity: .26; }
    .wild-hero__image::before { background: linear-gradient(180deg, rgba(207,108,37,.98), rgba(207,108,37,.9)); }
    .wild-hero__content { padding: 58px 24px 44px !important; }
    .wild-hero h1 { font-size: clamp(40px, 11vw, 58px) !important; line-height: 1.08 !important; width: 100%; }
    .wild-hero__lead { font-size: 17px; }
    .wild-hero__tracks { grid-column: 1; grid-template-columns: repeat(2, minmax(0, 1fr)); min-height: auto; }
    .wild-hero__tracks a { min-height: 128px !important; grid-template-columns: 42px 1fr; }
    .wild-hero__tracks strong { font-size: 28px !important; }
    .wild-finder__panel,
    .wild-products-grid,
    .wild-case-row,
    .content-v5 .content-grid,
    .content-v5 .cards-grid,
    .content-v5 .blog-list,
    .content-v5 .blog-article {
        width: calc(100% - 40px) !important;
        margin-left: 20px !important;
        margin-right: 20px !important;
    }
    .checkout-v5 .checkout-shell { grid-template-columns: 1fr !important; }
    .chat-v5 { grid-template-columns: 1fr !important; }
}

@media (max-width: 560px) {
    body:has(.front-v5) .site-header__actions { grid-template-columns: 1fr; }
    .wild-hero__tracks { grid-template-columns: 1fr; }
    .wild-hero__tracks a { min-height: 104px !important; }
    .wild-actions a { width: 100%; }
    .wild-boundary span { flex: 1 1 auto; }
    .front-v5.checkout-page,
    .front-v5.status-page,
    .front-v5.auth-page { padding: 28px 18px !important; }
    .content-v5 .sub-hero h1,
    .content-v5 .guide-hero h1,
    .content-v5 .blog-hero h1 { font-size: clamp(38px, 11vw, 56px) !important; }
}

/* front-v5 wildchina-education motion interactions */
:root {
    --motion-ease: cubic-bezier(.22, 1, .36, 1);
    --motion-fast: 180ms;
    --motion-medium: 320ms;
    --motion-slow: 620ms;
}

body:has(.front-v5) .site-header {
    transition: min-height var(--motion-medium) var(--motion-ease), box-shadow var(--motion-medium) var(--motion-ease), background var(--motion-medium) var(--motion-ease);
}

body:has(.front-v5) .site-header.is-scrolled {
    min-height: 70px;
    background: rgba(249, 244, 235, .94) !important;
    box-shadow: 0 18px 60px rgba(21, 31, 26, .12);
    backdrop-filter: blur(18px);
}

.front-v5 [data-motion-section] {
    opacity: 0;
    transform: translateY(28px);
    transition: opacity var(--motion-slow) var(--motion-ease), transform var(--motion-slow) var(--motion-ease);
}

.front-v5 [data-motion-section].is-visible,
.front-v5 .wild-hero[data-motion-section] {
    opacity: 1;
    transform: translateY(0);
}

.motion-hero {
    isolation: isolate;
}

.motion-hero .wild-hero__content,
.motion-hero .wild-hero__tracks,
.motion-hero .motion-hero-focus {
    position: relative;
    z-index: 2;
}

.motion-hero .wild-hero__content {
    transition: transform var(--motion-medium) var(--motion-ease);
}

.motion-hero .wild-hero__image img {
    transform: scale(1.015);
    transition: transform 900ms var(--motion-ease), filter 900ms var(--motion-ease);
}

.motion-hero:has(.motion-hero-panels button:hover) .wild-hero__image img,
.motion-hero:has(.motion-hero-panels button:focus-visible) .wild-hero__image img,
.motion-hero:has(.motion-hero-panels button.is-active) .wild-hero__image img {
    transform: scale(1.055);
    filter: saturate(.96) contrast(1.04);
}

.motion-hero-panels {
    align-self: stretch;
}

.motion-hero-panels button {
    appearance: none;
    border: 0;
    border-left: 1px solid rgba(255,255,255,.23);
    border-radius: 0;
    background: rgba(20,34,29,.10);
    color: #fff;
    min-height: 168px;
    padding: 26px 34px;
    display: grid;
    grid-template-areas: "num title" "num meta";
    grid-template-columns: 52px 1fr;
    align-content: end;
    gap: 3px 18px;
    text-align: left;
    cursor: pointer;
    transition: background var(--motion-medium) var(--motion-ease), transform var(--motion-medium) var(--motion-ease), box-shadow var(--motion-medium) var(--motion-ease);
}

.motion-hero-panels button:hover,
.motion-hero-panels button:focus-visible,
.motion-hero-panels button.is-active {
    background: rgba(20,34,29,.35);
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.28);
    outline: none;
}

.motion-hero-panels button:focus-visible {
    box-shadow: inset 0 0 0 2px #fff, 0 0 0 3px rgba(211,107,42,.55);
}

.motion-hero-panels button span {
    grid-area: num;
    color: rgba(255,255,255,.68);
    font: 800 14px/1 var(--font-ui, system-ui, sans-serif);
    letter-spacing: .04em;
    font-variant-numeric: tabular-nums;
}

.motion-hero-panels button strong {
    grid-area: title;
    font-size: clamp(26px, 2.8vw, 48px);
    line-height: .98;
    letter-spacing: 0;
    font-weight: 900;
}

.motion-hero-panels button small {
    grid-area: meta;
    color: rgba(255,255,255,.76);
    font-weight: 800;
}

.motion-hero-focus {
    position: absolute;
    left: clamp(24px, 6vw, 96px);
    bottom: clamp(24px, 4vw, 58px);
    max-width: min(460px, 42vw);
    padding: 18px 22px;
    border: 1px solid rgba(255,255,255,.32);
    background: rgba(20,34,29,.24);
    color: #fff;
    backdrop-filter: blur(12px);
}

.motion-hero-focus span {
    display: block;
    margin-bottom: 6px;
    color: rgba(255,255,255,.70);
    font-size: 12px;
    font-weight: 900;
    letter-spacing: .14em;
    text-transform: uppercase;
}

.motion-hero-focus strong {
    display: block;
    font-size: clamp(18px, 1.35vw, 25px);
    line-height: 1.28;
}

.motion-finder__panel {
    position: relative;
    overflow: hidden;
}

.motion-finder__panel::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: min(36vw, 520px);
    background: linear-gradient(90deg, rgba(23,65,53,.06), transparent);
    pointer-events: none;
}

.motion-filter button {
    position: relative;
    width: 100%;
    justify-content: space-between;
    transition: color var(--motion-fast) var(--motion-ease), background var(--motion-fast) var(--motion-ease), padding var(--motion-fast) var(--motion-ease);
}

.motion-filter button::after {
    content: "→";
    opacity: 0;
    transform: translateX(-8px);
    transition: opacity var(--motion-fast) var(--motion-ease), transform var(--motion-fast) var(--motion-ease);
}

.motion-filter button:hover::after,
.motion-filter button:focus-visible::after,
.motion-filter button.is-active::after {
    opacity: 1;
    transform: translateX(0);
}

.motion-filter__reset {
    margin-top: 18px !important;
    color: var(--wild-fix-muted, #66736d) !important;
    border-style: dashed !important;
}

.motion-confluence {
    display: grid;
    grid-template-columns: minmax(260px, .8fr) minmax(360px, 1.25fr);
    gap: clamp(26px, 4vw, 64px);
    align-items: stretch;
    min-height: 560px;
}

.motion-summary {
    align-self: stretch;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: clamp(28px, 4vw, 56px);
    background: var(--wild-fix-green, #174135);
    color: #fff;
}

.motion-summary .wild-kicker,
.motion-summary p {
    color: rgba(255,255,255,.78) !important;
}

.motion-summary h3 {
    margin: 10px 0 18px;
    color: #fff !important;
    font-size: clamp(34px, 3.2vw, 64px);
    line-height: 1.04;
    letter-spacing: 0;
}

.motion-route-line {
    display: grid;
    grid-template-columns: max-content 1fr max-content;
    gap: 14px;
    align-items: center;
    margin-top: 34px;
    font-weight: 900;
}

.motion-route-line i {
    height: 1px;
    background: rgba(255,255,255,.45);
}

.motion-path-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    border: 1px solid rgba(23,65,53,.16);
    background: #fffaf1;
}

.motion-path-card {
    min-height: 260px;
    padding: clamp(22px, 2.2vw, 34px);
    border-right: 1px solid rgba(23,65,53,.15);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    opacity: 0;
    transform: translateY(16px);
    animation: pathCardIn var(--motion-medium) var(--motion-ease) forwards;
    animation-delay: calc(var(--stagger, 0) * 70ms);
}

.motion-path-card:last-child { border-right: 0; }
.motion-path-card b {
    font-size: clamp(64px, 6vw, 112px);
    line-height: .8;
    color: rgba(211,107,42,.24);
    font-weight: 900;
}
.motion-path-card span {
    color: var(--wild-fix-green, #174135);
    font-weight: 900;
    font-size: 18px;
}
.motion-path-card p {
    margin: 0;
    color: var(--wild-fix-muted, #66736d);
    line-height: 1.65;
}

.motion-checklist {
    grid-column: 1 / -1;
    padding: 24px clamp(24px, 3vw, 42px);
    border: 1px solid rgba(23,65,53,.14);
    border-top: 0;
    background: rgba(255,255,255,.78);
}

.motion-checklist strong {
    display: block;
    margin-bottom: 12px;
    color: var(--wild-fix-green, #174135);
}

.motion-checklist ul {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px 20px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.motion-checklist li {
    position: relative;
    padding-left: 18px;
    color: var(--wild-fix-ink, #14221d);
    line-height: 1.55;
}

.motion-checklist li::before {
    content: "";
    position: absolute;
    left: 0;
    top: .72em;
    width: 6px;
    height: 6px;
    border-radius: 999px;
    background: var(--wild-fix-orange, #d36b2a);
}

.motion-trust-stack button {
    appearance: none;
    border: 1px solid rgba(23,65,53,.16);
    background: rgba(255,255,255,.70);
    color: var(--wild-fix-ink, #14221d);
    text-align: left;
    cursor: pointer;
    transition: background var(--motion-medium) var(--motion-ease), transform var(--motion-medium) var(--motion-ease), border-color var(--motion-medium) var(--motion-ease);
}

.motion-trust-stack button:hover,
.motion-trust-stack button:focus-visible,
.motion-trust-stack button.is-active {
    background: var(--wild-fix-green, #174135);
    color: #fff;
    border-color: var(--wild-fix-green, #174135);
    outline: none;
}

.motion-trust-stack button:hover span,
.motion-trust-stack button:focus-visible span,
.motion-trust-stack button.is-active span {
    color: rgba(255,255,255,.76);
}

.wild-case-card {
    transition: transform var(--motion-medium) var(--motion-ease), background var(--motion-medium) var(--motion-ease), color var(--motion-medium) var(--motion-ease);
}

.wild-case-card:hover,
.wild-case-card:focus-visible {
    transform: translateY(-4px);
}

.wild-case-card:hover b,
.wild-case-card:focus-visible b {
    color: rgba(255,255,255,.28);
}

@keyframes pathCardIn {
    to { opacity: 1; transform: translateY(0); }
}

@media (min-width: 1200px) {
    .motion-hero { min-height: calc(100vh - 0px); }
    .motion-finder__panel { width: 100%; }
}

@media (max-width: 980px) {
    .motion-hero-focus {
        position: relative;
        left: auto;
        bottom: auto;
        max-width: none;
        margin: 18px 24px 0;
    }
    .motion-hero-panels button {
        min-height: 126px;
        padding: 22px 24px;
        grid-template-columns: 44px 1fr;
    }
    .motion-hero-panels button strong { font-size: clamp(26px, 7vw, 42px); }
    .motion-confluence {
        grid-template-columns: 1fr;
        min-height: 0;
    }
    .motion-path-grid,
    .motion-checklist ul {
        grid-template-columns: 1fr;
    }
    .motion-path-card {
        min-height: 190px;
        border-right: 0;
        border-bottom: 1px solid rgba(23,65,53,.15);
    }
}

@media (max-width: 560px) {
    .motion-hero-focus { margin: 16px 18px 0; padding: 16px 18px; }
    .motion-hero-panels button {
        min-height: 102px !important;
        padding: 18px 18px;
    }
    .motion-confluence { gap: 0; }
    .motion-summary { padding: 28px 22px; }
    .motion-route-line { grid-template-columns: 1fr; gap: 8px; }
    .motion-route-line i { width: 44px; }
    .motion-path-card b { font-size: 68px; }
    .motion-checklist { padding: 22px; }
}

@media (prefers-reduced-motion: reduce) {
    .front-v5 *,
    .front-v5 *::before,
    .front-v5 *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        scroll-behavior: auto !important;
        transition-duration: .01ms !important;
    }
    .front-v5 [data-motion-section],
    .motion-path-card {
        opacity: 1 !important;
        transform: none !important;
    }
}

/* front-v5 wildchina-education motion-v2 refinement */
.wild-home-v2 {
    --v2-paper: #f8f0e4;
    --v2-ink: #14231d;
    --v2-green: #174135;
    --v2-orange: #cf6b25;
    --v2-sand: #efe4d2;
    --v2-line: rgba(23,65,53,.16);
    background: var(--v2-paper);
}

body:has(.wild-home-v2) .site-header__menu {
    gap: 8px;
    min-width: 82px;
    color: var(--v2-ink);
    font-weight: 900;
}
body:has(.wild-home-v2) .site-header__menu-lines {
    display: grid;
    gap: 4px;
    width: 18px;
}
body:has(.wild-home-v2) .site-header__menu-lines i {
    display: block;
    height: 2px;
    background: currentColor;
}
body:has(.wild-home-v2) .site-header__menu strong { font-size: 13px; }

.motion-hero-v2 {
    grid-template-columns: minmax(0, 44vw) minmax(640px, 56vw) !important;
    min-height: calc(100vh - 86px) !important;
    background: linear-gradient(90deg, rgba(207,107,37,.88), rgba(207,107,37,.62) 42%, rgba(20,35,29,.12));
}
.motion-hero-v2 .wild-hero__image::before {
    background: linear-gradient(90deg, rgba(207,107,37,.78), rgba(207,107,37,.35) 48%, rgba(20,35,29,.25)) !important;
}
.motion-hero-v2 .wild-hero__content { max-width: 740px; padding-top: clamp(86px, 10vh, 150px) !important; }
.motion-hero-v2 h1 { max-width: 760px; font-size: clamp(58px, 5.4vw, 96px) !important; }
.motion-hero-v2 .wild-hero__lead { max-width: 660px; }
.motion-hero-panels-v2 {
    grid-template-columns: repeat(5, minmax(118px, 1fr)) !important;
    grid-auto-rows: 1fr;
    align-self: stretch;
    overflow: hidden;
}
.motion-hero-panels-v2 .hero-panel {
    min-height: calc(100vh - 86px) !important;
    padding: clamp(24px, 2.4vw, 42px) clamp(18px, 2vw, 34px) !important;
    align-content: end;
    position: relative;
    isolation: isolate;
    overflow: hidden;
    background: color-mix(in srgb, var(--panel-tone), transparent 42%) !important;
}
.motion-hero-panels-v2 .hero-panel::before {
    content: "";
    position: absolute;
    inset: 0;
    background: url('/static/hero-decision-desk.png') center / cover no-repeat;
    opacity: .28;
    transform: scale(1.04);
    transition: transform 760ms var(--motion-ease), opacity 320ms var(--motion-ease);
    z-index: -2;
}
.motion-hero-panels-v2 .hero-panel::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, transparent 12%, rgba(20,35,29,.52));
    z-index: -1;
}
.motion-hero-panels-v2 .hero-panel:hover,
.motion-hero-panels-v2 .hero-panel:focus-visible,
.motion-hero-panels-v2 .hero-panel.is-active {
    background: color-mix(in srgb, var(--panel-tone), transparent 18%) !important;
}
.motion-hero-panels-v2 .hero-panel:hover::before,
.motion-hero-panels-v2 .hero-panel:focus-visible::before,
.motion-hero-panels-v2 .hero-panel.is-active::before { transform: scale(1.12); opacity: .46; }
.motion-hero-panels-v2 .hero-panel i {
    grid-column: 2;
    display: block;
    max-width: 220px;
    margin-top: 16px;
    color: rgba(255,255,255,.74);
    font-style: normal;
    line-height: 1.45;
    opacity: 0;
    transform: translateY(10px);
    transition: opacity 240ms var(--motion-ease), transform 240ms var(--motion-ease);
}
.motion-hero-panels-v2 .hero-panel:hover i,
.motion-hero-panels-v2 .hero-panel:focus-visible i,
.motion-hero-panels-v2 .hero-panel.is-active i { opacity: 1; transform: translateY(0); }
.motion-hero-v2 .motion-hero-focus { background: rgba(20,35,29,.36); }

.motion-finder-v2 { padding-top: clamp(72px, 8vw, 120px) !important; }
.motion-finder__panel-v2 {
    display: grid !important;
    grid-template-columns: minmax(260px, 330px) minmax(0, 1fr) !important;
    gap: 0 !important;
    min-height: 720px;
    border: 1px solid var(--v2-line);
    background: #fffaf1;
}
.motion-filter-v2 {
    padding: 42px 30px !important;
    border-right: 1px solid var(--v2-line);
    background: rgba(23,65,53,.055);
}
.motion-filter-v2 .filter-group { display: grid; gap: 10px; margin-bottom: 28px; }
.motion-filter-v2 .filter-group strong {
    color: var(--v2-green);
    font-size: 13px;
    letter-spacing: .12em;
    text-transform: uppercase;
}
.motion-filter-v2 button {
    min-height: 46px;
    border: 1px solid transparent !important;
    background: transparent !important;
    color: var(--v2-ink) !important;
    font-weight: 900;
    text-align: left;
    padding: 10px 14px !important;
}
.motion-filter-v2 button:hover,
.motion-filter-v2 button:focus-visible,
.motion-filter-v2 button.is-active {
    border-color: rgba(207,107,37,.38) !important;
    background: #fffaf1 !important;
    color: var(--v2-orange) !important;
    outline: none;
}
.finder-results { padding: clamp(28px, 4vw, 56px); min-width: 0; }
.finder-results__head {
    display: flex;
    align-items: start;
    justify-content: space-between;
    gap: 28px;
    margin-bottom: 22px;
}
.finder-results__head h3 {
    margin: 0 0 10px;
    color: var(--v2-green);
    font-size: clamp(34px, 3.4vw, 62px);
    line-height: 1;
}
.finder-results__head p { max-width: 760px; color: rgba(20,35,29,.68); }
#finder-count {
    flex: 0 0 auto;
    padding: 12px 16px;
    border: 1px solid var(--v2-line);
    color: var(--v2-green);
    font-variant-numeric: tabular-nums;
}
.finder-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 24px; }
.finder-chips span {
    padding: 8px 12px;
    border: 1px solid rgba(207,107,37,.28);
    background: rgba(207,107,37,.08);
    color: var(--v2-orange);
    font-size: 13px;
    font-weight: 900;
}
.program-card-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0;
    border-top: 1px solid var(--v2-line);
    border-left: 1px solid var(--v2-line);
}
.program-route-card {
    min-height: 330px;
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding: 28px;
    border-right: 1px solid var(--v2-line);
    border-bottom: 1px solid var(--v2-line);
    background: rgba(255,250,241,.82);
    color: var(--v2-ink);
    overflow: hidden;
    opacity: 0;
    transform: translateY(18px);
    animation: pathCardIn 360ms var(--motion-ease) forwards;
    animation-delay: calc(var(--stagger, 0) * 45ms);
}
.program-route-card.is-offset { transform: translateY(44px); }
.program-route-card::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, rgba(207,107,37,.10), transparent 55%);
    opacity: 0;
    transition: opacity 240ms var(--motion-ease);
}
.program-route-card:hover::before,
.program-route-card:focus-within::before { opacity: 1; }
.program-route-card b {
    position: absolute;
    top: 28px;
    left: 24px;
    color: rgba(207,107,37,.18);
    font-size: clamp(72px, 7vw, 124px);
    line-height: .8;
    z-index: 0;
}
.program-route-card span,
.program-route-card strong,
.program-route-card p,
.program-route-card em,
.program-route-card a { position: relative; z-index: 1; }
.program-route-card span { color: var(--v2-green); font-weight: 900; }
.program-route-card strong { display: block; margin: 8px 0 12px; font-size: 22px; line-height: 1.15; color: var(--v2-ink); }
.program-route-card p { margin: 0 0 16px; color: rgba(20,35,29,.68); line-height: 1.6; }
.program-route-card em { color: rgba(207,107,37,.78); font-style: normal; font-size: 12px; font-weight: 900; }
.program-route-card a { margin-top: 20px; color: var(--v2-green); font-weight: 900; text-decoration: none; }
.finder-empty { margin-top: 18px; color: var(--v2-orange); font-weight: 900; }
.finder-checklist { margin-top: 42px; border-top: 1px solid var(--v2-line) !important; }

.wild-immersive {
    width: 100%;
    display: grid;
    grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
    gap: clamp(36px, 6vw, 96px);
    padding: clamp(82px, 10vw, 150px) clamp(32px, 6vw, 96px);
    background: var(--v2-green);
    color: #fff;
}
.wild-immersive h2 { color: #fff !important; font-size: clamp(42px, 5vw, 88px); line-height: 1.04; max-width: 840px; }
.wild-immersive p { color: rgba(255,255,255,.74); line-height: 1.8; }
.immersive-copy { align-self: center; max-width: 760px; }
.immersive-steps { display: grid; gap: 1px; background: rgba(255,255,255,.18); }
.immersive-steps article { min-height: 230px; padding: clamp(28px, 4vw, 52px); background: rgba(255,255,255,.08); }
.immersive-steps span { color: rgba(255,255,255,.58); font-weight: 900; letter-spacing: .12em; }
.immersive-steps strong { display: block; margin: 26px 0 12px; font-size: clamp(28px, 3vw, 52px); line-height: 1; }

.wild-why-sticky {
    display: grid;
    grid-template-columns: minmax(300px, 34vw) minmax(0, 1fr);
    gap: clamp(32px, 5vw, 82px);
    padding: clamp(80px, 10vw, 150px) clamp(32px, 6vw, 96px);
    background: var(--v2-paper);
}
.why-sticky-title { position: sticky; top: 112px; align-self: start; }
.why-sticky-title h2 { font-size: clamp(46px, 5vw, 92px); line-height: 1.02; color: var(--v2-green); }
.why-scroll-cards { display: grid; gap: 28px; }
.why-scroll-cards article {
    min-height: 360px;
    padding: clamp(32px, 4vw, 62px);
    border: 1px solid var(--v2-line);
    background: #fffaf1;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
}
.why-scroll-cards span { color: var(--v2-orange); font-weight: 900; letter-spacing: .14em; text-transform: uppercase; }
.why-scroll-cards h3 { margin: 18px 0; font-size: clamp(30px, 3.4vw, 58px); line-height: 1.04; color: var(--v2-green); }
.why-scroll-cards p { max-width: 720px; color: rgba(20,35,29,.68); line-height: 1.75; }

.wild-case-row-v2 { display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0 !important; border-top: 1px solid var(--v2-line); border-left: 1px solid var(--v2-line); }
.wild-case-row-v2 .wild-case-card { min-height: 360px; border-right: 1px solid var(--v2-line); border-bottom: 1px solid var(--v2-line); border-radius: 0 !important; }
.wild-case-row-v2 .wild-case-card.is-offset { transform: translateY(44px); }
.wild-case-row-v2 .wild-case-card small { position: relative; z-index: 1; display: block; margin-top: 18px; color: rgba(20,35,29,.66); line-height: 1.6; }

.wild-journal-v2 .wild-journal__list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; border-top: 1px solid var(--v2-line); border-left: 1px solid var(--v2-line); }
.editorial-card { min-height: 280px; padding: 28px !important; border-right: 1px solid var(--v2-line); border-bottom: 1px solid var(--v2-line); background: #fffaf1; }
.editorial-card > span { display: block; margin-bottom: 26px; color: var(--v2-orange); font-size: 12px; font-weight: 900; letter-spacing: .14em; text-transform: uppercase; }
.editorial-card a { font-size: 22px; line-height: 1.2; }
.editorial-card p { color: rgba(20,35,29,.65); }
.editorial-card small { color: var(--v2-green); font-weight: 900; }

.site-footer-v2 { display: grid !important; grid-template-columns: minmax(280px, 1.4fr) repeat(2, minmax(160px, .65fr)) minmax(280px, 1fr); gap: clamp(28px, 4vw, 64px); padding: clamp(48px, 6vw, 88px) clamp(28px, 6vw, 96px) !important; background: #102d25 !important; color: #fff !important; }
.site-footer-v2 a { color: #fff !important; }
.site-footer-v2 p { color: rgba(255,255,255,.72) !important; }
.site-footer-v2 strong { color: #fff; }
.site-footer-v2 .site-footer__links { display: grid; gap: 12px; }
.site-footer-v2 .site-footer__links strong { margin-bottom: 8px; color: rgba(255,255,255,.55); text-transform: uppercase; letter-spacing: .12em; font-size: 12px; }

@media (max-width: 1180px) {
    .motion-hero-v2 { grid-template-columns: 1fr !important; }
    .motion-hero-panels-v2 { grid-template-columns: repeat(5, minmax(220px, 1fr)) !important; overflow-x: auto; scroll-snap-type: x mandatory; }
    .motion-hero-panels-v2 .hero-panel { min-height: 220px !important; scroll-snap-align: start; }
    .motion-finder__panel-v2 { grid-template-columns: 1fr !important; }
    .motion-filter-v2 { border-right: 0; border-bottom: 1px solid var(--v2-line); }
    .program-card-grid, .wild-case-row-v2, .wild-journal-v2 .wild-journal__list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .wild-immersive, .wild-why-sticky { grid-template-columns: 1fr; }
    .why-sticky-title { position: static; }
    .site-footer-v2 { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 640px) {
    .motion-hero-v2 { min-height: auto !important; }
    .motion-hero-v2 .wild-hero__content { padding: 42px 24px 28px !important; }
    .motion-hero-v2 h1 { font-size: clamp(36px, 10vw, 48px) !important; }
    .motion-hero-v2 .wild-actions { gap: 12px; }
    .motion-hero-panels-v2 { grid-column: 1 !important; display: grid !important; grid-template-columns: repeat(5, 78vw) !important; min-height: auto !important; }
    .motion-hero-panels-v2 .hero-panel { min-height: 180px !important; padding: 22px !important; }
    .motion-hero-panels-v2 .hero-panel i { opacity: 1; transform: none; }
    .motion-hero-v2 .motion-hero-focus { margin: 16px 18px 24px; }
    .finder-results { padding: 24px 18px; }
    .finder-results__head { display: grid; }
    .program-card-grid, .wild-case-row-v2, .wild-journal-v2 .wild-journal__list { grid-template-columns: 1fr; }
    .program-route-card, .wild-case-row-v2 .wild-case-card { min-height: 260px; }
    .program-route-card.is-offset, .wild-case-row-v2 .wild-case-card.is-offset { transform: none; }
    .wild-immersive, .wild-why-sticky { padding: 56px 22px; }
    .immersive-steps article, .why-scroll-cards article { min-height: 240px; }
    .site-footer-v2 { grid-template-columns: 1fr; }
}

/* front-v5 motion-v2 hero viewport fit */
@media (min-width: 1181px) {
    .motion-hero-v2 {
        height: calc(100vh - 86px) !important;
        min-height: 760px !important;
        max-height: 980px !important;
        overflow: hidden !important;
    }
    .motion-hero-panels-v2 .hero-panel {
        min-height: 100% !important;
    }
    .motion-hero-v2 .motion-hero-focus {
        bottom: 34px !important;
    }
}

/* front-v5 motion-v3 visual repair */
.motion-hero-panels-v2 .hero-panel::before {
    background-image: var(--panel-image, url('/static/hero-decision-desk.png')) !important;
    background-position: center !important;
    background-size: cover !important;
}

.visual-panel,
.content-hero-media,
.article-cover,
.case-cover,
.visual-strip figure,
.why-proof-visual {
    position: relative;
    overflow: hidden;
    background: #eadfce;
    border: 1px solid var(--v2-line, rgba(20,35,29,.16));
}

.visual-panel img,
.content-hero-media img,
.article-cover img,
.case-cover img,
.visual-strip img,
.why-proof-visual img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.content-hero-media {
    min-height: 340px;
    aspect-ratio: 4 / 3;
    margin: 0;
    align-self: stretch;
}

.content-hero-media figcaption,
.article-cover figcaption,
.visual-strip figcaption {
    position: absolute;
    left: 18px;
    right: 18px;
    bottom: 16px;
    color: #fffaf1;
    font-weight: 900;
    letter-spacing: .04em;
    text-shadow: 0 2px 18px rgba(0,0,0,.34);
}

.content-v5 .sub-hero,
.content-v5 .guide-hero,
.content-v5 .blog-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(360px, 42vw);
    gap: clamp(28px, 5vw, 80px);
    align-items: end;
}

.content-v5 .sub-hero > .eyebrow,
.content-v5 .guide-hero > .eyebrow,
.content-v5 .blog-hero > .eyebrow,
.content-v5 .sub-hero > h1,
.content-v5 .guide-hero > h1,
.content-v5 .blog-hero > h1,
.content-v5 .sub-hero > p:not(.eyebrow),
.content-v5 .guide-hero > p:not(.eyebrow),
.content-v5 .blog-hero > p:not(.eyebrow) {
    grid-column: 1;
}

.content-v5 .sub-hero > .content-hero-media,
.content-v5 .guide-hero > .content-hero-media,
.content-v5 .blog-hero > .content-hero-media {
    grid-column: 2;
    grid-row: 1 / span 4;
}

.visual-strip {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0;
    margin: 0 clamp(28px, 6vw, 96px) clamp(40px, 6vw, 88px);
    border-top: 1px solid var(--v2-line, rgba(20,35,29,.16));
    border-left: 1px solid var(--v2-line, rgba(20,35,29,.16));
}

.visual-strip figure {
    min-height: clamp(220px, 26vw, 430px);
    margin: 0;
    border-top: 0;
    border-left: 0;
    border-right: 1px solid var(--v2-line, rgba(20,35,29,.16));
    border-bottom: 1px solid var(--v2-line, rgba(20,35,29,.16));
}

.visual-strip figure::after,
.article-cover::after,
.content-hero-media::after,
.why-proof-visual::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(20,35,29,0) 28%, rgba(20,35,29,.48));
    pointer-events: none;
}

.blog-card--component .article-cover {
    aspect-ratio: 16 / 9;
    margin: 0 0 22px;
    border-radius: 0;
}

.article-cover--wide {
    aspect-ratio: 21 / 9;
    margin: clamp(28px, 4vw, 52px) 0;
}

.why-sticky-title {
    display: grid;
    gap: clamp(18px, 2vw, 28px);
}

.why-proof-visual {
    aspect-ratio: 4 / 3;
    width: min(100%, 520px);
}

.why-proof-metrics {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    width: min(100%, 520px);
    border: 1px solid var(--v2-line, rgba(20,35,29,.16));
    background: #fffaf1;
}

.why-proof-metrics span {
    display: grid;
    gap: 6px;
    padding: clamp(14px, 1.5vw, 22px);
    border-right: 1px solid var(--v2-line, rgba(20,35,29,.16));
}

.why-proof-metrics span:last-child { border-right: 0; }
.why-proof-metrics b {
    color: var(--v2-orange, #c96a2b);
    font-size: clamp(26px, 3vw, 42px);
    line-height: 1;
}
.why-proof-metrics small {
    color: rgba(20,35,29,.66);
    font-size: 12px;
    line-height: 1.35;
}

@media (min-width: 1181px) {
    .motion-hero-v2 {
        grid-template-columns: minmax(0, 42vw) minmax(640px, 58vw) !important;
        min-height: calc(100svh - 86px) !important;
        height: auto !important;
        max-height: none !important;
        overflow: visible !important;
    }
    .motion-hero-v2 .wild-hero__content {
        max-width: 700px !important;
        padding-top: clamp(58px, 7vh, 104px) !important;
        padding-bottom: clamp(52px, 7vh, 92px) !important;
    }
    .motion-hero-v2 h1 {
        max-width: 680px !important;
        font-size: clamp(52px, 4.6vw, 82px) !important;
        line-height: 1.04 !important;
        text-wrap: balance;
    }
    .motion-hero-v2 .wild-hero__lead {
        max-width: 620px !important;
    }
    .motion-hero-v2 .motion-hero-focus {
        position: relative !important;
        left: auto !important;
        right: auto !important;
        bottom: auto !important;
        max-width: 560px !important;
        margin-top: clamp(28px, 4vh, 54px) !important;
    }
    .motion-hero-panels-v2 .hero-panel {
        min-height: calc(100svh - 86px) !important;
        align-content: end !important;
    }
    .wild-why-sticky {
        grid-template-columns: minmax(360px, 36vw) minmax(0, 64vw) !important;
        gap: clamp(24px, 4vw, 64px) !important;
    }
    .why-scroll-cards article {
        min-height: 280px !important;
        padding: clamp(28px, 3.2vw, 48px) !important;
    }
}

@media (max-width: 1180px) {
    .content-v5 .sub-hero,
    .content-v5 .guide-hero,
    .content-v5 .blog-hero {
        grid-template-columns: 1fr;
    }
    .content-v5 .sub-hero > .content-hero-media,
    .content-v5 .guide-hero > .content-hero-media,
    .content-v5 .blog-hero > .content-hero-media {
        grid-column: 1;
        grid-row: auto;
    }
    .why-proof-visual,
    .why-proof-metrics {
        width: 100%;
    }
}

@media (max-width: 640px) {
    .content-hero-media {
        min-height: 220px;
        aspect-ratio: 4 / 3;
    }
    .visual-strip {
        grid-template-columns: 1fr;
        margin: 0 22px 48px;
    }
    .visual-strip figure {
        min-height: 220px;
    }
    .why-proof-metrics {
        grid-template-columns: 1fr;
    }
    .why-proof-metrics span {
        border-right: 0;
        border-bottom: 1px solid var(--v2-line, rgba(20,35,29,.16));
    }
    .why-proof-metrics span:last-child { border-bottom: 0; }
    .article-cover--wide { aspect-ratio: 4 / 3; }
}

/* front-v5 motion-v3 why clarity patch */
.front-v5 .wild-why-sticky[data-motion-section],
.front-v5 .wild-why-sticky,
.front-v5 .wild-why-sticky * {
    opacity: 1 !important;
}
.front-v5 .wild-why-sticky[data-motion-section] {
    transform: none !important;
}

/* front-v5 image-v4 production photography pass */
.front-v5[data-front-version="front-v5-wildchina-education-image-v4"] {
    --visual-overlay-green: rgba(13, 54, 43, .38);
    --visual-overlay-earth: rgba(172, 89, 38, .24);
}

.front-v5 .wild-hero__image img,
.front-v5 .visual-panel img,
.front-v5 .content-hero-media img,
.front-v5 .article-cover img,
.front-v5 .case-cover img,
.front-v5 .visual-strip img,
.front-v5 .why-proof-visual img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    object-position: center;
    filter: saturate(.88) contrast(1.04) brightness(.94);
}

.front-v5 .wild-hero__image::after,
.front-v5 .content-hero-media::after,
.front-v5 .visual-strip figure::after,
.front-v5 .article-cover::after,
.front-v5 .why-proof-visual::after {
    background: linear-gradient(135deg, rgba(18, 64, 52, .34), rgba(211, 107, 42, .18));
    mix-blend-mode: multiply;
}

.front-v5 .motion-hero-panels-v2 .hero-panel::before {
    opacity: .64;
    filter: saturate(.9) contrast(1.08) brightness(.82);
}

.front-v5 .motion-hero-panels-v2 .hero-panel::after {
    background: linear-gradient(180deg, rgba(13, 54, 43, .24), rgba(12, 24, 20, .72));
}

.front-v5 .motion-hero-panels-v2 .hero-panel:hover::before,
.front-v5 .motion-hero-panels-v2 .hero-panel:focus-visible::before,
.front-v5 .motion-hero-panels-v2 .hero-panel.is-active::before {
    opacity: .82;
    transform: scale(1.08);
}

.front-v5 .wild-hero {
    min-height: calc(100svh - 76px);
    height: auto;
    overflow: visible;
}

.front-v5 .wild-hero h1 {
    max-width: 10.8ch;
    text-wrap: balance;
}

.front-v5 .wild-hero__lead {
    max-width: 42rem;
}

.front-v5 .motion-hero-focus {
    position: relative;
    align-self: end;
    margin: clamp(18px, 2.4vw, 34px) 0 0 clamp(42px, 5.4vw, 104px);
    max-width: min(520px, calc(100vw - 48px));
    z-index: 4;
}

.front-v5 .content-hero-media,
.front-v5 .article-cover,
.front-v5 .visual-strip figure,
.front-v5 .why-proof-visual {
    background: #102f27;
    border: 1px solid rgba(23, 65, 53, .22);
    box-shadow: 0 20px 54px rgba(30, 49, 42, .12);
}

.front-v5 .content-hero-media {
    aspect-ratio: 16 / 10;
    min-height: 360px;
}

.front-v5 .visual-strip figure {
    aspect-ratio: 4 / 5;
}

.front-v5 .article-cover {
    aspect-ratio: 16 / 10;
}

.front-v5 .blog-card--component .article-cover {
    min-height: 220px;
}

.front-v5 .wild-why-sticky {
    grid-template-columns: minmax(320px, 36vw) minmax(0, 1fr) !important;
    gap: clamp(40px, 5vw, 88px) !important;
    align-items: start;
    padding-top: clamp(70px, 7vw, 118px);
    padding-bottom: clamp(70px, 7vw, 118px);
}

.front-v5 .why-sticky-title {
    display: grid;
    gap: 24px;
    align-content: start;
    min-height: auto !important;
}

.front-v5 .why-sticky-title h2 {
    margin: 0;
    max-width: 8ch;
}

.front-v5 .why-proof-visual {
    width: min(100%, 560px);
    aspect-ratio: 4 / 3;
    margin: 4px 0 0;
}

.front-v5 .why-proof-metrics {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    border: 1px solid rgba(23, 65, 53, .18);
    background: rgba(255, 250, 242, .72);
}

.front-v5 .why-proof-metrics span {
    padding: 18px 16px;
    border-right: 1px solid rgba(23, 65, 53, .14);
}

.front-v5 .why-proof-metrics span:last-child { border-right: 0; }
.front-v5 .why-proof-metrics b { display: block; color: var(--wild-terracotta); font-size: clamp(32px, 3vw, 48px); line-height: 1; }
.front-v5 .why-proof-metrics small { display: block; margin-top: 8px; color: var(--wild-fix-green); }

.front-v5 .why-scroll-cards {
    display: grid;
    gap: 28px;
}

.front-v5 .why-scroll-cards article {
    min-height: clamp(240px, 26vw, 360px) !important;
    padding: clamp(34px, 4vw, 64px) !important;
}

.front-v5 .why-scroll-cards article h3 {
    max-width: 16ch;
    text-wrap: balance;
}

@media (max-width: 1020px) {
    .front-v5 .wild-why-sticky { grid-template-columns: 1fr !important; }
    .front-v5 .why-sticky-title { position: static !important; }
    .front-v5 .why-sticky-title h2 { max-width: 12ch; }
    .front-v5 .why-proof-visual { width: 100%; max-height: 440px; }
}

@media (max-width: 760px) {
    .front-v5 .wild-hero { min-height: auto; }
    .front-v5 .motion-hero-focus {
        margin: 16px 18px 0;
        max-width: none;
    }
    .front-v5 .content-hero-media { min-height: 240px; aspect-ratio: 4 / 3; }
    .front-v5 .visual-strip { grid-template-columns: repeat(3, minmax(76vw, 1fr)); }
    .front-v5 .visual-strip figure { aspect-ratio: 4 / 3; }
    .front-v5 .why-proof-metrics { grid-template-columns: 1fr; }
    .front-v5 .why-proof-metrics span { border-right: 0; border-bottom: 1px solid rgba(23, 65, 53, .14); }
    .front-v5 .why-proof-metrics span:last-child { border-bottom: 0; }
    .front-v5 .why-scroll-cards article { min-height: auto !important; }
}