/* ── Islandwide Weather — Base Brand CSS ── */
:root {
  --iww-navy:         #2E4A8F;
  --iww-navy-dark:    #1C2F68;
  --iww-navy-light:   #3A5090;
  --iww-mint:         #4ECFB0;
  --iww-mint-light:   #7DE0CC;
  --iww-mint-dark:    #2DAF90;
  --iww-amber:        #F0C020;
  --iww-amber-dark:   #D4A010;
  --iww-bg:           #F2F6FF;
  --iww-surface:      #FFFFFF;
  --iww-text:         #1C2030;
  --iww-text-med:     #4A5580;
  --iww-border:       #D4DCF0;
  --iww-accent:       var(--iww-mint);
  --iww-font:         'Montserrat', sans-serif;
}

/* ── Global font application ── */
body,
input, button, select, textarea {
  font-family: 'Montserrat', sans-serif !important;
}
/* Apply Montserrat globally but exclude icon fonts */
body *:not(.dashicons):not(.dashicons-before):not([class*="dashicons"]) {
  font-family: 'Montserrat', sans-serif !important;
}

/* ── Divi-specific overrides ── */
.et_pb_text,
.et_pb_text *,
.et_pb_blurb,
.et_pb_blurb *,
.et_pb_button,
.et_pb_module,
.et_pb_module *,
.et-fixed-header,
.et-fixed-header *,
#main-header,
#main-header *,
#main-footer,
#main-footer *,
.et_pb_menu,
.et_pb_menu *,
h1, h2, h3, h4, h5, h6,
p, a, li, span, div {
  font-family: 'Montserrat', sans-serif !important;
}

/* ── Heading weights — Montserrat looks great heavy ── */
h1, .et_pb_slide_title             { font-weight: 800; letter-spacing: -0.02em; }
h2                                 { font-weight: 700; letter-spacing: -0.01em; }
h3                                 { font-weight: 700; }
h4, h5, h6                         { font-weight: 600; }
p, li                              { font-weight: 400; line-height: 1.7; }
strong, b                          { font-weight: 700; }

body { background: var(--iww-bg); color: var(--iww-text); }

/* ── Atmosphere layer ── */
#iww-atmosphere {
  position: fixed; inset: 0;
  pointer-events: none;
  z-index: 1;
  overflow: hidden;
}

/* ── Weather data card ── */
.iww-wx-card {
  background: var(--iww-surface);
  border: 1px solid var(--iww-border);
  border-radius: 12px;
  padding: 20px 24px;
  transition: border-color 0.2s;
}
.iww-wx-card:hover { border-color: var(--iww-mint); }
.iww-wx-card .temp  { font-size: 48px; font-weight: 800; color: var(--iww-navy); letter-spacing: -0.03em; }
.iww-wx-card .label { font-size: 11px; font-weight: 600; color: var(--iww-text-med); text-transform: uppercase; letter-spacing: 0.1em; }

/* ── Alert banners ── */
.iww-alert-banner {
  background: var(--iww-amber);
  color: var(--iww-navy-dark);
  padding: 10px 20px;
  font-weight: 700;
  font-size: 14px;
  text-align: center;
  letter-spacing: 0.02em;
}
#iww-severe-banner { position: sticky; top: 0; z-index: 99999; }

/* ── Beacon mascot ── */
.iww-beacon    { max-width: 180px; }
.iww-beacon-sm { max-width: 80px; }

/* ── Radar wrapper ── */
.iww-radar-wrap { border-radius: 10px; overflow: hidden; background: var(--iww-navy-dark); }

