/**
 * UOK Events
 * Event Detail View
 * Version 1.0.26
 */

.uok-event-detail{
    --uok-navy:#002b70;
    --uok-navy-dark:#001b49;
    --uok-navy-soft:#0b438d;
    --uok-gold:#d9a441;
    --uok-gold-soft:#f3dfb2;
    --uok-ink:#172033;
    --uok-muted:#667085;
    --uok-line:rgba(0,43,112,.12);
    --uok-surface:#ffffff;
    --uok-soft:#f6f8fc;

    width:100%;
    max-width:1480px;
    margin:0 auto;
    padding:0 20px 64px;
    box-sizing:border-box;
    color:var(--uok-ink);
}

.uok-event-detail *,
.uok-event-detail *::before,
.uok-event-detail *::after{
    box-sizing:inherit;
}

.uok-event-detail__hero{
    position:relative;
    isolation:isolate;
    overflow:hidden;
    min-height:300px;
    display:flex;
    align-items:center;
    margin-bottom:28px;
    padding:48px 58px;
    border-radius:0 0 30px 30px;
    background:
        radial-gradient(
            circle at 12% 18%,
            rgba(217,164,65,.22),
            transparent 25%
        ),
        linear-gradient(
            135deg,
            var(--uok-navy-dark) 0%,
            var(--uok-navy) 58%,
            var(--uok-navy-soft) 100%
        );
    box-shadow:0 18px 45px rgba(0,43,112,.14);
    color:#fff;
}

.uok-event-detail__hero::after{
    content:"";
    position:absolute;
    inset:0;
    z-index:-1;
    opacity:.14;
    background-image:
        linear-gradient(
            rgba(255,255,255,.08) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(255,255,255,.08) 1px,
            transparent 1px
        );
    background-size:38px 38px;
    mask-image:linear-gradient(
        to left,
        #000,
        transparent 80%
    );
}

.uok-event-detail__hero-glow{
    position:absolute;
    width:330px;
    height:330px;
    inset-inline-end:-110px;
    top:-150px;
    border-radius:50%;
    background:rgba(217,164,65,.13);
    filter:blur(2px);
    pointer-events:none;
}

.uok-event-detail__hero-content{
    position:relative;
    z-index:2;
    width:min(100%,1050px);
}

.uok-event-detail__eyebrow{
    margin-bottom:12px;
    color:var(--uok-gold-soft);
    font-size:.88rem;
    font-weight:800;
    letter-spacing:.04em;
}

.uok-event-detail__category{
    display:inline-flex;
    align-items:center;
    min-height:34px;
    margin-bottom:18px;
    padding:6px 15px;
    border:1px solid rgba(217,164,65,.5);
    border-radius:999px;
    background:rgba(217,164,65,.11);
    color:#f7dfa9;
    font-size:.88rem;
    font-weight:800;
}

.uok-event-detail__hero h1{
    max-width:1050px;
    margin:0;
    color:#fff;
    font-size:clamp(2rem,4vw,3.5rem);
    font-weight:900;
    line-height:1.25;
    letter-spacing:-.025em;
}

.uok-event-detail__summary{
    max-width:900px;
    margin:20px 0 0;
    color:rgba(255,255,255,.82);
    font-size:1.05rem;
    line-height:1.9;
}

.uok-event-detail__hero-mark{
    position:absolute;
    inset-inline-end:52px;
    bottom:44px;
    display:flex;
    align-items:flex-end;
    gap:8px;
    opacity:.9;
}

.uok-event-detail__hero-mark span{
    display:block;
    width:7px;
    border-radius:999px;
    background:var(--uok-gold);
}

.uok-event-detail__hero-mark span:nth-child(1){
    height:25px;
}

.uok-event-detail__hero-mark span:nth-child(2){
    height:46px;
}

.uok-event-detail__hero-mark span:nth-child(3){
    height:68px;
}

.uok-event-detail__layout{
    display:grid;
    grid-template-columns:minmax(260px,340px) minmax(0,1fr);
    gap:28px;
    align-items:start;
}

.uok-event-detail__meta-card,
.uok-event-detail__content-card{
    border:1px solid var(--uok-line);
    background:var(--uok-surface);
    box-shadow:0 12px 34px rgba(0,43,112,.07);
}

.uok-event-detail__meta-card{
    position:relative;
    overflow:hidden;
    border-radius:22px;
}

