/* =========================
   OUTLAND BOUND
   MAIN STYLESHEET
========================= */


/* =========================
   VARIABLES
========================= */

:root {
  --forest: #173b2b;
  --forest-dark: #0d281d;
  --forest-deep: #081b13;

  --green: #2f6548;
  --sage: #b8c98f;

  --cream: #f5f1e8;
  --sand: #ded4c3;

  --white: #ffffff;

  --text: #1c2821;
  --text-light: #667069;

  --max-width: 1200px;
  --radius: 18px;
}


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

* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html {
  scroll-behavior: smooth;
}

body {
  font-family: Arial, Helvetica, sans-serif;
  background: var(--cream);
  color: var(--text);
  line-height: 1.6;
}

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

a {
  color: inherit;
  text-decoration: none;
}

.container {
  width: min(90%, var(--max-width));
  margin: 0 auto;
}


/* =========================
   HEADER
========================= */

.site-header {
  background: var(--forest);
  color: var(--white);

  position: sticky;
  top: 0;
  z-index: 1000;

  box-shadow:
    0 3px 15px
    rgba(0, 0, 0, 0.15);
}

.nav-container {
  height: 150px;
  min-height: 150px;
  
  display: flex;
  align-items: center;
  justify-content: space-between;

  gap: 30px;
}


/* =========================
   LOGO
========================= */

.logo {
  display: flex;
  align-items: center;

  width: 500px;

  flex-shrink: 0;
}

.site-logo {
  display: block;

  width: 500px;
  height: auto;

  max-width: none;

  object-fit: contain;

  transform: translateY(35px);
}


/* =========================
   NAVIGATION
========================= */

.main-nav {
  display: flex;
  align-items: center;
  gap: 22px;
}

.main-nav a {
  color: var(--white);
  font-size: 1rem;
  font-weight: 700;
  opacity: 0.95;

  transition:
    color 0.2s ease,
    opacity 0.2s ease;
}

.main-nav a:hover {
  color: var(--sage);
  opacity: 1;
}


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

