/* ============================================================
   blocks.css — Styles for block snippets (.block--*).
   Foundation blocks: hero, text, image (existing).
   New blocks come in Phase 2 (product-hero, info-boxy, pudorys,
   vybaveni, varianty, inquiry-form, domky-featured, about, step).
   ============================================================ */

/* ----- Generic block wrapper ----- */
.block {
  padding-block: var(--space-9);   /* 10rem mezi sekcemi (per Figma) */
}
.block + .block {
  padding-top: 0;
}

/* ----- Foundation: hero ----- */
.block--hero { padding-block: var(--space-9); }
.block--hero .hero__inner {
  display: flex;
  flex-direction: column;
  gap: var(--space-5);
}
.block--hero--center .hero__inner { align-items: center; text-align: center; }
.block--hero--left   .hero__inner { align-items: flex-start; text-align: left; }

.block--hero .hero__title {
  font-size: var(--font-size-h1);
  font-weight: 600;
  line-height: var(--lh-tight);
}
.block--hero--display .display-headline { max-width: 18ch; }
.block--hero .hero__subtitle {
  font-size: var(--font-size-h4);
  color: var(--color-muted);
  max-width: 70ch;
}
.block--hero .hero__image-wrap {
  margin: 0;
  border-radius: var(--radius-main);
  overflow: hidden;
  width: 100%;
  aspect-ratio: 16 / 9;
}
.block--hero .hero__image { width: 100%; height: 100%; object-fit: cover; }
.block--hero .hero__cta {
  margin-top: var(--space-3);
}

/* ----- Foundation: text ----- */
.block--text .block__text-inner {
  max-width: 80ch;
  font-size: var(--font-size-body);
  line-height: var(--lh-loose);
}
.block--text .block__text-inner > * + * {
  margin-top: 1em;
}
.block--text .block__text-inner h2,
.block--text .block__text-inner h3 {
  margin-top: 2em;
}

/* ----- Foundation: image ----- */
.block--image figure {
  margin: 0;
  border-radius: var(--radius-main);
  overflow: hidden;
}
.block--image figcaption {
  font-size: var(--font-size-small);
  color: var(--color-muted);
  margin-top: var(--space-3);
  text-align: center;
}

/* ============================================================
   Section headline (used by product blocks)
   ============================================================ */
.block-headline {
  text-align: center;
  font-size: var(--font-size-h2);
  font-weight: 600;
  margin-bottom: var(--space-7);
  letter-spacing: -0.01em;
}
.block-headline__accent { color: var(--color-accent); }
/* Wrapper pro zlatý štítek (.ribbon-pill) nad block-headline / formulářem */
.block-ribbon {
  display: flex;
  justify-content: center;
  margin-bottom: var(--space-5);   /* 20px — dostatečný dech od následujícího nadpisu */
}
/* Italic v adminu (`I` → *text*) → zlaté zvýraznění na FE (per pre-footer pattern) */
.block-headline em {
  font-style: normal;
  color: var(--color-accent);
}

/* ============================================================
   Product Hero block (Detail page top)
   ============================================================ */
