/* SOS The Fairways Styles */
:root {
  --sos-ink: #072d43;
  --sos-blue: #0072c6;
  --sos-green: #13813e;
  --sos-muted: #516773;
  --sos-bg-pale: #f0f7f4;
  --sos-border: #eef2f5;
}

/* Hero Section */
.sos-hero {
  background-color: var(--sos-bg-pale);
  padding-top: 4rem;
  padding-bottom: 4rem;
}

.sos-hero-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 3rem;
  align-items: start;
}

@media (min-width: 801px) {
  .sos-hero-grid {
    grid-template-columns: 1.2fr 1fr;
    gap: 4rem;
  }
}

.sos-hero-content h1 {
  font-size: clamp(2.8rem, 6vw, 4.5rem);
  line-height: 1.1;
  color: var(--sos-ink);
  margin-bottom: 1rem;
  letter-spacing: -0.03em;
}

@media (max-width: 800px) {
  .sos-hero-content h1 {
    max-width: 2.6rem; /* Fallback constraint if clamp behaves unexpectedly on very small screens, though clamp handles it */
    font-size: 2.6rem;
  }
}

.sos-hero-content .lead {
  font-size: 1.25rem;
  line-height: 1.7;
  color: var(--sos-muted);
  margin-bottom: 1.5rem;
}

.sos-hero-content p:not(.lead) {
  line-height: 1.7;
  color: var(--sos-ink);
  margin-bottom: 2rem;
}

/* Index List in Hero */
.sos-index-list {
  background: white;
  border-radius: 16px;
  padding: 1.5rem;
  box-shadow: 0 4px 12px rgba(0,0,0,0.05);
  border: 1px solid var(--sos-border);
}

.sos-thumb-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.sos-thumb-item {
  display: flex;
  align-items: center;
  gap: 1rem;
  border-bottom: 1px solid var(--sos-border);
  padding-bottom: 1rem;
}

.sos-thumb-item:last-child {
  border-bottom: none;
  padding-bottom: 0;
}

.sos-thumb-link {
  display: flex;
  align-items: center;
  gap: 1rem;
  text-decoration: none;
  color: inherit;
  width: 100%;
}

.sos-thumb-link img {
  max-height: 100px;
  width: auto;
  border-radius: 8px;
  object-fit: contain;
  flex-shrink: 0;
}

.sos-thumb-text {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.sos-thumb-title {
  font-weight: 600;
  color: var(--sos-ink);
  font-size: 1rem;
}

.sos-thumb-sub {
  font-size: 0.875rem;
  color: var(--sos-muted);
}

/* Evidence Grid */
.sos-evidence-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2rem;
  margin-top: 2rem;
}

@media (min-width: 801px) {
  .sos-evidence-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

.sos-card {
  background: white;
  padding: 2rem;
  border-radius: 16px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.05);
  border: 1px solid var(--sos-border);
  min-width: 0; /* Prevent grid overflow */
}

.sos-card-index {
  display: block;
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--sos-blue);
  margin-bottom: 0.5rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.sos-card h3 {
  color: var(--sos-ink);
  font-size: 1.5rem;
  margin-top: 0;
  margin-bottom: 1rem;
  letter-spacing: -0.02em;
}

.sos-card-desc {
  color: var(--sos-muted);
  line-height: 1.7;
  margin-bottom: 1.5rem;
  min-height: 3.4rem; /* Ensure visual alignment if text lengths differ slightly */
}

