/* ── Magyar Casino — Shared Stylesheet ── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
:root{
  --bg:#0d1117; --bg2:#13181f; --bg3:#1a2130;
  --card:#161c27; --card2:#1e2736;
  --gold:#FFD700; --gold2:#e6c200;
  --green:#00e676;
  --text:#e6edf3; --muted:#8b949e; --dim:#4d5561;
  --border:rgba(255,255,255,0.07);
  --border2:rgba(255,255,255,0.13);
  --r:12px; --r2:8px;
}
body{background:var(--bg);color:var(--text);font-family:'Inter',sans-serif;font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased}

/* ── NAV ── */
nav{position:sticky;top:0;z-index:99;background:rgba(13,17,23,0.92);backdrop-filter:blur(16px);border-bottom:1px solid var(--border);height:58px;padding:0 40px;display:flex;align-items:center;justify-content:space-between}
.logo{display:flex;align-items:center;gap:10px;text-decoration:none}
.logo-mark{width:30px;height:30px;border-radius:7px;background:var(--green);display:flex;align-items:center;justify-content:center;font-size:15px;flex-shrink:0}
.logo-copy{display:flex;flex-direction:column}
.logo-name{font-size:14px;font-weight:800;color:var(--text);letter-spacing:-0.2px;line-height:1}
.logo-tagline{font-size:9px;color:var(--muted);text-transform:uppercase;letter-spacing:0.07em;margin-top:3px}
.nav-links{display:flex;gap:28px;list-style:none}
.nav-links a{text-decoration:none;color:var(--muted);font-size:14px;font-weight:500;transition:color .2s}
.nav-links a:hover,.nav-links a.active{color:var(--text)}

/* ── BREADCRUMB ── */
.breadcrumb{max-width:900px;margin:0 auto;padding:14px 24px 0}
.breadcrumb ol{display:flex;gap:0;list-style:none;flex-wrap:wrap}
.breadcrumb li{font-size:12px;color:var(--dim);display:flex;align-items:center}
.breadcrumb li+li::before{content:'/';margin:0 8px;color:var(--dim)}
.breadcrumb a{color:var(--muted);text-decoration:none;transition:color .2s}
.breadcrumb a:hover{color:var(--text)}
.breadcrumb .current{color:var(--text)}

/* ── PAGE HEADER ── */
.page-header{max-width:900px;margin:0 auto;padding:28px 24px 24px}
.page-header h1{font-size:clamp(26px,4vw,40px);font-weight:800;letter-spacing:-1px;color:var(--text);margin-bottom:10px}
.page-header p{font-size:15px;color:var(--muted);max-width:600px;line-height:1.65}
.section-label{display:inline-flex;align-items:center;gap:7px;font-size:11px;font-weight:600;color:var(--green);text-transform:uppercase;letter-spacing:0.1em;margin-bottom:10px}

