/* ------------------------------------------------------------
   BaseTheme (Bootstrap-first) main.css
------------------------------------------------------------ */
.site-header--home {
    opacity: 0;
    animation: fadeIn 1s ease 6s forwards;
}
@keyframes fadeIn {
    to { opacity: 1; }
}

.plain_text h3 {
	margin-top: 50px;
}

body.offcanvas-animating .offcanvas-backdrop { pointer-events: none; }
.notfound  {padding: 200px 0}


a.whitebutton  {
    background: #fff;
    color: #000;
    border: none;
    padding: 16px 28px;
    font-size: 16px;
    font-weight: 700;
    cursor: pointer;
    border-radius: 0;
    white-space: nowrap;
    transition: background 0.2s ease, color 0.2s ease;
    flex-shrink: 0;
	margin-top:50px;
	text-decoration:none;
	display:inline-block;
}



a.whitebutton2 {
    background: #fff;
    color: #000;
    border: none;
    padding: clamp(12px, 1.5vw, 16px) clamp(20px, 3vw, 40px);
    font-size: clamp(14px, 1.2vw, 16px);
    font-weight: 700;
    cursor: pointer;
    border-radius: 0;
    white-space: nowrap;
    transition: background 0.2s ease, color 0.2s ease, transform 0.2s ease;
    flex-shrink: 0;
    text-decoration: none;
    display: inline-block;
    width: 180px;
    text-align: center;
    animation: ticketsGlow 20s ease-in-out infinite;
}

.whitebutton2:hover {
transform: scale(1.01);
}

@keyframes ticketsGlow {
    0% {
        box-shadow:
            0 0 6px 2px rgba(0, 43, 255, 0.18),
            0 0 10px 3px rgba(255, 0, 179, 0.06);
    }

    10% {
        box-shadow:
            4px -4px 18px 7px rgba(0, 43, 255, 0.48),
            -3px 3px 16px 6px rgba(255, 157, 0, 0.28),
            0 0 12px 3px rgba(255, 0, 179, 0.13);
    }

    20% {
        box-shadow:
            6px -5px 24px 9px rgba(0, 43, 255, 0.56),
            -5px 4px 22px 8px rgba(255, 157, 0, 0.36),
            2px 2px 16px 5px rgba(255, 0, 179, 0.18);
    }

    30% {
        box-shadow:
            6px 1px 24px 9px rgba(255, 157, 0, 0.40),
            -5px -4px 20px 7px rgba(0, 43, 255, 0.38),
            3px 5px 18px 6px rgba(13, 155, 72, 0.30);
    }

    40% {
        box-shadow:
            5px 6px 26px 10px rgba(13, 155, 72, 0.48),
            -6px -3px 22px 8px rgba(255, 157, 0, 0.29),
            4px -5px 18px 6px rgba(255, 0, 179, 0.23);
    }

    50% {
        box-shadow:
            1px 7px 28px 11px rgba(13, 155, 72, 0.54),
            -5px -5px 24px 9px rgba(255, 0, 179, 0.32),
            6px -2px 18px 6px rgba(0, 43, 255, 0.30);
    }

    60% {
        box-shadow:
            -5px 5px 26px 10px rgba(13, 155, 72, 0.34),
            5px -5px 22px 8px rgba(255, 0, 179, 0.34),
            0 0 18px 6px rgba(255, 157, 0, 0.26),
            -2px -2px 18px 5px rgba(0, 43, 255, 0.18);
    }

    70% {
        box-shadow:
            -7px 2px 26px 10px rgba(0, 43, 255, 0.32),
            5px 5px 22px 8px rgba(255, 157, 0, 0.35),
            -3px -5px 18px 6px rgba(255, 0, 179, 0.27),
            2px -2px 16px 5px rgba(13, 155, 72, 0.20);
    }

    80% {
        box-shadow:
            -5px -5px 24px 9px rgba(0, 43, 255, 0.46),
            5px 4px 22px 8px rgba(255, 157, 0, 0.28),
            -6px 2px 18px 6px rgba(13, 155, 72, 0.28),
            2px -3px 14px 4px rgba(255, 0, 179, 0.17);
    }

    90% {
        box-shadow:
            -2px -3px 18px 6px rgba(0, 43, 255, 0.34),
            3px 3px 16px 5px rgba(13, 155, 72, 0.16),
            0 0 12px 4px rgba(255, 157, 0, 0.17),
            2px -2px 12px 3px rgba(255, 0, 179, 0.12);
    }

    100% {
        box-shadow:
            0 0 6px 2px rgba(0, 43, 255, 0.18),
            0 0 10px 3px rgba(255, 0, 179, 0.06);
    }
}






