/* =====================================================
   THE SAVAGE SAINTS
   SUICIDE AWARENESS & PREVENTION
===================================================== */


/* =====================================================
   COLOR SYSTEM
===================================================== */

:root{
  --awareness-navy-deep:#04152a;
  --awareness-navy:#092b57;
  --awareness-navy-light:#124b86;

  --awareness-blue:#1e7bd8;
  --awareness-blue-bright:#4db4ff;
  --awareness-blue-soft:#dcefff;

  --awareness-teal:#18b5bb;
  --awareness-teal-dark:#087f88;
  --awareness-teal-soft:#ddf8f8;

  --awareness-purple:#6948c9;
  --awareness-purple-light:#9a75e5;
  --awareness-purple-soft:#eee8ff;

  --awareness-gold:#f2b65d;
  --awareness-gold-soft:#fff1d4;

  --awareness-white:#ffffff;
  --awareness-cream:#fffaf1;
  --awareness-mist:#eff7fd;

  --awareness-ink:#0a1c31;
  --awareness-copy:#3b5067;
  --awareness-muted:#687c91;

  --awareness-line:rgba(9,43,87,.14);
  --awareness-line-light:rgba(255,255,255,.2);

  --awareness-shadow:
    0 24px 60px rgba(4,21,42,.13);

  --awareness-shadow-strong:
    0 34px 90px rgba(4,21,42,.3);

  --awareness-width:1380px;
}


/* =====================================================
   PAGE RESET
===================================================== */

.awareness-page,
.awareness-page *,
.awareness-page *::before,
.awareness-page *::after{
  box-sizing:border-box;
}

html{
  scroll-behavior:smooth;
}

body{
  margin:0;
  background:var(--awareness-navy-deep);
}

body.awareness-modal-open{
  overflow:hidden;
}

.awareness-page{
  width:100%;
  overflow:hidden;

  color:var(--awareness-ink);
  background:
    radial-gradient(
      circle at 12% 18%,
      rgba(77,180,255,.13),
      transparent 24%
    ),
    radial-gradient(
      circle at 86% 37%,
      rgba(105,72,201,.13),
      transparent 28%
    ),
    linear-gradient(
      180deg,
      var(--awareness-navy-deep) 0%,
      var(--awareness-mist) 18%,
      var(--awareness-white) 55%,
      var(--awareness-blue-soft) 100%
    );

  font-family:"Inter",Arial,sans-serif;
  font-size:16px;
  line-height:1.7;
}

.awareness-page button,
.awareness-page input,
.awareness-page textarea,
.awareness-page select{
  font:inherit;
}

.awareness-page a{
  color:inherit;
}

.awareness-page img{
  display:block;
  max-width:100%;
}

.awareness-shell{
  position:relative;
  z-index:3;

  width:min(var(--awareness-width),calc(100% - 64px));
  margin-inline:auto;
}


/* =====================================================
   ACCESSIBILITY
===================================================== */

.awareness-skip-link{
  position:fixed;
  top:12px;
  left:12px;
  z-index:99999;

  padding:12px 18px;

  color:var(--awareness-white);
  background:var(--awareness-navy-deep);

  font-family:"Inter",Arial,sans-serif;
  font-weight:800;
  text-decoration:none;

  transform:translateY(-180%);
  transition:transform .2s ease;
}

.awareness-skip-link:focus{
  transform:translateY(0);
}

.awareness-page a:focus-visible,
.awareness-page button:focus-visible{
  outline:3px solid var(--awareness-gold);
  outline-offset:4px;
}


/* =====================================================
   SHARED TYPOGRAPHY
===================================================== */

.awareness-eyebrow,
.awareness-kicker{
  margin:0 0 16px;

  color:var(--awareness-blue);
  font-family:"Montserrat",Arial,sans-serif;
  font-size:.78rem;
  font-weight:900;
  line-height:1.4;

  letter-spacing:.18em;
  text-transform:uppercase;
}

.awareness-heading{
  max-width:880px;
  margin-bottom:54px;
}

.awareness-heading--centered{
  margin-inline:auto;
  text-align:center;
}

.awareness-heading h2{
  margin:0 0 20px;

  color:var(--awareness-navy-deep);
  font-family:"Montserrat",Arial,sans-serif;
  font-size:clamp(2.4rem,4.5vw,4.15rem);
  font-weight:900;
  line-height:1.04;
  letter-spacing:-.055em;
}

.awareness-heading > p:last-child{
  max-width:760px;
  margin:0 auto;

  color:var(--awareness-copy);
  font-size:1.08rem;
  line-height:1.85;
}

.awareness-source-note{
  margin-top:24px !important;

  color:var(--awareness-muted) !important;
  font-size:.88rem !important;
}

.awareness-source-note a{
  color:var(--awareness-blue);
  font-weight:800;
  text-underline-offset:3px;
}

.awareness-text-link{
  display:inline-flex;
  align-items:center;
  gap:8px;

  color:var(--awareness-blue);
  font-weight:800;
  text-decoration:none;
}

.awareness-text-link::after{
  content:"→";
  transition:transform .2s ease;
}

.awareness-text-link:hover::after{
  transform:translateX(5px);
}


/* =====================================================
   SHARED BUTTONS
===================================================== */

.awareness-button{
  display:inline-flex;
  align-items:center;
  justify-content:center;

  min-height:54px;
  padding:14px 26px;

  border:1px solid transparent;
  border-radius:4px;

  font-family:"Montserrat",Arial,sans-serif;
  font-size:.8rem;
  font-weight:900;
  line-height:1.2;

  letter-spacing:.06em;
  text-align:center;
  text-decoration:none;
  text-transform:uppercase;

  transition:
    transform .2s ease,
    background-color .2s ease,
    border-color .2s ease,
    color .2s ease,
    box-shadow .2s ease;
}

.awareness-button:hover{
  transform:translateY(-3px);
}

.awareness-button--light{
  color:var(--awareness-navy-deep);
  background:var(--awareness-white);
  box-shadow:0 16px 38px rgba(0,0,0,.2);
}

.awareness-button--light:hover{
  background:var(--awareness-gold-soft);
  box-shadow:0 22px 48px rgba(0,0,0,.26);
}

.awareness-button--outline{
  color:var(--awareness-white);
  background:rgba(255,255,255,.06);
  border-color:rgba(255,255,255,.5);
}

.awareness-button--outline:hover{
  color:var(--awareness-navy-deep);
  background:var(--awareness-white);
}

.awareness-button--blue{
  color:var(--awareness-white);

  background:
    linear-gradient(
      135deg,
      var(--awareness-blue),
      var(--awareness-purple)
    );

  box-shadow:
    0 16px 34px rgba(31,123,216,.28);
}

.awareness-button--blue:hover{
  box-shadow:
    0 22px 46px rgba(31,123,216,.38);
}


/* =====================================================
   CRISIS BANNER
===================================================== */

.crisis-banner{
  position:relative;
  z-index:80;

  color:var(--awareness-white);

  background:
    linear-gradient(
      90deg,
      var(--awareness-navy-deep),
      #071f40,
      var(--awareness-navy-deep)
    );

  border-bottom:1px solid rgba(255,255,255,.12);
}

.crisis-banner__inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:28px;

  width:min(var(--awareness-width),calc(100% - 64px));
  min-height:88px;
  margin-inline:auto;
  padding-block:14px;
}

.crisis-banner__message{
  display:flex;
  align-items:center;
  gap:16px;
}

.crisis-banner__pulse{
  position:relative;
  flex:0 0 auto;

  width:13px;
  height:13px;

  background:var(--awareness-teal);
  border-radius:50%;

  box-shadow:
    0 0 0 7px rgba(24,181,187,.17),
    0 0 30px rgba(24,181,187,.55);
}

.crisis-banner__pulse::after{
  content:"";
  position:absolute;
  inset:-8px;

  border:1px solid rgba(104,236,240,.75);
  border-radius:50%;

  animation:awarenessPulse 2.2s ease-out infinite;
}

.crisis-banner__title{
  margin:0 0 2px;

  color:var(--awareness-white);
  font-family:"Montserrat",Arial,sans-serif;
  font-size:.8rem;
  font-weight:900;

  letter-spacing:.08em;
  text-transform:uppercase;
}

.crisis-banner__copy{
  margin:0;

  color:rgba(255,255,255,.76);
  font-size:.9rem;
  line-height:1.55;
}

.crisis-banner__copy strong{
  color:var(--awareness-white);
}

.crisis-banner__actions{
  display:flex;
  align-items:center;
  gap:10px;
  flex:0 0 auto;
}

.crisis-banner__button{
  display:inline-flex;
  align-items:center;
  justify-content:center;

  min-height:42px;
  padding:9px 17px;

  color:var(--awareness-white);
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.3);
  border-radius:4px;

  font-size:.78rem;
  font-weight:800;
  text-decoration:none;

  transition:
    background-color .2s ease,
    border-color .2s ease;
}

.crisis-banner__button:hover{
  background:rgba(255,255,255,.16);
  border-color:rgba(255,255,255,.65);
}

.crisis-banner__button--primary{
  color:var(--awareness-navy-deep);
  background:var(--awareness-white);
  border-color:var(--awareness-white);
}

.crisis-banner__button--primary:hover{
  background:var(--awareness-gold-soft);
}

.crisis-banner__link{
  padding:8px 4px;

  color:rgba(255,255,255,.86);
  font-size:.78rem;
  font-weight:800;
  text-decoration:underline;
  text-underline-offset:4px;
}


/* =====================================================
   HERO
===================================================== */

.awareness-hero{
  --hero-scroll-progress:0;

  position:relative;
  isolation:isolate;
  overflow:hidden;

  width:100%;
  min-height:clamp(760px,90svh,940px);

  color:var(--awareness-white);
  background:#061a33;
}


/* =====================================================
   HERO BOTTOM TRANSITION
===================================================== */

.awareness-hero::after{
  content:"";

  position:absolute;
  z-index:5;
  left:-10%;
  bottom:-105px;

  width:120%;
  height:180px;

  background:
    linear-gradient(
      90deg,
      #edf8ff,
      #ffffff 48%,
      #f1edff
    );

  border-radius:
    50% 50% 0 0 /
    100% 100% 0 0;

  box-shadow:
    0 -20px 60px rgba(77,180,255,.08);

  pointer-events:none;
}


/* =====================================================
   HERO BACKGROUND
===================================================== */

.awareness-hero__background{
  position:absolute;
  z-index:0;
  inset:0;

  width:100%;
  height:100%;
  max-width:none;

  margin:0;
  padding:0;

  overflow:hidden;

  opacity:
    calc(
      1 - (var(--hero-scroll-progress) * .76)
    );

  transform:
    translate3d(
      0,
      calc(var(--hero-scroll-progress) * 75px),
      0
    )
    scale(
      calc(
        1 + (var(--hero-scroll-progress) * .04)
      )
    );

  transform-origin:center center;

  will-change:opacity,transform;
}


/* =====================================================
   HERO BACKGROUND IMAGE
===================================================== */

.awareness-hero__image{
  position:absolute;
  inset:0;

  display:block;

  width:100%;
  height:100%;
  max-width:none;

  object-fit:cover;
  object-position:center center;

  transform:
    translate3d(
      var(--hero-shift-x,0),
      var(--hero-shift-y,0),
      0
    )
    scale(1.045);

  transform-origin:center center;

  transition:
    transform .4s ease-out;

  will-change:transform;
}


/* =====================================================
   HERO IMAGE OVERLAYS
===================================================== */

.awareness-hero__image-overlay,
.awareness-hero__color-wash,
.awareness-hero__vignette{
  position:absolute;
  inset:0;

  pointer-events:none;
}

.awareness-hero__image-overlay{
  z-index:1;

  background:
    linear-gradient(
      90deg,
      rgba(3,17,35,.97) 0%,
      rgba(3,17,35,.91) 24%,
      rgba(3,17,35,.67) 46%,
      rgba(3,17,35,.28) 70%,
      rgba(3,17,35,.16) 100%
    );
}

.awareness-hero__color-wash{
  z-index:2;

  background:
    radial-gradient(
      circle at
      var(--hero-pointer-x,78%)
      var(--hero-pointer-y,28%),
      rgba(77,180,255,.22),
      transparent 32%
    ),
    radial-gradient(
      circle at 74% 90%,
      rgba(105,72,201,.28),
      transparent 38%
    ),
    linear-gradient(
      135deg,
      rgba(0,194,203,.08),
      rgba(105,72,201,.14)
    );

  mix-blend-mode:screen;
}

.awareness-hero__vignette{
  z-index:3;

  background:
    linear-gradient(
      180deg,
      rgba(2,12,27,.32) 0%,
      transparent 22%,
      transparent 62%,
      rgba(2,12,27,.82) 100%
    );
}


/* =====================================================
   HERO BACKGROUND GRID
===================================================== */

.awareness-hero__background::before{
  content:"";

  position:absolute;
  z-index:4;
  inset:0;

  opacity:.1;

  background-image:
    linear-gradient(
      rgba(255,255,255,.12) 1px,
      transparent 1px
    ),
    linear-gradient(
      90deg,
      rgba(255,255,255,.12) 1px,
      transparent 1px
    );

  background-size:78px 78px;

  -webkit-mask-image:
    linear-gradient(
      to right,
      transparent,
      black 60%
    );

  mask-image:
    linear-gradient(
      to right,
      transparent,
      black 60%
    );

  pointer-events:none;
}


/* =====================================================
   HERO GLOWS
===================================================== */

.awareness-hero__glow{
  position:absolute;
  z-index:5;

  border-radius:50%;
  filter:blur(18px);

  opacity:.55;

  animation:
    awarenessHeroFloat
    9s
    ease-in-out
    infinite;

  pointer-events:none;
}

.awareness-hero__glow--one{
  top:-220px;
  right:-120px;

  width:620px;
  height:620px;

  background:
    radial-gradient(
      circle,
      rgba(77,180,255,.48),
      transparent 68%
    );
}

.awareness-hero__glow--two{
  right:12%;
  bottom:-340px;

  width:720px;
  height:720px;

  background:
    radial-gradient(
      circle,
      rgba(105,72,201,.5),
      transparent 68%
    );

  animation-delay:-4s;
}


/* =====================================================
   HERO ACCENT LINES
===================================================== */

.awareness-hero__line{
  position:absolute;
  z-index:6;

  height:2px;

  background:
    linear-gradient(
      90deg,
      transparent,
      var(--awareness-blue-bright),
      var(--awareness-teal),
      transparent
    );

  border-radius:999px;

  opacity:.58;

  pointer-events:none;
}

.awareness-hero__line--one{
  top:120px;
  right:-70px;

  width:590px;

  transform:rotate(-8deg);
}

.awareness-hero__line--two{
  right:60px;
  bottom:135px;

  width:460px;

  transform:rotate(11deg);
}


/* =====================================================
   HERO MEMORY LIGHTS
===================================================== */

.awareness-memory-light{
  position:absolute;
  z-index:7;

  left:var(--light-x);
  top:var(--light-y);

  width:var(--light-size);
  height:var(--light-size);

  border-radius:50%;

  background:
    rgba(139,231,235,.9);

  box-shadow:
    0 0 12px rgba(77,180,255,.75),
    0 0 28px rgba(105,72,201,.45);

  opacity:0;

  animation:
    awarenessMemoryLight
    var(--light-duration)
    ease-in-out
    var(--light-delay)
    infinite;

  pointer-events:none;
}


/* =====================================================
   HERO INNER LAYOUT
===================================================== */

.awareness-hero__inner{
  position:relative;
  z-index:3;

  display:grid;
  grid-template-columns:
    minmax(0,1.1fr)
    minmax(380px,.72fr);

  align-items:center;
  gap:clamp(52px,6vw,100px);

  width:min(calc(100% - 56px),1500px);
  min-height:clamp(760px,90svh,940px);

  margin:0 auto;

  padding:
    clamp(110px,14vh,160px)
    0
    clamp(155px,18vh,205px);

  opacity:
    calc(
      1 - var(--hero-scroll-progress)
    );

  transform:
    translate3d(
      0,
      calc(var(--hero-scroll-progress) * -46px),
      0
    );

  will-change:opacity,transform;
}


/* =====================================================
   HERO CONTENT
===================================================== */

.awareness-hero__content{
  max-width:800px;
}

.awareness-hero__eyebrow-row{
  display:flex;
  align-items:center;
  gap:13px;

  margin-bottom:24px;
}

.awareness-hero__eyebrow-mark{
  position:relative;

  width:34px;
  height:3px;

  flex:0 0 auto;

  border-radius:999px;

  background:
    linear-gradient(
      90deg,
      var(--awareness-teal),
      var(--awareness-blue-bright),
      var(--awareness-purple-light)
    );

  box-shadow:
    0 0 18px rgba(77,180,255,.45);
}

.awareness-hero .awareness-eyebrow{
  margin:0;

  color:#8be7eb;
}

.awareness-hero__content h1{
  margin:0 0 30px;

  color:var(--awareness-white);

  font-family:
    "Montserrat",
    Arial,
    sans-serif;

  font-size:
    clamp(3.4rem,5.7vw,6.2rem);

  font-weight:900;
  line-height:.96;
  letter-spacing:-.065em;

  text-wrap:balance;
}

.awareness-hero__content h1 span{
  display:block;

  margin-top:10px;

  color:#75c6ff;

  font-family:
    "Cormorant Garamond",
    Georgia,
    serif;

  font-style:italic;
  font-weight:600;
  letter-spacing:-.04em;

  text-shadow:
    0 10px 42px rgba(77,180,255,.25);
}

.awareness-hero__lead{
  max-width:720px;
  margin:0;

  color:rgba(255,255,255,.94);

  font-size:
    clamp(1.05rem,1.45vw,1.28rem);

  font-weight:600;
  line-height:1.75;

  text-shadow:
    0 2px 18px rgba(0,0,0,.32);
}


/* =====================================================
   HERO ACTIONS
===================================================== */

.awareness-hero__actions{
  display:flex;
  flex-wrap:wrap;
  gap:14px;

  margin-top:36px;
}

.awareness-hero__actions .awareness-button{
  position:relative;
  overflow:hidden;

  min-height:56px;

  box-shadow:
    0 15px 38px rgba(1,14,32,.28);

  transition:
    transform .22s ease,
    box-shadow .22s ease,
    border-color .22s ease;
}

.awareness-hero__actions .awareness-button:hover{
  transform:translateY(-3px);

  box-shadow:
    0 20px 46px rgba(1,14,32,.38),
    0 0 24px rgba(77,180,255,.16);
}

.awareness-content-advisory{
  margin:22px 0 0;

  color:rgba(255,255,255,.58);
  font-size:.78rem;
}


/* =====================================================
   HERO MEMORIAL PANEL
===================================================== */

.awareness-hero__visual{
  position:relative;
  isolation:isolate;

  width:100%;
  max-width:570px;

  padding:42px 44px 38px;

  background:
    linear-gradient(
      145deg,
      #061a33 0%,
      #0a294d 58%,
      #102f58 100%
    );

  border:1px solid rgba(139,231,235,.22);
  border-left:4px solid rgba(111,220,235,.82);

  box-shadow:
    0 30px 70px rgba(0,10,28,.42),
    inset 0 1px 0 rgba(255,255,255,.1);

  overflow:hidden;

  transition:
    background .35s ease,
    border-color .35s ease,
    box-shadow .35s ease,
    transform .35s ease;
}


.awareness-hero__visual:hover{
  background:
    linear-gradient(
      145deg,
      #071e3a 0%,
      #0b2d55 58%,
      #123661 100%
    );

  border-color:rgba(139,231,235,.28);
  border-left-color:rgba(139,231,235,.68);

  box-shadow:
    0 34px 80px rgba(0,10,28,.28),
    inset 0 1px 0 rgba(255,255,255,.13);

  transform:translateY(-3px);
}


/* Soft internal lighting */

.awareness-hero__visual::before{
  content:"";

  position:absolute;
  inset:0;
  z-index:-1;

  pointer-events:none;

  background:
    radial-gradient(
      circle at 15% 8%,
      rgba(77,180,255,.16),
      transparent 34%
    ),
    radial-gradient(
      circle at 92% 88%,
      rgba(105,72,201,.15),
      transparent 38%
    );
}


/* Left awareness accent */

.awareness-hero__visual::after{
  content:"";

  position:absolute;
  top:0;
  bottom:0;
  left:-1px;

  width:5px;

  background:
    linear-gradient(
      to bottom,
      #58c8ff 0%,
      #9771ec 14%,
      transparent 28%,
      transparent 72%,
      #58c8ff 86%,
      #9771ec 100%
    );

  box-shadow:
    0 0 22px rgba(77,180,255,.34);
}


/* =====================================================
   PANEL HEADING
===================================================== */

.awareness-hero__visual-heading{
  display:grid;
  grid-template-columns:70px minmax(0,1fr);
  align-items:center;
  gap:20px;

  margin:0 0 34px;
}


.awareness-hero__visual-label{
  margin:0 0 7px;

  color:rgba(255,255,255,.7);

  font-family:"Montserrat",Arial,sans-serif;
  font-size:.7rem;
  font-weight:900;

  letter-spacing:.19em;
  line-height:1.2;
  text-transform:uppercase;
}


.awareness-hero__visual-subtitle{
  margin:0;

  color:rgba(255,255,255,.9);

  font-size:.98rem;
  font-weight:500;
  line-height:1.5;
}


/* =====================================================
   AWARENESS RIBBON
===================================================== */

.awareness-ribbon{
  position:relative;

  width:66px;
  height:88px;

  flex:0 0 66px;

  filter:
    drop-shadow(0 9px 14px rgba(0,0,0,.28))
    drop-shadow(0 0 12px rgba(77,180,255,.2));
}


.awareness-ribbon__loop{
  position:absolute;
  z-index:2;
  top:0;
  left:14px;

  width:38px;
  height:55px;

  border:9px solid #55d4e2;
  border-right-color:#9a75e5;
  border-bottom-color:#7655d2;
  border-radius:50%;

  transform:rotate(-10deg);
}


.awareness-ribbon__tail{
  position:absolute;
  top:43px;

  width:13px;
  height:44px;

  border-radius:2px 2px 1px 1px;

  clip-path:polygon(0 0,100% 0,82% 100%,0 82%);
  transform-origin:top center;
}


.awareness-ribbon__tail--left{
  z-index:3;
  left:23px;

  background:linear-gradient(
    180deg,
    #62dce7,
    #22b9c5
  );

  transform:rotate(24deg);
}


.awareness-ribbon__tail--right{
  z-index:1;
  left:37px;

  background:linear-gradient(
    180deg,
    #a17ce9,
    #7655d2
  );

  transform:rotate(-24deg) scaleX(-1);
}


/* =====================================================
   MEMORIAL NAMES
===================================================== */

.awareness-hero__names{
  display:grid;
  gap:0;

  border-top:1px solid rgba(255,255,255,.13);
}


.awareness-hero__name{
  display:grid;
  grid-template-columns:48px minmax(0,1fr);
  align-items:center;
  gap:18px;

  padding:21px 0;

  border-bottom:1px solid rgba(255,255,255,.13);

  transition:
    padding-left .3s ease,
    background .3s ease;
}


.awareness-hero__name:hover{
  padding-left:8px;

  background:
    linear-gradient(
      90deg,
      rgba(77,180,255,.07),
      transparent 72%
    );
}


.awareness-hero__initial{
  display:grid;
  place-items:center;

  width:48px;
  height:48px;

  color:#ffffff;

  font-family:"Cormorant Garamond",Georgia,serif;
  font-size:1.55rem;
  font-weight:700;

  border:1px solid rgba(139,231,235,.58);
  border-radius:50%;

  background:
    linear-gradient(
      145deg,
      rgba(77,180,255,.3),
      rgba(105,72,201,.32)
    );

  box-shadow:
    inset 0 0 18px rgba(77,180,255,.13),
    0 7px 18px rgba(0,0,0,.14);

  transition:
    border-color .3s ease,
    box-shadow .3s ease,
    transform .3s ease;
}


.awareness-hero__name:hover .awareness-hero__initial{
  border-color:#8be7eb;

  box-shadow:
    inset 0 0 20px rgba(77,180,255,.18),
    0 0 20px rgba(77,180,255,.2);

  transform:scale(1.04);
}


.awareness-hero__name p{
  margin:0;
}


.awareness-hero__name strong{
  display:block;

  color:#ffffff;

  font-family:"Cormorant Garamond",Georgia,serif;
  font-size:clamp(1.85rem,2.3vw,2.55rem);
  font-weight:600;

  line-height:1.05;
  letter-spacing:-.02em;

  text-shadow:0 5px 18px rgba(0,0,0,.25);
}


.awareness-hero__name time{
  display:block;

  margin-top:8px;

  color:#8be7eb;

  font-family:"Montserrat",Arial,sans-serif;
  font-size:.72rem;
  font-weight:800;

  letter-spacing:.09em;
  text-transform:uppercase;
}


/* =====================================================
   HOPE MESSAGE
===================================================== */

.awareness-hero__hope{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:7px 9px;

  margin:28px 0 0;

  color:rgba(255,255,255,.7);

  font-family:"Montserrat",Arial,sans-serif;
  font-size:.7rem;
  font-weight:800;

  letter-spacing:.1em;
  line-height:1.7;
  text-transform:uppercase;
}


.awareness-hero__hope span:not(:last-of-type)::after{
  content:"•";

  margin-left:9px;

  color:rgba(139,231,235,.58);
}


.awareness-hero__hope strong{
  color:#8be7eb;

  text-shadow:0 0 16px rgba(139,231,235,.2);
}


/* =====================================================
   RESPONSIVE MEMORIAL PANEL
===================================================== */

@media (max-width:760px){

  .awareness-hero__visual{
    padding:34px 26px 30px;
  }

  .awareness-hero__visual-heading{
    grid-template-columns:56px minmax(0,1fr);
    gap:17px;

    margin-bottom:27px;
  }

  .awareness-ribbon{
    width:53px;
    height:70px;

    transform:scale(.88);
    transform-origin:left center;
  }

  .awareness-hero__name{
    grid-template-columns:43px minmax(0,1fr);
    gap:14px;

    padding:18px 0;
  }

  .awareness-hero__initial{
    width:43px;
    height:43px;

    font-size:1.35rem;
  }

  .awareness-hero__name strong{
    font-size:clamp(1.55rem,7vw,2rem);
  }

  .awareness-hero__hope{
    display:block;

    font-size:.65rem;
  }

  .awareness-hero__hope span,
  .awareness-hero__hope strong{
    display:block;

    margin-top:4px;
  }

  .awareness-hero__hope span:not(:last-of-type)::after{
    content:"";
    margin:0;
  }

}


