/* «Корпуси» (/druk-korpusiv/) і 4 підсторінки (inc/redesign-enclosures-data.php): картки видів корпусів і приклади з цінами.
   Пишеться руками, не порт макета (services.css генерує services-port.py); ті самі токени й радіуси, що в картках послуг. */

/* Картки підсторінок на «Корпусах» — як «Що можна замовити» на головній послуг, але 4 в ряд */
.svc-kids .svc { grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr)); }

/* Приклади з цінами */
.ex-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.875rem; margin: 0; padding: 0; list-style: none; }
.ex { display: grid; grid-template-rows: auto 1fr; padding: 0.875rem; border-radius: 1.625rem; background: var(--paper); }
.ex img { width: 100%; height: auto; border-radius: 1.125rem; }
.ex__b { display: grid; align-content: start; gap: 0.5rem; padding: 0.875rem 0.375rem 0.375rem; }
.ex__tag { justify-self: start; padding: 0.25rem 0.625rem; border-radius: 62.4375rem; background: var(--r-tech); color: #fff; font-size: 0.75rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.ex h3 { margin: 0; font: 800 1.3125rem/1.15 var(--display); letter-spacing: -.02em; text-wrap: balance; }
.ex__n { color: var(--muted); font-weight: 600; letter-spacing: 0; }
.ex__b > p { margin: 0; color: var(--muted); font-size: 0.9375rem; line-height: 1.5; }
.ex__dl { display: grid; grid-template-columns: repeat(3, minmax(0, auto)); justify-content: start; gap: 0 1.25rem; margin: 0.25rem 0 0; padding-top: 0.625rem; border-top: 1px solid var(--line); }
.ex__dl dt { color: var(--muted); font-size: 0.75rem; letter-spacing: .04em; }
.ex__dl dd { margin: 0; font-size: 0.9375rem; font-weight: 600; font-variant-numeric: tabular-nums; }
.ex__b > .ex__p { margin-top: 0.25rem; color: var(--ink); font-size: 0.9375rem; }
.ex__p b { font: 900 1.75rem/1 var(--display); letter-spacing: -.03em; }
.ex__p small { color: var(--muted); font-size: 0.875rem; }
.ex__b > .ex__min { font-size: 0.875rem; }
.ex-cta { display: flex; flex-wrap: wrap; align-items: center; gap: 0.75rem 0.625rem; margin-top: 1.25rem; }
.ex-cta p { flex: 1 1 100%; margin: 0; color: var(--muted); }

@media (max-width: 1000px) { .ex-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) {
  .ex-grid { grid-template-columns: minmax(0, 1fr); }
  .ex__dl { grid-template-columns: repeat(2, minmax(0, auto)); gap: 0.375rem 1.25rem; } /* на телефоні розмір — окремим рядком, не переноситься */
  .ex__dl div:first-child { grid-column: 1 / -1; }
}

/* Блок нашого виробу на підсторінці (Starlink): назва — посилання на варіант на сторінці виробу */
.ex h3 a { color: inherit; text-decoration: none; }
.ex h3 a:hover { text-decoration: underline; text-decoration-color: var(--accent); text-underline-offset: 0.1875rem; }
.ex > a img { display: block; }

/* «Не знайшли свій варіант?» — остання картка в сітці (flavor_rd_ask_card, 01.11.2026): помаранчева, як «Своя ідея», темний текст в обох темах.
   Сама в рядку — на всю ширину, з другою в рядку — на дві колонки; широка — текст ліворуч, перелік і кнопки праворуч */
.pr-ask { container-type: inline-size; grid-template-rows: none; align-content: center; padding: clamp(1.25rem, 2.5vw, 2rem); background: var(--accent); color: #1A0A02; }
.pr-ask__in { display: grid; gap: 1.25rem; }
@container (min-width: 36rem) { .pr-ask__in { grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: 1rem 2.5rem; align-items: center; } }
.pr-ask__i { display: block; width: 2.5rem; height: 2.5rem; margin-bottom: 0.75rem; }
.pr-ask h3 { margin: 0; font: 900 clamp(1.625rem, 2.4vw, 2.375rem)/1.02 var(--display); letter-spacing: -.03em; color: inherit; text-wrap: balance; }
.pr-ask p { margin: 0.625rem 0 0; color: inherit; opacity: .88; line-height: 1.5; }
.pr-ask ul { margin: 0 0 1rem; padding-left: 1.125rem; font-weight: 600; line-height: 1.5; }
.pr-ask__b { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem; }
.pr-ask .pr-ask__form { background: #13110E; color: #F1EBE1; border-color: #13110E; }
.pr-ask .pr-ask__form:hover { background: #2A2520; color: #F1EBE1; }
.pr-ask .pr-ask__alt { background: none; color: #1A0A02; border: 1.5px solid #1A0A02; }
.pr-ask .pr-ask__alt:hover { background: rgb(26 10 2 / .08); }
.pr-ask .pr-ask__s { margin-top: 0.75rem; font-size: 0.875rem; opacity: .8; }
@media (min-width: 1001px) {
  .ex-grid > .pr-ask:nth-child(3n+1) { grid-column: 1 / -1; }
  .ex-grid > .pr-ask:nth-child(3n+2) { grid-column: span 2; }
}
@media (min-width: 641px) and (max-width: 1000px) { .ex-grid > .pr-ask:nth-child(2n+1) { grid-column: 1 / -1; } }
