/* ===== Modern Content Section (DPH-friendly) ===== */
:root {
  /* Use DPH/global variables if available; fall back to safe defaults */
  --clpp-primary: var(--dph-primary, #1d4ed8);
  --clpp-primary-2: var(--dph-primary-2, #2563eb);
  --clpp-ink: var(--dph-ink, #0f172a);
  --clpp-muted: var(--dph-muted, #334155);
  --clpp-subtle: var(--dph-subtle, #475569);
  --clpp-border: rgba(15, 23, 42, 0.10);
  --clpp-card: #ffffff;
  --clpp-surface: #f8fafc;
  --clpp-radius: 1rem;
  --clpp-radius-sm: 0.75rem;
  --clpp-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
  --clpp-focus: 0 0 0 3px rgba(37, 99, 235, 0.35);

  --vw: 100vw;

  /* Body text inside news blocks */
  --news-body: clamp(1rem, 0.95rem + 0.25vw, 1.15rem);

  /* Section header (H2) */
  --news-section-title: clamp(1.55rem, 1.42rem + 0.74vw, 2.16rem);

  /* Card title (.mediacenterMsgTitle) */
  --news-card-title: clamp(1.1rem, 1rem + 0.6vw, 1.5rem);

  /* Button/link small text (“More”, archived) */
  --news-small: clamp(0.9rem, 0.85rem + 0.25vw, 1.05rem);
}

.clpp-ico {
  margin-right: 0.15rem;
  /*color: var(--clpp-primary-2, #2563eb);*/
  vertical-align: middle;
}

.mTop-p {
  margin-top: 10px !important;
}

#newsroom main {
  padding: 1rem 0;
  margin: 1rem 0;
}

.clpp-section {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 0 1rem;
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color: var(--clpp-ink);
}

.carousel-container {
  max-width: 1000px;
}

/* ===== Header ===== */
.clpp-header {
  background: linear-gradient(135deg, var(--clpp-primary), var(--clpp-primary-2));
  color: #fff;
  border-radius: 0px; /*10px*/
  padding: clamp(1.25rem, 2.5vw, 2rem);
  margin-bottom: 3rem;
  position: relative;
  overflow: hidden;
}

/* Subtle pattern overlay */
.clpp-header::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(500px 220px at 15% 0%, rgba(255, 255, 255, 0.25), transparent 60%),
    radial-gradient(420px 220px at 95% 10%, rgba(255, 255, 255, 0.18), transparent 60%);
  pointer-events: none;
}

.clpp-header h1,
.clpp-header p {
  position: relative;
  z-index: 1;
}

.clpp-header h1 {
  margin: 0 0 0.5rem;
  font-size: clamp(1.5rem, 3vw, 2.2rem);
  color: #fff;
  letter-spacing: -0.02em;
  display: flex;
  gap: 0.6rem;
  align-items: center;
}

.clpp-header p {
  margin: 0;
  font-size: clamp(1.1rem, 1.2vw + 0.8rem, 1.4rem);
  opacity: 0.95;
}

.clpp-header .fa-envelope {
  opacity: 0.9;
}

/* ===== Layout grid (PRA + Death Cert row) ===== */
.clpp-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.5rem;
}

/* 2-up starting at tablet (Bootstrap md-ish) */
@media (max-width: 768px) {
  .clpp-grid {
    padding: 0 1rem;
  }

  .news-section {
    padding: 0 1rem;
  }

  #OutCurNews a[href*="mediapubdisplay"], #OutHealthNews a[href*="mediapubdisplay"] {
    margin: 1.2rem auto 0 auto !important;
  }
}

@media (min-width: 768px) {
  .clpp-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    max-width: 1100px;
    margin: 0 auto;
  }
}

/* Optional: tighter gap on small screens */
@media (max-width: 480px) {
  .clpp-grid {
    gap: 1rem;
  }

  /* Allow grid items (articles) to actually shrink */
  .clpp-grid>* {
    min-width: 0;
  }

  /* Prevent long strings/links from forcing width */
  .clpp-card {
    overflow-wrap: anywhere;
  }

  /* Extra safety for links */
  .clpp-card a {
    word-break: break-word;
  }
}

.span-full {
  grid-column: 1 / -1;
}

