/*
Theme Name: Fast Payout Casinos UK
Theme URI: https://fastpayoutcasinosuk.cn.com
Description: Casino affiliate theme for Fast Payout Casinos UK
Version: 1.0.0
Author: Fast Payout Casinos UK
Author URI: https://fastpayoutcasinosuk.cn.com
Text Domain: nokyc
*/

/* ── RESET & BASE ──────────────────────────────────── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:'Inter',sans-serif;font-size:16px;line-height:1.7;color:#e0e0e0;background:#0d0f14;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:#f5c518;text-decoration:none;transition:color .2s}
a:hover{color:#ffd84d}
h1,h2,h3,h4,h5,h6{font-family:'Space Grotesk',sans-serif;font-weight:700;line-height:1.2;color:#ffffff}

/* ── UTILITY ───────────────────────────────────────── */
.container{max-width:1280px;margin:0 auto;padding:0 24px;width:100%}
.section-spacing{padding:80px 0}
.text-center{text-align:center}

/* ── HEADER ────────────────────────────────────────── */
.site-header{position:sticky;top:0;z-index:1000;background:#0a0c10;border-bottom:2px solid #f5c518;padding:0 24px}
.site-header .container{display:flex;align-items:center;justify-content:space-between;height:64px}
.site-logo{font-family:'Space Grotesk',sans-serif;font-size:20px;font-weight:700;color:#f5c518;letter-spacing:-0.5px}
.site-logo span{color:#ffffff}
.main-nav{display:flex;gap:32px;align-items:center}
.main-nav a{font-size:14px;font-weight:600;color:#b0b0b0;text-transform:uppercase;letter-spacing:1px;transition:color .2s}
.main-nav a:hover,.main-nav a.active{color:#f5c518}
.hamburger{display:none;background:none;border:none;cursor:pointer;padding:8px}
.hamburger span{display:block;width:24px;height:2px;background:#f5c518;margin:5px 0;transition:all .3s}
.mobile-nav{display:none;position:fixed;top:64px;left:0;right:0;bottom:0;background:#0a0c10;z-index:999;flex-direction:column;padding:40px 24px;gap:24px}
.mobile-nav.active{display:flex}
.mobile-nav a{font-size:18px;font-weight:600;color:#e0e0e0;text-transform:uppercase;letter-spacing:1px;padding:12px 0;border-bottom:1px solid #1a1d26}

/* ── HERO ──────────────────────────────────────────── */
.hero{height:60vh;min-height:400px;display:flex;align-items:center;justify-content:center;text-align:center;background:#0a0c10;position:relative;overflow:hidden}
.hero::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:radial-gradient(ellipse at center,rgba(245,197,24,0.06) 0%,transparent 70%)}
.hero-content{position:relative;z-index:1;max-width:900px;padding:0 24px}
.hero h1{font-size:clamp(32px,5vw,56px);margin-bottom:20px;color:#ffffff}
.hero h1 em{font-style:normal;color:#f5c518}
.hero p{font-size:clamp(16px,2vw,20px);color:#9a9a9a;margin-bottom:32px;max-width:700px;margin-left:auto;margin-right:auto}
.btn-primary{display:inline-block;background:#f5c518;color:#0a0c10;font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:16px;padding:16px 40px;border-radius:0;text-transform:uppercase;letter-spacing:1.5px;transition:background .2s,transform .1s;border:none;cursor:pointer}
.btn-primary:hover{background:#ffd84d;color:#0a0c10;transform:translateY(-1px)}

/* ── INNER HERO ────────────────────────────────────── */
.inner-hero{min-height:40vh;display:flex;align-items:center;justify-content:center;text-align:center;background:#0a0c10;position:relative;padding:60px 24px}
.inner-hero::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:radial-gradient(ellipse at center,rgba(245,197,24,0.06) 0%,transparent 70%)}
.inner-hero-content{position:relative;z-index:1}
.inner-hero h1{font-size:clamp(28px,4vw,48px);margin-bottom:16px}
.inner-hero p{font-size:18px;color:#9a9a9a;max-width:600px;margin:0 auto 24px}
.hero-badges{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin-top:24px}
.hero-badge{background:#161921;border:1px solid #f5c518;color:#f5c518;font-family:'Space Grotesk',sans-serif;font-size:13px;font-weight:600;padding:8px 20px;text-transform:uppercase;letter-spacing:0.5px}
.howwerate-hero{min-height:45vh}
.criteria-badges{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin-top:24px}
.criteria-badge{background:#161921;border:1px solid #2a6df0;color:#80b0ff;font-family:'Space Grotesk',sans-serif;font-size:13px;font-weight:600;padding:10px 24px;letter-spacing:0.5px}

/* ── CASINO GRID ───────────────────────────────────── */
.casino-grid-section{background:#0d0f14;padding:80px 0}
.casino-grid-section h2{font-size:clamp(24px,3vw,36px);margin-bottom:40px;color:#ffffff}
.casino-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.casino-card{background:#161921;border:1px solid #1e2230;transition:border-color .2s;overflow:hidden;display:flex;flex-direction:column}
.casino-card:hover{border-color:#f5c518}
.casino-card-rank{background:#f5c518;color:#0a0c10;font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:13px;padding:4px 12px;display:inline-block;position:absolute;top:0;left:0}
.casino-card-header{position:relative;padding:20px;display:flex;align-items:center;gap:16px;border-bottom:1px solid #1e2230}
.casino-card-logo{width:60px;height:60px;object-fit:contain;background:#0d0f14;padding:4px;flex-shrink:0}
.casino-card-title{font-size:16px;font-weight:700;color:#ffffff;margin-bottom:4px}
.casino-card-stars{color:#f5c518;font-size:14px;letter-spacing:2px}
.casino-card-badge{font-size:11px;color:#4ade80;font-weight:600;text-transform:uppercase;letter-spacing:0.5px}
.casino-card-body{padding:20px;flex:1;display:flex;flex-direction:column;gap:8px}
.casino-card-bonus{font-family:'Space Grotesk',sans-serif;font-size:18px;font-weight:700;color:#f5c518;margin-bottom:4px}
.casino-meta{display:flex;flex-direction:column;gap:4px;font-size:13px;color:#9a9a9a}
.casino-meta span strong{color:#e0e0e0}
.casino-card-footer{padding:20px;border-top:1px solid #1e2230;display:flex;flex-direction:column;gap:8px}
.casino-card-cta{display:block;text-align:center;background:#f5c518;color:#0a0c10;font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:14px;padding:12px;text-transform:uppercase;letter-spacing:1px;transition:background .2s}
.casino-card-cta:hover{background:#ffd84d;color:#0a0c10}
.casino-card-terms{font-size:11px;color:#666;text-align:center}

/* ── REVIEWS ───────────────────────────────────────── */
.reviews-section{background:#0d0f14;padding:80px 0}
.reviews-section>h2,.reviews-section>.container>h2{font-size:clamp(24px,3vw,36px);margin-bottom:48px;color:#ffffff}
.review-block{margin-bottom:64px;border-bottom:1px solid #1e2230;padding-bottom:64px}
.review-block:last-child{border-bottom:none}
.review-topbar{display:flex;align-items:center;gap:20px;margin-bottom:32px;flex-wrap:wrap}
.review-topbar-logo{width:56px;height:56px;object-fit:contain;background:#161921;padding:4px;border:1px solid #1e2230}
.review-topbar h3{font-size:clamp(20px,2.5vw,28px);color:#ffffff;flex:1}
.review-topbar-stars{color:#f5c518;font-size:16px;letter-spacing:2px}
.review-topbar-cta{background:#f5c518;color:#0a0c10;font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:13px;padding:10px 28px;text-transform:uppercase;letter-spacing:1px;transition:background .2s;white-space:nowrap}
.review-topbar-cta:hover{background:#ffd84d;color:#0a0c10}
.review-screenshots{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:32px}
.review-screenshot{cursor:pointer;border:1px solid #1e2230;overflow:hidden;transition:border-color .2s}
.review-screenshot:hover{border-color:#f5c518}
.review-screenshot img{width:100%;height:auto;object-fit:cover}
.review-body{font-size:16px;line-height:1.8;color:#c8c8c8;margin-bottom:32px}
.review-body h2,.review-body h3{color:#ffffff;margin:24px 0 12px}
.review-body p{margin-bottom:16px}
.review-body a{color:#f5c518}

/* Pros/Cons table */
table.pros-cons-table{width:100%;border-collapse:collapse;table-layout:auto}
table.pros-cons-table th,table.pros-cons-table td{padding:10px 16px;text-align:left;border:1px solid #1e2230;font-size:14px}
table.pros-cons-table th{font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:15px;text-transform:uppercase;letter-spacing:0.5px}
table.pros-cons-table th.pros-col{background:#0f2e1a;color:#4ade80;border-color:#1a4028}
table.pros-cons-table th.cons-col{background:#2e0f14;color:#f87171;border-color:#40141a}
table.pros-cons-table td.pros-col{background:#0a1a10;color:#86efac}
table.pros-cons-table td.cons-col{background:#1a0a0e;color:#fca5a5}

/* ── FAQ ───────────────────────────────────────────── */
.faq-section{background:#0a0c10;padding:80px 0}
.faq-section h2{font-size:clamp(24px,3vw,36px);margin-bottom:40px;color:#ffffff}
.faq-item{margin-bottom:32px}
.faq-item h3{font-size:18px;color:#f5c518;margin-bottom:8px;font-family:'Space Grotesk',sans-serif}
.faq-item p{color:#c8c8c8;font-size:15px;line-height:1.7}

/* ── AUTHOR BOX ────────────────────────────────────── */
.author-box{background:#161921;border:1px solid #1e2230;padding:32px;display:flex;gap:24px;align-items:flex-start;margin:60px 0}
.author-box img{width:80px;height:80px;object-fit:cover;flex-shrink:0}
.author-box-content h4{font-size:16px;color:#f5c518;margin-bottom:4px}
.author-box-content .author-role{font-size:13px;color:#9a9a9a;margin-bottom:12px;display:block}
.author-box-content p{font-size:14px;color:#c8c8c8;line-height:1.6}

/* ── FOOTER ────────────────────────────────────────── */
.site-footer{background:#080a0e;border-top:1px solid #1e2230;padding:40px 0}
.site-footer .container{text-align:center}
.site-footer .footer-name{font-family:'Space Grotesk',sans-serif;font-size:16px;font-weight:700;color:#f5c518;margin-bottom:12px}
.site-footer .footer-copy{font-size:13px;color:#666;margin-bottom:16px}
.site-footer .footer-disclaimer{font-size:12px;color:#555;line-height:1.6;max-width:900px;margin:0 auto}

/* ── CONTENT SECTIONS (from plugin) ────────────────── */
.content-section{background:#0d0f14}
.content-section .container{font-size:16px;line-height:1.8;color:#c8c8c8}
.content-section h2,.content-section h3{color:#ffffff;margin:24px 0 12px;font-family:'Space Grotesk',sans-serif}
.content-section p{margin-bottom:16px}
.content-section a{color:#f5c518}
.content-section table{width:100%;border-collapse:collapse;table-layout:auto;margin:24px 0}
.content-section th,.content-section td{padding:8px 12px;text-align:left;border:1px solid #1e2230}
.content-section th{background:#161921;color:#ffffff;font-family:'Space Grotesk',sans-serif;font-weight:600}
.content-section td{color:#c8c8c8}

/* ── PAGE CONTENT ──────────────────────────────────── */
.page-content{padding:60px 0}
.page-content .container{font-size:16px;line-height:1.8;color:#c8c8c8}
.page-content h2,.page-content h3{color:#ffffff;font-family:'Space Grotesk',sans-serif;margin:28px 0 12px}
.page-content p{margin-bottom:16px}
.page-content a{color:#f5c518}

/* ── ABOUT US ──────────────────────────────────────── */
.team-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:24px;margin:40px 0}
.team-member{background:#161921;border:1px solid #1e2230;padding:24px;text-align:center}
.team-member img{width:100px;height:100px;object-fit:cover;margin:0 auto 16px}
.team-member h4{font-size:16px;color:#ffffff;margin-bottom:4px}
.team-member p{font-size:13px;color:#9a9a9a}

/* ── CONTACT FORM ──────────────────────────────────── */
.contact-form-wrap{max-width:640px;margin:0 auto}
.contact-form .form-group{margin-bottom:20px}
.contact-form label{display:block;font-size:13px;font-weight:600;color:#b0b0b0;text-transform:uppercase;letter-spacing:0.5px;margin-bottom:6px}
.contact-form input,.contact-form select,.contact-form textarea{width:100%;background:#161921;border:1px solid #1e2230;color:#e0e0e0;font-family:'Inter',sans-serif;font-size:15px;padding:12px 16px;outline:none;transition:border-color .2s}
.contact-form input:focus,.contact-form select:focus,.contact-form textarea:focus{border-color:#f5c518}
.contact-form textarea{min-height:160px;resize:vertical}
.contact-form select{cursor:pointer;appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%239a9a9a' fill='none'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 16px center}
.contact-form .btn-primary{width:100%;font-size:15px;padding:14px}
.contact-info-box{background:#161921;border:1px solid #1e2230;padding:32px;margin-top:40px;text-align:center}
.contact-info-box h3{color:#f5c518;margin-bottom:12px;font-size:18px}
.contact-info-box p{color:#9a9a9a;font-size:14px;line-height:1.7}
.toast{position:fixed;bottom:24px;right:24px;background:#4ade80;color:#0a0c10;font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:14px;padding:16px 28px;z-index:9999;transform:translateY(120px);transition:transform .3s;letter-spacing:0.5px}
.toast.show{transform:translateY(0)}

/* ── LIGHTBOX ──────────────────────────────────────── */
.lightbox-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,0.92);z-index:9999;display:none;align-items:center;justify-content:center;cursor:pointer;padding:24px}
.lightbox-overlay.active{display:flex}
.lightbox-overlay img{max-width:90%;max-height:90vh;object-fit:contain}

/* ── RESPONSIVE ────────────────────────────────────── */
@media(max-width:1024px){
  .casino-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:768px){
  .main-nav{display:none}
  .hamburger{display:block}
  .hero{height:auto;min-height:50vh;padding:60px 0}
  .casino-grid{grid-template-columns:repeat(2,1fr);gap:12px}
  .casino-card-header{flex-direction:column;align-items:flex-start;padding:16px}
  .casino-card-logo{width:48px;height:48px}
  .casino-card-body{padding:16px}
  .casino-card-footer{padding:16px}
  .review-topbar{flex-direction:column;align-items:flex-start}
  .review-screenshots{grid-template-columns:1fr}
  .author-box{flex-direction:column;align-items:center;text-align:center}
  .inner-hero{min-height:30vh;padding:40px 24px}
  .section-spacing{padding:48px 0}
}
@media(max-width:480px){
  .casino-grid{grid-template-columns:repeat(2,1fr);gap:8px}
  .casino-card-bonus{font-size:15px}
  .casino-meta{font-size:12px}
}
