/**
 * ForageCast homepage — field guide, not dashboard
 */

.fc-page {
  max-width: var(--wds-max-content);
  margin: 0 auto;
  width: 100%;
  min-width: 0;
  overflow-x: clip;
}

.fc-hero {
  position: relative;
  padding: var(--wds-space-12) clamp(1.25rem, 4vw, 2rem);
  text-align: center;
  border-bottom: 1px solid var(--wds-border-subtle);
  background: linear-gradient(180deg, var(--wds-accent-dim) 0%, transparent 100%);
}

.fc-hero__question {
  margin: 0 0 var(--wds-space-3);
  font-family: var(--wds-font-display);
  font-size: clamp(1.75rem, 5vw, 2.5rem);
  font-weight: 400;
  line-height: var(--wds-leading-snug);
}

.fc-hero__lead {
  margin: 0 auto;
  max-width: 40rem;
  font-size: var(--wds-text-md);
  line-height: var(--wds-leading-relaxed);
  color: var(--wds-text-secondary);
}

.fc-location-bar {
  margin-bottom: var(--wds-space-6);
  padding: var(--wds-space-4);
  background: var(--wds-surface);
  border: 1px solid var(--wds-border-subtle);
  border-radius: var(--wds-radius-lg);
}

.fc-location-bar__status {
  margin: 0 0 var(--wds-space-2);
  font-size: var(--wds-text-sm);
  color: var(--wds-text-secondary);
}

.fc-location-bar__actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--wds-space-2);
}

.fc-location-bar__search {
  margin-top: var(--wds-space-3);
}

.fc-location-bar__search.is-hidden {
  display: none;
}

.fc-hero .fc-location-bar__status {
  margin: var(--wds-space-2) auto var(--wds-space-4);
  max-width: 28rem;
  font-size: var(--wds-text-sm);
  color: var(--wds-text-tertiary);
}

.fc-section {
  padding: var(--wds-space-10) clamp(1.25rem, 4vw, 2rem);
  border-bottom: 1px solid var(--wds-border-subtle);
}

.fc-section__eyebrow {
  margin: 0 0 var(--wds-space-2);
  font-size: var(--wds-text-xs);
  font-weight: 500;
  letter-spacing: var(--wds-tracking-wider);
  text-transform: uppercase;
  color: var(--wds-warm);
}

.fc-section__title {
  margin: 0 0 var(--wds-space-2);
  font-family: var(--wds-font-display);
  font-size: var(--wds-text-2xl);
  font-weight: 400;
}

.fc-section__lead {
  margin: 0 0 var(--wds-space-6);
  max-width: 42rem;
  font-size: var(--wds-text-sm);
  line-height: var(--wds-leading-relaxed);
  color: var(--wds-text-secondary);
}

/* Regional status */
.fc-status-grid {
  display: grid;
  gap: var(--wds-space-4);
  grid-template-columns: minmax(200px, 280px) 1fr;
  align-items: start;
}

@media (max-width: 768px) {
  .fc-status-grid { grid-template-columns: 1fr; }
}

.fc-weather-card {
  padding: var(--wds-space-5);
  background: var(--wds-surface);
  border: 1px solid var(--wds-border-subtle);
  border-radius: var(--wds-radius-lg);
}

.fc-weather-card__temp {
  margin: var(--wds-space-2) 0;
  font-family: var(--wds-font-display);
  font-size: var(--wds-text-xl);
}

.fc-weather-card dl {
  margin: var(--wds-space-3) 0 0;
  font-size: var(--wds-text-sm);
  color: var(--wds-text-secondary);
}

.fc-weather-card dt {
  font-weight: 500;
  color: var(--wds-text-tertiary);
  margin-top: var(--wds-space-2);
}

.fc-weather-card dd { margin: var(--wds-space-1) 0 0; }

.fc-outlook-list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: var(--wds-space-2);
}

.fc-outlook-list li {
  display: grid;
  grid-template-columns: minmax(7rem, 9rem) 6rem 1fr;
  gap: var(--wds-space-3);
  padding: var(--wds-space-3) var(--wds-space-4);
  font-size: var(--wds-text-sm);
  background: var(--wds-inset);
  border-radius: var(--wds-radius-md);
  align-items: baseline;
}

@media (max-width: 540px) {
  .fc-outlook-list li { grid-template-columns: 1fr; gap: var(--wds-space-1); }
}

.fc-outlook-list__species { font-weight: 500; }

.fc-outlook-list__status {
  font-size: var(--wds-text-xs);
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: var(--wds-warm);
}

.fc-outlook-list__note { color: var(--wds-text-secondary); }

/* Week banner */
.fc-week-card {
  padding: var(--wds-space-6);
  background: var(--wds-surface);
  border: 1px solid var(--wds-border-subtle);
  border-left: 3px solid var(--wds-warm);
  border-radius: var(--wds-radius-lg);
}