@media (prefers-reduced-motion:reduce){

  .awareness-hero__visual,
  .awareness-hero__name,
  .awareness-hero__initial{
    transition:none;
  }

  .awareness-hero__visual:hover,
  .awareness-hero__name:hover .awareness-hero__initial{
    transform:none;
  }

}


/* =====================================================
   HERO SCROLL INDICATOR
===================================================== */

.awareness-hero__scroll{
  position:absolute;
  z-index:6;
  left:50%;
  bottom:50px;

  display:flex;
  flex-direction:column;
  align-items:center;
  gap:9px;

  color:rgba(255,255,255,.7);

  font-family:
    "Montserrat",
    Arial,
    sans-serif;

  font-size:.65rem;
  font-weight:800;

  letter-spacing:.16em;
  text-decoration:none;
  text-transform:uppercase;

  opacity:
    calc(
      1 - (var(--hero-scroll-progress) * 3)
    );

  transform:translateX(-50%);
}

.awareness-hero__scroll-line{
  width:1px;
  height:42px;

  background:
    linear-gradient(
      180deg,
      #65e6ef,
      rgba(139,92,246,0)
    );

  animation:
    awarenessHeroScrollLine
    1.8s
    ease-in-out
    infinite;
}


/* =====================================================
   HERO RESPONSIVE
===================================================== */

@media (max-width:1100px){

  .awareness-hero__inner{
    grid-template-columns:1fr;
    align-content:center;

    width:min(calc(100% - 40px),780px);

    gap:44px;

    padding-top:110px;
    padding-bottom:180px;
  }

  .awareness-hero__content{
    max-width:760px;
  }

  .awareness-hero__visual{
    max-width:650px;
  }

  .awareness-hero__image{
    object-position:68% center;
  }

  .awareness-hero__image-overlay{
    background:
      linear-gradient(
        90deg,
        rgba(3,17,35,.96),
        rgba(3,17,35,.72) 62%,
        rgba(3,17,35,.42)
      );
  }

}


@media (max-width:700px){

  .awareness-hero{
    min-height:auto;
  }

  .awareness-hero__inner{
    width:min(calc(100% - 28px),560px);
    min-height:auto;

    padding:
      96px
      0
      155px;
  }

  .awareness-hero__image{
    object-position:72% center;

    transform:
      translate3d(
        var(--hero-shift-x,0),
        var(--hero-shift-y,0),
        0
      )
      scale(1.08);
  }

  .awareness-hero__image-overlay{
    background:
      linear-gradient(
        180deg,
        rgba(3,17,35,.7) 0%,
        rgba(3,17,35,.88) 44%,
        rgba(3,17,35,.98) 100%
      );
  }

  .awareness-hero__content h1{
    font-size:
      clamp(2.8rem,13vw,4.4rem);
  }

  .awareness-hero__actions{
    flex-direction:column;
  }

  .awareness-hero__actions .awareness-button{
    width:100%;
  }

  .awareness-hero__visual{
    max-width:570px;
    padding:30px 24px 27px;
  }

  .awareness-hero__visual-heading{
    align-items:center;
  }

  .awareness-hero__name{
    grid-template-columns:42px 1fr;
  }

  .awareness-hero__initial{
    width:42px;
    height:42px;
  }

  .awareness-hero__line{
    display:none;
  }

  .awareness-hero__scroll{
    bottom:36px;
  }

}


@media (max-width:420px){

  .awareness-hero__inner{
    width:min(calc(100% - 22px),420px);
  }

  .awareness-hero__content h1{
    font-size:2.65rem;
  }

  .awareness-hero__visual-heading{
    gap:14px;
  }

  .awareness-ribbon{
    width:46px;
    flex-basis:46px;

    transform:scale(.88);
    transform-origin:top left;
  }

  .awareness-hero__hope{
    display:grid;
  }

}


/* =====================================================
   REDUCED MOTION
===================================================== */

@media (prefers-reduced-motion:reduce){

  .awareness-hero__background,
  .awareness-hero__image,
  .awareness-hero__inner,
  .awareness-hero__visual{
    transform:none;
    transition:none;
  }

  .awareness-hero__glow,
  .awareness-memory-light,
  .awareness-hero__scroll-line{
    animation:none;
  }

}


/* =====================================================
   HERO ANIMATIONS
===================================================== */

@keyframes awarenessHeroFloat{

  0%,
  100%{
    transform:translate3d(0,0,0);
  }

  50%{
    transform:translate3d(0,24px,0);
  }

}

@keyframes awarenessMemoryLight{

  0%,
  100%{
    opacity:0;
    transform:translate3d(0,12px,0) scale(.65);
  }

  35%,
  65%{
    opacity:.7;
  }

  50%{
    transform:translate3d(0,-18px,0) scale(1);
  }

}

@keyframes awarenessHeroScrollLine{

  0%,
  100%{
    opacity:.35;
    transform:scaleY(.4);
    transform-origin:top;
  }

  50%{
    opacity:1;
    transform:scaleY(1);
    transform-origin:top;
  }

}


/* =====================================================
   MEMORIAL SECTION
===================================================== */

.memorial-section{
  position:relative;
  isolation:isolate;

  padding:145px 0 210px;

  background:
    radial-gradient(
      circle at 4% 20%,
      rgba(77,180,255,.2),
      transparent 28%
    ),
    radial-gradient(
      circle at 96% 72%,
      rgba(105,72,201,.18),
      transparent 30%
    ),
    radial-gradient(
      circle at 50% 105%,
      rgba(24,181,187,.13),
      transparent 30%
    ),
    linear-gradient(
      115deg,
      #edf8ff,
      #ffffff 48%,
      #f2eeff
    );
}

.memorial-section::before{
  content:"";
  position:absolute;
  z-index:0;
  top:13%;
  left:50%;

  width:560px;
  height:560px;

  border:
    1px solid rgba(77,180,255,.15);
  border-radius:50%;

  transform:translateX(-50%);

  box-shadow:
    0 0 0 80px rgba(105,72,201,.025),
    0 0 0 160px rgba(24,181,187,.018);
}

.memorial-section::after{
  content:"";
  position:absolute;
  z-index:1;
  left:-10%;
  bottom:-1px;

  width:120%;
  height:145px;

  background:
    linear-gradient(
      90deg,
      var(--awareness-navy-deep),
      var(--awareness-navy),
      #174f8a
    );

  border-radius:50% 50% 0 0 / 100% 100% 0 0;

  box-shadow:
    0 -24px 70px rgba(31,123,216,.1);
}

.memorial-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:34px;
}

.memorial-card{
  position:relative;
  overflow:hidden;

  padding:0 42px 42px;

  background:
    linear-gradient(
      150deg,
      rgba(255,255,255,.98),
      rgba(245,251,255,.92)
    );

  border:1px solid rgba(31,123,216,.17);
  border-top:6px solid var(--awareness-blue);
  border-radius:6px;

  box-shadow:
    0 28px 70px rgba(4,21,42,.15);

  transition:
    transform .3s ease,
    box-shadow .3s ease;
}

.memorial-card:hover{
  transform:translateY(-8px);

  box-shadow:
    0 38px 90px rgba(4,21,42,.2);
}

.memorial-card--andrea{
  border-top-color:var(--awareness-teal);
}

.memorial-card--danny{
  border-top-color:var(--awareness-purple);
}

.memorial-card::after{
  content:"";
  position:absolute;
  right:-90px;
  bottom:-100px;

  width:270px;
  height:270px;

  background:
    radial-gradient(
      circle,
      rgba(77,180,255,.18),
      transparent 68%
    );

  border-radius:50%;
}

.memorial-card--andrea::after{
  background:
    radial-gradient(
      circle,
      rgba(24,181,187,.2),
      transparent 68%
    );
}

.memorial-card--danny::after{
  background:
    radial-gradient(
      circle,
      rgba(105,72,201,.2),
      transparent 68%
    );
}

.memorial-card__topline{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;

  margin:0 -42px 34px;
  padding:20px 42px;

  background:
    linear-gradient(
      90deg,
      rgba(24,181,187,.1),
      rgba(77,180,255,.04),
      transparent
    );

  border-bottom:1px solid var(--awareness-line);
}

.memorial-card--danny .memorial-card__topline{
  background:
    linear-gradient(
      90deg,
      rgba(105,72,201,.11),
      rgba(77,180,255,.04),
      transparent
    );
}

.memorial-card__label{
  margin:0;

  color:var(--awareness-muted);
  font-family:"Montserrat",Arial,sans-serif;
  font-size:.68rem;
  font-weight:900;

  letter-spacing:.19em;
  text-transform:uppercase;
}

.memorial-card__heart{
  color:var(--awareness-purple);
  font-size:1.8rem;
  line-height:1;
}

.memorial-card--andrea .memorial-card__heart{
  color:var(--awareness-teal);
}

.memorial-card__identity{
  display:grid;
  grid-template-columns:128px 1fr;
  align-items:center;
  gap:26px;

  margin-bottom:30px;
}

.memorial-card__portrait{
  position:relative;
  overflow:hidden;

  width:128px;
  aspect-ratio:4 / 5;
  margin:0;

  background:var(--awareness-blue-soft);
  border:5px solid var(--awareness-white);
  border-radius:5px;

  box-shadow:
    0 18px 36px rgba(4,21,42,.2);
}

.memorial-card__portrait::after{
  content:"";
  position:absolute;
  inset:0;

  border:
    1px solid rgba(255,255,255,.55);

  box-shadow:
    inset 0 -35px 50px rgba(4,21,42,.12);
}

.memorial-card--andrea .memorial-card__portrait{
  outline:
    3px solid rgba(24,181,187,.35);
}

.memorial-card--danny .memorial-card__portrait{
  outline:
    3px solid rgba(105,72,201,.35);
}

.memorial-card__portrait img{
  width:100%;
  height:100%;

  object-fit:cover;
  object-position:center top;

  transition:transform .6s ease;
}

.memorial-card:hover .memorial-card__portrait img{
  transform:scale(1.045);
}

.memorial-card h3{
  margin:0;

  color:var(--awareness-navy-deep);
  font-family:"Cormorant Garamond",Georgia,serif;
  font-size:clamp(2.3rem,3.5vw,3.4rem);
  font-weight:700;
  line-height:1;
}

.memorial-card__date{
  margin:10px 0 0;

  color:var(--awareness-muted);
  font-size:.78rem;
  font-weight:800;

  letter-spacing:.04em;
  text-transform:uppercase;
}

.memorial-card__service{
  margin:7px 0 0;

  color:var(--awareness-purple);
  font-size:.76rem;
  font-weight:900;

  letter-spacing:.09em;
  text-transform:uppercase;
}

.memorial-card__copy{
  position:relative;
  z-index:2;
}

.memorial-card__copy p{
  margin:0 0 17px;

  color:var(--awareness-copy);
  line-height:1.85;
}

.memorial-card__copy p:last-child{
  margin-bottom:0;
}

.memorial-card__closing{
  position:relative;
  z-index:2;

  margin:30px 0 0;
  padding-top:22px;

  color:var(--awareness-teal-dark);
  border-top:1px solid var(--awareness-line);

  font-family:"Cormorant Garamond",Georgia,serif;
  font-size:1.45rem;
  font-weight:700;
  font-style:italic;
}

.memorial-card__links{
  position:relative;
  z-index:2;

  display:grid;
  gap:11px;

  margin-top:30px;
  padding-top:23px;

  border-top:1px solid var(--awareness-line);
}

.memorial-card__links a{
  display:inline-flex;
  align-items:center;
  gap:8px;

  width:max-content;
  max-width:100%;

  color:var(--awareness-blue);
  font-size:.85rem;
  font-weight:900;
  text-decoration:none;
}

.memorial-card__links a::after{
  content:"↗";
}

.memorial-card__links a:hover{
  text-decoration:underline;
  text-underline-offset:4px;
}

.memorial-statement{
  max-width:1000px;
  margin:62px auto 0;
  padding:12px 0 12px 34px;

  border-left:5px solid transparent;

  border-image:
    linear-gradient(
      to bottom,
      var(--awareness-blue),
      var(--awareness-teal),
      var(--awareness-purple)
    ) 1;
}

.memorial-statement p{
  margin:0;

  color:var(--awareness-navy-deep);
  font-family:"Cormorant Garamond",Georgia,serif;
  font-size:clamp(1.6rem,2.7vw,2.45rem);
  font-weight:600;
  line-height:1.42;
}


/* =====================================================
   COMMUNITY WALK
===================================================== */

.walk-section{
  position:relative;
  isolation:isolate;
  overflow:hidden;

  padding:175px 0 220px;

  color:var(--awareness-white);

  background:
    radial-gradient(
      circle at 88% 20%,
      rgba(77,180,255,.38),
      transparent 29%
    ),
    radial-gradient(
      circle at 20% 88%,
      rgba(105,72,201,.38),
      transparent 34%
    ),
    linear-gradient(
      115deg,
      var(--awareness-navy-deep),
      var(--awareness-navy) 52%,
      #195b9b
    );
}

.walk-section::before{
  content:"";
  position:absolute;
  z-index:0;
  top:14%;
  left:3%;

  width:520px;
  height:520px;

  border:1px solid rgba(77,180,255,.16);
  border-radius:50%;

  box-shadow:
    0 0 0 90px rgba(24,181,187,.025),
    0 0 0 180px rgba(105,72,201,.02);
}

.walk-section::after{
  content:"";
  position:absolute;
  z-index:1;
  left:-10%;
  bottom:-94px;

  width:120%;
  height:175px;

  background:
    linear-gradient(
      100deg,
      #f2f9ff,
      #ffffff 52%,
      #f1edff
    );

  border-radius:50% 50% 0 0 / 100% 100% 0 0;

  box-shadow:
    0 -25px 70px rgba(77,180,255,.09);
}

.walk-section__inner{
  display:grid;
  grid-template-columns:minmax(0,.9fr) minmax(560px,1.1fr);
  align-items:center;
  gap:86px;
}

.walk-section .awareness-kicker{
  color:#8be7eb;
}

.walk-section__content h2{
  max-width:760px;
  margin:0 0 24px;

  color:var(--awareness-white);
  font-family:"Montserrat",Arial,sans-serif;
  font-size:clamp(2.7rem,4.8vw,4.7rem);
  font-weight:900;
  line-height:1.02;
  letter-spacing:-.06em;
}

.walk-section__content > p{
  max-width:740px;
  margin:0 0 18px;

  color:rgba(255,255,255,.77);
  font-size:1.04rem;
  line-height:1.85;
}

.walk-section__actions{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:20px;

  margin-top:32px;
}

.walk-section .awareness-text-link{
  color:var(--awareness-white);
}

.walk-section__note{
  margin-top:27px !important;

  color:rgba(255,255,255,.5) !important;
  font-size:.76rem !important;
  line-height:1.65 !important;
}

.walk-section__visual{
  position:relative;

  min-height:590px;
}

.walk-section__photo{
  position:absolute;
  top:0;
  left:0;
  overflow:hidden;

  width:min(430px,76%);
  aspect-ratio:4 / 5;
  margin:0;

  padding:9px;

  background:rgba(255,255,255,.92);
  border:1px solid rgba(255,255,255,.45);
  border-radius:7px;

  box-shadow:
    0 38px 90px rgba(0,0,0,.34);

  transform:rotate(-2deg);
}

.walk-section__photo::after{
  content:"";
  position:absolute;
  inset:9px;

  pointer-events:none;

  background:
    linear-gradient(
      180deg,
      transparent 65%,
      rgba(4,21,42,.14)
    );

  border:
    1px solid rgba(255,255,255,.25);
}

.walk-section__photo img{
  width:100%;
  height:100%;

  object-fit:cover;
  object-position:center;

  transition:transform .7s ease;
}

.walk-section__photo:hover img{
  transform:scale(1.04);
}

.walk-card{
  position:absolute;
  z-index:3;
  right:0;
  bottom:12px;

  width:min(350px,62%);
  padding:34px;

  color:var(--awareness-ink);
  background:rgba(255,255,255,.97);

  border-top:6px solid var(--awareness-teal);
  border-radius:5px;

  box-shadow:
    0 30px 70px rgba(0,0,0,.32);

  backdrop-filter:blur(15px);
}

.walk-card::after{
  content:"";
  position:absolute;
  top:34px;
  right:30px;

  width:44px;
  height:44px;

  border:7px solid var(--awareness-blue-soft);
  border-radius:50%;

  box-shadow:
    0 0 0 7px rgba(105,72,201,.08);
}

.walk-card__month{
  margin:0;

  color:var(--awareness-blue);
  font-family:"Montserrat",Arial,sans-serif;
  font-size:.74rem;
  font-weight:900;

  letter-spacing:.16em;
  text-transform:uppercase;
}

.walk-card__day{
  margin:4px 0 0;

  color:var(--awareness-navy-deep);
  font-family:"Montserrat",Arial,sans-serif;
  font-size:5.3rem;
  font-weight:900;
  line-height:.88;
  letter-spacing:-.09em;
}

.walk-card__year{
  margin:10px 0 28px;

  color:var(--awareness-muted);
  font-weight:900;

  letter-spacing:.18em;
}

.walk-card__details{
  display:grid;
  gap:16px;

  margin:0;
  padding-top:24px;

  border-top:1px solid var(--awareness-line);
}

.walk-card__details div{
  display:grid;
  grid-template-columns:88px 1fr;
  gap:16px;
}

.walk-card__details dt{
  color:var(--awareness-muted);
  font-size:.66rem;
  font-weight:900;

  letter-spacing:.1em;
  text-transform:uppercase;
}

.walk-card__details dd{
  margin:0;

  color:var(--awareness-ink);
  font-size:.85rem;
  font-weight:700;
  line-height:1.5;
}


/* =====================================================
   SUPPORT PATHS
===================================================== */

.support-paths{
  position:relative;
  isolation:isolate;

  padding:155px 0 205px;

  background:
    radial-gradient(
      circle at 8% 20%,
      rgba(24,181,187,.16),
      transparent 28%
    ),
    radial-gradient(
      circle at 92% 30%,
      rgba(105,72,201,.15),
      transparent 30%
    ),
    linear-gradient(
      110deg,
      #f2f9ff,
      #ffffff 52%,
      #f2eeff
    );
}

.support-paths::before{
  content:"";
  position:absolute;
  z-index:0;
  top:34%;
  right:-170px;

  width:500px;
  height:500px;

  border:
    1px solid rgba(105,72,201,.13);
  border-radius:50%;

  box-shadow:
    0 0 0 90px rgba(77,180,255,.025);
}

.support-paths::after{
  content:"";
  position:absolute;
  z-index:1;
  left:-10%;
  bottom:-1px;

  width:120%;
  height:140px;

  background:
    linear-gradient(
      100deg,
      #dcefff,
      #edf8ff 42%,
      #e8e2ff
    );

  border-radius:50% 50% 0 0 / 100% 100% 0 0;
}

.support-paths__grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:24px;

  margin-bottom:58px;
}

.support-card{
  position:relative;
  display:flex;
  flex-direction:column;
  overflow:hidden;

  min-height:380px;
  padding:38px;

  background:
    linear-gradient(
      150deg,
      rgba(255,255,255,.98),
      rgba(242,249,255,.94)
    );

  border:1px solid rgba(31,123,216,.17);
  border-top:5px solid var(--awareness-blue);
  border-radius:5px;

  box-shadow:
    0 22px 52px rgba(4,21,42,.11);

  transition:
    transform .3s ease,
    box-shadow .3s ease;
}

.support-card::after{
  content:"";
  position:absolute;
  right:-80px;
  bottom:-90px;

  width:220px;
  height:220px;

  background:
    radial-gradient(
      circle,
      rgba(77,180,255,.14),
      transparent 68%
    );

  border-radius:50%;
}

.support-card:hover{
  transform:translateY(-7px);

  box-shadow:
    0 34px 72px rgba(4,21,42,.16);
}

.support-card:nth-child(2){
  border-top-color:var(--awareness-teal);
}

.support-card:nth-child(3){
  border-top-color:var(--awareness-purple);
}

.support-card--urgent{
  color:var(--awareness-white);

  background:
    radial-gradient(
      circle at 90% 10%,
      rgba(77,180,255,.28),
      transparent 30%
    ),
    linear-gradient(
      145deg,
      var(--awareness-navy-deep),
      var(--awareness-navy-light)
    );

  border-color:transparent;
  border-top-color:var(--awareness-blue-bright);
}

.support-card__number{
  position:relative;
  z-index:2;

  margin:0 0 34px;

  color:var(--awareness-blue);
  font-family:"Montserrat",Arial,sans-serif;
  font-size:.75rem;
  font-weight:900;

  letter-spacing:.14em;
}

.support-card:nth-child(2) .support-card__number{
  color:var(--awareness-teal-dark);
}

.support-card:nth-child(3) .support-card__number{
  color:var(--awareness-purple);
}

.support-card--urgent .support-card__number{
  color:#8be7eb;
}

.support-card h3{
  position:relative;
  z-index:2;

  margin:0 0 19px;

  color:var(--awareness-navy-deep);
  font-family:"Montserrat",Arial,sans-serif;
  font-size:1.55rem;
  font-weight:900;
  line-height:1.2;
  letter-spacing:-.03em;
}

.support-card--urgent h3{
  color:var(--awareness-white);
}

.support-card > p:not(.support-card__number){
  position:relative;
  z-index:2;

  margin:0 0 30px;

  color:var(--awareness-copy);
  line-height:1.82;
}

.support-card--urgent > p:not(.support-card__number){
  color:rgba(255,255,255,.76);
}

.support-card__actions{
  position:relative;
  z-index:2;

  display:flex;
  flex-wrap:wrap;
  gap:9px;

  margin-top:auto;
}

.support-card__actions a{
  display:inline-flex;
  align-items:center;
  justify-content:center;

  min-height:42px;
  padding:9px 15px;

  color:var(--awareness-white);
  background:rgba(255,255,255,.1);

  border:1px solid rgba(255,255,255,.28);
  border-radius:4px;

  font-size:.75rem;
  font-weight:900;
  text-decoration:none;
}

.support-card__actions a:first-child{
  color:var(--awareness-navy-deep);
  background:var(--awareness-white);
  border-color:var(--awareness-white);
}

.support-card__link{
  position:relative;
  z-index:2;

  display:inline-flex;
  align-items:center;
  gap:8px;

  width:max-content;
  max-width:100%;
  margin-top:auto;
  padding:0;

  color:var(--awareness-blue);
  background:none;
  border:0;

  font-size:.84rem;
  font-weight:900;
  text-align:left;

  cursor:pointer;
}

.support-card__link::after{
  content:"→";
  transition:transform .2s ease;
}

.support-card__link:hover::after{
  transform:translateX(5px);
}


/* =====================================================
   TOPIC CARD HUB
===================================================== */

.awareness-topic-grid{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:16px;
}

.awareness-topic-card{
  position:relative;
  display:flex;
  flex-direction:column;
  overflow:hidden;

  min-height:265px;
  padding:28px 25px;

  color:var(--awareness-ink);

  background:
    linear-gradient(
      150deg,
      rgba(255,255,255,.96),
      rgba(231,244,255,.9)
    );

  border:1px solid rgba(31,123,216,.16);
  border-bottom:5px solid var(--awareness-blue);
  border-radius:4px;

  text-align:left;
  cursor:pointer;

  box-shadow:
    0 16px 38px rgba(4,21,42,.08);

  transition:
    transform .25s ease,
    box-shadow .25s ease,
    border-color .25s ease;
}

.awareness-topic-card::before{
  content:"";
  position:absolute;
  top:-70px;
  right:-70px;

  width:160px;
  height:160px;

  background:
    radial-gradient(
      circle,
      rgba(77,180,255,.2),
      transparent 68%
    );

  border-radius:50%;
}

.awareness-topic-card:nth-child(2){
  border-bottom-color:var(--awareness-teal);
}

.awareness-topic-card:nth-child(3){
  border-bottom-color:var(--awareness-gold);
}

.awareness-topic-card:nth-child(4){
  border-bottom-color:var(--awareness-purple);
}

.awareness-topic-card:nth-child(5){
  border-bottom-color:var(--awareness-blue-bright);
}

.awareness-topic-card:hover{
  transform:translateY(-7px);

  box-shadow:
    0 28px 60px rgba(4,21,42,.15);
}

.awareness-topic-card__number{
  position:relative;
  z-index:2;

  margin-bottom:36px;

  color:var(--awareness-blue);
  font-family:"Montserrat",Arial,sans-serif;
  font-size:.7rem;
  font-weight:900;

  letter-spacing:.14em;
}

.awareness-topic-card__title{
  position:relative;
  z-index:2;

  display:block;
  margin-bottom:13px;

  color:var(--awareness-navy-deep);
  font-family:"Montserrat",Arial,sans-serif;
  font-size:1.05rem;
  font-weight:900;
  line-height:1.3;
}

.awareness-topic-card__copy{
  position:relative;
  z-index:2;

  display:block;
  margin-bottom:24px;

  color:var(--awareness-copy);
  font-size:.82rem;
  line-height:1.68;
}

.awareness-topic-card__action{
  position:relative;
  z-index:2;

  display:flex;
  align-items:center;
  gap:7px;

  margin-top:auto;

  color:var(--awareness-blue);
  font-size:.72rem;
  font-weight:900;

  letter-spacing:.06em;
  text-transform:uppercase;
}

.awareness-topic-card__action::after{
  content:"→";
}


/* =====================================================
   CARE CARDS
===================================================== */

.awareness-care-grid{
  position:relative;

  padding:175px 0 110px;

  background:
    radial-gradient(
      circle at 8% 25%,
      rgba(24,181,187,.18),
      transparent 28%
    ),
    radial-gradient(
      circle at 92% 70%,
      rgba(105,72,201,.18),
      transparent 30%
    ),
    linear-gradient(
      110deg,
      #dcefff,
      #edf8ff 42%,
      #e8e2ff
    );
}

