/* =================================================
EVENT LANDING — two large tiles (Automated / Timed)
Visual language borrowed from the Guide tiles, but sized
as wide landscape cards since there are only two.
================================================= */

.event-intro{
text-align:center;
max-width:760px;
margin:0 auto 44px;
color:#bcc0cf;
line-height:1.6;
}

.event-grid{
display:grid;
grid-template-columns:repeat(2,1fr);
gap:26px;
}

.event-tile{
position:relative;
display:block;
border-radius:14px;
overflow:hidden;
background:#0c0f1a;
border:1px solid rgba(255,255,255,.06);
text-decoration:none;
color:inherit;
transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease;
}

.event-tile:hover{
transform:translateY(-6px);
border-color:rgba(212,175,55,.6);
box-shadow:0 18px 40px rgba(0,0,0,.6),0 0 0 1px rgba(212,175,55,.25);
}

.event-tile-img{
position:relative;
width:100%;
aspect-ratio:8/5;
overflow:hidden;
background:#0a0c14;
}

.event-tile-img img{
width:100%;
height:100%;
object-fit:cover;
display:block;
transition:transform .4s ease;
}

.event-tile:hover .event-tile-img img{
transform:scale(1.05);
}

.event-tile-overlay{
position:absolute;
inset:0;
display:flex;
flex-direction:column;
align-items:flex-start;
justify-content:flex-end;
padding:26px 24px;
background:linear-gradient(180deg,transparent 45%,rgba(0,0,0,.88) 100%);
transition:opacity .25s ease;
}

.event-tile-title{
font-size:26px;
font-weight:700;
line-height:1.15;
background:linear-gradient(90deg,#ffffff,#caa65a);
-webkit-background-clip:text;
-webkit-text-fill-color:transparent;
margin-bottom:6px;
}

.event-tile-sub{
font-size:14px;
color:#cfd3e0;
line-height:1.4;
max-width:90%;
}

.event-tile-badge{
position:absolute;
top:16px;
left:16px;
padding:5px 12px;
border-radius:999px;
font-size:12px;
font-weight:600;
letter-spacing:.04em;
text-transform:uppercase;
color:#f4e7c2;
background:rgba(20,24,50,.75);
border:1px solid rgba(212,175,55,.4);
backdrop-filter:blur(6px);
}

/* back link on subpages */
.event-back{
display:inline-flex;
align-items:center;
gap:8px;
margin-bottom:26px;
padding:9px 16px;
border-radius:8px;
color:#bcc0cf;
text-decoration:none;
font-size:14px;
border:1px solid rgba(255,255,255,.08);
background:rgba(12,15,26,.6);
transition:background .15s ease,color .15s ease,border-color .15s ease;
}

.event-back:hover{
color:#f4e7c2;
border-color:rgba(212,175,55,.4);
background:rgba(255,255,255,.05);
}

/* reward call-outs inside timed events */
.event-note{
color:#caa65a;
}

/* ---- colored highlights for event descriptions ---- */
.hl{color:#e8c874;font-weight:600;}            /* gold key term */
.hl-teal{color:#5ad1c0;font-weight:600;}       /* cool accent */
.hl-rose{color:#ff8fa3;font-weight:600;}       /* location / warm accent */

/* secret words — shimmering gold */
.evt-word{
font-weight:800;
letter-spacing:.06em;
background:linear-gradient(90deg,#ffe9a8,#d4af37);
-webkit-background-clip:text;
-webkit-text-fill-color:transparent;
}

/* reward-tier colour ramp: standard -> greater -> grand */
.tier-1{color:#c9cdd8;font-weight:700;}        /* silver */
.tier-2{color:#e8c874;font-weight:700;}        /* gold */
.tier-3{color:#ff9f45;font-weight:700;}        /* orange */

/* tint the reward prize cells so the pool pops */
.prize-cell{color:#e8c874;}

@media (max-width:760px){
.event-grid{grid-template-columns:1fr;gap:20px;}
.event-tile-title{font-size:22px;}
}