@charset "UTF-8";
/* ==========================================================================
   HARIDWAR DHAM — Design System
   1. Tokens
   2. Reset & base
   3. Typography
   4. Layout primitives
   5. Buttons & UI atoms
   6. Header / navigation / search
   7. Hero
   8. Cards (article, destination, seva)
   9. Sections (homepage)
   10. Article / editorial template
   11. Archives, search, pagination, 404
   12. Comments & forms
   13. Footer
   14. WordPress core & block support
   15. Utilities, motion, print
   ========================================================================== */

/* ==========================================================================
   1. TOKENS
   ========================================================================== */
:root {
  /* --- Brand palette ---------------------------------------------------
     Inspired by the Ganga at dusk, Himalayan stone, and temple brass.
     Deliberately NOT saffron-led: deep river teal leads, gold accents. */
  --hd-ink:            #0f1b2a;   /* Himalayan night — headings, dark sections */
  --hd-ink-soft:       #1c2b3d;
  --hd-primary:        #0d5c63;   /* Ganga deep — primary brand */
  --hd-primary-700:    #0a464c;
  --hd-primary-500:    #12787f;
  --hd-primary-100:    #dcefef;
  --hd-primary-050:    #f0f8f8;
  --hd-accent:         #c08a2e;   /* Temple brass / diya flame */
  --hd-accent-600:     #a3721f;
  --hd-accent-100:     #f6e9cf;
  --hd-terracotta:     #b4553a;   /* Sadhu Bhoj seva accent */
  --hd-terracotta-100: #f7e5df;
  --hd-bezubaan:       #e2701e;   /* Mission Bezubaan's own brand orange */

  /* --- Neutrals --------------------------------------------------------- */
  --hd-bg:             #ffffff;
  --hd-bg-alt:         #f8f6f1;   /* Parchment / river sand */
  --hd-bg-tint:        #f2f6f6;
  --hd-surface:        #ffffff;
  --hd-line:           #e7e2d9;
  --hd-line-strong:    #d4cec2;
  --hd-text:           #1e2a38;
  --hd-muted:          #5b6b7c;
  --hd-muted-light:    #8493a3;
  --hd-on-dark:        #eef3f5;
  --hd-on-dark-muted:  #a9bcc6;

  /* --- Typography ------------------------------------------------------- */
  --hd-font-display: "Fraunces", "Iowan Old Style", "Palatino Linotype", Palatino, Georgia, "Times New Roman", serif;
  --hd-font-body: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif;
  --hd-font-mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;

  /* Fluid type scale (min 360px → max 1280px viewport) */
  --hd-fs-xs:   0.8125rem;
  --hd-fs-sm:   0.875rem;
  --hd-fs-base: 1rem;
  --hd-fs-md:   clamp(1.0625rem, 0.99rem + 0.30vw, 1.1875rem);
  --hd-fs-lg:   clamp(1.1875rem, 1.10rem + 0.42vw, 1.375rem);
  --hd-fs-xl:   clamp(1.375rem, 1.24rem + 0.60vw, 1.75rem);
  --hd-fs-2xl:  clamp(1.625rem, 1.40rem + 1.00vw, 2.25rem);
  --hd-fs-3xl:  clamp(1.95rem, 1.58rem + 1.62vw, 3rem);
  --hd-fs-4xl:  clamp(2.35rem, 1.75rem + 2.60vw, 4rem);
  --hd-fs-hero: clamp(2.6rem, 1.60rem + 4.30vw, 5.25rem);

  --hd-lh-tight: 1.1;
  --hd-lh-snug:  1.28;
  --hd-lh-body:  1.72;

  --hd-tracking-tight: -0.022em;
  --hd-tracking-wide:  0.13em;

  /* --- Space (4px base, geometric-ish) ---------------------------------- */
  --hd-1:  0.25rem;
  --hd-2:  0.5rem;
  --hd-3:  0.75rem;
  --hd-4:  1rem;
  --hd-5:  1.5rem;
  --hd-6:  2rem;
  --hd-7:  2.75rem;
  --hd-8:  3.5rem;
  --hd-9:  4.5rem;
  --hd-10: 6rem;
  --hd-section: clamp(3.5rem, 2.2rem + 5.5vw, 7rem);

  /* --- Layout ----------------------------------------------------------- */
  --hd-wrap:      1220px;
  --hd-wrap-wide: 1440px;
  --hd-wrap-text: 720px;
  --hd-gutter:    clamp(1.125rem, 0.6rem + 2.2vw, 2.5rem);
  --hd-header-h:  76px;

  /* --- Radius / shadow / motion ----------------------------------------- */
  --hd-r-sm:  8px;
  --hd-r:     14px;
  --hd-r-lg:  22px;
  --hd-r-xl:  32px;
  --hd-r-pill: 999px;

  --hd-shadow-sm: 0 1px 2px rgba(15, 27, 42, .05), 0 2px 6px rgba(15, 27, 42, .05);
  --hd-shadow:    0 2px 4px rgba(15, 27, 42, .04), 0 10px 26px -6px rgba(15, 27, 42, .10);
  --hd-shadow-lg: 0 4px 8px rgba(15, 27, 42, .05), 0 24px 56px -12px rgba(15, 27, 42, .20);
  --hd-shadow-glow: 0 18px 44px -14px rgba(13, 92, 99, .45);

  --hd-ease: cubic-bezier(.22, .61, .36, 1);
  --hd-dur: .28s;
}

/* ==========================================================================
   2. RESET & BASE
   ========================================================================== */
*, *::before, *::after { box-sizing: border-box; }

html {
  -webkit-text-size-adjust: 100%;
  scroll-behavior: smooth;
  scroll-padding-top: calc(var(--hd-header-h) + 1.25rem);
}

body {
  margin: 0;
  background: var(--hd-bg);
  color: var(--hd-text);
  font-family: var(--hd-font-body);
  font-size: var(--hd-fs-base);
  line-height: var(--hd-lh-body);
  font-synthesis-weight: none;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  overflow-wrap: break-word;
}

body.hd-no-scroll { overflow: hidden; }

img, svg, video, canvas, iframe { max-width: 100%; }
img, video { height: auto; }
img { display: block; border-style: none; }

svg { fill: currentColor; }

a { color: var(--hd-primary); text-decoration-thickness: 1px; text-underline-offset: 3px; }
a:hover { color: var(--hd-primary-700); }

hr { border: 0; border-top: 1px solid var(--hd-line); margin: var(--hd-7) 0; }

::selection { background: var(--hd-accent-100); color: var(--hd-ink); }

:focus-visible {
  outline: 3px solid var(--hd-accent);
  outline-offset: 2px;
  border-radius: 4px;
}

.hd-skip-link {
  position: absolute;
  left: -9999px;
  top: 0;
  z-index: 1000;
  background: var(--hd-ink);
  color: #fff;
  padding: .85rem 1.4rem;
  border-radius: 0 0 var(--hd-r-sm) 0;
  font-weight: 600;
}
.hd-skip-link:focus { left: 0; color: #fff; }

.screen-reader-text {
  border: 0;
  clip-path: inset(50%);
  height: 1px;
  width: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute !important;
  white-space: nowrap;
}
.screen-reader-text:focus {
  clip-path: none;
  height: auto;
  width: auto;
  padding: 1rem 1.5rem;
  background: #fff;
  z-index: 100000;
  border-radius: var(--hd-r-sm);
  box-shadow: var(--hd-shadow-lg);
}

/* ==========================================================================
   3. TYPOGRAPHY
   ========================================================================== */
h1, h2, h3, h4, h5, h6 {
  font-family: var(--hd-font-display);
  color: var(--hd-ink);
  font-weight: 600;
  line-height: var(--hd-lh-snug);
  letter-spacing: var(--hd-tracking-tight);
  margin: 0 0 var(--hd-4);
  font-variation-settings: "SOFT" 0, "WONK" 0;
}
h1 { font-size: var(--hd-fs-4xl); line-height: var(--hd-lh-tight); }
h2 { font-size: var(--hd-fs-3xl); }
h3 { font-size: var(--hd-fs-2xl); }
h4 { font-size: var(--hd-fs-xl); }
h5 { font-size: var(--hd-fs-lg); }
h6 { font-size: var(--hd-fs-md); }

p { margin: 0 0 var(--hd-5); }
p:last-child { margin-bottom: 0; }

strong, b { font-weight: 650; color: var(--hd-ink); }

blockquote {
  margin: var(--hd-7) 0;
  padding: var(--hd-2) 0 var(--hd-2) var(--hd-6);
  border-left: 3px solid var(--hd-accent);
  font-family: var(--hd-font-display);
  font-size: var(--hd-fs-lg);
  line-height: 1.55;
  color: var(--hd-ink);
  font-style: italic;
}
blockquote cite {
  display: block;
  margin-top: var(--hd-3);
  font-family: var(--hd-font-body);
  font-size: var(--hd-fs-sm);
  font-style: normal;
  color: var(--hd-muted);
  letter-spacing: .02em;
}

code, kbd, samp, pre { font-family: var(--hd-font-mono); font-size: .9em; }
code {
  background: var(--hd-bg-tint);
  padding: .15em .4em;
  border-radius: 5px;
  color: var(--hd-primary-700);
}
pre {
  background: var(--hd-ink);
  color: #dbe6ec;
  padding: var(--hd-5);
  border-radius: var(--hd-r);
  overflow-x: auto;
  line-height: 1.6;
}
pre code { background: none; color: inherit; padding: 0; }

/* Eyebrow / kicker */
.hd-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: .55rem;
  font-family: var(--hd-font-body);
  font-size: var(--hd-fs-xs);
  font-weight: 600;
  letter-spacing: var(--hd-tracking-wide);
  text-transform: uppercase;
  color: var(--hd-primary);
  margin: 0 0 var(--hd-3);
}
.hd-eyebrow::before {
  content: "";
  width: 26px;
  height: 1px;
  background: currentColor;
  opacity: .6;
  flex: none;
}
.hd-eyebrow--center { justify-content: center; }
.hd-eyebrow--on-dark { color: var(--hd-accent); }
.hd-eyebrow--plain::before { display: none; }

/* ==========================================================================
   4. LAYOUT PRIMITIVES
   ========================================================================== */
.hd-wrap {
  width: 100%;
  max-width: var(--hd-wrap);
  margin-inline: auto;
  padding-inline: var(--hd-gutter);
}
.hd-wrap--wide { max-width: var(--hd-wrap-wide); }
.hd-wrap--text { max-width: var(--hd-wrap-text); }

