/* ==========================================================================
   Page layout - Начало, the landing page, rendered by home.tpl.

   Components come from css/system/*.css and files/tpl_site/components/. This
   file carries only what is specific to this page's composition: placement,
   grid and section rhythm.

   Every value is from the Landing frame (1058:16, 1920x5842), read out of
   `.ky-test/landing.css` - the Phase 1 recreation, where each number is
   commented with the node it came from - or re-measured here against
   `siteassets/reference/`. It is one of the five frames that do NOT carry the
   whole-frame 5px shift: its footer sits at 163/1057 and its divider at 954.

   The eight bands and their page y-ranges, which is also the height budget
   this file has to close on:

     hero          0..903      photo, nav pill, district map, search panel
     Избрани имоти  971..1809   heading + rule, 2 + 3 property cards
     Нашите Услуги 1859..2536  full-bleed green band, four cream cards
     Клиенти       2536..3202  photo, 60px frosted pane, three quote cards
     Екипа ни      3202..4207  photo + gold wash, 5-photo collage, CV card
                               (since 28 Sep 2026 an apply card, and the band
                               takes its content's height)
     Contact CTA   4207..4872  photo band, the 462x586 contact card
     Партньори     4873..5253  full-bleed Partner Gold band, six tiles
     footer        5253..5842  c-footer

   THE CONTAINERS. The frame has five different left edges on this page alone -
   the nav at 321, the featured section at 324, the services cards at 345, the
   quote cards at 287 and the partners band at 244 - and DESIGN.md's Container
   Debt Rule says what to do with that: keep the widths, which are real, and
   centre them, which is the reconciliation. So each band gets ONE container,
   its own widest measured object, centred on 1920, and its heading and its
   content share it. That is the same call page-pages.css made for the Услуги
   frame's 1188 hero and its 1230 card grid.

   FOUR VALUES THIS PAGE CORRECTS. Each is measured, and each is recorded in
   DESIGN.md or in the block that uses it:

     - the «Избрани имоти» band's ground is FIELD GREY, not white. Two patches
       on `.ky-test/ref/featured-ref.png` sample #f7f7f7 at zero spread, which
       is the page's own ground and agrees with the no-white-page-ground rule.
       `landing.css` had it white;
     - the service cards' title is 30px Playfair, not the system's 24. The
       first glyph's cap inks 21px here against 17px on the Services frame's
       identical card - a ratio of 1.235 against 30/24 = 1.25. NOT REPRODUCED
       any more: the `typeset` pass normalised it to the system's 24, on the
       nine instances that carry it and on this page's own mobile frame;
     - and it carries NO green rule, where the Services frame's does. The rows
       under the title are empty for 20px on the reference. Normalised with
       the size, and for the same reason;
     - the five section rules are 373 / 423 / 719 / 423 / 464. None is the
       footers' fixed 372 and none is the heading plus a constant (they run
       ink + 80 / 30 / 39 / 28). They were carried per band through
       --c-rule-w until the `typeset` pass settled the rule as tracked
       everywhere (27 Aug 2026); five hand-drawn widths on one frame are what
       lost, and typography.css says to what.
   ========================================================================== */

/* ==========================================================================
   1. HERO - 1920x903
   ========================================================================== */

/* Every band on this page carried its own literal container width - 1294,
   1230, 1334, 1497, 1475 - hand placement around the nav's 1278. Since
   24 Sep 2026 every section's box is the nav's: one width, the same min()
   .c-container is. */
.p-home{
  --p-home-w: min(var(--c-container), 100% - 2 * var(--c-page-gutter));
  /* The container's own inset, floored at the gutter, for the full-bleed
     bands that have to line something up with it. */
  --p-home-inset: max(var(--c-page-gutter), (100% - var(--c-container)) / 2);
}

/* The map's scroll wrapper is not a box above 1120: `display:contents` keeps
   `.p-home__map`'s absolute placement resolving against `.p-home__hero-inner`
   exactly as it did before the element existed. */
.p-home__mapscroll{ display:contents; }
.p-home__mapscroll[hidden]{ display:none; }

/* Drawn at exactly one width and declared off here: the «Карта» disclosure
   below 640 (the 1920 frame has the map beside the panel). */
.p-home__maplink{ display:none; }

.p-home__hero{
  position:relative;
  height:903px;
  overflow:hidden;
}

.p-home__hero-bg{
  position:absolute;
  inset:0;
  width:100%; height:100%;
  object-fit:cover;
}

/* Rectangle 141 - a white wash sitting OVER the photograph, which is what lets
   the nav pill and the district map read against it. */
.p-home__hero-scrim{
  position:absolute;
  inset:0;
  background:rgba(255,255,255,.55);
}

/* The system's 1278 centred container, which on this band is also the frame's
   own: the nav pill, the chip and the map all open on 321-322. */
.p-home__hero-inner{
  position:relative;
  width:min(var(--c-container), 100% - 2 * var(--c-page-gutter));
  height:100%;
  margin:0 auto;
}

/* --- the selected-districts chip: Frame 38, 209x50 ---------------------- */
/* Hidden until the map has a binding table - with none it can only say 0.
   It names the searched city, then the count, so it grows past the frame's
   209 rather than wrapping. */

.p-home__chip{
  position:absolute;
  left:0; top:158px;
  z-index:3;
  display:flex;
  align-items:center;
  justify-content:center;
  min-width:209px; height:50px;
  padding-inline:16px;
  margin:0;
  white-space:nowrap;
  background:var(--c-white);
  border:1px solid var(--c-gold);
  border-radius:var(--c-r-control);
  font:400 var(--c-fs-body)/var(--c-lh-body) var(--c-sans);
  color:var(--c-ink);
}
.p-home__chip[hidden]{ display:none; }
.p-home__chip b{ margin-left:.35em; font-weight:700; }
.p-home__chip-city{ display:inline-flex; align-items:center; font-weight:700; }
.p-home__chip-city::after{
  content:"";
  width:1px; height:20px;
  margin-inline:12px;
  background:var(--c-gold);
}

/* --- the district map: Union + Group 61, 732x670 at x322 ---------------- */
/* The frame paints the same artwork 732x670 where the Search frame paints it
   757x664 - hand-placed art in a flat file, which is what the component's
   preserveAspectRatio="none" is for. */

.p-home__map{
  position:absolute;
  /* x322 against the container's 321. One pixel, and it is drift. */
  left:0; top:158px;
  z-index:2;
  width:732px; height:670px;
}
.p-home__map .c-map{ width:732px; height:670px; }
.p-home__map-defs{ position:absolute; }

