/* roulang page: index */
:root{
      --ink:#171417;
      --ink-soft:#211a20;
      --ink-card:#2a2128;
      --paper:#f3eff0;
      --paper-deep:#e7dde1;
      --white:#f8f4f5;
      --text:#241d22;
      --muted:#786b72;
      --muted-light:#cdbfc5;
      --berry:#a84e78;
      --berry-bright:#c16891;
      --berry-dark:#74314f;
      --silver:#cdb7c4;
      --line:rgba(243,239,240,.18);
      --line-dark:#ded2d7;
      --moss:#718071;
      --shadow:0 22px 60px rgba(34,19,29,.28);
      --shadow-soft:0 13px 34px rgba(51,34,44,.12);
      --radius-xl:24px;
      --radius-lg:16px;
      --radius-sm:10px;
      --wrap:1240px;
      --ease:220ms ease;
    }
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{
      margin:0;background:var(--ink);color:var(--white);
      font-family:"PingFang SC","Microsoft YaHei","Noto Sans SC",Arial,sans-serif;
      font-size:16px;line-height:1.78;letter-spacing:.01em;
      overflow-x:hidden;
    }
    body:before{
      content:"";position:fixed;inset:0;pointer-events:none;z-index:-1;opacity:.22;
      background-image:radial-gradient(rgba(255,255,255,.18) .6px,transparent .7px);
      background-size:7px 7px;
      mask-image:linear-gradient(to bottom,black,transparent 55%);
    }
    a{color:inherit;text-decoration:none;transition:color var(--ease),transform var(--ease),border-color var(--ease),background var(--ease)}
    img{max-width:100%;display:block}
    button,input{font:inherit}
    button{cursor:pointer}
    :focus-visible{outline:3px solid var(--silver);outline-offset:4px}
    .grid-container{max-width:var(--wrap);padding-left:28px;padding-right:28px}
    .eyebrow,.film-label{
      display:inline-flex;align-items:center;gap:9px;font-size:12px;font-weight:700;
      letter-spacing:.14em;line-height:1.2;text-transform:uppercase;
    }
    .eyebrow:before{content:"";width:26px;height:1px;background:currentColor}
    .film-label{
      padding:7px 11px;border:1px solid var(--line);border-radius:999px;color:var(--silver);
      background:rgba(255,255,255,.035);
    }
    .film-label i{display:block;width:5px;height:5px;border-radius:50%;background:var(--berry-bright)}
    .section{padding:112px 0;position:relative}
    .section-light{background:var(--paper);color:var(--text)}
    .section-dark{background:var(--ink-soft)}
    .section-heading{max-width:650px;margin-bottom:48px}
    .section-heading .eyebrow{color:var(--berry)}
    h1,h2,h3,p{margin-top:0}
    h1,h2,h3{font-weight:800;letter-spacing:-.04em;line-height:1.15}
    h1{font-size:clamp(3rem,5.7vw,4.7rem)}
    h2{font-size:clamp(2.1rem,3.5vw,3.25rem);margin-bottom:17px}
    h3{font-size:1.32rem;margin-bottom:10px}
    .section-heading p{max-width:600px;color:var(--muted);font-size:17px}
    .btn{
      min-height:47px;padding:11px 20px;display:inline-flex;align-items:center;justify-content:center;gap:10px;
      border-radius:999px;border:1px solid transparent;font-weight:800;font-size:15px;line-height:1.2;
    }
    .btn:hover{transform:translateY(-3px)}
    .btn-primary{background:var(--berry);color:var(--white);box-shadow:0 10px 24px rgba(168,78,120,.28)}
    .btn-primary:hover{background:var(--berry-bright);color:white}
    .btn-outline{border-color:var(--line);color:var(--white);background:rgba(255,255,255,.025)}
    .btn-outline:hover{border-color:var(--silver);background:rgba(255,255,255,.08)}
    .btn-dark-outline{border-color:#b9a8b0;color:var(--text)}
    .btn-dark-outline:hover{border-color:var(--berry);color:var(--berry-dark);background:#fffafb}
    .icon-arrow{font-size:19px;line-height:0;transform:translateY(-1px)}
    .site-header{background:rgba(23,20,23,.97);border-bottom:1px solid var(--line);position:relative;z-index:20}
    .topnav{height:74px;display:flex;align-items:center;justify-content:space-between;gap:20px}
    .nav-left,.nav-right{display:flex;align-items:center;gap:27px}
    .brand{display:inline-flex;align-items:center;gap:10px;white-space:nowrap;font-weight:900;font-size:17px;letter-spacing:-.04em}
    .brand-mark{width:25px;height:31px;border:1px solid var(--silver);border-radius:3px;position:relative;background:linear-gradient(135deg,rgba(168,78,120,.8),transparent)}
    .brand-mark:after,.brand-mark:before{content:"";position:absolute;left:5px;right:5px;height:2px;background:var(--white)}
    .brand-mark:before{top:10px}.brand-mark:after{bottom:10px}
    .nav-links{display:flex;align-items:center;gap:23px}
    .nav-links a{font-size:14px;color:var(--muted-light);padding:25px 0 21px;border-bottom:2px solid transparent}
    .nav-links a:hover,.nav-links a.active{color:var(--white);border-color:var(--berry-bright)}
    .search-toggle{background:none;border:0;color:var(--white);width:42px;height:42px;display:grid;place-items:center;border-radius:50%}
    .search-toggle:hover{background:rgba(255,255,255,.08)}
    .header-cta{min-height:40px;padding:8px 15px;font-size:13px}
    .mobile-toggle{display:none;background:transparent;border:1px solid var(--line);border-radius:9px;color:var(--white);width:44px;height:40px}
    .mobile-panel{display:none;border-top:1px solid var(--line);padding:16px 28px 22px;background:var(--ink-soft)}
    .mobile-panel.open{display:block}
    .mobile-panel a{display:block;padding:11px 0;color:var(--muted-light)}
    .mobile-search{margin:10px 0 14px}
    .mobile-search label{font-size:13px;color:var(--silver);display:block;margin-bottom:6px}
    .mobile-search input{
      width:100%;border:1px solid var(--line);border-radius:9px;background:#171417;color:white;padding:10px 12px;
    }
    .hero{padding:64px 0 56px;min-height:655px;position:relative;overflow:hidden;background:var(--ink)}
    .hero:after{content:"";position:absolute;width:620px;height:620px;right:-260px;top:-180px;border-radius:50%;background:radial-gradient(circle,rgba(168,78,120,.2),transparent 66%);pointer-events:none}
    .hero-copy{padding:43px 40px 34px 0;position:relative;z-index:1}
    .hero .eyebrow{color:var(--silver)}
    .hero h1{max-width:710px;margin:22px 0 24px}
    .hero h1 em{font-style:normal;color:var(--berry-bright)}
    .hero-intro{max-width:660px;color:#d9cfd3;font-size:17px;line-height:1.85;margin-bottom:25px}
    .hero-meta{display:flex;flex-wrap:wrap;gap:9px;margin:0 0 29px;padding:0;list-style:none}
    .hero-meta li{border:1px solid var(--line);border-radius:999px;padding:6px 11px;color:var(--muted-light);font-size:13px}
    .hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:24px}
    .compliance-note{font-size:13px;color:#aa9ca4;max-width:580px;padding-left:13px;border-left:2px solid var(--moss)}
    .poster-stage{min-height:526px;position:relative;padding:18px 4px 20px 38px}
    .poster-stage:before{content:"";position:absolute;left:0;top:0;bottom:0;width:18px;background:repeating-linear-gradient(to bottom,var(--paper) 0 13px,transparent 13px 24px);opacity:.24}
    .poster{
      width:min(100%,422px);height:515px;position:relative;margin-left:auto;overflow:hidden;
      border:1px solid rgba(243,239,240,.35);border-radius:3px;box-shadow:var(--shadow);
      background:#30222d;
    }
    .poster:before{content:"";position:absolute;inset:0;background:
      radial-gradient(circle at 72% 25%,rgba(205,183,196,.75) 0 3%,transparent 3.5%),
      radial-gradient(ellipse at 35% 70%,rgba(168,78,120,.82),transparent 31%),
      linear-gradient(135deg,#291e29 0%,#51404d 45%,#191619 100%)}
    .poster:after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(15,11,14,.94),transparent 63%)}
    .poster-lines{position:absolute;inset:26px;z-index:1;border:1px solid rgba(255,255,255,.2)}
    .poster-code{position:absolute;left:28px;top:26px;z-index:2;font-size:12px;letter-spacing:.13em;color:#efe6e9}
    .play-symbol{position:absolute;z-index:2;top:43%;left:45%;width:70px;height:70px;border:1px solid rgba(255,255,255,.65);border-radius:50%}
    .play-symbol:after{content:"";position:absolute;left:29px;top:22px;border-top:13px solid transparent;border-bottom:13px solid transparent;border-left:20px solid white}
    .poster-title{position:absolute;left:29px;right:29px;bottom:28px;z-index:2}
    .poster-title b{display:block;font-size:32px;line-height:1.15;letter-spacing:-.08em}
    .poster-title span{display:block;margin-top:10px;color:#d9c9d0;font-size:13px}
    .floating-card{
      position:absolute;left:0;bottom:47px;z-index:3;width:212px;padding:17px;
      border:1px solid rgba(243,239,240,.3);background:rgba(33,26,32,.92);backdrop-filter:blur(10px);box-shadow:var(--shadow);
    }
    .floating-card small{display:block;color:var(--silver);letter-spacing:.12em;font-size:11px}
    .floating-card strong{display:block;font-size:17px;margin:5px 0}
    .floating-card span{font-size:12px;color:#bcaeb5}
    .hero-strip{border-top:1px solid var(--line);padding-top:16px;color:#aaa0a5;font-size:12px;letter-spacing:.08em}
    .hero-strip span{color:var(--berry-bright);margin-right:13px}
    .features-wrap{display:grid;grid-template-columns:minmax(245px,.8fr) 1.55fr;gap:28px;align-items:stretch}
    .feature-intro{padding:26px 10px 20px 0}
    .feature-intro p{color:var(--muted);max-width:290px}
    .feature-intro .mini-index{margin-top:38px;color:var(--berry);font-weight:900;font-size:14px;letter-spacing:.1em}
    .feature-rail{display:grid;grid-template-columns:1.06fr .94fr;gap:18px}
    .feature-card{border:1px solid var(--line-dark);border-radius:var(--radius-lg);padding:24px;position:relative;overflow:hidden;min-height:184px;background:#fbf8f9;box-shadow:var(--shadow-soft);transition:var(--ease)}
    .feature-card:hover{transform:translateY(-4px);border-color:var(--berry);box-shadow:0 20px 35px rgba(88,50,69,.18)}
    .feature-card.major{grid-row:span 2;background:#2b2028;color:var(--white);min-height:386px;display:flex;flex-direction:column;justify-content:flex-end}
    .feature-card.major:before{content:"";position:absolute;width:200px;height:200px;border-radius:50%;right:-60px;top:-55px;background:radial-gradient(circle,rgba(193,104,145,.78),transparent 65%)}
    .feature-num{font-size:12px;font-weight:900;letter-spacing:.12em;color:var(--berry);position:absolute;top:20px;left:23px}
    .major .feature-num{color:var(--silver)}
    .feature-icon{position:absolute;right:22px;top:20px;width:38px;height:38px;border:1px solid currentColor;border-radius:50%;color:var(--berry);opacity:.8}
    .feature-icon:after{content:"";position:absolute;left:15px;top:10px;width:8px;height:14px;border-left:2px solid currentColor;border-right:2px solid currentColor}
    .major .feature-icon{color:var(--silver)}
    .feature-card p{font-size:14px;line-height:1.7;color:var(--muted);margin-bottom:15px}
    .major p{color:#d3c4cb}
    .status{font-size:11px;color:var(--moss);font-weight:800;letter-spacing:.08em}
    .major .status{color:var(--silver)}
    .scenes-track{display:grid;gap:12px}
    .scene-row{
      display:grid;grid-template-columns:88px 1fr 205px;gap:22px;align-items:center;padding:22px 26px;
      border-top:1px solid var(--line);transition:var(--ease);position:relative;
    }
    .scene-row:last-child{border-bottom:1px solid var(--line)}
    .scene-row:hover{padding-left:33px;background:rgba(255,255,255,.035)}
    .scene-no{font-size:30px;font-weight:800;color:var(--berry-bright);letter-spacing:-.08em}
    .scene-row p{margin:0;color:#c8bac1;font-size:14px}
    .scene-tags{display:flex;justify-content:flex-end;flex-wrap:wrap;gap:7px}
    .scene-tags span{font-size:12px;border:1px solid var(--line);color:var(--silver);padding:5px 9px;border-radius:999px}
    .cases-grid{display:grid;grid-template-columns:1.35fr .65fr;gap:18px}
    .case-main,.case-side{border:1px solid var(--line-dark);border-radius:var(--radius-xl);overflow:hidden;background:#fffafb;box-shadow:var(--shadow-soft)}
    .case-main{display:grid;grid-template-columns:1.05fr .95fr;min-height:333px}
    .case-art{min-height:100%;position:relative;background:linear-gradient(145deg,#6c445b,#2b222a 73%)}
    .case-art:before{content:"";position:absolute;inset:22px;border:1px solid rgba(255,255,255,.35);background:repeating-linear-gradient(90deg,transparent 0 28px,rgba(255,255,255,.08) 28px 29px)}
    .case-art:after{content:"";position:absolute;width:128px;height:128px;border-radius:50%;right:31px;top:56px;border:1px solid rgba(255,255,255,.65);box-shadow:0 0 0 22px rgba(255,255,255,.05)}
    .case-copy{padding:35px 31px;color:var(--text)}
    .case-copy p{color:var(--muted);font-size:14px}
    .case-fields{display:grid;gap:9px;margin-top:23px}
    .case-fields div{font-size:13px;border-top:1px solid var(--line-dark);padding-top:8px}
    .case-fields b{color:var(--berry-dark);margin-right:8px}
    .case-stack{display:grid;gap:18px}
    .case-side{padding:22px 23px;min-height:157px;color:var(--text)}
    .case-side p{font-size:13px;color:var(--muted);margin-bottom:10px}
    .case-side .case-fields{margin-top:13px;gap:5px}
    .pricing-intro{display:flex;justify-content:space-between;gap:25px;align-items:end;margin-bottom:35px}
    .pricing-intro p{max-width:530px;color:var(--muted);margin:0}
    .pricing-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;align-items:stretch}
    .price-card{
      background:#fffafb;color:var(--text);border:1px solid var(--line-dark);border-radius:var(--radius-lg);
      padding:27px 25px;position:relative;box-shadow:var(--shadow-soft);
    }
    .price-card.featured{background:var(--ink-card);color:var(--white);transform:translateY(-14px);border-color:var(--berry-bright);box-shadow:var(--shadow)}
    .ticket-notch:before,.ticket-notch:after{content:"";position:absolute;width:23px;height:23px;border-radius:50%;background:var(--paper);top:47%}
    .ticket-notch:before{left:-12px}.ticket-notch:after{right:-12px}
    .price-card h3{margin-top:16px}
    .price-note{min-height:54px;color:var(--muted);font-size:14px}
    .featured .price-note{color:#d2c4ca}
    .price-label{color:var(--berry);font-size:13px;font-weight:900;letter-spacing:.08em}
    .price-card ul{list-style:none;padding:17px 0 10px;margin:17px 0;border-top:1px dashed var(--line-dark)}
    .price-card li{font-size:14px;margin:9px 0;padding-left:20px;position:relative}
    .price-card li:before{content:"";position:absolute;left:0;top:10px;width:7px;height:7px;border-radius:50%;background:var(--moss)}
    .featured li:before{background:var(--berry-bright)}
    .price-card .btn{width:100%;margin-top:8px}
    .rule-note{margin-top:27px;font-size:13px;color:var(--muted);border-left:2px solid var(--berry);padding-left:13px}
    .assurance{padding:28px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
    .assurance-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
    .assurance-item{display:flex;gap:14px;align-items:flex-start}
    .assurance-symbol{flex:0 0 35px;width:35px;height:35px;border:1px solid var(--silver);border-radius:50%;display:grid;place-items:center;color:var(--berry-bright);font-weight:900}
    .assurance-item b{display:block;margin-bottom:2px}.assurance-item p{margin:0;color:#c5b7be;font-size:13px}
    .information-layout{display:grid;grid-template-columns:1.1fr .9fr;gap:52px}
    .news-list{border-top:1px solid var(--line-dark)}
    .news-list a{display:grid;grid-template-columns:90px 1fr 25px;gap:13px;align-items:center;padding:19px 4px;border-bottom:1px solid var(--line-dark);color:var(--text)}
    .news-list a:hover{color:var(--berry-dark);padding-left:9px}
    .news-date{font-size:12px;color:var(--muted);letter-spacing:.07em}
    .news-list b{font-size:16px}.news-list span{font-size:20px;color:var(--berry)}
    .side-read{padding:28px;border-radius:var(--radius-xl);background:var(--ink-card);color:var(--white);position:relative;overflow:hidden}
    .side-read:after{content:"";position:absolute;width:190px;height:190px;border:1px solid rgba(255,255,255,.2);border-radius:50%;right:-65px;bottom:-89px}
    .side-read p{color:#d2c3cb;font-size:14px;max-width:340px}.side-read .btn{margin-top:9px}
    .faq-grid{display:grid;grid-template-columns:.7fr 1.3fr;gap:65px}
    .faq-copy p{color:var(--muted)}
    .accordion{margin:0;background:transparent}
    .accordion-item{border:0;border-bottom:1px solid var(--line-dark);background:transparent}
    .accordion-title{padding:19px 37px 19px 0;border:0;color:var(--text);font-weight:800;font-size:16px;line-height:1.55;position:relative}
    .accordion-title:hover,.accordion-title:focus{background:transparent;color:var(--berry-dark)}
    .accordion-title:before{content:"＋";right:7px;margin-top:0;font-size:23px;color:var(--berry);top:17px}
    .is-active>.accordion-title:before{content:"－"}
    .accordion-content{border:0;background:transparent;color:var(--muted);font-size:14px;padding:0 28px 20px 0;line-height:1.85}
    .closing-cta{padding:58px 0;background:var(--ink)}
    .cta-band{position:relative;overflow:hidden;border:1px solid var(--line);border-radius:var(--radius-xl);padding:43px 47px;background:#2c2029;display:flex;align-items:center;justify-content:space-between;gap:25px}
    .cta-band:before{content:"";position:absolute;width:370px;height:370px;right:-120px;top:-170px;border-radius:50%;background:radial-gradient(circle,rgba(168,78,120,.62),transparent 63%)}
    .cta-band h2{font-size:clamp(1.8rem,3vw,2.65rem);margin-bottom:8px;position:relative}
    .cta-band p{margin:0;color:#d2c3ca;position:relative}
    .cta-band .btn{position:relative;flex:0 0 auto}
    footer{background:#120f12;border-top:1px solid var(--line);padding:57px 0 23px;color:#c2b5bb}
    .footer-grid{display:grid;grid-template-columns:1.4fr .8fr .8fr 1fr;gap:32px;padding-bottom:42px}
    .footer-brand p{font-size:13px;max-width:280px;margin:15px 0 0;color:#9f9299}
    .footer-col h3{font-size:14px;letter-spacing:0;margin:0 0 15px;color:var(--white)}
    .footer-col a{display:block;font-size:13px;color:#a99ba2;margin:8px 0}
    .footer-col a:hover{color:var(--berry-bright)}
    .footer-bottom{border-top:1px solid var(--line);padding-top:19px;display:flex;justify-content:space-between;gap:20px;font-size:12px;color:#81757b}
    .footer-bottom p{margin:0}
    @media (max-width:1023px){
      .nav-links{gap:14px}.nav-left,.nav-right{gap:14px}
      .hero-copy{padding-right:10px}.poster-stage{padding-left:22px}
      .poster{height:470px}.floating-card{left:-10px}
      .features-wrap,.faq-grid{grid-template-columns:1fr}
      .feature-intro{padding:0}.feature-intro .mini-index{margin-top:18px}
      .cases-grid{grid-template-columns:1fr}.case-stack{grid-template-columns:1fr 1fr}
      .information-layout{gap:30px}
    }
    @media (max-width:767px){
      .grid-container{padding-left:20px;padding-right:20px}
      .topnav{height:66px}.nav-links,.nav-right .search-toggle,.nav-right .header-cta{display:none}.mobile-toggle{display:block}
      .brand{font-size:15px}.brand-mark{width:22px;height:27px}
      .hero{padding:28px 0 42px;min-height:0}.hero-copy{padding:24px 0 18px}.hero h1{margin:17px 0 18px}
      .hero-intro{font-size:16px}.poster-stage{padding:21px 0 0 20px;min-height:420px}.poster{height:390px;width:82%;margin-right:0}
      .floating-card{bottom:5px;left:0;width:205px}.hero-strip{margin-top:15px}
      .section{padding:67px 0}.section-heading{margin-bottom:31px}.section-heading p{font-size:16px}
      .feature-rail{grid-template-columns:1fr}.feature-card.major{grid-row:auto;min-height:285px}
      .scene-row{grid-template-columns:54px 1fr;padding:18px 4px;gap:13px}.scene-row:hover{padding-left:8px}.scene-tags{grid-column:2;justify-content:flex-start}
      .case-main{grid-template-columns:1fr}.case-art{min-height:190px}.case-copy{padding:25px}.case-stack{grid-template-columns:1fr}
      .pricing-intro{display:block}.pricing-intro p{margin-top:10px}.pricing-grid{grid-template-columns:1fr;gap:20px}.price-card.featured{transform:none}
      .assurance-grid{grid-template-columns:1fr;gap:19px}.information-layout{grid-template-columns:1fr;gap:31px}
      .faq-grid{gap:26px}.cta-band{padding:31px 25px;display:block}.cta-band .btn{margin-top:22px;width:100%}
      .footer-grid{grid-template-columns:1fr 1fr;gap:28px}.footer-brand{grid-column:1/-1}.footer-bottom{display:block}.footer-bottom p+p{margin-top:7px}
    }
    @media (max-width:520px){
      h1{font-size:2.3rem}.hero-actions{display:grid;grid-template-columns:1fr}.hero-actions .btn{width:100%}
      .poster-stage{min-height:370px}.poster{height:345px;width:86%}.poster-title b{font-size:26px}
      .floating-card{padding:13px;width:185px}.feature-card{padding:21px}.news-list a{grid-template-columns:72px 1fr 19px}.news-list b{font-size:14px}
      .footer-grid{grid-template-columns:1fr}.footer-brand{grid-column:auto}
    }
    @media (prefers-reduced-motion:reduce){
      *,*:before,*:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}
    }

/* roulang page: category1 */
:root{
--ink:#171417;--ink-soft:#211a20;--ink-card:#2a2128;--paper:#f3eff0;--paper-deep:#e7dde1;
--white:#f8f4f5;--text:#241d22;--muted:#786b72;--muted-light:#cdbfc5;--berry:#a84e78;
--berry-bright:#c16891;--berry-dark:#74314f;--silver:#cdb7c4;--line:rgba(243,239,240,.18);
--line-dark:#ded2d7;--moss:#718071;--shadow:0 22px 60px rgba(34,19,29,.28);
--shadow-soft:0 13px 34px rgba(51,34,44,.12);--radius-xl:24px;--radius-lg:16px;
--radius-sm:10px;--wrap:1240px;--ease:220ms ease
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--ink);color:var(--white);font-family:"PingFang SC","Microsoft YaHei","Noto Sans SC",Arial,sans-serif;font-size:16px;line-height:1.78;letter-spacing:.01em;overflow-x:hidden}
body:before{content:"";position:fixed;inset:0;pointer-events:none;z-index:-1;opacity:.16;background-image:radial-gradient(rgba(255,255,255,.18) .6px,transparent .75px);background-size:7px 7px;mask-image:linear-gradient(to bottom,black,transparent 58%)}
a{color:inherit;text-decoration:none;transition:color var(--ease),transform var(--ease),border-color var(--ease),background var(--ease),box-shadow var(--ease)}
button,input{font:inherit} button{cursor:pointer} img{display:block;max-width:100%}
:focus-visible{outline:3px solid var(--berry-bright);outline-offset:4px}
.grid-container{max-width:var(--wrap);padding-left:28px;padding-right:28px}
.site-header{background:rgba(23,20,23,.97);border-bottom:1px solid var(--line);position:relative;z-index:20}
.topnav{height:74px;display:flex;align-items:center;justify-content:space-between;gap:20px}
.nav-left,.nav-right{display:flex;align-items:center;gap:27px}
.brand{display:inline-flex;align-items:center;gap:10px;white-space:nowrap;font-weight:900;font-size:17px;letter-spacing:-.04em}
.brand-mark{width:25px;height:31px;border:1px solid var(--silver);border-radius:3px;position:relative;background:linear-gradient(135deg,rgba(168,78,120,.8),transparent)}
.brand-mark:after,.brand-mark:before{content:"";position:absolute;left:5px;right:5px;height:2px;background:var(--white)}
.brand-mark:before{top:10px}.brand-mark:after{bottom:10px}
.nav-links{display:flex;align-items:center;gap:23px}
.nav-links a{font-size:14px;color:var(--muted-light);padding:25px 0 21px;border-bottom:2px solid transparent}
.nav-links a:hover,.nav-links a.active{color:var(--white);border-color:var(--berry-bright)}
.search-toggle{background:none;border:0;color:var(--white);width:42px;height:42px;display:grid;place-items:center;border-radius:50%}
.search-toggle:hover{background:rgba(255,255,255,.08)}
.header-cta{min-height:40px;padding:8px 15px;font-size:13px}
.mobile-toggle{display:none;background:transparent;border:1px solid var(--line);border-radius:9px;color:var(--white);width:44px;height:40px}
.mobile-panel{display:none;border-top:1px solid var(--line);padding:16px 28px 22px;background:var(--ink-soft)}
.mobile-panel.open{display:block}.mobile-panel a{display:block;padding:11px 0;color:var(--muted-light)}
.mobile-search{margin:10px 0 14px}.mobile-search label{font-size:13px;color:var(--silver);display:block;margin-bottom:6px}
.mobile-search input{width:100%;border:1px solid var(--line);border-radius:9px;background:#171417;color:white;padding:10px 12px}
.btn{min-height:47px;padding:11px 20px;display:inline-flex;align-items:center;justify-content:center;gap:10px;border-radius:999px;border:1px solid transparent;font-weight:800;font-size:15px;line-height:1.2}
.btn:hover{transform:translateY(-3px)}.btn-primary{background:var(--berry);color:var(--white);box-shadow:0 10px 24px rgba(168,78,120,.28)}
.btn-primary:hover{background:var(--berry-bright);color:white}.btn-outline{border-color:var(--line);color:var(--white);background:rgba(255,255,255,.025)}
.btn-outline:hover{border-color:var(--silver);background:rgba(255,255,255,.08)}.btn-dark-outline{border-color:#b9a8b0;color:var(--text)}
.btn-dark-outline:hover{border-color:var(--berry);color:var(--berry-dark);background:#fffafb}
.section{padding:106px 0;position:relative}.section-light{background:var(--paper);color:var(--text)}.section-dark{background:var(--ink-soft)}
.eyebrow,.film-label{display:inline-flex;align-items:center;gap:9px;font-size:12px;font-weight:700;letter-spacing:.14em;line-height:1.2;text-transform:uppercase}
.eyebrow:before{content:"";width:26px;height:1px;background:currentColor}.eyebrow{color:var(--berry)}
.section-heading{max-width:665px;margin-bottom:42px}.section-heading h2{margin:14px 0 14px;font-size:39px;line-height:1.2;letter-spacing:-.055em}
.section-heading p{margin:0;color:var(--muted);font-size:17px}.section-dark .section-heading p{color:var(--muted-light)}
.guide-hero{min-height:484px;padding:58px 0 60px;position:relative;overflow:hidden;background:var(--ink)}
.guide-hero:before{content:"";position:absolute;right:-10%;top:-30%;width:620px;height:620px;border-radius:50%;background:radial-gradient(circle,rgba(168,78,120,.21),transparent 66%)}
.breadcrumb{display:flex;flex-wrap:wrap;gap:9px;margin-bottom:27px;color:var(--muted-light);font-size:13px}.breadcrumb span{opacity:.55}
.guide-copy{padding:24px 30px 10px 0;position:relative;z-index:1}.guide-copy .eyebrow{color:var(--silver)}
h1{font-size:57px;line-height:1.12;letter-spacing:-.07em;margin:18px 0 20px;max-width:690px}h1 em{font-style:normal;color:var(--berry-bright)}
.guide-intro{color:#d9cfd3;font-size:17px;max-width:625px;margin:0 0 22px}
.guide-meta{display:flex;flex-wrap:wrap;gap:9px;margin:0;padding:0;list-style:none}.guide-meta li{border:1px solid var(--line);border-radius:999px;padding:6px 11px;color:var(--muted-light);font-size:13px}
.directory-poster{min-height:345px;margin:0 0 0 18px;padding:25px;position:relative;overflow:hidden;border:1px solid rgba(243,239,240,.3);border-radius:var(--radius-xl);background:linear-gradient(150deg,#392534 0%,#211a20 58%,#573045 100%);box-shadow:var(--shadow)}
.directory-poster:before{content:"";position:absolute;inset:0 0 0 auto;width:21px;background:repeating-linear-gradient(to bottom,var(--paper) 0 12px,transparent 12px 23px);opacity:.25}
.directory-poster:after{content:"";position:absolute;width:230px;height:230px;border:1px solid rgba(243,239,240,.2);border-radius:50%;right:45px;top:62px;box-shadow:0 0 0 26px rgba(243,239,240,.04),0 0 0 54px rgba(243,239,240,.035)}
.poster-number{position:relative;z-index:1;color:var(--silver);font-size:12px;letter-spacing:.16em}.poster-play{position:absolute;z-index:2;right:116px;top:132px;width:68px;height:68px;border:1px solid var(--white);border-radius:50%;display:grid;place-items:center}
.poster-play:after{content:"";margin-left:4px;border-left:17px solid var(--white);border-top:10px solid transparent;border-bottom:10px solid transparent}
.poster-copy{position:absolute;z-index:2;left:25px;bottom:26px;right:25px}.poster-copy strong{display:block;font-size:31px;line-height:1.15;letter-spacing:-.06em}.poster-copy small{display:block;margin-top:9px;color:var(--muted-light);font-size:12px}
.category-rail{background:#2a2128;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:17px 0}
.rail-scroll{display:flex;align-items:center;gap:10px;overflow-x:auto;padding-bottom:2px;scrollbar-width:none}.rail-scroll::-webkit-scrollbar{display:none}
.rail-label{padding-right:14px;color:var(--silver);font-size:12px;white-space:nowrap;letter-spacing:.12em}.rail-link{white-space:nowrap;border:1px solid var(--line);border-radius:999px;padding:8px 14px;font-size:13px;color:var(--muted-light)}
.rail-link:hover,.rail-link.current{background:var(--berry);border-color:var(--berry);color:var(--white)}
.featured-card{display:grid;grid-template-columns:42% 58%;overflow:hidden;border:1px solid var(--line-dark);border-radius:var(--radius-xl);background:#fffafb;box-shadow:var(--shadow-soft)}
.featured-visual{min-height:365px;padding:25px;position:relative;background:linear-gradient(145deg,#381f30,#a84e78 52%,#dfc8d4);color:var(--white);overflow:hidden}
.featured-visual:after{content:"";position:absolute;inset:22px;border:1px solid rgba(255,255,255,.45);border-radius:14px;transform:rotate(-5deg)}
.featured-visual b{position:absolute;bottom:31px;left:29px;z-index:1;max-width:190px;font-size:38px;line-height:1.08;letter-spacing:-.08em}
.featured-visual i{position:absolute;right:28px;top:31px;font-style:normal;font-size:12px;letter-spacing:.18em;z-index:1}
.featured-content{padding:47px 50px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center}.content-tag{font-size:12px;letter-spacing:.12em;color:var(--berry-dark);font-weight:800}
.featured-content h2{margin:12px 0;font-size:32px;line-height:1.22;letter-spacing:-.05em}.featured-content p{margin:0 0 22px;color:var(--muted)}
.detail-list{margin:0 0 25px;padding:0;list-style:none;width:100%}.detail-list li{border-top:1px solid var(--line-dark);padding:9px 0;color:#5e5058;font-size:14px}.detail-list li:last-child{border-bottom:1px solid var(--line-dark)}.detail-list b{display:inline-block;color:var(--berry-dark);width:70px}
.catalog-layout{display:grid;grid-template-columns:1.06fr 1fr .84fr;gap:20px;align-items:start}.catalog-stack{display:grid;gap:20px}
.content-card{position:relative;border:1px solid var(--line);border-radius:var(--radius-lg);overflow:hidden;background:var(--ink-card);transition:transform var(--ease),box-shadow var(--ease),border-color var(--ease)}
.content-card:hover{transform:translateY(-4px);border-color:rgba(243,239,240,.48);box-shadow:var(--shadow)}.cover-card{min-height:498px;display:flex;flex-direction:column;justify-content:flex-end;padding:25px;background:linear-gradient(155deg,#74405b,#2a2128 56%,#151216)}
.cover-card:before{content:"";position:absolute;top:19px;bottom:19px;left:15px;width:7px;background:repeating-linear-gradient(to bottom,rgba(243,239,240,.72) 0 11px,transparent 11px 20px);opacity:.55}.cover-card:after{content:"";position:absolute;width:220px;height:220px;border:1px solid rgba(255,255,255,.2);border-radius:50%;right:-75px;top:48px}
.card-body{position:relative;z-index:1}.card-tag{display:inline-flex;border:1px solid rgba(243,239,240,.32);padding:5px 9px;border-radius:999px;font-size:11px;color:var(--silver);letter-spacing:.09em}
.content-card h3{margin:14px 0 9px;font-size:24px;line-height:1.25;letter-spacing:-.045em}.content-card p{margin:0;color:#d4c7cd;font-size:14px;line-height:1.72}.card-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:19px;color:var(--muted-light);font-size:12px}.arrow-mark{font-size:23px;line-height:1;color:var(--white)}
.horizontal-card{min-height:238px;padding:25px;background:#322730}.horizontal-card:nth-child(2){background:linear-gradient(135deg,#211a20,#4a283c)}
.mini-index{padding:25px;background:var(--paper);color:var(--text);border-color:var(--line-dark)}.mini-index .card-tag{border-color:#cbbbc2;color:var(--berry-dark)}.mini-index p,.mini-index .card-foot{color:var(--muted)}.mini-index .arrow-mark{color:var(--berry-dark)}
.reading-grid{display:grid;grid-template-columns:220px 1fr;gap:50px;align-items:start}.reading-side{position:sticky;top:25px}.reading-side h2{font-size:38px;line-height:1.18;letter-spacing:-.06em;margin:14px 0}.reading-side p{color:var(--muted);margin:0}
.steps{display:grid;gap:12px}.step{display:grid;grid-template-columns:62px 1fr;gap:19px;padding:23px 25px;border-top:1px solid var(--line-dark);background:#fffafb}.step:last-child{border-bottom:1px solid var(--line-dark)}.step-no{font-size:13px;letter-spacing:.14em;color:var(--berry-dark);font-weight:900;padding-top:4px}.step h3{font-size:20px;margin:0 0 5px;line-height:1.35}.step p{margin:0;color:var(--muted);font-size:15px}
.faq-wrap{display:grid;grid-template-columns:.72fr 1.28fr;gap:80px}.faq-wrap h2{font-size:40px;line-height:1.18;letter-spacing:-.06em;margin:14px 0}.faq-wrap>div>p{color:var(--muted-light)}
.accordion{margin:0;background:transparent}.accordion-item{border:1px solid var(--line);margin-bottom:10px;border-radius:var(--radius-sm);overflow:hidden;background:rgba(255,255,255,.025)}
.accordion-title{position:relative;background:transparent;border:0;color:var(--white);font-weight:800;font-size:16px;padding:19px 56px 19px 20px;line-height:1.55}.accordion-title:hover,.accordion-title:focus{background:rgba(255,255,255,.05);color:var(--white)}
.accordion-title:before{content:"＋";font-size:23px;right:20px;top:50%;transform:translateY(-52%);color:var(--berry-bright)}.is-active>.accordion-title:before{content:"－"}
.accordion-content{background:#2a2128;color:#d9cfd3;border:0;padding:0 20px 20px;font-size:15px;line-height:1.8}
.bottom-cta{padding:0 0 108px;background:var(--ink-soft)}.cta-panel{position:relative;overflow:hidden;padding:53px 58px;border:1px solid var(--line);border-radius:var(--radius-xl);background:#31212d;display:flex;align-items:center;justify-content:space-between;gap:30px}
.cta-panel:after{content:"";position:absolute;width:390px;height:390px;border-radius:50%;right:-120px;top:-210px;background:radial-gradient(circle,rgba(193,104,145,.38),transparent 65%)}.cta-panel h2{position:relative;z-index:1;font-size:34px;line-height:1.2;letter-spacing:-.06em;margin:0 0 9px}.cta-panel p{position:relative;z-index:1;margin:0;color:var(--muted-light)}
.cta-panel .btn{position:relative;z-index:1;white-space:nowrap}
footer{background:#121013;border-top:1px solid var(--line);padding:65px 0 25px}.footer-grid{display:grid;grid-template-columns:1.7fr 1fr 1fr 1fr;gap:36px}
.footer-brand p{max-width:330px;color:var(--muted-light);font-size:14px;margin:16px 0 0}.footer-col h3{font-size:14px;color:var(--white);margin:0 0 12px}.footer-col a{display:block;color:var(--muted-light);font-size:14px;padding:4px 0}.footer-col a:hover{color:var(--berry-bright)}
.footer-bottom{border-top:1px solid var(--line);margin-top:49px;padding-top:20px;display:flex;justify-content:space-between;gap:20px;color:#9e9197;font-size:12px}.footer-bottom p{margin:0}
@media(max-width:1023px){.guide-copy{padding-right:0}h1{font-size:48px}.directory-poster{margin-left:0}.catalog-layout{grid-template-columns:1fr 1fr}.catalog-layout>.cover-card{grid-row:span 2}.faq-wrap{gap:44px}.featured-content{padding:37px}.footer-grid{grid-template-columns:1.5fr 1fr 1fr}}
@media(max-width:639px){.grid-container{padding-left:20px;padding-right:20px}.topnav{height:65px}.nav-links,.search-toggle,.header-cta{display:none}.nav-left,.nav-right{gap:10px}.brand{font-size:15px}.brand-mark{width:21px;height:27px}.mobile-toggle{display:block}.guide-hero{padding:40px 0 44px}.guide-copy{padding:0}.breadcrumb{margin-bottom:19px}h1{font-size:38px;line-height:1.14;margin:15px 0 16px}.guide-intro{font-size:16px}.directory-poster{min-height:265px;margin-top:28px}.poster-play{right:84px;top:90px;width:57px;height:57px}.poster-copy strong{font-size:26px}.section{padding:65px 0}.section-heading{margin-bottom:28px}.section-heading h2,.faq-wrap h2{font-size:31px}.featured-card{grid-template-columns:1fr}.featured-visual{min-height:260px}.featured-content{padding:29px 23px}.featured-content h2{font-size:27px}.catalog-layout{grid-template-columns:1fr}.catalog-layout>.cover-card{min-height:392px}.reading-grid,.faq-wrap{grid-template-columns:1fr;gap:28px}.reading-side{position:static}.step{grid-template-columns:47px 1fr;padding:19px}.bottom-cta{padding-bottom:65px}.cta-panel{padding:33px 24px;display:block}.cta-panel h2{font-size:29px}.cta-panel .btn{width:100%;margin-top:22px}.footer-grid{grid-template-columns:1fr 1fr;gap:28px}.footer-brand{grid-column:1/-1}.footer-bottom{display:block;margin-top:34px}.footer-bottom p+p{margin-top:7px}}
@media(max-width:420px){.footer-grid{grid-template-columns:1fr}.footer-brand{grid-column:auto}.guide-meta{gap:6px}.guide-meta li{font-size:12px}.btn{width:100%}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}}