.block--product-hero {
  padding-top: 10rem;             /* 100px odsazení od topbaru */
  padding-bottom: 10rem;          /* větší rozestup k další sekci (info-boxy) */
}
.product-hero__head {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(28rem, 1fr);
  gap: var(--space-7);
  align-items: end;
  margin-bottom: var(--space-7);
}
.product-hero__title {
  text-align: left;
  font-size: var(--font-size-h1);
  margin-bottom: var(--space-4);
}
.product-hero__subtitle,
.product-hero__subtitle p,
.product-hero__subtitle li {
  font-size: 2.1rem;             /* sjednoceno s home-about__body */
  color: var(--color-muted);
  max-width: 65rem;              /* ~650px — užší aby se zalamoval na ~2 řádky */
  line-height: 1.6;
}
/* Per Figma 19:2460 — žádný card, jen text price + ghost CTA, right aligned */
.product-hero__head-meta {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 1rem;                       /* 10px Figma */
}
.product-hero__price {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  text-align: right;
  width: 100%;
}
.product-hero__price-before {
  font-size: 2rem;                  /* ~20px Figma 264:2115 — menší než hlavní cena */
  font-weight: 500;
  color: #f1e9db;                        /* plná barva — průhlednost přes opacity, ať se čára nestáčí přes text */
  opacity: 0.5;
  line-height: 1.4;
  text-align: right;
  text-decoration: line-through;
}
.product-hero__price-value {
  font-size: 4.4rem;                /* 44px Figma 19:2081 */
  font-weight: 600;
  color: var(--color-accent);       /* gold */
  line-height: 5rem;                /* 50px */
  text-align: right;
}
.product-hero__price-meta {
  font-size: 1.4rem;                /* 14px Figma */
  color: var(--color-muted);
  text-align: right;
}
.product-hero__head-meta .btn {
  width: 21rem;                     /* 210px Figma */
}
.product-hero__image-wrap {
  border-radius: var(--radius-main);
  overflow: hidden;
  aspect-ratio: 1410 / 600;        /* per Figma 19:2454 */
  margin: 0;
  width: 100%;
}
.product-hero__image,
.product-hero__image-wrap picture {
  width: 100%;
  height: 100%;
  display: block;
}
.product-hero__image { object-fit: cover; }

@media (max-width: 1023px) {
  .block--product-hero { padding-top: var(--space-7); padding-bottom: var(--space-7); }
  .product-hero__head { grid-template-columns: 1fr; gap: var(--space-4); margin-bottom: var(--space-5); }
  .product-hero__subtitle,
  .product-hero__subtitle p,
  .product-hero__subtitle li { font-size: 1.3rem; line-height: 1.6; }
  .product-hero__subtitle { max-width: none; }
  .product-hero__price-value { font-size: 2.4rem; line-height: 1.2; }       /* z 44 → ~34px */
  .product-hero__price-before { font-size: 1.3rem; text-align: left; }
  .product-hero__price-meta { font-size: 0.85rem; }
  .product-hero__head-meta {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-4);
  }
  .product-hero__price { text-align: left; align-items: flex-start; width: auto; }
  .product-hero__price-value, .product-hero__price-meta { text-align: left; }
  .product-hero__head-meta .btn { width: auto; }
}

/* ============================================================
   Info boxy block (5-stat grid)
   ============================================================ */
.block--info-boxy { padding-bottom: 10rem; }   /* 100px — rozestup k další sekci (víc dechu před pudorys) */
@media (max-width: 1023px) {
  .block--info-boxy { padding-bottom: 60px; }
}
/* Step → info-boxy = větší dech (cca +30 % nad původní step gap 40px) */
.block--step + .block--info-boxy { padding-top: var(--space-4); }   /* 16px nad rámec gapu */
.info-boxy {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(20rem, 1fr));
  gap: var(--space-4);
}
.info-boxy__box {
  padding: 2rem;             /* 20px per Figma */
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2rem;                 /* 20px per Figma */
  text-align: center;
}
.info-boxy__icon-wrap {
  width: 3.6rem;             /* 36x36 per Figma Ico */
  height: 3.6rem;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--color-accent-subtle);  /* rgba(216,160,88,0.08) */
  border-radius: var(--radius-mini);
  color: var(--color-accent);
}
.info-boxy__icon-wrap .icon {
  width: 2.2rem;          /* +20 % oproti původním 1.8 */
  height: 2.2rem;
}
.info-boxy__text { display: flex; flex-direction: column; gap: 0; align-items: center; }
.info-boxy__label {
  font-size: 1.6rem;
  color: var(--color-muted);
  line-height: 1.6;
}
.info-boxy__value {
  font-size: 2rem;
  font-weight: 600;
  color: var(--color-fg);
  line-height: 1;
  margin-top: 0.5rem;
}