.hd-section { padding-block: var(--hd-section); }
.hd-section--tight { padding-block: clamp(2.5rem, 1.8rem + 3vw, 4.5rem); }
.hd-section--alt { background: var(--hd-bg-alt); }
.hd-section--tint { background: var(--hd-bg-tint); }
.hd-section--dark {
  background: var(--hd-ink);
  color: var(--hd-on-dark);
}
.hd-section--dark h1, .hd-section--dark h2,
.hd-section--dark h3, .hd-section--dark h4 { color: #fff; }
.hd-section--dark p { color: var(--hd-on-dark-muted); }

.hd-section-head {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: var(--hd-4) var(--hd-6);
  margin-bottom: var(--hd-7);
}
.hd-section-head__text { max-width: 46rem; }
.hd-section-head h2 { margin-bottom: var(--hd-3); }
.hd-section-head p {
  margin: 0;
  color: var(--hd-muted);
  font-size: var(--hd-fs-md);
  max-width: 42rem;
}
.hd-section-head--center {
  flex-direction: column;
  align-items: center;
  text-align: center;
}
.hd-section-head--center .hd-section-head__text { margin-inline: auto; }

.hd-grid { display: grid; gap: var(--hd-6); }
.hd-grid--2 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 340px), 1fr)); }
.hd-grid--3 { grid-template-columns: repeat(auto-fill, minmax(min(100%, 320px), 1fr)); }
.hd-grid--4 { grid-template-columns: repeat(auto-fill, minmax(min(100%, 250px), 1fr)); }

/* Decorative hairline divider with a brass dot */
.hd-rule {
  display: flex;
  align-items: center;
  gap: var(--hd-4);
  margin: var(--hd-7) 0;
  color: var(--hd-line-strong);
}
.hd-rule::before, .hd-rule::after {
  content: "";
  height: 1px;
  background: currentColor;
  flex: 1;
}
.hd-rule span {
  width: 7px; height: 7px;
  border-radius: 50%;
  background: var(--hd-accent);
  flex: none;
}

/* ==========================================================================
   5. BUTTONS & UI ATOMS
   ========================================================================== */
.hd-btn {
  --btn-bg: var(--hd-primary);
  --btn-fg: #fff;
  --btn-bd: var(--hd-primary);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .6rem;
  padding: .92rem 1.65rem;
  background: var(--btn-bg);
  color: var(--btn-fg);
  border: 1px solid var(--btn-bd);
  border-radius: var(--hd-r-pill);
  font-family: var(--hd-font-body);
  font-size: var(--hd-fs-sm);
  font-weight: 600;
  letter-spacing: .02em;
  line-height: 1.2;
  text-decoration: none;
  cursor: pointer;
  transition: transform var(--hd-dur) var(--hd-ease),
              box-shadow var(--hd-dur) var(--hd-ease),
              background-color var(--hd-dur) var(--hd-ease),
              color var(--hd-dur) var(--hd-ease),
              border-color var(--hd-dur) var(--hd-ease);
}
.hd-btn:hover {
  color: var(--btn-fg);
  transform: translateY(-2px);
  box-shadow: var(--hd-shadow-glow);
}
.hd-btn:active { transform: translateY(0); }
.hd-btn svg { width: 1.05em; height: 1.05em; flex: none; }
.hd-btn__arrow { transition: transform var(--hd-dur) var(--hd-ease); }
.hd-btn:hover .hd-btn__arrow { transform: translateX(3px); }

