:root {
  --ink: #0d0d0d;
  --bone: #f0ebe0;
  --moss: #3a5a2e;
  --fern: #6b8f47;
  --gold: #c8a84b;
  --slate: #2c3e35;
  --mist: #8fa89a;
  --ember: #d4621a;
}

* { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; }

body {
  background: var(--ink);
  color: var(--bone);
  font-family: 'Barlow', sans-serif;
  font-size: 17px;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
}

/* NAV */
nav {
  padding: 1.5rem 2rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1.5rem;
  border-bottom: 1px solid rgba(200,168,75,0.1);
  background: rgba(13,13,13,0.95);
  position: sticky;
  top: 0;
  z-index: 100;
}
.logo { font-family: 'Bebas Neue', sans-serif; font-size: 1.4rem; letter-spacing: 0.1em; color: var(--bone); text-decoration: none; white-space: nowrap; }
.logo span { color: var(--gold); }
.nav-links { display: flex; gap: 1.4rem; list-style: none; }
.nav-links a { color: var(--mist); text-decoration: none; font-family: 'Barlow Condensed', sans-serif; font-size: 0.9rem; letter-spacing: 0.12em; text-transform: uppercase; transition: color 0.2s; white-space: nowrap; }
.nav-links a:hover, .nav-links a.active { color: var(--gold); }

