/* ============================================================
   PAGE INSPIRATION — Verdant Nest
   Loaded for: is_post_type_archive('inspiration')
            || is_singular('inspiration')
   Archive classes: .insp-*, .editorial-*, .feature-*, .te-*, .insp-nl
   Single classes:  .si-*   (body.single-inspiration scoped)
   ============================================================ */


/* ─────────────────────────────────────────────────────────────
   ARCHIVE PAGE STYLES  (unchanged)
   ───────────────────────────────────────────────────────────── */

.insp-hero { padding: 88px var(--pad-x) 64px; background: var(--bg2); }
.insp-hero-inner { max-width: var(--max-w); margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: end; }
.ih-h { font-family: var(--serif); font-size: clamp(42px, 6vw, 82px); font-weight: 300; color: var(--coal); line-height: 1.01; }
.ih-p { font-size: 15px; color: var(--ink2); line-height: 1.85; font-weight: 300; margin-bottom: 28px; max-width: 420px; }

/* EDITORIAL GRID */
.editorial-section { padding: var(--pad-section) 0; background: var(--bg); }
.editorial-wrap { max-width: var(--max-w); margin: 0 auto; padding: 0 var(--pad-x); }
.editorial-grid { columns: 3; column-gap: 16px; }
.ed-item { break-inside: avoid; margin-bottom: 16px; overflow: hidden; cursor: pointer; position: relative; display: block; }
.ed-item-bg { width: 100%; display: block; transition: transform .85s var(--ease); }
.ed-item:hover .ed-item-bg { transform: scale(1.04); }
.ed-1  { aspect-ratio: 3/4;   background: linear-gradient(155deg,#C4BCA4,#9A9070,#6A6250); }
.ed-2  { aspect-ratio: 4/3;   background: linear-gradient(155deg,#A8C4B0,#78987C,#507060); }
.ed-3  { aspect-ratio: 2/3;   background: linear-gradient(155deg,#1A2416,#0E180C,#060E04); }
.ed-4  { aspect-ratio: 1/1;   background: linear-gradient(155deg,#C8C09A,#A09868,#787040); }
.ed-5  { aspect-ratio: 3/4;   background: linear-gradient(155deg,#9AB8C4,#688898,#466878); }
.ed-6  { aspect-ratio: 4/5;   background: linear-gradient(155deg,#D0C4A8,#A09878,#786858); }
.ed-7  { aspect-ratio: 4/3;   background: linear-gradient(155deg,#B4ACBE,#847698,#5E5878); }
.ed-8  { aspect-ratio: 3/4;   background: linear-gradient(155deg,#B0C4A8,#82987C,#587458); }
.ed-9  { aspect-ratio: 2/3;   background: linear-gradient(155deg,#C8B89E,#A49070,#786A50); }
.ed-10 { aspect-ratio: 1/1;   background: linear-gradient(155deg,#A4BEB0,#70927A,#487060); }
.ed-11 { aspect-ratio: 4/3;   background: linear-gradient(155deg,#2A3820,#1C2818,#0E1A0C); }
.ed-12 { aspect-ratio: 3/4;   background: linear-gradient(155deg,#CCC4A8,#A09878,#786858); }
.ed-overlay { position: absolute; inset: 0; background: rgba(14,12,10,0); transition: background .35s; display: flex; align-items: flex-end; padding: 20px; }
.ed-item:hover .ed-overlay { background: rgba(14,12,10,.45); }
.ed-tag { font-size: 10.5px; letter-spacing: .15em; text-transform: uppercase; color: rgba(240,237,232,.9); opacity: 0; transition: opacity .3s; font-weight: 500; }
.ed-item:hover .ed-tag { opacity: 1; }

/* FEATURES EDITORIAL */
.feature-editorial { padding: var(--pad-section) 0; background: var(--bg2); }
.fe-wrap { max-width: var(--max-w); margin: 0 auto; padding: 0 var(--pad-x); }
.fe-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; margin-bottom: 4px; }
.fe-item { overflow: hidden; position: relative; }
.fe-item-bg { width: 100%; height: 100%; transition: transform .85s var(--ease); }
.fe-item:hover .fe-item-bg { transform: scale(1.04); }
.fe-big { aspect-ratio: 4/3; }
.fe-sm { aspect-ratio: 1/1; }
.fe-tall-grid { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 4px; }
.fe-tall { aspect-ratio: 3/4; overflow: hidden; position: relative; }
.fe-tall-bg { width: 100%; height: 100%; transition: transform .85s var(--ease); }
.fe-tall:hover .fe-tall-bg { transform: scale(1.04); }
.fa{background:linear-gradient(145deg,#1C2816,#121E0E,#0A140A)}
.fb{background:linear-gradient(145deg,#C4BCA4,#9A9070,#6A6250)}
.fc{background:linear-gradient(145deg,#A4BEBA,#70928A,#4A7068)}
.fd{background:linear-gradient(145deg,#D0C8B0,#A09878,#786858)}
.fe{background:linear-gradient(145deg,#B8ADC0,#887898,#605878)}
.ff{background:linear-gradient(145deg,#B4C4AC,#869880,#5C7460)}
.fe-caption { position: absolute; bottom: 0; left: 0; right: 0; padding: 24px; background: linear-gradient(transparent, rgba(12,10,8,.65)); }
.fe-caption-label { font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: rgba(240,237,232,.85); }

/* TIPS EDITORIAL */
.tips-editorial { padding: var(--pad-section) 0; background: var(--bg); }
.te-wrap { max-width: var(--max-w); margin: 0 auto; padding: 0 var(--pad-x); }
.te-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 48px; }
.te-item { border-top: 1px solid var(--border); padding-top: 28px; }
.te-issue { font-size: 11px; letter-spacing: .18em; text-transform: uppercase; color: var(--stone); margin-bottom: 16px; }
.te-h { font-family: var(--serif); font-size: 22px; font-weight: 300; color: var(--coal); line-height: 1.25; margin-bottom: 14px; }
.te-p { font-size: 13.5px; color: var(--ink2); line-height: 1.78; font-weight: 300; margin-bottom: 20px; }

/* NEWSLETTER */
.insp-nl { background: var(--coal); padding: 88px var(--pad-x); text-align: center; }
.insp-nl h2 { font-family: var(--serif); font-size: clamp(32px,4vw,56px); font-weight: 300; color: var(--white); margin-bottom: 14px; }
.insp-nl p { font-size: 14px; color: rgba(240,237,232,.5); margin-bottom: 36px; font-weight: 300; }
.nl-form { display: flex; max-width: 440px; margin: 0 auto; }
.nl-input { flex: 1; background: transparent; border: 1px solid rgba(240,237,232,.22); border-right: none; color: var(--white); font-family: var(--sans); font-size: 14px; padding: 14px 20px; outline: none; transition: border-color .3s; }
.nl-input:focus { border-color: rgba(240,237,232,.55); }
.nl-input::placeholder { color: rgba(240,237,232,.28); }
.nl-btn { padding: 14px 24px; background: var(--white); color: var(--coal); font-family: var(--sans); font-size: 11px; font-weight: 500; letter-spacing: .14em; text-transform: uppercase; border: none; cursor: pointer; transition: background .3s; white-space: nowrap; }

/* Archive responsive */
@media (max-width: 960px) {
  .insp-hero-inner { grid-template-columns: 1fr; gap: 36px; }
  .editorial-grid { columns: 2; }
  .fe-grid { grid-template-columns: 1fr; }
  .fe-tall-grid { grid-template-columns: 1fr 1fr; }
  .te-grid { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
  .editorial-grid { columns: 1; }
  .fe-tall-grid { grid-template-columns: 1fr; }
}


/* ─────────────────────────────────────────────────────────────
   SINGLE INSPIRATION DETAIL PAGE  —  si-* namespace
   Scoped to: body.single-inspiration
   ───────────────────────────────────────────────────────────── */

/* ══ DESIGN TOKENS ══════════════════════════════════════════════════════ */
body.single-inspiration {
  background: #f5f2ec;
  --si-bg:        #f5f2ec;
  --si-bg-alt:    #ece9e2;
  --si-bg-card:   #e4e0d7;
  --si-ink:       #46413c;          /* rich warm dark for headings */
  --si-body:      #5a5550;          /* deepened for reading grip */
  --si-meta:      #8a8378;
  --si-border:    rgba(93, 88, 79, 0.10);
  --si-border-m:  rgba(93, 88, 79, 0.20);
  --si-olive:     #7a7a5a;
  --si-max:       1280px;
  --si-article-w: 760px;
  --si-pad:       60px;
}

/* ══ SHARED WRAPPERS ════════════════════════════════════════════════════ */
.si-outer,
.si-intro-wrap {
  /* Both use the full 1280px outer so the left title column breathes */
  max-width: var(--si-max);
  margin-left:  auto;
  margin-right: auto;
  padding-left:  var(--si-pad);
  padding-right: var(--si-pad);
}

/* ══ HERO ════════════════════════════════════════════════════════════════ */
.si-hero {
  position: relative;
  overflow: hidden;
  background: #2a2722;
  height: clamp(460px, 54vh, 640px);
}
.si-hero-frame { position: absolute; inset: 0; line-height: 0; }
.si-hero-img {
  width: 100%; height: 100%;
  object-fit: cover; object-position: center 30%;
  display: block;
}
/* Restrained veil — touches only the bottom edge */
.si-hero-veil {
  position: absolute; bottom: 0; left: 0; right: 0;
  height: 100px;
  background: linear-gradient(to bottom, transparent 0%, rgba(245,242,236,0.65) 65%, #f5f2ec 100%);
  pointer-events: none;
}
.si-hero-placeholder {
  position: absolute; inset: 0;
  background: linear-gradient(155deg, #d8d2c4, #b0a890, #7a7260);
}

/* ══ INTRO ═══════════════════════════════════════════════════════════════ */
.si-intro {
  background: var(--si-bg);
  padding-top: 60px;
  padding-bottom: 80px;
}

.si-crumb {
  display: flex; align-items: center; flex-wrap: wrap; gap: 8px 12px;
  font-family: var(--sans); font-size: 11px; font-weight: 400;
  letter-spacing: 0.05em; color: var(--si-meta);
  margin-bottom: 52px;
}
.si-crumb a { color: var(--si-meta); text-decoration: none; transition: color 0.2s; }
.si-crumb a:hover { color: var(--si-ink); }
.si-crumb-sep { opacity: 0.4; font-size: 9px; margin: 0 -2px; }

/* Wide grid: left column gets ~740-800px at full width */
.si-intro-grid {
  display: grid;
  grid-template-columns: 1fr 296px;
  gap: 56px;
  align-items: start;
}

.si-intro-left { padding-right: 8px; }

.si-kicker {
  display: flex; align-items: center; gap: 14px;
  font-family: var(--sans); font-size: 10px; font-weight: 500;
  letter-spacing: 0.22em; text-transform: uppercase; color: var(--si-meta);
  margin: 0 0 24px;
}
.si-kicker-accent {
  display: block; width: 26px; height: 1px;
  background: var(--si-meta); flex-shrink: 0;
}

.si-title {
  font-family: var(--serif) !important;
  font-size: clamp(40px, 5vw, 72px) !important;
  font-weight: 300 !important;
  line-height: 1.02 !important;
  letter-spacing: -0.018em !important;
  color: var(--si-ink) !important;
  margin: 0 0 28px !important;
}

.si-teaser {
  font-family: var(--sans); font-size: 16px; font-weight: 300;
  line-height: 1.88; color: var(--si-body); margin: 0;
  max-width: 580px;
}

/* Right meta card */
.si-intro-right { padding-top: 8px; }

.si-meta-card {
  background: var(--si-bg-alt);
  border: 1px solid var(--si-border-m);
  padding: 28px 30px;
}

.si-meta-row {
  display: flex; align-items: baseline;
  justify-content: space-between; gap: 16px;
  padding: 14px 0;
  border-bottom: 1px solid var(--si-border);
}
.si-meta-row:first-child { padding-top: 0; }
.si-meta-row:last-child  { padding-bottom: 0; border-bottom: none; }

.si-meta-key {
  font-family: var(--sans); font-size: 9px; font-weight: 500;
  letter-spacing: 0.2em; text-transform: uppercase;
  color: var(--si-meta); flex-shrink: 0;
}
.si-meta-val {
  font-family: var(--serif); font-size: 15.5px; font-weight: 300;
  color: var(--si-ink); line-height: 1.3; text-align: right;
}

.si-meta-row--tags { align-items: flex-start; }
.si-meta-tags { display: flex; flex-wrap: wrap; gap: 5px; justify-content: flex-end; }
.si-meta-tag {
  display: inline-block; font-family: var(--sans); font-size: 9.5px; font-weight: 400;
  letter-spacing: 0.1em; text-transform: uppercase; color: var(--si-body);
  border: 1px solid var(--si-border-m); padding: 4px 10px; background: var(--si-bg);
}

/* ══ ARTICLE BODY ════════════════════════════════════════════════════════ */
.si-article {
  background: var(--si-bg);
  padding-top: 72px;
  padding-bottom: 96px;
}

.si-article-body {
  max-width: var(--si-article-w);
  margin-left: auto; margin-right: auto;
  padding-left: var(--si-pad); padding-right: var(--si-pad);
}

.si-article-body p {
  font-family: var(--sans); font-size: 17.5px; font-weight: 300;
  line-height: 1.92; color: var(--si-body); margin: 0 0 28px;
}
/* Serif intro paragraph */
.si-article-body > p:first-child,
.si-article-body p:first-of-type {
  font-family: var(--serif); font-size: 21px; font-weight: 300;
  line-height: 1.62; color: var(--si-ink); margin-bottom: 36px;
}

.si-article-body h2 {
  font-family: var(--serif) !important; font-size: clamp(24px,2.4vw,30px) !important;
  font-weight: 300 !important; line-height: 1.2 !important;
  color: var(--si-ink) !important; margin: 56px 0 18px !important;
  letter-spacing: -0.01em !important;
}
.si-article-body h3 {
  font-family: var(--serif) !important; font-size: clamp(20px,2vw,24px) !important;
  font-weight: 400 !important; line-height: 1.25 !important;
  color: var(--si-ink) !important; margin: 44px 0 14px !important;
}
.si-article-body ul,
.si-article-body ol {
  font-family: var(--sans); font-size: 16.5px; font-weight: 300;
  line-height: 1.85; color: var(--si-body); padding-left: 22px; margin: 0 0 28px;
}
.si-article-body ul { list-style: disc; }
.si-article-body ol { list-style: decimal; }
.si-article-body li { margin-bottom: 8px; }

.si-article-body blockquote {
  border-left: 2px solid var(--si-border-m); padding: 4px 0 4px 28px; margin: 44px 0;
}
.si-article-body blockquote p {
  font-family: var(--serif); font-size: 20px; font-style: italic;
  line-height: 1.65; color: var(--si-ink); margin: 0;
}
.si-article-body img  { width: 100%; height: auto; display: block; margin: 40px 0; }
.si-article-body hr   { border: none; border-top: 1px solid var(--si-border-m); margin: 52px 0; }
.si-article-body strong { font-weight: 500; color: var(--si-ink); }
.si-article-body em     { font-style: italic; }
.si-article-body a      { color: var(--si-olive); text-decoration: underline; text-underline-offset: 3px; }

/* ══ SHARED SECTION HEADER ══════════════════════════════════════════════ */
.si-section-label {
  display: block; font-family: var(--sans); font-size: 10px; font-weight: 500;
  letter-spacing: 0.22em; text-transform: uppercase; color: var(--si-meta);
  margin-bottom: 12px;
}
.si-section-head { margin-bottom: 48px; }
.si-section-title {
  font-family: var(--serif) !important; font-size: clamp(30px,3vw,44px) !important;
  font-weight: 300 !important; line-height: 1.08 !important;
  letter-spacing: -0.01em !important; color: var(--si-ink) !important; margin: 0 !important;
}

/* ══ GALLERY ════════════════════════════════════════════════════════════
   PHP only renders this section when gallery array has items.
   If gallery is empty the entire <section> is suppressed.
   ══════════════════════════════════════════════════════════════════════ */
.si-gallery {
  background: var(--si-bg-alt);
  padding: 80px 0 88px;
}
.si-gallery-head {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 36px;
}
.si-gallery-count {
  font-family: var(--sans); font-size: 11px; letter-spacing: 0.08em; color: var(--si-meta);
}

/* Single */
.si-gal-solo { display: block; overflow: hidden; cursor: zoom-in; line-height: 0; }
.si-gal-solo img {
  width: 100%; aspect-ratio: 16/9; object-fit: cover; display: block;
  transition: transform 0.9s var(--ease);
}
.si-gal-solo:hover img { transform: scale(1.02); }

/* Duo — both cells always fill */
.si-gal-duo { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.si-gal-duo-item {
  display: block; overflow: hidden; cursor: zoom-in; line-height: 0;
  background: var(--si-bg-card);       /* visible if image fails to load */
}
.si-gal-duo-item img {
  width: 100%; aspect-ratio: 4/5; object-fit: cover; display: block;
  transition: transform 0.9s var(--ease);
}
.si-gal-duo-item:hover img { transform: scale(1.03); }

/* Editorial split (3+) */
.si-gal-editorial {
  display: grid; grid-template-columns: 1.1fr 1fr; gap: 6px;
}
.si-gal-feature {
  grid-row: 1/3; display: block; overflow: hidden; cursor: zoom-in;
  line-height: 0; background: var(--si-bg-card);
}
.si-gal-feature img {
  width: 100%; height: 100%; min-height: 480px; object-fit: cover; display: block;
  transition: transform 0.9s var(--ease);
}
.si-gal-feature:hover img { transform: scale(1.025); }
.si-gal-stack {
  display: grid; grid-template-columns: 1fr 1fr; gap: 6px; align-content: start;
}
.si-gal-thumb {
  display: block; overflow: hidden; cursor: zoom-in; position: relative;
  line-height: 0; background: var(--si-bg-card);
}
.si-gal-thumb img {
  width: 100%; aspect-ratio: 4/3; object-fit: cover; display: block;
  transition: transform 0.85s var(--ease);
}
.si-gal-thumb:hover img { transform: scale(1.04); }
.si-gal-thumb.has-more::after {
  content: attr(data-more); position: absolute; inset: 0;
  background: rgba(28,24,20,0.58); color: #f5f2ec;
  font-family: var(--serif); font-size: 32px; font-weight: 300; letter-spacing: 0.02em;
  display: flex; align-items: center; justify-content: center; transition: background 0.3s;
}
.si-gal-thumb.has-more:hover::after { background: rgba(28,24,20,0.4); }
.si-gal-hidden {
  position: absolute; opacity: 0; pointer-events: none; width: 0; height: 0; overflow: hidden;
}

/* Lightbox */
.vn-lightbox {
  display: none; position: fixed; inset: 0;
  background: rgba(18,15,12,0.97); z-index: 9999;
  align-items: center; justify-content: center;
}
.vn-lightbox.is-open { display: flex; }
.vn-lightbox-img { max-width: 88vw; max-height: 88vh; object-fit: contain; display: block; }
.vn-lightbox-close,
.vn-lightbox-nav {
  position: absolute; background: none;
  border: 1px solid rgba(245,242,236,0.18); color: rgba(245,242,236,0.72);
  cursor: pointer; border-radius: 50%; width: 46px; height: 46px;
  display: flex; align-items: center; justify-content: center;
  font-size: 18px; line-height: 1; font-family: var(--sans);
  transition: border-color 0.25s, background 0.25s, color 0.25s;
}
.vn-lightbox-close { top: 28px; right: 28px; font-size: 22px; }
.vn-lightbox-close:hover,
.vn-lightbox-nav:hover {
  background: rgba(245,242,236,0.1); border-color: rgba(245,242,236,0.45); color: #f5f2ec;
}
.vn-lb-prev { left: 28px;  top: 50%; transform: translateY(-50%); }
.vn-lb-next { right: 28px; top: 50%; transform: translateY(-50%); }

/* ══ FEATURED PRODUCTS / GET THE LOOK ══════════════════════════════════
   Product grid if products linked; editorial CTA cards otherwise.
   Section always renders. If both products and fallback are absent
   the PHP suppresses the section entirely.
   ══════════════════════════════════════════════════════════════════════ */
.si-products {
  background: var(--si-bg);
  padding: 80px 0 96px;
  border-top: 1px solid var(--si-border);
}
.si-prod-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 24px; }
.si-prod-grid .prod-card-img        { aspect-ratio: 3/4; }
.si-prod-grid .prod-card-img-inner  { width: 100%; height: 100%; }

.si-cta-row { display: grid; grid-template-columns: repeat(3,1fr); gap: 2px; }
.si-cta-card {
  background: var(--si-bg-alt); padding: 44px 40px 48px;
  display: flex; flex-direction: column; align-items: flex-start;
  transition: background 0.3s;
}
.si-cta-card:hover { background: var(--si-bg-card); }
.si-cta-icon { color: var(--si-meta); margin-bottom: 24px; line-height: 0; }
.si-cta-icon svg { display: block; }
.si-cta-h {
  font-family: var(--serif) !important; font-size: 22px !important;
  font-weight: 300 !important; line-height: 1.2 !important;
  color: var(--si-ink) !important; margin: 0 0 12px !important;
}
.si-cta-p {
  font-family: var(--sans); font-size: 14px; font-weight: 300;
  line-height: 1.82; color: var(--si-body); margin: 0 0 28px; flex-grow: 1;
}
.si-cta-link {
  font-family: var(--sans); font-size: 10px; font-weight: 500;
  letter-spacing: 0.18em; text-transform: uppercase; color: var(--si-ink);
  text-decoration: none; border-bottom: 1px solid var(--si-border-m);
  padding-bottom: 4px; transition: border-color 0.25s, color 0.25s;
}
.si-cta-link:hover { color: var(--si-olive); border-color: var(--si-olive); }

/* ══ RELATED INSPIRATION ════════════════════════════════════════════════
   Entire section suppressed by PHP when no related posts found.
   ══════════════════════════════════════════════════════════════════════ */
.si-related {
  background: var(--si-bg-alt);
  padding: 80px 0 88px;
  border-top: 1px solid var(--si-border);
}
.si-rel-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 2px; }
.si-rel-item { display: block; text-decoration: none; color: inherit; overflow: hidden; }
.si-rel-img  { overflow: hidden; aspect-ratio: 4/5; background: var(--si-bg-card); line-height: 0; }
.si-rel-img img {
  width: 100%; height: 100%; object-fit: cover; display: block;
  transition: transform 0.9s var(--ease);
}
.si-rel-item:hover .si-rel-img img { transform: scale(1.04); }
.si-rel-placeholder { width: 100%; height: 100%; background: linear-gradient(155deg,#ccc5b0,#a09878,#7a7060); }
.si-rel-body { padding: 22px 0 26px; border-bottom: 1px solid var(--si-border); }
.si-rel-kicker {
  display: block; font-family: var(--sans); font-size: 9.5px; font-weight: 500;
  letter-spacing: 0.2em; text-transform: uppercase; color: var(--si-meta); margin-bottom: 10px;
}
.si-rel-title {
  font-family: var(--serif) !important; font-size: clamp(19px,1.8vw,24px) !important;
  font-weight: 300 !important; line-height: 1.2 !important;
  color: var(--si-ink) !important; margin: 0 0 12px !important; transition: color 0.2s;
}
.si-rel-item:hover .si-rel-title { color: var(--si-olive) !important; }
.si-rel-cta {
  font-family: var(--sans); font-size: 10px; font-weight: 500;
  letter-spacing: 0.14em; text-transform: uppercase; color: var(--si-meta);
  display: inline-block; transition: color 0.2s, letter-spacing 0.3s;
}
.si-rel-item:hover .si-rel-cta { color: var(--si-ink); letter-spacing: 0.2em; }

/* ══ FOOTER NAVIGATION ══════════════════════════════════════════════════ */
.si-footer-nav { background: var(--si-bg); border-top: 1px solid var(--si-border); padding: 38px 0; }
.si-footer-nav-inner { display: flex; align-items: center; gap: 28px; }
.si-nav-back,
.si-nav-shop {
  font-family: var(--sans); font-size: 10.5px; font-weight: 500;
  letter-spacing: 0.17em; text-transform: uppercase; color: var(--si-body);
  text-decoration: none; display: inline-flex; align-items: center; gap: 10px;
  transition: color 0.2s, gap 0.3s;
}
.si-nav-back:hover,
.si-nav-shop:hover { color: var(--si-ink); gap: 14px; }
.si-nav-dot {
  display: block; width: 3px; height: 3px; border-radius: 50%;
  background: var(--si-border-m); flex-shrink: 0;
}
.si-nav-shop { margin-left: auto; }
.si-nav-arrow { font-size: 13px; }

/* ══ RESPONSIVE ═════════════════════════════════════════════════════════ */
@media (max-width: 1100px) {
  body.single-inspiration { --si-pad: 48px; }
  .si-intro-grid { grid-template-columns: 1fr 268px; gap: 48px; }
}
@media (max-width: 900px) {
  body.single-inspiration { --si-pad: 36px; }
  .si-hero { height: clamp(360px,46vh,500px); }
  .si-intro-grid { grid-template-columns: 1fr; gap: 40px; }
  .si-intro-right { max-width: 480px; }
  .si-prod-grid { grid-template-columns: repeat(2,1fr); gap: 16px; }
  .si-cta-row   { grid-template-columns: 1fr; gap: 2px; }
  .si-gal-editorial { grid-template-columns: 1fr; }
  .si-gal-feature   { grid-row: auto; }
  .si-gal-feature img { min-height: auto; aspect-ratio: 16/9; height: auto; }
  .si-gal-stack { grid-template-columns: repeat(4,1fr); }
  .si-rel-grid  { grid-template-columns: repeat(2,1fr); }
}
@media (max-width: 640px) {
  body.single-inspiration { --si-pad: 22px; }
  .si-hero { height: clamp(260px,50vw,420px); }
  .si-hero-veil { height: 80px; }
  .si-intro { padding-top: 44px; padding-bottom: 60px; }
  .si-crumb { margin-bottom: 32px; }
  .si-intro-right { max-width: 100%; }
  .si-meta-card { padding: 22px 22px; }
  .si-article { padding-top: 56px; padding-bottom: 72px; }
  .si-article-body > p:first-child,
  .si-article-body p:first-of-type { font-size: 18.5px; }
  .si-article-body p { font-size: 16px; }
  .si-gallery { padding: 60px 0 68px; }
  .si-gal-duo { grid-template-columns: 1fr; }
  .si-gal-duo-item img { aspect-ratio: 16/10; }
  .si-gal-stack { grid-template-columns: 1fr 1fr; }
  .si-products { padding: 60px 0 68px; }
  .si-prod-grid { grid-template-columns: 1fr 1fr; gap: 12px; }
  .si-cta-card  { padding: 32px 24px 38px; }
  .si-related { padding: 60px 0 68px; }
  .si-rel-grid { grid-template-columns: 1fr; }
  .si-footer-nav-inner { flex-direction: column; align-items: flex-start; gap: 18px; }
  .si-nav-shop { margin-left: 0; }
  .si-nav-dot  { display: none; }
}
@media (max-width: 420px) {
  .si-prod-grid { grid-template-columns: 1fr; }
  .si-gal-stack { grid-template-columns: 1fr 1fr; }
}