a.button2 {
    background: #000;
    color: #fff;
    border: 1px solid white;
    padding: clamp(12px, 1.5vw, 16px) clamp(20px, 3vw, 40px);
    font-size: clamp(14px, 1.2vw, 16px);
    font-weight: 700;
    cursor: pointer;
    border-radius: 0;
    white-space: nowrap;
    flex-shrink: 0;
    text-decoration: none;
    display: inline-block;
	width:180px;
	text-align: center;
	transition: all 0.3s ease;
}

a.button2:hover {
background: #fff;
	color: #000;
}




#primaryNav {
    height: auto !important;
    min-height: 0 !important;
}

#primaryNav.offcanvas-top {
    height: fit-content !important;
    min-height: 0 !important;
    max-height: none !important;
}
#primaryNav .containertarget,
#primaryNav .offcanvasnavigation > .row > div {
    opacity: 0;
}


#primaryNav .offcanvas-body {
    flex-grow: 0;
    padding-bottom: 40px;
}





.corner-clip-topleft {
    clip-path: polygon(40px 0%, 100% 0%, 100% 100%, 0% 100%, 0% 40px);
}

.corner-clip-topright {
    clip-path: polygon(0% 0%, calc(100% - 40px) 0%, 100% 40px, 100% 100%, 0% 100%);
}

.corner-clip-bottomleft {
    clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 40px 100%, 0% calc(100% - 40px));
}

.corner-clip-bottomright {
    clip-path: polygon(0% 0%, 100% 0%, 100% calc(100% - 40px), calc(100% - 40px) 100%, 0% 100%);
}

.corner-clip-topleft-bottomright {
    clip-path: polygon(
        40px 0%,
        100% 0%,
        100% calc(100% - 40px),
        calc(100% - 40px) 100%,
        0% 100%,
        0% 40px
    );
}

.corner-clip-topright-bottomleft {
    clip-path: polygon(
        0% 0%,
        calc(100% - 40px) 0%,
        100% 40px,
        100% 100%,
        40px 100%,
        0% calc(100% - 40px)
    );
}


/* ============================================================
   Featured menu item
============================================================ */

#menu-item-341 > a {
    position: relative;
    display: inline-block;
    text-decoration: none;
    animation: registerTextPulse 6s ease-in-out infinite;
}

#menu-item-341 > a::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -4px;
    width: 100%;
    height: 2px;
    background: rgba(0, 0, 0, 0.75);
    transform: scaleX(0);
    transform-origin: left;
    opacity: 0;
    animation: registerMenuUnderline 6s ease-in-out infinite;
}

@keyframes registerTextPulse {
    0%, 62%, 100% {
        text-shadow: none;
    }

    72% {
        text-shadow:
            0.3px 0 0 currentColor,
            -0.3px 0 0 currentColor;
    }

    80% {
        text-shadow:
            0.55px 0 0 currentColor,
            -0.55px 0 0 currentColor;
    }

    88% {
        text-shadow:
            0.3px 0 0 currentColor,
            -0.3px 0 0 currentColor;
    }
}

@keyframes registerMenuUnderline {
    0%, 66% {
        transform: scaleX(0);
        transform-origin: left;
        opacity: 0;
    }

    74% {
        transform: scaleX(1);
        transform-origin: left;
        opacity: 0.8;
    }

    86% {
        transform: scaleX(1);
        transform-origin: left;
        opacity: 0.8;
    }

    86.01% {
        transform: scaleX(1);
        transform-origin: right;
        opacity: 0.8;
    }

    94% {
        transform: scaleX(0);
        transform-origin: right;
        opacity: 0;
    }

    100% {
        transform: scaleX(0);
        transform-origin: right;
        opacity: 0;
    }
}



/* ============================================================
   1) TOKENS (Design System)
============================================================ */

:root {
  /* Palette */
  --white: #ffffff;
  --black: #000000;
}

.bg_black {background-color:black;}
.bg_white {background-color:white;}

.white {color:white;}
.black {color:black;}

/* ============================================================
   2) BASE 
============================================================ */

html, body { height: 100%; background-color:black;}

