/*=========================================================
M&J Limo - homepage sections: Airport Transportation (8 airports)
and Events & Experiences. Separate file so assets/style.css is
untouched; uses the same tokens (--gold, Cormorant Garamond / Inter)
and the existing .section-heading block.
=========================================================*/

.mjx-airports,
.mjx-events{
    position:relative;
    padding:120px 0;
    overflow:hidden;
    isolation:isolate;
}

/*============ AIRPORTS ============*/

.mjx-airports{ background:#050505; }

.mjx-airports__bg{
    position:absolute;
    inset:0;
    z-index:-2;
}

.mjx-airports__bg img{
    width:100%;
    height:100%;
    object-fit:cover;
}

.mjx-airports::after{
    content:"";
    position:absolute;
    inset:0;
    z-index:-1;
    background:
        radial-gradient(circle at 15% 0%,rgba(202,162,79,.14),transparent 45%),
        linear-gradient(180deg,rgba(5,5,5,.94),rgba(5,5,5,.86) 50%,rgba(5,5,5,.97));
}

.mjx-airport-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:24px;
}

.mjx-airport-card{
    position:relative;
    padding:30px 26px 26px;
    border-radius:20px;
    border:1px solid var(--border,rgba(202,162,79,.35));
    background:rgba(12,12,12,.78);
    backdrop-filter:blur(10px);
    transition:transform var(--transition,.35s ease),border-color var(--transition,.35s ease),background var(--transition,.35s ease),box-shadow var(--transition,.35s ease);
}

.mjx-airport-card:hover,
.mjx-airport-card:focus-within{
    transform:translateY(-6px);
    border-color:var(--gold,#caa24f);
    background:rgba(202,162,79,.08);
    box-shadow:0 25px 50px -25px rgba(0,0,0,.8);
}

.mjx-airport-card__code{
    display:block;
    font-family:"Cormorant Garamond",serif;
    font-size:48px;
    font-weight:700;
    line-height:1;
    background:linear-gradient(135deg,#f3dfa6 0%,#caa24f 50%,#9a7a33 100%);
    -webkit-background-clip:text;
    background-clip:text;
    color:transparent;
}

.mjx-airport-card h3{
    margin:14px 0 8px;
    font-size:17px;
    font-weight:600;
    line-height:1.4;
}

.mjx-airport-card p{
    color:#a7a7a7;
    font-size:14px;
    line-height:1.6;
    margin-bottom:16px;
}

.mjx-airport-card__meta{
    display:inline-flex;
    align-items:center;
    gap:8px;
    color:var(--gold,#caa24f);
    font-size:12px;
    font-weight:600;
    letter-spacing:2px;
    text-transform:uppercase;
}

/*============ EVENTS ============*/

.mjx-events{
    background:radial-gradient(circle at bottom,#1b1b1b 0%,#090909 55%,#050505 100%);
}

.mjx-event-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:24px;
}

.mjx-event-card{
    position:relative;
    display:flex;
    flex-direction:column;
    border-radius:20px;
    overflow:hidden;
    background:#0d0d0d;
    border:1px solid rgba(255,255,255,.07);
    transition:transform var(--transition,.35s ease),border-color var(--transition,.35s ease),box-shadow var(--transition,.35s ease);
}

.mjx-event-card:hover,
.mjx-event-card:focus-within{
    transform:translateY(-6px);
    border-color:var(--border,rgba(202,162,79,.35));
    box-shadow:0 25px 50px -25px rgba(0,0,0,.8);
}

.mjx-event-card__media{
    aspect-ratio:4 / 3;
    overflow:hidden;
}

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

.mjx-event-card:hover .mjx-event-card__media img{ transform:scale(1.06); }

.mjx-event-card__body{
    position:relative;
    flex:1;
    display:flex;
    flex-direction:column;
    padding:32px 22px 22px;
}

.mjx-event-card__icon{
    position:absolute;
    top:-24px;
    left:22px;
    width:48px;
    height:48px;
    border-radius:50%;
    display:grid;
    place-items:center;
    font-size:20px;
    color:#111;
    background:linear-gradient(135deg,#f3dfa6 0%,#caa24f 50%,#9a7a33 100%);
    box-shadow:0 10px 24px -10px rgba(0,0,0,.8);
}

.mjx-event-card h3{
    font-family:"Cormorant Garamond",serif;
    font-size:24px;
    font-weight:700;
    line-height:1.2;
    margin-bottom:14px;
}

.mjx-event-card__link{
    margin-top:auto;
    display:inline-flex;
    align-items:center;
    gap:8px;
    color:var(--gold,#caa24f);
    font-size:12px;
    font-weight:600;
    letter-spacing:2px;
    text-transform:uppercase;
}

.mjx-event-card__link i{ transition:transform .3s ease; }
.mjx-event-card:hover .mjx-event-card__link i{ transform:translateX(4px); }

/*============ SHARED ============*/

.mjx-stretched{ color:inherit; }

.mjx-stretched::after{
    content:"";
    position:absolute;
    inset:0;
    z-index:1;
}

.mjx-stretched:focus-visible{ outline:none; }

.mjx-airport-card:has(.mjx-stretched:focus-visible),
.mjx-event-card:has(.mjx-stretched:focus-visible){
    outline:2px solid var(--gold,#caa24f);
    outline-offset:3px;
}

.mjx-section-foot{
    margin-top:50px;
    text-align:center;
}

.mjx-link{
    display:inline-flex;
    align-items:center;
    gap:10px;
    padding:16px 30px;
    border-radius:50px;
    border:1px solid var(--border,rgba(202,162,79,.35));
    color:var(--gold-light,#e4c57d);
    font-size:13px;
    font-weight:600;
    letter-spacing:2px;
    transition:background var(--transition,.35s ease),color var(--transition,.35s ease);
}

.mjx-link:hover{
    background:var(--gold,#caa24f);
    color:#111;
}

/*============ RESPONSIVE ============*/

@media (max-width:1100px){
    .mjx-airport-grid{ grid-template-columns:repeat(2,1fr); }
    .mjx-event-grid{ grid-template-columns:repeat(3,1fr); }
}

@media (max-width:768px){
    .mjx-airports,
    .mjx-events{ padding:80px 0; }
    .mjx-event-grid{ grid-template-columns:repeat(2,1fr); gap:16px; }
    .mjx-event-card__body{ padding:28px 16px 16px; }
    .mjx-event-card__icon{ width:42px; height:42px; top:-21px; left:16px; font-size:18px; }
    .mjx-event-card h3{ font-size:20px; }
}

@media (max-width:520px){
    .mjx-airport-grid{ grid-template-columns:1fr; gap:16px; }
    .mjx-airport-card{ padding:24px 22px 22px; }
    .mjx-airport-card__code{ font-size:42px; }
    .mjx-event-card h3{ font-size:18px; }
    .mjx-event-card__link{ font-size:11px; letter-spacing:1.5px; }
}

@media (prefers-reduced-motion:reduce){
    .mjx-airport-card,
    .mjx-event-card,
    .mjx-event-card__media img{ transition:none; }
}
