/*
 * Sunnyside Up Weather — Coastal presentation layer
 * Version 2.5.21
 *
 * Loaded after the legacy component stylesheet. This changes presentation and
 * hierarchy only; no weather tile, field, section, or data source is hidden.
 */

@font-face {
  font-family: "Sunnyside Noto Sans";
  src: url("fonts/NotoSans-Regular.ttf") format("truetype");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: "Sunnyside Noto Sans";
  src: url("fonts/NotoSans-Bold.ttf") format("truetype");
  font-style: normal;
  font-weight: 700 950;
  font-display: swap;
}

@font-face {
  font-family: "Sunnyside Noto Serif";
  src: url("fonts/NotoSerif-Regular.ttf") format("truetype");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: "Sunnyside Noto Serif";
  src: url("fonts/NotoSerif-Bold.ttf") format("truetype");
  font-style: normal;
  font-weight: 700 950;
  font-display: swap;
}

:root {
  --suw-coast-ink: #12364a;
  --suw-coast-ocean: #0d6f80;
  --suw-coast-deep: #073650;
  --suw-coast-seafoam: #dff3ef;
  --suw-coast-sky: #eaf7fb;
  --suw-coast-sand: #f3e5c8;
  --suw-coast-shell: #fffdf8;
  --suw-coast-sun: #e8ae36;
  --suw-coast-line: rgba(18, 54, 74, .12);
  --suw-coast-shadow: 0 18px 46px rgba(7, 54, 80, .11);
}

body.home,
body:has(.suw5) {
  background-color: #f4faf9 !important;
  background-image:
    radial-gradient(circle at 8% 5%, rgba(110, 207, 218, .26), transparent 25rem),
    linear-gradient(180deg, rgba(237,249,252,.78) 0%, rgba(248,252,249,.87) 40%, rgba(255,249,238,.90) 72%, rgba(238,248,247,.94) 100%),
    url("hero.jpeg") !important;
  background-size: auto, auto, cover !important;
  background-position: left top, center, center top !important;
  background-attachment: fixed !important;
}

/* Kadence's boxed-content mode otherwise paints a white sheet over the entire
   coastal canvas. These homepage-only rules retain every page block while
   allowing the beach background and section spacing to remain visible. */
body.home #inner-wrap,
body.home #primary.content-area,
body.home .content-container.site-container,
body.home .site-main,
body.home .content-wrap,
body.home .entry.content-bg,
body.home .entry.single-entry,
body.home .entry-content-wrap,
body.home .entry-content.single-content {
  background: transparent !important;
  box-shadow: none !important;
}

body.home #primary.content-area {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

body.home .content-container.site-container {
  width: 100% !important;
  max-width: none !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

body.home .entry.single-entry {
  border-radius: 0 !important;
}

body.home .entry-content-wrap {
  padding: 0 !important;
}

body.home .entry-content.single-content {
  width: 100% !important;
  max-width: none !important;
}

body.home .entry-content.single-content > br:first-child {
  display: none;
}

body.home .ssu-daily-signup-cta {
  margin-top: 24px !important;
  margin-bottom: 12px !important;
}

.suw5 {
  --navy: var(--suw-coast-ink);
  --blue: var(--suw-coast-ocean);
  --gold: var(--suw-coast-sun);
  --sand: var(--suw-coast-sand);
  --text: #18394b;
  --muted: #607481;
  position: relative;
  isolation: isolate;
  width: 100%;
  padding: 18px clamp(12px, 2.4vw, 32px) 64px;
  color: var(--text) !important;
  font-family: "Sunnyside Noto Sans", system-ui, sans-serif !important;
  background: transparent !important;
}

.suw5::before {
  content: "";
  position: absolute;
  z-index: -1;
  top: 400px;
  left: 0;
  right: 0;
  height: 340px;
  pointer-events: none;
  opacity: .46;
  background:
    radial-gradient(ellipse at 18% 100%, rgba(255,255,255,.72) 0 43%, transparent 44%),
    radial-gradient(ellipse at 58% 100%, rgba(223,243,239,.72) 0 47%, transparent 48%),
    radial-gradient(ellipse at 92% 100%, rgba(243,229,200,.58) 0 42%, transparent 43%);
}

.suw5 h1,
.suw5 h2,
.suw5 h3 {
  font-family: "Sunnyside Noto Serif", Georgia, serif !important;
}

.suw5 > .suw5-hero {
  width: min(100%, 1320px);
  max-width: 1320px;
}

.suw5 > .suw5-panel,
.suw5 > .suw5-alerts-banner,
.suw5 > .suw5-alert-details,
.suw5 > #suw5-local-radar {
  width: min(100%, 1180px);
  max-width: 1180px;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Authentic photo, readable purpose, and a compact first impression. */
.suw5 .suw5-hero {
  min-height: clamp(430px, 55vw, 560px) !important;
  margin: 0 auto 24px !important;
  padding: clamp(34px, 7vw, 82px) clamp(24px, 6vw, 78px) !important;
  border-radius: 30px !important;
  background-position: center 56% !important;
  box-shadow: 0 24px 64px rgba(7, 54, 80, .22) !important;
}

.suw5 .suw5-hero .suw5-overlay {
  display: block !important;
  background:
    linear-gradient(90deg, rgba(4, 34, 50, .84) 0%, rgba(4, 43, 57, .58) 48%, rgba(4, 34, 50, .12) 82%),
    linear-gradient(0deg, rgba(4, 34, 50, .22), transparent 46%) !important;
}

.suw5 .suw5-hero-content-minimal {
  display: block !important;
  position: relative !important;
  z-index: 2 !important;
  width: 100% !important;
  max-width: 830px !important;
  margin: 0 !important;
  text-align: left !important;
  color: #fff !important;
  text-shadow: 0 2px 24px rgba(0,0,0,.28) !important;
}

.suw5 .suw5-hero-content-minimal h1,
.suw5 .suw5-hero-content-minimal p {
  display: block !important;
}

.suw5 .suw5-hero-content-minimal h1 {
  max-width: 820px;
  margin: 14px 0 18px !important;
  font-size: clamp(44px, 5vw, 68px) !important;
  line-height: 1.01 !important;
  letter-spacing: -.052em !important;
  color: #fff !important;
}

.suw5 .suw5-hero-content-minimal p {
  max-width: 620px;
  margin: 0 0 26px !important;
  color: rgba(255,255,255,.92) !important;
  font-size: clamp(17px, 2vw, 21px) !important;
  line-height: 1.5 !important;
  font-weight: 700 !important;
}

.suw5-hero-live {
  display: inline-flex !important;
  align-items: center;
  gap: 9px;
  padding: 8px 12px;
  border: 1px solid rgba(255,255,255,.30);
  border-radius: 999px;
  background: rgba(5, 47, 62, .38);
  color: #fff;
  font-size: 13px;
  line-height: 1;
  font-weight: 900;
  letter-spacing: .045em;
  text-transform: uppercase;
  backdrop-filter: blur(8px);
}

.suw5-hero-live i {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: #7be7a2;
  box-shadow: 0 0 0 5px rgba(123,231,162,.15);
}

.suw5-hero-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
}

.suw5 .suw5-hero-actions .suw5-button {
  padding: 14px 21px !important;
  background: var(--suw-coast-sun) !important;
  color: #112d3b !important;
  border: 1px solid rgba(255,255,255,.32) !important;
  box-shadow: 0 12px 30px rgba(0,0,0,.19) !important;
}

.suw5-hero-secondary {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 13px 18px;
  border: 1px solid rgba(255,255,255,.42);
  border-radius: 999px;
  color: #fff !important;
  background: rgba(255,255,255,.10);
  text-decoration: none !important;
  font-weight: 900;
  backdrop-filter: blur(7px);
}

.suw5-hero-secondary:hover {
  background: rgba(255,255,255,.18);
  transform: translateY(-1px);
}

.suw5-hero-location {
  position: absolute;
  z-index: 2;
  right: 24px;
  bottom: 20px;
  color: rgba(255,255,255,.82);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .05em;
  text-shadow: 0 2px 12px rgba(0,0,0,.35);
}

/* Calm section surfaces establish hierarchy without hiding any data. */
.suw5 .suw5-panel {
  border: 1px solid rgba(255,255,255,.80) !important;
  border-radius: 26px !important;
  background: rgba(255,255,255,.86) !important;
  box-shadow: var(--suw-coast-shadow) !important;
  backdrop-filter: blur(10px);
}

.suw5 .suw5-section-head {
  align-items: center !important;
  margin-bottom: 22px !important;
}

.suw5 .suw5-section-head h2,
.suw5 .suw5-marine-title {
  color: var(--suw-coast-ink) !important;
  font-size: clamp(29px, 3.3vw, 43px) !important;
  line-height: 1.04 !important;
  letter-spacing: -.035em !important;
}

.suw5 .suw5-alerts-banner {
  margin-top: 0 !important;
  backdrop-filter: blur(10px);
}

.suw5 .suw5-alerts-banner.suw5-alerts-neutral {
  border-color: rgba(13,111,128,.18) !important;
  background: rgba(255,255,255,.82) !important;
}

/* The Beach Outlook is now the first decision-focused section after alerts. */
.suw5 .suw5-beach-now-v1098 {
  scroll-margin-top: 92px;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none;
}

.suw5 .suw5-right-now-card-v1098 {
  background:
    radial-gradient(circle at 85% 18%, rgba(255,255,255,.17), transparent 28%),
    linear-gradient(145deg, #073650, #0d7182 72%, #1591a0) !important;
}

.suw5 .suw5-right-now-card-v1098,
.suw5 .suw5-beach-score-card-v1098 {
  border: 1px solid rgba(255,255,255,.18) !important;
  box-shadow: 0 22px 48px rgba(7,54,80,.18) !important;
}

.suw5 .suw5-beach-conditions-card-v1098 {
  padding: 24px !important;
  border-color: rgba(18,54,74,.10) !important;
  background: rgba(255,255,255,.91) !important;
  box-shadow: 0 16px 38px rgba(7,54,80,.09) !important;
}

.suw5 .suw5-beach-condition-grid-v1098 {
  gap: 1px !important;
  overflow: hidden;
  border: 1px solid var(--suw-coast-line);
  border-radius: 18px;
  background: var(--suw-coast-line);
}

.suw5 .suw5-beach-condition-grid-v1098 > div {
  min-height: 112px;
  border: 0 !important;
  border-radius: 0 !important;
  background: rgba(255,255,255,.94) !important;
}

.suw5 .suw5-beach-condition-grid-v1098 > .suw5-lightning-watch {
  background: #fff7e6 !important;
  box-shadow: inset 0 4px 0 #f59f00;
}

.suw5 .suw5-beach-condition-grid-v1098 > .suw5-lightning-danger {
  background: #fff0f0 !important;
  box-shadow: inset 0 4px 0 #d64545;
}

/* One cohesive observation board replaces the floating-tile effect. */
.suw5 .suw5-dashboard {
  overflow: hidden;
  background:
    linear-gradient(135deg, rgba(255,255,255,.94), rgba(234,247,251,.84)) !important;
}

.suw5 .suw5-metrics {
  gap: 1px !important;
  overflow: hidden;
  padding: 1px;
  border: 1px solid var(--suw-coast-line);
  border-radius: 21px;
  background: var(--suw-coast-line);
}

.suw5 .suw5-metrics .suw5-metric,
.suw5 .suw5-metrics .suw5-metric.suw5-wind {
  border: 0 !important;
  border-radius: 0 !important;
  background: rgba(255,255,255,.95) !important;
  box-shadow: none !important;
  transition: background .18s ease, transform .18s ease !important;
}

.suw5 .suw5-metrics .suw5-metric:hover {
  z-index: 1;
  background: #f2fbfb !important;
  transform: translateY(-1px) !important;
}

.suw5 .suw5-metrics .suw5-icon {
  filter: saturate(.84);
}

.suw5 .suw5-metrics .suw5-value {
  color: var(--suw-coast-ocean) !important;
}

/* Alternating atmospheric sections. */
.suw5 .suw5-home-forecast-preview,
.suw5 .suw5-forecast-panel {
  background:
    radial-gradient(circle at 92% 10%, rgba(110,207,218,.17), transparent 18rem),
    linear-gradient(135deg, rgba(255,255,255,.96), rgba(234,247,251,.90)) !important;
}

.suw5 #suw5-local-radar {
  background:
    radial-gradient(circle at 8% 12%, rgba(232,174,54,.13), transparent 17rem),
    linear-gradient(135deg, rgba(255,253,248,.97), rgba(243,229,200,.50)) !important;
}

.suw5 .suw5-ltb-two-region-panel {
  background:
    radial-gradient(circle at 90% 12%, rgba(223,243,239,.75), transparent 22rem),
    linear-gradient(145deg, rgba(255,255,255,.97), rgba(244,250,248,.91)) !important;
}

.suw5 .suw5-history-teaser-v1133 {
  background:
    linear-gradient(135deg, rgba(255,255,255,.96), rgba(243,229,200,.44)) !important;
}

.suw5 .suw5-history-mini-grid {
  gap: 1px !important;
  overflow: hidden;
  border: 1px solid var(--suw-coast-line);
  border-radius: 18px;
  background: var(--suw-coast-line);
}

.suw5 .suw5-history-mini-grid article {
  border: 0 !important;
  border-radius: 0 !important;
  background: rgba(255,255,255,.94) !important;
}

.suw5 .suw5-todays-obx-v1204 {
  background:
    radial-gradient(circle at 90% 8%, rgba(110,207,218,.17), transparent 22rem),
    linear-gradient(135deg, rgba(255,255,255,.97), rgba(223,243,239,.60)) !important;
}

/* Surf and Marine becomes the deep-ocean visual anchor. */
.suw5 .suw5-panel.suw5-marine,
.suw5 .suw5-marine {
  position: relative;
  overflow: hidden;
  padding: clamp(24px, 3vw, 34px) !important;
  border-color: rgba(255,255,255,.16) !important;
  background:
    radial-gradient(circle at 88% 12%, rgba(70,184,193,.32), transparent 24rem),
    linear-gradient(145deg, #062f49 0%, #084f67 55%, #0d7280 100%) !important;
  box-shadow: 0 24px 60px rgba(6,47,73,.23) !important;
}

.suw5 .suw5-marine::after {
  content: "";
  position: absolute;
  left: -4%;
  right: -4%;
  bottom: -52px;
  height: 120px;
  opacity: .13;
  pointer-events: none;
  background:
    radial-gradient(ellipse at 20% 0%, transparent 0 48%, #fff 50% 54%, transparent 56%),
    radial-gradient(ellipse at 66% 0%, transparent 0 48%, #fff 50% 54%, transparent 56%);
  background-size: 190px 80px;
}

.suw5 .suw5-marine-title,
.suw5 .suw5-marine-title::after {
  position: relative;
  z-index: 1;
  color: #fff !important;
}

.suw5 .suw5-marine-title::after {
  color: rgba(255,255,255,.78) !important;
}

.suw5 .suw5-surfline-card-v2122,
.suw5 .suw5-surfline-nearby {
  position: relative;
  z-index: 1;
  border: 1px solid rgba(255,255,255,.18) !important;
  background: rgba(255,255,255,.93) !important;
  box-shadow: 0 14px 34px rgba(0,0,0,.14) !important;
}

.suw5 .suw5-surfline-live-status {
  position: relative;
  z-index: 2;
  margin: 0 0 12px;
  padding: 10px 14px;
  border: 1px solid rgba(255,255,255,.22);
  border-radius: 999px;
  background: rgba(255,255,255,.12);
  color: #fff;
  font-size: 13px;
  line-height: 1.35;
  font-weight: 800;
  backdrop-filter: blur(8px);
}

.suw5 .suw5-marine-grid,
.suw5 .suw5-links {
  position: relative;
  z-index: 1;
}

.suw5 .suw5-marine-grid > div,
.suw5 .suw5-marine-grid > a {
  border-color: rgba(255,255,255,.30) !important;
  background: rgba(255,255,255,.95) !important;
  box-shadow: 0 10px 26px rgba(0,0,0,.13) !important;
}

.suw5 .suw5-marine .suw5-links a {
  background: var(--suw-coast-sun) !important;
  color: #123245 !important;
  box-shadow: none !important;
}

/* The station story closes the page with a warm dune-like surface. */
.suw5 .suw5-station {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(ellipse at 92% 108%, rgba(230,194,128,.52) 0 24%, transparent 25%),
    radial-gradient(ellipse at 68% 112%, rgba(243,229,200,.88) 0 32%, transparent 33%),
    linear-gradient(135deg, rgba(255,253,248,.98), rgba(243,229,200,.64)) !important;
}

.suw5 .suw5-features span {
  border-color: rgba(13,111,128,.13) !important;
  background: rgba(255,255,255,.66) !important;
}

.suw5 .suw5-beachcam-home-card {
  background:
    radial-gradient(circle at 88% 18%, rgba(110,207,218,.18), transparent 16rem),
    linear-gradient(135deg, rgba(255,255,255,.97), rgba(234,247,251,.88)) !important;
}

@media (max-width: 900px) {
  .suw5 {
    padding-left: 12px !important;
    padding-right: 12px !important;
  }

  .suw5 .suw5-hero {
    min-height: 500px !important;
    background-position: center 54% !important;
  }

  .suw5 .suw5-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 680px) {
  body.home,
  body:has(.suw5) {
    background-attachment: scroll !important;
  }

  .suw5 {
    padding-top: 10px !important;
  }

  .suw5 .suw5-hero {
    min-height: 510px !important;
    padding: 34px 22px 44px !important;
    border-radius: 22px !important;
    background-position: 54% 55% !important;
  }

  .suw5 .suw5-hero .suw5-overlay {
    background: linear-gradient(0deg, rgba(4,34,50,.84), rgba(4,43,57,.43) 72%, rgba(4,34,50,.18)) !important;
  }

  .suw5 .suw5-hero-content-minimal {
    align-self: flex-end;
    text-align: left !important;
  }

  .suw5 .suw5-hero-content-minimal h1 {
    font-size: clamp(42px, 14vw, 61px) !important;
  }

  .suw5-hero-actions {
    display: grid;
    grid-template-columns: 1fr;
  }

  .suw5 .suw5-hero-actions a {
    justify-content: center;
    text-align: center;
  }

  .suw5-hero-location {
    display: none;
  }

  .suw5 .suw5-panel {
    border-radius: 20px !important;
  }

  .suw5 .suw5-beach-condition-grid-v1098,
  .suw5 .suw5-marine-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 430px) {
  .suw5 .suw5-metrics,
  .suw5 .suw5-beach-condition-grid-v1098,
  .suw5 .suw5-marine-grid {
    grid-template-columns: 1fr !important;
  }
}

/* V2.5.18: editorial section flow. The information architecture is unchanged,
   but related readings now share continuous bands and hairline dividers instead
   of appearing as a stack of floating cards. */
.suw5 > .suw5-panel,
.suw5 > .suw5-alerts-banner,
.suw5 > .suw5-alert-details,
.suw5 > #suw5-local-radar {
  width: min(100%, 1280px) !important;
  max-width: 1280px !important;
}

.suw5 .suw5-panel:not(.suw5-beach-now-v1098):not(.suw5-marine) {
  padding: clamp(28px, 4vw, 48px) clamp(18px, 4vw, 48px) !important;
  border: 0 !important;
  border-top: 1px solid rgba(18,54,74,.15) !important;
  border-bottom: 1px solid rgba(18,54,74,.15) !important;
  border-radius: 0 !important;
  background: rgba(255,255,255,.70) !important;
  box-shadow: none !important;
  backdrop-filter: blur(14px);
}

.suw5 .suw5-home-forecast-preview,
.suw5 .suw5-forecast-panel,
.suw5 #suw5-local-radar,
.suw5 .suw5-ltb-two-region-panel,
.suw5 .suw5-history-teaser-v1133,
.suw5 .suw5-todays-obx-v1204,
.suw5 .suw5-station,
.suw5 .suw5-beachcam-home-card {
  background: rgba(255,255,255,.70) !important;
  box-shadow: none !important;
}

/* Today at a glance reads as one three-part feature rather than three cards. */
.suw5 .suw5-beach-now-v1098 {
  gap: 0 !important;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.55) !important;
  border-radius: 20px !important;
  background: rgba(255,255,255,.82) !important;
  box-shadow: 0 16px 42px rgba(7,54,80,.10) !important;
}

.suw5 .suw5-right-now-card-v1098,
.suw5 .suw5-beach-score-card-v1098,
.suw5 .suw5-beach-conditions-card-v1098 {
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

.suw5 .suw5-right-now-card-v1098 {
  border-right: 1px solid rgba(255,255,255,.22) !important;
}

.suw5 .suw5-beach-conditions-card-v1098 {
  border-top: 1px solid rgba(18,54,74,.12) !important;
  background: rgba(255,255,255,.78) !important;
}

/* Observation collections use a shared baseline with dividers. */
.suw5 .suw5-metrics,
.suw5 .suw5-beach-condition-grid-v1098,
.suw5 .suw5-history-mini-grid {
  gap: 0 !important;
  padding: 0 !important;
  overflow: hidden;
  border: 0 !important;
  border-top: 1px solid rgba(18,54,74,.14) !important;
  border-bottom: 1px solid rgba(18,54,74,.14) !important;
  border-radius: 0 !important;
  background: transparent !important;
}

.suw5 .suw5-metrics .suw5-metric,
.suw5 .suw5-metrics .suw5-metric.suw5-wind,
.suw5 .suw5-beach-condition-grid-v1098 > div,
.suw5 .suw5-history-mini-grid article {
  min-height: 122px !important;
  border: 0 !important;
  border-right: 1px solid rgba(18,54,74,.11) !important;
  border-bottom: 1px solid rgba(18,54,74,.11) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.suw5 .suw5-metrics .suw5-metric:hover {
  background: rgba(223,243,239,.45) !important;
  transform: none !important;
}

/* Forecast and safety narratives become columns in a single editorial row. */
.suw5 .suw5-home-forecast-preview-grid,
.suw5 .suw5-ltb-region-grid,
.suw5 .suw5-ltb-extra-grid {
  gap: 0 !important;
  border-top: 1px solid rgba(18,54,74,.14);
  border-bottom: 1px solid rgba(18,54,74,.14);
}

.suw5 .suw5-trip-day-card,
.suw5 .suw5-ltb-region-panel,
.suw5 .suw5-ltb-extra-panel {
  border: 0 !important;
  border-right: 1px solid rgba(18,54,74,.12) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.suw5 .suw5-ltb-region-panel {
  border-left: 5px solid #17824b !important;
}

.suw5 .suw5-ltb-region-panel.suw5-ltb-risk-moderate,
.suw5 .suw5-ltb-region-panel.suw5-ltb-risk-unknown {
  border-left-color: #d09a27 !important;
}

/* Today's Outer Banks is a magazine-style summary with internal rules. */
.suw5 .suw5-obx-grid-v1204 {
  gap: 0 !important;
  border-top: 1px solid rgba(18,54,74,.14);
}

.suw5 .suw5-obx-card-v1204 {
  border: 0 !important;
  border-right: 1px solid rgba(18,54,74,.12) !important;
  border-bottom: 1px solid rgba(18,54,74,.12) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.suw5 .suw5-obx-stat-grid-v1204 {
  gap: 0 !important;
}

.suw5 .suw5-obx-stat-grid-v1204 div {
  border: 0 !important;
  border-top: 1px solid rgba(18,54,74,.10) !important;
  border-radius: 0 !important;
  background: transparent !important;
}

.suw5 .suw5-obx-photo-v1204 {
  margin-top: 18px;
  border: 0 !important;
  border-radius: 12px !important;
  box-shadow: none !important;
}

/* Marine data forms one continuous instrument panel. */
.suw5 .suw5-panel.suw5-marine,
.suw5 .suw5-marine {
  padding: clamp(30px, 4vw, 48px) !important;
  border-radius: 18px !important;
  box-shadow: none !important;
}

.suw5 .suw5-surfline-live-block {
  overflow: hidden;
  margin-top: 20px;
  border-radius: 12px;
  background: rgba(255,255,255,.93);
}

.suw5 .suw5-surfline-card-v2122,
.suw5 .suw5-surfline-nearby {
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.suw5 .suw5-surfline-nearby {
  border-top: 1px solid rgba(18,54,74,.12) !important;
}

.suw5 .suw5-surfline-nearby-grid {
  gap: 0 !important;
  border-top: 1px solid rgba(18,54,74,.10);
}

.suw5 .suw5-surfline-nearby-card {
  border: 0 !important;
  border-right: 1px solid rgba(18,54,74,.10) !important;
  border-radius: 0 !important;
  background: transparent !important;
}

.suw5 .suw5-surfline-nearby-fallback {
  opacity: 1 !important;
}

.suw5 .suw5-marine-grid {
  gap: 0 !important;
  margin-top: 22px !important;
  border-top: 1px solid rgba(255,255,255,.25);
  border-bottom: 1px solid rgba(255,255,255,.25);
}

.suw5 .suw5-marine-grid > div,
.suw5 .suw5-marine-grid > a {
  min-height: 116px !important;
  padding: 18px 10px !important;
  border: 0 !important;
  border-right: 1px solid rgba(255,255,255,.18) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.suw5 .suw5-marine-grid > div:hover,
.suw5 .suw5-marine-grid > a:hover {
  background: rgba(255,255,255,.07) !important;
  transform: none !important;
  box-shadow: none !important;
}

.suw5 .suw5-marine-grid > div > span,
.suw5 .suw5-marine-grid > a > span {
  color: #8ed9df !important;
}

.suw5 .suw5-marine-grid > div > strong,
.suw5 .suw5-marine-grid > a > strong,
.suw5 .suw5-marine-grid > div > em,
.suw5 .suw5-marine-grid > a > em,
.suw5 .suw5-marine-grid > div > em span,
.suw5 .suw5-marine-grid > a > em span {
  color: #fff !important;
}

.suw5 .suw5-marine-grid > div > em,
.suw5 .suw5-marine-grid > a > em {
  opacity: .74;
}

.suw5 .suw5-marine .suw5-links {
  gap: 0 !important;
  margin-top: 18px !important;
  border-top: 1px solid rgba(255,255,255,.18);
}

.suw5 .suw5-marine .suw5-links a {
  padding: 12px 16px 8px 0 !important;
  border: 0 !important;
  border-bottom: 2px solid rgba(232,174,54,.75) !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #fff !important;
  box-shadow: none !important;
}

@media (max-width: 900px) {
  .suw5 .suw5-beach-now-v1098 {
    grid-template-columns: 1fr !important;
  }

  .suw5 .suw5-right-now-card-v1098 {
    border-right: 0 !important;
    border-bottom: 1px solid rgba(255,255,255,.22) !important;
  }

  .suw5 .suw5-home-forecast-preview-grid,
  .suw5 .suw5-ltb-region-grid,
  .suw5 .suw5-ltb-extra-grid {
    grid-template-columns: 1fr !important;
  }

  .suw5 .suw5-trip-day-card,
  .suw5 .suw5-ltb-region-panel,
  .suw5 .suw5-ltb-extra-panel {
    border-right: 0 !important;
    border-bottom: 1px solid rgba(18,54,74,.12) !important;
  }
}

@media (max-width: 680px) {
  .suw5 .suw5-panel:not(.suw5-beach-now-v1098):not(.suw5-marine) {
    padding: 26px 16px !important;
  }

  .suw5 .suw5-surfline-nearby-card,
  .suw5 .suw5-marine-grid > div,
  .suw5 .suw5-marine-grid > a {
    border-right: 0 !important;
    border-bottom: 1px solid rgba(18,54,74,.12) !important;
  }

  .suw5 .suw5-marine-grid > div,
  .suw5 .suw5-marine-grid > a {
    border-bottom-color: rgba(255,255,255,.18) !important;
  }
}

/* V2.5.19: one persistent site title/navigation system on every page. */
.site-header,
header.site-header,
#masthead.site-header {
  position: sticky !important;
  top: 0 !important;
  z-index: 9990 !important;
  background: rgba(255,255,255,.94) !important;
  border-bottom: 1px solid rgba(18,54,74,.10) !important;
  box-shadow: 0 8px 28px rgba(7,54,80,.08) !important;
  backdrop-filter: blur(15px);
}

body.admin-bar .site-header,
body.admin-bar header.site-header,
body.admin-bar #masthead.site-header {
  top: 32px !important;
}

.site-header .site-branding .brand,
.site-header .site-title,
header.site-header .site-title {
  color: var(--suw-coast-ink) !important;
  font-family: "Sunnyside Noto Sans", system-ui, sans-serif !important;
  font-weight: 900 !important;
  letter-spacing: -.035em !important;
  text-decoration: none !important;
}

.site-header .suw5-main-clean-nav,
header .suw5-main-clean-nav,
#masthead .suw5-main-clean-nav {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  flex-wrap: nowrap !important;
  gap: clamp(11px, 1.45vw, 24px) !important;
}

.site-header .suw5-main-clean-nav > a,
header .suw5-main-clean-nav > a,
#masthead .suw5-main-clean-nav > a {
  position: relative;
  display: inline-flex !important;
  align-items: center !important;
  min-height: 44px;
  padding: 7px 0 !important;
  margin: 0 !important;
  color: var(--suw-coast-ink) !important;
  font-size: clamp(12px, 1.03vw, 15px) !important;
  line-height: 1.2 !important;
  font-weight: 850 !important;
  text-decoration: none !important;
  white-space: nowrap !important;
}

nav.mobile-navigation.suw5-main-clean-nav,
#mobile-site-navigation.suw5-main-clean-nav {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 0 !important;
}

nav.mobile-navigation.suw5-main-clean-nav > a,
#mobile-site-navigation.suw5-main-clean-nav > a {
  display: flex !important;
  min-height: 48px;
  align-items: center;
  padding: 10px 18px !important;
  border-bottom: 1px solid rgba(255,255,255,.14);
  color: #fff !important;
  font-weight: 850;
  text-decoration: none !important;
}

nav.mobile-navigation.suw5-main-clean-nav > a.is-current,
#mobile-site-navigation.suw5-main-clean-nav > a.is-current {
  color: #f3cd72 !important;
}

