/* ===========================
   THEME SETTINGS
=========================== */

:root{
    --brand-1:#6a11cb;
    --brand-2:#2575fc;
    --dark:#0f172a;
    --light:#f8fafc;
}

/* ===========================
   GLOBAL
=========================== */

body{
    background: var(--light);
    font-family: "Segoe UI", sans-serif;
}

.section-title{
    font-weight:700;
    margin-bottom:40px;
}

/* ===========================
   HERO
=========================== */

.hero{
    background: linear-gradient(120deg,var(--brand-1),var(--brand-2));
    color:#fff;
    padding:90px 20px;
    text-align:center;
}

.hero h1{
    font-size:48px;
    font-weight:800;
}

.hero p{
    opacity:.9;
    font-size:18px;
}

/* ===========================
   TICKETS
=========================== */

.ticket-box{
    background:#fff;
    border-radius:18px;
    padding:30px;
    box-shadow:0 10px 30px rgba(0,0,0,.08);
    transition:.3s;
    cursor:pointer;
    border:3px solid transparent;
    height:100%;
}

.ticket-box:hover{
    transform:translateY(-8px);
    border-color:var(--brand-2);
}

.ticket-type{
    font-size:20px;
    font-weight:700;
}

.ticket-price{
    font-size:36px;
    font-weight:800;
    color:var(--brand-2);
}

.ticket-desc{
    color:#64748b;
    font-size:15px;
}

/* ===========================
   FORM
=========================== */

.form-card{
    background:#fff;
    border-radius:20px;
    box-shadow:0 10px 40px rgba(0,0,0,.08);
    padding:40px;
}

.step{
    width:35px;
    height:35px;
    border-radius:50%;
    background:var(--brand-2);
    color:#fff;
    display:flex;
    align-items:center;
    justify-content:center;
    font-weight:700;
}

/* ===========================
   FOOTER
=========================== */

footer{
    background:var(--dark);
    color:#fff;
    padding:40px 0;
}