/* MaxLucky — maxlucky.pro — style.v1.css */
/* Estilo editorial tropical / archivo natural. Sin iconografía de casino. */

:root{
  --selva:#1F4D3A;
  --agua:#2E8C9E;
  --niebla:#F0F5F0;
  --arcilla:#8C3B2B;
  --tinta:#1B2A22;
  --borde: rgba(31,77,58,.18);
  --max-w: 920px;
}

*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
[hidden]{display:none!important;}

body{
  background:var(--niebla);
  color:var(--tinta);
  font-family:'Rubik', Arial, sans-serif;
  line-height:1.65;
  font-size:17px;
  background-image:
    radial-gradient(ellipse at 15% 0%, rgba(46,140,158,.10), transparent 55%),
    radial-gradient(ellipse at 85% 10%, rgba(31,77,58,.08), transparent 50%);
  background-attachment:fixed;
}

h1,h2,h3,h4{
  font-family:'DM Serif Display', Georgia, serif;
  color:var(--selva);
  line-height:1.25;
  font-weight:400;
}
h1{font-size:2.1rem; margin:.2em 0 .5em;}
h2{font-size:1.5rem; margin:1.4em 0 .5em;}
h3{font-size:1.15rem; margin:1.2em 0 .4em; color:var(--arcilla);}

a{color:var(--agua); text-decoration:underline; text-decoration-color:rgba(46,140,158,.4);}
a:hover{color:var(--arcilla);}

p{margin:0 0 1em;}

.wrap{max-width:var(--max-w); margin:0 auto; padding:0 20px;}

/* --- Age gate --- */
#age-gate{
  position:fixed; inset:0; z-index:9999;
  background:rgba(14,30,22,.92);
  display:flex; align-items:center; justify-content:center;
  padding:20px;
}
#age-gate .age-card{
  background:var(--niebla);
  border:1px solid var(--borde);
  border-top:6px solid var(--arcilla);
  border-radius:10px;
  max-width:460px; width:100%;
  padding:30px 28px;
  text-align:center;
  box-shadow:0 20px 60px rgba(0,0,0,.35);
}
#age-gate .age-card h2{margin-top:0;}
#age-gate .age-leaf{
  width:46px; height:46px; margin:0 auto 14px;
  display:block;
}
#age-gate .age-actions{
  display:flex; gap:12px; justify-content:center; margin-top:20px; flex-wrap:wrap;
}
.btn{
  font-family:'Rubik', Arial, sans-serif;
  font-weight:600;
  border:none;
  border-radius:6px;
  padding:12px 22px;
  cursor:pointer;
  font-size:.98rem;
}
.btn-yes{background:var(--selva); color:#fff;}
.btn-yes:hover{background:#163b2b;}
.btn-no{background:transparent; color:var(--arcilla); border:1px solid var(--arcilla);}
.btn-no:hover{background:rgba(140,59,43,.08);}
#age-gate .age-fine{font-size:.82rem; color:#5a6b61; margin-top:16px;}

/* --- Header --- */
header.site-header{
  border-bottom:1px solid var(--borde);
  background:rgba(240,245,240,.86);
  backdrop-filter:blur(3px);
  position:relative;
}
header.site-header .inner{
  max-width:var(--max-w); margin:0 auto; padding:18px 20px;
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  flex-wrap:wrap;
}
.brand{
  font-family:'DM Serif Display', Georgia, serif;
  font-size:1.5rem; color:var(--selva); text-decoration:none;
  display:flex; align-items:center; gap:10px;
}
.brand:hover{color:var(--selva);}
.brand .mark{width:28px; height:28px; flex:0 0 auto;}
nav.site-nav{display:flex; flex-wrap:wrap; gap:14px; font-size:.92rem;}
nav.site-nav a{text-decoration:none; color:var(--tinta); font-weight:500;}
nav.site-nav a:hover{color:var(--agua); text-decoration:underline;}

/* --- Main --- */
main{padding:36px 0 10px;}
.lead{font-size:1.1rem; color:#334b3f;}
.hero{
  padding:28px 0 4px;
}
.hero .kicker{
  text-transform:uppercase; letter-spacing:.08em; font-size:.76rem;
  color:var(--agua); font-weight:700; margin-bottom:10px; display:block;
}

.card{
  background:#fff;
  border:1px solid var(--borde);
  border-radius:10px;
  padding:22px 24px;
  margin:18px 0;
}
.card.accent{border-left:5px solid var(--arcilla);}
.card.agua{border-left:5px solid var(--agua);}

.grid-2{display:grid; grid-template-columns:1fr 1fr; gap:18px;}
@media (max-width:700px){.grid-2{grid-template-columns:1fr;}}

ul.plain{padding-left:1.1em;}
ul.plain li{margin-bottom:.5em;}

.timeline-list{list-style:none; padding:0; margin:0;}
.timeline-list li{
  border-bottom:1px solid var(--borde);
  padding:16px 0;
}
.timeline-list li:last-child{border-bottom:none;}
.timeline-list .yr{
  font-family:'DM Serif Display', Georgia, serif;
  color:var(--arcilla); font-size:1.2rem; display:block; margin-bottom:2px;
}
.timeline-list a{font-weight:600; text-decoration:none;}
.timeline-list a:hover{text-decoration:underline;}

.faq-item{border-bottom:1px solid var(--borde); padding:16px 0;}
.faq-item h3{margin-top:0;}

/* --- Responsible gaming box --- */
.rg-box{
  background:#fff;
  border:1px solid var(--borde);
  border-left:5px solid var(--selva);
  border-radius:10px;
  padding:18px 22px;
  margin:24px 0;
  font-size:.95rem;
}
.rg-box strong{color:var(--selva);}

/* --- Footer --- */
footer.site-footer{
  border-top:1px solid var(--borde);
  margin-top:50px;
  padding:30px 0 50px;
  font-size:.82rem;
  color:#4a5d53;
  background:rgba(31,77,58,.04);
}
footer.site-footer .wrap{display:flex; flex-direction:column; gap:10px;}
footer.site-footer nav{display:flex; gap:14px; flex-wrap:wrap; margin-top:6px;}
footer.site-footer a{color:#4a5d53;}
footer.site-footer .disclaimer{max-width:760px;}

/* --- Garganta del Tiempo (cronologia mechanic) --- */
#garganta-wrap{
  display:flex; flex-direction:column; align-items:center;
  margin:28px 0 20px;
}
#garganta-svg{
  width:min(100%, 360px);
  height:auto;
  touch-action:none;
  cursor:grab;
}
#garganta-svg:active{cursor:grabbing;}
#garganta-caption{
  margin-top:16px;
  max-width:420px;
  text-align:center;
  min-height:70px;
  background:#fff;
  border:1px solid var(--borde);
  border-radius:10px;
  padding:14px 18px;
  font-size:.95rem;
}
#garganta-caption .era-name{
  display:block; font-family:'DM Serif Display', Georgia, serif;
  color:var(--arcilla); font-size:1.05rem; margin-bottom:4px;
}
#garganta-hint{font-size:.78rem; color:#5a6b61; margin-top:8px;}

.breadcrumbs{font-size:.82rem; color:#5a6b61; margin-bottom:6px;}
.breadcrumbs a{color:#5a6b61; text-decoration:none;}
.breadcrumbs a:hover{text-decoration:underline;}

.editorial-note{font-size:.82rem; color:#5a6b61; margin-top:34px; border-top:1px dashed var(--borde); padding-top:14px;}

.page-404{text-align:center; padding:60px 0;}