/* Tablet: 3 sloupce, kompaktnější padding + menší ikony / fonts */
@media (max-width: 1023px) {
  .info-boxy {
    grid-template-columns: 1fr 1fr 1fr;
    gap: var(--space-3);
  }
  .info-boxy__box {
    padding: var(--space-3);
    gap: var(--space-3);
  }
  .info-boxy__icon-wrap { width: 2.6rem; height: 2.6rem; }
  .info-boxy__icon-wrap .icon { width: 1.7rem; height: 1.7rem; }
  .info-boxy__value { font-size: 1.2rem; line-height: 1.2; }
  .info-boxy__label { font-size: 1.2rem; }
}
/* Mobil: 2 sloupce */
@media (max-width: 600px) {
  .info-boxy { grid-template-columns: 1fr 1fr; }
}

/* ============================================================
   Info boxy větší block (Figma 28:1609 — kroky/služby pattern)
   100×100 ikonový rámeček, caption nad nadpisem, žádný card-glass
   ============================================================ */
.info-boxy-large {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(20rem, 1fr));
  gap: var(--space-6);                /* 30px Figma */
}
.info-boxy-large__box {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-5);                /* 20px Figma — mezi ikonou a textem */
  text-align: center;
}
.info-boxy-large__icon-wrap {
  width: 10rem;                       /* 100px Figma */
  height: 10rem;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--color-accent-subtle);  /* rgba(216,160,88,0.08) */
  border-radius: var(--radius-mini);  /* 6px */
  color: var(--color-accent);         /* gold ikona */
}
.info-boxy-large__icon-wrap .icon {
  width: 5.8rem;                      /* +20 % oproti původním 4.8 (58 z 48) */
  height: 5.8rem;
}
.info-boxy-large__text {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;                        /* 5px Figma */
  align-items: center;
  width: 100%;
}
.info-boxy-large__caption {
  font-size: var(--font-size-body);   /* 16px Figma */
  line-height: 2.6rem;                /* 26px Figma */
  color: var(--color-muted);          /* perex */
}
.info-boxy-large__title {
  font-size: 2rem;                    /* 20px Figma */
  font-weight: 600;
  color: var(--color-fg);
  line-height: 1.3;
  max-width: 18rem;                   /* užší blok textu — vynutí zalamování na ~2 řádky */
}

/* Tablet: 3 sloupce, kompaktnější ikony + texty */
@media (max-width: 1023px) {
  .info-boxy-large {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--space-4);
  }
  .info-boxy-large__box { gap: var(--space-3); }
  .info-boxy-large__icon-wrap { width: 6rem; height: 6rem; }       /* z 100 → 60 */
  .info-boxy-large__icon-wrap .icon { width: 3.6rem; height: 3.6rem; } /* +20 % */
  .info-boxy-large__caption { font-size: 0.85rem; line-height: 1.4; }
  .info-boxy-large__title { font-size: 1.2rem; max-width: none; }
}
/* Mobil: 2 sloupce */
@media (max-width: 600px) {
  .info-boxy-large { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-3); }
  .info-boxy-large__icon-wrap { width: 5rem; height: 5rem; }
  .info-boxy-large__icon-wrap .icon { width: 2.4rem; height: 2.4rem; }
}

/* ============================================================
   Pudorys block (floor plan + numbered legend)
   ============================================================ */