.hd-btn--accent { --btn-bg: var(--hd-accent); --btn-bd: var(--hd-accent); --btn-fg: #221701; }
.hd-btn--accent:hover { --btn-bg: var(--hd-accent-600); box-shadow: 0 18px 40px -14px rgba(192, 138, 46, .6); }

.hd-btn--ink { --btn-bg: var(--hd-ink); --btn-bd: var(--hd-ink); }

.hd-btn--ghost {
  --btn-bg: transparent;
  --btn-fg: var(--hd-ink);
  --btn-bd: var(--hd-line-strong);
}
.hd-btn--ghost:hover {
  --btn-bd: var(--hd-primary);
  --btn-fg: var(--hd-primary);
  box-shadow: none;
}

.hd-btn--on-dark {
  --btn-bg: rgba(255,255,255,.08);
  --btn-fg: #fff;
  --btn-bd: rgba(255,255,255,.34);
  backdrop-filter: blur(8px);
}
.hd-btn--on-dark:hover { --btn-bg: rgba(255,255,255,.16); --btn-bd: rgba(255,255,255,.6); box-shadow: none; }

.hd-btn--block { width: 100%; }
.hd-btn--sm { padding: .62rem 1.15rem; font-size: var(--hd-fs-xs); }
.hd-btn--lg { padding: 1.08rem 2.1rem; font-size: var(--hd-fs-base); }

/* Text link with arrow */
.hd-link {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  font-weight: 600;
  font-size: var(--hd-fs-sm);
  text-decoration: none;
  color: var(--hd-primary);
  letter-spacing: .01em;
}
.hd-link::after {
  content: "→";
  transition: transform var(--hd-dur) var(--hd-ease);
}
.hd-link:hover::after { transform: translateX(4px); }
.hd-link--on-dark { color: var(--hd-accent); }

/* Chips / badges */
.hd-chip {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  padding: .32rem .85rem;
  border-radius: var(--hd-r-pill);
  background: var(--hd-primary-050);
  color: var(--hd-primary-700);
  border: 1px solid var(--hd-primary-100);
  font-size: var(--hd-fs-xs);
  font-weight: 600;
  letter-spacing: .04em;
  text-transform: uppercase;
  text-decoration: none;
  line-height: 1.5;
  transition: background-color var(--hd-dur) var(--hd-ease), color var(--hd-dur) var(--hd-ease);
}
a.hd-chip:hover { background: var(--hd-primary); color: #fff; border-color: var(--hd-primary); }
.hd-chip--accent { background: var(--hd-accent-100); color: var(--hd-accent-600); border-color: #ecd9b3; }
.hd-chip--solid { background: var(--hd-ink); color: #fff; border-color: var(--hd-ink); }
.hd-chip--ghost { background: rgba(255,255,255,.1); color: #fff; border-color: rgba(255,255,255,.28); }

.hd-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .5rem .9rem;
  font-size: var(--hd-fs-xs);
  color: var(--hd-muted);
  letter-spacing: .02em;
}
.hd-meta > * { display: inline-flex; align-items: center; gap: .35rem; }
.hd-meta svg { width: 14px; height: 14px; opacity: .75; }
.hd-meta a { color: inherit; text-decoration: none; }
.hd-meta a:hover { color: var(--hd-primary); text-decoration: underline; }

/* Ratio boxes for media */
.hd-ratio { position: relative; overflow: hidden; background: var(--hd-bg-tint); }
.hd-ratio > img,
.hd-ratio > .hd-ratio__ph {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
}
.hd-ratio--16x9 { aspect-ratio: 16 / 9; }
.hd-ratio--3x2  { aspect-ratio: 3 / 2; }
.hd-ratio--4x3  { aspect-ratio: 4 / 3; }
.hd-ratio--1x1  { aspect-ratio: 1 / 1; }
.hd-ratio--4x5  { aspect-ratio: 4 / 5; }

/* Placeholder artwork when a post has no featured image */
.hd-ratio__ph {
  display: grid;
  place-items: center;
  background:
    radial-gradient(120% 90% at 50% 120%, rgba(192,138,46,.22), transparent 60%),
    linear-gradient(160deg, var(--hd-primary-700), var(--hd-ink));
  color: rgba(255,255,255,.5);
}
.hd-ratio__ph svg { width: 44%; max-width: 110px; height: auto; opacity: .55; }

/* ==========================================================================
   6. HEADER / NAVIGATION / SEARCH
   ========================================================================== */
.hd-topbar {
  background: var(--hd-ink);
  color: var(--hd-on-dark-muted);
  font-size: var(--hd-fs-xs);
  letter-spacing: .02em;
}
.hd-topbar__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--hd-4);
  min-height: 38px;
  padding-block: .35rem;
}
.hd-topbar a { color: var(--hd-on-dark-muted); text-decoration: none; }
.hd-topbar a:hover { color: #fff; }
.hd-topbar__items { display: flex; flex-wrap: wrap; gap: .4rem 1.4rem; align-items: center; }
.hd-topbar__items span, .hd-topbar__items a { display: inline-flex; align-items: center; gap: .4rem; }
.hd-topbar svg { width: 13px; height: 13px; opacity: .8; }
.hd-topbar__social { display: flex; gap: .85rem; }
.hd-topbar__social svg { width: 15px; height: 15px; }
@media (max-width: 860px) { .hd-topbar { display: none; } }

.hd-header {
  position: sticky;
  top: 0;
  z-index: 200;
  background: rgba(255,255,255,.88);
  backdrop-filter: saturate(160%) blur(14px);
  -webkit-backdrop-filter: saturate(160%) blur(14px);
  border-bottom: 1px solid transparent;
  transition: border-color var(--hd-dur) var(--hd-ease),
              box-shadow var(--hd-dur) var(--hd-ease),
              background-color var(--hd-dur) var(--hd-ease);
}
.hd-header.is-stuck {
  border-bottom-color: var(--hd-line);
  box-shadow: 0 6px 24px -14px rgba(15,27,42,.35);
}
.hd-header__inner {
  display: flex;
  align-items: center;
  gap: var(--hd-5);
  min-height: var(--hd-header-h);
}

/* Brand */
.hd-brand {
  display: inline-flex;
  align-items: center;
  gap: .7rem;
  text-decoration: none;
  color: var(--hd-ink);
  /* Allowed to shrink, so a long site name can never push the header
     wider than the viewport on a 320px phone. */
  flex: 0 1 auto;
  min-width: 0;
  margin-right: auto;
}
.hd-brand__mark { width: 40px; height: 40px; flex: none; }
.hd-brand img { max-height: 48px; width: auto; }
.hd-brand__text { display: flex; flex-direction: column; line-height: 1.1; min-width: 0; }
.hd-brand__name {
  font-family: var(--hd-font-display);
  font-size: 1.28rem;
  font-weight: 600;
  letter-spacing: -.02em;
}
.hd-brand__tag {
  font-size: .6875rem;
  letter-spacing: .15em;
  text-transform: uppercase;
  color: var(--hd-muted);
  font-weight: 600;
}
@media (max-width: 420px) { .hd-brand__tag { display: none; } }
@media (max-width: 600px) { .hd-header__inner { gap: var(--hd-3); } }
@media (max-width: 380px) {
  .hd-brand { gap: .55rem; }
  .hd-brand__mark { width: 34px; height: 34px; }
  .hd-brand__name { font-size: 1.1rem; }
  .hd-icon-btn { width: 40px; height: 40px; }
}

/* Primary nav */
.hd-nav { display: flex; align-items: center; }
.hd-nav ul { list-style: none; margin: 0; padding: 0; }
.hd-nav > ul { display: flex; align-items: center; gap: .15rem; }
.hd-nav > ul > li { position: relative; }
.hd-nav a {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  padding: .6rem .85rem;
  border-radius: var(--hd-r-sm);
  color: var(--hd-ink);
  font-size: var(--hd-fs-sm);
  font-weight: 550;
  text-decoration: none;
  white-space: nowrap;
  transition: color var(--hd-dur) var(--hd-ease), background-color var(--hd-dur) var(--hd-ease);
}
.hd-nav > ul > li > a::after {
  content: "";
  position: absolute;
  left: .85rem; right: .85rem;
  bottom: .28rem;
  height: 2px;
  background: var(--hd-accent);
  border-radius: 2px;
  transform: scaleX(0);
  transform-origin: left;
  transition: transform var(--hd-dur) var(--hd-ease);
}
.hd-nav > ul > li:hover > a::after,
.hd-nav > ul > li.current-menu-item > a::after,
.hd-nav > ul > li.current-menu-ancestor > a::after,
.hd-nav > ul > li.current-menu-parent > a::after { transform: scaleX(1); }
.hd-nav a:hover { color: var(--hd-primary); }
.hd-nav .menu-item-has-children > a::before {
  content: "";
  order: 2;
  width: .42em; height: .42em;
  border-right: 1.6px solid currentColor;
  border-bottom: 1.6px solid currentColor;
  transform: rotate(45deg) translateY(-1px);
  opacity: .55;
}

/* Dropdowns */
.hd-nav .sub-menu {
  position: absolute;
  top: calc(100% + .35rem);
  left: 0;
  min-width: 232px;
  padding: .5rem;
  background: #fff;
  border: 1px solid var(--hd-line);
  border-radius: var(--hd-r);
  box-shadow: var(--hd-shadow-lg);
  opacity: 0;
  visibility: hidden;
  transform: translateY(8px);
  transition: opacity var(--hd-dur) var(--hd-ease),
              transform var(--hd-dur) var(--hd-ease),
              visibility var(--hd-dur);
  z-index: 10;
}
.hd-nav li:hover > .sub-menu,
.hd-nav li:focus-within > .sub-menu {
  opacity: 1; visibility: visible; transform: translateY(0);
}
.hd-nav .sub-menu a {
  display: flex;
  width: 100%;
  padding: .55rem .75rem;
  font-weight: 500;
  border-radius: var(--hd-r-sm);
}
.hd-nav .sub-menu a:hover { background: var(--hd-primary-050); }
.hd-nav .sub-menu .sub-menu { top: -.5rem; left: calc(100% + .25rem); }
@media (max-width: 1023px) { .hd-nav { display: none; } }

/* Header actions */
.hd-header__actions { display: flex; align-items: center; gap: .4rem; flex: none; }
.hd-icon-btn {
  display: inline-grid;
  place-items: center;
  width: 42px; height: 42px;
  border-radius: 50%;
  border: 1px solid var(--hd-line);
  background: #fff;
  color: var(--hd-ink);
  cursor: pointer;
  transition: border-color var(--hd-dur) var(--hd-ease),
              color var(--hd-dur) var(--hd-ease),
              background-color var(--hd-dur) var(--hd-ease);
}
.hd-icon-btn:hover { border-color: var(--hd-primary); color: var(--hd-primary); background: var(--hd-primary-050); }
.hd-icon-btn svg { width: 19px; height: 19px; }
.hd-header__actions .hd-btn { white-space: nowrap; }
@media (max-width: 600px) { .hd-header__actions .hd-btn--seva { display: none; } }
@media (min-width: 1024px) { .hd-burger { display: none; } }

/* Burger */
.hd-burger span {
  display: block;
  width: 18px; height: 2px;
  background: currentColor;
  border-radius: 2px;
  transition: transform var(--hd-dur) var(--hd-ease), opacity var(--hd-dur) var(--hd-ease);
}
.hd-burger span + span { margin-top: 4px; }
.hd-burger[aria-expanded="true"] span:nth-child(1) { transform: translateY(6px) rotate(45deg); }
.hd-burger[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.hd-burger[aria-expanded="true"] span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }

/* Search overlay */
.hd-search-overlay {
  position: fixed;
  inset: 0;
  z-index: 400;
  display: grid;
  place-items: start center;
  padding: clamp(4rem, 12vh, 9rem) var(--hd-gutter) var(--hd-gutter);
  background: rgba(15, 27, 42, .72);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  opacity: 0;
  visibility: hidden;
  transition: opacity var(--hd-dur) var(--hd-ease), visibility var(--hd-dur);
}
.hd-search-overlay.is-open { opacity: 1; visibility: visible; }
.hd-search-overlay__panel {
  width: min(100%, 680px);
  background: #fff;
  border-radius: var(--hd-r-lg);
  padding: clamp(1.5rem, 1rem + 2vw, 2.5rem);
  box-shadow: var(--hd-shadow-lg);
  transform: translateY(-14px);
  transition: transform var(--hd-dur) var(--hd-ease);
}
.hd-search-overlay.is-open .hd-search-overlay__panel { transform: translateY(0); }
.hd-search-overlay__head {
  display: flex; align-items: center; justify-content: space-between;
  gap: var(--hd-4); margin-bottom: var(--hd-4);
}
.hd-search-overlay__head h2 { font-size: var(--hd-fs-xl); margin: 0; }
.hd-search-suggest { margin-top: var(--hd-5); }
.hd-search-suggest__label {
  font-size: var(--hd-fs-xs);
  text-transform: uppercase;
  letter-spacing: var(--hd-tracking-wide);
  color: var(--hd-muted);
  font-weight: 600;
  margin-bottom: var(--hd-3);
}
.hd-search-suggest__list { display: flex; flex-wrap: wrap; gap: .5rem; }

/* Search form */
.hd-searchform { position: relative; display: flex; }
.hd-searchform input[type="search"] {
  width: 100%;
  padding: 1rem 3.6rem 1rem 1.25rem;
  font: inherit;
  font-size: var(--hd-fs-md);
  color: var(--hd-ink);
  background: var(--hd-bg-alt);
  border: 1px solid var(--hd-line);
  border-radius: var(--hd-r-pill);
  transition: border-color var(--hd-dur) var(--hd-ease), background-color var(--hd-dur) var(--hd-ease);
  -webkit-appearance: none;
  appearance: none;
}
.hd-searchform input[type="search"]:focus {
  background: #fff;
  border-color: var(--hd-primary);
  outline: none;
  box-shadow: 0 0 0 4px var(--hd-primary-050);
}
.hd-searchform input::placeholder { color: var(--hd-muted-light); }
.hd-searchform button {
  position: absolute;
  right: 6px; top: 50%;
  transform: translateY(-50%);
  display: grid; place-items: center;
  width: 44px; height: 44px;
  border: 0; border-radius: 50%;
  background: var(--hd-primary);
  color: #fff;
  cursor: pointer;
  transition: background-color var(--hd-dur) var(--hd-ease);
}
.hd-searchform button:hover { background: var(--hd-primary-700); }
.hd-searchform button svg { width: 18px; height: 18px; }

/* Mobile drawer */
.hd-drawer {
  position: fixed;
  inset: 0 0 0 auto;
  width: min(92vw, 400px);
  z-index: 500;
  background: #fff;
  display: flex;
  flex-direction: column;
  transform: translateX(100%);
  /* Hidden (not just off-screen) while closed, so its links stay out of the
     tab order and the accessibility tree — otherwise desktop keyboard users
     tab into an invisible duplicate of the menu. */
  visibility: hidden;
  transition: transform .34s var(--hd-ease), visibility .34s;
  box-shadow: -20px 0 60px -20px rgba(15,27,42,.4);
  overflow-y: auto;
  overscroll-behavior: contain;
}
.hd-drawer.is-open { transform: translateX(0); visibility: visible; }
.hd-drawer__scrim {
  position: fixed; inset: 0; z-index: 450;
  background: rgba(15,27,42,.5);
  backdrop-filter: blur(3px);
  opacity: 0; visibility: hidden;
  transition: opacity var(--hd-dur) var(--hd-ease), visibility var(--hd-dur);
}
.hd-drawer__scrim.is-open { opacity: 1; visibility: visible; }
.hd-drawer__head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 1rem var(--hd-5);
  border-bottom: 1px solid var(--hd-line);
  position: sticky; top: 0; background: #fff; z-index: 2;
}
.hd-drawer__body { padding: var(--hd-5); }
.hd-drawer__body > .hd-searchform { margin-bottom: var(--hd-5); }
.hd-drawer nav ul { list-style: none; margin: 0; padding: 0; }
.hd-drawer nav > ul > li { border-bottom: 1px solid var(--hd-line); }
.hd-drawer nav a {
  display: block;
  padding: .95rem 0;
  color: var(--hd-ink);
  font-size: var(--hd-fs-md);
  font-weight: 550;
  text-decoration: none;
  font-family: var(--hd-font-display);
}
.hd-drawer nav a:hover { color: var(--hd-primary); }
.hd-drawer .sub-menu { padding: 0 0 .75rem .9rem; border-left: 2px solid var(--hd-primary-100); margin-bottom: .4rem; }
.hd-drawer .sub-menu a {
  padding: .5rem 0;
  font-family: var(--hd-font-body);
  font-size: var(--hd-fs-sm);
  font-weight: 500;
  color: var(--hd-muted);
}
.hd-drawer__submenu-toggle {
  position: absolute; right: 0; top: .35rem;
  width: 40px; height: 40px;
  display: grid; place-items: center;
  background: var(--hd-bg-alt);
  border: 0; border-radius: 50%;
  color: var(--hd-ink);
  cursor: pointer;
}
.hd-drawer__submenu-toggle svg { width: 14px; height: 14px; transition: transform var(--hd-dur) var(--hd-ease); }
.hd-drawer__submenu-toggle[aria-expanded="true"] svg { transform: rotate(180deg); }
.hd-drawer nav li { position: relative; }
.hd-drawer nav .sub-menu[hidden] { display: none; }
.hd-drawer__foot {
  margin-top: auto;
  padding: var(--hd-5);
  background: var(--hd-bg-alt);
  border-top: 1px solid var(--hd-line);
  display: grid;
  gap: .75rem;
}
.hd-drawer__foot .hd-meta { font-size: var(--hd-fs-xs); }

/* ==========================================================================
   7. HERO
   ========================================================================== */
.hd-hero {
  position: relative;
  isolation: isolate;
  background: var(--hd-ink);
  color: #fff;
  overflow: hidden;
}
.hd-hero__bg { position: absolute; inset: 0; z-index: -2; }
.hd-hero__bg img { width: 100%; height: 100%; object-fit: cover; }
.hd-hero__bg--fallback {
  background:
    radial-gradient(90% 70% at 15% 10%, rgba(18,120,127,.55), transparent 60%),
    radial-gradient(70% 60% at 85% 20%, rgba(192,138,46,.35), transparent 62%),
    linear-gradient(175deg, #123043 0%, #0f1b2a 55%, #0a1622 100%);
}
.hd-hero__scrim {
  position: absolute; inset: 0; z-index: -1;
  background:
    linear-gradient(to right, rgba(10,18,28,.94) 0%, rgba(10,18,28,.78) 42%, rgba(10,18,28,.42) 75%, rgba(10,18,28,.55) 100%),
    linear-gradient(to top, rgba(10,18,28,.9) 0%, transparent 45%);
}
/* Layered Himalaya silhouette */
.hd-hero__ranges {
  position: absolute;
  left: 0; right: 0; bottom: -1px;
  z-index: -1;
  width: 100%;
  height: clamp(120px, 22vh, 260px);
  pointer-events: none;
}
.hd-hero__inner {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: clamp(560px, 82vh, 860px);
  padding-block: clamp(4rem, 10vh, 7rem);
  max-width: 44rem;
}
.hd-hero h1 {
  font-size: var(--hd-fs-hero);
  color: #fff;
  margin-bottom: var(--hd-5);
  text-wrap: balance;
  font-weight: 500;
  letter-spacing: -.03em;
}
.hd-hero h1 em {
  font-style: italic;
  color: var(--hd-accent);
  font-weight: 500;
}
.hd-hero__lede {
  font-size: var(--hd-fs-lg);
  color: rgba(255,255,255,.82);
  max-width: 34rem;
  margin-bottom: var(--hd-6);
  line-height: 1.6;
}
.hd-hero__cta { display: flex; flex-wrap: wrap; gap: var(--hd-3); }
.hd-hero__badges {
  display: flex; flex-wrap: wrap;
  gap: .5rem .6rem;
  margin-bottom: var(--hd-5);
}
/* Short viewports — a phone held sideways, or a small laptop. Never force a
   hero taller than it needs to be; keep the buttons close to the fold.
   Declared after the hero rules above so it wins the cascade. */
@media (max-height: 560px) {
  .hd-hero__inner {
    min-height: 0;
    padding-block: clamp(1.75rem, 5vh, 2.75rem);
  }
  .hd-hero h1 {
    font-size: clamp(1.7rem, 1.1rem + 1.6vw, 2.3rem);
    margin-bottom: var(--hd-3);
  }
  .hd-hero__lede {
    font-size: var(--hd-fs-base);
    max-width: 32rem;
    margin-bottom: var(--hd-4);
  }
  .hd-hero__ranges { height: clamp(70px, 16vh, 120px); }
}
/* Quick-jump strip under hero */
.hd-hero__strip {
  position: relative;
  z-index: 2;
  margin-top: calc(var(--hd-7) * -1);
}
.hd-hero__strip-inner {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 200px), 1fr));
  background: #fff;
  border: 1px solid var(--hd-line);
  border-radius: var(--hd-r-lg);
  box-shadow: var(--hd-shadow-lg);
  overflow: hidden;
}
.hd-hero__strip-item {
  display: flex;
  align-items: center;
  gap: .9rem;
  padding: 1.15rem 1.35rem;
  text-decoration: none;
  color: var(--hd-ink);
  border-right: 1px solid var(--hd-line);
  transition: background-color var(--hd-dur) var(--hd-ease);
}
.hd-hero__strip-item:last-child { border-right: 0; }
.hd-hero__strip-item:hover { background: var(--hd-primary-050); color: var(--hd-ink); }
.hd-hero__strip-item svg { width: 22px; height: 22px; color: var(--hd-primary); flex: none; }
.hd-hero__strip-item b { display: block; font-size: var(--hd-fs-sm); font-weight: 650; }
.hd-hero__strip-item small { color: var(--hd-muted); font-size: var(--hd-fs-xs); }
@media (max-width: 720px) {
  .hd-hero__strip { margin-top: var(--hd-6); }
  .hd-hero__strip-item { border-right: 0; border-bottom: 1px solid var(--hd-line); }
}