.awareness-care-grid__inner{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:26px;
}

.care-card{
  min-width:0;

  background:rgba(255,255,255,.94);
  border:1px solid rgba(31,123,216,.17);
  border-radius:5px;

  box-shadow:
    0 28px 65px rgba(4,21,42,.14);
}

.faith-care{
  border-top:6px solid var(--awareness-gold);
}

.faith-care__inner{
  display:grid;
  grid-template-columns:auto 1fr;
  gap:30px;

  padding:46px;
}

.faith-care__cross{
  display:flex;
  align-items:center;
  justify-content:center;

  width:68px;
  height:68px;

  color:#aa6f19;
  background:
    radial-gradient(
      circle,
      var(--awareness-gold-soft),
      #ffe2a7
    );

  border:1px solid rgba(242,182,93,.38);
  border-radius:50%;

  font-size:2rem;

  box-shadow:
    0 14px 30px rgba(242,182,93,.24);
}

.faith-care__content h2,
.church-support__content h2{
  margin:0 0 19px;

  color:var(--awareness-navy-deep);
  font-family:"Montserrat",Arial,sans-serif;
  font-size:clamp(1.75rem,3vw,2.6rem);
  font-weight:900;
  line-height:1.1;
  letter-spacing:-.045em;
}

.faith-care__content p:not(.awareness-kicker),
.church-support__content p:not(.awareness-kicker){
  margin:0 0 14px;

  color:var(--awareness-copy);
  line-height:1.82;
}

.church-support{
  color:var(--awareness-white);

  background:
    radial-gradient(
      circle at 88% 12%,
      rgba(77,180,255,.3),
      transparent 30%
    ),
    linear-gradient(
      145deg,
      var(--awareness-navy-deep),
      var(--awareness-navy-light)
    );

  border-color:transparent;
  border-top:6px solid var(--awareness-teal);
}

.church-support__inner{
  display:flex;
  flex-direction:column;
  align-items:flex-start;

  min-height:100%;
  padding:46px;
}

.church-support .awareness-kicker{
  color:#8be7eb;
}

.church-support__content h2{
  color:var(--awareness-white);
}

.church-support__content p:not(.awareness-kicker){
  color:rgba(255,255,255,.73);
}

.church-support .awareness-button{
  margin-top:auto;
}

.awareness-closing{
  grid-column:1 / -1;

  margin-top:6px;
  padding:34px 38px;

  color:var(--awareness-white);

  background:
    linear-gradient(
      100deg,
      var(--awareness-blue),
      var(--awareness-teal),
      var(--awareness-purple)
    );

  border-radius:5px;

  box-shadow:
    0 24px 60px rgba(31,123,216,.25);
}

.awareness-closing__inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:30px;
}

.awareness-closing__inner > p:first-child{
  display:flex;
  flex-wrap:wrap;
  gap:10px;

  margin:0;

  font-family:"Montserrat",Arial,sans-serif;
  font-size:clamp(1.15rem,2vw,1.55rem);
  font-weight:900;
}

.awareness-closing__inner > p:first-child span{
  color:var(--awareness-gold-soft);
}

.awareness-closing__review{
  margin:0;

  color:rgba(255,255,255,.68);
  font-size:.72rem;
  text-align:right;
}


/* =====================================================
   MODALS
===================================================== */

.awareness-modal{
  position:fixed;

  width:min(1020px,calc(100% - 36px));
  max-width:none;
  max-height:calc(100vh - 40px);

  margin:auto;
  padding:0;

  color:var(--awareness-ink);
  background:transparent;
  border:0;

  overflow:visible;
}

.awareness-modal[open]{
  display:block;

  animation:
    awarenessModalIn .24s ease both;
}

.awareness-modal::backdrop{
  background:
    radial-gradient(
      circle at 80% 10%,
      rgba(31,123,216,.27),
      transparent 38%
    ),
    radial-gradient(
      circle at 15% 85%,
      rgba(105,72,201,.25),
      transparent 35%
    ),
    rgba(3,13,27,.86);

  backdrop-filter:blur(9px);
}

.awareness-modal__body{
  position:relative;

  max-height:calc(100vh - 40px);
  padding:58px;

  background:
    radial-gradient(
      circle at 95% 5%,
      rgba(77,180,255,.1),
      transparent 30%
    ),
    var(--awareness-white);

  border-top:7px solid var(--awareness-blue);
  border-radius:6px;

  box-shadow:var(--awareness-shadow-strong);

  overflow:auto;
  overscroll-behavior:contain;
}

.awareness-modal__close{
  position:absolute;
  z-index:20;
  top:18px;
  right:19px;

  display:flex;
  align-items:center;
  justify-content:center;

  width:42px;
  height:42px;
  padding:0;

  color:var(--awareness-white);
  background:var(--awareness-navy-deep);

  border:1px solid rgba(255,255,255,.2);
  border-radius:50%;

  font-size:1.55rem;
  line-height:1;

  cursor:pointer;

  box-shadow:
    0 12px 28px rgba(4,21,42,.25);

  transition:
    transform .2s ease,
    background-color .2s ease;
}

.awareness-modal__close:hover{
  background:var(--awareness-purple);

  transform:rotate(90deg);
}

.awareness-modal .awareness-heading{
  margin-bottom:36px;
}

.awareness-modal .awareness-heading h2{
  padding-right:44px;
}


/* =====================================================
   GRIEF MODAL
===================================================== */

.grief-support .awareness-modal__body{
  border-top-color:var(--awareness-purple);
}

.grief-support__cards{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:17px;
}

.grief-support__cards article{
  padding:25px;

  background:
    linear-gradient(
      145deg,
      var(--awareness-purple-soft),
      #f8f5ff
    );

  border-left:5px solid var(--awareness-purple);
}

.grief-support__cards h3{
  margin:0 0 10px;

  color:var(--awareness-navy-deep);
  font-family:"Montserrat",Arial,sans-serif;
  font-size:1rem;
  line-height:1.35;
}

.grief-support__cards p{
  margin:0;

  color:var(--awareness-copy);
  font-size:.88rem;
  line-height:1.72;
}

.grief-support__actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;

  margin-top:30px;
}

.grief-support__actions a{
  display:inline-flex;
  align-items:center;
  justify-content:center;

  min-height:45px;
  padding:10px 19px;

  color:var(--awareness-white);
  background:var(--awareness-purple);

  border-radius:4px;

  font-size:.78rem;
  font-weight:900;
  text-decoration:none;
}


/* =====================================================
   WARNING SIGNS MODAL
===================================================== */

.warning-signs .awareness-modal__body{
  border-top-color:var(--awareness-teal);
}

.warning-signs__layout{
  display:grid;
  grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);
  gap:52px;
  align-items:start;
}

.warning-signs__heading{
  margin-bottom:0 !important;
}

.warning-signs__list{
  display:grid;
  gap:10px;

  margin:0;
  padding:0;

  list-style:none;
}

.warning-signs__list li{
  display:grid;
  grid-template-columns:12px 1fr;
  align-items:start;
  gap:13px;

  padding:15px 17px;

  color:var(--awareness-copy);

  background:
    linear-gradient(
      90deg,
      var(--awareness-teal-soft),
      #f7ffff
    );

  border-left:4px solid var(--awareness-teal);

  font-size:.88rem;
  line-height:1.55;
}

.warning-signs__list li span{
  width:8px;
  height:8px;
  margin-top:7px;

  background:var(--awareness-teal);
  border-radius:50%;

  box-shadow:
    0 0 0 4px rgba(24,181,187,.12);
}


/* =====================================================
   FIVE STEPS MODAL
===================================================== */

.help-steps .awareness-modal__body{
  border-top-color:var(--awareness-blue);
}

.help-steps__list{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:15px;

  margin:0;
  padding:0;

  list-style:none;
}

.help-step{
  display:grid;
  grid-template-columns:auto 1fr;
  gap:19px;

  padding:25px;

  background:
    linear-gradient(
      145deg,
      var(--awareness-mist),
      #ffffff
    );

  border-left:5px solid var(--awareness-blue);
}

.help-step:last-child{
  grid-column:1 / -1;
}

.help-step__number{
  margin:0;

  color:var(--awareness-blue);
  font-family:"Montserrat",Arial,sans-serif;
  font-size:.72rem;
  font-weight:900;

  letter-spacing:.1em;
}

.help-step h3{
  margin:0 0 8px;

  color:var(--awareness-navy-deep);
  font-family:"Montserrat",Arial,sans-serif;
  font-size:1rem;
}

.help-step div p{
  margin:0;

  color:var(--awareness-copy);
  font-size:.86rem;
  line-height:1.68;
}

.help-steps__source{
  margin-top:27px;
}

/* =====================================================
   SAFER HOME GUIDE MODAL
===================================================== */

.home-safety-guide{
  width:min(1160px,calc(100% - 36px));
  max-width:none;
  max-height:calc(100dvh - 34px);
  margin:auto;
  padding:0;

  color:var(--awareness-ink);
  background:transparent;

  border:0;
  border-radius:5px;

  overflow:hidden;

  box-shadow:
    0 42px 120px rgba(1,10,24,.56),
    0 0 0 1px rgba(255,255,255,.10);
}

.home-safety-guide[open]{
  display:block;

  animation:
    homeSafetyModalIn
    .28s ease both;
}

.home-safety-guide::backdrop{
  background:
    radial-gradient(
      circle at 16% 18%,
      rgba(242,182,93,.20),
      transparent 31%
    ),
    radial-gradient(
      circle at 86% 82%,
      rgba(105,72,201,.20),
      transparent 34%
    ),
    rgba(3,13,27,.90);

  backdrop-filter:blur(11px);
}

@keyframes homeSafetyModalIn{

  from{
    opacity:0;

    transform:
      translateY(24px)
      scale(.985);
  }

  to{
    opacity:1;

    transform:
      translateY(0)
      scale(1);
  }

}


/* =====================================================
   MODAL PANEL
===================================================== */

.home-safety-guide__panel{
  position:relative;
  overflow-x:hidden;
  overflow-y:auto;

  max-height:calc(100dvh - 34px);

  color:var(--awareness-ink);

  background:
    radial-gradient(
      circle at 94% 8%,
      rgba(242,182,93,.16),
      transparent 29%
    ),
    radial-gradient(
      circle at 5% 65%,
      rgba(24,181,187,.07),
      transparent 26%
    ),
    linear-gradient(
      180deg,
      #fffdf8,
      #fffaf1 52%,
      #f8eedb 100%
    );

  border:1px solid rgba(118,80,27,.22);
  border-top:6px solid var(--awareness-gold);
  border-radius:5px;

  overscroll-behavior:contain;

  scrollbar-color:
    var(--awareness-gold)
    rgba(118,80,27,.08);

  scrollbar-width:thin;
}

.home-safety-guide__panel::-webkit-scrollbar{
  width:10px;
}

.home-safety-guide__panel::-webkit-scrollbar-track{
  background:rgba(118,80,27,.07);
}

.home-safety-guide__panel::-webkit-scrollbar-thumb{
  background:
    linear-gradient(
      var(--awareness-gold),
      #d39a45
    );

  border:2px solid #fffaf1;
  border-radius:999px;
}


/* =====================================================
   CLOSE BUTTON
===================================================== */

.home-safety-guide .awareness-modal__close{
  position:absolute;
  z-index:50;
  top:18px;
  right:18px;

  display:flex;
  align-items:center;
  justify-content:center;

  width:46px;
  height:46px;
  padding:0;

  color:var(--awareness-white);
  background:var(--awareness-navy-deep);

  border:1px solid rgba(255,255,255,.25);
  border-radius:50%;

  box-shadow:
    0 14px 34px rgba(4,21,42,.28);

  transition:
    color .2s ease,
    background-color .2s ease,
    border-color .2s ease,
    transform .2s ease;
}

.home-safety-guide .awareness-modal__close:hover,
.home-safety-guide .awareness-modal__close:focus-visible{
  color:var(--awareness-navy-deep);
  background:var(--awareness-gold);
  border-color:var(--awareness-gold-soft);

  transform:rotate(90deg);
}


/* =====================================================
   INTRODUCTION
===================================================== */

.home-safety-guide__intro{
  position:relative;
  isolation:isolate;
  overflow:hidden;

  display:grid;
  grid-template-columns:minmax(0,1.35fr) minmax(280px,.65fr);
  align-items:center;
  gap:54px;

  min-height:440px;
  padding:
    74px
    clamp(32px,6vw,76px)
    60px;

  background:
    linear-gradient(
      90deg,
      rgba(255,253,248,.99) 0%,
      rgba(255,250,241,.98) 55%,
      rgba(255,247,230,.91) 100%
    ),
    url("/media/createsafety.png")
    right center / cover no-repeat;

  border-bottom:1px solid rgba(118,80,27,.18);
}

.home-safety-guide__intro::before{
  content:"";

  position:absolute;
  z-index:-1;
  top:0;
  bottom:0;
  left:0;

  width:6px;

  background:
    linear-gradient(
      180deg,
      var(--awareness-gold),
      #d89a3f
    );
}

.home-safety-guide__intro::after{
  content:"";

  position:absolute;
  z-index:-1;
  right:-125px;
  bottom:-170px;

  width:390px;
  height:390px;

  border:1px solid rgba(118,80,27,.12);
  border-radius:50%;

  box-shadow:
    inset 0 0 0 38px rgba(242,182,93,.035);

  pointer-events:none;
}

.home-safety-guide__intro-content{
  position:relative;
  z-index:2;
}

.home-safety-guide__intro
.awareness-kicker{
  margin-bottom:17px;

  color:#a36d1e;
}

.home-safety-guide__intro h2{
  max-width:720px;
  margin:0 0 24px;

  color:var(--awareness-navy-deep);

  font-family:"Cormorant Garamond",Georgia,serif;
  font-size:clamp(3.4rem,6vw,5.8rem);
  font-weight:700;
  line-height:.91;
  letter-spacing:-.045em;
}

.home-safety-guide__intro h2::after{
  content:"";

  display:block;

  width:82px;
  height:3px;
  margin-top:27px;

  background:
    linear-gradient(
      90deg,
      var(--awareness-gold),
      var(--awareness-teal),
      var(--awareness-blue)
    );
}

.home-safety-guide__lead{
  max-width:730px;
  margin:0;

  color:var(--awareness-copy);

  font-size:.98rem;
  line-height:1.82;
}


/* =====================================================
   CORE PRINCIPLE
===================================================== */

.home-safety-guide__principle{
  position:relative;

  display:grid;
  grid-template-columns:52px minmax(0,1fr);
  align-items:center;
  gap:17px;

  padding:27px 24px;

  background:
    linear-gradient(
      145deg,
      #fff4da,
      #fffaf0
    );

  border:1px solid rgba(163,109,30,.20);
  border-left:5px solid var(--awareness-gold);

  box-shadow:
    0 20px 44px rgba(79,52,13,.10);
}

.home-safety-guide__principle > span{
  display:grid;
  place-items:center;

  width:50px;
  height:50px;

  color:var(--awareness-white);
  background:
    linear-gradient(
      135deg,
      #c88627,
      var(--awareness-gold)
    );

  border-radius:50%;

  font-family:"Montserrat",Arial,sans-serif;
  font-size:1.3rem;
  font-weight:900;

  box-shadow:
    0 12px 26px rgba(118,80,27,.18);
}

.home-safety-guide__principle p{
  margin:0 0 5px;

  color:#966316;

  font-family:"Montserrat",Arial,sans-serif;
  font-size:.59rem;
  font-weight:900;
  line-height:1.3;
  letter-spacing:.15em;
  text-transform:uppercase;
}

.home-safety-guide__principle strong{
  display:block;

  color:var(--awareness-navy-deep);

  font-family:"Cormorant Garamond",Georgia,serif;
  font-size:1.45rem;
  line-height:1.15;
}


/* =====================================================
   SAFER HOME STEPS
===================================================== */

.home-safety-guide__steps{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:16px;

  margin:0;
  padding:
    64px
    clamp(32px,6vw,76px);

  list-style:none;
}

.home-safety-step{
  position:relative;
  isolation:isolate;
  overflow:hidden;

  display:grid;
  grid-template-columns:60px minmax(0,1fr);
  align-items:start;
  gap:21px;

  min-height:410px;
  padding:30px;

  background:
    linear-gradient(
      145deg,
      rgba(255,255,255,.96),
      rgba(255,248,235,.96)
    );

  border:1px solid rgba(118,80,27,.15);
  border-top:5px solid var(--awareness-gold);

  box-shadow:
    0 19px 43px rgba(79,52,13,.08);

  transition:
    transform .24s ease,
    border-color .24s ease,
    box-shadow .24s ease;
}

.home-safety-step--medications{
  border-top-color:#ce9140;
}

.home-safety-step--environment{
  border-top-color:var(--awareness-teal);
}

.home-safety-step--support{
  border-top-color:var(--awareness-blue);
}

.home-safety-step::after{
  content:"";

  position:absolute;
  z-index:-1;
  right:-80px;
  bottom:-100px;

  width:230px;
  height:230px;

  background:
    radial-gradient(
      circle,
      rgba(242,182,93,.13),
      transparent 68%
    );

  border:1px solid rgba(242,182,93,.10);
  border-radius:50%;

  pointer-events:none;
}

.home-safety-step--environment::after{
  background:
    radial-gradient(
      circle,
      rgba(24,181,187,.10),
      transparent 68%
    );
}

.home-safety-step--support::after{
  background:
    radial-gradient(
      circle,
      rgba(77,180,255,.10),
      transparent 68%
    );
}

.home-safety-step:hover{
  border-color:rgba(163,109,30,.32);

  transform:translateY(-4px);

  box-shadow:
    0 27px 55px rgba(79,52,13,.13);
}


/* =====================================================
   STEP NUMBER
===================================================== */

.home-safety-step__number{
  display:grid;
  place-items:center;

  width:58px;
  height:58px;

  color:var(--awareness-navy-deep);

  background:
    linear-gradient(
      135deg,
      #ffe9bb,
      var(--awareness-gold)
    );

  border:1px solid rgba(118,80,27,.20);
  border-radius:50%;

  font-family:"Montserrat",Arial,sans-serif;
  font-size:.68rem;
  font-weight:900;
  line-height:1;
  letter-spacing:.08em;

  box-shadow:
    0 13px 27px rgba(118,80,27,.14);
}

.home-safety-step--medications
.home-safety-step__number{
  background:
    linear-gradient(
      135deg,
      #fff1d4,
      #dda54f
    );
}

.home-safety-step--environment
.home-safety-step__number{
  color:var(--awareness-white);

  background:
    linear-gradient(
      135deg,
      var(--awareness-teal-dark),
      var(--awareness-teal)
    );

  border-color:rgba(24,181,187,.28);
}

.home-safety-step--support
.home-safety-step__number{
  color:var(--awareness-white);

  background:
    linear-gradient(
      135deg,
      var(--awareness-navy-light),
      var(--awareness-blue)
    );

  border-color:rgba(77,180,255,.28);
}


/* =====================================================
   STEP CONTENT
===================================================== */

.home-safety-step__label{
  margin:0 0 6px;

  color:#9b671d;

  font-family:"Montserrat",Arial,sans-serif;
  font-size:.61rem;
  font-weight:900;
  line-height:1.35;
  letter-spacing:.14em;
  text-transform:uppercase;
}

.home-safety-step--environment
.home-safety-step__label{
  color:var(--awareness-teal-dark);
}

.home-safety-step--support
.home-safety-step__label{
  color:var(--awareness-blue);
}

.home-safety-step__content h3{
  margin:0 0 20px;

  color:var(--awareness-navy-deep);

  font-family:"Cormorant Garamond",Georgia,serif;
  font-size:2rem;
  font-weight:700;
  line-height:1;
}

.home-safety-step__content ul{
  display:grid;
  gap:10px;

  margin:0;
  padding:0;

  list-style:none;
}

.home-safety-step__content li{
  position:relative;

  padding:
    11px
    12px
    11px
    34px;

  color:var(--awareness-copy);
  background:rgba(255,250,241,.72);

  border:1px solid rgba(118,80,27,.09);

  font-size:.78rem;
  line-height:1.55;
}

.home-safety-step__content li::before{
  content:"";

  position:absolute;
  top:18px;
  left:15px;

  width:7px;
  height:7px;

  background:var(--awareness-gold);
  border-radius:50%;

  box-shadow:
    0 0 0 4px rgba(242,182,93,.14);
}

.home-safety-step--environment
.home-safety-step__content li::before{
  background:var(--awareness-teal);

  box-shadow:
    0 0 0 4px rgba(24,181,187,.12);
}

.home-safety-step--support
.home-safety-step__content li::before{
  background:var(--awareness-blue);

  box-shadow:
    0 0 0 4px rgba(30,123,216,.12);
}


/* =====================================================
   ACTIVE CRISIS WARNING
===================================================== */

.home-safety-step__warning{
  margin-top:17px;
  padding:15px 17px;

  background:
    linear-gradient(
      135deg,
      #fff0e8,
      #fff7f0
    );

  border:1px solid rgba(175,82,56,.20);
  border-left:4px solid #b6533b;
}

.home-safety-step__warning strong{
  display:block;

  margin-bottom:5px;

  color:#8e3828;

  font-family:"Montserrat",Arial,sans-serif;
  font-size:.65rem;
  font-weight:900;
  line-height:1.4;
  letter-spacing:.05em;
  text-transform:uppercase;
}

.home-safety-step__warning p{
  margin:0;

  color:#70463e;

  font-size:.74rem;
  line-height:1.6;
}


/* =====================================================
   IMMEDIATE HELP
===================================================== */

.home-safety-guide__urgent{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(300px,.72fr);
  align-items:center;
  gap:44px;

  padding:
    52px
    clamp(32px,6vw,76px);

  color:var(--awareness-white);

  background:
    radial-gradient(
      circle at 92% 18%,
      rgba(242,182,93,.20),
      transparent 29%
    ),
    linear-gradient(
      110deg,
      var(--awareness-navy-deep),
      #0b365c 60%,
      #174f62
    );

  border-top:5px solid var(--awareness-gold);
}

.home-safety-guide__urgent-label{
  margin:0 0 9px;

  color:#ffe2a4;

  font-family:"Montserrat",Arial,sans-serif;
  font-size:.63rem;
  font-weight:900;
  line-height:1.4;
  letter-spacing:.16em;
  text-transform:uppercase;
}

.home-safety-guide__urgent h3{
  max-width:700px;
  margin:0 0 14px;

  color:var(--awareness-white);

  font-family:"Cormorant Garamond",Georgia,serif;
  font-size:clamp(2.25rem,4vw,3.5rem);
  font-weight:700;
  line-height:1;
}

.home-safety-guide__urgent > div:first-child > p:last-child{
  max-width:690px;
  margin:0;

  color:rgba(255,255,255,.72);

  font-size:.83rem;
  line-height:1.7;
}


/* =====================================================
   URGENT BUTTONS
===================================================== */

.home-safety-guide__urgent-actions{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:9px;
}

.home-safety-guide__urgent-actions a{
  position:relative;

  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:4px;

  min-width:0;
  min-height:74px;
  padding:13px 42px 13px 16px;

  color:var(--awareness-navy-deep);
  background:var(--awareness-cream);

  border:1px solid rgba(255,226,164,.58);
  border-left:5px solid var(--awareness-gold);
  border-radius:3px;

  text-decoration:none;

  box-shadow:
    0 13px 28px rgba(0,0,0,.18);

  transition:
    transform .2s ease,
    background-color .2s ease,
 ease,
    border-color .2s ease;
}

.home-safety-guide__urgent-actions a::after{
  content:"→";

  position:absolute;
  top:50%;
  right:16px;

  color:#a36d1e;

  font-size:1rem;
  font-weight:900;

  transform:translateY(-50%);

  transition:transform .2s ease;
}

.home-safety-guide__urgent-actions a span{
  display:block;

  color:var(--awareness-navy-deep) !important;

  font-family:"Montserrat",Arial,sans-serif;
  font-size:.78rem;
  font-weight:900;
  line-height:1.2;
}

.home-safety-guide__urgent-actions a small{
  display:block;

  color:var(--awareness-muted) !important;

  font-size:.62rem;
  font-weight:600;
  line-height:1.35;
}

.home-safety-guide__urgent-actions
.home-safety-guide__emergency{
  grid-column:1 / -1;

  color:var(--awareness-white);
  background:#91465a;

  border-color:#c47387;
  border-left-color:#ffb4c5;
}

.home-safety-guide__urgent-actions
.home-safety-guide__emergency span{
  color:var(--awareness-white) !important;
}

.home-safety-guide__urgent-actions
.home-safety-guide__emergency small{
  color:rgba(255,255,255,.70) !important;
}

.home-safety-guide__urgent-actions
.home-safety-guide__emergency::after{
  color:var(--awareness-white);
}

.home-safety-guide__urgent-actions a:hover{
  background:#fff2d5;

  transform:translateY(-3px);
}

.home-safety-guide__urgent-actions
.home-safety-guide__emergency:hover{
  background:#a95068;
}

.home-safety-guide__urgent-actions a:hover::after{
  transform:
    translate(4px,-50%);
}


/* =====================================================
   SOURCE
===================================================== */

.home-safety-guide__source{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:30px;

  padding:
    27px
    clamp(32px,6vw,76px);

  background:#f6ead3;

  border-top:1px solid rgba(118,80,27,.17);
}

.home-safety-guide__source > p{
  max-width:690px;
  margin:0;

  color:#6f6556;

  font-size:.7rem;
  line-height:1.6;
}

.home-safety-guide__source > div{
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-end;
  gap:8px;
}

.home-safety-guide__source a{
  display:inline-flex;
  align-items:center;
  gap:8px;

  min-height:39px;
  padding:8px 13px;

  color:var(--awareness-navy-deep);
  background:#fffaf1;

  border:1px solid rgba(118,80,27,.19);
  border-radius:3px;

  font-family:"Montserrat",Arial,sans-serif;
  font-size:.61rem;
  font-weight:900;
  text-decoration:none;

  transition:
    color .2s ease,
    background-color .2s ease,
    border-color .2s ease;
}

.home-safety-guide__source a::after{
  content:"→";

  color:#a36d1e;

  transition:transform .2s ease;
}

.home-safety-guide__source a:hover{
  color:var(--awareness-white);
  background:var(--awareness-navy-deep);
  border-color:var(--awareness-navy-deep);
}