.pudorys {
  display: grid;
  grid-template-columns: 810fr 570fr;   /* proporce 810:570 per Figma — sloupce drží poměr i při scaling */
  gap: var(--space-5);
  align-items: stretch;
}
/* Per Figma — oba boxy mají identické glass pozadí (transparent-i + border) */
.pudorys__image-wrap,
.pudorys__legend-wrap {
  background: var(--color-glass-i);
  -webkit-backdrop-filter: blur(var(--blur-glass));
          backdrop-filter: blur(var(--blur-glass));
  border: 1px solid var(--color-glass-ii);
  border-radius: var(--radius-main);
  height: 50rem;                    /* 500px Figma */
  overflow: hidden;
}
.pudorys__image-wrap {
  margin: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
.pudorys__image-wrap picture { display: block; width: 100%; height: 100%; }
.pudorys__image { width: 100%; height: 100%; object-fit: cover; display: block; }

/* Per Figma 19:2306 — content 448 wide, 80px horizontal padding */
.pudorys__legend-wrap {
  padding: 0 8rem;                  /* 80px horizontal Figma */
  display: flex;
  align-items: center;
}
.pudorys__legend {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 0;                           /* žádný gap — line je centered přes padding-block položek */
  width: 100%;
  max-width: 44.8rem;               /* 448px Figma content width */
}
.pudorys__legend-item {
  display: grid;
  grid-template-columns: 2.4rem 1fr;
  gap: 2rem;                        /* 20px Figma */
  align-items: start;               /* číslo zarovnané s prvním řádkem (názvem místnosti) */
  padding-block: 1rem;              /* 10px nad/pod — line vychází přesně do středu mezi položkami */
  border-top: 1px solid var(--color-line);
  margin-top: 0;
}
.pudorys__legend-item:last-child { border-bottom: 1px solid var(--color-line); }
.pudorys__legend-number {
  width: 2.4rem;
  height: 2.4rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--color-accent);
  color: var(--color-fg);            /* WHITE per Figma — bylo dark, bug */
  border-radius: var(--radius-mini);
  font-size: 1.6rem;                 /* 16px Figma */
  font-weight: 600;
  line-height: 1;
  margin-top: 0.3rem;                /* optické zarovnání s baseline 20px textu */
}
.pudorys__legend-text { display: flex; flex-direction: column; gap: 0.2rem; }
.pudorys__legend-text strong {
  color: var(--color-fg);
  font-weight: 600;
  font-size: 2rem;                   /* 20px Figma */
  line-height: 1.3;
}
.pudorys__legend-text span {
  color: var(--color-muted);
  font-size: 1.4rem;
}

@media (max-width: 1023px) {
  .pudorys { grid-template-columns: 1fr; }
  .pudorys__image-wrap, .pudorys__legend-wrap { height: auto; min-height: 0; }
  .pudorys__legend-wrap { padding: var(--space-5); }
  .pudorys__legend-text strong { font-size: 1.1rem; }
  .pudorys__legend-text span { font-size: 0.85rem; }
  .pudorys__legend-number { width: 1.8rem; height: 1.8rem; font-size: 1rem; }
  .pudorys__legend-item { grid-template-columns: 1.8rem 1fr; gap: 1rem; }
}

/* ============================================================
   Vybaveni block (features + image tiles)
   ============================================================ */
.vybaveni {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: var(--space-5);
}
/* Per Figma — feature item: 24×24 ico + 20px Regular text white, 20px gap */
.vybaveni__features {
  list-style: none;
  padding: 5rem 8rem;               /* 50/80 Figma */
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 0;                           /* line je centered přes padding-block položek */
  justify-content: center;          /* položky vertikálně na střed boxu */
}
.vybaveni__feature {
  display: grid;
  grid-template-columns: 2.4rem 1fr;
  gap: 2rem;                        /* 20px Figma */
  align-items: center;
  padding-block: 1rem;              /* 10px nad/pod — symetrický prostor okolo line */
  border-top: 1px solid var(--color-line);
  font-size: 2rem;                  /* 20px Figma 19:2342 */
  font-weight: 400;                 /* Regular Figma */
  color: var(--color-fg);
  margin-top: 0;
}
.vybaveni__feature:last-child { border-bottom: 1px solid var(--color-line); }
/* Odrážka = "checked checkbox" look — gold background + bílý check uvnitř */
.vybaveni__feature .icon {
  flex-shrink: 0;
  width: 2.4rem;                    /* 24px Figma */
  height: 2.4rem;
  background: var(--color-accent);  /* gold #d8a058 */
  color: var(--color-fg);           /* bílý check (stroke přes currentColor) */
  border-radius: var(--radius-mini);/* 6px */
  padding: 0.4rem;                  /* check uvnitř, drobné dýchání */
}