.fc-week-split {
  display: grid;
  gap: var(--wds-space-4);
  grid-template-columns: 1fr 1fr;
  margin-top: var(--wds-space-5);
  padding-top: var(--wds-space-4);
  border-top: 1px solid var(--wds-border-subtle);
}

@media (max-width: 640px) {
  .fc-week-split { grid-template-columns: 1fr; }
}

/* Species spotlight layout */
.fc-spotlight {
  display: grid;
  gap: var(--wds-space-6);
  grid-template-columns: minmax(200px, 1fr) minmax(260px, 1.2fr);
  align-items: start;
}

@media (max-width: 768px) {
  .fc-spotlight { grid-template-columns: 1fr; }
}

.fc-spotlight__visuals {
  display: flex;
  flex-direction: column;
  gap: var(--wds-space-4);
}

.fc-plate-slot {
  min-height: 11rem;
}

.fc-habitat-slot {
  min-height: 8rem;
}

/* Prediction / heat map */
.fc-prediction {
  display: grid;
  gap: var(--wds-space-6);
  grid-template-columns: 1fr minmax(220px, 280px);
  align-items: start;
}

@media (max-width: 768px) {
  .fc-prediction { grid-template-columns: 1fr; }
}

.fc-heatmap {
  position: relative;
  min-height: 16rem;
  padding: 0;
  background: var(--wds-inset);
  border: 1px solid var(--wds-border-subtle);
  border-radius: var(--wds-radius-lg);
}

.fc-heatmap-stage {
  position: relative;
  display: grid;
  grid-template-columns: repeat(3, 6.5rem);
  grid-template-rows: repeat(2, 5rem);
  gap: 4px;
  padding: var(--wds-space-4);
  width: max-content;
  box-sizing: content-box;
}

.fc-heatmap__cell {
  border-radius: var(--wds-radius-sm);
  min-height: 4.5rem;
  pointer-events: none;
}

.fc-heatmap__cell--high { background: var(--wds-lime-muted); }
.fc-heatmap__cell--moderate { background: var(--wds-purple-muted); }
.fc-heatmap__cell--low { background: rgba(31, 53, 84, 0.82); }

.fc-heatmap__label {
  position: absolute;
  bottom: var(--wds-space-3);
  left: var(--wds-space-4);
  font-size: var(--wds-text-xs);
  font-weight: 500;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--wds-text-muted);
  pointer-events: none;
  white-space: nowrap;
}

.fc-legend {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: var(--wds-space-3);
}

.fc-legend li {
  font-size: var(--wds-text-sm);
  color: var(--wds-text-secondary);
  padding-left: var(--wds-space-4);
  position: relative;
}

.fc-legend li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.35em;
  width: 0.65rem;
  height: 0.65rem;
  border-radius: 2px;
}

.fc-legend li:nth-child(1)::before { background: var(--wds-lime); }
.fc-legend li:nth-child(2)::before { background: var(--wds-lime-muted); }
.fc-legend li:nth-child(3)::before { background: rgba(31, 53, 84, 0.7); }

.fc-tool-callout {
  margin-top: var(--wds-space-4);
  padding: var(--wds-space-4);
  background: var(--wds-accent-dim);
  border-radius: var(--wds-radius-md);
  font-size: var(--wds-text-sm);
  line-height: var(--wds-leading-relaxed);
  color: var(--wds-text-secondary);
}

/* Lessons */
.fc-lesson-grid {
  display: grid;
  gap: var(--wds-space-4);
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
}

.fc-lesson {
  display: flex;
  flex-direction: column;
  padding: var(--wds-space-5);
  background: var(--wds-surface);
  border: 1px solid var(--wds-border-subtle);
  border-radius: var(--wds-radius-lg);
}

.fc-lesson__subtitle {
  margin: 0 0 var(--wds-space-2);
  font-size: var(--wds-text-xs);
  color: var(--wds-warm);
  letter-spacing: 0.02em;
}

.fc-lesson__title {
  margin: 0 0 var(--wds-space-2);
  font-family: var(--wds-font-display);
  font-size: var(--wds-text-lg);
  font-weight: 400;
}

.fc-lesson__summary {
  margin: 0 0 var(--wds-space-3);
  flex: 1;
  font-size: var(--wds-text-sm);
  line-height: var(--wds-leading-relaxed);
  color: var(--wds-text-secondary);
}

.fc-lesson__outdoor {
  margin: 0;
  padding-top: var(--wds-space-3);
  border-top: 1px solid var(--wds-border-subtle);
  font-size: var(--wds-text-sm);
  font-style: italic;
  color: var(--wds-text-secondary);
}

.fc-lesson__meta {
  margin-top: var(--wds-space-2);
  font-size: var(--wds-text-xs);
  color: var(--wds-text-tertiary);
}

/* Investigation */
.fc-investigation {
  padding: var(--wds-space-6);
  border: 1px solid var(--wds-border-subtle);
  border-left: 3px solid var(--wds-accent);
  border-radius: var(--wds-radius-lg);
  background: var(--wds-surface);
}

