:root {
  --charcoal: #1c1c1c !important;
  --mid: #5a5a5a !important;
  --light: #999999 !important;
  --cream: #f3e9e2 !important;
  --white: #faf5f1 !important;
  --accent: #d98f9d !important;
  --accent-light: #f2c6cf !important;
  --border: #d98f9d !important;
  --rose: #c97c8a !important;
  --rose-deep: #c97c8a !important;
  --rose-light: #f2c6cf !important;
  --lavender: #d98f9d !important;
  --lavender-deep: #c97c8a !important;
  --lavender-light: #f2c6cf !important;
  --sage: #c9c4c0 !important;
  --sage-deep: #999999 !important;
  --sage-light: #f3e9e2 !important;
  --plum: #d98f9d !important;
  --bloom: #d98f9d !important;
  --blush: #f2c6cf !important;
}

body,
body p,
body a,
body li,
body span,
body button,
body input,
body textarea,
body select,
body h1,
body h2,
body h3,
body h4,
body h5,
body h6 {
  font-family: Calibri, Carlito, "Trebuchet MS", sans-serif !important;
}

body {
  background: var(--cream) !important;
  color: var(--charcoal) !important;
}

body::before {
  position: fixed;
  inset: 0;
  z-index: 999;
  pointer-events: none;
  content: "";
  opacity: .025;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.55'/%3E%3C/svg%3E");
}