/* Compact page hero (archives, pages) */
.hd-pagehero {
  position: relative;
  background: var(--hd-ink);
  color: #fff;
  padding-block: clamp(2.75rem, 2rem + 4vw, 5rem);
  overflow: hidden;
  isolation: isolate;
}
.hd-pagehero::after {
  content: "";
  position: absolute; inset: 0; z-index: -1;
  background:
    radial-gradient(70% 120% at 12% 0%, rgba(18,120,127,.42), transparent 62%),
    radial-gradient(60% 100% at 88% 100%, rgba(192,138,46,.22), transparent 60%);
}
.hd-pagehero__inner { max-width: 50rem; }
.hd-pagehero h1 { color: #fff; margin-bottom: var(--hd-3); font-size: var(--hd-fs-3xl); }
.hd-pagehero p { color: rgba(255,255,255,.75); margin: 0; max-width: 42rem; font-size: var(--hd-fs-md); }
.hd-pagehero .hd-breadcrumbs { margin-bottom: var(--hd-4); }
.hd-pagehero--image .hd-pagehero__bg { position: absolute; inset: 0; z-index: -2; }
.hd-pagehero--image .hd-pagehero__bg img { width: 100%; height: 100%; object-fit: cover; opacity: .38; }

/* ==========================================================================
   8. CARDS
   ========================================================================== */
.hd-card {
  position: relative;
  display: flex;
  flex-direction: column;
  background: var(--hd-surface);
  border: 1px solid var(--hd-line);
  border-radius: var(--hd-r-lg);
  overflow: hidden;
  transition: transform var(--hd-dur) var(--hd-ease),
              box-shadow var(--hd-dur) var(--hd-ease),
              border-color var(--hd-dur) var(--hd-ease);
}
.hd-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--hd-shadow-lg);
  border-color: transparent;
}
.hd-card__media { position: relative; overflow: hidden; }
.hd-card__media img,
.hd-card__media .hd-ratio__ph { transition: transform .6s var(--hd-ease); }
.hd-card:hover .hd-card__media img { transform: scale(1.045); }
.hd-card__cat {
  position: absolute;
  left: 1rem; top: 1rem;
  z-index: 2;
}
.hd-card__body {
  display: flex;
  flex-direction: column;
  gap: .7rem;
  padding: 1.35rem 1.4rem 1.5rem;
  flex: 1;
}
.hd-card__title {
  font-size: var(--hd-fs-lg);
  margin: 0;
  line-height: 1.3;
}
.hd-card__title a {
  color: inherit;
  text-decoration: none;
  background-image: linear-gradient(currentColor, currentColor);
  background-size: 0 1px;
  background-position: 0 100%;
  background-repeat: no-repeat;
  transition: background-size var(--hd-dur) var(--hd-ease);
}
.hd-card:hover .hd-card__title a { background-size: 100% 1px; }
/* Full-card click target */
.hd-card__title a::after { content: ""; position: absolute; inset: 0; z-index: 1; }
.hd-card__excerpt {
  margin: 0;
  color: var(--hd-muted);
  font-size: var(--hd-fs-sm);
  line-height: 1.65;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.hd-card__foot {
  margin-top: auto;
  padding-top: .9rem;
  border-top: 1px solid var(--hd-line);
}

/* Horizontal list card */
.hd-card--row { flex-direction: row; align-items: stretch; }
.hd-card--row .hd-card__media { flex: 0 0 clamp(120px, 32%, 260px); }
.hd-card--row .hd-ratio { height: 100%; aspect-ratio: auto; }
.hd-card--row .hd-card__body { padding: 1.15rem 1.3rem; }
@media (max-width: 560px) {
  .hd-card--row { flex-direction: column; }
  .hd-card--row .hd-card__media { flex: none; }
  .hd-card--row .hd-ratio { aspect-ratio: 16/9; }
}

/* Feature card — big editorial hero card */
.hd-feature {
  position: relative;
  display: grid;
  grid-template-columns: 1.15fr 1fr;
  gap: 0;
  background: var(--hd-surface);
  border: 1px solid var(--hd-line);
  border-radius: var(--hd-r-xl);
  overflow: hidden;
}
.hd-feature .hd-ratio { height: 100%; aspect-ratio: 4/3; }
.hd-feature__body {
  padding: clamp(1.5rem, 1rem + 2.4vw, 3rem);
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: var(--hd-4);
}
.hd-feature__body h3 { font-size: var(--hd-fs-2xl); margin: 0; }
.hd-feature__body h3 a { color: inherit; text-decoration: none; }
.hd-feature__body h3 a:hover { color: var(--hd-primary); }
@media (max-width: 860px) { .hd-feature { grid-template-columns: 1fr; } }

/* Destination / place card — image-led with gradient caption */
.hd-place {
  position: relative;
  display: block;
  border-radius: var(--hd-r-lg);
  overflow: hidden;
  text-decoration: none;
  color: #fff;
  isolation: isolate;
  background: var(--hd-ink);
}
.hd-place .hd-ratio { aspect-ratio: 3/4; }
.hd-place img { transition: transform .7s var(--hd-ease); }
.hd-place:hover img { transform: scale(1.06); }
.hd-place::after {
  content: "";
  position: absolute; inset: 0; z-index: 1;
  background: linear-gradient(to top, rgba(8,16,26,.92) 8%, rgba(8,16,26,.35) 45%, rgba(8,16,26,.05) 75%);
}
.hd-place__body {
  position: absolute;
  inset: auto 0 0 0;
  z-index: 2;
  padding: 1.25rem 1.3rem 1.35rem;
}
.hd-place__body h3 {
  color: #fff;
  font-size: var(--hd-fs-lg);
  margin: 0 0 .3rem;
}
.hd-place__body p {
  margin: 0;
  color: rgba(255,255,255,.76);
  font-size: var(--hd-fs-xs);
  letter-spacing: .02em;
}
.hd-place__body .hd-chip { margin-bottom: .6rem; }
.hd-place--wide .hd-ratio { aspect-ratio: 16/10; }

/* ---------- SEVA / CAMPAIGN CARDS ---------- */
/* One featured campaign across the top, two supporting campaigns below.
   On mobile the whole thing becomes a single readable stack. */
.hd-seva-grid { display: grid; gap: var(--hd-5); }
.hd-seva-grid__side {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 330px), 1fr));
  gap: var(--hd-5);
  align-items: stretch;
}

