/* Standard Series: the five models in one proportional line-up, the model rows, the checklist in two columns. */

/* the proof strip is partly words: a smaller line so each phrase stays whole */
.figwords .figband .figures dt { font-size: clamp(26px, 2.4vw, 44px); line-height: 1.05; letter-spacing: -0.03em; }
.figwords .figband .figures dd:empty { display: none; }
.figwords .figband .figures dt { white-space: normal; }

/* hero: five modules on one ground line, area by load */
.ss-line { margin: 0; padding: clamp(20px, 2.6vw, 40px) clamp(14px, 2vw, 28px) clamp(16px, 2vw, 26px); border: 1px solid var(--line); border-radius: 8px;
  background: radial-gradient(rgba(244, 247, 213, 0.07) 1px, transparent 1.3px) 0 0 / 22px 22px, var(--deep); }
.ss-line__row { position: relative; display: flex; align-items: flex-end; gap: clamp(6px, 1vw, 14px); }
.ss-line__row li { flex: var(--w) 1 0; min-width: 0; display: grid; grid-template-rows: auto 52px; }
.ss-line__row::after { content: ""; position: absolute; left: 0; right: 0; bottom: 52px; height: 1px; background: var(--line); }
.ss-line__art { padding-bottom: 10px; }
.ss-line__art svg { max-height: none; }
.ss-line__key { display: grid; gap: 4px; align-content: start; justify-items: center; padding-top: 12px; text-align: center; }
.ss-line__kw { font-size: clamp(14px, 1.3vw, 20px); font-weight: 300; letter-spacing: -0.02em; color: var(--lime); white-space: nowrap; }
.ss-line__key .mono { font-size: 10px; letter-spacing: 0.06em; text-transform: uppercase; color: var(--muted); white-space: nowrap; }

/* model rows */
.ss-models { margin-top: clamp(36px, 4vw, 64px); border-top: 1px solid var(--line); }
.ss-model { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(28px, 5vw, 96px); padding: clamp(32px, 4vw, 56px) 0; border-bottom: 1px solid var(--line); scroll-margin-top: 80px; }
.ss-model__side { display: grid; gap: 14px; align-content: start; }
.ss-model h3 { font-size: clamp(34px, 3.6vw, 56px); font-weight: 300; line-height: 1; letter-spacing: -0.045em; }
.ss-model__spec { font-size: 12px; line-height: 1.6; letter-spacing: 0.04em; color: #6f7a0e; }
.ss-model__art { width: calc(var(--w) * min(100%, 420px)); margin-top: 18px; }
.ss-model__art svg { max-height: none; }
.ss-model__body { font-size: 18px; color: var(--muted); }
.ss-model__body .rich { gap: 0; }
.ss-model__body .rich p:first-child { padding-bottom: 22px; }
.ss-model__body .rich p + p { padding: 14px 0; border-top: 1px solid var(--line); font-size: 16px; }

/* the checklist: two columns of ticks */
.ss-bring { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(28px, 5vw, 96px); align-items: start; }
.ss-bring .ticks { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 32px; }
.ss-bring .ticks li:nth-last-child(2) { border-bottom: 1px solid var(--line); }
.ss-bring .after { margin-top: clamp(28px, 3vw, 44px); }

@media (max-width: 900px) {
  .ss-model, .ss-bring { grid-template-columns: 1fr; }
  .ss-model__art { width: calc(var(--w) * min(100%, 300px)); }
}
@media (max-width: 600px) {
  .ss-line__row { display: grid; gap: 6px; }
  .ss-line__row::after { display: none; }
  .ss-line__row li { grid-template-rows: none; grid-template-columns: minmax(0, 1fr) 84px; align-items: end; border-bottom: 1px solid var(--line); }
  .ss-line__art { width: calc(var(--w) * 78%); padding-bottom: 6px; }
  .ss-line__key { justify-items: start; text-align: left; padding: 0 0 8px; }
  .ss-bring .ticks { grid-template-columns: 1fr; }
  .ss-bring .ticks li:nth-last-child(2) { border-bottom: 0; }
}

/* model cutaways (the ModulEdge catalog renders in the site's palette) on a dark plate inside the light section */
.ss-model__shot { margin: 18px 0 0; padding: clamp(16px, 2vw, 28px); border-radius: 6px; background: var(--green); }
.ss-model__shot img { display: block; width: 100%; height: auto; }
.ss-model__shot--pm { margin-top: 10px; width: 72%; }
.ss-model__shot figcaption { margin-top: 10px; font-size: 11px; letter-spacing: 0.06em; color: rgba(244, 247, 213, 0.66); }
@media (max-width: 900px) { .ss-model__shot--pm { width: 100%; } }