/* ========================
   RESET & BASE STYLES
======================== */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html, body {
  font-family: Arial, sans-serif;
  background: #f9f9f9;
  min-height: 100%;
  line-height: 1.5;
  color: #333;
  font-size: 1.1em;
}

body {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}
main {
    flex: 1 0 auto; /* grow to fill remaining space */
    padding-bottom: 2rem;
    opacity: 0;
    animation: fadeIn 0.8s ease forwards;
}
a {
  text-decoration: none;
  color: inherit;
}
a:hover {
  text-decoration: none;
}

/* ========================
   HEADER / NAVBAR
======================== */
header, nav.navbar {
  background: #a30029;
  color: #fff;
}

.navbar-nav .nav-item {
  font-size: clamp(0.9rem, 1vw + 0.5rem, 1.1rem);
}

.navbar-dark .navbar-nav .nav-link {
  color: #fff;
}
.navbar-dark .navbar-nav .nav-link.active,
.navbar-dark .navbar-nav .nav-link:hover {
  color: #0d6efd;
}

/* ========================
   MAIN CONTENT
======================== */
main#content {
  padding: 2rem 1rem;
}

/* Text justification on md and smaller */
.text-md-justify {
  text-align: justify;
  text-align-last: justify;
}

@media (min-width: 992px) { 
  .text-md-justify {
    text-align: left;
    text-align-last: auto;
  }
}

/* ========================
   FOOTER
======================== */
footer {
  background: #a30029;
  color: #fff;
  padding: 1rem 0;
  text-align: center;
  flex-shrink: 0; /* footer stays at bottom */
}

/* ========================
   CAROUSEL
======================== */
.carousel {
  width: 100%;
  margin-bottom: 3rem;
}

.carousel-item img {
  width: 100%;
  height: auto;
  object-fit: cover;
  object-position: center;
}

/* Responsive carousel heights */
@media (max-width: 992px) { .carousel-item img { height: 24rem; } }
@media (max-width: 768px) { .carousel-item img { height: 18rem; } }
@media (max-width: 576px) { .carousel-item img { height: 14rem; } }

.carousel-caption { z-index: 10; }

/* ========================
   MARKETING / FEATURE SECTIONS
======================== */
.marketing { margin: 2rem auto; }
.marketing .col-lg-6 { text-align: center; margin-bottom: 2rem; }
.marketing h2 { font-weight: 400; }
.marketing p { margin: 0.5rem 0; }

/* Featurettes */
.featurette-divider { margin: 5rem 0; }
.featurette-heading { font-weight: 300; line-height: 1; letter-spacing: -0.05rem; }

/* ========================
   ABOUT PAGE
======================== */
.about { margin: 2rem; }

/* ========================
   BOTTOM LINKS / DONATE SECTION
======================== */
.donateSec { margin-bottom: 2rem; margin-top: 2rem; }
.bottomLinks { text-align: center; font-family: "Lucida Sans Unicode", sans-serif; color: #ff0; font-size: 80%; padding: 0.3rem 0; }
.bottomLinks span { padding: 0 0.5rem; white-space: nowrap; }
.bottomLinks a { padding: 0.5rem 0.5rem; color: #ff0; }
.bottomLinks a:visited { color: #fff; }
.bottomLinks .active { color: #999; }
.siteInfo { padding-top: 0.5rem; }
.copyright { text-align: center; color: #000; font-weight: lighter; letter-spacing: 1px; font-family: Verdana, Arial, Helvetica, sans-serif; }

.ticketsML{
  margin-left: 4rem;
}

/* Initial state: off-screen to the right */
.slide-in-right {
    transform: translateX(100%);
    opacity: 0;
    animation: slideInRight .5s forwards;
    animation-timing-function: ease-out;
}

/* Keyframes for the animation */
@keyframes slideInRight {
    to {
        transform: translateX(0);
        opacity: 1;
    }
}

@keyframes fadeIn {
    from { opacity: 0; }
    to   { opacity: 1; }
}

.ticketBtn{
  width: 15rem;
}

.imgCurved{
  height: 300px;
  width: 450px;
  border-radius: 50px 100px;
  margin-left: auto;
}

/* Base state: hidden, moved down */
.fade-in-up {
    opacity: 0;
    transform: translateY(50px);
    transition: opacity 0.8s ease, transform 0.8s ease;
}

/* Active state: visible and in place */
.fade-in-up.active {
    opacity: 1;
    transform: translateY(0);
}

.ticketImg{
  display: grid;
  place-items: center;
}

.contact {
    padding-left: 4rem;
    padding-right: 4rem;
}

/* Large screens and above */
@media (min-width: 992px) {
    .contact {
        padding-left: 5rem;
        padding-right: 5rem;
    }
}

.nvLnk{
  color: #fff !important;
  font-size: 1.1em !important;
  text-decoration: none;
}
.nvLnk:hover{
  color: #ff0;
  text-shadow: 0 0 8px #ff0, 0 0 16px gold;
}

.logInBtn{
    color: white;
    border-color: white;
}

@media (max-width: 768px) { 
  .fallShow{
    flex-direction: column-reverse;
  }

  .showTxt{
    margin-top: 1rem !important;
  }
}

.tFix{
  font-size: 1.2em;
}

.tdSpacing{
  width: 15rem;
  color: blue;
}

.highlight-flash {
  animation: flash-bg 2s ease-in-out;
}

@keyframes flash-bg {
  0%   { background-color: #fff7b0; }   /* light yellow */
  50%  { background-color: #fffacd; }
  100% { background-color: transparent; }
}

.auditionTitle {
    font-size: 1.5em;
    color: #A30029;
}

.tentative{
  font-weight: normal; 
  font-size:0.8em;
}