:root {
            --blue: #007BFF; --blue-hover: #0056B3; --blue-light: #E8F4FF;
            --black: #0D0D0D; --white: #FFFFFF; --snow: #FAFAFA; --silver: #F5F5F5; --cream: #F8F9FA;
            --ink: #1A1A1A; --ink-2: #4A4A4A; --ink-3: #6C757D;
            --r-sm: 4px; --r-md: 8px; --r-lg: 12px; --r-xl: 16px; --r-2xl: 24px; --r-3xl: 32px; --r-full: 9999px;
            --shadow-sm: 0 1px 2px 0 rgba(0,0,0,0.05); --shadow-md: 0 4px 6px -1px rgba(0,0,0,0.1), 0 2px 4px -1px rgba(0,0,0,0.06);
            --shadow-lg: 0 10px 15px -3px rgba(0,0,0,0.1), 0 4px 6px -2px rgba(0,0,0,0.05);
            --shadow-xl: 0 20px 25px -5px rgba(0,0,0,0.1), 0 10px 10px -5px rgba(0,0,0,0.04);
            --ease: cubic-bezier(0.4, 0, 0.2, 1); --ease-out: cubic-bezier(0, 0, 0.2, 1);
            --dur: 0.3s;
        }
        *, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }
        html { scroll-behavior: smooth; -webkit-font-smoothing: antialiased; }
        body {
            font-family: "PingFang SC", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, "SF Pro Display", Arial, sans-serif;
            color: var(--ink); background: var(--white); line-height: 1.6; overflow-x: hidden;
        }
        a { text-decoration: none; color: inherit; } ul { list-style: none; } img { max-width: 100%; display: block; }

        /* ===== 导航栏（与V8一致） ===== */
        .nav-wrapper { position: fixed; top: 0; left: 0; width: 100%; z-index: var(--hg-z-sticky); }
        .nav {
            height: 72px; display: flex; align-items: center; justify-content: space-between;
            padding: 0 80px; background: rgba(255,255,255,0.97); backdrop-filter: blur(20px);
            box-shadow: 0 1px 0 rgba(0,0,0,0.04); transition: all 0.3s var(--ease-out);
        }
        .nav-logo { display: flex; align-items: center; gap: 10px; font-size: 18px; font-weight: 700; color: var(--ink); }
        .nav-logo-icon { width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
        .nav-logo-icon img { width: 36px; height: auto; object-fit: contain; }
        .nav-links { display: flex; align-items: center; height: 100%; }
        .nav-item { position: relative; height: 72px; display: flex; align-items: center; }
        .nav-item-link {
            font-size: 15px; font-weight: 500; color: var(--ink-2); padding: 0 24px; height: 72px;
            display: flex; align-items: center; transition: color 0.2s var(--ease-out); cursor: pointer;
        }
        .nav-item-link::after { content: ''; position: absolute; bottom: 0; left: 24px; right: 24px; height: 2px; background: var(--blue); transform: scaleX(0); transition: transform 0.3s var(--ease-out); }
        .nav-item:hover .nav-item-link { color: var(--blue); }
        .nav-item:hover .nav-item-link::after { transform: scaleX(1); }
        .nav-arrow { display: inline-block; width: 0; height: 0; border-left: 4px solid transparent; border-right: 4px solid transparent; border-top: 4px solid currentColor; margin-left: var(--hg-space-1); transition: transform 0.3s var(--ease-out); vertical-align: middle; }
        .nav-item:hover .nav-arrow { transform: rotate(180deg); }

        /* Mega Menu */
        .mega-menu {
            position: fixed; top: 72px; left: 0; width: 100vw;
            background: rgba(255,255,255,0.98); backdrop-filter: blur(24px);
            box-shadow: 0 12px 48px rgba(0,0,0,0.10), 0 2px 6px rgba(0,0,0,0.04);
            opacity: 0; visibility: hidden; transform: translateY(-8px);
            transition: opacity 0.3s cubic-bezier(0.16, 1, 0.3, 1), transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), visibility 0.3s step-end;
            z-index: var(--hg-z-floating); pointer-events: none;
        }
        .mega-menu.active { opacity: 1; visibility: visible; transform: translateY(0); pointer-events: auto; transition: opacity 0.35s, transform 0.35s, visibility 0.35s step-start; }
        .mega-menu-inner { max-width: 1200px; margin: 0 auto; padding: var(--hg-space-10) var(--hg-space-16); }
        .mega-grid { display: grid; gap: 16px; grid-template-columns: repeat(3, 1fr); }
        .mega-card { display: flex; flex-direction: column; gap: 12px; padding: var(--hg-space-6) var(--hg-space-5); border-radius: var(--r-xl); background: #F8FAFC; border: 1px solid rgba(0,0,0,0.05); transition: all 0.28s; cursor: pointer; min-height: 160px; }
        .mega-card:hover { background: #fff; border-color: rgba(0,123,255,0.14); box-shadow: 0 4px 20px rgba(0,100,200,0.08); transform: translateY(-3px); }
        .mega-card-icon { width: 44px; height: 44px; min-width: 44px; background: linear-gradient(135deg, #EBF2FF 0%, #E0ECFF 100%); border-radius: var(--r-lg); display: grid; place-items: center; transition: all 0.28s; }
        .mega-card:hover .mega-card-icon { background: linear-gradient(135deg, #007BFF 0%, #0056B3 100%); box-shadow: 0 4px 14px rgba(0,123,255,0.25); transform: scale(1.06); }
        .mega-card-icon svg { width: 22px; height: 22px; stroke: #2563EB; fill: none; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; transition: stroke 0.28s; }
        .mega-card:hover .mega-card-icon svg { stroke: #fff; }
        .mega-card-title { font-size: 15px; font-weight: 650; color: var(--hg-color-ink); line-height: 1.35; }
        .mega-card:hover .mega-card-title { color: var(--hg-color-brand); }
        .mega-card-desc { font-size: 13px; color: var(--hg-color-muted); line-height: 1.55; }
        .mega-card-tag { display: inline-block; margin-top: auto; padding: var(--hg-space-0-5) var(--hg-space-2); background: #EFF6FF; color: var(--hg-color-brand-strong); font-size: 11px; font-weight: 600; border-radius: var(--r-full); }
        .mega-list { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; }
        .mega-list-item { display: flex; align-items: center; gap: 14px; padding: var(--hg-space-4) var(--hg-space-4); border-radius: var(--r-lg); transition: all 0.22s; cursor: pointer; border: 1px solid transparent; }
        .mega-list-item:hover { background: #F5F7FA; border-color: rgba(0,123,255,0.06); }
        .mega-list-icon { width: 42px; height: 42px; min-width: 42px; background: var(--silver); border-radius: var(--r-lg); display: grid; place-items: center; transition: all 0.25s; }
        .mega-list-item:hover .mega-list-icon { background: var(--blue); }
        .mega-list-icon svg { width: 20px; height: 20px; stroke: var(--ink-3); fill: none; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; transition: stroke 0.25s; }
        .mega-list-item:hover .mega-list-icon svg { stroke: #fff; }
        .mega-list-title { font-size: var(--hg-font-sm); font-weight: 600; color: var(--ink); }
        .mega-list-item:hover .mega-list-title { color: var(--blue); }
        .mega-list-desc { font-size: 12px; color: var(--ink-3); }
        .nav-right { display: flex; align-items: center; gap: 16px; z-index: 10; }
        .nav-lang { font-size: 14px; font-weight: 500; color: var(--ink-3); cursor: pointer; padding: var(--hg-space-1) var(--hg-space-3); border-radius: var(--r-md); transition: all 0.2s; }
        .nav-lang:hover { color: var(--blue); background: var(--blue-light); }
        .btn { display: inline-flex; align-items: center; gap: 6px; font-size: 14px; font-weight: 600; padding: 10px 20px; border-radius: var(--r-md); border: none; cursor: pointer; transition: all 0.2s var(--ease-out); white-space: nowrap; }
        .btn-primary { background: var(--blue); color: #fff; box-shadow: 0 4px 12px rgba(0,123,255,0.3); }
        .btn-primary:hover { background: var(--blue-hover); transform: translateY(-1px); }

        /* ===== Bike Apple-style redesign ===== */
        .bike-page {
            --apple-bg: #f5f5f7;
            --apple-surface: #ffffff;
            --apple-ink: #1d1d1f;
            --apple-muted: #6e6e73;
            --apple-line: rgba(0,0,0,0.08);
            --apple-shadow: 0 24px 70px rgba(0, 30, 68, 0.10);
            background: var(--apple-bg); color: var(--apple-ink);
        }
        .bike-hero {
            position: relative; min-height: 100dvh; padding: 132px 80px 70px;
            display: flex; flex-direction: column; align-items: center; justify-content: flex-start;
            overflow: hidden; isolation: isolate; background:
                radial-gradient(circle at 50% 24%, rgba(0,123,255,0.13), transparent 34%),
                linear-gradient(180deg, #fbfbfd 0%, #f5f5f7 74%, #ededf0 100%);
        }
        .bike-hero-content { width: min(860px, 100%); color: var(--apple-ink); text-align: center; }
        .bike-kicker {
            display: inline-flex; margin-bottom: 18px; padding: 8px 15px;
            border-radius: var(--r-full); background: rgba(255,255,255,0.72);
            border: 1px solid rgba(0,0,0,0.08); backdrop-filter: blur(18px);
            color: var(--apple-muted); font-size: 14px; font-weight: 650;
        }
        .bike-hero h1 {
            font-size: var(--hg-font-fluid-display); line-height: var(--hg-line-solid); letter-spacing: -0.055em;
            font-weight: 780; margin-bottom: var(--hg-space-5);
        }
        .bike-hero-content > p:not(.bike-kicker) {
            max-width: 620px; margin: 0 auto 28px; color: var(--apple-muted);
            font-size: var(--hg-font-fluid-title); line-height: 1.5;
        }
        .bike-hero-actions { display: flex; justify-content: center; gap: 14px; flex-wrap: wrap; }
        .bike-hero-stage {
            width: min(1320px, calc(100vw - 88px)); margin-top: 54px;
            border-radius: 36px; overflow: hidden; background: #e8edf5;
            box-shadow: 0 34px 100px rgba(0, 30, 68, 0.18);
            border: 1px solid rgba(255,255,255,0.9);
        }
        .bike-hero-stage img { width: 100%; aspect-ratio: 16 / 8.3; object-fit: cover; object-position: center 54%; }
        .bike-button {
            display: inline-flex; align-items: center; justify-content: center;
            min-height: 48px; padding: 0 24px; border-radius: var(--r-full);
            font-size: 15px; font-weight: 700; white-space: nowrap;
            transition: transform 0.25s var(--ease-out), background 0.25s var(--ease-out), border-color 0.25s var(--ease-out);
        }
        .bike-button:active { transform: translateY(1px) scale(0.99); }
        .bike-button-primary { background: var(--blue); color: #fff; box-shadow: 0 14px 32px rgba(0,123,255,0.28); }
        .bike-button-primary:hover { background: var(--blue-hover); transform: translateY(-2px); }
        .bike-button-secondary {
            color: #0071e3; background: rgba(255,255,255,0.78); border: 1px solid rgba(0,113,227,0.24);
            backdrop-filter: blur(18px); box-shadow: 0 10px 30px rgba(0, 30, 68, 0.07);
        }
        .bike-button-secondary:hover { background: #fff; transform: translateY(-2px); }

        .bike-proof { padding: 0 var(--hg-space-20) var(--hg-space-24); background: var(--apple-bg); }
        .bike-proof-inner {
            max-width: 1280px; margin: -26px auto 0; position: relative;
            display: grid; grid-template-columns: repeat(3, 1fr) 1.45fr; gap: 14px;
        }
        .bike-proof-item,
        .bike-proof-copy {
            background: rgba(255,255,255,0.78); border: 1px solid rgba(255,255,255,0.86);
            border-radius: 28px; box-shadow: var(--apple-shadow);
            backdrop-filter: blur(20px);
        }
        .bike-proof-item { min-height: 172px; padding: 26px; display: flex; flex-direction: column; justify-content: flex-end; }
        .bike-proof-item strong {
            display: block; color: var(--blue); font-size: var(--hg-font-fluid-heading);
            line-height: 1; letter-spacing: -0.035em; font-family: "DIN Alternate", "Roboto Mono", sans-serif;
        }
        .bike-proof-item span { margin-top: 12px; color: var(--ink-3); font-size: 14px; }
        .bike-proof-copy { padding: 30px; }
        .bike-proof-copy h2 { font-size: clamp(28px, 3vw, 42px); line-height: 1.08; letter-spacing: -0.03em; margin-bottom: 14px; }
        .bike-proof-copy p { color: var(--apple-muted); font-size: 16px; line-height: 1.75; }

        .bike-section,
        .bike-product,
        .bike-business,
        .bike-campus { padding: 104px 80px; }
        .bike-section-head,
        .product-copy {
            max-width: 760px; margin: 0 auto 46px; text-align: center;
        }
        .bike-section-head h2,
        .product-copy h2,
        .bike-campus-copy h2,
        .bike-business-card h2 {
            font-size: clamp(34px, 4.5vw, 62px); line-height: var(--hg-line-compact);
            letter-spacing: -0.042em; font-weight: 750; margin-bottom: 16px;
        }
        .bike-section-head p,
        .product-copy p,
        .bike-campus-copy p,
        .bike-business-card p {
            color: var(--apple-muted); font-size: 17px; line-height: 1.75;
        }
        .advantage-stack { max-width: 1280px; margin: 0 auto; display: grid; gap: 18px; }
        .advantage-pair { display: grid; grid-template-columns: repeat(2, 1fr); gap: 18px; }
        .advantage-card {
            position: relative; min-height: 520px; overflow: hidden; border-radius: 36px;
            background: var(--apple-surface); color: var(--apple-ink); box-shadow: var(--apple-shadow);
            border: 1px solid rgba(255,255,255,0.86);
        }
        .advantage-card-large { min-height: 640px; }
        .advantage-card img { width: 100%; height: 100%; object-fit: cover; position: absolute; inset: 0; opacity: 1; transition: transform 0.8s var(--ease-out); }
        .advantage-card::after {
            content: ""; position: absolute; inset: 0;
            background: linear-gradient(0deg, rgba(245,245,247,0.96) 0%, rgba(245,245,247,0.72) 34%, rgba(245,245,247,0.04) 74%);
        }
        .advantage-card:hover img { transform: scale(1.035); }
        .advantage-card > div { position: absolute; left: 34px; right: 34px; bottom: 34px; z-index: 1; }
        .advantage-card h3 { font-size: var(--hg-font-fluid-heading); line-height: 1.08; letter-spacing: -0.03em; margin-bottom: 12px; }
        .advantage-card p { max-width: 580px; color: var(--apple-muted); font-size: 16px; line-height: 1.7; }

        .bike-blueberry {
            padding: 104px 80px;
            background: #fff;
            color: var(--apple-ink);
        }
        .bike-blueberry-layout {
            max-width: 1280px;
            margin: 0 auto;
            display: grid;
            grid-template-areas:
                "head media"
                "list media";
            grid-template-columns: minmax(0, 0.88fr) minmax(440px, 1.12fr);
            grid-template-rows: auto 1fr;
            gap: var(--hg-space-10) clamp(var(--hg-space-12), 7vw, var(--hg-space-24));
            align-items: center;
        }
        .bike-blueberry-head { grid-area: head; align-self: end; }
        .bike-blueberry-eyebrow {
            margin: 0 0 16px;
            color: var(--blue);
            font-size: 13px;
            font-weight: 700;
        }
        .bike-blueberry-heading {
            max-width: 11em;
            margin: 0;
            color: var(--apple-ink);
            font-size: clamp(34px, 4.5vw, 62px);
            font-weight: 750;
            line-height: 1.08;
            letter-spacing: -0.042em;
        }
        .bike-blueberry-lead {
            max-width: 36em;
            margin: 18px 0 0;
            color: var(--apple-muted);
            font-size: 17px;
            line-height: 1.75;
        }
        .bike-blueberry-media {
            grid-area: media;
            height: 100%;
            min-height: 560px;
            margin: 0;
            overflow: hidden;
            border-radius: 24px;
            background: #eef4f8;
        }
        .bike-blueberry-media img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            object-position: 42% center;
            transition: transform 700ms var(--ease-out);
        }
        .bike-blueberry-list { grid-area: list; align-self: start; border-top: 1px solid var(--apple-line); }
        .bike-blueberry-item {
            display: grid;
            grid-template-columns: 36px minmax(0, 1fr);
            gap: 16px;
            align-items: start;
            margin: 0 -12px;
            padding: var(--hg-space-4) var(--hg-space-3);
            border-bottom: 1px solid var(--apple-line);
            border-radius: 8px;
            transition: background-color 260ms var(--ease-out);
        }
        .bike-blueberry-item > span {
            display: grid;
            width: 32px;
            height: 32px;
            place-items: center;
            border: 1px solid rgba(37, 99, 235, 0.2);
            border-radius: 50%;
            color: #2563eb;
            font-size: 11px;
            font-weight: 700;
            transition: background-color 260ms var(--ease-out), color 260ms var(--ease-out);
        }
        .bike-blueberry-item h3 { margin: var(--hg-space-0-5) 0 var(--hg-space-2); font-size: 20px; line-height: 1.35; }
        .bike-blueberry-item p { margin: 0; color: var(--apple-muted); font-size: 14px; line-height: 1.65; }
        .bike-blueberry-item:hover { background: rgba(37, 99, 235, 0.045); }
        .bike-blueberry-item:hover > span { background: #2563eb; color: #fff; }
        .bike-blueberry-layout:hover .bike-blueberry-media img { transform: scale(1.025); }

        .bike-product { background: #fff; }
        .product-grid {
            max-width: 1280px; margin: 0 auto; display: grid;
            grid-template-columns: repeat(4, 1fr); grid-auto-rows: minmax(210px, auto); gap: 16px;
        }
        .product-tile {
            min-height: 230px; padding: 26px; border-radius: 30px;
            background: #f5f5f7; border: 1px solid rgba(0,0,0,0.04);
            display: flex; flex-direction: column; justify-content: flex-end; overflow: hidden;
        }
        .product-tile span { color: var(--blue); font-size: 13px; font-weight: 700; margin-bottom: 10px; }
        .product-tile h3 { font-size: 22px; line-height: 1.18; letter-spacing: -0.02em; margin-bottom: var(--hg-space-2); }
        .product-tile p { color: var(--ink-3); font-size: 14px; line-height: 1.65; }
        .product-tile-blue {
            background: linear-gradient(145deg, #007BFF 0%, #0066d6 100%); color: #fff; border-color: transparent;
        }
        .product-tile-blue span,
        .product-tile-blue p { color: rgba(255,255,255,0.78); }
        .product-tile-image { grid-column: span 2; grid-row: span 2; padding: 0; background: #EAF2FF; }
        .product-tile-image img { width: 100%; height: 100%; object-fit: cover; }

        .bike-business { background: var(--apple-bg); }
        .bike-business-card {
            max-width: 1180px; margin: 0 auto; padding: 48px;
            display: flex; align-items: center; justify-content: space-between; gap: 32px;
            border-radius: 36px; background: #1d1d1f; color: #fff;
            box-shadow: 0 28px 80px rgba(3,18,36,0.18);
        }
        .bike-business-card p { color: rgba(255,255,255,0.72); max-width: 560px; }

        .bike-campus {
            max-width: 1280px; margin: 0 auto; display: grid;
            grid-template-columns: 1.1fr 0.9fr; gap: 28px; align-items: center;
        }
        .bike-campus-media { border-radius: 36px; overflow: hidden; background: #EAF2FF; box-shadow: var(--apple-shadow); border: 1px solid rgba(255,255,255,0.86); }
        .bike-campus-media img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; }
        .bike-campus-copy { padding: var(--hg-space-5) 0 var(--hg-space-5) var(--hg-space-8); }
        .campus-metrics { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; margin: var(--hg-space-6) 0 var(--hg-space-5); }
        .campus-metrics div {
            padding: 22px; border-radius: var(--r-2xl); background: #fff;
            border: 1px solid rgba(0,0,0,0.05); box-shadow: var(--shadow-sm);
        }
        .campus-metrics strong {
            display: block; color: var(--blue); font-size: 34px; line-height: 1;
            font-family: "DIN Alternate", "Roboto Mono", sans-serif; letter-spacing: -0.03em;
        }
        .campus-metrics span { display: block; margin-top: var(--hg-space-2); color: var(--ink-3); font-size: 13px; }
        .campus-list { display: flex; flex-wrap: wrap; gap: 10px; }
        .campus-list span {
            padding: 9px 14px; border-radius: var(--r-full);
            background: #f5f5f7; color: var(--hg-color-brand-strong); font-size: 13px; font-weight: 650;
        }

        .cta-section { background: #fff; padding: var(--hg-space-24) var(--hg-space-20); text-align: center; color: var(--apple-ink); }
        .cta-section h2 { font-size: var(--hg-font-fluid-heading); font-weight: 740; margin-bottom: 16px; letter-spacing: -0.03em; }
        .cta-section p { font-size: 17px; color: var(--apple-muted); max-width: 540px; margin: 0 auto var(--hg-space-8); line-height: 1.65; }
        .btn-cta-white { display: inline-flex; align-items: center; justify-content: center; min-height: 50px; padding: 0 var(--hg-space-8); font-size: 16px; font-weight: 700; background: var(--blue); color: #fff; border: none; border-radius: var(--r-full); cursor: pointer; transition: all 0.3s var(--ease-out); box-shadow: 0 14px 32px rgba(0,123,255,0.24); }
        .btn-cta-white:hover { transform: translateY(-2px); background: var(--blue-hover); box-shadow: 0 18px 42px rgba(0,123,255,0.26); }

        /* Footer */
        .footer { background: #f5f5f7; color: var(--apple-ink); padding: var(--hg-space-14) var(--hg-space-20) var(--hg-space-8); border-top: 1px solid rgba(0,0,0,0.07); }
        .footer-inner { max-width: 1200px; margin: 0 auto; }
        .footer-grid { display: grid; grid-template-columns: 1.5fr 1fr 1fr 1fr 1fr; gap: 48px; margin-bottom: 48px; }
        .footer-brand .nav-logo { color: var(--apple-ink); margin-bottom: 16px; }
        .footer-brand > p { font-size: 14px; color: var(--apple-muted); line-height: 1.8; margin-bottom: 20px; }
        .footer-socials { display: flex; gap: 10px; }
        .social-btn { width: 40px; height: 40px; background: #fff; border: 1px solid rgba(0,0,0,0.07); border-radius: var(--r-md); display: grid; place-items: center; transition: all 0.3s; }
        .social-btn svg { width: 18px; height: 18px; stroke: var(--apple-muted); fill: none; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
        .social-btn:hover { background: var(--blue); border-color: var(--blue); transform: translateY(-2px); }
        .social-btn:hover svg { stroke: #fff; }
        .footer-col h4 { font-size: 16px; font-weight: 650; color: var(--apple-ink); margin-bottom: 20px; }
        .footer-col li { margin-bottom: 12px; }
        .footer-col a { font-size: 14px; color: var(--apple-muted); transition: color 0.2s; }
        .footer-col a:hover { color: var(--blue); }
        .footer-divider { height: 1px; background: rgba(0,0,0,0.07); margin-bottom: 28px; }
        .footer-bottom { display: flex; justify-content: space-between; align-items: center; font-size: 13px; color: var(--apple-muted); }
        .footer-legal { display: flex; gap: 24px; }
        .footer-legal a { color: var(--apple-muted); }
        .footer-legal a:hover { color: var(--blue); }

        /* 动画 */
        .reveal { opacity: 0; transform: translateY(30px); transition: opacity 0.7s var(--ease-out), transform 0.7s var(--ease-out); }
        .reveal.visible { opacity: 1; transform: translateY(0); }

        @media (max-width: 1024px) {
            .nav { padding: 0 24px; } .nav-links { display: none; }
            .bike-hero { padding: 112px 32px 64px; min-height: 86dvh; }
            .bike-hero-stage { width: min(100%, calc(100vw - 64px)); border-radius: 30px; }
            .bike-proof { padding: var(--hg-space-6) var(--hg-space-8) var(--hg-space-18); }
            .bike-proof-inner { grid-template-columns: repeat(3, 1fr); }
            .bike-proof-copy { grid-column: 1 / -1; }
            .bike-section,
            .bike-product,
            .bike-business,
            .bike-campus,
            .bike-blueberry { padding: var(--hg-space-18) var(--hg-space-8); }
            .advantage-card,
            .advantage-card-large { min-height: 480px; }
            .product-grid { grid-template-columns: repeat(2, 1fr); }
            .bike-campus { grid-template-columns: 1fr; }
            .bike-campus-copy { padding: var(--hg-space-5) 0 0; }
            .bike-blueberry-layout {
                grid-template-areas:
                    "head media"
                    "list media";
                grid-template-columns: minmax(0, 0.88fr) minmax(0, 1.12fr);
                grid-template-rows: auto 1fr;
                gap: var(--hg-space-8) clamp(var(--hg-space-6), 5vw, var(--hg-space-14));
            }
            .bike-blueberry-heading,
            .bike-blueberry-lead { max-width: none; }
            .bike-blueberry-media { min-height: 420px; }
            .cta-section { padding: var(--hg-space-16) var(--hg-space-6); }
            .footer { padding: var(--hg-space-12) var(--hg-space-6) var(--hg-space-6); }
            .footer-grid { grid-template-columns: repeat(2, 1fr); gap: 32px; }
        }
        @media (max-width: 768px) {
            .nav-right .btn { display: none; }
            .nav-right { gap: 8px; }
            .bike-hero { min-height: auto; padding: 104px 20px 44px; }
            .bike-hero h1 { font-size: var(--hg-font-fluid-heading); }
            .bike-hero-content > p:not(.bike-kicker) { max-width: 270px; font-size: 17px; overflow-wrap: anywhere; }
            .bike-hero-actions { width: min(100%, 350px); margin: 0 auto; }
            .bike-hero-stage { width: 100%; margin-top: 34px; border-radius: 24px; }
            .bike-hero-stage img { aspect-ratio: 4 / 3.2; object-position: center center; }
            .bike-hero-actions,
            .bike-business-card { align-items: stretch; flex-direction: column; }
            .bike-button { width: 100%; }
            .bike-proof { padding: var(--hg-space-4) var(--hg-space-5) var(--hg-space-14); }
            .bike-proof-inner { grid-template-columns: 1fr; margin-top: -44px; }
            .bike-proof-item { min-height: 136px; }
            .bike-section,
            .bike-product,
            .bike-business,
            .bike-campus,
            .bike-blueberry { padding: var(--hg-space-14) var(--hg-space-5); }
            .bike-section-head,
            .product-copy { text-align: left; margin-bottom: 30px; }
            .advantage-pair,
            .product-grid,
            .campus-metrics { grid-template-columns: 1fr; }
            .advantage-card,
            .advantage-card-large { min-height: 430px; border-radius: var(--r-2xl); }
            .advantage-card > div { left: 22px; right: 22px; bottom: 22px; }
            .product-tile,
            .bike-business-card,
            .bike-campus-media { border-radius: var(--r-2xl); }
            .bike-blueberry-layout {
                grid-template-areas:
                    "head"
                    "media"
                    "list";
                grid-template-columns: 1fr;
                grid-template-rows: auto;
                gap: var(--hg-space-6);
            }
            .bike-blueberry-media { min-height: 0; aspect-ratio: 4 / 3; border-radius: var(--r-2xl); }
            .bike-blueberry-item { grid-template-columns: 32px minmax(0, 1fr); gap: 12px; margin: 0; padding: 18px 0; border-radius: 0; }
            .bike-blueberry-item > span { width: 28px; height: 28px; }
            .bike-blueberry-item h3 { margin-top: 0; font-size: 19px; }
            .product-tile-image { grid-column: auto; min-height: 280px; }
            .footer-grid { grid-template-columns: 1fr; gap: 24px; }
            .footer-bottom { flex-direction: column; gap: 12px; text-align: center; }
        }
        @media (prefers-reduced-motion: reduce) {
            *, *::before, *::after { animation-duration: 0.001ms !important; transition-duration: 0.001ms !important; scroll-behavior: auto !important; }
            .advantage-card:hover img,
            .bike-button-primary:hover,
            .bike-button-secondary:hover,
            .btn-cta-white:hover,
            .bike-blueberry-layout:hover .bike-blueberry-media img { transform: none; }
            .bike-blueberry-item,
            .bike-blueberry-item > span,
            .bike-blueberry-media img { transition: none; }
        }