:root {
    --army-green: #5f7a50; 
    --afc-yellow: #ffd530; 
    --aal-red: #E61E26; --dark-grey: #333333; --light-grey: #B8B8B8; }

@font-face { font-family: "Anton"; font-style: normal; font-weight: 600;
 font-display: swap; src: url("fonts/Anton-Regular.woff2") format
 ("woff2"), url("fonts/Anton-Regular.woff") format("woff"), url
 ("fonts/Anton-Regular.ttf") format("truetype"); unicode-range: U+0-FF,
 U+131, U+152-153, U+2BB-2BC, U+2C6, U+2DA, U+2DC, U+2000-206F, U+2074,
 U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

@font-face { font-family: "ArchivoBlack"; font-style: normal; font-weight:
 600; font-display: swap; src: url("fonts/ArchivoBlack-Regular.woff2") format
 ("woff2"), url("fonts/ArchivoBlack-Regular.woff") format("woff"), url
 ("fonts/ArchivoBlack-Regular.ttf") format("truetype"); unicode-range:
 U+0-FF, U+131, U+152-153, U+2BB-2BC, U+2C6, U+2DA, U+2DC, U+2000-206F,
 U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

.sticky-day { position: sticky; top: 0; z-index: 5; background: #fff;
 padding: .75rem 0; border-bottom: 1px solid #ddd; }

.event.past { opacity: 0.45; }

.event.upcoming { opacity: 1; }

.no-results i { color: #adb5bd; }

.clear-filters-inline { cursor: pointer; }

/*----------------------------
STYLES FOR SCHEDULE WITH FILTERS AND CALENDAR
-----------------------------*/
@media (prefers-reduced-motion: reduce) {
    .event.starting-soon .card { animation: none; } }

.event.starting-soon .card { border: 2px solid #ffc107;
 background-color: #fff8e1; animation: pulseSoon 2s infinite; }


.event.happening-now .card { border: 2px solid #198754; background-color: var(--light-grey); }

.event.happening-now::before { content: "Happening now"; position: absolute;
 top: 0.75rem; right: 0.75rem; background: #198754; color: #fff; font-size:
 0.7rem; padding: 0.25rem 0.5rem; border-radius: 999px; }

.event.happening-now .card { border: 2px solid var(--aal-red); /* blue
 border */
}

.event.starting-soon::before { content: "Starting soon"; position: absolute;
   top: 0.75rem; right: 0.75rem; background: #ffc107; color: #212529;
   font-size: 0.7rem; padding: 0.25rem 0.5rem; border-radius: 999px; }


.event.starting-soon .card { animation: pulse 1.5s infinite; border: 2px
 solid #ffc107; /* yellow border */
}

.event { position: relative; }

.event.starting-soon .event-status::after { content: "Starting Soon";
 color: #ffc107; }

.event.happening-now .event-status::after { content: "Happening Now";
 color: #0d6efd; }

.event.past .event-status::after { content: "Ended"; color: #6c757d; }

.event-status { font-size: 0.75rem; font-weight: 600; display: block;
 margin-bottom: 0.25rem; }


.event.past .card { opacity: 0.65; /* gray out */
}

/* Pulse animation for starting soon *
@keyframes pulse { 0% { box-shadow: 0 0 0 0 rgba(255, 193, 7, 0.7); } 70%
 { box-shadow: 0 0 0 10px rgba(255, 193, 7, 0); } 100%{ box-shadow: 0 0 0 0
 rgba(255, 193, 7, 0); } }

/* Badge styling *
.event-status { font-size: 0.75rem; padding: 0.25rem 0.5rem; }*/

/*.hero.hero-capfac-house-2026 {}*/
/*@media (min-width: 768px) {.hero.hero-capfac-house-2026
   {background-image: url
   ('../img/campaigns/sxsw/hero-md.png'); background-position: 55% 0%;}}
@media (min-width: 1200px) {.hero.hero-capfac-house-2026{background-image: url
 ('../img/campaigns/sxsw/hero.png');}}*/

/*section.hero.hero-name {
  background-image: url('../img/campaigns/name/hero-name.png');
}*/


/*Hero AAL Stage*/
/*section.hero.hero-aalstage {background-image: url('../img/campaigns/aalstage/hero-aal-stage-sm.png');   background-repeat: no-repeat;
  background-size: cover;
  background-position: 75% 0%; }
@media (min-width: 768px) {section.hero.hero-aalstage {background-image: url('../img/campaigns/aalstage/hero-aal-stage-md.png');}}
@media (min-width: 1200px) {section.hero.hero-aalstage {background-image: url('../img/campaigns/aalstage/hero-aal-stage.png');}}

*/
/*.hero.hero-sxsw-alt {background-image: url('../img/campaigns/sxsw/hero-a-mobile.png'); background-position: 75%
   0%;}
@media (min-width: 768px) {.hero.hero-sxsw-alt {background-image: url('../img/campaigns/sxsw/hero-a-tablet.png');}}
@media (min-width: 1200px) {.hero.hero-sxsw-alt {background-image: url('../img/campaigns/sxsw/hero-a.png');}}

*/

.nav-tabs-events .nav-item-events .nav-link-events {

  color: var(--aal-red); !important; /* Example text color */
}

.nav-tabs-events .nav-item-events .nav-link-events.active {

  color: black; !important; /* Example text color */
}


.nav-tabs-events .nav-item-events .nav-link-events:focus,
.nav-tabs-events .nav-item-events .nav-link-events:hover {
  color: black; /* Your desired hover/focus color */
}


/* Only transition the card height, not the collapse itself */
.event .card {
  transition: height 0.2s ease; /* adjust duration to taste */
}
.event-collapse {
  transition: height 0.2s ease, padding 0.2s ease;
}

#scheduleAccordion .accordion-button:not(.collapsed){background-color: var(--aal-red); color: white; !important; outline: none; box-shadow: none;}
#scheduleAccordion .accordion-button{background-color: var(--aal-red); color: white; !important; outline: none; box-shadow: none;}


#rectangle-callout { position: relative; display: inline-block; z-index: 1; }

/* The background slab */
#rectangle-callout::before { content: ""; position: absolute; top: 90; bottom:
 0;

  /* Pull rectangle to true viewport left */
  left: calc(-1 * (100vw - 100%) - 15px);

  /* Extend 8% past text width */
  left: -8%;

  height: 20vh;

  background: yellow; /* change color as needed */ z-index: 1; }

/* Ensure text sits above rectangle */
.rectangle-text { position: relative; z-index: 1; padding: 0.5rem 0; /*
 vertical breathing room */ }

#hero-text-rectangle { width: 100%; height: 100px; margin-left: -100px;
 background: red; }

.hero-text-rectangle{margin-left: 100px; padding-top: 2rem;}
  
.aal-icon { display: inline-flex; align-items: flex-start; /* bars grow
 downward */ gap: 4px; height: 24px; left: 25%; }

.aal-icon span { width: 2vw; max-width: 80px; max-height: 240px;
 background-color: var(--army-green); margin-left: 0.25vh; z-index: 0; }

/* Left bar */
.aal-icon span:nth-child(1) { height: 22vh; }

/* Middle bar (tallest) */
.aal-icon span:nth-child(2) { height: 34vh; }

/* Right bar */
.aal-icon span:nth-child(3) { height: 28vh; }


/*squares and rectangles graphic*/
.brutalist-graphics { gap: 6px; /* tight spacing */ z-index: 0; }

.shape { flex-shrink: 0; }

.square { width: 2.5vw; height: 2.4vw; max-width: 80px; max-height: 80px; }

.rectangle { width: 2.5vw; height: 12vw; max-width: 80px; max-height:
 240px; }

.square:nth-child(1) { background: #656948; }
.square:nth-child(2) { background: #80865f; }
.square:nth-child(3) { background: #4c4f38; }
.rectangle { background: #000000; }

.brutalist-graphics { gap: 8px; }

.section-with-graphic { overflow: visible; /* allow overlap */ }

/* Graphic container */
.brutalist-graphics-overlap { position: absolute; top: -20px;      /* pulls
 upward into previous section */ right: 5%; display: flex; gap: 4px;  /*
 tight spacing */ z-index: 10; }

/* Graphic container */
.brutalist-graphics-left { position: absolute; top: 135vh;      /*
 pulls downward into previous section */ left: 30%;*/
  display: flex; gap: 4px;        /* tight spacing */ z-index: 0; transform:
  translateY(20%); }


.brutalist-graphics-slight-overlap { top: -60px; right: -20px; }

.brutalist-graphics-dramatic-overlap { top: -80px; right: 10%; }

.rectangle-going-down { height: 240px; }

/*hide brutalist graphics on mobile*/
/*@media (max-width: 768px) {
  .brutalist-graphics { display: none; } }*/

.pre-headline-footer {font-size: 1.25rem; text-transform: uppercase;
 font-weight:700; font-family:'Roboto Mono'; z-index: 1;}
  @media (max-width: 767px) {.pre-headline-footer {font-size: 1rem;}}


.diagonal-split-background{ background-color: #2c2c2c;
 background-image: -webkit-linear-gradient(130deg, #ffffff 50%, #dcd6bc
 50.1%);}

.diagonal-split-background-texture {background-image: linear-gradient
 (135deg, rgba(236, 231, 199, 0.96) 70%, rgba(255, 255, 255, 0.75) 70.1%),
 url('../img/campaigns/sxsw/charcoal-texture.png');}

.charcoal-texture {position: relative; height: auto; width: 100%; display:
 flex;}

.charcoal-texture::before {content: ""; background-size: cover; position:
 absolute; top: 0px; right: 0px; bottom: 0px; left: 0px; opacity: 0.10;
 background-image: url("../img/campaigns/sxsw/charcoal-texture.png"); }

.bkg-gradient {background: linear-gradient(180deg, rgba(220, 100, 101, 1),
 rgba(42, 22, 94, 1));}
.bkg-tan {background-color: #dcd6bc; }
@media (max-width: 767px) {.bkg-tan {background-color: #e7e1c8;}}

.info-boxes .card-icon { text-align: center; margin-top: -32px;}
    
.info-boxes .card-icon i { font-size: 32px; color: #fff; width: 64px; height:
 64px; padding-top: 10px; text-align: center; background-color: #1a1a14;
 border-radius: 4px; text-align: center; border: 4px solid #fff; transition:
 0.3s; display: inline-block;}

.icon-event {background-image: url
 (../img/campaigns/sxsw/icon-placeholder.png); background-position: 50% 0;
 background-repeat: no-repeat; background-size: auto 100%; height: 4rem;}
.icon-bulb{background-image: url
 (../img/campaigns/sxsw/icon-lightbulb.png); background-position: 50% 0;
 background-repeat: no-repeat; background-size: auto 100%; height: 4rem;}
.icon-city{background-image: url
 (../img/campaigns/sxsw/icon-city.png); background-position: 50% 0;
 background-repeat: no-repeat; background-size: auto 100%; height: 4rem;}
.icon-robot{background-image: url
 (../img/campaigns/sxsw/icon-robot2.png); background-position: 50% 0;
 background-repeat: no-repeat; background-size: auto 100%; height: 4rem;}
.icon-globe{background-image: url
 (../img/campaigns/sxsw/icon-globe2.png); background-position: 50% 0;
 background-repeat: no-repeat; background-size: auto 100%; height: 4rem;}

.archivo {font-family: 'ArchivoBlack';}
.archivo-light {font-family: 'ArchivoBlack'; font-weight: 300;}
.anton {font-family: 'Anton'; letter-spacing: .12rem; }
.anton-light {font-family: 'Anton'; letter-spacing: .12rem; font-weight: 300;} 

.text-xlg {font-size: 9rem;}
@media (max-width: 1200px) {.text-xlg {font-size: 7rem;}}
@media (max-width: 768px) {.text-xlg {font-size: 5rem;}}
@media (max-width: 576px) {.text-xlg {font-size: 4rem;}}

.event-card-info-text {font-size: 1.17rem;}