.hd-seva {
  --seva-accent: var(--hd-primary);
  --seva-accent-soft: var(--hd-primary-050);
  position: relative;
  display: flex;
  flex-direction: column;
  background: #fff;
  border: 1px solid var(--hd-line);
  border-radius: var(--hd-r-xl);
  overflow: hidden;
  transition: transform var(--hd-dur) var(--hd-ease), box-shadow var(--hd-dur) var(--hd-ease);
}
.hd-seva:hover { transform: translateY(-3px); box-shadow: var(--hd-shadow-lg); }
.hd-seva--gold      { --seva-accent: var(--hd-accent);     --seva-accent-soft: var(--hd-accent-100); }
.hd-seva--terracotta{ --seva-accent: var(--hd-terracotta); --seva-accent-soft: var(--hd-terracotta-100); }
.hd-seva--bezubaan  { --seva-accent: var(--hd-bezubaan);   --seva-accent-soft: #fdeadb; }

.hd-seva__media { position: relative; }
.hd-seva__media .hd-ratio { aspect-ratio: 16/9; }
.hd-seva__media .hd-ratio__ph {
  background:
    radial-gradient(120% 100% at 80% 0%, color-mix(in srgb, var(--seva-accent) 55%, transparent), transparent 62%),
    linear-gradient(150deg, var(--hd-primary-700), var(--hd-ink));
}
.hd-seva__tag {
  position: absolute; top: 1rem; left: 1rem; z-index: 2;
  background: rgba(255,255,255,.92);
  color: var(--hd-ink);
  backdrop-filter: blur(6px);
  border-color: transparent;
}
.hd-seva__body {
  display: flex;
  flex-direction: column;
  gap: var(--hd-4);
  padding: clamp(1.4rem, 1rem + 1.4vw, 2.1rem);
  flex: 1;
}
.hd-seva__title { margin: 0; font-size: var(--hd-fs-xl); }
.hd-seva__desc { margin: 0; color: var(--hd-muted); font-size: var(--hd-fs-sm); line-height: 1.68; }

.hd-seva__amount {
  display: flex;
  align-items: baseline;
  gap: .45rem;
  flex-wrap: wrap;
  padding: .9rem 1.1rem;
  border-radius: var(--hd-r);
  background: var(--seva-accent-soft);
  border: 1px solid color-mix(in srgb, var(--seva-accent) 22%, transparent);
  width: fit-content;
}
.hd-seva__amount b {
  font-family: var(--hd-font-display);
  font-size: clamp(1.5rem, 1.2rem + 1.1vw, 2rem);
  line-height: 1;
  color: var(--hd-ink);
  font-weight: 600;
  letter-spacing: -.02em;
}
.hd-seva__amount span { font-size: var(--hd-fs-xs); color: var(--hd-muted); letter-spacing: .03em; }
.hd-seva__amount small {
  display: block;
  width: 100%;
  font-size: var(--hd-fs-xs);
  color: var(--hd-muted);
  margin-top: .3rem;
}

.hd-seva__list { list-style: none; margin: 0; padding: 0; display: grid; gap: .6rem; }
.hd-seva__list li {
  position: relative;
  display: flex;
  align-items: flex-start;
  gap: .65rem;
  font-size: var(--hd-fs-sm);
  line-height: 1.55;
  color: var(--hd-text);
}
.hd-seva__list li::before {
  content: "";
  flex: none;
  width: 18px; height: 18px;
  margin-top: .16rem;
  border-radius: 50%;
  background: var(--seva-accent-soft);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230f1b2a' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E");
  background-size: 11px 11px;
  background-position: center;
  background-repeat: no-repeat;
}
.hd-seva--two-col .hd-seva__list { grid-template-columns: repeat(auto-fit, minmax(min(100%, 230px), 1fr)); gap: .6rem 1.4rem; }

.hd-seva__actions { margin-top: auto; padding-top: .35rem; display: flex; flex-wrap: wrap; gap: .6rem; align-items: center; }
.hd-seva__actions .hd-btn { --btn-bg: var(--seva-accent); --btn-bd: var(--seva-accent); }
.hd-seva__actions .hd-btn--ghost { --btn-bg: transparent; --btn-bd: var(--hd-line-strong); --btn-fg: var(--hd-ink); }
.hd-seva__note {
  font-size: var(--hd-fs-xs);
  color: var(--hd-muted-light);
  display: flex; align-items: center; gap: .4rem;
}
.hd-seva__note svg { width: 13px; height: 13px; flex: none; }

/* Featured campaign: media and body side by side on wide screens. */
@media (min-width: 961px) {
  .hd-seva--featured { flex-direction: row; }
  .hd-seva--featured .hd-seva__media {
    flex: 0 0 42%;
    display: flex;
  }
  .hd-seva--featured .hd-seva__media .hd-ratio {
    aspect-ratio: auto;
    width: 100%;
    height: 100%;
    min-height: 430px;
  }
  .hd-seva--featured .hd-seva__body {
    flex: 1 1 auto;
    justify-content: center;
  }
}
/* External-initiative variant */
.hd-seva--external .hd-seva__external {
  display: inline-flex; align-items: center; gap: .4rem;
  font-size: var(--hd-fs-xs);
  color: var(--seva-accent);
  font-weight: 600;
  letter-spacing: .03em;
  text-transform: uppercase;
}
.hd-seva--external .hd-seva__external svg { width: 13px; height: 13px; }

/* Seva "how it works" steps */
.hd-steps {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 230px), 1fr));
  gap: var(--hd-5);
  counter-reset: hdstep;
}
.hd-step { position: relative; padding-top: var(--hd-5); }
.hd-step::before {
  counter-increment: hdstep;
  content: "0" counter(hdstep);
  position: absolute; top: 0; left: 0;
  font-family: var(--hd-font-display);
  font-size: var(--hd-fs-sm);
  font-weight: 600;
  color: var(--hd-accent);
  letter-spacing: .06em;
}
.hd-step::after {
  content: "";
  position: absolute; top: .55rem; left: 2.4rem; right: 0;
  height: 1px;
  background: var(--hd-line);
}
.hd-step h3 { font-size: var(--hd-fs-md); margin: 0 0 .4rem; }
.hd-step p { margin: 0; font-size: var(--hd-fs-sm); color: var(--hd-muted); }

/* ---------- ECOSYSTEM (related independent projects) ---------- */
.hd-ecosystem { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 380px), 1fr)); gap: var(--hd-5); }
.hd-eco {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: var(--hd-4);
  padding: clamp(1.5rem, 1.1rem + 1.6vw, 2.4rem);
  border-radius: var(--hd-r-xl);
  background: rgba(255,255,255,.045);
  border: 1px solid rgba(255,255,255,.12);
  overflow: hidden;
  transition: border-color var(--hd-dur) var(--hd-ease), background-color var(--hd-dur) var(--hd-ease);
}
.hd-eco::before {
  content: "";
  position: absolute; inset: auto auto -40% -20%;
  width: 60%; aspect-ratio: 1;
  border-radius: 50%;
  background: var(--eco-accent, var(--hd-primary-500));
  opacity: .16;
  filter: blur(46px);
  pointer-events: none;
}
.hd-eco:hover { border-color: rgba(255,255,255,.28); background: rgba(255,255,255,.07); }
.hd-eco--bezubaan { --eco-accent: var(--hd-bezubaan); }
.hd-eco--mart { --eco-accent: #3f9d5a; }
.hd-eco__badge {
  align-self: flex-start;
  font-size: var(--hd-fs-xs);
  text-transform: uppercase;
  letter-spacing: var(--hd-tracking-wide);
  font-weight: 600;
  color: var(--eco-accent, var(--hd-accent));
}
.hd-eco h3 { color: #fff; font-size: var(--hd-fs-xl); margin: 0; }
.hd-eco p { color: var(--hd-on-dark-muted); margin: 0; font-size: var(--hd-fs-sm); line-height: 1.7; }
.hd-eco__tags { display: flex; flex-wrap: wrap; gap: .4rem; }
.hd-eco__tags span {
  font-size: var(--hd-fs-xs);
  color: var(--hd-on-dark-muted);
  padding: .25rem .7rem;
  border: 1px solid rgba(255,255,255,.16);
  border-radius: var(--hd-r-pill);
}
.hd-eco .hd-btn { align-self: flex-start; margin-top: auto; }

/* ---------- Stat / trust row ---------- */
.hd-stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 180px), 1fr));
  gap: var(--hd-5);
}
.hd-stat { text-align: center; }
.hd-stat b {
  display: block;
  font-family: var(--hd-font-display);
  font-size: var(--hd-fs-2xl);
  color: var(--hd-ink);
  font-weight: 600;
  line-height: 1.1;
  letter-spacing: -.02em;
}
.hd-stat span {
  display: block;
  margin-top: .35rem;
  font-size: var(--hd-fs-xs);
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--hd-muted);
  font-weight: 600;
}
.hd-section--dark .hd-stat b { color: #fff; }
.hd-section--dark .hd-stat span { color: var(--hd-on-dark-muted); }

/* ==========================================================================
   9. HOMEPAGE SECTIONS
   ========================================================================== */
.hd-intro {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(2rem, 1rem + 4vw, 5rem);
  align-items: center;
}
@media (max-width: 860px) { .hd-intro { grid-template-columns: 1fr; } }
.hd-intro__lede {
  font-family: var(--hd-font-display);
  font-size: var(--hd-fs-xl);
  line-height: 1.5;
  color: var(--hd-ink);
}

/* Category / explore tiles */
.hd-explore {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 230px), 1fr));
  gap: var(--hd-4);
}
.hd-explore__item {
  display: flex;
  align-items: center;
  gap: .95rem;
  padding: 1.15rem 1.25rem;
  background: #fff;
  border: 1px solid var(--hd-line);
  border-radius: var(--hd-r);
  text-decoration: none;
  color: var(--hd-ink);
  transition: transform var(--hd-dur) var(--hd-ease),
              border-color var(--hd-dur) var(--hd-ease),
              box-shadow var(--hd-dur) var(--hd-ease);
}
.hd-explore__item:hover {
  transform: translateY(-3px);
  border-color: var(--hd-primary-100);
  box-shadow: var(--hd-shadow);
  color: var(--hd-ink);
}
.hd-explore__icon {
  display: grid; place-items: center;
  width: 44px; height: 44px; flex: none;
  border-radius: 12px;
  background: var(--hd-primary-050);
  color: var(--hd-primary);
}
.hd-explore__icon svg { width: 21px; height: 21px; }
.hd-explore__item b { display: block; font-size: var(--hd-fs-sm); font-weight: 650; }
.hd-explore__item small { color: var(--hd-muted); font-size: var(--hd-fs-xs); }

