/* SivoLock page styles v2.0 (October 17, 2026)
   One stylesheet for all revised pages. Every rule is scoped under .sl-page, no !important,
   so pages render the same standalone or inside a WordPress theme.
   Look: dark steel, brass accent, Georgia headings, Inter body (self-hosted in assets/fonts). */

/* ---------- Fonts (Inter, SIL Open Font License; Latin subset) ---------- */
@font-face { font-family: "SL Inter"; font-style: normal; font-weight: 400; font-display: swap; src: local("Inter Regular"), local("Inter-Regular"), url("fonts/Inter-Regular.woff") format("woff"); }
@font-face { font-family: "SL Inter"; font-style: normal; font-weight: 500; font-display: swap; src: local("Inter Medium"), local("Inter-Medium"), url("fonts/Inter-Medium.woff") format("woff"); }
@font-face { font-family: "SL Inter"; font-style: normal; font-weight: 600; font-display: swap; src: local("Inter SemiBold"), local("Inter-SemiBold"), url("fonts/Inter-SemiBold.woff") format("woff"); }
@font-face { font-family: "SL Inter"; font-style: normal; font-weight: 700; font-display: swap; src: local("Inter Bold"), local("Inter-Bold"), url("fonts/Inter-Bold.woff") format("woff"); }

/* ---------- Tokens ---------- */
.sl-page {
  --sl-bg-0: #050606;
  --sl-bg-1: #0a0c0c;
  --sl-bg-2: #111312;
  --sl-bg-3: #181a19;
  --sl-text: #f6f1e8;
  --sl-text-2: #c1b9aa;
  --sl-text-3: #9a958c;
  --sl-accent: #b88a4a;
  --sl-accent-2: #d0a35d;
  --sl-line: rgba(255, 255, 255, .12);
  --sl-line-2: rgba(255, 255, 255, .07);
  --sl-line-accent: rgba(184, 138, 74, .45);
  --sl-max: 1200px;
  --sl-measure: 68ch;
  --sl-pad: 18px;                          /* inner padding of the container */
  --sl-edge: clamp(20px, 4vw, 48px);       /* outer margin, same as the site header */
  --sl-display: Georgia, "Times New Roman", serif;
  --sl-body: "SL Inter", Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --sl-space-s: clamp(44px, 5vw, 64px);    /* short text sections */
  --sl-space-m: clamp(56px, 6vw, 88px);    /* standard sections */
  --sl-space-l: clamp(64px, 7vw, 104px);   /* feature sections: cards, galleries, figures */

  background: var(--sl-bg-0);
  color: var(--sl-text-2);
  font-family: var(--sl-body);
  font-size: 16px;
  font-weight: 400;
  line-height: 1.65;
  letter-spacing: 0;
  text-align: left;
  -webkit-font-smoothing: antialiased;
}
@media (min-width: 1201px) { .sl-page { --sl-pad: 32px; } }
@media (max-width: 640px) { .sl-page { --sl-pad: 0px; --sl-edge: 20px; } }
.sl-page *, .sl-page *::before, .sl-page *::after { box-sizing: border-box; }
/* Break out of the WordPress "constrained" content width; the page sets its own container */
div.sl-page.alignfull { width: 100%; max-width: none; margin-left: 0; margin-right: 0; }

/* ---------- Typography ---------- */
.sl-page h1, .sl-page h2, .sl-page h3 { margin: 0; color: var(--sl-text); letter-spacing: 0; text-transform: none; }
.sl-page h1 { font-family: var(--sl-display); font-weight: 400; font-size: clamp(30px, 3.4vw, 50px); line-height: 1.08; max-width: 24ch; }
.sl-page h2 { font-family: var(--sl-display); font-weight: 400; font-size: clamp(27px, 2.7vw, 40px); line-height: 1.14; max-width: 28ch; }
.sl-page h3 { font-family: var(--sl-body); font-weight: 600; font-size: 18px; line-height: 1.35; }
.sl-page p, .sl-page li { margin: 0; color: var(--sl-text-2); font-family: var(--sl-body); font-size: 16px; font-weight: 400; line-height: 1.65; }
.sl-page p + p { margin-top: 14px; }
.sl-page strong { color: var(--sl-text); font-weight: 600; }
.sl-page em { font-style: italic; }
.sl-page a { color: var(--sl-accent-2); text-decoration: none; border-bottom: 1px solid transparent; transition: color .15s, border-color .15s; }
.sl-page a:hover { color: var(--sl-text); border-bottom-color: var(--sl-accent); }
.sl-page a:focus-visible, .sl-page summary:focus-visible { outline: 2px solid var(--sl-accent-2); outline-offset: 3px; }
.sl-page .sl-kicker { display: block; margin: 0 0 14px; color: var(--sl-accent); font-family: var(--sl-body); font-size: 12px; font-weight: 700; line-height: 1.4; letter-spacing: .12em; text-transform: uppercase; }
.sl-page .sl-lead { font-size: 18px; line-height: 1.6; max-width: var(--sl-measure); }
.sl-page .sl-note { font-size: 13px; color: var(--sl-text-3); }

/* ---------- Container and sections ---------- */
.sl-wrap { width: min(var(--sl-max), calc(100% - 2 * var(--sl-edge))); margin: 0 auto; padding: 0 var(--sl-pad); }
.sl-section { padding: var(--sl-space-m) 0; border-top: 1px solid var(--sl-line-2); }
.sl-section.sl-space-s { padding: var(--sl-space-s) 0; }
.sl-section.sl-space-l { padding: var(--sl-space-l) 0; }
.sl-section.sl-bg-0 { background: var(--sl-bg-0); }
.sl-section.sl-bg-1 { background: var(--sl-bg-1); }
.sl-section.sl-bg-2 { background: var(--sl-bg-2); }
.sl-head { margin-bottom: 28px; }
.sl-page .sl-head h2 + .sl-prose { margin-top: 18px; }
.sl-prose { max-width: var(--sl-measure); }
.sl-page .sl-prose > * + * { margin-top: 14px; }
.sl-page .sl-prose > .sl-buttons, .sl-page .sl-prose > .sl-links { margin-top: 22px; }
.sl-page .sl-stack > * + * { margin-top: 28px; }
.sl-page .sl-stack > p, .sl-page .sl-stack > ul, .sl-page .sl-stack > ol { max-width: var(--sl-measure); }

.sl-split { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: clamp(32px, 5vw, 72px); align-items: start; }
.sl-split > .sl-figure { position: sticky; top: 130px; }
.sl-split-head { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); }
.sl-split-head .sl-head { margin-bottom: 0; }

/* ---------- Lists ---------- */
.sl-page ul.sl-list, .sl-page ul.sl-points { list-style: none; margin: 0; padding: 0; }
.sl-page ul.sl-list li, .sl-page ul.sl-points li { position: relative; padding-left: 20px; }
.sl-page ul.sl-list li + li { margin-top: 10px; }
.sl-page ul.sl-list li::before, .sl-page ul.sl-points li::before { content: ""; position: absolute; left: 0; top: .62em; width: 7px; height: 7px; background: var(--sl-accent); }
.sl-page ol.sl-list { margin: 0; padding-left: 22px; }
.sl-page ol.sl-list li + li { margin-top: 10px; }
.sl-page ol.sl-list li::marker { color: var(--sl-accent); font-weight: 700; }
.sl-page .sl-prose > ul.sl-list:not(:first-child), .sl-page .sl-prose > ol.sl-list:not(:first-child) { margin-top: 14px; }