body {
  font-family: ;
  line-height: ;
  color: white;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

img, svg, video { max-width: 100%; height: auto; }
iframe { border: 0; }

*, *::before, *::after { box-sizing: border-box; }


/* ============================================================
   Screen reader text (WordPress standard)
============================================================ */

.screen-reader-text {
  position: absolute !important;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* Allow screen-reader-text to be visible when focused (keyboard users) */
.screen-reader-text:focus {
  position: static !important;
  width: auto;
  height: auto;
  margin: 0;
  padding: 0.75rem 1rem;
  overflow: visible;
  clip: auto;
  white-space: normal;
  background: #000;
  color: #fff;
  z-index: 100000;
}

.visually-hidden {
  composes: screen-reader-text;
}

/* ============================================================
   3) GLOBAL INTERACTIONS
============================================================ */

a,
button,
.btn,
input,
select,
textarea {
  
}

a {color:black; }
/* ============================================================
   4) ACCESSIBILITY
============================================================ */

/* Skip to content (place after wp_body_open()) */
.skip-link {
  position: absolute;
  top: 0;
  left: 0;
  padding: 0.75rem 1rem;
  background: #000;
  color: #fff;
  z-index: 10000;
  text-decoration: none;
  transform: translateY(-120%);

}
.skip-link:focus { transform: translateY(0); }

/* Visible focus for non-Bootstrap elements */
:focus-visible {
  outline: none;
  box-shadow: 0 0 0 3px rgba(13,110,253,.35);
}

.btn:focus-visible,
a:focus-visible {
  box-shadow: 0 0 0 3px rgba(13,110,253,.35);
}


/* ============================================================
   5) TYPOGRAPHY 
============================================================ */

h1, h2, h3, h4, h5, h6 {
  line-height: 1.15;
  margin-bottom: 0.6em;
}

/* Safe clamp scale  */
h1 { font-size: clamp(32px, 5vw, 64px); font-weight: 700; font-family: "neue-haas-grotesk-display", sans-serif;
}
h2 { font-size: clamp(24px, 3.5vw, 40px); font-weight: 700; font-family: "neue-haas-grotesk-display", sans-serif;
}
h3 { font-size: clamp(20px, 2.5vw, 24px); font-weight: 700; font-family: "neue-haas-grotesk-display", sans-serif;
}
h4 { font-size: clamp(18px, 2vw, 20px); font-weight: 700; font-family: "neue-haas-grotesk-display", sans-serif;
}
h5 { font-size: clamp(16px, 1.8vw, 18px); font-weight: 700; font-family: "neue-haas-grotesk-display", sans-serif;
}
h6 { font-size: clamp(14px, 1.5vw, 16px); font-weight: 700; font-family: "neue-haas-grotesk-display", sans-serif;
}

/* Classic WP content rhythm */
*:first-child { margin-top: 0; }
*:last-child  { margin-bottom: 0; }
p { margin-bottom: 20px; font-size: clamp(16px, 1.5vw, 18px); font-weight: 400; line-height: 125%; font-family: "neue-haas-grotesk-text", sans-serif;}
.infotext, .metatitle     { font-size: clamp(12px, 1.2vw, 14px); font-weight: 400; line-height: 125%; font-family: "neue-haas-grotesk-text", sans-serif;}
.newwslettertext { font-size: clamp(12px, 1.2vw, 14px); font-weight: 400; line-height: 125%; font-family: "neue-haas-grotesk-text", sans-serif;}
.footernav    { font-size: clamp(14px, 1.3vw, 16px); font-weight: 400; line-height: 125%; font-family: "neue-haas-grotesk-text", sans-serif;}
.copyright  { font-size: clamp(10px, 1vw, 12px); font-weight: 400; line-height: 125%; font-family: "neue-haas-grotesk-text", sans-serif; color:#888;}
.footermenu3 a {font-size: clamp(10px, 1vw, 12px); font-weight: 400; line-height: 125%; font-family: "neue-haas-grotesk-text", sans-serif; color:#888 !important; }
.footermenu3 {margin-top:-6px;}
#footerLogo {margin-left:-3px;}

.metatitle  p   { font-size: clamp(12px, 1.2vw, 14px); font-weight: 400; line-height: 125%; font-family: "neue-haas-grotesk-text", sans-serif;}
.modaltitle  p   { font-size: clamp(12px, 1.2vw, 14px); font-weight: 400; line-height: 125%; font-family: "neue-haas-grotesk-text", sans-serif;}

 ul,
 ol {
  padding-left: 1.25rem;
  margin-bottom: margin-bottom: 20px;
	 font-size: clamp(16px, 1.5vw, 18px); font-weight: 400; line-height: 125%; font-family: "neue-haas-grotesk-text", sans-serif;
}

 blockquote {

}

 a {  }
 a:hover {  }


/* ============================================================
   6) WYSIWYG CONTENT (use inside ACF modules)
   Wrap output in <div class="bt-wysiwyg">…</div>
============================================================ */


/* ============================================================
   7) WORDPRESS CORE ALIGNMENTS 
============================================================ */

.alignleft   { float: left;  margin: 0.25rem 1.5rem 1rem 0; }
.alignright  { float: right; margin: 0.25rem 0 1rem 1.5rem; }
.aligncenter { display: block; margin: 0 auto 1rem; }

/* Wide/full support  */
.alignwide {
  max-width: 1200px; /* adjust per project */
  margin-left: auto;
  margin-right: auto;
}

.alignfull {
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
}

.entry-content::after,
.bt-wysiwyg::after {
  content: "";
  display: table;
  clear: both;
}


/* ============================================================
   8) HEADER / NAV 
============================================================ */
.site-header {padding-top:10px;}
.navbar-brand img {
    max-height: 60px;
    width: auto;
    display: block;
}

@media (min-width: 768px) {
    .navbar-brand img {
        max-height: 60px;
    }
}

@media (min-width: 992px) {
    .navbar-brand img {
        max-height: 60px;
    }
}


.navbar .container {
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
}







/* ============================================================
  HEADER
============================================================ */

.offcanvas-body .dateplace {color:black !important;}

.dateplace {
    margin-left: auto;
    margin-right: 16px;
    color: #fff;
	text-transform:uppercase;
	
}
.lightfont {font-weight:200;}

.offcanvas-body .containertarget {
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
	padding-top:10px;
}

.offcanvasnavigation {padding-top:50px;}
.offcanvasnavigation h6 {margin-bottom:40px; }
.offcanvasnavigation ul li {list-style:none; padding:0px; margin:0px; margin-bottom:10px; }
.offcanvasnavigation ul {padding-left:0px; margin-left:0px; margin-bottom:30px;}
.offcanvasnavigation  ul li a { text-decoration:none;}
	
	
	.line-repeat {
    width: 100%;
    height: 20px; /* match the height of your PNG */
    background-image: url('https://mitfuturefest.org/wp-content/uploads/2026/04/arrowbar.svg');
    background-repeat: no-repeat;
    background-position: left center;
		margin-top:50px;
		margin-bottom:20px;
}
	


.offcanvasdate {padding-bottom:20px}
.offcanvassocials {padding-bottom:20px}
.offcanvassocials a {color:black; text-decoration:none; margin-right:20px;}


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

.footerwrapper {border-top:1px solid white; padding-top:100px;}
footer { padding-bottom:20px; }


.footerlogo img {
    max-height: 60px;
    width: auto;

	 margin-bottom:40px
}

@media (min-width: 768px) {
.footerlogo img  {
        max-height: 60px;
    }
}

@media (min-width: 992px) {
.footerlogo img  {
        max-height: 60px;
    }
}




.footerlogo2 img {height:36px; width:auto; margin-top:40px;}

.footermenu3 a {margin-right:20px; color:white; text-decoration:none;}
.footerhr {}
.footerhrwrapper {padding:20px 0;}
footer  h6 {margin-bottom:30px;}

.footerhrwrapper {border-top:1px solid white;  margin-top:40px; padding-top:20px;}
.footermenu2 ul li a {color:white; text-decoration:none;}
.footermenu1 ul li a {color:white; text-decoration:none;}
.footermenu1 ul li, .footermenu2 ul li {list-style:none; padding:0px; margin:0px; }
.footermenu1 ul, .footermenu2 ul {padding-left: 0px !important;}
.footermenu1 {margin-bottom:30px;}
/* ============================================================
   11) COMPONENTS 
============================================================ */


/* Slick slider helpers */

.my-slider .slide { padding-inline: var(--bt-space-3); }
.my-slider { margin-inline: calc(var(--bt-space-3) * -1); }


/* ============================================================
   12) RESPONSIVE VIDEO
============================================================ */

.responsive-video {
  position: relative;
  width: 100%;
  padding-bottom: 56.25%;
  height: 0;
  overflow: hidden;
  margin:  0;
}

.responsive-video iframe,
.responsive-video object,
.responsive-video embed,
.responsive-video video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}


/* ============================================================
   13) REDUCED MOTION 
============================================================ */

@media (prefers-reduced-motion: reduce) {
  * {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
    scroll-behavior: auto !important;
  }
}


/* ============================================================
   14) BREAKPOINT PLACEHOLDERS
============================================================ */

@media (min-width: 992px) {
  /* lg+ tweaks here */
}

@media (max-width: 782px) {

	.copyright  {margin-top:20px;}
}


/* ============================================================
   15) DEBUG (uncomment when building layouts)
============================================================ */

/*
.module { outline: 1px dashed rgba(255,0,0,0.3); }
*/