/* roulang page: index */
:root{
    --ink:#17283d;
    --ink-soft:#33475e;
    --muted:#6e7e90;
    --line:#e1e8f0;
    --paper:#fff;
    --wash:#f4f7fb;
    --blue:#2563a8;
    --blue-dark:#194b83;
    --blue-pale:#eaf3fc;
    --mint:#dff3ed;
    --mint-ink:#26745f;
    --coral:#faeee9;
    --coral-ink:#a75a42;
    --gold:#f4c66d;
    --radius:8px;
    --shadow:0 12px 34px rgba(30,57,86,.08);
    --shadow-hover:0 16px 38px rgba(30,57,86,.14);
    --container:1200px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:90px}
body{margin:0;background:var(--paper);color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans SC","Microsoft YaHei",sans-serif;font-size:15px;line-height:1.7}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
button,input,select{font:inherit}
button,a,input,select{outline-offset:3px}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid #76a9df;outline-offset:3px}
button{cursor:pointer}
.container{width:min(var(--container),calc(100% - 48px));margin-inline:auto}
.skip-link{position:absolute;left:12px;top:-60px;z-index:99;padding:10px 14px;background:var(--ink);color:white}
.skip-link:focus{top:12px}
.site-header{position:sticky;top:0;z-index:20;background:rgba(255,255,255,.97);border-bottom:1px solid var(--line);backdrop-filter:blur(12px)}
.nav-shell{min-height:76px;display:flex;align-items:center;gap:30px}
.brand{display:flex;align-items:center;gap:11px;min-width:max-content}
.brand-mark{width:38px;height:38px;display:grid;place-items:center;background:var(--blue);color:white;border-radius:6px;font-size:14px;font-weight:800;line-height:1}
.brand-name{font-size:17px;font-weight:760;letter-spacing:0;color:var(--ink)}
.primary-nav{margin-left:auto;display:flex;align-items:center;gap:25px}
.primary-nav a{position:relative;padding:8px 0;color:var(--ink-soft);font-size:14px;font-weight:600;transition:color .18s ease}
.primary-nav a:hover,.primary-nav a[aria-current="page"]{color:var(--blue)}
.primary-nav a[aria-current="page"]:after{position:absolute;content:"";height:2px;left:0;right:0;bottom:0;background:var(--blue)}
.nav-action{padding:9px 15px;border:1px solid var(--line);border-radius:6px;color:var(--blue);font-weight:650;transition:background .18s,border-color .18s}
.nav-action:hover{background:var(--blue-pale);border-color:#bed4ea}
.menu-toggle{display:none;width:42px;height:42px;margin-left:auto;border:1px solid var(--line);border-radius:6px;background:white;color:var(--ink);font-size:21px}
.hero{position:relative;min-height:474px;display:flex;align-items:center;overflow:hidden;background:#e9f0f6}
.hero-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 42%}
.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(12,28,44,.84) 0%,rgba(12,28,44,.68) 43%,rgba(12,28,44,.12) 100%)}
.hero-inner{position:relative;z-index:1;padding-block:64px;color:white}
.hero-copy{max-width:720px}
.hero-kicker{display:inline-flex;align-items:center;gap:9px;margin-bottom:15px;color:#d7e8f7;font-size:13px;font-weight:650}
.hero-kicker:before{content:"";width:24px;height:2px;background:var(--gold)}
.hero h1{margin:0;font-size:44px;line-height:1.2;font-weight:780;letter-spacing:0}
.hero h1 span{color:#a9d3fa}
.hero-subtitle{margin:12px 0 0;color:#e2edf7;font-size:18px;font-weight:600}
.hero-description{max-width:640px;margin:14px 0 22px;color:#e6edf3;font-size:15px}
.hero-actions{display:flex;flex-wrap:wrap;gap:11px}
.button{min-height:44px;padding:10px 18px;display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid transparent;border-radius:6px;font-size:14px;font-weight:700;transition:background .18s,border-color .18s,box-shadow .18s,transform .18s}
.button:hover{transform:translateY(-1px)}
.button-primary{background:var(--blue);color:white;box-shadow:0 6px 15px rgba(17,56,95,.2)}
.button-primary:hover{background:var(--blue-dark);box-shadow:0 8px 20px rgba(17,56,95,.25)}
.button-light{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.48);color:white}
.button-light:hover{background:rgba(255,255,255,.22)}
.section{padding:65px 0}
.section-tint{background:var(--wash)}
.section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:27px}
.section-head h2{margin:0;font-size:27px;line-height:1.3;letter-spacing:0;color:var(--ink)}
.section-head p{max-width:620px;margin:8px 0 0;color:var(--muted);font-size:14px}
.eyebrow{display:block;margin-bottom:7px;color:var(--blue);font-size:12px;font-weight:760}
.text-link{display:inline-flex;align-items:center;gap:8px;color:var(--blue);font-size:14px;font-weight:700;white-space:nowrap}
.text-link:hover{color:var(--blue-dark)}
.stats-band{padding:23px 0;background:#fff;border-bottom:1px solid var(--line)}
.stats-grid{display:grid;grid-template-columns:repeat(4,1fr)}
.stat{padding:5px 25px;border-right:1px solid var(--line)}
.stat:first-child{padding-left:0}
.stat:last-child{border-right:0}
.stat strong{display:block;color:var(--ink);font-size:25px;line-height:1.25;font-weight:760}
.stat span{display:block;margin-top:4px;color:var(--muted);font-size:13px}
.service-layout{display:grid;grid-template-columns:1.15fr 2fr;gap:44px;align-items:center}
.service-intro h2{margin:0;font-size:28px;line-height:1.35}
.service-intro p{margin:13px 0 20px;color:var(--muted)}
.service-links{display:inline-flex;align-items:center;gap:8px;color:var(--blue);font-size:14px;font-weight:700}
.service-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border-top:1px solid var(--line);border-left:1px solid var(--line)}
.service-item{min-height:127px;padding:20px 21px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);transition:background .2s}
.service-item:hover{background:#f8fbfe}
.service-icon{width:34px;height:34px;display:grid;place-items:center;margin-bottom:10px;border-radius:6px;background:var(--blue-pale);color:var(--blue);font-size:17px;font-weight:700}
.service-item:nth-child(2) .service-icon{background:var(--mint);color:var(--mint-ink)}
.service-item:nth-child(3) .service-icon{background:var(--coral);color:var(--coral-ink)}
.service-item h3{margin:0;font-size:16px}
.service-item p{margin:4px 0 0;color:var(--muted);font-size:13px}
.poster-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:22px 16px}
.poster-card{min-width:0;transition:transform .2s}
.poster-card:hover{transform:translateY(-3px)}
.poster-image-wrap{position:relative;aspect-ratio:2/2.72;overflow:hidden;border-radius:6px;background:#e5ebf1;box-shadow:var(--shadow)}
.poster-image{width:100%;height:100%;object-fit:cover;transition:transform .35s}
.poster-card:hover .poster-image{transform:scale(1.035)}
.poster-label{position:absolute;top:10px;left:10px;padding:4px 7px;border-radius:4px;background:rgba(255,255,255,.94);color:var(--blue-dark);font-size:11px;font-weight:750}
.poster-info{padding:10px 2px 0}
.poster-info h3{overflow:hidden;margin:0;color:var(--ink);font-size:15px;line-height:1.45;text-overflow:ellipsis;white-space:nowrap}
.poster-meta{display:flex;justify-content:space-between;gap:5px;margin-top:5px;color:var(--muted);font-size:12px}
.rating{color:#925d17;font-weight:750}
.popular-layout{display:grid;grid-template-columns:1.05fr 1fr 1fr;grid-template-rows:repeat(2,minmax(150px,1fr));gap:14px}
.featured-film{position:relative;grid-row:span 2;min-height:350px;overflow:hidden;border-radius:var(--radius);background:#dce5eb}
.featured-film img{width:100%;height:100%;position:absolute;inset:0;object-fit:cover}
.featured-film:after{content:"";position:absolute;inset:30% 0 0;background:linear-gradient(transparent,rgba(12,24,37,.83))}
.featured-film-content{position:absolute;z-index:1;right:22px;bottom:20px;left:22px;color:white}
.featured-film-content .eyebrow{color:#d7e9f7}
.featured-film-content h3{margin:0;font-size:23px}
.featured-film-content p{margin:5px 0 0;color:#e0e8ef;font-size:13px}
.mini-film{display:grid;grid-template-columns:105px minmax(0,1fr);gap:14px;align-items:center;padding:12px;border:1px solid var(--line);border-radius:var(--radius);background:white;box-shadow:0 5px 17px rgba(30,57,86,.04);transition:box-shadow .2s,border-color .2s}
.mini-film:hover{border-color:#c7d8e9;box-shadow:var(--shadow)}
.mini-film img{width:105px;height:100%;min-height:126px;object-fit:cover;border-radius:5px}
.mini-film h3{margin:0;font-size:16px}
.mini-film p{margin:7px 0;color:var(--muted);font-size:13px}
.mini-film .rating{font-size:13px}
.channel-grid{display:grid;grid-template-columns:1.25fr 1fr 1fr;grid-template-rows:repeat(2,minmax(128px,auto));gap:12px}
.channel{display:flex;flex-direction:column;justify-content:flex-end;min-height:130px;padding:21px;border:1px solid var(--line);border-radius:var(--radius);background:white;transition:border-color .18s,box-shadow .18s,transform .18s}
.channel:hover{transform:translateY(-2px);border-color:#c4d8eb;box-shadow:var(--shadow)}
.channel:first-child{grid-row:span 2;background:#edf5fc}
.channel:nth-child(4){grid-column:2 / 4;background:#f0f6f3}
.channel-index{margin-bottom:6px;color:var(--blue);font-size:12px;font-weight:750}
.channel h3{margin:0;font-size:18px}
.channel p{max-width:430px;margin:5px 0 0;color:var(--muted);font-size:13px}
.comparison-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--radius);background:white;box-shadow:var(--shadow)}
.comparison{width:100%;border-collapse:collapse;text-align:left;min-width:650px}
.comparison th,.comparison td{padding:14px 18px;border-bottom:1px solid var(--line)}
.comparison th{background:#f5f8fb;color:var(--muted);font-size:12px;font-weight:700}
.comparison td{font-size:14px}
.comparison tr:last-child td{border-bottom:0}
.quality-tag{display:inline-flex;padding:3px 8px;border-radius:4px;background:var(--blue-pale);color:var(--blue-dark);font-size:11px;font-weight:700}
.timeline{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid var(--line)}
.timeline-item{position:relative;padding:25px 20px 0 0}
.timeline-item:before{position:absolute;top:-5px;left:0;width:9px;height:9px;border:2px solid var(--blue);border-radius:50%;background:white;content:""}
.timeline-date{color:var(--blue);font-size:12px;font-weight:750}
.timeline-item h3{margin:8px 0 5px;font-size:15px;line-height:1.5}
.timeline-item p{margin:0;color:var(--muted);font-size:13px}
.editorial-grid{display:grid;grid-template-columns:1.15fr 1fr;gap:30px;align-items:start}
.editorial-feature{display:grid;grid-template-columns:42% 1fr;gap:20px;align-items:center}
.editorial-feature img{width:100%;aspect-ratio:1.42;object-fit:cover;border-radius:6px}
.editorial-feature time,.article-row time{color:var(--muted);font-size:12px}
.editorial-feature h3{margin:7px 0;font-size:20px;line-height:1.45}
.editorial-feature p{margin:0;color:var(--muted);font-size:13px}
.article-list{border-top:1px solid var(--line)}
.article-row{display:grid;grid-template-columns:75px 1fr;gap:13px;padding:11px 0;border-bottom:1px solid var(--line)}
.article-row img{width:75px;height:58px;object-fit:cover;border-radius:4px}
.article-row h3{margin:3px 0 0;font-size:13px;line-height:1.45}
.article-row:hover h3{color:var(--blue)}
.topic-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.topic{padding:20px 23px;border-right:1px solid var(--line)}
.topic:first-child{padding-left:0}
.topic:last-child{border-right:0}
.topic h3{margin:0;font-size:16px}
.topic p{margin:7px 0 0;color:var(--muted);font-size:13px}
.browse-bar{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.browse-label{margin-right:4px;color:var(--muted);font-size:13px;font-weight:650}
.filter-chip{padding:7px 13px;border:1px solid var(--line);border-radius:5px;background:white;color:var(--ink-soft);font-size:13px}
.filter-chip.is-selected{border-color:#a9c7e4;background:var(--blue-pale);color:var(--blue-dark);font-weight:700}
.filter-chip:hover{border-color:#a9c7e4}
.ranking-layout{display:grid;grid-template-columns:1fr 1fr;gap:0 38px}
.rank-list{list-style:none;margin:0;padding:0}
.rank-item{display:grid;grid-template-columns:39px minmax(0,1fr) 54px;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid var(--line)}
.rank-number{color:#8a99a8;font-size:17px;font-weight:750;text-align:center}
.rank-item:nth-child(-n+3) .rank-number{color:var(--blue)}
.rank-item h3{margin:0;font-size:14px}
.rank-item p{margin:2px 0 0;color:var(--muted);font-size:12px}
.rank-score{color:#925d17;font-size:12px;font-weight:750;text-align:right}
.assurance{display:grid;grid-template-columns:repeat(3,1fr);gap:25px}
.assurance-item{display:flex;gap:14px;padding:18px 0;border-top:1px solid var(--line)}
.assurance-mark{flex:none;width:34px;height:34px;display:grid;place-items:center;border-radius:50%;background:var(--mint);color:var(--mint-ink);font-weight:800}
.assurance-item h3{margin:0;font-size:15px}
.assurance-item p{margin:5px 0 0;color:var(--muted);font-size:13px}
.quick-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.quick-item{padding:17px;border-left:3px solid #9bc3e8;background:white}
.quick-item h3{margin:0;font-size:14px}
.quick-item p{margin:6px 0 0;color:var(--muted);font-size:12px}
.faq-list{display:grid;grid-template-columns:1fr 1fr;gap:0 28px}
.faq-item{padding:15px 0;border-bottom:1px solid var(--line)}
.faq-item summary{display:flex;align-items:center;justify-content:space-between;gap:14px;cursor:pointer;list-style:none;font-size:15px;font-weight:700}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary:after{content:"+";color:var(--blue);font-size:20px;font-weight:400}
.faq-item[open] summary:after{content:"−"}
.faq-item p{margin:9px 26px 1px 0;color:var(--muted);font-size:13px}
.signup-band{padding:42px 0;background:#edf4fa;border-top:1px solid #dfe9f2}
.signup-layout{display:grid;grid-template-columns:1fr 1.1fr;align-items:center;gap:38px}
.signup-copy h2{margin:0;font-size:25px}
.signup-copy p{max-width:470px;margin:8px 0 0;color:var(--muted);font-size:14px}
.signup-form{display:grid;grid-template-columns:1fr 1fr auto;gap:9px}
.form-control{width:100%;min-height:44px;padding:10px 12px;border:1px solid #ced9e4;border-radius:5px;background:white;color:var(--ink);font-size:14px}
.form-control::placeholder{color:#8492a0}
.signup-note{grid-column:1 / -1;margin:0;color:var(--muted);font-size:11px}
.site-footer{padding:47px 0 19px;background:#17283d;color:#e8eff6}
.footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:35px;padding-bottom:33px}
.footer-brand{display:inline-flex;align-items:center;gap:10px;font-size:17px;font-weight:750}
.footer-brand .brand-mark{background:#eaf3fc;color:var(--blue)}
.footer-summary{max-width:320px;margin:12px 0 0;color:#b9c7d5;font-size:13px}
.footer-column h2{margin:2px 0 12px;color:white;font-size:13px}
.footer-links{display:grid;gap:8px}
.footer-links a{width:max-content;max-width:100%;color:#bcc9d6;font-size:13px;transition:color .18s}
.footer-links a:hover{color:white}
.footer-bottom{display:flex;justify-content:space-between;gap:18px;padding-top:16px;border-top:1px solid rgba(255,255,255,.14);color:#aebdcb;font-size:12px}
.footer-bottom a{color:#d3dde7}
@media(max-width:1024px){
    .primary-nav{gap:16px}
    .nav-shell{gap:18px}
    .poster-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
    .popular-layout{grid-template-columns:1fr 1fr;grid-template-rows:auto}
    .featured-film{grid-row:span 2;min-height:340px}
    .mini-film{min-height:155px}
    .timeline{grid-template-columns:repeat(2,1fr);row-gap:20px}
    .editorial-grid{grid-template-columns:1fr}
}
@media(max-width:768px){
    .container{width:min(var(--container),calc(100% - 36px))}
    .nav-shell{min-height:68px}
    .menu-toggle{display:block}
    .primary-nav{display:none;position:absolute;top:68px;left:0;right:0;margin:0;padding:12px 18px 18px;align-items:stretch;flex-direction:column;gap:2px;border-bottom:1px solid var(--line);background:white;box-shadow:0 12px 20px rgba(20,42,66,.08)}
    .primary-nav.is-open{display:flex}
    .primary-nav a{padding:10px 4px}
    .primary-nav a[aria-current="page"]:after{display:none}
    .nav-action{display:none}
    .hero{min-height:450px}
    .hero-shade{background:linear-gradient(90deg,rgba(12,28,44,.86),rgba(12,28,44,.62) 70%,rgba(12,28,44,.35))}
    .hero h1{font-size:38px}
    .section{padding:51px 0}
    .section-head h2{font-size:24px}
    .stats-grid{grid-template-columns:1fr 1fr;row-gap:17px}
    .stat:nth-child(2){border-right:0}
    .stat:nth-child(3){padding-left:0}
    .service-layout{grid-template-columns:1fr;gap:25px}
    .poster-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:18px 13px}
    .channel-grid{grid-template-columns:1fr 1fr;grid-template-rows:auto}
    .channel:first-child{grid-row:auto}
    .channel:nth-child(4){grid-column:auto}
    .topic-strip{grid-template-columns:1fr}
    .topic,.topic:first-child{padding:17px 0;border-right:0;border-bottom:1px solid var(--line)}
    .topic:last-child{border-bottom:0}
    .quick-grid{grid-template-columns:1fr 1fr}
    .assurance{grid-template-columns:1fr;gap:8px}
    .signup-layout{grid-template-columns:1fr;gap:20px}
    .footer-grid{grid-template-columns:1fr 1fr;gap:27px}
}
@media(max-width:520px){
    .container{width:calc(100% - 32px)}
    .brand-name{font-size:15px}
    .brand-mark{width:35px;height:35px}
    .hero{min-height:470px}
    .hero-inner{padding-block:48px}
    .hero h1{font-size:34px}
    .hero-subtitle{font-size:16px}
    .hero-description{font-size:14px}
    .hero-actions .button{flex:1}
    .section{padding:43px 0}
    .section-head{align-items:flex-start;flex-direction:column;gap:10px;margin-bottom:21px}
    .section-head h2{font-size:22px}
    .stats-band{padding:20px 0}
    .stat{padding:5px 12px}
    .stat strong{font-size:22px}
    .stat span{font-size:12px}
    .service-grid{grid-template-columns:1fr}
    .service-item{min-height:auto}
    .poster-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:19px 12px}
    .poster-info h3{font-size:14px}
    .popular-layout{grid-template-columns:1fr}
    .featured-film{grid-row:auto;min-height:290px}
    .mini-film{min-height:135px}
    .mini-film img{min-height:109px}
    .channel-grid{grid-template-columns:1fr}
    .channel{min-height:112px}
    .comparison th,.comparison td{padding:12px}
    .timeline{grid-template-columns:1fr 1fr}
    .timeline-item{padding-right:12px}
    .editorial-feature{grid-template-columns:1fr;gap:12px}
    .editorial-feature img{aspect-ratio:1.8}
    .ranking-layout{grid-template-columns:1fr}
    .quick-grid{grid-template-columns:1fr}
    .faq-list{grid-template-columns:1fr}
    .signup-form{grid-template-columns:1fr}
    .signup-note{grid-column:auto}
    .footer-grid{grid-template-columns:1fr 1fr;gap:23px 18px}
    .footer-grid>div:first-child{grid-column:1 / -1}
    .footer-bottom{flex-direction:column;gap:5px}
}
@media(prefers-reduced-motion:reduce){
    *,*::before,*::after{scroll-behavior:auto!important;transition:none!important;animation:none!important}
}

/* roulang page: category1 */
:root{
 --ink:#17283d;--ink-soft:#33475e;--muted:#6e7e90;--line:#e1e8f0;
 --paper:#fff;--wash:#f4f7fb;--blue:#2563a8;--blue-dark:#194b83;
 --blue-pale:#eaf3fc;--mint:#dff3ed;--mint-ink:#26745f;
 --coral:#faeee9;--coral-ink:#a75a42;--gold:#f4c66d;
 --radius:8px;--shadow:0 12px 34px rgba(30,57,86,.08);
 --shadow-hover:0 16px 38px rgba(30,57,86,.14);--container:1200px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:90px}
body{margin:0;background:var(--paper);color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans SC","Microsoft YaHei",sans-serif;font-size:15px;line-height:1.7}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
button,input,select{font:inherit}
button,a,input,select,summary{outline-offset:3px}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid #76a9df;outline-offset:3px}
button{cursor:pointer}
.container{width:min(var(--container),calc(100% - 48px));margin-inline:auto}
.site-header{position:sticky;top:0;z-index:20;background:rgba(255,255,255,.97);border-bottom:1px solid var(--line);backdrop-filter:blur(12px)}
.nav-shell{min-height:76px;display:flex;align-items:center;gap:30px}
.brand{display:flex;align-items:center;gap:11px;min-width:max-content}
.brand-mark{width:38px;height:38px;display:grid;place-items:center;background:var(--blue);color:#fff;border-radius:6px;font-size:14px;font-weight:800;line-height:1}
.brand-name{font-size:17px;font-weight:760;letter-spacing:0;color:var(--ink)}
.primary-nav{margin-left:auto;display:flex;align-items:center;gap:25px}
.primary-nav a{position:relative;padding:8px 0;color:var(--ink-soft);font-size:14px;font-weight:600;transition:color .18s ease}
.primary-nav a:hover,.primary-nav a[aria-current="page"]{color:var(--blue)}
.primary-nav a[aria-current="page"]:after{position:absolute;content:"";height:2px;left:0;right:0;bottom:0;background:var(--blue)}
.menu-toggle{display:none;width:42px;height:42px;margin-left:auto;border:1px solid var(--line);border-radius:6px;background:#fff;color:var(--ink);font-size:21px}
main{min-height:60vh}
.section{padding:58px 0}
.section-tint{background:var(--wash)}
.section-line{border-top:1px solid var(--line)}
.section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:25px}
.section-head h2{margin:0;font-size:26px;line-height:1.3;letter-spacing:0;color:var(--ink)}
.section-head p{max-width:620px;margin:8px 0 0;color:var(--muted);font-size:14px}
.eyebrow{display:block;margin-bottom:7px;color:var(--blue);font-size:12px;font-weight:760}
.text-link{display:inline-flex;align-items:center;gap:8px;color:var(--blue);font-size:14px;font-weight:700;white-space:nowrap}
.text-link:hover{color:var(--blue-dark)}
.page-intro{padding:43px 0 31px;background:#f4f7fb;border-bottom:1px solid var(--line)}
.breadcrumb{display:flex;align-items:center;gap:9px;margin:0 0 17px;color:var(--muted);font-size:13px}
.breadcrumb a{color:var(--blue);font-weight:650}
.breadcrumb a:hover{color:var(--blue-dark)}
.breadcrumb span[aria-hidden="true"]{color:#aeb9c5}
.intro-grid{display:grid;grid-template-columns:minmax(0,1fr) 235px;align-items:end;gap:30px}
.page-intro h1{max-width:780px;margin:0;font-size:36px;line-height:1.25;font-weight:780}
.page-intro h1 span{color:var(--blue)}
.page-intro p{max-width:770px;margin:12px 0 0;color:var(--ink-soft);font-size:15px}
.intro-note{padding:17px 18px;background:#fff;border:1px solid var(--line);border-left:3px solid var(--blue);border-radius:var(--radius);box-shadow:0 5px 18px rgba(30,57,86,.045)}
.intro-note strong{display:block;font-size:14px}
.intro-note span{display:block;margin-top:4px;color:var(--muted);font-size:12px}
.stat-strip{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--line);border-radius:var(--radius);background:#fff;box-shadow:var(--shadow)}
.stat-item{padding:17px 22px;border-right:1px solid var(--line)}
.stat-item:last-child{border-right:0}
.stat-label{display:block;color:var(--muted);font-size:12px}
.stat-value{display:block;margin-top:2px;color:var(--ink);font-size:19px;font-weight:760}
.stat-value small{font-size:12px;font-weight:600;color:var(--muted)}
.filter-bar{display:flex;flex-wrap:wrap;align-items:center;gap:10px;padding:15px 17px;border:1px solid var(--line);border-radius:var(--radius);background:#fff}
.filter-label{margin-right:4px;color:var(--ink-soft);font-size:13px;font-weight:700}
.filter-chip{min-height:34px;padding:6px 12px;border:1px solid var(--line);border-radius:5px;background:#fff;color:var(--ink-soft);font-size:13px;transition:background .18s,border-color .18s,color .18s}
.filter-chip:hover{border-color:#b7cee5;background:var(--blue-pale);color:var(--blue-dark)}
.filter-chip[aria-pressed="true"]{border-color:#b9d2eb;background:var(--blue-pale);color:var(--blue-dark);font-weight:700}
.filter-select{min-height:36px;margin-left:auto;padding:5px 30px 5px 10px;border:1px solid var(--line);border-radius:5px;background:#fff;color:var(--ink-soft);font-size:13px}
.catalog-layout{display:grid;grid-template-columns:minmax(0,1fr) 250px;gap:35px;align-items:start}
.poster-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:25px 17px}
.poster-card{min-width:0;transition:transform .2s}
.poster-card:hover{transform:translateY(-3px)}
.poster-image-wrap{position:relative;overflow:hidden;aspect-ratio:3/4;border-radius:6px;background:#e5ebf1}
.poster-image{width:100%;height:100%;object-fit:cover;transition:transform .25s}
.poster-card:hover .poster-image{transform:scale(1.035)}
.poster-badge{position:absolute;left:9px;top:9px;padding:3px 7px;border-radius:4px;background:rgba(255,255,255,.94);color:var(--blue-dark);font-size:11px;font-weight:750}
.poster-title{margin:10px 0 0;font-size:15px;line-height:1.4;font-weight:730}
.poster-status{margin:4px 0 0;color:var(--muted);font-size:12px}
.poster-meta{display:flex;justify-content:space-between;gap:5px;margin-top:6px;color:var(--muted);font-size:12px}
.rating{color:var(--coral-ink);font-weight:700}
.catalog-aside{position:sticky;top:100px;padding:19px;border:1px solid var(--line);border-radius:var(--radius);background:#fff}
.catalog-aside h2{margin:0 0 12px;font-size:16px}
.aside-list{list-style:none;margin:0;padding:0}
.aside-list li{display:flex;justify-content:space-between;gap:12px;padding:10px 0;border-top:1px solid var(--line);font-size:13px}
.aside-list span:last-child{color:var(--muted);white-space:nowrap}
.aside-caption{margin:14px 0 0;padding-top:12px;border-top:1px solid var(--line);color:var(--muted);font-size:12px}
.button{min-height:42px;padding:9px 15px;display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid transparent;border-radius:6px;font-size:13px;font-weight:700;transition:background .18s,border-color .18s,box-shadow .18s,transform .18s}
.button:hover{transform:translateY(-1px)}
.button-primary{background:var(--blue);color:#fff;box-shadow:0 6px 15px rgba(17,56,95,.16)}
.button-primary:hover{background:var(--blue-dark);box-shadow:0 8px 20px rgba(17,56,95,.2)}
.button-secondary{border-color:#c8d7e6;background:#fff;color:var(--blue-dark)}
.button-secondary:hover{background:var(--blue-pale);border-color:#a9c4df}
.more-row{display:flex;justify-content:center;margin-top:29px}
.feature-pick{display:grid;grid-template-columns:290px minmax(0,1fr);min-height:238px;overflow:hidden;border:1px solid var(--line);border-radius:var(--radius);background:#fff;box-shadow:var(--shadow)}
.feature-pick img{width:100%;height:100%;min-height:238px;object-fit:cover}
.feature-copy{padding:25px 30px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center}
.feature-copy .eyebrow{margin-bottom:8px}
.feature-copy h3{margin:0;font-size:23px;line-height:1.35}
.feature-copy p{max-width:630px;margin:9px 0 14px;color:var(--muted);font-size:14px}
.feature-meta{display:flex;flex-wrap:wrap;gap:8px}
.quality-tag{display:inline-flex;align-items:center;min-height:25px;padding:3px 8px;border-radius:4px;background:var(--blue-pale);color:var(--blue-dark);font-size:11px;font-weight:700}
.quality-tag.mint{background:var(--mint);color:var(--mint-ink)}
.news-layout{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:42px}
.news-list{list-style:none;margin:0;padding:0}
.news-list li{display:grid;grid-template-columns:78px 1fr auto;gap:15px;align-items:center;padding:14px 0;border-top:1px solid var(--line)}
.news-list li:first-child{border-top:0;padding-top:0}
.news-date{color:var(--muted);font-size:12px}
.news-title{font-size:14px;font-weight:650}
.news-title:hover{color:var(--blue)}
.news-kind{color:var(--blue);font-size:11px;font-weight:700}
.news-aside{padding:20px 22px;background:#eaf3fc;border-radius:var(--radius)}
.news-aside h3{margin:0;font-size:16px}
.news-aside p{margin:8px 0 0;color:var(--ink-soft);font-size:13px}
.news-aside .button{margin-top:14px}
.answer-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.answer-item{padding:17px 18px;border:1px solid var(--line);border-radius:var(--radius);background:#fff}
.answer-item h3{margin:0;font-size:14px}
.answer-item p{margin:7px 0 0;color:var(--muted);font-size:13px}
.faq-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.faq-list details{padding:15px 17px;border:1px solid var(--line);border-radius:var(--radius);background:#fff}
.faq-list summary{display:flex;align-items:center;justify-content:space-between;gap:14px;cursor:pointer;list-style:none;font-weight:700;font-size:14px}
.faq-list summary::-webkit-details-marker{display:none}
.faq-list summary:after{content:"+";color:var(--blue);font-size:20px;line-height:1}
.faq-list details[open] summary:after{content:"−"}
.faq-list details p{margin:10px 0 0;color:var(--muted);font-size:13px}
.subscribe-band{padding:26px 28px;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:22px;border:1px solid #d9e6f2;border-radius:var(--radius);background:#f1f7fc}
.subscribe-band h2{margin:0;font-size:21px}
.subscribe-band p{margin:5px 0 0;color:var(--muted);font-size:13px}
.subscribe-form{display:flex;gap:8px}
.subscribe-form input{width:225px;min-height:42px;padding:9px 12px;border:1px solid #cbd8e4;border-radius:6px;background:#fff;color:var(--ink)}
.subscribe-form input::placeholder{color:#8b99a8}
.form-note{grid-column:1/-1;margin:0;color:var(--muted);font-size:11px}
.site-footer{padding:48px 0 20px;background:#f4f7fb;border-top:1px solid var(--line)}
.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:38px;padding-bottom:30px}
.footer-brand{display:inline-flex;align-items:center;gap:10px;font-weight:760}
.footer-summary{max-width:270px;margin:12px 0 0;color:var(--muted);font-size:13px}
.footer-column h2{margin:0 0 12px;font-size:13px}
.footer-links{display:grid;gap:8px}
.footer-links a{width:max-content;max-width:100%;color:var(--muted);font-size:12px;transition:color .18s}
.footer-links a:hover{color:var(--blue)}
.footer-bottom{display:flex;justify-content:space-between;gap:15px;padding-top:16px;border-top:1px solid var(--line);color:var(--muted);font-size:12px}
.footer-bottom a:hover{color:var(--blue)}
@media(max-width:1024px){
 .primary-nav{gap:16px}.nav-shell{gap:20px}.brand-name{font-size:15px}
 .catalog-layout{grid-template-columns:minmax(0,1fr) 220px;gap:24px}
 .poster-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
 .footer-grid{gap:24px}
}
@media(max-width:768px){
 .container{width:min(var(--container),calc(100% - 36px))}
 .nav-shell{min-height:68px}
 .menu-toggle{display:block}
 .primary-nav{display:none;position:absolute;top:67px;left:0;right:0;margin:0;padding:10px 18px 17px;background:#fff;border-bottom:1px solid var(--line);box-shadow:0 12px 24px rgba(30,57,86,.08);flex-direction:column;align-items:stretch;gap:0}
 .primary-nav.is-open{display:flex}
 .primary-nav a{padding:10px 4px}
 .primary-nav a[aria-current="page"]:after{left:4px;right:auto;width:30px;bottom:4px}
 .intro-grid{grid-template-columns:1fr;gap:17px}
 .intro-note{max-width:340px}
 .page-intro h1{font-size:31px}
 .section{padding:45px 0}
 .section-head h2{font-size:23px}
 .catalog-layout{grid-template-columns:1fr}
 .catalog-aside{position:static}
 .poster-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:21px 14px}
 .stat-item{padding:14px}
 .feature-pick{grid-template-columns:230px 1fr}
 .feature-copy{padding:20px}
 .news-layout{grid-template-columns:1fr;gap:22px}
 .answer-grid{grid-template-columns:1fr}
 .footer-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .subscribe-band{grid-template-columns:1fr}
 .subscribe-form input{flex:1;width:auto}
}
@media(max-width:520px){
 .container{width:calc(100% - 32px)}
 .brand{gap:8px}.brand-mark{width:35px;height:35px}.brand-name{font-size:14px}
 .page-intro{padding:31px 0 25px}
 .page-intro h1{font-size:27px}
 .page-intro p{font-size:14px}
 .stat-strip{grid-template-columns:repeat(2,minmax(0,1fr))}
 .stat-item:nth-child(2){border-right:0}
 .stat-item:nth-child(-n+2){border-bottom:1px solid var(--line)}
 .filter-bar{gap:8px;padding:12px}
 .filter-label{width:100%}
 .filter-select{margin-left:0}
 .poster-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 13px}
 .section-head{align-items:flex-start;flex-direction:column;gap:8px}
 .feature-pick{grid-template-columns:1fr}
 .feature-pick img{height:190px;min-height:0}
 .feature-copy{padding:19px}
 .feature-copy h3{font-size:20px}
 .news-list li{grid-template-columns:1fr auto;gap:3px 12px}
 .news-date{grid-column:1/-1}
 .news-title{font-size:13px}
 .faq-list{grid-template-columns:1fr}
 .subscribe-band{padding:21px 17px}
 .subscribe-form{flex-direction:column}
 .subscribe-form input,.subscribe-form .button{width:100%}
 .footer-grid{gap:24px 16px}
 .footer-bottom{flex-direction:column;gap:4px}
}
@media(prefers-reduced-motion:reduce){
 *,*::before,*::after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important}
}

.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}