/* ============================================
   Free Spins senza deposito 2026 — style.css
   Casino / Italian flag theme
   ============================================ */

/* ---------- RESET / BASE ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;
  font-family:'Inter','Segoe UI',Roboto,Arial,sans-serif;
  font-size:16px;
  line-height:1.65;
  color:#1a1a2e;
  background:#f6f7fb;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}
img{max-width:100%;height:auto;display:block}
a{color:#c8102e;text-decoration:none;transition:color .2s ease}
a:hover{color:#009246}
h1,h2,h3,h4{font-family:'Montserrat','Inter',sans-serif;line-height:1.25;margin:0 0 .6em;color:#0f1c2e;font-weight:800}
h1{font-size:clamp(1.75rem,4.5vw,2.6rem);letter-spacing:-.5px}
h2{font-size:clamp(1.4rem,3.2vw,2rem);margin-top:1.8em;position:relative;padding-bottom:.35em}
h2::after{
  content:"";position:absolute;left:0;bottom:0;width:70px;height:4px;border-radius:3px;
  background:linear-gradient(90deg,#009246 0%,#fff 50%,#c8102e 100%);
}
h3{font-size:clamp(1.15rem,2.4vw,1.4rem);margin-top:1.4em}
h4{font-size:1.1rem;margin-top:1.2em;color:#2b3a55}
p{margin:0 0 1em}
ul,ol{padding-left:1.3em;margin:0 0 1em}
li{margin-bottom:.4em}

.container{max-width:1180px;margin:0 auto;padding:0 18px}

/* ---------- BUTTONS ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.5em;
  padding:12px 22px;border-radius:10px;font-weight:700;
  font-family:'Montserrat',sans-serif;font-size:.95rem;
  text-decoration:none;border:none;cursor:pointer;
  transition:transform .15s ease,box-shadow .2s ease,background .2s ease;
  white-space:nowrap;line-height:1;
}
.btn-primary{
  background:linear-gradient(135deg,#c8102e 0%,#e63946 100%);
  color:#fff;
  box-shadow:0 4px 14px rgba(200,16,46,.35);
}
.btn-primary:hover{
  transform:translateY(-1px);
  box-shadow:0 6px 20px rgba(200,16,46,.45);
  color:#fff;
}
.btn-primary:active{transform:translateY(0)}
.btn-header{padding:10px 18px;font-size:.88rem}
.btn-header .icon-gift{color:#fff}
.btn-cta{width:100%;padding:14px 20px;font-size:1rem;text-transform:uppercase;letter-spacing:.5px}

/* ---------- HEADER ---------- */
.site-header{
  position:sticky;top:0;z-index:100;
  background:#ffffff;
  border-bottom:1px solid #e9ebf2;
  transition:box-shadow .25s ease;
}
.site-header.scrolled{box-shadow:0 4px 20px rgba(15,28,46,.08)}
.site-header::before{
  content:"";display:block;height:3px;
  background:linear-gradient(90deg,#009246 0%,#009246 33.33%,#fff 33.33%,#fff 66.66%,#c8102e 66.66%,#c8102e 100%);
}
.header-inner{
  display:flex;align-items:center;justify-content:space-between;gap:20px;
  min-height:70px;padding:10px 18px;
}
.logo{display:inline-flex;align-items:center;flex-shrink:0}
.logo img{height:38px;width:auto}
.main-nav ul{
  display:flex;gap:22px;list-style:none;margin:0;padding:0;
}
.main-nav a{
  color:#2b3a55;font-weight:600;font-size:.92rem;
  padding:6px 2px;border-bottom:2px solid transparent;
  transition:color .2s ease,border-color .2s ease;
}
.main-nav a:hover{color:#c8102e;border-bottom-color:#c8102e}

.mobile-menu-toggle{
  display:none;background:transparent;border:none;cursor:pointer;
  width:40px;height:40px;padding:8px;flex-direction:column;justify-content:center;gap:5px;
}
.mobile-menu-toggle span{
  display:block;width:24px;height:2px;background:#0f1c2e;border-radius:2px;
  transition:transform .25s ease,opacity .2s ease;
}
.mobile-menu-toggle.active span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.mobile-menu-toggle.active span:nth-child(2){opacity:0}
.mobile-menu-toggle.active span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

.mobile-nav{
  display:none;background:#fff;border-top:1px solid #e9ebf2;
  max-height:0;overflow:hidden;transition:max-height .3s ease;
}
.mobile-nav.open{max-height:400px;padding:10px 0}
.mobile-nav ul{list-style:none;margin:0;padding:0}
.mobile-nav li{margin:0;border-bottom:1px solid #f0f2f7}
.mobile-nav a{
  display:block;padding:14px 24px;color:#0f1c2e;font-weight:600;font-size:.95rem;
}
.mobile-nav a:hover{background:#f6f7fb;color:#c8102e}

/* ---------- HERO ---------- */
.hero{
  position:relative;overflow:hidden;
  background:
    radial-gradient(ellipse 80% 60% at 0% 0%, rgba(0,146,70,.08) 0%, transparent 60%),
    radial-gradient(ellipse 80% 60% at 100% 100%, rgba(200,16,46,.08) 0%, transparent 60%),
    linear-gradient(180deg,#ffffff 0%,#f6f7fb 100%);
  padding:50px 0 40px;
}
.hero-bg{position:absolute;inset:0;pointer-events:none;z-index:0;overflow:hidden}
.hero-bg .chip,.hero-bg .card-icon{position:absolute;opacity:.15;border-radius:50%}
.chip-1{top:10%;left:5%;width:80px;height:80px;background:
  radial-gradient(circle,#c8102e 38%,transparent 40%),
  repeating-conic-gradient(#c8102e 0deg 30deg,#fff 30deg 60deg);
  box-shadow:0 0 0 4px #c8102e inset;
}
.chip-2{top:65%;left:10%;width:55px;height:55px;background:
  radial-gradient(circle,#009246 38%,transparent 40%),
  repeating-conic-gradient(#009246 0deg 30deg,#fff 30deg 60deg);
  box-shadow:0 0 0 3px #009246 inset;
}
.chip-3{top:20%;right:7%;width:70px;height:70px;background:
  radial-gradient(circle,#ffd700 38%,transparent 40%),
  repeating-conic-gradient(#ffd700 0deg 30deg,#fff 30deg 60deg);
  box-shadow:0 0 0 3px #ffd700 inset;
}
.card-icon{border-radius:8px !important;width:40px;height:55px;background:#fff;border:2px solid #c8102e;opacity:.2}
.card-1{top:75%;right:15%;transform:rotate(18deg)}
.card-2{top:30%;left:45%;transform:rotate(-12deg);border-color:#009246}

.hero .container{position:relative;z-index:1}
.hero h1{max-width:900px;margin-bottom:20px}
.hero-sub{max-width:820px;font-size:1.05rem;color:#435272;margin-bottom:28px}

.author-block{
  display:inline-flex;align-items:center;gap:14px;
  background:#fff;padding:12px 18px;border-radius:50px;
  box-shadow:0 3px 14px rgba(15,28,46,.08);
  border:1px solid #e9ebf2;
}
.author-avatar{
  width:48px;height:48px;border-radius:50%;object-fit:cover;
  border:2px solid #009246;
  flex-shrink:0;
}
.author-info{display:flex;flex-direction:column;gap:2px}
.author-name{
  font-weight:700;font-size:.95rem;color:#0f1c2e;
  display:flex;align-items:center;gap:8px;flex-wrap:wrap;
}
.verified-badge{
  display:inline-flex;align-items:center;gap:3px;
  font-size:.72rem;font-weight:600;padding:2px 8px;border-radius:20px;
  background:rgba(0,146,70,.12);color:#009246;
}
.verified-badge svg{color:#009246}
.author-meta{font-size:.78rem;color:#6a7890}

/* ---------- LISTING ---------- */
.listing-section{padding:30px 0 50px;background:#f6f7fb}
.section-title{margin-top:0}
.section-desc{color:#435272;max-width:820px;margin-bottom:28px}

.casino-list{display:flex;flex-direction:column;gap:16px}

.casino-card{
  background:#fff;border-radius:16px;
  border:1px solid #e9ebf2;
  box-shadow:0 2px 10px rgba(15,28,46,.04);
  padding:20px 24px;
  display:grid;
  grid-template-columns:70px 1.1fr 1.3fr 1.2fr 1fr;
  gap:18px;align-items:center;
  position:relative;
  transition:transform .2s ease,box-shadow .25s ease,border-color .2s ease;
}
.casino-card:hover{
  transform:translateY(-2px);
  box-shadow:0 10px 28px rgba(15,28,46,.10);
  border-color:#c8102e;
}
.casino-card:first-child{
  border:2px solid #ffd700;
  box-shadow:0 4px 20px rgba(255,215,0,.25);
  background:linear-gradient(180deg,#fffef5 0%,#fff 100%);
}
.casino-card:first-child .rank-num{
  background:linear-gradient(135deg,#ffd700 0%,#ffb400 100%);
  color:#2b1f00;
}

/* Rank */
.rank{
  display:flex;flex-direction:column;align-items:center;gap:4px;
}
.rank-num{
  display:inline-flex;align-items:center;justify-content:center;
  width:48px;height:48px;border-radius:50%;
  background:linear-gradient(135deg,#c8102e 0%,#e63946 100%);
  color:#fff;font-family:'Montserrat',sans-serif;font-weight:800;font-size:1.4rem;
  box-shadow:0 3px 10px rgba(200,16,46,.3);
}
.rank-label{
  font-size:.65rem;font-weight:700;letter-spacing:1px;
  color:#ffb400;text-transform:uppercase;
}

/* Brand */
.brand-block{display:flex;flex-direction:column;align-items:flex-start;gap:8px}
.logo-wrap{
  background:#f6f7fb;border-radius:10px;padding:8px 12px;
  min-height:58px;width:100%;max-width:160px;
  display:flex;align-items:center;justify-content:center;
}
.logo-wrap img{max-height:44px;width:auto;object-fit:contain}
.brand-name{font-weight:700;font-size:1rem;color:#0f1c2e}
.rating{display:inline-flex;align-items:center;gap:2px}
.rating .star{
  display:inline-block;width:15px;height:15px;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23d0d4de'><path d='M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z'/></svg>");
  background-repeat:no-repeat;background-size:contain;
}
.rating .star.filled{
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ffb400'><path d='M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z'/></svg>");
}
.rating .star.half{
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><defs><linearGradient id='h'><stop offset='50%' stop-color='%23ffb400'/><stop offset='50%' stop-color='%23d0d4de'/></linearGradient></defs><path fill='url(%23h)' d='M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z'/></svg>");
}
.rating-num{font-size:.82rem;font-weight:700;color:#2b3a55;margin-left:6px}
.exclusive-badge{
  display:inline-block;font-size:.7rem;font-weight:700;letter-spacing:.5px;
  padding:3px 10px;border-radius:20px;
  background:linear-gradient(135deg,#009246 0%,#00b056 100%);
  color:#fff;text-transform:uppercase;
}

/* Bonus */
.bonus-block{display:flex;flex-direction:column;gap:6px}
.bonus-label{
  display:inline-block;width:fit-content;
  font-size:.7rem;font-weight:700;letter-spacing:1px;text-transform:uppercase;
  padding:3px 10px;border-radius:4px;
  background:rgba(200,16,46,.1);color:#c8102e;
}
.bonus-text{
  font-weight:700;font-size:1.05rem;color:#0f1c2e;line-height:1.35;
  font-family:'Montserrat',sans-serif;
}
.bonus-code{font-size:.82rem;color:#435272}
.bonus-code strong{
  background:#ffd700;color:#2b1f00;
  padding:2px 7px;border-radius:4px;
  font-family:'Courier New',monospace;letter-spacing:.5px;
}

/* Features */
.features{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:6px}
.features li{
  display:flex;align-items:center;gap:8px;
  font-size:.87rem;color:#2b3a55;margin:0;
}
.features .check{color:#009246;flex-shrink:0}

/* CTA */
.cta-block{display:flex;flex-direction:column;gap:8px;align-items:center}
.review-link{font-size:.75rem;color:#6a7890;text-align:center}
.review-link:hover{color:#c8102e}

/* ---------- CONTENT ---------- */
.content-section{padding:20px 0 60px;background:#fff}
.content-container{max-width:880px}
.content-container p{color:#2b3a55}
.content-container ul li,.content-container ol li{color:#2b3a55}
.content-container strong{color:#0f1c2e}

/* Tables */
.table-wrap{overflow-x:auto;margin:1em 0 1.5em;border-radius:10px;border:1px solid #e9ebf2}
.content-container table{
  width:100%;border-collapse:collapse;background:#fff;font-size:.92rem;
}
.content-container table tr:first-child td{
  background:linear-gradient(135deg,#0f1c2e 0%,#2b3a55 100%);
  color:#fff;font-weight:700;
}
.content-container table tr:first-child td p{color:#fff;margin:0}
.content-container table td{
  padding:10px 14px;border-bottom:1px solid #e9ebf2;vertical-align:top;
}
.content-container table td p{margin:0}
.content-container table tr:nth-child(even) td{background:#f6f7fb}
.content-container table tr:last-child td{border-bottom:none}

/* Ordered lists — steps */
.steps-list{
  counter-reset:step;list-style:none;padding:0;
  display:flex;flex-direction:column;gap:14px;margin:1.2em 0;
}
.steps-list > li{
  counter-increment:step;
  background:#f6f7fb;border-left:4px solid #009246;border-radius:8px;
  padding:16px 20px 16px 56px;position:relative;margin:0;
}
.steps-list > li::before{
  content:counter(step);
  position:absolute;left:14px;top:14px;
  width:30px;height:30px;border-radius:50%;
  background:#009246;color:#fff;
  display:flex;align-items:center;justify-content:center;
  font-weight:700;font-size:.9rem;font-family:'Montserrat',sans-serif;
}
.steps-list > li strong{display:block;margin-bottom:4px;color:#0f1c2e;font-size:1.02rem}
.steps-intro{font-weight:500;color:#2b3a55}

/* Unordered styled lists */
.content-container > ul{list-style:none;padding:0}
.content-container > ul li{
  position:relative;padding-left:28px;margin-bottom:10px;
}
.content-container > ul li::before{
  content:"";position:absolute;left:0;top:10px;
  width:14px;height:14px;border-radius:50%;
  background:linear-gradient(135deg,#c8102e 0%,#e63946 100%);
  box-shadow:0 0 0 3px rgba(200,16,46,.15);
}

/* ---------- FAQ ---------- */
.faq-section{margin-top:2em}
.faq-item{
  background:#f6f7fb;border-radius:10px;
  border-left:4px solid #c8102e;
  padding:16px 22px;margin-bottom:12px;
}
.faq-item h3{
  margin:0 0 8px;color:#0f1c2e;font-size:1.08rem;
  display:flex;align-items:flex-start;gap:8px;
}
.faq-item h3::before{
  content:"?";flex-shrink:0;
  width:24px;height:24px;border-radius:50%;
  background:#c8102e;color:#fff;
  display:inline-flex;align-items:center;justify-content:center;
  font-weight:800;font-size:.9rem;font-family:'Montserrat',sans-serif;
  margin-top:2px;
}
.faq-item p{margin:0;color:#2b3a55;font-size:.95rem}

/* ---------- FOOTER ---------- */
.site-footer{
  background:#0f1c2e;color:#c4cad8;
  padding:50px 0 20px;font-size:.9rem;
  position:relative;
}
.site-footer::before{
  content:"";display:block;height:3px;position:absolute;top:0;left:0;right:0;
  background:linear-gradient(90deg,#009246 0%,#009246 33.33%,#fff 33.33%,#fff 66.66%,#c8102e 66.66%,#c8102e 100%);
}
.footer-top{
  display:grid;grid-template-columns:repeat(4,1fr);gap:30px;
  padding-bottom:28px;border-bottom:1px solid #25334a;
}
.footer-col h4{
  color:#fff;font-size:1rem;margin:0 0 14px;
  font-family:'Montserrat',sans-serif;
}
.footer-logo img{filter:brightness(0) invert(1);margin-bottom:12px}
.footer-disclaimer-text{font-size:.85rem;color:#a4adc2;line-height:1.6}
.footer-nav{list-style:none;padding:0;margin:0}
.footer-nav li{margin-bottom:8px}
.footer-nav a{color:#c4cad8;font-size:.88rem}
.footer-nav a:hover{color:#fff}

.responsible-gambling{display:flex;align-items:flex-start;gap:12px}
.age-badge{
  flex-shrink:0;
  display:inline-flex;align-items:center;justify-content:center;
  width:44px;height:44px;border-radius:50%;
  background:#c8102e;color:#fff;
  font-weight:800;font-size:.95rem;font-family:'Montserrat',sans-serif;
  border:2px solid #fff;
}
.responsible-gambling p{margin:0;font-size:.82rem;line-height:1.5;color:#a4adc2}

.footer-disclaimer{
  padding:18px 0;font-size:.8rem;color:#8a93a8;line-height:1.6;
  border-bottom:1px solid #25334a;
}
.footer-disclaimer strong{color:#fff}

.footer-bottom{padding-top:18px;text-align:center;color:#8a93a8;font-size:.82rem}
.footer-bottom p{margin:0}

/* ---------- RESPONSIVE ---------- */
@media (max-width:1024px){
  .casino-card{
    grid-template-columns:60px 1fr 1fr;
    grid-template-areas:
      "rank brand bonus"
      "rank features cta";
    gap:16px;
  }
  .rank{grid-area:rank}
  .brand-block{grid-area:brand}
  .bonus-block{grid-area:bonus}
  .features{grid-area:features}
  .cta-block{grid-area:cta}
}

@media (max-width:900px){
  .main-nav{display:none}
  .mobile-menu-toggle{display:flex}
  .mobile-nav{display:block}
  .footer-top{grid-template-columns:repeat(2,1fr);gap:24px}
}

@media (max-width:768px){
  .hero{padding:34px 0 28px}
  .hero-sub{font-size:.98rem}
  .author-block{padding:10px 14px;gap:10px}
  .author-avatar{width:44px;height:44px}

  .casino-card{
    grid-template-columns:50px 1fr;
    grid-template-areas:
      "rank brand"
      "bonus bonus"
      "features features"
      "cta cta";
    padding:16px 18px;gap:14px;
  }
  .logo-wrap{max-width:140px;min-height:52px}
  .rank-num{width:40px;height:40px;font-size:1.2rem}

  .content-container table{font-size:.85rem}
  .content-container table td{padding:8px 10px}

  .btn-header span{display:none}
  .btn-header{padding:10px 12px}
  .btn-header .icon-gift{width:20px;height:20px}
}

@media (max-width:480px){
  .container{padding:0 14px}
  .header-inner{min-height:62px;gap:12px;padding:8px 14px}
  .logo img{height:32px}
  .hero h1{font-size:1.55rem}
  .casino-card{padding:14px 16px}
  .bonus-text{font-size:.98rem}
  .footer-top{grid-template-columns:1fr;gap:22px}
  .site-footer{padding:36px 0 16px}
}

/* ---------- ACCESSIBILITY ---------- */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important;scroll-behavior:auto !important}
}
a:focus-visible,button:focus-visible{outline:2px solid #009246;outline-offset:2px;border-radius:6px}

/* ---------- PRINT ---------- */
@media print{
  .site-header,.site-footer,.btn,.hero-bg{display:none}
  body{background:#fff}
}