/* ===== Cards ===== */
.clpp-card {
  background: var(--clpp-card);
  border-radius: var(--clpp-radius);
  padding: 1.5rem;
  box-shadow: var(--clpp-shadow);
  border: 1px solid var(--clpp-border);
  border-left: 6px solid var(--clpp-primary-2);
  position: relative;
}

.clpp-card h2 {
  margin: 0 0 0.75rem;
  font-size: 1.25rem;
  letter-spacing: -0.01em;
  display: flex;
  align-items: center;
  gap: 0.6rem;
  font-weight: 600;
}

.clpp-card p {
  margin: 0 0 0.75rem;
  font-size: 0.95rem;
  line-height: 1.65;
  color: var(--clpp-muted);
}

.clpp-card ul,
.clpp-card ol {
  margin: 0;
  padding-left: 1.25rem;
  font-size: 0.95rem;
  line-height: 1.65;
  color: var(--clpp-muted);
}

.clpp-card li {
  margin: 0.4rem 0;
}

/* Links inside cards (only) */
.clpp-card a {
  color: #1d4ed8;
  text-decoration: underline;
  text-underline-offset: 3px;
  cursor: pointer;
}

.clpp-card a:hover {
  text-decoration-thickness: 2px;
}

/* Inline icons */
#page-title .clpp-ico {
  width: 1.15em;
  text-align: center;
  opacity: 0.95;
  color: #fff;
}

/* ===== Panel ===== */
.clpp-panel {
  background: var(--clpp-surface);
  border-radius: var(--clpp-radius-sm);
  padding: 1rem;
  margin-top: 1rem;
  border: 1px solid rgba(15, 23, 42, 0.08);
}

.clpp-panel strong {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 0.5rem;
  font-size: 0.95rem;
  color: var(--clpp-ink);
}

/* ===== Callouts ===== */
.clpp-callout {
  margin-top: 1rem;
  padding: 1rem;
  border-radius: var(--clpp-radius-sm);
  background: #ecfeff;
  border-left: 5px solid #0891b2;
  border: 1px solid rgba(8, 145, 178, 0.25);
  font-size: 0.95rem;
  color: #0f172a;
  line-height: 1.6;
}

.clpp-warning {
  background: #fffbeb;
  border-left-color: #f59e0b !important;
  border: 1px solid rgba(245, 158, 11, 0.35);
  text-align: center;
}

/* ===== CTA ===== */
.clpp-cta {
  margin-top: 1.5rem;
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  align-items: center;
  justify-content: space-between;
}

.clpp-button {
  background: var(--clpp-primary-2);
  color: #fff;
  text-decoration: none;
  padding: 0.8rem 1.25rem;
  border-radius: 0.85rem;
  font-weight: 800;
  letter-spacing: 0.01em;
  transition: transform 0.15s ease, background 0.2s ease, box-shadow 0.2s ease;
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  box-shadow: 0 10px 20px rgba(37, 99, 235, 0.25);
}

.clpp-button:hover {
  background: #1e40af;
  transform: translateY(-1px);
}

.clpp-button:focus,
.clpp-button:focus-visible {
  outline: none;
  box-shadow: var(--clpp-focus), 0 10px 20px rgba(37, 99, 235, 0.25);
}

.clpp-help {
  font-size: 0.95rem;
  color: var(--clpp-subtle);
}

.clpp-help b {
  color: var(--clpp-ink);
}

/* Mobile spacing tweak */
@media (max-width: 420px) {
  .clpp-card {
    padding: 1.15rem;
  }

  .clpp-header {
    padding: 1.25rem;
  }
}

/* =============================================================================
   SIGN-UP ONLY (Contact Split)
   ============================================================================= */