/* ---------- Buttons and text links ---------- */
.sl-buttons { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 20px; margin-top: 28px; }
.sl-page a.sl-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 46px; padding: 12px 22px; border: 1px solid var(--sl-line); border-radius: 2px; background: transparent; color: var(--sl-text); font-family: var(--sl-body); font-size: 14px; font-weight: 600; line-height: 1.2; letter-spacing: .01em; }
.sl-page a.sl-btn:hover { border-color: var(--sl-accent); color: var(--sl-text); }
.sl-page a.sl-btn-primary { background: var(--sl-accent); border-color: var(--sl-accent); color: #0b0d0e; }
.sl-page a.sl-btn-primary:hover { background: var(--sl-accent-2); border-color: var(--sl-accent-2); color: #0b0d0e; }
/* Supporting destinations are text links, not buttons */
.sl-links { display: flex; flex-wrap: wrap; gap: 10px 28px; }
.sl-page a.sl-link { display: inline-flex; align-items: center; gap: 8px; padding: 4px 0; font-size: 15px; font-weight: 600; color: var(--sl-accent-2); border-bottom: 0; }
.sl-page a.sl-link:hover { color: var(--sl-text); }
.sl-page a.sl-link .sl-arrow, .sl-page .sl-arrow { color: var(--sl-accent); transition: transform .2s; }
.sl-page a.sl-link:hover .sl-arrow { transform: translateX(4px); }

/* ---------- Hero ---------- */
.sl-hero { position: relative; overflow: hidden; padding: clamp(40px, 6vw, 72px) 0 clamp(44px, 6vw, 72px); background: radial-gradient(120% 90% at 85% 10%, #1a1c1b 0%, var(--sl-bg-0) 60%); border-top: 0; }
.sl-hero::before { content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .5; background-image: linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px); background-size: 64px 64px; -webkit-mask-image: radial-gradient(80% 70% at 75% 30%, #000 0%, transparent 75%); mask-image: radial-gradient(80% 70% at 75% 30%, #000 0%, transparent 75%); }
.sl-hero .sl-split { grid-template-columns: minmax(0, 1fr); }
.sl-page .sl-hero h1 { margin-bottom: 20px; }
.sl-page .sl-hero .sl-buttons { margin-top: 28px; }
.sl-page .sl-hero ul.sl-points { margin-top: 30px; display: grid; grid-template-columns: 1fr 1fr; gap: 10px 24px; padding: 20px 0 0; border-top: 1px solid var(--sl-line); }
.sl-page .sl-hero ul.sl-points li { font-size: 14px; line-height: 1.45; }
.sl-page .sl-hero .sl-split { gap: 32px; }
@media (min-width: 861px) {
  /* Full-width hero: the photo fills the whole band behind the text; a gradient keeps the text readable. */
  .sl-page .sl-hero { padding: 0; display: flex; align-items: center; min-height: clamp(400px, 52vh, 500px); }
  .sl-page .sl-hero.sl-hero-home { min-height: clamp(560px, 68vh, 720px); }
  .sl-page .sl-hero > .sl-wrap, .sl-page .sl-hero .sl-split { position: static; display: block; }
  .sl-page .sl-hero .sl-split > div:first-child { position: relative; z-index: 2; max-width: 640px; padding: clamp(48px, 5vw, 72px) 0; }
  .sl-page .sl-hero.sl-hero-home .sl-split > div:first-child { padding: clamp(56px, 7vw, 104px) 0; }
  .sl-page .sl-hero .sl-figure { position: absolute; inset: 0; z-index: 0; width: 100%; height: 100%; aspect-ratio: auto; margin: 0; border: 0; border-radius: 0; }
  .sl-page .sl-hero .sl-figure img { object-position: 65% 50%; }
  .sl-page .sl-hero::after { content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none; background: linear-gradient(90deg, rgba(5,6,6,.94) 0%, rgba(5,6,6,.86) 35%, rgba(5,6,6,.35) 70%, rgba(5,6,6,.15) 100%), linear-gradient(0deg, rgba(5,6,6,.55) 0%, rgba(5,6,6,0) 30%); }
  .sl-page .sl-hero::before { z-index: 1; }
  .sl-page .sl-hero .sl-figure .sl-ph { padding: 0 max(32px, calc((100% - 1200px) / 2 + 32px)) 28px 60%; }
}

/* ---------- Home hero: model lineup + proof figures (October 27) ---------- */
.sl-page .sl-hero-home .sl-lead { max-width: 34em; }
.sl-page .sl-hero-home ul.sl-hero-tags { display: flex; flex-wrap: wrap; gap: 8px; margin: 22px 0 0; padding: 0; list-style: none; }
.sl-page .sl-hero-home ul.sl-hero-tags li { margin: 0; padding: 6px 12px; border: 1px solid var(--sl-line-accent); border-radius: 999px; color: var(--sl-text); font-size: 13px; font-weight: 500; line-height: 1.2; }
.sl-page .sl-hero-home ul.sl-hero-tags li::before { display: none; }
.sl-page .sl-hero-home .sl-buttons { margin-top: 26px; }
.sl-page .sl-hero-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; margin: 34px 0 0; padding: 22px 0 0; border-top: 1px solid var(--sl-line); }
.sl-page .sl-hero-stats > div { padding: 0 18px; border-left: 1px solid var(--sl-line-2); }
.sl-page .sl-hero-stats > div:first-child { padding-left: 0; border-left: 0; }
.sl-page .sl-hero-stats dt { margin: 0; color: var(--sl-accent-2); font-family: var(--sl-display); font-size: clamp(24px, 2.3vw, 32px); font-weight: 400; line-height: 1.1; white-space: nowrap; }
.sl-page .sl-hero-stats dd { margin: 6px 0 0; color: var(--sl-text-3); font-size: 13px; line-height: 1.35; }
.sl-page .sl-hero-home .sl-hero-lineup picture, .sl-page .sl-hero-home .sl-hero-lineup img { display: block; width: 100%; height: 100%; }
.sl-page .sl-hero-home .sl-hero-lineup img { object-fit: cover; }
@media (min-width: 861px) {
  .sl-page .sl-hero.sl-hero-home { min-height: clamp(600px, 72vh, 760px); }
  .sl-page .sl-hero-home .sl-figure img { object-position: 100% 45%; }
  .sl-page .sl-hero-home .sl-split > div:first-child { max-width: 600px; }
  .sl-page .sl-hero.sl-hero-home::after { background: linear-gradient(90deg, rgba(5,6,6,.92) 0%, rgba(5,6,6,.75) 32%, rgba(5,6,6,0) 55%), linear-gradient(0deg, rgba(5,6,6,.5) 0%, rgba(5,6,6,0) 22%); }
}
@media (min-width: 861px) and (max-width: 1199px) {
  /* narrow desktop: text and lineup side by side instead of overlapping */
  .sl-page .sl-hero.sl-hero-home::after { display: none; }
  .sl-page .sl-hero-home > .sl-wrap { width: 100%; }
  .sl-page .sl-hero-home .sl-split { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: 32px; align-items: center; }
  .sl-page .sl-hero-home .sl-split > div:first-child { max-width: none; padding: 56px 0; }
  .sl-page .sl-hero-home .sl-figure.sl-hero-lineup { position: relative; inset: auto; height: auto; aspect-ratio: 1 / 1; border-radius: 4px; overflow: hidden; }
  .sl-page .sl-hero-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 18px; }
  .sl-page .sl-hero-stats > div:nth-child(3) { padding-left: 0; border-left: 0; }
}
@media (max-width: 860px) {
  /* phone and tablet: headline, then the lineup, then the rest */
  .sl-page .sl-hero-home .sl-split { display: flex; flex-direction: column; gap: 0; }
  .sl-page .sl-hero-home .sl-split > div:first-child { display: contents; }
  .sl-page .sl-hero-home .sl-kicker { order: 1; }
  .sl-page .sl-hero-home h1 { order: 2; }
  .sl-page .sl-hero-home .sl-hero-lineup { order: 3; margin: 4px 0 22px; aspect-ratio: 1 / 1; border: 0; border-radius: 4px; overflow: hidden; }
  .sl-page .sl-hero-home .sl-lead { order: 4; }
  .sl-page .sl-hero-home ul.sl-hero-tags { order: 5; }
  .sl-page .sl-hero-home .sl-buttons { order: 6; width: 100%; }
  .sl-page .sl-hero-home .sl-hero-stats { order: 7; width: 100%; grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 18px; }
  .sl-page .sl-hero-stats > div:nth-child(3) { padding-left: 0; border-left: 0; }
}

/* ---------- Certificate display (Quality Documents) ---------- */
.sl-page .sl-cert { display: grid; grid-template-columns: minmax(0, 340px) minmax(0, 1fr); gap: clamp(24px, 4vw, 56px); align-items: start; margin-top: 16px; }
.sl-page .sl-cert .sl-figure { background: #fff; }
.sl-page .sl-cert .sl-figure img { object-fit: contain; }
.sl-page .sl-cert .sl-prose h3 { margin-top: 0; }
@media (max-width: 640px) { .sl-page .sl-cert { grid-template-columns: minmax(0, 1fr); } .sl-page .sl-cert-figure { max-width: 340px; } }

.sl-page .sl-hero .sl-figure picture { display: block; width: 100%; height: 100%; }

/* ---------- Tables ---------- */
.sl-table-wrap { width: 100%; }
.sl-table-wrap.sl-table-narrow { max-width: 820px; }
.sl-page table.sl-table { width: 100%; border-collapse: collapse; border-spacing: 0; margin: 0; background: transparent; border: 0; }
.sl-page .sl-table th, .sl-page .sl-table td { padding: 14px 18px 14px 0; border: 0; border-bottom: 1px solid var(--sl-line-2); text-align: left; vertical-align: top; background: transparent; color: var(--sl-text-2); font-family: var(--sl-body); font-size: 15px; line-height: 1.5; font-weight: 400; }
.sl-page .sl-table th { padding-top: 0; color: var(--sl-text-3); font-size: 12px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; border-bottom-color: var(--sl-line); }
.sl-page .sl-table td:first-child { color: var(--sl-text); font-weight: 500; }
.sl-page .sl-table tr:hover td { background: rgba(255, 255, 255, .02); }

/* ---------- Model cards ---------- */
.sl-cards { display: grid; grid-template-columns: repeat(var(--cols, 3), minmax(0, 1fr)); gap: 20px; }
.sl-card { display: flex; flex-direction: column; background: var(--sl-bg-2); border: 1px solid var(--sl-line-2); border-radius: 4px; overflow: hidden; transition: border-color .2s, transform .2s, box-shadow .2s; }
.sl-card:hover { border-color: var(--sl-line-accent); transform: translateY(-2px); box-shadow: 0 18px 40px rgba(0, 0, 0, .35); }
.sl-card .sl-figure { border: 0; border-radius: 0; border-bottom: 1px solid var(--sl-line-2); }
.sl-card-body { padding: 20px 22px 22px; display: flex; flex-direction: column; gap: 8px; flex: 1; }
.sl-page .sl-card h3 { font-family: var(--sl-display); font-weight: 400; font-size: 21px; }
.sl-page .sl-card h3 a { color: var(--sl-text); }
.sl-page .sl-card h3 a:hover { color: var(--sl-accent-2); }
.sl-page .sl-card .sl-card-for { color: var(--sl-accent); font-size: 12px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.sl-page .sl-card .sl-card-spec { font-size: 14px; }

/* Filterable and comparison tables (Models hub, category pages) */
.sl-filter { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 16px; margin: 0 0 24px; }
.sl-page .sl-filter-label { color: var(--sl-text-3); font-size: 12px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.sl-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.sl-page .sl-chip { appearance: none; display: inline-flex; align-items: center; gap: 8px; min-height: 40px; padding: 8px 14px; margin: 0; border: 1px solid var(--sl-line); border-radius: 999px; background: transparent; color: var(--sl-text-2); font-family: var(--sl-body); font-size: 14px; font-weight: 500; line-height: 1.2; cursor: pointer; transition: border-color .2s, color .2s, background .2s; }
.sl-page .sl-chip:hover { border-color: var(--sl-accent); color: var(--sl-text); }
.sl-page .sl-chip:focus-visible { outline: 2px solid var(--sl-accent-2); outline-offset: 2px; }
.sl-page .sl-chip.is-active { background: var(--sl-accent); border-color: var(--sl-accent); color: #111; }
.sl-page .sl-chip-n { font-size: 12px; opacity: .7; }
.sl-page .sl-filter-status { flex-basis: 100%; margin: 0; min-height: 0; color: var(--sl-text-3); font-size: 13px; }
.sl-page .sl-filter-status:empty { display: none; }
.sl-page .sl-table tr[hidden] { display: none; }
.sl-page .sl-table-compare td:first-child a { color: var(--sl-text); text-decoration: none; border-bottom: 1px solid var(--sl-accent); }
.sl-page .sl-table-compare td:first-child a:hover { color: var(--sl-accent-2); }
.sl-cards.sl-cards-2 { max-width: 820px; }

/* Product finder (Products page) */
.sl-page .sl-pf-panel { display: grid; gap: 18px; padding: 26px 28px; background: linear-gradient(160deg, var(--sl-bg-2), var(--sl-bg-1)); border: 1px solid var(--sl-line-2); border-top: 2px solid var(--sl-accent); border-radius: 4px; }
.sl-pf-q { display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 10px 20px; align-items: start; }
.sl-page .sl-pf-label { display: block; padding-top: 10px; color: var(--sl-text-3); font-size: 12px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.sl-pf-actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; padding-top: 16px; border-top: 1px solid var(--sl-line-2); }
.sl-page .sl-pf-status { margin: 0; color: var(--sl-text); font-size: 15px; font-weight: 500; }
.sl-page .sl-pf-actions .sl-wb-clear { margin: 0; }
.sl-page .sl-pf-models-strip { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px 24px; margin: 20px 0 0; padding: 18px 22px; background: var(--sl-bg-2); border: 1px solid var(--sl-line-2); border-left: 2px solid var(--sl-accent); border-radius: 4px; }
.sl-page .sl-pf-models-strip .sl-pf-label { padding: 0 0 8px; }
.sl-page .sl-pf-models-strip[hidden], .sl-page .sl-pf-presets[hidden], .sl-page .sl-pf-empty[hidden], .sl-page .sl-wb-clear[hidden] { display: none; }
.sl-pf-presets { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 12px; margin: 20px 0 0; }
.sl-page a.sl-pf-preset { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 56px; padding: 14px 18px; background: var(--sl-bg-2); border: 1px solid var(--sl-line-2); border-radius: 4px; color: var(--sl-text); font-size: 15px; font-weight: 600; text-decoration: none; transition: border-color .15s, background .15s, transform .15s; }
.sl-page a.sl-pf-preset .sl-arrow { color: var(--sl-accent); transition: transform .15s; }
.sl-page a.sl-pf-preset:hover, .sl-page a.sl-pf-preset:focus-visible { border-color: var(--sl-accent); background: rgba(184, 138, 74, .08); transform: translateY(-1px); outline: none; }
.sl-page a.sl-pf-preset:hover .sl-arrow { transform: translateX(3px); }
.sl-pf-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.sl-page a.sl-pf-chip { display: inline-flex; align-items: center; min-height: 38px; padding: 6px 14px; border: 1px solid var(--sl-line); border-radius: 999px; color: var(--sl-text); font-size: 14px; font-weight: 500; text-decoration: none; transition: border-color .2s, color .2s; }
.sl-page a.sl-pf-chip:hover, .sl-page a.sl-pf-chip:focus-visible { border-color: var(--sl-accent); background: var(--sl-accent); color: #111; outline: none; }
.sl-page .sl-pf-models-strip .sl-btn { margin: 0; }
.sl-page .sl-pf-empty { margin: 20px 0 0; padding: 20px 22px; border: 1px dashed var(--sl-line); border-radius: 4px; }
.sl-page .sl-pf-empty p { margin: 0; }
.sl-pf-results { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin-top: 20px; }
.sl-pf-results:not(:has(.sl-pf-card:not([hidden]))) { margin-top: 0; }
.sl-page .sl-pf-card { display: flex; flex-direction: column; gap: 8px; padding: 22px; background: var(--sl-bg-2); border: 1px solid var(--sl-line-2); border-radius: 4px; transition: border-color .2s, transform .2s; animation: sl-pf-in .25s ease; }
.sl-page .sl-pf-card[hidden] { display: none; }
.sl-page .sl-pf-card:hover { border-color: var(--sl-accent); transform: translateY(-2px); }
.sl-page .sl-pf-card h3 { margin: 0; font-family: var(--sl-body); font-size: 17px; font-weight: 600; line-height: 1.35; }
.sl-page .sl-pf-card h3 a { color: var(--sl-text); text-decoration: none; }
.sl-page .sl-pf-card p { margin: 0; font-size: 14px; }
.sl-page .sl-pf-card { position: relative; }
.sl-page .sl-pf-card h3 a::after { content: ""; position: absolute; inset: 0; z-index: 0; border-radius: 4px; }
.sl-page .sl-pf-card h3 a:focus-visible { outline: none; }
.sl-page .sl-pf-card:focus-within { border-color: var(--sl-accent); }
.sl-page .sl-pf-models { position: relative; z-index: 1; display: flex; flex-wrap: wrap; gap: 6px; margin: 4px 0 0; }
.sl-page .sl-pf-mlabel { flex-basis: 100%; margin: 2px 0 2px; color: var(--sl-text-3); font-size: 12px; font-weight: 600; letter-spacing: .02em; }
.sl-page .sl-pf-mlabel b { color: var(--sl-accent-2); font-weight: 700; }
.sl-page a.sl-pf-mchip { display: inline-flex; align-items: center; min-height: 34px; padding: 4px 12px; border: 1px solid var(--sl-line); border-radius: 999px; background: var(--sl-bg-1); color: var(--sl-text); font-size: 13px; font-weight: 600; line-height: 1; text-decoration: none; transition: border-color .15s, background .15s, color .15s, opacity .15s; }
.sl-page a.sl-pf-mchip:hover, .sl-page a.sl-pf-mchip:focus-visible { border-color: var(--sl-accent); background: var(--sl-accent); color: #111; opacity: 1; outline: none; }
.sl-page a.sl-pf-mchip.is-match { background: rgba(184, 138, 74, .16); border-color: var(--sl-accent); color: var(--sl-accent-2); }
.sl-page a.sl-pf-mchip.is-match:hover, .sl-page a.sl-pf-mchip.is-match:focus-visible { background: var(--sl-accent); color: #111; }
.sl-page a.sl-pf-mchip.is-dim { opacity: .45; }
.sl-page .sl-pf-note { color: var(--sl-text-3); font-size: 13px; }
.sl-page .sl-pf-card .sl-card-more { position: relative; z-index: 1; }
.sl-page .sl-pf-card[data-kind="lock-bodies"] .sl-kicker, .sl-page .sl-pf-card[data-kind="series"] .sl-kicker { color: var(--sl-text-3); }
.sl-page .sl-pf-card .sl-card-more { margin-top: auto; padding-top: 6px; }
@keyframes sl-pf-in { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }
@media (max-width: 1024px) { .sl-pf-results { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) {
  .sl-page .sl-pf-panel { padding: 20px 18px; }
  .sl-pf-q { grid-template-columns: minmax(0, 1fr); gap: 8px; }
  .sl-page .sl-pf-label { padding-top: 0; }
  .sl-pf-results { grid-template-columns: minmax(0, 1fr); }
  .sl-page .sl-pf-models-strip .sl-btn { width: 100%; text-align: center; }
}
@media (prefers-reduced-motion: reduce) { .sl-page .sl-pf-card { animation: none; } }

/* Table finder (Waterproof, Apartment, mortise pages) */
.sl-tf-panel { margin-bottom: 20px; }
.sl-page .sl-chip:disabled { opacity: .35; cursor: not-allowed; }
.sl-page .sl-chip:disabled:hover { border-color: var(--sl-line); color: var(--sl-text-2); }
.sl-page .sl-tf .sl-chip-n:empty { display: none; }
.sl-page .sl-tf .sl-pf-empty { margin: 0 0 20px; }
.sl-page .sl-tf .sl-pf-empty[hidden], .sl-page .sl-tf .sl-wb-clear[hidden] { display: none; }
.sl-page .sl-tf-table tr.is-hit td { background: rgba(184, 138, 74, .05); }
.sl-page .sl-tf-table tr.is-hit td:first-child { box-shadow: inset 2px 0 0 var(--sl-accent); }
@media (max-width: 640px) { .sl-page .sl-tf-table tr.is-hit td:first-child { box-shadow: none; padding-left: 0; } .sl-page .sl-tf-table tr.is-hit { border-left: 2px solid var(--sl-accent); padding-left: 12px; } }

/* Clickable model rows in comparison tables */
.sl-page table.sl-rowlink tr.has-link { cursor: pointer; }
.sl-page table.sl-rowlink tr.has-link td { transition: background .15s; }
.sl-page table.sl-rowlink tr.has-link td:first-child { position: relative; padding-left: 14px; padding-right: 26px; }
.sl-page table.sl-rowlink thead th:first-child, .sl-page .sl-tf-table thead th:first-child, .sl-page .sl-tf-table tbody td:first-child { padding-left: 14px; }
.sl-page table.sl-rowlink tr.has-link td:first-child::after { content: "→"; position: absolute; right: 8px; top: 14px; color: var(--sl-accent-2); opacity: 0; transform: translateX(-4px); transition: opacity .15s, transform .15s; }
.sl-page table.sl-rowlink tr.has-link:hover td { background: rgba(184, 138, 74, .13); }
.sl-page table.sl-rowlink tr.has-link:hover td:first-child { box-shadow: inset 3px 0 0 var(--sl-accent-2); }
.sl-page table.sl-rowlink tr.has-link:hover td:first-child::after, .sl-page table.sl-rowlink tr.has-link:focus-within td:first-child::after { opacity: 1; transform: none; }
.sl-page table.sl-rowlink tr.has-link:hover td:first-child a, .sl-page table.sl-rowlink td:first-child a:focus-visible { color: var(--sl-accent-2); border-bottom-color: var(--sl-accent-2); }
.sl-page .sl-tf-table table:not(.sl-rowlink) tbody tr:hover td { background: rgba(184, 138, 74, .06); }
@media (hover: none) { .sl-page table.sl-rowlink tr.has-link td:first-child::after { opacity: 1; transform: none; } }
@media (max-width: 640px) {
  .sl-page table.sl-rowlink tr.has-link { position: relative; }
  .sl-page table.sl-rowlink tr.has-link td:first-child, .sl-page .sl-tf-table tbody td:first-child { position: static; padding-left: 0; }
  .sl-page table.sl-rowlink thead th:first-child, .sl-page .sl-tf-table thead th:first-child { padding-left: 0; }
  .sl-page table.sl-rowlink tr.has-link td:first-child::after { top: 16px; right: 4px; }
  .sl-page table.sl-rowlink tr.has-link:hover td:first-child { box-shadow: none; }
  .sl-page table.sl-rowlink tr.has-link:hover td { background: transparent; }
  .sl-page table.sl-rowlink tr.has-link:active { background: rgba(184, 138, 74, .12); }
}

/* Model workbench (Models page): filter panel + cards, switchable to a table */
.sl-wb { display: grid; grid-template-columns: 264px minmax(0, 1fr); gap: 28px; align-items: start; }
.sl-wb-side { position: sticky; top: 130px; }
.sl-page .sl-wb-panel { background: var(--sl-bg-2); border: 1px solid var(--sl-line-2); border-radius: 4px; }
.sl-page .sl-wb-panel > summary { list-style: none; cursor: pointer; padding: 18px 20px; color: var(--sl-text); font-family: var(--sl-body); font-size: 15px; font-weight: 600; border-bottom: 1px solid var(--sl-line-2); }
.sl-page .sl-wb-panel > summary::-webkit-details-marker { display: none; }
.sl-page .sl-wb-active { color: var(--sl-accent-2); font-weight: 600; }
.sl-wb-fields { display: grid; gap: 16px; padding: 18px 20px 20px; }
.sl-page .sl-wb-field label { display: block; margin: 0 0 7px; color: var(--sl-text-3); font-family: var(--sl-body); font-size: 12px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.sl-page .sl-wb-field select, .sl-page .sl-wb-field input { box-sizing: border-box; width: 100%; height: 44px; margin: 0; padding: 0 12px; background: var(--sl-bg-0); border: 1px solid var(--sl-line); border-radius: 4px; color: var(--sl-text); font-family: var(--sl-body); font-size: 15px; line-height: 1.2; }
.sl-page .sl-wb-field select { appearance: none; padding-right: 34px; background-image: linear-gradient(45deg, transparent 50%, var(--sl-accent) 50%), linear-gradient(135deg, var(--sl-accent) 50%, transparent 50%); background-position: calc(100% - 18px) 19px, calc(100% - 13px) 19px; background-size: 5px 5px; background-repeat: no-repeat; }
.sl-page .sl-wb-field select:focus, .sl-page .sl-wb-field input:focus { outline: 2px solid var(--sl-accent-2); outline-offset: 1px; border-color: var(--sl-accent); }
.sl-page .sl-wb-field input::placeholder { color: var(--sl-text-3); }
.sl-page .sl-wb-clear { justify-self: start; min-height: 40px; padding: 8px 16px; margin: 4px 0 0; background: transparent; border: 1px solid var(--sl-accent); border-radius: 4px; color: var(--sl-text); font-family: var(--sl-body); font-size: 14px; font-weight: 600; cursor: pointer; }
.sl-page .sl-wb-clear:hover { background: rgba(184, 138, 74, .12); }
.sl-wb-bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 20px; padding: 14px 18px; margin: 0 0 20px; background: var(--sl-bg-2); border: 1px solid var(--sl-line-2); border-left: 2px solid var(--sl-accent); border-radius: 4px; }
.sl-page .sl-wb-count { margin: 0; color: var(--sl-text); font-size: 15px; font-weight: 500; }
.sl-wb-views { display: inline-flex; border: 1px solid var(--sl-line); border-radius: 4px; overflow: hidden; }
.sl-page .sl-wb-views button { min-height: 38px; padding: 6px 16px; margin: 0; border: 0; border-radius: 0; background: transparent; color: var(--sl-text-2); font-family: var(--sl-body); font-size: 14px; font-weight: 600; cursor: pointer; }
.sl-page .sl-wb-views button + button { border-left: 1px solid var(--sl-line); }
.sl-page .sl-wb-views button.is-active { background: var(--sl-accent); color: #111; }
.sl-page .sl-wb-views button:focus-visible { outline: 2px solid var(--sl-accent-2); outline-offset: -2px; }
.sl-wb-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.sl-page .sl-wb-card[hidden], .sl-page .sl-wb [hidden] { display: none; }
.sl-page .sl-wb-card h3 { font-size: 19px; }
.sl-page .sl-wb-facts { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 14px; margin: 6px 0 0; padding: 12px 0 0; border-top: 1px solid var(--sl-line-2); }
.sl-page .sl-wb-facts div { min-width: 0; }
.sl-page .sl-wb-facts dt { margin: 0 0 2px; color: var(--sl-accent); font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.sl-page .sl-wb-facts dd { margin: 0; color: var(--sl-text-2); font-size: 13px; line-height: 1.45; }
.sl-page .sl-wb-empty { padding: 22px; margin: 0 0 20px; border: 1px dashed var(--sl-line); border-radius: 4px; }
.sl-page .sl-wb-empty p { margin: 0; }
@media (max-width: 1200px) { .sl-wb-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 860px) {
  .sl-wb { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  .sl-wb-side { position: static; }
  .sl-page .sl-wb-panel > summary { border-bottom: 0; }
  .sl-page .sl-wb-panel[open] > summary { border-bottom: 1px solid var(--sl-line-2); }
  .sl-page .sl-wb-panel > summary::after { content: "+"; float: right; color: var(--sl-accent); }
  .sl-page .sl-wb-panel[open] > summary::after { content: "−"; }
}
@media (max-width: 640px) {
  .sl-wb-cards { grid-template-columns: minmax(0, 1fr); gap: 14px; }
  .sl-page .sl-wb .sl-wb-card { display: grid; grid-template-columns: 112px minmax(0, 1fr); }
  .sl-page .sl-wb .sl-wb-card .sl-figure { grid-column: 1; grid-row: 1 / 4; width: 100%; height: auto; min-height: 0; aspect-ratio: 1 / 1; align-self: start; border-right: 1px solid var(--sl-line-2); border-bottom: 1px solid var(--sl-line-2); }
  .sl-page .sl-wb .sl-wb-card .sl-card-body > * { align-self: start; }
  .sl-page .sl-wb .sl-wb-card .sl-card-body { display: contents; }
  .sl-page .sl-wb .sl-wb-card .sl-card-body > .sl-card-for, .sl-page .sl-wb .sl-wb-card .sl-card-body > h3, .sl-page .sl-wb .sl-wb-card .sl-card-body > .sl-card-spec { grid-column: 2; padding: 0 14px; margin: 0; }
  .sl-page .sl-wb .sl-wb-card .sl-card-body > .sl-card-for { padding-top: 12px; }
  .sl-page .sl-wb .sl-wb-card .sl-card-body > .sl-card-spec { padding-bottom: 12px; font-size: 13px; }
  .sl-page .sl-wb .sl-wb-card .sl-wb-facts, .sl-page .sl-wb .sl-wb-card .sl-card-more { grid-column: 1 / -1; margin: 0 14px; }
  .sl-page .sl-wb .sl-wb-card .sl-wb-facts { padding: 12px 0; }
  .sl-page .sl-wb .sl-wb-card .sl-card-more { padding: 0 0 14px; }
}
.sl-page a.sl-card-more { margin-top: auto; padding-top: 10px; font-size: 13px; font-weight: 600; color: var(--sl-accent-2); border-bottom: 0; }
.sl-page a.sl-card-more span { display: inline-block; transition: transform .2s; }
.sl-card:hover a.sl-card-more span { transform: translateX(4px); }

/* ---------- Route and theme cards ---------- */
.sl-routes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.sl-routes.sl-routes-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.sl-route { position: relative; display: flex; flex-direction: column; gap: 10px; padding: 26px 26px 22px; background: linear-gradient(180deg, var(--sl-bg-2), var(--sl-bg-1)); border: 1px solid var(--sl-line-2); border-radius: 4px; transition: border-color .2s, transform .2s, box-shadow .2s; }
.sl-route::before { content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 2px; background: var(--sl-accent); transform: scaleX(0); transform-origin: left; transition: transform .3s; }
.sl-route.has-links:hover { border-color: var(--sl-line-accent); transform: translateY(-2px); box-shadow: 0 18px 40px rgba(0, 0, 0, .35); }
.sl-route.has-links:hover::before { transform: scaleX(1); }
.sl-route-top { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.sl-page .sl-route-top .sl-kicker { margin: 0; }
.sl-page .sl-route-num { order: 2; font-family: var(--sl-display); font-size: 22px; line-height: 1; color: rgba(184, 138, 74, .55); }
.sl-page .sl-route h3 { font-size: 19px; line-height: 1.3; }
.sl-page .sl-route p { font-size: 14.5px; line-height: 1.6; color: var(--sl-text-2); }
.sl-page .sl-route.has-links p { color: var(--sl-text-3); font-size: 14px; }
.sl-page ul.sl-route-links { list-style: none; margin: auto 0 0; padding: 12px 0 0; border-top: 1px solid var(--sl-line-2); }
.sl-page ul.sl-route-links li { padding: 0; }
.sl-page ul.sl-route-links a { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 7px 0; font-size: 14px; font-weight: 500; color: var(--sl-text); border-bottom: 0; }
.sl-page ul.sl-route-links a:hover { color: var(--sl-accent-2); }
.sl-page ul.sl-route-links a:hover .sl-arrow { transform: translateX(4px); }

/* ---------- Stat strip ---------- */
.sl-stats { display: grid; grid-template-columns: repeat(var(--n, 5), minmax(0, 1fr)); border-top: 1px solid var(--sl-line-accent); border-bottom: 1px solid var(--sl-line-2); background: linear-gradient(180deg, rgba(184,138,74,.06), transparent 70%); }
.sl-stat { padding: 24px 20px 24px 0; }
.sl-stat + .sl-stat { padding-left: 20px; border-left: 1px solid var(--sl-line-2); }
.sl-page .sl-stat-value { display: block; font-family: var(--sl-display); font-size: clamp(30px, 3vw, 42px); line-height: 1.1; color: var(--sl-text); }
.sl-page .sl-stat-label { display: block; margin-top: 8px; font-size: 14px; line-height: 1.45; }

/* ---------- Figures, galleries, photo placeholders ---------- */
.sl-figure { margin: 0; position: relative; background: var(--sl-bg-3); border: 1px solid var(--sl-line-2); border-radius: 4px; overflow: hidden; aspect-ratio: var(--ratio, 3 / 2); width: 100%; }
.sl-figure img { display: block; width: 100%; height: 100%; object-fit: cover; }
.sl-figure.sl-product img { object-fit: contain; background: #e9e7e2; }
.sl-gallery { display: grid; grid-template-columns: repeat(var(--cols, 3), minmax(0, 1fr)); gap: 20px; margin-top: 40px; }
.sl-gallery-item { margin: 0; }
.sl-page .sl-gallery-item figcaption { margin-top: 10px; font-size: 13.5px; line-height: 1.45; color: var(--sl-text-3); }
.sl-ph { position: absolute; inset: 0; display: flex; flex-direction: column; justify-content: flex-end; gap: 6px; padding: 18px; background: repeating-linear-gradient(135deg, rgba(255,255,255,.025) 0 12px, transparent 12px 24px), linear-gradient(160deg, #1d201f, #121413); border: 1px dashed rgba(184, 138, 74, .35); }
.sl-ph.sl-ph-empty { border: 0; background: linear-gradient(160deg, #1d201f, #121413); }
.sl-page .sl-ph-tag { color: var(--sl-accent); font-size: 11px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.sl-page .sl-ph-file { color: var(--sl-text); font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 12px; word-break: break-all; }
.sl-page .sl-ph-brief { color: var(--sl-text-3); font-size: 12px; line-height: 1.45; }

/* ---------- Timeline (Our Story) ---------- */
.sl-page .sl-visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.sl-timeline-item { display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: 0 clamp(28px, 4vw, 56px); }
.sl-page .sl-year { position: relative; font-family: var(--sl-display); font-size: clamp(28px, 2.6vw, 38px); line-height: 1.1; color: var(--sl-accent-2); padding-top: 2px; }
.sl-timeline-body { position: relative; padding-left: clamp(28px, 3vw, 40px); border-left: 1px solid var(--sl-line-accent); }
.sl-timeline-body::before { content: ""; position: absolute; left: -5px; top: 14px; width: 9px; height: 9px; background: var(--sl-accent); border-radius: 50%; }
.sl-page .sl-timeline-body h2 { font-size: clamp(24px, 2.2vw, 32px); margin-bottom: 16px; }
.sl-page .sl-timeline-body .sl-figure { margin-top: 24px; max-width: 640px; }
.sl-section.sl-timeline { padding: clamp(36px, 4vw, 56px) 0; border-top: 0; }
.sl-section.sl-timeline.is-first { padding-top: var(--sl-space-m); }
.sl-section.sl-timeline.is-last { padding-bottom: var(--sl-space-m); }

/* ---------- FAQ ---------- */
.sl-faq { border-top: 1px solid var(--sl-line); max-width: 880px; }
.sl-faq details { border-bottom: 1px solid var(--sl-line); }
.sl-faq summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center; gap: 24px; padding: 20px 0; }
.sl-faq summary::-webkit-details-marker { display: none; }
.sl-page .sl-faq summary h3 { font-size: 17px; font-weight: 600; }
.sl-faq summary::after { content: "+"; flex: none; color: var(--sl-accent); font-size: 24px; line-height: 1; transition: transform .2s; }
.sl-faq details[open] summary::after { transform: rotate(45deg); }
.sl-faq .sl-faq-a { padding: 0 48px 22px 0; max-width: var(--sl-measure); }

/* ---------- Closing band ---------- */
.sl-page .sl-cta { position: relative; overflow: hidden; text-align: center; padding: clamp(72px, 9vw, 128px) 0; border-top: 1px solid var(--sl-line-accent); background: radial-gradient(70% 120% at 50% 0%, rgba(184,138,74,.16) 0%, rgba(184,138,74,0) 60%), linear-gradient(180deg, #0d0f0f, var(--sl-bg-0)); }
.sl-page .sl-cta::before { content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .5; background-image: linear-gradient(rgba(255,255,255,.03) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.03) 1px, transparent 1px); background-size: 64px 64px; -webkit-mask-image: radial-gradient(60% 80% at 50% 40%, #000 0%, transparent 80%); mask-image: radial-gradient(60% 80% at 50% 40%, #000 0%, transparent 80%); }
.sl-page .sl-cta .sl-wrap { position: relative; }
.sl-page .sl-cta .sl-head, .sl-page .sl-cta .sl-prose { margin-left: auto; margin-right: auto; }
.sl-page .sl-cta h2 { margin: 0 auto; font-size: clamp(32px, 3.6vw, 52px); max-width: 20ch; }
.sl-page .sl-cta h2::after { content: ""; display: block; width: 44px; height: 2px; margin: 18px auto 0; background: var(--sl-accent); }
.sl-page .sl-cta .sl-kicker { text-align: center; }
.sl-page .sl-cta .sl-prose p { font-size: 17px; }
.sl-page .sl-cta .sl-buttons { justify-content: center; }

/* ---------- Jump bar (long pages) ---------- */
.sl-jump { position: sticky; top: var(--sl-sticky-top, 0px); z-index: 20; background: rgba(10, 12, 12, .94); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); border-top: 1px solid var(--sl-line-2); border-bottom: 1px solid var(--sl-line-2); }
.sl-jump .sl-wrap { position: relative; }
.sl-jump-inner { display: flex; gap: 4px; overflow-x: auto; scrollbar-width: none; scroll-behavior: smooth; }
.sl-jump-inner::-webkit-scrollbar { display: none; }
/* edge fades show there is more to scroll; toggled by the inline script */
.sl-jump.is-scroll-right .sl-wrap::after, .sl-jump.is-scroll-left .sl-wrap::before { content: ""; position: absolute; top: 0; bottom: 0; width: 48px; pointer-events: none; z-index: 1; }
.sl-jump.is-scroll-right .sl-wrap::after { right: var(--sl-pad); background: linear-gradient(90deg, rgba(10,12,12,0), rgba(10,12,12,.98)); }
.sl-jump.is-scroll-left .sl-wrap::before { left: var(--sl-pad); background: linear-gradient(270deg, rgba(10,12,12,0), rgba(10,12,12,.98)); }
.sl-page .sl-jump a { flex: none; padding: 15px 14px 13px; border-bottom: 2px solid transparent; color: var(--sl-text-2); font-size: 13px; font-weight: 600; letter-spacing: .02em; white-space: nowrap; }
.sl-page .sl-jump a:first-child { padding-left: 0; }
.sl-page .sl-jump a:hover { color: var(--sl-text); }
.sl-page .sl-jump a.is-active { color: var(--sl-text); border-bottom-color: var(--sl-accent); }
.sl-page .sl-section { scroll-margin-top: calc(var(--sl-sticky-top, 0px) + 56px); }

/* ---------- Responsive ---------- */
@media (max-width: 1024px) {
  .sl-page .sl-cards, .sl-routes, .sl-routes.sl-routes-4, .sl-page .sl-gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sl-stats { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .sl-stat:nth-child(4) { padding-left: 0; border-left: 0; }
}
@media (max-width: 860px) {
  .sl-split, .sl-split-head { grid-template-columns: minmax(0, 1fr); }
  .sl-split-head { gap: 0; }
  .sl-split-head .sl-head { margin-bottom: 20px; }
  .sl-split > .sl-figure { position: relative; top: auto; }
  .sl-timeline-item { grid-template-columns: minmax(0, 1fr); }
  .sl-page .sl-year { margin-bottom: 14px; font-size: 32px; }
}
@media (max-width: 640px) {
  .sl-page .sl-lead { font-size: 17px; }
  .sl-page .sl-hero ul.sl-points { grid-template-columns: minmax(0, 1fr); }
  .sl-page .sl-cards, .sl-routes, .sl-routes.sl-routes-4, .sl-page .sl-gallery { grid-template-columns: minmax(0, 1fr); }
  .sl-route { padding: 22px 20px 18px; }
  .sl-stats { grid-template-columns: 1fr 1fr; }
  .sl-stat, .sl-stat + .sl-stat { padding: 18px 12px 18px 0; border-left: 0; }
  .sl-stat:nth-child(even) { padding-left: 16px; border-left: 1px solid var(--sl-line-2); }
  .sl-page .sl-hero .sl-buttons, .sl-page .sl-cta .sl-buttons { flex-direction: column; align-items: stretch; }
  .sl-page .sl-hero a.sl-btn, .sl-page .sl-cta a.sl-btn { width: 100%; }
  .sl-page .sl-jump a { padding: 13px 10px 11px; }
  .sl-page .sl-table thead { display: none; }
  .sl-page .sl-table, .sl-page .sl-table tbody, .sl-page .sl-table tr, .sl-page .sl-table td { display: block; width: 100%; }
  .sl-page .sl-table tr { padding: 14px 0; border-bottom: 1px solid var(--sl-line-2); }
  .sl-page .sl-table tr[hidden] { display: none; }
  /* product cards: photo beside the text on phones, so a 4-model row is not four screens tall */
  .sl-page .sl-card { flex-direction: row; align-items: stretch; }
  .sl-page .sl-card .sl-figure { flex: 0 0 36%; width: 36%; aspect-ratio: auto; min-height: 132px; border-bottom: 0; border-right: 1px solid var(--sl-line-2); }
  .sl-page .sl-card .sl-ph-brief, .sl-page .sl-card .sl-ph-file { display: none; }
  .sl-page .sl-card-body { padding: 14px 16px 16px; gap: 6px; }
  .sl-page .sl-card h3 { font-size: 19px; }
  .sl-page .sl-table td { padding: 2px 0; border: 0; }
  .sl-page .sl-table td[data-label]:not(:first-child)::before { content: attr(data-label) ": "; color: var(--sl-text-3); font-size: 13px; }
  .sl-faq .sl-faq-a { padding-right: 0; }
  .sl-timeline-body { padding-left: 22px; }
}
@media (prefers-reduced-motion: reduce) {
  .sl-page *, .sl-page *::before, .sl-page *::after { transition: none; scroll-behavior: auto; }
  .sl-route:hover, .sl-card:hover { transform: none; }
}

/* ---------- Standalone page base (ignored inside WordPress, where the theme owns body) ---------- */
body.sl-standalone { margin: 0; background: #050606; }
body.sl-standalone a:has(> .sl-wordmark) { text-decoration: none; }
body.sl-standalone .sl-wordmark { font-family: Georgia, serif; font-size: 26px; color: #f6f1e8; letter-spacing: .02em; }

/* ---------- Route and finder cards with a photo ---------- */
.sl-page .sl-route.has-photo { padding: 0; gap: 0; overflow: hidden; background: var(--sl-bg-2); }
.sl-page .sl-card-photo { display: block; border: 0; text-decoration: none; }
.sl-page .sl-card-photo .sl-figure { border: 0; border-radius: 0; border-bottom: 1px solid var(--sl-line-2); }
.sl-page .sl-card-photo img { transition: transform .35s ease; }
.sl-page .sl-route.has-photo:hover .sl-card-photo img, .sl-page .sl-pf-card.has-photo:hover .sl-card-photo img { transform: scale(1.03); }
.sl-page .sl-route-body { display: flex; flex-direction: column; gap: 10px; flex: 1; padding: 20px 22px 18px; }
.sl-page .sl-route.has-photo .sl-route-top { min-height: 0; }
.sl-page .sl-route.has-photo .sl-ph { padding: 14px; }
.sl-page .sl-route.has-photo .sl-ph-brief { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.sl-page .sl-pf-card.has-photo .sl-card-photo { position: relative; z-index: 1; margin: -22px -22px 6px; }
.sl-page .sl-pf-card.has-photo .sl-figure { --ratio: 16 / 10 !important; }
.sl-page .sl-pf-card.has-photo .sl-ph-brief, .sl-page .sl-pf-card.has-photo .sl-ph-file { display: none; }
@media (max-width: 640px) {
  .sl-page .sl-route.has-photo { flex-direction: row; align-items: stretch; }
  .sl-page .sl-route.has-photo .sl-card-photo { flex: 0 0 34%; width: 34%; }
  .sl-page .sl-route.has-photo .sl-card-photo .sl-figure { height: 100%; aspect-ratio: auto; min-height: 140px; border-bottom: 0; border-right: 1px solid var(--sl-line-2); }
  .sl-page .sl-route.has-photo .sl-ph-brief, .sl-page .sl-route.has-photo .sl-ph-file { display: none; }
  .sl-page .sl-route-body { padding: 14px 16px 12px; gap: 6px; min-width: 0; }
  .sl-page .sl-route.has-photo h3 { font-size: 17px; }
  .sl-page .sl-route.has-photo p { font-size: 13.5px; line-height: 1.5; }
  .sl-page .sl-route.has-photo ul.sl-route-links { padding-top: 6px; }
  .sl-page .sl-route.has-photo ul.sl-route-links a { padding: 5px 0; font-size: 13.5px; }
  .sl-page .sl-pf-card.has-photo .sl-figure { --ratio: 2 / 1 !important; }
}

/* ---------- Model pages ---------- */
.sl-page .sl-hero-model { padding: clamp(28px, 4vw, 48px) 0 0; }
.sl-page .sl-hero-model .sl-split { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: clamp(28px, 4vw, 64px); align-items: center; }
.sl-page .sl-mcrumb { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-bottom: 18px; font-size: 13px; color: var(--sl-text-3); }
.sl-page .sl-mcrumb a { color: var(--sl-text-2); text-decoration: none; border-bottom: 1px solid transparent; }
.sl-page .sl-mcrumb a:hover { color: var(--sl-accent-2); border-bottom-color: currentColor; }
.sl-page .sl-mhero-photo { position: relative; }
.sl-page .sl-mhero-photo::before { content: ""; position: absolute; inset: 8% -4% -4% 8%; border: 1px solid var(--sl-line-accent); border-radius: 6px; pointer-events: none; }
.sl-page .sl-hero-model .sl-mhero-photo .sl-figure { position: relative; inset: auto; aspect-ratio: 4 / 3; height: auto; border: 1px solid var(--sl-line-2); border-radius: 6px; box-shadow: 0 30px 60px rgba(0,0,0,.45); }
.sl-page .sl-hero-model::after { display: none; }
.sl-page .sl-mfacts { display: grid; grid-template-columns: repeat(var(--n, 5), minmax(0, 1fr)); margin-top: clamp(32px, 4vw, 52px); border-top: 1px solid var(--sl-line-accent); }
.sl-page .sl-mfact { display: flex; flex-direction: column; gap: 6px; padding: 22px 20px 26px; }
.sl-page .sl-mfact:first-child { padding-left: 0; }
.sl-page .sl-mfact + .sl-mfact { border-left: 1px solid var(--sl-line-2); }
.sl-page .sl-mfact-v { font-family: var(--sl-display); font-size: clamp(24px, 2.2vw, 32px); line-height: 1.1; color: var(--sl-text); white-space: nowrap; }
.sl-page .sl-mfact-l { font-size: 13px; line-height: 1.4; color: var(--sl-text-3); }
.sl-page dl.sl-specs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 48px; margin: 0; border-top: 1px solid var(--sl-line-2); }
.sl-page .sl-spec-row { display: grid; grid-template-columns: minmax(130px, 38%) minmax(0, 1fr); gap: 16px; padding: 14px 0; border-bottom: 1px solid var(--sl-line-2); }
.sl-page .sl-spec-row dt { margin: 0; font-size: 13px; font-weight: 600; letter-spacing: .02em; color: var(--sl-text-3); }
.sl-page .sl-spec-row dd { margin: 0; font-size: 15px; line-height: 1.5; color: var(--sl-text); }
.sl-page table.sl-table tr.is-current td { background: rgba(184,138,74,.07); color: var(--sl-text); }
.sl-page table.sl-table tr.is-current td:first-child { box-shadow: inset 3px 0 0 var(--sl-accent); padding-left: 14px; }
.sl-page table.sl-table tr.is-current td:first-child strong { color: var(--sl-accent-2); }
@media (min-width: 861px) {
  .sl-page .sl-hero.sl-hero-model { display: block; min-height: 0; padding: clamp(28px, 4vw, 48px) 0 0; }
  .sl-page .sl-hero-model > .sl-wrap { position: relative; }
  .sl-page .sl-hero-model .sl-split { display: grid; position: relative; }
  .sl-page .sl-hero-model .sl-split > div:first-child { max-width: none; padding: 0; }
  .sl-page .sl-hero-model .sl-figure { position: relative; inset: auto; z-index: 1; }
  .sl-page .sl-hero-model .sl-figure .sl-ph { padding: 18px; }
}
@media (max-width: 860px) {
  .sl-page .sl-hero-model .sl-split { grid-template-columns: minmax(0, 1fr); }
  .sl-page .sl-mhero-photo { order: -1; max-width: 520px; }
  .sl-page .sl-mhero-photo::before { display: none; }
  .sl-page .sl-mfacts { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .sl-page .sl-mfact:nth-child(3n+1) { padding-left: 0; border-left: 0; }
  .sl-page dl.sl-specs { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 640px) {
  .sl-page .sl-mfacts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sl-page .sl-mfact { padding: 16px 14px 18px; }
  .sl-page .sl-mfact:nth-child(3n+1) { padding-left: 14px; border-left: 1px solid var(--sl-line-2); }
  .sl-page .sl-mfact:nth-child(2n+1) { padding-left: 0; border-left: 0; }
  .sl-page .sl-mfact { border-top: 1px solid var(--sl-line-2); }
  .sl-page .sl-mfact:nth-child(-n+2) { border-top: 0; }
  .sl-page .sl-mfact-v { font-size: 22px; white-space: normal; }
  .sl-page .sl-spec-row { grid-template-columns: minmax(96px, 38%) minmax(0, 1fr); gap: 12px; padding: 11px 0; }
  .sl-page .sl-spec-row dd { font-size: 14px; }
  .sl-page table.sl-table tr.is-current { border-left: 2px solid var(--sl-accent); padding-left: 12px; }
  .sl-page table.sl-table tr.is-current td, .sl-page table.sl-table tr.is-current td:first-child { background: none; box-shadow: none; padding-left: 0; }
}

@media (max-width: 860px) { .sl-page .sl-gallery[style*="--cols:4"] { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.sl-page .sl-gallery[style*="--cols:4"] .sl-ph-brief { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
@media (max-width: 640px) { .sl-page .sl-mfact:last-child:nth-child(odd) { grid-column: 1 / -1; padding-left: 0; border-left: 0; } }

/* ---------- Model pages v2: featured gallery, lightbox, compare thumbnails ---------- */
.sl-page .sl-gf { display: grid; grid-template-columns: minmax(0, 2.2fr) minmax(0, 1fr); gap: 14px; margin-top: 36px; }
.sl-page .sl-gf-side { display: grid; grid-template-rows: repeat(var(--n, 3), minmax(0, 1fr)); gap: 14px; }
.sl-page .sl-gf-tile { position: relative; display: block; height: 100%; overflow: hidden; border: 1px solid var(--sl-line-2); border-radius: 4px; text-decoration: none; color: inherit; cursor: zoom-in; transition: border-color .2s; }
.sl-page .sl-gf-tile:hover, .sl-page .sl-gf-tile:focus-visible { border-color: var(--sl-accent); outline: none; }
.sl-page .sl-gf-tile .sl-figure { border: 0; border-radius: 0; height: 100%; }
.sl-page .sl-gf-tile.is-main .sl-figure { aspect-ratio: 3 / 2; }
.sl-page .sl-gf-tile.is-thumb .sl-figure { aspect-ratio: auto; min-height: 100%; position: absolute; inset: 0; }
.sl-page .sl-gf-tile img { transition: transform .4s ease; }
.sl-page .sl-gf-tile:hover img { transform: scale(1.04); }
.sl-page .sl-gf-tile.is-thumb .sl-ph-brief, .sl-page .sl-gf-tile.is-thumb .sl-ph-file { display: none; }
.sl-page .sl-gf-tile.is-thumb .sl-ph { justify-content: flex-start; padding: 12px 14px; }
.sl-page .sl-gf-cap { position: absolute; left: 0; right: 0; bottom: 0; z-index: 2; padding: 26px 16px 12px; font-size: 13px; line-height: 1.4; color: #f1ede6; background: linear-gradient(0deg, rgba(5,6,6,.88), rgba(5,6,6,0)); }
.sl-page .sl-gf-tile.is-thumb .sl-gf-cap { padding: 22px 12px 9px; font-size: 12px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sl-page .sl-gf-zoom { position: absolute; top: 10px; right: 10px; z-index: 2; width: 30px; height: 30px; border-radius: 50%; background: rgba(5,6,6,.65) center / 14px no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23d9b27a' stroke-width='1.6'%3E%3Cpath d='M9.5 2.5h4v4M6.5 13.5h-4v-4M13.5 2.5 9 7M2.5 13.5 7 9'/%3E%3C/svg%3E"); opacity: 0; transition: opacity .2s; }
.sl-page .sl-gf-tile:hover .sl-gf-zoom, .sl-page .sl-gf-tile:focus-visible .sl-gf-zoom { opacity: 1; }
@media (hover: none) { .sl-page .sl-gf-zoom { opacity: 1; } }
@media (max-width: 760px) {
  .sl-page .sl-gf { grid-template-columns: minmax(0, 1fr); gap: 10px; }
  .sl-page .sl-gf-side { grid-template-rows: none; grid-template-columns: repeat(var(--n, 3), minmax(0, 1fr)); gap: 10px; }
  .sl-page .sl-gf-tile.is-thumb { aspect-ratio: 1 / 1; }
  .sl-page .sl-gf-tile.is-thumb .sl-gf-cap { display: none; }
  .sl-page .sl-gf-tile.is-thumb .sl-ph-tag { font-size: 9px; }
  .sl-page .sl-gf-tile.is-main .sl-ph-brief { display: none; }
}
.sl-lb { position: fixed; inset: 0; z-index: 9999; display: none; align-items: center; justify-content: center; padding: 56px 72px 72px; background: rgba(4,5,5,.985); }
.sl-lb.is-open { display: flex; }
html.sl-lb-lock { overflow: hidden; }
.sl-lb-stage { width: min(1100px, 100%); max-height: 100%; display: flex; align-items: center; justify-content: center; }
.sl-lb-stage .sl-figure { width: 100%; max-height: calc(100vh - 140px); aspect-ratio: var(--ratio, 3 / 2); border: 0; border-radius: 4px; }
.sl-lb-stage .sl-figure img { object-fit: contain; background: #0b0c0c; }
.sl-lb-close, .sl-lb-nav { position: absolute; display: flex; align-items: center; justify-content: center; border: 1px solid rgba(255,255,255,.18); background: rgba(20,22,21,.8); color: #f1ede6; cursor: pointer; border-radius: 50%; font: 400 28px/1 Georgia, serif; transition: border-color .2s, color .2s; }
.sl-lb-close { top: 14px; right: 16px; width: 42px; height: 42px; }
.sl-lb-nav { top: 50%; width: 48px; height: 48px; margin-top: -24px; font-size: 34px; }
.sl-lb-prev { left: 14px; } .sl-lb-next { right: 14px; }
.sl-lb-close:hover, .sl-lb-nav:hover, .sl-lb-close:focus-visible, .sl-lb-nav:focus-visible { border-color: #b88a4a; color: #d9b27a; outline: none; }
.sl-lb-foot { position: absolute; left: 0; right: 0; bottom: 18px; display: flex; justify-content: center; gap: 18px; padding: 0 20px; font: 14px/1.4 Inter, system-ui, sans-serif; color: #cfc9bf; text-align: center; }
.sl-lb-count { color: #8d877d; white-space: nowrap; }
@media (max-width: 640px) { .sl-lb { padding: 60px 10px 80px; } .sl-lb-nav { top: auto; bottom: 14px; margin-top: 0; width: 42px; height: 42px; } .sl-lb-foot { bottom: 70px; } }

.sl-page .sl-mcell { display: inline-flex; align-items: center; gap: 12px; }
.sl-page .sl-mthumb { flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; width: 60px; height: 45px; overflow: hidden; border-radius: 3px; background: #e9e7e2; border: 1px solid var(--sl-line-2); }
.sl-page .sl-mthumb img { width: 100%; height: 100%; object-fit: contain; }
.sl-page .sl-mthumb-code { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; background: repeating-linear-gradient(135deg, rgba(255,255,255,.03) 0 6px, transparent 6px 12px), #191b1a; color: var(--sl-text-3); font-size: 11px; font-weight: 700; letter-spacing: .04em; }
.sl-page table.sl-rowlink tr.has-link:hover .sl-mthumb { border-color: var(--sl-accent); }
.sl-page table.sl-table tr.is-current .sl-mthumb { border-color: var(--sl-line-accent); }
.sl-page table.sl-table td .sl-mcell { vertical-align: middle; }
.sl-page .sl-gf-tile.is-main .sl-ph { padding-bottom: 56px; }
.sl-page .sl-gf-tile.is-main .sl-ph-brief { display: none; }
.sl-page .sl-table-thumbs td { vertical-align: middle; }
.sl-lb .sl-ph { position: absolute; inset: 0; display: flex; flex-direction: column; justify-content: flex-end; gap: 6px; padding: 24px; background: repeating-linear-gradient(135deg, rgba(255,255,255,.025) 0 12px, transparent 12px 24px), linear-gradient(160deg, #1d201f, #121413); border: 1px dashed rgba(184,138,74,.35); font-family: Inter, system-ui, sans-serif; }
.sl-lb .sl-ph-tag { color: #b88a4a; font-size: 11px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.sl-lb .sl-ph-file { color: #f1ede6; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 13px; }
.sl-lb .sl-ph-brief { color: #8d877d; font-size: 13px; line-height: 1.5; max-width: 640px; }
.sl-lb .sl-figure { position: relative; overflow: hidden; background: #121413; }
/* five-photo layout: main photo + 2×2 thumbnails; thumbnails show the whole product or drawing (no crop) */
.sl-page .sl-gf:has(.sl-gf-side[style*="--n:4"]) { grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); }
.sl-page .sl-gf-side[style*="--n:4"] { grid-template-rows: repeat(2, minmax(0, 1fr)); grid-template-columns: repeat(2, minmax(0, 1fr)); }
.sl-page .sl-gf-tile.is-thumb img { object-fit: contain; background: #e9e7e2; }
.sl-page .sl-gf-tile.is-thumb:hover img { transform: none; }
@media (max-width: 760px) {
  .sl-page .sl-gf:has(.sl-gf-side[style*="--n:4"]) { grid-template-columns: minmax(0, 1fr); }
  .sl-page .sl-gf-side[style*="--n:4"] { grid-template-rows: none; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
  .sl-page .sl-gf-side[style*="--n:4"] .sl-ph-tag { font-size: 8px; letter-spacing: .06em; }
}
/* captions never cover the photo: main caption sits below it; thumbnails show theirs in the viewer */
.sl-page .sl-gf-main { display: flex; flex-direction: column; gap: 10px; }
.sl-page .sl-gf-main .sl-gf-tile { height: auto; }
.sl-page p.sl-gf-cap { position: static; margin: 0; padding: 0; background: none; font-size: 13.5px; line-height: 1.45; color: var(--sl-text-3); }
.sl-page .sl-gf-side { align-self: start; }
.sl-page .sl-gf-side[style*="--n:4"] .sl-gf-tile { aspect-ratio: 1 / 1; height: auto; }
.sl-page .sl-gf-side[style*="--n:3"] .sl-gf-tile { aspect-ratio: auto; }
/* thumbnail labels: top-left chip in the empty band on desktop, one word below the tile on phones */
.sl-page .sl-gf-item { position: relative; min-width: 0; }
.sl-page .sl-gf-label { position: absolute; top: 8px; left: 8px; z-index: 3; max-width: calc(100% - 52px); padding: 3px 8px; border-radius: 3px; background: rgba(14,16,15,.82); color: #f1ede6; font-size: 11.5px; font-weight: 600; line-height: 1.35; letter-spacing: .01em; pointer-events: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sl-page .sl-gf-label-s { display: none; }
.sl-page .sl-gf-item:hover .sl-gf-label { background: #b88a4a; color: #0b0c0c; }
@media (max-width: 760px) {
  .sl-page .sl-gf-label { position: static; display: block; max-width: none; margin-top: 5px; padding: 0; background: none; color: var(--sl-text-3); font-size: 11px; font-weight: 500; text-align: center; }
  .sl-page .sl-gf-item:hover .sl-gf-label { background: none; color: var(--sl-text-3); }
  .sl-page .sl-gf-label-l { display: none; }
  .sl-page .sl-gf-label-s { display: inline; }
}
.sl-page .sl-gf-item .sl-gf-tile.is-thumb .sl-ph { justify-content: flex-end; padding: 10px 12px; }
/* viewer keeps the photo's own ratio on short windows: width follows the available height */
.sl-lb-stage .sl-figure { max-height: none; width: min(100%, calc((100vh - 140px) * (var(--ratio, 3 / 2)))); }
@media (max-width: 640px) { .sl-lb-stage .sl-figure { width: min(100%, calc((100vh - 160px) * (var(--ratio, 3 / 2)))); } }
/* four-photo layout (main + 3 thumbnails stacked): thumbnails share the main photo's height */
.sl-page .sl-gf-side[style*="--n:3"] { align-self: stretch; grid-template-rows: repeat(3, minmax(0, 1fr)); }
.sl-page .sl-gf-side[style*="--n:3"] .sl-gf-item { height: 100%; min-height: 0; }
.sl-page .sl-gf-side[style*="--n:3"] .sl-gf-item .sl-gf-tile { height: 100%; }
@media (max-width: 760px) {
  .sl-page .sl-gf-side[style*="--n:3"] { grid-template-rows: none; }
  .sl-page .sl-gf-side[style*="--n:3"] .sl-gf-item, .sl-page .sl-gf-side[style*="--n:3"] .sl-gf-item .sl-gf-tile { height: auto; }
}
@media (max-width: 760px) { .sl-page .sl-gf-side[style*="--n:3"] .sl-gf-item .sl-gf-tile { aspect-ratio: 1 / 1; } }
/* four-photo layout: labels sit under each thumbnail, never on the photo */
@media (min-width: 761px) {
  .sl-page .sl-gf-side[style*="--n:3"] .sl-gf-item { display: flex; flex-direction: column; gap: 6px; }
  .sl-page .sl-gf-side[style*="--n:3"] .sl-gf-item .sl-gf-tile { flex: 1 1 auto; height: auto; min-height: 0; }
  .sl-page .sl-gf-side[style*="--n:3"] .sl-gf-label { position: static; max-width: none; padding: 0; background: none; color: var(--sl-text-3); font-weight: 500; font-size: 12.5px; }
  .sl-page .sl-gf-side[style*="--n:3"] .sl-gf-item:hover .sl-gf-label { background: none; color: var(--sl-accent-2); }
}

/* Option picker (<!-- picker: Question -->): chips switch answer panels; without JS every panel shows */
.sl-picker { margin-top: 8px; }
.sl-page .sl-picker-q { margin: 0 0 14px; font-size: 13px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--sl-accent-2); }
.sl-picker-chips { display: none; grid-template-columns: repeat(var(--cols, var(--n, 4)), minmax(0, 1fr)); gap: 10px; margin-bottom: 14px; }
.sl-picker.is-ready .sl-picker-chips { display: grid; }
.sl-picker-chip { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; padding: 16px 18px 15px; text-align: left; cursor: pointer;
  font: inherit; color: var(--sl-text); background: var(--sl-bg-2); border: 1px solid var(--sl-line); border-radius: 4px;
  transition: border-color .2s, background-color .2s, transform .2s; }
.sl-picker-chip:hover { border-color: var(--sl-line-accent); transform: translateY(-1px); }
.sl-picker-chip:focus-visible { outline: 2px solid var(--sl-accent-2); outline-offset: 2px; }
.sl-picker-name { position: relative; padding-left: 20px; font-size: 15px; font-weight: 600; line-height: 1.3; }
.sl-picker-name::before { content: ""; position: absolute; left: 0; top: .2em; width: 12px; height: 12px; border: 1.5px solid var(--sl-text-3); border-radius: 50%; transition: border-color .2s, box-shadow .2s, background-color .2s; }
.sl-picker-chip small { padding-left: 20px; font-size: 12.5px; line-height: 1.35; color: var(--sl-text-3); }
.sl-picker-chip.is-active { border-color: var(--sl-accent); background: linear-gradient(180deg, rgba(184, 138, 74, .16), rgba(184, 138, 74, .05)); }
.sl-picker-chip.is-active .sl-picker-name::before { border-color: var(--sl-accent-2); background: var(--sl-accent-2); box-shadow: inset 0 0 0 2.5px var(--sl-bg-2); }
.sl-picker-chip.is-active small { color: var(--sl-text-2); }
.sl-picker-panels { display: grid; gap: 14px; }
.sl-picker-panel { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.4fr); gap: clamp(20px, 3vw, 44px); padding: clamp(22px, 3vw, 34px);
  background: linear-gradient(180deg, var(--sl-bg-2), var(--sl-bg-1)); border: 1px solid var(--sl-line-2); border-top: 2px solid var(--sl-accent); border-radius: 4px; }
.sl-picker.is-ready .sl-picker-panel { animation: sl-picker-in .28s ease both; }
.sl-picker-panel[hidden] { display: none; }
@keyframes sl-picker-in { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
.sl-page .sl-picker-panel-head .sl-kicker { margin-bottom: 10px; }
.sl-page .sl-picker-panel-head h3 { font-family: var(--sl-display); font-weight: 400; font-size: clamp(22px, 2vw, 28px); line-height: 1.2; }
.sl-picker-body > * + * { margin-top: 14px; }
.sl-page .sl-picker-body p { margin: 0; }
.sl-page .sl-picker-body ul.sl-list { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--sl-line-2); }
.sl-page .sl-picker-body ul.sl-list li { display: grid; grid-template-columns: 118px minmax(0, 1fr); gap: 12px; margin: 0; padding: 11px 0; border-bottom: 1px solid var(--sl-line-2); }
.sl-page .sl-picker-body ul.sl-list li::before { display: none; }
.sl-page .sl-picker-body ul.sl-list strong { color: var(--sl-text); font-weight: 600; }
@media (prefers-reduced-motion: reduce) { .sl-picker.is-ready .sl-picker-panel { animation: none; } .sl-picker-chip { transition: none; } }
@media (max-width: 900px) {
  .sl-picker-chips { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sl-picker-chip:last-child:nth-child(odd) { grid-column: 1 / -1; }
  .sl-picker-panel { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .sl-picker-chip { padding: 13px 14px 12px; }
  .sl-picker-name { font-size: 14px; }
  .sl-page .sl-picker-body ul.sl-list li { grid-template-columns: 1fr; gap: 2px; }
}

/* ---- FAQ finder (Support FAQ) ---- */
.sl-page .sl-faqfind[hidden], .sl-page [data-ff-sec][hidden], .sl-page .sl-faq details[hidden] { display: none; }
.sl-page .sl-faqfind { gap: 14px; }
.sl-page .sl-faqfind .sl-pf-label { padding-top: 0; }
.sl-page .sl-input, .sl-page .sl-field input, .sl-page .sl-field select, .sl-page .sl-field textarea {
  width: 100%; box-sizing: border-box; min-height: 46px; padding: 11px 14px; margin: 0; border: 1px solid var(--sl-line); border-radius: 3px;
  background: var(--sl-bg-0); color: var(--sl-text); font-family: var(--sl-body); font-size: 16px; line-height: 1.4; }
.sl-page .sl-input:focus, .sl-page .sl-field input:focus, .sl-page .sl-field select:focus, .sl-page .sl-field textarea:focus { outline: none; border-color: var(--sl-accent); box-shadow: 0 0 0 3px rgba(184, 138, 74, .2); }
.sl-page .sl-input::placeholder { color: var(--sl-text-3); }
.sl-page .sl-ff-sec + .sl-section { border-top: 0; }

/* ---- Inquiry form (Contact) ---- */
.sl-page .sl-form { display: grid; gap: 26px; padding: 30px 32px; background: linear-gradient(160deg, var(--sl-bg-2), var(--sl-bg-1)); border: 1px solid var(--sl-line-2); border-top: 2px solid var(--sl-accent); border-radius: 4px; scroll-margin-top: 90px; }
.sl-page .sl-form-top { display: grid; gap: 12px; }
.sl-page .sl-form-top .sl-pf-label { padding-top: 0; }
.sl-page .sl-form-hints { min-height: 26px; }
.sl-page .sl-form-hint { margin: 0; font-size: 15px; }
.sl-page .sl-form-hint[hidden] { display: none; }
.sl-page .sl-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 20px; }
.sl-page .sl-field { display: grid; gap: 6px; }
.sl-page .sl-field > span { color: var(--sl-text); font-size: 14px; font-weight: 500; }
.sl-page .sl-field em { color: var(--sl-accent-2); font-style: normal; }
.sl-page .sl-field-wide { grid-column: 1 / -1; }
.sl-page .sl-field textarea { min-height: 140px; resize: vertical; }
.sl-page .sl-field input[type=file] { padding: 9px 12px; color: var(--sl-text-2); }
.sl-page .sl-form-note { margin: 0 0 18px; padding: 10px 14px; border: 1px dashed var(--sl-line); border-radius: 3px; color: var(--sl-text-3); font-size: 13px; }
.sl-page .sl-form-mock button.sl-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 46px; margin-top: 22px; padding: 12px 26px; border: 1px solid var(--sl-accent); border-radius: 2px; background: var(--sl-accent); color: #0b0d0e; font-family: var(--sl-body); font-size: 14px; font-weight: 600; cursor: pointer; }
.sl-page .sl-form-plugin { min-height: 40px; }
@media (max-width: 640px) {
  .sl-page .sl-form { padding: 22px 18px; }
  .sl-page .sl-form-grid { grid-template-columns: 1fr; }
}
.sl-page .sl-linkbtn { appearance: none; padding: 0; margin: 0; border: 0; background: none; color: var(--sl-accent-2); font: inherit; cursor: pointer; text-decoration: underline; text-underline-offset: 3px; }
.sl-page .sl-linkbtn[hidden], .sl-page .sl-faqfind .sl-wb-clear[hidden] { display: none; }
.sl-page .sl-faqfind .sl-pf-actions { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; }

/* Card titles under a group heading are H4 (H2 section > H3 group > H4 card); same look as H3 card titles. */
.sl-page h4 { margin: 0; color: var(--sl-text); letter-spacing: 0; text-transform: none; font-family: var(--sl-body); font-weight: 600; }
.sl-page .sl-route h4 { font-size: 19px; line-height: 1.3; }
@media (max-width: 640px) { .sl-page .sl-route.has-photo h4 { font-size: 17px; } }

/* ---------- Resource articles (layout: article) ----------
   Dark site header, hero, closing band and footer; the article itself sits on a light reading surface. */
.sl-page .sl-hero.sl-hero-article { min-height: 0; display: block; padding: clamp(40px, 5vw, 64px) 0 clamp(36px, 4vw, 52px); }
.sl-page .sl-article-hero { position: relative; z-index: 2; max-width: 900px; }
.sl-page .sl-article-hero h1 { font-size: clamp(32px, 4vw, 50px); line-height: 1.12; margin-top: 10px; }
.sl-page .sl-article-meta { margin: 18px 0 0; color: var(--sl-text-3); font-size: 14px; }
.sl-page .sl-article-meta a { color: var(--sl-accent-2); text-decoration: none; border-bottom: 1px solid var(--sl-line-accent); }
/* light reading surface: the page tokens are redefined inside this section */
.sl-page .sl-section.sl-article-sec {
  --sl-text: #1f211f; --sl-text-2: #333632; --sl-text-3: #626660;
  --sl-line: rgba(31, 33, 31, .16); --sl-line-2: rgba(31, 33, 31, .09); --sl-bg-2: #f6f4ee;
  --sl-link: #7a5420; --sl-max: 1320px;
  background: #f3f2ee; color: var(--sl-text-2); padding-top: clamp(32px, 4vw, 56px); padding-bottom: var(--sl-space-l);
}
.sl-page .sl-article-grid { display: grid; grid-template-columns: 272px minmax(0, 1fr); gap: 48px; align-items: start; }
.sl-page .sl-toc { position: sticky; top: 132px; max-height: calc(100vh - 156px); overflow: auto; padding: 4px 8px 4px 0; scrollbar-width: thin; }
.sl-page .sl-toc-title { margin: 0 0 12px; color: var(--sl-text-3); font-size: 12px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.sl-page .sl-toc ol, .sl-page .sl-toc-m ol { list-style: none; margin: 0; padding: 0; }
.sl-page .sl-toc > nav > ol, .sl-page .sl-toc-m nav > ol { border-left: 1px solid var(--sl-line); }
.sl-page .sl-toc li, .sl-page .sl-toc-m li { margin: 0; padding: 0; font-size: inherit; line-height: inherit; }
.sl-page .sl-toc a, .sl-page .sl-article .sl-toc-m a { display: grid; grid-template-columns: 24px 1fr; gap: 4px; margin-left: -1px; padding: 7px 0 7px 14px; border: 0; border-left: 2px solid transparent; color: #4a4d48; font-size: 14.5px; line-height: 1.45; text-decoration: none; }
.sl-page .sl-toc a:hover, .sl-page .sl-article .sl-toc-m a:hover { color: var(--sl-text); }
.sl-page .sl-toc a.is-active { color: var(--sl-text); font-weight: 600; border-left-color: var(--sl-accent); }
.sl-page .sl-toc-n { color: #8a6328; font-weight: 600; font-variant-numeric: tabular-nums; }
.sl-page .sl-toc .sl-toc-sub { display: none; margin: 0 0 6px; }
.sl-page .sl-toc li.is-open > .sl-toc-sub { display: block; }
.sl-page .sl-toc .sl-toc-sub a { grid-template-columns: 1fr; padding: 4px 0 4px 52px; font-size: 13.5px; color: var(--sl-text-3); }
.sl-page .sl-toc .sl-toc-sub a.is-active { font-weight: 500; color: var(--sl-text); border-left-color: transparent; }
.sl-page .sl-toc-m { display: none; margin: 0 0 28px; border: 1px solid var(--sl-line); border-radius: 4px; background: #fff; }
.sl-page .sl-toc-m summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center; padding: 14px 16px; color: var(--sl-text); font-weight: 600; font-size: 15px; }
.sl-page .sl-toc-m summary::-webkit-details-marker { display: none; }
.sl-page .sl-toc-m summary span { color: var(--sl-text-3); font-weight: 400; font-size: 13px; }
.sl-page .sl-toc-m summary::after { content: "+"; color: var(--sl-accent); font-size: 22px; line-height: 1; margin-left: 12px; }
.sl-page .sl-toc-m[open] summary::after { content: "\2212"; }
.sl-page .sl-toc-m nav { padding: 0 16px 14px; }
.sl-page .sl-toc-m .sl-toc-sub { display: none; }
/* article surface and type */
.sl-page .sl-article { min-width: 0; max-width: 900px; padding: clamp(32px, 4vw, 56px); background: #fffefa; border: 1px solid rgba(31, 33, 31, .07); border-radius: 4px; box-shadow: 0 1px 2px rgba(31, 33, 31, .04); color: var(--sl-text-2); }
.sl-page .sl-article p, .sl-page .sl-article li { color: var(--sl-text-2); font-size: 17px; line-height: 1.75; }
.sl-page .sl-article > p, .sl-page .sl-article > ul, .sl-page .sl-article > ol { margin: 0 0 18px; }
.sl-page .sl-article p + p { margin-top: 0; }
.sl-page .sl-article ul, .sl-page .sl-article ol { padding-left: 22px; }
.sl-page .sl-article li { margin: 0 0 8px; }
.sl-page .sl-article li::marker { color: var(--sl-accent); }
.sl-page .sl-article strong { color: var(--sl-text); font-weight: 600; }
.sl-page .sl-article a { color: var(--sl-link); text-decoration: underline; text-decoration-color: rgba(122, 84, 32, .4); text-underline-offset: 3px; border: 0; }
.sl-page .sl-article a:hover { text-decoration-color: currentColor; }
.sl-page .sl-article h2 { max-width: none; margin: 40px 0 16px; padding-top: 20px; border-top: 1px solid var(--sl-line-2); color: var(--sl-text); font-size: clamp(25px, 2.3vw, 31px); line-height: 1.2; scroll-margin-top: 128px; }
.sl-page .sl-article > h2:first-of-type { margin-top: 32px; }
.sl-page .sl-article h3 { margin: 28px 0 10px; color: var(--sl-text); font-family: var(--sl-body); font-size: 19px; font-weight: 600; line-height: 1.35; scroll-margin-top: 128px; }
.sl-page .sl-article .sl-table-wrap { margin: 8px 0 26px; overflow-x: auto; }
.sl-page .sl-article .sl-table th { color: var(--sl-text-3); }
.sl-page .sl-article .sl-table td { color: var(--sl-text-2); font-size: 15px; line-height: 1.55; }
.sl-page .sl-article .sl-table td:first-child { color: var(--sl-text); }
.sl-page .sl-article .sl-table tr:hover td { background: rgba(184, 138, 74, .05); }
.sl-page .sl-article blockquote { margin: 0 0 22px; padding: 4px 0 4px 20px; border-left: 2px solid var(--sl-accent); }
.sl-page .sl-article blockquote p { margin: 0 0 10px; color: var(--sl-text); }
.sl-page .sl-article blockquote p:last-child { margin-bottom: 0; }
.sl-page .sl-article pre { margin: 0 0 22px; padding: 16px 18px; overflow-x: auto; background: #f4f2ec; border: 1px solid var(--sl-line-2); border-radius: 4px; font-size: 14px; line-height: 1.55; }
.sl-page .sl-article code { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: .9em; color: var(--sl-text); }
.sl-page .sl-article p.sl-related { display: flex; flex-wrap: wrap; gap: 4px 12px; align-items: baseline; margin: 2px 0 22px; padding: 12px 16px; background: #f7f4ec; border: 1px solid var(--sl-line-2); border-left: 3px solid var(--sl-accent); border-radius: 0 4px 4px 0; font-size: 15.5px; line-height: 1.5; }
.sl-page .sl-related-label { color: var(--sl-text-3); font-size: 11.5px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.sl-page .sl-apply { margin: 6px 0 26px; padding: 22px 24px; background: #fbf6ea; border: 1px solid rgba(184, 138, 74, .45); border-left: 3px solid var(--sl-accent); border-radius: 0 4px 4px 0; }
.sl-page .sl-apply-title { margin: 0 0 10px; color: #7a5420; font-size: 12px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.sl-page .sl-article .sl-apply p, .sl-page .sl-article .sl-apply li { font-size: 16px; line-height: 1.65; }
.sl-page .sl-apply p, .sl-page .sl-apply ul, .sl-page .sl-apply .sl-table-wrap { margin: 0 0 12px; }
.sl-page .sl-apply > :last-child { margin-bottom: 0; }
.sl-page .sl-article .sl-apply .sl-table td, .sl-page .sl-article .sl-apply .sl-table th { padding-top: 9px; padding-bottom: 9px; font-size: 14.5px; }
.sl-page .sl-article-faq { max-width: none; margin-top: 8px; }
.sl-page .sl-article-faq summary h3 { margin: 0; font-size: 17px; }
.sl-page .sl-article-faq .sl-faq-a { padding-right: 0; }
.sl-page .sl-article .sl-article-faq .sl-faq-a p { margin: 0 0 12px; font-size: 16.5px; }
.sl-page .sl-refs { margin: 0; padding-left: 22px; }
.sl-page .sl-article .sl-refs li { margin-bottom: 10px; color: var(--sl-text-3); font-size: 14.5px; line-height: 1.6; }
.sl-page .sl-article .sl-refs a { color: var(--sl-text-2); }
@media (max-width: 1100px) {
  .sl-page .sl-article-grid { grid-template-columns: minmax(0, 1fr); }
  .sl-page .sl-toc { display: none; }
  .sl-page .sl-toc-m { display: block; }
  .sl-page .sl-article { width: 100%; max-width: 860px; margin: 0 auto; }
}
@media (max-width: 640px) {
  .sl-page .sl-section.sl-article-sec { background: #fffefa; padding-top: 24px; }
  .sl-page .sl-article { padding: 0; border: 0; box-shadow: none; background: transparent; }
  .sl-page .sl-article p, .sl-page .sl-article li { font-size: 16.5px; line-height: 1.7; }
  .sl-page .sl-article h2 { margin-top: 34px; padding-top: 18px; }
  .sl-page .sl-apply { padding: 18px; }
  /* comparison tables (4+ columns) keep their columns and scroll sideways */
  .sl-page .sl-article .sl-table-x { overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .sl-page .sl-article .sl-table-x .sl-table { display: table; width: auto; min-width: 640px; }
  .sl-page .sl-article .sl-table-x thead { display: table-header-group; }
  .sl-page .sl-article .sl-table-x tbody { display: table-row-group; }
  .sl-page .sl-article .sl-table-x tr { display: table-row; padding: 0; }
  .sl-page .sl-article .sl-table-x td, .sl-page .sl-article .sl-table-x th { display: table-cell; width: auto; padding: 10px 14px 10px 0; border-bottom: 1px solid var(--sl-line-2); font-size: 14px; }
  .sl-page .sl-article .sl-table-x td[data-label]:not(:first-child)::before { content: none; }
  .sl-page .sl-article .sl-swipe.is-on { display: block; }
}
/* swipe cue for comparison tables: hidden unless the script finds real overflow */
.sl-page .sl-article .sl-swipe { display: none; margin: 0 0 6px; color: var(--sl-text-3); font-size: 13px; text-align: right; }
.sl-page .sl-article .sl-swipe.is-on { display: block; }
.sl-page .sl-article .sl-table-x:focus-visible { outline: 2px solid var(--sl-accent); outline-offset: 2px; }
/* images and image slots inside articles: light placeholder on the reading surface */
.sl-page .sl-article .sl-figure { margin: 6px 0 28px; border-radius: 4px; overflow: hidden; }
.sl-page .sl-article .sl-ph { background: repeating-linear-gradient(135deg, rgba(184, 138, 74, .07) 0 12px, transparent 12px 24px), #f4f1e9; border: 1px dashed rgba(184, 138, 74, .6); }
.sl-page .sl-article .sl-ph-tag { color: #7a5420; }
.sl-page .sl-article .sl-ph-file { color: #4a4d48; }
.sl-page .sl-article .sl-ph-brief { color: #626660; font-size: 12.5px; }
@media (max-width: 640px) { .sl-page .sl-article .sl-ph-brief { display: -webkit-box; -webkit-line-clamp: 5; -webkit-box-orient: vertical; overflow: hidden; } }
/* figures with a public caption (articles: "Illustrative diagram …") */
.sl-page .sl-figure-wrap { margin: 0; }
.sl-page .sl-article .sl-figure-wrap { margin: 6px 0 28px; }
.sl-page .sl-article .sl-figure-wrap .sl-figure { margin: 0; }
.sl-page .sl-figcap { margin-top: 10px; color: var(--sl-text-3); font-size: 13.5px; line-height: 1.5; }
.sl-page .sl-article .sl-related-multi { display: block; margin: 2px 0 22px; padding: 12px 16px; background: #f7f4ec; border: 1px solid var(--sl-line-2); border-left: 3px solid var(--sl-accent); border-radius: 0 4px 4px 0; }
.sl-page .sl-article .sl-related-multi ul { list-style: none; margin: 6px 0 0; padding: 0; }
.sl-page .sl-article .sl-related-multi li { margin: 0 0 4px; font-size: 15.5px; line-height: 1.5; }
.sl-page .sl-article .sl-related-multi li:last-child { margin-bottom: 0; }

/* ---------- Quality Documents hero: narrow desktop (October 27) ---------- */
@media (min-width: 861px) and (max-width: 1279px) {
  /* text and certificate side by side, so the certificate is never under the text */
  .sl-page .sl-hero:has([data-image-id="documents-hero"])::after { display: none; }
  .sl-page .sl-hero:has([data-image-id="documents-hero"]) > .sl-wrap { width: 100%; }
  .sl-page .sl-hero:has([data-image-id="documents-hero"]) .sl-split { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); gap: 32px; align-items: center; }
  .sl-page .sl-hero:has([data-image-id="documents-hero"]) .sl-split > div:first-child { max-width: none; padding: 56px 0; }
  .sl-page .sl-hero [data-image-id="documents-hero"] { position: relative; inset: auto; height: auto; aspect-ratio: 4 / 3; border-radius: 4px; overflow: hidden; }
}
@media (min-width: 1280px) {
  .sl-page .sl-hero:has([data-image-id="documents-hero"]) .sl-split > div:first-child { max-width: 580px; }
}

/* ---------- Full-width heroes on wide screens: hero content and photo held in a centered 1600px band ---------- */
@media (min-width: 1280px) {
  .sl-page .sl-hero:not(.sl-hero-model):not(.sl-hero-article) > .sl-wrap { width: min(1600px, calc(100% - 2 * var(--sl-edge))); padding-left: clamp(32px, 5vw, 96px); }
}
@media (min-width: 1601px) {
  .sl-page .sl-hero:not(.sl-hero-model):not(.sl-hero-article) .sl-figure,
  .sl-page .sl-hero:not(.sl-hero-model):not(.sl-hero-article)::after,
  .sl-page .sl-hero:not(.sl-hero-model):not(.sl-hero-article)::before { left: calc((100% - 1600px) / 2); right: calc((100% - 1600px) / 2); width: auto; }
  .sl-page .sl-hero:not(.sl-hero-model):not(.sl-hero-article) .sl-figure { -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 80px, #000 calc(100% - 80px), transparent 100%); mask-image: linear-gradient(90deg, transparent 0, #000 80px, #000 calc(100% - 80px), transparent 100%); }
}

/* ---------- Section bands: deep and slate textures alternate by position (October 27) ----------
   Textures are seamless 1024px tiles shown at 512px, so the grain stays fine at any section size.
   After the hero, sections alternate slate, deep, slate... whatever their sl-bg class, so two neighbours
   never share a shade. The hero, the CTA and the light article reading area keep their own backgrounds. */
.sl-page .sl-section:not(.sl-hero):not(.sl-cta):not(.sl-article-sec):nth-of-type(odd) {
  --sl-bg-2: rgba(14, 16, 22, .82); --sl-bg-3: rgba(22, 25, 33, .88);
  background: #050608 url("texture-deep-tile.jpg") 0 0 / 512px 512px repeat;
  border-top-color: rgba(255, 255, 255, .06);
}
.sl-page .sl-section:not(.sl-hero):not(.sl-cta):not(.sl-article-sec):nth-of-type(even) {
  --sl-text-2: #d6d2ca; --sl-text-3: #b3b0aa;
  --sl-bg-2: rgba(16, 19, 26, .62); --sl-bg-3: rgba(24, 28, 37, .75);
  --sl-line: rgba(255, 255, 255, .16); --sl-line-2: rgba(255, 255, 255, .10);
  background: #1b1f27 url("texture-slate-tile.jpg") 0 0 / 512px 512px repeat;
  border-top-color: rgba(255, 255, 255, .08);
}
.sl-page .sl-section:not(.sl-hero):not(.sl-cta):not(.sl-article-sec):nth-of-type(even) .sl-card:hover { box-shadow: 0 18px 40px rgba(0, 0, 0, .4); }