.home-safety-guide__source a:hover::after{
  color:var(--awareness-gold);

  transform:translateX(4px);
}


/* =====================================================
   TABLET
===================================================== */

@media(max-width:960px){

  .home-safety-guide__intro{
    grid-template-columns:1fr;
    gap:34px;
  }

  .home-safety-guide__principle{
    max-width:650px;
  }

  .home-safety-guide__steps{
    grid-template-columns:1fr;
  }

  .home-safety-step{
    min-height:0;
  }

  .home-safety-guide__urgent{
    grid-template-columns:1fr;
    gap:28px;
  }

  .home-safety-guide__urgent-actions{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }

  .home-safety-guide__urgent-actions
  .home-safety-guide__emergency{
    grid-column:auto;
  }

  .home-safety-guide__source{
    grid-template-columns:1fr;
  }

  .home-safety-guide__source > div{
    justify-content:flex-start;
  }

}


/* =====================================================
   MOBILE
===================================================== */

@media(max-width:640px){

  .home-safety-guide{
    width:calc(100% - 14px);
    max-height:calc(100dvh - 14px);
  }

  .home-safety-guide__panel{
    max-height:calc(100dvh - 14px);
  }

  .home-safety-guide
  .awareness-modal__close{
    top:11px;
    right:11px;

    width:42px;
    height:42px;
  }

  .home-safety-guide__intro{
    min-height:0;
    padding:
      72px
      22px
      43px;

    background:
      linear-gradient(
        rgba(255,253,248,.96),
        rgba(255,250,241,.94)
      ),
      url("/media/createsafety.png")
      center / cover no-repeat;
  }

  .home-safety-guide__intro::before{
    width:4px;
  }

  .home-safety-guide__intro h2{
    font-size:
      clamp(
        3rem,
        14vw,
        4.4rem
      );
  }

  .home-safety-guide__lead{
    font-size:.9rem;
  }

  .home-safety-guide__principle{
    grid-template-columns:45px minmax(0,1fr);
    padding:22px 18px;
  }

  .home-safety-guide__principle > span{
    width:43px;
    height:43px;
  }

  .home-safety-guide__principle strong{
    font-size:1.25rem;
  }

  .home-safety-guide__steps{
    gap:13px;

    padding:
      44px
      22px;
  }

  .home-safety-step{
    grid-template-columns:1fr;
    gap:17px;

    padding:23px 20px;
  }

  .home-safety-step__number{
    width:50px;
    height:50px;
  }

  .home-safety-step__content h3{
    font-size:1.75rem;
  }

  .home-safety-step__content li{
    font-size:.75rem;
  }

  .home-safety-guide__urgent{
    padding:
      43px
      22px;
  }

  .home-safety-guide__urgent h3{
    font-size:
      clamp(
        2.25rem,
        11vw,
        3rem
      );
  }

  .home-safety-guide__urgent-actions{
    grid-template-columns:1fr;
  }

  .home-safety-guide__urgent-actions
  .home-safety-guide__emergency{
    grid-column:auto;
  }

  .home-safety-guide__source{
    padding:
      24px
      22px;
  }

  .home-safety-guide__source > div{
    display:grid;
    grid-template-columns:1fr;
  }

  .home-safety-guide__source a{
    justify-content:space-between;
  }

}


/* =====================================================
   REDUCED MOTION
===================================================== */

@media(prefers-reduced-motion:reduce){

  .home-safety-guide[open]{
    animation:none;
  }

  .home-safety-guide .awareness-modal__close,
  .home-safety-step,
  .home-safety-guide__urgent-actions a,
  .home-safety-guide__urgent-actions a::after,
  .home-safety-guide__source a,
  .home-safety-guide__source a::after{
    transition:none;
  }

}


/* =====================================================
   VETERANS SUPPORT MODAL
===================================================== */

.veterans-support{
  width:min(1120px,calc(100% - 36px));
  max-width:none;
  max-height:calc(100dvh - 34px);
  margin:auto;
  padding:0;

  color:var(--awareness-white);
  background:transparent;

  border:0;
  border-radius:5px;

  overflow:hidden;

  box-shadow:
    0 42px 120px rgba(1,10,24,.62),
    0 0 0 1px rgba(255,255,255,.08);
}

.veterans-support[open]{
  display:block;

  animation:
    veteransModalIn
    .28s ease both;
}

.veterans-support::backdrop{
  background:
    radial-gradient(
      circle at 15% 85%,
      rgba(73,65,159,.28),
      transparent 34%
    ),
    radial-gradient(
      circle at 88% 15%,
      rgba(26,116,155,.22),
      transparent 32%
    ),
    rgba(2,10,23,.92);

  backdrop-filter:blur(11px);
}

@keyframes veteransModalIn{

  from{
    opacity:0;

    transform:
      translateY(24px)
      scale(.985);
  }

  to{
    opacity:1;

    transform:
      translateY(0)
      scale(1);
  }

}


/* =====================================================
   CLOSE BUTTON
===================================================== */

.veterans-support .awareness-modal__close{
  position:absolute;
  z-index:50;
  top:18px;
  right:18px;

  display:flex;
  align-items:center;
  justify-content:center;

  width:46px;
  height:46px;
  padding:0;

  color:var(--awareness-white);
  background:rgba(4,21,42,.82);

  border:1px solid rgba(255,255,255,.34);
  border-radius:50%;

  box-shadow:
    0 14px 34px rgba(0,0,0,.32);

  backdrop-filter:blur(12px);

  transition:
    color .2s ease,
    background-color .2s ease,
    border-color .2s ease,
    transform .2s ease;
}

.veterans-support .awareness-modal__close:hover,
.veterans-support .awareness-modal__close:focus-visible{
  color:var(--awareness-navy-deep);
  background:#8be7eb;
  border-color:#8be7eb;

  transform:rotate(90deg);
}


/* =====================================================
   MAIN PANEL
===================================================== */

.veterans-support__panel{
  position:relative;
  isolation:isolate;
  overflow-x:hidden;
  overflow-y:auto;

  display:grid;
  grid-template-columns:
    minmax(260px,.72fr)
    minmax(0,1.28fr);

  max-height:calc(100dvh - 34px);

  color:var(--awareness-white);

  background:
    linear-gradient(
      90deg,
      rgba(3,19,38,.99) 0%,
      rgba(5,35,67,.97) 35%,
      rgba(7,52,86,.91) 66%,
      rgba(13,66,92,.74) 100%
    ),
    linear-gradient(
      180deg,
      rgba(4,21,42,.12),
      rgba(4,21,42,.68)
    ),
    url("/media/veteransupport.png")
    center center / cover no-repeat;

  border:1px solid rgba(125,197,255,.30);
  border-top:6px solid #6f59df;
  border-radius:5px;

  overscroll-behavior:contain;

  scrollbar-color:
    #6f59df
    rgba(255,255,255,.08);

  scrollbar-width:thin;
}

.veterans-support__panel::before{
  content:"";

  position:absolute;
  z-index:-1;
  inset:0;

  background:
    radial-gradient(
      circle at 83% 14%,
      rgba(77,180,255,.18),
      transparent 30%
    ),
    radial-gradient(
      circle at 13% 82%,
      rgba(111,89,223,.20),
      transparent 31%
    );

  pointer-events:none;
}

.veterans-support__panel::after{
  content:"";

  position:absolute;
  z-index:5;
  top:0;
  right:0;
  left:0;

  height:4px;

  background:
    linear-gradient(
      90deg,
      #6f59df,
      var(--awareness-blue-bright),
      var(--awareness-teal)
    );

  pointer-events:none;
}


/* =====================================================
   22 A DAY STATEMENT
===================================================== */

.veterans-support__stat{
  position:relative;
  overflow:hidden;

  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:center;

  min-height:465px;
  padding:
    74px
    clamp(28px,4vw,52px)
    52px;

  background:
    linear-gradient(
      165deg,
      rgba(5,27,54,.92),
      rgba(33,35,92,.82)
    );

  border-right:1px solid rgba(255,255,255,.15);
}

.veterans-support__stat::before{
  content:"";

  position:absolute;
  top:54px;
  left:clamp(28px,4vw,52px);

  width:62px;
  height:3px;

  background:
    linear-gradient(
      90deg,
      var(--awareness-teal),
      var(--awareness-blue-bright)
    );
}

.veterans-support__stat::after{
  content:"";

  position:absolute;
  right:-100px;
  bottom:-120px;

  width:290px;
  height:290px;

  border:1px solid rgba(139,231,235,.16);
  border-radius:50%;

  box-shadow:
    inset 0 0 0 28px rgba(255,255,255,.018);

  pointer-events:none;
}

.veterans-support__stat-number{
  position:relative;
  z-index:2;

  margin:0;

  color:var(--awareness-white);

  font-family:"Montserrat",Arial,sans-serif;
  font-size:clamp(7rem,13vw,11rem);
  font-weight:900;
  line-height:.75;
  letter-spacing:-.09em;

  text-shadow:
    0 18px 42px rgba(0,0,0,.32);
}

.veterans-support__stat-label{
  position:relative;
  z-index:2;

  margin:28px 0 7px;

  color:#8be7eb;

  font-family:"Montserrat",Arial,sans-serif;
  font-size:.9rem;
  font-weight:900;
  line-height:1.2;
  letter-spacing:.14em;
  text-transform:uppercase;
}

.veterans-support__stat-context{
  position:relative;
  z-index:2;

  max-width:260px;
  margin:0;

  color:rgba(255,255,255,.66);

  font-size:.75rem;
  line-height:1.55;
}


/* =====================================================
   VETERAN MESSAGE
===================================================== */

.veterans-support__content{
  display:flex;
  flex-direction:column;
  justify-content:center;

  min-height:465px;
  padding:
    76px
    clamp(40px,6vw,76px)
    48px;
}

.veterans-support
.veterans-support__content
.awareness-kicker{
  margin:0 0 16px;

  color:#8be7eb;
}

.awareness-page
.veterans-support
.veterans-support__content h2{
  max-width:680px;
  margin:0 0 24px;

  color:var(--awareness-white);

  font-family:"Cormorant Garamond",Georgia,serif;
  font-size:clamp(3.2rem,5.5vw,5.4rem);
  font-weight:700;
  line-height:.91;
  letter-spacing:-.045em;

  text-shadow:
    0 15px 38px rgba(0,0,0,.26);
}

.awareness-page
.veterans-support
.veterans-support__content h2::after{
  content:"";

  display:block;

  width:78px;
  height:3px;
  margin-top:25px;

  background:
    linear-gradient(
      90deg,
      var(--awareness-teal),
      var(--awareness-blue-bright),
      #8d72ee
    );
}

.veterans-support__lead{
  max-width:720px;
  margin:0 0 16px;

  color:rgba(255,255,255,.88);

  font-size:.98rem;
  font-weight:600;
  line-height:1.75;
}

.veterans-support__message{
  max-width:720px;
  margin:0 0 16px;

  color:rgba(255,255,255,.72);

  font-size:.88rem;
  line-height:1.72;
}

.veterans-support__eligibility{
  max-width:720px;
  margin:4px 0 0;
  padding:15px 17px;

  color:rgba(255,255,255,.78);
  background:rgba(255,255,255,.07);

  border:1px solid rgba(139,231,235,.20);
  border-left:4px solid var(--awareness-teal);

  font-size:.78rem;
  line-height:1.62;

  backdrop-filter:blur(9px);
}


/* =====================================================
   CRISIS ACTIONS
===================================================== */

.veterans-support__actions{
  grid-column:1 / -1;

  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;

  padding:
    26px
    clamp(28px,5vw,58px);

  background:rgba(2,15,31,.78);

  border-top:1px solid rgba(255,255,255,.16);
  border-bottom:1px solid rgba(255,255,255,.13);

  backdrop-filter:blur(13px);
}

.veterans-support__action{
  position:relative;
  overflow:hidden;

  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:center;
  gap:5px;

  min-width:0;
  min-height:76px;
  padding:14px 48px 14px 18px;

  color:var(--awareness-white) !important;

  border:1px solid rgba(255,255,255,.30);
  border-radius:4px;

  text-decoration:none;

  box-shadow:
    0 12px 28px rgba(0,0,0,.18),
    inset 0 1px 0 rgba(255,255,255,.12);

  transition:
    transform .2s ease,
    filter .2s ease,
    border-color .2s ease,
    box-shadow .2s ease;
}

.veterans-support__action::after{
  content:"→";

  position:absolute;
  top:50%;
  right:18px;

  color:inherit;

  font-size:1.18rem;
  font-weight:900;

  opacity:.74;

  transform:translateY(-50%);

  transition:
    transform .2s ease,
    opacity .2s ease;
}

.veterans-support__action span{
  display:block;

  color:inherit !important;

  font-family:"Montserrat",Arial,sans-serif;
  font-size:.82rem;
  font-weight:900;
  line-height:1.2;
}

.veterans-support__action small{
  display:block;

  color:inherit !important;

  font-size:.65rem;
  font-weight:600;
  line-height:1.35;

  opacity:.72;
}


/* CALL */

.veterans-support__action--call{
  background:
    linear-gradient(
      135deg,
      #087f88,
      #18aeb5
    );

  border-color:rgba(139,231,235,.54);
}


/* TEXT */

.veterans-support__action--text{
  background:
    linear-gradient(
      135deg,
      #155d9c,
      #287fd1
    );

  border-color:rgba(185,228,255,.52);
}


/* CHAT */

.veterans-support__action--chat{
  background:
    linear-gradient(
      135deg,
      #5543a7,
      #775ed8
    );

  border-color:rgba(208,192,255,.52);
}


/* ACTION HOVER */

.veterans-support__action:hover{
  color:var(--awareness-white) !important;

  filter:brightness(1.1);

  transform:translateY(-3px);

  box-shadow:
    0 18px 36px rgba(0,0,0,.25),
    inset 0 1px 0 rgba(255,255,255,.16);
}

.veterans-support__action:hover::after{
  opacity:1;

  transform:
    translate(4px,-50%);
}

.veterans-support__action:focus-visible{
  outline:3px solid var(--awareness-gold);
  outline-offset:3px;
}

/* =====================================================
   VETERAN SUPPORT RESOURCES
===================================================== */

.veterans-support__resources{
  grid-column:1 / -1;

  padding:
    42px
    clamp(28px,5vw,58px)
    46px;

  background:
    radial-gradient(
      circle at 90% 10%,
      rgba(111,89,223,.14),
      transparent 28%
    ),
    linear-gradient(
      135deg,
      rgba(4,24,47,.97),
      rgba(6,42,72,.95)
    );

  border-bottom:1px solid rgba(255,255,255,.13);
}


/* =====================================================
   RESOURCE HEADING
===================================================== */

.veterans-support__resources-heading{
  display:flex;
  align-items:end;
  justify-content:space-between;
  gap:30px;

  margin-bottom:25px;
}

.veterans-support__resources-heading > p{
  margin:0;

  color:#8be7eb;

  font-family:"Montserrat",Arial,sans-serif;
  font-size:.63rem;
  font-weight:900;
  line-height:1.4;
  letter-spacing:.16em;
  text-transform:uppercase;
}

.veterans-support__resources-heading h3{
  max-width:580px;
  margin:0;

  color:var(--awareness-white);

  font-family:"Cormorant Garamond",Georgia,serif;
  font-size:clamp(2rem,3.5vw,3rem);
  font-weight:700;
  line-height:1;
  letter-spacing:-.025em;
  text-align:right;
}


/* =====================================================
   RESOURCE GRID
===================================================== */

.veterans-support__resource-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:10px;
}


/* =====================================================
   RESOURCE CARD
===================================================== */

.veterans-support__resource{
  position:relative;
  overflow:hidden;

  display:grid;
  grid-template-columns:36px minmax(0,1fr);
  align-items:start;
  gap:12px;

  min-width:0;
  min-height:205px;
  padding:20px 17px;

  color:var(--awareness-white) !important;
  background:rgba(255,255,255,.055);

  border:1px solid rgba(255,255,255,.16);
  border-top:4px solid var(--awareness-teal);
  border-radius:3px;

  text-decoration:none;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.05);

  transition:
    background-color .22s ease,
    border-color .22s ease,
    transform .22s ease,
    box-shadow .22s ease;
}

.veterans-support__resource:nth-child(2){
  border-top-color:var(--awareness-blue-bright);
}

.veterans-support__resource:nth-child(3){
  border-top-color:var(--awareness-purple-light);
}

.veterans-support__resource:nth-child(4){
  border-top-color:var(--awareness-gold);
}


/* DECORATIVE GLOW */

.veterans-support__resource::before{
  content:"";

  position:absolute;
  right:-60px;
  bottom:-70px;

  width:150px;
  height:150px;

  background:
    radial-gradient(
      circle,
      rgba(24,181,187,.14),
      transparent 68%
    );

  border-radius:50%;

  pointer-events:none;
}

.veterans-support__resource:nth-child(2)::before{
  background:
    radial-gradient(
      circle,
      rgba(77,180,255,.15),
      transparent 68%
    );
}

.veterans-support__resource:nth-child(3)::before{
  background:
    radial-gradient(
      circle,
      rgba(154,117,229,.16),
      transparent 68%
    );
}

.veterans-support__resource:nth-child(4)::before{
  background:
    radial-gradient(
      circle,
      rgba(242,182,93,.16),
      transparent 68%
    );
}


/* =====================================================
   RESOURCE NUMBER
===================================================== */

.veterans-support__resource-number{
  display:grid;
  place-items:center;

  width:34px;
  height:34px;

  color:#8be7eb !important;
  background:rgba(139,231,235,.08);

  border:1px solid rgba(139,231,235,.30);
  border-radius:50%;

  font-family:"Montserrat",Arial,sans-serif;
  font-size:.57rem;
  font-weight:900;
  line-height:1;
  letter-spacing:.06em;
}

.veterans-support__resource:nth-child(2)
.veterans-support__resource-number{
  color:#b9e4ff !important;
  background:rgba(77,180,255,.09);
  border-color:rgba(185,228,255,.30);
}

.veterans-support__resource:nth-child(3)
.veterans-support__resource-number{
  color:#d0c0ff !important;
  background:rgba(154,117,229,.10);
  border-color:rgba(208,192,255,.30);
}

.veterans-support__resource:nth-child(4)
.veterans-support__resource-number{
  color:#ffe2a4 !important;
  background:rgba(242,182,93,.10);
  border-color:rgba(255,226,164,.30);
}


/* =====================================================
   RESOURCE CONTENT
===================================================== */

.veterans-support__resource-content{
  position:relative;
  z-index:2;

  display:flex;
  flex-direction:column;

  min-width:0;
  min-height:160px;
}

.veterans-support__resource-content strong{
  display:block;

  color:var(--awareness-white) !important;

  font-family:"Montserrat",Arial,sans-serif;
  font-size:.78rem;
  font-weight:900;
  line-height:1.35;
}

.veterans-support__resource-content small{
  display:block;

  margin-top:10px;

  color:rgba(255,255,255,.62) !important;

  font-size:.68rem;
  font-weight:500;
  line-height:1.55;
}


/* =====================================================
   RESOURCE ACTION
===================================================== */

.veterans-support__resource-action{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;

  margin-top:auto;
  padding-top:15px;

  color:#8be7eb !important;

  border-top:1px solid rgba(255,255,255,.11);

  font-family:"Montserrat",Arial,sans-serif;
  font-size:.6rem;
  font-weight:900;
  line-height:1.35;
  letter-spacing:.02em;
}

.veterans-support__resource-action::after{
  content:"→";

  flex:0 0 auto;

  color:inherit;

  font-size:.85rem;

  transition:
    transform .2s ease;
}

.veterans-support__resource:nth-child(2)
.veterans-support__resource-action{
  color:#b9e4ff !important;
}

.veterans-support__resource:nth-child(3)
.veterans-support__resource-action{
  color:#d0c0ff !important;
}

.veterans-support__resource:nth-child(4)
.veterans-support__resource-action{
  color:#ffe2a4 !important;
}


/* =====================================================
   RESOURCE HOVER AND FOCUS
===================================================== */

.veterans-support__resource:hover{
  color:var(--awareness-white) !important;
  background:rgba(255,255,255,.10);

  border-color:rgba(139,231,235,.42);

  transform:translateY(-4px);

  box-shadow:
    0 19px 38px rgba(0,0,0,.22),
    inset 0 1px 0 rgba(255,255,255,.08);
}

.veterans-support__resource:nth-child(2):hover{
  border-color:rgba(185,228,255,.44);
}

.veterans-support__resource:nth-child(3):hover{
  border-color:rgba(208,192,255,.44);
}

.veterans-support__resource:nth-child(4):hover{
  border-color:rgba(255,226,164,.44);
}

.veterans-support__resource:hover
.veterans-support__resource-action::after{
  transform:translateX(4px);
}

.veterans-support__resource:focus-visible{
  outline:3px solid var(--awareness-gold);
  outline-offset:3px;
}


/* =====================================================
   RESOURCE TABLET
===================================================== */

@media(max-width:960px){

  .veterans-support__resource-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .veterans-support__resource{
    min-height:185px;
  }

  .veterans-support__resource-content{
    min-height:140px;
  }

}


/* =====================================================
   RESOURCE MOBILE
===================================================== */

@media(max-width:640px){

  .veterans-support__resources{
    padding:
      38px
      22px
      41px;
  }

  .veterans-support__resources-heading{
    align-items:flex-start;
    flex-direction:column;
    gap:9px;

    margin-bottom:22px;
  }

  .veterans-support__resources-heading h3{
    font-size:2.35rem;
    text-align:left;
  }

  .veterans-support__resource-grid{
    grid-template-columns:1fr;
  }

  .veterans-support__resource{
    min-height:0;
  }

  .veterans-support__resource-content{
    min-height:145px;
  }

}


/* =====================================================
   REDUCED MOTION
===================================================== */

@media(prefers-reduced-motion:reduce){

  .veterans-support__resource,
  .veterans-support__resource-action::after{
    transition:none;
  }

}


/* =====================================================
   DATA NOTE
===================================================== */

.veterans-support__source{
  grid-column:1 / -1;

  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:28px;

  padding:
    20px
    clamp(28px,5vw,58px);

  background:rgba(2,12,26,.94);
}

.veterans-support__source p{
  max-width:690px;
  margin:0;

  color:rgba(255,255,255,.55);

  font-size:.67rem;
  line-height:1.55;
}

.veterans-support__source a{
  display:inline-flex;
  align-items:center;
  gap:9px;

  flex:0 0 auto;

  color:#8be7eb;

  font-family:"Montserrat",Arial,sans-serif;
  font-size:.64rem;
  font-weight:900;
  letter-spacing:.02em;
  text-decoration:none;
}

.veterans-support__source a::after{
  content:"→";

  transition:transform .2s ease;
}

.veterans-support__source a:hover::after{
  transform:translateX(4px);
}


/* =====================================================
   TABLET
===================================================== */

@media(max-width:900px){

  .veterans-support__panel{
    grid-template-columns:230px minmax(0,1fr);
  }

  .veterans-support__stat{
    min-height:500px;
    padding-right:30px;
    padding-left:30px;
  }

  .veterans-support__stat::before{
    left:30px;
  }

  .veterans-support__content{
    min-height:500px;
    padding-right:40px;
    padding-left:40px;
  }

  .awareness-page
  .veterans-support
  .veterans-support__content h2{
    font-size:clamp(3rem,7vw,4.6rem);
  }

}


/* =====================================================
   SMALL TABLET
===================================================== */

@media(max-width:720px){

  .veterans-support__panel{
    grid-template-columns:1fr;

    background:
      linear-gradient(
        180deg,
        rgba(3,19,38,.98),
        rgba(7,52,86,.94)
      ),
      url("/media/veteransupport.png")
      center / cover no-repeat;
  }

  .veterans-support__stat{
    min-height:auto;
    padding:
      70px
      28px
      35px;

    border-right:0;
    border-bottom:1px solid rgba(255,255,255,.15);
  }

  .veterans-support__stat::before{
    top:45px;
    left:28px;
  }

  .veterans-support__stat-number{
    font-size:7.5rem;
  }

  .veterans-support__stat > div{
    max-width:420px;
  }

  .veterans-support__content{
    min-height:auto;
    padding:
      44px
      28px;
  }

  .veterans-support__actions{
    grid-template-columns:1fr;
    padding:
      24px
      28px;
  }

  .veterans-support__source{
    align-items:flex-start;
    flex-direction:column;
    gap:14px;

    padding:
      21px
      28px;
  }

}


/* =====================================================
   MOBILE
===================================================== */

@media(max-width:640px){

  .veterans-support{
    width:calc(100% - 14px);
    max-height:calc(100dvh - 14px);
  }

  .veterans-support__panel{
    max-height:calc(100dvh - 14px);
  }

  .veterans-support
  .awareness-modal__close{
    top:11px;
    right:11px;

    width:42px;
    height:42px;
  }

  .veterans-support__stat{
    padding:
      67px
      22px
      32px;
  }

  .veterans-support__stat::before{
    top:42px;
    left:22px;
  }

  .veterans-support__stat-number{
    font-size:6.8rem;
  }

  .veterans-support__stat-label{
    margin-top:22px;

    font-size:.77rem;
  }

  .veterans-support__content{
    padding:
      40px
      22px;
  }

  .awareness-page
  .veterans-support
  .veterans-support__content h2{
    font-size:
      clamp(
        3rem,
        14vw,
        4.2rem
      );
  }

  .veterans-support__lead{
    font-size:.91rem;
  }

  .veterans-support__message{
    font-size:.82rem;
  }

  .veterans-support__eligibility{
    font-size:.74rem;
  }

  .veterans-support__actions{
    padding:
      22px;
  }

  .veterans-support__action{
    min-height:73px;
  }

  .veterans-support__source{
    padding:
      20px
      22px;
  }

}


/* =====================================================
   NARROW MOBILE
===================================================== */

@media(max-width:390px){

  .veterans-support__stat-number{
    font-size:6rem;
  }

  .awareness-page
  .veterans-support
  .veterans-support__content h2{
    font-size:2.85rem;
  }

}


/* =====================================================
   REDUCED MOTION
===================================================== */