.uok-event-detail__meta-accent{
    height:5px;
    background:linear-gradient(
        90deg,
        var(--uok-gold),
        #f0cf86
    );
}

.uok-event-detail__meta-content{
    padding:12px 24px;
}

.uok-event-detail__meta-item{
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    gap:14px;
    align-items:start;
    padding:21px 0;
    border-bottom:1px solid var(--uok-line);
}

.uok-event-detail__meta-item:last-child{
    border-bottom:0;
}

.uok-event-detail__meta-icon{
    width:42px;
    height:42px;
    display:grid;
    place-items:center;
    border-radius:13px;
    background:rgba(0,43,112,.07);
    color:var(--uok-navy);
}

.uok-event-detail__meta-icon svg{
    width:21px;
    height:21px;
    fill:none;
    stroke:currentColor;
    stroke-width:1.8;
    stroke-linecap:round;
    stroke-linejoin:round;
}

.uok-event-detail__meta-item small{
    display:block;
    margin-bottom:5px;
    color:var(--uok-muted);
    font-size:.78rem;
    font-weight:700;
}

.uok-event-detail__meta-item strong{
    display:block;
    color:var(--uok-navy-dark);
    font-size:.98rem;
    font-weight:850;
    line-height:1.65;
    overflow-wrap:anywhere;
}

.uok-event-detail__content-card{
    overflow:hidden;
    min-height:280px;
    border-radius:22px;
}

.uok-event-detail__image{
    margin:0;
    overflow:hidden;
    background:var(--uok-soft);
}

.uok-event-detail__image img{
    display:block;
    width:100%;
    max-height:520px;
    object-fit:cover;
}

.uok-event-detail__body{
    padding:38px 42px;
    color:#28344a;
    font-size:1.04rem;
    line-height:2;
    overflow-wrap:anywhere;
}

.uok-event-detail__body > :first-child{
    margin-top:0;
}

.uok-event-detail__body > :last-child{
    margin-bottom:0;
}

.uok-event-detail__body p{
    margin:0 0 1.2em;
}

.uok-event-detail__body h2,
.uok-event-detail__body h3,
.uok-event-detail__body h4{
    color:var(--uok-navy);
    line-height:1.45;
}

.uok-event-detail__body img{
    max-width:100%;
    height:auto;
    border-radius:14px;
}

.uok-event-detail__body a{
    color:var(--uok-navy);
    text-decoration-color:rgba(217,164,65,.8);
    text-underline-offset:3px;
}

.uok-event-detail__body table{
    width:100%;
    max-width:100%;
    border-collapse:collapse;
}

.uok-event-detail__body th,
.uok-event-detail__body td{
    padding:10px 12px;
    border:1px solid var(--uok-line);
}

.uok-event-detail__website{
    padding:0 42px 38px;
}

.uok-event-detail__website a{
    display:inline-flex;
    align-items:center;
    gap:9px;
    min-height:44px;
    padding:10px 18px;
    border-radius:12px;
    background:var(--uok-navy);
    color:#fff;
    font-weight:800;
    text-decoration:none;
    transition:
        transform .2s ease,
        box-shadow .2s ease,
        background .2s ease;
}

.uok-event-detail__website a:hover{
    transform:translateY(-1px);
    background:var(--uok-navy-dark);
    color:#fff;
    box-shadow:0 8px 20px rgba(0,43,112,.18);
}

@media (max-width:980px){

    .uok-event-detail{
        padding-inline:16px;
    }

    .uok-event-detail__hero{
        min-height:270px;
        padding:40px 34px;
    }

    .uok-event-detail__layout{
        grid-template-columns:1fr;
    }

    .uok-event-detail__meta-content{
        display:grid;
        grid-template-columns:repeat(
            auto-fit,
            minmax(200px,1fr)
        );
        gap:0 24px;
    }

    .uok-event-detail__meta-item{
        border-bottom:0;
    }

}