/* ── BUTTONS ── */
.btn-primary{display:inline-flex;align-items:center;gap:8px;background:var(--gold);color:#000;border:none;border-radius:var(--r2);padding:14px 28px;font-size:15px;font-weight:700;font-family:'Inter',sans-serif;cursor:pointer;text-decoration:none;transition:background .2s,transform .15s}
.btn-primary:hover{background:var(--gold2);transform:translateY(-1px)}
.btn-secondary{display:inline-flex;align-items:center;gap:8px;background:transparent;color:var(--text);border:1px solid var(--border2);border-radius:var(--r2);padding:13px 26px;font-size:15px;font-weight:500;font-family:'Inter',sans-serif;cursor:pointer;text-decoration:none;transition:border-color .2s,background .2s}
.btn-secondary:hover{background:var(--bg2)}
.btn-visit{display:flex;align-items:center;justify-content:center;gap:6px;background:var(--gold);color:#000;border:none;border-radius:var(--r2);padding:12px 20px;font-size:14px;font-weight:700;font-family:'Inter',sans-serif;cursor:pointer;text-decoration:none;white-space:nowrap;transition:background .2s,transform .15s}
.btn-visit:hover{background:var(--gold2);transform:translateY(-1px)}
.btn-sm{display:inline-flex;align-items:center;gap:6px;background:var(--gold);color:#000;border:none;border-radius:var(--r2);padding:9px 18px;font-size:13px;font-weight:700;font-family:'Inter',sans-serif;cursor:pointer;text-decoration:none;transition:background .2s}
.btn-sm:hover{background:var(--gold2)}
.btn-outline{display:inline-flex;align-items:center;background:transparent;color:var(--muted);border:1px solid var(--border2);border-radius:var(--r2);padding:9px 18px;font-size:13px;font-weight:500;font-family:'Inter',sans-serif;cursor:pointer;text-decoration:none;transition:border-color .2s,color .2s}
.btn-outline:hover{border-color:var(--border2);color:var(--text)}

/* ── CASINO LIST CARDS ── */
.casino-list{max-width:900px;margin:0 auto;padding:0 24px 80px;display:flex;flex-direction:column;gap:12px}
.cl-card{background:var(--card);border:1px solid var(--border);border-radius:var(--r);padding:20px 24px;display:grid;grid-template-columns:36px 1fr auto;align-items:center;gap:16px;transition:border-color .2s;text-decoration:none}
.cl-card:hover{border-color:var(--border2)}
.cl-num{font-size:13px;font-weight:800;color:var(--green);width:28px;text-align:center}
.cl-num.rank1{color:var(--gold)}
.cl-info h3{font-size:16px;font-weight:700;color:var(--text);margin-bottom:4px}
.cl-meta{display:flex;gap:16px;flex-wrap:wrap;align-items:center}
.cl-score{font-size:13px;font-weight:600;color:var(--text)}
.cl-license{font-size:12px;color:var(--muted)}
.cl-bonus{font-size:13px;color:var(--green);font-weight:500}
.cl-actions{display:flex;flex-direction:column;gap:8px;align-items:flex-end}

/* ── SLOT GRID ── */
.slot-grid{max-width:900px;margin:0 auto;padding:0 24px 80px;display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px}
.sg-card{background:var(--card);border:1px solid var(--border);border-radius:var(--r);padding:20px;transition:border-color .2s}
.sg-card:hover{border-color:var(--border2)}
.sg-card h3{font-size:16px;font-weight:700;color:var(--text);margin-bottom:8px}
.sg-tags{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:10px}
.sg-tag{font-size:11px;padding:3px 9px;border-radius:10px;background:var(--bg3);border:1px solid var(--border2);color:var(--muted)}
.sg-card p{font-size:13px;color:var(--muted);line-height:1.55;margin-bottom:14px}

/* ── PROVIDER GRID ── */
.prov-grid{max-width:900px;margin:0 auto;padding:0 24px 80px;display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:14px}
.prov-card{background:var(--card);border:1px solid var(--border);border-radius:var(--r);padding:22px}
.prov-card h3{font-size:17px;font-weight:700;color:var(--text);margin-bottom:6px}
.prov-meta{display:flex;gap:16px;margin-bottom:12px;flex-wrap:wrap}
.prov-stat{font-size:12px;color:var(--dim)}
.prov-stat strong{color:var(--text);font-size:13px}
.prov-card p{font-size:13px;color:var(--muted);line-height:1.6;margin-bottom:14px}
.prov-slots{display:flex;gap:6px;flex-wrap:wrap}
.prov-slot-tag{font-size:11px;padding:3px 9px;border-radius:10px;background:var(--bg3);border:1px solid var(--border2);color:var(--muted)}

/* ── DETAIL PAGE ── */
.detail-hero{max-width:900px;margin:0 auto;padding:0 24px 32px}
.detail-hero-inner{background:var(--card);border:1px solid var(--border);border-radius:var(--r);padding:30px}
.detail-hero h1{font-size:clamp(22px,4vw,34px);font-weight:800;letter-spacing:-0.8px;margin-bottom:14px;color:var(--text)}
.detail-meta{display:flex;gap:20px;flex-wrap:wrap;margin-bottom:18px}
.detail-meta-item{font-size:13px;color:var(--muted)}
.detail-meta-item strong{color:var(--text);display:block;font-size:14px;margin-bottom:2px}
.bonus-box{background:var(--bg3);border:1px solid var(--border2);border-radius:var(--r2);padding:16px 20px;margin-bottom:20px}
.bonus-label{font-size:11px;color:var(--green);font-weight:600;text-transform:uppercase;letter-spacing:0.07em;margin-bottom:4px}
.bonus-amount{font-size:20px;font-weight:800;color:var(--text)}
.detail-ctas{display:flex;gap:12px;flex-wrap:wrap}

/* ── CONTENT SECTIONS ── */
.content-section{max-width:900px;margin:0 auto;padding:0 24px 36px}
.content-section h2{font-size:clamp(18px,3vw,26px);font-weight:700;letter-spacing:-0.5px;margin-bottom:14px;color:var(--text)}
.content-section p{font-size:15px;color:var(--muted);line-height:1.7;margin-bottom:12px}

/* ── SLOT LINKS GRID ── */
.slot-links{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px}
.slot-link-card{background:var(--bg3);border:1px solid var(--border2);border-radius:var(--r2);padding:14px 16px;text-decoration:none;transition:border-color .2s}
.slot-link-card:hover{border-color:var(--gold)}
.slot-link-card h4{font-size:14px;font-weight:600;color:var(--text);margin-bottom:3px}
.slot-link-card span{font-size:12px;color:var(--muted)}

/* ── PROS / CONS ── */
.pros-cons{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:8px}
.pros,.cons{background:var(--card);border:1px solid var(--border);border-radius:var(--r);padding:18px}
.pros h3{color:var(--green);font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:0.06em;margin-bottom:10px}
.cons h3{color:#ff7b7b;font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:0.06em;margin-bottom:10px}
.pros li,.cons li{font-size:13px;color:var(--muted);margin-bottom:7px;list-style:none;display:flex;gap:8px;align-items:flex-start;line-height:1.5}
.pros li::before{content:'✓';color:var(--green);font-weight:700;flex-shrink:0}
.cons li::before{content:'✗';color:#ff7b7b;font-weight:700;flex-shrink:0}

/* ── WHERE TO PLAY ── */
.where-list{display:flex;flex-direction:column;gap:10px}
.where-card{background:var(--card);border:1px solid var(--border);border-radius:var(--r2);padding:16px 20px;display:flex;align-items:center;justify-content:space-between;gap:12px}
.where-info h4{font-size:15px;font-weight:600;color:var(--text);margin-bottom:3px}
.where-info span{font-size:12px;color:var(--green)}

/* ── FEATURES LIST ── */
.features-list{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.feat-item{background:var(--bg3);border:1px solid var(--border);border-radius:var(--r2);padding:12px 14px;font-size:13px;color:var(--muted);display:flex;align-items:center;gap:8px}
.feat-item::before{content:'◆';color:var(--gold);font-size:9px;flex-shrink:0}

/* ── STARS ── */
.stars{display:flex;gap:2px}
.star{width:14px;height:14px;clip-path:polygon(50% 0%,61% 35%,98% 35%,68% 57%,79% 91%,50% 70%,21% 91%,32% 57%,2% 35%,39% 35%)}
.star.full{background:#fbbf24}
.star.half{background:linear-gradient(90deg,#fbbf24 50%,var(--dim) 50%)}
.star.empty{background:var(--dim)}
.rating{display:flex;align-items:center;gap:8px}
.rating-score{font-size:14px;font-weight:700;color:var(--text)}

/* ── FOOTER ── */
.footer{border-top:1px solid var(--border);padding:36px 24px 28px}
.footer-inner{max-width:900px;margin:0 auto}
.rg-banner{background:var(--card);border:1px solid var(--border2);border-radius:var(--r);padding:14px 18px;margin-bottom:20px}
.rg-banner p{font-size:12px;color:var(--muted);line-height:1.6}
.rg-banner strong{color:var(--text)}
.footer-bottom{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:8px;padding-top:16px;border-top:1px solid var(--border)}
.footer-bottom p{font-size:12px;color:var(--dim)}
.footer-legal{font-size:11px;color:var(--dim);line-height:1.6;margin-top:10px}

/* ── RESPONSIVE ── */
@media(max-width:768px){
  nav{padding:0 16px}
  .nav-links{gap:16px}
  .cl-card{grid-template-columns:28px 1fr;gap:12px}
  .cl-actions{flex-direction:row;grid-column:1/-1}
  .pros-cons{grid-template-columns:1fr}
  .features-list{grid-template-columns:1fr}
}
@media(max-width:480px){
  .nav-links a{font-size:12px}
  .nav-links{gap:12px}
  .slot-grid{grid-template-columns:1fr}
  .prov-grid{grid-template-columns:1fr}
}