.sos-card figure {
  margin: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.sos-card img {
  max-width: 330px;
  width: 100%;
  height: auto;
  border-radius: 8px;
  margin-bottom: 1rem;
}

.sos-card figcaption {
  font-size: 0.875rem;
  color: var(--sos-muted);
  text-align: center;
  line-height: 1.4;
}

/* Moderator Section */
.sos-mod-section {
  background-color: white;
}

.sos-mod-scroll-wrapper {
  width: 100%;
  overflow-x: auto;
  margin: 2rem 0;
  border-radius: 8px;
  /* Hide scrollbar for cleaner look but keep functionality */
  -ms-overflow-style: none;  
  scrollbar-width: none;  
}

.sos-mod-scroll-wrapper::-webkit-scrollbar {
  display: none;
}

@media (min-width: 801px) {
  .sos-mod-scroll-wrapper {
    overflow-x: visible;
  }
}

.sos-mod-figure {
  margin: 0;
  min-width: 800px; /* Force scroll on small screens */
  display: flex;
  flex-direction: column;
  align-items: center;
}

@media (min-width: 801px) {
  .sos-mod-figure {
    min-width: auto;
    width: 100%;
  }
}

.sos-mod-figure img {
  max-width: 100%;
  height: auto;
  border-radius: 8px;
  margin-bottom: 1rem;
}

.sos-mod-figure figcaption {
  font-size: 0.875rem;
  color: var(--sos-muted);
  text-align: center;
}

.sos-mod-hint {
  font-size: 0.875rem;
  color: var(--sos-muted);
  margin-bottom: 1rem;
}

@media (min-width: 801px) {
  .sos-mod-hint {
    display: none;
  }
}

/* Context Section */
.sos-context-section {
  background-color: var(--sos-bg-pale);
  border-radius: 16px;
  margin-bottom: 4rem;
}

.sos-columns {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2rem;
  margin-top: 2rem;
}

@media (min-width: 801px) {
  .sos-columns {
    grid-template-columns: repeat(2, 1fr);
  }
}

.sos-columns h3 {
  color: var(--sos-ink);
  font-size: 1.25rem;
  margin-bottom: 0.75rem;
}

.sos-columns p {
  line-height: 1.7;
  color: var(--sos-muted);
}

.sos-privacy-note {
  margin-top: 3rem;
  padding-top: 2rem;
  border-top: 1px solid rgba(0,0,0,0.1);
}

.sos-privacy-note p {
  font-size: 0.9rem;
  line-height: 1.6;
  color: var(--sos-muted);
  max-width: 80ch;
}

/* Home Page Article */
.sos-home-article {
  background-color: var(--sos-bg-pale);
  border-radius: 16px;
  padding: 2rem;
  margin-bottom: 4rem;
  display: grid;
  grid-template-columns: 1fr;
  gap: 2rem;
}

@media (min-width: 801px) {
  .sos-home-article {
    grid-template-columns: 1.5fr 1fr;
    align-items: start;
    padding: 3rem;
  }
}

.sos-home-content h3 {
  font-size: clamp(2rem, 4vw, 3rem);
  color: var(--sos-ink);
  margin-top: 0.5rem;
  margin-bottom: 0.5rem;
  letter-spacing: -0.02em;
}

.sos-home-status {
  font-size: 0.875rem;
  color: var(--sos-muted);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-bottom: 1rem;
  display: block;
}

.sos-home-desc {
  line-height: 1.7;
  color: var(--sos-ink);
  margin-bottom: 2rem;
  max-width: 60ch;
}

.sos-home-images {
  display: flex;
  gap: 1rem;
  flex-wrap: wrap;
}

@media (min-width: 801px) {
  .sos-home-images {
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: flex-start;
  }
}

.sos-home-thumb {
  width: 42%;
  min-width: 150px;
}

@media (min-width: 801px) {
  .sos-home-thumb {
    width: 175px;
  }
}

.sos-home-thumb img {
  width: 100%;
  height: auto;
  border-radius: 8px;
  margin-bottom: 0.5rem;
  display: block;
}

.sos-home-thumb figcaption {
  font-size: 0.75rem;
  color: var(--sos-muted);
  text-align: center;
}

/* Focus Rings */
.sos-thumb-link:focus, 
.sos-hero .button:focus,
.sos-context-section .button:focus {
  outline: 2px solid var(--sos-blue);
  outline-offset: 4px;
}

/* Scroll Margin for Anchors */
#resident-feed,
#resident-forum,
#moderator-workspace,
#inside-sos {
  scroll-margin-top: 110px;
}

/* Reviewed local-model accessibility corrections. */
.sos-hero-content h1{max-width:none} .sos-thumb-link img{width:72px;height:100px;max-height:none;object-fit:contain} .sos-thumb-text,.sos-hero-content,.sos-index-list,.sos-home-content,.sos-home-images{min-width:0} .sos-thumb-title{overflow-wrap:anywhere} .sos-index-list h2{font-size:1.1rem;margin-bottom:1rem} .sos-mod-scroll-wrapper{scrollbar-width:auto;-ms-overflow-style:auto} .sos-mod-scroll-wrapper::-webkit-scrollbar{display:block;height:12px} .sos-mod-source{font-size:.875rem} .sos-card .text-link{margin-top:1rem;font-size:.875rem} .sos-home-article{margin-top:24px;margin-bottom:0;scroll-margin:110px} .sos-home-thumb{margin:0} .sos-home-thumb figcaption{font-size:.875rem} @media (max-width:600px){.sos-card{padding:1rem} .sos-index-list{padding:1rem} .sos-home-article{padding:1.25rem} .sos-home-images{gap:1rem} .sos-home-thumb{width:calc(50% - .5rem);min-width:0}} .sos-mod-scroll-wrapper:focus-visible{outline:2px solid var(--sos-blue)}

/* Browser review: keep both complete Home previews together at intermediate widths. */
.sos-home-images{justify-content:center}.sos-home-thumb{min-width:0;max-width:calc(50% - .5rem)}.sos-home-article{align-items:center}
