.unbounded{
    font-family: "Unbounded", sans-serif;
}



.event-teaser {
    --bg: rgba(0,162,155,0.1);
    --teal: #00A29B;
    --orange: #D77600;
    background: var(--bg);
    /*position: absolute;*/
    /*width: 100%;*/
    /*z-index: 11;*/
}

.event-teaser .fw-700 { font-weight: 700; }

.event-teaser .event-teaser-eyebrow {
    letter-spacing: .02em;
    color: #1b2927;
    font-weight: 700;
    font-size: 1.05rem;
}

.event-teaser .event-teaser-title {
    color: var(--teal);
    font-weight: 800;
    font-size: 24px;
    max-width: 40ch;
    margin-bottom: 1rem !important;
}

.event-teaser .event-teaser-info {
    font-size: 15px;
}

.event-teaser .event-teaser-icon {
    width: 36px;
    height: 36px;
    flex: 0 0 36px;
    display: grid;
    place-items: center;
    background: #fff;
    border: 1.5px solid var(--orange);
    border-radius: 50%;
    font-size: 1rem;
    color: var(--orange);
}

.event-teaser .event-teaser-icon:hover{
    background-color: var(--orange);
    color: #fff;
}

.event-teaser .event-teaser-more {
    position: relative;
    display: inline-block;
    color: #1f2d2b;
    text-decoration: none;
    font-weight: 600;
}
.event-teaser .event-teaser-underline {
    position: absolute;
    left: 0;
    right: 70%;
    bottom: -2px;
    height: 3px;
    background: var(--orange);
    border-radius: 2px;
    transition: right .25s ease;
}
.event-teaser .event-teaser-more:hover .event-teaser-underline {
    right: 0;
}

/* Compact spacing */
.event-teaser.event-teaser--compact {
    padding-top: 1.5rem !important;
    padding-bottom: 1.5rem !important;
}
@media (min-width: 992px) {
    .event-teaser.event-teaser--compact {
        padding-top: 2rem !important;
        padding-bottom: 2rem !important;
    }
}

/* Image on right */
.event-teaser .event-teaser-image {
    max-width: 100%;
    height: auto;
    border-radius: 1.25rem;
}

.events-pattern{
    width: 100%;
    height: 50px;
    object-fit: cover;
    object-position: top;
}

