/* 777d Design System - Emerald Trust Gaming UI */
:root{--c-primary:#22c55e;--c-primary-dark:#16a34a;--c-primary-soft:#dcfce7;--c-secondary:#92400e;--c-accent:#fbbf24;--c-bg:#022c22;--c-bg-soft:#033d2f;--c-surface:#044d3a;--c-surface-strong:#055c46;--c-card:#033d2f;--c-card-alt:#044d3a;--c-border:rgba(34,197,94,.2);--c-border-strong:rgba(34,197,94,.4);--c-text:#e8f5e9;--c-text-soft:#a7f3d0;--c-text-muted:#6ee7b7;--c-footer-bg:#011a14;--c-footer-text:#d1fae5;--shadow-header:0 2px 12px rgba(0,0,0,.3);--shadow-card:0 4px 16px rgba(0,0,0,.2);--shadow-card-hover:0 8px 32px rgba(34,197,94,.15);--radius-sm:8px;--radius-md:12px;--radius-lg:18px;--radius-xl:24px;--radius-pill:100px;--font-base:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,"Noto Sans Bengali",sans-serif;--container-max:1200px;--section-y:clamp(48px,6vw,80px);--header-h:72px;--motion-normal:.3s}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--font-base);background:var(--c-bg);color:var(--c-text);line-height:1.7;overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
a{color:var(--c-primary);text-decoration:none;transition:color var(--motion-normal)}
a:hover{color:var(--c-accent)}
h1,h2,h3,h4{color:var(--c-primary);line-height:1.25;font-weight:700}
h1{font-size:clamp(1.8rem,4vw,3rem);margin-bottom:1.2rem}
h2{font-size:clamp(1.5rem,3vw,2.4rem);margin-bottom:1rem}
h3{font-size:clamp(1.2rem,2vw,1.6rem);margin-bottom:.8rem}
p{margin-bottom:1rem}
.container{max-width:var(--container-max);margin:0 auto;padding:0 clamp(16px,3vw,24px)}
.container-wide{max-width:1400px;margin:0 auto;padding:0 clamp(16px,3vw,24px)}
section,.section-alt{padding:var(--section-y) 0}
.section-alt{background:var(--c-surface)}
.section-intro{font-size:1.1rem;color:var(--c-text-soft);margin-bottom:2rem;max-width:800px}
.section-img{border-radius:var(--radius-lg);margin:2rem auto;box-shadow:var(--shadow-card)}

/* ===== HEADER ===== */
.site-header{position:sticky;top:0;z-index:1000;background:var(--c-footer-bg);box-shadow:var(--shadow-header)}
.header-inner{width:100%;max-width:none;padding:0 clamp(10px,1.2vw,20px);min-height:var(--header-h);display:flex;align-items:center;gap:clamp(10px,1vw,18px)}
.brand-wrap{flex:0 0 auto;margin-right:clamp(4px,.8vw,14px)}
.site-logo{display:block;width:auto;height:clamp(32px,3vw,42px);max-width:clamp(118px,10vw,168px);object-fit:contain}
.primary-nav{flex:1 1 auto;min-width:0;display:flex;align-items:center;justify-content:center;flex-wrap:nowrap;gap:clamp(6px,.72vw,14px);white-space:nowrap;overflow:visible}
.primary-nav a{flex:0 1 auto;min-width:0;padding:9px clamp(6px,.65vw,12px);font-size:clamp(13px,.84vw,15px);line-height:1;white-space:nowrap;color:var(--c-text);border-radius:var(--radius-sm);transition:all var(--motion-normal)}
.primary-nav a:hover,.primary-nav a.active{color:var(--c-primary);background:rgba(34,197,94,.1)}
.header-actions{flex:0 0 auto;margin-left:auto;display:flex;align-items:center;justify-content:flex-end;gap:clamp(6px,.6vw,10px);white-space:nowrap}
.nav-toggle{display:none;width:40px;height:40px;background:none;border:none;cursor:pointer;padding:8px;flex-direction:column;justify-content:center;gap:5px}
.hamburger-line{display:block;width:100%;height:2px;background:var(--c-text);border-radius:2px;transition:var(--motion-normal)}
.mobile-menu{display:none;position:fixed;left:12px;right:12px;top:calc(var(--header-h) + 8px);background:var(--c-bg-soft);border-radius:var(--radius-lg);padding:16px;max-height:calc(100vh - 96px);overflow-y:auto;z-index:999;box-shadow:0 12px 40px rgba(0,0,0,.4);border:1px solid var(--c-border)}
.mobile-menu.is-open{display:block}
.mobile-nav{display:flex;flex-direction:column;gap:4px}
.mobile-nav a{padding:14px 16px;color:var(--c-text);border-radius:var(--radius-sm);font-size:15px}
.mobile-nav a:hover,.mobile-nav a.active{background:rgba(34,197,94,.1);color:var(--c-primary)}
@media(max-width:1180px){.primary-nav{display:none}.nav-toggle{display:inline-flex}.header-inner{padding:0 clamp(8px,2.4vw,14px);gap:clamp(6px,1.8vw,10px)}.header-actions{margin-left:auto}.site-logo{height:clamp(30px,8vw,40px);max-width:clamp(104px,27vw,138px)}}

/* ===== BUTTONS ===== */
.btn{display:inline-flex;align-items:center;justify-content:center;padding:12px 28px;border-radius:var(--radius-pill);font-weight:600;font-size:1rem;cursor:pointer;transition:all var(--motion-normal);border:none;text-decoration:none;min-height:44px}
.btn-primary{background:var(--c-primary);color:#1a1a1a;box-shadow:0 4px 15px rgba(34,197,94,.3)}
.btn-primary:hover{background:var(--c-primary-dark);transform:translateY(-2px);box-shadow:0 6px 20px rgba(34,197,94,.4);color:#1a1a1a}
.btn-secondary{background:transparent;color:var(--c-primary);border:2px solid var(--c-primary)}
.btn-secondary:hover{background:var(--c-primary);color:#1a1a1a}
.btn-outline{background:transparent;color:var(--c-text);border:2px solid var(--c-border-strong)}
.btn-outline:hover{border-color:var(--c-primary);color:var(--c-primary)}
.btn-full{width:100%}
.btn-lg{padding:16px 36px;font-size:1.1rem}

/* ===== HERO ===== */
.home-hero{padding:clamp(60px,8vw,100px) 0 clamp(40px,6vw,80px);background:linear-gradient(135deg,var(--c-bg) 0%,var(--c-surface) 100%)}
.hero-split{display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:center}
.hero-lead{font-size:clamp(1rem,1.2vw,1.2rem);color:var(--c-text-soft);line-height:1.8;margin-bottom:2rem}
.hero-cta{display:flex;gap:16px;flex-wrap:wrap}
.hero-img{border-radius:var(--radius-xl);box-shadow:var(--shadow-card)}
@media(max-width:900px){.hero-split{grid-template-columns:1fr;text-align:center}.hero-cta{justify-content:center}}

/* ===== TRUST STRIP ===== */
.home-trust-strip{padding:40px 0;background:var(--c-footer-bg)}
.trust-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;text-align:center}
.trust-num{display:block;font-size:clamp(1.8rem,3vw,2.8rem);font-weight:700;color:var(--c-primary)}
.trust-label{font-size:.95rem;color:var(--c-text-soft)}
@media(max-width:640px){.trust-grid{grid-template-columns:repeat(2,1fr)}}

/* ===== FEATURE CARDS ===== */
.feature-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:24px}
.feature-card{background:var(--c-card);border:1px solid var(--c-border);border-radius:var(--radius-lg);padding:2rem;transition:transform var(--motion-normal),box-shadow var(--motion-normal)}
.feature-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-card-hover)}
.fc-icon{width:56px;height:56px;background:var(--c-primary);border-radius:50%;display:flex;align-items:center;justify-content:center;margin-bottom:1.2rem;font-size:1.5rem;color:#1a1a1a}

/* ===== SHOWCASE SPLIT ===== */
.showcase-split{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}
.showcase-split.reverse{direction:rtl}.showcase-split.reverse>*{direction:ltr}
.showcase-media img{border-radius:var(--radius-xl);box-shadow:var(--shadow-card)}
.check-list{list-style:none;padding:0;margin:1.5rem 0}.check-list li{padding:.6rem 0 .6rem 28px;position:relative}.check-list li::before{content:"✓";position:absolute;left:0;color:var(--c-primary);font-weight:700}
@media(max-width:900px){.showcase-split{grid-template-columns:1fr}.showcase-split.reverse{direction:ltr}}

/* ===== GUIDE CARDS ===== */
.guide-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:24px}
.guide-card{background:var(--c-card);border-radius:var(--radius-lg);overflow:hidden;border:1px solid var(--c-border);transition:transform var(--motion-normal)}
.guide-card:hover{transform:translateY(-3px)}
.guide-card img{width:100%;height:200px;object-fit:cover}
.guide-card h3,.guide-card p{padding:0 1.5rem}.guide-card h3{padding-top:1.2rem}.guide-card p{padding-bottom:1.5rem}

