/* Home-page-only styles (global in style.css) */

/* HERO */
.hero {
  min-height: 35vh;
  background: url('/hero.jpg') center/cover no-repeat;
  display: flex; align-items: center; justify-content: center;
  position: relative; text-align: center; color: #fff;
}
.hero::before {
  content: ''; position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(0,0,0,.55) 0%, rgba(0,0,0,.25) 60%, transparent);
}

/* CARDS */
.card {
  background: #fff; border-radius: .6rem; padding: 1.5rem;
  box-shadow: 0 3px 12px rgba(0,0,0,.08); margin: 1.5rem 0;
  animation: fadeIn .6s ease .1s both;
}
@keyframes fadeIn {
  from { opacity:0; transform:translateY(20px) }
  to { opacity:1; transform:none }
}

/* Volunteer Notice */
.card.notice {
  border-left: 6px solid var(--orange);
  background: linear-gradient(90deg, #fff 0%, #fff7f3 100%);
}
.card.notice .button { margin-top: .5rem }

/* SCHEDULE BADGES */
.schedule {
  list-style: none; display: flex; flex-wrap: wrap; gap: .6rem;
  margin: .6rem 0; padding: 0;
}
.schedule li {
  background: var(--orange); color: #fff;
  padding: .3rem .8rem; border-radius: .4rem; font-weight: 600;
}

/* RESOURCE LINKS */
.resource-links {
  display: flex; flex-wrap: wrap; gap: .8rem; margin-top: 1rem;
}
.btn-resource {
  flex: 1 1 calc(50% - .8rem);
  color: #fff; padding: .6rem 1.2rem; border-radius: .4rem;
  text-decoration: none; font-weight: 600; text-align: center;
  transition: background .2s ease, transform .2s ease;
}
.btn-resource.utah    { background: #005eb8 }
.btn-resource.inciweb { background: #ff6600 }
.btn-resource.mapping { background: #228b22 }
.btn-resource.firms   { background: #872167 }
.btn-resource:hover   { transform: translateY(-2px) }
@media (max-width: 600px) {
  .btn-resource { flex: 1 1 100% }
}

/* BOARD */
.board {
  list-style: none; padding: 0;
  display: grid; grid-template-columns: repeat(auto-fit,minmax(250px,1fr));
  gap: .4rem;
}
.board li { padding: .15rem 0 }

/* BUTTONS */
.button {
  display: inline-block; background: var(--orange); color: #fff;
  padding: .5rem .9rem; border-radius: .4rem; text-decoration: none;
  font-weight: 600; position: relative; overflow: hidden;
}

/* FIRE-DANGER BADGE */
.fire-status {
  margin-left: auto; padding: .25rem .7rem; border-radius: .4rem;
  display: flex; align-items: center; gap: .35rem; color: #fff;
}
.fire-status .label { opacity: .85 }
.fire-status .level { font-weight: 700 }
.fire-status a      { color: #fff; text-decoration: underline }
.fire-status[data-level="low"]      { background: #5cb85c }
.fire-status[data-level="moderate"] { background: #f0ad4e; color: #000 }
.fire-status[data-level="high"],
.fire-status[data-level="very high"],
.fire-status[data-level="extreme"] { background: #d9534f }
@media (max-width:600px){
  .fire-status { margin: .5rem 0 0 }
}

/* WEATHER WIDGET */
.site-header .weather-status {
  margin-left: .6rem; padding: .25rem .7rem;
  background: #007acc; color: #fff; border-radius: .4rem;
  display: flex; align-items: center; gap: .4rem; font-size: .85rem;
  text-decoration: none;
}
.site-header .weather-status:hover { opacity: .9 }
.site-header .weather-icon { font-size: 1.2rem; line-height:1 }
.site-header .weather-temp { font-weight:700 }
.site-header .weather-label { opacity: .8; font-size:.75rem }
@media(max-width:600px){
  .site-header .weather-status { margin: .5rem 0 0 }
}