/* Container */
.dph-contactSplit {
  /*margin: 1.5rem 0 1.75rem;*/
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color: var(--dph-ink, #0f172a);
}

/* Outer box (single panel now) */
.dph-contactSplit__box {
  position: relative;
  background: #fff;
  border-radius: 0px; /*10px*/
  overflow: hidden;
  border: 1px solid rgba(15, 23, 42, 0.08);
  box-shadow: 0 14px 40px rgba(0, 0, 0, 0.10);
  min-height: 0;
  /* was 240px - causes extra whitespace */

  display: grid;
  grid-template-columns: 1fr;
}

/* Right panel (the only panel now) */
.dph-contactSplit__right {
  position: relative;
  overflow: hidden;

  color: #fff;
  background:
    radial-gradient(900px 260px at 90% 10%, rgba(255, 255, 255, 0.22), transparent 55%),
    radial-gradient(700px 240px at 10% 90%, rgba(255, 255, 255, 0.16), transparent 55%),
    linear-gradient(135deg, var(--dph-primary, #0E2260), var(--dph-primary-2, #2563eb));

  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;

  padding: clamp(1.25rem, 2.5vw, 2rem);
}

/* Background watermark icon */
.dph-contactSplit__right::before {
  content: "\f0a1";
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  position: absolute;
  left: 40%;
  top: 50%;
  transform: translateY(-50%);
  font-size: clamp(89.6px, 17.92vw, 166.4px);
  color: rgba(255, 255, 255, 0.08);
  line-height: 1;
  pointer-events: none;
  z-index: 0;
}

/* Keep real content above the icon */
.dph-contactSplit__right>* {
  position: relative;
  z-index: 1;
}

/* Right title */
.dph-contactSplit__kicker {
  display: block;
  margin-bottom: 1rem;
  font-size: clamp(1.8rem, 3vw, 2.4rem);
  font-weight: 700;
  line-height: 1.25;
}

/* Form container */
.dph-contactSplit__form {
  width: 100%;
  display: flex;
  justify-content: center;
  margin-bottom: 0.75rem;
}

/* Input + button same height, consistent widths */
.dph-contactSplit__row {
  width: 100%;
  max-width: 520px;
  /* wider since no left panel */
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 0.6rem;
  align-items: stretch;
}

.dph-contactSplit__row input,
.dph-contactSplit__row button {
  height: 48px;
  box-sizing: border-box;
}

.dph-contactSplit__row input {
  width: 100%;
  min-width: 0;
  padding: 0 0.95rem !important;
  border-radius: 10px !important;
  border: 1px solid rgba(255, 255, 255, 0.35) !important;
  background: rgba(255, 255, 255, 0.10) !important;
  color: #fff !important;
  font-size: 1rem;
  margin-bottom: 0 !important;
}

.dph-contactSplit__row input::placeholder {
  color: rgba(255, 255, 255, 0.85);
}

.dph-contactSplit__row input:focus,
.dph-contactSplit__row input:focus-visible {
  outline: none;
  box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.30);
  border-color: rgba(255, 255, 255, 0.65);
}

.dph-contactSplit__row button {
  margin-top: 0 !important;
  padding: 0 1.1rem;
  border: 0;
  border-radius: 10px;
  background: #ffffff;
  color: var(--dph-primary, #0E2260);
  font-weight: 800;
  font-size: 0.95rem;
  letter-spacing: 0.02em;
  cursor: pointer;
  transition: transform 0.12s ease, box-shadow 0.2s ease, opacity 0.2s ease;
  box-shadow: 0 10px 18px rgba(0, 0, 0, 0.18);
  white-space: nowrap;
}

.dph-contactSplit__row button:hover {
  opacity: 0.92;
  transform: translateY(-1px);
}

.dph-contactSplit__row button:focus,
.dph-contactSplit__row button:focus-visible {
  outline: none;
  box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.35), 0 10px 18px rgba(0, 0, 0, 0.18);
}

/* Stack input/button on small screens */
@media (max-width: 420px) {
  .dph-contactSplit__row {
    grid-template-columns: 1fr;
  }

  .dph-contactSplit__row button {
    width: 100%;
  }
}

#dph-subscribe-email input[type="email"] {
  color: #fff !important;
}

/* Mobile watermark positioning fix */
@media (max-width: 480px) {
  .dph-contactSplit__right::before {
    font-size: 140px;
    left: 50%;
    top: auto;
    bottom: -10px;
    transform: translateX(-50%);
    opacity: 0.06;
  }
}

/* Header links: force readable color on gradient background */
.clpp-header a,
.clpp-header a:visited {
  color: #ffffff;
  text-decoration: underline;
  text-underline-offset: 3px;
  font-weight: 700;
  word-break: break-all;
  cursor: pointer;
}

/* Hover / focus for clarity */
.clpp-header a:hover,
.clpp-header a:focus,
.clpp-header a:focus-visible {
  color: #fef3c7;
  /* soft warm contrast (accessible) */
  text-decoration-thickness: 2px;
  outline: none;
}

/* ============================
   News Section Headers
   ============================ */
.news-section {
  margin-top: clamp(2rem, 1.5rem + 2vw, 3rem);
  max-width: 1100px;
  margin: 0 auto;
}

.news-section__title {
  font-size: var(--news-section-title);
  font-weight: 800;
  color: #0f2a44;
  margin-bottom: clamp(.75rem, .6rem + .6vw, 1rem);
  padding-bottom: clamp(.35rem, .25rem + .4vw, .55rem);
  border-bottom: 3px solid #e6edf4;
  letter-spacing: -.01em;
  line-height: 1.25;
}

/* ============================
   Modern News Cards (Legacy HTML Safe)
   ============================ */
#OutCurNews,
#OutHealthNews {
  display: grid;
  gap: clamp(1rem, .75rem + 1vw, 1.75rem);
  margin-top: clamp(1.25rem, 1rem + 1vw, 2rem);
  font-family: system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
  font-size: var(--news-body);
  color: #2a2a2a;
}