/* Per Figma: 1 vysoká vlevo (330×430) + 2 wide stacked vpravo (330×200 každá) */
.vybaveni__tiles {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: 1fr 1fr;
  gap: 3rem;                          /* 30px Figma */
  height: 100%;                       /* dorovná výšku features (grid stretch) */
}
.vybaveni__tile {
  margin: 0;
  overflow: hidden;
  border-radius: var(--radius-main);
  background: var(--color-glass-ii);
}
.vybaveni__tile--0 {
  grid-column: 1;
  grid-row: 1 / 3;                    /* tall — full height left */
}
.vybaveni__tile--1 { grid-column: 2; grid-row: 1; }
.vybaveni__tile--2 { grid-column: 2; grid-row: 2; }
.vybaveni__tile-image,
.vybaveni__tile picture {
  width: 100%; height: 100%; display: block;
}
.vybaveni__tile-image { object-fit: cover; }

@media (max-width: 1023px) {
  .vybaveni { grid-template-columns: 1fr; gap: var(--space-4); }
  .vybaveni__features { padding: var(--space-5); max-width: none; }
  .vybaveni__feature { font-size: 1.1rem; padding-block: 0.6rem; gap: 1rem; grid-template-columns: 2rem 1fr; }
  .vybaveni__feature .icon { width: 2rem; height: 2rem; padding: 0.3rem; }
  .vybaveni__tiles { height: auto; gap: var(--space-3); }
}

/* ============================================================
   Varianty block (variant rows)
   ============================================================ */
.varianty {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
}
/* Per Figma 85:1144 — row 1410×160, image 100×100, text 863, price 100, button 167 */
.varianty__row {
  display: grid;
  grid-template-columns: 10rem minmax(0, 1fr) auto auto;
  gap: 4rem;
  align-items: center;
  padding: 3rem;
  min-height: 16rem;
}
.varianty__image-wrap {
  width: 10rem;
  height: 10rem;
  border-radius: var(--radius-mini);
  overflow: hidden;
  background: var(--color-glass-ii);
}
.varianty__image,
.varianty__image-wrap picture { width: 100%; height: 100%; display: block; }
.varianty__image { object-fit: cover; }

.varianty__text {
  min-width: 0;
  max-width: 60rem;     /* užší aby se popis zalomil na ~2 řádky per Figma */
}
.varianty__title {
  font-size: 2rem;               /* 20px Figma 85:1148 */
  font-weight: 600;
  color: var(--color-fg);
  margin-bottom: 0.4rem;
}
.varianty__description {
  font-size: 1.9rem;             /* 19px Figma 85:1149 */
  color: var(--color-muted);
  line-height: 3.2rem;           /* 32px Figma */
}
.varianty__price {
  display: flex;
  flex-direction: column;
  text-align: right;
  align-items: flex-end;
  white-space: nowrap;
}
.varianty__price-row {
  display: flex;
  align-items: baseline;
  gap: 1rem;                     /* 10px Figma — přeškrtnutá vlevo vedle ceny */
}
.varianty__price-before {
  font-size: 1.4rem;             /* 14px Figma 264:2263 — menší přeškrtnutá */
  color: #f1e9db;                        /* plná barva — průhlednost přes opacity, ať se čára nestáčí přes text */
  opacity: 0.5;
  text-decoration: line-through;
  white-space: nowrap;
}
.varianty__price-value {
  font-size: 2rem;               /* 20px Figma 85:1151 */
  font-weight: 600;
  color: var(--color-fg);         /* WHITE Figma — ne gold */
  line-height: 1.2;
}
.varianty__price-meta {
  font-size: 1.4rem;             /* 14px Figma 85:1152 */
  color: var(--color-muted);
}
.varianty__cta {
  min-width: 16.7rem;            /* 167px Figma */
  white-space: nowrap;
}

