/*specific pages container*/
.home-custom-css{}
.community-custom-css{}
.agenda-custom-css{}
.speakers-custom-css{}

/*main container of each section*/
.main-app-container {}

/*
call-to-action buttons e.g:
Register, Join The Community etc
*/
.btn-register {}

/*Top navigation bar container*/
.template-nav {}

/*Top navigation bar items container*/
#bs-example-navbar-collapse-1 {}

/*social share buttons container*/
.social-share-button {}

/*social share buttons per social network*/
.social-share-button.facebook {}
.social-share-button.twitter {}
.social-share-button.linkedin {}
.social-share-button.google {}

/* ============================================================
   CUSTOM CSS - RF Events Template by AHOY STUDIOS
   ============================================================ */

/* NAV BAR STYLES */
ul.nav.navbar-nav,
.nav-menu-btn {
    font-family: Graphik, Inter, sans-serif !important;
}

ul.nav.navbar-nav {

    margin-bottom: 30px;
}

@media (min-width: 1025px) {

ul.nav.navbar-nav {
        margin-bottom: 0
}
    }

ul.nav.navbar-nav >li.logo-li-holder {
        height: 125%;
        width: 300px;
        max-height: initial;
    }

ul.nav.navbar-nav >li.logo-li-holder >.image-container-item {
            height: 100%;
            width: 100%;
        }

ul.nav.navbar-nav >li.logo-li-holder >.image-container-item >img {
                width: 100%;
                height: 100%;
                -o-object-fit: contain;
                   object-fit: contain;
            }

.nav.navbar-nav.navbar-right {
    display: none;
}

@media (min-width: 1025px) {
    ul.nav.navbar-nav {
        width: 100%;
        display: flex;
        align-items: center;
        height: 80px;
        transform: translateY(0px)
    }

        ul.nav.navbar-nav > :nth-child(2) {
            margin-left: auto;
        }

        ul.nav.navbar-nav >li>.nav-button-wrapper {
            padding-top: 0;
            padding-bottom: 0;
            display: flex;
            align-items: center;
        }

        ul.nav.navbar-nav >li>a.nav-button-wrapper>.selected {
            border: 0;
            font-weight: 900;
        }
}

.trade-template .nav-menu-btn {
  text-transform: none !important;
}

/* Text Image Split Sections */
.ahoy-image-text .main-app-container, .ahoy-text-image .main-app-container {
        padding: 0;
        max-width: none;
        display: flex;
    }
.ahoy-image-text .main-app-container >div:first-child, .ahoy-text-image .main-app-container >div:first-child {
            display: none;
        }
.ahoy-image-text .element-groups, .ahoy-text-image .element-groups {
        width: 100%;
    }

/* Image column */
.ahoy-image-text .element-groups>.col-sm-6:first-child,
.ahoy-text-image .element-groups>.col-sm-6:last-child {
    aspect-ratio: 1;
    height: 100vw;
    min-height: unset;
    padding: 0;
}

/* Text column */
.ahoy-image-text .element-groups>.col-sm-6:last-child,
.ahoy-text-image .element-groups>.col-sm-6:first-child {
    padding: 25px;
}

.ahoy-text-image .element-groups {
    min-height: 0 !important;
    flex-direction: column-reverse;
    display: flex;
}

@media (min-width: 768px) {

    .ahoy-text-image .element-groups {
        display: block;
    }

    /* Image column */
    .ahoy-image-text .element-groups>.col-sm-6:first-child,
    .ahoy-text-image .element-groups>.col-sm-6:last-child {
        overflow: visible;
        height: 0;
        min-height: 100%;
    }

    /* Image */
    .ahoy-image-text .element-groups>.col-sm-6:first-child img,
    .ahoy-text-image .element-groups>.col-sm-6:last-child img {
        position: absolute;
        margin: 0;
        height: 100%;
        width: 100%;
        -o-object-fit: cover;
           object-fit: cover;
        -o-object-position: center 15%;
           object-position: center 15%;
    }
        .ahoy-map .row {
            padding: 60px 25px;
        }
}

@media (min-width: 1200px) {

    /* Text column */
    .ahoy-image-text .element-groups>.col-sm-6:last-child,
    .ahoy-text-image .element-groups>.col-sm-6:first-child {
        padding: 60px 96px;
    }
}

@media (min-width: 1440px) {

    /* Text column */
    .ahoy-image-text .element-groups>.col-sm-6:last-child,
    .ahoy-text-image .element-groups>.col-sm-6:first-child {
        padding: 120px;
    }
}