.site-header .suw5-main-clean-nav > a::after,
header .suw5-main-clean-nav > a::after,
#masthead .suw5-main-clean-nav > a::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 4px;
  height: 2px;
  border-radius: 2px;
  background: transparent;
}

.site-header .suw5-main-clean-nav > a:hover::after,
.site-header .suw5-main-clean-nav > a.is-current::after,
header .suw5-main-clean-nav > a:hover::after,
header .suw5-main-clean-nav > a.is-current::after,
#masthead .suw5-main-clean-nav > a:hover::after,
#masthead .suw5-main-clean-nav > a.is-current::after {
  background: var(--suw-coast-sun);
}

/* The homepage is now a decision hub, not a duplicate of every detail page. */
.suw5-home-compact-v2519 .suw5-hero {
  min-height: clamp(380px, 43vw, 500px) !important;
}

.suw5-beach-score-detail-link-v2519 {
  display: inline-flex;
  margin-top: 14px;
  color: #fff !important;
  font-size: 14px;
  line-height: 1.4;
  font-weight: 900;
  text-decoration: none !important;
  border-bottom: 2px solid rgba(255,255,255,.56);
}

.suw5-home-directory-v2519 .suw5-section-head p {
  margin: 6px 0 0;
  color: var(--suw-coast-muted, #607481);
}

.suw5-home-directory-links-v2519 {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  border-top: 1px solid rgba(18,54,74,.14);
  border-bottom: 1px solid rgba(18,54,74,.14);
}

.suw5-home-directory-links-v2519 a {
  display: grid;
  grid-template-columns: 1fr auto;
  grid-template-rows: auto auto;
  gap: 3px 16px;
  min-width: 0;
  padding: 19px 20px !important;
  border-right: 1px solid rgba(18,54,74,.12);
  border-bottom: 1px solid rgba(18,54,74,.12);
  color: var(--suw-coast-ink) !important;
  background: transparent !important;
  text-decoration: none !important;
}

.suw5-home-directory-links-v2519 a:hover {
  background: rgba(223,243,239,.52) !important;
}

.suw5-home-directory-links-v2519 span {
  font-size: 18px;
  line-height: 1.25;
  font-weight: 900;
}

.suw5-home-directory-links-v2519 small {
  color: #607481;
  font-size: 13px;
  line-height: 1.4;
}

.suw5-home-directory-links-v2519 b {
  grid-column: 2;
  grid-row: 1 / span 2;
  align-self: center;
  color: var(--suw-coast-ocean);
  font-size: 22px;
}

.suw5-home-compact-v2519 > .ssu-daily-signup-cta {
  order: 100;
  max-width: 1280px !important;
  margin: 20px auto 0 !important;
  padding: 0 !important;
}

.suw5-beach-conditions-page #beach-outlook,
.suw5-beach-conditions-page #ocean-safety,
.suw5-beach-conditions-page #surf-and-marine {
  scroll-margin-top: 120px;
}

.suw5-marine-intro-v2519 {
  position: relative;
  z-index: 1;
  max-width: 760px;
  margin: 7px 0 0;
  color: rgba(255,255,255,.76);
  font-weight: 700;
}

.suw5-current-page .suw5-radar-panel,
.suw5-current-page .suw5-history-teaser-v1133,
.suw5-current-page .suw5-station-detail-v2519 {
  margin-top: 18px !important;
}

/* V2.5.21: one consistent observation grid on Current Weather. */
.suw5-current-page .suw5-current-observations-v2521 {
  padding: 0 !important;
  overflow: hidden !important;
}

.suw5-current-page .suw5-current-grid-unified-v2521 {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 0 !important;
  align-items: stretch !important;
}

.suw5-current-page .suw5-current-grid-unified-v2521 > div,
.suw5-current-page .suw5-current-grid-unified-v2521 > div.suw5-current-wind {
  display: grid !important;
  grid-template-rows: 40px minmax(52px, auto) minmax(40px, auto) !important;
  align-content: center !important;
  justify-items: center !important;
  min-width: 0 !important;
  min-height: 178px !important;
  max-height: none !important;
  height: auto !important;
  padding: 20px 14px !important;
  overflow: hidden !important;
  border: 0 !important;
  border-right: 1px solid rgba(18,54,74,.11) !important;
  border-bottom: 1px solid rgba(18,54,74,.11) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.suw5-current-page .suw5-current-grid-unified-v2521 > div > span:first-child {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 !important;
  font-size: 28px !important;
  line-height: 1 !important;
}

.suw5-current-page .suw5-current-grid-unified-v2521 strong {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  max-width: 100% !important;
  margin: 0 !important;
  color: var(--suw-coast-ocean) !important;
  font-family: "Sunnyside Noto Sans", system-ui, sans-serif !important;
  font-size: clamp(24px, 2.25vw, 34px) !important;
  line-height: 1.08 !important;
  font-weight: 900 !important;
  letter-spacing: -.035em !important;
  overflow-wrap: normal !important;
  word-break: normal !important;
  white-space: nowrap !important;
}

.suw5-current-page .suw5-current-grid-unified-v2521 .suw5-current-value-long-v2521 {
  gap: 6px;
  font-size: clamp(21px, 1.85vw, 29px) !important;
}

.suw5-current-page .suw5-current-grid-unified-v2521 strong span,
.suw5-current-page .suw5-current-grid-unified-v2521 em span {
  display: inline !important;
  margin: 0 !important;
  font: inherit !important;
  line-height: inherit !important;
}

.suw5-current-page .suw5-current-grid-unified-v2521 em {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: center !important;
  align-content: center !important;
  gap: 3px !important;
  min-width: 0 !important;
  margin: 0 !important;
  color: #607481 !important;
  font-family: "Sunnyside Noto Sans", system-ui, sans-serif !important;
  font-size: 13px !important;
  line-height: 1.3 !important;
  font-style: normal !important;
  font-weight: 800 !important;
  text-align: center !important;
}

.suw5-current-page .suw5-current-grid-unified-v2521 .suw5-current-air-quality strong {
  flex-wrap: wrap !important;
  gap: 4px !important;
}

.suw5-current-page .suw5-current-grid-unified-v2521 .suw5-current-air-quality strong small {
  font-size: 10px !important;
  letter-spacing: 0 !important;
}

.suw5-current-page .suw5-current-grid-unified-v2521 .suw5-current-air-quality em {
  flex-direction: column !important;
  flex-wrap: nowrap !important;
}

/* Image-led safety guidance shares one row; the short timing note sits below. */
.suw5 .suw5-ltb-extra-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  align-items: start !important;
}

.suw5 .suw5-ltb-low-tide-panel {
  grid-column: 1 / -1 !important;
}

.suw5 .suw5-ltb-rip-safety-panel img.suw5-rip-current-safety-img,
.suw5 .suw5-ltb-rip-image-panel img.suw5-rip-risk-map-img {
  width: 100% !important;
  max-width: 480px !important;
  max-height: 420px !important;
  object-fit: contain !important;
}

@media (max-width: 1000px) {
  .suw5-current-page .suw5-current-grid-unified-v2521 {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 760px) {
  .suw5-current-page .suw5-current-grid-unified-v2521 {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .suw5 .suw5-ltb-extra-grid {
    grid-template-columns: 1fr !important;
  }

  .suw5 .suw5-ltb-low-tide-panel {
    grid-column: auto !important;
  }
}

.suw5-back-to-top-v2519 {
  position: fixed;
  z-index: 9980;
  right: 18px;
  bottom: 18px;
  min-height: 42px;
  padding: 9px 14px;
  border: 1px solid rgba(255,255,255,.50);
  border-radius: 999px;
  color: #fff;
  background: rgba(7,54,80,.90);
  box-shadow: 0 10px 28px rgba(7,54,80,.24);
  font-size: 13px;
  font-weight: 900;
  cursor: pointer;
  opacity: 0;
  pointer-events: none;
  transform: translateY(8px);
  transition: opacity .18s ease, transform .18s ease;
  backdrop-filter: blur(8px);
}

.suw5-back-to-top-v2519.is-visible {
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0);
}

@media (max-width: 782px) {
  body.admin-bar .site-header,
  body.admin-bar header.site-header,
  body.admin-bar #masthead.site-header {
    top: 46px !important;
  }
}

@media (max-width: 760px) {
  .suw5-home-directory-links-v2519 {
    grid-template-columns: 1fr;
  }

  .suw5-home-directory-links-v2519 a {
    border-right: 0;
  }

}

@media (prefers-reduced-motion: reduce) {
  .suw5 *,
  .suw5 *::before,
  .suw5 *::after {
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
  }
}