@media(prefers-reduced-motion:reduce){

  .veterans-support[open]{
    animation:none;
  }

  .veterans-support .awareness-modal__close,
  .veterans-support__action,
  .veterans-support__action::after,
  .veterans-support__source a::after{
    transition:none;
  }

}


/* =====================================================
   RESOURCE MODAL
===================================================== */

.resource-section .awareness-modal__body{
  border-top-color:var(--awareness-blue-bright);
}

.resource-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:17px;
}

.resource-card{
  display:flex;
  flex-direction:column;

  min-height:260px;
  padding:28px;

  background:
    linear-gradient(
      145deg,
      var(--awareness-mist),
      #ffffff
    );

  border:1px solid var(--awareness-line);
  border-top:5px solid var(--awareness-blue);
}

.resource-card--featured{
  color:var(--awareness-white);

  background:
    radial-gradient(
      circle at 90% 10%,
      rgba(77,180,255,.3),
      transparent 32%
    ),
    linear-gradient(
      145deg,
      var(--awareness-blue),
      var(--awareness-navy)
    );

  border-color:transparent;
  border-top-color:var(--awareness-teal);
}

.resource-card--veterans{
  background:
    linear-gradient(
      145deg,
      var(--awareness-purple-soft),
      #faf8ff
    );

  border-top-color:var(--awareness-purple);
}

.resource-card__type{
  margin:0 0 20px;

  color:var(--awareness-blue);
  font-family:"Montserrat",Arial,sans-serif;
  font-size:.66rem;
  font-weight:900;

  letter-spacing:.13em;
  text-transform:uppercase;
}

.resource-card--featured .resource-card__type{
  color:#a9eef1;
}

.resource-card--veterans .resource-card__type{
  color:var(--awareness-purple);
}

.resource-card h3{
  margin:0 0 14px;

  color:var(--awareness-navy-deep);
  font-family:"Montserrat",Arial,sans-serif;
  font-size:1.16rem;
  line-height:1.35;
}

.resource-card--featured h3{
  color:var(--awareness-white);
}

.resource-card > p:not(.resource-card__type){
  margin:0 0 23px;

  color:var(--awareness-copy);
  font-size:.88rem;
  line-height:1.72;
}

.resource-card--featured > p:not(.resource-card__type){
  color:rgba(255,255,255,.76);
}

.resource-card__actions{
  display:flex;
  flex-wrap:wrap;
  gap:8px;

  margin-top:auto;
}

.resource-card__actions a{
  padding:8px 13px;

  color:var(--awareness-white);
  background:rgba(255,255,255,.1);

  border:1px solid rgba(255,255,255,.3);
  border-radius:4px;

  font-size:.72rem;
  font-weight:900;
  text-decoration:none;
}

.resource-card__link{
  width:max-content;
  max-width:100%;
  margin-top:auto;

  color:var(--awareness-blue);
  font-size:.8rem;
  font-weight:900;
  text-underline-offset:4px;
}

.resource-section__international{
  margin:25px 0 0;

  color:var(--awareness-muted);
  font-size:.78rem;
  text-align:center;
}


/* =====================================================
   ANIMATIONS
===================================================== */

@keyframes awarenessPulse{
  0%{
    opacity:.9;
    transform:scale(.7);
  }

  80%,
  100%{
    opacity:0;
    transform:scale(1.8);
  }
}

@keyframes awarenessFloat{
  0%,
  100%{
    transform:translate3d(0,0,0);
  }

  50%{
    transform:translate3d(0,22px,0);
  }
}

@keyframes awarenessModalIn{
  from{
    opacity:0;
    transform:translateY(20px) scale(.985);
  }

  to{
    opacity:1;
    transform:translateY(0) scale(1);
  }
}


/* =====================================================
   LARGE TABLET
===================================================== */

@media (max-width:1150px){

  .awareness-hero__inner{
    grid-template-columns:1fr;
    gap:60px;
  }

  .awareness-hero__content{
    max-width:900px;
  }

  .awareness-hero__visual{
    max-width:570px;
  }

  .walk-section__inner{
    grid-template-columns:1fr;
    gap:55px;
  }

  .walk-section__visual{
    width:min(760px,100%);
  }

  .awareness-topic-grid{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }

  .awareness-topic-card:last-child{
    grid-column:2;
  }

}


/* =====================================================
   TABLET
===================================================== */

@media (max-width:880px){

  .awareness-shell{
    width:calc(100% - 36px);
  }

  .crisis-banner__inner{
    align-items:flex-start;
    flex-direction:column;
    gap:15px;

    width:calc(100% - 36px);
    padding-block:18px;
  }

  .crisis-banner__actions{
    width:100%;
  }

  .memorial-grid,
  .support-paths__grid,
  .awareness-care-grid__inner{
    grid-template-columns:1fr;
  }

  .memorial-card__identity{
    grid-template-columns:112px 1fr;
  }

  .memorial-card__portrait{
    width:112px;
  }

  .walk-section__visual{
    min-height:610px;
  }

  .support-card{
    min-height:auto;
  }

  .awareness-topic-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .awareness-topic-card:last-child{
    grid-column:1 / -1;
  }

  .awareness-closing{
    grid-column:auto;
  }

  .awareness-closing__inner{
    align-items:flex-start;
    flex-direction:column;
    gap:12px;
  }

  .awareness-closing__review{
    text-align:left;
  }

  .warning-signs__layout,
  .means-safety__layout{
    grid-template-columns:1fr;
  }

  .grief-support__cards,
  .resource-grid{
    grid-template-columns:1fr;
  }

  .help-steps__list{
    grid-template-columns:1fr;
  }

  .help-step:last-child{
    grid-column:auto;
  }

}


/* =====================================================
   MOBILE
===================================================== */

@media (max-width:640px){

  .awareness-shell{
    width:calc(100% - 28px);
  }

  .awareness-page{
    font-size:15px;
  }

  .awareness-heading{
    margin-bottom:38px;
  }

  .awareness-heading--centered{
    text-align:left;
  }

  .awareness-heading--centered > p:last-child{
    margin-left:0;
  }

  .crisis-banner__message{
    align-items:flex-start;
  }

  .crisis-banner__actions{
    display:grid;
    grid-template-columns:repeat(2,1fr);
  }

  .crisis-banner__link{
    grid-column:1 / -1;
    text-align:center;
  }

  .awareness-hero{
    min-height:auto;
  }

  .awareness-hero::after{
    bottom:-112px;
  }

  .awareness-hero__inner{
    min-height:auto;
    padding:66px 0 135px;
  }

  .awareness-hero__content h1{
    font-size:clamp(2.8rem,14vw,4.3rem);
  }

  .awareness-hero__actions{
    align-items:stretch;
    flex-direction:column;
  }

  .awareness-button{
    width:100%;
  }

  .awareness-hero__visual{
    max-width:570px;
    padding:30px 24px 27px;
  }

  .memorial-section{
    padding:120px 0 175px;
  }

  .memorial-card{
    padding:0 24px 30px;
  }

  .memorial-card__topline{
    margin:0 -24px 28px;
    padding:18px 24px;
  }

  .memorial-card__identity{
    grid-template-columns:1fr;
  }

  .memorial-card__portrait{
    width:100%;
    max-width:250px;
    aspect-ratio:4 / 5;
  }

  .walk-section{
    padding:150px 0 190px;
  }

  .walk-section__visual{
    display:grid;
    gap:18px;
    min-height:0;
  }

  .walk-section__photo{
    position:relative;
    width:100%;
    max-width:430px;

    transform:none;
  }

  .walk-card{
    position:relative;
    right:auto;
    bottom:auto;

    width:100%;
    max-width:430px;
  }

  .walk-card__day{
    font-size:4.4rem;
  }

  .walk-card__details div{
    grid-template-columns:1fr;
    gap:3px;
  }

  .walk-section__actions{
    align-items:stretch;
    flex-direction:column;
  }

  .support-paths{
    padding:135px 0 170px;
  }

  .support-card{
    padding:30px 25px;
  }

  .awareness-topic-grid{
    grid-template-columns:1fr;
  }

  .awareness-topic-card,
  .awareness-topic-card:last-child{
    grid-column:auto;
  }

  .awareness-topic-card{
    min-height:225px;
  }

  .awareness-care-grid{
    padding:140px 0 80px;
  }

  .faith-care__inner{
    grid-template-columns:1fr;
    padding:32px 25px;
  }

  .church-support__inner{
    padding:32px 25px;
  }

  .awareness-closing{
    padding:27px 23px;
  }

  .awareness-closing__inner > p:first-child{
    display:block;
    line-height:1.7;
  }

  .awareness-closing__inner > p:first-child span{
    display:block;
  }

  .awareness-modal{
    width:calc(100% - 20px);
    max-height:calc(100vh - 20px);
  }

  .awareness-modal__body{
    max-height:calc(100vh - 20px);
    padding:50px 23px 30px;
  }

  .awareness-modal__close{
    top:12px;
    right:12px;
  }

  .awareness-modal .awareness-heading h2{
    padding-right:0;
  }

  .help-step{
    grid-template-columns:1fr;
    gap:8px;
    padding:21px;
  }

  .means-safety__resource{
    padding:23px;
  }

  .veterans-support__inner{
    grid-template-columns:1fr;
  }

  .veterans-support__mark{
    width:70px;
    height:70px;
  }

  .veterans-support__actions{
    flex-direction:column;
  }

  .veterans-support__actions a{
    width:100%;
  }

}


/* =====================================================
   REDUCED MOTION
===================================================== */

@media (prefers-reduced-motion:reduce){

  html{
    scroll-behavior:auto;
  }

  .awareness-page *,
  .awareness-page *::before,
  .awareness-page *::after{
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    scroll-behavior:auto !important;
    transition-duration:.01ms !important;
  }

}


/* =====================================================
   VIBRANT CRISIS AND HERO BUTTONS
===================================================== */


/* =====================================================
   CRISIS BAR BUTTONS
===================================================== */

.awareness-page .crisis-banner__button{
  min-width:112px;

  color:#ffffff;
  background:
    linear-gradient(
      135deg,
      #1d6fd1,
      #704bd0
    );

  border:1px solid rgba(255,255,255,.35);

  box-shadow:
    0 10px 26px rgba(29,111,209,.28),
    inset 0 1px 0 rgba(255,255,255,.22);

  text-shadow:
    0 1px 2px rgba(0,0,0,.2);
}

.awareness-page .crisis-banner__button:visited{
  color:#ffffff;
}

.awareness-page .crisis-banner__button:hover{
  color:#ffffff;

  background:
    linear-gradient(
      135deg,
      #2689ee,
      #8a5ee8
    );

  border-color:rgba(255,255,255,.72);

  box-shadow:
    0 14px 34px rgba(61,135,232,.38),
    0 0 24px rgba(105,72,201,.22),
    inset 0 1px 0 rgba(255,255,255,.3);

  transform:translateY(-2px);
}


/* CALL 988 */

.awareness-page .crisis-banner__button--primary{
  color:#03192f;

  background:
    linear-gradient(
      135deg,
      #62f0de,
      #56bfff
    );

  border-color:#91fff1;

  box-shadow:
    0 12px 30px rgba(24,181,187,.38),
    0 0 24px rgba(77,180,255,.2),
    inset 0 1px 0 rgba(255,255,255,.68);

  text-shadow:none;
}

.awareness-page .crisis-banner__button--primary:visited{
  color:#03192f;
}

.awareness-page .crisis-banner__button--primary:hover{
  color:#03192f;

  background:
    linear-gradient(
      135deg,
      #8ffff1,
      #72caff
    );

  border-color:#ffffff;

  box-shadow:
    0 16px 38px rgba(24,181,187,.48),
    0 0 32px rgba(77,180,255,.3),
    inset 0 1px 0 rgba(255,255,255,.8);
}


/* CHAT ONLINE */

.awareness-page .crisis-banner__link{
  display:inline-flex;
  align-items:center;
  justify-content:center;

  min-height:42px;
  padding:9px 15px;

  color:#8ef4ef;

  background:rgba(24,181,187,.08);
  border:1px solid rgba(82,231,224,.3);
  border-radius:4px;

  font-weight:900;
  text-decoration:none;

  transition:
    color .2s ease,
    background-color .2s ease,
    border-color .2s ease,
    transform .2s ease,
    box-shadow .2s ease;
}

.awareness-page .crisis-banner__link:visited{
  color:#8ef4ef;
}

.awareness-page .crisis-banner__link:hover{
  color:#06172d;
  background:#79eee4;
  border-color:#a8fff7;

  box-shadow:
    0 12px 28px rgba(24,181,187,.3);

  transform:translateY(-2px);
}


/* =====================================================
   HERO BUTTONS
===================================================== */

.awareness-page .awareness-hero .awareness-button{
  position:relative;
  overflow:hidden;

  min-height:56px;
  padding:15px 28px;

  border-width:2px;

  transition:
    color .25s ease,
    background .25s ease,
    border-color .25s ease,
    transform .25s ease,
    box-shadow .25s ease;
}

.awareness-page .awareness-hero .awareness-button::before{
  content:"";
  position:absolute;
  inset:0;

  background:
    linear-gradient(
      110deg,
      transparent 20%,
      rgba(255,255,255,.42) 48%,
      transparent 76%
    );

  transform:translateX(-130%);
  transition:transform .55s ease;
}

.awareness-page .awareness-hero .awareness-button:hover::before{
  transform:translateX(130%);
}


/* I NEED HELP NOW */

.awareness-page .awareness-hero .awareness-button--light{
  color:#03192f;

  background:
    linear-gradient(
      135deg,
      #61f0dc,
      #4cb8ff
    );

  border-color:#91fff1;

  box-shadow:
    0 16px 38px rgba(24,181,187,.34),
    0 0 28px rgba(77,180,255,.2),
    inset 0 1px 0 rgba(255,255,255,.7);

  text-shadow:none;
}

.awareness-page .awareness-hero .awareness-button--light:visited{
  color:#03192f;
}

.awareness-page .awareness-hero .awareness-button--light:hover{
  color:#03192f;

  background:
    linear-gradient(
      135deg,
      #8effee,
      #73caff
    );

  border-color:#ffffff;

  box-shadow:
    0 20px 48px rgba(24,181,187,.44),
    0 0 38px rgba(77,180,255,.28),
    inset 0 1px 0 rgba(255,255,255,.8);

  transform:translateY(-4px);
}


/* I’M WORRIED ABOUT SOMEONE */

.awareness-page .awareness-hero .awareness-button--outline{
  color:#ffffff;

  background:
    linear-gradient(
      135deg,
      #744bd2,
      #327fe0
    );

  border-color:#a88af0;

  box-shadow:
    0 16px 38px rgba(105,72,201,.34),
    0 0 28px rgba(77,180,255,.14),
    inset 0 1px 0 rgba(255,255,255,.22);

  text-shadow:
    0 1px 2px rgba(0,0,0,.24);
}

.awareness-page .awareness-hero .awareness-button--outline:visited{
  color:#ffffff;
}

.awareness-page .awareness-hero .awareness-button--outline:hover{
  color:#ffffff;

  background:
    linear-gradient(
      135deg,
      #9165ea,
      #3c98ef
    );

  border-color:#c9b6ff;

  box-shadow:
    0 20px 48px rgba(105,72,201,.45),
    0 0 38px rgba(77,180,255,.25),
    inset 0 1px 0 rgba(255,255,255,.3);

  transform:translateY(-4px);
}


/* KEEP BUTTON TEXT ABOVE THE LIGHT SWEEP */

.awareness-page .awareness-hero .awareness-button{
  isolation:isolate;
}

.awareness-page .awareness-hero .awareness-button::before{
  z-index:-1;
}

/* =====================================================
   SOPHISTICATED EDITORIAL TYPOGRAPHY
===================================================== */


/* =====================================================
   SECTION LABELS
===================================================== */

.awareness-page .awareness-eyebrow,
.awareness-page .awareness-kicker{
  display:flex;
  align-items:center;
  gap:13px;

  margin-bottom:18px;

  font-family:"Montserrat",Arial,sans-serif;
  font-size:.7rem;
  font-weight:700;
  line-height:1.4;

  letter-spacing:.24em;
  text-transform:uppercase;
}

.awareness-page .awareness-eyebrow::before,
.awareness-page .awareness-kicker::before{
  content:"";

  width:34px;
  height:1px;
  flex:0 0 auto;

  background:currentColor;
  opacity:.75;
}


/* =====================================================
   HERO TITLE
===================================================== */

.awareness-page .awareness-hero__content h1{
  max-width:850px;
  margin:0 0 34px;

  color:#ffffff;

  font-family:"Cormorant Garamond",Georgia,serif;
  font-size:clamp(4.2rem,7.3vw,7.8rem);
  font-weight:700;
  line-height:.83;
  letter-spacing:-.045em;

  text-wrap:balance;

  text-shadow:
    0 14px 42px rgba(0,0,0,.22);
}

.awareness-page .awareness-hero__content h1 span{
  display:block;

  margin-top:18px;

  color:#78c8ff;

  font-family:"Cormorant Garamond",Georgia,serif;
  font-weight:600;
  font-style:italic;
  line-height:.92;
  letter-spacing:-.035em;

  text-shadow:
    0 15px 44px rgba(52,143,224,.2);
}


/* THIN EDITORIAL RULE UNDER HERO TITLE */

.awareness-page .awareness-hero__content h1::after{
  content:"";
  display:block;

  width:130px;
  height:2px;
  margin-top:30px;

  background:
    linear-gradient(
      90deg,
      #50c8ff,
      #74e0d8,
      #9d7dea,
      transparent
    );
}


/* =====================================================
   HERO SUPPORTING COPY
===================================================== */

.awareness-page .awareness-hero__lead{
  max-width:760px;

  font-family:"Inter",Arial,sans-serif;
  font-size:clamp(1.08rem,1.45vw,1.28rem);
  font-weight:500;
  line-height:1.78;
  letter-spacing:-.012em;
}

.awareness-page .awareness-hero__support{
  max-width:720px;

  font-family:"Inter",Arial,sans-serif;
  font-size:.98rem;
  font-weight:400;
  line-height:1.85;
}


/* =====================================================
   PRIMARY SECTION HEADINGS
===================================================== */

.awareness-page .awareness-heading h2,
.awareness-page .walk-section__content h2,
.awareness-page .means-safety__content h2,
.awareness-page .veterans-support__content h2,
.awareness-page .faith-care__content h2,
.awareness-page .church-support__content h2{
  margin-top:0;

  font-family:"Cormorant Garamond",Georgia,serif;
  font-size:clamp(2.8rem,5vw,4.9rem);
  font-weight:700;
  line-height:.98;
  letter-spacing:-.035em;

  text-wrap:balance;
}


/* LIGHT SECTION HEADINGS */

.awareness-page .awareness-heading h2,
.awareness-page .means-safety__content h2,
.awareness-page .faith-care__content h2{
  color:#071b32;
}


/* DARK SECTION HEADINGS */

.awareness-page .walk-section__content h2,
.awareness-page .veterans-support__content h2,
.awareness-page .church-support__content h2{
  color:#ffffff;

  text-shadow:
    0 12px 34px rgba(0,0,0,.18);
}


/* =====================================================
   SECTION HEADER ACCENT
===================================================== */

.awareness-page .awareness-heading h2::after{
  content:"";
  display:block;

  width:82px;
  height:2px;
  margin-top:22px;

  background:
    linear-gradient(
      90deg,
      var(--awareness-blue),
      var(--awareness-teal),
      var(--awareness-purple)
    );
}

.awareness-page .awareness-heading--centered h2::after{
  margin-inline:auto;
}

.awareness-page .walk-section__content h2::after,
.awareness-page .means-safety__content h2::after,
.awareness-page .veterans-support__content h2::after,
.awareness-page .faith-care__content h2::after,
.awareness-page .church-support__content h2::after{
  content:"";
  display:block;

  width:76px;
  height:2px;
  margin-top:22px;

  background:
    linear-gradient(
      90deg,
      var(--awareness-blue-bright),
      var(--awareness-teal),
      var(--awareness-purple-light)
    );
}


/* =====================================================
   MEMORIAL NAMES
===================================================== */

.awareness-page .memorial-card h3{
  color:#071b32;

  font-family:"Cormorant Garamond",Georgia,serif;
  font-size:clamp(2.45rem,3.7vw,3.65rem);
  font-weight:700;
  line-height:.96;
  letter-spacing:-.035em;
}

.awareness-page .memorial-card__label{
  font-family:"Montserrat",Arial,sans-serif;
  font-size:.64rem;
  font-weight:700;

  letter-spacing:.24em;
}


/* =====================================================
   SUPPORT CARD HEADINGS
===================================================== */

.awareness-page .support-card h3{
  margin-bottom:18px;

  font-family:"Cormorant Garamond",Georgia,serif;
  font-size:clamp(1.9rem,2.8vw,2.55rem);
  font-weight:700;
  line-height:1.02;
  letter-spacing:-.025em;
}

.awareness-page .support-card--urgent h3{
  color:#ffffff;
}


/* =====================================================
   TOPIC CARD HEADINGS
===================================================== */

.awareness-page .awareness-topic-card__title{
  font-family:"Cormorant Garamond",Georgia,serif;
  font-size:1.55rem;
  font-weight:700;
  line-height:1.08;
  letter-spacing:-.02em;
}

.awareness-page .awareness-topic-card__number{
  font-family:"Montserrat",Arial,sans-serif;
  font-size:.64rem;
  font-weight:700;

  letter-spacing:.2em;
}


/* =====================================================
   MODAL HEADINGS
===================================================== */

.awareness-page .awareness-modal .awareness-heading h2{
  font-size:clamp(2.65rem,5vw,4.5rem);
  line-height:.98;
}

.awareness-page .help-step h3,
.awareness-page .grief-support__cards h3,
.awareness-page .means-safety__resource h3,
.awareness-page .resource-card h3{
  color:#071b32;

  font-family:"Cormorant Garamond",Georgia,serif;
  font-size:1.55rem;
  font-weight:700;
  line-height:1.12;
  letter-spacing:-.02em;
}


/* =====================================================
   WALK EVENT CARD TYPOGRAPHY
===================================================== */

.awareness-page .walk-card__month{
  font-family:"Montserrat",Arial,sans-serif;
  font-size:.66rem;
  font-weight:700;

  letter-spacing:.23em;
}

.awareness-page .walk-card__day{
  font-family:"Cormorant Garamond",Georgia,serif;
  font-size:6rem;
  font-weight:700;
  line-height:.76;
  letter-spacing:-.07em;
}

.awareness-page .walk-card__year{
  font-family:"Montserrat",Arial,sans-serif;
  font-size:.74rem;
  font-weight:700;

  letter-spacing:.24em;
}


/* =====================================================
   VETERAN MARK
===================================================== */

.awareness-page .veterans-support__mark{
  font-family:"Cormorant Garamond",Georgia,serif;
  font-size:1rem;
  font-weight:700;

  letter-spacing:.12em;
}


/* =====================================================
   RESOURCE CARD LABELS
===================================================== */

.awareness-page .resource-card__type,
.awareness-page .means-safety__label{
  font-family:"Montserrat",Arial,sans-serif;
  font-size:.63rem;
  font-weight:700;

  letter-spacing:.21em;
}


/* =====================================================
   CLOSING STATEMENT
===================================================== */

.awareness-page .awareness-closing__inner > p:first-child{
  font-family:"Cormorant Garamond",Georgia,serif;
  font-size:clamp(1.65rem,3vw,2.4rem);
  font-weight:700;
  line-height:1.2;
  letter-spacing:-.02em;
}


/* =====================================================
   MOBILE TYPOGRAPHY
===================================================== */

@media (max-width:640px){

  .awareness-page .awareness-hero__content h1{
    font-size:clamp(3.4rem,17vw,5.25rem);
    line-height:.86;
  }

  .awareness-page .awareness-heading h2,
  .awareness-page .walk-section__content h2,
  .awareness-page .means-safety__content h2,
  .awareness-page .veterans-support__content h2,
  .awareness-page .faith-care__content h2,
  .awareness-page .church-support__content h2{
    font-size:clamp(2.5rem,12vw,3.75rem);
  }

  .awareness-page .awareness-heading--centered{
    text-align:left;
  }

  .awareness-page .awareness-heading--centered h2::after{
    margin-left:0;
  }

}


/* =====================================================
   WARNING SIGNS FEATURE CARD
   IMAGE-LED CARD WITH HOVER REVEAL
===================================================== */

.awareness-topic-card--warning{
  position:relative;
  isolation:isolate;
  overflow:hidden;

  min-height:340px;
  padding:0;

  color:var(--awareness-white);
  background:
    linear-gradient(
      180deg,
      rgba(4,21,42,.04) 0%,
      rgba(4,21,42,.20) 48%,
      rgba(4,21,42,.76) 100%
    ),
    url("/media/SuicideHero.png") center / cover no-repeat;

  border:1px solid rgba(77,180,255,.34);
  border-bottom:0;
  border-radius:3px;

  box-shadow:0 18px 44px rgba(4,21,42,.14);

  transform:translateZ(0);

  transition:
    transform .35s ease,
    box-shadow .35s ease,
    border-color .35s ease;
}

.awareness-topic-card--warning::before{
  content:"";
  position:absolute;
  z-index:0;
  inset:0;

  width:auto;
  height:auto;

  background:
    linear-gradient(
      135deg,
      rgba(24,181,187,.70),
      rgba(30,123,216,.67) 48%,
      rgba(105,72,201,.74)
    );

  border-radius:0;
  opacity:0;

  transition:opacity .35s ease;
}

.awareness-topic-card--warning::after{
  content:"";
  position:absolute;
  z-index:1;
  right:0;
  bottom:0;
  left:0;

  height:64px;

  background:
    linear-gradient(
      100deg,
      rgba(8,85,99,.95),
      rgba(17,74,132,.94) 52%,
      rgba(76,48,142,.94)
    );

  border-top:1px solid rgba(255,255,255,.22);

  transition:
    height .35s ease,
    background .35s ease;
}

.awareness-topic-card--warning:hover,
.awareness-topic-card--warning:focus-visible,
.awareness-topic-card--warning.is-card-active{
  border-color:rgba(139,231,235,.72);

  transform:translateY(-7px);

  box-shadow:
    0 30px 70px rgba(4,21,42,.24),
    0 0 0 1px rgba(77,180,255,.16);
}