/* THE FROSTED BASE IS THIS PAGE'S, NOT THE MAP'S. The Search frame draws the
   same component on flat Field Grey with no base at all (DESIGN.md, The
   District Map), so it lives here. It is the whole reason the landing map's
   districts are unfilled: what the city reads as is this, not a fill.

   THREE ELEMENTS FOR TWO EFFECTS, AND NEITHER PAIRING IS OPTIONAL:

     - `filter` and `clip-path` cannot share a box. The order is filter first,
       clip second, so a drop shadow cast by a clipped silhouette is clipped
       away by the very shape that cast it. The shadow therefore lives on an
       ANCESTOR of the clipped element, which is what `-shadow` > `-base` is.
     - `backdrop-filter` cannot live inside anything carrying a `filter`. An
       ancestor filter makes the descendant its own backdrop root, so the blur
       has nothing behind it to read and renders as EXACTLY nothing - silently,
       with the declaration still sitting there in the computed style.

   Those two rules have no common solution in one nested pair, and the pair
   that used to be here satisfied the first and quietly lost to the second: the
   30px blur was declared, was reported by getComputedStyle, and did not
   render, from the day the landing page was built until 26 Aug 2026. It was
   found by rendering the page twice, once with the blur commented out, and
   diffing: mean pixel change 0.77 across the silhouette, i.e. none.

   So the blur is a SIBLING, and it is first, so it blurs the photograph and
   the gradient then tints the blurred result.

   The silhouette's own canvas is 791.954x730.002 - the artwork's 732x670 plus
   30px of filter bleed per side. `#sofiaClip` is `userSpaceOnUse` on exactly
   that canvas, so every box clipped by it has to BE that box. */