/* V2.5.27 — OBX Beach & Weather app integration */
.suw5-global-app-promo-v2527 {
  position: relative;
  z-index: 90;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  width: min(1180px, calc(100% - 28px));
  margin: 14px auto 0;
  padding: 12px 14px;
  border: 1px solid rgba(255,255,255,.62);
  border-radius: 20px;
  background: linear-gradient(115deg, rgba(7,54,80,.96), rgba(13,107,143,.92));
  box-shadow: 0 14px 36px rgba(7,54,80,.18);
  color: #fff;
  backdrop-filter: blur(12px);
}
.suw5-global-app-brand-v2527 { display:flex;align-items:center;gap:12px;min-width:0;color:#fff!important;text-decoration:none!important; }
.suw5-global-app-brand-v2527 > span { display:grid;gap:2px;min-width:0; }
.suw5-global-app-brand-v2527 strong { font-size:16px;line-height:1.15;font-weight:900;letter-spacing:-.015em; }
.suw5-global-app-brand-v2527 small { color:rgba(255,255,255,.78);font-size:12px;font-weight:800; }
.suw5-global-app-actions-v2527 { display:flex;align-items:center;gap:8px;flex:0 0 auto; }
.suw5-global-app-learn-v2527,.suw5-global-app-download-v2527 { display:inline-flex;align-items:center;justify-content:center;min-height:40px;padding:9px 14px;border-radius:999px;font-size:12px;font-weight:900;text-decoration:none!important;white-space:nowrap; }
.suw5-global-app-learn-v2527 { border:1px solid rgba(255,255,255,.38);color:#fff!important;background:rgba(255,255,255,.08); }
.suw5-global-app-download-v2527 { color:#073650!important;background:#fff;box-shadow:0 8px 20px rgba(0,0,0,.14); }
.suw5-app-icon-v2527 { display:block;object-fit:cover;background:#dceef5;box-shadow:0 10px 24px rgba(4,40,60,.18); }
.suw5-app-icon-v2527.is-global { width:50px;height:50px;border-radius:12px;flex:0 0 50px; }
.suw5-app-icon-fallback-v2527 { display:flex;align-items:center;justify-content:center;color:#fff;background:linear-gradient(145deg,#258fb7,#073650);font-weight:950;letter-spacing:-.05em; }

.suw5-app-page-v2527 { width:min(1180px,calc(100% - 28px));margin:18px auto 48px; }
.suw5-app-hero-v2527 { position:relative;overflow:hidden;display:grid;grid-template-columns:minmax(0,1.35fr) minmax(260px,.65fr);gap:34px;align-items:center;padding:clamp(34px,6vw,76px);border-radius:34px;color:#fff;background:linear-gradient(125deg,rgba(6,49,73,.98),rgba(17,124,159,.92));box-shadow:0 24px 68px rgba(7,54,80,.20); }
.suw5-app-hero-v2527:after { content:"";position:absolute;width:420px;height:420px;right:-130px;top:-180px;border-radius:50%;background:rgba(255,255,255,.08); }
.suw5-app-hero-copy-v2527,.suw5-app-hero-icon-wrap-v2527 { position:relative;z-index:1; }
.suw5-app-kicker-v2527 { margin-bottom:10px;color:#a9e3f2;font-size:12px;font-weight:950;letter-spacing:.16em; }
.suw5-app-hero-v2527 h1 { margin:0;color:#fff!important;font-size:clamp(40px,6vw,72px)!important;line-height:.96!important;letter-spacing:-.055em!important;font-weight:950!important; }
.suw5-app-lead-v2527 { max-width:730px;margin:22px 0 0;color:rgba(255,255,255,.88);font-size:clamp(17px,2vw,22px);line-height:1.55;font-weight:650; }
.suw5-app-proof-v2527 { display:flex;flex-wrap:wrap;gap:8px 11px;margin:22px 0;color:#fff;font-size:14px;letter-spacing:.015em; }
.suw5-app-proof-v2527 span { color:#8fd6e8; }
.suw5-app-actions-v2527 { display:flex;flex-wrap:wrap;gap:10px;align-items:center; }
.suw5-app-store-button-v2527 { display:inline-flex;align-items:center;gap:10px;min-height:58px;padding:9px 17px;border-radius:14px;color:#fff!important;background:#050505;text-decoration:none!important;box-shadow:0 10px 26px rgba(0,0,0,.22); }
.suw5-app-store-button-v2527 span:last-child { display:grid;line-height:1; }
.suw5-app-store-button-v2527 small { font-size:10px;font-weight:700;letter-spacing:.01em; }
.suw5-app-store-button-v2527 strong { margin-top:3px;font-size:21px;line-height:1;font-weight:700; }
.suw5-app-store-apple-v2527 { width:24px;height:24px;border-radius:50%;font-size:0;background:linear-gradient(180deg,#fff,#d8d8d8); }
.suw5-app-secondary-button-v2527 { display:inline-flex;align-items:center;min-height:58px;padding:12px 18px;border:1px solid rgba(255,255,255,.38);border-radius:14px;color:#fff!important;background:rgba(255,255,255,.08);font-weight:900;text-decoration:none!important; }
.suw5-app-hero-icon-wrap-v2527 { display:grid;justify-items:center;gap:14px;text-align:center;color:rgba(255,255,255,.78);font-size:12px;font-weight:900; }
.suw5-app-icon-v2527.is-hero { width:min(260px,72vw);height:auto;aspect-ratio:1/1;border-radius:28%;box-shadow:0 28px 70px rgba(0,0,0,.28); }

.suw5-app-update-v265 { display:grid;grid-template-columns:minmax(250px,.78fr) minmax(0,1.22fr);gap:28px;align-items:center;margin-top:26px;padding:clamp(24px,3.5vw,38px);border:1px solid rgba(18,54,74,.10);border-radius:28px;background:linear-gradient(135deg,#edf9fc,#fff 58%,#f5fbf4);box-shadow:0 16px 44px rgba(7,54,80,.08); }
.suw5-app-update-heading-v265 > span { display:inline-flex;padding:7px 10px;border-radius:999px;color:#07536e;background:rgba(16,146,184,.13);font-size:11px;font-weight:950;letter-spacing:.12em; }
.suw5-app-update-heading-v265 h2 { margin:12px 0 10px;color:#073650!important;font-size:clamp(27px,3.2vw,36px)!important;line-height:1.08!important;letter-spacing:-.035em!important; }
.suw5-app-update-heading-v265 p { max-width:480px;margin:0;color:#526b77;font-size:15px;line-height:1.55;font-weight:650; }
.suw5-app-update-grid-v265 { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px; }
.suw5-app-update-grid-v265 article { display:grid;grid-template-columns:auto minmax(0,1fr);gap:12px;align-items:center;padding:16px 17px;border:1px solid rgba(18,54,74,.09);border-radius:18px;background:rgba(255,255,255,.82);box-shadow:0 8px 22px rgba(7,54,80,.05); }
.suw5-app-update-grid-v265 strong { display:block;color:#073650;font-size:15px;line-height:1.2; }
.suw5-app-update-grid-v265 p { margin:3px 0 0;color:#526b77;font-size:12.5px;line-height:1.4;font-weight:650; }
.suw5-app-update-icon-v21420 { display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:12px;color:#07536e;background:rgba(16,146,184,.12);font-size:15px;font-weight:950;line-height:1;letter-spacing:-.02em; }

.suw5-app-feature-section-v2527,.suw5-app-screens-v2527 { margin-top:26px;padding:clamp(26px,4vw,48px);border:1px solid rgba(18,54,74,.09);border-radius:28px;background:rgba(255,255,255,.92);box-shadow:0 16px 44px rgba(7,54,80,.08); }
.suw5-app-section-heading-v2527 { max-width:760px;margin-bottom:24px; }
.suw5-app-section-heading-v2527 > span { color:#1783a7;font-size:12px;font-weight:950;letter-spacing:.12em;text-transform:uppercase; }
.suw5-app-section-heading-v2527 h2 { margin:6px 0 0;color:#073650!important;font-size:clamp(27px,4vw,42px)!important;line-height:1.08!important;letter-spacing:-.035em!important; }
.suw5-app-feature-grid-v2527 { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px; }
.suw5-app-feature-grid-v2527 article { padding:22px;border:1px solid rgba(18,54,74,.09);border-radius:20px;background:linear-gradient(180deg,#fff,#f7fbfd); }
.suw5-app-feature-grid-v2527 article > span { font-size:27px; }
.suw5-app-feature-grid-v2527 h3 { margin:10px 0 7px;color:#073650;font-size:18px; }
.suw5-app-feature-grid-v2527 p { margin:0;color:#526b77;line-height:1.55;font-size:14px;font-weight:650; }
.suw5-app-screenshot-row-v2527 { display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;align-items:start; }
.suw5-app-screenshot-row-v2527 img { width:100%;height:auto;border-radius:20px;box-shadow:0 14px 32px rgba(7,54,80,.14); }
.suw5-app-download-panel-v2527 { display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:20px;align-items:center;margin-top:26px;padding:24px;border-radius:24px;color:#fff;background:linear-gradient(115deg,#0b5c7c,#1493b9);box-shadow:0 16px 44px rgba(7,54,80,.14); }
.suw5-app-download-platforms-v21419 { display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:10px; }
.suw5-google-play-button-v21419 { display:inline-flex;align-items:center;justify-content:center;padding:0!important;background:transparent!important;box-shadow:none!important;border:0!important;border-radius:0!important;min-height:0!important;text-decoration:none!important; }
.suw5-google-play-button-v21419 img { display:block;width:216px!important;height:auto!important;max-width:100%!important;border:0!important;border-radius:0!important;box-shadow:none!important; }
.suw5-app-icon-v2527.is-download { width:88px;height:88px;border-radius:22px; }
.suw5-app-download-panel-v2527 span { font-size:11px;font-weight:950;letter-spacing:.12em; }
.suw5-app-download-panel-v2527 h2 { margin:3px 0;color:#fff!important;font-size:25px!important; }
.suw5-app-download-panel-v2527 p { margin:0;color:rgba(255,255,255,.8);font-weight:650; }
.suw5-organization-panel-v2527 { margin-top:26px;padding:24px 28px;border-left:5px solid #1590b5;border-radius:16px;background:rgba(255,255,255,.90);box-shadow:0 12px 34px rgba(7,54,80,.07); }
.suw5-organization-panel-v2527 h2 { margin:0 0 7px;color:#073650!important;font-size:21px!important; }
.suw5-organization-panel-v2527 p { margin:7px 0;color:#4b6470;line-height:1.6; }

.suw5-organization-footer-v2527 { width:min(1180px,calc(100% - 28px));margin:18px auto 8px;padding:16px 18px;border-top:1px solid rgba(18,54,74,.14);border-bottom:1px solid rgba(18,54,74,.14);color:#526b77;background:rgba(255,255,255,.68); }
.suw5-organization-footer-inner-v2527 { display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:6px 12px;text-align:center;font-size:12px;line-height:1.5; }
.suw5-organization-footer-inner-v2527 strong { color:#073650; }
.suw5-organization-footer-inner-v2527 a { color:#0c7da2!important;font-weight:900;text-decoration:none!important; }
.suw5-privacy-operator-v2527 { margin:0 0 24px;padding:16px 18px;border-left:4px solid #138eb4;border-radius:12px;background:#f0f8fb;color:#264b5c;line-height:1.55; }

@media (max-width: 920px) {
  .suw5-global-app-promo-v2527 { align-items:flex-start; }
  .suw5-global-app-actions-v2527 { flex-direction:column;align-items:stretch; }
  .suw5-app-hero-v2527 { grid-template-columns:1fr; }
  .suw5-app-update-v265 { grid-template-columns:1fr; }
  .suw5-app-hero-icon-wrap-v2527 { grid-row:1; }
  .suw5-app-feature-grid-v2527 { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .suw5-app-screenshot-row-v2527 { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .suw5-app-download-panel-v2527 { grid-template-columns:auto 1fr; }
  .suw5-app-download-platforms-v21419 { grid-column:1/-1;justify-content:flex-start; }
}
@media (max-width: 620px) {
  .suw5-global-app-promo-v2527 { width:calc(100% - 18px);margin-top:9px;padding:10px;border-radius:16px; }
  .suw5-global-app-brand-v2527 small { display:none; }
  .suw5-global-app-brand-v2527 strong { font-size:14px; }
  .suw5-app-icon-v2527.is-global { width:42px;height:42px;flex-basis:42px;border-radius:10px; }
  .suw5-global-app-learn-v2527 { display:none; }
  .suw5-global-app-download-v2527 { min-height:38px;padding:8px 11px;font-size:10px; }
  .suw5-app-page-v2527 { width:calc(100% - 18px);margin-top:10px; }
  .suw5-app-hero-v2527 { padding:30px 20px;border-radius:24px;gap:24px; }
  .suw5-app-hero-v2527 h1 { font-size:42px!important; }
  .suw5-app-update-v265,.suw5-app-feature-section-v2527,.suw5-app-screens-v2527 { padding:22px 16px;border-radius:22px; }
  .suw5-app-update-grid-v265 { grid-template-columns:1fr; }
  .suw5-app-feature-grid-v2527 { grid-template-columns:1fr; }
  .suw5-app-screenshot-row-v2527 { display:flex;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:8px; }
  .suw5-app-screenshot-row-v2527 img { width:72vw;max-width:300px;flex:0 0 auto;scroll-snap-align:start; }
  .suw5-app-download-panel-v2527 { grid-template-columns:1fr;padding:20px; }
  .suw5-app-icon-v2527.is-download { width:72px;height:72px; }
  .suw5-app-download-platforms-v21419 { grid-column:auto;justify-content:flex-start; }
  .suw5-google-play-button-v21419 img { width:216px!important;height:auto!important; }
}

.suw5-app-store-button-v2527 { padding:0!important;background:transparent!important;box-shadow:none!important;border-radius:0!important;min-height:0!important; }
.suw5-app-store-button-v2527 img { display:block;width:180px!important;height:auto!important;max-width:100%!important;border:0!important;border-radius:0!important;box-shadow:none!important; }

/* V2.5.28 — dedicated App page shell repair.
 * The App page supplies its own bounded layout; remove the theme's duplicate
 * page-title/content constraints without changing other site pages. */
body.suw5-is-app-page-v2528 main .entry-header,
body.suw5-is-app-page-v2528 main .page-header,
body.suw5-is-app-page-v2528 main .entry-title,
body.suw5-is-app-page-v2528 main .page-title,
body.suw5-is-app-page-v2528 main .wp-block-post-title,
body.suw5-is-app-page-v2528 article > header.entry-header {
  display: none !important;
}

body.suw5-is-app-page-v2528 main#primary,
body.suw5-is-app-page-v2528 .site-main,
body.suw5-is-app-page-v2528 .content-area,
body.suw5-is-app-page-v2528 article.page,
body.suw5-is-app-page-v2528 .entry-content {
  width: 100% !important;
  max-width: none !important;
}

body.suw5-is-app-page-v2528 article.page,
body.suw5-is-app-page-v2528 .entry-content {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

body.suw5-is-app-page-v2528 .entry-content {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* The dedicated page hero is the promotion here; the smaller site-wide banner
 * is intentionally suppressed on /app/ to avoid a redundant stacked CTA. */
body.suw5-is-app-page-v2528 #suw5-global-app-promo-v2527 {
  display: none !important;
}

/* Keep the App page breathing room aligned with the site's 1180px content shell. */
body.suw5-is-app-page-v2528 .suw5-app-page-v2527 {
  margin-top: 22px !important;
}

@media (max-width: 620px) {
  body.suw5-is-app-page-v2528 .suw5-app-page-v2527 {
    margin-top: 10px !important;
  }
}


/* V2.5.29 — App landing-page polish. Keep the emoji feature icons by design. */

/* V2.5.30 — Navigation correction.
 * "Get the App" behaves like every other navigation item on ordinary pages.
 * The teal CTA treatment is reserved for the active /app/ page only. */
.site-header .suw5-main-clean-nav > a[href*="/app/"]:not(.is-current),
header .suw5-main-clean-nav > a[href*="/app/"]:not(.is-current),
#masthead .suw5-main-clean-nav > a[href*="/app/"]:not(.is-current) {
  color: var(--suw-coast-ink) !important;
  background: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
}
.site-header .suw5-main-clean-nav > a[href*="/app/"].is-current,
header .suw5-main-clean-nav > a[href*="/app/"].is-current,
#masthead .suw5-main-clean-nav > a[href*="/app/"].is-current {
  color: #fff !important;
  background: linear-gradient(120deg,#0e789b,#16a0c3) !important;
  border-color: transparent !important;
  box-shadow: 0 5px 14px rgba(10,105,137,.18) !important;
  padding-left: 10px !important;
  padding-right: 10px !important;
}

/* Kadence supplies generous top padding around ordinary page content. The app
 * landing page already has its own spacing, so tighten only the top edge while
 * leaving the rest of the theme shell intact. */
body.suw5-is-app-page-v2528 .entry-content-wrap {
  padding-top: 42px !important;
}
body.suw5-is-app-page-v2528 .suw5-app-page-v2527 {
  margin-top: 0 !important;
}

@media (max-width: 620px) {
  body.suw5-is-app-page-v2528 .entry-content-wrap {
    padding-top: 22px !important;
  }
  body.suw5-is-app-page-v2528 .suw5-app-page-v2527 {
    margin-top: 0 !important;
  }
}

/* ================================================================
 * V2.7.30 — Phase 1 professional site shell
 * Presentation/navigation only. No weather, score, REST or app-data logic.
 * ================================================================ */
:root {
  --suw-shell-radius-section: 20px;
  --suw-shell-radius-card: 14px;
  --suw-shell-radius-button: 999px;
  --suw-shell-border: rgba(18,54,74,.12);
  --suw-shell-shadow: 0 14px 38px rgba(7,54,80,.09);
  --suw-shell-max: 1180px;
}

/* A quieter, thinner sticky header. */
.site-header,
header.site-header,
#masthead.site-header {
  min-height: 68px !important;
  background: rgba(255,255,255,.965) !important;
  border-bottom: 1px solid var(--suw-shell-border) !important;
  box-shadow: 0 5px 20px rgba(7,54,80,.07) !important;
}

.site-header .site-branding,
header.site-header .site-branding,
#masthead .site-branding {
  display: grid !important;
  align-content: center !important;
  gap: 1px !important;
}

.suw5-home-station-note-v2730 {
  display: block;
  color: #687f8b;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 10px;
  line-height: 1.15;
  font-weight: 800;
  letter-spacing: .065em;
  text-transform: uppercase;
  white-space: nowrap;
}

.site-header .suw5-phase1-nav-v2730,
header .suw5-phase1-nav-v2730,
#masthead .suw5-phase1-nav-v2730 {
  gap: clamp(9px, 1.15vw, 19px) !important;
}

.site-header .suw5-phase1-nav-v2730 > a,
header .suw5-phase1-nav-v2730 > a,
#masthead .suw5-phase1-nav-v2730 > a {
  min-height: 40px !important;
  font-size: clamp(11px, .96vw, 14px) !important;
  letter-spacing: -.01em;
}

/* App and rental are visually separated from informational navigation. */
.site-header .suw5-phase1-nav-v2730 > a.is-app,
header .suw5-phase1-nav-v2730 > a.is-app,
#masthead .suw5-phase1-nav-v2730 > a.is-app {
  padding: 8px 13px !important;
  border-radius: var(--suw-shell-radius-button) !important;
  color: #fff !important;
  background: linear-gradient(120deg,#0c718f,#118cab) !important;
  box-shadow: 0 5px 14px rgba(10,105,137,.16) !important;
}

.site-header .suw5-phase1-nav-v2730 > a.is-stay,
header .suw5-phase1-nav-v2730 > a.is-stay,
#masthead .suw5-phase1-nav-v2730 > a.is-stay {
  padding: 7px 12px !important;
  border: 1px solid rgba(18,54,74,.22) !important;
  border-radius: var(--suw-shell-radius-button) !important;
}

.site-header .suw5-phase1-nav-v2730 > a.is-app::after,
.site-header .suw5-phase1-nav-v2730 > a.is-stay::after,
header .suw5-phase1-nav-v2730 > a.is-app::after,
header .suw5-phase1-nav-v2730 > a.is-stay::after,
#masthead .suw5-phase1-nav-v2730 > a.is-app::after,
#masthead .suw5-phase1-nav-v2730 > a.is-stay::after {
  display: none !important;
}

/* Standardize the visual language across all plugin panels. */
.suw5 .suw5-panel,
.suw5 .suw5-alerts-banner,
.suw5 .suw5-alert-details,
.suw5 .suw5-ltb-card,
.suw5 .suw5-forecast-card,
.suw5 .suw5-current-card {
  border-color: var(--suw-shell-border) !important;
}

.suw5 .suw5-panel {
  border-radius: var(--suw-shell-radius-section) !important;
}

.suw5 button,
.suw5 .button,
.suw5 a[class*="button"],
.suw5 a[class*="cta"] {
  transition: transform .16s ease, box-shadow .16s ease, background-color .16s ease;
}
.suw5 button:hover,
.suw5 .button:hover,
.suw5 a[class*="button"]:hover,
.suw5 a[class*="cta"]:hover {
  transform: translateY(-1px);
}

/* Replace the small legal strip with a proper professional footer. */
.suw5-organization-footer-v2527.suw5-professional-footer-v2730 {
  width: 100% !important;
  max-width: none !important;
  margin: 34px 0 0 !important;
  padding: 0 !important;
  border: 0 !important;
  color: rgba(255,255,255,.82) !important;
  background: linear-gradient(135deg,#072f46 0%,#0a4e64 58%,#0b6273 100%) !important;
  box-shadow: 0 -12px 34px rgba(7,54,80,.10);
}

.suw5-professional-footer-inner-v2730 {
  display: grid;
  grid-template-columns: 1.55fr .72fr .72fr 1fr;
  gap: clamp(24px,4vw,58px);
  width: min(var(--suw-shell-max), calc(100% - 40px));
  margin: 0 auto;
  padding: 42px 0 34px;
}

.suw5-professional-footer-brand-v2730,
.suw5-professional-footer-about-v2730,
.suw5-professional-footer-links-v2730 {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  margin: 0;
}

.suw5-professional-footer-brand-v2730 > strong {
  color: #fff;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(24px,2.5vw,32px);
  line-height: 1.08;
  letter-spacing: -.025em;
}
.suw5-professional-footer-brand-v2730 > span {
  color: #fff;
  font-size: 15px;
  font-weight: 800;
}
.suw5-professional-footer-brand-v2730 > small {
  max-width: 420px;
  color: rgba(255,255,255,.67);
  font-size: 12px;
  line-height: 1.6;
}

.suw5-professional-footer-links-v2730 > strong,
.suw5-professional-footer-about-v2730 > strong {
  margin-bottom: 3px;
  color: #f0bd50;
  font-size: 12px;
  font-weight: 950;
  letter-spacing: .09em;
  text-transform: uppercase;
}
.suw5-professional-footer-links-v2730 a {
  color: rgba(255,255,255,.84) !important;
  font-size: 13px;
  font-weight: 750;
  text-decoration: none !important;
}
.suw5-professional-footer-links-v2730 a:hover {
  color: #fff !important;
  text-decoration: underline !important;
  text-underline-offset: 4px;
}
.suw5-professional-footer-about-v2730 span {
  color: rgba(255,255,255,.70);
  font-size: 12px;
  line-height: 1.55;
}

.suw5-professional-footer-legal-v2730 {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 8px 18px;
  padding: 15px 20px 18px;
  border-top: 1px solid rgba(255,255,255,.12);
  color: rgba(255,255,255,.58);
  font-size: 11px;
  line-height: 1.4;
}
.suw5-professional-footer-legal-v2730 a {
  color: rgba(255,255,255,.78) !important;
  text-decoration: none !important;
}

/* The custom footer replaces the theme credit/footer, including Kadence branding. */
body:not(.wp-admin) footer.site-footer,
body:not(.wp-admin) #colophon.site-footer {
  display: none !important;
}

/* Contact/counter becomes a clean pre-footer utility rather than floating content. */
.suw5-global-contact-bottom {
  margin-top: 30px !important;
  margin-bottom: 0 !important;
  padding-bottom: 24px !important;
}

@media (max-width: 1040px) {
  .suw5-home-station-note-v2730 { display:none; }
  .site-header .suw5-phase1-nav-v2730,
  header .suw5-phase1-nav-v2730,
  #masthead .suw5-phase1-nav-v2730 { gap: 9px !important; }
  .suw5-professional-footer-inner-v2730 { grid-template-columns: 1.4fr 1fr 1fr; }
  .suw5-professional-footer-about-v2730 { grid-column: 1 / -1; }
}

@media (max-width: 760px) {
  .suw5-professional-footer-inner-v2730 {
    grid-template-columns: 1fr 1fr;
    width: min(100% - 30px, 620px);
    padding: 34px 0 28px;
    gap: 26px 22px;
  }
  .suw5-professional-footer-brand-v2730,
  .suw5-professional-footer-about-v2730 { grid-column: 1 / -1; }
  nav.mobile-navigation.suw5-phase1-nav-v2730 > a.is-app,
  #mobile-site-navigation.suw5-phase1-nav-v2730 > a.is-app,
  nav.mobile-navigation.suw5-phase1-nav-v2730 > a.is-stay,
  #mobile-site-navigation.suw5-phase1-nav-v2730 > a.is-stay {
    margin: 7px 12px !important;
    justify-content: center;
  }
}

@media (max-width: 480px) {
  .suw5-professional-footer-inner-v2730 { grid-template-columns: 1fr; }
  .suw5-professional-footer-brand-v2730,
  .suw5-professional-footer-about-v2730 { grid-column: auto; }
}

/* ================================================================
 * V2.8.0 — Phase 2 homepage experience
 * Presentation only. Uses data already loaded by the existing homepage.
 * No REST, app payload, provider, score, cache, Windy or API changes.
 * ================================================================ */

/* Give the homepage a more deliberate editorial rhythm. */
.suw5-home-compact-v2519 {
  --suw-280-navy:#0a3348;
  --suw-280-teal:#0e7885;
  --suw-280-gold:#d7a53e;
  --suw-280-sky:#eaf6f8;
  --suw-280-sand:#fbf7ed;
}

.suw5-home-compact-v2519 .suw5-hero {
  min-height: clamp(500px, 64vh, 690px) !important;
  border-radius: 0 0 28px 28px !important;
  box-shadow: 0 22px 55px rgba(7,54,80,.16) !important;
}
.suw5-home-compact-v2519 .suw5-hero .suw5-overlay {
  background: linear-gradient(90deg,rgba(4,29,43,.70) 0%,rgba(4,29,43,.38) 48%,rgba(4,29,43,.12) 100%) !important;
}
.suw5-home-compact-v2519 .suw5-hero-content-minimal {
  max-width: 720px !important;
  padding-bottom: 118px !important;
}
.suw5-home-compact-v2519 .suw5-hero-content-minimal h1 {
  font-size: clamp(48px,6.3vw,82px) !important;
  line-height: .98 !important;
  letter-spacing: -.045em !important;
  text-shadow: 0 3px 18px rgba(0,0,0,.25);
}
.suw5-home-compact-v2519 .suw5-hero-content-minimal p {
  max-width: 640px !important;
  font-size: clamp(17px,1.7vw,22px) !important;
  line-height: 1.55 !important;
  color: rgba(255,255,255,.92) !important;
}
.suw5-home-compact-v2519 .suw5-hero-live {
  background: rgba(7,45,61,.52) !important;
  border: 1px solid rgba(255,255,255,.25) !important;
  backdrop-filter: blur(8px);
  padding: 8px 12px !important;
  border-radius: 999px !important;
}

/* Live quick-read bar inside the hero: no additional requests. */
.suw5-hero-quick-v280 {
  position:absolute;
  z-index:3;
  left:50%;
  bottom:22px;
  transform:translateX(-50%);
  display:grid;
  grid-template-columns:repeat(4,minmax(115px,1fr));
  width:min(900px,calc(100% - 56px));
  overflow:hidden;
  border:1px solid rgba(255,255,255,.25);
  border-radius:18px;
  background:rgba(5,38,54,.68);
  box-shadow:0 14px 35px rgba(0,0,0,.18);
  backdrop-filter:blur(12px);
}
.suw5-hero-quick-v280 > div {
  display:flex;
  align-items:baseline;
  justify-content:center;
  gap:9px;
  min-height:64px;
  padding:12px 16px;
  color:#fff;
  border-right:1px solid rgba(255,255,255,.14);
}
.suw5-hero-quick-v280 > div:last-child {border-right:0;}
.suw5-hero-quick-v280 span {font-size:11px;font-weight:850;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.68);}
.suw5-hero-quick-v280 strong {font-size:18px;font-weight:900;color:#fff;white-space:nowrap;}
.suw5-home-compact-v2519 .suw5-hero-location {bottom:94px !important;}

/* Alerts become a slim information rail rather than another large card. */
.suw5-home-compact-v2519 .suw5-alerts-banner {
  margin-top:26px !important;
  min-height:64px !important;
  padding:12px 18px !important;
  border-radius:14px !important;
  box-shadow:none !important;
}
.suw5-home-compact-v2519 .suw5-alerts-copy strong {font-size:14px !important;}
.suw5-home-compact-v2519 .suw5-alerts-copy span {font-size:12px !important;opacity:.76;}

/* Today's Beach Dashboard now reads as one intentional module. */
.suw5 .suw5-beach-dashboard-v280 {
  position:relative;
  display:grid !important;
  grid-template-columns:minmax(0,.92fr) minmax(0,1.18fr) minmax(0,1.08fr) !important;
  gap:16px !important;
  padding:24px !important;
  background:linear-gradient(135deg,#f9fcfc 0%,#edf8f8 52%,#fbf7ed 100%) !important;
  border:1px solid rgba(11,86,104,.13) !important;
  box-shadow:0 18px 48px rgba(7,54,80,.09) !important;
}
.suw5-beach-dashboard-head-v280 {
  grid-column:1/-1;
  display:flex;
  align-items:end;
  justify-content:space-between;
  gap:24px;
  padding:0 2px 5px;
}
.suw5-beach-dashboard-head-v280 span {
  display:block;
  margin-bottom:4px;
  color:#a87c25;
  font-size:11px;
  font-weight:900;
  letter-spacing:.11em;
  text-transform:uppercase;
}
.suw5-beach-dashboard-head-v280 h2 {margin:0 !important;color:#0a3348 !important;font-size:clamp(27px,3vw,40px) !important;letter-spacing:-.025em;}
.suw5-beach-dashboard-head-v280 p {max-width:470px;margin:0 0 4px !important;color:#57727e !important;font-size:13px !important;line-height:1.55 !important;text-align:right;}
.suw5 .suw5-beach-dashboard-v280 > .suw5-right-now-card-v1098,
.suw5 .suw5-beach-dashboard-v280 > .suw5-beach-score-card-v1098,
.suw5 .suw5-beach-dashboard-v280 > .suw5-beach-conditions-card-v1098 {
  min-width:0;
  height:100%;
  border:1px solid rgba(18,54,74,.10) !important;
  border-radius:16px !important;
  box-shadow:0 8px 25px rgba(7,54,80,.06) !important;
  background:rgba(255,255,255,.92) !important;
}
.suw5 .suw5-beach-dashboard-v280 .suw5-right-now-temp-v1098 {font-size:clamp(54px,5vw,76px) !important;letter-spacing:-.055em;}
.suw5 .suw5-beach-dashboard-v280 .suw5-beach-score-number-v1098,
.suw5 .suw5-beach-dashboard-v280 [class*="score-number"] {font-size:clamp(48px,4.7vw,72px) !important;}
.suw5 .suw5-beach-dashboard-v280 .suw5-beach-condition-grid-v1098 {gap:8px !important;}
.suw5 .suw5-beach-dashboard-v280 .suw5-beach-condition-grid-v1098 > div {border-radius:12px !important;background:#f7fbfc !important;}

/* Explore becomes four visual navigation cards. */
.suw5-home-directory-v280 {
  padding:30px !important;
  background:linear-gradient(180deg,#fff 0%,#f5fbfc 100%) !important;
  box-shadow:0 15px 40px rgba(7,54,80,.07) !important;
}
.suw5-explore-kicker-v280 {display:block;margin-bottom:5px;color:#a87c25;font-size:11px;font-weight:900;letter-spacing:.11em;text-transform:uppercase;}
.suw5-explore-head-v280 h2 {margin-bottom:5px !important;}
.suw5-explore-head-v280 p {margin:0 !important;color:#627b86 !important;}
.suw5-home-directory-links-v280 {
  display:grid !important;
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  gap:13px !important;
}
.suw5-home-directory-links-v280 > a {
  position:relative;
  display:grid !important;
  grid-template-columns:1fr auto !important;
  grid-template-areas:"icon arrow" "title arrow" "copy arrow" !important;
  align-content:start;
  min-height:180px;
  padding:20px !important;
  border:1px solid rgba(18,54,74,.10) !important;
  border-radius:16px !important;
  background:#fff !important;
  box-shadow:0 7px 20px rgba(7,54,80,.05) !important;
  text-decoration:none !important;
}
.suw5-home-directory-links-v280 > a:hover {transform:translateY(-3px);box-shadow:0 15px 30px rgba(7,54,80,.10) !important;border-color:rgba(14,120,133,.28) !important;}
.suw5-home-directory-links-v280 > a i {grid-area:icon;display:grid;place-items:center;width:44px;height:44px;margin-bottom:16px;border-radius:13px;background:#eaf6f8;font-size:23px;font-style:normal;}
.suw5-home-directory-links-v280 > a span {grid-area:title;color:#0a3348 !important;font-size:18px !important;font-weight:900 !important;}
.suw5-home-directory-links-v280 > a small {grid-area:copy;margin-top:7px;color:#607984 !important;font-size:12px !important;line-height:1.55 !important;}
.suw5-home-directory-links-v280 > a b {grid-area:arrow;align-self:center;color:#0e7885 !important;font-size:22px !important;}

/* Forecast preview gets more breathing room and a gentle sky band. */
.suw5-home-compact-v2519 .suw5-home-forecast-preview {
  background:linear-gradient(180deg,#f4fbfd 0%,#fff 100%) !important;
  box-shadow:0 15px 40px rgba(7,54,80,.07) !important;
}

@media(max-width:980px){
  .suw5 .suw5-beach-dashboard-v280 {grid-template-columns:1fr 1fr !important;}
  .suw5 .suw5-beach-dashboard-v280 > .suw5-beach-conditions-card-v1098 {grid-column:1/-1;}
  .suw5-home-directory-links-v280 {grid-template-columns:1fr 1fr !important;}
}
@media(max-width:700px){
  .suw5-home-compact-v2519 .suw5-hero {min-height:560px !important;border-radius:0 0 20px 20px !important;}
  .suw5-home-compact-v2519 .suw5-hero-content-minimal {padding-bottom:185px !important;}
  .suw5-home-compact-v2519 .suw5-hero-location {bottom:160px !important;}
  .suw5-hero-quick-v280 {grid-template-columns:1fr 1fr;width:calc(100% - 28px);bottom:14px;border-radius:15px;}
  .suw5-hero-quick-v280 > div {min-height:56px;padding:9px 10px;border-bottom:1px solid rgba(255,255,255,.12);}
  .suw5-hero-quick-v280 > div:nth-child(2){border-right:0;}
  .suw5-hero-quick-v280 > div:nth-child(3),.suw5-hero-quick-v280 > div:nth-child(4){border-bottom:0;}
  .suw5-hero-quick-v280 strong{font-size:16px;}
  .suw5 .suw5-beach-dashboard-v280 {grid-template-columns:1fr !important;padding:18px !important;}
  .suw5 .suw5-beach-dashboard-v280 > .suw5-beach-conditions-card-v1098 {grid-column:auto;}
  .suw5-beach-dashboard-head-v280 {display:block;}
  .suw5-beach-dashboard-head-v280 p {margin-top:6px !important;text-align:left;}
  .suw5-home-directory-v280 {padding:20px !important;}
  .suw5-home-directory-links-v280 {grid-template-columns:1fr !important;}
  .suw5-home-directory-links-v280 > a {min-height:135px;}
}


/* ================================================================
   V2.8.1 — Phase 2 homepage presentation repair
   Presentation only. Restores intentional card contrast and fixes the
   nested Wind value styling in the hero quick-condition rail.
   ================================================================ */

/* Only style the direct label span. Nested data spans in the Wind value
   must inherit the same large white value treatment as Air/Surf/Water. */
.suw5-hero-quick-v280 > div > span {
  font-size:11px !important;
  font-weight:850 !important;
  letter-spacing:.08em !important;
  text-transform:uppercase !important;
  color:rgba(255,255,255,.68) !important;
}
.suw5-hero-quick-v280 > div > strong,
.suw5-hero-quick-v280 > div > strong > span {
  font-size:18px !important;
  font-weight:900 !important;
  letter-spacing:normal !important;
  text-transform:none !important;
  color:#fff !important;
  padding:0 !important;
  margin:0 !important;
  background:none !important;
  border:0 !important;
  border-radius:0 !important;
}

/* The dashboard works best as the proven two-column live/score layout,
   with the Beach Conditions rail spanning the full width below. */
.suw5 .suw5-beach-dashboard-v280 {
  grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr) !important;
  gap:16px !important;
}
.suw5 .suw5-beach-dashboard-v280 > .suw5-right-now-card-v1098 {
  grid-column:auto !important;
  color:#fff !important;
  background:radial-gradient(circle at 85% 18%,rgba(255,255,255,.17),transparent 28%),linear-gradient(145deg,#073650,#0d7182 72%,#1591a0) !important;
  border:1px solid rgba(255,255,255,.18) !important;
}
.suw5 .suw5-beach-dashboard-v280 > .suw5-beach-score-card-v1098 {
  grid-column:auto !important;
  color:#fff !important;
  border:1px solid rgba(255,255,255,.18) !important;
}
/* Preserve the score-state gradient so the card remains meaningful visually. */
.suw5 .suw5-beach-dashboard-v280 > .suw5-beach-score-card-v1098.suw5-score-excellent {background:linear-gradient(135deg,#126337,#2fa66a) !important;}
.suw5 .suw5-beach-dashboard-v280 > .suw5-beach-score-card-v1098.suw5-score-great {background:linear-gradient(135deg,#0b6778,#1592a8) !important;}
.suw5 .suw5-beach-dashboard-v280 > .suw5-beach-score-card-v1098.suw5-score-good {background:linear-gradient(135deg,#0a4f7d,#1f79b2) !important;}
.suw5 .suw5-beach-dashboard-v280 > .suw5-beach-score-card-v1098.suw5-score-fair {background:linear-gradient(135deg,#81650a,#c79a06) !important;}
.suw5 .suw5-beach-dashboard-v280 > .suw5-beach-score-card-v1098.suw5-score-poor {background:linear-gradient(135deg,#7b2f10,#c24b1f) !important;}
.suw5 .suw5-beach-dashboard-v280 > .suw5-beach-score-card-v1098.suw5-score-unavailable {background:linear-gradient(135deg,#52606b,#7b8790) !important;}
.suw5 .suw5-beach-dashboard-v280 > .suw5-beach-conditions-card-v1098 {
  grid-column:1 / -1 !important;
  color:#06213f !important;
  background:rgba(255,255,255,.94) !important;
  border:1px solid rgba(18,54,74,.10) !important;
}

/* Explicitly restore all text colors that inherited white from legacy cards. */
.suw5 .suw5-beach-dashboard-v280 .suw5-right-now-card-v1098 .suw5-kicker-v1098,
.suw5 .suw5-beach-dashboard-v280 .suw5-right-now-card-v1098 .suw5-right-now-temp-v1098,
.suw5 .suw5-beach-dashboard-v280 .suw5-right-now-card-v1098 .suw5-right-now-sub-v1098,
.suw5 .suw5-beach-dashboard-v280 .suw5-right-now-card-v1098 .suw5-weather-status-copy-v1100 strong,
.suw5 .suw5-beach-dashboard-v280 .suw5-right-now-card-v1098 .suw5-weather-status-copy-v1100 em,
.suw5 .suw5-beach-dashboard-v280 .suw5-right-now-card-v1098 .suw5-right-now-mini-v1098,
.suw5 .suw5-beach-dashboard-v280 .suw5-right-now-card-v1098 .suw5-right-now-mini-v1098 strong,
.suw5 .suw5-beach-dashboard-v280 .suw5-beach-score-card-v1098 h2,
.suw5 .suw5-beach-dashboard-v280 .suw5-beach-score-card-v1098 .suw5-recommendation-v1098,
.suw5 .suw5-beach-dashboard-v280 .suw5-beach-score-card-v1098 .suw5-score-lists-v1098,
.suw5 .suw5-beach-dashboard-v280 .suw5-beach-score-card-v1098 .suw5-score-confidence-v1099 {
  color:#fff !important;
}
.suw5 .suw5-beach-dashboard-v280 .suw5-beach-conditions-card-v1098,
.suw5 .suw5-beach-dashboard-v280 .suw5-beach-conditions-card-v1098 .suw5-kicker-v1098,
.suw5 .suw5-beach-dashboard-v280 .suw5-beach-conditions-card-v1098 strong,
.suw5 .suw5-beach-dashboard-v280 .suw5-beach-conditions-card-v1098 em,
.suw5 .suw5-beach-dashboard-v280 .suw5-beach-conditions-card-v1098 small {
  color:#06213f !important;
}

@media(max-width:700px){
  .suw5-hero-quick-v280 > div > strong,
  .suw5-hero-quick-v280 > div > strong > span {font-size:16px !important;}
  .suw5 .suw5-beach-dashboard-v280 {grid-template-columns:1fr !important;}
  .suw5 .suw5-beach-dashboard-v280 > .suw5-beach-conditions-card-v1098 {grid-column:auto !important;}
}

/* ================================================================
 * V2.9.0 — Noticeable visual redesign / information-first homepage
 * Presentation only. No source selection, API, REST, app, scoring,
 * marine, cache, Windy, or Reolink behavior is changed here.
 * ================================================================ */

/* HERO — keep the photography, but make the live data look like a product,
   not a small footer rail. Four distinct glass cards on desktop; 2x2 on mobile. */
.suw5-home-compact-v2519 .suw5-hero {
  overflow:hidden !important;
  border-radius:26px !important;
}
.suw5 .suw5-hero-quick-v290 {
  width:min(960px,calc(100% - 64px)) !important;
  bottom:24px !important;
  gap:10px !important;
  overflow:visible !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  backdrop-filter:none !important;
}
.suw5 .suw5-hero-quick-v290 > div {
  position:relative;
  min-height:82px !important;
  padding:15px 18px !important;
  flex-direction:column !important;
  align-items:flex-start !important;
  justify-content:center !important;
  gap:3px !important;
  border:1px solid rgba(255,255,255,.28) !important;
  border-radius:16px !important;
  background:linear-gradient(145deg,rgba(5,43,59,.78),rgba(10,68,83,.64)) !important;
  box-shadow:0 14px 30px rgba(0,0,0,.18) !important;
  backdrop-filter:blur(14px) !important;
}
.suw5 .suw5-hero-quick-v290 > div::after {
  content:"";
  position:absolute;
  left:18px;
  top:13px;
  width:22px;
  height:2px;
  border-radius:9px;
  background:#f0b438;
  opacity:.95;
}
.suw5 .suw5-hero-quick-v290 > div > span {
  margin-top:8px !important;
  font-size:11px !important;
  line-height:1 !important;
  letter-spacing:.13em !important;
  color:rgba(255,255,255,.72) !important;
}
.suw5 .suw5-hero-quick-v290 > div > strong,
.suw5 .suw5-hero-quick-v290 > div > strong > span {
  font-size:25px !important;
  line-height:1.08 !important;
  letter-spacing:-.025em !important;
  color:#fff !important;
}
.suw5 .suw5-hero-quick-v290 .suw5-hero-stat-wind-v290 > strong,
.suw5 .suw5-hero-quick-v290 .suw5-hero-stat-wind-v290 > strong > span {
  font-size:23px !important;
}
.suw5-home-compact-v2519 .suw5-hero-location {display:none !important;}

/* DASHBOARD — stronger hierarchy and less "old cards placed in a wrapper". */
.suw5 .suw5-beach-dashboard-v280 {
  padding:32px !important;
  gap:20px !important;
  border-radius:24px !important;
  background:linear-gradient(145deg,#f5fbfc 0%,#eef8f8 55%,#fff9ed 100%) !important;
  box-shadow:0 22px 55px rgba(7,54,80,.10) !important;
}
.suw5-beach-dashboard-head-v280 {
  padding:1px 4px 10px !important;
  border-bottom:1px solid rgba(11,86,104,.12);
}
.suw5-beach-dashboard-head-v280 h2 {
  font-size:clamp(34px,3.4vw,48px) !important;
  letter-spacing:-.038em !important;
}
.suw5-beach-dashboard-head-v280 p {
  font-size:14px !important;
  max-width:510px !important;
}
.suw5 .suw5-beach-dashboard-v280 > .suw5-right-now-card-v1098,
.suw5 .suw5-beach-dashboard-v280 > .suw5-beach-score-card-v1098 {
  border-radius:22px !important;
  padding:30px !important;
  box-shadow:0 16px 35px rgba(7,54,80,.13) !important;
}
.suw5 .suw5-beach-dashboard-v280 > .suw5-right-now-card-v1098 {
  background:radial-gradient(circle at 85% 8%,rgba(255,255,255,.18),transparent 30%),linear-gradient(150deg,#07364f 0%,#086274 58%,#1494a0 100%) !important;
}
.suw5 .suw5-beach-dashboard-v280 .suw5-right-now-temp-v1098 {
  font-size:clamp(72px,7vw,104px) !important;
  line-height:.86 !important;
  margin-top:10px !important;
}
.suw5 .suw5-beach-dashboard-v280 .suw5-right-now-sub-v1098 {
  margin-top:14px !important;
  font-size:19px !important;
  font-weight:750 !important;
}
.suw5 .suw5-beach-dashboard-v280 .suw5-weather-status-v1100 {
  margin:25px 0 20px !important;
  padding:0 !important;
}
.suw5 .suw5-beach-dashboard-v280 .suw5-weather-status-icon-v1100 {
  font-size:3.55rem !important;
}
.suw5 .suw5-beach-dashboard-v280 .suw5-weather-status-copy-v1100 strong {
  font-size:1.35rem !important;
}
.suw5 .suw5-beach-dashboard-v280 .suw5-weather-status-copy-v1100 em {
  font-size:.92rem !important;
  opacity:.82 !important;
}

/* Current data is an obvious six-cell grid, never hidden in tiny pills. */
.suw5 .suw5-now-grid-v290 {
  display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:9px !important;
  margin-top:18px !important;
}
.suw5 .suw5-now-grid-v290 > span {
  display:flex !important;
  width:auto !important;
  min-height:72px;
  padding:11px 12px !important;
  border:1px solid rgba(255,255,255,.13) !important;
  border-radius:13px !important;
  background:rgba(255,255,255,.10) !important;
  flex-direction:column !important;
  align-items:flex-start !important;
  justify-content:center !important;
  gap:3px !important;
}
.suw5 .suw5-now-grid-v290 > span > em {
  display:block;
  margin:0 !important;
  color:rgba(255,255,255,.68) !important;
  font-size:10px !important;
  font-style:normal !important;
  font-weight:900 !important;
  line-height:1 !important;
  letter-spacing:.09em !important;
  text-transform:uppercase !important;
}
.suw5 .suw5-now-grid-v290 > span > strong,
.suw5 .suw5-now-grid-v290 > span > strong > span {
  display:inline !important;
  width:auto !important;
  padding:0 !important;
  margin:0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  color:#fff !important;
  font-size:18px !important;
  font-weight:900 !important;
  line-height:1.15 !important;
}

/* Beach Score: show the number first. The score was always calculated; this is
   presentation only and makes the answer obvious at a glance. */
.suw5 .suw5-score-number-v290 {
  display:flex;
  align-items:flex-end;
  gap:5px;
  margin:10px 0 0;
  color:#fff;
}
.suw5 .suw5-score-number-v290 strong {
  font-family:"Sunnyside Noto Serif",Georgia,serif !important;
  font-size:clamp(64px,6.2vw,92px) !important;
  line-height:.82 !important;
  letter-spacing:-.065em !important;
  color:#fff !important;
}
.suw5 .suw5-score-number-v290 span {
  padding-bottom:7px;
  color:rgba(255,255,255,.76) !important;
  font-size:17px !important;
  font-weight:900 !important;
}
.suw5 .suw5-beach-dashboard-v280 .suw5-stars-v1098 {
  margin:15px 0 4px !important;
  font-size:1.4rem !important;
}
.suw5 .suw5-beach-dashboard-v280 .suw5-beach-score-card-v1098 h2 {
  max-width:660px;
  margin:5px 0 10px !important;
  font-size:clamp(28px,3vw,42px) !important;
  line-height:1.03 !important;
  letter-spacing:-.025em !important;
}
.suw5 .suw5-beach-dashboard-v280 .suw5-recommendation-v1098 {
  font-size:1.03rem !important;
  line-height:1.52 !important;
}
.suw5 .suw5-beach-dashboard-v280 .suw5-score-lists-v1098 > div {
  background:rgba(255,255,255,.14) !important;
  border:1px solid rgba(255,255,255,.10) !important;
}

/* Beach conditions: values, not icons, are the visual priority. */
.suw5 .suw5-beach-dashboard-v280 > .suw5-beach-conditions-card-v1098 {
  border-radius:20px !important;
  padding:24px !important;
}
.suw5 .suw5-beach-dashboard-v280 .suw5-beach-condition-grid-v1098 {
  gap:10px !important;
  margin-top:15px !important;
}
.suw5 .suw5-beach-dashboard-v280 .suw5-beach-condition-grid-v1098 > div {
  min-height:120px !important;
  padding:15px 10px !important;
  border:1px solid rgba(10,72,90,.08) !important;
  border-top-width:4px !important;
  background:linear-gradient(180deg,#fff 0%,#f3f9fa 100%) !important;
  box-shadow:0 7px 18px rgba(7,54,80,.045) !important;
}
.suw5 .suw5-beach-dashboard-v280 .suw5-beach-condition-grid-v1098 span {
  font-size:1.25rem !important;
  opacity:.9;
}
.suw5 .suw5-beach-dashboard-v280 .suw5-beach-condition-grid-v1098 em {
  font-size:.68rem !important;
  font-weight:850 !important;
  letter-spacing:.08em !important;
}
.suw5 .suw5-beach-dashboard-v280 .suw5-beach-condition-grid-v1098 strong {
  margin-top:2px !important;
  font-size:1.32rem !important;
  font-weight:950 !important;
}

/* MOBILE — information-first. Key numbers become materially larger and the hero
   is shorter so the decision dashboard arrives sooner. */
@media(max-width:700px){
  .suw5-home-compact-v2519 .suw5-hero {
    min-height:760px !important;
    padding:26px 18px 214px !important;
    border-radius:0 0 20px 20px !important;
    background-position:center 52% !important;
  }
  .suw5-home-compact-v2519 .suw5-hero-content-minimal {
    padding-bottom:0 !important;
  }
  .suw5-home-compact-v2519 .suw5-hero-content-minimal h1 {
    margin:18px 0 18px !important;
    font-size:clamp(49px,14vw,63px) !important;
    line-height:.98 !important;
  }
  .suw5-home-compact-v2519 .suw5-hero-content-minimal p {
    margin-bottom:20px !important;
    font-size:17px !important;
    line-height:1.5 !important;
  }
  .suw5-home-compact-v2519 .suw5-hero-actions {
    gap:9px !important;
  }
  .suw5-home-compact-v2519 .suw5-hero-actions .suw5-button,
  .suw5-home-compact-v2519 .suw5-hero-secondary {
    min-height:52px !important;
    padding:12px 15px !important;
    font-size:15px !important;
  }
  .suw5 .suw5-hero-quick-v290 {
    grid-template-columns:1fr 1fr !important;
    width:calc(100% - 28px) !important;
    bottom:14px !important;
    gap:8px !important;
  }
  .suw5 .suw5-hero-quick-v290 > div {
    min-height:86px !important;
    padding:13px 14px !important;
    border-radius:14px !important;
  }
  .suw5 .suw5-hero-quick-v290 > div::after {left:14px;top:12px;width:20px;}
  .suw5 .suw5-hero-quick-v290 > div > span {
    margin-top:8px !important;
    font-size:11px !important;
  }
  .suw5 .suw5-hero-quick-v290 > div > strong,
  .suw5 .suw5-hero-quick-v290 > div > strong > span {
    font-size:29px !important;
    line-height:1 !important;
  }
  .suw5 .suw5-hero-quick-v290 .suw5-hero-stat-wind-v290 > strong,
  .suw5 .suw5-hero-quick-v290 .suw5-hero-stat-wind-v290 > strong > span {
    font-size:24px !important;
  }

  .suw5-home-compact-v2519 .suw5-alerts-banner {
    margin-top:16px !important;
    padding:14px !important;
  }

  .suw5 .suw5-beach-dashboard-v280 {
    padding:17px !important;
    gap:14px !important;
    border-radius:18px !important;
  }
  .suw5-beach-dashboard-head-v280 {
    padding:0 2px 10px !important;
  }
  .suw5-beach-dashboard-head-v280 h2 {
    font-size:35px !important;
  }
  .suw5-beach-dashboard-head-v280 p {
    font-size:13px !important;
    line-height:1.45 !important;
  }
  .suw5 .suw5-beach-dashboard-v280 > .suw5-right-now-card-v1098,
  .suw5 .suw5-beach-dashboard-v280 > .suw5-beach-score-card-v1098 {
    padding:22px !important;
    border-radius:18px !important;
  }
  .suw5 .suw5-beach-dashboard-v280 .suw5-right-now-temp-v1098 {
    font-size:88px !important;
  }
  .suw5 .suw5-beach-dashboard-v280 .suw5-right-now-sub-v1098 {
    font-size:18px !important;
  }
  .suw5 .suw5-beach-dashboard-v280 .suw5-weather-status-v1100 {
    margin:20px 0 16px !important;
  }
  .suw5 .suw5-beach-dashboard-v280 .suw5-weather-status-icon-v1100 {
    font-size:3rem !important;
  }
  .suw5 .suw5-now-grid-v290 {
    grid-template-columns:1fr 1fr !important;
    gap:8px !important;
    margin-top:13px !important;
  }
  .suw5 .suw5-now-grid-v290 > span {
    min-height:76px !important;
    padding:11px 12px !important;
    border-radius:12px !important;
  }
  .suw5 .suw5-now-grid-v290 > span > em {
    font-size:10px !important;
  }
  .suw5 .suw5-now-grid-v290 > span > strong,
  .suw5 .suw5-now-grid-v290 > span > strong > span {
    font-size:20px !important;
  }
  .suw5 .suw5-score-number-v290 strong {
    font-size:80px !important;
  }
  .suw5 .suw5-score-number-v290 span {
    padding-bottom:5px !important;
    font-size:16px !important;
  }
  .suw5 .suw5-beach-dashboard-v280 .suw5-beach-score-card-v1098 h2 {
    font-size:30px !important;
  }
  .suw5 .suw5-beach-dashboard-v280 .suw5-score-lists-v1098 {
    grid-template-columns:1fr !important;
  }
  .suw5 .suw5-beach-dashboard-v280 > .suw5-beach-conditions-card-v1098 {
    padding:17px !important;
  }
  .suw5 .suw5-beach-dashboard-v280 .suw5-beach-condition-grid-v1098 {
    grid-template-columns:1fr 1fr !important;
    gap:9px !important;
  }
  .suw5 .suw5-beach-dashboard-v280 .suw5-beach-condition-grid-v1098 > div {
    min-height:108px !important;
    padding:12px 8px !important;
  }
  .suw5 .suw5-beach-dashboard-v280 .suw5-beach-condition-grid-v1098 strong {
    font-size:1.25rem !important;
  }
}

@media(max-width:390px){
  .suw5-home-compact-v2519 .suw5-hero {min-height:780px !important;}
  .suw5 .suw5-hero-quick-v290 > div > strong,
  .suw5 .suw5-hero-quick-v290 > div > strong > span {font-size:27px !important;}
  .suw5 .suw5-hero-quick-v290 .suw5-hero-stat-wind-v290 > strong,
  .suw5 .suw5-hero-quick-v290 .suw5-hero-stat-wind-v290 > strong > span {font-size:22px !important;}
}

/* V2.9.0 mobile alert hierarchy: show the alert itself before its action. */
@media(max-width:640px){
  .suw5-home-compact-v2519 .suw5-alerts-copy {order:1 !important;}
  .suw5-home-compact-v2519 .suw5-alerts-button,
  .suw5-home-compact-v2519 .suw5-alerts-banner button.suw5-alerts-button,
  .suw5-home-compact-v2519 .suw5-alerts-banner a.suw5-alerts-button {order:2 !important;}
}

/* ================================================================
 * V2.10.0 — Regional Outer Banks layer + stronger information hierarchy
 * Website presentation only. The native app API/routes/payloads are unchanged.
 * ================================================================ */

/* The regional comparison is intentionally visually distinct from the Nags Head
   dashboard: Sunnyside Up remains the home station, while the other communities
   read as a clean north-to-south comparison layer. */
.suw5 .suw5-regional-obx-v2100 {
  padding: clamp(28px,4vw,44px) !important;
  overflow: hidden;
  background:
    radial-gradient(circle at 90% 0%,rgba(30,145,165,.13),transparent 34%),
    linear-gradient(145deg,#f8fcfc 0%,#eef8f8 52%,#fff9ed 100%) !important;
  border: 1px solid rgba(10,83,101,.13) !important;
  box-shadow: 0 18px 48px rgba(7,54,80,.08) !important;
}
.suw5 .suw5-regional-obx-head-v2100 {
  display:flex !important;
  align-items:flex-end !important;
  justify-content:space-between !important;
  gap:28px !important;
  margin-bottom:22px !important;
}
.suw5 .suw5-regional-obx-head-v2100 h2 {
  margin:0 0 7px !important;
  color:#08364d !important;
  font-size:clamp(34px,4.2vw,52px) !important;
  line-height:1 !important;
  letter-spacing:-.035em !important;
}
.suw5 .suw5-regional-obx-head-v2100 p {
  max-width:760px;
  margin:0 !important;
  color:#526f7b !important;
  font-size:14px !important;
  line-height:1.6 !important;
}
.suw5 .suw5-regional-direction-v2100 {
  flex:0 0 auto;
  display:grid;
  grid-template-columns:auto auto auto;
  align-items:center;
  gap:8px;
  min-width:260px;
  padding:10px 13px;
  border:1px solid rgba(12,113,137,.13);
  border-radius:999px;
  background:rgba(255,255,255,.76);
  color:#5f7781;
  font-size:10px;
  font-weight:850;
  box-shadow:0 6px 18px rgba(7,54,80,.04);
}
.suw5 .suw5-regional-direction-v2100 b {color:#0d7182;font-size:10px;text-transform:uppercase;letter-spacing:.08em;}
.suw5 .suw5-regional-direction-v2100 span:last-child{text-align:right;}

.suw5 .suw5-regional-grid-v2100 {
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:12px;
}
.suw5 .suw5-regional-card-v2100 {
  position:relative;
  display:flex;
  flex-direction:column;
  min-width:0;
  min-height:262px;
  padding:17px;
  overflow:hidden;
  border:1px solid rgba(18,54,74,.10);
  border-top:4px solid #9aadb5;
  border-radius:18px;
  background:rgba(255,255,255,.92);
  box-shadow:0 9px 24px rgba(7,54,80,.055);
}
.suw5 .suw5-regional-card-v2100::after {
  content:"";
  position:absolute;
  width:90px;
  height:90px;
  right:-34px;
  top:-42px;
  border-radius:50%;
  background:rgba(11,124,145,.055);
}
.suw5 .suw5-regional-card-v2100.suw5-regional-risk-low {border-top-color:#30a663;}
.suw5 .suw5-regional-card-v2100.suw5-regional-risk-moderate {border-top-color:#d9a332;}
.suw5 .suw5-regional-card-v2100.suw5-regional-risk-high {border-top-color:#d94b45;}
.suw5 .suw5-regional-card-v2100.is-home-station {
  color:#fff;
  border-color:rgba(255,255,255,.20);
  border-top-color:#f0ba48;
  background:radial-gradient(circle at 88% 4%,rgba(255,255,255,.18),transparent 30%),linear-gradient(145deg,#07364f,#0c7383 70%,#1193a0);
  box-shadow:0 14px 32px rgba(7,54,80,.18);
}
.suw5 .suw5-regional-card-head-v2100 {
  position:relative;
  z-index:1;
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:8px;
  min-height:42px;
}
.suw5 .suw5-regional-card-head-v2100 > strong {
  color:#08364d;
  font-size:16px;
  line-height:1.12;
  font-weight:950;
}
.suw5 .is-home-station .suw5-regional-card-head-v2100 > strong {color:#fff;}
.suw5 .suw5-regional-card-head-v2100 > span {
  flex:0 0 auto;
  padding:5px 7px;
  border:1px solid rgba(255,255,255,.28);
  border-radius:999px;
  background:rgba(255,255,255,.14);
  color:#fff;
  font-size:8px;
  line-height:1;
  font-weight:950;
  letter-spacing:.07em;
  text-transform:uppercase;
}
.suw5 .suw5-regional-weather-v2100 {
  display:grid;
  grid-template-columns:auto 1fr;
  grid-template-areas:"icon temp" "condition condition";
  align-items:center;
  column-gap:8px;
  margin:8px 0 12px;
}
.suw5 .suw5-regional-icon-v2100 {grid-area:icon;font-size:25px;line-height:1;}
.suw5 .suw5-regional-weather-v2100 > b {
  grid-area:temp;
  color:#08364d;
  font-size:38px;
  line-height:.95;
  letter-spacing:-.055em;
  font-weight:950;
}
.suw5 .is-home-station .suw5-regional-weather-v2100 > b {color:#fff;}
.suw5 .suw5-regional-weather-v2100 > em {
  grid-area:condition;
  margin-top:7px;
  color:#607985;
  font-size:12px;
  line-height:1.25;
  font-style:normal;
  font-weight:780;
}
.suw5 .is-home-station .suw5-regional-weather-v2100 > em {color:rgba(255,255,255,.82);}
.suw5 .suw5-regional-weather-v2100.is-unavailable > b {font-size:28px;}
.suw5 .suw5-regional-mini-v2100 {
  display:grid;
  grid-template-columns:1fr 1.25fr;
  gap:6px;
}
.suw5 .suw5-regional-mini-v2100 > span {
  min-width:0;
  padding:9px 8px;
  border:1px solid rgba(18,54,74,.08);
  border-radius:10px;
  background:#f5fafb;
}
.suw5 .is-home-station .suw5-regional-mini-v2100 > span {border-color:rgba(255,255,255,.13);background:rgba(255,255,255,.10);}
.suw5 .suw5-regional-mini-v2100 small,
.suw5 .suw5-regional-safety-v2100 small,
.suw5 .suw5-regional-score-v2100 small {
  display:block;
  margin-bottom:3px;
  color:#738893;
  font-size:8px;
  line-height:1;
  font-weight:950;
  letter-spacing:.07em;
  text-transform:uppercase;
}
.suw5 .is-home-station .suw5-regional-mini-v2100 small,
.suw5 .is-home-station .suw5-regional-safety-v2100 small,
.suw5 .is-home-station .suw5-regional-score-v2100 small {color:rgba(255,255,255,.66);}
.suw5 .suw5-regional-mini-v2100 b {display:block;overflow-wrap:anywhere;color:#163e51;font-size:11px;line-height:1.2;font-weight:900;}
.suw5 .is-home-station .suw5-regional-mini-v2100 b {color:#fff;}
.suw5 .suw5-regional-safety-v2100 {
  margin-top:8px;
  padding:9px 10px;
  border-radius:10px;
  background:rgba(53,157,99,.10);
}
.suw5 .suw5-regional-risk-moderate .suw5-regional-safety-v2100 {background:rgba(217,163,50,.13);}
.suw5 .suw5-regional-risk-high .suw5-regional-safety-v2100 {background:rgba(217,75,69,.11);}
.suw5 .is-home-station .suw5-regional-safety-v2100 {background:rgba(255,255,255,.10);}
.suw5 .suw5-regional-safety-v2100 b {display:block;color:#126b3e;font-size:12px;line-height:1.15;font-weight:950;}
.suw5 .suw5-regional-risk-moderate .suw5-regional-safety-v2100 b {color:#9a6c08;}
.suw5 .suw5-regional-risk-high .suw5-regional-safety-v2100 b {color:#a3312d;}
.suw5 .is-home-station .suw5-regional-safety-v2100 b {color:#fff;}
.suw5 .suw5-regional-score-v2100 {
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:8px;
  margin-top:8px;
  padding-top:8px;
  border-top:1px solid rgba(255,255,255,.15);
}
.suw5 .suw5-regional-score-v2100 small {margin:0;}
.suw5 .suw5-regional-score-v2100 > b {color:#fff;font-size:20px;line-height:1;font-weight:950;}
.suw5 .suw5-regional-score-v2100 > b span {margin-left:2px;font-size:9px;opacity:.7;}
.suw5 .suw5-regional-source-v2101 {
  margin-top:auto;
  padding-top:9px;
  color:#82949c;
  font-size:8px;
  line-height:1.25;
  font-weight:750;
}
.suw5 .is-home-station > .suw5-regional-source-v2101 {color:rgba(255,255,255,.60);}
.suw5 .suw5-regional-actions-v2100 {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-top:18px;
}
.suw5 .suw5-regional-actions-v2100 a {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:44px;
  padding:10px 15px;
  border-radius:999px;
  font-size:12px;
  font-weight:900;
  text-decoration:none !important;
}
.suw5 .suw5-regional-primary-v2100 {background:#0c7189;color:#fff !important;box-shadow:0 7px 18px rgba(12,113,137,.16);}
.suw5 .suw5-regional-secondary-v2100 {border:1px solid rgba(18,54,74,.15);background:#fff;color:#0c7189 !important;}
.suw5 .suw5-regional-note-v2100 {margin:13px 0 0 !important;color:#71858f !important;font-size:10px !important;line-height:1.45 !important;}

/* The regional Explore card is a deliberate full-width invitation rather than a
   fifth small tile fighting the four primary Nags Head destinations. */
.suw5 .suw5-home-directory-links-v280 > a.suw5-directory-regional-v2100 {
  grid-column:1 / -1;
  min-height:112px;
  grid-template-columns:auto 1fr auto !important;
  grid-template-areas:"icon title arrow" "icon copy arrow" !important;
  align-items:center;
  column-gap:16px;
  background:linear-gradient(120deg,#07364f,#0b7586) !important;
  border-color:rgba(255,255,255,.12) !important;
}
.suw5 .suw5-home-directory-links-v280 > a.suw5-directory-regional-v2100 i {margin:0;background:rgba(255,255,255,.12);}
.suw5 .suw5-home-directory-links-v280 > a.suw5-directory-regional-v2100 span {color:#fff !important;font-size:20px !important;}
.suw5 .suw5-home-directory-links-v280 > a.suw5-directory-regional-v2100 small {color:rgba(255,255,255,.74) !important;margin-top:2px;}
.suw5 .suw5-home-directory-links-v280 > a.suw5-directory-regional-v2100 b {color:#f0bd50 !important;}

/* Forecast page: make weather values read like a weather product instead of a
   document. No data or forecast logic is changed here. */
.suw5.suw5-forecasts-page {display:grid;gap:22px;}
.suw5.suw5-forecasts-page > .suw5-panel {box-shadow:0 12px 34px rgba(7,54,80,.06) !important;}
.suw5.suw5-forecasts-page .suw5-hourly-strip {gap:10px !important;}
.suw5.suw5-forecasts-page .suw5-hour-card {
  min-width:145px !important;
  padding:17px 14px !important;
  border:1px solid rgba(15,112,137,.12) !important;
  border-radius:16px !important;
  background:linear-gradient(180deg,#fff,#f2fafb) !important;
  box-shadow:0 7px 18px rgba(7,54,80,.045) !important;
}
.suw5.suw5-forecasts-page .suw5-hour-card > strong {color:#173f52 !important;font-size:15px !important;}
.suw5.suw5-forecasts-page .suw5-hour-card > span {margin:7px 0 4px;font-size:29px !important;}
.suw5.suw5-forecasts-page .suw5-hour-card > em {color:#0b7890 !important;font-size:27px !important;line-height:1 !important;font-weight:950 !important;font-style:normal !important;}
.suw5.suw5-forecasts-page .suw5-hour-card > small {font-size:10px !important;line-height:1.35 !important;color:#667f8a !important;}
.suw5.suw5-forecasts-page .suw5-forecast-page-day-grid {gap:0 !important;border:1px solid rgba(18,54,74,.10);border-radius:18px;overflow:hidden;background:#fff;}
.suw5.suw5-forecasts-page .suw5-forecast-page-day-grid .suw5-trip-day-card {
  padding:22px !important;
  border:0 !important;
  border-right:1px solid rgba(18,54,74,.10) !important;
  background:#fff !important;
}
.suw5.suw5-forecasts-page .suw5-forecast-page-day-grid .suw5-trip-day-card:last-child {border-right:0 !important;}
.suw5.suw5-forecasts-page .suw5-trip-day-card > strong {font-size:17px !important;color:#123d52 !important;}
.suw5.suw5-forecasts-page .suw5-trip-day-card > span {margin:8px 0 6px;color:#0a7890 !important;font-size:16px !important;font-weight:900 !important;}
.suw5.suw5-forecasts-page .suw5-trip-day-card > em {color:#4f6875 !important;font-size:13px !important;font-style:normal !important;font-weight:800 !important;}
.suw5.suw5-forecasts-page .suw5-forecast-page-marine {background:linear-gradient(145deg,#07364f,#0c7485) !important;color:#fff !important;}
.suw5.suw5-forecasts-page .suw5-forecast-page-marine h2,
.suw5.suw5-forecasts-page .suw5-forecast-page-marine h3,
.suw5.suw5-forecasts-page .suw5-forecast-page-marine p,
.suw5.suw5-forecasts-page .suw5-forecast-page-marine strong,
.suw5.suw5-forecasts-page .suw5-forecast-page-marine span {color:#fff !important;}
.suw5.suw5-forecasts-page .suw5-forecast-page-marine .suw5-forecast-card {background:rgba(255,255,255,.08) !important;border-color:rgba(255,255,255,.14) !important;}
.suw5.suw5-forecasts-page .suw5-forecast-page-marine .suw5-forecast-item {border-color:rgba(255,255,255,.14) !important;background:rgba(255,255,255,.06) !important;}
.suw5.suw5-forecasts-page .suw5-forecast-page-marine .suw5-forecast-source {color:#f4ca69 !important;}

@media(max-width:1100px){
  .suw5 .suw5-regional-grid-v2100 {grid-template-columns:repeat(3,minmax(0,1fr));}
  .suw5 .suw5-regional-card-v2100.is-home-station {grid-column:span 2;}
}
@media(max-width:760px){
  .suw5 .suw5-regional-obx-v2100 {padding:20px 16px !important;border-radius:18px !important;}
  .suw5 .suw5-regional-obx-head-v2100 {display:block !important;margin-bottom:16px !important;}
  .suw5 .suw5-regional-obx-head-v2100 h2 {font-size:37px !important;}
  .suw5 .suw5-regional-obx-head-v2100 p {font-size:12px !important;}
  .suw5 .suw5-regional-direction-v2100 {width:100%;min-width:0;margin-top:12px;}
  .suw5 .suw5-regional-grid-v2100 {grid-template-columns:1fr 1fr;gap:8px;}
  .suw5 .suw5-regional-card-v2100 {min-height:236px;padding:13px;border-radius:14px;}
  .suw5 .suw5-regional-card-v2100.is-home-station {grid-column:1 / -1;min-height:230px;}
  .suw5 .suw5-regional-card-head-v2100 {min-height:38px;}
  .suw5 .suw5-regional-card-head-v2100 > strong {font-size:14px;}
  .suw5 .suw5-regional-weather-v2100 > b {font-size:32px;}
  .suw5 .suw5-regional-weather-v2100 > em {font-size:10px;}
  .suw5 .suw5-regional-mini-v2100 {grid-template-columns:1fr;gap:5px;}
  .suw5 .suw5-regional-mini-v2100 > span {padding:7px;}
  .suw5 .suw5-regional-mini-v2100 b {font-size:10px;}
  .suw5 .suw5-regional-safety-v2100 b {font-size:11px;}
  .suw5 .suw5-regional-actions-v2100 {align-items:stretch;flex-direction:column;}
  .suw5 .suw5-regional-actions-v2100 a {width:100%;}
  .suw5 .suw5-home-directory-links-v280 > a.suw5-directory-regional-v2100 {min-height:126px;grid-template-columns:auto 1fr auto !important;}
  .suw5.suw5-forecasts-page .suw5-forecast-page-day-grid {display:grid !important;grid-template-columns:1fr !important;}
  .suw5.suw5-forecasts-page .suw5-forecast-page-day-grid .suw5-trip-day-card {border-right:0 !important;border-bottom:1px solid rgba(18,54,74,.10) !important;}
  .suw5.suw5-forecasts-page .suw5-forecast-page-day-grid .suw5-trip-day-card:last-child {border-bottom:0 !important;}
}
@media(max-width:390px){
  .suw5 .suw5-regional-card-v2100 {padding:11px;}
  .suw5 .suw5-regional-card-head-v2100 > strong {font-size:13px;}
  .suw5 .suw5-regional-weather-v2100 > b {font-size:29px;}
}


/* ================================================================
 * V2.10.1 — Homepage information architecture + footer containment
 * Presentation only; no API/app/provider logic changes.
 * ================================================================ */

/* Quick Access now lives immediately under the hero/alert area. Keep it compact
   enough to deserve the word “quick,” especially on a phone. */
.suw5-home-compact-v2519 .suw5-home-directory-v2519.suw5-home-directory-v280 {
  margin-top: 16px !important;
  margin-bottom: 18px !important;
  padding: 22px 24px !important;
  border-radius: 20px !important;
}
.suw5-home-compact-v2519 .suw5-explore-head-v280 {margin-bottom:14px !important;}
.suw5-home-compact-v2519 .suw5-explore-head-v280 h2 {
  margin:0 !important;
  font-size:clamp(29px,3.2vw,40px) !important;
  line-height:1.04 !important;
}
.suw5-home-compact-v2519 .suw5-explore-head-v280 p {
  margin-top:5px !important;
  font-size:12px !important;
  line-height:1.45 !important;
}
.suw5-home-compact-v2519 .suw5-home-directory-links-v280 {
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  gap:10px !important;
}
.suw5-home-compact-v2519 .suw5-home-directory-links-v280 > a {
  min-height:128px !important;
  padding:15px !important;
  border-radius:14px !important;
}
.suw5-home-compact-v2519 .suw5-home-directory-links-v280 > a i {
  width:38px !important;
  height:38px !important;
  margin-bottom:10px !important;
  border-radius:11px !important;
  font-size:20px !important;
}
.suw5-home-compact-v2519 .suw5-home-directory-links-v280 > a span {font-size:16px !important;}
.suw5-home-compact-v2519 .suw5-home-directory-links-v280 > a small {font-size:10px !important;line-height:1.4 !important;}
.suw5-home-compact-v2519 .suw5-home-directory-links-v280 > a b {font-size:19px !important;}

/* Keep the regional comparison self-contained. Its source line is intentionally
   a div, not a semantic footer, so site-wide pre-footer scripts cannot move
   Contact/visitor/legal content into a beach card. */
.suw5 .suw5-regional-source-v2101 {
  margin-top:auto;
  padding-top:9px;
  color:#82949c;
  font-size:8px;
  line-height:1.25;
  font-weight:750;
}

@media(max-width:700px){
  .suw5-home-compact-v2519 .suw5-home-directory-v2519.suw5-home-directory-v280 {
    margin:14px 14px 18px !important;
    padding:17px 15px !important;
    border-radius:18px !important;
  }
  .suw5-home-compact-v2519 .suw5-explore-kicker-v280 {font-size:9px !important;}
  .suw5-home-compact-v2519 .suw5-explore-head-v280 h2 {font-size:28px !important;}
  .suw5-home-compact-v2519 .suw5-explore-head-v280 p {font-size:11px !important;}
  .suw5-home-compact-v2519 .suw5-home-directory-links-v280 {
    grid-template-columns:1fr 1fr !important;
    gap:8px !important;
  }
  .suw5-home-compact-v2519 .suw5-home-directory-links-v280 > a {
    min-height:116px !important;
    padding:13px !important;
    grid-template-columns:1fr auto !important;
    grid-template-areas:"icon arrow" "title arrow" "copy copy" !important;
  }
  .suw5-home-compact-v2519 .suw5-home-directory-links-v280 > a i {
    width:34px !important;height:34px !important;margin-bottom:8px !important;font-size:18px !important;
  }
  .suw5-home-compact-v2519 .suw5-home-directory-links-v280 > a span {font-size:15px !important;line-height:1.15 !important;}
  .suw5-home-compact-v2519 .suw5-home-directory-links-v280 > a small {margin-top:5px !important;font-size:9px !important;line-height:1.32 !important;}
  .suw5-home-compact-v2519 .suw5-home-directory-links-v280 > a b {font-size:18px !important;}

  /* Regional cards remain two-up for fast north-to-south comparison, but no
     longer stretch just because unrelated footer content was moved inside them. */
  .suw5 .suw5-regional-card-v2100 {min-height:220px !important;}
}
@media(max-width:360px){
  .suw5-home-compact-v2519 .suw5-home-directory-links-v280 {grid-template-columns:1fr !important;}
  .suw5-home-compact-v2519 .suw5-home-directory-links-v280 > a {min-height:98px !important;}
}


/* V2.10.2 — Beach & Ocean navigation refinement.
   Keep all information visible; these controls only jump to the exact section. */
.suw5 .suw5-beach-jump-nav-v2102 {
  display:grid;
  grid-template-columns:auto repeat(4, minmax(0, 1fr));
  align-items:center;
  gap:8px;
  max-width:1280px;
  margin:12px auto 18px;
  padding:10px;
  border:1px solid rgba(18,54,74,.11);
  border-radius:18px;
  background:rgba(255,255,255,.88);
  box-shadow:0 9px 28px rgba(18,54,74,.07);
  backdrop-filter:blur(14px);
}
.suw5 .suw5-beach-jump-label-v2102 {
  padding:0 10px;
  color:#71838d;
  font-size:10px;
  line-height:1;
  font-weight:950;
  letter-spacing:.12em;
  text-transform:uppercase;
  white-space:nowrap;
}
.suw5 .suw5-beach-jump-nav-v2102 a {
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:42px;
  padding:9px 12px;
  border:1px solid rgba(12,113,137,.13);
  border-radius:12px;
  background:#f7fbfc;
  color:#0b6075 !important;
  font-size:12px;
  line-height:1.2;
  font-weight:900;
  text-align:center;
  text-decoration:none !important;
}
.suw5 .suw5-beach-jump-nav-v2102 a:hover,
.suw5 .suw5-beach-jump-nav-v2102 a:focus-visible {
  background:#eaf6f8;
  border-color:rgba(12,113,137,.28);
  transform:translateY(-1px);
}
.suw5 .suw5-regional-actions-v2102 {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
}
.suw5 .suw5-regional-actions-v2102 a {width:100%;}
.suw5 .suw5-regional-actions-v2102 .suw5-regional-app-v2102 {
  grid-column:1 / -1;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:42px;
  padding:9px 14px;
  border:0;
  color:#0c7189 !important;
  background:transparent;
  font-size:11px;
  font-weight:850;
  text-decoration:none !important;
}
@media(max-width:760px){
  .suw5 .suw5-beach-jump-nav-v2102 {
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:7px;
    margin:10px 14px 16px;
    padding:9px;
    border-radius:16px;
  }
  .suw5 .suw5-beach-jump-label-v2102 {
    grid-column:1 / -1;
    padding:3px 4px 5px;
    text-align:left;
  }
  .suw5 .suw5-beach-jump-nav-v2102 a {
    min-height:46px;
    padding:9px 8px;
    font-size:11px;
  }
  .suw5 .suw5-regional-actions-v2102 {
    display:grid !important;
    grid-template-columns:1fr 1fr !important;
    gap:8px !important;
  }
  .suw5 .suw5-regional-actions-v2102 a {width:100% !important;}
  .suw5 .suw5-regional-actions-v2102 .suw5-regional-app-v2102 {grid-column:1 / -1;}
}
@media(max-width:390px){
  .suw5 .suw5-beach-jump-nav-v2102 a {font-size:10.5px;}
}

/* ================================================================
 * V2.11.0 — Noticeable information-architecture refinement
 * Presentation only; no app/API/provider/scoring logic changes.
 * ================================================================ */

/* Regional comparison: organize the ten communities into two obvious geographic
   groups and make the cards denser, more legible, and less spreadsheet-like. */
.suw5 .suw5-regional-groups-v2110 {
  display:grid;
  gap:22px;
  margin-top:4px;
}
.suw5 .suw5-regional-group-v2110 {
  min-width:0;
  padding:16px;
  border:1px solid rgba(18,54,74,.09);
  border-radius:20px;
  background:linear-gradient(180deg,rgba(247,252,253,.94),rgba(255,255,255,.92));
  box-shadow:0 10px 28px rgba(7,54,80,.045);
}
.suw5 .suw5-regional-group-v2110.is-hatteras {
  background:linear-gradient(180deg,rgba(251,249,241,.92),rgba(255,255,255,.94));
}
.suw5 .suw5-regional-group-head-v2110 {
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:14px;
  margin:0 2px 12px;
  padding-bottom:10px;
  border-bottom:1px solid rgba(18,54,74,.09);
}
.suw5 .suw5-regional-group-head-v2110 strong {
  color:#123d52;
  font-size:16px;
  line-height:1.1;
  font-weight:950;
}
.suw5 .suw5-regional-group-head-v2110 span {
  color:#71858f;
  font-size:10px;
  line-height:1.2;
  font-weight:800;
  letter-spacing:.04em;
}
.suw5 .suw5-regional-group-v2110.is-northern .suw5-regional-grid-v2100 {
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
}
.suw5 .suw5-regional-group-v2110.is-hatteras .suw5-regional-grid-v2100 {
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:10px;
}
.suw5 .suw5-regional-card-v2110 {
  min-height:0 !important;
  padding:15px !important;
  border-radius:15px !important;
  box-shadow:0 7px 20px rgba(7,54,80,.045) !important;
}
.suw5 .suw5-regional-card-v2110 .suw5-regional-card-head-v2100 {min-height:30px;}
.suw5 .suw5-regional-card-v2110 .suw5-regional-card-head-v2100 > strong {font-size:15px;}
.suw5 .suw5-regional-card-v2110 .suw5-regional-weather-v2100 {margin:5px 0 9px;}
.suw5 .suw5-regional-card-v2110 .suw5-regional-weather-v2100 > b {font-size:34px;}
.suw5 .suw5-regional-card-v2110 .suw5-regional-weather-v2100 > em {margin-top:5px;font-size:11px;}
.suw5 .suw5-regional-card-v2110 .suw5-regional-mini-v2100 > span {padding:8px;}
.suw5 .suw5-regional-card-v2110 .suw5-regional-mini-v2100 b {font-size:11px;}
.suw5 .suw5-regional-card-v2110 .suw5-regional-safety-v2100 {margin-top:7px;padding:8px 9px;}
.suw5 .suw5-regional-card-v2110 .suw5-regional-source-v2101 {padding-top:8px;font-size:9px;}
.suw5 .suw5-regional-card-v2110.is-home-station {
  box-shadow:0 13px 28px rgba(7,54,80,.18) !important;
}
.suw5 .suw5-regional-obx-v2110 .suw5-regional-actions-v2102 {margin-top:18px;}

/* Beach & Ocean is now a purpose-built detail page rather than a duplicate of
   the homepage dashboard. The key answers stay visible at all times. */
.suw5 .suw5-beach-page-overview-v2110 {
  padding:28px !important;
  border-radius:22px !important;
  background:linear-gradient(145deg,#f8fcfd 0%,#ffffff 58%,#f8f5ea 100%) !important;
  box-shadow:0 14px 36px rgba(7,54,80,.07) !important;
}
.suw5 .suw5-beach-page-overview-head-v2110 {
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:24px;
  align-items:end;
  margin-bottom:16px;
}
.suw5 .suw5-beach-page-overview-head-v2110 > div:first-child > span {
  display:block;
  margin-bottom:6px;
  color:#ad7b18;
  font-size:10px;
  line-height:1;
  font-weight:950;
  letter-spacing:.14em;
  text-transform:uppercase;
}
.suw5 .suw5-beach-page-overview-head-v2110 h1 {
  margin:0 !important;
  color:#123d52 !important;
  font-family:Georgia,'Times New Roman',serif !important;
  font-size:clamp(42px,5vw,64px) !important;
  line-height:.98 !important;
  letter-spacing:-.045em !important;
}
.suw5 .suw5-beach-page-overview-head-v2110 p {
  max-width:680px;
  margin:9px 0 0 !important;
  color:#617782 !important;
  font-size:14px !important;
  line-height:1.5 !important;
}
.suw5 .suw5-beach-page-score-v2110 {
  min-width:230px;
  padding:15px 18px;
  border-radius:18px;
  color:#fff;
  background:linear-gradient(145deg,#8f7408,#c49d00);
  box-shadow:0 10px 24px rgba(103,80,0,.15);
}
.suw5 .suw5-beach-page-score-v2110.suw5-score-excellent,
.suw5 .suw5-beach-page-score-v2110.suw5-score-great {background:linear-gradient(145deg,#147a55,#2aa878);}
.suw5 .suw5-beach-page-score-v2110.suw5-score-good {background:linear-gradient(145deg,#14738a,#1a94a4);}
.suw5 .suw5-beach-page-score-v2110.suw5-score-poor {background:linear-gradient(145deg,#8f342e,#bd4b41);}
.suw5 .suw5-beach-page-score-v2110 small {
  display:block;
  color:rgba(255,255,255,.76);
  font-size:9px;
  line-height:1;
  font-weight:950;
  letter-spacing:.1em;
  text-transform:uppercase;
}
.suw5 .suw5-beach-page-score-v2110 strong {
  display:block;
  margin:7px 0 4px;
  color:#fff;
  font-size:42px;
  line-height:.9;
  font-weight:950;
  letter-spacing:-.05em;
}
.suw5 .suw5-beach-page-score-v2110 strong span {margin-left:3px;font-size:14px;opacity:.75;}
.suw5 .suw5-beach-page-score-v2110 em {display:block;color:#fff;font-size:12px;line-height:1.25;font-style:normal;font-weight:850;}
.suw5 .suw5-beach-page-recommendation-v2110 {
  margin:0 0 18px !important;
  padding:12px 15px;
  border-left:4px solid #d9a332;
  border-radius:0 12px 12px 0;
  background:rgba(217,163,50,.10);
  color:#314f5d !important;
  font-size:14px !important;
  line-height:1.5 !important;
  font-weight:750 !important;
}
.suw5 .suw5-beach-page-essential-grid-v2110 {
  display:grid;
  grid-template-columns:repeat(6,minmax(0,1fr));
  overflow:hidden;
  border:1px solid rgba(18,54,74,.10);
  border-radius:18px;
  background:#fff;
}
.suw5 .suw5-beach-page-essential-grid-v2110 > div {
  min-width:0;
  min-height:112px;
  padding:15px;
  border-right:1px solid rgba(18,54,74,.09);
}
.suw5 .suw5-beach-page-essential-grid-v2110 > div:last-child {border-right:0;}
.suw5 .suw5-beach-page-essential-grid-v2110 small {
  display:block;
  margin-bottom:8px;
  color:#748893;
  font-size:9px;
  line-height:1;
  font-weight:950;
  letter-spacing:.1em;
  text-transform:uppercase;
}
.suw5 .suw5-beach-page-essential-grid-v2110 strong {
  display:block;
  overflow-wrap:anywhere;
  color:#123d52;
  font-size:24px;
  line-height:1.05;
  font-weight:950;
  letter-spacing:-.025em;
}
.suw5 .suw5-beach-page-essential-grid-v2110 > div > span {
  display:block;
  margin-top:6px;
  color:#748893;
  font-size:10px;
  line-height:1.25;
  font-weight:750;
}
.suw5 .suw5-beach-page-essential-grid-v2110 > div > span b {color:#526d79;font-weight:900;}
.suw5 .suw5-beach-page-score-factors-v2110 {
  margin-top:18px;
  padding-top:17px;
  border-top:1px solid rgba(18,54,74,.10);
}
.suw5 .suw5-beach-page-score-factors-title-v2110 {
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:14px;
  margin-bottom:10px;
}
.suw5 .suw5-beach-page-score-factors-title-v2110 strong {color:#123d52;font-size:15px;font-weight:950;}
.suw5 .suw5-beach-page-score-factors-title-v2110 span {color:#7b8d95;font-size:10px;font-weight:750;}
.suw5 .suw5-beach-page-score-factor-grid-v2110 {
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:8px;
}
.suw5 .suw5-beach-page-factor-v2110 {
  min-width:0;
  padding:11px 12px;
  border:1px solid rgba(18,54,74,.09);
  border-radius:12px;
  background:#f6fafb;
}
.suw5 .suw5-beach-page-factor-v2110 small {
  display:block;
  min-height:24px;
  color:#71858f;
  font-size:8px;
  line-height:1.25;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.05em;
}
.suw5 .suw5-beach-page-factor-v2110 strong {display:block;margin-top:5px;color:#123d52;font-size:16px;font-weight:950;}

@media(max-width:1100px){
  .suw5 .suw5-regional-group-v2110.is-hatteras .suw5-regional-grid-v2100 {grid-template-columns:repeat(2,minmax(0,1fr));}
  .suw5 .suw5-beach-page-essential-grid-v2110 {grid-template-columns:repeat(3,minmax(0,1fr));}
  .suw5 .suw5-beach-page-essential-grid-v2110 > div {border-bottom:1px solid rgba(18,54,74,.09);}
  .suw5 .suw5-beach-page-essential-grid-v2110 > div:nth-child(3n){border-right:0;}
  .suw5 .suw5-beach-page-essential-grid-v2110 > div:nth-last-child(-n+3){border-bottom:0;}
}
@media(max-width:760px){
  .suw5 .suw5-regional-groups-v2110 {gap:14px;}
  .suw5 .suw5-regional-group-v2110 {padding:11px;border-radius:16px;}
  .suw5 .suw5-regional-group-head-v2110 {margin-bottom:9px;padding-bottom:8px;}
  .suw5 .suw5-regional-group-head-v2110 strong {font-size:14px;}
  .suw5 .suw5-regional-group-head-v2110 span {font-size:9px;}
  .suw5 .suw5-regional-group-v2110.is-northern .suw5-regional-grid-v2100,
  .suw5 .suw5-regional-group-v2110.is-hatteras .suw5-regional-grid-v2100 {grid-template-columns:1fr 1fr;gap:7px;}
  .suw5 .suw5-regional-card-v2110 {min-height:0 !important;padding:12px !important;}
  .suw5 .suw5-regional-card-v2110.is-home-station {grid-column:1 / -1;}
  .suw5 .suw5-regional-card-v2110 .suw5-regional-mini-v2100 {grid-template-columns:1fr 1fr;}

  .suw5 .suw5-beach-page-overview-v2110 {margin:0 14px !important;padding:18px 15px !important;border-radius:18px !important;}
  .suw5 .suw5-beach-page-overview-head-v2110 {grid-template-columns:1fr;gap:13px;align-items:start;}
  .suw5 .suw5-beach-page-overview-head-v2110 h1 {font-size:44px !important;}
  .suw5 .suw5-beach-page-overview-head-v2110 p {font-size:12px !important;}
  .suw5 .suw5-beach-page-score-v2110 {display:grid;grid-template-columns:1fr auto;grid-template-areas:'label score' 'rating score';align-items:center;min-width:0;padding:13px 15px;}
  .suw5 .suw5-beach-page-score-v2110 small {grid-area:label;}
  .suw5 .suw5-beach-page-score-v2110 strong {grid-area:score;margin:0;font-size:38px;}
  .suw5 .suw5-beach-page-score-v2110 em {grid-area:rating;margin-top:4px;font-size:11px;}
  .suw5 .suw5-beach-page-recommendation-v2110 {font-size:12px !important;}
  .suw5 .suw5-beach-page-essential-grid-v2110 {grid-template-columns:1fr 1fr;border-radius:15px;}
  .suw5 .suw5-beach-page-essential-grid-v2110 > div {min-height:100px;padding:13px;border-right:1px solid rgba(18,54,74,.09) !important;border-bottom:1px solid rgba(18,54,74,.09) !important;}
  .suw5 .suw5-beach-page-essential-grid-v2110 > div:nth-child(2n){border-right:0 !important;}
  .suw5 .suw5-beach-page-essential-grid-v2110 > div:nth-last-child(-n+2){border-bottom:0 !important;}
  .suw5 .suw5-beach-page-essential-grid-v2110 strong {font-size:22px;}
  .suw5 .suw5-beach-page-score-factors-title-v2110 {display:block;}
  .suw5 .suw5-beach-page-score-factors-title-v2110 span {display:block;margin-top:3px;}
  .suw5 .suw5-beach-page-score-factor-grid-v2110 {grid-template-columns:1fr 1fr;}
  .suw5 .suw5-beach-page-factor-v2110:last-child:nth-child(odd){grid-column:1 / -1;}
}
@media(max-width:390px){
  .suw5 .suw5-beach-page-overview-head-v2110 h1 {font-size:40px !important;}
  .suw5 .suw5-beach-page-essential-grid-v2110 strong {font-size:20px;}
}

/* ================================================================
 * V2.12.0 — Regional Beach Scores + all-location Forecasts
 * Website presentation only; native app/API contracts are unchanged.
 * ================================================================ */

/* Home: make the Beach Score useful on every regional card, not only Nags Head. */
.suw5 .suw5-regional-card-v2110 .suw5-regional-score-v2120{
  position:relative;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  grid-template-areas:"label score" "rating score";
  align-items:center;
  gap:1px 8px;
  margin-top:8px;
  padding:9px 10px;
  border:1px solid rgba(18,54,74,.08);
  border-radius:11px;
  background:#f5f9fa;
}
.suw5 .suw5-regional-card-v2110 .suw5-regional-score-v2120 small{
  grid-area:label;
  color:#6f8590;
  font-size:8px;
  line-height:1.1;
  font-weight:900;
  letter-spacing:.055em;
  text-transform:uppercase;
}
.suw5 .suw5-regional-card-v2110 .suw5-regional-score-v2120 > b{
  grid-area:score;
  color:#123d52;
  font-size:22px;
  line-height:1;
  font-weight:950;
}
.suw5 .suw5-regional-card-v2110 .suw5-regional-score-v2120 > b span{
  margin-left:2px;
  color:#6f8590;
  font-size:9px;
  font-weight:850;
}
.suw5 .suw5-regional-card-v2110 .suw5-regional-score-v2120 > em{
  grid-area:rating;
  color:#6f8590;
  font-size:9px;
  line-height:1.15;
  font-style:normal;
  font-weight:800;
}
.suw5 .suw5-regional-card-v2110 .suw5-regional-score-v2120.score-great{background:rgba(69,192,126,.10);border-color:rgba(38,151,95,.16);}
.suw5 .suw5-regional-card-v2110 .suw5-regional-score-v2120.score-good{background:rgba(39,155,175,.09);border-color:rgba(39,155,175,.15);}
.suw5 .suw5-regional-card-v2110 .suw5-regional-score-v2120.score-fair{background:rgba(231,181,55,.12);border-color:rgba(199,147,17,.16);}
.suw5 .suw5-regional-card-v2110 .suw5-regional-score-v2120.score-poor{background:rgba(220,75,69,.09);border-color:rgba(190,58,53,.15);}
.suw5 .suw5-regional-card-v2110.is-home-station .suw5-regional-score-v2120{
  border-color:rgba(255,255,255,.18);
  background:rgba(255,255,255,.11);
}
.suw5 .suw5-regional-card-v2110.is-home-station .suw5-regional-score-v2120 small,
.suw5 .suw5-regional-card-v2110.is-home-station .suw5-regional-score-v2120 > b,
.suw5 .suw5-regional-card-v2110.is-home-station .suw5-regional-score-v2120 > b span,
.suw5 .suw5-regional-card-v2110.is-home-station .suw5-regional-score-v2120 > em{color:#fff;}

/* Forecasts: strong, visible information hierarchy. */
.suw5.suw5-regional-forecasts-page-v2120{
  display:grid;
  gap:24px;
}
.suw5 .suw5-regional-forecast-intro-v2120{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(230px,.32fr);
  gap:26px;
  align-items:center;
  padding:34px 38px !important;
  border:0 !important;
  border-radius:24px !important;
  background:linear-gradient(135deg,#07364f 0%,#0a6f83 62%,#0b8b94 100%) !important;
  color:#fff !important;
  box-shadow:0 18px 42px rgba(7,54,80,.17) !important;
}
.suw5 .suw5-regional-forecast-intro-copy-v2120 > span,
.suw5 .suw5-regional-forecast-head-v2120 > div > span,
.suw5 .suw5-regional-marine-v2120 .suw5-section-head > div > span{
  display:block;
  margin-bottom:8px;
  color:#e9b846;
  font-size:11px;
  line-height:1.2;
  font-weight:900;
  letter-spacing:.14em;
  text-transform:uppercase;
}
.suw5 .suw5-regional-forecast-intro-v2120 h1{
  margin:0 0 10px !important;
  color:#fff !important;
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(38px,4vw,58px) !important;
  line-height:1.02 !important;
}
.suw5 .suw5-regional-forecast-intro-v2120 p{
  margin:0 !important;
  max-width:850px;
  color:rgba(255,255,255,.80) !important;
  font-size:15px !important;
  line-height:1.55 !important;
}
.suw5 .suw5-regional-forecast-home-v2120{
  padding:21px 22px;
  border:1px solid rgba(255,255,255,.18);
  border-radius:18px;
  background:rgba(255,255,255,.10);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08);
}
.suw5 .suw5-regional-forecast-home-v2120 small{display:block;color:#efc75e;font-size:9px;font-weight:900;letter-spacing:.12em;}
.suw5 .suw5-regional-forecast-home-v2120 strong{display:block;margin:4px 0 6px;color:#fff;font-size:27px;line-height:1;font-weight:950;}
.suw5 .suw5-regional-forecast-home-v2120 span{color:rgba(255,255,255,.72);font-size:11px;line-height:1.45;font-weight:700;}
.suw5 .suw5-regional-forecast-jump-v2120{
  grid-column:1 / -1;
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  padding-top:2px;
}
.suw5 .suw5-regional-forecast-jump-v2120 a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:38px;
  padding:7px 14px;
  border:1px solid rgba(255,255,255,.18);
  border-radius:999px;
  background:rgba(255,255,255,.09);
  color:#fff !important;
  font-size:11px;
  font-weight:900;
  text-decoration:none !important;
}
.suw5 .suw5-regional-forecast-jump-v2120 a:hover{background:rgba(255,255,255,.17);}

.suw5 .suw5-regional-forecast-section-v2120{
  padding:30px 32px !important;
  border-radius:22px !important;
  border:1px solid rgba(18,54,74,.09) !important;
  background:#fff !important;
  box-shadow:0 14px 36px rgba(7,54,80,.065) !important;
  scroll-margin-top:110px;
}
.suw5 .suw5-regional-forecast-head-v2120{
  display:flex !important;
  align-items:flex-end !important;
  justify-content:space-between !important;
  gap:20px !important;
  margin-bottom:20px !important;
}
.suw5 .suw5-regional-forecast-head-v2120 h2{
  margin:0 0 5px !important;
  color:#123d52 !important;
  font-size:clamp(31px,3vw,45px) !important;
  line-height:1.04 !important;
}
.suw5 .suw5-regional-forecast-head-v2120 p{
  margin:0 !important;
  color:#6b818c !important;
  font-size:13px !important;
  line-height:1.45 !important;
}
.suw5 .suw5-regional-forecast-head-v2120 > b{
  color:#0b7a91;
  font-size:11px;
  font-weight:900;
  white-space:nowrap;
}

/* Today's ten-location comparison */
.suw5 .suw5-regional-today-grid-v2120{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:11px;
}
.suw5 .suw5-regional-today-card-v2120{
  min-width:0;
  padding:16px;
  border:1px solid rgba(18,54,74,.10);
  border-radius:16px;
  background:linear-gradient(180deg,#fff,#f7fbfc);
  box-shadow:0 7px 20px rgba(7,54,80,.04);
}
.suw5 .suw5-regional-today-card-v2120.is-home{
  border-color:rgba(6,124,147,.30);
  background:linear-gradient(145deg,#07364f,#0a788a);
  color:#fff;
  box-shadow:0 12px 27px rgba(7,54,80,.16);
}
.suw5 .suw5-regional-today-card-v2120 header{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:11px;}
.suw5 .suw5-regional-today-card-v2120 header strong{color:#123d52;font-size:15px;font-weight:950;line-height:1.12;}
.suw5 .suw5-regional-today-card-v2120.is-home header strong{color:#fff;}
.suw5 .suw5-regional-today-card-v2120 header span{padding:4px 7px;border-radius:999px;background:#f0bd50;color:#07364f;font-size:8px;font-weight:950;text-transform:uppercase;letter-spacing:.06em;}
.suw5 .suw5-regional-today-condition-v2120{display:flex;align-items:center;gap:7px;min-height:35px;margin-bottom:7px;}
.suw5 .suw5-regional-today-condition-v2120 i{font-size:23px;font-style:normal;}
.suw5 .suw5-regional-today-condition-v2120 span{color:#5f7884;font-size:11px;font-weight:800;line-height:1.25;}
.suw5 .is-home .suw5-regional-today-condition-v2120 span{color:rgba(255,255,255,.77);}
.suw5 .suw5-regional-today-temp-v2120{display:flex;align-items:baseline;gap:4px;margin:5px 0 12px;}
.suw5 .suw5-regional-today-temp-v2120 b{color:#0c6782;font-size:34px;line-height:1;font-weight:950;}
.suw5 .suw5-regional-today-temp-v2120 span{color:#8798a0;font-size:16px;font-weight:850;}
.suw5 .is-home .suw5-regional-today-temp-v2120 b,.suw5 .is-home .suw5-regional-today-temp-v2120 span{color:#fff;}
.suw5 .suw5-regional-today-meta-v2120{display:grid;grid-template-columns:1fr 1.25fr;gap:6px;}
.suw5 .suw5-regional-today-meta-v2120 > span{min-width:0;padding:8px;border:1px solid rgba(18,54,74,.08);border-radius:10px;background:#f5f9fa;}
.suw5 .is-home .suw5-regional-today-meta-v2120 > span{border-color:rgba(255,255,255,.15);background:rgba(255,255,255,.10);}
.suw5 .suw5-regional-today-meta-v2120 small{display:block;color:#7c8f98;font-size:7px;font-weight:900;text-transform:uppercase;letter-spacing:.06em;}
.suw5 .suw5-regional-today-meta-v2120 b{display:block;margin-top:3px;color:#173f52;font-size:10px;line-height:1.2;font-weight:900;overflow-wrap:anywhere;}
.suw5 .is-home .suw5-regional-today-meta-v2120 small,.suw5 .is-home .suw5-regional-today-meta-v2120 b{color:#fff;}

/* Hour-by-hour: all ten locations remain visible; the location index is only a jump aid. */
.suw5 .suw5-regional-location-index-v2120{display:flex;flex-wrap:wrap;gap:6px;margin:-2px 0 18px;}
.suw5 .suw5-regional-location-index-v2120 a{padding:7px 10px;border:1px solid rgba(18,54,74,.10);border-radius:999px;background:#f5f9fa;color:#0b738a !important;font-size:9px;font-weight:900;text-decoration:none !important;}
.suw5 .suw5-regional-location-index-v2120 a.is-home{background:#07364f;color:#fff !important;border-color:#07364f;}
.suw5 .suw5-regional-hourly-locations-v2120,.suw5 .suw5-regional-extended-locations-v2120{display:grid;gap:13px;}
.suw5 .suw5-regional-hourly-location-v2120,.suw5 .suw5-regional-extended-location-v2120{
  min-width:0;
  padding:15px;
  border:1px solid rgba(18,54,74,.09);
  border-radius:16px;
  background:#fbfdfd;
  scroll-margin-top:110px;
}
.suw5 .suw5-regional-hourly-location-v2120.is-home,.suw5 .suw5-regional-extended-location-v2120.is-home{
  border-color:rgba(6,124,147,.24);
  background:linear-gradient(180deg,#f2fbfc,#fff);
  box-shadow:inset 4px 0 0 #0a7890;
}
.suw5 .suw5-regional-hourly-location-v2120 > header,.suw5 .suw5-regional-extended-location-v2120 > header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 1px 10px;}
.suw5 .suw5-regional-hourly-location-v2120 > header > div{display:flex;align-items:center;gap:8px;}
.suw5 .suw5-regional-hourly-location-v2120 > header strong,.suw5 .suw5-regional-extended-location-v2120 > header strong{color:#123d52;font-size:16px;font-weight:950;}
.suw5 .suw5-regional-hourly-location-v2120 > header span,.suw5 .suw5-regional-extended-location-v2120 > header span{padding:4px 7px;border-radius:999px;background:#e2f3f5;color:#0b7287;font-size:7px;font-weight:950;text-transform:uppercase;letter-spacing:.05em;}
.suw5 .suw5-regional-hourly-location-v2120 > header small{color:#7d9098;font-size:9px;font-weight:800;}
.suw5 .suw5-regional-hour-grid-v2120{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:7px;}
.suw5 .suw5-regional-hour-v2120{min-width:0;padding:10px 7px;border:1px solid rgba(18,54,74,.08);border-radius:11px;background:#fff;text-align:center;}
.suw5 .suw5-regional-hour-v2120 > strong{display:block;color:#173f52;font-size:11px;font-weight:950;}
.suw5 .suw5-regional-hour-v2120 > i{display:block;margin:4px 0 2px;font-size:20px;font-style:normal;}
.suw5 .suw5-regional-hour-v2120 > b{display:block;color:#0b7890;font-size:21px;line-height:1.05;font-weight:950;}
.suw5 .suw5-regional-hour-v2120 > span{display:block;margin-top:3px;color:#6d828c;font-size:8px;line-height:1.18;font-weight:750;}

/* Five-day rows */
.suw5 .suw5-regional-extended-grid-v2120{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:7px;}
.suw5 .suw5-regional-day-v2120{min-width:0;padding:10px 8px;border:1px solid rgba(18,54,74,.08);border-radius:11px;background:#fff;text-align:center;}
.suw5 .suw5-regional-day-v2120 > strong{display:block;color:#173f52;font-size:12px;font-weight:950;}
.suw5 .suw5-regional-day-v2120 > small{display:block;margin-top:2px;color:#8a9aa1;font-size:7px;font-weight:750;}
.suw5 .suw5-regional-day-v2120 > i{display:block;margin:5px 0 3px;font-size:21px;font-style:normal;}
.suw5 .suw5-regional-day-v2120 > b{display:block;color:#0b7890;font-size:18px;line-height:1.05;font-weight:950;}
.suw5 .suw5-regional-day-v2120 > b span{color:#71858f;font-size:11px;font-weight:850;}
.suw5 .suw5-regional-day-v2120 > em{display:block;min-height:28px;margin-top:5px;color:#5e7580;font-size:8px;line-height:1.2;font-style:normal;font-weight:750;}
.suw5 .suw5-regional-day-v2120 > span{display:block;margin-top:4px;color:#6d828c;font-size:8px;font-weight:800;}
.suw5 .suw5-regional-forecast-unavailable-v2120{padding:18px;border-radius:11px;background:#f5f9fa;color:#6d828c;font-size:11px;font-weight:800;}

.suw5 .suw5-regional-marine-v2120{scroll-margin-top:110px;}
.suw5 .suw5-regional-marine-v2120 .suw5-section-head p{color:rgba(255,255,255,.73) !important;}
.suw5 .suw5-regional-forecast-sources-v2120{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;padding:18px 20px !important;background:#f5f9fa !important;}
.suw5 .suw5-regional-forecast-sources-v2120 > div{padding:13px 14px;border:1px solid rgba(18,54,74,.08);border-radius:12px;background:#fff;}
.suw5 .suw5-regional-forecast-sources-v2120 strong{display:block;color:#173f52;font-size:11px;font-weight:950;}
.suw5 .suw5-regional-forecast-sources-v2120 span{display:block;margin-top:4px;color:#71858f;font-size:9px;line-height:1.35;font-weight:750;}

@media(max-width:1100px){
  .suw5 .suw5-regional-today-grid-v2120{grid-template-columns:repeat(3,minmax(0,1fr));}
  .suw5 .suw5-regional-hour-grid-v2120{grid-template-columns:repeat(3,minmax(0,1fr));}
}

@media(max-width:760px){
  .suw5 .suw5-regional-forecast-intro-v2120{grid-template-columns:1fr;gap:17px;padding:25px 19px !important;border-radius:19px !important;}
  .suw5 .suw5-regional-forecast-intro-v2120 h1{font-size:39px !important;}
  .suw5 .suw5-regional-forecast-intro-v2120 p{font-size:12px !important;}
  .suw5 .suw5-regional-forecast-home-v2120{padding:15px 16px;}
  .suw5 .suw5-regional-forecast-jump-v2120{display:grid;grid-template-columns:1fr 1fr;}
  .suw5 .suw5-regional-forecast-jump-v2120 a{width:100%;}
  .suw5 .suw5-regional-forecast-section-v2120{margin-left:10px !important;margin-right:10px !important;padding:21px 12px !important;border-radius:18px !important;}
  .suw5 .suw5-regional-forecast-head-v2120{display:block !important;margin-bottom:15px !important;}
  .suw5 .suw5-regional-forecast-head-v2120 h2{font-size:34px !important;}
  .suw5 .suw5-regional-forecast-head-v2120 p{font-size:11px !important;}
  .suw5 .suw5-regional-forecast-head-v2120 > b{display:block;margin-top:8px;}
  .suw5 .suw5-regional-today-grid-v2120{grid-template-columns:1fr 1fr;gap:7px;}
  .suw5 .suw5-regional-today-card-v2120{padding:12px;border-radius:13px;}
  .suw5 .suw5-regional-today-card-v2120.is-home{grid-column:1 / -1;}
  .suw5 .suw5-regional-today-card-v2120 header strong{font-size:13px;}
  .suw5 .suw5-regional-today-temp-v2120 b{font-size:29px;}
  .suw5 .suw5-regional-today-condition-v2120 span{font-size:9px;}
  .suw5 .suw5-regional-today-meta-v2120{grid-template-columns:1fr;}
  .suw5 .suw5-regional-location-index-v2120{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:5px;}
  .suw5 .suw5-regional-location-index-v2120 a{text-align:center;}
  .suw5 .suw5-regional-hourly-locations-v2120,.suw5 .suw5-regional-extended-locations-v2120{gap:9px;}
  .suw5 .suw5-regional-hourly-location-v2120,.suw5 .suw5-regional-extended-location-v2120{padding:11px;border-radius:14px;}
  .suw5 .suw5-regional-hour-grid-v2120{grid-template-columns:repeat(3,minmax(0,1fr));gap:5px;}
  .suw5 .suw5-regional-hour-v2120{padding:9px 4px;}
  .suw5 .suw5-regional-hour-v2120 > b{font-size:19px;}
  .suw5 .suw5-regional-hour-v2120 > span{font-size:7px;}
  .suw5 .suw5-regional-extended-grid-v2120{grid-template-columns:repeat(5,minmax(0,1fr));gap:4px;}
  .suw5 .suw5-regional-day-v2120{padding:8px 3px;border-radius:9px;}
  .suw5 .suw5-regional-day-v2120 > strong{font-size:10px;}
  .suw5 .suw5-regional-day-v2120 > small{display:none;}
  .suw5 .suw5-regional-day-v2120 > i{font-size:18px;}
  .suw5 .suw5-regional-day-v2120 > b{font-size:15px;}
  .suw5 .suw5-regional-day-v2120 > b span{font-size:9px;}
  .suw5 .suw5-regional-day-v2120 > em{display:none;}
  .suw5 .suw5-regional-day-v2120 > span{font-size:7px;}
  .suw5 .suw5-regional-forecast-sources-v2120{grid-template-columns:1fr;padding:13px !important;}
  .suw5 .suw5-regional-card-v2110 .suw5-regional-score-v2120{padding:8px;}
  .suw5 .suw5-regional-card-v2110 .suw5-regional-score-v2120 > b{font-size:20px;}
}


/* ============================================================
   V2.12.1 — Forecast page interaction/readability correction
   ============================================================ */
.suw5 .suw5-regional-today-card-head-v2121{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  margin:0 0 12px;padding:0;background:transparent !important;border:0 !important;
}
.suw5 .suw5-regional-today-card-head-v2121 strong{
  display:block;color:#123d52 !important;background:transparent !important;
  font-size:16px;font-weight:950;line-height:1.15;
}
.suw5 .suw5-regional-today-card-v2121.is-home{
  background:linear-gradient(145deg,#063850 0%,#08778c 70%,#16a1b2 100%) !important;
  border:1px solid rgba(8,122,146,.35) !important;
}
.suw5 .suw5-regional-today-card-v2121.is-home .suw5-regional-today-card-head-v2121 strong,
.suw5 .suw5-regional-today-card-v2121.is-home .suw5-regional-today-condition-v2120 span,
.suw5 .suw5-regional-today-card-v2121.is-home .suw5-regional-today-temp-v2120 b,
.suw5 .suw5-regional-today-card-v2121.is-home .suw5-regional-today-temp-v2120 span,
.suw5 .suw5-regional-today-card-v2121.is-home .suw5-regional-today-meta-v2120 small,
.suw5 .suw5-regional-today-card-v2121.is-home .suw5-regional-today-meta-v2120 b{color:#fff !important;}
.suw5 .suw5-regional-today-card-head-v2121 span{
  display:inline-flex;align-items:center;justify-content:center;padding:5px 9px;
  border-radius:999px;background:#f6d74e;color:#07364f !important;font-size:8px;
  font-weight:950;text-transform:uppercase;letter-spacing:.08em;white-space:nowrap;
}

/* Location switchers: one visible forecast at a time, Nags Head first. */
.suw5 .suw5-location-tabs-v2121{
  display:flex;gap:8px;overflow-x:auto;overscroll-behavior-inline:contain;
  padding:2px 1px 12px;margin:0 0 14px;scrollbar-width:thin;
}
.suw5 .suw5-location-tabs-v2121 button{
  flex:0 0 auto;appearance:none;border:1px solid rgba(18,54,74,.13);border-radius:999px;
  background:#f4f8f9;color:#0b6f87;padding:9px 14px;font:inherit;font-size:11px;
  font-weight:900;line-height:1;cursor:pointer;box-shadow:none;
}
.suw5 .suw5-location-tabs-v2121 button:hover{background:#e9f4f6;}
.suw5 .suw5-location-tabs-v2121 button.is-active{
  background:#083c55;color:#fff;border-color:#083c55;box-shadow:0 7px 18px rgba(7,54,80,.14);
}
.suw5 .suw5-location-tabs-v2121 button.is-home.is-active{box-shadow:inset 0 3px 0 #efc34f,0 7px 18px rgba(7,54,80,.16);}
.suw5 .suw5-location-panels-v2121 > [hidden]{display:none !important;}
.suw5 .suw5-regional-hourly-location-v2121,
.suw5 .suw5-regional-extended-location-v2121{
  padding:17px;border:1px solid rgba(18,54,74,.10);border-radius:17px;background:#fbfdfd;
}
.suw5 .suw5-regional-hourly-location-v2121.is-home,
.suw5 .suw5-regional-extended-location-v2121.is-home{
  border-color:rgba(6,124,147,.25);background:linear-gradient(180deg,#f0fafb,#fff);
  box-shadow:inset 4px 0 0 #0a7890;
}
.suw5 .suw5-location-panel-head-v2121{
  display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 1px 13px;
}
.suw5 .suw5-location-panel-head-v2121 > div{display:flex;align-items:center;gap:9px;min-width:0;}
.suw5 .suw5-location-panel-head-v2121 strong{color:#123d52;font-size:19px;font-weight:950;}
.suw5 .suw5-location-panel-head-v2121 span{padding:4px 8px;border-radius:999px;background:#dff2f5;color:#0a7388;font-size:8px;font-weight:950;text-transform:uppercase;letter-spacing:.06em;}
.suw5 .suw5-location-panel-head-v2121 small{color:#758b95;font-size:10px;font-weight:850;}

.suw5 .suw5-regional-hour-grid-v2121{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px;}
.suw5 .suw5-regional-hour-v2121{min-width:0;padding:12px 7px;border:1px solid rgba(18,54,74,.09);border-radius:12px;background:#fff;text-align:center;}
.suw5 .suw5-regional-hour-v2121 > strong{display:block;color:#173f52;font-size:12px;font-weight:950;}
.suw5 .suw5-regional-hour-v2121 > i{display:block;margin:5px 0 3px;font-size:23px;font-style:normal;}
.suw5 .suw5-regional-hour-v2121 > b{display:block;color:#087a91;font-size:23px;line-height:1;font-weight:950;}
.suw5 .suw5-regional-hour-v2121 > span{display:block;margin-top:4px;color:#607985;font-size:9px;line-height:1.2;font-weight:760;}

.suw5 .suw5-regional-extended-grid-v2121{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:9px;}
.suw5 .suw5-regional-day-v2121{min-width:0;padding:14px 10px;border:1px solid rgba(18,54,74,.09);border-radius:13px;background:#fff;text-align:center;}
.suw5 .suw5-regional-day-v2121 > strong{display:block;color:#173f52;font-size:14px;font-weight:950;}
.suw5 .suw5-regional-day-v2121 > small{display:block;margin-top:2px;color:#83959d;font-size:9px;font-weight:750;}
.suw5 .suw5-regional-day-v2121 > i{display:block;margin:7px 0 4px;font-size:26px;font-style:normal;}
.suw5 .suw5-regional-day-v2121 > b{display:block;color:#087a91;font-size:23px;line-height:1.05;font-weight:950;}
.suw5 .suw5-regional-day-v2121 > b span{color:#70848e;font-size:13px;font-weight:850;}
.suw5 .suw5-regional-day-v2121 > em{display:block;min-height:32px;margin-top:7px;color:#516c79;font-size:10px;line-height:1.25;font-style:normal;font-weight:800;}
.suw5 .suw5-regional-day-v2121 > span{display:block;margin-top:5px;color:#667e89;font-size:9px;line-height:1.2;font-weight:780;}

/* Marine forecast rebuilt as an independent light card to avoid legacy dark-panel CSS collisions. */
.suw5 .suw5-regional-marine-v2121{
  margin-top:22px !important;padding:28px !important;border:1px solid rgba(18,54,74,.10) !important;
  border-radius:20px !important;background:linear-gradient(180deg,#f8fcfd,#eef8fa) !important;
  color:#173f52 !important;box-shadow:0 12px 30px rgba(7,54,80,.06) !important;
}
.suw5 .suw5-regional-marine-v2121 .suw5-marine-head-v2121 h2{color:#123d52 !important;}
.suw5 .suw5-regional-marine-v2121 .suw5-marine-head-v2121 p{color:#5f7782 !important;}
.suw5 .suw5-regional-marine-v2121 .suw5-marine-head-v2121 > b{color:#087a91 !important;background:#e5f5f7 !important;}
.suw5 .suw5-marine-card-v2121{padding:20px;border:1px solid rgba(18,54,74,.10);border-radius:16px;background:#fff;}
.suw5 .suw5-marine-card-title-v2121{display:flex;align-items:center;gap:12px;margin-bottom:14px;}
.suw5 .suw5-marine-card-title-v2121 > span{font-size:30px;}
.suw5 .suw5-marine-card-title-v2121 strong{display:block;color:#123d52 !important;font-size:19px;font-weight:950;}
.suw5 .suw5-marine-card-title-v2121 small{display:block;margin-top:3px;color:#71858f !important;font-size:10px;font-weight:780;}
.suw5 .suw5-marine-periods-v2121{display:grid;grid-template-columns:1fr 1fr;gap:9px;}
.suw5 .suw5-marine-period-v2121{padding:14px;border:1px solid rgba(18,54,74,.08);border-radius:12px;background:#f5fafb;}
.suw5 .suw5-marine-period-v2121 strong{display:block;color:#123d52 !important;font-size:12px;font-weight:950;}
.suw5 .suw5-marine-period-v2121 p{margin:5px 0 0;color:#536f7b !important;font-size:10px;line-height:1.45;font-weight:720;}
.suw5 .suw5-marine-link-v2121{display:inline-flex;margin-top:14px;color:#087a91 !important;font-size:11px;font-weight:950;text-decoration:none !important;}

@media(max-width:1100px){
  .suw5 .suw5-regional-hour-grid-v2121{grid-template-columns:repeat(4,minmax(0,1fr));}
}
@media(max-width:760px){
  .suw5 .suw5-regional-today-card-head-v2121 strong{font-size:15px;}
  .suw5 .suw5-location-tabs-v2121{margin-left:-2px;margin-right:-2px;padding-bottom:10px;}
  .suw5 .suw5-location-tabs-v2121 button{padding:9px 12px;font-size:10px;}
  .suw5 .suw5-regional-hourly-location-v2121,.suw5 .suw5-regional-extended-location-v2121{padding:12px;}
  .suw5 .suw5-location-panel-head-v2121{align-items:flex-start;}
  .suw5 .suw5-location-panel-head-v2121 strong{font-size:17px;}
  .suw5 .suw5-location-panel-head-v2121 small{font-size:9px;}
  .suw5 .suw5-regional-hour-grid-v2121{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;}
  .suw5 .suw5-regional-hour-v2121{padding:11px 5px;}
  .suw5 .suw5-regional-hour-v2121 > b{font-size:22px;}
  .suw5 .suw5-regional-extended-grid-v2121{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;}
  .suw5 .suw5-regional-day-v2121:last-child{grid-column:1 / -1;}
  .suw5 .suw5-regional-day-v2121{padding:12px 7px;}
  .suw5 .suw5-regional-day-v2121 > em{min-height:0;}
  .suw5 .suw5-regional-marine-v2121{margin-left:10px !important;margin-right:10px !important;padding:20px 12px !important;border-radius:18px !important;}
  .suw5 .suw5-marine-card-v2121{padding:14px;}
  .suw5 .suw5-marine-periods-v2121{grid-template-columns:1fr;}
}

/* ================================================================
   V2.13.0 — forecast contrast + location-aware Beach & Ocean
   ================================================================ */
body .suw5.suw5-regional-forecasts-page-v2130 .suw5-regional-forecast-intro-v2120{
  display:grid !important;background:linear-gradient(135deg,#07364f 0%,#086d82 62%,#0b8993 100%) !important;color:#fff !important;opacity:1 !important;visibility:visible !important;
}
body .suw5.suw5-regional-forecasts-page-v2130 .suw5-regional-forecast-intro-v2120 *{visibility:visible !important;opacity:1;}
body .suw5.suw5-regional-forecasts-page-v2130 .suw5-regional-forecast-intro-v2120 h1,
body .suw5.suw5-regional-forecasts-page-v2130 .suw5-regional-forecast-intro-v2120 strong{color:#fff !important;}
body .suw5.suw5-regional-forecasts-page-v2130 .suw5-regional-forecast-intro-v2120 p,
body .suw5.suw5-regional-forecasts-page-v2130 .suw5-regional-forecast-intro-v2120 .suw5-regional-forecast-home-v2120 span{color:rgba(255,255,255,.84) !important;}
body .suw5.suw5-regional-forecasts-page-v2130 .suw5-location-tabs-v2121 button.is-active{
  background:#087a91 !important;color:#fff !important;border-color:#087a91 !important;box-shadow:0 7px 18px rgba(7,54,80,.14) !important;
}
body .suw5.suw5-regional-forecasts-page-v2130 .suw5-location-tabs-v2121 button.is-home.is-active{box-shadow:0 7px 18px rgba(7,54,80,.14) !important;}

.suw5 .suw5-beach-page-topnav-v2130{padding:20px 22px;border:1px solid rgba(18,54,74,.10);border-radius:19px;background:#fff;box-shadow:0 10px 26px rgba(7,54,80,.055);margin-bottom:18px;}
.suw5 .suw5-beach-page-topnav-v2130>div>span{display:block;margin:0 0 8px;color:#a97915;font-size:10px;font-weight:900;letter-spacing:.13em;text-transform:uppercase;}
.suw5 .suw5-beach-location-tabs-v2130{display:flex;flex-wrap:wrap;gap:7px;}
.suw5 .suw5-beach-location-tabs-v2130 button{appearance:none;border:1px solid rgba(18,54,74,.12);background:#f5f9fa;color:#0b7188;border-radius:999px;padding:9px 13px;font-size:10px;font-weight:900;cursor:pointer;}
.suw5 .suw5-beach-location-tabs-v2130 button.is-active{background:#087a91;color:#fff;border-color:#087a91;box-shadow:0 6px 16px rgba(7,54,80,.14);}
.suw5 .suw5-beach-section-links-v2130{display:flex;gap:8px;margin-top:12px;padding-top:12px;border-top:1px solid rgba(18,54,74,.08);}
.suw5 .suw5-beach-section-links-v2130 a{display:inline-flex;padding:8px 12px;border-radius:999px;background:#edf6f7;color:#0a7187 !important;font-size:10px;font-weight:900;text-decoration:none !important;}
.suw5 .suw5-beach-location-panel-v2130{padding:30px 32px;border:1px solid rgba(18,54,74,.09);border-radius:22px;background:#fff;box-shadow:0 14px 36px rgba(7,54,80,.06);}
.suw5 .suw5-beach-location-title-v2130{display:grid;grid-template-columns:minmax(0,1fr) 230px;gap:24px;align-items:center;}
.suw5 .suw5-beach-location-title-v2130>div:first-child>span{display:block;color:#ad7b13;font-size:10px;font-weight:900;letter-spacing:.13em;}
.suw5 .suw5-beach-location-title-v2130 h1{margin:4px 0 8px !important;color:#123d52 !important;font-size:clamp(38px,4vw,56px) !important;line-height:1 !important;}
.suw5 .suw5-beach-location-title-v2130 p{margin:0;color:#647c87;font-size:14px;line-height:1.45;}
.suw5 .suw5-beach-score-badge-v2130{padding:17px 18px;border-radius:18px;background:#eef6f7;border:1px solid rgba(18,54,74,.08);}
.suw5 .suw5-beach-score-badge-v2130 small{display:block;font-size:8px;font-weight:950;text-transform:uppercase;letter-spacing:.08em;}
.suw5 .suw5-beach-score-badge-v2130 strong{display:block;font-size:40px;line-height:1;font-weight:950;}
.suw5 .suw5-beach-score-badge-v2130 strong span{font-size:13px;margin-left:3px;}
.suw5 .suw5-beach-score-badge-v2130 em{display:block;margin-top:4px;font-style:normal;font-size:10px;font-weight:850;}
.suw5 .suw5-beach-score-badge-v2130.score-excellent,.suw5 .suw5-beach-score-badge-v2130.score-great{background:#e9f7ef;color:#187a4b;}
.suw5 .suw5-beach-score-badge-v2130.score-good{background:#e9f5f8;color:#096d83;}
.suw5 .suw5-beach-score-badge-v2130.score-fair{background:#fff6dc;color:#876207;}
.suw5 .suw5-beach-score-badge-v2130.score-poor{background:#fff0ee;color:#a43d35;}
.suw5 .suw5-beach-score-summary-v2130{margin:20px 0 18px;padding:14px 16px;border-left:4px solid #e4b43e;background:#fbf8ee;color:#244c60;font-size:13px;font-weight:750;line-height:1.5;}
.suw5 .suw5-beach-essential-grid-v2130{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));border-top:1px solid rgba(18,54,74,.10);border-bottom:1px solid rgba(18,54,74,.10);}
.suw5 .suw5-beach-essential-grid-v2130>div{padding:16px 12px;border-right:1px solid rgba(18,54,74,.08);min-width:0;}
.suw5 .suw5-beach-essential-grid-v2130>div:last-child{border-right:0;}
.suw5 .suw5-beach-essential-grid-v2130 small{display:block;color:#78909b;font-size:8px;font-weight:900;text-transform:uppercase;letter-spacing:.09em;}
.suw5 .suw5-beach-essential-grid-v2130 strong{display:block;margin-top:5px;color:#0c6680;font-size:21px;line-height:1.12;font-weight:950;overflow-wrap:anywhere;}
.suw5 .suw5-beach-essential-grid-v2130 span{display:block;margin-top:4px;color:#8ca0a8;font-size:8px;line-height:1.25;}
.suw5 .suw5-beach-score-reasons-v2130{margin-top:24px;}
.suw5 .suw5-beach-score-reasons-head-v2130{display:flex;justify-content:space-between;gap:15px;align-items:end;margin-bottom:12px;}
.suw5 .suw5-beach-score-reasons-head-v2130 span{display:block;color:#ad7b13;font-size:9px;font-weight:900;letter-spacing:.12em;}
.suw5 .suw5-beach-score-reasons-head-v2130 h2{margin:2px 0 0 !important;color:#123d52 !important;font-size:25px !important;}
.suw5 .suw5-beach-score-reasons-head-v2130>strong{color:#087a91;font-size:22px;}
.suw5 .suw5-beach-score-reason-grid-v2130{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:9px;}
.suw5 .suw5-beach-score-reason-v2130{padding:13px;border:1px solid rgba(18,54,74,.09);border-radius:13px;background:#f8fbfb;}
.suw5 .suw5-beach-score-reason-v2130 small{display:block;color:#708791;font-size:8px;font-weight:900;text-transform:uppercase;line-height:1.2;}
.suw5 .suw5-beach-score-reason-v2130 strong{display:block;margin:7px 0 5px;color:#0a6680;font-size:16px;}
.suw5 .suw5-beach-score-reason-v2130 p{margin:0;color:#667e89;font-size:9px;line-height:1.35;}
.suw5 .suw5-beach-score-bottomline-v2130{margin-top:10px;padding:14px 16px;border-radius:13px;background:#edf6f7;}
.suw5 .suw5-beach-score-bottomline-v2130 strong{color:#123d52;font-size:11px;}
.suw5 .suw5-beach-score-bottomline-v2130 p{margin:3px 0 0;color:#5b7480;font-size:11px;line-height:1.45;}
.suw5 .suw5-site-ocean-safety-v2130{margin-top:20px;}
.suw5 .suw5-site-ocean-groups-v2130{display:grid;grid-template-columns:1.4fr 1fr;gap:13px;margin-bottom:20px;}
.suw5 .suw5-site-ocean-group-v2130{padding:17px;border:1px solid rgba(18,54,74,.09);border-radius:15px;background:#fbfdfd;}
.suw5 .suw5-site-ocean-group-v2130 h3{margin:0 0 11px;color:#123d52;font-size:17px;}
.suw5 .suw5-site-ocean-location-grid-v2130{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;}
.suw5 .suw5-site-ocean-location-v2130{display:flex;justify-content:space-between;gap:9px;align-items:center;padding:9px 10px;border-radius:10px;background:#f3f7f8;}
.suw5 .suw5-site-ocean-location-v2130 strong{color:#173f52;font-size:10px;}
.suw5 .suw5-site-ocean-location-v2130 span{padding:4px 7px;border-radius:999px;font-size:8px;font-weight:950;}
.suw5 .suw5-site-ocean-location-v2130.risk-low span{background:#def4e6;color:#177649}.suw5 .suw5-site-ocean-location-v2130.risk-moderate span{background:#fff0bd;color:#8a6200}.suw5 .suw5-site-ocean-location-v2130.risk-high span{background:#ffe0dd;color:#a13b33}.suw5 .suw5-site-ocean-location-v2130.risk-unknown span{background:#edf1f3;color:#667b85}

@media(max-width:760px){
  .suw5 .suw5-beach-page-topnav-v2130{padding:16px 14px;margin-left:10px;margin-right:10px;}
  .suw5 .suw5-beach-location-tabs-v2130{flex-wrap:nowrap;overflow-x:auto;padding-bottom:5px;-webkit-overflow-scrolling:touch;}
  .suw5 .suw5-beach-location-tabs-v2130 button{flex:0 0 auto;padding:10px 13px;font-size:10px;}
  .suw5 .suw5-beach-location-panel-v2130{margin:0 10px;padding:22px 16px;border-radius:18px;}
  .suw5 .suw5-beach-location-title-v2130{grid-template-columns:1fr;gap:15px;}
  .suw5 .suw5-beach-location-title-v2130 h1{font-size:40px !important;}
  .suw5 .suw5-beach-score-badge-v2130{display:grid;grid-template-columns:1fr auto;align-items:center;column-gap:10px;}
  .suw5 .suw5-beach-score-badge-v2130 small,.suw5 .suw5-beach-score-badge-v2130 em{grid-column:1;}.suw5 .suw5-beach-score-badge-v2130 strong{grid-column:2;grid-row:1/3;font-size:34px;}
  .suw5 .suw5-beach-essential-grid-v2130{grid-template-columns:repeat(2,minmax(0,1fr));border:0;gap:8px;}
  .suw5 .suw5-beach-essential-grid-v2130>div{padding:12px;border:1px solid rgba(18,54,74,.09)!important;border-radius:12px;background:#f8fbfb;}
  .suw5 .suw5-beach-essential-grid-v2130 strong{font-size:19px;}
  .suw5 .suw5-beach-score-reason-grid-v2130{grid-template-columns:1fr;}
  .suw5 .suw5-beach-score-reason-v2130 p{font-size:10px;}
  .suw5 .suw5-site-ocean-groups-v2130{grid-template-columns:1fr;}
  .suw5 .suw5-site-ocean-location-grid-v2130{grid-template-columns:1fr;}
}

/* ================================================================
   V2.13.1 — Beach & Ocean selector containment + singular Beach Cam
   ================================================================ */
.suw5 .suw5-beach-explorer-v2131{
  margin:0 0 20px;
  border:1px solid rgba(18,54,74,.09);
  border-radius:24px;
  background:#fff;
  box-shadow:0 14px 36px rgba(7,54,80,.06);
  overflow:hidden;
}
.suw5 .suw5-beach-selector-v2131{
  padding:22px 30px 18px;
  background:linear-gradient(135deg,#f8fbfb 0%,#f1f8f9 62%,#fbf8ee 100%);
  border-bottom:1px solid rgba(18,54,74,.09);
}
.suw5 .suw5-beach-selector-v2131>span{
  display:block;
  margin:0 0 10px;
  color:#a97915;
  font-size:10px;
  font-weight:950;
  letter-spacing:.14em;
  text-transform:uppercase;
}
.suw5 .suw5-beach-explorer-v2131 .suw5-beach-location-panel-v2130{
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
  margin:0 !important;
  padding-top:26px;
}
.suw5 .suw5-beach-section-links-v2130{display:none !important;}
@media(max-width:760px){
  .suw5 .suw5-beach-explorer-v2131{margin:0 10px 18px;border-radius:20px;}
  .suw5 .suw5-beach-selector-v2131{padding:16px 14px 12px;}
  .suw5 .suw5-beach-explorer-v2131 .suw5-beach-location-panel-v2130{margin:0 !important;padding:19px 15px 22px;border-radius:0 !important;}
  .suw5 .suw5-beach-selector-v2131 .suw5-beach-location-tabs-v2130{margin-left:-2px;margin-right:-2px;padding-bottom:4px;}
}


/* V2.13.5: make the live hero status a clear, keyboard-accessible link to Current Weather. */
.suw5 .suw5-hero-live-link-v2135 {
  color: #fff !important;
  text-decoration: none !important;
  cursor: pointer;
  transition: background .18s ease, border-color .18s ease, transform .18s ease, box-shadow .18s ease;
}
.suw5 .suw5-hero-live-link-v2135:hover {
  color: #fff !important;
  background: rgba(5,47,62,.58);
  border-color: rgba(255,255,255,.52);
  transform: translateY(-1px);
  box-shadow: 0 8px 22px rgba(0,0,0,.16);
}
.suw5 .suw5-hero-live-link-v2135:focus-visible {
  outline: 3px solid rgba(255,205,74,.95);
  outline-offset: 3px;
}


/* ================================================================
   V2.14.0 — site-wide polish and consistency pass
   Presentation only. No native-app/API/data/scoring behavior changes.
   ================================================================ */

@media (min-width: 761px) {
  .suw5-home-compact-v2519 .suw5-hero-content-minimal {
    max-width: 780px !important;
  }
  .suw5-home-compact-v2519 .suw5-hero-content-minimal h1 {
    font-size: clamp(46px, 5.1vw, 72px) !important;
    line-height: .99 !important;
    letter-spacing: -.038em !important;
  }
}

.suw5 .suw5-hero-quick-v2134 > div > span {
  color: rgba(255,255,255,.60) !important;
  font-size: 10px !important;
  letter-spacing: .15em !important;
}
.suw5 .suw5-hero-quick-v2134 > div > strong,
.suw5 .suw5-hero-quick-v2134 > div > strong > span {
  font-weight: 950 !important;
}

/* Consistent Beach Score color language. */
.suw5 .suw5-beach-dashboard-v280 > .suw5-beach-score-card-v1098.suw5-score-excellent {
  background: linear-gradient(135deg,#126337,#29955f) !important;
}
.suw5 .suw5-beach-dashboard-v280 > .suw5-beach-score-card-v1098.suw5-score-great {
  background: linear-gradient(135deg,#176742,#2a9a63) !important;
}
.suw5 .suw5-beach-dashboard-v280 > .suw5-beach-score-card-v1098.suw5-score-good {
  background: linear-gradient(135deg,#0b6173,#178da0) !important;
}
.suw5 .suw5-beach-dashboard-v280 > .suw5-beach-score-card-v1098.suw5-score-fair {
  background: linear-gradient(135deg,#806408,#bf9204) !important;
}
.suw5 .suw5-beach-dashboard-v280 > .suw5-beach-score-card-v1098.suw5-score-poor {
  background: linear-gradient(135deg,#85382e,#c55245) !important;
}
.suw5 .suw5-beach-score-badge-v2130.score-excellent,
.suw5 .suw5-beach-score-badge-v2130.score-great {
  background:#e7f6ed !important; color:#176b43 !important; border-color:#bfe6cf !important;
}
.suw5 .suw5-beach-score-badge-v2130.score-good {
  background:#e7f4f6 !important; color:#0b6f80 !important; border-color:#c4e6eb !important;
}
.suw5 .suw5-beach-score-badge-v2130.score-fair {
  background:#fff5d6 !important; color:#826108 !important; border-color:#f1dc95 !important;
}
.suw5 .suw5-beach-score-badge-v2130.score-poor {
  background:#ffefec !important; color:#a33f35 !important; border-color:#f1c8c3 !important;
}

/* Around the Outer Banks: Beach Score is the second read after temperature. */
.suw5 .suw5-regional-card-v2110 .suw5-regional-score-v2120 {
  grid-template-columns:auto minmax(0,1fr) !important;
  grid-template-areas:"score label" "score rating" !important;
  column-gap:10px !important;
  min-height:58px !important;
  padding:10px 11px !important;
}
.suw5 .suw5-regional-card-v2110 .suw5-regional-score-v2120 > b {
  font-size:27px !important;
  letter-spacing:-.035em !important;
}
.suw5 .suw5-regional-card-v2110 .suw5-regional-score-v2120 small {
  font-size:8px !important;
  letter-spacing:.08em !important;
}
.suw5 .suw5-regional-card-v2110 .suw5-regional-score-v2120 > em {
  font-size:9px !important;
}
.suw5 .suw5-regional-source-v2101,
.suw5 .suw5-regional-note-v2100 {
  display:none !important;
}

.suw5 .suw5-score-drivers-v2140 {
  margin:16px 0 2px;
  padding:11px 14px;
  border:1px solid rgba(18,54,74,.09);
  border-radius:12px;
  background:#f2f8f9;
  color:#31586a;
  font-size:12px;
  line-height:1.4;
  font-weight:850;
}

/* Unified location selectors; sticky on long forecast/beach sections. */
.suw5 .suw5-location-tabs-v2121,
.suw5 .suw5-beach-selector-v2131 {
  position:sticky !important;
  top:72px !important;
  z-index:48 !important;
  background:rgba(255,255,255,.95) !important;
  backdrop-filter:blur(12px) !important;
  -webkit-backdrop-filter:blur(12px) !important;
}
.suw5 .suw5-location-tabs-v2121 {
  margin:0 0 14px !important;
  padding:9px 10px !important;
  border:1px solid rgba(18,54,74,.08);
  border-radius:14px;
  box-shadow:0 8px 22px rgba(7,54,80,.06);
}
.suw5 .suw5-location-tabs-v2121 button,
.suw5 .suw5-beach-location-tabs-v2130 button {
  min-height:42px !important;
  padding:9px 14px !important;
  border:1px solid rgba(18,54,74,.12) !important;
  border-radius:999px !important;
  background:#f5f9fa !important;
  color:#0b7188 !important;
  font-size:10px !important;
  font-weight:900 !important;
  box-shadow:none !important;
}
.suw5 .suw5-location-tabs-v2121 button:hover,
.suw5 .suw5-beach-location-tabs-v2130 button:hover {
  background:#e8f3f5 !important;
}
.suw5 .suw5-location-tabs-v2121 button.is-active,
.suw5 .suw5-beach-location-tabs-v2130 button.is-active {
  background:#087a91 !important;
  color:#fff !important;
  border-color:#087a91 !important;
  box-shadow:0 6px 16px rgba(7,54,80,.13) !important;
}

/* Keep sources out of the decision path; retain one compact attribution footer. */
.suw5 .suw5-regional-forecast-head-v2120 > b {
  display:none !important;
}
.suw5 .suw5-regional-forecast-sources-v2120 {
  display:block !important;
  margin:0 2px !important;
  padding:7px 2px 2px !important;
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  color:#7c8e96 !important;
  font-size:9px !important;
  line-height:1.45 !important;
  font-weight:650 !important;
}

/* Stronger active-alert hierarchy without oversized warnings. */
.suw5 .suw5-alerts-banner.suw5-alerts-warning,
.suw5 .suw5-alerts-banner.suw5-alerts-watch,
.suw5 .suw5-alerts-banner.suw5-alerts-advisory,
.suw5 .suw5-alerts-banner.suw5-alerts-alert {
  border-width:1px !important;
  box-shadow:0 8px 24px rgba(7,54,80,.08) !important;
}
.suw5 .suw5-alerts-banner:not(.suw5-alerts-neutral) .suw5-alerts-copy strong {
  font-size:15px !important;
  font-weight:950 !important;
}
.suw5 .suw5-alerts-banner:not(.suw5-alerts-neutral) .suw5-alerts-copy span {
  opacity:.82 !important;
}

@media (min-width: 761px) {
  .suw5.suw5-regional-forecasts-page-v2120 {
    gap:20px !important;
  }
  .suw5 .suw5-regional-forecast-section-v2120 {
    padding:26px 28px !important;
  }
  .suw5 .suw5-beach-location-panel-v2130 {
    padding:27px 29px !important;
  }
  .suw5 .suw5-beach-score-reasons-v2130 {
    margin-top:16px !important;
  }
}

/* Sticky beach selector must not be trapped by the explorer's old clipping. */
.suw5 .suw5-beach-explorer-v2131 {
  overflow:visible !important;
}
body.admin-bar .suw5 .suw5-location-tabs-v2121,
body.admin-bar .suw5 .suw5-beach-selector-v2131 {
  top:104px !important;
}

/* Smaller, later back-to-top control. */
.suw5-back-to-top-v2519 {
  right:14px !important;
  bottom:14px !important;
  min-height:36px !important;
  padding:7px 10px !important;
  background:rgba(7,54,80,.72) !important;
  border-color:rgba(255,255,255,.35) !important;
  box-shadow:0 7px 20px rgba(7,54,80,.18) !important;
  font-size:11px !important;
}
.suw5-back-to-top-v2519.is-visible {
  opacity:.86 !important;
}

@media (max-width:760px) {
  .suw5 .suw5-location-tabs-v2121,
  .suw5 .suw5-beach-selector-v2131 {
    top:66px !important;
  }
  body.admin-bar .suw5 .suw5-location-tabs-v2121,
  body.admin-bar .suw5 .suw5-beach-selector-v2131 {
    top:112px !important;
  }
  .suw5 .suw5-location-tabs-v2121,
  .suw5 .suw5-beach-location-tabs-v2130 {
    flex-wrap:nowrap !important;
    overflow-x:auto !important;
    scrollbar-width:none;
    -webkit-overflow-scrolling:touch;
  }
  .suw5 .suw5-location-tabs-v2121::-webkit-scrollbar,
  .suw5 .suw5-beach-location-tabs-v2130::-webkit-scrollbar {
    display:none;
  }
  .suw5 .suw5-location-tabs-v2121 button,
  .suw5 .suw5-beach-location-tabs-v2130 button {
    flex:0 0 auto !important;
    min-height:44px !important;
    padding:10px 14px !important;
    font-size:11px !important;
  }
  .suw5 .suw5-score-drivers-v2140 {
    font-size:11px !important;
    margin-top:12px !important;
  }
  .suw5-back-to-top-v2519 {
    right:10px !important;
    bottom:10px !important;
    opacity:.88;
  }
}

/* ================================================================
   V2.14.3 — mobile location-selector containment + nav icon repair
   ================================================================ */
@media (max-width:760px) {
  /* On phones, show every beach choice instead of placing later locations
     beyond the right edge. A compact two-column grid keeps all ten locations
     visible without requiring a hidden horizontal swipe. */
  .suw5 .suw5-location-tabs-v2121,
  .suw5 .suw5-beach-location-tabs-v2130 {
    display:grid !important;
    box-sizing:border-box !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:8px !important;
    width:100% !important;
    max-width:100% !important;
    margin-left:0 !important;
    margin-right:0 !important;
    padding-bottom:0 !important;
    overflow:visible !important;
  }

  .suw5 .suw5-location-tabs-v2121 button,
  .suw5 .suw5-beach-location-tabs-v2130 button {
    box-sizing:border-box !important;
    width:100% !important;
    min-width:0 !important;
    max-width:100% !important;
    min-height:42px !important;
    padding:9px 8px !important;
    white-space:normal !important;
    text-align:center !important;
    justify-content:center !important;
    line-height:1.15 !important;
  }

  /* A multi-row selector would consume too much of a phone screen if sticky.
     Keep desktop sticky behavior unchanged and let the mobile selector scroll
     naturally with the page. */
  .suw5 .suw5-location-tabs-v2121,
  .suw5 .suw5-beach-selector-v2131 {
    position:static !important;
    top:auto !important;
  }

  body.admin-bar .suw5 .suw5-location-tabs-v2121,
  body.admin-bar .suw5 .suw5-beach-selector-v2131 {
    top:auto !important;
  }

  /* The theme already presents icons for the other mobile menu entries. Add
     the missing ocean icon to Beach & Ocean without changing desktop nav. */
  nav.mobile-navigation.suw5-main-clean-nav > a[href*="/beach-conditions/"]::before,
  #mobile-site-navigation.suw5-main-clean-nav > a[href*="/beach-conditions/"]::before {
    content:"🌊" !important;
    display:inline-block !important;
    flex:0 0 1.45em !important;
    width:1.45em !important;
    margin-right:10px !important;
    text-align:center !important;
    font-style:normal !important;
  }
}

/* V2.14.3 — make location selectors read unmistakably as interactive controls
   on both pointer and touch devices. This is presentation only; the existing
   tab JavaScript and location data remain unchanged. */
.suw5 .suw5-location-tabs-v2121 button,
.suw5 .suw5-beach-location-tabs-v2130 button {
  cursor:pointer !important;
  touch-action:manipulation;
  background:linear-gradient(180deg,#ffffff 0%,#edf6f7 100%) !important;
  border-color:rgba(7,88,111,.22) !important;
  box-shadow:inset 0 -2px 0 rgba(7,54,80,.07),0 3px 9px rgba(7,54,80,.08) !important;
  transition:transform .14s ease,box-shadow .14s ease,background .14s ease,border-color .14s ease !important;
}
.suw5 .suw5-location-tabs-v2121 button:hover,
.suw5 .suw5-beach-location-tabs-v2130 button:hover {
  background:#e5f2f4 !important;
  border-color:rgba(7,88,111,.35) !important;
  box-shadow:inset 0 -2px 0 rgba(7,54,80,.08),0 5px 13px rgba(7,54,80,.12) !important;
  transform:translateY(-1px);
}
.suw5 .suw5-location-tabs-v2121 button:focus-visible,
.suw5 .suw5-beach-location-tabs-v2130 button:focus-visible {
  outline:3px solid rgba(8,122,145,.27) !important;
  outline-offset:2px !important;
}
.suw5 .suw5-location-tabs-v2121 button:active,
.suw5 .suw5-beach-location-tabs-v2130 button:active {
  transform:translateY(1px);
  box-shadow:inset 0 1px 2px rgba(7,54,80,.10),0 1px 4px rgba(7,54,80,.08) !important;
}
.suw5 .suw5-location-tabs-v2121 button.is-active,
.suw5 .suw5-beach-location-tabs-v2130 button.is-active {
  background:#087a91 !important;
  color:#fff !important;
  border-color:#087a91 !important;
  box-shadow:inset 0 -2px 0 rgba(0,0,0,.10),0 6px 16px rgba(7,54,80,.16) !important;
}

@media (max-width:760px) {
  .suw5 .suw5-location-tabs-v2121 button,
  .suw5 .suw5-beach-location-tabs-v2130 button {
    min-height:46px !important;
    font-size:11px !important;
    box-shadow:inset 0 -2px 0 rgba(7,54,80,.08),0 3px 9px rgba(7,54,80,.09) !important;
  }
  .suw5 .suw5-location-tabs-v2121 button.is-active,
  .suw5 .suw5-beach-location-tabs-v2130 button.is-active {
    box-shadow:inset 0 -2px 0 rgba(0,0,0,.10),0 5px 14px rgba(7,54,80,.17) !important;
  }
}


/* ================================================================
   V2.14.4 — mobile surf clarity + app-menu icon
   ================================================================ */
@media (max-width:760px) {
  /* Keep the mobile menu icon language consistent for the App destination. */
  nav.mobile-navigation.suw5-main-clean-nav > a[href*="/app/"]::before,
  #mobile-site-navigation.suw5-main-clean-nav > a[href*="/app/"]::before {
    content:"📱" !important;
    display:inline-block !important;
    flex:0 0 1.45em !important;
    width:1.45em !important;
    margin-right:10px !important;
    text-align:center !important;
    font-style:normal !important;
  }
}

/* The website's NOAA fallback is a single regional estimate, not three
   separate Surfline spot observations. Give it an explicit source label and
   keep the hierarchy simple on every screen. */
.suw5 .suw5-surfline-source-v2144 {
  display:inline-flex;
  align-items:center;
  width:max-content;
  max-width:100%;
  margin-top:8px;
  padding:5px 9px;
  border-radius:999px;
  background:rgba(10,122,145,.10);
  color:#0a6479;
  font-size:11px;
  line-height:1.2;
  font-weight:900;
  letter-spacing:.035em;
  text-transform:uppercase;
}
.suw5 .suw5-surfline-fallback-v2144 .suw5-surfline-rating {
  font-size:clamp(30px,4vw,42px) !important;
  line-height:1 !important;
}
.suw5 .suw5-surfline-details-v2144 {
  grid-template-columns:minmax(0,1fr) !important;
}

@media (max-width:680px) {
  .suw5 .suw5-surfline-live-block {
    margin-top:14px !important;
    overflow:visible !important;
    border-radius:16px !important;
  }
  .suw5 .suw5-surfline-card-v2122 {
    padding:18px 16px !important;
  }
  .suw5 .suw5-surfline-card-head {
    display:block !important;
    padding-bottom:14px !important;
  }
  .suw5 .suw5-surfline-card-head > div {
    min-width:0 !important;
  }
  .suw5 .suw5-surfline-eyebrow {
    margin-bottom:6px !important;
    font-size:11px !important;
    letter-spacing:.07em !important;
  }
  .suw5 .suw5-surfline-rating,
  .suw5 .suw5-surfline-fallback-v2144 .suw5-surfline-rating {
    font-size:32px !important;
    line-height:1.05 !important;
    overflow-wrap:anywhere;
  }
  .suw5 .suw5-surfline-source-v2144 {
    margin-top:8px !important;
    font-size:10px !important;
  }
  .suw5 .suw5-surfline-card-head a {
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    box-sizing:border-box !important;
    width:100% !important;
    max-width:none !important;
    min-height:42px !important;
    margin-top:14px !important;
    padding:9px 12px !important;
    border:1px solid rgba(7,88,111,.18) !important;
    border-radius:11px !important;
    background:#eef7f8 !important;
    color:#086b82 !important;
    text-align:center !important;
    font-size:12px !important;
    line-height:1.3 !important;
  }
  .suw5 .suw5-surfline-details {
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:8px !important;
    margin-top:12px !important;
  }
  .suw5 .suw5-surfline-row {
    padding:13px 14px !important;
    border:1px solid rgba(18,54,74,.08) !important;
    border-radius:12px !important;
    background:#f5f9fb !important;
  }
  .suw5 .suw5-surfline-row strong {
    font-size:18px !important;
    line-height:1.3 !important;
  }
  .suw5 .suw5-surfline-outlook {
    margin-top:10px !important;
    padding:12px 13px !important;
    border-left-width:4px !important;
    border-radius:0 10px 10px 0 !important;
  }
  .suw5 .suw5-surfline-outlook p {
    font-size:13px !important;
    line-height:1.45 !important;
  }
  .suw5 .suw5-surfline-nearby {
    padding:16px !important;
  }
  .suw5 .suw5-surfline-nearby-grid {
    margin-top:8px !important;
    border-top:0 !important;
    gap:8px !important;
  }
  .suw5 .suw5-surfline-nearby-card {
    padding:12px 13px !important;
    border:1px solid rgba(18,54,74,.08) !important;
    border-radius:11px !important;
    background:#f7fafb !important;
  }
}


/* ================================================================
   V2.14.5 — mobile Beach Score breakdown collapse
   Website presentation only. The detailed scoring factors remain expanded by
   default on desktop (via the page initializer) and collapsed by default on
   narrow screens to reduce scrolling.
   ================================================================ */
.suw5 .suw5-beach-score-details-v2145 > summary {
  list-style:none !important;
  cursor:pointer !important;
  position:relative;
  padding-right:34px !important;
  user-select:none;
  -webkit-tap-highlight-color:transparent;
}
.suw5 .suw5-beach-score-details-v2145 > summary::-webkit-details-marker {
  display:none !important;
}
.suw5 .suw5-beach-score-details-v2145 > summary::after {
  content:"⌄";
  position:absolute;
  right:9px;
  top:50%;
  transform:translateY(-50%);
  color:#087a91;
  font-size:22px;
  font-weight:900;
  line-height:1;
  transition:transform .16s ease;
}
.suw5 .suw5-beach-score-details-v2145[open] > summary::after {
  transform:translateY(-50%) rotate(180deg);
}
.suw5 .suw5-score-toggle-hint-v2145 {
  display:none;
  margin-top:4px;
  color:#738994;
  font-size:10px;
  line-height:1.3;
  font-style:normal;
  font-weight:750;
}
.suw5 .suw5-score-toggle-open-v2145 { display:none; }
.suw5 .suw5-beach-score-details-v2145[open] .suw5-score-toggle-closed-v2145 { display:none; }
.suw5 .suw5-beach-score-details-v2145[open] .suw5-score-toggle-open-v2145 { display:inline; }
.suw5 .suw5-beach-score-collapse-body-v2145 { min-width:0; }

@media (max-width:760px) {
  .suw5 .suw5-beach-score-details-v2145 {
    margin-top:14px !important;
    border:1px solid rgba(18,54,74,.10);
    border-radius:14px;
    background:#f8fbfb;
    overflow:hidden;
  }
  .suw5 .suw5-beach-score-details-v2145 > summary {
    display:grid !important;
    grid-template-columns:minmax(0,1fr) auto !important;
    gap:12px !important;
    align-items:center !important;
    margin:0 !important;
    padding:13px 42px 13px 14px !important;
    border:0 !important;
    background:#f5fafb;
  }
  .suw5 .suw5-beach-score-details-v2145 > summary:active {
    background:#eaf4f6;
  }
  .suw5 .suw5-beach-score-summary-toggle-v2145 h2 {
    margin:1px 0 0 !important;
    font-size:18px !important;
    line-height:1.15 !important;
  }
  .suw5 .suw5-beach-score-summary-toggle-v2145 > strong {
    font-size:19px !important;
    white-space:nowrap;
  }
  .suw5 .suw5-score-toggle-hint-v2145 { display:block; }
  .suw5 .suw5-beach-score-details-v2145 > summary::after {
    right:14px;
  }
  .suw5 .suw5-beach-score-details-v2145[open] > summary {
    border-bottom:1px solid rgba(18,54,74,.08) !important;
  }
  .suw5 .suw5-beach-score-collapse-body-v2145 {
    padding:12px;
    background:#fff;
  }
  .suw5 .suw5-beach-score-reason-grid-v2130 {
    margin:0 !important;
  }
}

/* ========================================================================
   V2.14.7 — WEBSITE-ONLY HOMEPAGE BEACH BOARD / BEST-TIME / DISCLOSURE
   ======================================================================== */
.suw5 .suw5-home-essentials-v2147{
  grid-column:1/-1;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-top:12px;
}
.suw5 .suw5-home-essentials-v2147>div,
.suw5 .suw5-home-essentials-v2147>a{
  display:flex;min-width:0;min-height:94px;flex-direction:column;justify-content:center;padding:15px 16px;border:1px solid rgba(18,54,74,.10);border-radius:15px;background:#f7fbfc;text-decoration:none!important;
}
.suw5 .suw5-home-essentials-v2147 small{color:#66808b;font-size:10px;font-weight:900;letter-spacing:.09em;text-transform:uppercase}
.suw5 .suw5-home-essentials-v2147 strong{margin-top:4px;color:#12364a;font-size:18px;line-height:1.15;font-weight:950}
.suw5 .suw5-home-essentials-v2147 span{margin-top:4px;color:#738994;font-size:11px;font-weight:700}
.suw5 .suw5-home-essentials-v2147>a{background:#eef8f8;border-color:rgba(8,122,145,.18)}
.suw5 .suw5-home-essentials-v2147>a strong{color:#087a91}

.suw5 .suw5-best-time-v2147,.suw5 .suw5-home-beach-board-v2147{overflow:hidden}
.suw5 .suw5-best-time-head-v2147,.suw5 .suw5-home-board-head-v2147{align-items:flex-end}
.suw5 .suw5-best-time-head-v2147>div:first-child>span,
.suw5 .suw5-home-board-head-v2147>div:first-child>span{display:block;margin-bottom:5px;color:#087a91;font-size:10px;font-weight:950;letter-spacing:.13em}
.suw5 .suw5-best-time-safety-v2147,.suw5 .suw5-home-board-best-v2147{flex:0 0 auto;min-width:160px;padding:11px 14px;border:1px solid rgba(18,54,74,.10);border-radius:14px;background:#f7fbfc;text-align:right}
.suw5 .suw5-best-time-safety-v2147 small,.suw5 .suw5-home-board-best-v2147 small{display:block;color:#6f8791;font-size:9px;font-weight:900;letter-spacing:.08em;text-transform:uppercase}
.suw5 .suw5-best-time-safety-v2147 strong,.suw5 .suw5-home-board-best-v2147 strong{display:block;margin-top:2px;color:#12364a;font-size:17px;font-weight:950}
.suw5 .suw5-home-board-best-v2147 span{display:block;color:#087a91;font-size:12px;font-weight:900}
.suw5 .suw5-best-time-safety-v2147.risk-high{background:#fff1ef;border-color:#efc0b8}.suw5 .suw5-best-time-safety-v2147.risk-high strong{color:#a43826}
.suw5 .suw5-best-time-safety-v2147.risk-moderate{background:#fff8df;border-color:#ead68e}.suw5 .suw5-best-time-safety-v2147.risk-moderate strong{color:#806300}
.suw5 .suw5-best-time-safety-v2147.risk-low{background:#eef9f2;border-color:#b8dfc6}.suw5 .suw5-best-time-safety-v2147.risk-low strong{color:#17663a}
.suw5 .suw5-best-time-grid-v2147{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-top:16px}
.suw5 .suw5-best-time-window-v2147{position:relative;min-height:150px;padding:16px;border:1px solid rgba(18,54,74,.10);border-radius:16px;background:#f8fbfc}
.suw5 .suw5-best-time-window-v2147.is-best{border-color:rgba(8,122,145,.45);box-shadow:0 8px 24px rgba(7,78,94,.10);background:#eef9fa}
.suw5 .suw5-best-time-window-head-v2147{display:flex;justify-content:space-between;gap:8px;align-items:center}
.suw5 .suw5-best-time-window-head-v2147 span{color:#5e7782;font-size:12px;font-weight:900}
.suw5 .suw5-best-time-window-head-v2147 em{padding:4px 7px;border-radius:999px;background:#087a91;color:#fff;font-size:9px;font-style:normal;font-weight:900;text-transform:uppercase}
.suw5 .suw5-best-time-window-v2147>strong{display:block;margin-top:13px;color:#12364a;font-size:25px;line-height:1;font-weight:950}
.suw5 .suw5-best-time-window-v2147>p{margin:9px 0 0!important;color:#637b86;font-size:12px!important;line-height:1.45!important;font-weight:650!important}
.suw5 .suw5-best-time-window-v2147.is-excellent>strong,.suw5 .suw5-best-time-window-v2147.is-very-good>strong{color:#17663a}
.suw5 .suw5-best-time-window-v2147.is-fair>strong{color:#806300}.suw5 .suw5-best-time-window-v2147.is-poor>strong{color:#a43826}
.suw5 .suw5-best-time-foot-v2147,.suw5 .suw5-home-board-foot-v2147{display:flex;justify-content:space-between;gap:14px;align-items:center;margin-top:14px;padding-top:13px;border-top:1px solid rgba(18,54,74,.08);color:#6b828c;font-size:11px;font-weight:700}
.suw5 .suw5-best-time-foot-v2147 a,.suw5 .suw5-home-board-foot-v2147 a{color:#087a91!important;font-weight:900;text-decoration:none!important}

.suw5 .suw5-home-board-labels-v2147,.suw5 .suw5-home-board-row-v2147{display:grid;grid-template-columns:minmax(150px,1.35fr) .72fr 1fr .62fr .75fr .75fr 1fr;gap:8px;align-items:center}
.suw5 .suw5-home-board-labels-v2147{margin:16px 0 6px;padding:0 13px;color:#7a8f98;font-size:9px;font-weight:950;letter-spacing:.08em;text-transform:uppercase}
.suw5 .suw5-home-board-row-v2147{min-height:72px;margin-top:6px;padding:10px 13px;border:1px solid rgba(18,54,74,.09);border-radius:14px;background:#fff;color:#12364a!important;text-decoration:none!important;transition:transform .12s ease,box-shadow .12s ease,border-color .12s ease}
.suw5 .suw5-home-board-row-v2147:hover{transform:translateY(-1px);border-color:rgba(8,122,145,.28);box-shadow:0 8px 20px rgba(9,63,82,.07)}
.suw5 .suw5-home-board-row-v2147.is-home{background:#f0f8fa;border-color:rgba(8,122,145,.28)}
.suw5 .suw5-home-board-row-v2147.is-best:not(.is-home){background:#f3faf5;border-color:rgba(23,102,58,.22)}
.suw5 .suw5-home-board-row-v2147>span{min-width:0}
.suw5 .suw5-home-board-row-v2147 small{display:none;color:#7a8f98;font-size:8px;font-weight:900;letter-spacing:.06em;text-transform:uppercase}
.suw5 .suw5-home-board-row-v2147 strong{display:block;overflow:hidden;color:#12364a;font-size:13px;line-height:1.2;font-weight:900;text-overflow:ellipsis}
.suw5 .suw5-home-board-place-v2147{display:flex!important;align-items:center;gap:7px}
.suw5 .suw5-home-board-place-v2147>strong{font-size:14px!important;white-space:normal!important}
.suw5 .suw5-home-board-place-v2147 em{flex:0 0 auto;padding:3px 6px;border-radius:999px;background:#e1f1f3;color:#087a91;font-size:8px;font-style:normal;font-weight:950;text-transform:uppercase}
.suw5 .suw5-home-board-row-v2147.is-best .suw5-home-board-place-v2147 em{background:#e6f3e9;color:#17663a}
.suw5 .suw5-home-board-score-v2147 strong{font-size:19px}.suw5 .suw5-home-board-score-v2147 b{font-size:10px;font-weight:800;color:#78909a}
.suw5 .suw5-home-board-score-v2147.score-great strong{color:#17663a}.suw5 .suw5-home-board-score-v2147.score-good strong{color:#0a6175}.suw5 .suw5-home-board-score-v2147.score-fair strong{color:#806300}.suw5 .suw5-home-board-score-v2147.score-poor strong{color:#a43826}
.suw5 .suw5-home-board-risk-v2147.risk-high strong{color:#a43826}.suw5 .suw5-home-board-risk-v2147.risk-moderate strong{color:#806300}.suw5 .suw5-home-board-risk-v2147.risk-low strong{color:#17663a}
.suw5 .suw5-home-board-wind-v2147 strong{font-size:12px}

@media(max-width:900px){
  .suw5 .suw5-best-time-grid-v2147{grid-template-columns:1fr 1fr}
  .suw5 .suw5-home-board-labels-v2147{display:none}
  .suw5 .suw5-home-board-row-v2147{grid-template-columns:minmax(135px,1.25fr) .7fr 1fr .6fr .7fr .7fr;grid-template-areas:"place score risk air water surf" "place score risk wind wind wind";padding:12px}
  .suw5 .suw5-home-board-place-v2147{grid-area:place}.suw5 .suw5-home-board-score-v2147{grid-area:score}.suw5 .suw5-home-board-risk-v2147{grid-area:risk}.suw5 .suw5-home-board-row-v2147>span:nth-child(4){grid-area:air}.suw5 .suw5-home-board-row-v2147>span:nth-child(5){grid-area:water}.suw5 .suw5-home-board-row-v2147>span:nth-child(6){grid-area:surf}.suw5 .suw5-home-board-wind-v2147{grid-area:wind}
}
@media(max-width:760px){
  .suw5 .suw5-home-essentials-v2147{grid-template-columns:1fr 1fr}
  .suw5 .suw5-home-essentials-v2147>div,.suw5 .suw5-home-essentials-v2147>a{min-height:88px;padding:13px 14px}
  .suw5 .suw5-best-time-head-v2147,.suw5 .suw5-home-board-head-v2147{display:block!important}
  .suw5 .suw5-best-time-safety-v2147,.suw5 .suw5-home-board-best-v2147{margin-top:12px;text-align:left;min-width:0}
  .suw5 .suw5-best-time-grid-v2147{grid-template-columns:1fr;gap:8px}
  .suw5 .suw5-best-time-window-v2147{min-height:0;padding:14px}
  .suw5 .suw5-best-time-window-v2147>strong{font-size:22px}
  .suw5 .suw5-best-time-foot-v2147,.suw5 .suw5-home-board-foot-v2147{align-items:flex-start;flex-direction:column;gap:6px}
  .suw5 .suw5-home-board-row-v2147{grid-template-columns:1.15fr .65fr 1fr;grid-template-areas:"place score risk" "air water surf" "wind wind wind";gap:10px 8px;min-height:0;padding:13px}
  .suw5 .suw5-home-board-row-v2147 small{display:block;margin-bottom:2px}
  .suw5 .suw5-home-board-place-v2147{align-self:start;flex-direction:column;align-items:flex-start!important;gap:4px}
  .suw5 .suw5-home-board-place-v2147>strong{font-size:14px!important}
  .suw5 .suw5-home-board-row-v2147>span:nth-child(4){grid-area:air}.suw5 .suw5-home-board-row-v2147>span:nth-child(5){grid-area:water}.suw5 .suw5-home-board-row-v2147>span:nth-child(6){grid-area:surf}
  .suw5 .suw5-home-board-wind-v2147 strong{font-size:12px;white-space:normal}
}

/* ========================================================================
   V2.14.9 — permanent beach pages + public data freshness (website only)
   ======================================================================== */
.suw5 .suw5-data-trust-v2149{
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:16px 0 20px;
}
.suw5 .suw5-data-trust-v2149>div{
  position:relative;display:flex;flex-direction:column;gap:3px;min-width:0;padding:12px 14px 12px 17px;
  border:1px solid rgba(12,74,96,.13);border-radius:14px;background:rgba(247,251,251,.86);
}
.suw5 .suw5-data-trust-v2149>div:before{content:"";position:absolute;left:0;top:10px;bottom:10px;width:4px;border-radius:0 4px 4px 0;background:#2c8f86}
.suw5 .suw5-data-trust-v2149>div.is-delayed:before{background:#c9872d}
.suw5 .suw5-data-trust-v2149>div.is-official:before{background:#1b7390}
.suw5 .suw5-data-trust-v2149>div.is-prediction:before{background:#7c8790}
.suw5 .suw5-data-trust-v2149 small{font-size:10px;line-height:1.15;letter-spacing:.11em;text-transform:uppercase;color:#71808b;font-weight:800}
.suw5 .suw5-data-trust-v2149 strong{font-size:13px;line-height:1.25;color:#163f52;white-space:normal;overflow-wrap:anywhere}
.suw5 .suw5-data-trust-v2149 span{font-size:11px;line-height:1.3;color:#667681}

.suw5.suw5-permanent-beach-page-v2149,.suw5.suw5-beaches-directory-v2149{max-width:1320px;margin:0 auto;padding:20px 22px 34px}
.suw5 .suw5-breadcrumbs-v2149{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:0 0 14px;font-size:12px;color:#6d7d86}
.suw5 .suw5-breadcrumbs-v2149 a{color:#14788b;text-decoration:none;font-weight:700}
.suw5 .suw5-breadcrumbs-v2149 strong{color:#24485a}
.suw5 .suw5-permanent-beach-selector-v2149{margin:0 0 18px;padding:15px 17px;border-radius:18px;background:rgba(255,255,255,.88);border:1px solid rgba(15,78,98,.12);box-shadow:0 10px 28px rgba(21,69,85,.07)}
.suw5 .suw5-permanent-beach-selector-v2149>span{display:block;margin-bottom:9px;font-size:10px;letter-spacing:.13em;text-transform:uppercase;font-weight:900;color:#19798a}
.suw5 .suw5-permanent-location-nav-v2149{display:flex;gap:7px;overflow-x:auto;padding:1px 1px 6px;scrollbar-width:thin;-webkit-overflow-scrolling:touch}
.suw5 .suw5-permanent-location-nav-v2149 a{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;padding:8px 12px;border:1px solid rgba(14,75,96,.18);border-radius:999px;background:#fff;color:#244a5b;text-decoration:none;font-size:12px;font-weight:800;white-space:nowrap;box-shadow:0 2px 8px rgba(24,67,82,.04)}
.suw5 .suw5-permanent-location-nav-v2149 a:hover,.suw5 .suw5-permanent-location-nav-v2149 a:focus-visible{border-color:#16849a;background:#eef9fa;color:#0e6678}
.suw5 .suw5-permanent-location-nav-v2149 a.is-active{background:#0c7183;border-color:#0c7183;color:#fff;box-shadow:0 5px 14px rgba(12,113,131,.18)}

.suw5 .suw5-location-alerts-v2149{margin:0 0 18px;padding:14px 18px;border-radius:17px;border:1px solid rgba(39,128,93,.18);background:rgba(239,250,245,.94)}
.suw5 .suw5-location-alerts-v2149.has-alerts{border-color:rgba(190,107,36,.3);background:rgba(255,246,232,.96)}
.suw5 .suw5-location-alerts-head-v2149{display:flex;gap:12px;align-items:center}
.suw5 .suw5-location-alerts-head-v2149>span{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:rgba(38,139,94,.1);font-weight:900;color:#23794f}
.suw5 .suw5-location-alerts-v2149.has-alerts .suw5-location-alerts-head-v2149>span{background:rgba(191,109,38,.12);color:#a25f21}
.suw5 .suw5-location-alerts-head-v2149 div{display:flex;flex-direction:column;gap:2px}
.suw5 .suw5-location-alerts-head-v2149 small{font-size:9px;letter-spacing:.13em;color:#71808a;font-weight:900}
.suw5 .suw5-location-alerts-head-v2149 strong{font-size:14px;color:#234b5a}
.suw5 .suw5-location-alert-list-v2149{display:grid;gap:8px;margin-top:12px;padding-top:12px;border-top:1px solid rgba(139,101,63,.15)}
.suw5 .suw5-location-alert-list-v2149>div{display:flex;flex-direction:column;gap:2px}
.suw5 .suw5-location-alert-list-v2149>div strong{font-size:13px;color:#8c4f1d}.suw5 .suw5-location-alert-list-v2149>div span,.suw5 .suw5-location-alert-list-v2149>div small{font-size:11px;color:#6a6f70}

.suw5 .suw5-beach-location-panel-v2130.is-standalone-v2149{display:block!important;margin:0 0 22px!important}
.suw5 .suw5-beach-location-panel-v2130.is-standalone-v2149 .suw5-beach-location-title-v2130 h1{max-width:760px}
.suw5 .suw5-location-forecast-v2149,.suw5 .suw5-location-tides-v2149,.suw5 .suw5-location-more-v2149{margin-top:22px}
.suw5 .suw5-location-today-v2149{display:flex;flex-direction:column;gap:4px;align-items:flex-end;text-align:right}
.suw5 .suw5-location-today-v2149 strong{font-size:18px;color:#173f53}.suw5 .suw5-location-today-v2149 span{font-size:12px;color:#63747d}
.suw5 .suw5-location-hourly-v2149{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:9px;margin-top:14px}
.suw5 .suw5-location-hourly-v2149>div{display:flex;min-width:0;min-height:126px;flex-direction:column;gap:5px;padding:13px;border:1px solid rgba(15,77,98,.12);border-radius:15px;background:rgba(249,252,252,.9)}
.suw5 .suw5-location-hourly-v2149 small{font-size:11px;font-weight:900;color:#60727c}.suw5 .suw5-location-hourly-v2149 strong{font-size:25px;line-height:1;color:#173f53}.suw5 .suw5-location-hourly-v2149 span{font-size:11px;line-height:1.25;color:#4f626c}.suw5 .suw5-location-hourly-v2149 em{margin-top:auto;font-size:10px;font-style:normal;color:#19788a;font-weight:800}
.suw5 .suw5-location-forecast-foot-v2149{display:flex;justify-content:flex-end;margin-top:12px}.suw5 .suw5-location-forecast-foot-v2149 a{font-size:12px;font-weight:900;color:#16788a;text-decoration:none}
.suw5 .suw5-location-tide-grid-v2149{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-top:12px}.suw5 .suw5-location-tide-grid-v2149>div{display:flex;flex-direction:column;gap:3px;padding:15px;border-radius:15px;background:#f5fafb;border:1px solid rgba(18,82,104,.11)}.suw5 .suw5-location-tide-grid-v2149 small{font-size:10px;letter-spacing:.08em;text-transform:uppercase;font-weight:900;color:#6c7b84}.suw5 .suw5-location-tide-grid-v2149 strong{font-size:20px;color:#173f53}.suw5 .suw5-location-tide-grid-v2149 span{font-size:12px;color:#63737d}
.suw5 .suw5-location-more-v2149>div:first-child span{font-size:10px;letter-spacing:.13em;font-weight:900;color:#17788a}.suw5 .suw5-location-more-v2149>div:first-child h2{margin:4px 0}.suw5 .suw5-location-more-v2149>div:first-child p{margin:0 0 14px;max-width:760px;color:#63747d}

.suw5 .suw5-beaches-directory-hero-v2149{padding:34px 38px;margin-bottom:20px;background:linear-gradient(135deg,rgba(255,255,255,.97),rgba(238,249,248,.94));border:1px solid rgba(13,87,103,.12)}
.suw5 .suw5-beaches-directory-hero-v2149>span{font-size:10px;letter-spacing:.15em;font-weight:900;color:#14788b}.suw5 .suw5-beaches-directory-hero-v2149 h1{margin:5px 0 7px;color:#143f53}.suw5 .suw5-beaches-directory-hero-v2149 p{margin:0;max-width:760px;color:#5f717b}
.suw5 .suw5-beaches-directory-grid-v2149{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.suw5 .suw5-beaches-directory-grid-v2149>a{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;padding:20px;border-radius:19px;border:1px solid rgba(14,77,99,.13);background:rgba(255,255,255,.93);text-decoration:none;box-shadow:0 9px 24px rgba(26,68,82,.07);transition:transform .15s ease,box-shadow .15s ease,border-color .15s ease}.suw5 .suw5-beaches-directory-grid-v2149>a:hover{transform:translateY(-2px);border-color:rgba(13,124,143,.32);box-shadow:0 14px 30px rgba(26,68,82,.11)}.suw5 .suw5-beaches-directory-grid-v2149>a.is-home{outline:2px solid rgba(19,127,143,.12)}
.suw5 .suw5-beaches-directory-grid-v2149>a>div:first-child small{font-size:9px;letter-spacing:.12em;font-weight:900;color:#198093}.suw5 .suw5-beaches-directory-grid-v2149>a h2{margin:5px 0 0;font-size:24px;color:#173f53}.suw5 .suw5-beaches-directory-grid-v2149>a>em{grid-column:1/-1;font-size:11px;font-style:normal;font-weight:900;color:#16788a}
.suw5 .suw5-beach-directory-stats-v2149{display:grid;grid-template-columns:repeat(3,auto);gap:10px;align-items:start}.suw5 .suw5-beach-directory-stats-v2149 span{display:flex;flex-direction:column;gap:2px;min-width:58px}.suw5 .suw5-beach-directory-stats-v2149 small{font-size:9px;text-transform:uppercase;letter-spacing:.08em;color:#7a878e;font-weight:900}.suw5 .suw5-beach-directory-stats-v2149 strong{font-size:13px;color:#264c5b}

@media(max-width:900px){
  .suw5 .suw5-data-trust-v2149{grid-template-columns:repeat(2,minmax(0,1fr))}
  .suw5 .suw5-location-hourly-v2149{grid-template-columns:repeat(3,minmax(0,1fr))}
  .suw5 .suw5-beaches-directory-grid-v2149{grid-template-columns:1fr}
}
@media(max-width:760px){
  .suw5.suw5-permanent-beach-page-v2149,.suw5.suw5-beaches-directory-v2149{padding:12px 12px 26px}
  .suw5 .suw5-permanent-beach-selector-v2149{padding:12px 13px;margin-bottom:12px}
  .suw5 .suw5-permanent-location-nav-v2149 a{padding:8px 11px;font-size:11px}
  .suw5 .suw5-data-trust-v2149{grid-template-columns:1fr 1fr;gap:7px;margin:12px 0 15px}
  .suw5 .suw5-data-trust-v2149>div{padding:10px 10px 10px 14px}
  .suw5 .suw5-data-trust-v2149 strong{font-size:11px}.suw5 .suw5-data-trust-v2149 span{font-size:10px}
  .suw5 .suw5-location-alerts-v2149{padding:12px 13px;margin-bottom:12px}
  .suw5 .suw5-location-hourly-v2149{display:flex;overflow-x:auto;gap:8px;padding-bottom:5px;scroll-snap-type:x proximity}
  .suw5 .suw5-location-hourly-v2149>div{flex:0 0 122px;min-height:118px;scroll-snap-align:start}
  .suw5 .suw5-location-tide-grid-v2149{grid-template-columns:1fr 1fr}
  .suw5 .suw5-location-today-v2149{align-items:flex-start;text-align:left;margin-top:8px}
  .suw5 .suw5-beaches-directory-hero-v2149{padding:23px 20px}
  .suw5 .suw5-beaches-directory-grid-v2149>a{grid-template-columns:1fr;padding:16px}
  .suw5 .suw5-beach-directory-stats-v2149{grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}
}


/* ========================================================================
   V2.14.12 — WEBSITE-ONLY SAFETY MODE / SHARING / BACKGROUND REFRESH POLISH
   ======================================================================== */
.suw5 .suw5-safety-mode-v21412{
  display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:14px;align-items:center;
  margin:0 0 16px;padding:15px 18px;border:1px solid rgba(190,116,35,.30);
  border-radius:18px;background:linear-gradient(135deg,#fff7df,#fffaf0);
  box-shadow:0 12px 28px rgba(95,70,25,.10);color:#4b3b1b;
}
.suw5 .suw5-safety-mode-v21412.is-critical{
  border-color:rgba(176,58,42,.36);background:linear-gradient(135deg,#fff0ec,#fff7f3);
  box-shadow:0 12px 30px rgba(130,48,37,.13);color:#672c22;
}
.suw5 .suw5-safety-mode-icon-v21412{
  display:grid;place-items:center;width:42px;height:42px;border-radius:50%;
  background:rgba(197,128,38,.13);font-size:22px;
}
.suw5 .suw5-safety-mode-v21412.is-critical .suw5-safety-mode-icon-v21412{background:rgba(176,58,42,.12)}
.suw5 .suw5-safety-mode-copy-v21412{display:flex;min-width:0;flex-direction:column;gap:3px}
.suw5 .suw5-safety-mode-copy-v21412 small{font-size:9px;line-height:1.2;letter-spacing:.13em;font-weight:950;color:#9b6a18}
.suw5 .suw5-safety-mode-v21412.is-critical .suw5-safety-mode-copy-v21412 small{color:#ad4937}
.suw5 .suw5-safety-mode-copy-v21412 strong{font-size:17px;line-height:1.2;font-weight:950;color:inherit}
.suw5 .suw5-safety-mode-copy-v21412 span{font-size:12px;line-height:1.45;font-weight:700;color:rgba(63,54,32,.78)}
.suw5 .suw5-safety-mode-v21412.is-critical .suw5-safety-mode-copy-v21412 span{color:rgba(103,44,34,.78)}
.suw5 .suw5-safety-mode-link-v21412{
  display:inline-flex;align-items:center;justify-content:center;min-height:40px;padding:9px 13px;
  border:1px solid currentColor;border-radius:999px;color:inherit!important;text-decoration:none!important;
  font-size:11px;font-weight:950;white-space:nowrap;
}

.suw5 .suw5-share-conditions-v21412{
  appearance:none;display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:40px;
  padding:9px 13px;border:1px solid rgba(8,122,145,.28);border-radius:999px;background:#eef8fa;
  color:#087a91;font:900 11px/1.2 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;cursor:pointer;
  box-shadow:none;transition:transform .12s ease,background .12s ease,border-color .12s ease,opacity .12s ease;
}
.suw5 .suw5-share-conditions-v21412:hover{transform:translateY(-1px);background:#e4f4f6;border-color:rgba(8,122,145,.42)}
.suw5 .suw5-share-conditions-v21412:focus-visible{outline:3px solid rgba(8,122,145,.20);outline-offset:2px}
.suw5 .suw5-share-conditions-v21412.is-sharing{opacity:.62;cursor:wait}
.suw5 .suw5-beach-dashboard-head-v280>div:first-child .suw5-share-conditions-v21412{margin-top:10px}
.suw5 .suw5-beach-location-title-v2130>div:first-child .suw5-share-conditions-v21412{margin-top:12px}
.suw5-share-toast-v21412{
  position:fixed;left:50%;bottom:24px;z-index:99999;transform:translate(-50%,18px);
  max-width:min(92vw,520px);padding:11px 15px;border-radius:999px;background:rgba(7,54,80,.94);
  color:#fff;font:800 12px/1.3 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  box-shadow:0 12px 30px rgba(0,0,0,.18);opacity:0;pointer-events:none;
  transition:opacity .16s ease,transform .16s ease;
}
.suw5-share-toast-v21412.is-visible{opacity:1;transform:translate(-50%,0)}

.suw5 .suw5-background-sync-v21412{
  display:flex;align-items:center;gap:7px;margin-top:9px;padding-top:8px;border-top:1px solid rgba(18,54,74,.07);
  color:#75858d;font-size:10px;line-height:1.35;font-weight:750;
}
.suw5 .suw5-background-sync-v21412 i{
  display:block;width:7px;height:7px;border-radius:50%;background:#2f8d76;box-shadow:0 0 0 3px rgba(47,141,118,.10)
}
.suw5 .suw5-background-sync-v21412.is-checking i{background:#18839a;animation:suw5SyncPulseV21412 1.05s ease-in-out infinite}
@keyframes suw5SyncPulseV21412{0%,100%{transform:scale(.85);opacity:.55}50%{transform:scale(1.18);opacity:1}}

/* Keep server-rendered/cached content visible while browser refreshes run, and
   let the browser defer expensive below-the-fold painting on long pages. */
.suw5 .suw5-home-beach-board-v2147,
.suw5 .suw5-best-time-v2147,
.suw5 .suw5-site-ocean-safety-v2130,
.suw5 .suw5-marine,
.suw5 .suw5-regional-forecast-section-v2120{
  content-visibility:auto;
  contain-intrinsic-size:1px 560px;
}

@media(max-width:760px){
  .suw5 .suw5-safety-mode-v21412{grid-template-columns:auto minmax(0,1fr);gap:10px;padding:13px 14px;border-radius:16px}
  .suw5 .suw5-safety-mode-link-v21412{grid-column:1/-1;width:100%;min-height:42px}
  .suw5 .suw5-safety-mode-copy-v21412 strong{font-size:15px}
  .suw5 .suw5-safety-mode-copy-v21412 span{font-size:11px}
  .suw5 .suw5-beach-dashboard-head-v280>div:first-child .suw5-share-conditions-v21412{width:100%;margin:10px 0 0}
  .suw5 .suw5-beach-location-title-v2130>div:first-child .suw5-share-conditions-v21412{width:100%;margin:10px 0 0}
  .suw5-share-toast-v21412{bottom:18px;border-radius:16px;text-align:center}
}


/* V2.14.17 public snapshot status */
.suw5-public-snapshot-stale-v21417{max-width:1180px;margin:12px auto;padding:10px 16px;border-radius:12px;background:#fff7d6;color:#5b4700;font-weight:700;text-align:center;}
.suw5-public-snapshot-placeholder-v21417{max-width:1180px;margin:24px auto;padding:0 16px;}
.suw5-public-snapshot-placeholder-v21417 .suw5-panel{text-align:center;padding:32px;}