@media (min-width: 1920px) {

    /* Text column */
    .ahoy-image-text .element-groups>.col-sm-6:last-child,
    .ahoy-text-image .element-groups>.col-sm-6:first-child {
        padding: 144px;
    }
}

/* Speaker Name Styling */
.speaker-name,
.element-36579232 .atom-fullname {
  text-transform: uppercase;
  font-family: GraphikBlack, Graphik, Inter, sans-serif;
  letter-spacing: 0.03em;
  margin-bottom: 10px;
  margin-top: 20px;
  font-size: 15pt;
   color: #345f5d !important;


  border-bottom: 1px solid #345f5d;
  padding-bottom: 10px;
}

/* Speaker title + company */
.speaker-title,
.speaker-company,
.element-36579232 .atom-text1,
.element-36579232 .atom-text2 {
  font-size: 15pt;
  font-family: GraphikRegular, Graphik, Inter, sans-serif;
  font-weight: 400 !important;
}

h2.atom-main.headercustom-font {
  padding-bottom: 30px;
}

/* Map */
.map-address h2 {
  margin-top: 60px !important;
  margin-bottom: 20px !important;
}

.map-address .business-event-description {
  text-align: left !important;
}

.map-address .atom-text {
  display: block;
  text-align: left !important;
  margin-bottom: 30px !important;
}

.map-address::before,
.map-address::after {
  background: #345f5d !important;
  border-color: #345f5d !important;
  box-shadow: none !important;
}

.atom-sectionMain.rowHolder.custom-space-top.custom-space-bottom {
  background-color: #345f5d !important;
}

/* Logo Section */

.ahoy-logo-section .main-app-container {
        padding: 0;
        max-width: none;
        display: flex;
    }

.ahoy-logo-section .main-app-container > :first-child {
            display: none;
        }

.ahoy-logo-section .main-app-container .element-groups {
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
        }
.ahoy-logo-section img.bz-image {
  width: auto !important;
  max-width: 160px !important;
  height: auto !important;
  object-fit: contain;
  display: block;
  margin: 0 auto;
}

.ahoy-logo-section .col-sm-4:first-child img.bz-image {
  max-width: 220px !important;
  width: 100% !important;
  height: auto !important;
}

@media (min-width: 768px) {

.ahoy-logo-section .main-app-container .element-groups {
                flex-direction: row
        }
            }

.ahoy-logo-section .main-app-container div.col-sm-4 {
            height: 200px;
            width: 300px;
            padding: 30px;
        }

.ahoy-logo-section .main-app-container div.col-sm-4:first-child {
                display: flex;
                justify-content: center;
            }

.ahoy-logo-section .main-app-container div.col-sm-4:first-child > :first-child {
                    display: none;
                }

@media (min-width: 768px) {
                .ahoy-logo-section .main-app-container div.col-sm-4:nth-child(2) {
                    margin-left: auto;
                }
            }
/* Sponsors */
.partner-label-container {
  display: none !important;
}

/* normalize the whole sponsors section */
.sponsors .main-app-container {
  padding-left: 15px !important;
  padding-right: 15px !important;
}

