/* ================================
   SEMO Minimal UT-Style Hero (senior fix)
   Paste into Custom CSS
   ================================ */

/* page back to white (prevents dark band showing) */
html, body { background: #fff !important; }

/* ALERT BAR (separate) */
.semo-catalog-alert {
  background: #f6e9e9;
  color: #7a1b1f;
  padding: 10px 16px;
  font-weight: 600;
  font-size: 14px;
  border-radius: 6px;
  max-width: 1180px;
  margin: 18px auto 26px auto; /* ⬅ added more space below alert */
  border: 1px solid rgba(122,27,31,0.08);
  box-sizing: border-box;
  line-height: 1.25;
  text-align: left;
  z-index: 40;
  position: relative;
}
.semo-catalog-alert a { color: #7a1b1f; font-weight:700; text-decoration: underline; }

/* HERO WRAPPER */
.semo-hero-wrap {
  width: 100%;
  position: relative;
  background: #ffffff;
  z-index: 20;
  box-sizing: border-box;
  margin-bottom: 24px; /* ⬅ added spacing below hero */
}

/* HERO: slightly taller for better crop */
.semo-hero {
  position: relative;
  height: 440px; /* ⬅ increased from 380px */
  overflow: hidden;
  background: #fff;
  display: block;
  box-sizing: border-box;
  margin-top: 0 !important;
}
@media (max-width:900px){ .semo-hero { height: 300px; } } /* ⬅ increased from 240px */

/* slides / slide */
.semo-hero .slides {
  display:flex;
  height:100%;
  transition: transform 0.6s ease;
  will-change: transform;
}
.semo-hero .slide {
  min-width: 100%;
  height: 100%;
  background-size: cover;
  background-position: center center;
  position: relative;
  display: flex;
  align-items: center;
}

/* gentle left gradient (brand-friendly) */
.semo-hero .slide::before{
  content:"";
  position:absolute;
  inset:0;
  background: linear-gradient(90deg, rgba(3,46,52,0.70) 0%, rgba(3,46,52,0.45) 30%, rgba(3,46,52,0.12) 55%, rgba(255,255,255,0) 100%);
  pointer-events:none;
}

/* hero text on left */
.semo-hero .hero-text {
  position: relative;
  z-index: 6;
  color: #fff;
  max-width: 520px;
  margin-left: 6%;
  text-shadow: 0 1px 0 rgba(0,0,0,0.25);
}
.semo-hero .hero-text h1 { font-size:2.0rem; margin:0 0 6px 0; font-weight:700; }
.semo-hero .hero-text p { margin:0; font-size:1rem; opacity:0.95; }

/* HERO CONTROLS — targeted specifically to be INSIDE .semo-hero */
.semo-hero > .hero-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 44px;
  height: 44px;
  border-radius: 50%;
  border: none;
  background: rgba(255,255,255,0.12);
  color: #fff;
  font-size: 22px;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  z-index: 30;
  transition: background .18s ease, transform .18s ease;
}
.semo-hero > .hero-arrow.left { left: 26px; }
.semo-hero > .hero-arrow.right { right: 26px; }
.semo-hero > .hero-arrow:hover { background: rgba(255,255,255,0.24); transform: translateY(-50%) scale(1.04); }

/* dots centered inside hero */
.semo-hero > .hero-dots {
  position: absolute;
  bottom: 18px;
  left: 50%;
  transform: translateX(-50%);
  display:flex;
  gap:8px;
  z-index: 30;
}
.semo-hero > .hero-dots button {
  width:10px; height:10px; border-radius:50%; border:none;
  background: rgba(255,255,255,0.38); cursor:pointer; transition: transform .15s ease, background .15s ease;
}
.semo-hero > .hero-dots button.active { background:#fff; transform: scale(1.1); }

/* ensure hero sits visually above any dark stripe and search bar comes after hero */
.storefront-search, .catalog-header, .search-container { position: relative; z-index: 10; }

/* small-screen adjustments */
@media (max-width:560px){
  .semo-hero { height:260px; } /* ⬅ slightly taller than before */
  .semo-hero .hero-text h1 { font-size:1.25rem; }
  .semo-hero .hero-text p { font-size:0.95rem; }
  .semo-hero > .hero-arrow { width:34px; height:34px; font-size:18px; }
}

/* Remove dark stripe background completely */
.catalog-header,
.storefront-header,
.storefront-search,
.search-container {
  background: transparent !important;
  border: none !important;
}

/* Remove any extra padding above hero */
.semo-hero-wrap,
.semo-hero-wrap + * {
  padding-top: 0 !important;
}
/* Remove teal accent border + white strip above search */
.storefront-search {
  border-top: none !important;
  padding-top: 0 !important;
  margin-top: 0 !important;
}

/* Pull search section upward to sit flush with hero */
.semo-hero-wrap + .storefront-search {
  margin-top: -6px !important;
}

/* Remove extra internal top spacing */
.storefront-search .container,
.storefront-search .row {
  padding-top: 0 !important;
  margin-top: 0 !important;
}
/* Increase university logo size */
.storefront-header img,
.catalog-header img {
  height: 160px !important;   /* increase from default (~40px) */
  width: 300px !important;
}

/* Add a little breathing room */
.storefront-header,
.catalog-header {
  padding-top: 14px !important;
  padding-bottom: 14px !important;
}