@media (max-width:640px){

    .uok-event-detail{
        padding:0 12px 42px;
    }

    .uok-event-detail__hero{
        min-height:auto;
        margin-bottom:18px;
        padding:32px 22px 38px;
        border-radius:0 0 22px 22px;
    }

    .uok-event-detail__hero h1{
        font-size:clamp(1.65rem,8vw,2.35rem);
        line-height:1.35;
    }

    .uok-event-detail__summary{
        margin-top:16px;
        font-size:.98rem;
        line-height:1.8;
    }

    .uok-event-detail__hero-mark{
        inset-inline-end:20px;
        bottom:18px;
        opacity:.55;
    }

    .uok-event-detail__hero-mark span:nth-child(1){
        height:15px;
    }

    .uok-event-detail__hero-mark span:nth-child(2){
        height:27px;
    }

    .uok-event-detail__hero-mark span:nth-child(3){
        height:39px;
    }

    .uok-event-detail__layout{
        gap:18px;
    }

    .uok-event-detail__meta-content{
        display:block;
        padding:7px 20px;
    }

    .uok-event-detail__meta-item{
        grid-template-columns:38px minmax(0,1fr);
        gap:12px;
        padding:17px 0;
        border-bottom:1px solid var(--uok-line);
    }

    .uok-event-detail__meta-item:last-child{
        border-bottom:0;
    }

    .uok-event-detail__meta-icon{
        width:38px;
        height:38px;
    }

    .uok-event-detail__content-card,
    .uok-event-detail__meta-card{
        border-radius:18px;
    }

    .uok-event-detail__body{
        padding:27px 22px;
        font-size:1rem;
        line-height:1.9;
    }

    .uok-event-detail__website{
        padding:0 22px 27px;
    }

}

@media (prefers-reduced-motion:reduce){

    .uok-event-detail__website a{
        transition:none;
    }

}
/* Detail navigation */
.uok-event-detail__back{
    display:inline-flex;
    align-items:center;
    gap:9px;
    margin-bottom:22px;
    color:rgba(255,255,255,.88);
    font-size:.9rem;
    font-weight:800;
    text-decoration:none;
    transition:color .2s ease,transform .2s ease;
}

.uok-event-detail__back span{
    color:var(--uok-gold);
    font-size:1.15em;
    line-height:1;
}

.uok-event-detail__back:hover{
    color:#fff;
    transform:translateX(-2px);
}

@media (prefers-reduced-motion:reduce){
    .uok-event-detail__back{
        transition:none;
    }
}

/* =========================================================
   Event Detail — Compact Layout
   ========================================================= */

/* Helix Ultimate uses 100px vertical padding on #sp-main-body.
   Reduce it only on the UOK Events detail view. */
body.com_uokevents.view-event #sp-main-body{
    padding-top:32px;
    padding-bottom:42px;
}

/* More compact desktop hero */
.uok-event-detail__hero{
    min-height:235px;
    margin-bottom:22px;
    padding:34px 44px;
}

.uok-event-detail__hero h1{
    font-size:clamp(1.85rem,3.2vw,2.8rem);
    line-height:1.28;
}

.uok-event-detail__eyebrow{
    margin-bottom:9px;
}

.uok-event-detail__category{
    min-height:30px;
    margin-bottom:13px;
    padding:5px 13px;
}

.uok-event-detail__summary{
    margin-top:14px;
    line-height:1.75;
}

.uok-event-detail__hero-mark{
    inset-inline-end:42px;
    bottom:32px;
}

/* Bring the information area closer together */
.uok-event-detail__layout{
    gap:22px;
}

.uok-event-detail__meta-content{
    padding:8px 22px;
}

.uok-event-detail__meta-item{
    padding:16px 0;
}

.uok-event-detail__content-card{
    min-height:220px;
}

.uok-event-detail__body{
    padding:28px 34px;
    line-height:1.85;
}

.uok-event-detail__website{
    padding:0 34px 28px;
}

/* Keep tablet/mobile comfortable rather than over-compressed */
@media (max-width:980px){
    body.com_uokevents.view-event #sp-main-body{
        padding-top:24px;
        padding-bottom:32px;
    }

    .uok-event-detail__hero{
        min-height:220px;
        padding:30px 30px;
    }
}

@media (max-width:640px){
    body.com_uokevents.view-event #sp-main-body{
        padding-top:14px;
        padding-bottom:22px;
    }

    .uok-event-detail__hero{
        min-height:auto;
        margin-bottom:16px;
        padding:26px 20px 30px;
    }

    .uok-event-detail__hero h1{
        font-size:clamp(1.55rem,7vw,2.05rem);
    }

    .uok-event-detail__layout{
        gap:16px;
    }

    .uok-event-detail__meta-item{
        padding:14px 0;
    }

    .uok-event-detail__body{
        padding:24px 20px;
        line-height:1.8;
    }

    .uok-event-detail__website{
        padding:0 20px 24px;
    }
}