.sponsors .rowHolder {
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* Line Style */
hr {
  width: 100% !important;
  height: 1px !important;
  border: none !important;
  background-color: #345f5d !important;
  margin: 22px 0 !important;
}

/* ___________________
	Paragraph Styles
   ___________________ */

/* HERO */
h1.main-header {
  line-height: 0.92 !important;
}

/* ============================================================
   HERO / EVENT HEADER — CSS-drawn, URL-free
   (mint triangle left · dark-teal base · field photo in right circle)

   Targets the "business" cover section in new.html: the client uploads
   ONLY the circle photo, which Bizzabo sets as an inline
   `background-image: url(...)` on `.cover-photo-background` (no overlay).

   The image is available ONLY as that background — its URL is never known
   to this file. We reveal a circular slice of it by laying a solid teal
   panel (::before) OVER the section and punching a transparent hole where
   the circle goes; ::after draws the mint triangle. So no URL is needed.
   ============================================================ */

.section-header .cover-photo-background {
  /* Palette (variants below just re-set these):
     --hero-bg    = the panel/background (::before)
     --hero-shape = triangle + the no-image circle (they always match)
     --hero-fg    = copy   --hero-btn-bg/fg = button */
  --hero-bg: #345f5d;
  --hero-shape: #7ececa;
  --hero-fg: #ffffff;
  --hero-btn-bg: #ffffff;
  --hero-btn-fg: #345f5d;
  position: relative !important;
  padding: 0 !important;             /* drop the template's custom-space-top/bottom */
  min-height: 460px !important;
  /* Base (phone/tablet): stacked composition — photo CIRCLE + mint triangle
     up top, copy below. Oversize the bg height so we can frame the field
     inside the circle (plain `cover` would lock onto the sky). Desktop
     overrides this back to `cover`. */
  /* Show the whole photo (sky->field) filling the arc's height, centred
     horizontally on the visible arc. Sized in vw (not `cover`, which locks to
     the tall section and only shows the sky at the top-anchored circle). */
  background-size: auto 104vw !important;
  background-position: -30vw 0 !important;
  background-repeat: no-repeat !important;
  background-color: var(--hero-shape) !important;  /* shows through the circle when no image */
  isolation: isolate;                         /* keep pseudo z-indexes local */
  overflow: hidden !important;
}

/* Teal panel painted OVER the photo, with the reveal hole masked out.
   Base (phone/tablet): a photo CIRCLE up top-right. */
.section-header .cover-photo-background::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  background: var(--hero-bg) !important;
  pointer-events: none !important;
  /* Cut like desktop but off the TOP-right corner: a big circle bleeding off
     the top + right edges, showing a tall left arc; copy sits below. */
  -webkit-mask: radial-gradient(circle 82vw at 96% 3%, #0000 0 calc(100% - 1px), #000 100%);
          mask: radial-gradient(circle 82vw at 96% 3%, #0000 0 calc(100% - 1px), #000 100%);
}

/* Mint downward wedge. Base (phone/tablet): a small accent in the top-left
   corner alongside the circle. Desktop reshapes + resizes it below. */
.section-header .cover-photo-background::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 2 !important;
  background: var(--hero-shape) !important;
  clip-path: polygon(0 0, 40% 0, 18% 30%, 0 25%);
  pointer-events: none !important;
  display: none !important;   /* hidden on mobile (client); shown on desktop below */
}

/* --- Content: left-aligned, above the decoration.
   Non-compounding: text-align + float/width resets only (no nested
   max-width, which would multiply down the grid and crush the text). --- */
.section-header .cover-photo-background .main-app-container {
  position: relative !important;
  z-index: 3 !important;
  max-width: none !important;
  margin: 0 !important;
  text-align: left !important;
  padding: 360px 30px 48px !important;   /* sit below the circle/triangle art (base) */
  background: transparent !important;    /* kill the template's mint panel bg */
  background-color: transparent !important;
}

.section-header .cover-photo-background .main-app-container .row,
.section-header .cover-photo-background .main-app-container [class*="col-"],
.section-header .cover-photo-background .main-app-container .business-event-name-holder,
.section-header .cover-photo-background .main-app-container .business-venue-holder,
.section-header .cover-photo-background .main-app-container .business-button-holder {
  float: none !important;
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  left: 0 !important;
  text-align: left !important;
}

/* the cover's own logo image isn't part of this layout (nav already has one) */
.section-header .cover-photo-background .business-logo-holder {
  display: none !important;
}

/* Compact the template's stacked spacing so the copy is one tight block:
   zero every inherited margin, then re-introduce controlled gaps. */
.section-header .cover-photo-background .main-app-container * {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  line-height: 1 !important;
}
.section-header .cover-photo-background .business-event-name-holder {
  margin-bottom: 30px !important;   /* title -> subheaders gap (== sub -> button) */
}
.section-header .cover-photo-background .business-venue-holder .col-xs-12 {
  margin-bottom: 6px !important;
}
.section-header .cover-photo-background .business-button-holder {
  margin-top: 30px !important;   /* subheaders -> button gap (== title -> sub) */
}

/* Drop the calendar icon next to the date. */
.section-header .cover-photo-background .icon-event,
.section-header .cover-photo-background .fa.icon-event {
  display: none !important;
}

/* Keep the two placeholder headers from rendering oversized/tall. */
.section-header .cover-photo-background .business-venue-holder .extra-text-holder {
  display: inline-block !important;
  padding: 0 !important;
  line-height: 1 !important;
}

/* Subheaders (date + Optional Header 1/2): use the lighter body-copy font
   (GraphikRegular, weight 400), slightly bigger than the template default. */
.section-header .cover-photo-background .date-venue-holder,
.section-header .cover-photo-background .extra-text-holder {
  font-family: GraphikRegular, Graphik, Inter, sans-serif !important;
  font-weight: 400 !important;
  font-size: 24px !important;
}

/* White button, dark-teal label. The label lives in a <span>, which the
   base `* { color:#fff }` rule would otherwise paint white-on-white — so
   force the button AND its children dark teal with higher specificity. */
.section-header .cover-photo-background .register-btn-holder .btn-register {
  background: var(--hero-btn-bg) !important;
  background-color: var(--hero-btn-bg) !important;
  background-image: none !important;
  color: var(--hero-btn-fg) !important;
  margin-left: 0 !important;
  border: none !important;            /* kill the Bootstrap .btn/.btn-success outline */
  box-shadow: none !important;
  outline: none !important;
  font-family: GraphikBlack, Graphik, Inter, sans-serif !important;
  /* Extra top padding to visually centre the label (the font sits high in
     its line box); equal, tighter left/right for a balanced button. */
  padding: 16px 22px 11px 22px !important;
  font-size: 24px !important;
}
.section-header .cover-photo-background .register-btn-holder .btn-register * {
  color: var(--hero-btn-fg) !important;
  background: transparent !important;
  font-family: GraphikBlack, Graphik, Inter, sans-serif !important;
}

.section-header .cover-photo-background .register-btn-holder {
  margin-top: 0 !important;   /* gap handled by .business-button-holder above */
  text-align: left !important;
}

/* Social share icons: hidden by default (show with `rf-variant-socials`). */
.section-header .cover-photo-background .social-share-buttons-holder {
  display: none !important;
}

/* Copy colour (variants re-set --hero-fg). */
.section-header .cover-photo-background .main-app-container,
.section-header .cover-photo-background .main-app-container * {
  color: var(--hero-fg) !important;
}

.section-header .cover-photo-background h1 {
  font-size: 52px !important;
  line-height: 1 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow-wrap: normal !important;   /* never break mid-word */
  word-break: normal !important;
  hyphens: none !important;
}

/* ---- Desktop (>=1200): mint triangle + circular photo crop ---- */
@media (min-width: 1200px) {
  .section-header .cover-photo-background {
    aspect-ratio: 2333 / 729;
    min-height: 630px !important;
    /* Fit the photo to the CIRCLE, centred in the *visible* dome. The mask
       circle sits at (82%, 109%) with radius 30.4vw, so its true centre is
       below the module's bottom edge — only the top dome is visible. We size
       the image down to ~circle width (62vw, so it isn't a giant image cropped
       tiny — that read as zoomed-in and pixelated) and centre it on the dome:
         x-centre = 82%  ->  x-left = 82 - 62/2 = 51vw
         dome-centre-y = (109%*630 + 630)/2 = 658.5px - 15.2vw   (15.2vw = r/2)
         y-top = dome-centre-y - (62/1.579)/2 = 658.5px - 34.83vw
       Everything is vw-scaled to track the vw circle, so the framing holds at
       every desktop width. NB: 62vw is the minimum that still covers the dome;
       shrink it and teal gaps appear. Update the 630-derived px (658.5) if the
       min-height changes; lower the 34.83vw subtrahend to bias the crop up. */
    background-size: 62vw auto !important;
    background-position: 51vw calc(658.5px - 34.83vw) !important;
    width: 100vw !important;
    max-width: 100vw !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
  }

  /* Reveal a CIRCLE on the right. Radius is in vw (a single length =>
     always perfectly round, regardless of whether aspect-ratio or
     min-height wins the section's height). A 1px edge keeps it crisp
     (the old 1%-of-radius feather is what looked blurry). */
  .section-header .cover-photo-background::before {
    /* Big circle matching V1b: centre below-right at (82%, 109%) — off the
       bottom edge — radius 30.4vw. We see the upper-left arc; the circle is
       cut by the hero's bottom and right edges, exactly like the composite. */
    -webkit-mask: radial-gradient(circle 30.4vw at 82% 109%, #0000 0 calc(100% - 1px), #000 100%);
            mask: radial-gradient(circle 30.4vw at 82% 109%, #0000 0 calc(100% - 1px), #000 100%);
  }

  /* Desktop wedge: base along the top (0->50%), apex at ~28% bottom; left
     edge vertical to ~64% so the left copy has solid mint behind it. */
  .section-header .cover-photo-background::after {
    display: block !important;
    clip-path: polygon(0 0, 50% 0, 28% 100%, 0 64%) !important;
  }

  /* Pin the copy to the SITE CONTENT COLUMN (1090px, centered) so it lines up
     with the nav + the sections below — not the full-bleed viewport edge.
     Vertically centered; width tracks the shrinking gap between the column's
     left edge and the mint wedge's right diagonal so text stays on the mint.
     Absolute positioning keeps it out of flow so it can't stretch the band. */
  /* Align the copy to the CONTENT MODULE column (1090px, centered) — same
     inset as the sections below — not the nav logo. Top-aligned, 60px down. */
  .section-header .cover-photo-background .main-app-container {
    position: absolute !important;
    top: 0 !important;
    bottom: 0 !important;
    left: calc((100vw - 1090px) / 2 + 30px) !important;  /* +30px = module text inset */
    /* Stable measure that fits the 65px title cleanly and stays clear of the
       circle up to ~4K. NOT the old vw-shrinking width, which collapsed below
       a word's width on wide screens and broke the title mid-word. White text
       reads fine where it runs onto the teal. */
    width: 655px !important;
    max-width: calc(100vw - 220px) !important;
    box-sizing: border-box !important;
    padding: 60px 24px 0 0 !important;      /* top-aligned, 60px from the top */
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
    align-items: flex-start !important;
  }

  .section-header .cover-photo-background .main-app-container,
  .section-header .cover-photo-background .main-app-container * {
    color: var(--hero-fg) !important;
  }

  .section-header .cover-photo-background h1 {
    font-size: 60px !important;
  }
}

/* ============================================================
   HERO VARIANTS
   Add ONE of these class names to the cover section wrapper — the
   <div> that carries the section id (e.g. `section-8234738 section-header …`).
   Selectors use `.section-header.<variant>` so they outrank the defaults.
   ============================================================ */

/* Variant A — `rf-variant-beige`: mint background, BEIGE shapes, dark-green
   fonts, inverted button. Photo kept. (Just re-sets the palette variables, so
   the triangle AND the no-image circle both become beige automatically.) */
.section-header.rf-variant-beige .cover-photo-background {
  --hero-bg: #7ececa;        /* background -> mint */
  --hero-shape: #eeeeee;     /* triangle + circle -> beige */
  --hero-fg: #345f5d;        /* fonts -> dark green */
  --hero-btn-bg: #345f5d;    /* button inverted */
  --hero-btn-fg: #ffffff;
}

/* Variant B — `rf-variant-noimage`: no photo; the circle shows the shape
   colour (mint by default, or beige when combined with rf-variant-beige,
   since it inherits --hero-shape via the section's background-color).
   `!important none` also strips any leftover inline cover-image URL. */
.section-header.rf-variant-noimage .cover-photo-background {
  background-image: none !important;
}

/* Variant C — `rf-variant-centered`: centre the copy (text + block). */
.section-header.rf-variant-centered .cover-photo-background .main-app-container {
  text-align: center !important;
  align-items: center !important;
}
.section-header.rf-variant-centered .cover-photo-background .main-app-container .row,
.section-header.rf-variant-centered .cover-photo-background .main-app-container [class*="col-"],
.section-header.rf-variant-centered .cover-photo-background .register-btn-holder {
  text-align: center !important;
}

/* Variant D — `rf-variant-socials`: show the share icons (hidden by default)
   and tidy them — palette colours (solid --hero-fg circle, --hero-bg glyph),
   even spacing, breathing room below the button. Icons are JS-injected SVGs:
   button.js-social-share-link-new > span.social-share-button > svg(circle+path). */
/* Make room for the extra row (desktop copy is absolute to the cover height,
   so socials would otherwise overflow the 470px cover and get clipped). */
.section-header.rf-variant-socials .cover-photo-background {
  min-height: 600px !important;
}
.section-header.rf-variant-socials .cover-photo-background .social-share-buttons-holder {
  display: block !important;
  margin-top: 26px !important;
  text-align: left !important;
}
.section-header.rf-variant-socials .cover-photo-background .social-share-buttons-holder .js-social-share-link-new,
.section-header.rf-variant-socials .cover-photo-background .social-share-buttons-holder .link-button {
  width: 40px !important;
  height: 40px !important;
  padding: 0 !important;
  margin: 0 12px 0 0 !important;
  border: none !important;
  background: none !important;
  box-shadow: none !important;
  display: inline-flex !important;
  vertical-align: middle !important;
  transition: opacity .15s ease !important;
}
.section-header.rf-variant-socials .cover-photo-background .social-share-buttons-holder .js-social-share-link-new:hover {
  opacity: .82 !important;
}
.section-header.rf-variant-socials .cover-photo-background .social-share-button {
  display: inline-block !important;
  width: 40px !important;
  height: 40px !important;
}
/* recolour the injected SVG: solid shape in the fg colour, glyph in the bg.
   (Facebook/LinkedIn use <circle>, X uses <rect> — cover both.) */
.section-header.rf-variant-socials .cover-photo-background .social-share-button svg circle,
.section-header.rf-variant-socials .cover-photo-background .social-share-button svg rect {
  fill: var(--hero-fg) !important;
  fill-opacity: 1 !important;
  stroke: none !important;
}
.section-header.rf-variant-socials .cover-photo-background .social-share-button svg path {
  fill: var(--hero-bg) !important;
}

/* All other H1s */
h1:not(.main-header),
h2 {
  font-family: GraphikBlack, Graphik, sans-serif !important;
  font-size: 45px !important;
  line-height: 0.9 !important;
  color: rgb(52, 95, 93) !important;
  text-align: left !important;
  text-transform: capitalize !important;
}



/* H3 (large intro text) */
h3 {
  font-family: GraphikRegular, Graphik, sans-serif !important;
  font-size: 45px !important;
  line-height: 1.2 !important;
  color: #212121 !important;
  font-style: normal !important;
  font-weight: 400 !important;
}

/* H4 Subheadlines or Large Body Copy */
h4 {
  font-family: GraphikRegular, Graphik, sans-serif !important;
  font-size: 30px !important;
  line-height: 1.25 !important;
  color: #212121 !important;
  text-align: left !important;
  margin-bottom: 30px !important;
}

/* Body Copy */
p {
  font-family: GraphikRegular, Graphik, sans-serif !important;
  font-size: 24px !important;
  line-height: 1.3 !important;
  color: #212121 !important;
  text-align: left !important;
}

h4:has(+ p) {
  margin-bottom: 14px !important;
}

/* White Copy */
.text-white,
.text-white * {
  color: #ffffff !important;
}

.text-white .btn,
.text-white .btn *,
.text-white .js-register-btn-holder,
.text-white .js-register-btn-holder * {
  color: #345f5d !important;
}

/* Responsive Text Tablet */
@media (max-width: 1024px) {
  h1:not(.main-header),
  h2 {
    font-size: 40px !important;
  }

  h3 {
    font-size: 40px !important;
  }

  h4 {
    font-size: 26px !important;
  }

  p {
    font-size: 20px !important;
  }
}

/* Responsive Text Phone */

@media (max-width: 767px) {

  h1.main-header {
    font-size: 52px !important;
    line-height: 0.95 !important;
  }

  .responsive-text-headline span {
    font-size: 40px !important;
    line-height: 1 !important;
  }
  
  h3 {
    font-size: 32px !important;
    line-height: 1.2 !important;
  }

  h4 {
    font-size: 28px !important;
    line-height: 1.3 !important;
  }

  p {
    font-size: 22px !important;
    line-height: 1.5 !important;
  }
}

@media (max-width: 767px) {
  h2.responsive-text-headline {
    font-size: 40px !important;
    line-height: 1 !important;
  }
}

/* --- SPEAKER CAROUSEL FIX (AGENDA ONLY) --- */

.session-container .speakers-carousel.slick-initialized {
  display: block !important;
}

.session-container .speakers-carousel .slick-list {
  overflow: visible !important;
}

.session-container .speakers-carousel .slick-track {
  display: block !important;
  transform: none !important;
  width: auto !important;
}

.session-container .speakers-carousel .slick-slide {
  display: block !important;
  width: 100% !important;
  float: none !important;
}

/* Speaker row */
.session-container .speaker-slide {
  display: flex !important;
  align-items: center;
  gap: 10px;
  margin-bottom: 8px;
}

/* Agenda speaker typography only */
.session-container .speaker-name {
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #212121 !important;
}

.session-container .speaker-title,
.session-container .speaker-company {
  font-size: 12px !important;
  opacity: 0.7 !important;
}

.session-container .speakers-container {
  margin-top: 10px !important;
}

/* Divider lines */
.session-container .speakers-carousel .slick-slide:not(:last-child) {
  border-bottom: 1px solid #345f5d !important;
  padding-bottom: 10px !important;
  margin-bottom: 10px !important;
}