:root{
    --c-bg:#0a0608;
    --c-surface:#140c10;
    --c-card:#1e1318;
    --c-red:#dc2626;
    --c-crimson:#be123c;
    --c-rose:#f43f5e;
    --c-gold:#eab308;
    --c-text:#fce7f3;
    --c-dim:#9ca3af;
    --c-line:rgba(220,38,38,0.12);
    --font-display:'Trebuchet MS',system-ui,sans-serif;
    --font-body:Verdana,Geneva,sans-serif;
    --max-w:1240px;
    --gap:24px
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:var(--font-body);background:var(--c-bg);color:var(--c-text);line-height:1.75;font-size:15px}
a{color:var(--c-rose);text-decoration:none;transition:color .2s}
a:hover{color:var(--c-gold)}
img{max-width:100%;height:auto;display:block}
.container{max-width:var(--max-w);margin:0 auto;padding:0 20px}

/*========== SITE HEADER ==========*/
.site-header{background:var(--c-surface);position:sticky;top:0;z-index:999;border-bottom:1px solid var(--c-line)}
.site-header__inner{display:flex;align-items:center;gap:20px;padding:16px 20px;max-width:var(--max-w);margin:0 auto}
.site-header__logo{font-family:var(--font-display);font-size:30px;font-weight:800;flex-shrink:0;margin-right:24px}
.site-header__logo b{color:var(--c-red)}
.site-header__logo span{color:var(--c-gold)}
.site-header__nav{display:flex;gap:6px;flex:1;justify-content:center;margin:0 24px}
.site-header__nav a{color:var(--c-dim);font-size:15px;padding:10px 16px;border-radius:6px;transition:all .2s}
.site-header__nav a:hover{color:var(--c-text);background:rgba(220,38,38,0.1)}
.site-header__nav a.is-active{color:var(--c-rose)}
.site-header__actions{display:flex;gap:10px;flex-shrink:0;margin-left:24px}
.btn{font-family:var(--font-display);border-radius:8px;font-weight:600;font-size:14px;padding:10px 20px;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center;justify-content:center;border:none;min-width:110px}
.btn--primary{background:var(--c-red);color:#fff}
.btn--primary:hover{background:var(--c-crimson);color:#fff}
.btn--outline{background:transparent;border:2px solid var(--c-red);color:var(--c-red)}
.btn--outline:hover{background:var(--c-red);color:#fff}
.btn--large{padding:14px 32px;font-size:16px;min-width:160px}
.site-header__toggle{display:none;background:none;border:none;color:var(--c-text);font-size:26px;cursor:pointer}

/*========== HERO BANNER ==========*/
.hero-banner{padding:100px 0 80px;background:linear-gradient(to bottom,var(--c-surface),var(--c-bg))}
.hero-banner__grid{display:grid;grid-template-columns:1.1fr 0.9fr;gap:50px;align-items:center}
.hero-banner__content{}
.hero-banner__tag{display:inline-flex;align-items:center;gap:8px;background:rgba(220,38,38,0.12);color:var(--c-rose);padding:8px 18px;border-radius:30px;font-size:13px;font-weight:600;margin-bottom:24px}
.hero-banner__title{font-family:var(--font-display);font-size:44px;line-height:1.2;margin-bottom:20px}
.hero-banner__title em{font-style:normal;color:var(--c-red)}
.hero-banner__desc{color:var(--c-dim);font-size:17px;margin-bottom:28px;max-width:520px}
.hero-banner__buttons{display:flex;gap:14px;margin-bottom:36px}
.hero-banner__metrics{display:flex;gap:40px}
.hero-banner__metric{text-align:center}
.hero-banner__metric strong{display:block;font-size:28px;color:var(--c-gold);font-family:var(--font-display)}
.hero-banner__metric span{font-size:11px;color:var(--c-dim);text-transform:uppercase;letter-spacing:0.5px}
.hero-banner__visual img{border-radius:16px;box-shadow:0 25px 60px rgba(220,38,38,0.15)}

/*========== FEATURES STRIP ==========*/
.features-strip{padding:60px 0;background:var(--c-surface);border-top:1px solid var(--c-line);border-bottom:1px solid var(--c-line)}
.features-strip__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--gap)}
.features-strip__item{display:flex;align-items:flex-start;gap:16px}
.features-strip__icon{width:52px;height:52px;background:linear-gradient(135deg,var(--c-red),var(--c-crimson));border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:22px;flex-shrink:0}
.features-strip__text h4{font-size:15px;margin-bottom:4px;font-family:var(--font-display)}
.features-strip__text p{color:var(--c-dim);font-size:13px;line-height:1.5}

/*========== SECTION COMMON ==========*/
.section{padding:80px 0}
.section--alt{background:var(--c-surface)}
.section__header{text-align:center;margin-bottom:50px}
.section__title{font-family:var(--font-display);font-size:34px;margin-bottom:12px}
.section__title em{font-style:normal;color:var(--c-red)}
.section__subtitle{color:var(--c-dim);font-size:16px;max-width:600px;margin:0 auto}

/*========== SPLIT CONTENT ==========*/
.split-content{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}
.split-content--reverse{direction:rtl}
.split-content--reverse>*{direction:ltr}
.split-content__image img{border-radius:14px}
.split-content__body{}
.split-content__title{font-family:var(--font-display);font-size:30px;margin-bottom:16px}
.split-content__title em{font-style:normal;color:var(--c-red)}
.split-content__lead{color:var(--c-rose);font-size:16px;margin-bottom:16px}
.split-content__text{color:var(--c-dim);font-size:15px;margin-bottom:14px}
.split-content__list{list-style:none;margin:20px 0}
.split-content__list li{padding:10px 0 10px 28px;position:relative;color:var(--c-dim)}
.split-content__list li::before{content:'✓';position:absolute;left:0;color:var(--c-gold);font-weight:bold}

/*========== GAMES SHOWCASE ==========*/
.games-showcase__header{display:flex;justify-content:space-between;align-items:center;margin-bottom:30px}
.games-showcase__header h2{font-family:var(--font-display);font-size:28px}
.games-showcase__header a{color:var(--c-rose);font-size:14px}
.games-showcase__scroll{display:flex;gap:18px;overflow-x:auto;padding-bottom:16px;scroll-snap-type:x mandatory}
.games-showcase__scroll::-webkit-scrollbar{height:5px}
.games-showcase__scroll::-webkit-scrollbar-thumb{background:var(--c-red);border-radius:3px}
.game-card{flex:0 0 220px;background:var(--c-card);border-radius:14px;overflow:hidden;scroll-snap-align:start;transition:transform .2s,box-shadow .2s}
.game-card:hover{transform:translateY(-6px);box-shadow:0 12px 30px rgba(220,38,38,0.2)}
.game-card__image{height:130px;overflow:hidden}
.game-card__image img{width:100%;height:100%;object-fit:cover}
.game-card__body{padding:16px}
.game-card__name{font-size:14px;font-weight:600;margin-bottom:4px}
.game-card__meta{color:var(--c-dim);font-size:11px;margin-bottom:12px}
.game-card .btn{width:100%;padding:8px;font-size:12px;min-width:auto}

/*========== ARTICLE BLOCK ==========*/
.article-block{max-width:860px;margin:0 auto}
.article-block h2{font-family:var(--font-display);font-size:32px;text-align:center;margin-bottom:32px}
.article-block h2 em{font-style:normal;color:var(--c-red)}
.article-block h3{font-family:var(--font-display);font-size:22px;color:var(--c-rose);margin:32px 0 16px}
.article-block p{color:var(--c-dim);font-size:16px;margin-bottom:18px;text-align:justify}
.article-block ul{list-style:none;margin:20px 0}
.article-block li{padding:8px 0 8px 26px;position:relative;color:var(--c-dim)}
.article-block li::before{content:'→';position:absolute;left:4px;color:var(--c-red)}

/*========== PROCESS STEPS ==========*/
.process-steps__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--gap);margin-top:40px}
.process-step{background:var(--c-card);border-radius:14px;padding:28px 24px;text-align:center;border:1px solid var(--c-line);position:relative}
.process-step__number{width:48px;height:48px;background:linear-gradient(135deg,var(--c-red),var(--c-rose));border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto 16px;font-weight:bold;font-size:18px;font-family:var(--font-display)}
.process-step__title{font-size:16px;margin-bottom:8px;font-family:var(--font-display)}
.process-step__desc{color:var(--c-dim);font-size:13px}