/* Newsletter / contact band */
.hd-band {
  position: relative;
  border-radius: var(--hd-r-xl);
  padding: clamp(2rem, 1.4rem + 3vw, 4rem);
  background:
    radial-gradient(80% 140% at 100% 0%, rgba(18,120,127,.5), transparent 60%),
    radial-gradient(70% 120% at 0% 100%, rgba(192,138,46,.28), transparent 60%),
    var(--hd-ink);
  color: #fff;
  overflow: hidden;
  display: grid;
  grid-template-columns: 1.3fr 1fr;
  gap: var(--hd-6);
  align-items: center;
}
@media (max-width: 800px) { .hd-band { grid-template-columns: 1fr; } }
.hd-band h2 { color: #fff; margin-bottom: var(--hd-3); }
.hd-band p { color: rgba(255,255,255,.76); margin: 0; }
.hd-band__actions { display: flex; flex-wrap: wrap; gap: .75rem; }

/* ==========================================================================
   10. ARTICLE / EDITORIAL
   ========================================================================== */
.hd-breadcrumbs {
  font-size: var(--hd-fs-xs);
  color: var(--hd-muted);
  letter-spacing: .02em;
}
.hd-breadcrumbs ol {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .4rem;
  margin: 0; padding: 0;
}
.hd-breadcrumbs li { display: inline-flex; align-items: center; gap: .4rem; }
.hd-breadcrumbs li:not(:last-child)::after {
  content: "/";
  color: var(--hd-line-strong);
}
.hd-breadcrumbs a { color: inherit; text-decoration: none; }
.hd-breadcrumbs a:hover { color: var(--hd-primary); text-decoration: underline; }
.hd-breadcrumbs [aria-current="page"] { color: var(--hd-ink); font-weight: 600; }
.hd-pagehero .hd-breadcrumbs,
.hd-pagehero .hd-breadcrumbs [aria-current="page"] { color: rgba(255,255,255,.72); }
.hd-pagehero .hd-breadcrumbs [aria-current="page"] { color: #fff; }
.hd-pagehero .hd-breadcrumbs li:not(:last-child)::after { color: rgba(255,255,255,.35); }

/* Article header */
.hd-article-head {
  padding-block: clamp(2rem, 1.4rem + 3vw, 3.5rem) var(--hd-5);
  background: var(--hd-bg-alt);
  border-bottom: 1px solid var(--hd-line);
}
.hd-article-head__inner { max-width: 860px; margin-inline: auto; }
.hd-article-head h1 {
  font-size: var(--hd-fs-4xl);
  margin: var(--hd-4) 0 var(--hd-4);
  text-wrap: balance;
  font-weight: 500;
}
.hd-article-head__lede {
  font-size: var(--hd-fs-lg);
  color: var(--hd-muted);
  line-height: 1.6;
  margin-bottom: var(--hd-5);
  max-width: 44rem;
}
.hd-byline {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--hd-3) var(--hd-5);
  padding-top: var(--hd-4);
  border-top: 1px solid var(--hd-line);
}
.hd-byline__author { display: flex; align-items: center; gap: .7rem; }
.hd-byline__author img { border-radius: 50%; width: 42px; height: 42px; }
.hd-byline__author b { display: block; font-size: var(--hd-fs-sm); color: var(--hd-ink); }
.hd-byline__author span { font-size: var(--hd-fs-xs); color: var(--hd-muted); }

/* Featured image */
.hd-article-hero {
  margin-block: 0 clamp(1.5rem, 1rem + 2vw, 2.75rem);
}
.hd-article-hero figure { margin: 0; }
.hd-article-hero img {
  width: 100%;
  border-radius: var(--hd-r-lg);
  box-shadow: var(--hd-shadow);
}
.hd-article-hero figcaption {
  margin-top: .75rem;
  font-size: var(--hd-fs-xs);
  color: var(--hd-muted);
  text-align: center;
}

/* Article layout: content + sticky sidebar */
.hd-article-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  gap: clamp(2rem, 1rem + 3vw, 4rem);
  align-items: start;
  padding-block: clamp(2rem, 1.5rem + 2vw, 3.5rem) var(--hd-section);
}
@media (max-width: 1024px) {
  .hd-article-layout { grid-template-columns: 1fr; }
  .hd-article-aside { order: 2; }
}
.hd-article-aside {
  position: sticky;
  top: calc(var(--hd-header-h) + 1.5rem);
  display: grid;
  gap: var(--hd-5);
}
@media (max-width: 1024px) { .hd-article-aside { position: static; } }

.hd-aside-card {
  background: #fff;
  border: 1px solid var(--hd-line);
  border-radius: var(--hd-r-lg);
  padding: 1.35rem 1.4rem;
}
.hd-aside-card__title {
  font-family: var(--hd-font-body);
  font-size: var(--hd-fs-xs);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: var(--hd-tracking-wide);
  color: var(--hd-muted);
  margin: 0 0 var(--hd-4);
}
.hd-aside-card--seva {
  background: linear-gradient(165deg, var(--hd-primary-700), var(--hd-ink));
  border-color: transparent;
  color: #fff;
}
.hd-aside-card--seva .hd-aside-card__title { color: var(--hd-accent); }
.hd-aside-card--seva h3 { color: #fff; font-size: var(--hd-fs-lg); margin-bottom: .5rem; }
.hd-aside-card--seva p { color: rgba(255,255,255,.75); font-size: var(--hd-fs-sm); margin-bottom: var(--hd-4); }

/* Table of contents */
.hd-toc__list { list-style: none; margin: 0; padding: 0; display: grid; gap: .1rem; }
.hd-toc__list a {
  display: block;
  padding: .42rem .7rem;
  border-left: 2px solid var(--hd-line);
  color: var(--hd-muted);
  font-size: var(--hd-fs-sm);
  text-decoration: none;
  line-height: 1.45;
  transition: color var(--hd-dur) var(--hd-ease), border-color var(--hd-dur) var(--hd-ease), background-color var(--hd-dur) var(--hd-ease);
}
.hd-toc__list a:hover { color: var(--hd-primary); border-left-color: var(--hd-primary-100); background: var(--hd-primary-050); }
.hd-toc__list a.is-active {
  color: var(--hd-primary-700);
  border-left-color: var(--hd-accent);
  background: var(--hd-primary-050);
  font-weight: 600;
}
.hd-toc__list .is-h3 a { padding-left: 1.5rem; font-size: var(--hd-fs-xs); }

/* Inline (mobile) TOC */
.hd-toc-inline {
  border: 1px solid var(--hd-line);
  border-radius: var(--hd-r);
  background: var(--hd-bg-alt);
  padding: 1rem 1.25rem;
  margin-bottom: var(--hd-6);
}
.hd-toc-inline summary {
  cursor: pointer;
  font-weight: 650;
  font-size: var(--hd-fs-sm);
  color: var(--hd-ink);
  list-style: none;
  display: flex; align-items: center; justify-content: space-between; gap: 1rem;
}
.hd-toc-inline summary::-webkit-details-marker { display: none; }
.hd-toc-inline summary::after {
  content: "";
  width: .5em; height: .5em;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(45deg);
  transition: transform var(--hd-dur) var(--hd-ease);
}
.hd-toc-inline[open] summary::after { transform: rotate(-135deg); }
.hd-toc-inline .hd-toc__list { margin-top: var(--hd-4); }
@media (min-width: 1025px) { .hd-toc-inline { display: none; } }

/* The prose itself */
.hd-prose {
  font-size: var(--hd-fs-md);
  line-height: var(--hd-lh-body);
  color: var(--hd-text);
  max-width: 44rem;
}
.hd-prose > * { max-width: 100%; }
.hd-prose h2 {
  font-size: var(--hd-fs-2xl);
  margin: var(--hd-8) 0 var(--hd-4);
  scroll-margin-top: calc(var(--hd-header-h) + 1.5rem);
}
.hd-prose h2::after {
  content: "";
  display: block;
  width: 42px; height: 2px;
  margin-top: .75rem;
  background: var(--hd-accent);
  border-radius: 2px;
}
.hd-prose h3 {
  font-size: var(--hd-fs-xl);
  margin: var(--hd-7) 0 var(--hd-3);
  scroll-margin-top: calc(var(--hd-header-h) + 1.5rem);
}
.hd-prose h4 { font-size: var(--hd-fs-lg); margin: var(--hd-6) 0 var(--hd-3); }
.hd-prose > p:first-of-type { font-size: 1.06em; }
.hd-prose a { color: var(--hd-primary-700); text-decoration: underline; text-decoration-color: var(--hd-primary-100); text-decoration-thickness: 2px; }
.hd-prose a:hover { text-decoration-color: var(--hd-primary); }
.hd-prose ul, .hd-prose ol { margin: 0 0 var(--hd-5); padding-left: 1.35rem; }
.hd-prose li { margin-bottom: .55rem; }
.hd-prose li::marker { color: var(--hd-accent); }
.hd-prose img, .hd-prose figure img { border-radius: var(--hd-r); }
.hd-prose figure { margin: var(--hd-7) 0; }
.hd-prose figcaption { margin-top: .7rem; font-size: var(--hd-fs-xs); color: var(--hd-muted); text-align: center; }
.hd-prose table {
  width: 100%;
  border-collapse: collapse;
  margin: var(--hd-6) 0;
  font-size: var(--hd-fs-sm);
}
/* Wide tables scroll sideways on small screens rather than squashing. */
@media (max-width: 640px) {
  .hd-prose table {
    display: block;
    overflow-x: auto;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
  }
}
.hd-prose th, .hd-prose td { padding: .8rem 1rem; border-bottom: 1px solid var(--hd-line); text-align: left; }
.hd-prose thead th { background: var(--hd-bg-alt); color: var(--hd-ink); font-weight: 650; white-space: nowrap; }
.hd-prose iframe, .hd-prose video, .hd-prose embed { max-width: 100%; border-radius: var(--hd-r); }
.hd-prose > iframe { aspect-ratio: 16/9; width: 100%; height: auto; }

/* Key-facts callout usable inside posts */
.hd-callout {
  margin: var(--hd-7) 0;
  padding: 1.35rem 1.5rem;
  border-radius: var(--hd-r);
  background: var(--hd-primary-050);
  border: 1px solid var(--hd-primary-100);
  border-left: 3px solid var(--hd-primary);
  font-size: var(--hd-fs-sm);
}
.hd-callout strong { color: var(--hd-primary-700); }

/* Share + tags */
.hd-article-foot {
  max-width: 44rem;
  margin-top: var(--hd-8);
  padding-top: var(--hd-6);
  border-top: 1px solid var(--hd-line);
  display: grid;
  gap: var(--hd-5);
}
.hd-tags { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; }
.hd-share { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem; }
.hd-share__label {
  font-size: var(--hd-fs-xs);
  text-transform: uppercase;
  letter-spacing: var(--hd-tracking-wide);
  font-weight: 700;
  color: var(--hd-muted);
  margin-right: .3rem;
}
.hd-share a, .hd-share button {
  display: grid; place-items: center;
  width: 40px; height: 40px;
  border-radius: 50%;
  border: 1px solid var(--hd-line);
  background: #fff;
  color: var(--hd-ink);
  cursor: pointer;
  text-decoration: none;
  transition: transform var(--hd-dur) var(--hd-ease), border-color var(--hd-dur) var(--hd-ease),
              background-color var(--hd-dur) var(--hd-ease), color var(--hd-dur) var(--hd-ease);
}
.hd-share a:hover, .hd-share button:hover {
  transform: translateY(-2px);
  background: var(--hd-ink);
  color: #fff;
  border-color: var(--hd-ink);
}
.hd-share svg { width: 17px; height: 17px; }
.hd-share .is-copied { background: var(--hd-primary); border-color: var(--hd-primary); color: #fff; }

/* Author box */
.hd-authorbox {
  display: flex;
  gap: var(--hd-5);
  padding: var(--hd-5);
  background: var(--hd-bg-alt);
  border-radius: var(--hd-r-lg);
  border: 1px solid var(--hd-line);
}
.hd-authorbox img { border-radius: 50%; flex: none; width: 64px; height: 64px; }
.hd-authorbox h3 { font-size: var(--hd-fs-md); margin: 0 0 .35rem; }
.hd-authorbox p { margin: 0; font-size: var(--hd-fs-sm); color: var(--hd-muted); }
@media (max-width: 520px) { .hd-authorbox { flex-direction: column; } }

/* Prev / next */
.hd-prevnext {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr));
  gap: var(--hd-4);
  margin-top: var(--hd-7);
}
.hd-prevnext a {
  display: grid;
  gap: .35rem;
  padding: 1.15rem 1.35rem;
  border: 1px solid var(--hd-line);
  border-radius: var(--hd-r);
  text-decoration: none;
  background: #fff;
  transition: border-color var(--hd-dur) var(--hd-ease), transform var(--hd-dur) var(--hd-ease);
}
.hd-prevnext a:hover { border-color: var(--hd-primary); transform: translateY(-2px); }
.hd-prevnext span {
  font-size: var(--hd-fs-xs);
  text-transform: uppercase;
  letter-spacing: var(--hd-tracking-wide);
  color: var(--hd-muted);
  font-weight: 600;
}
.hd-prevnext b {
  font-family: var(--hd-font-display);
  font-size: var(--hd-fs-md);
  color: var(--hd-ink);
  font-weight: 600;
  line-height: 1.35;
}
.hd-prevnext .is-next { text-align: right; }