.hamburger { display: none; flex-direction: column; gap: 5px; cursor: pointer; padding: 0.5rem; background: none; border: none; }
.hamburger span { display: block; width: 24px; height: 2px; background: var(--bone); transition: all 0.3s; }
.hamburger.open span:nth-child(1) { transform: rotate(45deg) translate(5px, 5px); }
.hamburger.open span:nth-child(2) { opacity: 0; }
.hamburger.open span:nth-child(3) { transform: rotate(-45deg) translate(5px, -5px); }
.mobile-menu { display: none; position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: #0d0d0d; z-index: 999; flex-direction: column; align-items: center; justify-content: center; gap: 1.2rem; overflow-y: auto; padding: 4rem 1.5rem 2rem; }
.mobile-menu.open { display: flex; }
.mobile-menu a { font-family: 'Bebas Neue', sans-serif; font-size: 2rem; letter-spacing: 0.1em; color: var(--bone); text-decoration: none; }
.mobile-menu a:hover { color: var(--gold); }
.mobile-close { position: absolute; top: 1.5rem; right: 2rem; font-family: 'Bebas Neue', sans-serif; font-size: 1.2rem; color: var(--mist); cursor: pointer; background: none; border: none; }
@media (max-width: 1180px) {
  .hamburger { display: flex; }
  .nav-links { display: none !important; }
}

/* HEADER */
.art-header {
  background: linear-gradient(160deg, #0d1a12 0%, #1a2e1e 60%, #0d0d0d 100%);
  padding: 4.5rem 2rem 3.5rem;
  text-align: center;
  border-bottom: 1px solid rgba(200,168,75,0.1);
}
.art-tag { font-family: 'Barlow Condensed', sans-serif; font-size: 0.8rem; letter-spacing: 0.3em; text-transform: uppercase; color: var(--fern); margin-bottom: 1rem; }
.art-header h1 { font-family: 'Bebas Neue', sans-serif; font-size: clamp(2.4rem, 6vw, 4.6rem); line-height: 1; letter-spacing: 0.02em; max-width: 900px; margin: 0 auto; text-wrap: balance; }
.art-header h1 span { color: var(--gold); }
.art-meta { color: var(--mist); font-size: 0.95rem; margin-top: 1.2rem; }

/* ARTICLE */
.art { max-width: 760px; margin: 0 auto; padding: 2.5rem 1.5rem 4rem; }
.breadcrumb { font-family: 'Barlow Condensed', sans-serif; font-size: 0.85rem; letter-spacing: 0.08em; color: var(--mist); margin-bottom: 1.5rem; }
.breadcrumb a { color: var(--fern); text-decoration: none; }
.art-hero { width: 100%; height: auto; aspect-ratio: 3/2; object-fit: cover; margin-bottom: 2rem; border: 1px solid rgba(200,168,75,0.15); }
.art p, .art li { line-height: 1.8; color: #d8d3c6; }
.art p { margin-bottom: 1.1rem; }
.art .lead { font-size: 1.2rem; color: var(--bone); }
.art h2 { font-family: 'Bebas Neue', sans-serif; font-size: 2rem; letter-spacing: 0.03em; color: var(--gold); margin: 2.6rem 0 0.8rem; scroll-margin-top: 6rem; }
.art h3 { font-family: 'Barlow Condensed', sans-serif; font-size: 1.15rem; letter-spacing: 0.06em; text-transform: uppercase; color: var(--bone); margin: 1.6rem 0 0.4rem; }
.art ul, .art ol { padding-left: 1.4rem; margin-bottom: 1.2rem; }
.art li { margin-bottom: 0.5rem; }
.art a { color: var(--gold); text-underline-offset: 3px; }
.art strong { color: var(--bone); }

.toc { background: rgba(255,255,255,0.03); border: 1px solid rgba(200,168,75,0.15); padding: 1.2rem 1.5rem; margin: 1.5rem 0 2rem; }
.toc-title { font-family: 'Barlow Condensed', sans-serif; letter-spacing: 0.2em; text-transform: uppercase; font-size: 0.8rem; color: var(--mist); margin-bottom: 0.6rem !important; }
.toc ol { margin-bottom: 0; }
.toc li { margin-bottom: 0.2rem; }

.callout { background: rgba(200,168,75,0.07); border-left: 3px solid var(--gold); padding: 1rem 1.2rem; margin: 1.5rem 0; line-height: 1.7; color: #d8d3c6; }
.steps { counter-reset: s; list-style: none; padding-left: 0 !important; }
.steps li { counter-increment: s; position: relative; padding-left: 2.6rem; margin-bottom: 1rem; }
.steps li::before { content: counter(s); position: absolute; left: 0; top: 0.05rem; width: 1.9rem; height: 1.9rem; border-radius: 50%; background: var(--gold); color: var(--ink); font-family: 'Bebas Neue', sans-serif; font-size: 1.2rem; display: flex; align-items: center; justify-content: center; }
.disclaimer-box { margin-top: 2.5rem; padding: 1rem 1.2rem; border: 1px solid rgba(143,168,154,0.25); font-size: 0.9rem; color: var(--mist); }
.disclaimer-box p { color: var(--mist); margin: 0; font-size: 0.9rem; }
.sources li { font-size: 0.95rem; }

.art-cta { margin-top: 3rem; padding: 1.6rem; background: linear-gradient(160deg, #0d1a12, #1a2e1e); border: 1px solid rgba(200,168,75,0.2); text-align: center; }
.art-cta p { margin-bottom: 1rem; }

.btn-primary, .btn-outline { display: inline-block; padding: 0.9rem 1.8rem; font-family: 'Barlow Condensed', sans-serif; font-weight: 700; font-size: 0.9rem; letter-spacing: 0.15em; text-transform: uppercase; text-decoration: none; margin: 0.3rem; }
.btn-primary { background: var(--gold); color: var(--ink) !important; }
.btn-primary:hover { background: var(--ember); color: var(--bone) !important; }
.btn-outline { border: 1px solid rgba(240,235,224,0.35); color: var(--bone) !important; }
.btn-outline:hover { border-color: var(--gold); color: var(--gold) !important; }

/* HUB */
.hub .card { display: grid; grid-template-columns: 1fr 1.2fr; gap: 0; text-decoration: none; background: rgba(255,255,255,0.03); border: 1px solid rgba(200,168,75,0.15); margin-bottom: 2rem; transition: border-color 0.2s; }
.hub .card:hover { border-color: rgba(200,168,75,0.45); }
.hub .card img { width: 100%; height: 100%; object-fit: cover; display: block; min-height: 220px; }
.hub .card-body { padding: 1.5rem; }
.hub .card h2 { font-size: 1.8rem; margin: 0.2rem 0 0.6rem; color: var(--bone); }
.hub .card p { color: var(--mist); }
.hub .card-cta { color: var(--gold); font-family: 'Barlow Condensed', sans-serif; letter-spacing: 0.15em; text-transform: uppercase; font-size: 0.9rem; }
.hub .more-soon { text-align: center; margin-top: 1rem; }
.hub > p { text-align: center; }

@media (max-width: 700px) {
  .hub .card { grid-template-columns: 1fr; }
  .art h2 { font-size: 1.7rem; }
}

footer { background: #080d09; padding: 3rem 2rem; text-align: center; border-top: 1px solid rgba(107,143,71,0.15); }
.footer-logo { font-family: 'Bebas Neue', sans-serif; font-size: 1.8rem; letter-spacing: 0.1em; margin-bottom: 1rem; }
.footer-logo span { color: var(--gold); }
.footer-copy { font-size: 0.9rem; color: rgba(143,168,154,0.5); }

/* MORE GUIDES */
.more-guides { margin-top: 3rem; padding-top: 1.5rem; border-top: 1px solid rgba(200,168,75,0.15); }
.more-guides h2 { margin-top: 0; }
.more-guides ul { list-style: none; padding-left: 0 !important; }
.more-guides li a { display: block; padding: 0.9rem 1rem; background: rgba(255,255,255,0.03); border: 1px solid rgba(200,168,75,0.15); text-decoration: none; color: var(--bone); line-height: 1.4; }
.more-guides li a:hover { border-color: rgba(200,168,75,0.5); }
.mg-tag { display: block; font-family: 'Barlow Condensed', sans-serif; font-size: 0.75rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--fern); margin-bottom: 0.2rem; }

/* PRODUCT BOX */
.product-box { margin: 1.6rem 0; padding: 1.5rem; background: linear-gradient(160deg, #0d1a12, #1a2e1e); border: 1px solid rgba(200,168,75,0.35); text-align: center; }
.product-box p { margin-bottom: 0.7rem; }
.product-box .pb-title { font-family: 'Bebas Neue', sans-serif; font-size: 1.6rem; letter-spacing: 0.04em; color: var(--gold); margin-bottom: 0.6rem; }
.product-box .pb-price { font-family: 'Barlow Condensed', sans-serif; letter-spacing: 0.15em; text-transform: uppercase; color: var(--mist); font-size: 0.9rem; }

/* GEAR TABLE */
.gear-table { margin: 2rem 0; }
.gear-table h2 { margin-top: 0; }
.gt-note { font-size: 0.9rem; color: var(--mist) !important; }
.gt-scroll { overflow-x: auto; }
.gear-table table { width: 100%; border-collapse: collapse; min-width: 480px; }
.gear-table th { text-align: left; font-family: 'Barlow Condensed', sans-serif; letter-spacing: 0.15em; text-transform: uppercase; font-size: 0.75rem; color: var(--mist); padding: 0.6rem 0.8rem; border-bottom: 1px solid rgba(200,168,75,0.25); }
.gear-table td { padding: 0.7rem 0.8rem; border-bottom: 1px solid rgba(255,255,255,0.07); vertical-align: top; color: #d8d3c6; font-size: 0.95rem; }
.gear-table td a { color: var(--bone); }
.gear-table .gt-buy { display: inline-block; background: var(--gold); color: var(--ink) !important; font-family: 'Barlow Condensed', sans-serif; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; font-size: 0.8rem; text-decoration: none; padding: 0.4rem 0.8rem; white-space: nowrap; }
.gear-table .gt-buy:hover { background: var(--ember); color: var(--bone) !important; }

/* GUIDE BOX (guided walk prompt) */
.guide-box { margin: 1.6rem 0; padding: 1.5rem; border: 1px solid rgba(107,143,71,0.45); background: rgba(107,143,71,0.08); }
.guide-box .gb-title { font-family: 'Bebas Neue', sans-serif; font-size: 1.6rem; letter-spacing: 0.04em; color: var(--bone); margin-bottom: 0.5rem; }
.guide-box blockquote { margin: 0.8rem 0; padding-left: 1rem; border-left: 3px solid var(--gold); color: #d8d3c6; font-style: italic; line-height: 1.7; }
.guide-box .gb-by { font-style: normal; color: var(--mist); font-size: 0.9rem; }

/* SIGNUP BOX + MailerLite overrides */
.signup-box { margin: 3rem 0 1rem; padding: 1.8rem; background: linear-gradient(160deg, #0d1a12, #1a2e1e); border: 1px solid rgba(200,168,75,0.3); }
.signup-box h2 { margin-top: 0; }
.signup-box .sb-note { font-size: 0.8rem; color: var(--mist) !important; margin: 0.8rem 0 0; }
.signup-box .ml-embedded { width: 100% !important; max-width: 460px; }
.signup-box .ml-embedded .ml-form-embedWrapper { background: transparent !important; border: none !important; padding: 0 !important; }
.signup-box .ml-embedded .ml-form-embedBody { background: transparent !important; padding: 0 !important; }
.signup-box .ml-embedded .ml-form-embedContent { display: none !important; }
.signup-box .ml-embedded .ml-form-fieldRow input { background: rgba(255,255,255,0.06) !important; border: 1px solid rgba(255,255,255,0.15) !important; border-radius: 0 !important; color: var(--bone) !important; font-family: 'Barlow', sans-serif !important; font-size: 0.95rem !important; padding: 0.9rem 1rem !important; width: 100% !important; margin-bottom: 0.8rem !important; outline: none !important; }
.signup-box .ml-embedded .ml-form-fieldRow input::placeholder { color: var(--mist) !important; }
.signup-box .ml-embedded .ml-form-embedSubmit button { background: var(--gold) !important; color: var(--ink) !important; border: none !important; border-radius: 0 !important; font-family: 'Barlow Condensed', sans-serif !important; font-size: 0.9rem !important; font-weight: 700 !important; letter-spacing: 0.15em !important; text-transform: uppercase !important; padding: 1rem 2rem !important; width: 100% !important; cursor: pointer !important; }
.signup-box .ml-embedded .ml-form-embedSubmit button:hover { background: var(--ember) !important; color: var(--bone) !important; }
.signup-box .ml-embedded .ml-form-successContent h4, .signup-box .ml-embedded .ml-form-successContent p { color: var(--bone) !important; }

/* ENQUIRY FORM */
.enquiry { margin-top: 1rem; display: flex; flex-direction: column; gap: 1rem; }
.enquiry label { display: flex; flex-direction: column; gap: 0.35rem; font-family: 'Barlow Condensed', sans-serif; letter-spacing: 0.12em; text-transform: uppercase; font-size: 0.8rem; color: var(--mist); flex: 1; }
.enquiry input, .enquiry textarea { background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.15); color: var(--bone); font-family: 'Barlow', sans-serif; font-size: 1rem; padding: 0.85rem 1rem; text-transform: none; letter-spacing: 0; outline: none; width: 100%; }
.enquiry input:focus, .enquiry textarea:focus { border-color: rgba(200,168,75,0.6); }
.f-row { display: flex; gap: 1rem; }
.enquiry button { align-self: flex-start; border: none; cursor: pointer; }
.f-note { font-size: 0.85rem; color: var(--mist) !important; }
@media (max-width: 600px) { .f-row { flex-direction: column; } }

/* FIGURES, NOTES, FACTS TABLE */
.art-note { color: var(--mist); font-size: 0.9rem; margin-top: 0.6rem; font-style: italic; }
.art-fig { margin: 1.8rem 0; text-align: center; }
.art-fig img { max-width: 100%; max-height: 560px; width: auto; height: auto; border: 1px solid rgba(200,168,75,0.15); display: inline-block; }
.art-fig figcaption { font-size: 0.85rem; color: var(--mist); margin-top: 0.5rem; }
.facts-table table { width: 100%; border-collapse: collapse; min-width: 560px; margin: 1rem 0 0.4rem; }
.facts-table th { text-align: left; font-family: 'Barlow Condensed', sans-serif; letter-spacing: 0.15em; text-transform: uppercase; font-size: 0.75rem; color: var(--mist); padding: 0.6rem 0.8rem; border-bottom: 1px solid rgba(200,168,75,0.25); }
.facts-table td { padding: 0.7rem 0.8rem; border-bottom: 1px solid rgba(255,255,255,0.07); vertical-align: top; color: #d8d3c6; font-size: 0.92rem; line-height: 1.5; }
.facts-table td:first-child { color: var(--bone); font-weight: 500; }
.art-gallery { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.25rem; margin: 2.2rem -3.5rem 2.6rem; align-items: start; }
.art-gallery .art-fig { margin: 0; }
.art-gallery .art-fig img { display: block; width: 100%; height: auto; max-height: none; aspect-ratio: 3 / 4; object-fit: cover; }
.art-gallery .art-fig figcaption { font-size: 0.82rem; line-height: 1.4; text-align: left; margin-top: 0.6rem; }
.art-gallery-2 { grid-template-columns: repeat(2, 1fr); margin-left: -1.5rem; margin-right: -1.5rem; }
@media (max-width: 900px) { .art-gallery, .art-gallery-2 { margin-left: 0; margin-right: 0; } }
@media (max-width: 640px) { .art-gallery, .art-gallery-2 { grid-template-columns: 1fr; gap: 1.6rem; } .art-gallery .art-fig img { aspect-ratio: 3 / 4; max-width: 420px; margin: 0 auto; } .art-gallery .art-fig figcaption { max-width: 420px; margin-left: auto; margin-right: auto; } }