.marquee-bar {
  background: var(--signal, #d98f9d) !important;
  color: var(--charcoal) !important;
  border-color: var(--charcoal) !important;
}

body > nav {
  max-width: 1320px !important;
  padding: 10px 18px !important;
  justify-content: space-between !important;
  background: rgba(250, 245, 241, .96) !important;
  border: 1px solid rgba(28, 28, 28, .16) !important;
  box-shadow: 0 14px 40px rgba(28, 28, 28, .12) !important;
}

body > nav .nav-logo {
  position: static !important;
  flex: 0 0 164px;
  display: flex !important;
  width: 164px !important;
  height: auto !important;
  align-items: center;
  justify-content: center;
  background: var(--cream) !important;
  padding: 2px 5px !important;
  border-radius: 2px !important;
}

body > nav .nav-logo img {
  width: 154px !important;
  height: auto !important;
}

body > nav .nav-links {
  justify-content: flex-end !important;
  gap: clamp(10px, 1.35vw, 22px) !important;
}

.nav-links a {
  color: var(--charcoal) !important;
}

.nav-links a:hover,
.nav-links a.active {
  color: var(--signal, #d98f9d) !important;
}

.nav-links .nav-cta {
  background: var(--signal, #d98f9d) !important;
  border-color: var(--signal, #d98f9d) !important;
  color: var(--charcoal) !important;
}

.hero,
.relief-hero,
.sup-hero,
.policy-hero {
  background-color: var(--cream) !important;
}

.hero h1,
.relief-hero h1,
.sup-hero h1,
.policy-hero h1,
.mission h2,
.resources h2,
.video-section h2 {
  color: var(--charcoal) !important;
  text-transform: uppercase;
  letter-spacing: -.04em !important;
}

.hero .hero-eyebrow,
.relief-hero .hero-eyebrow,
.sup-hero .sup-hero-eyebrow,
.sup-hero .hero-eyebrow,
.policy-hero .hero-eyebrow,
.hero h1 em,
.relief-hero h1 em,
.sup-hero h1 em,
.policy-hero h1 em {
  color: var(--signal, #d98f9d) !important;
}

.path-card,
.resource-card,
.accordion-item,
.reg-card,
.guide-card,
.support-card,
.rec-card {
  border-color: rgba(28, 28, 28, .18) !important;
  box-shadow: 0 12px 30px rgba(28, 28, 28, .06) !important;
}

.nsn-podcast-intro {
  position: relative;
  overflow: hidden;
  padding: clamp(70px, 10vw, 130px) 5%;
  background: var(--charcoal);
  color: var(--cream);
}

.nsn-podcast-inner {
  position: relative;
  z-index: 1;
  width: min(1080px, 100%);
  margin: auto;
  display: grid;
  grid-template-columns: minmax(230px, .65fr) minmax(0, 1.35fr);
  gap: clamp(45px, 8vw, 110px);
  align-items: center;
}

.nsn-podcast-logo {
  display: block;
  width: min(430px, 100%);
  height: auto;
  margin: auto;
  border: 10px solid var(--cream);
}

.nsn-podcast-copy,
.nsn-podcast-copy * {
  text-align: left !important;
}

.nsn-podcast-kicker {
  margin: 0 0 18px;
  color: var(--signal, #d98f9d);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .16em;
  text-transform: uppercase;
}

.nsn-podcast-copy h2 {
  margin: 0 0 20px;
  color: var(--cream) !important;
  font-size: clamp(2.5rem, 6vw, 5.4rem);
  line-height: .88;
  letter-spacing: -.055em !important;
  text-transform: uppercase;
}

.nsn-podcast-copy p {
  max-width: 650px;
  margin: 0 0 28px;
  color: var(--warm-grey, #c9c4c0) !important;
  font-size: 1.05rem;
}

.nsn-podcast-values {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 28px;
}

.nsn-podcast-values span {
  padding: 6px 10px;
  border: 1px solid rgba(243, 233, 226, .28);
  color: var(--cream);
  font-size: 11px;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.nsn-podcast-link {
  display: inline-flex;
  padding: 13px 22px;
  background: var(--signal, #d98f9d);
  color: var(--charcoal) !important;
  text-decoration: none;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
}

footer {
  background: var(--charcoal) !important;
}

.footer-logo img {
  width: 280px !important;
  height: auto !important;
  margin: auto;
}

.footer-fine {
  color: var(--warm-grey, #c9c4c0) !important;
}

.video-section-inner {
  max-width: 920px !important;
}

.video-section .sub {
  max-width: 680px !important;
  margin-bottom: 38px !important;
}

.latest-podcast-video {
  overflow: hidden;
  display: grid;
  grid-template-columns: minmax(0, 1.55fr) minmax(240px, .65fr);
  border: 1px solid rgba(28, 28, 28, .18);
  background: var(--cream);
  box-shadow: 0 28px 70px -45px rgba(28, 28, 28, .55);
}

.latest-podcast-video .video-playlist-embed {
  align-self: center;
  margin: 0;
  border-radius: 0;
}

.latest-podcast-meta,
.latest-podcast-meta * {
  text-align: left !important;
}

.latest-podcast-meta {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: clamp(28px, 4vw, 46px);
  background: var(--charcoal);
  color: var(--cream);
}

.latest-podcast-meta span {
  margin-bottom: 16px;
  color: var(--signal, #d98f9d);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.latest-podcast-meta h3 {
  margin: 0 0 15px;
  color: var(--cream);
  font-size: clamp(1.55rem, 3vw, 2.35rem);
  line-height: 1;
  text-transform: uppercase;
}

.latest-podcast-meta p {
  margin: 0 0 24px;
  color: var(--warm-grey, #c9c4c0);
  font-size: .92rem;
  line-height: 1.55;
}

.latest-podcast-meta a {
  align-self: flex-start;
  color: var(--signal, #d98f9d) !important;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .06em;
  text-underline-offset: 5px;
  text-transform: uppercase;
}

.podcast-platform-links {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 22px;
  align-self: flex-start;
}

@media (max-width: 1080px) and (min-width: 801px) {
  body > nav .nav-logo {
    flex-basis: 142px;
    width: 142px !important;
  }

  body > nav .nav-logo img {
    width: 132px !important;
  }

  body > nav .nav-links {
    gap: 9px !important;
  }

  body > nav .nav-links a {
    font-size: 12px !important;
  }
}

@media (max-width: 800px) {
  body > nav {
    top: 10px !important;
    width: calc(100% - 20px) !important;
    margin: 10px auto 0 !important;
    padding: 7px 9px !important;
    background: rgba(250, 245, 241, .97) !important;
    border: 1px solid rgba(28, 28, 28, .16) !important;
    border-radius: 16px !important;
    box-shadow: 0 12px 32px rgba(28, 28, 28, .14) !important;
    pointer-events: auto !important;
  }

  body > nav .nav-logo {
    display: flex !important;
    flex-basis: 148px;
    width: 148px !important;
  }

  body > nav .nav-logo img {
    width: 138px !important;
  }

  .nav-links {
    background: var(--cream) !important;
  }

  body > nav .nav-links {
    height: 100dvh;
    justify-content: center !important;
    gap: clamp(18px, 4vh, 32px) !important;
    padding: max(84px, env(safe-area-inset-top)) 24px max(32px, env(safe-area-inset-bottom)) !important;
  }

  .latest-podcast-video {
    grid-template-columns: 1fr;
  }

  .latest-podcast-meta,
  .latest-podcast-meta * {
    text-align: center !important;
  }

  .latest-podcast-meta a {
    align-self: center;
  }

  .podcast-platform-links {
    align-self: center;
    justify-content: center;
  }

  .nsn-podcast-inner {
    grid-template-columns: 1fr;
  }

  .nsn-podcast-logo {
    width: min(360px, 100%);
  }

  .nsn-podcast-copy,
  .nsn-podcast-copy * {
    text-align: center !important;
  }

  .nsn-podcast-values {
    justify-content: center;
  }
}

/* ==========================================================
   NO SAFETY NET — playful podcast layer
   Keeps the complete resource library while giving every page
   the bold black, cream and Signal Pink show identity.
   ========================================================== */

:root {
  --nsn-black: #1c1c1c;
  --nsn-cream: #f3e9e2;
  --nsn-paper: #fffaf6;
  --nsn-pink: #d98f9d;
  --nsn-pale: #f2c6cf;
  --nsn-rose: #d98f9d;
  --nsn-grey: #c9c4c0;
  --nsn-shadow: 7px 7px 0 var(--nsn-black);
  --nsn-shadow-pink: 7px 7px 0 var(--nsn-pink);
}

html {
  background: var(--nsn-black);
}

body {
  overflow-x: hidden;
  background:
    radial-gradient(circle at 12% 9%, rgba(217, 143, 157, .08) 0 6px, transparent 7px),
    radial-gradient(circle at 88% 24%, rgba(28, 28, 28, .05) 0 5px, transparent 6px),
    var(--nsn-cream) !important;
  background-size: 58px 58px, 72px 72px, auto !important;
}

::selection {
  background: var(--nsn-pink);
  color: var(--nsn-black);
}

.marquee-bar {
  position: relative;
  z-index: 102;
  padding: 10px 0 !important;
  overflow: hidden;
  background: var(--nsn-black) !important;
  color: var(--nsn-pink) !important;
  border-bottom: 3px solid var(--nsn-pink) !important;
  font-weight: 700;
}

.marquee-inner span::after {
  margin-left: 2.5rem;
  color: var(--nsn-cream);
  content: "✦";
}

body > nav {
  border: 2px solid var(--nsn-black) !important;
  border-radius: 14px !important;
  box-shadow: var(--nsn-shadow-pink) !important;
}

body > nav .nav-logo {
  overflow: hidden;
  border: 1px solid rgba(28, 28, 28, .12);
}

body > nav .nav-links a {
  position: relative;
  padding: 7px 2px;
}

body > nav .nav-links a::after {
  position: absolute;
  right: 0;
  bottom: 1px;
  left: 0;
  height: 3px;
  content: "";
  transform: scaleX(0);
  transform-origin: left;
  background: var(--nsn-pink);
  transition: transform .2s ease;
}

body > nav .nav-links a:hover::after,
body > nav .nav-links a.active::after {
  transform: scaleX(1);
}

body > nav .nav-links .nav-cta {
  padding: 10px 16px !important;
  border: 2px solid var(--nsn-black) !important;
  box-shadow: 3px 3px 0 var(--nsn-black);
  transition: transform .18s ease, box-shadow .18s ease;
}

body > nav .nav-links .nav-cta::after {
  display: none;
}

body > nav .nav-links .nav-cta:hover {
  transform: translate(2px, 2px);
  box-shadow: 1px 1px 0 var(--nsn-black);
}

.hero,
.relief-hero,
.sup-hero,
.policy-hero {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding-top: clamp(72px, 10vw, 130px) !important;
  padding-bottom: clamp(72px, 10vw, 130px) !important;
  background: var(--nsn-black) !important;
  color: var(--nsn-cream) !important;
}

.hero::before,
.relief-hero::before,
.sup-hero::before,
.policy-hero::before {
  position: absolute;
  right: -9vw;
  bottom: -18vw;
  z-index: -1;
  width: 42vw;
  min-width: 340px;
  aspect-ratio: 1;
  border: 3px solid rgba(217, 143, 157, .45);
  border-radius: 50%;
  content: "";
  box-shadow: 0 0 0 7vw rgba(217, 143, 157, .05), 0 0 0 14vw rgba(217, 143, 157, .025);
}

.hero::after,
.relief-hero::after,
.sup-hero::after,
.policy-hero::after {
  position: absolute;
  top: 25px;
  left: clamp(20px, 5vw, 80px);
  z-index: -1;
  width: 110px;
  height: 28px;
  content: "";
  transform: rotate(-5deg);
  background: var(--nsn-pink);
  opacity: .9;
}

.hero .hero-eyebrow,
.relief-hero .hero-eyebrow,
.sup-hero .sup-hero-eyebrow,
.sup-hero .hero-eyebrow,
.policy-hero .hero-eyebrow {
  display: inline-block !important;
  width: auto !important;
  margin-bottom: 24px !important;
  padding: 8px 13px !important;
  border: 1px solid rgba(243, 233, 226, .35) !important;
  border-radius: 999px;
  background: rgba(217, 143, 157, .12);
  color: var(--nsn-pink) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: .14em !important;
  text-transform: uppercase !important;
}

.hero h1,
.relief-hero h1,
.sup-hero h1,
.policy-hero h1 {
  position: relative;
  z-index: 1;
  max-width: 1050px !important;
  color: var(--nsn-cream) !important;
  font-size: clamp(3rem, 8vw, 7.7rem) !important;
  font-weight: 700 !important;
  line-height: .88 !important;
  letter-spacing: -.065em !important;
  text-wrap: balance;
}

.hero h1 em,
.relief-hero h1 em,
.sup-hero h1 em,
.policy-hero h1 em {
  color: var(--nsn-pink) !important;
}

.hero > p,
.relief-hero > p,
.sup-hero > p,
.policy-hero > p {
  position: relative;
  z-index: 1;
  max-width: 750px !important;
  color: var(--nsn-grey) !important;
  font-size: clamp(1rem, 1.8vw, 1.2rem) !important;
  line-height: 1.65 !important;
}

.hero-decor,
.blob {
  border: 2px solid var(--nsn-black);
  box-shadow: 4px 4px 0 var(--nsn-pink);
}

.paths {
  position: relative;
  z-index: 2;
  gap: clamp(22px, 4vw, 54px) !important;
  padding-top: clamp(55px, 8vw, 95px) !important;
  padding-bottom: clamp(55px, 8vw, 95px) !important;
  background: var(--nsn-cream) !important;
}

.path-card {
  min-height: 410px;
  overflow: hidden;
  border: 3px solid var(--nsn-black) !important;
  border-radius: 22px !important;
  box-shadow: var(--nsn-shadow) !important;
  transition: transform .22s ease, box-shadow .22s ease !important;
}

.path-card:first-child {
  background: var(--nsn-paper) !important;
  transform: rotate(-1.2deg);
}

.path-card:nth-child(2) {
  background: var(--nsn-pink) !important;
  transform: rotate(1.2deg);
}

.path-card,
.path-card .path-eyebrow,
.path-card h2,
.path-card p,
.path-card .path-arrow {
  color: var(--nsn-black) !important;
}

.path-card p {
  opacity: 1 !important;
}

.path-card:hover {
  transform: translateY(-7px) rotate(0) !important;
  box-shadow: 10px 12px 0 var(--nsn-black) !important;
}

.path-card .path-eyebrow,
.path-card .path-arrow {
  font-weight: 700 !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
}

.path-card h2 {
  font-size: clamp(2rem, 4vw, 3.8rem) !important;
  line-height: .95 !important;
  letter-spacing: -.045em !important;
}

.video-section {
  position: relative;
  padding-top: clamp(80px, 10vw, 130px) !important;
  padding-bottom: clamp(80px, 10vw, 130px) !important;
  background: var(--nsn-pale) !important;
  border-top: 3px solid var(--nsn-black);
  border-bottom: 3px solid var(--nsn-black);
}

.video-section .label,
.mission .label,
.resources .label,
.founder-inner .label,
.guides-intro .hero-eyebrow {
  color: var(--nsn-black) !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: .14em !important;
  text-transform: uppercase !important;
}

.video-section h2,
.mission h2,
.resources h2,
.guides-intro h2,
.section-title,
.strategies > h2,
.relief-section > h2 {
  color: var(--nsn-black) !important;
  font-size: clamp(2.5rem, 6vw, 5.7rem) !important;
  line-height: .9 !important;
  letter-spacing: -.055em !important;
  text-transform: uppercase !important;
  text-wrap: balance;
}

.latest-podcast-video {
  border: 3px solid var(--nsn-black) !important;
  border-radius: 20px;
  box-shadow: 10px 10px 0 var(--nsn-black) !important;
}

.latest-podcast-meta {
  background:
    radial-gradient(circle at 88% 10%, rgba(217, 143, 157, .24), transparent 30%),
    var(--nsn-black) !important;
}

.mission,
.resources,
.topics,
.truths,
.strategies,
.relief-section,
.policy,
.accordion-section,
.rec-section,
.ther-section,
.sup-section {
  padding-top: clamp(70px, 9vw, 120px) !important;
  padding-bottom: clamp(70px, 9vw, 120px) !important;
}

.mission,
.resources,
.topics,
.strategies,
.accordion-section,
.rec-section,
.ther-section,
.policy {
  background: var(--nsn-cream) !important;
}

.truths,
.relief-section:nth-of-type(even),
.topics:nth-of-type(even) {
  background: var(--nsn-paper) !important;
}

.resource-card,
.topic-card,
.truth-card,
.accordion-item,
.rec-card,
.ther-card,
.sup-card,
.relief-card,
.strategy-card,
.life-card,
.bw-card,
.reg-card,
.toolkit,
.why-box,
.try-this,
.info-callout,
.say-box,
.policy-note {
  border: 2px solid var(--nsn-black) !important;
  border-radius: 18px !important;
  box-shadow: 5px 5px 0 var(--nsn-black) !important;
}

.resource-card,
.topic-card,
.truth-card,
.accordion-item,
.rec-card,
.ther-card,
.sup-card,
.relief-card,
.strategy-card,
.life-card,
.bw-card {
  background: var(--nsn-paper) !important;
  transition: transform .2s ease, box-shadow .2s ease !important;
}

.resource-card:hover,
.topic-card:hover,
.truth-card:hover,
.rec-card:hover,
.ther-card:hover,
.sup-card:hover,
.relief-card:hover,
.strategy-card:hover,
.life-card:hover,
.bw-card:hover {
  transform: translate(-3px, -3px) rotate(-.35deg) !important;
  box-shadow: 9px 9px 0 var(--nsn-pink) !important;
}

.resource-card:nth-child(3n+2),
.topic-card:nth-child(3n+2),
.truth-card:nth-child(3n+2),
.rec-card:nth-child(3n+2),
.ther-card:nth-child(3n+2),
.sup-card:nth-child(3n+2),
.relief-card:nth-child(3n+2) {
  background: var(--nsn-pale) !important;
}

.resource-card:nth-child(3n),
.topic-card:nth-child(3n),
.truth-card:nth-child(3n),
.rec-card:nth-child(3n),
.ther-card:nth-child(3n),
.sup-card:nth-child(3n),
.relief-card:nth-child(3n) {
  border-color: var(--nsn-pink) !important;
}

.accordion-trigger,
.guide-head {
  background: var(--nsn-paper) !important;
  color: var(--nsn-black) !important;
}

.accordion-trigger:hover,
.guide-head:hover,
.guide-drop[open] > .guide-head {
  background: var(--nsn-pink) !important;
}

.accordion-icon,
.guide-chevron {
  display: inline-grid !important;
  min-width: 34px;
  min-height: 34px;
  place-items: center;
  border: 2px solid var(--nsn-black);
  border-radius: 50%;
  background: var(--nsn-pink);
  color: var(--nsn-black) !important;
  font-weight: 700;
}

.guide-drop {
  overflow: hidden;
  margin-bottom: 26px !important;
  border: 2px solid var(--nsn-black) !important;
  border-radius: 20px !important;
  background: var(--nsn-paper) !important;
  box-shadow: 6px 6px 0 var(--nsn-black);
}

.guide-inner,
.guide-inner p,
.guide-inner li,
/* :where(.guide-drop) adds no specificity, so this keeps the exact weight the
   selector had as `.guide-inner h3`. It is there only to hold the rule to the
   standalone guide pages: on guides.html the accordion guide titles are h2s
   inside .guide-inner too, and they are centred. */
:where(.guide-drop) .guide-inner :is(h2,h3),
.guide-inner :is(h3,h4),
.step-content,
.step-content p,
.step-content li,
.policy,
.policy p,
.policy li,
.ther-body,
.ther-body p,
.sup-desc,
.rec-desc {
  text-align: left !important;
}

.step {
  position: relative;
  padding: 20px !important;
  border-left: 4px solid var(--nsn-pink) !important;
  border-radius: 0 16px 16px 0;
  background: rgba(255, 250, 246, .78) !important;
}

.step-num {
  display: inline-grid !important;
  min-width: 38px;
  height: 38px;
  place-items: center;
  border: 2px solid var(--nsn-black);
  border-radius: 50%;
  background: var(--nsn-pink) !important;
  color: var(--nsn-black) !important;
  font-weight: 700 !important;
  box-shadow: 2px 2px 0 var(--nsn-black);
}

.why-box,
.try-this,
.info-callout,
.say-box,
.policy-note {
  padding: clamp(22px, 4vw, 38px) !important;
  background: var(--nsn-pale) !important;
}

.toolkit,
.reg-card {
  background:
    linear-gradient(135deg, var(--nsn-paper), var(--nsn-pale)) !important;
}

.tool-dot,
.dot {
  background: var(--nsn-pink) !important;
}

.say-line,
.relate-item,
.tool-item {
  border-color: rgba(28, 28, 28, .2) !important;
}

.say-line:nth-child(odd),
.relate-item:nth-child(odd),
.tool-item:nth-child(odd) {
  background: rgba(242, 198, 207, .45) !important;
}

.founder-note {
  position: relative;
  overflow: hidden;
  background: var(--nsn-black) !important;
  color: var(--nsn-cream) !important;
}

.founder-note::before {
  position: absolute;
  top: 0;
  right: -60px;
  width: 230px;
  height: 100%;
  content: "";
  transform: skewX(-15deg);
  background: var(--nsn-pink);
  opacity: .18;
}

.founder-note p,
.founder-note h2,
.founder-note h3 {
  color: var(--nsn-cream) !important;
}

a:not(.nav-logo):not(.path-card):not(.nav-cta):not(.nsn-podcast-link) {
  text-underline-offset: 4px;
  text-decoration-thickness: 2px;
}

footer {
  overflow: hidden;
  padding-top: 75px !important;
  background: var(--nsn-black) !important;
  border-top: 7px solid var(--nsn-pink);
}

.footer-logo img {
  border: 6px solid var(--nsn-cream);
  border-radius: 4px;
  box-shadow: 8px 8px 0 var(--nsn-pink);
}

.footer-links a {
  color: var(--nsn-cream) !important;
  font-weight: 700;
}

.footer-links a:hover {
  color: var(--nsn-pink) !important;
}

.footer-fine {
  max-width: 760px !important;
  color: var(--nsn-grey) !important;
}

@media (min-width: 801px) {
  .resource-card:nth-child(even),
  .topic-card:nth-child(even),
  .truth-card:nth-child(even),
  .rec-card:nth-child(even) {
    transform: translateY(8px);
  }
}

@media (max-width: 800px) {
  body > nav {
    box-shadow: 4px 4px 0 var(--nsn-pink) !important;
  }

  .hero,
  .relief-hero,
  .sup-hero,
  .policy-hero {
    padding-top: 95px !important;
    padding-bottom: 75px !important;
  }

  .hero h1,
  .relief-hero h1,
  .sup-hero h1,
  .policy-hero h1 {
    font-size: clamp(2.8rem, 14vw, 5rem) !important;
  }

  .path-card {
    min-height: 0;
    transform: none !important;
  }

  .latest-podcast-video,
  .guide-drop,
  .resource-card,
  .topic-card,
  .truth-card,
  .rec-card,
  .ther-card,
  .sup-card,
  .relief-card,
  .strategy-card {
    box-shadow: 4px 4px 0 var(--nsn-black) !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .path-card,
  .resource-card,
  .topic-card,
  .truth-card,
  .rec-card,
  .ther-card,
  .sup-card,
  .relief-card,
  .strategy-card,
  .life-card,
  .bw-card,
  body > nav .nav-links .nav-cta {
    transition: none !important;
  }
}
/* Keyboard shortcut shared by pages that do not load premium.css. */
.skip-link {
  position: fixed;
  top: 12px;
  left: 12px;
  z-index: 10000;
  padding: 12px 18px;
  border: 2px solid #d98f9d;
  border-radius: 999px;
  background: #1c1c1c;
  color: #fffaf6 !important;
  font-weight: 800;
  text-decoration: none;
  transform: translateY(calc(-100% - 24px));
  transition: transform .18s ease;
}

.skip-link:focus {
  transform: translateY(0);
  outline: 3px solid #fffaf6;
  outline-offset: 3px;
}