.awareness-topic-card--warning:hover::before,
.awareness-topic-card--warning:focus-visible::before,
.awareness-topic-card--warning.is-card-active::before{
  opacity:.72;
}

.awareness-topic-card--warning:hover::after,
.awareness-topic-card--warning:focus-visible::after,
.awareness-topic-card--warning.is-card-active::after{
  height:142px;

  background:
    linear-gradient(
      100deg,
      rgba(5,69,80,.98),
      rgba(13,61,111,.97) 52%,
      rgba(65,39,125,.97)
    );
}

.awareness-topic-card--warning .awareness-topic-card__number{
  position:absolute;
  z-index:3;
  top:20px;
  left:20px;

  display:grid;
  place-items:center;

  width:44px;
  height:44px;
  margin:0;

  color:var(--awareness-white);
  background:rgba(4,21,42,.72);

  border:1px solid rgba(139,231,235,.68);
  border-radius:50%;

  font-size:.67rem;
  letter-spacing:.08em;

  box-shadow:0 12px 28px rgba(4,21,42,.28);

  backdrop-filter:blur(9px);
}

.awareness-topic-card--warning .awareness-topic-card__title{
  position:absolute;
  z-index:3;
  right:24px;
  bottom:17px;
  left:24px;

  margin:0;

  color:var(--awareness-white);
  font-size:clamp(1.65rem,2vw,2rem);
  line-height:1;

  text-shadow:0 5px 18px rgba(0,0,0,.32);

  transition:
    bottom .35s ease,
    transform .35s ease;
}

.awareness-topic-card--warning .awareness-topic-card__copy{
  position:absolute;
  z-index:3;
  right:24px;
  bottom:18px;
  left:24px;

  display:-webkit-box;
  margin:0;
  overflow:hidden;

  color:rgba(255,255,255,.86);
  font-size:.8rem;
  line-height:1.55;

  opacity:0;
  transform:translateY(16px);

  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;

  transition:
    opacity .25s ease .08s,
    transform .30s ease .08s;
}

.awareness-topic-card--warning .awareness-topic-card__action{
  position:absolute;
  z-index:4;
  top:46%;
  left:50%;

  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;

  min-height:48px;
  margin:0;
  padding:11px 21px;

  color:var(--awareness-white);
  background:rgba(4,21,42,.45);

  border:2px solid rgba(255,255,255,.90);
  border-radius:3px;

  font-size:.74rem;
  letter-spacing:.08em;

  opacity:0;
  transform:translate(-50%,-38%) scale(.96);

  box-shadow:0 14px 32px rgba(4,21,42,.25);

  backdrop-filter:blur(8px);

  transition:
    opacity .25s ease,
    transform .30s ease,
    background-color .25s ease;
}

.awareness-topic-card--warning .awareness-topic-card__action::after{
  display:none;
}

.awareness-topic-card--warning:hover .awareness-topic-card__title,
.awareness-topic-card--warning:focus-visible .awareness-topic-card__title,
.awareness-topic-card--warning.is-card-active .awareness-topic-card__title{
  bottom:93px;
}

.awareness-topic-card--warning:hover .awareness-topic-card__copy,
.awareness-topic-card--warning:focus-visible .awareness-topic-card__copy,
.awareness-topic-card--warning.is-card-active .awareness-topic-card__copy{
  opacity:1;
  transform:translateY(0);
}

.awareness-topic-card--warning:hover .awareness-topic-card__action,
.awareness-topic-card--warning:focus-visible .awareness-topic-card__action,
.awareness-topic-card--warning.is-card-active .awareness-topic-card__action{
  opacity:1;
  transform:translate(-50%,-50%) scale(1);
}


/* =====================================================
   MODAL PAGE LOCK
===================================================== */

html.modal-is-open,
body.modal-is-open,
body.awareness-modal-open{
  overflow:hidden;
}


/* =====================================================
   WARNING SIGNS MODAL SHELL
===================================================== */

.warning-signs-modal{
  width:min(1180px,calc(100% - 36px));
  max-width:none;
  max-height:calc(100dvh - 34px);
  padding:0;

  color:var(--awareness-ink);
  background:var(--awareness-white);

  border:1px solid rgba(77,180,255,.34);
  border-radius:4px;

  overflow:hidden;

  box-shadow:
    0 38px 110px rgba(1,10,24,.52),
    0 0 0 1px rgba(255,255,255,.08);
}

.warning-signs-modal[open]{
  display:grid;
  grid-template-rows:auto minmax(0,1fr);
}

.warning-signs-modal::backdrop{
  background:
    radial-gradient(
      circle at 15% 18%,
      rgba(24,181,187,.22),
      transparent 30%
    ),
    radial-gradient(
      circle at 85% 80%,
      rgba(105,72,201,.28),
      transparent 34%
    ),
    rgba(2,13,30,.90);

  backdrop-filter:blur(10px);
}

.warning-signs-modal__topbar{
  position:relative;
  z-index:20;

  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;

  min-height:84px;
  padding:14px 18px 14px 22px;

  color:var(--awareness-white);
  background:
    radial-gradient(
      circle at 80% 0%,
      rgba(77,180,255,.28),
      transparent 34%
    ),
    linear-gradient(
      105deg,
      var(--awareness-navy-deep),
      #0b396c 56%,
      #38256f
    );

  border-bottom:1px solid rgba(139,231,235,.32);

  box-shadow:0 12px 34px rgba(4,21,42,.18);
}

.warning-signs-modal__topbar::after{
  content:"";
  position:absolute;
  right:0;
  bottom:-1px;
  left:0;

  height:3px;

  background:
    linear-gradient(
      90deg,
      var(--awareness-teal),
      var(--awareness-blue-bright),
      var(--awareness-purple-light)
    );
}

.warning-signs-modal__identity{
  display:flex;
  align-items:center;
  gap:14px;
}

.warning-signs-modal__number{
  display:grid;
  place-items:center;

  width:46px;
  height:46px;
  flex:0 0 46px;

  color:var(--awareness-white);
  background:rgba(255,255,255,.08);

  border:1px solid rgba(139,231,235,.55);
  border-radius:50%;

  font-family:"Montserrat",Arial,sans-serif;
  font-size:.7rem;
  font-weight:900;
  letter-spacing:.08em;
}

.warning-signs-modal__identity p{
  margin:0 0 3px;

  color:#8be7eb;
  font-family:"Montserrat",Arial,sans-serif;
  font-size:.63rem;
  font-weight:900;
  line-height:1.3;
  letter-spacing:.18em;
  text-transform:uppercase;
}

.warning-signs-modal__identity strong{
  display:block;

  color:var(--awareness-white);
  font-family:"Cormorant Garamond",Georgia,serif;
  font-size:1.35rem;
  line-height:1;
}

.warning-signs-modal .awareness-modal__close{
  position:relative;
  top:auto;
  right:auto;

  width:46px;
  height:46px;
  flex:0 0 46px;

  color:var(--awareness-white);
  background:rgba(255,255,255,.08);

  border:1px solid rgba(139,231,235,.46);

  box-shadow:none;
}

.warning-signs-modal .awareness-modal__close:hover,
.warning-signs-modal .awareness-modal__close:focus-visible{
  color:var(--awareness-navy-deep);
  background:#8be7eb;
}

.warning-signs-modal__scroll{
  max-height:none;
  min-height:0;
  padding:0;

  background:
    radial-gradient(
      circle at 96% 4%,
      rgba(77,180,255,.12),
      transparent 28%
    ),
    radial-gradient(
      circle at 4% 46%,
      rgba(24,181,187,.08),
      transparent 26%
    ),
    linear-gradient(
      180deg,
      #ffffff,
      #f7fbff 58%,
      #f4f1ff
    );

  overflow-y:auto;
  overscroll-behavior:contain;

  scrollbar-color:
    var(--awareness-blue)
    rgba(9,43,87,.08);

  scrollbar-width:thin;
}

.warning-signs-modal__scroll::-webkit-scrollbar{
  width:10px;
}

.warning-signs-modal__scroll::-webkit-scrollbar-track{
  background:rgba(9,43,87,.07);
}

.warning-signs-modal__scroll::-webkit-scrollbar-thumb{
  background:
    linear-gradient(
      var(--awareness-teal),
      var(--awareness-blue),
      var(--awareness-purple)
    );

  border:2px solid #edf6fd;
  border-radius:999px;
}


/* =====================================================
   WARNING SIGNS INTRODUCTION
===================================================== */

.warning-signs-intro{
  display:grid;
  grid-template-columns:
    minmax(0,1.25fr)
    minmax(280px,.75fr);

  align-items:center;
  gap:54px;

  padding:
    62px
    clamp(30px,5vw,68px);

  color:var(--awareness-white);

  background:
    linear-gradient(
      90deg,
      rgba(4,21,42,.98),
      rgba(7,42,79,.94) 58%,
      rgba(52,35,104,.90)
    ),
    url("/media/warningmodal.png") center / cover no-repeat;
}

.warning-signs-intro .awareness-kicker{
  color:#8be7eb;
}

.warning-signs-intro h2{
  max-width:720px;
  margin:0 0 22px;

  color:var(--awareness-white);

  font-family:"Cormorant Garamond",Georgia,serif;
  font-size:clamp(3rem,5vw,5.25rem);
  font-weight:700;
  line-height:.92;
  letter-spacing:-.045em;
}

.warning-signs-intro__lead{
  max-width:720px;
  margin:0;

  color:rgba(255,255,255,.86);
  font-size:1.02rem;
  line-height:1.8;
}

.warning-signs-intro__note{
  max-width:680px;
  margin:24px 0 0;
  padding:18px 20px;

  color:rgba(255,255,255,.82);
  background:rgba(255,255,255,.07);

  border-left:4px solid var(--awareness-teal);

  font-size:.87rem;
  line-height:1.68;
}

.warning-visual{
  position:relative;

  display:grid;
  place-items:center;

  min-height:310px;
  margin:0;
  padding:28px;

  background:
    radial-gradient(
      circle,
      rgba(77,180,255,.18),
      rgba(255,255,255,.035) 62%,
      transparent 63%
    );

  border:1px solid rgba(139,231,235,.30);
}

.warning-visual::before,
.warning-visual::after{
  content:"";
  position:absolute;

  width:54px;
  height:54px;

  pointer-events:none;
}

.warning-visual::before{
  top:-1px;
  left:-1px;

  border-top:3px solid var(--awareness-teal);
  border-left:3px solid var(--awareness-teal);
}

.warning-visual::after{
  right:-1px;
  bottom:-1px;

  border-right:3px solid var(--awareness-purple-light);
  border-bottom:3px solid var(--awareness-purple-light);
}

.warning-visual svg{
  width:min(260px,100%);
  height:auto;

  filter:
    drop-shadow(
      0 14px 28px rgba(77,180,255,.20)
    );
}

.warning-visual figcaption{
  margin-top:-18px;

  color:#8be7eb;

  font-family:"Montserrat",Arial,sans-serif;
  font-size:.67rem;
  font-weight:900;
  letter-spacing:.16em;
  text-transform:uppercase;
}


/* =====================================================
   IMMEDIATE CONCERN
===================================================== */

.warning-signs-crisis{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:36px;

  margin:0;

  padding:
    30px
    clamp(30px,5vw,68px);

  color:var(--awareness-white);

  background:
    linear-gradient(
      100deg,
      #57243c,
      #812f4d 55%,
      #4d2f7d
    );

  border-top:1px solid rgba(255,255,255,.14);
  border-bottom:1px solid rgba(255,255,255,.14);
}

.warning-signs-crisis__label{
  margin:0 0 7px;

  color:#ffd5e2;

  font-family:"Montserrat",Arial,sans-serif;
  font-size:.64rem;
  font-weight:900;
  letter-spacing:.16em;
  text-transform:uppercase;
}

.warning-signs-crisis h3{
  margin:0 0 8px;

  color:var(--awareness-white);

  font-family:"Cormorant Garamond",Georgia,serif;
  font-size:clamp(1.75rem,3vw,2.4rem);
  line-height:1;
}

.warning-signs-crisis__content > p:last-child{
  max-width:740px;
  margin:0;

  color:rgba(255,255,255,.78);
  font-size:.86rem;
  line-height:1.65;
}

.warning-signs-crisis__actions{
  display:grid;
  grid-template-columns:repeat(3,auto);
  gap:8px;
}

.warning-signs-crisis__actions a{
  display:inline-flex;
  align-items:center;
  justify-content:center;

  min-height:43px;
  padding:9px 16px;

  color:#11233a;
  background:var(--awareness-white);

  border:1px solid rgba(255,255,255,.74);
  border-radius:3px;

  font-size:.72rem;
  font-weight:900;
  text-decoration:none;

  transition:
    transform .2s ease,
    background-color .2s ease;
}

.warning-signs-crisis__actions a:hover{
  background:#e8fbff;
  transform:translateY(-2px);
}

.warning-signs-crisis__actions
.warning-signs-crisis__emergency{
  grid-column:1 / -1;

  color:var(--awareness-white);
  background:rgba(4,21,42,.42);

  border-color:rgba(255,255,255,.38);
}


/* =====================================================
   WARNING SIGN TABS
===================================================== */

.warning-signs-guide{
  padding:
    64px
    clamp(30px,5vw,68px);
}

.warning-signs-guide__heading{
  max-width:790px;
  margin-bottom:34px;
}

.warning-signs-guide__heading h3{
  margin:0 0 14px;

  color:var(--awareness-navy-deep);

  font-family:"Cormorant Garamond",Georgia,serif;
  font-size:clamp(2.5rem,4vw,4rem);
  line-height:.98;
  letter-spacing:-.035em;
}

.warning-signs-guide__heading > p:last-child{
  margin:0;

  color:var(--awareness-copy);
  line-height:1.75;
}

.warning-signs-tabs{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:0;

  margin-bottom:24px;

  border:1px solid rgba(9,43,87,.14);
}

.warning-signs-tab{
  position:relative;

  display:flex;
  align-items:center;
  justify-content:center;
  gap:11px;

  min-height:62px;
  padding:13px 17px;

  color:var(--awareness-copy);
  background:rgba(255,255,255,.74);

  border:0;
  border-right:1px solid rgba(9,43,87,.12);

  font-family:"Montserrat",Arial,sans-serif;
  font-size:.75rem;
  font-weight:900;
  letter-spacing:.04em;

  cursor:pointer;

  transition:
    color .25s ease,
    background-color .25s ease;
}

.warning-signs-tab:last-child{
  border-right:0;
}

.warning-signs-tab::after{
  content:"";
  position:absolute;
  right:0;
  bottom:0;
  left:0;

  height:4px;

  background:
    linear-gradient(
      90deg,
      var(--awareness-teal),
      var(--awareness-blue),
      var(--awareness-purple)
    );

  transform:scaleX(0);
  transform-origin:center;

  transition:transform .25s ease;
}

.warning-signs-tab span{
  color:var(--awareness-blue);
  font-size:.62rem;
}

.warning-signs-tab:hover{
  color:var(--awareness-navy-deep);
  background:var(--awareness-blue-soft);
}

.warning-signs-tab.is-active{
  color:var(--awareness-white);
  background:var(--awareness-navy);
}

.warning-signs-tab.is-active::after{
  transform:scaleX(1);
}

.warning-signs-tab.is-active span{
  color:#8be7eb;
}


/* =====================================================
   WARNING SIGN PANELS
===================================================== */

.warning-signs-panel{
  display:grid;

  grid-template-columns:
    minmax(250px,.72fr)
    minmax(0,1.28fr);

  gap:0;

  min-height:440px;

  background:rgba(255,255,255,.88);

  border:1px solid rgba(9,43,87,.14);

  box-shadow:0 22px 52px rgba(4,21,42,.10);
}

.warning-signs-panel[hidden]{
  display:none;
}

.warning-signs-panel__visual{
  position:relative;

  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;

  padding:40px 32px;

  color:#8be7eb;

  background:
    radial-gradient(
      circle at center,
      rgba(77,180,255,.22),
      transparent 58%
    ),
    linear-gradient(
      145deg,
      var(--awareness-navy-deep),
      var(--awareness-navy) 58%,
      #38256f
    );

  text-align:center;
}

.warning-signs-panel__visual::after{
  content:"";
  position:absolute;
  right:0;
  bottom:0;

  width:110px;
  height:110px;

  border-right:1px solid rgba(139,231,235,.28);
  border-bottom:1px solid rgba(139,231,235,.28);
  border-radius:100% 0 0 0;
}

.warning-signs-panel__visual svg{
  width:min(190px,85%);
  height:auto;
  margin-bottom:26px;

  filter:
    drop-shadow(
      0 12px 24px rgba(0,0,0,.20)
    );
}

.warning-signs-panel__visual p{
  max-width:280px;
  margin:0;

  color:rgba(255,255,255,.72);
  font-size:.82rem;
  line-height:1.7;
}

.warning-signs-panel__content{
  padding:38px;
}

.warning-signs-panel__label{
  margin:0 0 7px;

  color:var(--awareness-blue);

  font-family:"Montserrat",Arial,sans-serif;
  font-size:.63rem;
  font-weight:900;
  letter-spacing:.16em;
  text-transform:uppercase;
}

.warning-signs-panel__content h4{
  margin:0 0 23px;

  color:var(--awareness-navy-deep);

  font-family:"Cormorant Garamond",Georgia,serif;
  font-size:2rem;
  line-height:1.05;
}

.warning-signs-checklist{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
}

.warning-sign{
  position:relative;

  display:grid;
  grid-template-columns:22px 1fr;
  align-items:start;
  gap:11px;

  min-height:74px;
  padding:15px;

  color:var(--awareness-copy);
  background:#f7fbfe;

  border:1px solid rgba(9,43,87,.12);
  border-left:4px solid var(--awareness-blue-bright);

  font-size:.78rem;
  line-height:1.5;

  cursor:pointer;

  transition:
    color .2s ease,
    background-color .2s ease,
    border-color .2s ease,
    transform .2s ease,
    box-shadow .2s ease;
}

.warning-sign:hover{
  color:var(--awareness-navy-deep);
  background:#eef8ff;

  border-color:rgba(30,123,216,.32);

  transform:translateY(-2px);

  box-shadow:0 10px 24px rgba(4,21,42,.08);
}

.warning-sign input{
  width:19px;
  height:19px;
  margin:1px 0 0;

  accent-color:var(--awareness-blue);

  cursor:pointer;
}

.warning-sign.is-selected,
.warning-sign:has(input:checked){
  color:var(--awareness-navy-deep);

  background:
    linear-gradient(
      135deg,
      #e4f8fa,
      #e8f2ff
    );

   border-color:rgba(24,181,187,.50);
  border-left-color:var(--awareness-teal);

  box-shadow:0 10px 26px rgba(24,181,187,.12);
}

.warning-sign--urgent{
  background:#fff4f7;
  border-left-color:#c44a70;
}

.warning-sign--urgent:hover,
.warning-sign--urgent.is-selected,
.warning-sign--urgent:has(input:checked){
  background:#ffe7ee;

  border-color:rgba(196,74,112,.44);
  border-left-color:#c44a70;
}


/* =====================================================
   WARNING SELECTION SUMMARY
===================================================== */

.warning-signs-selection{
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  gap:24px;

  margin-top:18px;
  padding:18px 20px;

  background:
    linear-gradient(
      100deg,
      #edfaff,
      #f5f2ff
    );

  border:1px solid rgba(30,123,216,.18);
  border-left:5px solid var(--awareness-teal);
}

.warning-signs-selection > div{
  display:flex;
  align-items:center;
  gap:11px;
}

.warning-signs-selection__count{
  display:grid;
  place-items:center;

  width:45px;
  height:45px;

  color:var(--awareness-white);

  background:
    linear-gradient(
      135deg,
      var(--awareness-teal),
      var(--awareness-blue)
    );

  border-radius:50%;

  font-family:"Montserrat",Arial,sans-serif;
  font-size:1rem;
  font-weight:900;
}

.warning-signs-selection > div p,
.warning-signs-selection__message{
  margin:0;
}

.warning-signs-selection > div p{
  max-width:145px;

  color:var(--awareness-navy-deep);
  font-size:.72rem;
  font-weight:800;
  line-height:1.35;
}

.warning-signs-selection__message{
  color:var(--awareness-muted);
  font-size:.76rem;
  line-height:1.55;
}

.warning-signs-selection__reset{
  min-height:41px;
  padding:8px 15px;

  color:var(--awareness-blue);
  background:var(--awareness-white);

  border:1px solid rgba(30,123,216,.28);
  border-radius:3px;

  font-size:.7rem;
  font-weight:900;

  cursor:pointer;
}

.warning-signs-selection__reset:disabled{
  color:var(--awareness-muted);
  background:rgba(255,255,255,.50);

  cursor:not-allowed;
  opacity:.58;
}


/* =====================================================
   URGENT RESPONSE PANEL
===================================================== */

.warning-signs-urgent{
  display:grid;
  grid-template-columns:170px minmax(0,1fr);
  align-items:center;
  gap:42px;

  padding:
    58px
    clamp(30px,5vw,68px);

  color:var(--awareness-white);

  background:
    radial-gradient(
      circle at 10% 50%,
      rgba(255,255,255,.08),
      transparent 28%
    ),
    linear-gradient(
      110deg,
      #351a30,
      #652843 52%,
      #35245f
    );
}

.warning-signs-urgent__visual{
  display:grid;
  place-items:center;

  width:148px;
  aspect-ratio:1;

  color:var(--awareness-white);
  background:rgba(255,255,255,.06);

  border:1px solid rgba(255,255,255,.28);
  border-radius:50%;

  box-shadow:
    inset 0 0 0 14px rgba(255,255,255,.035),
    0 20px 46px rgba(0,0,0,.20);
}

.warning-signs-urgent__visual span{
  display:grid;
  place-items:center;

  width:76px;
  height:76px;

  background:
    linear-gradient(
      135deg,
      #c44a70,
      #8a4dc9
    );

  border-radius:50%;

  font-family:"Montserrat",Arial,sans-serif;
  font-size:2.35rem;
  font-weight:900;
}

.warning-signs-urgent h3{
  margin:0 0 20px;

  color:var(--awareness-white);

  font-family:"Cormorant Garamond",Georgia,serif;
  font-size:clamp(2rem,3.6vw,3.4rem);
  line-height:1;
}

.warning-signs-urgent ul{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px 28px;

  margin:0;
  padding:0;

  list-style:none;
}

.warning-signs-urgent li{
  position:relative;
  padding-left:20px;

  color:rgba(255,255,255,.78);
  font-size:.82rem;
  line-height:1.58;
}

.warning-signs-urgent li::before{
  content:"";
  position:absolute;
  top:.62em;
  left:0;

  width:8px;
  height:8px;

  background:#ff92b3;
  border-radius:50%;

  box-shadow:
    0 0 0 4px rgba(255,146,179,.12);
}


/* =====================================================
   RESPONSE STEPS
===================================================== */

.warning-signs-response{
  padding:
    62px
    clamp(30px,5vw,68px);
}

.warning-signs-response__heading{
  max-width:720px;
  margin-bottom:30px;
}

.warning-signs-response__heading h3{
  margin:0;

  color:var(--awareness-navy-deep);

  font-family:"Cormorant Garamond",Georgia,serif;
  font-size:clamp(2.3rem,4vw,3.8rem);
  line-height:1;
}

.warning-signs-response__steps{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;

  margin:0;
  padding:0;

  list-style:none;
}

.warning-signs-response__steps li{
  position:relative;
  overflow:hidden;

  min-height:190px;
  padding:24px;

  background:
    linear-gradient(
      145deg,
      rgba(255,255,255,.96),
      rgba(228,243,254,.92)
    );

  border:1px solid rgba(9,43,87,.13);
  border-top:4px solid var(--awareness-blue);

  box-shadow:0 14px 30px rgba(4,21,42,.08);
}

.warning-signs-response__steps li:nth-child(2){
  border-top-color:var(--awareness-teal);
}

.warning-signs-response__steps li:nth-child(3){
  border-top-color:var(--awareness-purple-light);
}

.warning-signs-response__steps li:nth-child(4){
  border-top-color:var(--awareness-purple);
}

.warning-signs-response__steps li > span{
  display:block;
  margin-bottom:28px;

  color:var(--awareness-blue);

  font-family:"Montserrat",Arial,sans-serif;
  font-size:.66rem;
  font-weight:900;
  letter-spacing:.14em;
}

.warning-signs-response__steps h4{
  margin:0 0 8px;

  color:var(--awareness-navy-deep);

  font-family:"Cormorant Garamond",Georgia,serif;
  font-size:1.6rem;
  line-height:1;
}

.warning-signs-response__steps p{
  margin:0;

  color:var(--awareness-copy);
  font-size:.78rem;
  line-height:1.6;
}


/* =====================================================
   WARNING SIGNS SOURCES
===================================================== */

.warning-signs-sources{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:34px;

  padding:
    30px
    clamp(30px,5vw,68px);

  background:var(--awareness-navy-deep);

  border-top:3px solid var(--awareness-teal);
}

.warning-signs-sources__label{
  margin:0 0 6px;

  color:#8be7eb;

  font-family:"Montserrat",Arial,sans-serif;
  font-size:.63rem;
  font-weight:900;
  letter-spacing:.16em;
  text-transform:uppercase;
}

.warning-signs-sources > div:first-child > p:last-child{
  max-width:700px;
  margin:0;

  color:rgba(255,255,255,.65);
  font-size:.75rem;
  line-height:1.6;
}

.warning-signs-sources__links{
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-end;
  gap:8px;
}

.warning-signs-sources__links a{
  display:inline-flex;
  align-items:center;
  justify-content:center;

  min-height:40px;
  padding:8px 13px;

  color:var(--awareness-white);
  background:rgba(255,255,255,.07);

  border:1px solid rgba(139,231,235,.28);
  border-radius:3px;

  font-size:.68rem;
  font-weight:800;
  text-decoration:none;

  transition:
    color .2s ease,
    background-color .2s ease;
}

.warning-signs-sources__links a:hover{
  color:var(--awareness-navy-deep);
  background:#8be7eb;
}


/* =====================================================
   COMMUNITY WALK LIVE COUNTDOWN
===================================================== */