.hero {
  min-height: 700px;

  display: flex;
  align-items: center;

  background:
    linear-gradient(
      90deg,
      rgba(5, 25, 17, 0.9) 0%,
      rgba(5, 25, 17, 0.72) 34%,
      rgba(5, 25, 17, 0.42) 60%,
      rgba(5, 25, 17, 0.12) 100%
    ),
    url("images/hero-mountain.png");

  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.hero-content {
  max-width: 800px;
  padding: 110px 0;
}

.eyebrow {
  text-transform: uppercase;
  letter-spacing: 2.5px;

  font-size: 0.78rem;
  font-weight: 800;

  color: #5f7f65;

  margin-bottom: 18px;
}

.hero h1 {
  color: var(--white);

  font-size:
    clamp(
      3.4rem,
      8vw,
      6.6rem
    );

  line-height: 0.95;
  letter-spacing: -4px;

  max-width: 800px;

  margin-bottom: 30px;

  text-shadow:
    0 4px 22px
    rgba(0, 0, 0, 0.45);
}

.hero-text {
  max-width: 670px;

  color: #f3f5ef;

  font-size: 1.15rem;

  margin-bottom: 38px;

  text-shadow:
    0 2px 8px
    rgba(0, 0, 0, 0.55);
}

.hero-buttons {
  display: flex;
  gap: 15px;
  flex-wrap: wrap;
}


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

.button {
  display: inline-block;

  padding: 14px 25px;

  border-radius: 50px;

  font-weight: 700;

  transition:
    transform 0.25s ease,
    background 0.25s ease,
    color 0.25s ease;
}

.button-primary {
  background: var(--sage);
  color: var(--forest-dark);
}

.button-primary:hover {
  background: var(--white);
  color: var(--forest-dark);

  transform: translateY(-2px);
}

.button-secondary {
  border:
    2px solid
    rgba(255, 255, 255, 0.8);

  color: var(--white);

  background:
    rgba(0, 0, 0, 0.14);
}

.button-secondary:hover {
  background: var(--white);
  color: var(--forest-dark);

  transform: translateY(-2px);
}

.button-small {
  background: var(--forest);
  color: var(--white);

  padding: 11px 18px;

  font-size: 0.9rem;
}

.button-small:hover {
  background: var(--green);
}


/* =========================
   GENERAL SECTIONS
========================= */

.section {
  padding: 100px 0;
}

.section-alt {
  background: var(--white);
}

.section-heading {
  max-width: 720px;
  margin-bottom: 50px;
}

.section-heading h2,
.safety-section h2,
.cta-section h2 {
  font-size:
    clamp(
      2.2rem,
      5vw,
      3.7rem
    );

  line-height: 1.05;
  letter-spacing: -2px;

  margin-bottom: 20px;
}

.section-heading p:last-child {
  color: var(--text-light);
}


/* =========================
   ACTIVITY CARDS
========================= */

.card-grid {
  display: grid;

  grid-template-columns:
    repeat(3, 1fr);

  gap: 24px;
}

.activity-card {
  background: var(--white);

  padding: 36px;

  border-radius: var(--radius);

  border:
    1px solid
    rgba(23, 59, 43, 0.1);

  transition:
    transform 0.25s ease,
    box-shadow 0.25s ease;
}

.activity-card:hover {
  transform: translateY(-6px);

  box-shadow:
    0 18px 40px
    rgba(0, 0, 0, 0.08);
}

.card-icon {
  font-size: 2.3rem;
  margin-bottom: 24px;
}

.activity-card h3 {
  font-size: 1.55rem;
  margin-bottom: 12px;
}

.activity-card p {
  color: var(--text-light);
  margin-bottom: 20px;
}

.text-link {
  color: var(--green);
  font-weight: 700;
}

.text-link:hover {
  text-decoration: underline;
}


/* =========================
   FEATURED GUIDES
========================= */

.guide-grid {
  display: grid;

  grid-template-columns:
    repeat(3, 1fr);

  gap: 26px;
}

.guide-card {
  background: var(--cream);

  border-radius: var(--radius);

  overflow: hidden;

  box-shadow:
    0 10px 30px
    rgba(0, 0, 0, 0.06);

  transition:
    transform 0.25s ease,
    box-shadow 0.25s ease;
}

.guide-card:hover {
  transform: translateY(-5px);

  box-shadow:
    0 18px 45px
    rgba(0, 0, 0, 0.1);
}

.guide-image {
  min-height: 250px;

  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.hiking-photo {
  background-image:
    url("images/hiking-guide.png");
}

.camping-photo {
  background-image:
    url("images/camping-guide.png");
}

.paddling-photo {
  background-image:
    url("images/paddling-guide.png");
}

.gear-photo {
  background-image:
    url("images/gear-guide.png");
}

.guide-content {
  padding: 28px;
}

.category {
  display: inline-block;

  color: var(--green);

  text-transform: uppercase;

  font-size: 0.72rem;
  font-weight: 800;

  letter-spacing: 1.5px;

  margin-bottom: 12px;
}

.guide-card h3 {
  font-size: 1.45rem;

  line-height: 1.2;

  margin-bottom: 14px;
}

.guide-card p {
  color: var(--text-light);
  margin-bottom: 18px;
}


/* =========================
   GEAR FEATURE
========================= */

.gear-feature {
  display: grid;

  grid-template-columns:
    1.3fr 1fr;

  background: var(--white);

  border-radius: var(--radius);

  overflow: hidden;

  margin-bottom: 30px;

  box-shadow:
    0 12px 35px
    rgba(0, 0, 0, 0.07);
}

.gear-feature-image {
  min-height: 430px;

  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.gear-feature-content {
  padding: 45px;

  display: flex;
  flex-direction: column;
  justify-content: center;
}

.gear-feature-content h3 {
  font-size: 2rem;

  line-height: 1.1;

  margin-bottom: 18px;
}

.gear-feature-content p {
  color: var(--text-light);
  margin-bottom: 16px;
}

.gear-feature-content .button {
  margin-top: 10px;
  align-self: flex-start;
}


/* =========================
   GEAR CARDS
========================= */

.gear-grid {
  display: grid;

  grid-template-columns:
    repeat(3, 1fr);

  gap: 24px;

  margin-top: 30px;
}

.gear-card {
  background: var(--white);

  padding: 28px;

  border-radius: var(--radius);

  border:
    1px solid
    rgba(23, 59, 43, 0.08);
}

.gear-card h3 {
  font-size: 1.35rem;
  margin-bottom: 10px;
}

.gear-card p {
  color: var(--text-light);
  margin-bottom: 18px;
}

.affiliate-note {
  max-width: 820px;

  margin: 38px auto 0;

  text-align: center;

  font-size: 0.82rem;

  color: var(--text-light);
}


/* =========================
   SAFETY SECTION
========================= */

.safety-section {
  background: var(--forest-dark);

  color: var(--white);

  padding: 110px 0;
}

.safety-layout {
  display: grid;

  grid-template-columns:
    1fr 1fr;

  gap: 80px;

  align-items: center;
}

.safety-layout
> div:first-child
p:not(.eyebrow) {
  color: #cbd7d0;

  margin-bottom: 30px;

  max-width: 550px;
}

.safety-list {
  display: flex;
  flex-direction: column;
}

.safety-item {
  display: grid;

  grid-template-columns:
    50px 1fr;

  gap: 20px;

  padding: 25px 0;

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

.safety-item > span {
  color: var(--sage);
  font-weight: 700;
}

.safety-item h3 {
  margin-bottom: 5px;
}

.safety-item p {
  color: #b9c9c0;
  font-size: 0.93rem;
}


/* =========================
   HOMEPAGE JOURNAL
========================= */

.latest-grid {
  display: grid;

  grid-template-columns:
    repeat(3, 1fr);

  gap: 25px;
}

.latest-card {
  border-top:
    3px solid
    var(--forest);

  padding: 28px 0;
}

.latest-card h3 {
  font-size: 1.45rem;

  line-height: 1.2;

  margin-bottom: 14px;
}

.latest-card p {
  color: var(--text-light);
  margin-bottom: 18px;
}


/* =========================
   JOURNAL PAGE
========================= */

.journal-hero {
  background: var(--cream);

  padding: 85px 0 55px;
}

.journal-hero-content {
  max-width: 850px;
}

.journal-hero h1 {
  font-size:
    clamp(
      2.8rem,
      6vw,
      5rem
    );

  line-height: 1;

  letter-spacing: -3px;

  margin-bottom: 22px;
}

.journal-hero-content > p:last-child {
  color: var(--text-light);

  font-size: 1.1rem;

  max-width: 760px;
}


/* =========================
   JOURNAL CATEGORY BAR
========================= */

.journal-categories {
  background: var(--forest);

  padding: 18px 0;
}

.category-links {
  display: flex;

  align-items: center;

  gap: 12px;

  flex-wrap: wrap;
}

.category-links a {
  color: var(--white);

  padding: 8px 15px;

  border-radius: 30px;

  font-size: 0.9rem;
  font-weight: 700;

  background:
    rgba(255, 255, 255, 0.08);

  transition:
    background 0.2s ease,
    color 0.2s ease;
}

.category-links a:hover {
  background: var(--sage);
  color: var(--forest-dark);
}


/* =========================
   FEATURED JOURNAL
========================= */

.featured-journal-card {
  display: grid;

  grid-template-columns:
    1.25fr 1fr;

  background: var(--cream);

  border-radius: var(--radius);

  overflow: hidden;

  box-shadow:
    0 12px 35px
    rgba(0, 0, 0, 0.07);
}

.featured-journal-image {
  min-height: 440px;

  background-size: cover;

  background-position: center;

  background-repeat: no-repeat;
}

.featured-journal-content {
  padding: 50px;

  display: flex;

  flex-direction: column;

  justify-content: center;
}

.featured-journal-content h3 {
  font-size: 2rem;

  line-height: 1.15;

  margin-bottom: 18px;
}

.featured-journal-content p {
  color: var(--text-light);

  margin-bottom: 20px;
}


/* =========================
   ARTICLE META
========================= */

.article-meta {
  display: flex;

  gap: 12px 20px;

  flex-wrap: wrap;

  color: var(--text-light);

  font-size: 0.82rem;

  margin-bottom: 22px;
}


/* =========================
   JOURNAL GRID
========================= */

.journal-grid {
  display: grid;

  grid-template-columns:
    repeat(3, 1fr);

  gap: 28px;
}

.journal-card {
  background: var(--white);

  border-radius: var(--radius);

  overflow: hidden;

  border:
    1px solid
    rgba(23, 59, 43, 0.08);

  box-shadow:
    0 10px 30px
    rgba(0, 0, 0, 0.05);

  transition:
    transform 0.25s ease,
    box-shadow 0.25s ease;
}

.journal-card:hover {
  transform: translateY(-5px);

  box-shadow:
    0 18px 40px
    rgba(0, 0, 0, 0.09);
}

.journal-card-image {
  min-height: 230px;

  background-size: cover;

  background-position: center;

  background-repeat: no-repeat;
}

.journal-card-content {
  padding: 28px;
}

.journal-card-content h3 {
  font-size: 1.4rem;

  line-height: 1.2;

  margin-bottom: 12px;
}

.journal-card-content h3 a:hover {
  color: var(--green);
}

.journal-card-content p {
  color: var(--text-light);

  margin-bottom: 18px;
}

.journal-card-icon {
  min-height: 230px;

  display: flex;

  align-items: center;

  justify-content: center;

  font-size: 4rem;

  background: var(--sand);
}

.muted-link {
  opacity: 0.55;
  cursor: default;
}


/* =========================
   FIELD NOTES
========================= */

.field-notes-section {
  background: var(--forest-dark);

  color: var(--white);

  padding: 100px 0;
}

.field-notes-layout {
  display: grid;

  grid-template-columns:
    1.25fr 0.75fr;

  gap: 70px;

  align-items: center;
}

.field-notes-layout h2 {
  font-size:
    clamp(
      2.3rem,
      5vw,
      3.8rem
    );

  line-height: 1.05;

  letter-spacing: -2px;

  margin-bottom: 20px;
}

.field-notes-layout
> div:first-child
> p:last-child {
  color: #bdcbc3;

  max-width: 680px;
}

.field-note-box {
  background:
    rgba(255, 255, 255, 0.07);

  border:
    1px solid
    rgba(255, 255, 255, 0.12);

  border-radius: var(--radius);

  padding: 35px;
}

.field-note-box > span {
  color: var(--sage);

  text-transform: uppercase;

  font-size: 0.72rem;

  font-weight: 800;

  letter-spacing: 1.5px;
}

.field-note-box h3 {
  font-size: 1.6rem;

  margin: 12px 0;
}

.field-note-box p {
  color: #bdcbc3;
}


/* =========================
   ARTICLE PAGES
========================= */

.article-hero {
  background:
    linear-gradient(
      rgba(8, 27, 19, 0.72),
      rgba(8, 27, 19, 0.82)
    ),
    url("images/hiking-guide.png");

  background-size: cover;
  background-position: center;

  color: var(--white);

  padding: 95px 0;
}

.paddle-article-hero {
  background:
    linear-gradient(
      rgba(8, 27, 19, 0.68),
      rgba(8, 27, 19, 0.82)
    ),
    url("images/paddling-guide.png");

  background-size: cover;
  background-position: center;
}

.article-hero-content {
  max-width: 850px;
}

.article-back-link {
  display: inline-block;

  color: var(--sage);

  font-weight: 700;

  margin-bottom: 26px;
}

.article-hero h1 {
  font-size:
    clamp(
      2.8rem,
      6vw,
      5rem
    );

  line-height: 1;

  letter-spacing: -3px;

  margin-bottom: 24px;
}

.article-hero-intro {
  max-width: 720px;

  color: #edf3ee;

  font-size: 1.1rem;

  margin-bottom: 25px;
}

.article-meta-light {
  color: #d7e2da;
}


/* =========================
   ARTICLE BODY
========================= */

.article-section {
  padding: 90px 0;
}

.article-layout {
  display: grid;

  grid-template-columns:
    minmax(0, 1fr)
    320px;

  gap: 60px;

  align-items: start;
}

.article-content {
  min-width: 0;
}

.article-content > p {
  margin-bottom: 22px;
}

.article-lead {
  font-size: 1.18rem;

  color: #34443a;

  margin-bottom: 25px;
}

.article-block {
  padding: 55px 0;

  border-bottom:
    1px solid
    rgba(23, 59, 43, 0.12);
}

.article-block:first-of-type {
  padding-top: 35px;
}

.article-block h2 {
  font-size:
    clamp(
      2rem,
      4vw,
      3rem
    );

  line-height: 1.08;

  letter-spacing: -1.5px;

  margin-bottom: 20px;
}

.article-block h3 {
  font-size: 1.35rem;

  margin-top: 28px;
  margin-bottom: 10px;
}

.article-block p {
  color: var(--text-light);

  margin-bottom: 18px;
}


/* =========================
   ARTICLE LISTS
========================= */

.article-checklist,
.article-number-list {
  margin-top: 20px;
  padding-left: 22px;
}

.article-checklist li,
.article-number-list li {
  margin-bottom: 12px;
}

.checklist-box {
  background: var(--white);

  border:
    1px solid
    rgba(23, 59, 43, 0.1);

  border-radius: var(--radius);

  padding: 30px;

  margin-top: 25px;
}

.checklist-box h3 {
  margin-top: 0;
}


/* =========================
   ARTICLE TIP BOX
========================= */

.trailready-tip {
  background:
    rgba(184, 201, 143, 0.18);

  border-left:
    5px solid
    var(--sage);

  border-radius:
    0 var(--radius) var(--radius) 0;

  padding: 28px;

  margin: 30px 0;
}

.trailready-tip > span {
  color: var(--green);

  font-size: 0.72rem;
  font-weight: 800;

  text-transform: uppercase;

  letter-spacing: 1.5px;
}

.trailready-tip h3 {
  margin-top: 8px;
}


/* =========================
   WARNING BOX
========================= */

.warning-box {
  background: #f3e4d4;

  border-left:
    5px solid #9d6235;

  border-radius:
    0 var(--radius) var(--radius) 0;

  padding: 28px;

  margin: 30px 0;
}

.warning-box h3 {
  margin-top: 0;
}


/* =========================
   ARTICLE GEAR GRID
========================= */

.article-gear-grid {
  display: grid;

  grid-template-columns:
    repeat(3, 1fr);

  gap: 20px;

  margin-top: 30px;
}

.article-gear-card {
  background: var(--white);

  border:
    1px solid
    rgba(23, 59, 43, 0.08);

  border-radius: var(--radius);

  padding: 25px;
}

.article-gear-card h3 {
  margin-top: 0;
}

.coming-soon-label {
  display: inline-block;

  color: var(--green);

  font-size: 0.78rem;
  font-weight: 700;

  margin-top: 8px;
}


/* =========================
   FIELD NOTES ARTICLE
========================= */

.field-notes-article {
  background: var(--forest-dark);

  color: var(--white);

  border-radius: var(--radius);

  padding: 40px;
}

.field-notes-article h2 {
  color: var(--white);
}

.field-notes-article p {
  color: #cbd7d0;
}


/* =========================
   ARTICLE DISCLAIMER
========================= */

.article-disclaimer {
  margin-top: 45px;

  padding: 24px;

  background: var(--sand);

  border-radius: var(--radius);

  font-size: 0.9rem;

  color: #4d564f;
}


/* =========================
   ARTICLE SIDEBAR
========================= */

.article-sidebar {
  position: sticky;

  top: 135px;
}

.sidebar-card {
  background: var(--white);

  border:
    1px solid
    rgba(23, 59, 43, 0.09);

  border-radius: var(--radius);

  padding: 26px;

  margin-bottom: 24px;
}

.sidebar-card h3 {
  margin-bottom: 18px;
}

.sidebar-fact {
  display: flex;

  justify-content: space-between;

  gap: 15px;

  padding: 12px 0;

  border-bottom:
    1px solid
    rgba(23, 59, 43, 0.08);
}

.sidebar-fact:last-child {
  border-bottom: 0;
}

.sidebar-fact span {
  color: var(--text-light);

  font-size: 0.86rem;
}

.sidebar-fact strong {
  text-align: right;

  font-size: 0.86rem;
}

.article-toc {
  display: flex;
  flex-direction: column;
}

.article-toc a,
.sidebar-link {
  color: var(--green);

  font-weight: 700;

  margin-bottom: 11px;
}

.article-toc a:hover,
.sidebar-link:hover {
  text-decoration: underline;
}


/* =========================
   RELATED ARTICLES
========================= */

.related-articles-grid {
  display: grid;

  grid-template-columns:
    repeat(3, 1fr);

  gap: 25px;
}

.related-article-card {
  background: var(--cream);

  border-radius: var(--radius);

  overflow: hidden;

  box-shadow:
    0 10px 30px
    rgba(0, 0, 0, 0.06);
}

.related-image {
  min-height: 220px;

  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.related-content {
  padding: 25px;
}

.related-content h3 {
  margin-bottom: 14px;
}


/* =========================
   ARTICLE BOTTOM CTA
========================= */

.article-bottom-cta {
  background: var(--forest-dark);

  color: var(--white);

  padding: 90px 0;

  text-align: center;
}

.article-bottom-content {
  max-width: 760px;
}

.article-bottom-content h2 {
  font-size:
    clamp(
      2.2rem,
      5vw,
      3.6rem
    );

  line-height: 1.05;

  margin-bottom: 20px;
}

.article-bottom-content > p:not(.eyebrow) {
  color: #c7d3cc;

  margin-bottom: 28px;
}


/* =========================
   CALL TO ACTION
========================= */

.cta-section {
  background: var(--sand);

  padding: 100px 0;

  text-align: center;
}

.cta-content {
  max-width: 750px;
}

.cta-content
p:not(.eyebrow) {
  color: var(--text-light);

  margin-bottom: 28px;
}


/* =========================
   FOOTER
========================= */

.site-footer {
  background: var(--forest-deep);

  color: var(--white);

  padding:
    70px 0 25px;
}

.footer-grid {
  display: grid;

  grid-template-columns:
    2fr 1fr 1fr;

  gap: 60px;
}

.footer-logo {
  font-size: 1.6rem;
  font-weight: 800;
}

.footer-grid
> div:first-child
p {
  max-width: 400px;

  color: #9fb0a6;

  margin-top: 15px;
}

.footer-grid h3 {
  font-size: 0.9rem;

  margin-bottom: 18px;
}

.footer-grid
div:not(:first-child) {
  display: flex;

  flex-direction: column;
}

.footer-grid
a:not(.footer-logo) {
  color: #aebcb4;

  margin-bottom: 10px;

  font-size: 0.9rem;
}

.footer-grid
a:hover {
  color: var(--white);
}

.footer-bottom {
  border-top:
    1px solid
    rgba(255, 255, 255, 0.12);

  margin-top: 55px;

  padding-top: 25px;

  color: #829087;

  font-size: 0.8rem;
}


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

@media (max-width: 900px) {

  .nav-container {
    min-height: 90px;

    gap: 18px;
  }

  .site-logo {
    width: 300px;
  }

  .main-nav {
    gap: 15px;

    flex-wrap: wrap;

    justify-content: flex-end;
  }

  .card-grid,
  .guide-grid,
  .gear-grid,
  .latest-grid {
    grid-template-columns:
      repeat(2, 1fr);
  }

  .gear-feature {
    grid-template-columns: 1fr;
  }

  .gear-feature-image {
    min-height: 350px;
  }

  .safety-layout {
    grid-template-columns: 1fr;

    gap: 45px;
  }

  .featured-journal-card {
    grid-template-columns: 1fr;
  }

  .featured-journal-image {
    min-height: 350px;
  }

  .journal-grid {
    grid-template-columns:
      repeat(2, 1fr);
  }

  .field-notes-layout {
    grid-template-columns: 1fr;

    gap: 40px;
  }

  .article-layout {
    grid-template-columns: 1fr;
  }

  .article-sidebar {
    position: static;
  }

  .article-gear-grid,
  .related-articles-grid {
    grid-template-columns:
      repeat(2, 1fr);
  }

}


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

@media (max-width: 650px) {

  .nav-container {
    min-height: auto;

    flex-direction: column;

    align-items: flex-start;

    padding: 16px 0;

    gap: 12px;
  }

  .site-logo {
    width: 250px;
  }

  .main-nav {
    width: 100%;

    gap: 12px 18px;

    flex-wrap: wrap;
  }

  .hero {
    min-height: 620px;

    background-position:
      58% center;
  }

  .hero-content {
    padding: 80px 0;
  }

  .hero h1 {
    letter-spacing: -2px;
  }

  .section {
    padding: 70px 0;
  }

  .card-grid,
  .guide-grid,
  .gear-grid,
  .latest-grid,
  .footer-grid,
  .journal-grid,
  .article-gear-grid,
  .related-articles-grid {
    grid-template-columns: 1fr;
  }

  .guide-image {
    min-height: 230px;
  }

  .gear-feature-content {
    padding: 30px;
  }

  .footer-grid {
    gap: 35px;
  }

  .journal-hero {
    padding:
      60px 0 40px;
  }

  .journal-hero h1 {
    letter-spacing: -2px;
  }

  .category-links {
    gap: 8px;
  }

  .category-links a {
    font-size: 0.82rem;

    padding:
      7px 12px;
  }

  .featured-journal-content {
    padding: 30px;
  }

  .featured-journal-image {
    min-height: 260px;
  }

  .field-notes-section {
    padding: 70px 0;
  }

  .article-hero {
    padding: 70px 0;
  }

  .article-hero h1 {
    letter-spacing: -2px;
  }

  .article-section {
    padding: 60px 0;
  }

  .article-block {
    padding: 42px 0;
  }

  .checklist-box,
  .sidebar-card,
  .field-notes-article {
    padding: 24px;
  }

}

/* HOMEPAGE HERO SMALL TEXT */

.hero .eyebrow {
  color: #d2e6a3;
  -webkit-text-stroke: 0.5px #173b2b;
  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.9);
}

/* =========================================================
   HIKING SAFETY — OPTION 3 FIELD GUIDE
   ========================================================= */


/* ---------- HERO ---------- */

.hiking-guide-hero {
  position: relative;
  min-height: 560px;

  display: flex;
  align-items: center;

  background:
    linear-gradient(
      rgba(10, 35, 27, 0.30),
      rgba(10, 35, 27, 0.72)
    ),
    url("images/hiking-guide.png");

  background-size: cover;
  background-position: center;

  color: white;

  overflow: hidden;
}


.hiking-hero-overlay {
  position: absolute;
  inset: 0;

  background:
    linear-gradient(
      90deg,
      rgba(10, 31, 24, 0.82) 0%,
      rgba(10, 31, 24, 0.48) 45%,
      rgba(10, 31, 24, 0.12) 100%
    );
}


.hiking-hero-content {
  position: relative;
  z-index: 2;

  padding-top: 90px;
  padding-bottom: 90px;
}


.hiking-back-link {
  display: inline-block;

  color: #d2e6a3;

  font-weight: 700;
  text-decoration: none;

  margin-bottom: 35px;
}


.hiking-back-link:hover {
  color: white;
}


.hiking-kicker {
  color: #d2e6a3;

  font-size: 0.9rem;
  font-weight: 800;

  letter-spacing: 3px;

  margin-bottom: 18px;

  text-shadow:
    0 2px 4px rgba(0, 0, 0, 0.75);
}


.hiking-guide-hero h1 {
  color: white;

  font-size: clamp(3.5rem, 7vw, 6.5rem);

  line-height: 0.95;

  letter-spacing: -4px;

  max-width: 850px;

  margin-bottom: 30px;

  text-shadow:
    0 4px 20px rgba(0, 0, 0, 0.35);
}


.hiking-hero-text {
  max-width: 680px;

  color: white;

  font-size: 1.2rem;

  line-height: 1.7;

  margin-bottom: 35px;

  text-shadow:
    0 2px 8px rgba(0, 0, 0, 0.65);
}


.hiking-meta {
  display: flex;
  flex-wrap: wrap;

  gap: 10px;
}


.hiking-meta span {
  padding: 9px 16px;

  border: 1px solid rgba(255, 255, 255, 0.45);

  border-radius: 100px;

  background: rgba(10, 35, 27, 0.55);

  color: white;

  font-size: 0.82rem;

  font-weight: 700;
}



/* =========================================================
   FIELD STRIP
   ========================================================= */

.trail-field-strip {
  background: #153f31;

  border-top: 1px solid rgba(255, 255, 255, 0.12);
  border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}


.trail-field-grid {
  display: grid;

  grid-template-columns: repeat(4, 1fr);
}


.trail-field-item {
  display: flex;
  align-items: center;

  gap: 18px;

  padding: 28px 22px;

  border-right: 1px solid rgba(255, 255, 255, 0.15);
}


.trail-field-item:first-child {
  border-left: 1px solid rgba(255, 255, 255, 0.15);
}


.trail-field-number {
  color: #b8cf86;

  font-size: 1.65rem;

  font-weight: 900;
}


.trail-field-item div {
  display: flex;
  flex-direction: column;

  gap: 3px;
}


.trail-field-item small {
  color: #b8cf86;

  font-size: 0.65rem;

  font-weight: 800;

  letter-spacing: 1.5px;
}


.trail-field-item strong {
  color: white;

  font-size: 0.95rem;
}



/* =========================================================
   ARTICLE AREA
   ========================================================= */

.hiking-guide-section {
  background: #f4f0e6;

  padding: 90px 0 110px;
}


.hiking-guide-layout {
  display: grid;

  grid-template-columns:
    minmax(0, 2.2fr)
    minmax(260px, 0.8fr);

  gap: 70px;

  align-items: start;
}


.hiking-guide-content {
  min-width: 0;
}


.hiking-intro {
  padding-bottom: 55px;

  margin-bottom: 55px;

  border-bottom: 2px solid #d4d8c6;
}


.guide-label {
  color: #52755f;

  font-size: 0.78rem;

  font-weight: 900;

  letter-spacing: 2.2px;

  text-transform: uppercase;

  margin-bottom: 14px;
}


.hiking-guide-content h2 {
  color: #173b2b;

  font-size: clamp(2rem, 4vw, 3rem);

  line-height: 1.08;

  margin-bottom: 24px;
}


.hiking-guide-content h3 {
  color: #173b2b;

  font-size: 1.3rem;

  line-height: 1.3;

  margin-top: 30px;
  margin-bottom: 12px;
}


.hiking-guide-content p {
  color: #35463d;

  font-size: 1.05rem;

  line-height: 1.8;

  margin-bottom: 22px;
}


.hiking-lead {
  font-size: 1.25rem !important;

  line-height: 1.75 !important;

  color: #233b30 !important;
}



/* =========================================================
   INDIVIDUAL GUIDE SECTIONS
   ========================================================= */

.hiking-guide-block {
  position: relative;

  background: #fffdf7;

  border: 1px solid #d9dccf;

  border-radius: 18px;

  padding: 50px;

  margin-bottom: 45px;

  box-shadow:
    0 10px 30px rgba(24, 57, 43, 0.06);
}


.hiking-guide-block:last-of-type {
  margin-bottom: 0;
}


.guide-section-number {
  display: inline-flex;

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

  width: 54px;
  height: 54px;

  margin-bottom: 25px;

  background: #173b2b;

  color: #d2e6a3;

  border-radius: 50%;

  font-size: 1rem;

  font-weight: 900;

  letter-spacing: 1px;
}



/* =========================================================
   PRE-TRIP CHECKLIST
   ========================================================= */

.field-checklist {
  overflow: hidden;

  margin-top: 35px;

  border: 2px solid #315a45;

  border-radius: 14px;

  background: #f8f7ef;
}


.field-checklist-header {
  display: flex;

  justify-content: space-between;
  align-items: center;

  gap: 20px;

  padding: 18px 24px;

  background: #173b2b;

  color: white;
}


.field-checklist-header span {
  color: #b8cf86;

  font-size: 0.72rem;

  font-weight: 800;

  letter-spacing: 2px;
}


.field-checklist-header strong {
  font-size: 0.9rem;

  letter-spacing: 1px;
}


.field-checklist ul {
  list-style: none;

  padding: 25px;

  margin: 0;
}


.field-checklist li {
  position: relative;

  padding:
    12px
    10px
    12px
    38px;

  border-bottom: 1px solid #d9dccf;

  color: #304239;

  line-height: 1.5;
}


.field-checklist li:last-child {
  border-bottom: 0;
}


.field-checklist li::before {
  content: "✓";

  position: absolute;

  left: 8px;

  color: #52755f;

  font-weight: 900;
}



/* =========================================================
   OUTLAND BOUND TIP
   ========================================================= */

.trailready-tip {
  margin: 38px 0;

  padding: 30px 32px;

  background: #e8ead8;

  border-left: 5px solid #a8c776;

  border-radius: 0 16px 16px 0;
}


.trailready-tip span {
  display: block;

  color: #35634c;

  font-size: 0.72rem;

  font-weight: 900;

  letter-spacing: 2px;

  margin-bottom: 12px;
}


.trailready-tip h3 {
  margin: 0 0 10px;

  color: #173b2b;
}


.trailready-tip p {
  margin-bottom: 0;
}



/* =========================================================
   WARNING BOX
   ========================================================= */

.hiking-warning {
  display: grid;

  grid-template-columns: 70px 1fr;

  gap: 24px;

  align-items: start;

  margin: 38px 0;

  padding: 30px;

  border: 2px solid #ad704f;

  border-radius: 16px;

  background: #f6e8dc;
}


.warning-symbol {
  display: flex;

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

  width: 60px;
  height: 60px;

  border-radius: 50%;

  background: #8c4d35;

  color: white;

  font-size: 2rem;

  font-weight: 900;
}


.hiking-warning span {
  display: block;

  color: #8c4d35;

  font-size: 0.72rem;

  font-weight: 900;

  letter-spacing: 2px;

  margin-bottom: 7px;
}


.hiking-warning h3 {
  margin: 0 0 8px;

  color: #673a29;
}


.hiking-warning p {
  margin: 0;

  color: #634c41;
}



/* =========================================================
   TRAIL DATA BOX
   ========================================================= */

.trail-data-box {
  display: grid;

  grid-template-columns: repeat(3, 1fr);

  gap: 1px;

  margin-top: 35px;

  overflow: hidden;

  border: 1px solid #cad0c2;

  border-radius: 14px;

  background: #cad0c2;
}


.trail-data-box div {
  padding: 25px 20px;

  background: #edf0e5;

  text-align: center;
}


.trail-data-box small {
  display: block;

  color: #66806f;

  font-size: 0.68rem;

  font-weight: 800;

  letter-spacing: 1.5px;

  margin-bottom: 7px;
}


.trail-data-box strong {
  color: #173b2b;

  font-size: 1rem;
}



/* =========================================================
   GEAR GRID
   ========================================================= */

.hiking-gear-grid {
  display: grid;

  grid-template-columns: repeat(2, 1fr);

  gap: 20px;

  margin-top: 35px;
}


.hiking-gear-item {
  padding: 28px;

  border: 1px solid #d2d8ca;

  border-radius: 14px;

  background: #f6f6ee;
}


.hiking-gear-item > span {
  display: inline-block;

  margin-bottom: 18px;

  color: #76935d;

  font-size: 0.8rem;

  font-weight: 900;

  letter-spacing: 2px;
}


.hiking-gear-item h3 {
  margin: 0 0 10px;

  font-size: 1.2rem;
}


.hiking-gear-item p {
  margin: 0;

  font-size: 0.95rem;

  line-height: 1.65;
}



/* =========================================================
   STOP GRID
   ========================================================= */

.stop-grid {
  display: grid;

  grid-template-columns: repeat(4, 1fr);

  gap: 15px;

  margin-top: 35px;
}


.stop-card {
  padding: 25px 18px;

  border: 1px solid #cad2c5;

  border-radius: 14px;

  background: #eef0e6;

  text-align: center;
}


.stop-card strong {
  display: flex;

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

  width: 52px;
  height: 52px;

  margin: 0 auto 15px;

  border-radius: 50%;

  background: #173b2b;

  color: #d2e6a3;

  font-size: 1.5rem;
}


.stop-card span {
  display: block;

  color: #173b2b;

  font-size: 0.75rem;

  font-weight: 900;

  letter-spacing: 1.5px;

  margin-bottom: 10px;
}


.stop-card p {
  margin: 0;

  font-size: 0.85rem;

  line-height: 1.5;
}



/* =========================================================
   QUOTE
   ========================================================= */

.hiking-quote {
  margin: 40px 0 0;

  padding: 40px;

  border-left: 6px solid #a8c776;

  background: #173b2b;

  border-radius: 0 16px 16px 0;
}


.hiking-quote p {
  margin: 0 0 15px;

  color: white;

  font-size: 1.7rem;

  font-weight: 700;

  line-height: 1.35;
}


.hiking-quote cite {
  color: #b8cf86;

  font-style: normal;

  font-size: 0.8rem;

  font-weight: 800;

  letter-spacing: 1px;
}



/* =========================================================
   FINAL CHECKLIST
   ========================================================= */

.final-trail-checklist {
  overflow: hidden;

  margin-top: 35px;

  border: 2px solid #173b2b;

  border-radius: 16px;
}


.final-check-header {
  display: flex;

  justify-content: space-between;
  align-items: center;

  gap: 20px;

  padding: 24px 28px;

  background: #173b2b;
}


.final-check-header span {
  display: block;

  color: #b8cf86;

  font-size: 0.7rem;

  font-weight: 800;

  letter-spacing: 2px;

  margin-bottom: 4px;
}


.final-check-header h3 {
  margin: 0;

  color: white;

  font-size: 1.15rem;
}


.final-check-header > strong {
  color: #d2e6a3;

  font-size: 2rem;
}


.final-check-grid {
  display: grid;

  grid-template-columns: repeat(2, 1fr);

  background: #f7f6ef;
}


.final-check-grid label {
  display: flex;

  align-items: center;

  gap: 12px;

  padding: 18px 22px;

  border-right: 1px solid #d9ddd2;
  border-bottom: 1px solid #d9ddd2;

  color: #304239;

  cursor: pointer;
}


.final-check-grid input {
  width: 18px;
  height: 18px;

  accent-color: #315a45;
}



/* =========================================================
   DISCLAIMER
   ========================================================= */

.hiking-disclaimer {
  margin-top: 50px;

  padding: 28px 30px;

  border: 1px dashed #8a9b8d;

  border-radius: 12px;

  color: #526057;

  font-size: 0.9rem;

  line-height: 1.7;
}


.hiking-disclaimer strong {
  color: #173b2b;
}



/* =========================================================
   SIDEBAR
   ========================================================= */

.hiking-sidebar {
  position: sticky;

  top: 30px;
}


.hiking-sidebar-card {
  margin-bottom: 25px;

  padding: 28px;

  border: 1px solid #d4d9cd;

  border-radius: 16px;

  background: #fffdf7;
}


.hiking-sidebar-card h3 {
  color: #173b2b;

  margin: 5px 0 20px;

  font-size: 1.25rem;
}


.topo-card {
  background:
    linear-gradient(
      rgba(23, 59, 43, 0.96),
      rgba(23, 59, 43, 0.96)
    );

  color: white;

  border: 0;
}


.topo-card h3 {
  color: white;
}


.sidebar-map-label {
  color: #b8cf86;

  font-size: 0.7rem;

  font-weight: 900;

  letter-spacing: 2px;
}


.topo-line {
  height: 1px;

  background: rgba(255, 255, 255, 0.2);

  margin: 20px 0;
}


.hiking-sidebar-fact {
  display: flex;

  justify-content: space-between;

  gap: 20px;

  padding: 13px 0;

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


.hiking-sidebar-fact:last-child {
  border-bottom: 0;
}


.hiking-sidebar-fact span {
  color: #b8cf86;

  font-size: 0.65rem;

  font-weight: 800;

  letter-spacing: 1px;
}


.hiking-sidebar-fact strong {
  color: white;

  font-size: 0.85rem;

  text-align: right;
}



/* ---------- TABLE OF CONTENTS ---------- */

.hiking-toc {
  display: flex;

  flex-direction: column;
}


.hiking-toc a {
  display: flex;

  align-items: center;

  gap: 14px;

  padding: 13px 0;

  border-bottom: 1px solid #e0e3da;

  color: #304239;

  text-decoration: none;

  font-weight: 700;
}


.hiking-toc a:last-child {
  border-bottom: 0;
}


.hiking-toc a:hover {
  color: #52755f;
}


.hiking-toc span {
  color: #8ba66d;

  font-size: 0.72rem;

  font-weight: 900;
}



/* ---------- FIELD REMINDER ---------- */

.sidebar-field-note {
  border: 2px solid #a8c776;

  background: #e8ead8;
}


.sidebar-field-note > span {
  color: #52755f;

  font-size: 0.7rem;

  font-weight: 900;

  letter-spacing: 2px;
}


.sidebar-field-note p {
  margin: 0;

  color: #405248;

  line-height: 1.65;
}



/* ---------- SIDEBAR LINKS ---------- */

.hiking-sidebar-link {
  display: block;

  padding: 13px 0;

  border-bottom: 1px solid #e0e3da;

  color: #315a45;

  text-decoration: none;

  font-weight: 800;
}


.hiking-sidebar-link:hover {
  color: #76935d;
}



/* =========================================================
   BOTTOM BANNER
   ========================================================= */

.hiking-bottom-banner {
  position: relative;

  padding: 110px 0;

  background:
    linear-gradient(
      rgba(12, 42, 31, 0.88),
      rgba(12, 42, 31, 0.92)
    ),
    url("images/hiking-guide.png");

  background-size: cover;

  background-position: center;

  color: white;
}


.hiking-bottom-content {
  max-width: 750px;
}


.hiking-bottom-content h2 {
  color: white;

  font-size: clamp(2.8rem, 6vw, 5rem);

  line-height: 1;

  letter-spacing: -3px;

  margin-bottom: 25px;
}


.hiking-bottom-content > p:not(.hiking-kicker) {
  color: #e5eee7;

  font-size: 1.15rem;

  line-height: 1.7;

  margin-bottom: 30px;
}



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

@media (max-width: 1000px) {

  .trail-field-grid {
    grid-template-columns: repeat(2, 1fr);
  }


  .hiking-guide-layout {
    grid-template-columns: 1fr;

    gap: 50px;
  }


  .hiking-sidebar {
    position: static;
  }


  .stop-grid {
    grid-template-columns: repeat(2, 1fr);
  }

}



@media (max-width: 700px) {

  .hiking-guide-hero {
    min-height: 500px;
  }


  .hiking-guide-hero h1 {
    letter-spacing: -2px;
  }


  .trail-field-grid {
    grid-template-columns: 1fr;
  }


  .trail-field-item {
    border-right: 0;

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


  .trail-field-item:first-child {
    border-left: 0;
  }


  .hiking-guide-section {
    padding: 60px 0 80px;
  }


  .hiking-guide-block {
    padding: 30px 24px;

    margin-bottom: 30px;
  }


  .hiking-gear-grid {
    grid-template-columns: 1fr;
  }


  .trail-data-box {
    grid-template-columns: 1fr;
  }


  .stop-grid {
    grid-template-columns: 1fr;
  }


  .final-check-grid {
    grid-template-columns: 1fr;
  }


  .hiking-warning {
    grid-template-columns: 1fr;
  }

}

/* =========================================================
   CAR CAMPING CHECKLIST
   OPTION 3 FIELD GUIDE STYLE
   ========================================================= */


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

.camping-guide-hero {
  position: relative;

  min-height: 560px;

  display: flex;
  align-items: center;

  background:
    linear-gradient(
      rgba(10, 35, 27, 0.28),
      rgba(10, 35, 27, 0.72)
    ),
    url("images/camping-guide.png");

  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;

  color: white;

  overflow: hidden;
}


.camping-hero-overlay {
  position: absolute;
  inset: 0;

  background:
    linear-gradient(
      90deg,
      rgba(10, 31, 24, 0.84) 0%,
      rgba(10, 31, 24, 0.52) 45%,
      rgba(10, 31, 24, 0.15) 100%
    );
}


.camping-hero-content {
  position: relative;
  z-index: 2;

  padding-top: 90px;
  padding-bottom: 90px;
}


.camping-back-link {
  display: inline-block;

  color: #d2e6a3;

  font-weight: 700;

  margin-bottom: 35px;
}


.camping-back-link:hover {
  color: white;
}


.camping-kicker {
  color: #d2e6a3;

  font-size: 0.9rem;
  font-weight: 800;

  letter-spacing: 3px;

  margin-bottom: 18px;

  text-shadow:
    0 2px 4px
    rgba(0, 0, 0, 0.75);
}


.camping-guide-hero h1 {
  color: white;

  font-size:
    clamp(
      3.5rem,
      7vw,
      6.5rem
    );

  line-height: 0.95;

  letter-spacing: -4px;

  max-width: 900px;

  margin-bottom: 30px;

  text-shadow:
    0 4px 20px
    rgba(0, 0, 0, 0.38);
}


.camping-hero-text {
  max-width: 700px;

  color: white;

  font-size: 1.2rem;

  line-height: 1.7;

  margin-bottom: 35px;

  text-shadow:
    0 2px 8px
    rgba(0, 0, 0, 0.65);
}


.camping-meta {
  display: flex;

  flex-wrap: wrap;

  gap: 10px;
}


.camping-meta span {
  padding:
    9px 16px;

  border:
    1px solid
    rgba(255, 255, 255, 0.48);

  border-radius: 100px;

  background:
    rgba(10, 35, 27, 0.55);

  color: white;

  font-size: 0.82rem;

  font-weight: 700;
}



/* =========================
   CAMP FIELD STRIP
========================= */

.camp-field-strip {
  background: #153f31;

  border-top:
    1px solid
    rgba(255, 255, 255, 0.12);

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


.camp-field-grid {
  display: grid;

  grid-template-columns:
    repeat(4, 1fr);
}


.camp-field-item {
  display: flex;

  align-items: center;

  gap: 18px;

  padding:
    28px 22px;

  border-right:
    1px solid
    rgba(255, 255, 255, 0.15);
}


.camp-field-item:first-child {
  border-left:
    1px solid
    rgba(255, 255, 255, 0.15);
}


.camp-field-number {
  color: #b8cf86;

  font-size: 1.65rem;

  font-weight: 900;
}


.camp-field-item div {
  display: flex;

  flex-direction: column;

  gap: 3px;
}


.camp-field-item small {
  color: #b8cf86;

  font-size: 0.65rem;

  font-weight: 800;

  letter-spacing: 1.5px;
}


.camp-field-item strong {
  color: white;

  font-size: 0.95rem;
}



/* =========================
   CAMPING ARTICLE AREA
========================= */

.camping-guide-section {
  background: #f4f0e6;

  padding:
    90px 0 110px;
}


.camping-guide-layout {
  display: grid;

  grid-template-columns:
    minmax(0, 2.2fr)
    minmax(260px, 0.8fr);

  gap: 70px;

  align-items: start;
}


.camping-guide-content {
  min-width: 0;
}


.camping-intro {
  padding-bottom: 55px;

  margin-bottom: 55px;

  border-bottom:
    2px solid
    #d4d8c6;
}


.camping-guide-content h2 {
  color: #173b2b;

  font-size:
    clamp(
      2rem,
      4vw,
      3rem
    );

  line-height: 1.08;

  margin-bottom: 24px;
}


.camping-guide-content h3 {
  color: #173b2b;

  font-size: 1.3rem;

  line-height: 1.3;

  margin-top: 30px;

  margin-bottom: 12px;
}


.camping-guide-content p {
  color: #35463d;

  font-size: 1.05rem;

  line-height: 1.8;

  margin-bottom: 22px;
}


.camping-lead {
  font-size: 1.25rem !important;

  line-height: 1.75 !important;

  color: #233b30 !important;
}



/* =========================
   CAMPING GUIDE CARDS
========================= */

.camping-guide-block {
  position: relative;

  background: #fffdf7;

  border:
    1px solid
    #d9dccf;

  border-radius: 18px;

  padding: 50px;

  margin-bottom: 45px;

  box-shadow:
    0 10px 30px
    rgba(24, 57, 43, 0.06);
}


.camping-guide-block:last-of-type {
  margin-bottom: 0;
}



/* =========================
   CAMPING TIP
========================= */

.camping-tip {
  margin:
    38px 0;

  padding:
    30px 32px;

  background: #e8ead8;

  border-left:
    5px solid
    #a8c776;

  border-radius:
    0 16px 16px 0;
}


.camping-tip > span {
  display: block;

  color: #35634c;

  font-size: 0.72rem;

  font-weight: 900;

  letter-spacing: 2px;

  margin-bottom: 12px;
}


.camping-tip h3 {
  margin:
    0 0 10px;

  color: #173b2b;
}


.camping-tip p {
  margin-bottom: 0;
}



/* =========================
   CAMPING GEAR GRID
========================= */

.camping-gear-grid {
  display: grid;

  grid-template-columns:
    repeat(2, 1fr);

  gap: 20px;

  margin-top: 35px;
}


.camping-gear-item {
  padding: 28px;

  border:
    1px solid
    #d2d8ca;

  border-radius: 14px;

  background: #f6f6ee;
}


.camping-gear-item > span {
  display: inline-block;

  margin-bottom: 18px;

  color: #76935d;

  font-size: 0.8rem;

  font-weight: 900;

  letter-spacing: 2px;
}


.camping-gear-item h3 {
  margin:
    0 0 10px;

  font-size: 1.2rem;
}


.camping-gear-item p {
  margin: 0;

  font-size: 0.95rem;

  line-height: 1.65;
}



/* =========================
   CAMP WATER DATA
========================= */

.camp-data-box {
  display: grid;

  grid-template-columns:
    repeat(3, 1fr);

  gap: 1px;

  margin-top: 35px;

  overflow: hidden;

  border:
    1px solid
    #cad0c2;

  border-radius: 14px;

  background: #cad0c2;
}


.camp-data-box div {
  padding:
    25px 20px;

  background: #edf0e5;

  text-align: center;
}


.camp-data-box small {
  display: block;

  color: #66806f;

  font-size: 0.68rem;

  font-weight: 800;

  letter-spacing: 1.5px;

  margin-bottom: 7px;
}


.camp-data-box strong {
  color: #173b2b;

  font-size: 1rem;
}



/* =========================
   CAMPING WARNING
========================= */

.camping-warning {
  display: grid;

  grid-template-columns:
    70px 1fr;

  gap: 24px;

  align-items: start;

  margin:
    38px 0;

  padding: 30px;

  border:
    2px solid
    #ad704f;

  border-radius: 16px;

  background: #f6e8dc;
}


.camping-warning .warning-symbol {
  display: flex;

  align-items: center;

  justify-content: center;

  width: 60px;

  height: 60px;

  border-radius: 50%;

  background: #8c4d35;

  color: white;

  font-size: 2rem;

  font-weight: 900;
}


.camping-warning span {
  display: block;

  color: #8c4d35;

  font-size: 0.72rem;

  font-weight: 900;

  letter-spacing: 2px;

  margin-bottom: 7px;
}


.camping-warning h3 {
  margin:
    0 0 8px;

  color: #673a29;
}


.camping-warning p {
  margin: 0;

  color: #634c41;
}



/* =========================
   CAMP COMFORT GRID
========================= */

.camp-comfort-grid {
  display: grid;

  grid-template-columns:
    repeat(2, 1fr);

  gap: 20px;

  margin-top: 35px;
}


.camp-comfort-card {
  padding: 28px;

  border:
    1px solid
    #d2d8ca;

  border-radius: 14px;

  background: #eef0e6;
}


.camp-comfort-card strong {
  display: block;

  color: #52755f;

  font-size: 0.78rem;

  font-weight: 900;

  letter-spacing: 2px;

  margin-bottom: 12px;
}


.camp-comfort-card p {
  margin: 0;

  font-size: 0.95rem;

  line-height: 1.65;
}



/* =========================
   CAMP QUOTE
========================= */

.camping-quote {
  margin:
    40px 0 0;

  padding: 40px;

  border-left:
    6px solid
    #a8c776;

  background: #173b2b;

  border-radius:
    0 16px 16px 0;
}


.camping-quote p {
  margin:
    0 0 15px;

  color: white;

  font-size: 1.7rem;

  font-weight: 700;

  line-height: 1.35;
}


.camping-quote cite {
  color: #b8cf86;

  font-style: normal;

  font-size: 0.8rem;

  font-weight: 800;

  letter-spacing: 1px;
}



/* =========================
   FINAL CAMP CHECKLIST
========================= */

.final-camp-checklist {
  overflow: hidden;

  margin-top: 35px;

  border:
    2px solid
    #173b2b;

  border-radius: 16px;
}


/* Uses the same
   .final-check-header
   and .final-check-grid
   already added for hiking */



/* =========================
   CAMP DISCLAIMER
========================= */

.camping-disclaimer {
  margin-top: 50px;

  padding:
    28px 30px;

  border:
    1px dashed
    #8a9b8d;

  border-radius: 12px;

  color: #526057;

  font-size: 0.9rem;

  line-height: 1.7;
}


.camping-disclaimer strong {
  color: #173b2b;
}



/* =========================
   CAMPING SIDEBAR
========================= */

.camping-sidebar {
  position: sticky;

  top: 30px;
}


.camping-sidebar-card {
  margin-bottom: 25px;

  padding: 28px;

  border:
    1px solid
    #d4d9cd;

  border-radius: 16px;

  background: #fffdf7;
}


.camping-sidebar-card h3 {
  color: #173b2b;

  margin:
    5px 0 20px;

  font-size: 1.25rem;
}



/* =========================
   CAMP MAP CARD
========================= */

.camp-map-card {
  background:
    linear-gradient(
      rgba(23, 59, 43, 0.96),
      rgba(23, 59, 43, 0.96)
    );

  color: white;

  border: 0;
}


.camp-map-card h3 {
  color: white;
}


.camping-sidebar-fact {
  display: flex;

  justify-content: space-between;

  gap: 20px;

  padding:
    13px 0;

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


.camping-sidebar-fact:last-child {
  border-bottom: 0;
}


.camping-sidebar-fact span {
  color: #b8cf86;

  font-size: 0.65rem;

  font-weight: 800;

  letter-spacing: 1px;
}


.camping-sidebar-fact strong {
  color: white;

  font-size: 0.85rem;

  text-align: right;
}



/* =========================
   CAMPING TABLE OF CONTENTS
========================= */

.camping-toc {
  display: flex;

  flex-direction: column;
}


.camping-toc a {
  display: flex;

  align-items: center;

  gap: 14px;

  padding:
    13px 0;

  border-bottom:
    1px solid
    #e0e3da;

  color: #304239;

  font-weight: 700;
}


.camping-toc a:last-child {
  border-bottom: 0;
}


.camping-toc a:hover {
  color: #52755f;
}


.camping-toc span {
  color: #8ba66d;

  font-size: 0.72rem;

  font-weight: 900;
}



/* =========================
   CAMP FIELD NOTE
========================= */

.camp-field-note {
  border:
    2px solid
    #a8c776;

  background: #e8ead8;
}


.camp-field-note > span {
  color: #52755f;

  font-size: 0.7rem;

  font-weight: 900;

  letter-spacing: 2px;
}


.camp-field-note p {
  margin: 0;

  color: #405248;

  line-height: 1.65;
}



/* =========================
   CAMP SIDEBAR LINKS
========================= */

.camping-sidebar-link {
  display: block;

  padding:
    13px 0;

  border-bottom:
    1px solid
    #e0e3da;

  color: #315a45;

  font-weight: 800;
}


.camping-sidebar-link:hover {
  color: #76935d;
}



/* =========================
   CAMPING BOTTOM BANNER
========================= */

.camping-bottom-banner {
  position: relative;

  padding:
    110px 0;

  background:
    linear-gradient(
      rgba(12, 42, 31, 0.88),
      rgba(12, 42, 31, 0.92)
    ),
    url("images/camping-guide.png");

  background-size: cover;

  background-position: center;

  color: white;
}


.camping-bottom-content {
  max-width: 750px;
}


.camping-bottom-content h2 {
  color: white;

  font-size:
    clamp(
      2.8rem,
      6vw,
      5rem
    );

  line-height: 1;

  letter-spacing: -3px;

  margin-bottom: 25px;
}


.camping-bottom-content
> p:not(.camping-kicker) {
  color: #e5eee7;

  font-size: 1.15rem;

  line-height: 1.7;

  margin-bottom: 30px;
}



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

@media (max-width: 1000px) {

  .camp-field-grid {
    grid-template-columns:
      repeat(2, 1fr);
  }


  .camping-guide-layout {
    grid-template-columns:
      1fr;

    gap: 50px;
  }


  .camping-sidebar {
    position: static;
  }

}



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

@media (max-width: 700px) {

  .camping-guide-hero {
    min-height: 500px;
  }


  .camping-guide-hero h1 {
    letter-spacing: -2px;
  }


  .camp-field-grid {
    grid-template-columns:
      1fr;
  }


  .camp-field-item {
    border-right: 0;

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


  .camp-field-item:first-child {
    border-left: 0;
  }


  .camping-guide-section {
    padding:
      60px 0 80px;
  }


  .camping-guide-block {
    padding:
      30px 24px;

    margin-bottom: 30px;
  }


  .camping-gear-grid {
    grid-template-columns:
      1fr;
  }


  .camp-data-box {
    grid-template-columns:
      1fr;
  }


  .camp-comfort-grid {
    grid-template-columns:
      1fr;
  }


  .camping-warning {
    grid-template-columns:
      1fr;
  }

}

/* =========================================================
   PADDLEBOARDING FIELD GUIDE
   OPTION 3 STYLE
   ========================================================= */


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

.paddling-guide-hero {
  position: relative;

  min-height: 560px;

  display: flex;
  align-items: center;

  background:
    linear-gradient(
      rgba(8, 32, 37, 0.28),
      rgba(8, 32, 37, 0.72)
    ),
    url("images/paddling-guide.png");

  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;

  color: white;

  overflow: hidden;
}


.paddling-hero-overlay {
  position: absolute;
  inset: 0;

  background:
    linear-gradient(
      90deg,
      rgba(7, 35, 39, 0.86) 0%,
      rgba(7, 35, 39, 0.52) 45%,
      rgba(7, 35, 39, 0.15) 100%
    );
}


.paddling-hero-content {
  position: relative;
  z-index: 2;

  padding-top: 90px;
  padding-bottom: 90px;
}


.paddling-back-link {
  display: inline-block;

  color: #d2e6a3;

  font-weight: 700;

  margin-bottom: 35px;
}


.paddling-back-link:hover {
  color: white;
}


.paddling-kicker {
  color: #d2e6a3;

  font-size: 0.9rem;
  font-weight: 800;

  letter-spacing: 3px;

  margin-bottom: 18px;

  text-shadow:
    0 2px 4px
    rgba(0, 0, 0, 0.75);
}


.paddling-guide-hero h1 {
  color: white;

  font-size:
    clamp(
      3.5rem,
      7vw,
      6.5rem
    );

  line-height: 0.95;

  letter-spacing: -4px;

  max-width: 900px;

  margin-bottom: 30px;

  text-shadow:
    0 4px 20px
    rgba(0, 0, 0, 0.38);
}


.paddling-hero-text {
  max-width: 700px;

  color: white;

  font-size: 1.2rem;

  line-height: 1.7;

  margin-bottom: 35px;

  text-shadow:
    0 2px 8px
    rgba(0, 0, 0, 0.65);
}


.paddling-meta {
  display: flex;

  flex-wrap: wrap;

  gap: 10px;
}


.paddling-meta span {
  padding:
    9px 16px;

  border:
    1px solid
    rgba(255, 255, 255, 0.48);

  border-radius: 100px;

  background:
    rgba(7, 35, 39, 0.55);

  color: white;

  font-size: 0.82rem;

  font-weight: 700;
}


/* =========================
   PADDLE FIELD STRIP
========================= */

.paddle-field-strip {
  background: #17454a;

  border-top:
    1px solid
    rgba(255, 255, 255, 0.12);

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


.paddle-field-grid {
  display: grid;

  grid-template-columns:
    repeat(4, 1fr);
}


.paddle-field-item {
  display: flex;

  align-items: center;

  gap: 18px;

  padding:
    28px 22px;

  border-right:
    1px solid
    rgba(255, 255, 255, 0.15);
}


.paddle-field-item:first-child {
  border-left:
    1px solid
    rgba(255, 255, 255, 0.15);
}


.paddle-field-number {
  color: #c5d98f;

  font-size: 1.65rem;

  font-weight: 900;
}


.paddle-field-item div {
  display: flex;

  flex-direction: column;

  gap: 3px;
}


.paddle-field-item small {
  color: #c5d98f;

  font-size: 0.65rem;

  font-weight: 800;

  letter-spacing: 1.5px;
}


.paddle-field-item strong {
  color: white;

  font-size: 0.95rem;
}


/* =========================
   PADDLING ARTICLE AREA
========================= */

.paddling-guide-section {
  background: #f2f2e8;

  padding:
    90px 0 110px;
}


.paddling-guide-layout {
  display: grid;

  grid-template-columns:
    minmax(0, 2.2fr)
    minmax(260px, 0.8fr);

  gap: 70px;

  align-items: start;
}


.paddling-guide-content {
  min-width: 0;
}


.paddling-intro {
  padding-bottom: 55px;

  margin-bottom: 55px;

  border-bottom:
    2px solid
    #d3dbd5;
}


.paddling-guide-content h2 {
  color: #164047;

  font-size:
    clamp(
      2rem,
      4vw,
      3rem
    );

  line-height: 1.08;

  margin-bottom: 24px;
}


.paddling-guide-content h3 {
  color: #164047;

  font-size: 1.3rem;

  line-height: 1.3;

  margin-top: 30px;

  margin-bottom: 12px;
}


.paddling-guide-content p {
  color: #38484b;

  font-size: 1.05rem;

  line-height: 1.8;

  margin-bottom: 22px;
}


.paddling-lead {
  font-size: 1.25rem !important;

  line-height: 1.75 !important;

  color: #223c40 !important;
}


/* =========================
   PADDLING GUIDE CARDS
========================= */

.paddling-guide-block {
  position: relative;

  background: #fffefa;

  border:
    1px solid
    #d7dedb;

  border-radius: 18px;

  padding: 50px;

  margin-bottom: 45px;

  box-shadow:
    0 10px 30px
    rgba(20, 58, 63, 0.06);
}


.paddling-guide-block:last-of-type {
  margin-bottom: 0;
}


/* =========================
   PADDLING TIP
========================= */

.paddling-tip {
  margin:
    38px 0;

  padding:
    30px 32px;

  background: #e5eee6;

  border-left:
    5px solid
    #8fbf9d;

  border-radius:
    0 16px 16px 0;
}


.paddling-tip > span {
  display: block;

  color: #3b6d5d;

  font-size: 0.72rem;

  font-weight: 900;

  letter-spacing: 2px;

  margin-bottom: 12px;
}


.paddling-tip h3 {
  margin:
    0 0 10px;

  color: #164047;
}


.paddling-tip p {
  margin-bottom: 0;
}


/* =========================
   PADDLING WARNING
========================= */

.paddling-warning {
  display: grid;

  grid-template-columns:
    70px 1fr;

  gap: 24px;

  align-items: start;

  margin:
    38px 0;

  padding: 30px;

  border:
    2px solid
    #b66f4f;

  border-radius: 16px;

  background: #f6e9df;
}


.paddling-warning .warning-symbol {
  display: flex;

  align-items: center;

  justify-content: center;

  width: 60px;

  height: 60px;

  border-radius: 50%;

  background: #8e4e39;

  color: white;

  font-size: 2rem;

  font-weight: 900;
}


.paddling-warning span {
  display: block;

  color: #8e4e39;

  font-size: 0.72rem;

  font-weight: 900;

  letter-spacing: 2px;

  margin-bottom: 7px;
}


.paddling-warning h3 {
  margin:
    0 0 8px;

  color: #6e3e2e;
}


.paddling-warning p {
  margin: 0;

  color: #644d44;
}


/* =========================
   PADDLING GEAR GRID
========================= */

.paddling-gear-grid {
  display: grid;

  grid-template-columns:
    repeat(2, 1fr);

  gap: 20px;

  margin-top: 35px;
}


.paddling-gear-item {
  padding: 28px;

  border:
    1px solid
    #d2dcda;

  border-radius: 14px;

  background: #f4f7f5;
}


.paddling-gear-item > span {
  display: inline-block;

  margin-bottom: 18px;

  color: #6e9a84;

  font-size: 0.8rem;

  font-weight: 900;

  letter-spacing: 2px;
}


.paddling-gear-item h3 {
  margin:
    0 0 10px;

  font-size: 1.2rem;
}


.paddling-gear-item p {
  margin: 0;

  font-size: 0.95rem;

  line-height: 1.65;
}


/* =========================
   WATER DATA BOX
========================= */

.paddle-data-box {
  display: grid;

  grid-template-columns:
    repeat(3, 1fr);

  gap: 1px;

  margin-top: 35px;

  overflow: hidden;

  border:
    1px solid
    #cbd7d4;

  border-radius: 14px;

  background: #cbd7d4;
}


.paddle-data-box div {
  padding:
    25px 20px;

  background: #edf3f0;

  text-align: center;
}


.paddle-data-box small {
  display: block;

  color: #65837b;

  font-size: 0.68rem;

  font-weight: 800;

  letter-spacing: 1.5px;

  margin-bottom: 7px;
}


.paddle-data-box strong {
  color: #164047;

  font-size: 1rem;
}


/* =========================
   PADDLING STEP GRID
========================= */

.paddle-step-grid {
  display: grid;

  grid-template-columns:
    repeat(2, 1fr);

  gap: 20px;

  margin-top: 35px;
}


.paddle-step-card {
  padding: 28px;

  border:
    1px solid
    #d0dcda;

  border-radius: 14px;

  background: #eef4f1;
}


.paddle-step-card strong {
  display: inline-flex;

  align-items: center;

  justify-content: center;

  width: 48px;

  height: 48px;

  margin-bottom: 15px;

  border-radius: 50%;

  background: #17454a;

  color: #d2e6a3;

  font-size: 1rem;
}


.paddle-step-card span {
  display: block;

  color: #547b70;

  font-size: 0.72rem;

  font-weight: 900;

  letter-spacing: 1.5px;

  margin-bottom: 10px;
}


.paddle-step-card p {
  margin: 0;

  font-size: 0.95rem;

  line-height: 1.65;
}


/* =========================
   PADDLING QUOTE
========================= */

.paddling-quote {
  margin:
    40px 0 0;

  padding: 40px;

  border-left:
    6px solid
    #94c59b;

  background: #164047;

  border-radius:
    0 16px 16px 0;
}


.paddling-quote p {
  margin:
    0 0 15px;

  color: white;

  font-size: 1.7rem;

  font-weight: 700;

  line-height: 1.35;
}


.paddling-quote cite {
  color: #c9dd9f;

  font-style: normal;

  font-size: 0.8rem;

  font-weight: 800;

  letter-spacing: 1px;
}


/* =========================
   FINAL PADDLE CHECKLIST
========================= */

.final-paddle-checklist {
  overflow: hidden;

  margin-top: 35px;

  border:
    2px solid
    #17454a;

  border-radius: 16px;
}


/* Reuses:
   .final-check-header
   .final-check-grid
   from the hiking/camping styles */


/* =========================
   PADDLING DISCLAIMER
========================= */

.paddling-disclaimer {
  margin-top: 50px;

  padding:
    28px 30px;

  border:
    1px dashed
    #839b98;

  border-radius: 12px;

  color: #536263;

  font-size: 0.9rem;

  line-height: 1.7;
}


.paddling-disclaimer strong {
  color: #164047;
}


/* =========================
   PADDLING SIDEBAR
========================= */

.paddling-sidebar {
  position: sticky;

  top: 30px;
}


.paddling-sidebar-card {
  margin-bottom: 25px;

  padding: 28px;

  border:
    1px solid
    #d4dcda;

  border-radius: 16px;

  background: #fffefa;
}


.paddling-sidebar-card h3 {
  color: #164047;

  margin:
    5px 0 20px;

  font-size: 1.25rem;
}


/* =========================
   WATER MAP CARD
========================= */

.water-map-card {
  background:
    linear-gradient(
      rgba(22, 64, 71, 0.97),
      rgba(22, 64, 71, 0.97)
    );

  color: white;

  border: 0;
}


.water-map-card h3 {
  color: white;
}


.paddling-sidebar-fact {
  display: flex;

  justify-content: space-between;

  gap: 20px;

  padding:
    13px 0;

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


.paddling-sidebar-fact:last-child {
  border-bottom: 0;
}


.paddling-sidebar-fact span {
  color: #c8dc99;

  font-size: 0.65rem;

  font-weight: 800;

  letter-spacing: 1px;
}


.paddling-sidebar-fact strong {
  color: white;

  font-size: 0.85rem;

  text-align: right;
}


/* =========================
   PADDLING TABLE OF CONTENTS
========================= */

.paddling-toc {
  display: flex;

  flex-direction: column;
}


.paddling-toc a {
  display: flex;

  align-items: center;

  gap: 14px;

  padding:
    13px 0;

  border-bottom:
    1px solid
    #e0e6e3;

  color: #30474a;

  font-weight: 700;
}


.paddling-toc a:last-child {
  border-bottom: 0;
}


.paddling-toc a:hover {
  color: #4e7b70;
}


.paddling-toc span {
  color: #78a18f;

  font-size: 0.72rem;

  font-weight: 900;
}


/* =========================
   WATER FIELD NOTE
========================= */

.paddling-field-note {
  border:
    2px solid
    #94c59b;

  background: #e5eee6;
}


.paddling-field-note > span {
  color: #4e786a;

  font-size: 0.7rem;

  font-weight: 900;

  letter-spacing: 2px;
}


.paddling-field-note p {
  margin: 0;

  color: #405855;

  line-height: 1.65;
}


/* =========================
   PADDLING SIDEBAR LINKS
========================= */

.paddling-sidebar-link {
  display: block;

  padding:
    13px 0;

  border-bottom:
    1px solid
    #e0e6e3;

  color: #315f5b;

  font-weight: 800;
}


.paddling-sidebar-link:hover {
  color: #6d9886;
}


/* =========================
   PADDLING BOTTOM BANNER
========================= */

.paddling-bottom-banner {
  position: relative;

  padding:
    110px 0;

  background:
    linear-gradient(
      rgba(8, 42, 46, 0.86),
      rgba(8, 42, 46, 0.92)
    ),
    url("images/paddling-guide.png");

  background-size: cover;

  background-position: center;

  color: white;
}


.paddling-bottom-content {
  max-width: 750px;
}


.paddling-bottom-content h2 {
  color: white;

  font-size:
    clamp(
      2.8rem,
      6vw,
      5rem
    );

  line-height: 1;

  letter-spacing: -3px;

  margin-bottom: 25px;
}


.paddling-bottom-content
> p:not(.paddling-kicker) {
  color: #e7efee;

  font-size: 1.15rem;

  line-height: 1.7;

  margin-bottom: 30px;
}


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

@media (max-width: 1000px) {

  .paddle-field-grid {
    grid-template-columns:
      repeat(2, 1fr);
  }


  .paddling-guide-layout {
    grid-template-columns:
      1fr;

    gap: 50px;
  }


  .paddling-sidebar {
    position: static;
  }

}


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

@media (max-width: 700px) {

  .paddling-guide-hero {
    min-height: 500px;
  }


  .paddling-guide-hero h1 {
    letter-spacing: -2px;
  }


  .paddle-field-grid {
    grid-template-columns:
      1fr;
  }


  .paddle-field-item {
    border-right: 0;

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


  .paddle-field-item:first-child {
    border-left: 0;
  }


  .paddling-guide-section {
    padding:
      60px 0 80px;
  }


  .paddling-guide-block {
    padding:
      30px 24px;

    margin-bottom: 30px;
  }


  .paddling-gear-grid {
    grid-template-columns:
      1fr;
  }


  .paddle-data-box {
    grid-template-columns:
      1fr;
  }


  .paddle-step-grid {
    grid-template-columns:
      1fr;
  }


  .paddling-warning {
    grid-template-columns:
      1fr;
  }

}

/* =========================================================
   OUTLAND BOUND ABOUT PAGE
   OPTION 3 FIELD GUIDE STYLE
   ========================================================= */


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

.about-hero {
  position: relative;

  min-height: 590px;

  display: flex;
  align-items: center;

  background:
    linear-gradient(
      rgba(8, 31, 22, 0.25),
      rgba(8, 31, 22, 0.72)
    ),
    url("images/hero-mountain.png");

  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;

  color: white;

  overflow: hidden;
}


.about-hero-overlay {
  position: absolute;
  inset: 0;

  background:
    linear-gradient(
      90deg,
      rgba(8, 31, 22, 0.88) 0%,
      rgba(8, 31, 22, 0.58) 45%,
      rgba(8, 31, 22, 0.16) 100%
    );
}


.about-hero-content {
  position: relative;

  z-index: 2;

  max-width: 900px;

  padding:
    95px 0;
}


.about-kicker {
  color: #d2e6a3;

  font-size: 0.85rem;

  font-weight: 900;

  letter-spacing: 3px;

  text-transform: uppercase;

  margin-bottom: 20px;

  text-shadow:
    0 2px 5px
    rgba(0, 0, 0, 0.75);
}


.about-hero h1 {
  color: white;

  font-size:
    clamp(
      3.5rem,
      7vw,
      6.4rem
    );

  line-height: 0.95;

  letter-spacing: -4px;

  max-width: 900px;

  margin-bottom: 30px;

  text-shadow:
    0 4px 20px
    rgba(0, 0, 0, 0.42);
}


.about-hero-text {
  max-width: 720px;

  color: #f3f7f2;

  font-size: 1.2rem;

  line-height: 1.7;

  margin-bottom: 35px;

  text-shadow:
    0 2px 8px
    rgba(0, 0, 0, 0.65);
}


.about-hero-tags {
  display: flex;

  flex-wrap: wrap;

  gap: 10px;
}


.about-hero-tags span {
  padding:
    9px 16px;

  border:
    1px solid
    rgba(255, 255, 255, 0.45);

  border-radius: 100px;

  background:
    rgba(8, 31, 22, 0.52);

  color: white;

  font-size: 0.82rem;

  font-weight: 700;
}


/* =========================
   ABOUT FIELD STRIP
========================= */

.about-field-strip {
  background: #153f31;

  border-top:
    1px solid
    rgba(255, 255, 255, 0.12);

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


.about-field-grid {
  display: grid;

  grid-template-columns:
    repeat(4, 1fr);
}


.about-field-item {
  display: flex;

  align-items: center;

  gap: 18px;

  padding:
    28px 22px;

  border-right:
    1px solid
    rgba(255, 255, 255, 0.15);
}


.about-field-item:first-child {
  border-left:
    1px solid
    rgba(255, 255, 255, 0.15);
}


.about-field-number {
  color: #b8cf86;

  font-size: 1.65rem;

  font-weight: 900;
}


.about-field-item div {
  display: flex;

  flex-direction: column;

  gap: 3px;
}


.about-field-item small {
  color: #b8cf86;

  font-size: 0.65rem;

  font-weight: 800;

  letter-spacing: 1.5px;
}


.about-field-item strong {
  color: white;

  font-size: 0.95rem;
}


/* =========================
   ABOUT GENERAL SECTION
========================= */

.about-section {
  background: #f4f0e6;

  padding:
    100px 0;
}


.about-intro-layout {
  display: grid;

  grid-template-columns:
    0.8fr
    1.2fr;

  gap: 80px;

  align-items: start;
}


.about-section-heading h2,
.about-topics-heading h2,
.about-approach-heading h2,
.about-gear-content h2,
.about-field-content h2,
.about-beginner-content h2,
.about-safety-note h2,
.about-bottom-content h2 {
  color: #173b2b;

  font-size:
    clamp(
      2.4rem,
      5vw,
      4.2rem
    );

  line-height: 1.03;

  letter-spacing: -2.5px;
}


.about-section-number {
  color: #5b7c64;

  font-size: 0.75rem;

  font-weight: 900;

  letter-spacing: 2.2px;

  text-transform: uppercase;

  margin-bottom: 16px;
}


.about-intro-copy p,
.about-gear-content p,
.about-field-content p,
.about-beginner-content p,
.about-safety-note p {
  color: #405047;

  font-size: 1.05rem;

  line-height: 1.8;

  margin-bottom: 22px;
}


.about-lead {
  color: #263d31 !important;

  font-size: 1.25rem !important;

  line-height: 1.75 !important;
}


/* =========================
   WHAT WE COVER
========================= */

.about-topics-section {
  background: white;

  padding:
    100px 0;
}


.about-topics-heading {
  max-width: 760px;

  margin-bottom: 50px;
}


.about-topics-heading h2 {
  margin-bottom: 20px;
}


.about-topics-heading > p:last-child {
  color: #667069;

  line-height: 1.7;
}


.about-topic-grid {
  display: grid;

  grid-template-columns:
    repeat(3, 1fr);

  gap: 24px;
}


.about-topic-card {
  position: relative;

  min-height: 310px;

  display: flex;

  flex-direction: column;

  padding: 32px;

  background: #f7f5ed;

  border:
    1px solid
    #d9ddd2;

  border-radius: 18px;

  transition:
    transform 0.25s ease,
    box-shadow 0.25s ease;
}


.about-topic-card:hover {
  transform:
    translateY(-5px);

  box-shadow:
    0 18px 40px
    rgba(23, 59, 43, 0.08);
}


.about-topic-feature {
  background: #173b2b;

  border-color: #173b2b;
}


.about-topic-number {
  display: inline-flex;

  align-items: center;

  justify-content: center;

  width: 48px;
  height: 48px;

  border-radius: 50%;

  background: #173b2b;

  color: #d2e6a3;

  font-weight: 900;

  margin-bottom: 24px;
}


.about-topic-feature .about-topic-number {
  background: #d2e6a3;

  color: #173b2b;
}


.about-topic-label {
  color: #66806f;

  font-size: 0.7rem;

  font-weight: 900;

  letter-spacing: 1.8px;

  margin-bottom: 8px;
}


.about-topic-card h3 {
  color: #173b2b;

  font-size: 1.6rem;

  margin-bottom: 12px;
}


.about-topic-card > p:not(.about-topic-label) {
  color: #5c6861;

  line-height: 1.7;

  margin-bottom: 25px;
}


.about-topic-link {
  margin-top: auto;

  color: #35634c;

  font-weight: 800;
}


.about-topic-link:hover {
  text-decoration: underline;
}


.about-topic-feature .about-topic-label,
.about-topic-feature h3,
.about-topic-feature > p,
.about-topic-feature .about-topic-link {
  color: white;
}


.about-topic-feature .about-topic-label,
.about-topic-feature .about-topic-link {
  color: #d2e6a3;
}


/* =========================
   OUR APPROACH
========================= */

.about-approach-section {
  background: #0d281d;

  color: white;

  padding:
    110px 0;
}


.about-approach-layout {
  display: grid;

  grid-template-columns:
    0.9fr
    1.1fr;

  gap: 80px;

  align-items: start;
}


.about-approach-heading h2 {
  color: white;

  margin-bottom: 25px;
}


.about-approach-heading > p:last-child {
  max-width: 560px;

  color: #c6d2cb;

  font-size: 1.05rem;

  line-height: 1.75;
}


.about-principles {
  display: flex;

  flex-direction: column;
}


.about-principle {
  display: grid;

  grid-template-columns:
    65px
    1fr;

  gap: 22px;

  padding:
    26px 0;

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


.about-principle:first-child {
  padding-top: 0;
}


.about-principle > span {
  color: #b8cf86;

  font-weight: 900;
}


.about-principle h3 {
  color: white;

  margin-bottom: 7px;

  font-size: 1.3rem;
}


.about-principle p {
  color: #b9c8c0;

  line-height: 1.65;
}


/* =========================
   GEAR PHILOSOPHY
========================= */

.about-gear-section {
  background: #f4f0e6;

  padding:
    100px 0;
}


.about-gear-layout {
  display: grid;

  grid-template-columns:
    280px
    1fr;

  gap: 70px;

  align-items: start;
}


.about-gear-marker {
  min-height: 280px;

  display: flex;

  flex-direction: column;

  justify-content: space-between;

  padding: 30px;

  background: #173b2b;

  border-radius: 18px;

  color: white;
}


.about-gear-marker span {
  color: #b8cf86;

  font-size: 0.72rem;

  font-weight: 900;

  letter-spacing: 2px;
}


.about-gear-marker strong {
  color: white;

  font-size: 3.4rem;

  letter-spacing: -2px;
}


.about-gear-content {
  max-width: 760px;
}


.about-gear-content h2 {
  margin-bottom: 25px;
}


.about-inline-link {
  display: inline-block;

  margin-top: 8px;

  color: #35634c;

  font-weight: 800;
}


.about-inline-link:hover {
  text-decoration: underline;
}


/* =========================
   FIELD EXPERIENCE
========================= */

.about-field-section {
  background: #173b2b;

  color: white;

  padding:
    110px 0;
}


.about-field-layout {
  display: grid;

  grid-template-columns:
    1.2fr
    0.8fr;

  gap: 75px;

  align-items: center;
}


.about-field-content h2 {
  color: white;

  margin-bottom: 25px;
}


.about-field-content p {
  color: #c3d0c8;
}


.about-field-note-card {
  padding: 38px;

  background:
    rgba(255, 255, 255, 0.07);

  border:
    1px solid
    rgba(255, 255, 255, 0.15);

  border-radius: 18px;
}


.about-field-note-card > span {
  color: #b8cf86;

  font-size: 0.72rem;

  font-weight: 900;

  letter-spacing: 2px;
}


.about-field-note-card blockquote {
  color: white;

  font-size: 1.55rem;

  font-weight: 700;

  line-height: 1.45;

  margin:
    25px 0;
}


.about-field-note-card p {
  color: #b8cf86;

  font-size: 0.85rem;

  font-weight: 700;
}


/* =========================
   BEGINNER MESSAGE
========================= */

.about-beginner-section {
  background: white;

  padding:
    100px 0;
}


.about-beginner-layout {
  display: grid;

  grid-template-columns:
    150px
    1fr;

  gap: 60px;

  max-width: 980px;
}


.about-beginner-number {
  display: flex;

  align-items: center;

  justify-content: center;

  width: 120px;
  height: 120px;

  border-radius: 50%;

  background: #173b2b;

  color: #d2e6a3;

  font-size: 2.3rem;

  font-weight: 900;
}


.about-beginner-content h2 {
  margin-bottom: 25px;
}


/* =========================
   SAFETY NOTE
========================= */

.about-safety-note {
  background: #e8ead8;

  padding:
    85px 0;
}


.about-safety-note-layout {
  display: grid;

  grid-template-columns:
    0.8fr
    1.2fr;

  gap: 70px;
}


.about-safety-note h2 {
  font-size:
    clamp(
      2.2rem,
      4vw,
      3.5rem
    );

  margin-bottom: 0;
}


.about-safety-note-layout > div:last-child {
  padding-top: 5px;
}


/* =========================
   ABOUT BOTTOM BANNER
========================= */

.about-bottom-banner {
  position: relative;

  padding:
    115px 0;

  background:
    linear-gradient(
      rgba(8, 31, 22, 0.87),
      rgba(8, 31, 22, 0.93)
    ),
    url("images/hero-mountain.png");

  background-size: cover;

  background-position: center;

  color: white;
}


.about-bottom-content {
  max-width: 780px;
}


.about-bottom-content h2 {
  color: white;

  font-size:
    clamp(
      2.8rem,
      6vw,
      5rem
    );

  margin-bottom: 25px;
}


.about-bottom-content > p:not(.about-kicker) {
  color: #e3ece6;

  font-size: 1.15rem;

  line-height: 1.7;

  margin-bottom: 30px;
}


.about-bottom-buttons {
  display: flex;

  gap: 14px;

  flex-wrap: wrap;
}


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

@media (max-width: 1000px) {

  .about-field-grid {
    grid-template-columns:
      repeat(2, 1fr);
  }


  .about-intro-layout,
  .about-approach-layout,
  .about-field-layout,
  .about-safety-note-layout {
    grid-template-columns:
      1fr;

    gap: 45px;
  }


  .about-topic-grid {
    grid-template-columns:
      repeat(2, 1fr);
  }


  .about-gear-layout {
    grid-template-columns:
      220px
      1fr;

    gap: 45px;
  }

}


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

@media (max-width: 700px) {

  .about-hero {
    min-height: 520px;
  }


  .about-hero h1 {
    letter-spacing: -2px;
  }


  .about-field-grid {
    grid-template-columns:
      1fr;
  }


  .about-field-item {
    border-right: 0;

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


  .about-field-item:first-child {
    border-left: 0;
  }


  .about-section,
  .about-topics-section,
  .about-gear-section,
  .about-beginner-section {
    padding:
      70px 0;
  }


  .about-approach-section,
  .about-field-section {
    padding:
      80px 0;
  }


  .about-topic-grid {
    grid-template-columns:
      1fr;
  }


  .about-topic-card {
    min-height: auto;
  }


  .about-gear-layout {
    grid-template-columns:
      1fr;
  }


  .about-gear-marker {
    min-height: 190px;
  }


  .about-beginner-layout {
    grid-template-columns:
      1fr;

    gap: 30px;
  }


  .about-beginner-number {
    width: 85px;
    height: 85px;

    font-size: 1.7rem;
  }


  .about-bottom-banner {
    padding:
      85px 0;
  }


  .about-bottom-buttons {
    flex-direction: column;

    align-items: flex-start;
  }

}

/* =========================================================
   OUTLAND BOUND
   LEGAL PAGES
   Affiliate Disclosure / Privacy Policy
   ========================================================= */


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

.legal-hero {
  position: relative;

  background:
    linear-gradient(
      135deg,
      #0d281d 0%,
      #173b2b 55%,
      #24513a 100%
    );

  color: var(--white);

  padding:
    95px 0
    85px;

  overflow: hidden;
}


/* subtle field-guide lines */

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

  position: absolute;

  top: 0;
  right: 0;

  width: 42%;
  height: 100%;

  opacity: 0.08;

  background-image:
    repeating-linear-gradient(
      135deg,
      transparent 0,
      transparent 18px,
      #ffffff 19px,
      transparent 20px
    );

  pointer-events: none;
}


.legal-hero-content {
  position: relative;

  z-index: 2;

  max-width: 820px;
}


.legal-kicker {
  color: #d2e6a3;

  font-size: 0.78rem;

  font-weight: 900;

  letter-spacing: 2.8px;

  text-transform: uppercase;

  margin-bottom: 18px;
}


.legal-hero h1 {
  color: var(--white);

  font-size:
    clamp(
      3rem,
      7vw,
      5.7rem
    );

  line-height: 0.98;

  letter-spacing: -3px;

  margin-bottom: 24px;
}


.legal-hero-content > p:not(.legal-kicker) {
  max-width: 700px;

  color: #dce7e0;

  font-size: 1.12rem;

  line-height: 1.75;

  margin-bottom: 25px;
}


.legal-updated {
  display: inline-block;

  padding:
    8px 14px;

  border:
    1px solid
    rgba(
      255,
      255,
      255,
      0.2
    );

  border-radius: 30px;

  background:
    rgba(
      255,
      255,
      255,
      0.06
    );

  color: #b9c9c0;

  font-size: 0.78rem;

  font-weight: 700;
}


/* =========================
   LEGAL MAIN SECTION
========================= */

.legal-section {
  background: var(--cream);

  padding:
    90px 0
    110px;
}


.legal-layout {
  display: grid;

  grid-template-columns:
    minmax(0, 1fr)
    300px;

  gap: 70px;

  align-items: start;
}


/* =========================
   LEGAL CONTENT
========================= */

.legal-content {
  min-width: 0;
}


.legal-block {
  background: var(--white);

  padding:
    42px
    45px;

  margin-bottom: 26px;

  border:
    1px solid
    rgba(
      23,
      59,
      43,
      0.1
    );

  border-radius: var(--radius);

  box-shadow:
    0 8px 28px
    rgba(
      13,
      40,
      29,
      0.04
    );
}


.legal-label {
  color: var(--green);

  font-size: 0.7rem;

  font-weight: 900;

  letter-spacing: 2px;

  text-transform: uppercase;

  margin-bottom: 12px;
}


.legal-block h2 {
  color: var(--forest);

  font-size:
    clamp(
      1.8rem,
      3vw,
      2.5rem
    );

  line-height: 1.12;

  letter-spacing: -1px;

  margin-bottom: 20px;
}


.legal-block p:not(.legal-label) {
  color: #56635b;

  line-height: 1.8;

  margin-bottom: 18px;
}


.legal-block p:last-child {
  margin-bottom: 0;
}


/* =========================
   QUICK DISCLOSURE BOX
========================= */

.legal-highlight {
  position: relative;

  background: #e9eedf;

  border:
    2px solid
    #a9bd8a;

  overflow: hidden;
}


.legal-highlight::before {
  content: "";

  position: absolute;

  top: 0;
  left: 0;

  width: 7px;
  height: 100%;

  background: var(--forest);
}


.legal-highlight .legal-label {
  color: var(--forest);
}


.legal-highlight h2 {
  color: var(--forest-dark);
}


.legal-highlight p:not(.legal-label) {
  color: #34463b;

  font-size: 1.05rem;

  font-weight: 600;
}


/* =========================
   LEGAL SIDEBAR
========================= */

.legal-sidebar {
  position: sticky;

  top: 115px;

  display: flex;

  flex-direction: column;

  gap: 20px;
}


.legal-sidebar-card {
  background: var(--white);

  padding: 28px;

  border:
    1px solid
    rgba(
      23,
      59,
      43,
      0.1
    );

  border-radius: var(--radius);

  box-shadow:
    0 8px 25px
    rgba(
      13,
      40,
      29,
      0.04
    );
}


.legal-sidebar-card:first-child {
  border-top:
    4px solid
    var(--forest);
}


.legal-sidebar-card h3 {
  color: var(--forest);

  font-size: 1.25rem;

  line-height: 1.25;

  margin-bottom: 12px;
}


.legal-sidebar-card p:not(.legal-label) {
  color: var(--text-light);

  font-size: 0.92rem;

  line-height: 1.7;
}


.legal-sidebar-link {
  display: block;

  color: var(--green);

  font-size: 0.9rem;

  font-weight: 800;

  padding:
    11px 0;

  border-bottom:
    1px solid
    rgba(
      23,
      59,
      43,
      0.1
    );
}


.legal-sidebar-link:last-child {
  border-bottom: 0;

  padding-bottom: 0;
}


.legal-sidebar-link:hover {
  color: var(--forest-dark);
}


/* =========================
   LEGAL BOTTOM SECTION
========================= */

.legal-bottom-section {
  position: relative;

  background:
    linear-gradient(
      135deg,
      #173b2b,
      #0d281d
    );

  color: var(--white);

  padding:
    100px 0;
}


.legal-bottom-content {
  max-width: 750px;
}


.legal-bottom-content h2 {
  color: var(--white);

  font-size:
    clamp(
      2.6rem,
      5vw,
      4.6rem
    );

  line-height: 1;

  letter-spacing: -2.5px;

  margin-bottom: 24px;
}


.legal-bottom-content > p:not(.legal-kicker) {
  max-width: 650px;

  color: #cad8cf;

  font-size: 1.05rem;

  line-height: 1.75;

  margin-bottom: 30px;
}


/* =========================================================
   LEGAL PAGE TABLET
   ========================================================= */

@media (max-width: 950px) {

  .legal-layout {
    grid-template-columns:
      1fr;

    gap: 45px;
  }


  .legal-sidebar {
    position: static;

    display: grid;

    grid-template-columns:
      repeat(3, 1fr);

    gap: 18px;
  }

}


/* =========================================================
   LEGAL PAGE MOBILE
   ========================================================= */

@media (max-width: 700px) {

  .legal-hero {
    padding:
      70px 0
      65px;
  }


  .legal-hero h1 {
    letter-spacing: -2px;
  }


  .legal-hero::after {
    width: 70%;
  }


  .legal-section {
    padding:
      60px 0
      75px;
  }


  .legal-block {
    padding:
      30px
      25px;

    margin-bottom: 20px;
  }


  .legal-layout {
    gap: 35px;
  }


  .legal-sidebar {
    grid-template-columns:
      1fr;
  }


  .legal-sidebar-card {
    padding: 25px;
  }


  .legal-bottom-section {
    padding:
      75px 0;
  }


  .legal-bottom-content h2 {
    letter-spacing: -2px;
  }

}

/* =========================================================
   OUTLAND BOUND GEAR HUB
   OPTION 3 STYLE
   ========================================================= */


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

.gear-hub-hero {
  position: relative;

  min-height: 590px;

  display: flex;
  align-items: center;

  background:
    linear-gradient(
      rgba(8, 31, 22, 0.24),
      rgba(8, 31, 22, 0.72)
    ),
    url("images/gear-guide.png");

  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;

  color: white;

  overflow: hidden;
}


.gear-hub-overlay {
  position: absolute;
  inset: 0;

  background:
    linear-gradient(
      90deg,
      rgba(8, 31, 22, 0.88) 0%,
      rgba(8, 31, 22, 0.58) 45%,
      rgba(8, 31, 22, 0.16) 100%
    );
}


.gear-hub-hero-content {
  position: relative;
  z-index: 2;

  max-width: 900px;

  padding:
    95px 0;
}


.gear-hub-kicker {
  color: #d2e6a3;

  font-size: 0.85rem;

  font-weight: 900;

  letter-spacing: 3px;

  text-transform: uppercase;

  margin-bottom: 20px;

  text-shadow:
    0 2px 5px
    rgba(0, 0, 0, 0.75);
}


.gear-hub-hero h1 {
  color: white;

  font-size:
    clamp(
      3.6rem,
      7vw,
      6.5rem
    );

  line-height: 0.95;

  letter-spacing: -4px;

  max-width: 900px;

  margin-bottom: 30px;

  text-shadow:
    0 4px 20px
    rgba(0, 0, 0, 0.42);
}


.gear-hub-hero-text {
  max-width: 720px;

  color: #f3f7f2;

  font-size: 1.2rem;

  line-height: 1.7;

  margin-bottom: 35px;

  text-shadow:
    0 2px 8px
    rgba(0, 0, 0, 0.65);
}


.gear-hub-tags {
  display: flex;

  flex-wrap: wrap;

  gap: 10px;
}


.gear-hub-tags span {
  padding:
    9px 16px;

  border:
    1px solid
    rgba(255, 255, 255, 0.45);

  border-radius: 100px;

  background:
    rgba(8, 31, 22, 0.52);

  color: white;

  font-size: 0.82rem;

  font-weight: 700;
}


/* =========================
   GEAR FIELD STRIP
========================= */

.gear-field-strip {
  background: #153f31;

  border-top:
    1px solid
    rgba(255, 255, 255, 0.12);

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


.gear-field-grid {
  display: grid;

  grid-template-columns:
    repeat(4, 1fr);
}


.gear-field-item {
  display: flex;

  align-items: center;

  gap: 18px;

  padding:
    28px 22px;

  border-right:
    1px solid
    rgba(255, 255, 255, 0.15);
}


.gear-field-item:first-child {
  border-left:
    1px solid
    rgba(255, 255, 255, 0.15);
}


.gear-field-number {
  color: #b8cf86;

  font-size: 1.65rem;

  font-weight: 900;
}


.gear-field-item div {
  display: flex;

  flex-direction: column;

  gap: 3px;
}


.gear-field-item small {
  color: #b8cf86;

  font-size: 0.65rem;

  font-weight: 800;

  letter-spacing: 1.5px;
}


.gear-field-item strong {
  color: white;

  font-size: 0.95rem;
}


/* =========================
   GEAR INTRO
========================= */

.gear-hub-section {
  background: #f4f0e6;

  padding:
    100px 0;
}


.gear-hub-intro-layout {
  display: grid;

  grid-template-columns:
    0.8fr
    1.2fr;

  gap: 80px;

  align-items: start;
}


.gear-hub-label {
  color: #5b7c64;

  font-size: 0.75rem;

  font-weight: 900;

  letter-spacing: 2.2px;

  text-transform: uppercase;

  margin-bottom: 16px;
}


.gear-hub-intro-layout h2,
.gear-category-heading h2,
.gear-essential-heading h2,
.gear-products-heading h2,
.gear-affiliate-layout h2,
.gear-bottom-content h2 {
  color: #173b2b;

  font-size:
    clamp(
      2.4rem,
      5vw,
      4.2rem
    );

  line-height: 1.03;

  letter-spacing: -2.5px;
}


.gear-hub-intro-layout p {
  color: #405047;

  font-size: 1.05rem;

  line-height: 1.8;

  margin-bottom: 22px;
}


.gear-hub-lead {
  color: #263d31 !important;

  font-size: 1.25rem !important;

  line-height: 1.75 !important;
}


/* =========================
   GEAR CATEGORIES
========================= */

.gear-category-section {
  background: white;

  padding:
    100px 0;
}


.gear-category-heading {
  max-width: 780px;

  margin-bottom: 50px;
}


.gear-category-heading h2 {
  margin-bottom: 20px;
}


.gear-category-heading > p:last-child {
  color: #667069;

  line-height: 1.7;
}


.gear-category-grid {
  display: grid;

  grid-template-columns:
    repeat(3, 1fr);

  gap: 26px;
}


.gear-category-card {
  background: #f7f5ed;

  border:
    1px solid
    #d9ddd2;

  border-radius: 18px;

  overflow: hidden;

  transition:
    transform 0.25s ease,
    box-shadow 0.25s ease;
}


.gear-category-card:hover {
  transform:
    translateY(-5px);

  box-shadow:
    0 18px 40px
    rgba(23, 59, 43, 0.08);
}


.gear-category-image {
  min-height: 235px;

  background-size: cover;

  background-position: center;

  background-repeat: no-repeat;
}


.gear-category-content {
  padding: 30px;
}


.gear-category-number {
  display: inline-flex;

  align-items: center;

  justify-content: center;

  width: 46px;
  height: 46px;

  border-radius: 50%;

  background: #173b2b;

  color: #d2e6a3;

  font-weight: 900;

  margin-bottom: 20px;
}


.gear-category-label {
  color: #66806f;

  font-size: 0.7rem;

  font-weight: 900;

  letter-spacing: 1.8px;

  margin-bottom: 8px;
}


.gear-category-content h3 {
  color: #173b2b;

  font-size: 1.55rem;

  margin-bottom: 12px;
}


.gear-category-content > p:not(.gear-category-label) {
  color: #5c6861;

  line-height: 1.7;

  margin-bottom: 22px;
}


.gear-hub-link {
  color: #35634c;

  font-weight: 800;
}


.gear-hub-link:hover {
  text-decoration: underline;
}


/* =========================
   SIMPLE GEAR CARDS
========================= */

.gear-category-simple {
  display: flex;

  flex-direction: column;
}


.gear-category-symbol {
  min-height: 180px;

  display: flex;

  align-items: center;

  justify-content: center;

  background: #173b2b;

  color: #d2e6a3;

  font-size: 4rem;

  font-weight: 900;
}


.gear-coming-soon {
  display: inline-block;

  color: #6d846f;

  font-size: 0.8rem;

  font-weight: 800;

  text-transform: uppercase;

  letter-spacing: 1.2px;
}


/* =========================
   ESSENTIAL GEAR
========================= */

.gear-essential-section {
  background: #0d281d;

  color: white;

  padding:
    110px 0;
}


.gear-essential-layout {
  display: grid;

  grid-template-columns:
    0.9fr
    1.1fr;

  gap: 80px;

  align-items: start;
}


.gear-essential-heading h2 {
  color: white;

  margin-bottom: 25px;
}


.gear-essential-heading > p:last-child {
  color: #c6d2cb;

  font-size: 1.05rem;

  line-height: 1.75;

  max-width: 560px;
}


.gear-essential-list {
  display: flex;

  flex-direction: column;
}


.gear-essential-item {
  display: grid;

  grid-template-columns:
    65px
    1fr;

  gap: 22px;

  padding:
    25px 0;

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


.gear-essential-item:first-child {
  padding-top: 0;
}


.gear-essential-item > span {
  color: #b8cf86;

  font-weight: 900;
}


.gear-essential-item h3 {
  color: white;

  font-size: 1.3rem;

  margin-bottom: 7px;
}


.gear-essential-item p {
  color: #b9c8c0;

  line-height: 1.65;
}


/* =========================
   PRODUCT GUIDES
========================= */

.gear-products-section {
  background: #f4f0e6;

  padding:
    100px 0;
}


.gear-products-heading {
  max-width: 760px;

  margin-bottom: 50px;
}


.gear-products-heading h2 {
  margin-bottom: 20px;
}


.gear-products-heading > p:last-child {
  color: #667069;

  line-height: 1.7;
}


.gear-product-grid {
  display: grid;

  grid-template-columns:
    repeat(3, 1fr);

  gap: 24px;
}


.gear-product-card {
  min-height: 260px;

  display: flex;

  flex-direction: column;

  padding: 30px;

  background: white;

  border:
    1px solid
    #d8ddd3;

  border-radius: 18px;

  box-shadow:
    0 8px 26px
    rgba(23, 59, 43, 0.05);
}


.gear-product-status {
  display: inline-block;

  align-self: flex-start;

  color: #5e7a62;

  background: #e8ead8;

  padding:
    6px 10px;

  border-radius: 30px;

  font-size: 0.68rem;

  font-weight: 900;

  letter-spacing: 1.4px;

  margin-bottom: 20px;
}


.gear-product-card h3 {
  color: #173b2b;

  font-size: 1.4rem;

  margin-bottom: 12px;
}


.gear-product-card p {
  color: #5e6962;

  line-height: 1.7;
}


/* =========================
   AFFILIATE SECTION
========================= */

.gear-affiliate-section {
  background: #e8ead8;

  padding:
    85px 0;
}


.gear-affiliate-layout {
  display: grid;

  grid-template-columns:
    0.8fr
    1.2fr;

  gap: 70px;

  align-items: start;
}


.gear-affiliate-layout h2 {
  font-size:
    clamp(
      2.2rem,
      4vw,
      3.6rem
    );
}


.gear-affiliate-layout p {
  color: #47584d;

  line-height: 1.75;

  margin-bottom: 16px;
}


.gear-affiliate-link {
  display: inline-block;

  color: #35634c;

  font-weight: 800;

  margin-top: 4px;
}


.gear-affiliate-link:hover {
  text-decoration: underline;
}


/* =========================
   GEAR BOTTOM BANNER
========================= */

.gear-bottom-banner {
  position: relative;

  padding:
    115px 0;

  background:
    linear-gradient(
      rgba(8, 31, 22, 0.88),
      rgba(8, 31, 22, 0.94)
    ),
    url("images/gear-guide.png");

  background-size: cover;

  background-position: center;

  color: white;
}


.gear-bottom-content {
  max-width: 780px;
}


.gear-bottom-content h2 {
  color: white;

  font-size:
    clamp(
      2.8rem,
      6vw,
      5rem
    );

  margin-bottom: 25px;
}


.gear-bottom-content > p:not(.gear-hub-kicker) {
  color: #e3ece6;

  font-size: 1.15rem;

  line-height: 1.7;

  margin-bottom: 30px;
}


.gear-bottom-buttons {
  display: flex;

  gap: 14px;

  flex-wrap: wrap;
}


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

@media (max-width: 1000px) {

  .gear-field-grid {
    grid-template-columns:
      repeat(2, 1fr);
  }


  .gear-hub-intro-layout,
  .gear-essential-layout,
  .gear-affiliate-layout {
    grid-template-columns:
      1fr;

    gap: 45px;
  }


  .gear-category-grid,
  .gear-product-grid {
    grid-template-columns:
      repeat(2, 1fr);
  }

}


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

@media (max-width: 700px) {

  .gear-hub-hero {
    min-height: 520px;
  }


  .gear-hub-hero h1 {
    letter-spacing: -2px;
  }


  .gear-field-grid {
    grid-template-columns:
      1fr;
  }


  .gear-field-item {
    border-right: 0;

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


  .gear-field-item:first-child {
    border-left: 0;
  }


  .gear-hub-section,
  .gear-category-section,
  .gear-products-section {
    padding:
      70px 0;
  }


  .gear-essential-section {
    padding:
      80px 0;
  }


  .gear-category-grid,
  .gear-product-grid {
    grid-template-columns:
      1fr;
  }


  .gear-category-image {
    min-height: 220px;
  }


  .gear-affiliate-section {
    padding:
      65px 0;
  }


  .gear-bottom-banner {
    padding:
      85px 0;
  }


  .gear-bottom-buttons {
    flex-direction: column;

    align-items: flex-start;
  }

}

/* =========================================================
   SAFETY HUB
   OUTLAND BOUND
   ========================================================= */


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

.safety-hero {
  position: relative;
  min-height: 590px;
  display: flex;
  align-items: center;
  background:
    url("images/safety-guide.png")
    center center / cover no-repeat;
  overflow: hidden;
}

.safety-hero-overlay {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(
      90deg,
      rgba(5, 43, 31, 0.94) 0%,
      rgba(5, 43, 31, 0.78) 42%,
      rgba(5, 43, 31, 0.35) 75%,
      rgba(5, 43, 31, 0.18) 100%
    );
}

.safety-hero-content {
  position: relative;
  z-index: 2;
  width: 100%;
  padding-top: 95px;
  padding-bottom: 95px;
}

.safety-eyebrow {
  margin: 0 0 24px;
  color: #d2e6a3;
  font-size: 15px;
  font-weight: 800;
  letter-spacing: 4px;
  text-transform: uppercase;
}

.safety-hero h1 {
  max-width: 760px;
  margin: 0 0 28px;
  color: #ffffff;
  font-size: clamp(54px, 7vw, 88px);
  line-height: 0.98;
  letter-spacing: -3px;
}

.safety-hero-text {
  max-width: 720px;
  margin: 0;
  color: #ffffff;
  font-size: 21px;
  line-height: 1.7;
}

.safety-hero-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 38px;
}

.safety-hero-tags span {
  padding: 11px 20px;
  border: 1px solid rgba(255, 255, 255, 0.65);
  border-radius: 999px;
  color: #ffffff;
  font-size: 14px;
  font-weight: 700;
}


/* =========================
   SHARED SAFETY EYEBROWS
========================= */

.section-eyebrow {
  margin: 0 0 18px;
  color: #5f7f6d;
  font-size: 14px;
  font-weight: 800;
  letter-spacing: 3px;
  text-transform: uppercase;
}


/* =========================
   SAFETY INTRO
========================= */

.safety-intro {
  padding: 90px 0;
  background: #f5f1e7;
}

.safety-intro .container {
  max-width: 1050px;
}

.safety-intro h2 {
  max-width: 800px;
  margin: 0 0 28px;
  color: #123f30;
  font-size: clamp(38px, 5vw, 58px);
  line-height: 1.08;
  letter-spacing: -2px;
}

.safety-intro-text {
  max-width: 850px;
  margin: 0 0 18px;
  color: #58645d;
  font-size: 19px;
  line-height: 1.8;
}


/* =========================
   SAFETY CATEGORY SECTION
========================= */

.safety-categories {
  padding: 100px 0;
  background: #ffffff;
}

.safety-categories h2 {
  margin: 0 0 20px;
  color: #123f30;
  font-size: clamp(38px, 5vw, 56px);
  line-height: 1.08;
  letter-spacing: -2px;
}

.safety-section-intro {
  max-width: 750px;
  margin: 0 0 55px;
  color: #68736d;
  font-size: 18px;
  line-height: 1.7;
}


/* =========================
   SAFETY CARDS
========================= */

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

.safety-card {
  min-height: 330px;
  padding: 38px;
  background: #f5f1e7;
  border: 1px solid #d9ddcf;
  border-radius: 20px;
}

.safety-number {
  display: flex;
  width: 52px;
  height: 52px;
  margin-bottom: 30px;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: #123f30;
  color: #d2e6a3;
  font-size: 15px;
  font-weight: 800;
}

.safety-card-label {
  margin: 0 0 13px;
  color: #688170;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 2px;
  text-transform: uppercase;
}

.safety-card h3 {
  margin: 0 0 18px;
  color: #123f30;
  font-size: 28px;
  line-height: 1.2;
}

.safety-card p:last-child {
  margin-bottom: 0;
  color: #5d6962;
  font-size: 17px;
  line-height: 1.7;
}


/* =========================
   FIELD RULES
========================= */

.safety-rules {
  padding: 100px 0;
  background: #082f23;
}

.safety-light-eyebrow {
  color: #d2e6a3;
}

.safety-rules h2 {
  margin: 0 0 55px;
  color: #ffffff;
  font-size: clamp(40px, 5vw, 58px);
  line-height: 1.08;
  letter-spacing: -2px;
}

.safety-rule-list {
  border-top: 1px solid rgba(255, 255, 255, 0.18);
}

.safety-rule {
  display: grid;
  grid-template-columns: 70px 1fr;
  gap: 25px;
  padding: 30px 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.18);
}

.safety-rule > span {
  padding-top: 4px;
  color: #d2e6a3;
  font-size: 16px;
  font-weight: 800;
}

.safety-rule h3 {
  margin: 0 0 8px;
  color: #ffffff;
  font-size: 23px;
}

.safety-rule p {
  max-width: 760px;
  margin: 0;
  color: #c6d1cb;
  font-size: 17px;
  line-height: 1.65;
}


/* =========================
   SAFETY GUIDES
========================= */

.safety-guides {
  padding: 100px 0;
  background: #f5f1e7;
}

.safety-guides h2 {
  margin: 0 0 20px;
  color: #123f30;
  font-size: clamp(40px, 5vw, 58px);
  line-height: 1.08;
  letter-spacing: -2px;
}

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

.safety-guide-card {
  min-height: 310px;
  padding: 36px;
  background: #ffffff;
  border: 1px solid #d8ddcf;
  border-radius: 20px;
}

.safety-guide-card .coming-soon {
  display: inline-block;
  margin-bottom: 25px;
  padding: 8px 13px;
  border-radius: 999px;
  background: #e8eddc;
  color: #597564;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 1.5px;
}

.safety-guide-card h3 {
  margin: 0 0 16px;
  color: #123f30;
  font-size: 27px;
  line-height: 1.25;
}

.safety-guide-card p {
  margin: 0 0 25px;
  color: #626d67;
  font-size: 17px;
  line-height: 1.7;
}

.safety-guide-card a {
  color: #2f684f;
  font-weight: 800;
  text-decoration: none;
}

.safety-guide-card a:hover {
  text-decoration: underline;
}


/* =========================
   IMPORTANT SAFETY NOTE
========================= */

.safety-note {
  padding: 90px 0;
  background: #ffffff;
}

.safety-note-box {
  padding: 55px;
  background: #e9eddc;
  border-left: 6px solid #b8d487;
  border-radius: 0 22px 22px 0;
}

.safety-note-box h2 {
  max-width: 850px;
  margin: 0 0 25px;
  color: #123f30;
  font-size: clamp(32px, 4vw, 46px);
  line-height: 1.15;
  letter-spacing: -1px;
}

.safety-note-box p:not(.section-eyebrow) {
  max-width: 900px;
  margin: 0 0 17px;
  color: #536159;
  font-size: 17px;
  line-height: 1.75;
}


/* =========================
   FINAL SAFETY BANNER
========================= */

.safety-bottom-banner {
  position: relative;
  min-height: 500px;
  display: flex;
  align-items: center;
  background:
    url("images/safety-guide.png")
    center center / cover no-repeat;
  overflow: hidden;
}

.safety-bottom-overlay {
  position: absolute;
  inset: 0;
  background: rgba(4, 39, 28, 0.86);
}

.safety-bottom-content {
  position: relative;
  z-index: 2;
  padding-top: 85px;
  padding-bottom: 85px;
}

.safety-bottom-content h2 {
  max-width: 750px;
  margin: 0 0 25px;
  color: #ffffff;
  font-size: clamp(45px, 6vw, 68px);
  line-height: 1.05;
  letter-spacing: -2px;
}

.safety-bottom-content > p:not(.safety-eyebrow) {
  max-width: 720px;
  margin: 0;
  color: #ffffff;
  font-size: 20px;
  line-height: 1.7;
}

.safety-bottom-buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  margin-top: 35px;
}


/* =========================
   SAFETY BUTTONS
========================= */

.safety-bottom-buttons .btn {
  display: inline-flex;
  min-height: 58px;
  padding: 0 28px;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  font-size: 16px;
  font-weight: 800;
  text-decoration: none;
}

.safety-bottom-buttons .btn-primary {
  background: #c8df93;
  color: #123f30;
}

.safety-bottom-buttons .btn-outline {
  border: 2px solid #ffffff;
  color: #ffffff;
  background: transparent;
}

.safety-bottom-buttons .btn-primary:hover {
  background: #d7e9ad;
}

.safety-bottom-buttons .btn-outline:hover {
  background: #ffffff;
  color: #123f30;
}


/* =========================
   SAFETY RESPONSIVE
========================= */

@media (max-width: 850px) {

  .safety-hero {
    min-height: 560px;
  }

  .safety-hero-content {
    padding-top: 75px;
    padding-bottom: 75px;
  }

  .safety-hero h1 {
    letter-spacing: -2px;
  }

  .safety-grid,
  .safety-guide-grid {
    grid-template-columns: 1fr;
  }

  .safety-card,
  .safety-guide-card {
    min-height: auto;
  }

  .safety-rule {
    grid-template-columns: 50px 1fr;
  }

  .safety-note-box {
    padding: 38px 30px;
  }

}


@media (max-width: 560px) {

  .safety-hero {
    min-height: 540px;
  }

  .safety-hero-content {
    padding-top: 60px;
    padding-bottom: 60px;
  }

  .safety-hero h1 {
    font-size: 50px;
    letter-spacing: -2px;
  }

  .safety-hero-text {
    font-size: 18px;
  }

  .safety-hero-tags {
    gap: 8px;
  }

  .safety-hero-tags span {
    padding: 9px 14px;
    font-size: 12px;
  }

  .safety-intro,
  .safety-categories,
  .safety-rules,
  .safety-guides,
  .safety-note {
    padding-top: 70px;
    padding-bottom: 70px;
  }

  .safety-card,
  .safety-guide-card {
    padding: 28px;
  }

  .safety-rule {
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .safety-bottom-buttons {
    flex-direction: column;
    align-items: flex-start;
  }

}

/* =========================================
   SAFETY HERO — MOVE ALL TEXT RIGHT
   ========================================= */

.safety-hero .container {
  padding-left: 70px !important;
  padding-right: 50px !important;
  box-sizing: border-box;
}

/* =========================================================
   OUTLAND BOUND
   HIKING GEAR PAGE
   ========================================================= */


/* =========================
   HIKING GEAR HERO
========================= */

.hiking-gear-hero {
  position: relative;

  min-height: 600px;

  display: flex;
  align-items: center;

  background:
    url("images/hiking-guide.png")
    center center / cover no-repeat;

  color: #ffffff;

  overflow: hidden;
}


.hiking-gear-overlay {
  position: absolute;
  inset: 0;

  background:
    linear-gradient(
      90deg,
      rgba(7, 35, 25, 0.94) 0%,
      rgba(7, 35, 25, 0.82) 38%,
      rgba(7, 35, 25, 0.50) 68%,
      rgba(7, 35, 25, 0.20) 100%
    );
}


.hiking-gear-hero-content {
  position: relative;
  z-index: 2;

  width: 100%;

  padding-top: 90px;
  padding-bottom: 90px;

  padding-left: 70px;
  padding-right: 50px;

  box-sizing: border-box;
}


.hiking-gear-back {
  display: inline-block;

  margin-bottom: 28px;

  color: #ffffff;

  font-size: 0.9rem;
  font-weight: 700;

  opacity: 0.9;
}


.hiking-gear-back:hover {
  color: #d2e6a3;
}


.hiking-gear-kicker {
  margin-bottom: 20px;

  color: #d2e6a3;

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

  letter-spacing: 3px;

  text-transform: uppercase;

  text-shadow:
    0 2px 6px
    rgba(0, 0, 0, 0.65);
}


.hiking-gear-hero h1 {
  max-width: 820px;

  margin-bottom: 28px;

  color: #ffffff;

  font-size:
    clamp(
      3.6rem,
      7vw,
      6.5rem
    );

  line-height: 0.96;

  letter-spacing: -4px;

  text-shadow:
    0 4px 20px
    rgba(0, 0, 0, 0.42);
}


.hiking-gear-hero-text {
  max-width: 720px;

  margin-bottom: 35px;

  color: #f1f5f2;

  font-size: 1.18rem;

  line-height: 1.7;

  text-shadow:
    0 2px 7px
    rgba(0, 0, 0, 0.55);
}


.hiking-gear-tags {
  display: flex;

  flex-wrap: wrap;

  gap: 10px;
}


.hiking-gear-tags span {
  padding:
    9px 16px;

  border:
    1px solid
    rgba(255, 255, 255, 0.55);

  border-radius: 100px;

  background:
    rgba(7, 35, 25, 0.48);

  color: #ffffff;

  font-size: 0.82rem;

  font-weight: 700;
}


/* =========================
   FIELD STRIP
========================= */

.hiking-gear-strip {
  background: #173f30;

  border-top:
    1px solid
    rgba(255, 255, 255, 0.12);

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


.hiking-gear-strip-grid {
  display: grid;

  grid-template-columns:
    repeat(4, 1fr);
}


.hiking-gear-strip-item {
  display: flex;

  align-items: center;

  gap: 18px;

  padding:
    28px 22px;

  border-right:
    1px solid
    rgba(255, 255, 255, 0.15);
}


.hiking-gear-strip-item:first-child {
  border-left:
    1px solid
    rgba(255, 255, 255, 0.15);
}


.hiking-gear-strip-item > span {
  color: #bdd58b;

  font-size: 1.6rem;

  font-weight: 900;
}


.hiking-gear-strip-item div {
  display: flex;

  flex-direction: column;

  gap: 3px;
}


.hiking-gear-strip-item small {
  color: #bdd58b;

  font-size: 0.65rem;

  font-weight: 900;

  letter-spacing: 1.5px;
}


.hiking-gear-strip-item strong {
  color: #ffffff;

  font-size: 0.95rem;
}


/* =========================
   HIKING GEAR INTRO
========================= */

.hiking-gear-intro {
  padding:
    100px 0;

  background: #f5f1e7;
}


.hiking-gear-intro-layout {
  display: grid;

  grid-template-columns:
    0.85fr 1.15fr;

  gap: 80px;

  align-items: start;
}


.hiking-gear-label {
  margin-bottom: 16px;

  color: #607e69;

  font-size: 0.74rem;

  font-weight: 900;

  letter-spacing: 2.2px;

  text-transform: uppercase;
}


.hiking-gear-intro h2,
.hiking-gear-heading h2,
.hiking-essentials-section h2,
.hiking-affiliate-section h2,
.hiking-gear-bottom h2 {
  color: #173b2b;

  font-size:
    clamp(
      2.4rem,
      5vw,
      4rem
    );

  line-height: 1.05;

  letter-spacing: -2px;
}


.hiking-gear-intro-layout p {
  margin-bottom: 20px;

  color: #56635b;

  font-size: 1.05rem;

  line-height: 1.8;
}


.hiking-gear-lead {
  color: #263d31 !important;

  font-size: 1.24rem !important;

  line-height: 1.75 !important;
}


/* =========================
   CORE HIKING GEAR
========================= */

.hiking-gear-categories {
  padding:
    100px 0;

  background: #ffffff;
}


.hiking-gear-heading {
  max-width: 780px;

  margin-bottom: 50px;
}


.hiking-gear-heading h2 {
  margin-bottom: 18px;
}


.hiking-gear-heading > p:last-child {
  color: #667069;

  font-size: 1.05rem;

  line-height: 1.7;
}


.hiking-gear-grid {
  display: grid;

  grid-template-columns:
    repeat(2, 1fr);

  gap: 26px;
}


.hiking-gear-card {
  min-height: 350px;

  padding: 36px;

  background: #f5f1e7;

  border:
    1px solid
    #d8ddd1;

  border-radius: 20px;

  transition:
    transform 0.25s ease,
    box-shadow 0.25s ease;
}


.hiking-gear-card:hover {
  transform:
    translateY(-5px);

  box-shadow:
    0 18px 40px
    rgba(23, 59, 43, 0.08);
}


.hiking-gear-number {
  display: flex;

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

  width: 52px;
  height: 52px;

  margin-bottom: 27px;

  border-radius: 50%;

  background: #173b2b;

  color: #d2e6a3;

  font-size: 0.82rem;

  font-weight: 900;
}


.hiking-gear-card-label {
  margin-bottom: 9px;

  color: #66806f;

  font-size: 0.7rem;

  font-weight: 900;

  letter-spacing: 1.8px;

  text-transform: uppercase;
}


.hiking-gear-card h3 {
  margin-bottom: 15px;

  color: #173b2b;

  font-size: 1.65rem;

  line-height: 1.2;
}


.hiking-gear-card > p:not(.hiking-gear-card-label) {
  margin-bottom: 24px;

  color: #5c6861;

  font-size: 1rem;

  line-height: 1.7;
}


.hiking-gear-coming {
  display: inline-block;

  color: #647c68;

  font-size: 0.72rem;

  font-weight: 900;

  letter-spacing: 1.2px;

  text-transform: uppercase;
}


/* =========================
   TRAIL PRIORITIES
========================= */

.hiking-essentials-section {
  padding:
    110px 0;

  background: #0d281d;

  color: #ffffff;
}


.hiking-essentials-layout {
  display: grid;

  grid-template-columns:
    0.9fr 1.1fr;

  gap: 80px;

  align-items: start;
}


.hiking-essentials-section h2 {
  margin-bottom: 25px;

  color: #ffffff;
}


.hiking-essentials-layout
> div:first-child
> p:last-child {
  max-width: 560px;

  color: #c2cec7;

  font-size: 1.05rem;

  line-height: 1.75;
}


.hiking-essential-list {
  display: flex;

  flex-direction: column;
}


.hiking-essential-item {
  display: grid;

  grid-template-columns:
    60px 1fr;

  gap: 20px;

  padding:
    25px 0;

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


.hiking-essential-item:first-child {
  padding-top: 0;
}


.hiking-essential-item > span {
  color: #bdd58b;

  font-weight: 900;
}


.hiking-essential-item h3 {
  margin-bottom: 7px;

  color: #ffffff;

  font-size: 1.3rem;
}


.hiking-essential-item p {
  color: #b9c8c0;

  line-height: 1.65;
}


/* =========================
   BEGINNER DAY-HIKE KIT
========================= */

.hiking-starter-section {
  padding:
    100px 0;

  background: #ffffff;
}


.hiking-starter-grid {
  display: grid;

  grid-template-columns:
    repeat(3, 1fr);

  gap: 24px;
}


.hiking-starter-card {
  min-height: 235px;

  padding: 30px;

  background: #f5f1e7;

  border:
    1px solid
    #d9ddd2;

  border-radius: 18px;
}


.hiking-starter-card > span {
  display: inline-block;

  margin-bottom: 25px;

  color: #65806d;

  font-size: 0.78rem;

  font-weight: 900;
}


.hiking-starter-card h3 {
  margin-bottom: 12px;

  color: #173b2b;

  font-size: 1.45rem;
}


.hiking-starter-card p {
  color: #5e6962;

  line-height: 1.7;
}


/* =========================
   PRODUCT GUIDES
========================= */

.hiking-product-section {
  padding:
    100px 0;

  background: #f5f1e7;
}


.hiking-product-grid {
  display: grid;

  grid-template-columns:
    repeat(3, 1fr);

  gap: 24px;
}


.hiking-product-card {
  min-height: 270px;

  display: flex;

  flex-direction: column;

  padding: 30px;

  background: #ffffff;

  border:
    1px solid
    #d8ddd3;

  border-radius: 18px;

  box-shadow:
    0 8px 25px
    rgba(23, 59, 43, 0.05);
}


.hiking-product-status {
  display: inline-block;

  align-self: flex-start;

  margin-bottom: 22px;

  padding:
    7px 11px;

  border-radius: 30px;

  background: #e8ead8;

  color: #5e7a62;

  font-size: 0.67rem;

  font-weight: 900;

  letter-spacing: 1.3px;
}


.hiking-product-card h3 {
  margin-bottom: 13px;

  color: #173b2b;

  font-size: 1.45rem;

  line-height: 1.25;
}


.hiking-product-card p {
  color: #5e6962;

  line-height: 1.7;
}


/* =========================
   AFFILIATE NOTE
========================= */

.hiking-affiliate-section {
  padding:
    85px 0;

  background: #e8ead8;
}


.hiking-affiliate-layout {
  display: grid;

  grid-template-columns:
    0.85fr 1.15fr;

  gap: 70px;

  align-items: start;
}


.hiking-affiliate-section h2 {
  font-size:
    clamp(
      2.2rem,
      4vw,
      3.5rem
    );
}


.hiking-affiliate-layout
> div:last-child
p {
  margin-bottom: 20px;

  color: #47584d;

  font-size: 1.03rem;

  line-height: 1.75;
}


.hiking-affiliate-link {
  color: #35634c;

  font-weight: 800;
}


.hiking-affiliate-link:hover {
  text-decoration: underline;
}


/* =========================
   HIKING GEAR BOTTOM
========================= */

.hiking-gear-bottom {
  position: relative;

  min-height: 500px;

  display: flex;

  align-items: center;

  background:
    url("images/hiking-guide.png")
    center center / cover no-repeat;

  color: #ffffff;

  overflow: hidden;
}


.hiking-gear-bottom-overlay {
  position: absolute;

  inset: 0;

  background:
    rgba(6, 36, 25, 0.88);
}


.hiking-gear-bottom-content {
  position: relative;

  z-index: 2;

  width: 100%;

  padding-top: 90px;
  padding-bottom: 90px;

  padding-left: 70px;
  padding-right: 50px;

  box-sizing: border-box;
}


.hiking-gear-bottom h2 {
  max-width: 760px;

  margin-bottom: 25px;

  color: #ffffff;

  font-size:
    clamp(
      3rem,
      6vw,
      5rem
    );
}


.hiking-gear-bottom-content
> p:not(.hiking-gear-kicker) {
  max-width: 700px;

  margin-bottom: 32px;

  color: #e3ece6;

  font-size: 1.15rem;

  line-height: 1.7;
}


.hiking-gear-bottom-buttons {
  display: flex;

  flex-wrap: wrap;

  gap: 14px;
}


/* =========================================================
   HIKING GEAR TABLET
   ========================================================= */

@media (max-width: 950px) {

  .hiking-gear-strip-grid {
    grid-template-columns:
      repeat(2, 1fr);
  }


  .hiking-gear-intro-layout,
  .hiking-essentials-layout,
  .hiking-affiliate-layout {
    grid-template-columns: 1fr;

    gap: 45px;
  }


  .hiking-starter-grid,
  .hiking-product-grid {
    grid-template-columns:
      repeat(2, 1fr);
  }

}


/* =========================================================
   HIKING GEAR MOBILE
   ========================================================= */

@media (max-width: 700px) {

  .hiking-gear-hero {
    min-height: 560px;
  }


  .hiking-gear-hero-content {
    padding-top: 65px;
    padding-bottom: 65px;

    padding-left: 28px;
    padding-right: 28px;
  }


  .hiking-gear-hero h1 {
    letter-spacing: -2px;
  }


  .hiking-gear-strip-grid {
    grid-template-columns: 1fr;
  }


  .hiking-gear-strip-item {
    border-right: 0;

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


  .hiking-gear-strip-item:first-child {
    border-left: 0;
  }


  .hiking-gear-intro,
  .hiking-gear-categories,
  .hiking-starter-section,
  .hiking-product-section {
    padding:
      70px 0;
  }


  .hiking-essentials-section {
    padding:
      80px 0;
  }


  .hiking-gear-grid,
  .hiking-starter-grid,
  .hiking-product-grid {
    grid-template-columns: 1fr;
  }


  .hiking-gear-card {
    min-height: auto;
  }


  .hiking-affiliate-section {
    padding:
      65px 0;
  }


  .hiking-gear-bottom {
    min-height: 460px;
  }


  .hiking-gear-bottom-content {
    padding-top: 70px;
    padding-bottom: 70px;

    padding-left: 28px;
    padding-right: 28px;
  }


  .hiking-gear-bottom-buttons {
    flex-direction: column;

    align-items: flex-start;
  }

}

/* =========================================================
   OUTLAND BOUND
   CAMPING GEAR PAGE
   ========================================================= */


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

.camping-gear-hero {
  position: relative;

  min-height: 600px;

  display: flex;
  align-items: center;

  background:
    url("images/camping-guide.png")
    center center / cover no-repeat;

  color: #ffffff;

  overflow: hidden;
}


.camping-gear-overlay {
  position: absolute;
  inset: 0;

  background:
    linear-gradient(
      90deg,
      rgba(7, 35, 25, 0.94) 0%,
      rgba(7, 35, 25, 0.80) 40%,
      rgba(7, 35, 25, 0.45) 70%,
      rgba(7, 35, 25, 0.18) 100%
    );
}


.camping-gear-hero-content {

  position: relative;

  z-index: 2;

  width: 100%;

  padding-top: 90px;
  padding-bottom: 90px;

  padding-left: 70px;
  padding-right: 50px;

  box-sizing: border-box;
}


.camping-gear-back {

  display: inline-block;

  margin-bottom: 28px;

  color: #ffffff;

  font-weight: 700;

}


.camping-gear-back:hover {

  color: #d2e6a3;

}


.camping-gear-kicker {

  margin-bottom: 20px;

  color: #d2e6a3;

  font-size: .82rem;

  font-weight: 900;

  letter-spacing: 3px;

  text-transform: uppercase;

}


.camping-gear-hero h1 {

  max-width: 850px;

  margin-bottom: 28px;

  color: #ffffff;

  font-size:
    clamp(
      3.6rem,
      7vw,
      6.5rem
    );

  line-height: .96;

  letter-spacing: -4px;

}


.camping-gear-hero-text {

  max-width: 720px;

  margin-bottom: 35px;

  color: #f1f5f2;

  font-size: 1.18rem;

  line-height: 1.7;

}


.camping-gear-tags {

  display: flex;

  flex-wrap: wrap;

  gap: 10px;

}


.camping-gear-tags span {

  padding:
    9px 16px;

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

  border-radius: 100px;

  background:
    rgba(7,35,25,.45);

  font-size: .82rem;

  font-weight: 700;

}



/* =========================
   CAMPING STRIP
========================= */


.camping-gear-strip {

  background:#173f30;

}


.camping-strip-grid {

  display:grid;

  grid-template-columns:
    repeat(4,1fr);

}


.camping-strip-item {

  display:flex;

  align-items:center;

  gap:18px;

  padding:
    28px 22px;

  border-right:
    1px solid
    rgba(255,255,255,.15);

}


.camping-strip-item span {

  color:#bdd58b;

  font-size:1.6rem;

  font-weight:900;

}


.camping-strip-item div {

  display:flex;

  flex-direction:column;

}


.camping-strip-item small {

  color:#bdd58b;

  font-size:.65rem;

  font-weight:900;

  letter-spacing:1.5px;

}


.camping-strip-item strong {

  color:#ffffff;

}



/* =========================
   INTRO
========================= */


.camping-gear-intro {

  padding:
    100px 0;

  background:#f5f1e7;

}


.camping-intro-layout {

  display:grid;

  grid-template-columns:
    .85fr 1.15fr;

  gap:80px;

}


.camping-label {

  margin-bottom:16px;

  color:#607e69;

  font-size:.74rem;

  font-weight:900;

  letter-spacing:2px;

}


.camping-intro-layout h2 {

  color:#173b2b;

  font-size:
    clamp(2.4rem,5vw,4rem);

  line-height:1.05;

  letter-spacing:-2px;

}


.camping-intro-layout p {

  color:#56635b;

  line-height:1.8;

}


.camping-lead {

  color:#263d31 !important;

  font-size:1.25rem;

}



/* =========================
   CAMPING CARDS
========================= */


.camping-categories {

  padding:
    100px 0;

  background:#ffffff;

}


.camping-heading {

  max-width:780px;

  margin-bottom:50px;

}


.camping-heading h2 {

  color:#173b2b;

  font-size:
    clamp(2.4rem,5vw,4rem);

}


.camping-heading p:last-child {

  color:#667069;

}



.camping-grid {

  display:grid;

  grid-template-columns:
    repeat(2,1fr);

  gap:26px;

}



.camping-card {

  min-height:340px;

  padding:36px;

  background:#f5f1e7;

  border:
    1px solid
    #d8ddd1;

  border-radius:20px;

}



.camping-card span {

  display:flex;

  align-items:center;

  justify-content:center;

  width:52px;

  height:52px;

  margin-bottom:25px;

  border-radius:50%;

  background:#173b2b;

  color:#d2e6a3;

  font-weight:900;

}


.camping-card p {

  color:#66806f;

  font-size:.72rem;

  font-weight:900;

  letter-spacing:2px;

}


.camping-card h3 {

  color:#173b2b;

  font-size:1.6rem;

}


.camping-card p:not(:first-of-type) {

  color:#5c6861;

  font-size:1rem;

  line-height:1.7;

}


.camping-card strong {

  color:#647c68;

  font-size:.72rem;

  letter-spacing:1px;

  text-transform:uppercase;

}



/* =========================
   PRIORITIES
========================= */


.camping-priority {

  padding:
    110px 0;

  background:#0d281d;

}


.camping-priority-layout {

  display:grid;

  grid-template-columns:
    .9fr 1.1fr;

  gap:80px;

}


.camping-priority h2 {

  color:#ffffff;

  font-size:
    clamp(2.5rem,5vw,4rem);

}


.camping-priority p {

  color:#c2cec7;

  line-height:1.7;

}



.camping-priority-list > div {

  padding:
    25px 0;

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

}


.camping-priority-list span {

  color:#bdd58b;

  font-weight:900;

}


.camping-priority-list h3 {

  color:#ffffff;

  margin-top:8px;

}



/* =========================
   PRODUCT GUIDES
========================= */


.camping-products {

  padding:
    100px 0;

  background:#f5f1e7;

}


.camping-product-grid {

  display:grid;

  grid-template-columns:
    repeat(3,1fr);

  gap:24px;

}


.camping-product-grid article {

  min-height:250px;

  padding:30px;

  background:#ffffff;

  border:
    1px solid
    #d8ddd3;

  border-radius:18px;

}


.camping-product-grid span {

  display:inline-block;

  margin-bottom:20px;

  padding:7px 12px;

  border-radius:30px;

  background:#e8ead8;

  color:#5e7a62;

  font-size:.7rem;

  font-weight:900;

}


.camping-product-grid h3 {

  color:#173b2b;

}


.camping-product-grid p {

  color:#5e6962;

  line-height:1.7;

}



/* =========================
   AFFILIATE
========================= */


.camping-affiliate {

  padding:
    85px 0;

  background:#e8ead8;

}


.camping-affiliate-layout {

  display:grid;

  grid-template-columns:
    .85fr 1.15fr;

  gap:70px;

}


.camping-affiliate h2 {

  color:#173b2b;

}


.camping-affiliate p {

  color:#47584d;

  line-height:1.75;

}


.camping-affiliate a {

  color:#35634c;

  font-weight:800;

}



/* =========================
   BOTTOM BANNER
========================= */


.camping-bottom {

  position:relative;

  min-height:500px;

  display:flex;

  align-items:center;

  background:
    url("images/camping-guide.png")
    center / cover no-repeat;

}


.camping-bottom-overlay {

  position:absolute;

  inset:0;

  background:
    rgba(6,36,25,.88);

}


.camping-bottom-content {

  position:relative;

  z-index:2;

  padding:
    90px 70px;

}


.camping-bottom h2 {

  color:#ffffff;

  font-size:
    clamp(3rem,6vw,5rem);

}


.camping-bottom p:not(.camping-gear-kicker) {

  color:#ffffff;

  font-size:1.15rem;

  line-height:1.7;

}



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


@media(max-width:950px){

  .camping-strip-grid,
  .camping-grid,
  .camping-product-grid {

    grid-template-columns:
      1fr 1fr;

  }


  .camping-intro-layout,
  .camping-priority-layout,
  .camping-affiliate-layout {

    grid-template-columns:1fr;

  }

}



@media(max-width:700px){

  .camping-strip-grid,
  .camping-grid,
  .camping-product-grid {

    grid-template-columns:1fr;

  }


  .camping-gear-hero-content,
  .camping-bottom-content {

    padding-left:28px;

    padding-right:28px;

  }


  .camping-gear-hero h1 {

    letter-spacing:-2px;

  }

}

/* =========================================================
   OUTLAND BOUND
   PADDLING GEAR PAGE
   ========================================================= */


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

.paddling-gear-hero {

  position: relative;

  min-height: 600px;

  display: flex;

  align-items: center;

  background:
    url("images/paddling-guide.png")
    center center / cover no-repeat;

  color: #ffffff;

  overflow: hidden;

}


.paddling-gear-overlay {

  position: absolute;

  inset: 0;

  background:
    linear-gradient(
      90deg,
      rgba(7,35,25,.94) 0%,
      rgba(7,35,25,.78) 42%,
      rgba(7,35,25,.45) 72%,
      rgba(7,35,25,.18) 100%
    );

}



.paddling-gear-hero-content {

  position: relative;

  z-index: 2;

  width: 100%;

  padding-top: 90px;

  padding-bottom: 90px;

  padding-left: 70px;

  padding-right: 50px;

  box-sizing: border-box;

}



.paddling-gear-back {

  display:inline-block;

  margin-bottom:28px;

  color:#ffffff;

  font-weight:700;

}



.paddling-gear-back:hover {

  color:#d2e6a3;

}



.paddling-gear-kicker {

  margin-bottom:20px;

  color:#d2e6a3;

  font-size:.82rem;

  font-weight:900;

  letter-spacing:3px;

  text-transform:uppercase;

}



.paddling-gear-hero h1 {

  max-width:900px;

  margin-bottom:28px;

  color:#ffffff;

  font-size:
    clamp(
      3.5rem,
      7vw,
      6.4rem
    );

  line-height:.96;

  letter-spacing:-4px;

}



.paddling-gear-hero-text {

  max-width:720px;

  margin-bottom:35px;

  color:#f1f5f2;

  font-size:1.18rem;

  line-height:1.7;

}



.paddling-gear-tags {

  display:flex;

  flex-wrap:wrap;

  gap:10px;

}



.paddling-gear-tags span {

  padding:
    9px 16px;

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

  border-radius:100px;

  background:
    rgba(7,35,25,.45);

  font-size:.82rem;

  font-weight:700;

}



/* =========================
   WATER STRIP
========================= */


.paddling-gear-strip {

  background:#173f30;

}



.paddling-strip-grid {

  display:grid;

  grid-template-columns:
    repeat(4,1fr);

}



.paddling-strip-item {

  display:flex;

  align-items:center;

  gap:18px;

  padding:
    28px 22px;

  border-right:
    1px solid
    rgba(255,255,255,.15);

}



.paddling-strip-item span {

  color:#bdd58b;

  font-size:1.6rem;

  font-weight:900;

}



.paddling-strip-item div {

  display:flex;

  flex-direction:column;

}



.paddling-strip-item small {

  color:#bdd58b;

  font-size:.65rem;

  font-weight:900;

  letter-spacing:1.5px;

}



.paddling-strip-item strong {

  color:#ffffff;

}



/* =========================
   INTRO
========================= */


.paddling-gear-intro {

  padding:
    100px 0;

  background:#f5f1e7;

}



.paddling-intro-layout {

  display:grid;

  grid-template-columns:
    .85fr 1.15fr;

  gap:80px;

}



.paddling-label {

  margin-bottom:16px;

  color:#607e69;

  font-size:.74rem;

  font-weight:900;

  letter-spacing:2px;

}



.paddling-intro-layout h2 {

  color:#173b2b;

  font-size:
    clamp(
      2.4rem,
      5vw,
      4rem
    );

  line-height:1.05;

  letter-spacing:-2px;

}



.paddling-intro-layout p {

  color:#56635b;

  line-height:1.8;

}



.paddling-lead {

  color:#263d31 !important;

  font-size:1.25rem;

}



/* =========================
   MAIN GEAR CARDS
========================= */


.paddling-categories {

  padding:
    100px 0;

  background:#ffffff;

}



.paddling-heading {

  max-width:780px;

  margin-bottom:50px;

}



.paddling-heading h2 {

  color:#173b2b;

  font-size:
    clamp(
      2.4rem,
      5vw,
      4rem
    );

}



.paddling-heading p:last-child {

  color:#667069;

}



.paddling-grid {

  display:grid;

  grid-template-columns:
    repeat(2,1fr);

  gap:26px;

}



.paddling-card {

  min-height:340px;

  padding:36px;

  background:#f5f1e7;

  border:
    1px solid
    #d8ddd1;

  border-radius:20px;

}



.paddling-card span {

  display:flex;

  align-items:center;

  justify-content:center;

  width:52px;

  height:52px;

  margin-bottom:25px;

  border-radius:50%;

  background:#173b2b;

  color:#d2e6a3;

  font-weight:900;

}



.paddling-card p {

  color:#66806f;

  font-size:.72rem;

  font-weight:900;

  letter-spacing:2px;

}



.paddling-card h3 {

  color:#173b2b;

  font-size:1.6rem;

}



.paddling-card p:not(:first-of-type) {

  color:#5c6861;

  font-size:1rem;

  line-height:1.7;

}



.paddling-card strong {

  color:#647c68;

  font-size:.72rem;

  text-transform:uppercase;

}



/* =========================
   PET SECTION
========================= */


.pet-paddling-section {

  padding:
    100px 0;

  background:#e8ead8;

}



.pet-paddling-layout {

  display:grid;

  grid-template-columns:
    .85fr 1.15fr;

  gap:70px;

}



.pet-paddling-layout h2 {

  color:#173b2b;

  font-size:
    clamp(
      2.5rem,
      5vw,
      4rem
    );

}



.pet-paddling-layout p {

  color:#526056;

  line-height:1.75;

}



.pet-paddling-grid {

  display:grid;

  grid-template-columns:
    repeat(2,1fr);

  gap:20px;

  margin-top:30px;

}



.pet-paddling-grid article {

  padding:25px;

  background:#ffffff;

  border-radius:18px;

}



.pet-paddling-grid span {

  font-size:1.8rem;

}



.pet-paddling-grid h3 {

  color:#173b2b;

}



.pet-safety-note {

  margin-top:25px;

  padding:22px;

  background:#173b2b;

  border-radius:15px;

  color:#ffffff;

  line-height:1.7;

}



/* =========================
   PRIORITIES
========================= */


.paddling-priority-section {

  padding:
    110px 0;

  background:#0d281d;

}



.paddling-priority-layout {

  display:grid;

  grid-template-columns:
    .9fr 1.1fr;

  gap:80px;

}



.paddling-priority-section h2 {

  color:#ffffff;

  font-size:
    clamp(
      2.5rem,
      5vw,
      4rem
    );

}



.paddling-priority-section p {

  color:#c2cec7;

}



.paddling-priority-list > div {

  padding:
    25px 0;

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

}



.paddling-priority-list span {

  color:#bdd58b;

  font-weight:900;

}



.paddling-priority-list h3 {

  color:#ffffff;

}



/* =========================
   BEGINNER SETUP
========================= */


.paddling-beginner-section {

  padding:
    100px 0;

  background:#ffffff;

}



.paddling-beginner-grid {

  display:grid;

  grid-template-columns:
    repeat(4,1fr);

  gap:22px;

}



.paddling-beginner-grid article {

  padding:28px;

  background:#f5f1e7;

  border-radius:18px;

}



.paddling-beginner-grid span {

  color:#607e69;

  font-weight:900;

}



.paddling-beginner-grid h3 {

  color:#173b2b;

}



.paddling-beginner-grid p {

  color:#5c6861;

  line-height:1.7;

}



/* =========================
   PRODUCTS
========================= */


.paddling-products-section {

  padding:
    100px 0;

  background:#f5f1e7;

}



.paddling-product-grid {

  display:grid;

  grid-template-columns:
    repeat(3,1fr);

  gap:24px;

}



.paddling-product-grid article {

  padding:30px;

  min-height:240px;

  background:#ffffff;

  border-radius:18px;

}



.paddling-product-grid span {

  display:inline-block;

  margin-bottom:20px;

  padding:7px 12px;

  background:#e8ead8;

  border-radius:30px;

  color:#5e7a62;

  font-size:.7rem;

  font-weight:900;

}



.paddling-product-grid h3 {

  color:#173b2b;

}



.paddling-product-grid p {

  color:#5e6962;

  line-height:1.7;

}



/* =========================
   AFFILIATE
========================= */


.paddling-affiliate-section {

  padding:
    85px 0;

  background:#e8ead8;

}



.paddling-affiliate-layout {

  display:grid;

  grid-template-columns:
    .85fr 1.15fr;

  gap:70px;

}



.paddling-affiliate-section h2 {

  color:#173b2b;

}



.paddling-affiliate-section p {

  color:#47584d;

  line-height:1.75;

}



.paddling-affiliate-section a {

  color:#35634c;

  font-weight:800;

}



/* =========================
   FINAL BANNER
========================= */


.paddling-bottom-banner {

  position:relative;

  min-height:500px;

  display:flex;

  align-items:center;

  background:
    url("images/paddling-guide.png")
    center / cover no-repeat;

}



.paddling-bottom-overlay {

  position:absolute;

  inset:0;

  background:
    rgba(6,36,25,.88);

}



.paddling-bottom-content {

  position:relative;

  z-index:2;

  padding:
    90px 70px;

}



.paddling-bottom-content h2 {

  color:#ffffff;

  font-size:
    clamp(
      3rem,
      6vw,
      5rem
    );

}



.paddling-bottom-content p:not(.paddling-gear-kicker) {

  color:#ffffff;

  font-size:1.15rem;

}



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


@media(max-width:950px){


.paddling-strip-grid,
.paddling-grid,
.paddling-product-grid,
.paddling-beginner-grid {

grid-template-columns:
repeat(2,1fr);

}


.paddling-intro-layout,
.pet-paddling-layout,
.paddling-priority-layout,
.paddling-affiliate-layout {

grid-template-columns:1fr;

}


}



@media(max-width:700px){


.paddling-strip-grid,
.paddling-grid,
.pet-paddling-grid,
.paddling-product-grid,
.paddling-beginner-grid {

grid-template-columns:1fr;

}


.paddling-gear-hero-content,
.paddling-bottom-content {

padding-left:28px;

padding-right:28px;

}


.paddling-gear-hero h1 {

letter-spacing:-2px;

}


.safety-photo {
  background-image: url("images/safety-guide.png");
  background-size: cover;
  background-position: center;
}

}

/* =========================================================
   OUTLAND BOUND
   GLOBAL MOBILE FIX
   ========================================================= */

@media (max-width: 768px) {

  /* MOBILE HEADER + NAV FIX */

  .site-header {
    position: relative;
    height: auto;
  }

  .nav-container {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 18px;
    padding: 24px 20px;
  }

  .main-nav {
    position: relative;
    top: auto;
    left: auto;
    right: auto;
    bottom: auto;
    width: 100%;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 10px 18px;
  }

  .main-nav a {
    margin: 0;
  }

  /* -------------------------
     GENERAL
  ------------------------- */

  html,
  body {
    width: 100%;
    overflow-x: hidden;
  }

  .container {
    width: 100%;
    max-width: 100%;
    padding-left: 22px;
    padding-right: 22px;
    box-sizing: border-box;
  }


  /* -------------------------
     HEADER
  ------------------------- */

  .site-header {
    min-height: auto;
  }

  .nav-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    gap: 18px;

    padding-top: 22px;
    padding-bottom: 20px;
  }

  .logo {
    display: flex;
    justify-content: center;
    width: 100%;
  }

  .site-logo {
    width: min(86vw, 390px);
    max-width: 100%;
    height: auto;
    display: block;
  }

  .main-nav {
    width: 100%;

    display: flex;
    flex-wrap: wrap;
    justify-content: center;

    gap: 8px 16px;
  }

  .main-nav a {
    font-size: 0.95rem;
    white-space: nowrap;
  }


  /* -------------------------
     HERO SECTIONS
  ------------------------- */

  .hero,
  .gear-hub-hero,
  .hiking-gear-hero,
  .camping-gear-hero,
  .paddling-gear-hero,
  .safety-hero,
  .hiking-guide-hero,
  .camping-guide-hero,
  .paddling-guide-hero {
    min-height: auto;
  }

  .hero-content,
  .gear-hub-hero-content,
  .hiking-gear-hero-content,
  .camping-gear-hero-content,
  .paddling-gear-hero-content,
  .safety-hero-content,
  .hiking-guide-hero-content,
  .camping-guide-hero-content,
  .paddling-guide-hero-content {
    padding-top: 70px;
    padding-bottom: 70px;
    padding-left: 22px;
    padding-right: 22px;

    box-sizing: border-box;
  }

  .hero h1,
  .gear-hub-hero h1,
  .hiking-gear-hero h1,
  .camping-gear-hero h1,
  .paddling-gear-hero h1,
  .safety-hero h1,
  .hiking-guide-hero h1,
  .camping-guide-hero h1,
  .paddling-guide-hero h1 {
    font-size: clamp(2.6rem, 12vw, 4.4rem);
    line-height: 0.98;
    letter-spacing: -2px;
  }

  .hero p,
  .gear-hub-hero-text,
  .hiking-gear-hero-text,
  .camping-gear-hero-text,
  .paddling-gear-hero-text {
    font-size: 1rem;
    line-height: 1.6;
  }


  /* -------------------------
     BUTTONS
  ------------------------- */

  .hero-actions,
  .gear-bottom-buttons,
  .hiking-gear-bottom-buttons,
  .camping-bottom-buttons,
  .paddling-bottom-buttons {
    display: flex;
    flex-direction: column;
    align-items: stretch;

    gap: 12px;
  }

  .button,
  .hero-actions a,
  .gear-bottom-buttons a {
    width: 100%;
    box-sizing: border-box;
    text-align: center;
  }


  /* -------------------------
     TAGS / PILLS
  ------------------------- */

  .gear-hub-tags,
  .hiking-gear-tags,
  .camping-gear-tags,
  .paddling-gear-tags {
    gap: 8px;
  }

  .gear-hub-tags span,
  .hiking-gear-tags span,
  .camping-gear-tags span,
  .paddling-gear-tags span {
    font-size: 0.78rem;
    padding: 8px 13px;
  }


  /* -------------------------
     GRIDS / CARDS
  ------------------------- */

  .gear-category-grid,
  .gear-grid,
  .hiking-gear-grid,
  .camping-grid,
  .paddling-grid,
  .gear-product-grid,
  .hiking-product-grid,
  .camping-product-grid,
  .paddling-product-grid,
  .pet-paddling-grid,
  .hiking-starter-grid,
  .paddling-beginner-grid {
    grid-template-columns: 1fr !important;
  }

  .gear-category-card,
  .gear-card,
  .hiking-gear-card,
  .camping-card,
  .paddling-card,
  .gear-product-card {
    width: 100%;
    box-sizing: border-box;
  }


  /* -------------------------
     TWO-COLUMN SECTIONS
  ------------------------- */

  .gear-hub-intro-layout,
  .gear-essential-layout,
  .gear-affiliate-layout,
  .hiking-gear-intro-layout,
  .hiking-essentials-layout,
  .hiking-affiliate-layout,
  .camping-intro-layout,
  .camping-priority-layout,
  .camping-affiliate-layout,
  .paddling-intro-layout,
  .pet-paddling-layout,
  .paddling-priority-layout,
  .paddling-affiliate-layout {
    grid-template-columns: 1fr !important;
    gap: 40px;
  }


  /* -------------------------
     BOTTOM BANNERS
  ------------------------- */

  .gear-bottom-content,
  .hiking-gear-bottom-content,
  .camping-bottom-content,
  .paddling-bottom-content {
    padding-left: 22px;
    padding-right: 22px;
  }


  /* -------------------------
     FOOTER
  ------------------------- */

  .footer-grid {
    grid-template-columns: 1fr !important;
    gap: 32px;
  }

  .site-footer {
    text-align: left;
  }

}