/* roulang page: index */
:root {
            --wine: #3b172c;
            --berry: #672448;
            --berry-light: #8f3560;
            --coral: #f26f52;
            --coral-dark: #d8553e;
            --cream: #fffaf5;
            --paper: #f5eee9;
            --ink: #271d25;
            --muted: #786d74;
            --line: #e8dcd7;
            --soft: #f9f0ed;
            --shadow: 0 18px 45px rgba(59, 23, 44, .10);
            --radius: 18px;
        }

        * { box-sizing: border-box; }
        html { scroll-behavior: smooth; }
        body {
            margin: 0;
            color: var(--ink);
            background: var(--paper);
            font-family: 'Noto Sans SC', 'PingFang SC', 'Microsoft YaHei', sans-serif;
            line-height: 1.75;
            -webkit-font-smoothing: antialiased;
        }
        a { color: inherit; text-decoration: none; }
        button, input, select, textarea { font: inherit; }
        button { cursor: pointer; }
        :focus-visible {
            outline: 3px solid rgba(242,111,82,.48);
            outline-offset: 3px;
        }
        .shell { min-height: 100vh; }
        .sidebar {
            position: fixed;
            z-index: 30;
            inset: 0 auto 0 0;
            width: 252px;
            padding: 28px 18px 22px;
            color: #fff7f4;
            background: var(--wine);
            border-right: 1px solid rgba(255,255,255,.08);
            display: flex;
            flex-direction: column;
        }
        .brand {
            display: flex;
            gap: 11px;
            align-items: center;
            padding: 4px 10px 30px;
        }
        .brand-mark {
            width: 38px;
            height: 38px;
            border: 1px solid rgba(255,255,255,.55);
            border-radius: 50%;
            display: grid;
            place-items: center;
            color: var(--coral);
            font-size: 17px;
            font-weight: 800;
            position: relative;
        }
        .brand-mark:after {
            content: "";
            position: absolute;
            width: 9px;
            height: 9px;
            right: -3px;
            top: 1px;
            background: var(--coral);
            border-radius: 50%;
            border: 3px solid var(--wine);
        }
        .brand-name {
            font-size: 14px;
            line-height: 1.35;
            font-weight: 800;
            letter-spacing: .02em;
        }
        .brand-name small {
            display: block;
            color: #d4bfc7;
            font-size: 10px;
            font-weight: 500;
            margin-top: 3px;
        }
        .nav-label {
            padding: 0 12px 10px;
            color: #bda5ae;
            font-size: 10px;
            letter-spacing: .16em;
        }
        .nav-list { display: grid; gap: 7px; }
        .nav-link {
            display: flex;
            align-items: center;
            gap: 12px;
            min-height: 48px;
            padding: 0 13px;
            border-left: 3px solid transparent;
            border-radius: 8px;
            color: #d8c7cd;
            font-size: 14px;
            transition: .2s ease;
        }
        .nav-link:hover { color: #fff; background: rgba(255,255,255,.08); }
        .nav-link.active {
            color: #fff;
            border-left-color: var(--coral);
            background: rgba(242,111,82,.16);
        }
        .nav-icon {
            width: 20px;
            color: var(--coral);
            font-size: 16px;
            text-align: center;
        }
        .side-bottom {
            margin-top: auto;
            padding: 16px 12px 0;
            border-top: 1px solid rgba(255,255,255,.12);
        }
        .status-line {
            display: flex;
            align-items: center;
            gap: 8px;
            color: #dbcad0;
            font-size: 12px;
        }
        .status-dot {
            width: 7px;
            height: 7px;
            background: #f6b36d;
            border-radius: 50%;
            box-shadow: 0 0 0 4px rgba(246,179,109,.12);
        }
        .side-note { color: #aa929b; font-size: 11px; margin: 10px 0 0; line-height: 1.7; }
        .main { margin-left: 252px; }
        .mobile-bar {
            display: none;
            height: 64px;
            position: sticky;
            top: 0;
            z-index: 25;
            align-items: center;
            justify-content: space-between;
            padding: 0 18px;
            color: #fff;
            background: var(--wine);
        }
        .menu-button {
            width: 42px;
            height: 42px;
            border: 1px solid rgba(255,255,255,.2);
            border-radius: 9px;
            color: white;
            background: transparent;
        }
        .container { width: min(1180px, calc(100% - 64px)); margin: 0 auto; }
        .section { padding: 78px 0; }
        .eyebrow {
            display: inline-flex;
            align-items: center;
            gap: 8px;
            color: var(--berry-light);
            font-size: 11px;
            font-weight: 800;
            letter-spacing: .14em;
        }
        .eyebrow:before {
            content: "";
            width: 24px;
            height: 3px;
            background: var(--coral);
            transform: skew(-28deg);
        }
        .section-head { margin-bottom: 30px; }
        .section-title {
            margin: 8px 0 8px;
            color: var(--wine);
            font-size: clamp(24px, 3vw, 38px);
            line-height: 1.25;
            letter-spacing: -.04em;
            font-weight: 900;
        }
        .section-desc { max-width: 680px; color: var(--muted); font-size: 14px; }
        .hero {
            position: relative;
            overflow: hidden;
            padding: 76px 0 54px;
            color: #fff8f4;
            background: var(--berry);
        }
        .hero:before, .hero:after {
            content: "";
            position: absolute;
            pointer-events: none;
            transform: skew(-24deg);
        }
        .hero:before {
            width: 45%;
            height: 180%;
            right: 2%;
            top: -35%;
            background: rgba(242,111,82,.16);
        }
        .hero:after {
            width: 18%;
            height: 140%;
            right: 30%;
            top: -20%;
            background: rgba(255,211,180,.08);
        }
        .hero-inner { position: relative; z-index: 1; }
        .hero-copy { max-width: 750px; }
        .hero .eyebrow { color: #ffc1ad; }
        .hero h1 {
            margin: 15px 0 18px;
            max-width: 820px;
            font-size: clamp(34px, 5.2vw, 68px);
            line-height: 1.12;
            letter-spacing: -.065em;
            font-weight: 900;
        }
        .hero-text { max-width: 680px; color: #ead8d8; font-size: 16px; }
        .hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }
        .btn {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            min-height: 46px;
            padding: 0 20px;
            border: 1px solid transparent;
            border-radius: 9px;
            font-size: 13px;
            font-weight: 800;
            transition: transform .2s, background .2s, border-color .2s, box-shadow .2s;
        }
        .btn:hover { transform: translateY(-2px); }
        .btn:active { transform: translateY(0) scale(.98); }
        .btn-primary { color: #351421; background: var(--coral); box-shadow: 0 9px 20px rgba(242,111,82,.22); }
        .btn-primary:hover { background: #ff896d; }
        .btn-ghost { color: white; border-color: rgba(255,255,255,.32); background: rgba(255,255,255,.06); }
        .btn-ghost:hover { border-color: rgba(255,255,255,.65); background: rgba(255,255,255,.12); }
        .metric-grid {
            display: grid;
            grid-template-columns: repeat(4, 1fr);
            gap: 12px;
            margin-top: 52px;
        }
        .metric {
            min-height: 115px;
            padding: 17px;
            border: 1px solid rgba(255,255,255,.16);
            border-radius: 12px;
            background: rgba(37,13,31,.28);
        }
        .metric-number {
            color: #fff;
            font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
            font-size: 28px;
            font-weight: 800;
            line-height: 1;
        }
        .metric-label { margin-top: 10px; color: #e8d3d5; font-size: 12px; }
        .metric-status { display: flex; align-items: center; gap: 6px; margin-top: 10px; color: #ffb59e; font-size: 10px; }
        .metric-status:before { content: ""; width: 20px; height: 2px; background: var(--coral); }
        .matrix { background: var(--cream); }
        .matrix-grid {
            display: grid;
            grid-template-columns: 1.2fr .8fr .8fr;
            grid-template-rows: auto auto;
            gap: 15px;
        }
        .matrix-card {
            position: relative;
            min-height: 190px;
            padding: 25px;
            border: 1px solid var(--line);
            border-radius: var(--radius);
            background: #fff;
            box-shadow: 0 4px 0 rgba(59,23,44,.025);
            transition: .22s ease;
        }
        .matrix-card:hover { transform: translateY(-4px); border-color: var(--coral); box-shadow: var(--shadow); }
        .matrix-card.featured { grid-row: span 2; color: #fff; background: var(--wine); border-color: var(--wine); }
        .matrix-card.wide { grid-column: span 2; min-height: 148px; }
        .card-tag, .pill {
            display: inline-flex;
            align-items: center;
            min-height: 24px;
            padding: 0 9px;
            border-radius: 5px;
            color: var(--berry);
            background: #f6e1db;
            font-size: 10px;
            font-weight: 800;
        }
        .featured .card-tag { color: #fff; background: rgba(242,111,82,.22); }
        .matrix-card h3 { margin: 18px 0 7px; color: inherit; font-size: 20px; line-height: 1.35; }
        .matrix-card p { margin: 0; color: var(--muted); font-size: 13px; }
        .featured p { color: #d7c1c7; }
        .card-foot { position: absolute; right: 22px; bottom: 20px; color: var(--coral); font-size: 13px; font-weight: 800; }
        .matrix-card:not(.featured) .card-foot { color: var(--berry); }
        .compare { background: #efe5e1; }
        .compare-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
        .compare-box { padding: 28px; border-radius: var(--radius); background: #fff; border: 1px solid var(--line); }
        .compare-box.highlight { color: #fff; background: var(--berry); border-color: var(--berry); }
        .compare-box h3 { margin: 0 0 10px; font-size: 18px; }
        .compare-box p { color: var(--muted); font-size: 13px; }
        .highlight p { color: #e7cbd4; }
        .bar-row { margin-top: 20px; }
        .bar-label { display: flex; justify-content: space-between; color: var(--muted); font-size: 12px; }
        .highlight .bar-label { color: #ead4da; }
        .bar-track { height: 8px; margin-top: 7px; overflow: hidden; border-radius: 4px; background: #eadfdb; }
        .highlight .bar-track { background: rgba(255,255,255,.18); }
        .bar-fill { height: 100%; border-radius: 4px; background: var(--coral); }
        .faq { background: var(--cream); }
        .faq-list { max-width: 850px; border-top: 1px solid var(--line); }
        .faq-item { border-bottom: 1px solid var(--line); }
        .faq-question {
            width: 100%;
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding: 21px 4px;
            border: 0;
            color: var(--wine);
            background: transparent;
            text-align: left;
            font-size: 15px;
            font-weight: 800;
        }
        .faq-plus { color: var(--coral); font-size: 23px; transition: .2s; }
        .faq-answer { display: none; padding: 0 42px 20px 4px; color: var(--muted); font-size: 13px; }
        .faq-item.open .faq-answer { display: block; }
        .faq-item.open .faq-plus { transform: rotate(45deg); }
        .form-section { padding: 80px 0; background: var(--wine); }
        .form-layout { display: grid; grid-template-columns: .8fr 1.2fr; gap: 48px; align-items: start; }
        .form-section .section-title { color: #fff8f4; }
        .form-section .section-desc { color: #d7c1c7; }
        .form-note { margin-top: 22px; color: #bda5ae; font-size: 12px; }
        .form-card { padding: 28px; border-radius: var(--radius); background: #fffaf7; }
        .form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
        .field.full { grid-column: 1 / -1; }
        .field label { display: block; margin-bottom: 6px; color: var(--wine); font-size: 12px; font-weight: 800; }
        .field input, .field select, .field textarea {
            width: 100%;
            padding: 11px 13px;
            border: 1px solid var(--line);
            border-radius: 8px;
            color: var(--ink);
            background: #fff;
            font-size: 13px;
            transition: .2s;
        }
        .field textarea { min-height: 108px; resize: vertical; }
        .field input:hover, .field select:hover, .field textarea:hover { border-color: #c99a91; }
        .field input:focus, .field select:focus, .field textarea:focus { border-color: var(--coral); box-shadow: 0 0 0 3px rgba(242,111,82,.14); outline: none; }
        .checkline { display: flex; gap: 8px; align-items: flex-start; margin: 16px 0; color: var(--muted); font-size: 11px; }
        .checkline input { margin-top: 5px; accent-color: var(--coral); }
        .form-message { display: none; margin-top: 12px; color: #43815d; font-size: 12px; }
        .footer { padding: 38px 0 28px; color: #d4c0c7; background: #291421; }
        .footer-grid { display: flex; justify-content: space-between; gap: 30px; }
        .footer-brand { color: #fff; font-weight: 800; }
        .footer-text { max-width: 410px; margin-top: 8px; color: #a9919b; font-size: 12px; }
        .footer-links { display: flex; flex-wrap: wrap; gap: 18px; align-content: start; font-size: 12px; }
        .footer-links a:hover { color: var(--coral); }
        .copyright { padding-top: 25px; margin-top: 25px; border-top: 1px solid rgba(255,255,255,.1); color: #8f7882; font-size: 11px; }
        @media (max-width: 1024px) {
            .sidebar { width: 220px; }
            .main { margin-left: 220px; }
            .container { width: min(100% - 40px, 900px); }
            .matrix-grid { grid-template-columns: 1fr 1fr; }
            .matrix-card.featured { grid-row: auto; grid-column: span 2; }
        }
        @media (max-width: 767px) {
            .sidebar { display: none; }
            .main { margin-left: 0; }
            .mobile-bar { display: flex; }
            .container { width: calc(100% - 36px); }
            .section { padding: 54px 0; }
            .hero { padding: 52px 0 38px; }
            .hero h1 { font-size: 38px; }
            .metric-grid { grid-template-columns: 1fr 1fr; margin-top: 35px; }
            .metric { min-height: 104px; }
            .matrix-grid, .compare-grid, .form-layout { grid-template-columns: 1fr; }
            .matrix-card.featured, .matrix-card.wide { grid-column: auto; }
            .matrix-card { min-height: 165px; }
            .form-grid { grid-template-columns: 1fr; }
            .field.full { grid-column: auto; }
            .footer-grid { display: block; }
            .footer-links { margin-top: 20px; }
        }
        @media (max-width: 520px) {
            .hero h1 { font-size: 32px; }
            .hero-text { font-size: 14px; }
            .hero-actions .btn { width: 100%; }
            .metric-number { font-size: 23px; }
            .metric { padding: 13px; }
            .form-card { padding: 20px; }
        }

/* roulang page: category1 */
:root{
            --ink:#241c27;
            --muted:#756b75;
            --paper:#f7f1ed;
            --panel:#fffaf7;
            --berry:#522340;
            --wine:#702d48;
            --coral:#ed684e;
            --peach:#f6c0a7;
            --line:#e6d9d3;
            --shadow:0 18px 45px rgba(68,34,48,.10);
            --radius:18px;
        }
        *,*:before,*:after{box-sizing:border-box}
        html{scroll-behavior:smooth}
        body{margin:0;background:var(--paper);color:var(--ink);font-family:"Noto Sans SC","Source Han Sans SC","PingFang SC","Microsoft YaHei",sans-serif;line-height:1.75}
        a{text-decoration:none;color:inherit}
        button,input,select,textarea{font:inherit}
        button{cursor:pointer}
        .shell{min-height:100vh}
        .sidebar{position:fixed;z-index:30;inset:0 auto 0 0;width:248px;background:var(--berry);color:#fff5f0;padding:28px 18px;display:flex;flex-direction:column;box-shadow:8px 0 28px rgba(48,20,35,.12)}
        .brand{display:flex;align-items:center;gap:12px;padding:0 10px 30px;border-bottom:1px solid rgba(255,255,255,.16)}
        .brand-mark{width:38px;height:38px;border:2px solid var(--peach);border-radius:50%;display:grid;place-items:center;color:var(--peach);font-weight:800;position:relative}
        .brand-mark:after{content:"";position:absolute;width:16px;height:2px;background:var(--coral);right:-10px;bottom:4px;transform:rotate(-28deg)}
        .brand-name{font-size:15px;line-height:1.35;font-weight:800;letter-spacing:.04em}
        .nav-list{display:grid;gap:8px;margin-top:28px}
        .nav-link{display:flex;align-items:center;gap:12px;min-height:46px;padding:10px 13px;border-left:3px solid transparent;border-radius:10px;color:#dfcfd5;transition:.2s ease}
        .nav-link:hover,.nav-link:focus{color:#fff;background:rgba(255,255,255,.10);outline:none}
        .nav-link.active{color:#fff;background:var(--wine);border-left-color:var(--coral);box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}
        .nav-icon{width:22px;text-align:center;color:var(--peach);font-size:20px}
        .side-status{margin-top:auto;padding:16px;border:1px solid rgba(255,255,255,.15);border-radius:14px;background:rgba(0,0,0,.12);font-size:12px;color:#e8d9dc}
        .status-dot{display:inline-block;width:7px;height:7px;background:#f7a16f;border-radius:50%;margin-right:7px}
        .main{margin-left:248px;min-height:100vh}
        .mobile-bar{display:none}
        .container{width:min(1180px,calc(100% - 64px));margin:auto}
        .section{padding:78px 0}
        .eyebrow{display:inline-flex;align-items:center;gap:8px;color:var(--coral);font-size:12px;font-weight:800;letter-spacing:.13em;text-transform:uppercase}
        .eyebrow:before{content:"";width:24px;height:2px;background:var(--coral)}
        h1,h2,h3,p{margin-top:0}
        h1{font-size:clamp(34px,5vw,64px);line-height:1.12;letter-spacing:-.045em;margin:18px 0 20px;max-width:760px}
        h2{font-size:clamp(25px,3vw,38px);line-height:1.2;letter-spacing:-.03em;margin:12px 0}
        h3{font-size:18px;line-height:1.35}
        .lead{color:var(--muted);font-size:17px;max-width:690px}
        .hero{position:relative;overflow:hidden;padding:72px 0 54px;background:linear-gradient(125deg,#fffaf7 0%,#f8e4da 58%,#f3c0ad 100%);border-bottom:1px solid var(--line)}
        .hero:after{content:"";position:absolute;width:330px;height:330px;border:1px solid rgba(112,45,72,.18);border-radius:50%;right:8%;top:-120px}
        .hero-grid{position:relative;z-index:1;display:grid;grid-template-columns:1.2fr .8fr;gap:42px;align-items:end}
        .crumb{font-size:13px;color:var(--muted);margin-bottom:25px}
        .crumb a{color:var(--wine);font-weight:700}
        .hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
        .btn{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:0 19px;border-radius:10px;border:1px solid transparent;font-weight:800;transition:.2s ease}
        .btn-primary{background:var(--coral);color:#fff;box-shadow:0 8px 18px rgba(237,104,78,.22)}
        .btn-primary:hover{background:#d9523d;transform:translateY(-2px)}
        .btn-secondary{border-color:var(--wine);color:var(--wine);background:rgba(255,255,255,.45)}
        .btn-secondary:hover{background:#fff;border-color:var(--coral);color:var(--coral)}
        .btn:focus,input:focus,select:focus,textarea:focus,summary:focus{outline:3px solid rgba(237,104,78,.35);outline-offset:3px}
        .scoreboard{background:var(--berry);color:#fff5f0;border-radius:var(--radius);padding:24px;box-shadow:var(--shadow);transform:rotate(1deg)}
        .score-top{display:flex;justify-content:space-between;color:#d8bfc9;font-size:12px;border-bottom:1px solid rgba(255,255,255,.16);padding-bottom:15px}
        .score-main{display:flex;align-items:end;justify-content:space-between;padding:24px 0 18px}
        .score-number{font-size:54px;line-height:1;font-weight:900;letter-spacing:-.06em;color:var(--peach)}
        .score-label{font-size:13px;color:#e5d4d8}
        .trend{height:7px;background:#87516a;border-radius:20px;overflow:hidden}
        .trend span{display:block;width:74%;height:100%;background:var(--coral);border-radius:20px}
        .stats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:32px}
        .stat{background:var(--panel);border:1px solid var(--line);padding:20px;border-radius:14px}
        .stat strong{display:block;font-size:30px;line-height:1.1;color:var(--wine)}
        .stat span{display:block;color:var(--muted);font-size:13px;margin-top:7px}
        .stat small{color:var(--coral);font-size:11px}
        .section-head{display:flex;justify-content:space-between;align-items:end;gap:25px;margin-bottom:28px}
        .section-note{color:var(--muted);font-size:14px;max-width:400px}
        .matrix{display:grid;grid-template-columns:1.25fr .75fr .75fr;grid-template-rows:auto auto;gap:16px}
        .matrix-card{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:24px;min-height:190px;position:relative;overflow:hidden;transition:.22s}
        .matrix-card:hover{border-color:var(--coral);transform:translateY(-4px);box-shadow:var(--shadow)}
        .matrix-card.featured{grid-row:span 2;background:var(--berry);color:#fff5f0;min-height:396px}
        .matrix-card.wide{grid-column:span 2;min-height:180px}
        .matrix-card:after{content:"";position:absolute;right:-28px;bottom:-40px;width:120px;height:120px;border:1px solid currentColor;border-radius:50%;opacity:.13}
        .tag{display:inline-flex;padding:4px 9px;border-radius:5px;background:#f6ddd4;color:var(--wine);font-size:11px;font-weight:800}
        .featured .tag{background:#8a5068;color:#fff}
        .card-meta{display:flex;justify-content:space-between;margin-top:28px;color:var(--muted);font-size:12px}
        .featured .card-meta{color:#e4d0d7}
        .arrow{position:absolute;right:22px;bottom:20px;color:var(--coral);font-size:24px}
        .comparison{display:grid;grid-template-columns:1fr 1fr;gap:18px}
        .compare{padding:28px;border-radius:var(--radius);border:1px solid var(--line);background:#eee3de}
        .compare.highlight{background:var(--wine);color:#fff5f0;border-color:var(--wine)}
        .compare-title{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}
        .compare-number{font-size:42px;font-weight:900;color:var(--coral)}
        .highlight .compare-number{color:var(--peach)}
        .bar{height:10px;background:rgba(70,39,47,.14);border-radius:10px;margin:12px 0 18px;overflow:hidden}
        .bar i{display:block;height:100%;background:var(--coral);border-radius:10px}
        .compare.highlight .bar{background:rgba(255,255,255,.15)}
        .compare-list{list-style:none;padding:0;margin:0;color:var(--muted);font-size:14px}
        .highlight .compare-list{color:#ead9dd}
        .compare-list li{padding:8px 0;border-top:1px solid rgba(100,60,70,.12)}
        .highlight .compare-list li{border-color:rgba(255,255,255,.14)}
        .filter-row{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:20px}
        .filter{border:1px solid var(--line);background:#fffaf7;border-radius:8px;padding:9px 13px;color:var(--muted);font-size:13px}
        .filter.active,.filter:hover{border-color:var(--coral);color:var(--wine);background:#fff0e9}
        .faq{max-width:850px}
        details{border-top:1px solid var(--line);padding:20px 0}
        summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:18px;font-weight:800;font-size:16px}
        summary::-webkit-details-marker{display:none}
        summary:after{content:"＋";color:var(--coral);font-size:20px}
        details[open] summary:after{content:"－"}
        details p{color:var(--muted);font-size:14px;padding:12px 30px 0 0;margin:0}
        .cta{background:var(--berry);color:#fff5f0;border-radius:22px;padding:42px;display:grid;grid-template-columns:1fr 1fr;gap:36px;align-items:center}
        .cta p{color:#e3d1d7}
        .form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
        .field{display:flex;flex-direction:column;gap:6px}
        .field.full{grid-column:1/-1}
        label{font-size:13px;color:#ead9dd}
        input,select,textarea{width:100%;border:1px solid rgba(255,255,255,.2);background:rgba(255,255,255,.08);color:#fff;padding:11px 13px;border-radius:8px}
        select option{color:var(--ink)}
        textarea{min-height:90px;resize:vertical}
        input::placeholder,textarea::placeholder{color:#c9b2ba}
        .check{display:flex;flex-direction:row;align-items:flex-start;gap:8px;font-size:12px;color:#cdbbc1;margin:12px 0}
        .check input{width:16px;margin-top:5px}
        .form-message{font-size:13px;color:var(--peach);margin-top:10px;min-height:22px}
        .footer{background:#1e1720;color:#fff5f0;padding:48px 0 24px}
        .footer-grid{display:flex;justify-content:space-between;gap:35px;border-bottom:1px solid rgba(255,255,255,.13);padding-bottom:30px}
        .footer-brand{font-weight:900;font-size:20px}
        .footer-text{max-width:420px;color:#baaab0;font-size:13px;margin:10px 0 0}
        .footer-links{display:flex;flex-wrap:wrap;gap:20px;color:#dbcbd0;font-size:13px}
        .footer-links a:hover{color:var(--peach)}
        .copyright{color:#9e8d94;font-size:12px;padding-top:20px}
        @media(max-width:1024px){.sidebar{width:220px}.main{margin-left:220px}.hero-grid{grid-template-columns:1fr}.scoreboard{max-width:460px}.matrix{grid-template-columns:1fr 1fr}.matrix-card.featured{grid-row:auto;grid-column:span 2;min-height:250px}}
        @media(max-width:767px){.sidebar{display:none}.main{margin-left:0;padding-top:64px}.mobile-bar{display:flex;position:fixed;z-index:40;top:0;left:0;right:0;height:64px;background:var(--berry);color:#fff;align-items:center;justify-content:space-between;padding:0 18px;box-shadow:0 5px 20px rgba(44,20,33,.18)}.mobile-brand{font-size:14px;font-weight:800}.menu-btn{border:1px solid rgba(255,255,255,.3);background:transparent;color:#fff;width:42px;height:42px;border-radius:8px;font-size:22px}.mobile-drawer{display:none;position:fixed;z-index:35;top:64px;left:0;right:0;background:var(--berry);padding:12px 18px 20px}.mobile-drawer.open{display:block}.mobile-drawer .nav-list{margin-top:0}.container{width:min(100% - 36px,620px)}.section{padding:52px 0}.hero{padding:45px 0 35px}h1{font-size:38px}.lead{font-size:15px}.stats{grid-template-columns:1fr 1fr}.matrix,.comparison,.cta{grid-template-columns:1fr}.matrix-card.featured,.matrix-card.wide{grid-column:auto;min-height:190px}.cta{padding:28px 20px}.form-grid{grid-template-columns:1fr}.field.full{grid-column:auto}.section-head{display:block}.section-note{margin-top:10px}.footer-grid{display:block}.footer-links{margin-top:25px;gap:14px}}
        @media(max-width:520px){.stats{gap:9px}.stat{padding:14px}.stat strong{font-size:24px}.hero-actions .btn{width:100%}.scoreboard{padding:19px}.compare{padding:22px}}