/* Reading progress bar */
.hd-progress {
  position: fixed;
  top: 0; left: 0;
  height: 3px;
  width: 0;
  z-index: 300;
  background: linear-gradient(90deg, var(--hd-primary), var(--hd-accent));
  transition: width .1s linear;
  pointer-events: none;
}

/* ==========================================================================
   11. ARCHIVES, SEARCH, PAGINATION, 404
   ========================================================================== */
.hd-archive-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  gap: clamp(2rem, 1rem + 3vw, 3.5rem);
  align-items: start;
}
@media (max-width: 1024px) { .hd-archive-layout { grid-template-columns: 1fr; } }
.hd-sidebar { display: grid; gap: var(--hd-5); position: sticky; top: calc(var(--hd-header-h) + 1.5rem); }
@media (max-width: 1024px) { .hd-sidebar { position: static; } }
/* Widget styling applies wherever widgets can appear: the archive sidebar
   and the article/page aside. Any WordPress core or plugin widget picks
   these up without configuration. */
.hd-sidebar .widget,
.hd-article-aside .widget {
  background: #fff;
  border: 1px solid var(--hd-line);
  border-radius: var(--hd-r-lg);
  padding: 1.35rem 1.4rem;
}
.hd-sidebar .widget-title,
.hd-sidebar .wp-block-heading,
.hd-sidebar .widget h1, .hd-sidebar .widget h2,
.hd-sidebar .widget h3, .hd-sidebar .widget h4,
.hd-article-aside .widget-title,
.hd-article-aside .widget .wp-block-heading,
.hd-article-aside .widget h1, .hd-article-aside .widget h2,
.hd-article-aside .widget h3, .hd-article-aside .widget h4 {
  font-family: var(--hd-font-body);
  font-size: var(--hd-fs-xs);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: var(--hd-tracking-wide);
  color: var(--hd-muted);
  margin: 0 0 var(--hd-4);
  line-height: 1.5;
}
.hd-sidebar ul,
.hd-article-aside .widget ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: .1rem;
}
.hd-sidebar li a,
.hd-article-aside .widget li a {
  display: block;
  padding: .45rem 0;
  color: var(--hd-text);
  font-size: var(--hd-fs-sm);
  text-decoration: none;
  border-bottom: 1px solid var(--hd-line);
}
.hd-sidebar li:last-child a,
.hd-article-aside .widget li:last-child a { border-bottom: 0; }
.hd-sidebar li a:hover,
.hd-article-aside .widget li a:hover { color: var(--hd-primary); }
.hd-sidebar .widget li,
.hd-article-aside .widget li { font-size: var(--hd-fs-sm); }
.hd-sidebar .widget select,
.hd-article-aside .widget select { margin-top: .5rem; }

/* Grid children must be allowed to shrink, or a wide widget (the core
   search block in particular) stretches the whole column. */
.hd-sidebar > *,
.hd-article-aside > * { min-width: 0; }
.hd-sidebar .widget *,
.hd-article-aside .widget * { max-width: 100%; }

/* Core search block inside a widget area */
.hd-sidebar .wp-block-search__inside-wrapper,
.hd-article-aside .wp-block-search__inside-wrapper {
  display: flex;
  gap: .4rem;
  border: 0;
  padding: 0;
}
.hd-sidebar .wp-block-search__input,
.hd-article-aside .wp-block-search__input {
  flex: 1 1 auto;
  min-width: 0;
  border: 1px solid var(--hd-line-strong);
  border-radius: var(--hd-r-sm);
  padding: .7rem .85rem;
  font-size: var(--hd-fs-sm);
}
.hd-sidebar .wp-block-search__button,
.hd-article-aside .wp-block-search__button {
  flex: 0 0 auto;
  margin: 0;
  padding: .7rem 1rem;
  background: var(--hd-ink);
  color: #fff;
  border: 0;
  border-radius: var(--hd-r-sm);
  font-size: var(--hd-fs-xs);
  font-weight: 600;
  cursor: pointer;
}
.hd-sidebar .wp-block-search__button:hover,
.hd-article-aside .wp-block-search__button:hover { background: var(--hd-primary); }
.hd-sidebar .wp-block-search__label,
.hd-article-aside .wp-block-search__label {
  font-size: var(--hd-fs-xs);
  text-transform: uppercase;
  letter-spacing: var(--hd-tracking-wide);
  color: var(--hd-muted);
  font-weight: 700;
  margin-bottom: .6rem;
  display: block;
}
/* Calendar and tag-cloud widgets */
.hd-sidebar .wp-block-calendar table,
.hd-article-aside .wp-block-calendar table { width: 100%; font-size: var(--hd-fs-xs); }
.hd-sidebar .wp-block-tag-cloud a,
.hd-article-aside .wp-block-tag-cloud a {
  display: inline-block;
  font-size: var(--hd-fs-xs) !important;
  padding: .25rem .7rem;
  margin: 0 .25rem .4rem 0;
  border: 1px solid var(--hd-line);
  border-radius: var(--hd-r-pill);
  text-decoration: none;
  border-bottom: 1px solid var(--hd-line);
}

.hd-filterbar {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
  padding-bottom: var(--hd-6);
  margin-bottom: var(--hd-6);
  border-bottom: 1px solid var(--hd-line);
}

.hd-results-count {
  font-size: var(--hd-fs-sm);
  color: var(--hd-muted);
  margin-bottom: var(--hd-5);
}

