/* Wildlife. Reuses the Visit page's hero/jump/section pieces (visit.css) and adds the
   season calendar, species blocks and the turtle-season numbers. */

/* Season calendar: one row per animal, twelve month cells */
.calendar { overflow-x: auto; }
.cal { width: 100%; border-collapse: separate; border-spacing: 3px; font-size: .9375rem; table-layout: fixed; }
.cal col.name { width: 7.5rem; }
@media (min-width: 640px) { .cal col.name { width: 11rem; } }
.cal th { font-family: var(--font-label); font-size: .75rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-soft); padding: .25rem 0; text-align: center; }
.cal th:first-child, .cal td:first-child { text-align: left; line-height: 1.2; padding-right: .5rem; font-weight: 700; color: var(--marsh-950); font-family: var(--font-body); font-size: .9375rem; letter-spacing: 0; text-transform: none; }
.cal td.m { height: 1.6rem; border-radius: 4px; background: var(--sand-200); }
.cal td.on { background: var(--marsh-500); }
.cal td.now { outline: 2px solid var(--accent); outline-offset: 1px; }
.cal-note { margin: .75rem 0 0; font-size: .9375rem; color: var(--ink-soft); }
.cal-key { display: inline-block; width: 12px; height: 12px; border-radius: 3px; background: var(--marsh-500); vertical-align: -1px; margin-right: .3rem; }

/* Species blocks: photo + text, alternating sides on wide screens */
.species { display: grid; gap: 1.25rem; align-items: center; padding: 2rem 0; border-top: 1px solid var(--rule); }
.species:first-of-type { border-top: 0; padding-top: 0; }
@media (min-width: 900px) {
  .species { grid-template-columns: 1fr 1.2fr; gap: 2.5rem; }
  .species.flip > figure { order: 2; }
}
.species figure { margin: 0; }
.species img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--radius); }
.species h3 { margin: .35rem 0 .6rem; font-size: 1.625rem; font-weight: 800; letter-spacing: -0.02em; color: var(--marsh-950); }
.species .label { color: var(--marsh-500); }
.species p { margin: 0 0 .85rem; color: var(--ink-mid); line-height: 1.6; }
.species p strong { color: var(--ink); }
.status { display: inline-block; font-family: var(--font-label); font-size: .6875rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; border-radius: 3px; padding: .1rem .45rem; margin: 0 .3rem .3rem 0; background: var(--sand-200); color: var(--ink-mid); }
.status-fed { background: #1d3f73; color: #fff; }
.do-this { margin: .25rem 0 0; padding: .75rem .9rem; border-left: 3px solid var(--marsh-700); background: var(--marsh-100); border-radius: 0 var(--radius) var(--radius) 0; color: var(--marsh-950) !important; font-size: .9375rem; }

/* Turtle season numbers */
.turtle-stats { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1px; background: var(--rule); border: 1px solid var(--rule); border-radius: var(--radius); overflow: hidden; margin: .5rem 0 1rem; }
@media (min-width: 640px) { .turtle-stats { grid-template-columns: repeat(4, 1fr); } }
.turtle-stats div { background: #fff; padding: .75rem .85rem; }
.turtle-stats b { display: block; font-size: 1.75rem; font-weight: 800; color: var(--marsh-950); line-height: 1.1; }
.turtle-stats span { font-size: .875rem; color: var(--ink-mid); }
.stats-src { font-size: .875rem !important; color: var(--ink-soft) !important; }

/* Hotline */
.hotline { display: flex; gap: .85rem; align-items: center; flex-wrap: wrap; background: var(--marsh-950); color: var(--sand-50); border-radius: var(--radius); padding: 1.1rem 1.25rem; margin-top: 1.5rem; }
.hotline .material-symbols-outlined { font-size: 2rem; color: var(--marsh-300); }
.hotline p { margin: 0; flex: 1; min-width: 14rem; color: #dfe5d8; }
.hotline strong { color: #fff; }
.hotline a.btn { background: var(--accent); }