/* ===== Scoped to recent-events ===== */
.recent-events{ --gap:32px; --border:#d2d2d2; --ink:#0f0f0f; --muted:#7d7d7d; }
.recent-events .re-title{ font-weight:400; letter-spacing:.02em; color:#000000; font-size:15px; }

/* Arrows */
.recent-events .re-arrow{ width:44px;height:44px;border-radius:50%;border:2px solid #000;background:#fff;display:grid;place-items:center;padding:0;cursor:pointer;transition:.2s; }
.recent-events .re-arrow:hover{ background:#000;color:#fff; }
.recent-events .re-arrow-ico{ font-size:20px; line-height:1; }

/* Viewport/Track for snap carousel */
.recent-events .re-viewport{ overflow:hidden; }
.recent-events .re-track{
    display:flex; gap:var(--gap);
    overflow-x:auto; scroll-snap-type:x mandatory;
    scroll-padding-left: 0.01px; /* safari snap nudge */
    -webkit-overflow-scrolling: touch;
    padding-bottom: 2px; /* avoid shadow clip */
}
.recent-events .re-item{ scroll-snap-align:start; flex:0 0 var(--w-sm); }
@media (min-width:768px){  .recent-events .re-item{ flex-basis: var(--w-md); } }
@media (min-width:992px){  .recent-events .re-item{ flex-basis: var(--w-lg); } }
@media (min-width:1200px){ .recent-events .re-item{ flex-basis: var(--w-xl); } }

/* widths to yield 1 / 1.5 / 2.0 / 2.5 visible cards */
.recent-events{ --w-sm: 100%; }
@media (min-width:768px){  .recent-events{ --w-md: calc((100% - var(--gap)*.5)/1.5); } }   /* ≈1.5 */
@media (min-width:992px){  .recent-events{ --w-lg: calc((100% - var(--gap)*1)/2); } }     /* 2.0 */
@media (min-width:1200px){ .recent-events{ --w-xl: calc((100% - var(--gap)*2)/2.5); } }   /* 2.5 */

/* Card look */
.recent-events .re-card{ border:1px solid var(--border); border-radius:18px; background:#fff; display:flex; flex-direction:column; height:100%; }
.recent-events .re-card-title{ margin:0; color:var(--ink); font-weight:300; line-height:1.35; font-size: 15px; }
.recent-events .re-date{ display:flex; align-items:center; gap:18px; }
.recent-events .re-day{ font-weight:900; font-size:clamp(2.6rem,4.5vw,4.25rem); line-height:1; letter-spacing:-.02em; }
.recent-events .re-month{ margin-top:.45rem; font-weight:300; color:var(--ink); }
.recent-events .re-media img{ width:100%; height:260px; object-fit:cover; border-radius:14px; display:block; }
.recent-events .re-cta{ display:flex; align-items:center; gap:18px; }
.recent-events .re-link{ text-decoration:none; color:#111; font-weight:300; }
.recent-events .re-link:hover{ text-decoration:underline; }
.recent-events .re-sep{ width:1px; height:16px; background:var(--muted); display:inline-block; }

/* hide scrollbar, but keep scrollability */
.recent-events .re-track{ scrollbar-width:none; }
.recent-events .re-track::-webkit-scrollbar{ display:none; }

.container-padding {
    padding-left: 20px;
}



@media (min-width: 576px) {
    .container-padding {
        padding-left: max((100vw - 540px) / 2, 20px);
    }
}

@media (min-width: 768px) {
    .container-padding{
        padding-left: max((100vw - 720px) / 2, 20px);
    }
}

@media (min-width: 992px) {
    .container-padding {
        padding-left: max((100vw - 960px) / 2, 20px);
    }
}

@media (min-width: 1200px) {
    .container-padding {
        padding-left: max((100vw - 1140px) / 2, 20px);
    }
}

@media (min-width: 1400px) {
    .container-padding {
        padding-left: max((100vw - 1320px) / 2, 20px);
    }
}


/* ===== Past Events (scoped) ===== */
.past-events{
    --bg:rgba(0,162,155,0.1);           /* page tint like the mock */
    --ink:#000000;          /* body text */
    --teal:#00A29B;         /* headings */
    --accent:#D77600;       /* badge orange */
    --line:#D77600;         /* thin gold-ish divider */
}
.past-events{ background:var(--bg); }
.past-events .pe-title{
    font-weight: 400;
    letter-spacing: .02em;
    color: #000000;
    font-size: 15px;
}
.past-events .pe-card-title{
    margin: 0;
    color: var(--ink);
    font-weight: 300;
    line-height: 1.35;
    font-size: 15px;
}

.past-events .pe-card-title a, .past-events .pe-card-title a:hover{
    font-weight: 300;
     color: var(--ink);
     text-decoration:none;
}

/* Media block with badge */
.past-events .pe-media{
    position:relative;
    border-radius:16px; overflow:hidden;
}
.past-events .pe-media img{
    display:block; width:100%; height:260px; object-fit:cover;
}
.past-events .pe-badge{
    position:absolute; top:0px; right:0px;
    background:var(--accent); color:#fff;
    border-radius:0px;
    padding:.35rem .85rem .5rem;
    min-width:92px;
    box-shadow:0 4px 10px rgba(0,0,0,.15);
}
.past-events .pe-badge-day{
    font-weight:800; font-size:2rem; line-height:1; letter-spacing:-.02em;
}
.past-events .pe-badge-month{
    font-weight:600; font-size:.95rem; margin-top:.15rem;
}

/* Meta + divider */
.past-events .pe-meta{
    color:var(--ink); font-weight:300; font-size:13px; margin-top: 10px;
}
.past-events .pe-divider{
    height:3px; width:100%;
    background: linear-gradient(to right, var(--line), var(--line)) no-repeat left center / 100% 2px;
    border-radius:2px;
}

/* Card spacing mimic */
.past-events .pe-card{ padding: .25rem; }


/* ===== Scoped hero styles ===== */
.event-hero{
    --eh-overlay: rgba(8, 33, 33, .55); /* dark teal wash like the mock */
    --eh-ink: #ffffff;
    --eh-accent: #D77600;              /* teal for icon ring */
    --eh-underline: #d7e7e4;

    position: relative;
    min-height: clamp(55vh, 68vh, 78vh);
    color: var(--eh-ink);
    background: center/cover no-repeat var(--eh-bg, none);
    padding-top: clamp(2rem, 5vw, 4rem);
    padding-bottom: clamp(2.5rem, 7vw, 4.5rem);
}
.event-hero::before{
    content:"";
    position:absolute; inset:0;
    background: var(--eh-overlay);
}
.event-hero .container{ position: relative; z-index: 1; }

/* Back link */
.event-hero .eh-back{
    position: absolute; left: 0; top: 0;
    color: var(--eh-ink); text-decoration: none; font-weight: 800;
    letter-spacing: .02em;
}
.event-hero .eh-back:hover{ text-decoration: underline; }

/* Date row */
.event-hero .eh-date{ margin-top: clamp(8rem, 20vh, 24vh); }
@media (max-width: 991.98px){
    .event-hero .eh-date{ margin-top: clamp(3rem, 12vh, 14vh); }
}
.event-hero .eh-date-icon{
    width: 42px; height: 42px; border-radius: 50%;
    display:grid; place-items:center;
    border: 2px solid var(--eh-accent);
    color: var(--eh-accent);
    background: rgba(0,0,0,.15);
}
.event-hero .eh-date-icon i{ font-size: 18px; }
.event-hero .eh-date-text{
    font-weight: 400; opacity: .95;
}

/* Title */
.event-hero .eh-title{
    font-weight: 600;
    line-height: 1.15;
    letter-spacing: .01em;
    font-size: 25px;
    max-width: 30ch;
    margin: 0;
}

/* Register link with underline */
.event-hero .eh-register{
    color: var(--eh-ink); text-decoration: none; font-weight: 400;
    position: relative; padding-bottom: 4px;
}
.event-hero .eh-register .eh-underline{
    position: absolute; left: 0; right: 65%; bottom: -2px; height: 3px;
    background: var(--eh-underline); border-radius: 2px;
    transition: right .25s ease;
}
.event-hero .eh-register:hover .eh-underline{ right: 0; }


/* ===== Overview (scoped) ===== */
.event-overview{
    --ink:#000000;
    --rule:#000000; /* very light teal */
    background:#fff;
}
.event-overview .eo-title{
    font-weight: 900;
    letter-spacing: .01em;
    color: var(--ink);
    font-size: 30px;
    line-height: 1;
}
.event-overview .eo-copy{
    color: var(--ink);
    font-weight: 300;
    line-height: 1.7;
}
.event-overview .eo-copy p{ margin-bottom: 1.5rem; }

/* bottom hairline (full width of container) */
.event-overview .eo-rule{
    position:absolute; left:0; right:0; bottom: .25rem;
    height:2px;
    background: linear-gradient(to right, rgba(0,0,0,0) 0%, var(--rule) 8%, var(--rule) 92%, rgba(0,0,0,0) 100%);
    display:block;
}

/* extra breathing room on large screens */
@media (min-width: 1200px){
    .event-overview { padding-top: 4.5rem; padding-bottom: 4.5rem; }
}


.event-agenda{
    --ink:#000000;
    --muted:#444;
    --rule:#000000;
    --teal:#00A29B;
}

.event-agenda .ea-heading{
    font-weight: 900;
    letter-spacing: .01em;
    color: var(--ink);
    font-size: 30px;
    line-height: 1;
}

.event-agenda .ea-day{
    color: var(--teal);
    font-weight: 700;
    font-size: 13px;
}

.event-agenda .ea-item{ margin-bottom: 1.75rem; }

.event-agenda .ea-title{
    margin: 0 0 .75rem 0;
    color: var(--ink);
    font-weight: 400;
    line-height: 1.35;
    font-size: 16px;
}

.event-agenda .ea-speaker{
    color: var(--muted);
    font-weight: 300;
    line-height: 1.6;
    margin-bottom: 1rem;
}

.event-agenda .ea-rule{
    margin: 1.25rem 0 0 0;
    border: 0;
    border-top: 2px solid var(--rule);
}

/* Download link with underline */
.event-agenda .ea-download{
    position: relative; color: var(--teal); text-decoration: none; font-weight: 800;
}
.event-agenda .ea-download .ea-underline{
    position:absolute; left:0; right:68%; bottom:-4px; height:3px;
    background: #92c9bd; border-radius: 2px; transition: right .25s ease;
}
.event-agenda .ea-download:hover .ea-underline{ right:0; }


.event-speakers{
    --bg:#d9ecee;       /* pale teal background from your designs */
    --ink:#0f1a1a;      /* text */
    --muted:#4a5857;
    --ring:#d88624;     /* small orange ring around avatar */
}
.event-speakers{ background: var(--bg); }

.event-speakers .es-title{
    font-weight: 900;
    letter-spacing: .01em;
    color: var(--ink);
    font-size: 30px;
    line-height: 1;
}

.event-speakers .es-item{ min-height: 80px; }
.event-speakers .es-avatar{
    width: 72px; height: 72px; border-radius: 50%;
    display: inline-grid; place-items: center;
    border: 3px solid var(--ring);
    background: #fff; overflow: hidden;
    box-shadow: 0 1px 0 rgba(0,0,0,.04);
}
.event-speakers .es-avatar img{
    width: 100%; height: 100%; object-fit: cover; display: block;
}

.event-speakers .es-meta{ line-height: 1.25; }
.event-speakers .es-name{
    font-weight: 400;
    color: var(--ink);
    font-size: 14px;
}
.event-speakers .es-role{
    font-weight: 300; color: var(--ink); font-size: 12px;
    margin-top: 5px;
}
.event-speakers .es-org{
    font-weight: 300; color: var(--ink); font-size: 12px;  margin-top: 5px;
}

/* tighter spacing on very wide screens to get the dense grid from the mock */
@media (min-width: 1400px){
    .event-speakers .row.g-4{ --bs-gutter-x: 2.25rem; }
}


.event-resources{
    --er-bg:#00A29B;   /* teal background */
    --er-ink:#ffffff;
    --er-accent:#ffffff;
    background:var(--er-bg);
    color:var(--er-ink);
}

.event-resources .er-title{
    font-weight: 900;
    letter-spacing: .01em;
    color: var(--er-ink);
    font-size: 30px;
    line-height: 1;
}

.event-resources .er-link{
    position:relative;
    color:var(--er-ink);
    text-decoration:none;
    font-weight:800;
    font-size:1rem;
    display:inline-block;
    padding-bottom:4px;
    margin-bottom: 15px;
}
.event-resources .er-underline{
    position:absolute;
    left:0;
    right:70%;
    bottom:0;
    height:2px;
    background:var(--er-accent);
    transition:right .25s ease;
}
.event-resources .er-link:hover .er-underline{
    right:0;
}