.p-home__map-frost,
.p-home__map-shadow{
  position:absolute;
  left:-30px; top:-30px;
  width:791.954px; height:730.002px;
}
.p-home__map-frost{
  clip-path:url(#sofiaClip);
  -webkit-backdrop-filter:blur(30px);
          backdrop-filter:blur(30px);
}
.p-home__map-shadow{
  filter:drop-shadow(0 0 15px rgba(0,0,0,.28));
}
.p-home__map-base{
  width:100%; height:100%;
  clip-path:url(#sofiaClip);
  /* paint0_radial_0_4, centred, 365.977 x 335.001 */
  background:radial-gradient(ellipse 365.977px 335.001px at 50% 50%,
              rgba(255,221,195,.05) 11.6%,
              rgba(247,247,247,.30) 89.9%);
}

/* NO DISTRICT IS FILLED HERE. Not the mapped ones, not the unmapped ones -
   only the parks, the chosen district and the hovered one.

   The warm tone the city reads as is NOT a fill: it is `.p-home__map-frost`
   above, the radial `#ffddc3` at 5% to `#f7f7f7` at 30% over a 30px backdrop
   blur, clipped to the city's outline. The districts are windows onto it.

   That is worth stating flatly because it was got wrong twice on 26 Aug 2026,
   both times by sampling the RENDERED city and reaching for a fill that
   matched it - #dac1a7, then #d2cfc6. Both are the gradient plus the blurred
   photograph, read back off the screen. A fill that reproduces one sample of a
   gradient is a flat patch everywhere else on the map, and it also covers the
   frost it was copied from.

   So: if the landing map ever looks wrong in colour, the value to change is in
   `.p-home__map-frost`, not here.

   The Search page's rule - an unmapped district drops to the page ground -
   deliberately does not apply. It exists so the drop shadow that page casts
   off the artwork has a solid silhouette to work from; there is no such shadow
   here (it is cast off the frosted base), and the ground here is a photograph
   rather than flat Field Grey. Specificity, not order: map.css is loaded after
   this file, and its own `:not(.is-bound):not(.is-park)` rule is more specific
   than a bare `.p-home__map .district`. */
.p-home__map .district{ fill:transparent; }
.p-home__map .district:not(.is-bound):not(.is-park){ fill:transparent; }

/* THE STROKE IS THE ARTWORK'S OWN BLACK, not Hairline Gold. The 167 paths are
   exported with `stroke="#1C1C1C"` and `--c-ink` is that value; map.css
   repaints them gold because the SEARCH frame draws them gold - 8 356 pixels
   sampled at #c2a170 - and the landing frame does not. Sampled on the frame's
   own render (`.ky-test/ref/hero-ref.png`) the hairlines run #605e5b to
   #8a8782, which is a 1px black antialiased over the frost, not a gold. */
.p-home__map .district{ stroke:var(--c-ink); }
.p-home__map .district.is-park{ fill:var(--c-green); }
.p-home__map .district.is-selected{ fill:var(--c-map-selected); }
.p-home__map .district.is-hovered,
.p-home__map .district.is-bound:hover{ fill:var(--c-map-hover); }

/* --- the search panel: Frame 64, 414x532 at x1135 y227 ------------------ */
/* The file's OTHER field component - 50 tall with a 16px placeholder and a
   16px inset - against the form cards' 40 / 12-italic / 20. The controls carry
   tall=true; everything below is the panel around them.

   Its vertical stack closes on the 532 exactly, which is how the row gap was
   settled rather than guessed:
     40 pad + 70 title + 27 sub + 6 + 4x50 fields + 3x16 gaps
        + 13 + 27 link + 20 + 50 button + 31 pad = 532
   The frame's own field gaps are 13 / 17 / 16 and the 13 is the outlier, so
   all three are normalised onto 16. */

.p-home__search{
  position:absolute;
  /* x1135 against the container's 321 */
  left:814px; top:227px;
  z-index:3;
  display:flex;
  flex-direction:column;
  width:414px; height:532px;
  /* left 40 and right 35: the field column is 40..379 inside a 414 box, which
     is the same overflow-into-the-padding the hero panel's title makes */
  padding:40px 35px 31px 40px;
  background:var(--c-ink);
  border-radius:var(--c-r-surface);
  box-shadow:var(--c-sh-photo);
  color:var(--c-white);
}

/* The 2px stroke rides on a pseudo-element - the Stroke-On-A-Pseudo Rule. */
.p-home__search::before{
  content:"";
  position:absolute;
  inset:0;
  border:2px solid var(--c-gold);
  border-radius:inherit;
  pointer-events:none;
}

/* Headline, 40px: DESIGN.md reserves it for exactly two moments, the search
   panel's title and the contact CTA's heading, and both are on this page. */
.p-home__search-title{
  height:70px;
  margin:0;
  font:400 var(--c-fs-headline)/var(--c-lh-serif) var(--c-serif);
  color:var(--c-white);
}
.p-home__search-sub{
  margin:0 0 6px;
  font:400 var(--c-fs-nav)/27px var(--c-sans);
  color:var(--c-white);
}

.p-home__search-grid{
  display:grid;
  grid-template-columns:repeat(2, 160px);
  column-gap:19px;
  row-gap:16px;
}
.p-home__search-wide{ grid-column:1 / -1; }

.p-home__search-adv{
  display:flex;
  align-items:center;
  gap:4px;
  /* 27, the label's own box - the frame draws the arrow as a SEPARATE 36px
     glyph whose box runs 404..440 beside a link box of 404..431, so it hangs
     below the line rather than setting it. Left to flow it makes the row 36
     and steals nine pixels off the title above. */
  height:27px;
  margin:13px 0 0;
  font:400 var(--c-fs-nav)/27px var(--c-sans);
  color:var(--c-white);
}
.p-home__search-adv a{
  text-decoration:underline;
  transition:color var(--c-ease);
}
.p-home__search-adv a:hover{ color:var(--c-gold); }
/* node 1058:937 - the arrow is its own 36px glyph, not part of the label */
.p-home__search-adv span{ font-size:36px; line-height:27px; }

.p-home__search-go{
  display:flex;
  justify-content:flex-end;
  margin-top:20px;
}
/* 108x50 around a 16/800 label, with a 1px white stroke - the frame's own, and
   the one gold fill on this page that does not mean "chosen".

   THE LABEL IS INK, NOT THE FRAME'S WHITE. White on Hairline Gold is 2.43:1,
   and this is the landing page's commit button - the single control the whole
   hero exists to reach. `.c-btn--gold` already says ink for exactly this
   reason and every other gold button in the system obeys it; the override
   here was reproducing the frame's own value and nothing else. Ink on gold is
   6.83:1, and 5.79:1 on the Partner Gold it hovers to. The white STROKE is
   the frame's too and it stays - it is what holds the button off the dark
   panel, and it was never the part that failed.            audit, 27 Aug */
.p-home__search-go .c-btn{
  min-width:108px;
  padding:0 24px;
  border:1px solid var(--c-white);
  font-weight:800;
}
.p-home__search-go .c-btn:hover{ background:var(--c-gold-deep); }

/* ==========================================================================
   The section head - heading left, "→ …" link right. Four instances on this
   page and nowhere else in the system, so it lives here rather than becoming a
   component. Each band sets its own link colour; the rule tracks its heading
   like every other one in the system (typography.css).
   ========================================================================== */

.p-home__sechead{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  /* The link is `white-space:nowrap` and the heading carries a hand-drawn
     rule up to 719 wide; below the designed width the pair does not fit on
     one line, and at 1920 there is nothing to wrap. */
  flex-wrap:wrap;
  gap:12px 24px;
}

.p-home__more{ white-space:nowrap; }

/* ==========================================================================
   2. ИЗБРАНИ ИМОТИ - 971..1809, on the page's own Field Grey ground

   68 + 105 + 435 + 18 + 280 + 50 = 956, which is 903..1859.
   ========================================================================== */

.p-home__featured{
  width:var(--p-home-w);
  margin:0 auto;
  padding:68px 0 50px;
}

/* GOLD: one of the only two gold rules in the whole twelve-frame file, both on
   this page. The heading's box top to the first card is 105. The frame's own
   373px rule is gone with the other four - the rule tracks its heading now
   (typography.css) and 373 under a 357px «Избрани имоти» was +16, the second
   narrowest overhang the file draws. */
.p-home__featured .p-home__sechead{ height:105px; }
.p-home__featured .p-home__more{ color:var(--c-muted); }
.p-home__featured .p-home__more:hover{ color:var(--c-gold); }

.p-home__prow{ display:grid; }

/* THE BAND IS ONE GRID, and both rows are the same three columns at the
   system's own 17px gutter. Settled 27 Aug 2026.

   The frames draw the two rows as different grids - 847 + 31 + 416 on top of
   420 + 17 + 420 + 17 + 420 - and both close on the 1294 exactly, so both
   sets of numbers are real measurements. They are also 4px out of register
   with each other, which is the part no measurement excuses: the top row's
   small card opens at x1191 and the bottom row's third card at x1187, on two
   rows sitting directly on top of one another. Two cards a hand's width apart
   in the same band, one above the other, read as a mistake however carefully
   each was placed.

   The argument is the one the old comment on the row below already made about
   that row's own internals - it drew 17 and then 7, and "two gutters
   disagreeing inside one row is hand placement, not a rule". Two gutters
   disagreeing inside one BAND is the same defect one level up, and 17 is the
   side that wins because it is `--c-gutter`, the system's card-grid gutter,
   and because it is the gutter three cards agree on against one card's 31.

   So the lead card spans two of the three columns and everything closes on
   the 1294 with no card moving more than a hand-drag:

     lead   420 + 17 + 420 = 857   (the frame's 847, +10)
     small  420                    (the frame's 416, +4)
     row    857 + 17 + 420 = 1294  exactly, and the two rows register

   The 18px between the rows goes with it - it was the frame's own and it is
   one pixel off the gutter it sits beside. */
.p-home__prow--1,
.p-home__prow--2{
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:var(--c-gutter);
}

.p-home__prow--1{ margin-bottom:var(--c-gutter); }

/* The lead offer takes two columns. Its own 847/435 still sets the row's
   height as an ASPECT rather than a size (media.css), so at 857 the row is
   440 rather than 435 and the shape the frame drew is unchanged. */
.p-home__prow--1 > :first-child{ grid-column:span 2; }

/* ==========================================================================
   3. НАШИТЕ УСЛУГИ - 1859..2536, the full-bleed green band

   25 + 73 + 25 + (237 + 40 + 237) + 40 = 677.
   ========================================================================== */

.p-home__services{
  padding:25px 0 40px;
  background:var(--c-green);
}

/* The second and last gold rule in the file. The heading goes white on the
   band; the rule stays gold. */
.p-home__services .p-home__sechead{
  width:min(var(--c-container), 100% - 2 * var(--c-page-gutter));
  margin:0 auto;
}
/* The SECTION heading only. Scoped to the sechead because the four card
   titles are .c-heading too, inside cream cards on the same band - a bare
   descendant selector here painted them white on cream and they vanished. */
.p-home__services .p-home__sechead .c-heading{ color:var(--c-white); }
.p-home__services .p-home__more{ color:var(--c-field); }
.p-home__services .p-home__more:hover{ color:var(--c-gold); }

.p-home__scards{
  width:var(--p-home-w);
  margin:25px auto 0;
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:40px 30px;
}

/* 600x237, and the 237 closes exactly: 30 + 40 title + 13 + 114 copy + 40. The
   frame's copy is six lines at 16/19 in the 521 measure; real CMS copy is not,
   so the height is a floor rather than a lock - the same content-versus-design
   pressure the Услуги page already hits. */
.p-home__scard{
  min-height:237px;
  padding:30px var(--c-pad) var(--c-pad);
}

/* THE 30 AND THE MISSING RULE ARE GONE, and this block is what is left of
   them: nothing. The card takes .c-heading--title's own 24 and its 4px green
   bar like the other twelve card titles in the system.

   Settled by the `typeset` pass, 27 Aug 2026 (DESIGN.md's Title entry). Both
   values WERE measured and both were the landing frame's own - the first
   glyph's cap inks 21px on siteassets/reference/section-3-uslugi.png against
   17 on the Services frame's identical card, and the twenty rows under the
   title are empty where Services carries the bar. What settled it is that
   this is one card class drawn twice, 600x237 in Paper Cream at a 20px radius
   over a 521 copy column on both frames, and nine instances across four
   frames put that title at 24 where four instances on one put it at 30. The
   deciding evidence is that THIS PAGE'S OWN MOBILE FRAME draws the card at
   24: siteassets/frames-mobile/Landing.png boxes «Отдаване» at 119, which is
   24px Playfair's 116 and not 30's 145 - the build already followed it below
   640. One frame disagreeing with nine, and with itself one breakpoint down,
   is drift rather than a decision. */

.p-home__scard .c-card__body{ margin-top:13px; }
/* a single CMS paragraph would otherwise carry its 19px bottom margin into the
   card's own 40 */
.p-home__scard .c-prose > :last-child{ margin-bottom:0; }

/* ==========================================================================
   4. КАКВО КАЗВАТ НАШИТЕ КЛИЕНТИ - 2536..3202

   150 + 73 + 55 + 238 + 150 = 666.
   ========================================================================== */

.p-home__quotes{
  position:relative;
  height:666px;
  overflow:hidden;
  background:var(--c-ink);
  /* Two tracks, not two page coordinates - docs/known-issues.md #77. Column 1
     is 52.03125% (the frame's own 999/1920, where the right half starts) and
     column 2 is what is left of it, so the right half's own rule - fill your
     track - IS "ends at the band" with nothing to keep in agreement. */
  display:grid;
  grid-template-columns:52.03125% 47.96875%;
}

/* One photograph, used twice. The export lands natively on x999 and the left
   half is the same file mirrored on that seam - fitting the mirrored copy
   against the reference put its axis there (3.4/255 mean error, against 10.2
   for any scaled fit). The design's own left crop is 1014 wide against this
   export's 912, so `cover` takes up the difference as an ~11% upscale at the
   page margin, behind the frosted pane. An `image 96` export would close it. */
.p-home__quotes-bg{
  grid-row:1;
  height:666px;
  background-color:#2b2622;
  background-image:url("../../img/bg/testimonials-band.jpg");
  background-size:cover;
  background-position:center;
}
/* THE LEFT HALF SPANS BOTH TRACKS so its 52.8125% (1014/1920, the frame's own
   left-crop width) still reads against the whole band rather than against
   column 1 alone, and `justify-self:start` with the -4px margin puts it where
   `left:-4px` used to. That overruns column 1 by 11px into column 2 on
   purpose: paint order is still DOM order in one stacking context, so the
   right half (later in the markup, in column 2) paints over the overrun and
   hides the mirror join exactly as it did as two absolutely-placed layers. */
.p-home__quotes-bg--l{
  grid-column:1 / -1;
  justify-self:start;
  width:52.8125%;
  margin-left:-4px;
  transform:scaleX(-1);
}
/* THE RIGHT HALF ENDS AT THE BAND, not at a width - it simply fills column 2,
   which is what `right:0` used to have to be told to do explicitly. */
.p-home__quotes-bg--r{ grid-column:2; }

/* Rectangle 57 - the third frosted surface in the system and the only 60px
   radius in it. blur(20px) over rgba(247,247,247,.70), both solved by
   least-squares against the bare export at R2 0.99. */
.p-home__quotes-pane{
  position:absolute;
  left:50%;
  transform:translateX(-50%);
  top:110px;
  width:var(--p-home-w); height:480px;
  border-radius:var(--c-r-panel);
  background:var(--c-frost-panel);
  -webkit-backdrop-filter:blur(20px);
          backdrop-filter:blur(20px);
}

.p-home__quotes-inner{
  position:relative;
  z-index:1;
  /* Spans both tracks of `.p-home__quotes`'s grid - it is a normal, in-flow
     child now that the band is a grid container, and without this it would
     be auto-placed into column 1 alone instead of centred on the whole row. */
  grid-column:1 / -1;
  grid-row:1;
  /* The inner column is a proportion of the PANE it sits on, not of the
     page: 1334 of 1497 is 89.1%, so it keeps the same 81px of frosted margin
     each side at every width instead of growing flush to the pane's own
     rounded edge and clipping the section link. */
  width:calc(var(--p-home-w) * 1334 / 1497);
  margin:0 auto;
  padding-top:150px;
}

.p-home__quotes .p-home__more{ color:var(--c-ink); }
.p-home__quotes .p-home__more:hover{ color:var(--c-green); }

/* Three 420x238 cream cards at a 457px pitch - a 37px gutter across the 1334. */
/* 3 x 420 across the 1334 leaves the frame's own 37px gutter twice. */
.p-home__quote-row{
  margin-top:55px;
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:37px;
}

.p-home__quote{
  /* A FLOOR, because two of the three rows in this card grow with real
     content and only one of them is clamped. The name is a single line in the
     frame and `testimonials.person` holds up to 32 characters - «Christos
     Kintis (Χρήστος Κιντής)» - which is two lines in a 300px card, and the
     row is `auto-fit minmax(300px, 1fr)` below 1120. At 238 fixed that
     second name line pushed the last line of the quote under the card's own
     `overflow:hidden` and it vanished without an ellipsis. The row is a grid,
     so its three items stretch to the tallest of them and the row stays even
     whichever card grows. Inert at 1920, where the frame's own copy closes
     inside 238. */
  min-height:238px;
  margin:0;
  /* the frame's insets drift 289/290/291 for the name and 29/29/30 for the
     body across the three cards; normalised to 29 */
  padding:24px 29px;
  background:var(--c-cream);
  border-radius:var(--c-r-card);
  box-shadow:var(--c-sh-card);
  overflow:hidden;
}

/* The stars sit at the card's 29px inset, the name in a second column beside
   them - one row, not two (docs/known-issues.md #48). */
.p-home__quote-head{
  display:flex;
  align-items:center;
  gap:10px;
}

.p-home__quote-name{
  margin:0;
  font:600 var(--c-fs-body)/19px var(--c-sans);
  color:var(--c-ink);
}

/* c-rating lives in cards.css now: the Екип page's broker modal draws it too. */

/* Body top 59 against a name box ending at 43. Real testimonials run to any
   length where the frame's placeholder is eight lines, so the quote clamps:
   59 + 8x19 = 211, 27 clear of the 238.

   THE CLAMP HOLDS A CONSTANT AMOUNT OF TEXT, NOT A CONSTANT NUMBER OF LINES,
   and that is what the `typeset` pass changed about it (27 Aug 2026). Eight
   lines of the 360px measure is about 360 characters, which is the corpus's
   own middle - 129 live testimonials averaging 400 characters and running to
   1922, so the clamp is doing real work and is not going away. But the card
   narrows below 1360 and the line count did not follow it, so the same taste
   came out five lines short: the sweep read `8 of 10` at 1120 and `5 of 7` at
   393, i.e. a quote cut two lines from its end on a card that has nowhere to
   read the rest. Ten lines below 1360 restores the 360 characters at the
   narrower measure. */
.p-home__quote-text{
  margin:16px 0 0;
  max-width:360px;
  display:-webkit-box;
  -webkit-line-clamp:8;
  -webkit-box-orient:vertical;
  overflow:hidden;
}

@media (max-width: 1359px){
  .p-home__quote-text{ -webkit-line-clamp:10; }
}
.p-home__quote-text p{ margin:0; }

/* ==========================================================================
   5. ЕЛАТЕ В ЕКИПА НИ - 3202..4207

   The frame hand-composed it: the heading at 339, the collage at 175 and the
   CV card at 1269, with no container reconciling the three. Since 24 Sep 2026
   it is on the container like every other section (DESIGN.md, The One Width
   Rule): the heading row is the container, the collage opens on its left
   edge, and the right column is flush with its right edge.

   THE CV FORM LEFT THE BAND ON 28 Sep 2026 (critique): the landing ended on
   two full forms, this one and the contact band's under it. Its column now
   holds the CV band's copy and «Кандидатствай» to Обучения in a Paper Cream
   card at the form card's 462 - a card that informs, not a form - and the
   band is no longer a fixed 1005: with no 859px form to hold, its height is
   its content's, and the collage and the card are one in-flow grid row
   instead of two absolute placements.
   ========================================================================== */

.p-home__careers{
  position:relative;
  overflow:hidden;
  /* The section head's own 58px top offset (docs/known-issues.md #77). */
  padding:58px 0 80px;
  background:var(--c-careers-base);
}

/* image 115 - the design's own layer, rasterised here rather than in Figma,
   from the clean 1915x997 export in `siteassets/careers-band.png`.
   THE TREATMENT IS THE FRAME'S TWO NUMBERS: a 45 layer blur and 40% opacity.
   The blur is baked into the picture and the opacity is the rule below, so
   the 40% composites against the band's own `#8f8983` - which is what that
   fill has always been FOR and, while the photograph was opaque, never did.
   The 45 is 45 in Figma's units and Figma does not say what those are in
   sigma, so it was MEASURED rather than guessed: the previous raster was
   Figma's own export of this same photograph at this same setting (2005x1087
   is 1915x997 plus a 45px bleed on all four sides), and fitting a Gaussian to
   it lands on sigma 19.25 at 1.6/255 rms - the residual is the old file's
   JPEG. Nothing else about that raster survived the fit: it came out at FULL
   opacity, so the 40% had simply gone missing between the frame and the page.
   No bleed margin now that the layer is drawn as a crop rather than a box -
   the blur is taken with the edges extended instead, which is what keeps the
   picture solid to all four sides instead of fading into a dark vignette.
   Half resolution, because sigma 19.25 has nothing above 958px to lose: the
   round trip through it costs 0.41/255 rms at the opacity it is drawn, and
   169K became 20K. */
/* A CROP, NOT A BOX. It was four unrelated numbers - left -49/1920, top -37px,
   width 2005/1920, height 1087px - inside a 1005px band, so the picture
   overhung by 37 / 45 / 49 / 36 and only two of the four scaled with the page.
   It is a `cover` crop, so none of that clipped anything; it was simply not a
   placement anyone could reason about, and the band's own height is no longer
   a fixed 1005 below 1360. `inset:0` hands the framing to `background-size`
   instead: at the designed width the layer's own 1915x997 covers a 1920x1005
   band at 1.008, i.e. 5px off each side and nothing off the top or bottom, so
   there is no crop left to position and `center` is the honest answer. It
   earns its keep below 1360, where the band's height is the content's. */
.p-home__careers-bg{
  position:absolute;
  inset:0;
  background-image:url("../../img/bg/careers-band.jpg");
  background-size:cover;
  background-position:center;
  opacity:.4;
}

/* Rectangle 56 - Hairline Gold at 0.61 over the photograph, solved by
   regressing composite on background down the clear strip right of the card:
   all three channels agree at a = 0.61 with C = #c2a170, R2 0.97-0.99. The
   frame stops it at 1911; it runs to the edge here rather than leaving a 9px
   seam of bare photograph at the page margin. */
.p-home__careers-wash{
  position:absolute;
  left:calc(100% * 1034 / 1920); right:0; top:0; bottom:0;
  background:rgba(194,161,112,.61);
}

/* The container's own row, heading on its left edge and link on its right -
   a flex row in flow (docs/known-issues.md #77). `position:relative` carries no
   offset here; it exists only so the head paints above the band's absolutely
   placed photograph and wash, which a non-positioned in-flow sibling never
   does regardless of source order - the same rule `.p-home__careers-body`
   follows below. */
.p-home__sechead--careers{
  position:relative;
  z-index:1;
  width:min(var(--c-container), 100% - 2 * var(--c-page-gutter));
  margin-inline:auto;
}
.p-home__careers .p-home__more{ color:var(--c-ink); }
.p-home__careers .p-home__more:hover{ color:var(--c-green); }

/* The body row: the collage on the container's left edge, the apply card
   on its right, at the 786 + 30 + 462 the form card left. In flow, and
   positioned only so it paints above the absolutely placed photograph and
   wash, which a static sibling never does whatever the source order. */
.p-home__careers-body{
  position:relative;
  z-index:1;
  width:min(var(--c-container), 100% - 2 * var(--c-page-gutter));
  margin:65px auto 0;
  display:grid;
  grid-template-columns:minmax(0, 786fr) minmax(0, 462fr);
  column-gap:30px;
  align-items:center;
}

/* Group 43 - five 344x344 photographs on a 360px pitch, two rows. The exports
   carry their own rounded corners and drop shadow in the alpha and are cropped
   to 344 so the art fills its slot; the shadow is reinstated here, where it can
   sit outside the box without being scaled. */
/* The collage gets a BOX of its own - the frame's 1064x679, scaled to the
   786 column - and its five photographs are placed inside it as percentages
   of that box. A `top` percentage resolves against its containing block's
   HEIGHT, so scaling the rows needed a container whose height scales too;
   `aspect-ratio` is what gives it one. */
.p-home__collage{
  position:relative;
  aspect-ratio:1064 / 679;
}
.p-home__collage-ph{
  position:absolute;
  width:calc(100% * 344 / 1064); height:auto;
  aspect-ratio:1;
  border-radius:var(--c-r-surface);
  background-size:cover;
  background-position:center;
  box-shadow:0 4px 12px rgba(0,0,0,.25);
}
.p-home__collage-ph:nth-child(1){ left:0;                           top:0; }
.p-home__collage-ph:nth-child(2){ left:calc(100% * 360 / 1064);     top:0; }
.p-home__collage-ph:nth-child(3){ left:calc(100% * 720 / 1064);     top:0; }
.p-home__collage-ph:nth-child(4){ left:calc(100% * 127 / 1064);     top:calc(100% * 335 / 679); }
.p-home__collage-ph:nth-child(5){ left:calc(100% * 486 / 1064);     top:calc(100% * 335 / 679); }

/* The apply card: the CV band's copy over «Кандидатствай». Paper Cream,
   because it informs and holds no field - Warm Cream is for a form. Its
   40px padding is `.c-card`'s own. */
.p-home__apply{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:24px;
}
.p-home__apply-text p:last-child{ margin-bottom:0; }

/* ==========================================================================
   6. CONTACT CTA - 4207..4872

   The same card on the same coordinates the Услуги frame draws, which is why
   these numbers match page-pages.css's exactly.
   ========================================================================== */

.p-home__cta{
  position:relative;
  overflow:hidden;
  padding:40px 0;
  background:var(--c-green);
}

/* Rectangle 66 exported flat: image 100, the green base and the layer blur all
   baked into one band-sized bitmap. Do not re-apply a blur. */
.p-home__cta-bg{
  position:absolute;
  inset:0;
  width:100%; height:100%;
  object-fit:cover;
}

/* CENTRED - the same correction `.c-cta-band__card` takes in media.css, and
   for the same reason: the frame's x784 leaves 784 left and 674 right, which
   is aligned to nothing, and as a percentage it walked further off centre as
   the page narrowed before snapping to dead centre at the 1120 restack. This
   band is the source the other six copied.

   IN FLOW, NOT PINNED TO A FIXED-HEIGHT BAND: the card held a 3-field form
   when the band's height was measured at 666px; the optional message field
   added to c-contact-form.tpl (docs/known-issues.md #22) made the card
   ~724px tall, taller than the 626px `overflow:hidden` was leaving it, so
   the submit button was clipped at every width, not only below the 1119
   restack. The band takes its height from the card now, same as below 1119,
   at every width - there is no fixed height left to outgrow. */
.p-home__cta-card{
  position:relative;
  z-index:1;
  width:min(462px, 100% - 2 * var(--c-page-gutter));
  margin-inline:auto;
}

/* ==========================================================================
   7. НАШИТЕ ПАРТНЬОРИ - 4873..5253, the full-bleed Partner Gold band

   The one sanctioned place in the system where gold is a ground rather than a
   stroke, and it is a separate colour from Hairline Gold rather than a state
   of it.
   ========================================================================== */

.p-home__partners{
  position:relative;
  height:380px;
  background:var(--c-gold-deep);
}

/* The band's container is the tiles' own 1475 (six 200s at a 255px pitch),
   centred like every other band here. */
.p-home__sechead--partners{
  width:var(--p-home-w);
  margin:0 auto;
  padding-top:40px;
}

.p-home__ptiles{
  width:var(--p-home-w);
  margin:0 auto;
  /* heading box top 40 + its 73 to the rule's bottom -> tiles open at 140 */
  padding-top:27px;
  display:grid;
  grid-auto-flow:column;
  grid-auto-columns:200px;
  gap:16px;
  justify-content:space-between;
}

/* 200x200 on Field Grey at the media radius - a tile carries a logo, so it is
   16 rather than the card's 20. */
/* A slider below 1360 (page-home.js); above it the track is no box and the
   tiles are this grid's own items. The dots are 393's only. */
@media (min-width: 1360px){
  .p-home__ptiles > .c-slider__track{ display:contents; }
}
@media (min-width: 640px){
  .p-home__ptiles > .c-slider__dots{ display:none; }
}

.p-home__ptile{
  display:flex;
  align-items:center;
  justify-content:center;
  width:200px; height:200px;
  padding:16px;
  background:var(--c-field);
  border-radius:var(--c-r-surface);
  overflow:hidden;
}
.p-home__ptile img{
  max-width:100%;
  max-height:100%;
  width:auto; height:auto;
  object-fit:contain;
}

/* ==========================================================================
   Below 1360 - the careers band's two columns become one.

   «Елате в екипа ни»'s collage and apply card are a two-column grid row on
   the container; below the designed width the 786 column is too narrow for
   a 1064x679 collage to read, so the band stacks: a wrapping collage and the
   card centred under it, below the section head (docs/known-issues.md #77).
   ========================================================================== */

@media (max-width: 1359px){
  .p-home__careers{ padding:58px 0 40px; }   /* the frame's heading offset */
  .p-home__careers-wash{ left:0; }
  .p-home__sechead--careers{
    width:min(var(--c-container), 100% - 2 * var(--c-page-gutter));
    margin:0 auto;
  }
  /* One column: the collage, then the card centred under it. Five 344s on a
     360 pitch become a wrapping row that centres its last line - the same
     two-over-three honeycomb the frame draws, and what the MOBILE frame
     draws too (123s at a 129 pitch, three then two offset by half a cell). */
  .p-home__careers-body{
    grid-template-columns:minmax(0, 1fr);
    row-gap:40px;
    margin-top:40px;
  }
  .p-home__collage{
    aspect-ratio:auto;
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    gap:16px;
  }
  .p-home__collage-ph{
    position:static;
    width:min(344px, calc((100% - 32px) / 3));
    height:auto;
    aspect-ratio:1;
  }
  .p-home__apply{
    width:min(462px, 100%);
    justify-self:center;
  }

  /* The partner row is six 200s at a 255 pitch and comes to 1475 whatever the
     page does. It scrolls rather than overflows, which is also what the frame
     draws at 393 - three tiles with the first and last off the edges. */
  .p-home__partners{ height:auto; padding-bottom:40px; }
  .p-home__ptiles{
    display:block;
    width:auto;
    margin-inline:0;
    padding-inline:var(--p-home-inset);
    /* the snap area is inset by THIS and not by the padding above - see
       .c-rail in slider.css, docs/known-issues.md #66 */
    scroll-padding-inline:var(--p-home-inset);
    overflow-x:auto;
    scroll-snap-type:x proximity;
    scrollbar-width:none;
  }
  .p-home__ptiles::-webkit-scrollbar{ display:none; }
  .p-home__ptiles > .c-slider__track{ --c-slider-gap:16px; }
}

/* ==========================================================================
   Below 1360 - the hero stops being an absolute composition.

   Its three objects are placed on the container: the chip and the map at
   left 0, the search panel at left 814. 814 + 414 is 1228, and the container
   is `min(1278px, 100% - 2 x 40)` - so it is 1228 wide only from 1308 up, and
   does not lock on the designed 1278 until 1358. The panel therefore crossed
   the right edge of every viewport from 1267 down, by up to 148px at 1120:
   half the search panel and the whole «Търси» button were off the page,
   across a 148px band.

   THIS BLOCK WAS WRITTEN AT 1119 AND THE ARITHMETIC ABOVE IT WAS DONE FOR
   1120 ALONE. The reason was right and the width was wrong, and the `adapt`
   pass's own probe could not see it: `.p-home__hero` clips, so an
   `overflow:hidden` ancestor excused every one of its children - the exact
   trade `docs/dev-workflow.md` warns the probe makes. The width to restack at
   is the one where the container stops being the 1278 the composition is
   drawn on, and that is the 1360 breakpoint, not a fourth one.

   In flow the panel goes first - it is what the band is for - and the map
   follows it, which is the same order the Search page takes and the order the
   mobile frame implies by putting «Карта» inside the panel.

   THE MAP IS NOT SCALED. Its frosted silhouette is clipped by `#sofiaClip`,
   which is `userSpaceOnUse` on an exact 791.954x730.002 canvas, so the
   artwork and its clip cannot be resized independently and a fluid map would
   lose the frost that IS the city's colour. It keeps its 732 and pans inside
   a scroller instead - the same answer `.c-rail` gives a card row.
   ========================================================================== */

@media (max-width: 1359px){
  .p-home__hero{ height:auto; }
  .p-home__hero-inner{
    height:auto;
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    gap:24px;
    /* ONLY THE HORIZONTAL COMPOSITION GIVES WAY HERE. The nav is still the
       floating pill above 1120 and it is absolutely placed INSIDE this band -
       top 54, height 68 - so a flowed first child on a 40px padding runs
       straight under it. 227 is the frame's own top for the search panel,
       which is 105 below the pill's 122: the panel keeps the y the frame
       gives it and only stops being placed on an x. Below 1120 the header is
       the full-bleed bar and sits above the hero, so the 40 comes back. */
    padding:227px 0 40px;
  }
  .p-home__chip{ position:static; order:3; }
  .p-home__search{
    position:static;
    order:2;
    width:100%;
    max-width:414px;
    height:auto;
  }
  .p-home__mapscroll:not([hidden]){
    display:block;
    order:4;
    width:100%;
    overflow-x:auto;
    /* `overflow-x:auto` computes overflow-y to `auto` as well, so the scroller
       has to be given the frost's own bleed or it clips it: the clip canvas is
       792x730 against a 732x670 map, i.e. 30px past the artwork on every side,
       and that margin is where the silhouette's drop shadow lives. 30 of
       padding pulled back by 30 of margin gives the bleed room without moving
       the map or opening 60px of scrollable height. */
    overflow-y:hidden;
    padding-block:30px;
    margin-block:-30px;
    margin-inline:calc(-1 * var(--c-page-gutter));
    padding-inline:var(--c-page-gutter);
    scrollbar-width:none;
  }
  .p-home__mapscroll::-webkit-scrollbar{ display:none; }
  /* RELATIVE, NOT STATIC, and this is docs/known-issues.md #74 - which turns
     out to understate it. The map's three frosted layers are absolutely
     positioned children of this element at left/top -30; `position:static`
     stops it being their containing block, so all three resolved against
     `.p-home__hero` instead and painted at y111 while the map sat at y811 -
     700px up the page, behind the search panel. Below 640 the landing map
     therefore had NO FROST AT ALL: the districts are unfilled by design and
     what the city reads as IS `.p-home__map-base`, so the artwork rendered as
     167 black hairlines over a photograph of a living room.

     The offsets have to be cleared explicitly - `position:relative` keeps
     them, which is the trap the `adapt` pass already paid for once. */
  .p-home__map{
    position:relative;
    left:auto; top:auto;
    flex:0 0 auto;
  }
}

/* ==========================================================================
   Below 1120 - the page's remaining 1920 coordinates.
   ========================================================================== */

@media (max-width: 1119px){
  /* The header is the full-bleed bar from here down and no longer overlaps
     the hero, so the 227 that cleared the floating pill goes back to 40. */
  .p-home__hero-inner{ padding-top:40px; }

  /* The three card rows and the two-up service grid stop being 1920 rows. */
  .p-home__prow--1,
  .p-home__prow--2{
    grid-template-columns:repeat(auto-fit, minmax(min(100%, 420px), 1fr));
    gap:17px;
  }
  .p-home__scards{ grid-template-columns:minmax(0, 1fr); }
  .p-home__quote-row{
    grid-template-columns:repeat(auto-fit, minmax(min(100%, 300px), 1fr));
  }

  /* The three fixed band heights are all 1920 numbers. */
  .p-home__quotes{ height:auto; padding-bottom:80px; }
  .p-home__quotes-bg{ height:100%; }
  /* The pane STAYS. It was a fixed 1497x480 inside a fixed 666 band and both
     of those are 1920 numbers, but it is not decoration: the heading, the
     link and the three cards are all Soft Ink, and without the frosted
     surface under them they sit on a dark photograph and disappear. Insets
     rather than a size, so it takes the band's own height. */
  .p-home__quotes-pane{
    top:60px; bottom:60px;
    height:auto;
    width:var(--p-home-w);
  }
  .p-home__quotes-inner{ padding-top:100px; }
}

/* ==========================================================================
   393 - the mobile Landing frame, siteassets/frames-mobile/Landing.png.

   THE SECTION LINK LEAVES THE HEADING ROW. Three instances and they are
   unanimous: «→ Виж всички имоти» at x95 under the offer pair, «→ Повече
   информация» at x88 under the service rail and «→ Екип» at x161 under the
   quotes - every one of them centred under its band rather than opposite its
   heading. `.p-home__sechead` goes `display:contents` so the heading and the
   link can be ordered around the content between them without either moving
   in the markup.
   ========================================================================== */

@media (max-width: 639px){

  .p-home__featured,
  .p-home__services,
  .p-home__quotes-inner{
    display:flex;
    flex-direction:column;
  }
  /* Scoped to the three bands whose link moves, NOT to every sechead: the
     careers band's own is `position:relative` for its z-index, and
     `display:contents` would throw away the box that carries it, which is
     what puts it in front of the band's photograph. */
  .p-home__featured > .p-home__sechead,
  .p-home__services > .p-home__sechead,
  .p-home__quotes-inner > .p-home__sechead{ display:contents; }
  .p-home__sechead .c-heading{ order:1; }
  .p-home__more{
    order:9;
    align-self:center;
    margin-top:22px;      /* link box y1261, 31 under the last card's 1230 */
  }

  /* --- 1. the hero ----------------------------------------------------- */
  /* The panel is full bleed at 393 - the frame draws it 0..393 over a
     photograph that is 298 tall under a 532 panel - and its field column
     opens at x29, which is the desktop 40 one step in. */
  /* The panel is the whole band at 393: it is opaque Soft Ink - sampled
     #1c1c1c at zero spread at three heights on the frame - 393 wide and 532
     tall over a photograph that is only 298, so the frame's hero photograph
     is entirely behind it. Nothing else is drawn in the band, the chip
     included: it reports on a map that is collapsed here, and the frame draws
     neither. It comes back the moment the band does, at 640. */
  .p-home__hero-inner{ gap:0; padding:0; }
  .p-home__chip{ display:none; }
  .p-home__search{
    max-width:none;
    margin-inline:calc(-1 * var(--c-page-gutter));
    width:calc(100% + 2 * var(--c-page-gutter));
    padding:24px 25px 24px 29px;
    border-radius:0;
  }
  .p-home__search::before{ border-width:0 0 2px; }
  /* 297x70 for the title and 299x27 for the sub - the same two boxes the
     1920 panel carries, so neither changes. The GRID does: two 160s at a 19
     gap is 339 of a 361 column, which is the frame's own row to the pixel. */
  .p-home__search-grid{ grid-template-columns:repeat(2, minmax(0, 1fr)); }

  /* «Карта» left, «Търси» right - the frame puts the button at x260 on a row
     the map link opens. It is a link here rather than the Search page's
     stroked control, because that is what the frame draws: 20px white type
     on the panel, the same treatment «Разширено търсене» has above it. */
  .p-home__search-go{
    justify-content:space-between;
    align-items:center;
    margin-top:14px;      /* button y578, 14 under the adv row's 558 */
  }
  .p-home__maplink:not([hidden]){
    display:inline;
    background:none;
    border:0;
    padding:0;
    font:400 var(--c-fs-nav)/27px var(--c-sans);
    color:var(--c-white);
    text-decoration:underline;
    cursor:pointer;
  }

  /* --- 2. Избрани имоти ------------------------------------------------ */
  /* Two 361x241 cards, 10 apart - the photograph's own pitch, 738 -> 989,
     the same one the Search page's grid takes. */
  .p-home__featured{ padding:24px 0 32px; }
  .p-home__featured .p-home__sechead{ height:auto; }
  .p-home__prow{ order:2; }
  .p-home__prow--1,
  .p-home__prow--2{
    grid-template-columns:minmax(0, 1fr);
    gap:10px;
  }
  .p-home__prow--1{ margin-bottom:10px; }

  /* --- 3. Нашите Услуги ------------------------------------------------ */
  /* The four service cards become the first of this page's three rails -
     331x190 at a 343 pitch with the first at x32 and its neighbours off both
     edges. The title is the system's 24 here as it is everywhere now -
     «Отдаване» boxes 119 on this frame, which is 24px Playfair's 116 and not
     30px's 145. That measurement is what settled the desktop card too. */
  /* THE BAND CARRIES THE GUTTER, because `display:contents` on its sechead
     throws the box that used to. Above 640 the heading and its link sit in a
     `width:min(container); margin:0 auto` sechead; below it that element stops
     generating a box so the link can be ordered under the cards, and both the
     heading and the link fell to x0 on a full-bleed band with no inline
     padding of its own - the only visible text anywhere on the site left of
     x16 at 393. The quotes band already does exactly this
     (`.p-home__quotes-inner`), which is why its heading was never wrong.
     `.c-rail` bleeds back out through its own negative margin.
     docs/known-issues.md #67. */
  .p-home__services{ padding:16px var(--c-page-gutter) 32px; }
  /* white on the green band, as the frame draws them */
  .p-home__scards > .c-slider__dots{ color:var(--c-white); }
  .p-home__scards{
    order:2;
    display:block;        /* the slider's container (slider.css) */
    /* `auto` and an explicit bleed, both because of the band's new gutter:
       the desktop rule is `margin:N auto 0`, which beats `.c-rail`'s own
       `margin-inline` on source order and pinned the rail inside the padding -
       so the first card rested at 32 and the last was clipped 16 short of the
       screen edge instead of running off it. `width:100%` would have kept the
       right half of that. */
    width:auto;
    margin-inline:calc(-1 * var(--c-page-gutter));
    margin-top:23px;      /* cards y1382, 23 under the rule's 1359 */
  }
  /* 331x190, the rail's own track width. */
  .p-home__scard{
    width:331px;
    min-height:190px;
    padding:20px;
  }

  /* --- 4. Какво казват нашите клиенти ---------------------------------- */
  /* The pane comes back at 393 and it is the whole band: the frame draws it
     0..393 x 1661..2009, edge to edge and square, where at 1920 it is a 1497
     pane with a 60px radius floating inside a 666 band. */
  .p-home__quotes{ height:auto; padding-bottom:24px; }
  .p-home__quotes-pane{
    display:block;
    top:0;
    width:100%; height:100%;
    border-radius:0;
  }
  .p-home__quotes-inner{ width:100%; padding:16px var(--c-page-gutter) 0; }
  .p-home__quote-row{
    order:2;
    display:block;        /* the slider's container (slider.css) */
    margin-top:13px;      /* cards y1761, 13 under the rule's 1748 */
    /* .c-rail bleeds to the screen edges; the pane it sits on is the band. */
    padding-block:0;
  }
  /* 331x190 at a 342 pitch - the second rail. */
  /* A FLOOR, not a height - the same correction `harden` made to the desktop
     card and this one kept: `testimonials.person` runs to 32 characters, which
     is two lines in a 331px card, and at a locked 190 that second name line
     pushed the quote's last line under the card's own overflow. */
  .p-home__quote{
    width:331px;
    min-height:190px;
    padding:20px;
  }
  .p-home__quote-text{ max-width:none; }

  /* --- 5. Елате в екипа ни --------------------------------------------- */
  /* THE COPY IS NOT DRAWN. The frame keeps the heading, the collage and a
     180x50 «Кандидатствай» in Estate Green (sampled #1e5d43 at zero spread),
     so below 640 the apply card sheds its chrome and its copy and is the
     button alone - the frame's decision, kept. */
  .p-home__careers{ padding:16px 0 32px; }
  .p-home__careers-body{
    margin-top:19px;      /* collage y2076, 19 under the rule's 2057 */
    row-gap:20px;         /* button y2339, 20 under the collage's 2319 */
  }
  .p-home__collage{ gap:6px; }   /* 123s at a 129 pitch */
  .p-home__collage-ph{ width:calc((100% - 12px) / 3); }
  .p-home__apply{
    width:auto;
    padding:0;
    background:none;
    box-shadow:none;
    align-items:center;
  }
  .p-home__apply-text{ display:none; }

  /* --- 6. the contact CTA ---------------------------------------------- */
  /* Card 324x392 at x38, which is centred to the half pixel; forms.css has
     already taken the 462 card down to 324 at this width. */
  .p-home__cta{ padding:21px 0 24px; }

  /* --- 7. Нашите партньори --------------------------------------------- */
  /* 150x150 tiles at a 162 pitch - the third rail. */
  .p-home__partners{ padding-bottom:32px; }
  .p-home__sechead--partners{ width:100%; padding:19px var(--c-page-gutter) 0; }
  .p-home__ptiles{
    margin-inline:0;
    padding:23px var(--c-page-gutter) 0;
    scroll-padding-inline:var(--c-page-gutter);
  }
  .p-home__ptiles > .c-slider__track{ --c-slider-gap:12px; }
  .p-home__ptile{ width:150px; height:150px; }
  /* white on the gold band, as the frame draws them */
  .p-home__ptiles > .c-slider__dots{ color:var(--c-white); }
}