/* roulang page: index */
:root {
            --ink: #171513;
            --ink-soft: #27231f;
            --gold: #c9a66b;
            --gold-light: #e6c98f;
            --cream: #f4efe7;
            --paper: #fbfaf7;
            --muted: #807970;
            --line: rgba(23,21,19,.12);
            --shadow: 0 18px 48px rgba(35, 28, 20, .11);
            --radius: 18px;
            --max: 1180px;
        }
        * { 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; }
        img { display: block; width: 100%; max-width: 100%; object-fit: cover; }
        button, input { font: inherit; }
        button { cursor: pointer; }
        :focus-visible { outline: 3px solid rgba(201,166,107,.65); outline-offset: 3px; }
        .container { width: min(var(--max), calc(100% - 40px)); margin: 0 auto; }
        .site-header {
            position: sticky; top: 0; z-index: 30;
            background: rgba(23,21,19,.95);
            border-bottom: 1px solid rgba(255,255,255,.1);
            backdrop-filter: blur(16px);
        }
        .nav-shell { min-height: 76px; display: flex; align-items: center; justify-content: space-between; gap: 28px; }
        .brand { display: inline-flex; align-items: center; gap: 12px; color: #fff; font-weight: 800; letter-spacing: .02em; }
        .brand-mark {
            width: 38px; height: 38px; border-radius: 11px; display: grid; place-items: center;
            color: var(--ink); background: var(--gold); font-size: 19px; box-shadow: 0 5px 16px rgba(201,166,107,.25);
        }
        .brand-name { font-size: 16px; white-space: nowrap; }
        .nav-links { display: flex; align-items: center; gap: 7px; }
        .nav-links a {
            color: rgba(255,255,255,.72); padding: 9px 15px; border-radius: 9px; font-size: 14px;
            transition: .25s ease;
        }
        .nav-links a:hover, .nav-links a.active { color: #fff; background: rgba(255,255,255,.1); }
        .nav-action { border: 1px solid rgba(201,166,107,.55); color: var(--gold-light); border-radius: 9px; padding: 9px 15px; font-size: 14px; transition: .25s; }
        .nav-action:hover { background: var(--gold); color: var(--ink); }
        .hero {
            position: relative; min-height: 620px; display: flex; align-items: center; overflow: hidden;
            color: #fff; background: var(--ink);
        }
        .hero::before {
            content: ""; position: absolute; inset: 0;
            background: linear-gradient(90deg, rgba(18,16,14,.96) 0%, rgba(18,16,14,.78) 44%, rgba(18,16,14,.28) 100%),
            url("https://images.unsplash.com/photo-1489599849927-2ee91cede3ba?auto=format&fit=crop&w=1900&q=88") center/cover;
        }
        .hero::after { content: ""; position: absolute; inset: auto 0 0; height: 120px; background: linear-gradient(transparent, var(--paper)); opacity: .5; }
        .hero-content { position: relative; z-index: 1; padding: 92px 0 118px; max-width: 720px; }
        .eyebrow { color: var(--gold-light); font-size: 13px; letter-spacing: .18em; font-weight: 700; text-transform: uppercase; }
        h1, h2, h3, p { margin-top: 0; }
        h1 { font-size: clamp(38px, 5.2vw, 68px); line-height: 1.15; letter-spacing: .01em; margin: 18px 0 22px; }
        h1 em { color: var(--gold-light); font-style: normal; }
        .hero-lead { max-width: 650px; color: rgba(255,255,255,.79); font-size: 17px; line-height: 1.95; margin-bottom: 31px; }
        .button-row { display: flex; flex-wrap: wrap; gap: 12px; }
        .btn {
            display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 46px;
            padding: 0 20px; border-radius: 9px; font-weight: 700; font-size: 14px; transition: transform .2s, box-shadow .2s, background .2s;
        }
        .btn:hover { transform: translateY(-2px); }
        .btn-primary { background: var(--gold); color: var(--ink); box-shadow: 0 10px 25px rgba(201,166,107,.2); }
        .btn-primary:hover { background: var(--gold-light); box-shadow: 0 14px 30px rgba(201,166,107,.28); }
        .btn-ghost { color: #fff; border: 1px solid rgba(255,255,255,.3); }
        .btn-ghost:hover { border-color: var(--gold-light); background: rgba(255,255,255,.08); }
        section { padding: 86px 0; }
        .section-dark { background: var(--ink); color: #fff; }
        .section-soft { background: var(--cream); }
        .section-head { max-width: 700px; margin-bottom: 32px; }
        .section-kicker { color: var(--ember); font-weight: 800; font-size: 13px; letter-spacing: .12em; }
        .section-dark .section-kicker { color: var(--gold-light); }
        h2 { font-size: clamp(28px, 3.2vw, 42px); line-height: 1.25; letter-spacing: .01em; margin: 8px 0 13px; }
        .section-head p { color: var(--muted); max-width: 650px; margin-bottom: 0; }
        .section-dark .section-head p { color: rgba(255,255,255,.66); }
        .highlight-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
        .highlight { padding: 27px; border: 1px solid var(--line); border-radius: var(--radius); background: rgba(255,255,255,.62); transition: .25s; }
        .highlight:hover { transform: translateY(-4px); box-shadow: var(--shadow); }
        .highlight-num { color: var(--gold); font-size: 28px; font-weight: 800; }
        .highlight h3 { font-size: 19px; margin: 12px 0 7px; }
        .highlight p { color: var(--muted); font-size: 14px; margin: 0; }
        .content-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
        .media-card { overflow: hidden; border-radius: var(--radius); background: #fff; border: 1px solid var(--line); box-shadow: 0 5px 20px rgba(30,25,18,.04); transition: .25s; }
        .media-card:hover { transform: translateY(-5px); box-shadow: var(--shadow); }
        .media-image { height: 205px; position: relative; overflow: hidden; background: #ddd; }
        .media-image img { height: 100%; transition: transform .5s; }
        .media-card:hover .media-image img { transform: scale(1.05); }
        .badge { position: absolute; top: 12px; left: 12px; padding: 3px 8px; border-radius: 5px; color: var(--ink); background: var(--gold-light); font-size: 11px; font-weight: 800; }
        .card-body { padding: 16px 17px 18px; }
        .card-body h3 { font-size: 16px; margin: 0 0 8px; line-height: 1.4; }
        .card-meta { display: flex; justify-content: space-between; gap: 8px; color: var(--muted); font-size: 12px; }
        .score { color: var(--ember); font-weight: 800; }
        .wide-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
        .feature-card { min-height: 255px; padding: 28px; border-radius: var(--radius); color: #fff; position: relative; overflow: hidden; background: #28231f; }
        .feature-card::before { content: ""; position: absolute; inset: 0; background: linear-gradient(135deg, rgba(0,0,0,.08), rgba(0,0,0,.72)); }
        .feature-card > * { position: relative; z-index: 1; }
        .feature-card:nth-child(1) { background: url("https://images.unsplash.com/photo-1485846234645-a62644f84728?auto=format&fit=crop&w=900&q=80") center/cover; }
        .feature-card:nth-child(2) { background: url("https://images.unsplash.com/photo-1516280440614-37939bbacd81?auto=format&fit=crop&w=900&q=80") center/cover; }
        .feature-card:nth-child(3) { background: url("https://images.unsplash.com/photo-1536440136628-849c177e76a1?auto=format&fit=crop&w=900&q=80") center/cover; }
        .feature-card h3 { font-size: 23px; margin: 85px 0 7px; }
        .feature-card p { color: rgba(255,255,255,.78); font-size: 14px; margin: 0; }
        .category-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; }
        .category-item { padding: 21px 18px; border: 1px solid var(--line); border-radius: 13px; background: #fff; transition: .25s; }
        .category-item:hover { border-color: var(--gold); background: #fffaf0; }
        .category-item h3 { font-size: 16px; margin: 0 0 8px; }
        .category-item p { color: var(--muted); font-size: 13px; line-height: 1.7; margin: 0; }
        .rank-grid { display: grid; grid-template-columns: 1fr 1fr; column-gap: 48px; }
        .rank-item { display: grid; grid-template-columns: 42px 1fr auto auto; align-items: center; gap: 13px; min-height: 67px; border-bottom: 1px solid rgba(255,255,255,.1); }
        .rank-no { color: var(--gold); font-size: 22px; font-weight: 800; }
        .rank-name { font-weight: 700; }
        .rank-tag { color: rgba(255,255,255,.6); font-size: 12px; }
        .rank-hot { color: var(--gold-light); font-size: 13px; white-space: nowrap; }
        .scene-grid { display: grid; grid-template-columns: 1.15fr .85fr; gap: 24px; align-items: stretch; }
        .scene-main { min-height: 360px; padding: 38px; border-radius: var(--radius); color: #fff; background: linear-gradient(120deg, rgba(30,24,18,.15), rgba(20,18,15,.85)), url("https://images.unsplash.com/photo-1500534623283-312aade485b7?auto=format&fit=crop&w=1200&q=85") center/cover; display: flex; flex-direction: column; justify-content: end; }
        .scene-main h3 { font-size: 28px; margin: 0 0 10px; }
        .scene-main p { color: rgba(255,255,255,.78); margin: 0; max-width: 510px; }
        .quote-panel { padding: 34px; background: #fff; border: 1px solid var(--line); border-radius: var(--radius); display: flex; flex-direction: column; justify-content: center; }
        .quote-mark { color: var(--gold); font-size: 48px; line-height: 1; }
        .quote-panel p { font-size: 18px; line-height: 1.8; margin: 10px 0 16px; }
        .quote-panel small { color: var(--muted); }
        .compare { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: var(--line); border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; }
        .compare-col { padding: 28px; background: #fff; }
        .compare-col.featured { background: var(--ink); color: #fff; }
        .compare-col h3 { font-size: 19px; margin: 0 0 17px; }
        .compare-col ul { list-style: none; padding: 0; margin: 0; }
        .compare-col li { padding: 10px 0; border-bottom: 1px solid var(--line); color: var(--muted); font-size: 14px; }
        .compare-col.featured li { color: rgba(255,255,255,.72); border-color: rgba(255,255,255,.12); }
        .compare-col li::before { content: "✓"; color: var(--gold); margin-right: 9px; font-weight: 800; }
        .news-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 19px; }
        .news-item { display: grid; grid-template-columns: 115px 1fr; gap: 15px; align-items: center; padding: 12px; background: #fff; border: 1px solid var(--line); border-radius: 13px; transition: .25s; }
        .news-item:hover { box-shadow: var(--shadow); transform: translateY(-3px); }
        .news-item img { height: 84px; border-radius: 9px; }
        .news-item h3 { font-size: 15px; line-height: 1.5; margin: 0 0 6px; }
        .news-item time { color: var(--muted); font-size: 12px; }
        .faq-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 13px; }
        details { border: 1px solid var(--line); border-radius: 12px; background: #fff; padding: 18px 20px; }
        summary { cursor: pointer; font-weight: 700; list-style: none; display: flex; justify-content: space-between; gap: 15px; }
        summary::-webkit-details-marker { display: none; }
        summary::after { content: "+"; color: var(--gold); font-size: 22px; line-height: 1; }
        details[open] summary::after { content: "−"; }
        details p { color: var(--muted); font-size: 14px; margin: 12px 0 0; line-height: 1.8; }
        .cta-band { background: var(--ink); color: #fff; padding: 66px 0; }
        .cta-inner { display: flex; align-items: center; justify-content: space-between; gap: 30px; }
        .cta-inner h2 { margin-bottom: 8px; }
        .cta-inner p { color: rgba(255,255,255,.68); margin: 0; max-width: 660px; }
        footer { background: #100f0e; color: #fff; padding: 58px 0 24px; }
        .footer-grid { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: 35px; padding-bottom: 45px; }
        footer h3 { font-size: 15px; margin: 0 0 15px; color: var(--gold-light); }
        footer p, footer a { color: rgba(255,255,255,.55); font-size: 13px; }
        footer a { display: block; margin: 8px 0; transition: .2s; }
        footer a:hover { color: #fff; }
        .footer-brand p { max-width: 290px; line-height: 1.8; }
        .copyright { border-top: 1px solid rgba(255,255,255,.1); padding-top: 19px; color: rgba(255,255,255,.4); font-size: 12px; display: flex; justify-content: space-between; gap: 15px; }
        @media (max-width: 1024px) {
            .content-grid { grid-template-columns: repeat(3, 1fr); }
            .category-grid { grid-template-columns: repeat(3, 1fr); }
            .footer-grid { grid-template-columns: 1.5fr 1fr 1fr; }
        }
        @media (max-width: 768px) {
            .container { width: min(var(--max), calc(100% - 28px)); }
            .nav-shell { min-height: 68px; gap: 10px; }
            .brand-name { font-size: 14px; }
            .nav-links { gap: 2px; }
            .nav-links a { padding: 7px 9px; font-size: 13px; }
            .nav-action { display: none; }
            .hero { min-height: 580px; }
            .hero-content { padding: 70px 0 90px; }
            .highlight-grid, .wide-grid, .scene-grid, .compare, .news-grid { grid-template-columns: 1fr 1fr; }
            .content-grid { grid-template-columns: repeat(2, 1fr); }
            .category-grid { grid-template-columns: repeat(2, 1fr); }
            .rank-grid { grid-template-columns: 1fr; }
            .cta-inner { align-items: flex-start; flex-direction: column; }
            .footer-grid { grid-template-columns: 1fr 1fr; }
        }
        @media (max-width: 520px) {
            section { padding: 62px 0; }
            .brand-mark { width: 34px; height: 34px; }
            .brand-name { max-width: 170px; white-space: normal; line-height: 1.25; }
            .nav-links a { font-size: 12px; padding: 6px 7px; }
            h1 { font-size: 39px; }
            .hero-lead { font-size: 15px; }
            .highlight-grid, .wide-grid, .content-grid, .category-grid, .scene-grid, .compare, .news-grid, .faq-grid { grid-template-columns: 1fr; }
            .media-image { height: 230px; }
            .rank-item { grid-template-columns: 35px 1fr auto; }
            .rank-tag { display: none; }
            .scene-main { min-height: 300px; padding: 26px; }
            .footer-grid { grid-template-columns: 1fr 1fr; gap: 22px; }
            .footer-brand { grid-column: 1 / -1; }
            .copyright { flex-direction: column; }
        }

/* roulang page: category1 */
:root {
      --ink:#171513;--ink-soft:#27231f;--gold:#c9a66b;--gold-light:#e6c98f;
      --cream:#f4efe7;--paper:#fbfaf7;--muted:#807970;--line:rgba(23,21,19,.12);
      --shadow:0 18px 48px rgba(35,28,20,.11);--radius:18px;--max:1180px;
    }
    *{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}
    img{display:block;width:100%;max-width:100%;object-fit:cover}
    button,input{font:inherit}
    button{cursor:pointer}
    .container{width:min(var(--max),calc(100% - 40px));margin:0 auto}
    .site-header{position:sticky;top:0;z-index:30;background:rgba(23,21,19,.95);border-bottom:1px solid rgba(255,255,255,.1);backdrop-filter:blur(16px)}
    .nav-shell{min-height:76px;display:flex;align-items:center;justify-content:space-between;gap:28px}
    .brand{display:inline-flex;align-items:center;gap:12px;color:#fff;font-weight:800;letter-spacing:.02em}
    .brand-mark{width:38px;height:38px;border-radius:11px;display:grid;place-items:center;color:var(--ink);background:var(--gold);font-size:19px;box-shadow:0 5px 16px rgba(201,166,107,.25)}
    .brand-name{font-size:16px;white-space:nowrap}
    .nav-links{display:flex;align-items:center;gap:7px}
    .nav-links a{color:rgba(255,255,255,.72);padding:9px 15px;border-radius:9px;font-size:14px;transition:.25s ease}
    .nav-links a:hover,.nav-links a.active{color:#fff;background:rgba(255,255,255,.1)}
    .nav-action{border:1px solid rgba(201,166,107,.55);color:var(--gold-light);border-radius:9px;padding:9px 15px;font-size:14px;transition:.25s}
    .nav-action:hover{background:var(--gold);color:var(--ink)}
    .hero{position:relative;overflow:hidden;color:#fff;background:var(--ink);padding:88px 0 96px}
    .hero::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(18,16,14,.96),rgba(18,16,14,.76) 48%,rgba(18,16,14,.35)),url("https://images.unsplash.com/photo-1489599849927-2ee91cede3ba?auto=format&fit=crop&w=1900&q=88") center/cover}
    .hero-inner{position:relative;z-index:1;display:grid;grid-template-columns:1.05fr .95fr;align-items:center;gap:70px}
    .eyebrow,.section-kicker{color:var(--gold-light);font-size:13px;letter-spacing:.16em;font-weight:800}
    h1{font-size:clamp(38px,5vw,64px);line-height:1.2;margin:16px 0 18px;letter-spacing:.01em}
    h1 em{font-style:normal;color:var(--gold-light)}
    .hero-copy{max-width:620px;color:rgba(255,255,255,.78);font-size:17px;line-height:1.95;margin:0 0 30px}
    .button-row{display:flex;flex-wrap:wrap;gap:12px}
    .btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:0 20px;border-radius:9px;font-weight:700;font-size:14px;transition:transform .2s,box-shadow .2s,background .2s}
    .btn:hover{transform:translateY(-2px)}
    .btn-primary{background:var(--gold);color:var(--ink);box-shadow:0 10px 25px rgba(201,166,107,.2)}
    .btn-primary:hover{background:var(--gold-light);box-shadow:0 14px 30px rgba(201,166,107,.28)}
    .btn-ghost{color:#fff;border:1px solid rgba(255,255,255,.3)}
    .btn-ghost:hover{border-color:var(--gold-light);background:rgba(255,255,255,.08)}
    .quick-panel{padding:25px;border:1px solid rgba(255,255,255,.18);border-radius:var(--radius);background:rgba(23,21,19,.56);backdrop-filter:blur(8px)}
    .quick-panel h2{font-size:20px;margin:0 0 18px}
    .quick-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
    .quick-item{padding:17px;border:1px solid rgba(255,255,255,.14);border-radius:12px;background:rgba(255,255,255,.06);transition:.25s}
    .quick-item:hover{background:rgba(201,166,107,.18);border-color:var(--gold)}
    .quick-item strong{display:block;color:#fff;font-size:16px;margin-bottom:3px}
    .quick-item span{color:rgba(255,255,255,.58);font-size:12px}
    section{padding:78px 0}
    .section-soft{background:var(--cream)}
    .section-dark{background:var(--ink);color:#fff}
    .section-head{max-width:700px;margin-bottom:32px}
    .section-head h2{font-size:clamp(28px,3.5vw,42px);line-height:1.3;margin:8px 0 12px}
    .section-head p{color:var(--muted);margin:0}
    .section-dark .section-head p{color:rgba(255,255,255,.66)}
    .category-layout{display:grid;grid-template-columns:1.1fr .9fr;gap:34px;align-items:stretch}
    .category-feature{min-height:390px;border-radius:var(--radius);overflow:hidden;position:relative;background:url("https://images.unsplash.com/photo-1516280440614-37939bbacd81?auto=format&fit=crop&w=1200&q=85") center/cover}
    .category-feature::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(16,14,12,.9),transparent 65%)}
    .category-feature-content{position:absolute;z-index:1;left:30px;right:30px;bottom:27px;color:#fff}
    .category-feature h3{font-size:28px;margin:0 0 7px}
    .category-feature p{margin:0;color:rgba(255,255,255,.77)}
    .category-list{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
    .category-card{padding:23px;border:1px solid var(--line);border-radius:14px;background:#fff;transition:.25s}
    .category-card:hover{transform:translateY(-4px);box-shadow:var(--shadow);border-color:rgba(201,166,107,.7)}
    .category-card .index{color:var(--gold);font-weight:800;font-size:13px}
    .category-card h3{margin:12px 0 6px;font-size:18px}
    .category-card p{margin:0;color:var(--muted);font-size:13px;line-height:1.7}
    .content-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
    .media-card{overflow:hidden;border-radius:var(--radius);background:#fff;border:1px solid var(--line);box-shadow:0 5px 20px rgba(30,25,18,.04);transition:.25s}
    .media-card:hover{transform:translateY(-5px);box-shadow:var(--shadow)}
    .media-image{height:190px;position:relative;overflow:hidden;background:#ddd}
    .media-image img{height:100%;transition:transform .5s}
    .media-card:hover .media-image img{transform:scale(1.05)}
    .badge{position:absolute;top:12px;left:12px;padding:3px 8px;border-radius:5px;color:var(--ink);background:var(--gold-light);font-size:11px;font-weight:800}
    .card-body{padding:16px 17px 18px}
    .card-body h3{font-size:16px;margin:0 0 8px;line-height:1.4}
    .card-meta{display:flex;justify-content:space-between;gap:8px;color:var(--muted);font-size:12px}
    .quote-band{display:grid;grid-template-columns:1fr 1fr;gap:25px;align-items:center}
    .quote{font-size:25px;line-height:1.6;margin:0}
    .quote-note{padding-left:25px;border-left:2px solid var(--gold);color:rgba(255,255,255,.67)}
    .news-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
    .news-item{display:grid;grid-template-columns:112px 1fr;gap:15px;align-items:center;padding:14px;background:#fff;border:1px solid var(--line);border-radius:13px;transition:.25s}
    .news-item:hover{box-shadow:var(--shadow);transform:translateY(-3px)}
    .news-item img{height:82px;border-radius:9px}
    .news-item h3{font-size:15px;line-height:1.45;margin:0 0 5px}
    .news-item time{font-size:12px;color:var(--muted)}
    .faq-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
    .faq-item{padding:22px 24px;border-top:1px solid var(--line);background:rgba(255,255,255,.45)}
    .faq-item h3{font-size:16px;margin:0 0 7px}
    .faq-item p{font-size:14px;color:var(--muted);margin:0}
    .cta-strip{padding:45px 0;background:var(--gold);color:var(--ink)}
    .cta-inner{display:flex;justify-content:space-between;align-items:center;gap:25px}
    .cta-inner h2{font-size:30px;margin:0 0 5px}
    .cta-inner p{margin:0;color:rgba(23,21,19,.72)}
    .cta-strip .btn{background:var(--ink);color:#fff}
    footer{background:var(--ink);color:#fff;padding:58px 0 23px}
    .footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:35px;padding-bottom:42px}
    .footer-brand p{max-width:330px;color:rgba(255,255,255,.58);font-size:14px;margin:18px 0 0}
    footer h3{font-size:14px;margin:5px 0 16px;color:var(--gold-light)}
    footer .footer-grid a:not(.brand){display:block;color:rgba(255,255,255,.62);font-size:13px;margin:8px 0;transition:.2s}
    footer .footer-grid a:not(.brand):hover{color:#fff}
    .copyright{display:flex;justify-content:space-between;gap:20px;padding-top:20px;border-top:1px solid rgba(255,255,255,.12);font-size:12px;color:rgba(255,255,255,.45)}
    :focus-visible{outline:3px solid var(--gold-light);outline-offset:3px}
    @media(max-width:1024px){.hero-inner{gap:35px}.content-grid{grid-template-columns:repeat(3,1fr)}.footer-grid{grid-template-columns:1.4fr repeat(3,1fr)}}
    @media(max-width:768px){.nav-shell{gap:12px}.brand-name{font-size:14px}.nav-action{display:none}.hero-inner,.category-layout,.quote-band{grid-template-columns:1fr}.hero{padding:70px 0 76px}.quick-panel{max-width:560px}.content-grid{grid-template-columns:repeat(2,1fr)}.news-grid{grid-template-columns:repeat(2,1fr)}.footer-grid{grid-template-columns:repeat(2,1fr)}}
    @media(max-width:520px){.container{width:min(var(--max),calc(100% - 28px))}.nav-links{gap:0}.nav-links a{padding:8px 8px;font-size:13px}.brand{gap:8px}.brand-mark{width:34px;height:34px}.brand-name{max-width:160px;white-space:normal;line-height:1.25}.hero-copy{font-size:15px}.quick-grid,.category-list,.content-grid,.news-grid,.faq-grid{grid-template-columns:1fr}.category-feature{min-height:315px}.section-head h2{font-size:30px}.quote{font-size:21px}.cta-inner{display:block}.cta-inner .btn{margin-top:20px}.footer-grid{grid-template-columns:1fr}.copyright{display:block}.copyright span{display:block;margin-top:5px}}