/*========== ACCORDION ==========*/
.accordion{max-width:800px;margin:0 auto}
.accordion__item{background:var(--c-card);border-radius:10px;margin-bottom:10px;border:1px solid var(--c-line);overflow:hidden}
.accordion__trigger{width:100%;padding:18px 24px;background:none;border:none;color:var(--c-text);font-size:15px;font-weight:600;text-align:left;cursor:pointer;display:flex;justify-content:space-between;align-items:center;font-family:var(--font-display)}
.accordion__trigger::after{content:'+';font-size:22px;color:var(--c-red);transition:transform .2s}
.accordion__item.is-open .accordion__trigger::after{transform:rotate(45deg)}
.accordion__content{max-height:0;overflow:hidden;transition:max-height .3s,padding .3s}
.accordion__item.is-open .accordion__content{max-height:250px;padding:0 24px 20px}
.accordion__content p{color:var(--c-dim);font-size:14px;line-height:1.7}

/*========== TESTIMONIALS ==========*/
.testimonials__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--gap);margin-top:40px}
.testimonial{background:var(--c-card);border-radius:14px;padding:28px;border:1px solid var(--c-line)}
.testimonial__stars{color:var(--c-gold);font-size:16px;margin-bottom:14px}
.testimonial__quote{font-size:15px;font-style:italic;margin-bottom:18px;line-height:1.7}
.testimonial__author{display:flex;align-items:center;gap:12px}
.testimonial__avatar{width:42px;height:42px;background:var(--c-red);border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:bold}
.testimonial__info h5{font-size:14px;margin-bottom:2px}
.testimonial__info span{font-size:11px;color:var(--c-dim)}