.walk-countdown{
  position:relative;
  isolation:isolate;
  overflow:hidden;

  width:min(610px,100%);
  margin-top:32px;
  padding:24px;

  color:var(--awareness-white);

  background:
    radial-gradient(
      circle at 92% 12%,
      rgba(154,117,229,.28),
      transparent 30%
    ),
    linear-gradient(
      110deg,
      rgba(4,21,42,.90),
      rgba(9,43,87,.82) 56%,
      rgba(55,37,112,.84)
    );

  border:1px solid rgba(139,231,235,.28);
  border-left:5px solid var(--awareness-teal);
  border-radius:3px;

  box-shadow:
    0 20px 48px rgba(4,21,42,.22),
    inset 0 1px 0 rgba(255,255,255,.08);

  backdrop-filter:blur(12px);
}

.walk-countdown::before{
  content:"";
  position:absolute;
  z-index:-1;
  top:0;
  right:0;

  width:150px;
  height:150px;

  border:1px solid rgba(139,231,235,.16);
  border-radius:50%;

  transform:translate(48%,-52%);
}

.walk-countdown::after{
  content:"";
  position:absolute;
  top:0;
  right:0;
  left:0;

  height:3px;

  background:
    linear-gradient(
      90deg,
      var(--awareness-teal),
      var(--awareness-blue-bright),
      var(--awareness-purple-light)
    );
}

.walk-countdown__label{
  margin:0 0 17px;

  color:#8be7eb;

  font-family:"Montserrat",Arial,sans-serif;
  font-size:.69rem;
  font-weight:900;
  line-height:1.3;
  letter-spacing:.17em;
  text-transform:uppercase;
}

.walk-countdown__units{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
}

.walk-countdown__units > span{
  position:relative;

  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:center;

  min-width:0;
  min-height:96px;
  padding:15px 17px;

  background:rgba(255,255,255,.075);

  border:1px solid rgba(255,255,255,.14);
  border-bottom:3px solid var(--awareness-blue-bright);

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.07);
}

.walk-countdown__units > span:nth-child(2){
  border-bottom-color:var(--awareness-teal);
}

.walk-countdown__units > span:nth-child(3){
  border-bottom-color:var(--awareness-purple-light);
}

.walk-countdown__units strong{
  display:block;

  color:var(--awareness-white);

  font-family:"Cormorant Garamond",Georgia,serif;
  font-size:clamp(2.2rem,4vw,3.1rem);
  font-weight:700;
  line-height:.82;
  letter-spacing:-.035em;

  text-shadow:0 8px 24px rgba(0,0,0,.20);
}

.walk-countdown__units small{
  display:block;
  margin-top:12px;

  color:rgba(255,255,255,.66);

  font-family:"Montserrat",Arial,sans-serif;
  font-size:.61rem;
  font-weight:800;
  line-height:1;
  letter-spacing:.13em;
  text-transform:uppercase;
}

.walk-countdown__status{
  margin:17px 0 0;
  padding-top:15px;

  color:rgba(255,255,255,.77);

  border-top:1px solid rgba(255,255,255,.13);

  font-size:.82rem;
  font-weight:700;
  line-height:1.45;
}

.walk-countdown.is-today,
.walk-countdown.is-complete{
  border-left-color:var(--awareness-gold);
}

.walk-countdown.is-today .walk-countdown__status,
.walk-countdown.is-complete .walk-countdown__status{
  margin-top:0;
  padding:4px 0;

  color:var(--awareness-white);

  border-top:0;

  font-family:"Cormorant Garamond",Georgia,serif;
  font-size:1.6rem;
  line-height:1.2;
}


/* =====================================================
   TABLET RESPONSIVE
===================================================== */

@media (max-width:980px){

  .warning-signs-intro{
    grid-template-columns:1fr;
  }

  .warning-visual{
    min-height:260px;
  }

  .warning-signs-crisis{
    grid-template-columns:1fr;
  }

  .warning-signs-crisis__actions{
    grid-template-columns:
      repeat(3,minmax(0,1fr));
  }

  .warning-signs-panel{
    grid-template-columns:1fr;
  }

  .warning-signs-panel__visual{
    min-height:280px;
  }

  .warning-signs-response__steps{
    grid-template-columns:
      repeat(2,minmax(0,1fr));
  }

  .warning-signs-sources{
    grid-template-columns:1fr;
  }

  .warning-signs-sources__links{
    justify-content:flex-start;
  }

}


/* =====================================================
   MOBILE RESPONSIVE
===================================================== */

@media (max-width:640px){

  .awareness-topic-card--warning{
    min-height:330px;
  }

  .awareness-topic-card--warning::before{
    opacity:.60;
  }

  .awareness-topic-card--warning::after{
    height:142px;
  }

  .awareness-topic-card--warning
  .awareness-topic-card__title{
    bottom:93px;
  }

  .awareness-topic-card--warning
  .awareness-topic-card__copy{
    opacity:1;
    transform:none;
  }

  .awareness-topic-card--warning
  .awareness-topic-card__action{
    top:42%;

    opacity:1;

    transform:
      translate(-50%,-50%)
      scale(1);
  }

  .warning-signs-modal{
    width:calc(100% - 14px);
    max-height:calc(100dvh - 14px);
  }

  .warning-signs-modal__topbar{
    min-height:72px;
    padding:11px 12px 11px 14px;
  }

  .warning-signs-modal__number{
    width:39px;
    height:39px;
    flex-basis:39px;
  }

  .warning-signs-modal__identity strong{
    font-size:1.08rem;
  }

  .warning-signs-modal
  .awareness-modal__close{
    width:41px;
    height:41px;
    flex-basis:41px;
  }

  .warning-signs-intro,
  .warning-signs-guide,
  .warning-signs-urgent,
  .warning-signs-response,
  .warning-signs-sources{
    padding-right:22px;
    padding-left:22px;
  }

  .warning-signs-intro{
    gap:34px;
    padding-top:44px;
    padding-bottom:44px;
  }

  .warning-signs-intro h2{
    font-size:
      clamp(
        2.8rem,
        13vw,
        4rem
      );
  }

  .warning-visual{
    min-height:230px;
    padding:20px;
  }

  .warning-visual svg{
    width:210px;
  }

  .warning-signs-crisis{
    padding:25px 22px;
  }

  .warning-signs-crisis__actions{
    grid-template-columns:
      repeat(2,minmax(0,1fr));
  }

  .warning-signs-crisis__actions a:nth-child(3),
  .warning-signs-crisis__actions
  .warning-signs-crisis__emergency{
    grid-column:1 / -1;
  }

  .warning-signs-tabs{
    grid-template-columns:1fr;
  }

  .warning-signs-tab{
    justify-content:flex-start;

    min-height:52px;

    border-right:0;
    border-bottom:
      1px solid
      rgba(9,43,87,.12);
  }

  .warning-signs-tab:last-child{
    border-bottom:0;
  }

  .warning-signs-panel__visual{
    min-height:230px;
    padding:30px 24px;
  }

  .warning-signs-panel__visual svg{
    width:145px;
    margin-bottom:18px;
  }

  .warning-signs-panel__content{
    padding:27px 20px;
  }

  .warning-signs-checklist{
    grid-template-columns:1fr;
  }

  .warning-sign{
    min-height:0;
  }

  .warning-signs-selection{
    grid-template-columns:1fr;
    gap:15px;
  }

  .warning-signs-selection__reset{
    width:100%;
  }

  .warning-signs-urgent{
    grid-template-columns:1fr;
    gap:28px;
  }

  .warning-signs-urgent__visual{
    width:112px;
  }

  .warning-signs-urgent__visual span{
    width:62px;
    height:62px;

    font-size:1.8rem;
  }

  .warning-signs-urgent ul{
    grid-template-columns:1fr;
  }

  .warning-signs-response__steps{
    grid-template-columns:1fr;
  }

  .warning-signs-response__steps li{
    min-height:0;
  }

  .warning-signs-sources__links{
    display:grid;
    grid-template-columns:1fr;
  }

  .warning-signs-sources__links a{
    width:100%;
  }

  .walk-countdown{
    margin-top:26px;
    padding:19px;
  }

  .walk-countdown__units{
    gap:7px;
  }

  .walk-countdown__units > span{
    min-height:84px;
    padding:13px 10px;
  }

  .walk-countdown__units strong{
    font-size:2.15rem;
  }

  .walk-countdown__units small{
    margin-top:10px;

    font-size:.55rem;
    letter-spacing:.08em;
  }

}


@media (max-width:380px){

  .walk-countdown__units{
    grid-template-columns:1fr;
  }

  .walk-countdown__units > span{
    min-height:72px;
  }

}


/* =====================================================
   REDUCED MOTION
===================================================== */

@media (prefers-reduced-motion:reduce){

  .awareness-topic-card--warning,
  .awareness-topic-card--warning::before,
  .awareness-topic-card--warning::after,
  .awareness-topic-card--warning
  .awareness-topic-card__title,
  .awareness-topic-card--warning
  .awareness-topic-card__copy,
  .awareness-topic-card--warning
  .awareness-topic-card__action,
  .warning-sign,
  .warning-signs-tab,
  .warning-signs-tab::after{
    transition:none;
  }

}


/* =====================================================
   TOPIC CARD HUB
===================================================== */

.awareness-topic-grid{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:16px;
}


/* =====================================================
   SHARED IMAGE CARD
===================================================== */

.awareness-topic-card{
  --topic-accent:var(--awareness-blue-bright);
  --topic-accent-soft:#b9e4ff;
  --topic-dark:#0b467d;
  --topic-image:
    radial-gradient(
      circle at 25% 25%,
      rgba(139,231,235,.7),
      transparent 23%
    ),
    radial-gradient(
      circle at 78% 70%,
      rgba(154,117,229,.55),
      transparent 30%
    ),
    linear-gradient(
      135deg,
      #061a38,
      #124b86 55%,
      #493384
    );

  position:relative;
  isolation:isolate;
  display:block;
  overflow:hidden;

  min-height:340px;
  padding:0;

  color:var(--awareness-white);
  background:
    linear-gradient(
      180deg,
      rgba(4,21,42,.03),
      rgba(4,21,42,.15) 42%,
      rgba(4,21,42,.78) 100%
    ),
    var(--topic-image);

  background-position:center;
  background-size:cover;
  background-repeat:no-repeat;

  border:1px solid rgba(77,180,255,.34);
  border-bottom:0;
  border-radius:4px;

  box-shadow:
    0 18px 44px rgba(4,21,42,.14);

  text-align:left;
  cursor:pointer;

  transform:translateZ(0);

  transition:
    transform .35s ease,
    box-shadow .35s ease,
    border-color .35s ease;
}

/* =====================================================
   INDIVIDUAL CARD COLORS AND IMAGES
===================================================== */


/* =====================================================
   01 — WARNING SIGNS
===================================================== */

.awareness-topic-card:nth-child(1){
  --topic-accent:var(--awareness-blue-bright);
  --topic-accent-soft:#8be7eb;
  --topic-dark:#074b63;

  --topic-image:
    linear-gradient(
      180deg,
      rgba(4,21,42,.02) 0%,
      rgba(4,21,42,.10) 45%,
      rgba(4,21,42,.72) 100%
    ),
    url("/media/warningsigns.png");
}


/* =====================================================
   02 — HELP SOMEONE
===================================================== */

.awareness-topic-card:nth-child(2){
  --topic-accent:var(--awareness-teal);
  --topic-accent-soft:#8be7eb;
  --topic-dark:#075d66;

  --topic-image:
    linear-gradient(
      180deg,
      rgba(3,32,42,.02) 0%,
      rgba(3,32,42,.10) 45%,
      rgba(3,32,42,.74) 100%
    ),
    url("/media/helpsomeone.png");
}


/* =====================================================
   03 — CREATE SAFETY
===================================================== */

.awareness-topic-card:nth-child(3){
  --topic-accent:var(--awareness-gold);
  --topic-accent-soft:#ffe2a4;
  --topic-dark:#76501b;

  --topic-image:
    linear-gradient(
      180deg,
      rgba(34,25,10,.02) 0%,
      rgba(34,25,10,.10) 45%,
      rgba(34,25,10,.72) 100%
    ),
    url("/media/createsafety.png");
}


/* =====================================================
   04 — VETERAN SUPPORT
===================================================== */

.awareness-topic-card:nth-child(4){
  --topic-accent:var(--awareness-purple-light);
  --topic-accent-soft:#d0c0ff;
  --topic-dark:#422b78;

  --topic-image:
    linear-gradient(
      180deg,
      rgba(18,12,42,.02) 0%,
      rgba(18,12,42,.10) 45%,
      rgba(18,12,42,.74) 100%
    ),
    url("/media/vetsupport.png");
}


/* =====================================================
   05 — TRUSTED RESOURCES
===================================================== */

.awareness-topic-card:nth-child(5){
  --topic-accent:var(--awareness-blue-bright);
  --topic-accent-soft:#b9e4ff;
  --topic-dark:#0d4c85;

  --topic-image:
    linear-gradient(
      180deg,
      rgba(4,21,42,.02) 0%,
      rgba(4,21,42,.10) 45%,
      rgba(4,21,42,.74) 100%
    ),
    url("/media/resources.png");
}


/* =====================================================
   IMAGE POSITIONING
===================================================== */

.awareness-topic-card{
  background-position:center center;
  background-size:cover;
  background-repeat:no-repeat;
}


/* Individual positioning adjustments */

.awareness-topic-card:nth-child(1){
  background-position:center center;
}

.awareness-topic-card:nth-child(2){
  background-position:center center;
}

.awareness-topic-card:nth-child(3){
  background-position:center center;
}

.awareness-topic-card:nth-child(4){
  background-position:center center;
}

.awareness-topic-card:nth-child(5){
  background-position:center center;
}


/* =====================================================
   COLOR OVERLAY
===================================================== */

.awareness-topic-card::before{
  content:"";

  position:absolute;
  z-index:0;
  inset:0;

  width:auto;
  height:auto;

  background:
    linear-gradient(
      135deg,
      var(--topic-dark),
      var(--topic-accent)
    );

  border-radius:0;
  opacity:0;

  transition:
    opacity .35s ease;
}


/* =====================================================
   BOTTOM TITLE STRIP
===================================================== */

.awareness-topic-card::after{
  content:"";

  position:absolute;
  z-index:1;
  right:0;
  bottom:0;
  left:0;

  height:64px;

  background:
    linear-gradient(
      100deg,
      var(--topic-dark),
      color-mix(
        in srgb,
        var(--topic-accent) 78%,
        var(--topic-dark)
      )
    );

  border-top:1px solid rgba(255,255,255,.22);

  transition:
    height .35s ease,
    background .35s ease;
}


/* =====================================================
   CARD HOVER AND ACTIVE STATE
===================================================== */

.awareness-topic-card:hover,
.awareness-topic-card:focus-visible,
.awareness-topic-card.is-card-active{
  border-color:var(--topic-accent);

  transform:
    translateY(-7px);

  box-shadow:
    0 30px 70px rgba(4,21,42,.24),
    0 0 0 1px rgba(77,180,255,.16);
}


.awareness-topic-card:hover::before,
.awareness-topic-card:focus-visible::before,
.awareness-topic-card.is-card-active::before{
  opacity:.72;
}


.awareness-topic-card:hover::after,
.awareness-topic-card:focus-visible::after,
.awareness-topic-card.is-card-active::after{
  height:142px;
}


/* =====================================================
   CARD NUMBER
===================================================== */

.awareness-topic-card__number{
  position:absolute;
  z-index:4;
  top:20px;
  left:20px;

  display:grid;
  place-items:center;

  width:44px;
  height:44px;
  margin:0;

  color:var(--awareness-white);
  background:rgba(4,21,42,.72);

  border:1px solid var(--topic-accent-soft);
  border-radius:50%;

  font-family:"Montserrat",Arial,sans-serif;
  font-size:.67rem;
  font-weight:900;
  line-height:1;
  letter-spacing:.08em;

  box-shadow:
    0 12px 28px rgba(4,21,42,.28);

  backdrop-filter:blur(9px);
}


.awareness-topic-card__number::before{
  content:"";

  position:absolute;
  z-index:-1;

  width:66px;
  height:66px;

  border:1px solid rgba(255,255,255,.15);
  border-radius:50%;

  opacity:.65;
}


.awareness-topic-card__number::after{
  content:"";

  position:absolute;
  z-index:-2;

  width:92px;
  height:92px;

  border:1px solid rgba(255,255,255,.18);
  border-radius:50%;

  animation:
    awarenessTopicPulse
    4s
    ease-in-out
    infinite;
}


/* =====================================================
   CARD TITLE
===================================================== */

.awareness-topic-card__title{
  position:absolute;
  z-index:4;
  right:24px;
  bottom:17px;
  left:24px;

  display:block;
  margin:0;

  color:var(--awareness-white);

  font-family:"Cormorant Garamond",Georgia,serif;
  font-size:clamp(1.55rem,2vw,1.95rem);
  font-weight:700;
  line-height:1;
  letter-spacing:-.02em;

  text-shadow:
    0 5px 18px rgba(0,0,0,.34);

  transition:
    bottom .35s ease,
    transform .35s ease;
}


/* =====================================================
   CARD DESCRIPTION
===================================================== */

.awareness-topic-card__copy{
  position:absolute;
  z-index:4;
  right:24px;
  bottom:18px;
  left:24px;

  display:-webkit-box;
  margin:0;
  overflow:hidden;

  color:rgba(255,255,255,.88);

  font-size:.8rem;
  line-height:1.55;

  opacity:0;

  transform:
    translateY(16px);

  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;

  transition:
    opacity .25s ease .08s,
    transform .3s ease .08s;
}


/* =====================================================
   CARD ACTION
===================================================== */

.awareness-topic-card__action{
  position:absolute;
  z-index:5;
  top:46%;
  left:50%;

  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;

  width:max-content;
  max-width:calc(100% - 40px);
  min-height:48px;
  margin:0;
  padding:11px 21px;

  color:var(--awareness-white);
  background:rgba(4,21,42,.54);

  border:2px solid rgba(255,255,255,.9);
  border-radius:4px;

  font-family:"Montserrat",Arial,sans-serif;
  font-size:.7rem;
  font-weight:900;
  line-height:1.25;
  letter-spacing:.07em;
  text-align:center;
  text-transform:uppercase;

  opacity:0;

  box-shadow:
    0 14px 32px rgba(4,21,42,.28);

  backdrop-filter:blur(8px);

  transform:
    translate(-50%,-38%)
    scale(.96);

  transition:
    opacity .25s ease,
    transform .3s ease,
    color .25s ease,
    background-color .25s ease,
    border-color .25s ease,
    box-shadow .25s ease;
}


.awareness-topic-card__action::after{
  content:"→";

  display:inline-block;

  color:var(--topic-accent-soft);

  transition:
    transform .2s ease;
}


.awareness-topic-card__action:hover{
  color:var(--awareness-navy-deep);
  background:var(--topic-accent-soft);
  border-color:var(--topic-accent-soft);

  box-shadow:
    0 18px 38px rgba(4,21,42,.32);
}


.awareness-topic-card__action:hover::after{
  color:var(--awareness-navy-deep);

  transform:
    translateX(4px);
}


/* =====================================================
   HOVER CONTENT MOVEMENT
===================================================== */

.awareness-topic-card:hover
.awareness-topic-card__title,
.awareness-topic-card:focus-visible
.awareness-topic-card__title,
.awareness-topic-card.is-card-active
.awareness-topic-card__title{
  bottom:93px;
}


.awareness-topic-card:hover
.awareness-topic-card__copy,
.awareness-topic-card:focus-visible
.awareness-topic-card__copy,
.awareness-topic-card.is-card-active
.awareness-topic-card__copy{
  opacity:1;

  transform:
    translateY(0);
}


.awareness-topic-card:hover
.awareness-topic-card__action,
.awareness-topic-card:focus-visible
.awareness-topic-card__action,
.awareness-topic-card.is-card-active
.awareness-topic-card__action{
  opacity:1;

  transform:
    translate(-50%,-50%)
    scale(1);
}


/* =====================================================
   INDIVIDUAL CARD BUTTON COLORS
===================================================== */

.awareness-topic-card:nth-child(1)
.awareness-topic-card__action:hover{
  background:#8be7eb;
  border-color:#8be7eb;
}


.awareness-topic-card:nth-child(2)
.awareness-topic-card__action:hover{
  background:#72eee5;
  border-color:#72eee5;
}


.awareness-topic-card:nth-child(3)
.awareness-topic-card__action:hover{
  background:#ffe09c;
  border-color:#ffe09c;
}


.awareness-topic-card:nth-child(4)
.awareness-topic-card__action:hover{
  color:#ffffff;
  background:#9169eb;
  border-color:#c8b5ff;
}


.awareness-topic-card:nth-child(4)
.awareness-topic-card__action:hover::after{
  color:#ffffff;
}


.awareness-topic-card:nth-child(5)
.awareness-topic-card__action:hover{
  background:#9edcff;
  border-color:#9edcff;
}


/* =====================================================
   CARD DECORATIVE CORNERS
===================================================== */


.awareness-topic-card .awareness-topic-card__corner{
  position:absolute;
  z-index:3;
  top:0;
  right:0;

  width:72px;
  height:72px;

  border-top:1px solid rgba(255,255,255,.28);
  border-right:1px solid rgba(255,255,255,.28);

  pointer-events:none;
}


.awareness-topic-card .awareness-topic-card__corner::before{
  content:"";

  position:absolute;
  top:14px;
  right:14px;

  width:7px;
  height:7px;

  background:var(--topic-accent-soft);
  border-radius:50%;

  box-shadow:
    0 0 14px var(--topic-accent);
}


/* =====================================================
   CARD FOCUS
===================================================== */

.awareness-topic-card:focus-visible{
  outline:3px solid var(--topic-accent-soft);
  outline-offset:5px;
}


/* =====================================================
   CARD ANIMATIONS
===================================================== */

@keyframes awarenessTopicPulse{

  0%,
  100%{
    opacity:.35;

    transform:
      scale(.82);
  }

  50%{
    opacity:.8;

    transform:
      scale(1);
  }

}


/* =====================================================
   LARGE TABLET
===================================================== */

@media(max-width:1150px){

  .awareness-topic-grid{
    grid-template-columns:
      repeat(3,minmax(0,1fr));
  }

  .awareness-topic-card:nth-child(4),
  .awareness-topic-card:nth-child(5){
    min-height:320px;
  }

}


/* =====================================================
   TABLET
===================================================== */

@media(max-width:880px){

  .awareness-topic-grid{
    grid-template-columns:
      repeat(2,minmax(0,1fr));
  }

  .awareness-topic-card:last-child{
    grid-column:1 / -1;
  }

}


/* =====================================================
   TOUCH DEVICES
===================================================== */

@media(hover:none){

  .awareness-topic-card{
    min-height:330px;
  }

  .awareness-topic-card::before{
    opacity:.58;
  }

  .awareness-topic-card::after{
    height:142px;
  }

  .awareness-topic-card__title{
    bottom:93px;
  }

  .awareness-topic-card__copy{
    opacity:1;

    transform:none;
  }

  .awareness-topic-card__action{
    top:42%;
    opacity:1;

    transform:
      translate(-50%,-50%)
      scale(1);
  }

}


/* =====================================================
   MOBILE
===================================================== */

@media(max-width:640px){

  .awareness-topic-grid{
    grid-template-columns:1fr;
    gap:18px;
  }

  .awareness-topic-card,
  .awareness-topic-card:last-child{
    grid-column:auto;
    min-height:350px;
  }

  .awareness-topic-card::before{
    opacity:.58;
  }

  .awareness-topic-card::after{
    height:142px;
  }

  .awareness-topic-card__title{
    bottom:93px;
  }

  .awareness-topic-card__copy{
    opacity:1;

    transform:none;
  }

  .awareness-topic-card__action{
    top:42%;
    opacity:1;

    transform:
      translate(-50%,-50%)
      scale(1);
  }

}


@media(max-width:390px){

  .awareness-topic-card{
    min-height:330px;
  }

  .awareness-topic-card__title,
  .awareness-topic-card__copy{
    right:19px;
    left:19px;
  }

  .awareness-topic-card__title{
    font-size:1.5rem;
  }

  .awareness-topic-card__copy{
    font-size:.76rem;
  }

  .awareness-topic-card__action{
    width:calc(100% - 76px);
    padding-inline:14px;
  }

}


/* =====================================================
   REDUCED MOTION
===================================================== */

@media(prefers-reduced-motion:reduce){

  .awareness-topic-card,
  .awareness-topic-card::before,
  .awareness-topic-card::after,
  .awareness-topic-card__title,
  .awareness-topic-card__copy,
  .awareness-topic-card__action{
    transition:none;
  }

  .awareness-topic-card__number::after{
    animation:none;
  }

}

/* =====================================================
   HELP SOMEONE GUIDE MODAL
===================================================== */

.help-guide-modal{
  width:min(1180px,calc(100% - 36px));
  max-width:none;
  max-height:calc(100dvh - 34px);
  margin:auto;
  padding:0;

  color:var(--awareness-ink);
  background:transparent;

  border:0;
  border-radius:5px;

  overflow:hidden;

  box-shadow:
    0 40px 120px rgba(1,10,24,.58),
    0 0 0 1px rgba(255,255,255,.08);
}

.help-guide-modal[open]{
  display:block;

  animation:
    helpGuideModalIn
    .28s ease both;
}

.help-guide-modal::backdrop{
  background:
    radial-gradient(
      circle at 18% 18%,
      rgba(242,182,93,.18),
      transparent 30%
    ),
    radial-gradient(
      circle at 85% 82%,
      rgba(24,181,187,.20),
      transparent 34%
    ),
    rgba(2,13,27,.91);

  backdrop-filter:blur(11px);
}

@keyframes helpGuideModalIn{

  from{
    opacity:0;

    transform:
      translateY(24px)
      scale(.985);
  }

  to{
    opacity:1;

    transform:
      translateY(0)
      scale(1);
  }

}


/* =====================================================
   MODAL SHELL AND SCROLLING
===================================================== */