/* Card (works whether you use >p cards OR .news-card wrappers) */
#OutCurNews>p,
#OutHealthNews>p,
.news-card {
  background: #fff;
  border-radius: 16px;
  padding: clamp(1.1rem, 0.9rem + 1vw, 1.6rem);
  box-shadow: 0 10px 32px rgba(0, 0, 0, .08);
  line-height: 1;
  margin: 0;
}

/* Hover only on devices that actually hover */
@media (hover: hover) {

  #OutCurNews>p:hover,
  #OutHealthNews>p:hover,
  .news-card:hover {
    box-shadow: 0 14px 40px rgba(0, 0, 0, .12);
  }
}

/* Title */
#OutCurNews .mediacenterMsgTitle,
#OutHealthNews .mediacenterMsgTitle,
.news-card .mediacenterMsgTitle {
  display: block;
  font-size: var(--news-card-title);
  font-weight: 700;
  color: #0f2a44;
  margin-bottom: clamp(.5rem, .4rem + .5vw, .85rem);
  line-height: 1.3;
}

/* Ensure paragraphs inherit responsive sizing */
#OutCurNews p,
#OutHealthNews p,
.news-card p {
  font-size: inherit;
}

/* Remove legacy <br> spacing */
#OutCurNews br,
#OutHealthNews br,
.news-card br {
  display: none;
}

/* Links */
#OutCurNews a,
#OutHealthNews a,
.news-card a {
  color: #005ea2 !important;
  font-weight: 600;
  text-decoration: none;
}

#OutCurNews a:hover,
#OutHealthNews a:hover,
.news-card a:hover {
  text-decoration: underline;
}

/* "More" button (external page) */
#OutCurNews a[href*="mediapubhpdetail"],
#OutHealthNews a[href*="mediapubhpdetail"],
.news-card a[href*="mediapubhpdetail"] {
  display: inline-flex !important;
  align-items: center;
  gap: .45rem;

  margin-top: .15rem;
  margin-left: .4rem;
  padding: .35rem .75rem;

  background: #005ea2;
  border-radius: 10px;

  font-weight: 700;
  text-decoration: none;

  /* Hide CMS text cleanly */
  font-size: 0 !important;
  line-height: 0 !important;

  transition:
    transform .18s ease,
    box-shadow .18s ease,
    filter .18s ease;
}

/* Icon: external link */
#OutCurNews a[href*="mediapubhpdetail"]::before,
#OutHealthNews a[href*="mediapubhpdetail"]::before,
.news-card a[href*="mediapubhpdetail"]::before {
  content: "\f35d"; /* fa-up-right-from-square */
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  font-size: .85rem;
  color: #fff;
  line-height: 1;
}

/* Text */
#OutCurNews a[href*="mediapubhpdetail"]::after,
#OutHealthNews a[href*="mediapubhpdetail"]::after,
.news-card a[href*="mediapubhpdetail"]::after {
  content: "Read More";
  font-size: var(--news-small, 0.95rem);
  line-height: 1.2;
  color: #fff;
  white-space: nowrap;
}

/* Hover (pointer devices only) */
@media (hover: hover) {
  #OutCurNews a[href*="mediapubhpdetail"]:hover,
  #OutHealthNews a[href*="mediapubhpdetail"]:hover,
  .news-card a[href*="mediapubhpdetail"]:hover {
    transform: translateY(-1px);
    box-shadow: 0 6px 14px rgba(0, 0, 0, .18);
    filter: brightness(1.08);
  }
}