/* ===== REVIEW CARDS ===== */
.review-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:24px}
.review-card{background:var(--c-card-alt);border-left:4px solid var(--c-primary);padding:2rem;border-radius:var(--radius-md)}
.review-stars{color:var(--c-accent);margin-bottom:.8rem;font-size:1.2rem}
.review-author{font-weight:600;color:var(--c-text-muted);margin-top:.8rem}

/* ===== PLAN CARDS ===== */
.plan-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:24px}
.plan-card{background:var(--c-card);border:2px solid var(--c-border);border-radius:var(--radius-lg);overflow:hidden;transition:transform var(--motion-normal)}
.plan-card:hover{transform:translateY(-4px)}
.plan-featured{border-color:var(--c-primary)}
.plan-header{background:var(--c-primary);color:#1a1a1a;padding:2rem;text-align:center}
.plan-header h3{color:#1a1a1a}
.plan-value{font-size:2.5rem;font-weight:700;margin:.5rem 0}
.plan-features{list-style:none;padding:1.5rem}.plan-features li{padding:.6rem 0;border-bottom:1px solid var(--c-border)}
.plan-card .btn{margin:0 1.5rem 1.5rem}

/* ===== FAQ ===== */
.faq-list{max-width:900px}
.faq-item{background:var(--c-card-alt);border-radius:var(--radius-md);margin-bottom:12px;border-left:4px solid var(--c-primary);overflow:hidden}
.faq-trigger{width:100%;background:none;border:none;padding:18px 20px;display:flex;justify-content:space-between;align-items:center;cursor:pointer;color:var(--c-primary);font-weight:600;font-size:1.05rem;text-align:left;gap:12px}
.faq-trigger:hover{background:rgba(34,197,94,.05)}
.faq-icon{font-size:1.4rem;transition:transform var(--motion-normal);flex-shrink:0}
.faq-answer{display:none;padding:0 20px 18px;color:var(--c-text-soft)}
.faq-item.is-open .faq-answer{display:block}
.faq-item.is-open .faq-icon{transform:rotate(45deg)}
.faq-more{margin-top:1.5rem}

/* ===== CTA PANEL ===== */
.cta-panel{background:linear-gradient(135deg,var(--c-primary) 0%,var(--c-primary-dark) 100%);padding:clamp(40px,5vw,60px);border-radius:var(--radius-xl);text-align:center;color:#1a1a1a}
.cta-panel h2{color:#1a1a1a}
.cta-panel .btn-primary{background:#022c22;color:var(--c-primary);border:2px solid var(--c-primary)}
.cta-panel .btn-primary:hover{background:#033d2f}

/* ===== RELATED GRID ===== */
.related-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:20px}
.related-card{background:var(--c-card);border:1px solid var(--c-border);border-radius:var(--radius-lg);padding:1.5rem;transition:all var(--motion-normal);color:var(--c-text)}
.related-card:hover{border-color:var(--c-primary);transform:translateY(-3px);box-shadow:var(--shadow-card-hover);color:var(--c-text)}
.related-card h3{color:var(--c-primary);margin-bottom:.5rem}

/* ===== BREADCRUMB ===== */
.breadcrumb{font-size:.9rem;color:var(--c-text-muted);margin-bottom:1.5rem}
.breadcrumb a{color:var(--c-text-muted)}.breadcrumb a:hover{color:var(--c-primary)}
.bc-sep{margin:0 8px;opacity:.5}
.bc-current{color:var(--c-primary)}

/* ===== PRIVACY/POLICY ===== */
.policy-layout{display:grid;grid-template-columns:240px 1fr;gap:40px;align-items:start}
.policy-toc{position:sticky;top:90px;background:var(--c-card);border-radius:var(--radius-md);padding:1.5rem}
.policy-toc ul{list-style:none}.policy-toc li{margin-bottom:.6rem}
.policy-toc a{color:var(--c-text-soft);font-size:.9rem}.policy-toc a:hover{color:var(--c-primary)}
.policy-body h2{margin-top:2.5rem;padding-top:1.5rem;border-top:1px solid var(--c-border)}
.policy-body h2:first-child{border-top:none;margin-top:0;padding-top:0}
.policy-body-full{grid-column:1/-1;max-width:960px;margin:0 auto}
.policy-note{background:var(--c-card-alt);border-left:4px solid var(--c-accent);padding:1.2rem 1.5rem;border-radius:var(--radius-sm);margin:1.5rem 0}
.policy-updated{font-size:.9rem;color:var(--c-text-muted)}
@media(max-width:768px){.policy-layout{grid-template-columns:1fr}.policy-toc{position:static}}

/* ===== AUTH PAGES ===== */
.auth-split{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:start}
.auth-form-card{background:var(--c-card);border-radius:var(--radius-xl);padding:2.5rem;border:1px solid var(--c-border)}
.auth-form .form-group{margin-bottom:1.2rem}
.auth-form label{display:block;margin-bottom:.4rem;font-weight:600;color:var(--c-text-soft);font-size:.9rem}
.auth-form input{width:100%;padding:12px 16px;background:var(--c-bg);border:1px solid var(--c-border);border-radius:var(--radius-sm);color:var(--c-text);font-size:1rem;transition:border-color var(--motion-normal)}
.auth-form input:focus{outline:none;border-color:var(--c-primary);box-shadow:0 0 0 3px rgba(34,197,94,.15)}
.auth-alt{text-align:center;margin-top:1.2rem;color:var(--c-text-muted)}
.auth-info{padding-top:1rem}
.auth-benefits{display:grid;gap:16px;margin:1.5rem 0}
.benefit{background:var(--c-card-alt);padding:1.2rem;border-radius:var(--radius-md);border-left:3px solid var(--c-primary)}
.auth-security-note,.auth-help-panel,.auth-trust-card{background:var(--c-card-alt);padding:1.5rem;border-radius:var(--radius-md);margin:1.5rem 0}
@media(max-width:900px){.auth-split{grid-template-columns:1fr}}

/* ===== INNER PAGES ===== */
.inner-hero,.cat-hero,.about-hero,.policy-hero,.faq-hero,.register-hero,.login-hero{padding:clamp(30px,4vw,50px) 0;background:var(--c-surface)}
.inner-lead,.cat-lead,.faq-lead{font-size:1.1rem;color:var(--c-text-soft);max-width:700px}
.cat-intro,.fish-intro,.crash-intro,.bird-intro,.fortune-intro,.bingo-intro,.lottery-intro{padding:var(--section-y) 0}
.intro-split{display:grid;grid-template-columns:1.1fr .9fr;gap:36px;align-items:center}
@media(max-width:900px){.intro-split{grid-template-columns:1fr}}

/* TABLE/TYPE CARDS */
.table-cards,.type-grid,.strategy-grid,.rules-grid,.value-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px}
.t-card,.type-card,.strat-card,.rule-card,.value-card{background:var(--c-card);border:1px solid var(--c-border);border-radius:var(--radius-lg);padding:1.8rem;transition:transform var(--motion-normal)}
.t-card:hover,.type-card:hover,.strat-card:hover,.rule-card:hover,.value-card:hover{transform:translateY(-3px)}

/* STEP LIST */
.step-list{max-width:700px}.step{display:flex;gap:20px;margin-bottom:24px;align-items:flex-start}
.step-num{width:40px;height:40px;background:var(--c-primary);color:#1a1a1a;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:1.2rem;flex-shrink:0}

/* FAQ GROUPS */
.faq-group{margin-bottom:2.5rem}
.faq-group h2{font-size:1.4rem;margin-bottom:1rem;padding-bottom:.5rem;border-bottom:2px solid var(--c-border)}

/* PRIVACY SECTION */
.privacy-panel{background:var(--c-card);border-radius:var(--radius-xl);padding:clamp(24px,4vw,48px)}
.privacy-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px;margin:2rem 0}
.priv-item{background:var(--c-card-alt);padding:1.5rem;border-radius:var(--radius-md)}
.contact-info{background:var(--c-card);padding:1.5rem;border-radius:var(--radius-md);margin:1.5rem 0}

/* ===== FOOTER ===== */
.site-footer{background:var(--c-footer-bg);padding:60px 0 30px;border-top:3px solid var(--c-primary)}
.footer-inner{max-width:var(--container-max);margin:0 auto;padding:0 clamp(16px,3vw,24px)}
.footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:32px}
.footer-col h4{color:var(--c-primary);margin-bottom:1rem}
.footer-links{list-style:none}.footer-links li{margin-bottom:.6rem}
.footer-links a{color:var(--c-footer-text);transition:color var(--motion-normal)}.footer-links a:hover{color:var(--c-primary)}
.footer-bottom{margin-top:2.5rem;padding-top:1.5rem;border-top:1px solid rgba(34,197,94,.2);text-align:center}
.footer-disclaimer{font-size:.85rem;color:var(--c-text-muted);margin-top:.5rem}
@media(max-width:768px){.footer-grid{grid-template-columns:1fr 1fr}.footer-brand{grid-column:1/-1}}
@media(max-width:480px){.footer-grid{grid-template-columns:1fr}}

/* ===== 404 ===== */
.error-section{padding:120px 0;text-align:center}
.error-section h1{font-size:3rem}

/* ===== AOS FALLBACK ===== */
[data-aos]{opacity:1!important;transform:none!important}

/* ===== FOCUS VISIBLE ===== */
:focus-visible{outline:2px solid var(--c-primary);outline-offset:2px}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition-duration:.01ms!important}}
@media(max-width:375px){.site-header .header-inner{padding-left:8px;padding-right:8px;gap:6px}.site-logo{max-width:104px}}