/* Guides Jeux — template v2 (light/blue), adapté du design NZ. Autonome. */
:root {
  --cc-primary: #1a56db;
  --cc-primary-dark: #1447b8;
  --cc-dark: #f8f9fa;
  --cc-darker: #ffffff;
  --cc-card: #f0f4f8;
  --cc-card-border: #d1d9e0;
  --cc-text: #1f2937;
  --cc-text-muted: #69707d;
  --cc-green: #117f3a;
  --cc-red: #d52222;
  --cc-blue: #1a56db;
  --cc-gold: #b45309;
  --cc-radius: 12px;
}
.cc-page {
  font-family: 'Titillium Web', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  background: var(--cc-darker);
  color: var(--cc-text);
  line-height: 1.7;
  margin: 0;
  -webkit-font-smoothing: antialiased;
}
.cc-page *, .cc-page *::before, .cc-page *::after { box-sizing: border-box; }
.cc-container { max-width: 960px; margin: 0 auto; padding: 0 2rem; }

/* Bandeau RG statutaire */
.cc-rgbar{background:#0f2744;color:#c5d5e8;font-size:0.74rem;text-align:center;padding:6px 12px;}
.cc-rgbar strong{color:#93c5fd;}
.cc-rgbar a{color:#93c5fd;}

/* Header / Nav */
.site-header{position:sticky;top:0;z-index:1000;background:#fff;padding:0.6rem 1.5rem;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;box-shadow:0 1px 4px rgba(0,0,0,0.08);}
.site-brand{font-weight:700;font-size:1.15rem;color:#0f2744;text-decoration:none;white-space:nowrap;}
.site-brand span{color:var(--cc-primary);}
.hb-nav{display:flex;align-items:center;gap:0.15rem;flex-wrap:wrap;}
.hb-nav>a,.hb-nav .nav-dropdown>a{color:#374151;text-decoration:none;padding:0.25rem 0.75rem;font-size:1.02rem;font-weight:700;white-space:nowrap;transition:color 0.2s;}
.hb-nav>a:hover,.hb-nav .nav-dropdown>a:hover{color:#1a56db;}
.nav-dropdown{position:relative;}
.nav-dropdown .dropdown-menu{display:none;position:absolute;top:100%;left:0;background:#fff;border:1px solid #e5e7eb;border-radius:8px;min-width:220px;padding:0.5rem 0;z-index:1001;box-shadow:0 4px 16px rgba(0,0,0,0.1);}
.nav-dropdown:hover .dropdown-menu{display:block;}
.dropdown-menu a{display:block;color:#4b5563;text-decoration:none;padding:0.4rem 1rem;font-size:0.88rem;transition:background 0.2s,color 0.2s;}
.dropdown-menu a:hover{background:#f3f4f6;color:#1a56db;}
.hb-toggle{display:none;background:none;border:none;cursor:pointer;padding:0.5rem;}
.hb-toggle span{display:block;width:24px;height:2px;background:#374151;margin:5px 0;transition:0.3s;}
@media(max-width:768px){
  .hb-toggle{display:block;}
  .hb-nav{display:none;width:100%;flex-direction:column;align-items:flex-start;padding-top:0.5rem;}
  .hb-nav.open{display:flex;}
  .hb-toggle.open span:nth-child(1){transform:rotate(45deg) translate(5px,5px);}
  .hb-toggle.open span:nth-child(2){opacity:0;}
  .hb-toggle.open span:nth-child(3){transform:rotate(-45deg) translate(5px,-5px);}
  .nav-dropdown .dropdown-menu{position:static;box-shadow:none;border:none;padding-left:1rem;}
  .nav-dropdown:hover .dropdown-menu{display:none;}
  .nav-dropdown.open .dropdown-menu{display:block;}
}

/* Hero */
.cc-hero {
  background: linear-gradient(135deg, #1a56db 0%, #1e3a5f 50%, #0f2744 100%);
  padding: 3.5rem 1.25rem 3rem;
  text-align: center;
}
.cc-hero h1 {
  font-size: clamp(1.8rem, 4.5vw, 2.8rem);
  font-weight: 700;
  color: #fff;
  margin: 0 0 1rem;
  line-height: 1.2;
}
.cc-hero h1 span { color: #93c5fd; }
.cc-hero .cc-subtitle {
  font-size: 1.1rem;
  color: #dbe4f0;
  max-width: 700px;
  margin: 0 auto 1.5rem;
}
.cc-hero .cc-subtitle a{color:#fff;text-decoration:underline;}
.cc-badge-row { display: flex; gap: 0.4rem; justify-content: center; flex-wrap: wrap; margin-top: 1.25rem; }
.cc-badge {
  display: inline-flex; align-items: center; gap: 0.35rem;
  background: rgba(255, 255, 255, 0.15);
  border: 1px solid rgba(255, 255, 255, 0.3);
  color: #fff;
  padding: 0.25rem 0.6rem;
  border-radius: 50px;
  font-size: 0.82rem;
  white-space: nowrap; flex-shrink: 0;
  font-weight: 600;
}
.g-author-row{display:flex;align-items:center;justify-content:center;gap:0.75rem;margin:0.75rem 0 0;flex-wrap:wrap;font-size:0.78rem;color:#dbe4f0;}
.g-author-row strong{color:#fff;}

/* Quick picks */
.cc-quickpicks {
  background: var(--cc-card);
  border: 1px solid var(--cc-card-border);
  border-radius: var(--cc-radius);
  padding: 1.75rem;
  margin: 2rem 0;
}
.cc-quickpicks h2 {
  font-size: 1.15rem;
  margin: 0 0 1rem;
  color: var(--cc-primary);
  text-transform: uppercase;
  letter-spacing: 0.5px;
}
.cc-quickpick-item { display: flex; align-items: baseline; gap: 0.5rem; padding: 0.45rem 0; font-size: 0.95rem; }
.cc-qp-rank { color: var(--cc-primary); font-weight: 700; min-width: 1.5rem; }
.cc-qp-name { font-weight: 600; color: #1f2937; }
.cc-qp-name a { color: #1f2937; text-decoration: none; }
.cc-qp-name a:hover { color: var(--cc-primary); }
.cc-qp-desc { color: var(--cc-text-muted); }

/* Content sections */
.cc-section { padding: 2.5rem 0; }
.cc-section h2 { font-size: clamp(1.35rem, 3vw, 1.75rem); font-weight: 700; color: #1f2937; margin: 0 0 1.25rem; }
.cc-section h3 { font-size: 1.15rem; font-weight: 600; color: #1f2937; margin: 1.75rem 0 0.75rem; }
.cc-section p { color: var(--cc-text); margin: 0 0 1rem; }
.cc-section ul, .cc-section ol { padding-left: 1.5rem; margin: 0 0 1rem; }
.cc-section li { margin-bottom: 0.4rem; color: var(--cc-text); }
.cc-section a { color: var(--cc-blue); text-decoration: none; }
.cc-section a:hover { text-decoration: underline; }

/* Affiliate rows */
.aff-wrap{border:1px solid #e0e0e0;border-radius:16px;overflow:hidden;box-shadow:0 2px 12px rgba(0,0,0,0.04);}
.aff-row{display:flex;align-items:center;background:#fff;border-bottom:1px solid #e0e0e0;padding:1.5rem 1.75rem;margin:0;gap:2rem;transition:background 0.2s;}
.aff-row:last-child{border-bottom:none;}
.aff-row:hover{background:#f8f8fa;}
.aff-rank{flex-shrink:0;font-weight:800;color:var(--cc-primary);font-size:1.1rem;min-width:2rem;text-align:center;}
.aff-logo{flex-shrink:0;width:160px;text-align:center;}
.aff-logo a{display:flex;align-items:center;justify-content:center;width:160px;height:94px;border-radius:14px;overflow:hidden;background:#fff;padding:8px;box-sizing:border-box;border:1px solid #f0f0f3;}
.aff-logo img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;margin:0;}
.aff-logo .txtlogo{display:flex;align-items:center;justify-content:center;width:160px;height:94px;border-radius:14px;background:#0f2744;color:#fff;font-weight:800;font-size:0.85rem;}
.aff-logo .aff-stars{color:#1a56db;font-size:0.9rem;margin-top:0.4rem;letter-spacing:2px;}
.aff-bonus{flex:1;font-size:1.2rem;font-weight:800;color:#4a0e8f;line-height:1.35;background:linear-gradient(135deg,#fff8dd,#ffefad);border:2px solid #f2c94c;border-radius:12px;padding:0.75rem 1rem;box-shadow:0 2px 8px rgba(242,201,76,0.25);}
.aff-bonus small{display:block;font-size:0.78rem;font-weight:600;color:#6b5b1e;margin-top:0.3rem;}
.aff-cta{flex-shrink:0;text-align:center;}
.aff-cta a{display:inline-block;background:#e8450e;color:#fff;font-weight:800;font-size:1.05rem;padding:1rem 2.2rem;border-radius:10px;text-decoration:none;text-transform:uppercase;letter-spacing:0.5px;white-space:nowrap;transition:background 0.2s,transform 0.15s;}
.aff-cta a:hover{background:#d13a08;transform:translateY(-2px);}
.cc-cta-sub{display:block;font-size:0.68rem;color:var(--cc-text-muted);margin-top:0.35rem;text-align:center;}
@media(max-width:640px){
  .aff-row{position:relative;flex-direction:column;align-items:center;text-align:center;gap:0.6rem;padding:1.15rem 1rem 1.25rem;}
  .aff-rank{position:absolute;top:10px;left:12px;min-width:auto;background:var(--cc-primary);color:#fff;border-radius:50%;width:30px;height:30px;line-height:30px;font-size:0.95rem;}
  .aff-logo{width:150px;margin:0 auto;}
  .aff-logo a,.aff-logo .txtlogo{width:150px;height:86px;border-radius:10px;padding:6px;margin:0 auto;}
  .aff-logo .aff-stars{text-align:center;}
  .aff-bonus{flex-basis:auto;width:100%;font-size:1.25rem;padding:0.85rem 0.9rem;}
  .aff-cta{width:100%;}
  .aff-cta a{width:100%;display:block;text-align:center;padding:0.85rem 1rem;font-size:1.1rem;}
}

/* Tagline statutaire sous les tables */
.cc-tagline{font-size:0.78rem;color:var(--cc-text-muted);background:rgba(26,86,219,0.06);border-left:4px solid var(--cc-primary);padding:8px 12px;margin:14px 0 20px;}

/* Casino review cards */
.cc-review {
  background: var(--cc-card);
  border: 1px solid var(--cc-card-border);
  border-radius: var(--cc-radius);
  padding: 2rem;
  margin: 2rem 0;
  position: relative;
}
.cc-review-rank {
  position: absolute; top: -14px; left: 1.5rem;
  background: var(--cc-primary); color: #fff;
  font-weight: 700; font-size: 0.85rem;
  padding: 0.2rem 0.85rem; border-radius: 50px;
}
.cc-review h3 { font-size: 1.35rem; margin: 0.5rem 0 0.25rem; color: #1f2937; }
.cc-review-badge{display:inline-block;background:rgba(26,86,219,0.1);color:#1a56db;padding:0.15rem 0.6rem;border-radius:50px;font-size:0.7rem;font-weight:700;vertical-align:middle;margin-left:0.4rem;text-transform:uppercase;}
.cc-review-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 0.75rem; margin: 1.25rem 0; }
.cc-stat { background: #fff; border:1px solid var(--cc-card-border); border-radius: 8px; padding: 0.75rem; text-align: center; }
.cc-stat-label { font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.5px; color: var(--cc-text-muted); display: block; margin-bottom: 0.25rem; }
.cc-stat-value { font-size: 1rem; font-weight: 700; color: #1f2937; }
.cc-proscons { display: grid; grid-template-columns: 1fr 1fr; gap: 1.25rem; margin: 1.25rem 0; }
@media (max-width: 600px) { .cc-proscons { grid-template-columns: 1fr; } }
.cc-pros h4, .cc-cons h4 { font-size: 0.85rem; text-transform: uppercase; letter-spacing: 0.5px; margin: 0 0 0.6rem; }
.cc-pros h4 { color: var(--cc-green); }
.cc-cons h4 { color: var(--cc-red); }
.cc-pros ul, .cc-cons ul { list-style: none; padding: 0; margin: 0; }
.cc-pros li, .cc-cons li { padding: 0.3rem 0 0.3rem 1.25rem; position: relative; font-size: 0.92rem; margin:0; }
.cc-pros li::before { content: "+"; position: absolute; left: 0; color: var(--cc-green); font-weight: 700; }
.cc-cons li::before { content: "-"; position: absolute; left: 0; color: var(--cc-red); font-weight: 700; }
.cc-screenshot{display:block;width:100%;height:auto;border:1px solid var(--cc-card-border);border-radius:10px;margin:1rem 0;box-shadow:0 2px 8px rgba(0,0,0,0.06);}
.cc-review-verdict { background: #fff; border-left: 3px solid var(--cc-primary); padding: 1rem 1.25rem; border-radius: 0 8px 8px 0; margin-top: 1.25rem; font-size: 0.92rem; }
.cc-review-verdict strong { color: var(--cc-primary); }

/* CTA button */
.cc-cta {
  display: inline-block;
  background: linear-gradient(135deg, #1a56db, #1447b8);
  color: #fff !important;
  font-weight: 700; font-size: 0.95rem;
  padding: 0.65rem 2rem; border-radius: 50px;
  text-decoration: none;
  transition: background 0.2s, transform 0.15s;
  margin-top: 0.75rem;
}
.cc-cta:hover { background: #1447b8; transform: translateY(-1px); }

/* Methodology grid */
.cc-criteria-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 1rem; margin: 1.5rem 0; }
.cc-criteria-item { background: var(--cc-card); border: 1px solid var(--cc-card-border); border-radius: 8px; padding: 1.25rem; text-align: center; }
.cc-criteria-item .cc-criteria-num { font-size: 1.5rem; font-weight: 700; color: #1a56db; display: block; margin-bottom: 0.35rem; }
.cc-criteria-item .cc-criteria-title { font-weight: 600; color: #111827; display: block; margin-bottom: 0.35rem; }
.cc-criteria-item .cc-criteria-desc { font-size: 0.82rem; color: var(--cc-text-muted); }

/* Steps */
.cc-steps { counter-reset: step; padding: 0; list-style: none; }
.cc-steps li { counter-increment: step; position: relative; padding: 1rem 0 1rem 3.5rem; margin:0; }
.cc-steps li::before {
  content: counter(step);
  position: absolute; left: 0; top: 1rem;
  width: 2.25rem; height: 2.25rem;
  background: var(--cc-primary); color: #fff;
  font-weight: 700; border-radius: 50%;
  display: flex; align-items: center; justify-content: center; font-size: 0.95rem;
}
.cc-steps strong { color: #1f2937; }

/* Country / info cards */
.cc-country-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 1rem; margin: 1.5rem 0; }
.cc-country-card { background: var(--cc-card); border: 1px solid var(--cc-card-border); border-radius: var(--cc-radius); padding: 1.25rem; }
.cc-country-card h4 { margin: 0 0 0.6rem; color: #111827; font-size: 1rem; }
.cc-country-card p { font-size: 0.88rem; color: var(--cc-text-muted); margin: 0; }

/* Comparison tables */
.cc-table-wrap{border:1px solid var(--cc-card-border);border-radius:var(--cc-radius);overflow-x:auto;margin:1.5rem 0;}
.cc-network-table { width: 100%; border-collapse: collapse; font-size: 0.88rem; margin: 0; }
.cc-network-table th, .cc-network-table td { padding: 0.65rem 0.75rem; text-align: left; border-bottom: 1px solid var(--cc-card-border); }
.cc-network-table th { color: var(--cc-primary); font-weight: 600; background: var(--cc-card); }
.cc-network-table td { color: var(--cc-text); }
.cc-network-table tr:last-child td{border-bottom:none;}
.cc-fee-low { color: var(--cc-green); font-weight: 600; }
.cc-fee-med { color: var(--cc-gold); font-weight: 600; }
.cc-fee-high { color: var(--cc-red); font-weight: 600; }

/* FAQ */
.cc-faq { margin: 0; padding: 0; list-style: none; }
.cc-faq-item{border-bottom:1px solid var(--cc-card-border);}
.cc-faq-q {
  display: block; width: 100%; background: none; border: none;
  text-align: left; padding: 1.15rem 2.5rem 1.15rem 0;
  font-size: 1.02rem; font-weight: 600; color: #111827;
  cursor: pointer; position: relative; font-family: inherit; line-height: 1.4;
}
.cc-faq-q::after { content: "+"; position: absolute; right: 0; top: 50%; transform: translateY(-50%); font-size: 1.5rem; color: var(--cc-primary); transition: transform 0.2s; }
.cc-faq-item.open .cc-faq-q::after { content: "-"; }
.cc-faq-a { max-height: 0; overflow: hidden; transition: max-height 0.3s ease, padding 0.3s ease; color: var(--cc-text-muted); font-size: 0.95rem; line-height: 1.65; }
.cc-faq-item.open .cc-faq-a { max-height: 600px; padding-bottom: 1.25rem; }

/* Info boxes */
.cc-infobox { background: rgba(26, 86, 219, 0.06); border: 1px solid rgba(26, 86, 219, 0.2); border-radius: var(--cc-radius); padding: 1.25rem 1.5rem; margin: 1.5rem 0; font-size: 0.92rem; }
.cc-infobox strong { color: #1a56db; }
.cc-warnbox { background: rgba(218, 54, 51, 0.06); border: 1px solid rgba(218, 54, 51, 0.2); border-radius: var(--cc-radius); padding: 1.25rem 1.5rem; margin: 1.5rem 0; font-size: 0.92rem; }
.cc-warnbox strong { color: #d52222; }

/* Responsible gambling block */
.cc-responsible { background: var(--cc-card); border: 1px solid var(--cc-card-border); border-radius: var(--cc-radius); padding: 1.5rem; margin: 2rem 0; text-align: center; font-size: 0.88rem; color: var(--cc-text-muted); }
.cc-responsible strong { color: #1f2937; }
.cc-responsible a{color:var(--cc-blue);}

/* Footer */
.site-footer{background:#0f2744;border-top:1px solid #1a3a5c;padding:3rem 1.5rem 1.5rem;font-family:'Titillium Web',sans-serif;}
.site-footer .foot-inner{max-width:880px;margin:0 auto;}
.site-footer .foot-cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:2rem;margin-bottom:2rem;}
.site-footer h4{color:#93b4d4;font-size:0.85rem;text-transform:uppercase;letter-spacing:0.5px;margin:0 0 0.75rem;}
.site-footer .foot-cols a{display:block;color:#c5d5e8;text-decoration:none;font-size:0.85rem;padding:0.2rem 0;}
.site-footer .foot-cols a:hover{color:#fff;}
.site-footer .foot-bottom{border-top:1px solid #1a3a5c;padding-top:1.25rem;text-align:center;}
.site-footer .foot-bottom p{margin:0 0 0.5rem;font-size:0.82rem;color:#93b4d4;}
.site-footer .foot-bottom a{color:#93c5fd;text-decoration:none;}
.site-footer .foot-bottom strong{color:#fff;}

/* Toplist heading (au-dessus du tableau affilié) */
.toplist-h2{font-size:clamp(1.2rem,2.6vw,1.5rem);font-weight:700;color:#1f2937;margin:1.5rem 0 0.9rem;}

/* Responsive hero — mobile: H1 + auteur/màj + H2 toplist + 1re ligne du tableau au-dessus de la ligne de flottaison */
@media (max-width: 768px) {
  .cc-rgbar{font-size:0.62rem;padding:4px 8px;}
  .cc-hero { padding: 0.8rem 0.75rem 0.7rem; }
  .cc-hero h1 { font-size: 1.22rem !important; margin: 0 0 0.35rem; line-height:1.25; }
  .cc-hero .cc-subtitle { display: none; }
  .cc-badge-row { display: none !important; }
  .g-author-row { display:flex; margin:0.25rem 0 0; gap:0.3rem 0.5rem; font-size:0.68rem; line-height:1.3; }
  .cc-container{padding:0 0.9rem;}
  .cc-section { padding: 1.1rem 0; }
  .toplist-h2{margin:0.85rem 0 0.6rem;font-size:1.05rem;}
  .cc-review { padding: 1.5rem 1.25rem; }
  .cc-review-stats { grid-template-columns: repeat(2, 1fr); }
}