/* Keyboard focus */
#OutCurNews a[href*="mediapubhpdetail"]:focus-visible,
#OutHealthNews a[href*="mediapubhpdetail"]:focus-visible,
.news-card a[href*="mediapubhpdetail"]:focus-visible {
  outline: 3px solid rgba(147, 197, 253, .95);
  outline-offset: 3px;
}

/* Force "Archived Advisories and Alerts" onto its own line */
#OutCurNews a[href*="mediapubHPdisplay"],
#OutHealthNews a[href*="mediapubHPdisplay"],
#OutCurNews a[href*="mediapubdisplay"],
#OutHealthNews a[href*="mediapubdisplay"] {
  display: block;
  margin-top: 1rem;
  /* spacing from text above */
  font-size: var(--news-small, 0.95rem);
  color: #666;
}

/* Responsive layout: 2 columns on larger screens */
@media (min-width: 900px) {

  #OutCurNews,
  #OutHealthNews {
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }
}

/* Mobile: keep it comfy */
@media (max-width: 640px) {

  #OutCurNews,
  #OutHealthNews {
    gap: 1rem;
  }
}

/* Archived Press Releases button */
#OutCurNews a[href*="mediapubdisplay"],
#OutHealthNews a[href*="mediapubdisplay"] {
  position: relative;
  display: inline-flex !important;
  align-items: center;
  gap: .5rem; /* space between icon and text */
  width: fit-content;

  margin-top: .4rem;
  padding: .55rem .95rem;
  border-radius: 10px;

  background: #f1f5f9;
  border: 1px solid rgba(15, 23, 42, 0.18);

  font-weight: 700;
  text-decoration: none;

  /* Hide CMS text cleanly */
  font-size: 0 !important;
  line-height: 0 !important;

  transition:
    transform .18s ease,
    background-color .18s ease,
    box-shadow .18s ease,
    border-color .18s ease;
}

/* Icon */
#OutCurNews a[href*="mediapubdisplay"]::before,
#OutHealthNews a[href*="mediapubdisplay"]::before {
  content: "\f187"; /* fa-box-archive */
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  font-size: .95rem;
  color: #0f2a44;
  line-height: 1;
}

/* Text */
#OutCurNews a[href*="mediapubdisplay"]::after,
#OutHealthNews a[href*="mediapubdisplay"]::after {
  content: "Archived Press Releases";
  font-size: var(--news-small, 0.95rem);
  line-height: 1.2;
  color: #0f2a44;
  white-space: nowrap;
}

/* Hover (pointer devices only) */
@media (hover: hover) {
  #OutCurNews a[href*="mediapubdisplay"]:hover,
  #OutHealthNews a[href*="mediapubdisplay"]:hover {
    background: #e9f0fb;
    border-color: rgba(15, 23, 42, 0.28);
    transform: translateY(-1px);
    box-shadow: 0 6px 14px rgba(15, 23, 42, .12);
  }
}

/* Keyboard focus */
#OutCurNews a[href*="mediapubdisplay"]:focus-visible,
#OutHealthNews a[href*="mediapubdisplay"]:focus-visible {
  outline: 3px solid rgba(147, 197, 253, .95);
  outline-offset: 3px;
  background: #e9f0fb;
}


/* full width sign up for news and Updates *
.dph-contactSplit__box--single {
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);

  border-radius: 0;
}

.clpp-header {
  padding-left: clamp(1rem, 6vw, 6rem);
  padding-right: clamp(1rem, 6vw, 6rem);
  border-radius: 0;
}*/

/* =========================
   Accessible Skip Link
   ========================= */
.skip-link {
  position: absolute;
  top: 0;
  left: 0;
  transform: translateY(-120%);
  background: #0b3b67;          /* deep civic blue */
  color: #fff;
  padding: 0.75rem 1rem;
  font-size: 0.95rem;
  font-weight: 600;
  line-height: 1.2;
  text-decoration: none;
  border-radius: 0 0 0.5rem 0;
  z-index: 9999;
  box-shadow: 0 2px 10px rgba(0,0,0,.25);
  transition: transform .2s ease;
}

/* Visible when keyboard users tab to it */
.skip-link:focus,
.skip-link:focus-visible {
  transform: translateY(0);
  outline: 3px solid #93c5fd;   /* strong accessible focus */
  outline-offset: 2px;
}

/* Optional hover (mouse users rarely see it) */
.skip-link:hover {
  text-decoration: underline;
}