@media (max-width: 1023px) {
  .varianty__row {
    grid-template-columns: 8rem 1fr;
    grid-template-areas:
      "img title"
      "img desc"
      "img price"
      "cta cta";
    gap: 0.6rem 1.5rem;
    padding: var(--space-4);
    min-height: 0;
    max-width: none;
  }
  .varianty__image-wrap { grid-area: img; width: 8rem; height: 8rem; align-self: start; }
  .varianty__title { grid-area: title; font-size: 1.2rem; max-width: none; }
  .varianty__description { grid-area: desc; font-size: 1.2rem; line-height: 1.4; }
  .varianty__price { grid-area: price; text-align: left; align-items: flex-start; flex-direction: row; gap: 0.6rem; }
  .varianty__price-row { gap: 0.6rem; }
  .varianty__price-before { font-size: 0.9rem; }
  .varianty__price-value { font-size: 1.2rem; }
  .varianty__price-meta { font-size: 0.75rem; align-self: end; }
  .varianty__cta { grid-area: cta; width: 100%; min-width: 0; margin-top: 0.6rem; }
}

/* ============================================================
   Ribbon-pill — small label above section headlines.
   Used by domky-featured, about, ribbon-on-card.
   ============================================================ */
.ribbon-pill {
  display: inline-flex;
  align-items: center;
  height: 3rem;
  padding: 0.2rem 1rem 0;    /* malý top padding kompenzuje OverusedGrotesk ascender > descender bias */
  background: var(--color-accent-subtle);
  -webkit-backdrop-filter: blur(10px);
          backdrop-filter: blur(10px);
  border-radius: var(--radius-main);
  font-size: 1.3rem;
  line-height: 1;
  font-weight: 600;
  color: var(--color-accent);
  white-space: nowrap;
}
@media (max-width: 1023px) {
  .ribbon-pill { height: 2rem; padding: 0 0.7rem; font-size: 0.8rem; border-radius: 0.6rem; }
}

/* ============================================================
   DOMKY featured (Homepage section)
   ============================================================ */
.block--domky-featured { padding-block: var(--space-9) 0; }   /* 100 top / 0 bottom — pre-footer drží mezeru sám */
.domky-headline {
  display: flex;
  flex-direction: column;
  gap: var(--space-5);
  align-items: center;
  text-align: center;
  margin-bottom: var(--space-9);
  max-width: 60rem;
  margin-left: auto;
  margin-right: auto;
}
@media (max-width: 1023px) {
  .domky-headline { gap: var(--space-4); margin-bottom: 30px; }
}
.domky-headline__h2 {
  font-size: var(--font-size-h2);   /* sjednoceno s .home-about__h2 */
  font-weight: 600;
  line-height: 1.2;
  color: var(--color-fg);
}
.domky-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(36rem, 1fr));
  gap: var(--space-6);
  margin-bottom: var(--space-7);
}
/* Tablet: 2 sloupce (sjednoceno s listingem) */
@media (max-width: 1023px) {
  .domky-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-4); }
}
/* Mobil: 1 sloupec */
@media (max-width: 600px) {
  .domky-grid { grid-template-columns: minmax(0, 1fr); gap: var(--space-3); }
}
.domky-cta-row {
  display: flex;
  justify-content: center;
}

/* ============================================================
   ABOUT (Homepage section)
   ============================================================ */
.block--about { padding-block: var(--space-9); }
.about__headline {
  display: flex;
  flex-direction: column;
  gap: var(--space-5);
  align-items: center;
  text-align: center;
  max-width: 90rem;
  margin: 0 auto;
}
.about__h2 {
  font-size: var(--font-size-h2);
  font-weight: 600;
  line-height: 1.2;
  color: var(--color-fg);
  max-width: 90rem;
}
.about__body {
  font-size: 1.9rem;
  line-height: 1.7;
  color: var(--color-muted);
  max-width: 90rem;
}
.about__body > * + * { margin-top: 1em; }

/* ============================================================
   Step block (Služby — numbered service section)
   ============================================================ */