/*========== CTA BANNER ==========*/
.cta-banner{padding:80px 0;background:linear-gradient(135deg,var(--c-red),var(--c-crimson))}
.cta-banner__inner{text-align:center;max-width:700px;margin:0 auto}
.cta-banner__title{font-family:var(--font-display);font-size:36px;margin-bottom:16px}
.cta-banner__text{font-size:17px;opacity:0.9;margin-bottom:28px}
.cta-banner .btn{background:#fff;color:var(--c-red)}
.cta-banner .btn:hover{background:var(--c-gold);color:#000}

/*========== SITE FOOTER ==========*/
.site-footer{background:var(--c-surface);padding:60px 0 30px;border-top:1px solid var(--c-line)}
.site-footer__grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:40px;margin-bottom:40px}
.site-footer__brand p{color:var(--c-dim);font-size:13px;margin-top:16px;line-height:1.7}
.site-footer__col h5{color:var(--c-gold);font-size:11px;text-transform:uppercase;letter-spacing:1px;margin-bottom:16px;font-family:var(--font-display)}
.site-footer__col a{display:block;color:var(--c-dim);font-size:13px;margin-bottom:10px}
.site-footer__bottom{text-align:center;padding-top:30px;border-top:1px solid var(--c-line)}
.site-footer__bottom p{color:var(--c-dim);font-size:12px;margin-bottom:12px}
.site-footer__warning{display:inline-block;background:rgba(220,38,38,0.1);padding:12px 24px;border-radius:8px;font-size:11px;color:var(--c-dim)}

/*========== RESPONSIVE ==========*/
@media(max-width:1024px){
    .hero-banner__grid{grid-template-columns:1fr}
    .hero-banner__content{text-align:center;order:2}
    .hero-banner__desc{margin:0 auto 28px}
    .hero-banner__buttons{justify-content:center}
    .hero-banner__metrics{justify-content:center}
    .hero-banner__visual{order:1;max-width:480px;margin:0 auto}
    .features-strip__grid{grid-template-columns:repeat(2,1fr)}
    .split-content{grid-template-columns:1fr}
    .split-content--reverse{direction:ltr}
    .split-content__image{max-width:480px;margin:0 auto}
    .split-content__body{text-align:center}
    .process-steps__grid{grid-template-columns:repeat(2,1fr)}
    .testimonials__grid{grid-template-columns:1fr}
    .site-footer__grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:768px){
    .site-header__nav{display:none;position:absolute;top:100%;left:0;right:0;background:var(--c-surface);flex-direction:column;padding:20px;margin:0;border-bottom:1px solid var(--c-line)}
    .site-header__nav.is-open{display:flex}
    .site-header__nav a{padding:14px;text-align:center;border-radius:0;border-bottom:1px solid var(--c-line)}
    .site-header__toggle{display:block}
    .site-header__actions{margin-left:auto}
    .site-header__actions .btn{min-width:80px;padding:8px 14px;font-size:13px}
    .hero-banner{padding:80px 0 60px}
    .hero-banner__title{font-size:32px}
    .hero-banner__metrics{flex-wrap:wrap;gap:24px}
    .features-strip__grid{grid-template-columns:1fr}
    .games-showcase__scroll{gap:14px}
    .game-card{flex:0 0 200px}
    .process-steps__grid{grid-template-columns:1fr;max-width:320px;margin:40px auto 0}
    .site-footer__grid{grid-template-columns:1fr;text-align:center}
}
@media(max-width:480px){
    .site-header__logo{font-size:24px}
    .site-header__actions .btn{min-width:60px;padding:6px 10px;font-size:12px}
    .hero-banner__title{font-size:28px}
    .hero-banner__buttons{flex-direction:column;align-items:center}
    .hero-banner__buttons .btn{width:100%;max-width:280px}
}