/* SnoutSocial Homepage Styles v1.0.2 */
:root{ --snout-blue:#0B3A74; --snout-accent:#FF9F3B; }

.snout-wrap{ font-family: Inter, system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif; color: var(--snout-blue); }
.snout-hero{ position:relative; min-height:88vh; display:grid; place-items:center;
  background-image: var(--hero); background-size:cover; background-position:center; isolation:isolate; }
.snout-hero::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(0,0,0,.12),rgba(0,0,0,.48)); z-index:0; }
.snout-hero-inner{ position:relative; z-index:1; text-align:center; padding:2rem; }
.snout-headline{ color:#fff !important; font-size:clamp(36px,5vw,56px); margin:0 0 8px; font-weight:800; text-shadow:0 2px 8px rgba(0,0,0,.25); }
.snout-subhead{ color:#E8F2FF !important; font-size:clamp(16px,2.2vw,22px); margin:0 0 18px; text-shadow:0 1px 6px rgba(0,0,0,.25); }
.snout-ctas{ display:flex; gap:12px; justify-content:center; flex-wrap:wrap; }
.snout-btn{ display:inline-block; border-radius:999px; padding:12px 22px; font-weight:700; text-decoration:none; }
.snout-btn.primary{ background:var(--snout-accent); color:#1a1a1a; }
.snout-btn.ghost{ border:2px solid #fff; color:#fff; }

.snout-tiles{ display:grid; grid-template-columns: repeat(7, minmax(140px,1fr)); gap:14px; padding:22px; margin-top:-40px; }
@media (max-width:1200px){ .snout-tiles{ grid-template-columns:repeat(4,1fr); } }
@media (max-width:768px){ .snout-tiles{ grid-template-columns:repeat(2,1fr); } }
.snout-tile{ background:#fff; border-radius:16px; padding:14px 16px; display:flex; gap:10px; align-items:center; justify-content:center; font-weight:700; color:var(--snout-blue); box-shadow:0 10px 24px rgba(0,0,0,.08); text-decoration:none; }
.snout-tile:hover{ transform:translateY(-2px); box-shadow:0 14px 28px rgba(0,0,0,.12); }

.snout-section{ background:#fff; border-radius:18px; padding:18px; margin:18px; box-shadow:0 8px 20px rgba(0,0,0,.06); }
.snout-section-head{ display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:10px; }
.snout-section h2{ margin:0; font-size:clamp(20px,2.4vw,28px); }
.snout-link{ color:var(--snout-blue); text-decoration:none; font-weight:700; }

.snout-cards{ display:grid; grid-template-columns: repeat(3,minmax(220px,1fr)); gap:14px; }
@media (max-width:900px){ .snout-cards{ grid-template-columns:1fr; } }
.snout-card{ background:#fff; border-radius:16px; padding:12px; box-shadow:0 6px 16px rgba(0,0,0,.06); text-align:center; }
.snout-card img{ width:100%; aspect-ratio: 4/3; object-fit: cover; border-radius:12px; }

.snout-places{ display:grid; grid-template-columns: repeat(3,minmax(220px,1fr)); gap:14px; }
@media (max-width:900px){ .snout-places{ grid-template-columns:1fr; } }
.snout-place{ display:flex; gap:12px; align-items:center; background:#fff; border-radius:14px; padding:12px; box-shadow:0 6px 16px rgba(0,0,0,.06); }
.snout-pin{ font-size:22px; }
.snout-place-body span{ color:#666; font-weight:600; }

.snout-grid-2{ display:grid; grid-template-columns:1fr 1fr; gap:18px; margin:18px; }
@media (max-width:900px){ .snout-grid-2{ grid-template-columns:1fr; } }
.snout-grid-3{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin:18px; }
@media (max-width:900px){ .snout-grid-3{ grid-template-columns:1fr; } }
.snout-callout{ display:block; text-align:center; padding:20px; background:#fff; border-radius:18px; font-weight:800; color:var(--snout-blue); text-decoration:none; box-shadow:0 8px 20px rgba(0,0,0,.06); }
.snout-callout:hover{ transform:translateY(-2px); box-shadow:0 12px 26px rgba(0,0,0,.1); }