.block--step { padding-block: 7rem; }   /* 70px — větší rozestup mezi službami (zvýšeno ze 40) */
.step__inner {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: var(--space-9);
  align-items: center;
}
.block--step--align-right .step__inner {
  grid-template-areas: "text image";
}
.block--step--align-right .step__image-wrap { grid-area: image; }
.block--step--align-right .step__text { grid-area: text; }

.step__image-wrap {
  margin: 0;
  border-radius: var(--radius-main);
  overflow: hidden;
  aspect-ratio: 690 / 500;
  background: #979797;
}
.step__image { width: 100%; height: 100%; object-fit: cover; }
.step__text {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
  position: relative;
  max-width: 50rem;       /* užší blok textu — vynutí lepší zalamování (≈ 500px) */
}
.step__number {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 4rem;
  height: 4rem;
  background: var(--color-accent);
  color: var(--color-bg);
  border-radius: var(--radius-mini);
  font-size: 1.8rem;
  font-weight: 600;
  line-height: 1;
}
.step__icon { color: var(--color-accent); }
.step__icon .icon { width: 4.8rem; height: 4.8rem; }
.step__title {
  font-size: 4.4rem;
  font-weight: 600;
  line-height: 1.13;
  color: var(--color-fg);
  letter-spacing: -0.01em;
}
.step__description,
.step__description p,
.step__description li {
  font-size: 2.1rem;             /* sjednoceno s home-about__body */
  line-height: 1.6;
  color: var(--color-muted);
  max-width: 60ch;
}
.step__description > * + * { margin-top: 1em; }

@media (max-width: 1023px) {
  /* Stack image+text na mobilu/tabletu */
  .block--step { padding-block: var(--space-6); }     /* 30 tablet ≈ 42, mobil ≈ 39 (z 70) */
  .step__inner,
  .block--step--align-right .step__inner {
    grid-template-columns: 1fr;
    grid-template-areas: none;
    gap: var(--space-5);
  }
  .block--step--align-right .step__image-wrap,
  .block--step--align-right .step__text { grid-area: auto; }
  .step__text { gap: var(--space-3); max-width: none; }
  .step__icon .icon { width: 3.2rem; height: 3.2rem; }
  .step__title { font-size: 2rem; line-height: 1.2; }      /* z 4.4 (62px) → 2 (28px) */
  .step__description,
  .step__description p,
  .step__description li { font-size: 1.3rem; line-height: 1.6; }
}
@media (max-width: 600px) {
  .step__title { font-size: 1.8rem; }
  .step__icon .icon { width: 2.6rem; height: 2.6rem; }
}

/* ============================================================
   Inquiry form block (Detail page inline form)
   ============================================================ */
.block--inquiry-form { padding-block: var(--space-9) 0; }   /* 100px top / 0 bottom — wrap a footer drží mezeru */
.inquiry-form-wrap {
  max-width: 70rem;
  margin: 0 auto;
  padding: var(--space-7) var(--space-7) 0;   /* bez bottom paddingu — patička drží mezeru */
  text-align: center;
  position: relative;
}
.inquiry-form-wrap__ribbon {
  display: flex;
  justify-content: center;
  margin-bottom: var(--space-3);
}
.inquiry-form-wrap__headline {
  font-size: 4.4rem;
  line-height: 5rem;
  font-weight: 600;
  margin-bottom: var(--space-5);
  max-width: 50rem;
  margin-left: auto;
  margin-right: auto;
}
@media (max-width: 1023px) {
  .inquiry-form-wrap__headline { font-size: 2.8rem; line-height: 1.2; }   /* ~40px tablet */
}
@media (max-width: 600px) {
  .inquiry-form-wrap__headline { font-size: 2.2rem; }                     /* ~29px mobil */
}
.inquiry-form-wrap__headline em {
  font-style: normal;
  color: var(--color-accent);
}
.inquiry-form-wrap__intro {
  color: var(--color-muted);
  margin-bottom: var(--space-5);
  font-size: var(--font-size-body);
}
.inquiry-form-wrap .contact-form { text-align: left; }

@media (max-width: 1023px) {
  .inquiry-form-wrap { padding: var(--space-5); }
}