.fc-investigation__question {
  margin: var(--wds-space-2) 0 var(--wds-space-4);
  font-family: var(--wds-font-display);
  font-size: var(--wds-text-lg);
  font-style: italic;
  color: var(--wds-text-secondary);
}

.fc-investigation__meta {
  display: flex;
  flex-wrap: wrap;
  gap: var(--wds-space-2) var(--wds-space-4);
  margin-bottom: var(--wds-space-4);
  font-size: var(--wds-text-xs);
  color: var(--wds-text-tertiary);
}

.fc-investigation ol {
  margin: 0;
  padding-left: 1.25rem;
  font-size: var(--wds-text-sm);
  line-height: var(--wds-leading-relaxed);
  color: var(--wds-text-secondary);
  display: flex;
  flex-direction: column;
  gap: var(--wds-space-2);
}

/* Field notes journal */
.fc-journal {
  padding: var(--wds-space-5) var(--wds-space-5) var(--wds-space-8);
  font-family: var(--wds-font-display);
  background: var(--wds-journal-bg);
  color: var(--wds-journal-text);
  border: 1px solid var(--wds-border-subtle);
  border-radius: var(--wds-radius-md);
  max-width: 28rem;
}

.fc-journal li {
  margin-bottom: var(--wds-space-2);
  font-size: var(--wds-text-sm);
  line-height: var(--wds-leading-relaxed);
}

.fc-section--methodology {
  padding-block: var(--wds-space-6);
  border-bottom: none;
}

.fc-section--methodology .wce-methodology {
  max-width: 36rem;
}

.fc-journal__reminder {
  margin-top: var(--wds-space-4);
  font-size: var(--wds-text-sm);
  font-style: italic;
  opacity: 0.85;
}

.fc-citizen {
  max-width: 42rem;
  padding: var(--wds-space-5);
  background: var(--wds-inset);
  border: 1px dashed var(--wds-border-subtle);
  border-radius: var(--wds-radius-lg);
}

.fc-media-slot {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--wds-space-2);
  padding: var(--wds-space-5);
  text-align: center;
  background: var(--wds-inset);
  border: 1px dashed var(--wds-border-subtle);
  border-radius: var(--wds-radius-lg);
}

.fc-media-slot__label {
  font-size: var(--wds-text-xs);
  font-weight: 500;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--wds-text-muted);
}

.fc-media-slot__hint {
  margin: 0;
  font-size: var(--wds-text-sm);
  color: var(--wds-text-tertiary);
  max-width: 24ch;
}

.fc-hero__mission {
  margin: var(--wds-space-4) auto 0;
  max-width: 36rem;
  font-size: var(--wds-text-sm);
  letter-spacing: 0.02em;
  color: var(--wds-text-tertiary);
}

.fc-pillar-strip {
  display: flex;
  flex-wrap: nowrap;
  gap: 0.5rem;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  padding: 0.85rem clamp(1.25rem, 4vw, 2rem);
  overflow-x: auto;
  border-bottom: 1px solid var(--wds-border-subtle);
  -webkit-overflow-scrolling: touch;
}

.fc-pillar-strip__link {
  flex: 0 0 auto;
  text-decoration: none;
  font-size: 0.85rem;
  font-weight: 600;
  padding: 0.4rem 0.75rem;
  border-radius: 999px;
  border: 1px solid var(--wds-border-subtle);
  color: var(--wds-text);
  white-space: nowrap;
}

.fc-pillar-strip__link:hover,
.fc-pillar-strip__link:focus-visible {
  border-color: var(--wds-accent);
  outline: none;
}

.fc-today__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0.85rem;
}

.fc-today__item {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 0.85rem;
  padding: 0.9rem 1rem;
  border: 1px solid var(--wds-border-subtle);
  border-radius: var(--wds-radius-lg);
  background: var(--wds-surface);
}

.fc-today__rank {
  width: 1.6rem;
  height: 1.6rem;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.8rem;
  font-weight: 600;
  background: var(--wds-accent-dim, rgba(61, 90, 64, 0.12));
  color: var(--wds-accent);
}

.fc-today__title {
  margin: 0 0 0.35rem;
  font-weight: 600;
  line-height: 1.35;
}

.fc-today__why {
  margin: 0 0 0.45rem;
  color: var(--wds-text-secondary);
  font-size: 0.95rem;
  line-height: 1.45;
}

.fc-today__meta {
  margin: 0;
  font-size: 0.85rem;
}

.fc-pill {
  display: inline-block;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  font-size: 0.7rem;
  font-weight: 600;
  color: var(--wds-text-tertiary);
}

.fc-today__link {
  margin-left: 0.5rem;
  color: var(--wds-accent);
}

.fc-today__setup {
  margin: var(--wds-space-5) 0 0;
}

.fc-today__note {
  margin: var(--wds-space-4) 0 0;
  font-size: var(--wds-text-sm);
  color: var(--wds-text-tertiary);
}