/* ── Mobile bottom bar ── */
.iww-mobile-bar {
  display: none;
  position: fixed; bottom: 0; left: 0; right: 0;
  z-index: 9998;
  background: var(--iww-navy-dark);
  border-top: 3px solid var(--iww-mint);
  padding: 10px 16px;
  gap: 12px;
  justify-content: space-between;
  align-items: center;
}
.iww-mobile-bar a            { color: #fff; font-weight: 600; font-size: 13px; text-decoration: none; letter-spacing: 0.02em; }
.iww-mobile-bar .iww-mobile-bar-cta {
  background: var(--iww-mint);
  border-radius: 20px;
  display: flex;
  align-items: center;
  overflow: hidden;
  min-width: 108px;
  height: 34px;
  flex-shrink: 0;
}
/* Zip form */
.iww-mobile-bar-cta #iww-bar-form {
  display: flex;
  align-items: center;
  width: 100%;
  height: 100%;
}
.iww-mobile-bar-cta #iww-bar-zip {
  flex: 1;
  border: none;
  background: transparent;
  font-family: 'Montserrat', sans-serif;
  font-size: 13px;
  font-weight: 700;
  color: var(--iww-navy-dark);
  outline: none;
  padding: 0 0 0 12px;
  width: 68px;
  letter-spacing: 0.04em;
  -webkit-appearance: none;
}
.iww-mobile-bar-cta #iww-bar-zip::placeholder {
  color: rgba(28,47,104,0.45);
  font-weight: 400;
}
.iww-mobile-bar-cta #iww-bar-form button[type="submit"] {
  border: none;
  background: transparent;
  cursor: pointer;
  padding: 0 10px 0 2px;
  color: var(--iww-navy-dark);
  font-size: 17px;
  font-weight: 900;
  line-height: 34px;
  -webkit-tap-highlight-color: transparent;
}
/* Weather display button */
.iww-mobile-bar-cta #iww-bar-wx-btn {
  border: none;
  background: transparent;
  cursor: pointer;
  padding: 0 14px;
  font-family: 'Montserrat', sans-serif;
  font-weight: 800;
  color: var(--iww-navy-dark);
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 5px;
  height: 100%;
  width: 100%;
  justify-content: center;
  -webkit-tap-highlight-color: transparent;
}
.iww-mobile-bar-cta #iww-bar-wx-icon { font-size: 17px; line-height: 1; }
.iww-mobile-bar-cta #iww-bar-wx-temp { font-size: 14px; font-weight: 800; }

/* ── Alert sign-up block ── */
.iww-alert-signup { background: var(--iww-navy); border-radius: 12px; padding: 32px; color: #fff; }
.iww-alert-signup h3 { color: var(--iww-mint); font-weight: 700; }

/* ══════════════════════════════════════════════════════
   RESPONSIVE — Desktop / Tablet / Mobile
   ══════════════════════════════════════════════════════ */

/* ── Desktop (1025px+) — full layout ── */
@media (min-width: 1025px) {
  .iww-wx-card .temp { font-size: 48px; }
  .iww-radar-wrap    { min-height: 450px; }
}

/* ── Tablet (768px–1024px) ── */
@media (min-width: 768px) and (max-width: 1024px) {
  .iww-wx-card .temp     { font-size: 36px; }
  .iww-wx-card           { padding: 16px 18px; }
  .iww-radar-wrap        { min-height: 340px; }
  #iww-severe-banner     { font-size: 13px; padding: 10px 14px; }
  h1                     { font-size: 34px !important; }
  h2                     { font-size: 26px !important; }

  /* 2-col card grid on tablet */
  .iww-conditions-grid {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

/* ── Mobile (<768px) ── */
@media (max-width: 767px) {
  .iww-mobile-bar        { display: flex; }

  /* Push page content above the sticky bottom bar */
  body                   { padding-bottom: 60px; }

  .iww-wx-card .temp     { font-size: 32px; }
  .iww-wx-card           { padding: 14px 16px; }

  /* Radar: cap height so it doesn't eat the screen */
  .iww-radar-wrap        { max-height: 260px; }
  .iww-radar-wrap video  { object-fit: cover; }

  /* Stack condition cards single column */
  .iww-conditions-grid {
    grid-template-columns: 1fr !important;
  }

  #iww-severe-banner     { font-size: 12px; padding: 8px 12px; }
  h1                     { font-size: 26px !important; letter-spacing: -0.01em; }
  h2                     { font-size: 22px !important; }

  /* Divi column padding reduction on mobile */
  .et_pb_column          { padding: 0 12px !important; }
  .et_pb_section         { padding: 24px 0 !important; }
}

/* ── Very small screens (< 380px) ── */
@media (max-width: 379px) {
  .iww-wx-card .temp     { font-size: 26px; }
  .iww-mobile-bar a      { font-size: 11px; }
}