.help-guide-modal__shell{
  position:relative;

  max-height:calc(100dvh - 34px);

  background:
    radial-gradient(
      circle at 96% 25%,
      rgba(242,182,93,.10),
      transparent 28%
    ),
    radial-gradient(
      circle at 4% 65%,
      rgba(24,181,187,.08),
      transparent 28%
    ),
    linear-gradient(
      180deg,
      #ffffff,
      #f8fbfd 58%,
      #fffaf1
    );

  border:1px solid rgba(242,182,93,.34);
  border-top:5px solid var(--awareness-gold);
  border-radius:5px;

  overflow-y:auto;
  overscroll-behavior:contain;

  scrollbar-color:
    var(--awareness-gold)
    rgba(9,43,87,.08);

  scrollbar-width:thin;
}

.help-guide-modal__shell::-webkit-scrollbar{
  width:10px;
}

.help-guide-modal__shell::-webkit-scrollbar-track{
  background:rgba(9,43,87,.07);
}

.help-guide-modal__shell::-webkit-scrollbar-thumb{
  background:
    linear-gradient(
      var(--awareness-gold),
      var(--awareness-teal)
    );

  border:2px solid #f5f8fa;
  border-radius:999px;
}


/* =====================================================
   CLOSE BUTTON
===================================================== */

.help-guide-modal .awareness-modal__close{
  position:sticky;
  z-index:50;
  top:18px;
  right:auto;
  left:auto;

  display:flex;
  align-items:center;
  justify-content:center;

  width:46px;
  height:46px;
  margin:
    18px
    18px
    -64px
    auto;
  padding:0;

  color:var(--awareness-navy-deep);
  background:rgba(255,250,241,.94);

  border:1px solid rgba(242,182,93,.72);
  border-radius:50%;

  font-size:1.55rem;
  line-height:1;

  cursor:pointer;

  box-shadow:
    0 14px 34px rgba(4,21,42,.28);

  backdrop-filter:blur(12px);

  transition:
    color .2s ease,
    background-color .2s ease,
    border-color .2s ease,
    transform .2s ease;
}

.help-guide-modal .awareness-modal__close:hover,
.help-guide-modal .awareness-modal__close:focus-visible{
  color:var(--awareness-white);
  background:var(--awareness-teal-dark);
  border-color:var(--awareness-teal);

  transform:rotate(90deg);
}


/* =====================================================
   MODAL HERO
===================================================== */

.help-guide-modal__hero{
  position:relative;
  isolation:isolate;

  display:flex;
  align-items:flex-end;

  min-height:480px;
  padding:
    76px
    clamp(30px,6vw,78px)
    58px;

  color:var(--awareness-white);

  background:
    linear-gradient(
      90deg,
      rgba(4,21,42,.98) 0%,
      rgba(5,35,61,.94) 42%,
      rgba(7,54,68,.66) 69%,
      rgba(4,21,42,.28) 100%
    ),
    linear-gradient(
      180deg,
      rgba(4,21,42,.08),
      rgba(4,21,42,.22) 58%,
      rgba(4,21,42,.72)
    ),
    url("/media/helpmodal.png")
    center center / cover no-repeat;

  border-bottom:1px solid rgba(242,182,93,.42);
}

.help-guide-modal__hero::before{
  content:"";

  position:absolute;
  z-index:-1;
  top:0;
  bottom:0;
  left:0;

  width:6px;

  background:
    linear-gradient(
      180deg,
      var(--awareness-gold),
      var(--awareness-teal)
    );
}

.help-guide-modal__hero::after{
  content:"";

  position:absolute;
  z-index:-1;
  right:0;
  bottom:0;
  left:0;

  height:5px;

  background:
    linear-gradient(
      90deg,
      var(--awareness-gold),
      var(--awareness-teal),
      var(--awareness-blue-bright)
    );
}

.help-guide-modal__hero-content{
  width:min(760px,76%);
}

.help-guide-modal__kicker{
  margin-bottom:18px;

  color:#ffe2a4;
}

.help-guide-modal__hero h2{
  max-width:720px;
  margin:0 0 22px;

  color:var(--awareness-white);

  font-family:"Cormorant Garamond",Georgia,serif;
  font-size:clamp(3.2rem,6vw,5.7rem);
  font-weight:700;
  line-height:.91;
  letter-spacing:-.045em;

  text-shadow:
    0 14px 38px rgba(0,0,0,.30);
}

.help-guide-modal__introduction{
  max-width:700px;
  margin:0;

  color:rgba(255,255,255,.86);

  font-size:1.02rem;
  line-height:1.82;
}


/* =====================================================
   FIVE-STEP HERO PATH
===================================================== */

.help-guide-modal__path{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:0;

  max-width:720px;
  margin-top:34px;

  background:rgba(255,255,255,.07);

  border:1px solid rgba(255,226,164,.30);

  backdrop-filter:blur(10px);
}

.help-guide-modal__path span{
  position:relative;

  display:flex;
  align-items:center;
  justify-content:center;

  min-height:48px;
  padding:10px 15px;

  color:rgba(255,255,255,.84);

  border-right:1px solid rgba(255,255,255,.14);

  font-family:"Montserrat",Arial,sans-serif;
  font-size:.64rem;
  font-weight:900;
  line-height:1.2;
  letter-spacing:.08em;
  text-align:center;
  text-transform:uppercase;
}

.help-guide-modal__path span:last-child{
  border-right:0;
}

.help-guide-modal__path span::after{
  content:"";

  position:absolute;
  right:-5px;
  z-index:2;

  width:9px;
  height:9px;

  background:var(--awareness-gold);
  border:2px solid rgba(4,21,42,.85);
  border-radius:50%;
}

.help-guide-modal__path span:last-child::after{
  display:none;
}


/* =====================================================
   MAIN GUIDE CONTENT
===================================================== */

.help-guide-modal__content{
  padding:
    68px
    clamp(30px,6vw,78px)
    0;
}


/* =====================================================
   SHARED GUIDE SECTION
===================================================== */

.help-guide-section{
  margin-bottom:72px;
}

.help-guide-section__heading{
  max-width:790px;
  margin-bottom:36px;
}

.help-guide-section__eyebrow{
  margin:0 0 10px;

  color:var(--awareness-teal-dark);

  font-family:"Montserrat",Arial,sans-serif;
  font-size:.68rem;
  font-weight:900;
  line-height:1.4;
  letter-spacing:.17em;
  text-transform:uppercase;
}

.help-guide-section__heading h3{
  margin:0 0 16px;

  color:var(--awareness-navy-deep);

  font-family:"Cormorant Garamond",Georgia,serif;
  font-size:clamp(2.5rem,4.5vw,4.15rem);
  font-weight:700;
  line-height:.98;
  letter-spacing:-.035em;
}

.help-guide-section__heading > p:last-child{
  max-width:740px;
  margin:0;

  color:var(--awareness-copy);
  line-height:1.78;
}


/* =====================================================
   FIVE ACTION STEPS
===================================================== */

.help-guide-steps{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:16px;

  margin:0;
  padding:0;

  list-style:none;
}

.help-guide-step{
  position:relative;
  isolation:isolate;
  overflow:hidden;

  display:grid;
  grid-template-columns:66px minmax(0,1fr);
  gap:22px;

  min-height:290px;
  padding:31px;

  background:
    linear-gradient(
      145deg,
      rgba(255,255,255,.98),
      rgba(239,247,253,.94)
    );

  border:1px solid rgba(9,43,87,.14);
  border-top:4px solid var(--awareness-blue);

  box-shadow:
    0 18px 40px rgba(4,21,42,.08);

  transition:
    transform .25s ease,
    box-shadow .25s ease,
    border-color .25s ease;
}

.help-guide-step:nth-child(2){
  border-top-color:var(--awareness-teal);
}

.help-guide-step:nth-child(3){
  border-top-color:var(--awareness-gold);
}

.help-guide-step:nth-child(4){
  border-top-color:var(--awareness-purple-light);
}

.help-guide-step:nth-child(5){
  grid-column:1 / -1;

  min-height:245px;

  border-top-color:var(--awareness-blue-bright);
}

.help-guide-step::after{
  content:"";

  position:absolute;
  z-index:-1;
  right:-70px;
  bottom:-90px;

  width:210px;
  height:210px;

  background:
    radial-gradient(
      circle,
      rgba(77,180,255,.12),
      transparent 68%
    );

  border:1px solid rgba(77,180,255,.12);
  border-radius:50%;
}

.help-guide-step:nth-child(2)::after{
  background:
    radial-gradient(
      circle,
      rgba(24,181,187,.13),
      transparent 68%
    );
}

.help-guide-step:nth-child(3)::after{
  background:
    radial-gradient(
      circle,
      rgba(242,182,93,.16),
      transparent 68%
    );
}

.help-guide-step:nth-child(4)::after{
  background:
    radial-gradient(
      circle,
      rgba(154,117,229,.14),
      transparent 68%
    );
}

.help-guide-step:hover{
  border-color:rgba(30,123,216,.34);

  transform:translateY(-4px);

  box-shadow:
    0 26px 54px rgba(4,21,42,.13);
}


/* =====================================================
   STEP NUMBER
===================================================== */

.help-guide-step__number{
  display:grid;
  place-items:center;

  width:64px;
  height:64px;

  color:var(--awareness-white);

  background:
    linear-gradient(
      135deg,
      var(--awareness-navy),
      var(--awareness-blue)
    );

  border:1px solid rgba(77,180,255,.44);
  border-radius:50%;

  font-family:"Montserrat",Arial,sans-serif;
  font-size:.73rem;
  font-weight:900;
  line-height:1;
  letter-spacing:.08em;

  box-shadow:
    0 14px 28px rgba(4,21,42,.18);
}

.help-guide-step:nth-child(2)
.help-guide-step__number{
  background:
    linear-gradient(
      135deg,
      var(--awareness-teal-dark),
      var(--awareness-teal)
    );
}

.help-guide-step:nth-child(3)
.help-guide-step__number{
  color:var(--awareness-navy-deep);

  background:
    linear-gradient(
      135deg,
      #d89a3f,
      #ffe2a4
    );

  border-color:rgba(118,80,27,.28);
}

.help-guide-step:nth-child(4)
.help-guide-step__number{
  background:
    linear-gradient(
      135deg,
      var(--awareness-purple),
      var(--awareness-purple-light)
    );
}

.help-guide-step:nth-child(5)
.help-guide-step__number{
  background:
    linear-gradient(
      135deg,
      var(--awareness-navy-light),
      var(--awareness-blue-bright)
    );
}


/* =====================================================
   STEP CONTENT
===================================================== */

.help-guide-step__label{
  margin:0 0 5px;

  color:var(--awareness-blue);

  font-family:"Montserrat",Arial,sans-serif;
  font-size:.61rem;
  font-weight:900;
  line-height:1.35;
  letter-spacing:.14em;
  text-transform:uppercase;
}

.help-guide-step:nth-child(2)
.help-guide-step__label{
  color:var(--awareness-teal-dark);
}

.help-guide-step:nth-child(3)
.help-guide-step__label{
  color:#966316;
}

.help-guide-step:nth-child(4)
.help-guide-step__label{
  color:var(--awareness-purple);
}

.help-guide-step__content h4{
  margin:0 0 12px;

  color:var(--awareness-navy-deep);

  font-family:"Cormorant Garamond",Georgia,serif;
  font-size:1.9rem;
  font-weight:700;
  line-height:1;
}

.help-guide-step__content > p:not(.help-guide-step__label){
  margin:0;

  color:var(--awareness-copy);

  font-size:.86rem;
  line-height:1.72;
}


/* =====================================================
   STEP CONVERSATION EXAMPLE
===================================================== */

.help-guide-step__example{
  position:relative;

  margin:21px 0 0;
  padding:15px 17px 15px 42px;

  color:var(--awareness-navy-deep);
  background:rgba(220,239,255,.58);

  border:0;
  border-left:3px solid var(--awareness-blue);

  font-family:"Cormorant Garamond",Georgia,serif;
  font-size:1.08rem;
  font-weight:700;
  line-height:1.45;
}

.help-guide-step__example::before{
  content:"“";

  position:absolute;
  top:5px;
  left:13px;

  color:var(--awareness-blue);

  font-family:Georgia,serif;
  font-size:2.25rem;
  line-height:1;
}

.help-guide-step:nth-child(2)
.help-guide-step__example{
  background:rgba(221,248,248,.72);
  border-left-color:var(--awareness-teal);
}

.help-guide-step:nth-child(3)
.help-guide-step__example{
  background:rgba(255,241,212,.72);
  border-left-color:var(--awareness-gold);
}

.help-guide-step:nth-child(4)
.help-guide-step__example{
  background:rgba(238,232,255,.72);
  border-left-color:var(--awareness-purple-light);
}


/* =====================================================
   CONVERSATION GUIDE
===================================================== */

.help-conversation{
  margin:
    0
    calc(clamp(30px,6vw,78px) * -1);
  padding:
    70px
    clamp(30px,6vw,78px);

  background:
    radial-gradient(
      circle at 95% 10%,
      rgba(242,182,93,.10),
      transparent 28%
    ),
    linear-gradient(
      135deg,
      #f8fcff,
      #fffaf1
    );

  border-top:1px solid rgba(9,43,87,.12);
  border-bottom:1px solid rgba(9,43,87,.12);
}

.help-conversation__grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:18px;
}

.help-conversation-card{
  position:relative;
  overflow:hidden;

  padding:32px;

  background:rgba(255,255,255,.94);

  border:1px solid rgba(9,43,87,.13);

  box-shadow:
    0 18px 42px rgba(4,21,42,.08);
}

.help-conversation-card--say{
  border-top:5px solid var(--awareness-teal);
}

.help-conversation-card--avoid{
  border-top:5px solid #c35d78;
}

.help-conversation-card__heading{
  display:flex;
  align-items:center;
  gap:14px;

  margin-bottom:25px;
}

.help-conversation-card__icon{
  display:grid;
  place-items:center;

  width:43px;
  height:43px;
  flex:0 0 43px;

  color:var(--awareness-white);
  background:var(--awareness-teal-dark);
  border-radius:50%;

  font-family:"Montserrat",Arial,sans-serif;
  font-size:1.15rem;
  font-weight:900;
}

.help-conversation-card--avoid
.help-conversation-card__icon{
  background:#9d425c;
}

.help-conversation-card h4{
  margin:0;

  color:var(--awareness-navy-deep);

  font-family:"Cormorant Garamond",Georgia,serif;
  font-size:1.75rem;
  line-height:1;
}

.help-conversation-card ul{
  display:grid;
  gap:11px;

  margin:0;
  padding:0;

  list-style:none;
}

.help-conversation-card li{
  position:relative;

  min-height:44px;
  padding:12px 15px 12px 38px;

  color:var(--awareness-copy);
  background:#f7fbfd;

  border:1px solid rgba(9,43,87,.09);

  font-size:.82rem;
  line-height:1.55;
}

.help-conversation-card li::before{
  content:"";

  position:absolute;
  top:19px;
  left:17px;

  width:8px;
  height:8px;

  background:var(--awareness-teal);
  border-radius:50%;

  box-shadow:
    0 0 0 4px rgba(24,181,187,.12);
}

.help-conversation-card--avoid li{
  background:#fff7f9;
}

.help-conversation-card--avoid li::before{
  background:#c35d78;

  box-shadow:
    0 0 0 4px rgba(195,93,120,.12);
}


/* =====================================================
   URGENT HELP PANEL
===================================================== */

.help-guide-urgent{
  position:relative;
  overflow:hidden;

  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(290px,.72fr);
  align-items:center;
  gap:42px;

  margin:
    0
    calc(clamp(30px,6vw,78px) * -1);
  padding:
    58px
    clamp(30px,6vw,78px);

  color:var(--awareness-white);

  background:
    radial-gradient(
      circle at 92% 20%,
      rgba(242,182,93,.22),
      transparent 28%
    ),
    linear-gradient(
      110deg,
      var(--awareness-navy-deep),
      #0a3d64 55%,
      #075d66
    );

  border-top:5px solid var(--awareness-gold);
}

.help-guide-urgent::after{
  content:"";

  position:absolute;
  right:-100px;
  bottom:-150px;

  width:340px;
  height:340px;

  border:
    1px solid
    rgba(255,226,164,.15);
  border-radius:50%;

  pointer-events:none;
}

.help-guide-urgent__content{
  position:relative;
  z-index:2;
}

.help-guide-urgent__eyebrow{
  margin:0 0 10px;

  color:#ffe2a4;

  font-family:"Montserrat",Arial,sans-serif;
  font-size:.66rem;
  font-weight:900;
  letter-spacing:.17em;
  text-transform:uppercase;
}

.help-guide-urgent h3{
  max-width:650px;
  margin:0 0 18px;

  color:var(--awareness-white);

  font-family:"Cormorant Garamond",Georgia,serif;
  font-size:clamp(2.35rem,4vw,3.8rem);
  font-weight:700;
  line-height:.98;
}

.help-guide-urgent__content > p:last-child{
  max-width:670px;
  margin:0;

  color:rgba(255,255,255,.78);
  line-height:1.75;
}


/* =====================================================
   URGENT ACTION BUTTONS
===================================================== */

.help-guide-urgent__actions{
  position:relative;
  z-index:2;

  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
}


/* SHARED BUTTON */

.help-guide-urgent__button{
  position:relative;
  overflow:hidden;

  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:center;
  gap:5px;

  min-width:0;
  min-height:82px;
  padding:15px 18px;

  border:1px solid rgba(255,255,255,.34);
  border-radius:4px;

  text-align:left;
  text-decoration:none;

  box-shadow:
    0 13px 28px rgba(0,0,0,.18),
    inset 0 1px 0 rgba(255,255,255,.14);

  transition:
    transform .2s ease,
    border-color .2s ease,
    box-shadow .2s ease,
    filter .2s ease;
}


/* MAIN LABEL */

.help-guide-urgent__button span{
  display:block;

  color:inherit !important;

  font-family:"Montserrat",Arial,sans-serif;
  font-size:.9rem;
  font-weight:900;
  line-height:1.15;
  letter-spacing:.01em;
}


/* SUPPORTING LABEL */

.help-guide-urgent__button small{
  display:block;

  color:inherit !important;

  font-size:.66rem;
  font-weight:600;
  line-height:1.4;

  opacity:.76;
}


/* ARROW */

.help-guide-urgent__button::after{
  content:"→";

  position:absolute;
  top:50%;
  right:17px;

  color:inherit;

  font-size:1.15rem;
  font-weight:900;

  opacity:.72;

  transform:translateY(-50%);

  transition:
    transform .2s ease,
    opacity .2s ease;
}


/* CALL 988 */

.help-guide-urgent__button--primary{
  color:#ffffff;

  background:
    linear-gradient(
      135deg,
      #087f88,
      #18aeb5
    );

  border-color:rgba(139,231,235,.58);
}


/* TEXT 988 */

.help-guide-urgent__button--secondary{
  color:#ffffff;

  background:
    linear-gradient(
      135deg,
      #145d9c,
      #2489d8
    );

  border-color:rgba(185,228,255,.55);
}


/* CALL 911 */

.help-guide-urgent__button--emergency{
  grid-column:1 / -1;

  color:#ffffff;

  background:
    linear-gradient(
      135deg,
      #84384f,
      #a94d69
    );

  border-color:rgba(255,171,193,.62);
}


/* HOVER */

.help-guide-urgent__button:hover{
  color:#ffffff;

  filter:brightness(1.08);

  transform:translateY(-3px);

  box-shadow:
    0 18px 35px rgba(0,0,0,.24),
    inset 0 1px 0 rgba(255,255,255,.18);
}

.help-guide-urgent__button:hover::after{
  opacity:1;

  transform:
    translate(4px,-50%);
}


/* KEYBOARD FOCUS */

.help-guide-urgent__button:focus-visible{
  outline:3px solid var(--awareness-gold);
  outline-offset:3px;
}


/* =====================================================
   URGENT BUTTONS — MOBILE
===================================================== */

@media(max-width:760px){

  .help-guide-urgent__actions{
    grid-template-columns:1fr;
  }

  .help-guide-urgent__button--emergency{
    grid-column:auto;
  }

  .help-guide-urgent__button{
    min-height:76px;
  }

}

/* =====================================================
   GUIDE SOURCES
===================================================== */

.help-guide-sources{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:32px;

  margin:
    0
    calc(clamp(30px,6vw,78px) * -1);
  padding:
    29px
    clamp(30px,6vw,78px);

  background:#fffaf1;

  border-top:1px solid rgba(118,80,27,.16);
}

.help-guide-sources > p{
  max-width:680px;
  margin:0;

  color:var(--awareness-muted);

  font-size:.74rem;
  line-height:1.62;
}

.help-guide-sources__links{
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-end;
  gap:9px;
}

.help-guide-sources__links
.awareness-text-link{
  min-height:40px;
  padding:8px 13px;

  color:var(--awareness-navy-deep);
  background:var(--awareness-white);

  border:1px solid rgba(9,43,87,.14);
  border-radius:3px;

  font-family:"Montserrat",Arial,sans-serif;
  font-size:.63rem;
  font-weight:900;
  letter-spacing:.02em;

  transition:
    color .2s ease,
    background-color .2s ease,
    border-color .2s ease;
}

.help-guide-sources__links
.awareness-text-link:hover{
  color:var(--awareness-white);
  background:var(--awareness-teal-dark);
  border-color:var(--awareness-teal-dark);
}


/* =====================================================
   TABLET
===================================================== */

@media(max-width:980px){

  .help-guide-modal__hero{
    min-height:440px;
  }

  .help-guide-modal__hero-content{
    width:min(800px,88%);
  }

  .help-guide-step{
    grid-template-columns:56px minmax(0,1fr);
    padding:26px;
  }

  .help-guide-step__number{
    width:54px;
    height:54px;
  }

  .help-guide-urgent{
    grid-template-columns:1fr;
    gap:30px;
  }

  .help-guide-urgent__actions{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }

  .help-guide-urgent__button:hover{
    transform:translateY(-3px);
  }

  .help-guide-sources{
    grid-template-columns:1fr;
  }

  .help-guide-sources__links{
    justify-content:flex-start;
  }

}


/* =====================================================
   SMALL TABLET
===================================================== */

@media(max-width:760px){

  .help-guide-modal__hero{
    min-height:520px;

    background:
      linear-gradient(
        90deg,
        rgba(4,21,42,.97),
        rgba(5,35,61,.88) 62%,
        rgba(7,54,68,.60)
      ),
      linear-gradient(
        180deg,
        rgba(4,21,42,.14),
        rgba(4,21,42,.78)
      ),
      url("/media/helpmodal.png")
      62% center / cover no-repeat;
  }

  .help-guide-modal__hero-content{
    width:100%;
  }

  .help-guide-modal__path{
    grid-template-columns:repeat(5,minmax(76px,1fr));

    overflow-x:auto;
  }

  .help-guide-steps{
    grid-template-columns:1fr;
  }

  .help-guide-step:nth-child(5){
    grid-column:auto;
    min-height:290px;
  }

  .help-conversation__grid{
    grid-template-columns:1fr;
  }

  .help-guide-urgent__actions{
    grid-template-columns:1fr;
  }

}


/* =====================================================
   MOBILE
===================================================== */

@media(max-width:640px){

  .help-guide-modal{
    width:calc(100% - 14px);
    max-height:calc(100dvh - 14px);
  }

  .help-guide-modal__shell{
    max-height:calc(100dvh - 14px);
  }

  .help-guide-modal .awareness-modal__close{
    top:11px;

    width:42px;
    height:42px;
    margin:
      11px
      11px
      -53px
      auto;
  }

  .help-guide-modal__hero{
    min-height:500px;
    padding:
      75px
      22px
      38px;

    background-position:64% center;
  }

  .help-guide-modal__hero::before{
    width:4px;
  }

  .help-guide-modal__hero h2{
    max-width:520px;

    font-size:
      clamp(
        3rem,
        14vw,
        4.5rem
      );
  }

  .help-guide-modal__introduction{
    font-size:.91rem;
    line-height:1.72;
  }

  .help-guide-modal__path{
    margin-right:-22px;
    margin-top:28px;
  }

  .help-guide-modal__path span{
    min-height:44px;
    padding:9px 12px;

    font-size:.58rem;
  }

  .help-guide-modal__content{
    padding:
      48px
      22px
      0;
  }

  .help-guide-section{
    margin-bottom:52px;
  }

  .help-guide-section__heading{
    margin-bottom:27px;
  }

  .help-guide-section__heading h3{
    font-size:
      clamp(
        2.45rem,
        12vw,
        3.35rem
      );
  }

  .help-guide-section__heading > p:last-child{
    font-size:.9rem;
  }

  .help-guide-step{
    grid-template-columns:1fr;
    gap:17px;

    min-height:0;
    padding:24px 21px;
  }

  .help-guide-step:nth-child(5){
    min-height:0;
  }

  .help-guide-step__number{
    width:50px;
    height:50px;
  }

  .help-guide-step__content h4{
    font-size:1.7rem;
  }

  .help-guide-step__example{
    padding:
      14px
      14px
      14px
      38px;

    font-size:1rem;
  }

  .help-conversation{
    margin:
      0
      -22px;
    padding:
      52px
      22px;
  }

  .help-conversation-card{
    padding:24px 20px;
  }

  .help-conversation-card h4{
    font-size:1.55rem;
  }

  .help-guide-urgent{
    margin:
      0
      -22px;
    padding:
      47px
      22px;
  }

  .help-guide-urgent h3{
    font-size:
      clamp(
        2.25rem,
        11vw,
        3.1rem
      );
  }

  .help-guide-sources{
    margin:
      0
      -22px;
    padding:
      26px
      22px;
  }

  .help-guide-sources__links{
    display:grid;
    grid-template-columns:1fr;
  }

  .help-guide-sources__links
  .awareness-text-link{
    justify-content:space-between;
  }

}


/* =====================================================
   NARROW MOBILE
===================================================== */

@media(max-width:390px){

  .help-guide-modal__hero{
    min-height:520px;
  }

  .help-guide-modal__hero h2{
    font-size:2.85rem;
  }

  .help-guide-step{
    padding:22px 18px;
  }

  .help-conversation-card{
    padding:22px 17px;
  }

  .help-conversation-card li{
    padding-right:12px;
  }

}


/* =====================================================
   REDUCED MOTION
===================================================== */

@media(prefers-reduced-motion:reduce){

  .help-guide-modal[open]{
    animation:none;
  }

  .help-guide-modal .awareness-modal__close,
  .help-guide-step,
  .help-guide-urgent__button,
  .help-guide-sources__links
  .awareness-text-link{
    transition:none;
  }

}