/* Pagination */
.hd-pagination { margin-top: var(--hd-8); }
.hd-pagination .nav-links,
.hd-pagination .page-numbers {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem;
  align-items: center;
  justify-content: center;
  list-style: none;
  padding: 0; margin: 0;
}
.hd-pagination a.page-numbers,
.hd-pagination span.page-numbers {
  display: grid;
  place-items: center;
  min-width: 44px; height: 44px;
  padding: 0 .85rem;
  border-radius: var(--hd-r-pill);
  border: 1px solid var(--hd-line);
  background: #fff;
  color: var(--hd-ink);
  font-size: var(--hd-fs-sm);
  font-weight: 600;
  text-decoration: none;
  transition: all var(--hd-dur) var(--hd-ease);
}
.hd-pagination a.page-numbers:hover { border-color: var(--hd-primary); color: var(--hd-primary); }
.hd-pagination .page-numbers.current { background: var(--hd-ink); border-color: var(--hd-ink); color: #fff; }
.hd-pagination .page-numbers.dots { border-color: transparent; background: none; }

/* Post navigation inside content (multipage posts) */
.hd-page-links {
  display: flex; flex-wrap: wrap; gap: .4rem; align-items: center;
  margin: var(--hd-6) 0;
  font-size: var(--hd-fs-sm);
}
.hd-page-links a, .hd-page-links > span {
  display: grid; place-items: center;
  min-width: 36px; height: 36px;
  border: 1px solid var(--hd-line);
  border-radius: var(--hd-r-sm);
  text-decoration: none;
}

/* Empty state / 404 */
.hd-empty {
  text-align: center;
  max-width: 34rem;
  margin-inline: auto;
  padding-block: var(--hd-8);
}
.hd-empty svg { width: 68px; height: 68px; color: var(--hd-line-strong); margin: 0 auto var(--hd-5); }
.hd-empty h2 { margin-bottom: var(--hd-3); }
.hd-empty p { color: var(--hd-muted); margin-bottom: var(--hd-6); }
.hd-empty .hd-searchform { margin-bottom: var(--hd-5); text-align: left; }

.hd-404 {
  display: grid;
  place-items: center;
  text-align: center;
  padding-block: clamp(4rem, 3rem + 6vw, 8rem);
}
.hd-404__code {
  font-family: var(--hd-font-display);
  font-size: clamp(5rem, 3rem + 12vw, 11rem);
  line-height: .85;
  color: var(--hd-primary-100);
  font-weight: 600;
  letter-spacing: -.04em;
  margin-bottom: var(--hd-5);
}

/* ==========================================================================
   12. COMMENTS & FORMS
   ========================================================================== */
input[type="text"], input[type="email"], input[type="url"], input[type="tel"],
input[type="number"], input[type="password"], input[type="date"], select, textarea {
  width: 100%;
  padding: .82rem 1rem;
  font: inherit;
  font-size: var(--hd-fs-sm);
  color: var(--hd-ink);
  background: #fff;
  border: 1px solid var(--hd-line-strong);
  border-radius: var(--hd-r-sm);
  transition: border-color var(--hd-dur) var(--hd-ease), box-shadow var(--hd-dur) var(--hd-ease);
}
input:focus, select:focus, textarea:focus {
  outline: none;
  border-color: var(--hd-primary);
  box-shadow: 0 0 0 3px var(--hd-primary-050);
}
textarea { min-height: 150px; resize: vertical; }
label { display: block; font-size: var(--hd-fs-sm); font-weight: 600; color: var(--hd-ink); margin-bottom: .4rem; }
input[type="submit"], button[type="submit"] { cursor: pointer; }
.comment-form input[type="submit"] {
  width: auto;
  padding: .92rem 1.85rem;
  background: var(--hd-primary);
  color: #fff;
  border: 0;
  border-radius: var(--hd-r-pill);
  font-weight: 600;
  font-size: var(--hd-fs-sm);
}
.comment-form input[type="submit"]:hover { background: var(--hd-primary-700); }

.hd-comments { max-width: 44rem; margin-top: var(--hd-8); padding-top: var(--hd-7); border-top: 1px solid var(--hd-line); }
.hd-comments h2 { font-size: var(--hd-fs-xl); }
.comment-list { list-style: none; margin: 0 0 var(--hd-7); padding: 0; display: grid; gap: var(--hd-5); }
.comment-list .children { list-style: none; margin: var(--hd-5) 0 0; padding-left: clamp(.75rem, 3vw, 2rem); display: grid; gap: var(--hd-5); border-left: 2px solid var(--hd-line); }
.comment-body { background: var(--hd-bg-alt); border-radius: var(--hd-r); padding: 1.25rem 1.4rem; }
.comment-meta { display: flex; align-items: center; gap: .7rem; margin-bottom: .75rem; }
.comment-author img { border-radius: 50%; }
.comment-author .fn { font-style: normal; font-weight: 650; color: var(--hd-ink); font-size: var(--hd-fs-sm); }
.comment-metadata { font-size: var(--hd-fs-xs); color: var(--hd-muted); }
.comment-metadata a { color: inherit; text-decoration: none; }
.reply { margin-top: .6rem; }
.reply a { font-size: var(--hd-fs-xs); font-weight: 650; text-transform: uppercase; letter-spacing: .08em; text-decoration: none; }
.comment-form { display: grid; gap: var(--hd-4); }
.comment-form .comment-notes, .comment-form .logged-in-as { font-size: var(--hd-fs-xs); color: var(--hd-muted); margin: 0; }
.comment-form-cookies-consent { display: flex; align-items: center; gap: .5rem; }
.comment-form-cookies-consent input { width: auto; }
.comment-form-cookies-consent label { margin: 0; font-weight: 400; font-size: var(--hd-fs-xs); }

/* ==========================================================================
   13. FOOTER
   ========================================================================== */
.hd-footer {
  background: var(--hd-ink);
  color: var(--hd-on-dark-muted);
  padding-top: var(--hd-section);
  font-size: var(--hd-fs-sm);
}
.hd-footer a { color: var(--hd-on-dark-muted); text-decoration: none; }
.hd-footer a:hover { color: #fff; }
.hd-footer__top {
  display: grid;
  grid-template-columns: minmax(230px, 1.5fr) repeat(auto-fit, minmax(140px, 1fr));
  gap: var(--hd-7) var(--hd-6);
  padding-bottom: var(--hd-8);
}
@media (max-width: 720px) {
  .hd-footer__top { grid-template-columns: repeat(auto-fit, minmax(min(100%, 150px), 1fr)); }
  .hd-footer__brand { grid-column: 1 / -1; }
}
.hd-footer__brand { max-width: 24rem; display: grid; gap: var(--hd-4); align-content: start; }
.hd-footer__brand .hd-brand { color: #fff; }
.hd-footer__brand .hd-brand__tag { color: var(--hd-on-dark-muted); }
.hd-footer__brand p { margin: 0; line-height: 1.75; }
.hd-footer__col h3 {
  font-family: var(--hd-font-body);
  color: #fff;
  font-size: var(--hd-fs-xs);
  text-transform: uppercase;
  letter-spacing: var(--hd-tracking-wide);
  margin: 0 0 var(--hd-4);
  font-weight: 700;
}
.hd-footer__col ul { list-style: none; margin: 0; padding: 0; display: grid; gap: .65rem; }
.hd-footer__contact { display: grid; gap: .7rem; }
.hd-footer__contact li { display: flex; gap: .6rem; align-items: flex-start; list-style: none; }
.hd-footer__contact svg { width: 15px; height: 15px; flex: none; margin-top: .3rem; color: var(--hd-accent); }
.hd-footer__social { display: flex; gap: .6rem; }
.hd-footer__social a {
  display: grid; place-items: center;
  width: 38px; height: 38px;
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 50%;
  transition: background-color var(--hd-dur) var(--hd-ease), border-color var(--hd-dur) var(--hd-ease), transform var(--hd-dur) var(--hd-ease);
}
.hd-footer__social a:hover { background: rgba(255,255,255,.1); border-color: rgba(255,255,255,.4); transform: translateY(-2px); }
.hd-footer__social svg { width: 16px; height: 16px; }

.hd-footer__eco {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--hd-4) var(--hd-6);
  padding: var(--hd-5) 0;
  border-top: 1px solid rgba(255,255,255,.1);
  border-bottom: 1px solid rgba(255,255,255,.1);
}
.hd-footer__eco-label {
  font-size: var(--hd-fs-xs);
  text-transform: uppercase;
  letter-spacing: var(--hd-tracking-wide);
  color: var(--hd-on-dark-muted);
  font-weight: 600;
}
.hd-footer__eco-links { display: flex; flex-wrap: wrap; gap: .6rem 1.5rem; }
.hd-footer__eco-links a { display: inline-flex; align-items: center; gap: .4rem; color: #fff; font-weight: 600; }
.hd-footer__eco-links svg { width: 13px; height: 13px; opacity: .6; }

.hd-footer__bottom {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--hd-3) var(--hd-5);
  padding: var(--hd-5) 0;
  font-size: var(--hd-fs-xs);
  color: var(--hd-muted-light);
}
.hd-footer__bottom ul { list-style: none; display: flex; flex-wrap: wrap; gap: .5rem 1.25rem; margin: 0; padding: 0; }

/* Back to top */
.hd-totop {
  position: fixed;
  right: clamp(1rem, 3vw, 2rem);
  bottom: clamp(1rem, 3vw, 2rem);
  z-index: 180;
  width: 46px; height: 46px;
  display: grid; place-items: center;
  border-radius: 50%;
  background: var(--hd-ink);
  color: #fff;
  border: 0;
  cursor: pointer;
  opacity: 0;
  visibility: hidden;
  transform: translateY(10px);
  transition: opacity var(--hd-dur) var(--hd-ease), transform var(--hd-dur) var(--hd-ease), visibility var(--hd-dur);
  box-shadow: var(--hd-shadow-lg);
}
.hd-totop.is-visible { opacity: 1; visibility: visible; transform: translateY(0); }
.hd-totop:hover { background: var(--hd-primary); }
.hd-totop svg { width: 18px; height: 18px; }

/* Mobile sticky seva CTA */
.hd-sticky-cta {
  position: fixed;
  left: 0; right: 0; bottom: 0;
  z-index: 190;
  display: none;
  gap: .6rem;
  padding: .7rem var(--hd-gutter) calc(.7rem + env(safe-area-inset-bottom));
  background: rgba(255,255,255,.95);
  backdrop-filter: blur(12px);
  border-top: 1px solid var(--hd-line);
  transform: translateY(110%);
  transition: transform .3s var(--hd-ease);
}
.hd-sticky-cta.is-visible { transform: translateY(0); }
.hd-sticky-cta .hd-btn { flex: 1; }
@media (max-width: 720px) { .hd-sticky-cta { display: flex; } body { padding-bottom: 0; } }

/* ==========================================================================
   14. WORDPRESS CORE & BLOCK SUPPORT
   ========================================================================== */
.alignleft { float: left; margin: .4rem 1.75rem 1.25rem 0; }
.alignright { float: right; margin: .4rem 0 1.25rem 1.75rem; }
.aligncenter { display: block; margin-inline: auto; }
.alignwide { width: min(100vw - 2 * var(--hd-gutter), 1100px); max-width: none; margin-inline: auto; }
.alignfull {
  width: 100vw;
  max-width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
}
.hd-prose .alignwide, .hd-prose .alignfull { margin-block: var(--hd-7); }
@media (max-width: 600px) { .alignleft, .alignright { float: none; margin: var(--hd-5) 0; } }

.wp-caption { max-width: 100%; }
.wp-caption-text, .wp-block-image figcaption {
  font-size: var(--hd-fs-xs);
  color: var(--hd-muted);
  text-align: center;
  margin-top: .65rem;
}
.sticky .hd-card { border-color: var(--hd-accent); }
.bypostauthor > .comment-body { border-left: 3px solid var(--hd-accent); }
.gallery { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: var(--hd-3); margin: var(--hd-6) 0; }
.gallery-item { margin: 0; }
.gallery-item img { border-radius: var(--hd-r-sm); width: 100%; }

.wp-block-button__link { border-radius: var(--hd-r-pill); font-weight: 600; }
.wp-block-separator { border-top: 1px solid var(--hd-line); border-bottom: 0; }
.wp-block-pullquote { border-block: 2px solid var(--hd-accent); padding: var(--hd-6) 0; }
.wp-block-table table { width: 100%; }
.wp-block-embed__wrapper { position: relative; }
.wp-block-embed.wp-has-aspect-ratio .wp-block-embed__wrapper { aspect-ratio: 16/9; }
.wp-block-embed.wp-has-aspect-ratio iframe { position: absolute; inset: 0; width: 100%; height: 100%; }

/* Editor colour palette hooks */
.has-hd-primary-color { color: var(--hd-primary) !important; }
.has-hd-primary-background-color { background-color: var(--hd-primary) !important; }
.has-hd-ink-color { color: var(--hd-ink) !important; }
.has-hd-ink-background-color { background-color: var(--hd-ink) !important; }
.has-hd-accent-color { color: var(--hd-accent) !important; }
.has-hd-accent-background-color { background-color: var(--hd-accent) !important; }
.has-hd-sand-background-color { background-color: var(--hd-bg-alt) !important; }

/* ---------- Key facts (destinations) ---------- */
.hd-facts { margin: 0 0 var(--hd-4); display: grid; gap: .1rem; }
.hd-facts dt {
  font-size: var(--hd-fs-xs);
  text-transform: uppercase;
  letter-spacing: .08em;
  color: var(--hd-muted);
  font-weight: 700;
  margin-top: .85rem;
}
.hd-facts dt:first-child { margin-top: 0; }
.hd-facts dd { margin: .15rem 0 0; font-size: var(--hd-fs-sm); color: var(--hd-text); }

.hd-seva-disclaimer {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  margin: var(--hd-6) 0 0;
  font-size: var(--hd-fs-xs);
  color: var(--hd-muted);
  text-align: center;
}
.hd-seva-disclaimer svg { color: var(--hd-primary); flex: none; }

.hd-brand__logo { max-height: 50px; width: auto; object-fit: contain; }
.hd-footer .hd-brand__logo { filter: brightness(0) invert(1); opacity: .95; }

/* ==========================================================================
   15. UTILITIES, MOTION, PRINT
   ========================================================================== */
.hd-mt-0 { margin-top: 0 !important; }
.hd-mb-0 { margin-bottom: 0 !important; }
.hd-center { text-align: center; }
.hd-flex-center { display: flex; justify-content: center; }
.hd-muted { color: var(--hd-muted); }
.hd-hide-mobile { }
@media (max-width: 720px) { .hd-hide-mobile { display: none !important; } }

/* Scroll reveal (progressive — content is visible if JS is off) */
.hd-reveal { opacity: 0; transform: translateY(18px); }
.js .hd-reveal { transition: opacity .6s var(--hd-ease), transform .6s var(--hd-ease); }
.hd-reveal.is-in { opacity: 1; transform: none; }
.no-js .hd-reveal { opacity: 1; transform: none; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
  .hd-reveal { opacity: 1 !important; transform: none !important; }
}

@media print {
  .hd-header, .hd-topbar, .hd-footer, .hd-article-aside, .hd-share,
  .hd-totop, .hd-sticky-cta, .hd-prevnext, .hd-comments, .hd-progress,
  .hd-drawer, .hd-search-overlay { display: none !important; }
  body { font-size: 11pt; color: #000; }
  .hd-article-layout { grid-template-columns: 1fr; padding: 0; }
  a[href]::after { content: " (" attr(href) ")"; font-size: 9pt; color: #555; }
  .hd-prose { max-width: none; }
}