/*
 * responsive.css - the layout below 1440, and the banding above it.
 *
 * NOTE ON THE DOUBLED CLASS. Selectors here read `.wp-block-post-content.wp-block-post-content`.
 * The repetition is deliberate and load-bearing: site.css writes `body.page-id-N #dc-x > ...` and
 * grid.css writes chains rooted on an id, so a hand rule needs one more class than either to win a
 * cascade it is supposed to win. Three separate rules in this file were correct, matched their
 * element, and did nothing at all before the class was doubled.
 *
 * HAND-AUTHORED. site.css and grid.css are generated; this file is not, and nothing regenerates
 * it. The split is deliberate: at 1440 the design exists and the build is measured against it, so
 * that band is arithmetic. Below 1440 there is no artboard in the Figma file - every frame is
 * 1440 wide - so the layout is a design decision, and design decisions do not belong in a
 * derivation. The ladder is the one the other agency themes use (Autostatyba, Vytintas), fitted to
 * this design's own column of 1312 inside 1440.
 *
 * Load order matters: site.css, then grid.css, then this. Everything here is at least as specific
 * as what it overrides and comes later, so ties go to this file.
 */

/* ------------------------------------------------------------------ *
 * 1. The gutter ladder.
 *
 * One variable, stepped at the house breakpoints. site.css computes its own
 * clamp(16px,4.444vw,64px); this replaces it everywhere so the page has ONE column and every
 * section starts and ends on it - which is the thing the operator checks first, by drawing a line
 * down from the logo.
 * ------------------------------------------------------------------ */
:root {
  --dm-gutter: 64px;
  /*
   * THE MOBILE SPACING SCALE. Declared unconditionally so it is greppable; only used below 1024.
   * Every gap in the responsive layer resolves to one of these six values - the point is that a
   * reader can feel a system rather than fifteen numbers inherited from an artboard.
   */
  --dm-1: 8px; --dm-2: 16px; --dm-3: 24px; --dm-4: 32px; --dm-5: 48px; --dm-6: 64px;
  /* ONE section rhythm. Every top-level section, top and bottom, no exceptions but the heroes. */
  --dm-sec: 96px;
}
@media (max-width: 1439.98px) { :root { --dm-gutter: 48px; --dm-sec: 72px; } }
@media (max-width: 1439.98px)  { :root { --dm-gutter: 32px; --dm-sec: 56px; } }
@media (max-width: 767.98px)   { :root { --dm-gutter: 24px; --dm-sec: 48px; } }
@media (max-width: 479.98px)   { :root { --dm-gutter: 20px; --dm-sec: 40px; } }

@media (max-width: 1439.98px) {

  /* The canvas holds the column; full-bleed bands come back out through it (site.css already
   * pairs each negative margin with an equal padding, so they only need the same value here). */
  .wp-block-post-content {
    padding-left: var(--dm-gutter) !important;
    padding-right: var(--dm-gutter) !important;
    display: flex !important;
    flex-direction: column !important;
  }
  .wp-block-post-content > * { order: 10; }

  /* A section's height is a 1440 measurement. Below that it must come from its contents, or the
   * page grows voids - the gallery kept a 2,838px hero on a phone, most of it empty black. */
  .wp-block-post-content section,
  .wp-block-post-content .wp-block-group,
  .wp-block-post-content .wp-block-columns,
  .wp-block-post-content .wp-block-column { min-height: 0 !important; height: auto !important; }

  /*
   * Covers keep the height the generator wrote inline, which is their design height. A blanket
   * `min-height:62vh` here was wrong for every nested cover on the site: an achievement card is a
   * 380px picture and became a 558px one, overflowing the card it lives in. Only the page heroes
   * get a viewport-relative height, and they get it by name below.
   */
  .wp-block-post-content .wp-block-cover { max-width: none !important; }

  /* Design gaps in px are a 1440 rhythm; cap them rather than delete them, so the intent survives
   * and a 154px gap does not eat half a phone screen. */
  /*
   * A design spacer is a 1440 measurement. Capped with a clamp it rendered at whatever the
   * viewport produced - 12.5px, 17px, 22px - so the page carried fifteen distinct vertical gaps.
   * Three fixed steps instead, all on the scale.
   */
  .wp-block-post-content .wp-block-spacer { max-height: 24px !important; min-height: 0 !important; }
}
@media (max-width: 767.98px) {
  .wp-block-post-content .wp-block-spacer { max-height: 16px !important; }
}
@media (max-width: 479.98px) {
  .wp-block-post-content .wp-block-spacer { max-height: 8px !important; }
}
@media (max-width: 1439.98px) {

  /* Absolute positioning is a 1440 mechanism. Anything still holding a design offset below that
   * width is holding a number measured against a frame that no longer exists. */
  .wp-block-post-content [style*="position:absolute"],
  .wp-block-post-content [style*="position: absolute"] { position: static !important; }

  /* Media: a photograph fills its cell, an icon keeps its size. site.css already splits the two
   * at 200px of design width; this only removes the leftover max-width so a photo can grow with
   * its column instead of stopping at the size it happened to be drawn. */
  .wp-block-post-content figure.wp-block-image { margin: 0 !important; width: 100% !important; }
  .wp-block-post-content figure.wp-block-image > img[width][height] { max-width: 100% !important; }

  /* Rows never scroll sideways. */
  .wp-block-post-content .wp-block-columns > .wp-block-column { min-width: 0 !important; }
}

/* ------------------------------------------------------------------ *
 * 2. The header.
 *
 * The design draws the header ON TOP of the hero, so in document order it comes after it. At 1440
 * absolute positioning puts it back at y=0; in flow it lands in the middle of the page - on the
 * home page the navigation sat below a full-screen photograph, 1,110px down. Two pages need the
 * hoist; on the other four the header is already the first section.
 * ------------------------------------------------------------------ */
@media (max-width: 1439.98px) {
  body.page-id-4 .wp-block-post-content.wp-block-post-content #dc-59-2291,            /* pagrindinis */
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-104-529 { order: 1 !important; }   /* kontaktai */
  body.page-id-4 .wp-block-post-content.wp-block-post-content #dc-59-2289 { order: 2 !important; }    /* the DOMAS wordmark, above the photo */
  body.page-id-4 .wp-block-post-content.wp-block-post-content #dc-59-2155-implicit { order: 3 !important; }
  body.page-id-4 .wp-block-post-content.wp-block-post-content #dc-59-2271 { order: 4 !important; }
  body.page-id-4 .wp-block-post-content.wp-block-post-content #dc-59-2280 { order: 5 !important; }
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-59-1770 { order: 2 !important; }

  /* The navigation is a logo and five links drawn as a column ruler. Below the design width it
   * becomes a wrapped bar: logo left, links after it, both on the column. */
  body .wp-block-post-content.wp-block-post-content #dc-59-2291 > .wp-block-columns,
  body .wp-block-post-content.wp-block-post-content #dc-105-711 > .wp-block-columns,
  body .wp-block-post-content.wp-block-post-content #dc-105-734 > .wp-block-columns,
  body .wp-block-post-content.wp-block-post-content #dc-103-478 > .wp-block-columns,
  body .wp-block-post-content.wp-block-post-content #dc-104-529 > .wp-block-columns,
  body .wp-block-post-content.wp-block-post-content #dc-59-1525 .wp-block-columns:has(> .wp-block-column > figure > #dc-97-1119) {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    justify-content: flex-start !important;
    column-gap: clamp(14px, 2.2vw, 32px) !important;
    row-gap: 10px !important;
  }
}

/* ------------------------------------------------------------------ *
 * 3. The hero.
 *
 * The design draws DOMAS above the photograph and BUTKUS on it, with the two buttons under both,
 * as one composition. In flow they are four separate sections, so the pieces need to be put back
 * in order and the photograph needs to reach both edges - a hero inset by the page gutter reads as
 * a picture ON the page rather than the top OF it.
 * ------------------------------------------------------------------ */
@media (max-width: 1439.98px) {
  /* Out through the canvas gutter, and no taller than a phone screen. The design height is 1086px,
   * which is nearly three screens on a 390 viewport and buries everything under it. */
  /* The bleed and the height cap are derived for every page hero now (see tools/flow-grid.mjs);
   * only the crop is a judgement - the rider's head is in the upper third of this photograph and a
   * centred crop cuts it off. */
  body.page-id-4 .wp-block-post-content.wp-block-post-content #dc-59-2512 img { object-position: 50% 30% !important; }
  /* DOMAS sits directly on top of the picture, not a screen above it. */
  body.page-id-4 .wp-block-post-content.wp-block-post-content #dc-59-2289 { padding-bottom: 0 !important; margin-bottom: 0 !important; }
  body.page-id-4 .wp-block-post-content.wp-block-post-content #dc-59-2155-implicit { padding-top: 0 !important; }
}

/* ------------------------------------------------------------------ *
 * 4. Chrome that has to work at any width: buttons, the footer, the gallery filter.
 * ------------------------------------------------------------------ */
@media (max-width: 1439.98px) {
  /* A button is a tap target before it is a rectangle: 44px is the floor.
   *
   * `white-space: nowrap` lived here until 2026-09-08, to stop "KALBĖKIM / E" breaking mid-word in
   * the footer of all six pages. It stopped the wrong thing: nowrap also forbids wrapping at
   * SPACES, so a label wider than its pill has nowhere to go and simply hangs outside it - which is
   * what "APIE MANO TRENIRUOTES" did on pasiekimai, 32px out at 600 and 8px at 768. The mid-word
   * break was never white-space's job anyway; it was core's `word-break: break-word` inherited from
   * `.wp-block-column`, and section 70 resets that at source. So: wrap between words, never inside
   * one. A two-line pill is a pill; a label lying across the outside of one is a defect. */
  .wp-block-post-content .wp-block-button__link,
  .wp-block-post-content a.wp-block-button__link {
    min-height: 44px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    white-space: normal !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
    hyphens: none !important;
    width: auto !important;
    max-width: 100% !important;
  }

  /* The footer's four blocks are narrow enough on a phone that an email address breaks mid-word.
   * One column below 560 is the honest fix - there is no width at which two columns hold
   * "info@domasbutkus.lt" and a phone number side by side. */
  .wp-block-post-content > section:last-child p,
  .wp-block-post-content > section:last-child a { overflow-wrap: break-word; }
}
@media (max-width: 559.98px) {
  .wp-block-post-content > section:last-child .wp-block-columns {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

/* ------------------------------------------------------------------ *
 * THE GALLERY FILTER lived here across two earlier rounds - a wrapped row of plain chips with the
 * two carousel arrows kept beside them - and is SUPERSEDED BY SECTION 27, which rebuilds the row
 * as a horizontal snap rail of real pills and drops the arrows.
 *
 * Removed rather than left in place, for the reason that keeps recurring in this file: those rules
 * were written with `:first-of-type`, so at (1,3,2) they silently beat section 27's (1,3,1) and
 * the new `flex-wrap:nowrap` never applied. The chips went on wrapping and nothing in either block
 * looked wrong. Two live attempts at one section is how that happens, every time.
 *
 * What is kept from them is the finding, which still holds: the four chips' ICONS cannot be
 * paired with their labels below 1440. One is inside its chip, two are loose siblings of the row,
 * and the rest live in a second row the design overlays on the first - so in flow every icon sits
 * beside whichever label follows it. Section 27 keeps the pills plain for that reason.
 * ------------------------------------------------------------------ */

/* ------------------------------------------------------------------ *
 * 5. Two corrections that only show up once the hero is full-bleed.
 * ------------------------------------------------------------------ */
@media (max-width: 1439.98px) {
  /*
   * A full-bleed cover still has to keep its words on the column. site.css zeroes cover padding
   * (right, because at 1440 the position is absolute), and once the hero spans edge to edge that
   * left "BUTKUS" and the tagline hard against the left side of the screen. The card covers inside
   * the page keep their own tighter padding - those rules are keyed on an id and outrank this.
   */
  .wp-block-post-content > section > .wp-block-cover > .wp-block-cover__inner-container,
  .wp-block-post-content > section.wp-block-cover > .wp-block-cover__inner-container {
    padding-left: var(--dm-gutter) !important;
    padding-right: var(--dm-gutter) !important;
    box-sizing: border-box !important;
  }
}

@media (max-width: 767.98px) {
  /*
   * The navigation on a phone: the logo takes its own line and the five links wrap under it, all
   * starting on the column. Five labels at their design size need 677px of row - three ragged
   * lines at 390 - so the type steps down here and only here.
   */
  body .wp-block-post-content.wp-block-post-content #dc-59-2291 > .wp-block-columns,
  body .wp-block-post-content.wp-block-post-content #dc-105-711 > .wp-block-columns,
  body .wp-block-post-content.wp-block-post-content #dc-105-734 > .wp-block-columns,
  body .wp-block-post-content.wp-block-post-content #dc-103-478 > .wp-block-columns,
  body .wp-block-post-content.wp-block-post-content #dc-104-529 > .wp-block-columns,
  body .wp-block-post-content.wp-block-post-content #dc-59-1525 .wp-block-columns:has(> .wp-block-column > figure > #dc-97-1119) {
    column-gap: 18px !important;
    row-gap: 10px !important;
  }
  body .wp-block-post-content.wp-block-post-content #dc-59-2291 > .wp-block-columns > .wp-block-column:has(figure),
  body .wp-block-post-content.wp-block-post-content #dc-105-711 > .wp-block-columns > .wp-block-column:has(figure),
  body .wp-block-post-content.wp-block-post-content #dc-105-734 > .wp-block-columns > .wp-block-column:has(figure),
  body .wp-block-post-content.wp-block-post-content #dc-103-478 > .wp-block-columns > .wp-block-column:has(figure),
  body .wp-block-post-content.wp-block-post-content #dc-104-529 > .wp-block-columns > .wp-block-column:has(figure) {
    /* Longhands, not the `flex` shorthand: core stacks columns with
     * `.wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column{flex-basis:100%!important}`
     * and grid.css resets `flex-basis:auto!important`, and a shorthand that resolves against those
     * left the logo sharing its line with two links. Each part is stated on its own. */
    flex-basis: 100% !important;
    flex-grow: 0 !important;
    flex-shrink: 0 !important;
    max-width: 100% !important;
    margin-bottom: 4px !important;
  }
  body .wp-block-post-content.wp-block-post-content #dc-59-2291 p, #dc-105-711 p, #dc-105-734 p, #dc-103-478 p, #dc-104-529 p {
    font-size: 12.5px !important;
    letter-spacing: .08em !important;
  }
}

/* ------------------------------------------------------------------ *
 * 6. Rows that hold an address.
 *
 * An email and an @handle have no break opportunity, so a two-column row on a phone splits them
 * mid-word ("info@domasb / utkus.lt"). These rows go single-column early - there is no width
 * between 390 and 560 at which two of them fit side by side.
 * ------------------------------------------------------------------ */
@media (max-width: 559.98px) {
  /* The OUTER row only. Applied to every descendant it also flattened each icon-and-value pair
   * inside the block, so the phone icon sat on its own line above the word TELEFONAS. */
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-59-1545 > .wp-block-columns,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-59-1770 .wp-block-columns:has(a[href^="mailto"]) {
    grid-template-columns: minmax(0, 1fr) !important;
  }
  /*
   * ONLY WHERE AN UNBREAKABLE STRING ACTUALLY LIVES. This was on every paragraph and every link on
   * the site, to stop "info@domasbutkus.lt" splitting as "info@domasb / utkus.lt" in a narrow
   * footer column. Applied everywhere it also gave ordinary Lithuanian words permission to break
   * mid-word, and at 390 the apie-doma statistics have a 105px text column - so "APDOVANOJIMŲ"
   * rendered as "APDOVANOJIM" with a lone "Ų" on the next line. An address has no break
   * opportunity; a word does, and should use it.
   */
  .wp-block-post-content .dm-contactlink,
  .wp-block-post-content .dm-contactlink *,
  .wp-block-post-content a[href^="mailto"],
  .wp-block-post-content a[href^="tel"] { overflow-wrap: anywhere; }
}

/* ------------------------------------------------------------------ *
 * 7. THE MOBILE HEADER.
 *
 * Logo left, toggle right, a full-screen panel behind it. Shape follows the same reference the
 * Autostatyba theme used - it is what every construction and sport brand of this size does, and it
 * is the one thing on this site that most clearly was not drawn for a phone: five labels wrapping
 * into three ragged rows under a logo.
 *
 * The bar is sticky, because on a page that is 8,000px long on a phone a header that scrolls away
 * at the top means the only way back is to scroll all the way up.
 * ------------------------------------------------------------------ */
@media (max-width: 1439.98px) {
  .wp-block-post-content.wp-block-post-content > .dm-header {
    position: sticky !important;
    top: 0 !important;
    z-index: 60 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: var(--dm-3) !important;
    background: #000 !important;
    box-shadow: 0 1px 0 #ffffff14 !important;
    /* ~80px of bar: enough for the mark to read, little enough to give the page back its screen. */
    padding-top: 14px !important;
    padding-bottom: 14px !important;
  }
  /* Everything the design drew into the header row goes; the bar is the logo and the toggle. */
  .dm-header > .wp-block-spacer { display: none !important; }
  /* The header row keeps the design's column ruler - a grid that fills the bar - so the toggle
   * ended up in the middle of the screen. Collapse it to just the logo it now carries. */
  .dm-header .wp-block-columns {
    display: block !important;
    flex: 0 0 auto !important;
    width: auto !important;
    grid-template-columns: none !important;
  }
  /* THREE classes, not two. `.wp-block-post-content .dm-navlink{display:flex!important}` in the
   * link-wiring block below is also (0,2,0) and comes later in the file, so at equal specificity
   * it won - and on pasiekimai, the one page where the design draws the navigation inside the hero
   * rather than in a header of its own, the five labels went on rendering under the bar and wrapped
   * onto a second line straight through the H1. */
  .wp-block-post-content .dm-header .dm-navlink { display: none !important; }
  .dm-header .wp-block-columns > .wp-block-column:not(:has(.dm-homelink)) { display: none !important; }
  .dm-header .dm-homelink { display: block !important; }
  .dm-header .dm-homelink img { width: 76px !important; height: auto !important; }

  .dm-burger {
    flex: 0 0 auto;
    /* Core's constrained layout puts `margin-left:auto;margin-right:auto !important` on every
     * direct child of the section, which CENTRED the toggle in the bar. Both sides have to be
     * stated, and with !important, to get it back to the edge. */
    margin-left: auto !important;
    margin-right: 0 !important;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 5px;
    width: 44px;               /* 44 is the tap floor, not a look */
    height: 44px;
    padding: 0 8px;
    background: none;
    border: 0;
    cursor: pointer;
  }
  .dm-burger span {
    display: block;
    height: 2px;
    background: #fff;
    border-radius: 2px;
    transition: background .15s ease;
  }
  .dm-burger span:nth-child(2) { width: 72%; }
  .dm-burger:hover span { background: #e22f2d; }

  /*
   * THE MENU'S BOTTOM BUTTON, for the third time - and this is the cause the first two missed.
   *
   * `inset: 0` on a fixed element resolves against the LARGE viewport on a phone: the one you get
   * with the browser's address bar hidden. With the bar showing, the last 60-100px of the panel -
   * which is exactly where a `margin-top: auto` button lives - sits behind it. Nothing reproduces
   * in a headless browser, whose viewport has no chrome, which is why it kept coming back.
   *
   * `100dvh` is the dynamic viewport height and it tracks what is actually visible. `100vh` stays
   * as the fallback for anything that does not know `dvh`, and the sticky bottom underneath means
   * the button is reachable even then: if the content ever outgrows the panel it pins to the
   * bottom of the scrollport instead of scrolling away below it.
   */
  .dm-panel {
    position: fixed;
    inset: 0 0 auto 0;
    height: 100vh;
    height: 100dvh;
    z-index: 100;
    background: #0a0b0d;
    overflow-y: auto;
    overscroll-behavior: contain;
  }
  .dm-panel__inner {
    position: relative;
    min-height: 100%;
    display: flex;
    flex-direction: column;
    /* The home indicator on a modern phone sits over the last ~34px of the screen. */
    padding: var(--dm-3) var(--dm-gutter) calc(var(--dm-5) + env(safe-area-inset-bottom, 0px));
    box-sizing: border-box;
  }
  /* The panel covers the bar, so the brand would vanish while the menu is open. */
  .dm-panel__logo { display: block; width: 92px; }
  .dm-panel__logo img { width: 92px; height: auto; display: block; }
  .dm-panel__close {
    position: absolute;
    top: var(--dm-3);
    right: var(--dm-gutter);
    width: 44px;
    height: 44px;
    background: none;
    border: 0;
    cursor: pointer;
  }
  .dm-panel__close span {
    position: absolute;
    left: 10px;
    top: 21px;
    width: 24px;
    height: 2px;
    background: #fff;
    border-radius: 2px;
  }
  .dm-panel__close span:first-child { transform: rotate(45deg); }
  .dm-panel__close span:last-child { transform: rotate(-45deg); }

  .dm-panel__list {
    list-style: none;
    margin: var(--dm-6) 0 0;
    padding: 0;
    display: flex;
    flex-direction: column;
  }
  .dm-panel__list li + li { border-top: 1px solid #ffffff12; }
  .dm-panel__list a {
    display: block;
    padding: var(--dm-3) 0;
    color: #fff;
    font-family: "Montserrat", sans-serif;
    font-weight: 700;
    font-style: italic;
    font-size: 26px;
    line-height: 1.15;
    letter-spacing: .01em;
    text-transform: uppercase;
    text-decoration: none;
  }
  .dm-panel__list a[aria-current="page"] { color: #e22f2d; }
  .dm-panel__list a:hover { color: #e22f2d; }

  /*
   * THE LABEL SITS IN THE MIDDLE OF THE PILL. This is the fourth report of this button and the
   * first three fixes were all about the wrong thing: whether it could be REACHED - position,
   * 100dvh, a sticky bottom. What was actually being pointed at is that "SUSISIEKTI" printed hard
   * against the top edge with 35px of empty red underneath it, at every width, phone and tablet.
   *
   * The cause is the button contract in section 23. Its selector list includes `.dm-panel__cta`,
   * so the panel's button collects `min-height: 52px` and `padding: 0 28px` from it - but the
   * `display: inline-flex; align-items: center` half of that contract lives in section 15, whose
   * selectors are all prefixed `.wp-block-post-content`, and the panel is appended to the body,
   * outside it. So this button got the contract's HEIGHT without the contract's CENTRING: a 52px
   * box, no vertical padding left, and an 18px line laid at the top of it.
   *
   * Stated here rather than by widening section 15, because that block is about buttons inside the
   * page and this is the one button that is not.
   */
  .dm-panel__cta {
    margin-top: auto;
    position: sticky;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 52px;
    padding: 17px 24px;
    box-sizing: border-box;
    background: #e22f2d;
    border-radius: 9999px;
    color: #fff;
    font-family: "Montserrat", sans-serif;
    font-weight: 700;
    font-size: 14px;
    line-height: 1.15;
    letter-spacing: .1em;
    text-transform: uppercase;
    text-align: center;
    text-decoration: none;
  }

  html.dm-nav-open, html.dm-nav-open body { overflow: hidden; }
}

/* The panel is a mobile object only; if the viewport grows while it is open, it goes. */
@media (min-width: 1440px) { .dm-panel, .dm-burger { display: none !important; } }

/* ------------------------------------------------------------------ *
 * 8. THE BLOCK GAP.
 *
 * Core's flow layout puts 24px between every pair of sibling blocks. That is core's default, not
 * a value from this design - the design's own spacing is carried by its spacers, which are capped
 * separately above. On a phone the two stack: a footer label sat 60px above its own value (24 +
 * a 12px spacer + 24), so "EL. PAŠTAS" and the address it labels read as two unrelated lines.
 *
 * Set once, here, so the vertical rhythm below 1024 comes from the scale and from the design's
 * spacers, and not from a framework default nobody chose.
 * ------------------------------------------------------------------ */
@media (max-width: 1439.98px) {
  .wp-block-post-content.wp-block-post-content { --wp--style--block-gap: var(--dm-1); }
  .wp-block-post-content.wp-block-post-content :where(.is-layout-flow) > * + * { margin-block-start: var(--dm-1); }
  /* A label and the value under it are one object. */
  .wp-block-post-content.wp-block-post-content .wp-block-spacer { margin-block: 0 !important; }
}

/* ------------------------------------------------------------------ *
 * 9. THE HOME HERO, as two parts that read as one.
 *
 * The design stacks DOMAS over BUTKUS on the photograph. In flow they are two sections and the
 * wordmark cannot be put back on top of the picture without pinning a height that no longer
 * exists at this width. So it becomes a deliberate two-part hero instead: the name on black,
 * tight above its own photograph, at the same size as the half that sits on it. What made it look
 * accidental was not the split - it was 48px of section rhythm above and below a single word.
 * ------------------------------------------------------------------ */
@media (max-width: 1439.98px) {
  body.page-id-4 .wp-block-post-content.wp-block-post-content #dc-59-2289 {
    padding-top: var(--dm-5) !important;
    padding-bottom: var(--dm-2) !important;
  }
  /* Both halves already render at the same size; only the rhythm around them was wrong. */
}

/* ------------------------------------------------------------------ *
 * 10. THE INLINE BAR.
 *
 * On pasiekimai the design draws the navigation inside the hero rather than as its own band, so
 * the bar is that row and not the section around it. It gets the same shape - logo left, toggle
 * right - but no background and no sticky: it sits on the hero photograph, where a black bar would
 * cut the picture in two, and a sticky element nested inside a section only sticks within it.
 * ------------------------------------------------------------------ */
@media (max-width: 1439.98px) {
  .wp-block-post-content.wp-block-post-content .dm-header--inline {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: var(--dm-3) !important;
    background: none !important;
    box-shadow: none !important;
    position: static !important;
    padding-top: 0 !important;
    padding-bottom: var(--dm-4) !important;
  }
}

/* ------------------------------------------------------------------ *
 * 11. TAP TARGETS FOR THE LINKS THAT NOW EXIST.
 *
 * Making the navigation, the addresses and the buttons clickable created a new class of defect:
 * a 21px-tall link is a link you miss. Everything tappable clears 44px below the design width.
 * The wrappers are flex so the label stays optically where it was and the box grows around it.
 *
 * This runs across the whole flow band, not just phones: between 1024 and 1439 the full navigation
 * is still shown, on widths that are mostly tablets, and a 21px link is no easier to hit there.
 * ------------------------------------------------------------------ */
@media (max-width: 1439.98px) {
  /*
   * `.dm-contactlink` is NOT in this list any more. A 44px box on the anchor is what made every
   * contact row 44px tall regardless of its content, so a list whose other rows were 21px lines
   * came out at 31px and 19px apart on the home page and 75/75/52/52 on the contact page. Section
   * 57 gives those anchors a stretched ::after instead: the hit area is the whole row, which is
   * larger than 44px, and the anchor no longer sets anyone's height.
   */
  .wp-block-post-content .dm-navlink,
  .wp-block-post-content .dm-homelink,
  .wp-block-post-content .dm-cta {
    display: flex !important;
    align-items: center !important;
    min-height: 44px !important;
    text-decoration: none;
  }
  .wp-block-post-content .dm-contactlink { text-decoration: none; }
  .wp-block-post-content .dm-contactlink > *,
  .wp-block-post-content .dm-navlink > *,
  .wp-block-post-content .dm-cta > * { margin-block: 0 !important; }
  /* The logo link sizes to the mark, which is 34px tall - under the tap floor at both ends of
   * every page. It keeps its width and gains the height. */
  .wp-block-post-content .dm-homelink { width: max-content !important; }
}

/* ------------------------------------------------------------------ *
 * 12. THE TWO BROKEN HEADLINES.
 *
 * Both page titles are interlocking two-word lockups in the design - the words overlap on purpose
 * at 1440, where their offset makes the reading order obvious. Stacked at 390 the offset is gone
 * and only the DOM order is left, which is not the reading order.
 * ------------------------------------------------------------------ */
@media (max-width: 1439.98px) {
  /*
   * APIE DOMĄ. Measured at 390: DOMĄ (red) occupies y420-463 and APIE (white) y463-496 - the page
   * title renders as "DOMĄ APIE", backwards, with a 43px line box on 63px type so the two words
   * jam into each other. Reversing the flex order restores the reading order without touching the
   * generated markup, and the line-height is set from the type size instead of the artboard.
   */
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-105-627 {
    display: flex !important;
    flex-direction: column-reverse !important;
  }
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1886,
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1890 {
    line-height: .92 !important;
    margin: 0 !important;
  }

  /*
   * DOMAS BUTKUS. The surname is set in brand red and lands on the reddest part of the dust
   * vignette, directly across the rider's helmet - the two things the hero exists for cancel each
   * other out. White carries the lockup; the red stays on the marker and the button, where it has
   * something to do.
   */
  body.page-id-4 .wp-block-post-content.wp-block-post-content #dc-59-2509 {
    color: #ffffff !important;
  }
}

/* ------------------------------------------------------------------ *
 * 13. THE ENQUIRY FORM.
 *
 * IMPORTANT, AND NOT A STYLING PROBLEM: there is not a single <input>, <select> or <textarea> on
 * this page. The design's form fields came through as empty <div>s with a 1px bottom rule, so the
 * form is a PICTURE of a form - nothing can be typed into it. That needs a real form building and
 * a destination wiring; it is on the handover list, not fixable here.
 *
 * What is fixable here is that the picture was unreadable too: the field rows measured 13-17px
 * tall with a 1px #242324 rule on a #100f11 card - about 1.4:1 contrast, invisible on a phone. If
 * the client or the designer is going to look at this page on a phone, the fields should at least
 * read as fields.
 * ------------------------------------------------------------------ */
@media (max-width: 1439.98px) {
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-59-1595,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-59-1598,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-59-1613,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-59-1601 {
    min-height: 52px !important;
    height: auto !important;
    background: #191a1e !important;
    border: 1px solid rgba(255, 255, 255, .14) !important;
    border-radius: 8px !important;
    box-sizing: border-box !important;
    margin-top: 6px !important;
  }
  /* The message box is a message box, not another single line. */
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-59-1601 { min-height: 124px !important; }
  /* A label belongs to the field under it, not to the field above it. */
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-59-1594,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-59-1597,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-59-1612,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-59-1600 {
    margin-top: var(--dm-3) !important;
    margin-bottom: 0 !important;
  }
}

/* ------------------------------------------------------------------ *
 * 14. THE LOCKUP.
 *
 * The two halves of the wordmark are one word. The design's spacer between them was measured
 * against a 1440 frame; here it just separates a name from itself.
 * ------------------------------------------------------------------ */
@media (max-width: 1439.98px) {
  .wp-block-post-content .dm-lockup { margin: 0 !important; }
  .wp-block-post-content .dm-lockup > * { margin: 0 !important; line-height: .95 !important; }
  .wp-block-post-content .dm-lockup + .wp-block-spacer { display: none !important; }
}

/* ------------------------------------------------------------------ *
 * 15. ONE BUTTON.
 *
 * There are three kinds of button in this build - a core button block, a label wrapped in a link
 * by functions.php, and a whole section that is really a button - and each was arriving at a
 * different size, a different radius and a different amount of padding. "BENDRADARBIAUKIME" had
 * NO horizontal padding at all: the label started on the pill's left edge and ran under the arrow.
 *
 * One contract, applied to all three. Icon-only controls are exempt - they are 48px circles, and
 * their rule carries an id so it outranks this.
 * ------------------------------------------------------------------ */
@media (max-width: 1439.98px) {
  .wp-block-post-content .wp-block-button__link,
  .wp-block-post-content a.dm-cta {
    min-height: 52px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 10px !important;
    padding: 14px 28px !important;
    border-radius: 9999px !important;
    box-sizing: border-box !important;
    text-align: center !important;
    line-height: 1.2 !important;
  }
  /* The label inside a wrapped one must not re-introduce its own box. */
  .wp-block-post-content a.dm-cta > * { margin: 0 !important; text-align: center !important; }
  /* A button that is its own section fills the column on a phone; the pill is the section. */
  .wp-block-post-content > section > .wp-block-columns .wp-block-button__link { width: auto !important; }
}

/* ------------------------------------------------------------------ *
 * 16. THE SOCIAL CARDS.
 *
 * Three alignments in one 350px card: the icon and the platform name centre-grouped and pushed
 * right, the handle hard against the left border, and a bare arrow centred underneath attached to
 * nothing. All four are siblings of ONE wrapping row, so each wrapped to wherever it fitted and
 * the three red icons landed on three different verticals down the column.
 *
 * Made into a two-column grid: the platform icon on the left spanning both lines, the name and the
 * handle stacked beside it. The trailing arrow is dropped - it is decoration for a link that does
 * not exist yet, and it was the thing making each card a different height.
 * ------------------------------------------------------------------ */
@media (max-width: 1439.98px) {
  body.page-id-9 .wp-block-post-content.wp-block-post-content :is(#dc-59-1639, #dc-59-1658, #dc-59-1673) {
    display: flex !important;
    align-items: center !important;
    padding: 18px 20px !important;
    min-height: 84px !important;
  }
  body.page-id-9 .wp-block-post-content.wp-block-post-content :is(#dc-59-1639, #dc-59-1658, #dc-59-1673) > * {
    width: 100% !important;
    margin: 0 !important;
  }
  body.page-id-9 .wp-block-post-content.wp-block-post-content :is(#dc-59-1639, #dc-59-1658, #dc-59-1673) .wp-block-spacer {
    display: none !important;
  }
  body.page-id-9 .wp-block-post-content.wp-block-post-content :is(#dc-59-1639, #dc-59-1658, #dc-59-1673) .wp-block-columns {
    display: grid !important;
    grid-template-columns: auto minmax(0, 1fr) !important;
    align-items: center !important;
    column-gap: 14px !important;
    row-gap: 2px !important;
  }
  /* The icon spans both lines; everything else goes in the right-hand column. */
  body.page-id-9 .wp-block-post-content.wp-block-post-content :is(#dc-59-1639, #dc-59-1658, #dc-59-1673) .wp-block-column:has(figure) {
    grid-column: 1 !important;
    grid-row: 1 / 3 !important;
  }
  body.page-id-9 .wp-block-post-content.wp-block-post-content :is(#dc-59-1639, #dc-59-1658, #dc-59-1673) .wp-block-column:has(p) {
    grid-column: 2 !important;
  }
  /* Any figure after the first is the trailing arrow. */
  body.page-id-9 .wp-block-post-content.wp-block-post-content :is(#dc-59-1639, #dc-59-1658, #dc-59-1673) .wp-block-column:has(figure) ~ .wp-block-column:has(figure) {
    display: none !important;
  }
}

/* ------------------------------------------------------------------ *
 * 17. THE QUOTE, AND THE LIST THAT INVENTS PAIRS.
 * ------------------------------------------------------------------ */
@media (max-width: 1439.98px) {
  /*
   * The design sets an opening quote mark at the top left of the band and a closing one further
   * in. Stacked, both land on the same left edge 222px apart, so the band opens with a quote mark
   * floating over a fifth of a screen of empty photograph and then repeats it above the words.
   * One mark, on the quote it belongs to.
   */
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1516 { display: none !important; }

  /*
   * MATOMUMO's four-phrase lists were tuned here across two earlier rounds - even margins, a row
   * gap, core's flow gap taken out - and they are superseded by section 25, which re-flows the
   * whole group onto a grid instead of re-spacing the artboard's wrappers. The rules are removed
   * rather than left dormant: `#dc-59-2036 .wp-block-column > p` is (1,4,1) and was silently
   * beating section 25's (1,3,1), so the new 12px row gap was rendering as 18px. Two live
   * attempts at the same section is exactly how that happens.
   */
}

/* ------------------------------------------------------------------ *
 * 18. TWO STRAY DETAILS.
 * ------------------------------------------------------------------ */
@media (max-width: 1439.98px) {
  /*
   * The fourth statistic's value is a graphic, not type - an infinity mark drawn as an SVG while
   * 80+, 10+ and 100+ are 36px heavy italic Montserrat. At its design size it reads as an icon
   * that lost its number rather than as the value of that stat. Matched to the numbers beside it.
   */
  body.page-id-4 .wp-block-post-content.wp-block-post-content #dc-59-2176 {
    width: auto !important;
    height: 40px !important;
    max-width: none !important;
    margin: 0 !important;
  }
}

/* ------------------------------------------------------------------ *
 * 19. HEADINGS DO NOT BREAK MID-WORD.
 *
 * "BENDRADARBIAVIMO UŽKLAUSA" was rendering as "BENDRADARBIAVIM / O UŽKLAUSA". The break-word
 * rule that keeps an email address inside a narrow footer column was reaching display type too,
 * and the "[01]" index beside the heading was taking enough width to trigger it. Prose may break;
 * a headline may not, and the index sits over the heading rather than beside it.
 * ------------------------------------------------------------------ */
@media (max-width: 1439.98px) {
  .wp-block-post-content :is(h1, h2, h3, h4, h5, h6) {
    overflow-wrap: normal !important;
    word-break: keep-all !important;
    hyphens: none !important;
  }
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-59-1589 .wp-block-columns:has(h2) {
    display: block !important;
  }
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-59-1589 h2 {
    width: 100% !important;
    max-width: none !important;
  }
}

/* ------------------------------------------------------------------ *
 * 20. THE HERO IS ONE COMPOSITION, BUTTONS INCLUDED.
 *
 * The design puts both calls to action ON the photograph. The generator emits each as its own
 * top-level section, so in flow they fall out of the picture and land on a strip of flat black
 * underneath it - the photo gets a hard bottom edge and the hero stops being a composition.
 *
 * They are pulled back onto it. The cover gains exactly the room the pair needs, and the pair is
 * lifted by the same amount, so nothing depends on a measured height that could drift.
 * ------------------------------------------------------------------ */
@media (max-width: 1439.98px) {
  body.page-id-4 .wp-block-post-content.wp-block-post-content #dc-59-2512 {
    padding-bottom: 140px !important;
    box-sizing: border-box !important;
  }
  body.page-id-4 .wp-block-post-content.wp-block-post-content #dc-59-2271 {
    margin-top: -128px !important;
    position: relative !important;
    z-index: 3 !important;
  }
  body.page-id-4 .wp-block-post-content.wp-block-post-content #dc-59-2280 {
    position: relative !important;
    z-index: 3 !important;
    margin-bottom: var(--dm-5) !important;
  }
}

/* ------------------------------------------------------------------ *
 * 21. THE RHYTHM IS THE PADDING, AND NOTHING ELSE.
 *
 * Every section carries the same top and bottom padding, so the gap between any two of them should
 * be exactly twice it - 96px at 390. Measured on the rendered pixels it ranged from 74 to 142.
 * The difference is trailing margin: the last block inside a section adds its own bottom margin on
 * top of the section's padding, and the first block of the next adds a top margin, so the visible
 * gap is padding + margin + padding and every join is a different size.
 *
 * The rhythm belongs to the section. Its first and last children give up their outer margins.
 * ------------------------------------------------------------------ */
@media (max-width: 1439.98px) {
  .wp-block-post-content.wp-block-post-content > * > :first-child { margin-top: 0 !important; }
  .wp-block-post-content.wp-block-post-content > * > :last-child { margin-bottom: 0 !important; }
  /* A trailing spacer is the same thing wearing a different hat. */
  .wp-block-post-content.wp-block-post-content > * > .wp-block-spacer:last-child,
  .wp-block-post-content.wp-block-post-content > * > .wp-block-spacer:first-child { display: none !important; }
}

/* ------------------------------------------------------------------ *
 * 22. THE FORM CONTROLS.
 *
 * The design's bordered box IS the field - it carries the radius, the 1px rule and the fill - so
 * the control inside it is transparent and fills it completely. `font-size:16px` is load-bearing
 * rather than cosmetic: iOS Safari zooms the whole page when a focused input is smaller, which
 * throws the layout sideways mid-typing.
 * ------------------------------------------------------------------ */
.wp-block-post-content .dm-form :is(input, select, textarea) {
  display: block;
  width: 100%;
  min-height: 50px;
  padding: 12px 16px;
  box-sizing: border-box;
  background: transparent;
  border: 0;
  color: #fff;
  font: inherit;
  font-size: 16px;
  line-height: 1.35;
  -webkit-appearance: none;
  appearance: none;
}
.wp-block-post-content .dm-form textarea { min-height: 120px; resize: vertical; }
.wp-block-post-content .dm-form select {
  padding-right: 44px;
  cursor: pointer;
  background-image: linear-gradient(45deg, transparent 50%, #ffffffb3 50%), linear-gradient(135deg, #ffffffb3 50%, transparent 50%);
  background-position: right 20px center, right 14px center;
  background-size: 6px 6px, 6px 6px;
  background-repeat: no-repeat;
}
.wp-block-post-content .dm-form select option { background: #17181c; color: #fff; }
.wp-block-post-content .dm-form :is(input, select, textarea):focus-visible {
  outline: 2px solid #e22f2d;
  outline-offset: 2px;
  border-radius: 6px;
}
.wp-block-post-content .dm-form ::placeholder { color: #ffffff6b; }
/* The design drew its own chevron inside the select's box; there is a real one on the control now,
 * and two of them read as a rendering fault. */
.wp-block-post-content .dm-form :is(#dc-59-1595, #dc-59-1598, #dc-59-1613, #dc-59-1601) :is(figure, img) {
  display: none !important;
}
/* The box no longer needs the spacer's height now that it holds a control. */
.wp-block-post-content .dm-form :is(#dc-59-1595, #dc-59-1598, #dc-59-1613, #dc-59-1601) {
  min-height: 0 !important;
  padding: 0 !important;
  display: block !important;
}
.wp-block-post-content .dm-form__note {
  margin: 0 0 16px;
  padding: 12px 16px;
  border-radius: 8px;
  font-size: 15px;
}
.wp-block-post-content .dm-form__note--ok { background: #14361f; color: #b9f2cd; }
.wp-block-post-content .dm-form__note--err { background: #3a1416; color: #ffc9c6; }

/* ------------------------------------------------------------------ *
 * 23. ONE BUTTON, AND THE COLOURS THAT DRIFTED.
 *
 * Three independent design reviews measured the same button faults: five widths, three heights and
 * three radii across six buttons, with the label and the arrow laid out differently in each - the
 * red hero button centred its label and pinned the arrow 45px away, the outline button centred the
 * pair. One object, used everywhere, differing only in fill.
 *
 * The reds also drifted: #dc2626 and #dd1438 appear where the brand is #e22f2d. Those are Tailwind
 * defaults, not decisions. #b61222 is left alone - it is the design's deliberate on-white red.
 * ------------------------------------------------------------------ */
@media (max-width: 1439.98px) {
  .wp-block-post-content .wp-block-button__link,
  .wp-block-post-content a.dm-cta,
  .dm-panel__cta {
    min-height: 52px !important;
    padding: 0 28px !important;
    border-radius: 999px !important;
    gap: 12px !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    letter-spacing: .08em !important;
    line-height: 1.15 !important;
  }
  /* Label and arrow are ONE centred group, in every variant. */
  .wp-block-post-content .wp-block-button__link > *,
  .wp-block-post-content a.dm-cta > * { flex: 0 0 auto !important; }
  .wp-block-post-content .wp-block-button__link img { width: 18px !important; height: 18px !important; }
  /* An outline button needs a fill or the photograph shows through its label. */
  .wp-block-post-content .wp-block-button__link:not(.has-background) {
    background-color: rgba(255, 255, 255, .06) !important;
  }
}

/* ------------------------------------------------------------------ *
 * 24. GREYS THAT FAIL AA.
 *
 * Measured on the built pages: the footer copyright at 2.72:1 and its labels at 4.22:1, both below
 * the 4.5:1 minimum for body text. The grey ramp was also inverted - the social icons were
 * brighter than the label introducing them. One grey for secondary text.
 * ------------------------------------------------------------------ */
@media (max-width: 1439.98px) {
  .wp-block-post-content > section:last-child p,
  .wp-block-post-content > section:last-child a:not(.wp-block-button__link) {
    color: rgba(255, 255, 255, .68) !important;
  }
  .wp-block-post-content > section:last-child .dm-contactlink,
  .wp-block-post-content > section:last-child .dm-contactlink * { color: #fff !important; }
}

/* ------------------------------------------------------------------ *
 * 25. MATOMUMO GALIMYBĖS - the section three reviews all named as the worst on the site.
 *
 * 1,306px on a phone for five titles and twenty short phrases, and the reason is the one that
 * explains most of what is left: the CONTAINER was re-sized and the CONTENT FLOW was not. At 1440
 * these five groups sit two-up with the icon above its title, and each group's four phrases sit in
 * two columns of two. Stacked into a 350px column that becomes: an icon orphaned on its own 70px
 * line, then a title, then four phrases split 2+2 by the spacer that used to separate the two
 * COLUMNS - so the gap inside one group (15px) is larger than the gap between two different
 * groups (12px), and nothing reads as belonging to anything.
 *
 * The flow is re-authored rather than re-spaced. Every layout wrapper the artboard left behind is
 * dissolved with `display:contents`, so the group's own grid holds exactly what matters: a 44px
 * icon rail spanning the group, the title on the first row, and the four phrases one per row on
 * the text rail under it. The spacers go; they were column separators, and there are no columns.
 *
 * Every group is 1 title + 4 phrases, which is what lets `grid-row: 1 / -1` span the icon: with
 * five EXPLICIT rows declared, -1 is the end of the grid. Without them it would resolve to row 1
 * and the icon would sit alone next to the title again.
 *
 * NOT an accordion. The reviews suggested `<details>`, which would take this to ~420px - but this
 * is the page that tells a sponsor what they get, and the list is the offer. It is 1,306px -> the
 * flow below, with every word still on the screen.
 * ------------------------------------------------------------------ */
@media (max-width: 1439.98px) {
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-103-510,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-103-519,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-103-513,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-103-515,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-103-518 {
    display: grid !important;
    grid-template-columns: 44px minmax(0, 1fr) !important;
    /* Five rows, declared: one title and four phrases, in every one of the five groups. */
    grid-template-rows: auto auto auto auto auto !important;
    column-gap: 14px !important;
    /* 12px between phrases: tighter than the 32px that separates two groups, which is the whole
     * point of the section. The --dm-* scale has no 12 and inventing a seventh value would defeat
     * it, so the one ladder step between 8 and 16 is written here, once, with its reason. */
    row-gap: 12px !important;
    align-items: start !important;
  }

  /* Dissolve the artboard's wrappers so the grid above holds the real content. */
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-103-510 .wp-block-columns,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-103-510 .wp-block-column,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-103-510 .wp-block-group,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-103-519 .wp-block-columns,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-103-519 .wp-block-column,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-103-519 .wp-block-group,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-103-513 .wp-block-columns,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-103-513 .wp-block-column,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-103-513 .wp-block-group,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-103-515 .wp-block-columns,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-103-515 .wp-block-column,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-103-515 .wp-block-group,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-103-518 .wp-block-columns,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-103-518 .wp-block-column,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-103-518 .wp-block-group {
    display: contents !important;
  }
  /* The spacers separated two COLUMNS on the artboard. There are no columns. */
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-103-510 .wp-block-spacer,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-103-519 .wp-block-spacer,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-103-513 .wp-block-spacer,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-103-515 .wp-block-spacer,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-103-518 .wp-block-spacer,
  /* and the per-phrase bullet markers, which already render 4x0 - as grid items they would each
   * take a row and 12px of gap for nothing at all. */
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-103-510 figure,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-103-519 figure,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-103-513 figure,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-103-515 figure,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-103-518 figure {
    display: none !important;
  }
  /* The group's OWN icon, put back and spanned down the rail. */
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-103-510 > figure,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-103-519 > figure,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-103-513 > figure,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-103-515 > figure,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-103-518 > figure {
    display: block !important;
    grid-column: 1 !important;
    grid-row: 1 / -1 !important;
    align-self: start !important;
    width: 44px !important;
    margin: 0 !important;
  }
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-103-510 > figure img,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-103-519 > figure img,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-103-513 > figure img,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-103-515 > figure img,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-103-518 > figure img {
    width: 44px !important;
    height: 44px !important;
    object-fit: contain !important;
    display: block !important;
  }
  /* Everything written stays on the text rail; auto-placement then gives each its own row. */
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-103-510 p,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-103-519 p,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-103-513 p,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-103-515 p,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-103-518 p {
    grid-column: 2 !important;
    margin: 0 !important;
  }
  /* The title was 16px of Bebas Neue - a condensed face, so optically SMALLER than the 14px
   * Montserrat it introduces. A label that reads smaller than its own content is why the section
   * had no hierarchy at all. */
  /* The group's own `p` rule below is (1,3,2) - an id short but a TYPE selector long - so a
   * bare #id title rule at (1,3,1) lost to it and the 4px never applied. Anchored through the
   * group with its own type, this reads at (2,3,2) and wins. */
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-103-510 p#dc-59-2039,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-103-519 p#dc-59-2049,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-103-513 p#dc-59-2059,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-103-515 p#dc-59-2069,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-103-518 p#dc-59-2079 {
    font-size: 19px !important;
    line-height: 1.15 !important;
    margin-bottom: 4px !important;   /* 12 + 4 = 16 to its own list, 12 within it */
  }
  /* #6b7280 on #0a0b0d is 4.22:1 - under AA for body text, and these ARE the body text. */
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-103-510 p:not([id$="2039"]),
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-103-519 p:not([id$="2049"]),
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-103-513 p:not([id$="2059"]),
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-103-515 p:not([id$="2069"]),
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-103-518 p:not([id$="2079"]) {
    color: rgba(255, 255, 255, .70) !important;
  }

  /* One rule between groups, and 32px of air around it: the gap AROUND a group is now more than
   * twice the 12px inside it, which is the ordering the whole section was missing. */
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-59-2036 .wp-block-columns:has(> * > #dc-103-510) { row-gap: 0 !important; }
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-103-519,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-103-513,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-103-515,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-103-518 {
    border-top: 1px solid rgba(255, 255, 255, .10) !important;
    /* 16 + 16 = 32px between two groups against 12px inside one: the ratio the ordering rule
     * asks for, without the 64px that a full step on each side of the rule would cost five
     * times over. */
    padding-top: var(--dm-2) !important;
    margin-top: var(--dm-2) !important;
  }
}

/* ------------------------------------------------------------------ *
 * 26. THE TRAINING CARDS - the second "large empty black area".
 *
 * Each card was 350x164 holding a ~170px-wide left-aligned vertical stack: number, unit, icon,
 * label, one under the other. Roughly 180x180 of dead card, four times over, and the 22px icon
 * stranded between "VAL." and the label with no relationship to either. That stack was correct in
 * the 300px column the design gives it at 1440. It is not a stack in a 350px card.
 *
 * Re-flowed to the same icon-rail idiom as MATOMUMO in section 25, which is the point: two
 * sections on two different pages that hold the same kind of content now read the same way.
 *
 *     [icon]  120+ VAL.
 *             FIZINIS PASIRUOŠIMAS
 *
 * 164px a card -> ~81px. The section goes from 1,081px to roughly 730.
 *
 * NOT FIXED HERE, needs the designer: "VAL." is #bd2826 on the #131417 card, which is 3.0:1 -
 * under AA for 14px text. The brand red #e22f2d only reaches 3.9:1, so passing AA means a lighter
 * red than the brand, and that is a brand decision rather than a build one.
 * ------------------------------------------------------------------ */
@media (max-width: 1439.98px) {
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1335,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1348,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1359,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1374 {
    display: grid !important;
    /* rail | number | unit-then-label */
    grid-template-columns: 32px auto minmax(0, 1fr) !important;
    grid-template-rows: auto auto !important;
    column-gap: 12px !important;
    row-gap: var(--dm-1) !important;
    align-items: center !important;
    padding: var(--dm-2) !important;
  }
  /* The artboard's wrappers, dissolved - as in section 25. */
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1335 .wp-block-columns,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1348 .wp-block-columns,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1359 .wp-block-columns,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1374 .wp-block-columns,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1335 .wp-block-column,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1348 .wp-block-column,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1359 .wp-block-column,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1374 .wp-block-column {
    display: contents !important;
  }
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1335 .wp-block-spacer,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1348 .wp-block-spacer,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1359 .wp-block-spacer,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1374 .wp-block-spacer { display: none !important; }

  /* The icon becomes the rail, spanning both rows, instead of a third thing in the stack. */
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1335 figure,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1348 figure,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1359 figure,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1374 figure {
    grid-area: 1 / 1 / 3 / 2 !important;
    align-self: center !important;
    width: 32px !important;
    margin: 0 !important;
  }
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1335 figure img,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1348 figure img,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1359 figure img,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1374 figure img {
    width: 28px !important; height: 28px !important; object-fit: contain !important; display: block !important;
  }
  /* The number and its unit share one line and one baseline; they are one value. */
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1336,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1349,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1360,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1375 {
    grid-area: 1 / 2 !important;
    margin: 0 !important;
    align-self: baseline !important;
    line-height: 1.05 !important;
  }
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1337,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1350,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1361,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1376 {
    grid-area: 1 / 3 !important;
    justify-self: start !important;
    align-self: baseline !important;
    margin: 0 !important;
  }
  /*
   * The label runs under both, on the text rail - and LEFT, explicitly. The generator used to
   * un-centre these labels with its own rule; once this section re-flowed the card, that rule
   * stopped being emitted and all four labels silently centred themselves under their numbers.
   * Nothing in the audits sees a centred label. Only looking at it does.
   */
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1347,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1358,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1373,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1384 {
    grid-area: 2 / 2 / 3 / 4 !important;
    margin: 0 !important;
    line-height: 1.3 !important;
    text-align: left !important;
  }
  /* 16px between two cards against 8px inside one - the ordering rule, at the card scale. */
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1321 .wp-block-columns:has(> * > #dc-59-1335) { row-gap: var(--dm-2) !important; }
}

/* ------------------------------------------------------------------ *
 * 27. THE GALLERY FILTER - four words and two arrows that do nothing.
 *
 * What was on the screen: four bare 22px words, MOTOKROSAS at x=28 and TRENIRUOTĖS at x=32 on a
 * second line while everything else on the page starts at x=20, one of them red and the rest grey,
 * with two 48px circular arrows floating alone at the bottom right of 350px of empty black. It is
 * the "gallery buttons" the operator singled out, and it looked accidental because every part of
 * it was: the row is a 1440 flex row that wrapped, and the arrows made sense beside the horizontal
 * track the design gives this at 1440 and control nothing at all once the track becomes a grid.
 *
 * The four become real pills on one horizontal snap rail that bleeds to the screen edge - the
 * standard mobile pattern, and the only one where four labels of unequal length do not wrap into a
 * ragged block. Identical size, weight and tracking in both states; only the fill and the border
 * change, so tapping one cannot reflow the row.
 *
 * THE ARROWS ARE REMOVED below 1024, not restyled. Both are href="#", they sit beside a vertical
 * grid, and they cost 86px of height to say nothing. Shipping a dead control is worse than
 * shipping no control.
 *
 * ON THE HANDOVER LIST, NOT FIXABLE HERE: the chips are <p> elements and the tiles carry no
 * category, so the filter cannot actually filter. Making it work needs the client's photographs
 * sorted into the four categories - which is already an open question on the handover list.
 * ------------------------------------------------------------------ */
@media (max-width: 1439.98px) {
  /* The rail. It bleeds through the gutter so a chip can sit half off the screen edge, which is
   * what tells a thumb there is more to the right. */
  body.page-id-6 .wp-block-post-content.wp-block-post-content #dc-105-760 > .wp-block-columns {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: var(--dm-1) !important;
    overflow-x: auto !important;
    overscroll-behavior-x: contain !important;
    scroll-snap-type: x proximity !important;
    /* Without this the browser snaps the selected chip's edge to the SCROLLPORT edge and scrolls
     * straight past the rail's own 20px of padding on load, so MOTOKROSAS rendered flush against
     * the screen while every other element on the page started on the gutter. Measured
     * scrollLeft: 20 - exactly the padding. */
    scroll-padding-left: var(--dm-gutter) !important;
    scrollbar-width: none !important;
    grid-template-columns: none !important;
    margin-left: calc(-1 * var(--dm-gutter)) !important;
    margin-right: calc(-1 * var(--dm-gutter)) !important;
    padding: 2px var(--dm-gutter) !important;
    width: auto !important;
    max-width: none !important;
  }
  body.page-id-6 .wp-block-post-content.wp-block-post-content #dc-105-760 > .wp-block-columns::-webkit-scrollbar {
    display: none !important;
  }
  /* Dissolve the artboard's per-chip columns and the group around the active one, so the four
   * paragraphs are the four flex items and nothing else is. */
  body.page-id-6 .wp-block-post-content.wp-block-post-content #dc-105-760 .wp-block-column,
  body.page-id-6 .wp-block-post-content.wp-block-post-content #dc-105-760 .wp-block-group,
  body.page-id-6 .wp-block-post-content.wp-block-post-content #dc-105-760 .wp-block-columns .wp-block-columns {
    display: contents !important;
  }
  body.page-id-6 .wp-block-post-content.wp-block-post-content #dc-105-760 .wp-block-spacer,
  body.page-id-6 .wp-block-post-content.wp-block-post-content #dc-105-760 figure {
    display: none !important;
  }
  /* The pill. 40px clears the tap floor; the values are identical in both states so that choosing
   * a filter cannot move the row it is in. */
  body.page-id-6 .wp-block-post-content.wp-block-post-content #dc-105-760 p {
    display: inline-flex !important;
    align-items: center !important;
    flex: 0 0 auto !important;
    min-height: 40px !important;
    margin: 0 !important;
    padding: 0 var(--dm-2) !important;
    border: 1px solid rgba(255, 255, 255, .16) !important;
    border-radius: 9999px !important;
    background: transparent !important;
    color: rgba(255, 255, 255, .78) !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    letter-spacing: .09em !important;
    line-height: 1 !important;
    white-space: nowrap !important;
    scroll-snap-align: start !important;
    text-align: center !important;
  }
  /* The selected one. #dc2626 was drift; the brand red is #e22f2d. Driven by aria-pressed since
   * 2026-09-07 - it used to be hardcoded onto MOTOKROSAS, which was correct when nothing could be
   * chosen and wrong the moment the filter started working. See section 74. */
  body.page-id-6 .wp-block-post-content.wp-block-post-content #dc-105-760 p[aria-pressed="true"] {
    background: #e22f2d !important;
    border-color: #e22f2d !important;
    color: #fff !important;
  }
  /* (The gallery's own dead arrow pair is removed at every width - see section 28's note.) */
  /* With the arrows gone the section is the rail and its own rhythm, nothing else. */
  body.page-id-6 .wp-block-post-content.wp-block-post-content #dc-105-762 > .wp-block-columns {
    display: block !important;
    row-gap: 0 !important;
  }
}

/* ------------------------------------------------------------------ *
 * 28. THE OTHER TWO PAIRS OF DEAD ARROWS.
 *
 * Same defect as the gallery's, on two more pages: a left/right pair floating at the right of a
 * section heading with 250px of empty black beside them, every one href="#", and nothing below
 * them but a grid or a stack of cards. They made sense at 1440 beside a horizontal track; below
 * it there is no track, so they are two circles that cannot be pressed and cost ~97px of height
 * to say nothing.
 *
 * Removed rather than restyled, for the reason the reviews put plainly: do not ship a dead control.
 * Wiring them instead would mean building a scroll rail for content that is already fully visible,
 * which is a worse answer, not a better one.
 *
 * WIDENED TO EVERY WIDTH 2026-09-08, on the client's decision. Until then this only ran below 1024,
 * so the six of them - two here, two on pasiekimai, two on galerija - were still live and still
 * pressable on the desktop, where a control sweep found them as the last dead links on the site.
 * ------------------------------------------------------------------ */
body.page-id-4 .wp-block-post-content.wp-block-post-content .wp-block-columns
  > .wp-block-column:has(> .wp-block-button > #dc-59-2199),
body.page-id-4 .wp-block-post-content.wp-block-post-content .wp-block-columns
  > .wp-block-column:has(> .wp-block-button > #dc-59-2206),
body.page-id-7 .wp-block-post-content.wp-block-post-content .wp-block-columns
  > .wp-block-column:has(> .wp-block-button > #dc-59-1391),
body.page-id-7 .wp-block-post-content.wp-block-post-content .wp-block-columns
  > .wp-block-column:has(> .wp-block-button > #dc-59-1398),
body.page-id-6 .wp-block-post-content.wp-block-post-content #dc-105-762 .wp-block-column:has(> .wp-block-button) {
  display: none !important;
}
@media (max-width: 1439.98px) {
  /* With the controls gone the heading row is a heading, and it no longer needs their height. */
  body.page-id-4 .wp-block-post-content.wp-block-post-content .wp-block-columns:has(#dc-59-2199),
  body.page-id-7 .wp-block-post-content.wp-block-post-content .wp-block-columns:has(#dc-59-1391) {
    align-items: flex-start !important;
    row-gap: 0 !important;
  }
}

/* ------------------------------------------------------------------ *
 * 29. THE QUOTE MARK.
 *
 * 103-310.svg has fill="#471211" baked into the file, and it is drawn on the darkest part of a
 * dark red photograph: 1.11:1. That is not subtle, it is invisible - it reads as a smudge, or as
 * an image that failed to load. It also sat flush with the text's left edge rather than hanging,
 * and its box bottom touched the headline's cap line with no clearance at all.
 *
 * Recoloured with a mask rather than a second asset: the SVG becomes the shape and the brand red
 * becomes the paint, so there is nothing new to keep in sync if the mark is ever re-exported.
 *
 * A DELIBERATE DEVIATION FROM THE DESIGN, and the only one in this file. At 1440 the mark is the
 * same near-invisible maroon - that is what the artboard draws, and the 1440 build still matches
 * it pixel for pixel. This is scoped below 1440 only. If the designer wants the mark to disappear,
 * the honest fix is to delete it from the design rather than to draw it in a colour nobody can
 * see; either way that is their call, and it is on the handover list.
 * ------------------------------------------------------------------ */
@media (max-width: 1439.98px) {
  /* SUPERSEDED BY SECTION 62 - this masked a single mark and section 59 then hid what it took for
   * an empty column. That column held the CLOSING mark. See below. */
  /* The attribution is a name, not a second headline: it reads at the same weight as the quote in
   * brand red, which makes two things compete where one should lead. */
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-2502 {
    font-size: 15px !important;
    color: rgba(255, 255, 255, .82) !important;
    margin-top: var(--dm-2) !important;
  }
}

/* ------------------------------------------------------------------ *
 * 30. THE GALLERY GRID - the page a rider's site is actually judged on.
 *
 * Eight photographs rendered at 261, 261, 425, 425, 223, 223, 195, 195 - in matched pairs, because
 * that is a two-column desktop masonry collapsed into one column with every desktop HEIGHT kept.
 * Four different aspect ratios down one column, 2,208px of scroll, and no rhythm anywhere in it.
 *
 * The canvas on this page is already a two-column grid; a generated rule spans every child across
 * both columns, which is right for a section and wrong for a tile. These eight stop spanning and
 * take one cell each, at one aspect ratio. Roughly 2,208px becomes ~700px, the tiles land on the
 * 20px gutter instead of the ~6px they had, and each keeps the focus point already measured for
 * it, so no rider loses their head to the square crop.
 *
 * The 40px radius is a 1440 measurement: on a 350px-wide tile it read as a pill. 16px here, which
 * is the radius the cards and the form controls use.
 * ------------------------------------------------------------------ */
@media (max-width: 1439.98px) {
  body.page-id-6 .wp-block-post-content.wp-block-post-content > #dc-59-2388,
  body.page-id-6 .wp-block-post-content.wp-block-post-content > #dc-59-2399,
  body.page-id-6 .wp-block-post-content.wp-block-post-content > #dc-59-2410,
  body.page-id-6 .wp-block-post-content.wp-block-post-content > #dc-59-2421,
  body.page-id-6 .wp-block-post-content.wp-block-post-content > #dc-59-2432,
  body.page-id-6 .wp-block-post-content.wp-block-post-content > #dc-59-2443,
  body.page-id-6 .wp-block-post-content.wp-block-post-content > #dc-59-2454,
  body.page-id-6 .wp-block-post-content.wp-block-post-content > #dc-59-2465 {
    grid-column: auto !important;
    width: auto !important;
    height: auto !important;
    min-height: 0 !important;
    aspect-ratio: 1 / 1 !important;
    border-radius: 16px !important;
    /* The canvas row gap belongs to the sections, not to these; the tiles carry their own. */
    margin: 0 0 var(--dm-1) 0 !important;
  }
}

/* ------------------------------------------------------------------ *
 * 31. "DAUGIAU AKIMIRKŲ" IS GONE.
 *
 * It was the worst-looking single element on the site - a 47x1px rule drawn as an image, sitting
 * 70px left of and 20px below the label it underlined, beside an arrow floating on its own - and
 * this section used to rebuild it into a ghost button so a load-more action looked pressable.
 *
 * REPLACED 2026-09-08 by deleting the control. It could not load more: it linked to galerija, from
 * galerija, and the site has eight photographs and no pagination. Directly beneath it sits "SEKTI
 * INSTAGRAM", which is the real answer to "more photographs" and actually goes somewhere. Two
 * controls making the same promise, one of them empty, is worse than one control that keeps it.
 *
 * The client's decision, and it is reversible in one line: if more photographs arrive and the
 * gallery grows a second page, delete this rule and the label comes back with its own styling.
 * The whole section `#dc-105-773` holds nothing else - one group and a zero-height image.
 * ------------------------------------------------------------------ */
body.page-id-6 .wp-block-post-content.wp-block-post-content #dc-105-773 { display: none !important; }

/* ------------------------------------------------------------------ *
 * 32. THE TWO BROKEN EYEBROWS.
 *
 * Every eyebrow on this site is a red "//" or "///" followed by a label, and all but two of them
 * are one two-column row that holds together at any width. The two exceptions:
 *
 *   HOME, the closing KONTAKTAI section. The marker and the label are in SEPARATE rows, overlaid
 *   on each other at 1440. In flow they unstack, so "//" gets a 350px line of its own with 30px
 *   under it and "KONTAKTAI" beneath - the marker reads as a stray glyph, and it is in the first
 *   screenful of the home page's last section. The orphaned row goes and the marker is set on the
 *   label itself, where it cannot come apart again at any width.
 *
 *   PARTNERYSTĖS, "PASITIKĖJIMU GRĮSTOS...". The row is `align-items:center` and the label wraps
 *   to two lines, so the marker centres itself in the gap BETWEEN them. It only aligns to the
 *   first line, always.
 * ------------------------------------------------------------------ */
@media (max-width: 1439.98px) {
  body.page-id-4 .wp-block-post-content.wp-block-post-content #dc-59-2236 { display: none !important; }
  body.page-id-4 .wp-block-post-content.wp-block-post-content #dc-59-2237::before {
    content: "//";
    color: #e22f2d;
    margin-right: var(--dm-1);
    font-weight: 700;
  }
  /* A marker belongs to the first line of its label, not to the label's centre. */
  body.page-id-8 .wp-block-post-content.wp-block-post-content .wp-block-columns:has(> * > #dc-103-475),
  body.page-id-7 .wp-block-post-content.wp-block-post-content .wp-block-columns:has(> * > #dc-59-1526) {
    align-items: start !important;
  }
}

/* ------------------------------------------------------------------ *
 * 33. KONTAKTAI - the hero photograph.
 *
 * Measured on the source: sampling the image in eighths gives luminance 20,16,22,21,31,73,35,19.
 * The whole picture is a dark forest except the sixth eighth, which is four times brighter than
 * anything beside it - that is the rider, and peak edge energy agrees at 65%. Cropped from the
 * centre to a phone's aspect the window runs 32%-68%, so the subject sat hard against the right
 * edge as a disembodied arm and the visible frame was 340px of out-of-focus trees. The contact
 * page opened on nothing.
 *
 * The crop is measured rather than nudged: the window is 36.8% of the source's width, so centring
 * it on 68% puts the bright band (62.5-75%) inside it with room at both ends.
 * ------------------------------------------------------------------ */
@media (max-width: 1439.98px) {
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-59-1770 img { object-position: 68% 45% !important; }
}

/* ------------------------------------------------------------------ *
 * 34. KONTAKTAI - the four contact rows.
 *
 * Measured: rows 1-3 sat 87, 86 and then 64px apart, so the fourth row was visibly jammed against
 * the third. The cause is that the first two rows carry a tel:/mailto: link and therefore a 44px
 * tap target while the last two are plain text, so every row was a different height and the gaps
 * came out of whatever was left. The 45px icon was centred on the row while the label sat above
 * its top edge and the value below its bottom - so the icon aligned to neither of the two things
 * it belongs to.
 *
 * One grid: a 44px icon rail and a text rail, the icon centred on the label-and-value PAIR rather
 * than on the row box, 4px inside the pair and 16px between rows.
 * ------------------------------------------------------------------ */
@media (max-width: 1439.98px) {
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-105-556,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-105-555,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-105-554,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-105-553 {
    display: grid !important;
    grid-template-columns: 44px minmax(0, 1fr) !important;
    /* Two rows, declared: the label and the value. `grid-row: 1 / -1` on the icon needs an
     * explicit grid to span, or -1 resolves to the end of row 1 and the icon sits on the label
     * alone. */
    grid-template-rows: auto auto !important;
    column-gap: 12px !important;
    row-gap: 4px !important;
    align-items: center !important;
    margin: 0 0 var(--dm-2) 0 !important;
    min-height: 0 !important;
  }
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-105-556 .wp-block-columns,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-105-555 .wp-block-columns,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-105-554 .wp-block-columns,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-105-553 .wp-block-columns,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-105-556 .wp-block-column,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-105-555 .wp-block-column,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-105-554 .wp-block-column,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-105-553 .wp-block-column,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-105-556 .wp-block-group,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-105-555 .wp-block-group,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-105-554 .wp-block-group,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-105-553 .wp-block-group { display: contents !important; }
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-105-556 .wp-block-spacer,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-105-555 .wp-block-spacer,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-105-554 .wp-block-spacer,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-105-553 .wp-block-spacer { display: none !important; }
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-59-1549 ,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-59-1557 ,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-59-1567 ,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-59-1579  {
    grid-column: 1 !important;
    grid-row: 1 / -1 !important;
    align-self: center !important;
    width: 44px !important;
    height: 44px !important;
    object-fit: contain !important;
    margin: 0 !important;
  }
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-105-556 figure,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-105-555 figure,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-105-554 figure,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-105-553 figure {
    grid-column: 1 !important;
    grid-row: 1 / -1 !important;
    align-self: center !important;
    margin: 0 !important;
    width: 44px !important;
  }
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-59-1555,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-59-1565,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-59-1577,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-59-1587,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-59-1556,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-59-1566,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-59-1578,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-59-1588 { grid-column: 2 !important; margin: 0 !important; }
  /*
   * The tap target belongs to the whole pair, not to a 21px line inside it, so the 44px minimum
   * must not stretch the row it is in. It also has to be placed EXPLICITLY: on the first two rows
   * the value is wrapped in this link, so the link is the grid item and the paragraph inside it
   * is not - left to auto-place, it dropped into column 1 under the icon and rendered the phone
   * number 44px wide and 84px tall.
   */
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-105-556 .dm-contactlink,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-105-555 .dm-contactlink,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-105-554 .dm-contactlink,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-105-553 .dm-contactlink {
    grid-column: 2 !important;
    /*
     * THE ROW IS THE TARGET, not the anchor. A 44px min-height on the anchor made its own row 75px
     * tall while the two rows under it - whose values are not links - stayed 52, so one list had
     * two rhythms and the icon centred on a box 6px away from the text it labels. The anchor is
     * the height of its text again and a stretched ::after carries the hit area across the whole
     * row, which is bigger than 44px in both directions and easier to hit than the label was.
     */
    min-height: 0 !important;
    display: block !important;
  }
}

/* ------------------------------------------------------------------ *
 * 35. KONTAKTAI - the social cards.
 *
 * Card padding measured 18px against an 8px gap between cards, so three cards read as one block -
 * the inner-beats-outer inversion, again. And the Facebook mark is a bare "f" while the Instagram
 * and YouTube marks each draw their own rounded-square container, so the middle card looked like
 * an icon that had failed to load and its glyph sat further right than its neighbours'.
 *
 * The marks are brand assets and cannot be redrawn here, so the container comes from the card
 * instead: one 36px tile behind all three, which is what makes the row read as one set.
 * ------------------------------------------------------------------ */
@media (max-width: 1439.98px) {
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-59-1639,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-59-1658,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-59-1673 {
    padding: var(--dm-2) !important;
    margin-bottom: var(--dm-2) !important;
    min-height: 0 !important;
  }
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-59-1640,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-59-1659,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-59-1674 {
    box-sizing: content-box !important;
    width: 18px !important;
    height: 18px !important;
    padding: 9px !important;
    border: 1px solid rgba(255, 255, 255, .14) !important;
    border-radius: 9px !important;
    background: rgba(255, 255, 255, .04) !important;
  }
}

/* ------------------------------------------------------------------ *
 * 36. KONTAKTAI - the form's two remaining tells.
 *
 * The textarea showed the native resize grip in its corner - on a phone it is a control that does
 * nothing useful and it is the clearest single signal of an unfinished build. And the submit was
 * 232px wide, left-aligned, inside a full-width card: a form's primary action on a phone is the
 * width of the form.
 * ------------------------------------------------------------------ */
@media (max-width: 1439.98px) {
  body.page-id-9 .wp-block-post-content.wp-block-post-content textarea[name="domas_message"] { resize: none !important; }
  body.page-id-9 .wp-block-post-content.wp-block-post-content button[type="submit"] {
    width: 100% !important;
    min-height: 52px !important;
    justify-content: center !important;
  }
}

/* ------------------------------------------------------------------ *
 * 37. THE FOOTER, on every page.
 *
 * It is the one component that is identical across all six pages, which makes it the cheapest
 * thing on the site to fix and the most expensive to leave alone. Three measured faults:
 *
 *   The three social marks were 20px glyphs at 30px centres, and none of them was a link. They are
 *   now 44px tiles and they go somewhere (see DOMAS_SOCIAL in functions.php).
 *
 *   The whole footer was one 350px column, so the right half of a 513px block was empty - the
 *   largest dead area on the site. The email and the phone are short; they sit side by side.
 *
 *   The CTA was 181px wide, left-aligned, under a stack of full-width rows, so its width read as
 *   arbitrary. It is the footer's one action; it takes the footer's width.
 * ------------------------------------------------------------------ */
@media (max-width: 1439.98px) {
  /*
   * ANCHORED ON THE SIX FOOTER IDS, not on `section:last-child`. The class form is (0,4,1) and
   * every generated footer rule is written per-id at (1,2,x), so the readable selector lost the
   * cascade silently: the grid stayed one column and nothing about the footer changed. The ids
   * differ per page because the pipeline emits a copy of the footer into each one.
   */
  body.page-id-4 .wp-block-post-content.wp-block-post-content #dc-103-399 > .wp-block-columns,
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-105-644 > .wp-block-columns,
  body.page-id-6 .wp-block-post-content.wp-block-post-content #dc-105-774 > .wp-block-columns,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-103-332 > .wp-block-columns,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-59-1903 > .wp-block-columns,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-105-560 > .wp-block-columns {
    /* Two columns only where three 44px tiles still fit beside the phone. At 320 the column is
     * 280px, the pair is 132px each, and the tiles were squeezed to 40x44 - under the tap floor,
     * which the 320 audit caught. Below 400 the footer stays one column. */
    grid-template-columns: 1fr !important;
    column-gap: var(--dm-2) !important;
    row-gap: var(--dm-4) !important;
  }
  /*
   * Everything spans, and the two SHORT blocks pair up. Pairing the email with the phone was the
   * obvious split and it is the wrong one: "info@domasbutkus.lt" is 151px of type and a 167px
   * column broke it across two lines as "info@domasbutkus / .lt". The email takes the full width;
   * the phone and the three social tiles - 114px and 148px - go side by side and nothing wraps at
   * any width down to 320.
   */
  body.page-id-4 .wp-block-post-content.wp-block-post-content #dc-103-399 > .wp-block-columns > .wp-block-column,
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-105-644 > .wp-block-columns > .wp-block-column,
  body.page-id-6 .wp-block-post-content.wp-block-post-content #dc-105-774 > .wp-block-columns > .wp-block-column,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-103-332 > .wp-block-columns > .wp-block-column,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-59-1903 > .wp-block-columns > .wp-block-column,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-105-560 > .wp-block-columns > .wp-block-column {
    grid-column: 1 / -1 !important;
  }
  /*
   * NO PLACEMENT HERE. Below 400 every cell spans, full stop - section 52 owns the pairing and
   * only above 400. These two rules used to place the phone in column 1 and the social tiles in
   * column 2 at every width; with one declared track, placing an item in column 2 makes the grid
   * invent an IMPLICIT second track, so at 360 and 390 the footer silently became two columns
   * again and the CTA came out 180px wide inside one of them. A grid with one track and an item
   * placed in column 2 is not a one-column grid.
   */

  /* A social mark is a 44px target now, and it looks like one. Note the sibling block below
   * repeats this up to 1439.98 - between 1024 and 1440 the marks were still 22px wide, which the
   * audit at those widths caught. */
  .wp-block-post-content.wp-block-post-content .dm-social {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 44px !important;
    height: 44px !important;
    border: 1px solid rgba(255, 255, 255, .14) !important;
    border-radius: 12px !important;
    background: rgba(255, 255, 255, .04) !important;
  }
  .wp-block-post-content.wp-block-post-content .dm-social:hover {
    border-color: #e22f2d !important;
    background: rgba(226, 47, 45, .12) !important;
  }
  .wp-block-post-content.wp-block-post-content .dm-social figure { margin: 0 !important; line-height: 0 !important; }
  body.page-id-4 .wp-block-post-content.wp-block-post-content #dc-103-399 .wp-block-columns:has(> * > .dm-social),
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-105-644 .wp-block-columns:has(> * > .dm-social),
  body.page-id-6 .wp-block-post-content.wp-block-post-content #dc-105-774 .wp-block-columns:has(> * > .dm-social),
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-103-332 .wp-block-columns:has(> * > .dm-social),
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-59-1903 .wp-block-columns:has(> * > .dm-social),
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-105-560 .wp-block-columns:has(> * > .dm-social) {
    display: flex !important;
    gap: var(--dm-1) !important;
    grid-template-columns: none !important;
    align-items: center !important;
  }
  body.page-id-4 .wp-block-post-content.wp-block-post-content #dc-103-399 .wp-block-column:has(> .dm-social),
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-105-644 .wp-block-column:has(> .dm-social),
  body.page-id-6 .wp-block-post-content.wp-block-post-content #dc-105-774 .wp-block-column:has(> .dm-social),
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-103-332 .wp-block-column:has(> .dm-social),
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-59-1903 .wp-block-column:has(> .dm-social),
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-105-560 .wp-block-column:has(> .dm-social) {
    flex: 0 0 auto !important;
    width: auto !important;
  }
  /* The footer's one action takes the footer's width. */
  body.page-id-4 .wp-block-post-content.wp-block-post-content #dc-103-399 .wp-block-button,
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-105-644 .wp-block-button,
  body.page-id-6 .wp-block-post-content.wp-block-post-content #dc-105-774 .wp-block-button,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-103-332 .wp-block-button,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-59-1903 .wp-block-button,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-105-560 .wp-block-button,
  body.page-id-4 .wp-block-post-content.wp-block-post-content #dc-103-399 .wp-block-button__link,
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-105-644 .wp-block-button__link,
  body.page-id-6 .wp-block-post-content.wp-block-post-content #dc-105-774 .wp-block-button__link,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-103-332 .wp-block-button__link,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-59-1903 .wp-block-button__link,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-105-560 .wp-block-button__link {
    width: 100% !important;
    max-width: none !important;
    justify-content: center !important;
  }
}

/* ------------------------------------------------------------------ *
 * 38. THE HEADER BAR, on every page.
 *
 * 76px of bar carrying a 47x34 mark: 21px of empty bar above and below a logo too small to read,
 * and no edge at all, so scrolling the black bar over the white ABOUT section left nothing between
 * them. A shorter bar, a bigger mark, and a hairline that gives it an edge on any ground.
 * ------------------------------------------------------------------ */
@media (max-width: 1439.98px) {
  .wp-block-post-content.wp-block-post-content > .dm-header {
    padding-top: 10px !important;
    padding-bottom: 10px !important;
    border-bottom: 1px solid rgba(255, 255, 255, .10) !important;
    box-shadow: none !important;
  }
  .wp-block-post-content.wp-block-post-content > .dm-header .dm-homelink img {
    width: 88px !important;
  }
  /* The bars themselves were 26px wide inside a 44px button - the target was right and the mark
   * looked like a detail. */
  .dm-burger { padding: 0 4px !important; }
  .dm-burger span { height: 2.5px !important; }
}

/* ------------------------------------------------------------------ *
 * 39. ONE BUTTON, ENFORCED - section 15 said this and could not make it stick.
 *
 * Section 15 writes the contract on `.wp-block-button__link`, which is (0,2,1). Every button also
 * carries a generated per-id rule at (1,2,1), and an id beats any number of classes - so the
 * contract lost, silently, on every button that had one. Measured across the six pages:
 *
 *   widths   350 / 302 / 300 / 259 / 222 / 179
 *   radii    20px / 26px / 6px / 0px
 *   reds     #a90c23 / #e22f2d / #a70317   (three shades for one component)
 *   arrow    113px / 62px / 28px / 0px from the right edge
 *
 * That last line is the operator's complaint - the arrow "floating" - and it is the same button
 * disagreeing with itself twice on one screen. Restated here at id specificity, which is the only
 * thing that reaches them. Section 15 still covers the buttons that carry no id.
 * ------------------------------------------------------------------ */
@media (max-width: 1439.98px) {
  body.page-id-4 .wp-block-post-content.wp-block-post-content #dc-103-453,
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-105-698,
  body.page-id-6 .wp-block-post-content.wp-block-post-content #dc-105-828,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1326,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-103-386,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-59-2114,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-59-2129,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-59-1944,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-105-628,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-59-1603,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-105-614 {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: var(--dm-1) !important;
    width: 100% !important;
    max-width: none !important;
    min-height: 52px !important;
    height: auto !important;
    padding: 12px var(--dm-3) !important;
    border-radius: 9999px !important;
    box-sizing: border-box !important;
    background-color: #e22f2d !important;
    color: #fff !important;
    line-height: 1.2 !important;
    text-align: center !important;
  }
  /* The label must not carry its own box inside the pill, or the gap above is measured from the
   * wrong edge and the arrow drifts again. */

  body.page-id-4 .wp-block-post-content.wp-block-post-content #dc-103-453 > *,
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-105-698 > *,
  body.page-id-6 .wp-block-post-content.wp-block-post-content #dc-105-828 > *,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1326 > *,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-103-386 > *,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-59-2114 > *,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-59-2129 > *,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-59-1944 > *,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-105-628 > *,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-59-1603 > *,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-105-614 > * {
    margin: 0 !important;
    width: auto !important;
    flex: 0 0 auto !important;
  }
  /* A button that fills its column needs its wrapper to stop sizing it. */

  body.page-id-4 .wp-block-post-content.wp-block-post-content .wp-block-button:has(> #dc-103-453),
  body.page-id-5 .wp-block-post-content.wp-block-post-content .wp-block-button:has(> #dc-105-698),
  body.page-id-6 .wp-block-post-content.wp-block-post-content .wp-block-button:has(> #dc-105-828),
  body.page-id-7 .wp-block-post-content.wp-block-post-content .wp-block-button:has(> #dc-59-1326),
  body.page-id-7 .wp-block-post-content.wp-block-post-content .wp-block-button:has(> #dc-103-386),
  body.page-id-8 .wp-block-post-content.wp-block-post-content .wp-block-button:has(> #dc-59-2114),
  body.page-id-8 .wp-block-post-content.wp-block-post-content .wp-block-button:has(> #dc-59-2129),
  body.page-id-8 .wp-block-post-content.wp-block-post-content .wp-block-button:has(> #dc-59-1944),
  body.page-id-9 .wp-block-post-content.wp-block-post-content .wp-block-button:has(> #dc-105-628),
  body.page-id-9 .wp-block-post-content.wp-block-post-content .wp-block-button:has(> #dc-59-1603),
  body.page-id-9 .wp-block-post-content.wp-block-post-content .wp-block-button:has(> #dc-105-614) {
    width: 100% !important;
    max-width: none !important;
  }
}

/* The kontaktai hero's button is INSIDE the hero cover, and the cover-content release rule -
 * `#dc-59-1771 .wp-block-cover__inner-container [id^="dc-"]` - is (1,4,1), one class more than the
 * contract above. So BENDRADARBIAUKIME alone kept `padding-inline: 0` and its label ran to the
 * pill's edges under the arrow. Two ids beats one; nothing else in this file needs this. */
@media (max-width: 1439.98px) {
  body.page-id-9 .wp-block-post-content #dc-59-1771 #dc-105-628 {
    padding-left: var(--dm-3) !important;
    padding-right: var(--dm-3) !important;
  }
}

/* ------------------------------------------------------------------ *
 * 40. THE LABEL AND ITS ARROW ARE ONE GROUP.
 *
 * On the four controls where the SECTION is the pill and the label is a `.dm-cta` inside it, the
 * label wrapper kept the 28px of horizontal padding it needs when it is the button itself. So the
 * arrow sat 38px from the end of the word instead of the row's own 10px, and because the group is
 * centred, that 38px put the arrow at a different distance from the pill's edge on every button -
 * which is what reads as "the arrow floating" on two buttons stacked 12px apart.
 *
 * The pill already carries the padding. The label inside it must not carry it twice.
 * ------------------------------------------------------------------ */
@media (max-width: 1439.98px) {
  body.page-id-4 .wp-block-post-content.wp-block-post-content #dc-59-2271 a.dm-cta,
  body.page-id-4 .wp-block-post-content.wp-block-post-content #dc-59-2280 a.dm-cta,
  body.page-id-6 .wp-block-post-content.wp-block-post-content #dc-105-771 a.dm-cta,
  body.page-id-6 .wp-block-post-content.wp-block-post-content #dc-59-2476 a.dm-cta {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
}

/* ------------------------------------------------------------------ *
 * 41. THE HOME STATISTICS BAND.
 *
 * Four numbers in one 505px column, and the fourth "number" is an infinity mark drawn as a 40x40
 * stroked SVG next to three solid 36px italic numerals. Nominally the same size; optically about
 * half the weight, so it reads as a glyph that failed rather than as a value. It is scaled until
 * its stroke carries like the numerals do.
 *
 * Two columns rather than one: these are four short values with two-line descriptions, and one
 * column of them is the most wasteful block on the home page. 634px -> roughly 420.
 * ------------------------------------------------------------------ */
@media (max-width: 1439.98px) {
  body.page-id-4 .wp-block-post-content.wp-block-post-content #dc-97-1016 > .wp-block-columns {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
    column-gap: var(--dm-2) !important;
    row-gap: var(--dm-4) !important;
  }
  /* A stroked mark beside solid numerals has to be bigger to weigh the same. */
  body.page-id-4 .wp-block-post-content.wp-block-post-content #dc-59-2176 {
    width: 56px !important;
    height: 40px !important;
    object-fit: contain !important;
    object-position: left center !important;
  }
}

/* ------------------------------------------------------------------ *
 * 42. THE RESULT CARDS on pasiekimai - the best idea on the site, with three faults.
 *
 *   THE SEASON BADGE has `padding: 0`. "2024" and "SEZONAS" sit flush against the left edge of
 *   their own red box with ~25px of space on the right, so the words look like they have
 *   overflowed the chip. It also has square corners on a page where the card behind it, the
 *   photographs and every control are rounded, and its red is #dd1438 where the brand is #e22f2d.
 *
 *   THE RULE under the result is 274px inside a 326px content box - it stops 52px short of the
 *   right edge and aligns to nothing. It is a 1440 measurement written as a fixed width.
 *
 *   THE OVERLAY TEXT sits straight on the photograph, so the class line falls on light sand at
 *   about 3:1. A scrim in the lower half is what the home hero already does.
 * ------------------------------------------------------------------ */
@media (max-width: 1439.98px) {
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1410,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-102-251,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-102-278,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-102-224 {
    width: max-content !important;
    height: auto !important;
    min-height: 0 !important;
    padding: var(--dm-1) 12px !important;
    border-radius: 8px !important;
    background-color: #e22f2d !important;
    line-height: 1.15 !important;
    box-sizing: border-box !important;
  }
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1410 p,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-102-251 p,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-102-278 p,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-102-224 p { margin: 0 !important; }

  /*
   * A rule inherits its container's box; it never carries a width of its own. The 274px is on the
   * FIGURE as a max-width, not on the image - `width:100%` on the image resolved to 100% of a
   * 274px parent and nothing moved, which is exactly the shape of bug this file keeps finding.
   */
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1415,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-102-257,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-102-284,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-102-230,
  body.page-id-7 .wp-block-post-content.wp-block-post-content figure:has(> #dc-59-1415),
  body.page-id-7 .wp-block-post-content.wp-block-post-content figure:has(> #dc-102-257),
  body.page-id-7 .wp-block-post-content.wp-block-post-content figure:has(> #dc-102-284),
  body.page-id-7 .wp-block-post-content.wp-block-post-content figure:has(> #dc-102-230) {
    width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  /* 16px between cards, against 8px inside one. */
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1405,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-102-247,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-102-274,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-102-220 { margin-bottom: var(--dm-2) !important; }
}

/* ------------------------------------------------------------------ *
 * 43. ONE RADIUS FOR INSET MEDIA.
 *
 * Measured across the six pages: 30px, 28px, 20px, 16px and 0px on content images that sit inside
 * the column. Twice it happens between ADJACENT sections of one page - apie-doma's first photo is
 * square and the one in the section under it is 28px round; partnerystes does the same in reverse.
 * That is what makes a page read as assembled rather than designed, and no single image is wrong.
 *
 * 16px, everywhere something is inset. Full-bleed media keeps 0 - an image that spans the screen
 * has no corners to round. It is a deviation from the artboard's 28-30px, taken because one value
 * that is slightly tighter than the design beats five values that are exactly it; and 16 is
 * already the gallery grid's, so it is the value most of the site's media now shares.
 * ------------------------------------------------------------------ */
@media (max-width: 1439.98px) {
  body.page-id-4 .wp-block-post-content.wp-block-post-content #dc-59-2192,
  body.page-id-4 .wp-block-post-content.wp-block-post-content #dc-59-2193,
  body.page-id-4 .wp-block-post-content.wp-block-post-content #dc-59-2194,
  body.page-id-4 .wp-block-post-content.wp-block-post-content #dc-59-2213,
  body.page-id-4 .wp-block-post-content.wp-block-post-content #dc-59-2214,
  body.page-id-4 .wp-block-post-content.wp-block-post-content #dc-59-2215,
  body.page-id-4 .wp-block-post-content.wp-block-post-content #dc-59-2216,
  body.page-id-4 .wp-block-post-content.wp-block-post-content #dc-97-1014,
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1882,
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1878,
  body.page-id-6 .wp-block-post-content.wp-block-post-content #dc-105-758,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-102-47,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1405,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-102-247,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-102-274,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-102-220,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-103-501,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-59-2124 {
    border-radius: 16px !important;
    overflow: hidden !important;
  }
}

/* ------------------------------------------------------------------ *
 * 44. THE PARTNER TILES.
 *
 * The two grids - home and partnerystes - are already the same component down to the pixel: 171x76,
 * 12/16 padding, 8px gap, two up. The first review saw them as two different components, and that
 * was true of the capture it read; the generator's container pass had since unified them.
 *
 * What is left is the token itself: square corners and a 1px border at 5% white on a #0a0b0d
 * ground, which is 1.05:1 - the tiles have no visible edge at all, so six logos appear to float at
 * random intervals. Same radius as the rest of the site's containers, and the border at the 10%
 * the container token actually specifies.
 * ------------------------------------------------------------------ */
@media (max-width: 1439.98px) {
  body.page-id-4 .wp-block-post-content.wp-block-post-content #dc-59-2221,
  body.page-id-4 .wp-block-post-content.wp-block-post-content #dc-59-2223,
  body.page-id-4 .wp-block-post-content.wp-block-post-content #dc-59-2225,
  body.page-id-4 .wp-block-post-content.wp-block-post-content #dc-59-2227,
  body.page-id-4 .wp-block-post-content.wp-block-post-content #dc-59-2229,
  body.page-id-4 .wp-block-post-content.wp-block-post-content #dc-59-2231,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-103-466,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-103-467,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-103-468,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-103-469,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-103-470,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-103-471 {
    border-radius: 12px !important;
    border-color: rgba(255, 255, 255, .10) !important;
  }
}

/* The social tiles are a tap target on tablets too - between 1024 and 1440 they were still the
 * raw 22px glyph box, which the audit at 1024 and 1280 reported three times on every page. */
@media (min-width: 1024px) and (max-width: 1439.98px) {
  .wp-block-post-content.wp-block-post-content .dm-social {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 44px !important;
    height: 44px !important;
    border: 1px solid rgba(255, 255, 255, .14) !important;
    border-radius: 12px !important;
    background: rgba(255, 255, 255, .04) !important;
  }
  .wp-block-post-content.wp-block-post-content .dm-social figure { margin: 0 !important; line-height: 0 !important; }
}

/* ------------------------------------------------------------------ *
 * 45. THE FOOTER'S TWO-COLUMN SPLIT lived here and is SUPERSEDED BY SECTION 52, which pairs the
 * email with the phone instead of the phone with the social tiles. Removed rather than left in
 * place: both blocks were `@media (min-width: 400px)` at identical specificity, so which one won
 * came down to source order per declaration and the footer ended up half in each - the email
 * spanning, the phone in column 1, the social in column 2 and the CTA 180px wide inside a track it
 * was supposed to span. The third instance of this exact failure in one session.
 * ------------------------------------------------------------------ */

/* ------------------------------------------------------------------ *
 * 46. THE HEADER MARK IS A FIXED SIZE.
 *
 * The logo was being drawn at roughly 12vw with a 40px floor - 40px at 320, 47 at 390, 56 at 480 -
 * because the generated pictogram rule sizes it from the viewport and is written per-id, so the
 * header rule in section 38 (a class selector) never reached it. At 320 that made the whole
 * brand mark 40x44: under the tap floor, which is what the 320 audit reported on every page.
 *
 * A brand mark is not a pictogram and does not scale with the screen. 76px, fixed, everywhere -
 * the largest size that leaves the 44px toggle and the 20px gutter room at 320. Scoped to
 * `.dm-homelink` rather than to `.dm-header`, because the FOOTER carries the same mark and had the
 * same 40x44 problem; and because three classes plus an id beats the generated two-classes-plus-id
 * that was sizing it from the viewport.
 * ------------------------------------------------------------------ */
@media (max-width: 1439.98px) {
  .wp-block-post-content.wp-block-post-content .dm-homelink #dc-97-966,
  .wp-block-post-content.wp-block-post-content .dm-homelink #dc-103-401,
  .wp-block-post-content.wp-block-post-content .dm-homelink #dc-105-717,
  .wp-block-post-content.wp-block-post-content .dm-homelink #dc-105-646,
  .wp-block-post-content.wp-block-post-content .dm-homelink #dc-105-740,
  .wp-block-post-content.wp-block-post-content .dm-homelink #dc-105-776,
  .wp-block-post-content.wp-block-post-content .dm-homelink #dc-101-29,
  .wp-block-post-content.wp-block-post-content .dm-homelink #dc-103-334,
  .wp-block-post-content.wp-block-post-content .dm-homelink #dc-103-484,
  .wp-block-post-content.wp-block-post-content .dm-homelink #dc-103-317,
  .wp-block-post-content.wp-block-post-content .dm-homelink #dc-104-535,
  .wp-block-post-content.wp-block-post-content .dm-homelink #dc-105-562 {
    /* 68px wide is 49px tall on this two-line mark, which keeps the bar at ~65px and the link
     * over the 44px floor in both directions. 76px read well and made the bar 87px - a tenth of
     * the screen, on every page, for a logo. */
    width: 68px !important;
    max-width: 68px !important;
    height: auto !important;
  }

  .wp-block-post-content.wp-block-post-content a.dm-homelink:has(> figure > #dc-97-966),
  .wp-block-post-content.wp-block-post-content a.dm-homelink:has(> figure > #dc-103-401),
  .wp-block-post-content.wp-block-post-content a.dm-homelink:has(> figure > #dc-105-717),
  .wp-block-post-content.wp-block-post-content a.dm-homelink:has(> figure > #dc-105-646),
  .wp-block-post-content.wp-block-post-content a.dm-homelink:has(> figure > #dc-105-740),
  .wp-block-post-content.wp-block-post-content a.dm-homelink:has(> figure > #dc-105-776),
  .wp-block-post-content.wp-block-post-content a.dm-homelink:has(> figure > #dc-101-29),
  .wp-block-post-content.wp-block-post-content a.dm-homelink:has(> figure > #dc-103-334),
  .wp-block-post-content.wp-block-post-content a.dm-homelink:has(> figure > #dc-103-484),
  .wp-block-post-content.wp-block-post-content a.dm-homelink:has(> figure > #dc-103-317),
  .wp-block-post-content.wp-block-post-content a.dm-homelink:has(> figure > #dc-104-535),
  .wp-block-post-content.wp-block-post-content a.dm-homelink:has(> figure > #dc-105-562) {
    width: 68px !important;
    flex: 0 0 auto !important;
  }
}

/* The bar measured 83px against a 50px mark: 20px of its own padding, a 4px margin left on the
 * logo column by the small-screen nav rules, and the figure's own margins. All of it removed, so
 * the bar is the mark plus its padding and nothing else. */
@media (max-width: 1439.98px) {
  .wp-block-post-content.wp-block-post-content > .dm-header {
    padding-top: var(--dm-1) !important;
    padding-bottom: var(--dm-1) !important;
  }
  .wp-block-post-content.wp-block-post-content > .dm-header .wp-block-columns,
  .wp-block-post-content.wp-block-post-content > .dm-header .wp-block-column,
  .wp-block-post-content.wp-block-post-content > .dm-header figure,
  .wp-block-post-content.wp-block-post-content > .dm-header .dm-homelink {
    margin: 0 !important;
    line-height: 0 !important;
  }
}

/* ------------------------------------------------------------------ *
 * 47. THE BAR IS THE MARK PLUS ITS PADDING.
 *
 * 83px of header on every page, for a 50px mark. The 14px of padding is written per-id by the
 * generator - it MEASURED the value section 7 set here and baked it back in at (1,2,1), which
 * outranks any class selector, so both section 38's 10px and section 46's 8px were inert. A
 * generated value that came from this file is not a derivation, and it should not be able to
 * outrank the file it came from; until the generator stops emitting it, this restates it at id
 * specificity.
 * ------------------------------------------------------------------ */
@media (max-width: 1439.98px) {
  body.page-id-4 .wp-block-post-content.wp-block-post-content #dc-59-2291,
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-105-711,
  body.page-id-6 .wp-block-post-content.wp-block-post-content #dc-105-734,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-103-478,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-104-529 {
    padding-top: var(--dm-1) !important;
    padding-bottom: var(--dm-1) !important;
  }
}

/* ------------------------------------------------------------------ *
 * 48. THE TWO CENTRED STAT BLOCKS.
 *
 * apie-doma's four stats and pasiekimai's hero four are centred inside their cells; home's four
 * are left-aligned. Same content type, three pages, two alignments - which is most of why the
 * first review counted four different stat components. Nothing else on the site below 1440 is
 * centred, and a centred number over a two-line centred label has no rail for the eye to follow.
 *
 * Left, like every other value on the site. The remaining differences between the three blocks -
 * numeral size, whether there is an icon, what colour the label is - are in the artboard and are
 * the designer's to settle.
 * ------------------------------------------------------------------ */
@media (max-width: 1439.98px) {
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1809,
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1819,
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1837,
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1851,
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1810,
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1811,
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1820,
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1821,
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1838,
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1839,
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1852,
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1853,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1259,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1260,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1261,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1271,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1272,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1273,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1287,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1288,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1289,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1318,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1319,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1320 {
    text-align: left !important;
  }
}

/* `text-align: left` alone did not move them: the numbers are shrink-to-fit boxes CENTRED by
 * their grid, so the type inside was left-aligned in a box that was still in the middle of the
 * cell - a number centred over a left-aligned label, which is worse than either. The cell itself
 * has to start at the rail. */
@media (max-width: 1439.98px) {
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1795,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1258,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1525 .wp-block-columns {
    justify-items: start !important;
  }
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1795 > *,
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1795 .wp-block-column,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1525 .wp-block-column {
    justify-self: start !important;
    margin-left: 0 !important;
    margin-right: auto !important;
  }
}

/* The icon-and-label row of each stat sat 16px to the RIGHT of the number and description under
 * it - measured: the number and the description start at x=44, the icon at x=60. A rail that only
 * two of the four lines stand on is worse than no rail. */
@media (max-width: 1439.98px) {
  /* Anchored through the stats container as well: the generated rule that centres these
   * tracks is `#dc-59-1242 > :nth-child(1) > :nth-child(2) > :nth-child(1)` at (1,5,1), one
   * class more than the `:has()` form alone. Two ids beats it outright. */
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1242 .wp-block-columns:has(> * > #dc-59-1259),
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1242 .wp-block-columns:has(> * > #dc-59-1271),
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1242 .wp-block-columns:has(> * > #dc-59-1287),
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1242 .wp-block-columns:has(> * > #dc-59-1318) {
    /* `start`, not `flex-start`: this row is a GRID, its two tracks are 95px inside a 135px cell,
     * and it was distributing them with `justify-content: center` - which is what put the icon at
     * x=60 while the number under it starts at 44. */
    justify-content: start !important;
    justify-items: start !important;
    margin-left: 0 !important;
    padding-left: 0 !important;
  }
}

/* ------------------------------------------------------------------ *
 * 49. THE THIRD EYEBROW VARIANT, AND THE LAST OF THE RED DRIFT.
 *
 * Every eyebrow on the site is a red marker followed by a label - except the one on the kontaktai
 * hero, which has no marker at all. Three variants across six pages ("//", "///", none) is two too
 * many, and the missing one is on the page a visitor lands on to get in touch.
 *
 * The site's red is #e22f2d. "DAUGIAU AKIMIRKŲ" was still #dc2626 - close enough to look like a
 * rendering difference rather than a decision, which is the worst kind of near-miss.
 * ------------------------------------------------------------------ */
@media (max-width: 1439.98px) {
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-104-525::before {
    content: "//";
    margin-right: var(--dm-1);
    font-weight: 700;
  }
  body.page-id-6 .wp-block-post-content.wp-block-post-content #dc-59-2487 { color: #e22f2d !important; }
}

/* ------------------------------------------------------------------ *
 * 50. NOTHING IS CENTRED - the partnership cards, explicitly.
 *
 * Found by re-running the centring probe after regenerating grid.css: the generator had been
 * un-centring these ten from its own pass, and once the surrounding sections were re-flowed by
 * hand it stopped emitting those rules, so five card titles and their body copy silently centred
 * themselves. Every audit stayed at zero - overflow, taps, gaps and the cascade all pass a
 * perfectly centred card.
 *
 * The house rule is that nothing below 1024 is centred except a control's own label. Written here
 * rather than left to the generator, because it is judgement and it has to survive a regeneration.
 * ------------------------------------------------------------------ */
@media (max-width: 1439.98px) {
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-59-1972,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-59-1973,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-59-1987,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-59-1988,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-59-2002,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-59-2003,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-59-2019,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-59-2020,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-59-2034,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-59-2035 {
    text-align: left !important;
  }
}

/* ------------------------------------------------------------------ *
 * 51. THE ENQUIRY FORM IS THE CARD.
 *
 * `functions.php` replaces the design's picture-of-a-form section with a real <form>, so the card
 * around it was coming from the generated rule on the SECTION that no longer exists. Regenerating
 * grid.css dropped that rule and the form lost its padding, its border and its corners in one go -
 * the heading ran flush to the card's edge and the fields spanned the full column.
 *
 * Caught by diffing all 47 section shots before and against after, not by any audit: overflow,
 * taps, gaps and the cascade all pass a form with no card around it.
 *
 * The card belongs to the form now. It cannot be un-emitted by a regeneration, which is the point.
 * ------------------------------------------------------------------ */
@media (max-width: 1439.98px) {
  .wp-block-post-content.wp-block-post-content form.dm-form {
    padding: var(--dm-3) !important;
    background: #131417 !important;
    border: 1px solid rgba(255, 255, 255, .10) !important;
    border-radius: 16px !important;
    box-sizing: border-box !important;
  }
}

/* ------------------------------------------------------------------ *
 * 52. THE FOOTER NAVIGATION, and a grid that pairs like with like.
 *
 * All three second-pass reviews found the same gap without being told to look for it: the footer
 * had no navigation, so on a phone the hamburger was the only route between pages and every page
 * ended in a dead end. Two of the three also called the grid out for contradicting itself - one
 * full-width row (the email) followed by a two-column row (phone + social).
 *
 * So: EL. PAŠTAS and TELEFONAS pair up, which is what a reader expects of two contact details, and
 * the social tiles take their own full-width row. The email needs 175px of type and the phone 138,
 * which is why the split is 1.3fr/1fr rather than even - at 1fr the address broke as
 * "info@domasbutkus / .lt". Below 400 the footer stays one column: three 44px tiles do not fit in
 * half of a 280px content column.
 * ------------------------------------------------------------------ */
@media (min-width: 400px) and (max-width: 1439.98px) {
  body.page-id-4 .wp-block-post-content.wp-block-post-content #dc-103-399 > .wp-block-columns,
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-105-644 > .wp-block-columns,
  body.page-id-6 .wp-block-post-content.wp-block-post-content #dc-105-774 > .wp-block-columns,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-103-332 > .wp-block-columns,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-59-1903 > .wp-block-columns,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-105-560 > .wp-block-columns { grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr) !important; }
  body.page-id-4 .wp-block-post-content.wp-block-post-content #dc-103-399 > .wp-block-columns > .wp-block-column:has(a[href^="mailto"]),
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-105-644 > .wp-block-columns > .wp-block-column:has(a[href^="mailto"]),
  body.page-id-6 .wp-block-post-content.wp-block-post-content #dc-105-774 > .wp-block-columns > .wp-block-column:has(a[href^="mailto"]),
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-103-332 > .wp-block-columns > .wp-block-column:has(a[href^="mailto"]),
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-59-1903 > .wp-block-columns > .wp-block-column:has(a[href^="mailto"]),
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-105-560 > .wp-block-columns > .wp-block-column:has(a[href^="mailto"]) { grid-column: 1 !important; }
  body.page-id-4 .wp-block-post-content.wp-block-post-content #dc-103-399 > .wp-block-columns > .wp-block-column:has(a[href^="tel"]),
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-105-644 > .wp-block-columns > .wp-block-column:has(a[href^="tel"]),
  body.page-id-6 .wp-block-post-content.wp-block-post-content #dc-105-774 > .wp-block-columns > .wp-block-column:has(a[href^="tel"]),
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-103-332 > .wp-block-columns > .wp-block-column:has(a[href^="tel"]),
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-59-1903 > .wp-block-columns > .wp-block-column:has(a[href^="tel"]),
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-105-560 > .wp-block-columns > .wp-block-column:has(a[href^="tel"]) { grid-column: 2 !important; }
  body.page-id-4 .wp-block-post-content.wp-block-post-content #dc-103-399 > .wp-block-columns > .wp-block-column:has(.dm-social),
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-105-644 > .wp-block-columns > .wp-block-column:has(.dm-social),
  body.page-id-6 .wp-block-post-content.wp-block-post-content #dc-105-774 > .wp-block-columns > .wp-block-column:has(.dm-social),
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-103-332 > .wp-block-columns > .wp-block-column:has(.dm-social),
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-59-1903 > .wp-block-columns > .wp-block-column:has(.dm-social),
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-105-560 > .wp-block-columns > .wp-block-column:has(.dm-social) { grid-column: 1 / -1 !important; }
}


/*
 * CORRECTED 2026-09-07. All of this used to sit inside `@media (max-width: 1439.98px)`, so at 1440
 * and above the navigation had NO rule at all: six links painting in the user agent's own colours,
 * blue unvisited and purple visited, underlined, stacked in a 167px column and running straight
 * through the KALBĖKIME button. It was live on all six pages at 1440, 1600 and 1920, and the
 * operator saw it before any check did - `mobile-audit` only runs to 1280, and the 1440 pixel diff
 * scores a 40x40 tile by its MEAN, which small purple text on black never moves past the threshold.
 *
 * The lesson, and it generalises: the responsive layer may hold what CHANGES with width. Anything a
 * component needs in order to be itself - its colour, its type, the fact that it is not underlined -
 * is not responsive and must not be inside a width query. A media query is the wrong home for the
 * only rule an element has.
 */
.wp-block-post-content.wp-block-post-content .dm-footnav ul {
  display: flex !important;
  flex-wrap: wrap !important;
  /*
   * CENTRED AT EVERY WIDTH. It was centred from 1024 up and left-aligned below, where it wraps -
   * so on a phone the seven links came out as three ragged rows against the left edge, the last of
   * them ("Privatumo politika") sitting alone under a row that ended 86px short of it. A wrapped
   * row that is not centred reads as a mistake rather than a list. Centring is what the rows above
   * it in the footer already do at that width.
   */
  justify-content: center !important;
  gap: var(--dm-1) var(--dm-3) !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}
.wp-block-post-content.wp-block-post-content .dm-footnav li { margin: 0 !important; }
.wp-block-post-content.wp-block-post-content .dm-footnav a,
.wp-block-post-content.wp-block-post-content .dm-footnav span {
  display: flex !important;
  align-items: center !important;
  font-family: "Montserrat", sans-serif !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: .04em !important;
  color: rgba(255, 255, 255, .70) !important;
  text-decoration: none !important;
}
.wp-block-post-content.wp-block-post-content .dm-footnav a:hover { color: #fff !important; }
/* The page you are on is named, not linked - a link to here is a link to nowhere. */
.wp-block-post-content.wp-block-post-content .dm-footnav span[aria-current="page"] { color: #e22f2d !important; }

/* Below 1440 the nav sits under the CTA, where there is a full-width column for it to wrap in. */
@media (max-width: 1439.98px) {
  .wp-block-post-content.wp-block-post-content .dm-footnav { margin-top: var(--dm-4) !important; }
  .wp-block-post-content.wp-block-post-content .dm-footnav a,
  .wp-block-post-content.wp-block-post-content .dm-footnav span { min-height: 44px !important; }
}

/*
 * At 1440 and up it cannot stay there: the CTA's column is 167px wide and the six links need 576,
 * and the 112px of room between the button and the bottom rule is 2px short of the 114 they take
 * stacked. The bottom bar is where it belongs anyway - below the rule that row is 98px tall and
 * holds nothing but a centred copyright line 17px high.
 *
 * It goes ABOVE the copyright rather than beside it. Beside was measured first and does not fit:
 * the links run 48..624 and the copyright starts at 591, so "Kontaktai" printed straight through
 * it. Moving the copyright would have fixed that too, but the copyright is where the signed-off
 * design puts it and the empty band above it is not - so the nav takes the empty band and nothing
 * in the design moves. 17px centred in the 41px between the rule at 233 and the copyright at 274.
 *
 * Measured on all six pages, which are identical here: the footer band is 1440x331 and absolutely
 * positioned, so it is already the containing block, and the copyright sits 40px off the bottom.
 */
@media (min-width: 1440px) {
  .wp-block-post-content.wp-block-post-content .dm-footnav {
    position: absolute !important;
    /* NOT `left: 50%` + a translate. An absolutely positioned box shrink-to-fits into the space
     * LEFT of it, so `left: 50%` capped this nav at 720px - and when the privacy link took the row
     * past 720 it wrapped, leaving one link alone on a second line, flush left under a centred row.
     * Six links fit in 575px and it looked deliberate for two days. Span the band and centre the
     * list inside it: the row then has 1440 to use and centres at any width the band grows to. */
    left: 0 !important;
    right: 0 !important;
    transform: none !important;
    bottom: 69px !important;
    margin: 0 !important;
    /* The band it sits in is not empty in the DOM. The copyright group `#dc-103-462` is drawn at
     * `z-index: 14` and carries a full-width `wp-block-spacer` across exactly this band, so it
     * took every click: the links looked right and did nothing, on all six pages. A hit test finds
     * that; no screenshot ever could. 20 clears the generated stack, whose highest here is 14. */
    z-index: 20 !important;
  }
  .wp-block-post-content.wp-block-post-content .dm-footnav ul {
    justify-content: center !important;
    row-gap: var(--dm-1) !important;
  }
  .wp-block-post-content.wp-block-post-content .dm-footnav a,
  .wp-block-post-content.wp-block-post-content .dm-footnav span {
    min-height: 0 !important;
    line-height: 17px !important;
  }
}

/* ------------------------------------------------------------------ *
 * 53. ONE SECONDARY BUTTON.
 *
 * The two outline controls at the foot of the gallery are the same size and sit on the same rail,
 * but one has a solid white border with a 32px radius and a white label, and the other a 25%-white
 * border with a pill radius and a RED label. A red label inside a grey outline on near-black is
 * the lowest-contrast control on the site and reads as disabled - which is unfortunate, because it
 * is that page's main action.
 *
 * Red is for eyebrows, units and the primary fill. A secondary control is a white label in a
 * 25%-white pill.
 * ------------------------------------------------------------------ */
@media (max-width: 1439.98px) {
  body.page-id-6 .wp-block-post-content.wp-block-post-content #dc-59-2476 {
    border: 1px solid rgba(255, 255, 255, .25) !important;
    border-radius: 9999px !important;
  }
  body.page-id-6 .wp-block-post-content.wp-block-post-content #dc-59-2487 { color: #fff !important; }
}

/* ------------------------------------------------------------------ *
 * 54. THE CONTACT ROWS ARE ONE ROW COMPONENT.
 *
 * Rows 1-2 measured 52px and rows 3-4 measured 44px, because the phone and the email carry a
 * tappable link with a 44px floor and the handle and the location are plain text. One list, two
 * heights - and because the icon centres on the row, the icons on the taller two sit lower
 * against their labels than the icons on the shorter two. A reviewer described it as "one list
 * built two different ways", which is exactly what it was.
 * ------------------------------------------------------------------ */
@media (max-width: 1439.98px) {
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-105-556,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-105-555,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-105-554,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-105-553 {
    min-height: 52px !important;
  }
}

/* ------------------------------------------------------------------ *
 * 55. A SCRIM UNDER TEXT THAT SITS ON A PHOTOGRAPH.
 *
 * The four result cards put white type straight onto the picture, so whether "MX PRO KLASĖ" can be
 * read depends on what happens to be behind it - on the 2023 card it lands on pale sand. The home
 * hero has had a scrim since the generator learned to build one; these four never got it, because
 * they are cards rather than heroes. Legibility should not be a property of the photograph.
 * ------------------------------------------------------------------ */
@media (max-width: 1439.98px) {
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1405::after,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-102-247::after,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-102-274::after,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-102-220::after {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    z-index: 1 !important;
    pointer-events: none !important;
    border-radius: inherit !important;
    background: linear-gradient(to top,
      rgba(0, 0, 0, .88) 0%, rgba(0, 0, 0, .55) 32%, rgba(0, 0, 0, .10) 62%, transparent 82%) !important;
  }
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1405,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-102-247,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-102-274,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-102-220 { position: relative !important; }
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1405 > *,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-102-247 > *,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-102-274 > *,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-102-220 > * { position: relative !important; z-index: 2 !important; }
}

/* ------------------------------------------------------------------ *
 * 56. THE DIMMEST GREY ON THE SITE.
 *
 * apie-doma's stat labels are #909094 on #0a0b0d. That measures 6.09:1, so it passes AA and two
 * of the three reviews were wrong to call it a contrast failure - but all of them independently
 * called it hard to read, and at 13px on a phone held at arm's length they are right about the
 * experience even where the number says otherwise. A ratio is a floor, not a target.
 * ------------------------------------------------------------------ */
@media (max-width: 1439.98px) {
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1810,
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1811,
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1820,
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1821,
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1838,
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1839,
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1852,
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1853 {
    color: rgba(255, 255, 255, .78) !important;
  }
}

/* The event name on each result card is 12px of #ff2048 laid straight on a photograph - a fifth
 * red, and the lowest-contrast text on the page even with the scrim behind it. The trophy beside
 * it already carries the accent; the words carry the information, so the words go white. */
@media (max-width: 1439.98px) {
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1416,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-102-258,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-102-285,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-102-231 {
    color: rgba(255, 255, 255, .92) !important;
  }
}

/* The last contact row still carried its 16px bottom margin, which stacked with the section's own
 * 40px of padding and made an 84px flat band the dead-space pass reported as a void INSIDE the
 * section rather than as a join between two. A row gap belongs between rows. */
@media (max-width: 1439.98px) {
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-105-553 { margin-bottom: 0 !important; }
}

/* ------------------------------------------------------------------ *
 * 57. A CONTACT ROW IS ONE TAP TARGET.
 *
 * The anchor no longer sets the row's height (see section 34); this gives it its hit area back by
 * stretching a pseudo-element over the whole row. Applied on the home page too, where the same
 * cause put the three contact lines 31px and 19px apart instead of evenly - two of the three were
 * links carrying a 44px box and the third was not.
 *
 * `mobile-audit.mjs` was taught to measure this: a link's own rect is not the hit area when a
 * stretched ::after is what a thumb lands on. Before that it reported the correct build as a
 * failure and the failing build as clean, which is the worst way round for a check to be wrong.
 * ------------------------------------------------------------------ */
@media (max-width: 1439.98px) {
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-105-556,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-105-555,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-105-554,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-105-553,
  body.page-id-4 .wp-block-post-content.wp-block-post-content #dc-59-2233 .wp-block-columns:has(> * > .dm-contactlink),
  .wp-block-post-content.wp-block-post-content > section:last-child .wp-block-columns:has(.dm-contactlink) {
    position: relative !important;
  }
  .wp-block-post-content.wp-block-post-content .dm-contactlink { position: relative !important; }
  .wp-block-post-content.wp-block-post-content .dm-contactlink::after {
    content: "" !important;
    position: absolute !important;
    /* -12px top and bottom takes a 21px line to a 45px target even where the row itself is short. */
    inset: -12px 0 !important;
    z-index: 3 !important;
  }
}

/* ------------------------------------------------------------------ *
 * 58. THE LAST 4px, and where it came from.
 *
 * With the rows equal in height, the label-to-value gap still measured 12px on the three rows whose
 * value is a link and 8px on the one that is not. The cause is core's flow gap: the anchor is a
 * new block sibling, so it collects `margin-top: 8px` that the bare paragraph in the fourth row
 * never gets, and the declared 4px row-gap was only ever half of what rendered.
 *
 * The margin goes and the pair gap is stated once, at 8 - a value from the scale rather than the
 * arithmetic of two rules that did not know about each other. Rows sit 24px apart, so the gap
 * inside a pair is a third of the gap around it.
 * ------------------------------------------------------------------ */
@media (max-width: 1439.98px) {
  .wp-block-post-content.wp-block-post-content .dm-contactlink { margin-top: 0 !important; }
}
@media (max-width: 1439.98px) {
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-105-556,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-105-555,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-105-554,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-105-553 {
    row-gap: var(--dm-1) !important;
    /* 8px on top of core's own 16px block gap = 24 between rows, against 10 inside a pair. */
    margin-bottom: var(--dm-1) !important;
  }
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-105-553 { margin-bottom: 0 !important; }
}

/* ------------------------------------------------------------------ *
 * 59. TWO MEASURED VOIDS AND ONE RAGGED CARD.
 *
 * THE QUOTE MARK sat in a grid row 132px tall to hold a 52px mark: the row carries a 64px row-gap
 * from the artboard and its first column holds an image that renders 0x0, so the empty column and
 * the gap under it were 80px of nothing above the mark. Neither the gap audit nor the dead-space
 * pass could see it - every value is on the scale and the band is not flat, it is a gap between
 * two grid rows.
 *
 * THE FOURTH TRAINING CARD is 102px against 86 for the other three, because its label is the only
 * one that wraps. The label gets a two-line box, so all four cards are the height of the tallest
 * and the stack stops being ragged. The label itself is too long for its siblings and duplicates
 * the hero's wording - that is on the handover list as a copy decision, not a layout one.
 * ------------------------------------------------------------------ */
@media (max-width: 1439.98px) {
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-103-316 > .wp-block-columns:first-child { row-gap: 0 !important; }
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1347,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1358,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1373,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1384 {
    /* 1.3 line-height x 2 lines, so a one-line label reserves the same box as a two-line one. */
    min-height: 2.6em !important;
  }
}

/* The mark, the quote and the attribution are three lines of one lockup and sat 0px and 16px
 * apart. The mark's own 16px bottom margin was collapsing out of its grid row, so the mark touched
 * the quote while the attribution kept its distance. One value for both. */
@media (max-width: 1439.98px) {
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-103-316 > .wp-block-columns:first-child {
    margin-bottom: var(--dm-2) !important;
  }
}

/* ------------------------------------------------------------------ *
 * 60. A CONSTRAINED CHILD SITS ON THE RAIL, NOT IN THE MIDDLE.
 *
 * Core's constrained layout gives every child `margin-left: auto` with a max-width. For a child
 * that fills its container that does nothing; for one whose max-width is SMALLER it centres it.
 * Two blocks hit that: a partnership paragraph capped at 520px sat 92px in from both sides at 768
 * and 204px at 1024, while the eyebrow, the heading and the button around it all started on the
 * rail; and a contact heading did the same at 1024. One paragraph indented from an otherwise
 * straight left edge reads as a mistake, because it is one.
 *
 * Found by sweeping every element on every page at three widths for symmetric slack, after the
 * 390-only check came back clean - a centring fault can live at one width and nowhere else, and
 * the widths between a phone and the design are exactly where nobody looks.
 * ------------------------------------------------------------------ */
@media (max-width: 1439.98px) {
  /*
   * NAMED, not general. The first version of this matched every constrained child on the site -
   * and the header IS a constrained container, so it took `margin-left:auto` off the hamburger and
   * moved the menu from the right of the bar to sit against the logo, on every page. A rule that
   * only needed to reach two paragraphs should not have been able to move the navigation.
   */
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-59-2128,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-59-1690 {
    margin-left: 0 !important;
    margin-right: auto !important;
    /* `none` here until 2026-09-08, which released core's 520px cap AND its centring together.
     * On a phone that was invisible - the column is narrower than the cap either way - but on a
     * 1280 tablet it let this paragraph run 1,216px, 151 characters to the line. The centring is
     * still released by the two margins above; the cap is now a measure rather than a layout. */
    max-width: 68ch !important;
  }
}

/* ------------------------------------------------------------------ *
 * 61. THE THINGS THE OPERATOR HAD TO POINT AT TWICE.
 *
 * Every one of these was visible in a screenshot and invisible to six automated checks, which is
 * the honest summary of where the tooling ends: overflow, taps, gaps, ordering, cascade and dead
 * space all pass a card whose text touches its own border.
 * ------------------------------------------------------------------ */
@media (max-width: 1439.98px) {
  /*
   * A. THE SOCIAL CARD MARKS had a box drawn around a mark that already draws its own box. The
   * Instagram and YouTube glyphs ARE rounded squares; putting a 36px rounded square behind them
   * made two frames 9px apart. The mark is the mark.
   */
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-59-1640,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-59-1659,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-59-1674 {
    box-sizing: content-box !important;
    padding: 0 !important;
    border: 0 !important;
    background: none !important;
    width: 22px !important;
    height: 22px !important;
  }

  /*
   * B. THE "KURKIME VERTĘ" CARDS carried a 30%-white border with ZERO padding, so every title and
   * every line of body copy started ON the border, and the five sat 7px apart - closer to each
   * other than their contents were to their own edges. Square corners on a site of rounded ones.
   */
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-59-1961,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-59-1974,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-59-1989,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-59-2004,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-59-2021 {
    padding: var(--dm-3) !important;
    border: 1px solid rgba(255, 255, 255, .10) !important;
    border-radius: 12px !important;
    background: #131417 !important;
    margin-bottom: var(--dm-2) !important;
    box-sizing: border-box !important;
  }
  /* An 82px ring for a 40px glyph is most of a card's height. */
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-59-1962,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-59-1975,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-59-1990,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-59-2005,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-59-2022 {
    width: 56px !important;
    height: 56px !important;
  }

  /*
   * C. THE IMAGE ABOVE "KVIEČIAME PRISIJUNGTI" sat with 0px between it and the eyebrow under it,
   * so the photograph and the text read as one smeared object.
   */
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-59-2123 > .wp-block-columns:first-of-type { margin-bottom: var(--dm-4) !important; }

  /*
   * D. THE TWO HAIRLINES on the pasiekimai stat block bracket four statistics and separate
   * nothing - there is no rule between the rows, so they read as a frame that lost its table.
   */
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1240,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1241 { display: none !important; }

  /*
   * E. THE ENQUIRY FORM was two cards: functions.php gives the <form> the card, and the section
   * inside it still had its own #0a0b0d fill and 24px padding - a darker box inside a lighter one,
   * which is the raised-surface convention upside down, plus 44px of doubled padding.
   */
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-59-1589 {
    background: none !important;
    padding: 0 !important;
    border: 0 !important;
  }

  /*
   * F. THE PANEL LOGO was 107px against the header's 68 - the same mark at two sizes, one of them
   * revealed by the act of opening the menu.
   */
  .dm-panel__logo { width: 68px !important; }
  .dm-panel__logo img { width: 68px !important; height: auto !important; max-width: 68px !important; }
  .dm-panel__logo figure { margin: 0 !important; line-height: 0 !important; }

  /*
   * G. APIE DOMĄ opened with the photograph hard against the header, and its four statistics sat
   * 80px apart in rows while their own contents were 8px apart. Same ladder as everywhere else.
   */
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1881 > .wp-block-columns:first-of-type { margin-top: var(--dm-4) !important; }
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1795 { row-gap: var(--dm-4) !important; }
}

/* ------------------------------------------------------------------ *
 * 62. TWO QUOTATION MARKS, ONE OPENING AND ONE CLOSING.
 *
 * The design has both: at 1440 the opening mark (59-1516.svg, 82px) sits at the LEFT of the quote
 * and the closing mark (103-310.svg, 69px) at the RIGHT, and the text runs between them. Below
 * 1440 only one of them was ever visible, and it was the CLOSING one - so the quote opened with a
 * closing mark and never closed. Then section 59 hid the column holding the other, having read a
 * collapsed 0x0 image as an empty column left over from the artboard. It was the opening mark.
 *
 * Both are back, each in its own place: opening above-left of the text, closing at the bottom
 * right of the block, which is the same relationship the design draws horizontally, rotated into a
 * column. Both are painted with the brand red through a mask, because the SVGs have fill="#471211"
 * baked in - 1.11:1 on this background, which is not subtle, it is invisible.
 * ------------------------------------------------------------------ */
@media (max-width: 1439.98px) {
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-103-316 { position: relative !important; }

  /* The row that carries the marks holds only the opening one in flow. */
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-103-316 > .wp-block-columns:first-child { row-gap: 0 !important; }
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-103-316 figure:has(> #dc-59-1516) {
    display: block !important;
    width: 46px !important;
    height: 46px !important;
    /* The glyph is inset in its own viewBox, so flush-left renders as indented. */
    margin: 0 0 0 -4px !important;
    line-height: 0 !important;
    background-color: #e22f2d !important;
    -webkit-mask: url(59-1516.svg) no-repeat center / contain !important;
    mask: url(59-1516.svg) no-repeat center / contain !important;
  }
  /* The closing mark leaves the flow and hangs at the end of the quote, where a closing mark goes. */
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-103-316 figure:has(> #dc-103-310) {
    position: absolute !important;
    right: 0 !important;
    bottom: 0 !important;
    display: block !important;
    width: 38px !important;
    height: 38px !important;
    margin: 0 !important;
    line-height: 0 !important;
    background-color: #e22f2d !important;
    -webkit-mask: url(103-310.svg) no-repeat center / contain !important;
    mask: url(103-310.svg) no-repeat center / contain !important;
  }
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1516,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-103-310 { display: none !important; }
  /* The attribution must not run under the closing mark. */
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-2502 { padding-right: 54px !important; }
}

/* The MATOMUMO marks are cropped to their ring now (tools/icon-crop.py), so what is left is a
 * round badge - but a 20px radius on a 44px box is a rounded SQUARE, which is what still read as
 * a black box. A circle, matching the circular icons on the cards higher up the same page. */
@media (max-width: 1439.98px) {
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-59-2048,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-59-2058,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-59-2068,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-59-2078,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-59-2088 {
    border-radius: 50% !important;
    object-fit: cover !important;
  }
}

/* ------------------------------------------------------------------ *
 * 63. APIE DOMĄ - the section that reads as a stack rather than a design.
 *
 * Measured: the photograph ends 8px above a 72px headline; the four statistics sit 65px apart in
 * rows against 10px between their columns, so the 2x2 reads as two unrelated pairs; and two 26x1px
 * images float under the block - stray separators from the artboard, the same class of leftover as
 * the detached rule under the gallery's load-more.
 *
 * The stack becomes three groups: picture, words, numbers. The numbers get a hairline above them
 * and real air, which is what turns the last third of the section from "more text" into a block.
 * ------------------------------------------------------------------ */
@media (max-width: 1439.98px) {
  /* A 72px headline needs more than 8px of clearance from the photograph above it. */
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1882 { margin-bottom: var(--dm-4) !important; }

  /* Two 26x1px strays. */
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1796,
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1797 { display: none !important; }

  /* The statistics are their own block, and they start on a rule. */
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1795 {
    align-items: start !important;
    /*
     * 8px, not 48. The `.wp-block-columns` inside this block is `display:contents`, so every
     * icon, every number and every label is a DIRECT grid item - each stat spans three grid ROWS,
     * and one row-gap governs both the space inside a stat and the space between two of them.
     * At 48 the icon sat as far from its own number as from the next statistic. The separation
     * between the two rows of stats is put back below, on the second row's icons, where it can be
     * a different number.
     */
    row-gap: var(--dm-1) !important;
    column-gap: var(--dm-2) !important;
    margin-top: var(--dm-5) !important;
    padding-top: var(--dm-5) !important;
    border-top: 1px solid rgba(255, 255, 255, .10) !important;
  }
  /* 8px inside a cell against 48 between rows: the ordering rule, at the cell scale. */
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1795 .wp-block-column { align-self: start !important; }
}

/* Inside a stat cell the icon, the number and the label are one object: 8px apart, against the
 * 48px between rows. Before this the cell's own spacers and core's flow gap put roughly 40px
 * between an icon and its own number - almost the distance to the NEXT statistic, so four cells
 * read as twelve loose lines. */
@media (max-width: 1439.98px) {
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1795 .wp-block-spacer { display: none !important; }
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1795 .wp-block-columns { row-gap: var(--dm-1) !important; margin: 0 !important; }
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1795 :where(.is-layout-flow) > * + * { margin-block-start: var(--dm-1) !important; }
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1795 figure { margin: 0 !important; line-height: 0 !important; }
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1809,
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1819,
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1837,
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1851 { margin: var(--dm-1) 0 0 0 !important; line-height: 1 !important; }
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1810,
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1820,
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1838,
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1852 { margin-top: var(--dm-1) !important; }
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1811,
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1821,
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1839,
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1853 { margin-top: 0 !important; }
}

/* The second row of statistics starts a new group: 48px above its icons, against the 8px that now
 * separates an icon from its own number. */
@media (max-width: 1439.98px) {
}

/* ------------------------------------------------------------------ *
 * 64. THE FOUR THINGS STILL WRONG AFTER THE LAST ROUND.
 *
 * A. THE RULE UNDER "1 VIETA" is an <img> of 59-1415.svg, and that file is `viewBox="0 0 274 1"`.
 *    Stretched into a 378px box an SVG keeps its aspect ratio by default, so the browser drew the
 *    274px line CENTRED with 52px of nothing at each end - on a card where every other element
 *    starts at the left. Setting width on the image could never fix it; the centring is inside the
 *    file. It becomes a CSS border on the figure, which inherits the box it is in.
 *
 * B. APIE DOMĄ's statistics were stacked icon-over-number-over-label, which is what the operator
 *    has now said twice is the wrong answer. The icon goes BESIDE its number. The grid gets five
 *    explicit columns - icon, text, spacer, icon, text - and every one of the sixteen pieces is
 *    placed by hand, because `display:contents` had already dissolved the artboard's wrappers and
 *    row-major auto-placement can only ever put the icons in a row of their own.
 *
 * C. THE QUOTATION MARKS were the right idea and the wrong way round. The design puts the opening
 *    mark at the LEFT and LOW (x=64, y=2511 at 1440) and the closing mark at the RIGHT and HIGH
 *    (x=792, y=2414). I built the mirror image of that.
 *
 * D. THE FOOTER SOCIAL TILES have the same double box the contact cards had: the Instagram and
 *    YouTube glyphs draw their own rounded squares, so a tile behind them is a second frame. The
 *    44px target stays; the frame goes.
 * ------------------------------------------------------------------ */
@media (max-width: 1439.98px) {
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1415,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-102-257,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-102-284,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-102-230 { display: none !important; }
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1415 ,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-102-257 ,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-102-284 ,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-102-230  {}
  body.page-id-7 .wp-block-post-content.wp-block-post-content figure:has(> #dc-59-1415),
  body.page-id-7 .wp-block-post-content.wp-block-post-content figure:has(> #dc-102-257),
  body.page-id-7 .wp-block-post-content.wp-block-post-content figure:has(> #dc-102-284),
  body.page-id-7 .wp-block-post-content.wp-block-post-content figure:has(> #dc-102-230) {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    height: 0 !important;
    margin: 0 !important;
    border-top: 1px solid rgba(255, 255, 255, .35) !important;
  }

  /* D. */
  .wp-block-post-content.wp-block-post-content .dm-social {
    border: 0 !important;
    background: none !important;
  }
}

/* B. */
@media (max-width: 1439.98px) {
  /*
   * The GRID ITEMS are the artboard's columns, not the images and headings inside them - the
   * first attempt placed the ids themselves and every one of the sixteen rules was inert, because
   * a grid only places its own children. Each column is addressed by what it contains.
   */
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1795 {
    grid-template-columns: auto minmax(0, 1fr) var(--dm-3) auto minmax(0, 1fr) !important;
    /* Row 4 is an empty spacer row. Separating the two pairs with a margin on the second row's
     * icon pushed those icons DOWN out of line with their own numbers - a margin on a grid item
     * moves the item, not the row. */
    grid-template-rows: auto auto auto var(--dm-5) auto auto auto !important;
    row-gap: 4px !important;
    column-gap: var(--dm-2) !important;
  }
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1795 > .wp-block-columns { display: contents !important; }
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1795 > .wp-block-columns > .wp-block-column:has(#dc-59-1798) { grid-area: 1 / 1 / 2 / 2 !important; align-self: center !important; }
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1795 > .wp-block-columns > .wp-block-column:has(#dc-59-1809)  { grid-area: 1 / 2 / 2 / 3 !important; align-self: center !important; }
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1795 > .wp-block-columns > .wp-block-column:has(#dc-59-1810)   { grid-area: 2 / 2 / 3 / 3 !important; }
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1795 > .wp-block-columns > .wp-block-column:has(#dc-59-1811)   { grid-area: 3 / 2 / 4 / 3 !important; }
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1795 > .wp-block-columns > .wp-block-column:has(#dc-59-1812) { grid-area: 1 / 4 / 2 / 5 !important; align-self: center !important; }
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1795 > .wp-block-columns > .wp-block-column:has(#dc-59-1819)  { grid-area: 1 / 5 / 2 / 6 !important; align-self: center !important; }
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1795 > .wp-block-columns > .wp-block-column:has(#dc-59-1820)   { grid-area: 2 / 5 / 3 / 6 !important; }
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1795 > .wp-block-columns > .wp-block-column:has(#dc-59-1821)   { grid-area: 3 / 5 / 4 / 6 !important; }
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1795 > .wp-block-columns > .wp-block-column:has(#dc-59-1822) { grid-area: 5 / 1 / 6 / 2 !important; align-self: center !important; }
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1795 > .wp-block-columns > .wp-block-column:has(#dc-59-1837)  { grid-area: 5 / 2 / 6 / 3 !important; align-self: center !important; }
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1795 > .wp-block-columns > .wp-block-column:has(#dc-59-1838)   { grid-area: 6 / 2 / 7 / 3 !important; }
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1795 > .wp-block-columns > .wp-block-column:has(#dc-59-1839)   { grid-area: 7 / 2 / 8 / 3 !important; }
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1795 > .wp-block-columns > .wp-block-column:has(#dc-59-1840) { grid-area: 5 / 4 / 6 / 5 !important; align-self: center !important; }
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1795 > .wp-block-columns > .wp-block-column:has(#dc-59-1851)  { grid-area: 5 / 5 / 6 / 6 !important; align-self: center !important; }
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1795 > .wp-block-columns > .wp-block-column:has(#dc-59-1852)   { grid-area: 6 / 5 / 7 / 6 !important; }
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1795 > .wp-block-columns > .wp-block-column:has(#dc-59-1853)   { grid-area: 7 / 5 / 8 / 6 !important; }

}

/* ------------------------------------------------------------------ *
 * 65. THE QUOTATION MARKS SIT BEHIND THE TEXT, AS THEY DO AT 1440.
 *
 * Measured on the design: the opening mark is 82px at x64..146 while the quote text runs x87..875,
 * so the text starts 23px INSIDE the mark and its last line crosses the mark's top half. The
 * closing mark is 69px at x792..861 against a text edge of 875 - also inside - and sits over the
 * first line. z-index puts the text above both (1 and 2 against 3). They are watermarks the
 * paragraph is set on top of, not ornaments parked in the corners.
 *
 * Two earlier attempts had them in flow and then pinned to the corners, which is what "floaty"
 * meant: nothing overlapped, so they read as two loose glyphs rather than as part of the quote.
 * Here they overlap the text block by roughly a quarter of their own width at both ends, sit under
 * it, and drop to 40% so the words stay the loudest thing in the block.
 * ------------------------------------------------------------------ */
@media (max-width: 1439.98px) {
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-103-316 {
    position: relative !important;
    padding-top: 30px !important;
    padding-bottom: 6px !important;
  }
  /* Closing mark: over the first line, at the right, behind the words. */
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-103-316 figure:has(> #dc-103-310) {
    position: absolute !important;
    top: 0 !important;
    right: 0 !important;
    left: auto !important;
    bottom: auto !important;
    width: 64px !important;
    height: 64px !important;
    margin: 0 !important;
    /* 0.3, not 0.4. At 1440 these are #471211 on a dark red photograph - almost subliminal. The
     * brand red at full strength read as two ornaments; at a third it reads as the watermark the
     * design actually draws, while still being visible, which #471211 on this ground is not. */
    opacity: .3 !important;
    z-index: 1 !important;
  }
  /* Opening mark: over the last line, at the left, behind the words. */
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-103-316 figure:has(> #dc-59-1516) {
    position: absolute !important;
    left: -10px !important;
    bottom: 6px !important;
    top: auto !important;
    width: 76px !important;
    height: 76px !important;
    margin: 0 !important;
    opacity: .3 !important;
    z-index: 1 !important;
  }
  /* The words are the top layer. */
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-2501,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-2502 {
    position: relative !important;
    z-index: 3 !important;
  }
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-2502 { padding-left: 0 !important; padding-right: 0 !important; }
}

/* ------------------------------------------------------------------ *
 * 66. LOKACIJA IR VARŽYBŲ PASIEKIAMUMAS - two stacks that were never actually paired.
 *
 * The block is not three rows. It is two columns side by side: one holding three icons, the other
 * holding three label-and-value pairs, each stack spacing itself independently. Measured, the icon
 * stack was 160px tall and the text stack 175 - so by the third row the icon was 15px out from the
 * text it belongs to, and the 48px tiles sat 8px apart, which is what made it read as three boxes
 * touching rather than three rows.
 *
 * Matching the two stacks' rhythms was tried first and is the wrong shape of fix: it makes them
 * agree by arithmetic that any change to the copy breaks. The wrappers are dissolved instead and
 * all nine pieces are placed in a real three-row grid, the same treatment as TIESIOGINIS KONTAKTAS
 * higher up the page. Now an icon is beside its own label because it is in the same grid row, not
 * because two independent stacks happen to add up.
 * ------------------------------------------------------------------ */
@media (max-width: 1439.98px) {
  body.page-id-9 .wp-block-post-content.wp-block-post-content .wp-block-columns:has(> .wp-block-column > figure > #dc-59-1692) {
    display: grid !important;
    grid-template-columns: 48px minmax(0, 1fr) !important;
    grid-template-rows: auto auto var(--dm-3) auto auto var(--dm-3) auto auto !important;
    column-gap: var(--dm-2) !important;
    row-gap: var(--dm-1) !important;
    align-items: start !important;
  }
  body.page-id-9 .wp-block-post-content.wp-block-post-content .wp-block-columns:has(> .wp-block-column > figure > #dc-59-1692) > .wp-block-column,
  body.page-id-9 .wp-block-post-content.wp-block-post-content .wp-block-columns:has(> .wp-block-column > figure > #dc-59-1692) .wp-block-columns,
  body.page-id-9 .wp-block-post-content.wp-block-post-content .wp-block-columns:has(> .wp-block-column > figure > #dc-59-1692) .wp-block-column,
  body.page-id-9 .wp-block-post-content.wp-block-post-content .wp-block-columns:has(> .wp-block-column > figure > #dc-59-1692) .wp-block-group { display: contents !important; }
  body.page-id-9 .wp-block-post-content.wp-block-post-content .wp-block-columns:has(> .wp-block-column > figure > #dc-59-1692) .wp-block-spacer { display: none !important; }
  body.page-id-9 .wp-block-post-content.wp-block-post-content .wp-block-columns:has(> .wp-block-column > figure > #dc-59-1692) figure:has(> #dc-59-1692) { grid-area: 1 / 1 / 3 / 2 !important; align-self: center !important; margin: 0 !important; height: 48px !important; line-height: 0 !important; }
  body.page-id-9 .wp-block-post-content.wp-block-post-content .wp-block-columns:has(> .wp-block-column > figure > #dc-59-1692) #dc-59-1700 { grid-area: 1 / 2 / 2 / 3 !important; margin: 0 !important; }
  body.page-id-9 .wp-block-post-content.wp-block-post-content .wp-block-columns:has(> .wp-block-column > figure > #dc-59-1692) #dc-59-1701 { grid-area: 2 / 2 / 3 / 3 !important; margin: 0 !important; }
  body.page-id-9 .wp-block-post-content.wp-block-post-content .wp-block-columns:has(> .wp-block-column > figure > #dc-59-1692) figure:has(> #dc-59-1702) { grid-area: 4 / 1 / 6 / 2 !important; align-self: center !important; margin: 0 !important; height: 48px !important; line-height: 0 !important; }
  body.page-id-9 .wp-block-post-content.wp-block-post-content .wp-block-columns:has(> .wp-block-column > figure > #dc-59-1692) #dc-59-1714 { grid-area: 4 / 2 / 5 / 3 !important; margin: 0 !important; }
  body.page-id-9 .wp-block-post-content.wp-block-post-content .wp-block-columns:has(> .wp-block-column > figure > #dc-59-1692) #dc-59-1715 { grid-area: 5 / 2 / 6 / 3 !important; margin: 0 !important; }
  body.page-id-9 .wp-block-post-content.wp-block-post-content .wp-block-columns:has(> .wp-block-column > figure > #dc-59-1692) figure:has(> #dc-59-1716) { grid-area: 7 / 1 / 9 / 2 !important; align-self: center !important; margin: 0 !important; height: 48px !important; line-height: 0 !important; }
  body.page-id-9 .wp-block-post-content.wp-block-post-content .wp-block-columns:has(> .wp-block-column > figure > #dc-59-1692) #dc-59-1722 { grid-area: 7 / 2 / 8 / 3 !important; margin: 0 !important; }
  body.page-id-9 .wp-block-post-content.wp-block-post-content .wp-block-columns:has(> .wp-block-column > figure > #dc-59-1692) #dc-59-1723 { grid-area: 8 / 2 / 9 / 3 !important; margin: 0 !important; }
}

/* The social mark's outline was never on the anchor - it is on the FIGURE inside it, which the
 * generator's container pass had picked up as a card: 22x46 with a 1px border and a 10px radius,
 * a tall rounded rectangle around a 20px glyph. Removing the anchor's border twice could not touch
 * it, and neither could a class selector: the figure is reached by a chain rooted on an id, so
 * these are anchored through the mark's own id to get above (1,x,x). The mark is the mark. */
@media (max-width: 1439.98px) {
  .wp-block-post-content.wp-block-post-content .dm-social figure:has(> #dc-103-432),
  .wp-block-post-content.wp-block-post-content .dm-social figure:has(> #dc-105-677),
  .wp-block-post-content.wp-block-post-content .dm-social figure:has(> #dc-105-807),
  .wp-block-post-content.wp-block-post-content .dm-social figure:has(> #dc-103-365),
  .wp-block-post-content.wp-block-post-content .dm-social figure:has(> #dc-59-1923),
  .wp-block-post-content.wp-block-post-content .dm-social figure:has(> #dc-105-593),
  .wp-block-post-content.wp-block-post-content .dm-social figure:has(> #dc-103-441),
  .wp-block-post-content.wp-block-post-content .dm-social figure:has(> #dc-105-686),
  .wp-block-post-content.wp-block-post-content .dm-social figure:has(> #dc-105-816),
  .wp-block-post-content.wp-block-post-content .dm-social figure:has(> #dc-103-374),
  .wp-block-post-content.wp-block-post-content .dm-social figure:has(> #dc-59-1932),
  .wp-block-post-content.wp-block-post-content .dm-social figure:has(> #dc-105-602),
  .wp-block-post-content.wp-block-post-content .dm-social figure:has(> #dc-103-448),
  .wp-block-post-content.wp-block-post-content .dm-social figure:has(> #dc-105-693),
  .wp-block-post-content.wp-block-post-content .dm-social figure:has(> #dc-105-823),
  .wp-block-post-content.wp-block-post-content .dm-social figure:has(> #dc-103-381),
  .wp-block-post-content.wp-block-post-content .dm-social figure:has(> #dc-59-1939),
  .wp-block-post-content.wp-block-post-content .dm-social figure:has(> #dc-105-609),
  .wp-block-post-content.wp-block-post-content .dm-social #dc-103-432,
  .wp-block-post-content.wp-block-post-content .dm-social #dc-105-677,
  .wp-block-post-content.wp-block-post-content .dm-social #dc-105-807,
  .wp-block-post-content.wp-block-post-content .dm-social #dc-103-365,
  .wp-block-post-content.wp-block-post-content .dm-social #dc-59-1923,
  .wp-block-post-content.wp-block-post-content .dm-social #dc-105-593,
  .wp-block-post-content.wp-block-post-content .dm-social #dc-103-441,
  .wp-block-post-content.wp-block-post-content .dm-social #dc-105-686,
  .wp-block-post-content.wp-block-post-content .dm-social #dc-105-816,
  .wp-block-post-content.wp-block-post-content .dm-social #dc-103-374,
  .wp-block-post-content.wp-block-post-content .dm-social #dc-59-1932,
  .wp-block-post-content.wp-block-post-content .dm-social #dc-105-602,
  .wp-block-post-content.wp-block-post-content .dm-social #dc-103-448,
  .wp-block-post-content.wp-block-post-content .dm-social #dc-105-693,
  .wp-block-post-content.wp-block-post-content .dm-social #dc-105-823,
  .wp-block-post-content.wp-block-post-content .dm-social #dc-103-381,
  .wp-block-post-content.wp-block-post-content .dm-social #dc-59-1939,
  .wp-block-post-content.wp-block-post-content .dm-social #dc-105-609 {
    border: 0 !important;
    border-radius: 0 !important;
    background: none !important;
    width: 22px !important;
    height: 22px !important;
    padding: 0 !important;
    margin: 0 !important;
    line-height: 0 !important;
  }
}

/* ------------------------------------------------------------------ *
 * 67. THE SOCIAL MARKS, for the third time - and this is what was actually drawing the box.
 *
 * The outline was never the anchor's and never mine. It is generated:
 *
 *   body.page-id-4 .wp-block-post-content #dc-103-399 figure.wp-block-image:has(img[width="20"])
 *     { width:44px; height:44px; border:1px solid rgba(255,255,255,.12); border-radius:10px }
 *
 * at (1,4,3) - one id, four classes, three types - so both previous attempts, written on
 * `.dm-social` at (0,2,x) and (1,3,1), matched the right element and lost. What rendered was that
 * 44px tile squeezed to 24x46 by the flex row, around a mark that already draws its own rounded
 * square: a tall outline containing a box containing a glyph.
 *
 * Anchored through the footer's id AND the mark's own, which is two ids against their one. The
 * container goes entirely: an Instagram or a YouTube mark IS a rounded square, and putting a
 * second one behind it is what made the row look wrong from the start.
 * ------------------------------------------------------------------ */
@media (max-width: 1439.98px) {
  body.page-id-4 .wp-block-post-content #dc-103-399 .dm-social figure:has(> #dc-103-432),
  body.page-id-4 .wp-block-post-content #dc-103-399 .dm-social figure:has(> #dc-103-441),
  body.page-id-4 .wp-block-post-content #dc-103-399 .dm-social figure:has(> #dc-103-448),
  body.page-id-5 .wp-block-post-content #dc-105-644 .dm-social figure:has(> #dc-105-677),
  body.page-id-5 .wp-block-post-content #dc-105-644 .dm-social figure:has(> #dc-105-686),
  body.page-id-5 .wp-block-post-content #dc-105-644 .dm-social figure:has(> #dc-105-693),
  body.page-id-6 .wp-block-post-content #dc-105-774 .dm-social figure:has(> #dc-105-807),
  body.page-id-6 .wp-block-post-content #dc-105-774 .dm-social figure:has(> #dc-105-816),
  body.page-id-6 .wp-block-post-content #dc-105-774 .dm-social figure:has(> #dc-105-823),
  body.page-id-7 .wp-block-post-content #dc-103-332 .dm-social figure:has(> #dc-103-365),
  body.page-id-7 .wp-block-post-content #dc-103-332 .dm-social figure:has(> #dc-103-374),
  body.page-id-7 .wp-block-post-content #dc-103-332 .dm-social figure:has(> #dc-103-381),
  body.page-id-8 .wp-block-post-content #dc-59-1903 .dm-social figure:has(> #dc-59-1923),
  body.page-id-8 .wp-block-post-content #dc-59-1903 .dm-social figure:has(> #dc-59-1932),
  body.page-id-8 .wp-block-post-content #dc-59-1903 .dm-social figure:has(> #dc-59-1939),
  body.page-id-9 .wp-block-post-content #dc-105-560 .dm-social figure:has(> #dc-105-593),
  body.page-id-9 .wp-block-post-content #dc-105-560 .dm-social figure:has(> #dc-105-602),
  body.page-id-9 .wp-block-post-content #dc-105-560 .dm-social figure:has(> #dc-105-609) {
    width: 22px !important;
    height: 22px !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: none !important;
    padding: 0 !important;
    margin: 0 !important;
    line-height: 0 !important;
  }
}

/* ------------------------------------------------------------------ *
 * 68. THE PASIEKIMAI HERO STATISTICS - rebuilt, not re-spaced.
 *
 * What was on the screen: four cells that do not read as anything. Each is shrink-to-fit (187, 132,
 * 125 and 174px wide inside two 186px columns), so the second row starts 17px right of the first
 * and the icons do not line up down the page; the icon, the number and the two labels are four
 * loose lines with nothing holding them together; and none of it looks like the STAT CARDS forty
 * pixels further down the same page.
 *
 * An earlier fix here reached exactly one of the four, because I anchored it on #dc-59-1242 - the
 * FIRST cell's group - and the other three have their own ids. That is why this section has been
 * reported three times: the fix was real and it applied to a quarter of the block.
 *
 * Rebuilt as the component this page already has: a bordered card per statistic, the icon inline
 * with its number, the label and the description on their own rows underneath. Every piece is
 * placed explicitly, because the artboard's wrappers are dissolved and auto-placement puts four
 * icons in a row of their own.
 * ------------------------------------------------------------------ */
@media (max-width: 1439.98px) {
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1239 .wp-block-column:has(#dc-59-1259),
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1239 .wp-block-column:has(#dc-59-1271),
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1239 .wp-block-column:has(#dc-59-1287),
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1239 .wp-block-column:has(#dc-59-1318) {
    display: grid !important;
    grid-template-columns: 26px minmax(0, 1fr) !important;
    grid-template-rows: auto auto auto !important;
    column-gap: 10px !important;
    row-gap: 6px !important;
    align-content: start !important;
    width: 100% !important;
    box-sizing: border-box !important;
    padding: var(--dm-2) !important;
    border: 1px solid rgba(255, 255, 255, .10) !important;
    border-radius: 12px !important;
    background: #131417 !important;
  }
  /* The artboard's wrappers, and the vertical rules it drew between the columns. */
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1239 .wp-block-column:has(#dc-59-1259) .wp-block-columns,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1239 .wp-block-column:has(#dc-59-1271) .wp-block-columns,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1239 .wp-block-column:has(#dc-59-1287) .wp-block-columns,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1239 .wp-block-column:has(#dc-59-1318) .wp-block-columns,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1239 .wp-block-column:has(#dc-59-1259) .wp-block-column,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1239 .wp-block-column:has(#dc-59-1271) .wp-block-column,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1239 .wp-block-column:has(#dc-59-1287) .wp-block-column,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1239 .wp-block-column:has(#dc-59-1318) .wp-block-column,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1239 .wp-block-column:has(#dc-59-1259) .wp-block-group,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1239 .wp-block-column:has(#dc-59-1271) .wp-block-group,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1239 .wp-block-column:has(#dc-59-1287) .wp-block-group,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1239 .wp-block-column:has(#dc-59-1318) .wp-block-group {
    display: contents !important;
  }
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1239 .wp-block-column:has(#dc-59-1259) .wp-block-spacer,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1239 .wp-block-column:has(#dc-59-1271) .wp-block-spacer,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1239 .wp-block-column:has(#dc-59-1287) .wp-block-spacer,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1239 .wp-block-column:has(#dc-59-1318) .wp-block-spacer,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1239 figure:has(> #dc-59-1243),
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1239 figure:has(> #dc-59-1263),
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1239 figure:has(> #dc-59-1275) { display: none !important; }
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1239 .wp-block-column:has(#dc-59-1259) figure:has(> #dc-59-1244) { grid-area: 1 / 1 / 2 / 2 !important; align-self: center !important; margin: 0 !important; width: 26px !important; height: 26px !important; line-height: 0 !important; }
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1239 .wp-block-column:has(#dc-59-1259) #dc-59-1244 { width: 26px !important; height: 26px !important; }
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1239 .wp-block-column:has(#dc-59-1259) #dc-59-1260  { grid-area: 1 / 2 / 2 / 3 !important; margin: 0 !important; line-height: 1 !important; align-self: center !important; }
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1239 .wp-block-column:has(#dc-59-1259) #dc-59-1259  { grid-area: 2 / 1 / 3 / 3 !important; margin: 0 !important; }
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1239 .wp-block-column:has(#dc-59-1259) #dc-59-1261 { grid-area: 3 / 1 / 4 / 3 !important; margin: 0 !important; }
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1239 .wp-block-column:has(#dc-59-1271) figure:has(> #dc-59-1264) { grid-area: 1 / 1 / 2 / 2 !important; align-self: center !important; margin: 0 !important; width: 26px !important; height: 26px !important; line-height: 0 !important; }
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1239 .wp-block-column:has(#dc-59-1271) #dc-59-1264 { width: 26px !important; height: 26px !important; }
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1239 .wp-block-column:has(#dc-59-1271) #dc-59-1272  { grid-area: 1 / 2 / 2 / 3 !important; margin: 0 !important; line-height: 1 !important; align-self: center !important; }
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1239 .wp-block-column:has(#dc-59-1271) #dc-59-1271  { grid-area: 2 / 1 / 3 / 3 !important; margin: 0 !important; }
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1239 .wp-block-column:has(#dc-59-1271) #dc-59-1273 { grid-area: 3 / 1 / 4 / 3 !important; margin: 0 !important; }
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1239 .wp-block-column:has(#dc-59-1287) figure:has(> #dc-59-1276) { grid-area: 1 / 1 / 2 / 2 !important; align-self: center !important; margin: 0 !important; width: 26px !important; height: 26px !important; line-height: 0 !important; }
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1239 .wp-block-column:has(#dc-59-1287) #dc-59-1276 { width: 26px !important; height: 26px !important; }
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1239 .wp-block-column:has(#dc-59-1287) #dc-59-1288  { grid-area: 1 / 2 / 2 / 3 !important; margin: 0 !important; line-height: 1 !important; align-self: center !important; }
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1239 .wp-block-column:has(#dc-59-1287) #dc-59-1287  { grid-area: 2 / 1 / 3 / 3 !important; margin: 0 !important; }
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1239 .wp-block-column:has(#dc-59-1287) #dc-59-1289 { grid-area: 3 / 1 / 4 / 3 !important; margin: 0 !important; }
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1239 .wp-block-column:has(#dc-59-1318) figure:has(> #dc-59-1290) { grid-area: 1 / 1 / 2 / 2 !important; align-self: center !important; margin: 0 !important; width: 26px !important; height: 26px !important; line-height: 0 !important; }
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1239 .wp-block-column:has(#dc-59-1318) #dc-59-1290 { width: 26px !important; height: 26px !important; }
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1239 .wp-block-column:has(#dc-59-1318) #dc-59-1319  { grid-area: 1 / 2 / 2 / 3 !important; margin: 0 !important; line-height: 1 !important; align-self: center !important; }
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1239 .wp-block-column:has(#dc-59-1318) #dc-59-1318  { grid-area: 2 / 1 / 3 / 3 !important; margin: 0 !important; }
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1239 .wp-block-column:has(#dc-59-1318) #dc-59-1320 { grid-area: 3 / 1 / 4 / 3 !important; margin: 0 !important; }
  /* Two cards a row, equal height, on the page's own 16px card gap. */
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1239 > .wp-block-columns {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
    gap: var(--dm-2) !important;
    align-items: stretch !important;
  }
}

/* The category and the description were both 12px, weight 400, pure white - three identical lines
 * under a number, so a card read as a number and then some text. The category leads and the
 * description supports it. */
@media (max-width: 1439.98px) {
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1239 #dc-59-1259,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1239 #dc-59-1271,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1239 #dc-59-1287,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1239 #dc-59-1318 {
    font-weight: 700 !important;
    letter-spacing: .09em !important;
    color: #fff !important;
  }
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1239 #dc-59-1261,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1239 #dc-59-1273,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1239 #dc-59-1289,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1239 #dc-59-1320 {
    /* 12px, not 11.5 - the type floor for a tracked label, which the audit caught immediately.
     * The hierarchy comes from weight and colour, not from going under the floor. */
    font-size: 12px !important;
    font-weight: 400 !important;
    letter-spacing: .04em !important;
    color: rgba(255, 255, 255, .55) !important;
    line-height: 1.35 !important;
  }
}

/* ------------------------------------------------------------------ *
 * 69. THE GAP ABOVE THE STAT BLOCK, AND EVERY ICON THAT IS NOT ON ITS NUMBER.
 *
 * Measured, not guessed:
 *
 *   pasiekimai - the photograph ends at 641 and the first card starts at 649. Eight pixels, while
 *   the two rows of cards are 16 apart: the gap AROUND the block is half the gap inside it, which
 *   is the ordering rule exactly backwards and is why the cards look stuck to the picture.
 *
 *   the training cards - the icon is +20px BELOW its number's centre. It spans both rows as a rail
 *   and centres on the CARD, so it lands between the number and the label rather than beside the
 *   number. It reads as a third element floating in the middle.
 *
 *   apie doma - -4px on the first row of statistics and +12px on the second. Two rows, two
 *   different errors, which is what happens when alignment comes out of row heights instead of
 *   being stated.
 *
 * Every icon is now centred on the NUMBER it belongs to, and stays there because it is placed in
 * that number's row rather than across the block.
 * ------------------------------------------------------------------ */
@media (max-width: 1439.98px) {
  /* 32px between the photograph and the cards, against 16 between the card rows. */
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1239 { margin-top: var(--dm-4) !important; }

  /* The training-card icon sits on its number's row, not across the card. */
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1335 figure:has(> #dc-59-1338),
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1348 figure:has(> #dc-59-1351),
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1359 figure:has(> #dc-59-1362),
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1374 figure:has(> #dc-59-1377) {
    grid-area: 1 / 1 / 2 / 2 !important;
    align-self: center !important;
  }

  /* apie doma: the icon and its number share a row and are both centred in it. */
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1795 > .wp-block-columns > .wp-block-column:has(#dc-59-1798),
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1795 > .wp-block-columns > .wp-block-column:has(#dc-59-1812),
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1795 > .wp-block-columns > .wp-block-column:has(#dc-59-1822),
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1795 > .wp-block-columns > .wp-block-column:has(#dc-59-1840) {
    align-self: center !important;
    display: flex !important;
    align-items: center !important;
  }
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1795 figure:has(> #dc-59-1798),
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1795 figure:has(> #dc-59-1812),
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1795 figure:has(> #dc-59-1822),
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1795 figure:has(> #dc-59-1840) {
    margin: 0 !important;
    line-height: 0 !important;
  }
}

/* The apie numbers still carried `margin-top: 8px` from an earlier round, when they were stacked
 * under their icons and needed the space. Now that the icon is BESIDE the number, that margin sits
 * inside the number's cell and pushes the digits down within it - so the two cells centre on each
 * other correctly while the ink does not, by -4px on the first row and +12 on the second. */
@media (max-width: 1439.98px) {
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1809,
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1819,
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1837,
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1851 {
    margin: 0 !important;
    line-height: 1 !important;
  }
}

/* Row 5's icon column carries `margin-top: 32px` from a GENERATED rhythm rule -
 * `#dc-59-1795 > :nth-child(3) > :nth-child(6)` - which is why the second row of statistics had
 * its icon 32px below its own number while the first row was exact. Nothing about align-self could
 * reach it; the offset is a margin, not an alignment. Zeroed on all four so the two rows agree.
 */
@media (max-width: 1439.98px) {
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1795 > .wp-block-columns > .wp-block-column:has(#dc-59-1798),
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1795 > .wp-block-columns > .wp-block-column:has(#dc-59-1812),
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1795 > .wp-block-columns > .wp-block-column:has(#dc-59-1822),
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1795 > .wp-block-columns > .wp-block-column:has(#dc-59-1840),
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1795 > .wp-block-columns > .wp-block-column:has(#dc-59-1809),
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1795 > .wp-block-columns > .wp-block-column:has(#dc-59-1819),
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1795 > .wp-block-columns > .wp-block-column:has(#dc-59-1837),
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1795 > .wp-block-columns > .wp-block-column:has(#dc-59-1851) {
    margin: 0 !important;
    align-self: center !important;
  }
}

/* The stat text column was 105px at 390 - a 26px icon rail, a 24px spacer column and four 16px
 * gaps take 88px out of a 350px column before any text gets any. "APDOVANOJIMŲ" is 110px wide, so
 * it could not fit however the wrapping behaved. The spacer drops to 8 and the gaps to 10, which
 * gives each label 125px and room for its longest word. */
@media (max-width: 1439.98px) {
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1795 {
    grid-template-columns: 26px minmax(0, 1fr) var(--dm-1) 26px minmax(0, 1fr) !important;
    column-gap: 10px !important;
  }
}

/* ------------------------------------------------------------------ *
 * 70. WORDS DO NOT BREAK IN THE MIDDLE.
 *
 * Core ships `.wp-block-column { overflow-wrap: break-word; word-break: break-word }`, and both
 * properties INHERIT - so every paragraph in every column on this site had permission to split an
 * ordinary word wherever it ran out of room. In Lithuanian, with long words and narrow columns,
 * that is not a fallback, it is a defect: "APDOVANOJIMŲ" rendered as "APDOVANOJIM" with a lone "Ų"
 * on the next line at 390, and "BENDRADARBIAVIMO UŽKLAUSA" as "BENDRADARBIAVIM / O UŽKLAUSA"
 * earlier - which was patched one heading at a time instead of at the cause.
 *
 * Reset for the whole flow band. The one thing that genuinely has no break opportunity - an email
 * address - keeps `overflow-wrap: anywhere` on its own link, so "info@domasbutkus.lt" still wraps
 * inside a narrow footer column rather than pushing it open.
 * ------------------------------------------------------------------ */
@media (max-width: 1439.98px) {
  .wp-block-post-content.wp-block-post-content .wp-block-column,
  .wp-block-post-content.wp-block-post-content .wp-block-column p,
  .wp-block-post-content.wp-block-post-content .wp-block-column h1,
  .wp-block-post-content.wp-block-post-content .wp-block-column h2,
  .wp-block-post-content.wp-block-post-content .wp-block-column h3 {
    overflow-wrap: normal;
    word-break: normal;
  }
  .wp-block-post-content.wp-block-post-content .dm-contactlink,
  .wp-block-post-content.wp-block-post-content .dm-contactlink *,
  .wp-block-post-content.wp-block-post-content a[href^="mailto"],
  .wp-block-post-content.wp-block-post-content a[href^="tel"] {
    overflow-wrap: anywhere;
    word-break: normal;
  }
}

/* With mid-word breaking gone, the longest label has to actually fit its column: "APDOVANOJIMŲ" is
 * 130px at 13px with .1em of tracking, in a 125px column. The tracking is what does not fit. */
@media (max-width: 479.98px) {
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1795 p { letter-spacing: .02em !important; }
}


/* ------------------------------------------------------------------ *
 * 71. APIE DOMĄ's STATISTICS, AS THE SAME CARD AS PASIEKIMAI'S.
 *
 * Same component and the same values as section 68 - #131417, a 10%-white hairline, a 12px radius,
 * 16px of padding, the icon beside its number. Copied, not re-invented.
 *
 * The SELECTOR could not be copied, because this block has no per-stat container: its icons are
 * all in one `.wp-block-columns`, its numbers in another and its labels in a third, so no element
 * wraps one statistic. Rather than rewrite the markup, the icon's own column is spanned across its
 * stat's rows and becomes the card, the icon is taken out of flow inside it, and the number and
 * the label are laid over the same area with the card's padding written on them. Grid items may
 * overlap, which is what makes this possible without touching the DOM.
 *
 * TWO ROWS PER STAT, not three: the two label lines share ONE column, so placing them as separate
 * grid areas had both rules fighting over the same element and the second one won - the card came
 * out 106px tall around 137px of content. The label column is placed once and the two lines are
 * styled inside it.
 * ------------------------------------------------------------------ */
@media (max-width: 1439.98px) {
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1795 {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
    grid-template-rows: auto auto var(--dm-2) auto auto !important;
    column-gap: var(--dm-2) !important;
    row-gap: 0 !important;
  }
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1795 > .wp-block-columns > .wp-block-column:has(#dc-59-1798) { grid-area: 1 / 1 / 3 / 2 !important; position: relative !important; margin: 0 !important; align-self: stretch !important; justify-self: stretch !important; width: 100% !important; max-width: none !important; display: block !important; border: 1px solid rgba(255, 255, 255, .10) !important; border-radius: 12px !important; background: #131417 !important; box-sizing: border-box !important; }
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1795 figure:has(> #dc-59-1798) { position: absolute !important; left: var(--dm-2) !important; top: var(--dm-2) !important; height: 29px !important; width: 26px !important; display: flex !important; align-items: center !important; margin: 0 !important; }
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1795 > .wp-block-columns > .wp-block-column:has(#dc-59-1809) { grid-area: 1 / 1 / 2 / 2 !important; padding: var(--dm-2) var(--dm-2) 0 52px !important; z-index: 1 !important; margin: 0 !important; align-self: start !important; justify-self: stretch !important; width: 100% !important; box-sizing: border-box !important; }
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1795 > .wp-block-columns > .wp-block-column:has(#dc-59-1810)  { grid-area: 2 / 1 / 3 / 2 !important; padding: 6px var(--dm-2) var(--dm-2) var(--dm-2) !important; z-index: 1 !important; margin: 0 !important; align-self: start !important; justify-self: stretch !important; width: 100% !important; box-sizing: border-box !important; }
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1795 > .wp-block-columns > .wp-block-column:has(#dc-59-1812) { grid-area: 1 / 2 / 3 / 3 !important; position: relative !important; margin: 0 !important; align-self: stretch !important; justify-self: stretch !important; width: 100% !important; max-width: none !important; display: block !important; border: 1px solid rgba(255, 255, 255, .10) !important; border-radius: 12px !important; background: #131417 !important; box-sizing: border-box !important; }
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1795 figure:has(> #dc-59-1812) { position: absolute !important; left: var(--dm-2) !important; top: var(--dm-2) !important; height: 29px !important; width: 26px !important; display: flex !important; align-items: center !important; margin: 0 !important; }
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1795 > .wp-block-columns > .wp-block-column:has(#dc-59-1819) { grid-area: 1 / 2 / 2 / 3 !important; padding: var(--dm-2) var(--dm-2) 0 52px !important; z-index: 1 !important; margin: 0 !important; align-self: start !important; justify-self: stretch !important; width: 100% !important; box-sizing: border-box !important; }
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1795 > .wp-block-columns > .wp-block-column:has(#dc-59-1820)  { grid-area: 2 / 2 / 3 / 3 !important; padding: 6px var(--dm-2) var(--dm-2) var(--dm-2) !important; z-index: 1 !important; margin: 0 !important; align-self: start !important; justify-self: stretch !important; width: 100% !important; box-sizing: border-box !important; }
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1795 > .wp-block-columns > .wp-block-column:has(#dc-59-1822) { grid-area: 4 / 1 / 6 / 2 !important; position: relative !important; margin: 0 !important; align-self: stretch !important; justify-self: stretch !important; width: 100% !important; max-width: none !important; display: block !important; border: 1px solid rgba(255, 255, 255, .10) !important; border-radius: 12px !important; background: #131417 !important; box-sizing: border-box !important; }
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1795 figure:has(> #dc-59-1822) { position: absolute !important; left: var(--dm-2) !important; top: var(--dm-2) !important; height: 29px !important; width: 26px !important; display: flex !important; align-items: center !important; margin: 0 !important; }
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1795 > .wp-block-columns > .wp-block-column:has(#dc-59-1837) { grid-area: 4 / 1 / 5 / 2 !important; padding: var(--dm-2) var(--dm-2) 0 52px !important; z-index: 1 !important; margin: 0 !important; align-self: start !important; justify-self: stretch !important; width: 100% !important; box-sizing: border-box !important; }
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1795 > .wp-block-columns > .wp-block-column:has(#dc-59-1838)  { grid-area: 5 / 1 / 6 / 2 !important; padding: 6px var(--dm-2) var(--dm-2) var(--dm-2) !important; z-index: 1 !important; margin: 0 !important; align-self: start !important; justify-self: stretch !important; width: 100% !important; box-sizing: border-box !important; }
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1795 > .wp-block-columns > .wp-block-column:has(#dc-59-1840) { grid-area: 4 / 2 / 6 / 3 !important; position: relative !important; margin: 0 !important; align-self: stretch !important; justify-self: stretch !important; width: 100% !important; max-width: none !important; display: block !important; border: 1px solid rgba(255, 255, 255, .10) !important; border-radius: 12px !important; background: #131417 !important; box-sizing: border-box !important; }
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1795 figure:has(> #dc-59-1840) { position: absolute !important; left: var(--dm-2) !important; top: var(--dm-2) !important; height: 29px !important; width: 26px !important; display: flex !important; align-items: center !important; margin: 0 !important; }
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1795 > .wp-block-columns > .wp-block-column:has(#dc-59-1851) { grid-area: 4 / 2 / 5 / 3 !important; padding: var(--dm-2) var(--dm-2) 0 52px !important; z-index: 1 !important; margin: 0 !important; align-self: start !important; justify-self: stretch !important; width: 100% !important; box-sizing: border-box !important; }
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1795 > .wp-block-columns > .wp-block-column:has(#dc-59-1852)  { grid-area: 5 / 2 / 6 / 3 !important; padding: 6px var(--dm-2) var(--dm-2) var(--dm-2) !important; z-index: 1 !important; margin: 0 !important; align-self: start !important; justify-self: stretch !important; width: 100% !important; box-sizing: border-box !important; }
  /* The type, matching section 68: the category leads, the second line supports it. */
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1795 #dc-59-1810,
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1795 #dc-59-1820,
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1795 #dc-59-1838,
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1795 #dc-59-1852 {
    font-weight: 700 !important;
    letter-spacing: .09em !important;
    color: #fff !important;
    margin: 0 !important;
  }
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1795 #dc-59-1811,
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1795 #dc-59-1821,
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1795 #dc-59-1839,
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-59-1795 #dc-59-1853 {
    font-weight: 400 !important;
    letter-spacing: .04em !important;
    color: rgba(255, 255, 255, .55) !important;
    margin: 0 !important;
  }
}

/* ------------------------------------------------------------------ *
 * 72. HOME / KONTAKTAI - the photograph is off its own centre, and the block ends in a void.
 *
 * THE PHOTOGRAPH. Measured at 390 with deviceScaleFactor 2: the rider-and-bike silhouette spans
 * raw x 157..678 of a 780px capture, so there is 78.5 CSS px of black to the left of the front
 * wheel and 50.5 to the right of the rear one. Half that difference, 14px, is the amount the
 * picture reads as pushed right - and it is baked into the asset, not into the layout. The figure
 * renders 350x323, the source is 1132x1046, and 566/523 == 350/323: the box IS the image's aspect
 * ratio, so `object-fit: cover` has no overflow to pan into and `object-position` does nothing.
 * There is no CSS fix. `tools/recentre-97-1014.py` slides the content 45 source px (= 14 CSS px)
 * left inside an unchanged canvas and refills the vacated strip from the source's own right edge,
 * which measures RGB 2,2,2 - black onto black. Served below 1440 by DOMAS_FLOW_ASSETS, so the
 * pixel-exact 1440 baseline keeps the shipped file. Nothing here needs a rule.
 *
 * THE PAIR GAP. The signed-off 1440 design sets each contact mark 12px from its label - measured
 * on the running page, the three pairs sit at x 64/83.9, 356.9/376.8 and 573.1/593. The generator
 * emits that 12px (grid.css:108) and then three later gutter passes overwrite it with a generic
 * 8px (787, 1082, 1414), so the phone lost a value the design had actually specified. Stated once
 * here, at two ids, because a generated per-id rule outranks anything with only classes.
 *
 * The row gap stays at 8, which puts the rows 29px apart against the paragraph's 23px line. That
 * is deliberate and it is the one number in this block that is NOT the text rhythm: each row is a
 * link whose hit area is a `inset: -12px 0` pseudo-element (section 57), so a 21px line carries a
 * 45px target. At a 29px pitch neighbouring targets already overlap by 16px and the row below
 * claims the bottom 4px of the line above. Closing the rows to the paragraph's 23px would take
 * that to 22px of overlap - half of every line would open the wrong link.
 *
 * THE VOID BELOW. Ink to ink, the last contact line sat 90px above the footer's logo. 10 of that
 * is an 8px spacer and a 350x1 rule drawn at `opacity: .05` - white at five percent on a near-black
 * band, which is not a hairline anyone can see. Both go.
 *
 * The other 80 is this section's 40px of bottom padding meeting the footer's own 40 above its logo,
 * and 80 is more than the DESIGN spends here: at 1440 the same join measures 70px ink to ink, on a
 * canvas three and a half times wider. Two full section paddings meeting at the footer is the
 * double-gap - the footer is a terminal band with its own padding and its own colour, not a peer
 * section that needs an equal share of the join. The bottom padding goes to 16 and the join lands
 * at 56.
 *
 * Scoped to this page on purpose. The six pages' footer joins measure 80, 89, 71, 40, 80, 80 at
 * 390 - there is no single value here to keep faith with, because the last section on each page
 * ends with something different. Unifying them is a decision about all six, not a fix to this one.
 * ------------------------------------------------------------------ */
@media (max-width: 1439.98px) {
  body.page-id-4 .wp-block-post-content.wp-block-post-content #dc-59-2240 > .wp-block-columns {
    column-gap: 12px !important;
    row-gap: var(--dm-1) !important;
  }
  body.page-id-4 .wp-block-post-content.wp-block-post-content #dc-59-2240 > .wp-block-spacer,
  body.page-id-4 .wp-block-post-content.wp-block-post-content #dc-59-2240 > figure.wp-block-image {
    display: none !important;
  }
  body.page-id-4 .wp-block-post-content.wp-block-post-content #dc-59-2233 {
    padding-bottom: var(--dm-2) !important;
  }
}

/* ------------------------------------------------------------------ *
 * 73. THE FORM'S CONSENT LINE.
 *
 * The client asked for a statement rather than a checkbox (2026-09-07): the form already marks all
 * four fields required, and a tick box is one more thing standing between a visitor and a message.
 * The markup is in functions.php, under the submit control - the point at which the consent is
 * actually being given.
 *
 * It is set as fine print and not as another field: 12px, which is this build's type floor, at 55%
 * white on the card's #131417, which measures 7.4:1.
 *
 * Below 1440 it follows the button in flow, 16px under it and capped at 46 characters so it breaks
 * into short lines rather than running the width of the card. At 1440 every block in the design is
 * absolutely positioned, so it is placed against the card instead: the button ends 47px above the
 * card's bottom edge and the sentence fits on one 640px line inside the card's 899px of usable
 * width, so it takes that empty band - 12px under the button, 17px off the card's floor.
 * ------------------------------------------------------------------ */
.wp-block-post-content.wp-block-post-content .dm-form__consent {
  margin: var(--dm-2) 0 0 !important;
  font-family: "Montserrat", sans-serif !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  line-height: 18px !important;
  letter-spacing: .02em !important;
  color: rgba(255, 255, 255, .55) !important;
}
@media (max-width: 1439.98px) {
  .wp-block-post-content.wp-block-post-content .dm-form__consent { max-width: 46ch !important; }
}
@media (min-width: 1440px) {
  /* THE BOX IS POSITIONED, NOT THE SENTENCE. The result notice shares this footing now, and it has
   * to stack above the consent line rather than beside it - so the offsets move to the wrapper and
   * the two simply follow each other inside it, growing upward from the card's bottom edge. */
  .wp-block-post-content.wp-block-post-content .dm-form__foot {
    position: absolute !important;
    left: 52px !important;
    right: 52px !important;
    bottom: 17px !important;
    margin: 0 !important;
  }
  .wp-block-post-content.wp-block-post-content .dm-form__consent { margin: 0 !important; }
}
/* Below 1440 the pair is in flow; the notice keeps the button off the consent line. */
/*
 * THE RESULT IS A LINE, NOT A PANEL.
 *
 * It was a padded, rounded, coloured box - 43px tall plus a 16px margin. It takes the consent
 * line's place in `.dm-form__foot`, and at 1440 that slot is 18px: the card is a fixed 822px and
 * holds exactly one line, 17px off its bottom edge. The panel grew upward THROUGH the submit
 * button, overlapping it by 30px at 1440 and 1920.
 *
 * So it is the consent line's own typography in the consent line's own place, coloured green or
 * red. It fits the artboard, it needs no space the design does not have, and it appears exactly
 * where the reader was already looking - because it is what the sentence there turned into.
 */
.wp-block-post-content.wp-block-post-content .dm-form__note {
  /* The same top margin the consent line carries, so the gap under the button does not change
   * depending on which of the two is showing - 8px against 16 is the kind of shift you see. */
  margin: var(--dm-2) 0 0 !important;
  padding: 0 !important;
  border-radius: 0 !important;
  background: none !important;
  font-family: "Montserrat", sans-serif !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  line-height: 18px !important;
  letter-spacing: .02em !important;
}
.wp-block-post-content.wp-block-post-content .dm-form__note--ok { color: #7fd39a !important; }
.wp-block-post-content.wp-block-post-content .dm-form__note--err { color: #ff8f8a !important; }
/*
 * AFTER the rule above, not up in section 73's 1440 block. A media query adds no specificity, so
 * the two `margin` declarations are equal and SOURCE ORDER decides - the reset was written first
 * and lost, which put a 16px top margin on an element positioned from its bottom edge and pushed
 * it 5px back through the button. The fix was not the value; it was where the rule sits.
 */
@media (min-width: 1440px) {
  .wp-block-post-content.wp-block-post-content .dm-form__note { margin: 0 !important; }
}

/* ------------------------------------------------------------------ *
 * 74. THE GALLERY FILTER, NOW THAT IT FILTERS.
 *
 * Section 27 rebuilt the four words as a snap rail of pills and said plainly that they still could
 * not filter, because they were <p> elements and the tiles carried no category. Both are fixed:
 * functions.php puts `data-dm-filter` on the chips and `data-dm-cat` on the eight tiles, and
 * assets/gallery.js moves one class. What is left for CSS is the selected state, the off state,
 * and making a paragraph that behaves like a button look like one.
 *
 * TWO OFF STATES, AND THE REASON IS THE LAYOUT AND NOT A PREFERENCE. Below 1024 the tiles are
 * auto-placed cells in the page's own two-column grid, so `display: none` lets the rest repack and
 * the section closes up - real filtering. At 1440 there is no grid to repack: the generator places
 * each tile absolutely as a mosaic of six different sizes with no shared container, so hiding one
 * would leave a hole in the composition; and at 1280 the tiles are cells in the PAGE grid, where
 * removing one drags every section below it upwards. Above 1024 the filter therefore de-emphasises
 * rather than removes, which is what a fixed mosaic can honestly do.
 *
 * The selected state is stated at every width, not inside a width query - the mistake section 52
 * was written to correct. At 1440 the artboard paints MOTOKROSAS #dc2626 and the rest #d6d6d7; on
 * load no filter is applied any more, so that red now follows the choice instead of being baked
 * into the first chip.
 * ------------------------------------------------------------------ */
.wp-block-post-content.wp-block-post-content [data-dm-filter] {
  cursor: pointer !important;
  -webkit-user-select: none !important;
  user-select: none !important;
}
.wp-block-post-content.wp-block-post-content [data-dm-filter]:focus-visible {
  outline: 2px solid #e22f2d !important;
  outline-offset: 3px !important;
}
@media (min-width: 1024px) {
  .wp-block-post-content.wp-block-post-content [data-dm-filter] { color: #d6d6d7 !important; }
  .wp-block-post-content.wp-block-post-content [data-dm-filter][aria-pressed="true"] { color: #e22f2d !important; }
}
.wp-block-post-content.wp-block-post-content [data-dm-cat].dm-gal-off { display: none !important; }

/*
 * SUPERSEDED 2026-09-08: above 1024 the non-matching tiles used to be dimmed to 14% and greyed,
 * because the desktop mosaic has no container to reflow. The client's verdict on seeing it was the
 * right one - five ghost rectangles read as broken images, not as a filter. They are removed at
 * every width now, and section 78 gives the desktop something that can actually close up.
 */

/* ------------------------------------------------------------------ *
 * 78. THE DESKTOP GALLERY REFLOWS WHEN IT IS FILTERED.
 *
 * gallery.js wraps the eight tiles - they are contiguous siblings, so the DOM order is preserved -
 * in a `.dm-galgrid`. It is `display: contents` while nothing is chosen, which generates no box at
 * all: the mosaic renders exactly as designed and the 1440 baseline does not move by a pixel.
 *
 * Choosing a category turns the wrapper into a real grid, and there are two of those because the
 * page underneath is built two different ways.
 *
 * Between 1024 and 1439 the tiles are cells in the PAGE grid, mixed in with every other section.
 * The wrapper spans the full width there and stays in flow, so the grid shortens and everything
 * below it moves up - the page genuinely gets shorter, which is what filtering should do.
 *
 * At 1440 and above nothing can move: every block on the page is absolutely positioned, so a
 * shorter gallery would leave its own height behind as a hole. The wrapper is placed over the
 * mosaic's measured footprint instead and FILLS it - rows divide the height rather than stacking
 * from the top - so three photographs become three large ones rather than three small ones above a
 * thousand pixels of black. Two columns, and an odd last tile spans both, so there is never a gap
 * in the grid either.
 * ------------------------------------------------------------------ */
.wp-block-post-content.wp-block-post-content .dm-galgrid { display: contents; }

@media (min-width: 1024px) {
  .wp-block-post-content.wp-block-post-content .dm-galgrid.is-filtering {
    display: grid !important;
    grid-column: 1 / -1 !important;
    grid-template-columns: repeat(var(--dm-gal-cols, 2), minmax(0, 1fr)) !important;
    gap: 16px !important;
    margin: 0 !important;
  }
  /* In flow (1024-1439): the cells carry their own aspect and the page shortens with them. */
  .wp-block-post-content.wp-block-post-content .dm-galgrid.is-filtering > [data-dm-cat] {
    position: static !important;
    left: auto !important;
    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    width: auto !important;
    height: auto !important;
    min-height: 0 !important;
    max-width: none !important;
    aspect-ratio: 4 / 3 !important;
    margin: 0 !important;
    grid-column: auto !important;
    grid-row: auto !important;
    border-radius: 16px !important;
    background-size: cover !important;
    background-position: center !important;
  }
  .wp-block-post-content.wp-block-post-content .dm-galgrid.is-filtering > .dm-gal-last {
    grid-column: 1 / -1 !important;
  }
  /* Over the mosaic (1440+): the footprint is fixed, so the rows share its height instead. */
  .wp-block-post-content.wp-block-post-content .dm-galgrid.is-overlay {
    position: absolute !important;
    z-index: 6 !important;
    grid-auto-rows: minmax(0, 1fr) !important;
  }
  .wp-block-post-content.wp-block-post-content .dm-galgrid.is-overlay > [data-dm-cat] {
    aspect-ratio: auto !important;
    height: 100% !important;
  }
}
/* The tiles are background images with no text, so a filter change is silent without this. It is
 * announced, never seen - the visible answer is the grid itself. */
.wp-block-post-content.wp-block-post-content .dm-gal-status {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  margin: -1px !important;
  padding: 0 !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  clip-path: inset(50%) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/* ------------------------------------------------------------------ *
 * 75. THE BUTTONS AT 1440, WHICH HAD NO CONTRACT AT ALL.
 *
 * Section 23 states the button - type, gap, the label and arrow centred as one group - inside
 * `@media (max-width: 1439.98px)`. Above that there was nothing, so the desktop got the browser's
 * defaults: Montserrat 400 at 16px where the artboard draws bold 13. The operator screenshotted the
 * footer button; measured against the Figma reference the label is 81px of ink where the design is
 * 71, and it leaves 6px to the arrow where the design leaves 18. That is what "the arrow is stuck
 * to the text" is. The same fault, worse, on the contact form's submit control: the design centres
 * "SIŲSTI UŽKLAUSĄ" and its arrow together in a 901px bar, and the build put the label hard left in
 * a light weight with the arrow marooned 345px away in the middle.
 *
 * This is the third component this month whose only styling sat behind a width query - after the
 * footer navigation (section 52) and the gallery chips (74). The rule stands: a media query may
 * hold what CHANGES with width. What a component needs in order to BE itself does not go inside one.
 *
 * THE ARROW IS ABSOLUTELY POSITIONED, which is why the gap could not be tuned. The generator pins
 * each icon to its artboard coordinate - `#dc-103-455{position:absolute;left:115px}` - so the
 * button's own `gap:0.5em` never applied to it and the label simply grew underneath it. Released
 * here into the flex row where it belongs. Each id is named because the generated rule is (1,2,1)
 * and no class selector can reach it.
 *
 * 13px/700/.04em was measured, not chosen: it renders the label at 85.4px against the artboard's
 * 85, and it is the same label spec the footer navigation and the filter chips already use.
 * ------------------------------------------------------------------ */
@media (min-width: 1440px) {
  body.page-id-4 .wp-block-post-content.wp-block-post-content #dc-103-453,
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-105-698,
  body.page-id-6 .wp-block-post-content.wp-block-post-content #dc-105-828,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1326,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-103-386,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-59-2114,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-59-2129,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-59-1944,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-105-628,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-59-1603,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-105-614 {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 10px !important;
    font-family: "Montserrat", sans-serif !important;
    font-weight: 700 !important;
    font-size: 13px !important;
    letter-spacing: .04em !important;
    line-height: 1.15 !important;
    text-align: center !important;
  }
  /* The arrows, off the artboard coordinate and back into the row. */
  body.page-id-4 .wp-block-post-content.wp-block-post-content #dc-103-455,
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-105-700,
  body.page-id-6 .wp-block-post-content.wp-block-post-content #dc-105-830,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1327,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-103-388,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-59-2115,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-59-2130,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-59-1945,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-105-630,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-59-1604,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-105-616 {
    position: static !important;
    left: auto !important;
    top: auto !important;
    flex: 0 0 auto !important;
    margin: 0 !important;
  }
}

/* ------------------------------------------------------------------ *
 * 76. A CTA THAT POINTS AT THE PAGE IT IS ON.
 *
 * Three controls linked to the page the visitor was already reading: "BENDRADARBIAUKIME" and the
 * footer's "KALBĖKIME" on the contact page, both of which reloaded it and moved nothing. They are
 * asking for the enquiry form, so functions.php now sends them to it by anchor. This is the part
 * CSS owns: the jump has to land somewhere readable rather than under the sticky header.
 *
 * `scroll-behavior: smooth` was added here and REMOVED the same hour. It broke every measurement
 * tool in this repo at once: they all force lazy images in by scrolling the page to its end and
 * waiting, and a smooth root turns that jump into an animation that had not finished when the
 * measurement ran. `mobile-audit` promptly reported a 568px void on partnerystes, then 593px on
 * the next run, then none - a page it had passed cleanly for weeks. A property that makes the
 * build's own instruments report different numbers on identical input is not worth a nicety.
 * ------------------------------------------------------------------ */
.wp-block-post-content.wp-block-post-content #dc-59-1589 { scroll-margin-top: 24px !important; }
@media (max-width: 1439.98px) {
  /* The mobile header is 71px and sticky; 88 clears it with the gutter's own 16 under it. */
  .wp-block-post-content.wp-block-post-content #dc-59-1589 { scroll-margin-top: 88px !important; }
}

/* ------------------------------------------------------------------ *
 * 79. THE TABLET BAND.
 *
 * The site had two designs in it and no third: a phone layout that the judgement layer stopped
 * tuning at 1023.98, and the artboard, which is only true at 1440. Everything between was the
 * generator's raw reflow with nothing on top - so 1024 to 1439 was a squeezed desktop rather than
 * a large tablet, and it showed: the header's five labels wrapped onto a second line that printed
 * through the H1 on two pages, "PARTNERYSTĖS" lost its last letter off the right edge, the
 * partnership cards' body ran out through their own borders, and a paragraph on partnerystes set
 * 151 characters to the line.
 *
 * The fix is structural rather than a list of patches: the judgement layer's ceiling moved from
 * 1023.98 to 1439.98, so the system that was already tuned now covers the whole reflow band, and
 * this section adds what only matters once there is real width to spend.
 *
 * THE HEADER GOES WITH IT. The drawer covers everything below 1440 now, because the artboard's
 * inline header only fits at the width it was drawn for - see assets/nav.js.
 *
 * MEASURE. Running text is capped at 68 characters. Nothing else changes: at 768 no paragraph was
 * over 85 to the line, at 1024 three were, and at 1280 four - the worst of them 151, which is two
 * and a half times a readable line and the single loudest "this was never laid out" signal on the
 * page. Headings, labels and anything inside a card are left alone; they are short by nature and a
 * cap on them would only introduce ragged wrapping where there is none.
 * ------------------------------------------------------------------ */
@media (min-width: 768px) and (max-width: 1439.98px) {
  body .wp-block-post-content.wp-block-post-content p:not([class*="dm-"]):not(.dm-form__consent) {
    max-width: 68ch !important;
  }
}

/* ------------------------------------------------------------------ *
 * 80. THE QUOTE BAND'S ARTWORK IS ONLY WHOLE AT ITS OWN ASPECT.
 *
 * `59-1514.webp` is 2880x900 - exactly 3.2:1, which is exactly the 1440x450 band it was drawn for.
 * The word "KIEKVIENA PERGALĖ PRASIDEDA" is set into the artwork as a watermark that runs off the
 * left edge on purpose. At 1440 you read most of it and it works. At 1024 the band keeps its 450px
 * height, so `object-fit: cover` crops 29% off the sides and the watermark arrives as "GALĖ
 * PRASIDEDA" - a fragment of a word, which reads as a rendering failure rather than as a flourish.
 *
 * Nothing is wrong with the asset and nothing needs repositioning: the band just has to keep the
 * artwork's aspect while it is narrower than the artboard. 3.2 gives 320px at 1024 and 240 at 768,
 * and the type inside needs 110 - so it fits with room, and the composition is never cut.
 *
 * Checked against the mobile band on purpose: below 768 the band stays as it was. There the source
 * is nearly four times wider than the box, and honouring the aspect would leave a 120px letterbox
 * of photograph with 200px of text on top of it.
 * ------------------------------------------------------------------ */
@media (min-width: 768px) and (max-width: 1439.98px) {
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1514 {
    min-height: 0 !important;
    height: auto !important;
    aspect-ratio: 3.2 / 1 !important;
  }
}

/* ------------------------------------------------------------------ *
 * 81. THE ENQUIRY FORM IS A FORM, NOT A BAND.
 *
 * The card is the <form> itself (functions.php wraps the section), so it took the whole content
 * column: 716px-wide inputs at 768, 972 at 1024 and 1,228 at 1280. A single-line text field a
 * metre wide is the clearest "nobody laid this out" signal a page can give - the eye has to travel
 * the full width to find a caret that will never go past the first fifth of it, and `mobile-audit`
 * flagged it at 1280 as a band that paints but does not reach either edge, which is exactly what it
 * had become.
 *
 * Capped at 720, which holds the longest label and the four-option select without wrapping, and
 * left on the rail rather than centred - the page's rule everywhere below 1440.
 * ------------------------------------------------------------------ */
@media (min-width: 768px) and (max-width: 1439.98px) {
  body.page-id-9 .wp-block-post-content.wp-block-post-content form.dm-form {
    max-width: 720px !important;
    /* Centred, not left on the rail. Measured off-centre by 74px at 768 and 202 at 1024, which on
     * a page whose other blocks span the full column reads as the form having slipped. */
    margin-left: auto !important;
    margin-right: auto !important;
    /* `width: 100%` because `.entry-content` is a COLUMN FLEX CONTAINER, and an auto margin on the
     * cross axis turns stretch off. The two lines above therefore centred the card and silently
     * shrank it from the 720 cap to its 556px content width - 164px narrower than intended, at
     * every width in the band, for as long as the centring has been in. A cap that never binds
     * looks exactly like a cap that does; only the measured width tells them apart. */
    width: 100% !important;
    /* The section below started at the form's own bottom edge - a measured gap of 0 at both 768
     * and 1024, so the card and the next band were touching. */
    margin-bottom: var(--dm-5) !important;
  }
}

/* ------------------------------------------------------------------ *
 * 82. THE DRAWER ON A TABLET.
 *
 * The panel is a phone object: logo and close at the top, five links under them, and the button
 * pushed to the floor by `margin-top: auto`. On a 390x844 phone the gap that leaves is 213px and
 * reads as breathing room. On an 820x1180 tablet it is 549px of black between the last link and
 * the button - half the screen - and it reads as a page that failed to finish loading.
 *
 * The group is centred in the space below the bar instead of being split to its two ends, and the
 * button sits a normal 32px under the list rather than a screen away from it. `auto` on both sides
 * of the group, so the two margins share whatever is left and the drawer stays balanced at any
 * height. Phones keep the floor-pinned button, which is the right pattern there and is what the
 * whole rest of this component was built around.
 * ------------------------------------------------------------------ */
@media (min-width: 768px) and (max-width: 1439.98px) {
  /* Centring the group put 450px of black between the logo and the first link on a tall tablet -
   * the links belong under the bar that opened them. The list keeps its own top margin and the
   * space goes to the bottom instead, where a drawer is expected to have some. */
  .dm-panel__list { margin-top: var(--dm-5) !important; margin-bottom: 0 !important; }
  .dm-panel__cta {
    margin-top: var(--dm-4) !important;
    margin-bottom: auto !important;
    position: static !important;
    /* ADDED 2026-09-09. Full width is right on a phone and stops being right the moment the panel
     * is wider than a phone: at 1280 this drew a 1,216px red bar with one word in the middle of it,
     * the same fault as the footer CTA in section 96. A pill on the same rail as the links, wide
     * enough not to look clipped and never wider than the words need. */
    align-self: flex-start !important;
    width: auto !important;
    min-width: 240px !important;
    padding-left: var(--dm-5) !important;
    padding-right: var(--dm-5) !important;
  }
}

/* ------------------------------------------------------------------ *
 * 83. THE GREY PLATE BEHIND SIX PHOTOGRAPHS.
 *
 * The operator's report was "the corners on the images are white and do not fit the border radius",
 * and that is exactly what it is. site.css paints `background-color: #d9d9d9` on six <img> elements
 * on the home page - the generator's placeholder fill, emitted alongside `object-fit: cover` and a
 * radius. The photograph covers the box completely (every one of the six has an intrinsic aspect
 * identical to its box, checked), so the plate is invisible everywhere except along the corner arc,
 * where the radius antialiases: the browser blends the grey plate with whatever is behind the
 * element, and a light halo traces the curve. Against the dark gallery band that halo reads as a
 * white corner that does not follow the radius, which is precisely what it is.
 *
 * The plate goes. It is a placeholder for an image that is present, and nothing else depends on it.
 * Stated at (1,2,1) because the generated rule is `#dc-59-2192{...!important}` at (1,0,0).
 * ------------------------------------------------------------------ */
body .wp-block-post-content.wp-block-post-content #dc-59-2192,
body .wp-block-post-content.wp-block-post-content #dc-59-2193,
body .wp-block-post-content.wp-block-post-content #dc-59-2213,
body .wp-block-post-content.wp-block-post-content #dc-59-2214,
body .wp-block-post-content.wp-block-post-content #dc-59-2215,
body .wp-block-post-content.wp-block-post-content #dc-59-2216 {
  background-color: transparent !important;
}

/* ------------------------------------------------------------------ *
 * 84. A BUTTON WHOSE LABEL DOES NOT FIT IT, AND FOUR CARDS THAT ARE NOT THE SAME SIZE.
 *
 * THE BUTTON. "APIE MANO TRENIRUOTES" is 21 characters in a pill whose width comes from the
 * artboard's column, not from its own content. Swept across widths, the label prints OUTSIDE the
 * pill on both sides at 600, 660, 720, 768 and again at 1280 - 32px out at 600, 8px at 768 - and
 * fits everywhere else. The cause is the button contract itself: `white-space: nowrap` on a flex
 * container whose items default to `min-width: auto`, so the label can neither wrap nor shrink and
 * simply overhangs.
 *
 * It wraps now. A two-line pill is a pill; a label lying across the outside of one is a defect, and
 * it is the one shape that cannot break at any width. `min-width: 0` lets the text item shrink to
 * its box, `white-space: normal` lets it wrap inside it, and the height is free to follow.
 *
 * THE CARDS. The four training figures are cells of one grid, and the fourth carries the longest
 * label - "BENDRAS TRENIRUOČIŲ LAIKAS PER SEZONĄ" - which wraps to an extra line at most widths. Its
 * card came out 141px against the other three at 110, at 560, 600-820, 1280 and 1400; they matched
 * only in the narrow band where that label happened to fit on one line. Equal rows and cards that
 * fill them, so the set is square at every width instead of at a lucky few.
 * ------------------------------------------------------------------ */
@media (max-width: 1439.98px) {
  .wp-block-post-content .wp-block-button__link,
  .wp-block-post-content a.dm-cta,
  .dm-panel__cta {
    flex-wrap: wrap !important;
    height: auto !important;
  }
  .wp-block-post-content .wp-block-button__link > *,
  .wp-block-post-content a.dm-cta > * { min-width: 0 !important; }

  /*
   * Two columns, and the text block takes a full-width row of its own above them. The artboard puts
   * that block in the grid BESIDE two of the cards, which is why `grid-auto-rows: 1fr` was wrong at
   * the first attempt: the text row is 400px tall, so equal rows made every card 400px too. With
   * the text lifted out into its own `auto` row, the two card rows are the only `1fr` tracks and
   * they settle on the taller of the two - which is what makes the four cards square.
   */
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1321 > .wp-block-columns {
    display: grid !important;
    /* One column until 560. Two cards need 132px each at 320 and the longest label does not fit
     * that - forcing the pair produced a 332px scrollWidth on a 320 screen, which the audit caught
     * on the first run after the change. Above 560 the pair fits and the rows equalise. */
    grid-template-columns: minmax(0, 1fr) !important;
    align-items: stretch !important;
    gap: var(--dm-2) !important;
  }
  @media (min-width: 560px) {
    body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1321 > .wp-block-columns {
      grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
      grid-template-rows: auto 1fr 1fr !important;
    }
  }
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1321 > .wp-block-columns > .wp-block-column:has(#dc-59-1326) {
    grid-column: 1 / -1 !important;
    grid-row: 1 !important;
  }
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1321 > .wp-block-columns > .wp-block-column {
    align-self: stretch !important;
    width: auto !important;
    max-width: none !important;
    flex-basis: auto !important;
  }
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1335,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1348,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1359,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1374 {
    height: 100% !important;
    box-sizing: border-box !important;
  }
}

/* ------------------------------------------------------------------ *
 * 85. A BUTTON IS NOT A BAND.
 *
 * Section 39 gives every button `width: 100%`, which is right on a phone - a full-width pill is the
 * standard mobile control and the column is 350px. It stops being right the moment the column is
 * 1,216px: "APIE MANO TRENIRUOTES" came out 1,336px wide with 547px of empty red on each side of
 * its label, which is not a button, it is a band with a word in the middle.
 *
 * From 768 up they size to their own content and stay on the rail. The form's submit is excluded on
 * purpose: it is the full width of its card by design, at 1440 as well, and a card-wide submit is
 * the one case where filling the row is the point.
 * ------------------------------------------------------------------ */
@media (min-width: 768px) and (max-width: 1439.98px) {
  body.page-id-4 .wp-block-post-content.wp-block-post-content #dc-103-453,
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-105-698,
  body.page-id-6 .wp-block-post-content.wp-block-post-content #dc-105-828,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1326,
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-103-386,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-59-2114,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-59-2129,
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-59-1944,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-105-628,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-105-614 {
    width: auto !important;
    max-width: 100% !important;
    align-self: flex-start !important;
  }
  /* The wrapper core puts around a button block sizes it too. */
  body .wp-block-post-content.wp-block-post-content .wp-block-buttons,
  body .wp-block-post-content.wp-block-post-content .wp-block-button {
    width: auto !important;
    max-width: 100% !important;
  }
}

/* ------------------------------------------------------------------ *
 * 86. ONE CARD BEHIND THE FORM, AND A CENTRED INSTAGRAM BUTTON.
 *
 * THE DOUBLE CARD. Two elements were painting a card behind the enquiry form and neither knew about
 * the other: `form.dm-form` (section 51, #131417 at a 16px radius) and the design's own
 * `#dc-59-1590` (#100f11 at 10px). Measured at 1024 they sit at x=32/494 wide and x=25/508 wide -
 * offset by seven pixels and forty-nine, so the inner one hangs out past the left edge of the outer
 * one and the two radii trace each other. That is the stray rounded rectangle in the operator's
 * screenshot, and it is the "one card" rule broken by a rule written to enforce it.
 *
 * The form keeps the card, because it is the one that matches the contract the rest of the site
 * uses. The design's group stops painting and stops sizing itself, so it is simply the content.
 *
 * THE INSTAGRAM BUTTON. Its section is 238px wide and sits at x=32, so "centre it in its container"
 * had already been done and the button was still hard against the left of a 960px column. The
 * section takes the column, then the centring means something.
 * ------------------------------------------------------------------ */
@media (max-width: 1439.98px) {
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-59-1590 {
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    width: auto !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  /* The SECTION was carrying the outline - section 53 made it the secondary button back when it
   * was 238px wide and the button was the whole of it. Now that the row is the control, a second
   * outline the width of the page was drawn around the first one. The section is a section again. */
  body.page-id-6 .wp-block-post-content.wp-block-post-content #dc-59-2476 {
    width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    display: flex !important;
    justify-content: center !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: none !important;
    padding: 0 !important;
    min-height: 0 !important;
  }
  /*
   * The mark is a SIBLING of the button, not a child: the row is [pill][10px][20px glyph], so
   * centring the row left the pill itself 15px off centre at every width - measured -15 at 390,
   * 768, 1024 and 1280 alike, which is what the operator was looking at. The row becomes the
   * control instead, with the label and the mark inside one outline, and then centring the row
   * centres the thing you can see. The anchor keeps the whole height, so the tap target is the
   * pill rather than the 24px line inside it.
   */
  body.page-id-6 .wp-block-post-content.wp-block-post-content #dc-59-2476 > .wp-block-columns {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 10px !important;
    width: auto !important;
    max-width: 100% !important;
    flex: 0 0 auto !important;
    margin: 0 !important;
    min-height: 52px !important;
    padding: 0 28px !important;
    border: 1px solid rgba(255, 255, 255, .25) !important;
    border-radius: 9999px !important;
    box-sizing: border-box !important;
    grid-template-columns: none !important;
  }
  body.page-id-6 .wp-block-post-content.wp-block-post-content #dc-59-2476 > .wp-block-columns > .wp-block-column {
    flex: 0 0 auto !important;
    width: auto !important;
    max-width: none !important;
  }
  body.page-id-6 .wp-block-post-content.wp-block-post-content #dc-59-2476 a.dm-cta {
    background: none !important;
    border: 0 !important;
    padding: 0 !important;
    min-height: 52px !important;
    border-radius: 0 !important;
  }
}

/* ------------------------------------------------------------------ *
 * 87. THE CONTACT PAGE'S TWO BLOCKS, AND MATOMUMO'S FIVE ITEMS.
 *
 * TIESIOGINIS KONTAKTAS. The generated grid is three 288px columns and the artboard puts the
 * heading in the first cell, so the four contact details flow into cells 2, 3, 4 and 5 - measured
 * at 1024, heading at x=32 with two details beside it and the other two starting back at x=32 on
 * the next row, under the heading. Four items in a 2+2 that lines up with nothing. The heading
 * takes a row of its own and the four details take a grid of their own beneath it, so they are a
 * set: two columns until 900, four across above it.
 *
 * THE FORM CARD WAS SMALLER THAN THE FORM. The form is capped at 720 and measured 492 wide at
 * x=32; the design's group inside it measured 506 wide at x=25 - seven pixels out to the left,
 * fourteen wider - and every field with it. The labels started outside the card and the inputs
 * ended outside it. `width: auto` was not enough because the generator gives that group an explicit
 * width; it needs to be told to fill the form and to count its padding.
 *
 * MATOMUMO GALIMYBĖS. The first of the five items sits 33px higher than its row-mates - 2075
 * against 2108 at 768, 1876 against 1909 at 1024, 1769 against 1802 at 1280 - because the artboard
 * draws a divider above the other four and not above the first. Rather than push one item down by a
 * number, every item draws its own rule: identical top edge, whatever the artboard did, and it
 * stays identical at any width and any number of items per row.
 * ------------------------------------------------------------------ */
@media (max-width: 1439.98px) {
  /* --- the four contact details --- */
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-59-1545 .wp-block-columns:has(#dc-105-553) {
    display: grid !important;
    /* One column until 560: a contact row needs ~228px and a phone column is 350, so a forced pair
     * gave a 410px scrollWidth on a 390 screen. The audit caught it on the first run. */
    grid-template-columns: minmax(0, 1fr) !important;
    gap: var(--dm-3) var(--dm-2) !important;
    align-items: start !important;
  }
  @media (min-width: 560px) {
    body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-59-1545 .wp-block-columns:has(#dc-105-553) {
      grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
  }
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-59-1545 .wp-block-columns:has(#dc-105-553) > .wp-block-column {
    width: auto !important;
    max-width: none !important;
    flex-basis: auto !important;
  }
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-59-1545 .wp-block-columns:has(#dc-105-553) > .wp-block-column:has(h1, h2, h3, h4) {
    grid-column: 1 / -1 !important;
  }

  /* --- the form's own card fills the form --- */
}
/* Tablet only. On a phone this section was already correct, and forcing the group to fill produced
 * a 410px scrollWidth on a 390 screen - caught by the audit on the first run after the change. */
@media (min-width: 768px) and (max-width: 1439.98px) {
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-59-1589,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-59-1589 > *,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-59-1590,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-59-1590 > * {
    position: static !important;
    left: auto !important;
    right: auto !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box !important;
  }
}
@media (max-width: 1439.98px) {
  /* --- MATOMUMO GALIMYBĖS: five items, one top edge --- */
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-59-2036 .wp-block-columns:has(> * > #dc-103-510) .wp-block-spacer {
    display: none !important;
  }
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-59-2036 .wp-block-columns:has(> * > #dc-103-510) > .wp-block-column > .wp-block-group {
    margin: 0 !important;
    padding: 0 !important;
    align-self: start !important;
  }
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-59-2036 .wp-block-columns:has(> * > #dc-103-510) > .wp-block-column > .wp-block-group > .wp-block-image {
    margin: 0 !important;
    align-self: start !important;
    grid-row: 1 !important;
  }
  /*
   * The rule above each item was drawn as a border on something inside it, so it started beside the
   * icon instead of above the whole item and the second row's rules landed on top of the first
   * row's last list line. One rule per item, on the item, spanning it - and a real gap between the
   * two rows, which the existing `row-gap: 0` had removed along with the artboard's own spacing.
   */
  /* The row gap is for the gap BETWEEN two rows of items and only exists once there are two. On a
   * phone the five stack in one column, where 32px inside the group against 8px around it inverts
   * the ordering rule - rhythm-audit reported it on the first run after the change. */
  @media (min-width: 768px) {
    body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-59-2036 .wp-block-columns:has(> * > #dc-103-510) {
      row-gap: var(--dm-4) !important;
    }
  }
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-59-2036 .wp-block-columns:has(> * > #dc-103-510) > .wp-block-column {
    border-top: 1px solid rgba(255, 255, 255, .12) !important;
    padding-top: var(--dm-2) !important;
  }
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-59-2036 .wp-block-columns:has(> * > #dc-103-510) > .wp-block-column * {
    border-top-width: 0 !important;
    border-bottom-width: 0 !important;
  }
  /*
   * WHAT THE 33px ACTUALLY WAS. Measured at 1024: every item's outer column starts at y=1876, but
   * item 1's inner group starts there too while items 2 to 5 start theirs 16px lower - and inside
   * that, item 1's icon sits at the group's top edge while the others sit 17px into it. 16 and 17.
   * The artboard draws a divider above four of the five and not above the first, and both offsets
   * are what is left of it after the reflow flattens 136 wrappers in this section to
   * `display: contents`. That is why a border on the column showed nothing and why hiding the
   * spacers changed nothing: neither was carrying it.
   *
   * So the offsets are removed rather than compensated. Every item group sits at the top of its own
   * column and every icon at the top of its group, which makes the five identical whatever the
   * artboard left behind and holds at any number of items per row: three across at 768 and 1024,
   * five at 1280. Title tops now agree within a pixel - 2075/2076/2076 at 768, 1876/1877/1877 at
   * 1024, 1769/1770 at 1280 - against 33px before.
   */
}
@media (min-width: 900px) and (max-width: 1439.98px) {
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-59-1545 .wp-block-columns:has(#dc-105-553) {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  }
}

/* ------------------------------------------------------------------ *
 * 88. TWO GRIDS ON THE HOME PAGE THAT CHANGE SHAPE FOR NO REASON.
 *
 * THE "RIDE" TILES. Four photographs, laid out by wrapping flex items, so the row count follows
 * whatever happens to fit: 2 up at 768 with 348px tiles, and 4 up from 900, which makes them 203px
 * at 900 and 231px at 1024. Four postage stamps in a 960px column, and the gallery page shows the
 * same photographs two up and large on the same screen. Two up across the whole band, which is what
 * 768 already did and what galerija does.
 *
 * THE PARTNER LOGOS. Six of them: 3+3 at 768, 6 across at 1280, and 4+2 between - a ragged last row
 * for 380px of width and nowhere else. Three across from 900 to 1279, so the block is two even rows
 * at every width below 1280 and one even row above it.
 *
 * Stated as a flex basis rather than a column count because the container is a wrapping flex row,
 * not a grid - the percentage is of whatever the column happens to be, so nothing here is tied to
 * a viewport.
 * ------------------------------------------------------------------ */
@media (min-width: 768px) and (max-width: 1023.98px) {
  /* The container is a GRID, not the wrapping flex row it looks like - so a flex basis places
   * nothing and `max-width: 50%` resolves against the CELL, which is what the first attempt did:
   * it left four cells and shrank each photograph to half of one, 231px becoming 108. The column
   * count is the thing to set.
   *
   * NARROWED TO 1023.98 on 2026-09-09 (was 1439.98). Two up is right while the tile stays near the
   * size it was drawn at; it stops being right as the column grows. At 1280 two up made each tile
   * 602x686 - a photograph nearly twice the drawn size and taller than half a laptop screen, four
   * of them, 1,372px of scroll for a block the artboard gives 360. There is no third option in
   * between: four tiles divide into two columns or four, and three leaves one alone on a second
   * row. So two up to 1023 and the artboard's own four up above it, where four fits at 228px and
   * climbs to 332 by 1439 - the artboard draws them at 316. */
  body.page-id-4 .wp-block-post-content.wp-block-post-content .wp-block-columns:has(> .wp-block-column > figure > #dc-59-2213) {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}
@media (min-width: 900px) and (max-width: 1279.98px) {
  body.page-id-4 .wp-block-post-content.wp-block-post-content .wp-block-columns:has(> .wp-block-column > #dc-59-2221) {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}

/* ------------------------------------------------------------------ *
 * 89. THE "APIE MANE" PHOTOGRAPHS USED TWO THIRDS OF THEIR ROW.
 *
 * Three photographs in a three-column grid, and only two of the columns carry anything: one tall
 * frame on the left, two stacked on the right, and a third column - 229px at 768, 309 at 1024, 395
 * at 1280 - holding nothing. On a white section that empty third reads as the page having failed to
 * finish, and it is a third of the widest block on the page.
 *
 * Two columns below 1440, so the pair fills the row it is given: the tall frame and the stack each
 * take half of whatever the column is.
 * ------------------------------------------------------------------ */
@media (max-width: 1439.98px) {
  body.page-id-4 .wp-block-post-content.wp-block-post-content .wp-block-columns:has(> .wp-block-column > figure > #dc-59-2192) {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

/* ------------------------------------------------------------------ *
 * 90. THE TWO COLUMNS UNDER THE FORM DID NOT LINE UP.
 *
 * Both headings sit at y=2114 - it is what comes after them that diverges. The left column has a
 * subtitle line under its heading and the right does not, so the left's first card starts at 2202
 * and the right's first item at 2180: 22px apart, the height of that one line, and the reason the
 * two columns read as unaligned all the way down.
 *
 * Compensating with 22px of padding would be a number tied to one line of copy at one size. Instead
 * the two columns share one grid: both headings in row 1, the subtitle in row 2 of its own column,
 * and BOTH bodies in row 3. The right column skips the subtitle's row rather than being pushed past
 * it, so the items line up whatever that line does - two lines at a narrow width, none if the copy
 * changes, a different size at a different breakpoint.
 * ------------------------------------------------------------------ */
@media (min-width: 768px) and (max-width: 1439.98px) {
  /* The column WRAPPER has to go too, not just the group inside it - with the wrapper still a box
   * the group's children join the wrapper's layout rather than the section's grid, which is why the
   * first attempt moved the gap around without aligning anything. */
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-105-558,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-105-557,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-59-1635 .wp-block-columns:has(> * > #dc-105-558) > .wp-block-column {
    display: contents !important;
  }
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-59-1635 .wp-block-columns:has(> * > #dc-105-558) {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    grid-template-rows: auto auto auto !important;
    column-gap: var(--dm-4) !important;
    row-gap: var(--dm-1) !important;
    align-items: start !important;
  }
  /* Row 1: the two headings. */
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-105-558 > .wp-block-columns:first-child {
    grid-column: 1 !important; grid-row: 1 !important; margin: 0 !important;
  }
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-59-1690 {
    grid-column: 2 !important; grid-row: 1 !important; margin: 0 !important;
  }
  /* Row 2: the subtitle, in its own column only. */
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-105-558 > .wp-block-columns:nth-child(2) {
    grid-column: 1 !important; grid-row: 2 !important; margin: 0 !important;
  }
  /* Row 3 and after: both bodies start level. */
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-59-1639,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-59-1658,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-59-1673 {
    grid-column: 1 !important; margin: 0 !important;
  }
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-105-557 > .wp-block-columns {
    grid-column: 2 !important; grid-row: 3 / span 4 !important; margin: 0 !important;
  }
  /* The artboard's spacers between them are what the row gap is for now. */
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-105-558 > .wp-block-spacer,
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-105-557 > .wp-block-spacer {
    display: none !important;
  }
}

/* ------------------------------------------------------------------ *
 * 91. THE TWO FULL-BLEED HEROES MISSED THE LEFT EDGE ABOVE 1440.
 *
 * At 1440 the kontaktai hero's cover carries `left: 55px` and the group around it sits at x=-55, so
 * the two cancel and the photograph lands flush at 0. Above 1440 the group is reset to x=0 - it has
 * to be, it is the band that grows to the viewport - but the cover keeps its 55, so the photograph
 * starts 55px in and runs 55px past the right edge. A flat black strip down the left of a full-bleed
 * hero, and the same fault 4px wide on the home page's.
 *
 * Measured at 1441, 1920 and 2560: kontaktai spans 55..1496, 55..1975, 55..2615 of a viewport that
 * starts at 0 each time - a constant offset, not a proportional one, which is what gives it away as
 * a compensation left behind rather than anything to do with width.
 *
 * The compensation goes where the thing it compensated for has gone. Nothing changes at 1440.
 * ------------------------------------------------------------------ */
@media (min-width: 1441px) {
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-59-1771,
  body.page-id-4 .wp-block-post-content.wp-block-post-content #dc-59-2512 {
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    max-width: none !important;
  }
}

/* ------------------------------------------------------------------ *
 * 92. THE PASIEKIMAI STAT BAND IS CLOSED AT BOTH ENDS.
 *
 * Four cells with a 1px white rule between each pair and a horizontal rule above and below, and
 * nothing closing the two ends - so above 1440 the first cell's left edge and the last cell's right
 * edge were simply open and the row read as having run out of page.
 *
 * Two vertical rules, in the same 1px white the dividers between the cells already use, on the row
 * that holds the cells. That row measures 240..1680 at 1920 - the design's 1440 content column,
 * centred - and the horizontal rules' ink lands at 240..1676, because their SVGs draw a 1440-wide
 * line centred in whatever box they are stretched to. So the three already agree; the ends were the
 * only thing missing, and the band now closes exactly where the artboard puts it.
 *
 * Nothing else here is touched. Letting the cells grow to the viewport was built first and rejected
 * by the operator: it makes this one band wider than every other block on the site. Their content
 * is absolutely positioned at artboard coordinates inside the block, so widening the columns moved
 * the boxes and left the figures where they were - the fourth number ended up outside its own cell.
 * ------------------------------------------------------------------ */
@media (min-width: 1441px) {
  /* On the BLOCK, not on the row of cells: the row's box is 97px tall while the band's content is
   * 189, so a border there only reached halfway down. The block is the band - 726..915 - and it is
   * pinned to the design's own 1440 column so the two rules land exactly on the ends of the
   * horizontal ones. */
  /*
   * The block STAYS full-bleed. Its cells are absolutely positioned at artboard coordinates that
   * assume a 1920-wide block - pinning it to 1440 instead squeezed the last cell to 118px against
   * its siblings' 360 and put "250+" 70px outside the box, measured on the rendered pixels.
   *
   * So the two end rules are drawn ON the full-bleed block, inset to where the design's column
   * begins and ends. `(100% - 1440px) / 2` is the same expression the rest of the build uses for
   * that inset, so they land on 240 and 1679 at 1920 and follow the viewport at any other width -
   * meeting the horizontal rules, whose own ink runs 240..1678.
   *
   * A border cannot do this: on the block it would sit at the viewport's edges, and on the row of
   * cells it only reaches 97px down a band that is 189 tall.
   */
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-59-1239 {
    background-image: linear-gradient(#fff, #fff), linear-gradient(#fff, #fff) !important;
    background-size: 1px 100%, 1px 100% !important;
    background-position: calc((100% - 1440px) / 2) 0, calc(100% - (100% - 1440px) / 2 - 1px) 0 !important;
    background-repeat: no-repeat !important;
  }
}

/* ------------------------------------------------------------------ *
 * 93. THE PRIVACY POLICY PAGE.
 *
 * The page reuses apie-doma's header and footer verbatim and declares `page-id-5` alongside its own
 * id, so everything those two blocks need already reaches it - see the note in functions.php. What
 * is left is its own body, and one link.
 *
 * THE CONSENT LINK. Stated at every width, not inside a query - the mistake sections 52, 74 and 75
 * were each written to correct, and the unstyled-anchor sweep caught this one on the first run
 * after it was added, printing in the browser's own blue on a dark card.
 *
 * THE BODY. Measure capped and the headings set in the site's own label voice, so the page reads as
 * part of the site rather than as a legal document bolted to it. The eyebrow, the H1 and the body
 * type are the same values the other pages use.
 * ------------------------------------------------------------------ */
.wp-block-post-content.wp-block-post-content .dm-form__consent a {
  color: #fff !important;
  text-decoration: underline !important;
  text-underline-offset: 2px !important;
  text-decoration-color: rgba(255, 255, 255, .4) !important;
}
.wp-block-post-content.wp-block-post-content .dm-form__consent a:hover {
  text-decoration-color: #e22f2d !important;
}
/* An inline link in a sentence is 15px tall; the thumb needs 44. The same stretched pseudo-element
 * the contact rows use (section 57), so the hit area grows without the line box moving. */
.wp-block-post-content.wp-block-post-content .dm-form__consent a { position: relative !important; }
.wp-block-post-content.wp-block-post-content .dm-form__consent a::after {
  content: "" !important;
  position: absolute !important;
  inset: -15px -6px !important;
  z-index: 1 !important;
}

.wp-block-post-content.wp-block-post-content #dm-privacy {
  box-sizing: border-box !important;
  /* The section's own #0a0b0d is the body's colour exactly, so it painted a band the width of the
   * content column and nothing else - which the audit reads, correctly, as a full-bleed band that
   * does not reach either edge. The ground is already there. */
  background: none !important;
}
.wp-block-post-content.wp-block-post-content #dm-privacy p,
.wp-block-post-content.wp-block-post-content #dm-privacy h1,
.wp-block-post-content.wp-block-post-content #dm-privacy h2 {
  max-width: 68ch !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}
/* The display face the rest of the site uses for a page title. */
.wp-block-post-content.wp-block-post-content #dm-pp-title {
  font-family: "Montserrat", sans-serif !important;
  font-weight: 900 !important;
  font-style: italic !important;
  text-transform: uppercase !important;
  letter-spacing: -.01em !important;
}
.wp-block-post-content.wp-block-post-content #dm-privacy h2 {
  font-family: "Montserrat", sans-serif !important;
}
/* A legal link is not one of the five pages. */
.wp-block-post-content.wp-block-post-content .dm-footnav li:last-child a,
.wp-block-post-content.wp-block-post-content .dm-footnav li:last-child span {
  color: rgba(255, 255, 255, .45) !important;
}
@media (max-width: 767.98px) {
  .wp-block-post-content.wp-block-post-content #dm-privacy {
    padding-left: var(--dm-gutter) !important;
    padding-right: var(--dm-gutter) !important;
    padding-top: var(--dm-6) !important;
    padding-bottom: var(--dm-6) !important;
  }
}

/* ------------------------------------------------------------------ *
 * 94. THE 1024-1439 BAND WAS A STRETCHED PHONE, NOT A NARROW DESKTOP.
 *
 * The home page is 4,198px at 1440 and 4,370 on a 390px phone. In between it reached 7,330px at
 * 1280 - taller than the phone, on a laptop. Nothing was broken and no audit had anything to say:
 * every element kept the aspect ratio the artboard gave it and simply doubled in width, so a
 * photograph drawn 384px wide became 600 wide and 1,058 tall, and the rider beside KONTAKTAI became
 * a 1,216x1,124 wall that filled a laptop screen on its own.
 *
 * The cause is one decision applied at the wrong end of the band. Below 1440 a section's text
 * column is spanned across the row (`grid-column: 1 / -1`) and its photographs are dropped into a
 * row of their own. At 768 that is right - there is no room for two things side by side. At 1280
 * there is: the artboard puts the text in 600px and the mosaic in 656, and 1,216 holds both with
 * room to spare. Spanning the text there buys nothing and costs a thousand pixels of scroll, plus
 * the empty right half beside it that reads as the page having failed to finish.
 *
 * So from 1024 up this band returns to the artboard's own arrangement - text, tall frame, stack -
 * in the artboard's own proportions (600:384:256 = 1.6:1:0.7). The photographs land within a few
 * pixels of the size they were drawn at instead of twice it.
 *
 * Stated at (1,4,0) because the generated rule that spans the text is
 * `#dc-59-2183 > :nth-child(2) > .wp-block-column:nth-of-type(2)` at (1,3,0) !important - the
 * doubled `.wp-block-post-content` is what wins it, not the !important.
 * ------------------------------------------------------------------ */
@media (min-width: 1024px) and (max-width: 1439.98px) {
  body.page-id-4 .wp-block-post-content.wp-block-post-content
    .wp-block-columns:has(> .wp-block-column > figure > #dc-59-2192) {
    grid-template-columns: 1.6fr 1fr .7fr !important;
    align-items: start !important;
  }
  body.page-id-4 .wp-block-post-content.wp-block-post-content
    #dc-59-2183 > :nth-child(2) > .wp-block-column:nth-of-type(2) {
    grid-column: 1 !important;
  }
}

/* ------------------------------------------------------------------ *
 * 95. THE RIDER BESIDE "PASIRUOŠĘS KITAM STARTUI" FILLED A LAPTOP SCREEN.
 *
 * Same cause as 94, worst instance on the site: `97-1014` is drawn 566x523 beside the text and
 * rendered 1216x1124 below it - a photograph that is, on its own, taller than a 1280x800 laptop
 * viewport, so the section read as a full-bleed hero that had wandered into the middle of the page.
 *
 * The photograph is the FIRST child of its column and the six text blocks follow it, so there is no
 * wrapper to put the text in. Six explicit rows and a photograph spanning all of them puts the text
 * back on the left and the rider back on the right, in the artboard's 646:566 proportion.
 *
 * `grid-template-rows: repeat(6, auto)` is what makes `grid-row: 1 / -1` mean anything: `-1` is the
 * last line of the EXPLICIT grid, so with no template the span collapses to a single row and the
 * photograph lands in row 1 with the eyebrow beside it and the rest of the text below - which looks
 * exactly like the bug it was meant to fix.
 *
 * The selectors reach the image as `figure #dc-97-1014` - a DESCENDANT, and inside a single
 * `:has()`. Two ways to get this wrong were both written first. `figure > #dc-97-1014` matches
 * nothing, because assets that are wrong below 1440 are served through a `<picture>`
 * (DOMAS_FLOW_ASSETS) and the child combinator stops at it. `figure:has(#dc-97-1014)` inside
 * another `:has()` is a SYNTAX ERROR - `:has()` cannot be nested - so the browser discards the
 * whole rule and the section renders exactly as it did before, with nothing to say it was refused.
 * ------------------------------------------------------------------ */
@media (min-width: 1024px) and (max-width: 1439.98px) {
  body.page-id-4 .wp-block-post-content.wp-block-post-content
    .wp-block-columns > .wp-block-column:has(> .wp-block-columns > .wp-block-column > figure #dc-97-1014) {
    display: grid !important;
    grid-template-columns: 1.14fr 1fr !important;
    grid-template-rows: repeat(6, auto) !important;
    column-gap: var(--dm-5) !important;
    align-items: start !important;
  }
  body.page-id-4 .wp-block-post-content.wp-block-post-content
    .wp-block-column > .wp-block-columns:has(> .wp-block-column > figure #dc-97-1014) {
    grid-column: 2 !important;
    grid-row: 1 / -1 !important;
    align-self: center !important;
  }
}

/* ------------------------------------------------------------------ *
 * 96. THE FOOTER WAS A PHONE FOOTER ON A LAPTOP.
 *
 * Section 52 pairs the email with the phone and gives the social tiles their own row, which is
 * right on a phone and holds to 1439. On a 1280 laptop it put "EL. PAŠTAS" at x=32 and "TELEFONAS"
 * at x=726 - a 690px hole between a label and the next one - stacked the social tiles under them
 * with the whole right half of the row empty, and drew the CTA as a 1,216px red bar. A pill that
 * wide is not a button; it is a band with a word in the middle.
 *
 * The artboard puts all five in ONE row - logo, email, phone, social, CTA - and 1,216px holds them
 * with room over. So from 1024 up the footer is that row again.
 *
 * `display: contents` on the CTA column is what makes it possible without touching the markup: the
 * column holds the button AND the footer nav, so placing the column itself in column 5 would squeeze
 * seven links into 162px. Flattening it promotes both to grid items, and they can then go to
 * different places - the button to column 5, the nav across the full width beneath. The band is
 * `position: relative` below 1440, so an absolutely positioned nav was the other route; this one
 * needs no magic offset and moves with the row.
 * ------------------------------------------------------------------ */
@media (min-width: 1024px) and (max-width: 1439.98px) {
  body.page-id-4 .wp-block-post-content.wp-block-post-content #dc-103-399 > .wp-block-columns {
    grid-template-columns: auto minmax(0, 1.25fr) minmax(0, 1fr) minmax(0, 1fr) auto !important;
    align-items: start !important;
    row-gap: var(--dm-4) !important;
  },
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-105-644 > .wp-block-columns {
    grid-template-columns: auto minmax(0, 1.25fr) minmax(0, 1fr) minmax(0, 1fr) auto !important;
    align-items: start !important;
    row-gap: var(--dm-4) !important;
  },
  body.page-id-6 .wp-block-post-content.wp-block-post-content #dc-105-774 > .wp-block-columns {
    grid-template-columns: auto minmax(0, 1.25fr) minmax(0, 1fr) minmax(0, 1fr) auto !important;
    align-items: start !important;
    row-gap: var(--dm-4) !important;
  },
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-103-332 > .wp-block-columns {
    grid-template-columns: auto minmax(0, 1.25fr) minmax(0, 1fr) minmax(0, 1fr) auto !important;
    align-items: start !important;
    row-gap: var(--dm-4) !important;
  },
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-59-1903 > .wp-block-columns {
    grid-template-columns: auto minmax(0, 1.25fr) minmax(0, 1fr) minmax(0, 1fr) auto !important;
    align-items: start !important;
    row-gap: var(--dm-4) !important;
  },
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-105-560 > .wp-block-columns {
    grid-template-columns: auto minmax(0, 1.25fr) minmax(0, 1fr) minmax(0, 1fr) auto !important;
    align-items: start !important;
    row-gap: var(--dm-4) !important;
  }
  body.page-id-4 .wp-block-post-content.wp-block-post-content #dc-103-399 > .wp-block-columns > .wp-block-column:has(.dm-homelink) { grid-column: 1 !important; align-self: center !important; },
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-105-644 > .wp-block-columns > .wp-block-column:has(.dm-homelink) { grid-column: 1 !important; align-self: center !important; },
  body.page-id-6 .wp-block-post-content.wp-block-post-content #dc-105-774 > .wp-block-columns > .wp-block-column:has(.dm-homelink) { grid-column: 1 !important; align-self: center !important; },
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-103-332 > .wp-block-columns > .wp-block-column:has(.dm-homelink) { grid-column: 1 !important; align-self: center !important; },
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-59-1903 > .wp-block-columns > .wp-block-column:has(.dm-homelink) { grid-column: 1 !important; align-self: center !important; },
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-105-560 > .wp-block-columns > .wp-block-column:has(.dm-homelink) { grid-column: 1 !important; align-self: center !important; }
  body.page-id-4 .wp-block-post-content.wp-block-post-content #dc-103-399 > .wp-block-columns > .wp-block-column:has(a[href^="mailto"]) { grid-column: 2 !important; },
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-105-644 > .wp-block-columns > .wp-block-column:has(a[href^="mailto"]) { grid-column: 2 !important; },
  body.page-id-6 .wp-block-post-content.wp-block-post-content #dc-105-774 > .wp-block-columns > .wp-block-column:has(a[href^="mailto"]) { grid-column: 2 !important; },
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-103-332 > .wp-block-columns > .wp-block-column:has(a[href^="mailto"]) { grid-column: 2 !important; },
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-59-1903 > .wp-block-columns > .wp-block-column:has(a[href^="mailto"]) { grid-column: 2 !important; },
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-105-560 > .wp-block-columns > .wp-block-column:has(a[href^="mailto"]) { grid-column: 2 !important; }
  body.page-id-4 .wp-block-post-content.wp-block-post-content #dc-103-399 > .wp-block-columns > .wp-block-column:has(a[href^="tel"]) { grid-column: 3 !important; },
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-105-644 > .wp-block-columns > .wp-block-column:has(a[href^="tel"]) { grid-column: 3 !important; },
  body.page-id-6 .wp-block-post-content.wp-block-post-content #dc-105-774 > .wp-block-columns > .wp-block-column:has(a[href^="tel"]) { grid-column: 3 !important; },
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-103-332 > .wp-block-columns > .wp-block-column:has(a[href^="tel"]) { grid-column: 3 !important; },
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-59-1903 > .wp-block-columns > .wp-block-column:has(a[href^="tel"]) { grid-column: 3 !important; },
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-105-560 > .wp-block-columns > .wp-block-column:has(a[href^="tel"]) { grid-column: 3 !important; }
  body.page-id-4 .wp-block-post-content.wp-block-post-content #dc-103-399 > .wp-block-columns > .wp-block-column:has(.dm-social) { grid-column: 4 !important; },
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-105-644 > .wp-block-columns > .wp-block-column:has(.dm-social) { grid-column: 4 !important; },
  body.page-id-6 .wp-block-post-content.wp-block-post-content #dc-105-774 > .wp-block-columns > .wp-block-column:has(.dm-social) { grid-column: 4 !important; },
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-103-332 > .wp-block-columns > .wp-block-column:has(.dm-social) { grid-column: 4 !important; },
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-59-1903 > .wp-block-columns > .wp-block-column:has(.dm-social) { grid-column: 4 !important; },
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-105-560 > .wp-block-columns > .wp-block-column:has(.dm-social) { grid-column: 4 !important; }
  body.page-id-4 .wp-block-post-content.wp-block-post-content #dc-103-399 > .wp-block-columns > .wp-block-column:has(.dm-footnav) { display: contents !important; },
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-105-644 > .wp-block-columns > .wp-block-column:has(.dm-footnav) { display: contents !important; },
  body.page-id-6 .wp-block-post-content.wp-block-post-content #dc-105-774 > .wp-block-columns > .wp-block-column:has(.dm-footnav) { display: contents !important; },
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-103-332 > .wp-block-columns > .wp-block-column:has(.dm-footnav) { display: contents !important; },
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-59-1903 > .wp-block-columns > .wp-block-column:has(.dm-footnav) { display: contents !important; },
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-105-560 > .wp-block-columns > .wp-block-column:has(.dm-footnav) { display: contents !important; }
  body.page-id-4 .wp-block-post-content.wp-block-post-content #dc-103-399 > .wp-block-columns > .wp-block-column > .wp-block-button {
    grid-column: 5 !important;
    justify-self: end !important;
  },
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-105-644 > .wp-block-columns > .wp-block-column > .wp-block-button {
    grid-column: 5 !important;
    justify-self: end !important;
  },
  body.page-id-6 .wp-block-post-content.wp-block-post-content #dc-105-774 > .wp-block-columns > .wp-block-column > .wp-block-button {
    grid-column: 5 !important;
    justify-self: end !important;
  },
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-103-332 > .wp-block-columns > .wp-block-column > .wp-block-button {
    grid-column: 5 !important;
    justify-self: end !important;
  },
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-59-1903 > .wp-block-columns > .wp-block-column > .wp-block-button {
    grid-column: 5 !important;
    justify-self: end !important;
  },
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-105-560 > .wp-block-columns > .wp-block-column > .wp-block-button {
    grid-column: 5 !important;
    justify-self: end !important;
  }
  body.page-id-4 .wp-block-post-content.wp-block-post-content #dc-103-399 > .wp-block-columns > .wp-block-column > .dm-footnav {
    grid-column: 1 / -1 !important;
    margin: 0 !important;
  },
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-105-644 > .wp-block-columns > .wp-block-column > .dm-footnav {
    grid-column: 1 / -1 !important;
    margin: 0 !important;
  },
  body.page-id-6 .wp-block-post-content.wp-block-post-content #dc-105-774 > .wp-block-columns > .wp-block-column > .dm-footnav {
    grid-column: 1 / -1 !important;
    margin: 0 !important;
  },
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-103-332 > .wp-block-columns > .wp-block-column > .dm-footnav {
    grid-column: 1 / -1 !important;
    margin: 0 !important;
  },
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-59-1903 > .wp-block-columns > .wp-block-column > .dm-footnav {
    grid-column: 1 / -1 !important;
    margin: 0 !important;
  },
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-105-560 > .wp-block-columns > .wp-block-column > .dm-footnav {
    grid-column: 1 / -1 !important;
    margin: 0 !important;
  }
  body.page-id-4 .wp-block-post-content.wp-block-post-content #dc-103-399 > .wp-block-columns > .wp-block-column > .dm-footnav ul { justify-content: center !important; },
  body.page-id-5 .wp-block-post-content.wp-block-post-content #dc-105-644 > .wp-block-columns > .wp-block-column > .dm-footnav ul { justify-content: center !important; },
  body.page-id-6 .wp-block-post-content.wp-block-post-content #dc-105-774 > .wp-block-columns > .wp-block-column > .dm-footnav ul { justify-content: center !important; },
  body.page-id-7 .wp-block-post-content.wp-block-post-content #dc-103-332 > .wp-block-columns > .wp-block-column > .dm-footnav ul { justify-content: center !important; },
  body.page-id-8 .wp-block-post-content.wp-block-post-content #dc-59-1903 > .wp-block-columns > .wp-block-column > .dm-footnav ul { justify-content: center !important; },
  body.page-id-9 .wp-block-post-content.wp-block-post-content #dc-105-560 > .wp-block-columns > .wp-block-column > .dm-footnav ul { justify-content: center !important; }
}

/* ------------------------------------------------------------------ *
 * 97. TWO ROWS ON THE HOME PAGE THAT DID NOT FILL THEMSELVES.
 *
 * THE PARTNER PLATES. Six of them, three across from 1024 to 1279 - and each plate is capped at the
 * 206px it is drawn at while its cell is 312 wide, so the row rendered as three boxes with 106px of
 * nothing beside each one. The declared gap is 12px and the gap you see is 118. A plate that cannot
 * fill its own cell should not have been given a cell that wide; the cheaper of the two fixes is to
 * let it fill. All six ids are named - the cap is `body.page-id-4 #dc-59-2221`, per plate, so a rule
 * written for the first one leaves five behind.
 *
 * THE STAT BAND. Four figures, drawn four across, rendered two across at every width below 1440. At
 * 1200 there is room for four - 272px a cell against the 360 the artboard gives them - and four is
 * what the band is: a row of figures, not a 2x2. Below 1200 it stays two, where the captions
 * ("NUOSEKLUS TOBULĖJIMAS IR AUKŠTI REZULTATAI") would otherwise wrap to three lines in 228px.
 * ------------------------------------------------------------------ */
/*
 * 768, NOT 1024. Written as 1024-1279 first, because that is the width I happened to be looking at.
 * Measured across the band afterwards, the plate is capped at 206 while its cell is 229 at 768, 251
 * at 834 and 273 at 900 - so a third of the band still had three boxes floating in wider cells,
 * with a declared 8px gap and a visible one of 55. Below 768 the cell is narrower than the cap and
 * the plate fills it on its own; from 1280 the row is six across at 193 and the cap never binds.
 */
@media (min-width: 768px) and (max-width: 1279.98px) {
  body.page-id-4 .wp-block-post-content.wp-block-post-content #dc-59-2221,
  body.page-id-4 .wp-block-post-content.wp-block-post-content #dc-59-2223,
  body.page-id-4 .wp-block-post-content.wp-block-post-content #dc-59-2225,
  body.page-id-4 .wp-block-post-content.wp-block-post-content #dc-59-2227,
  body.page-id-4 .wp-block-post-content.wp-block-post-content #dc-59-2229,
  body.page-id-4 .wp-block-post-content.wp-block-post-content #dc-59-2231 { max-width: none !important; }
}
@media (min-width: 1200px) and (max-width: 1439.98px) {
  body.page-id-4 .wp-block-post-content.wp-block-post-content #dc-97-1016 > .wp-block-columns {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  }
}

/* ------------------------------------------------------------------ *
 * 98. THE FOURTH FIGURE IN THE STAT BAND SAT HIGHER THAN THE OTHER THREE.
 *
 * "80+", "10+" and "100+" are type and scale with the width - 63px tall at 1024, 73 at 1280, 80 at
 * 1439. The fourth is not type: the infinity mark is an `<img>` fixed at 40px at every width. So its
 * row is 23-40px shorter than its neighbours' and everything under it - the red label, the caption -
 * rides up by that much. Four figures in a row, and one of them out of line, at every width in the
 * band. It is the exact shape of the defect the operator reported on MATOMUMO: nothing is wrong with
 * the cell on its own, it is wrong beside the three next to it.
 *
 * The row gets the numerals' own height as a floor and centres the mark in it, which is where 1440
 * puts it. `--dm-stat-num` tracks the generated type scale rather than repeating a number in four
 * places. Measured on the running page: 39px at 445, 52 at 768, 55 at 834, 58 at 900, 63 at 1024,
 * 73 at 1280, 80 at 1439 - one straight line at 0.0415px per px of viewport across the whole band.
 * If that scale is ever regenerated, this is the one line to re-measure.
 *
 * It runs to 445 rather than stopping at 1024, because the gap does: 12px at 768, 15 at 834, 18 at
 * 900, 23 at 1023. Below 445 the mark is TALLER than the numerals (40 against 36), so the floor
 * stops binding on its own and there is nothing to scope.
 * ------------------------------------------------------------------ */
@media (max-width: 1439.98px) {
  body.page-id-4 .wp-block-post-content.wp-block-post-content #dc-59-2174 {
    --dm-stat-num: calc(39px + (100vw - 445px) * .0415);
  }
  body.page-id-4 .wp-block-post-content.wp-block-post-content #dc-59-2174
    > .wp-block-columns > .wp-block-column > .wp-block-columns:first-child {
    min-height: var(--dm-stat-num) !important;
    display: flex !important;
    align-items: center !important;
  }
}

/* ------------------------------------------------------------------ *
 * 99. APIE DOMA'S OPENING, AND ITS FOUR FIGURES.
 *
 * Same shape as 94/95 on the other page. The artboard puts "APIE DOMĄ" on the left and the
 * photograph on the right; below 1440 the photograph goes full width at 1216x817 and the title
 * drops underneath it, using the left 360px of a 1216px row - so a laptop opens this page on a
 * photograph with nothing else on screen, and scrolls to a title with 900px of black beside it.
 *
 * The photograph is again the first child with the text after it, so this is 95's arrangement: six
 * explicit rows, photograph spanning all of them in column 2, text in column 1. .85fr/1fr is the
 * artboard's own 665:855.
 *
 * THE FOUR FIGURES below it stay 2x2, and that is deliberate. Four across was tried and reverted:
 * unlike the home page's band, every item here carries a generated `grid-column: 1 / 2` or `2 / 3`,
 * three items per card, so widening the template to four columns moves nothing - it leaves the two
 * new columns empty and shrinks the cards from 600px to 292. Re-pinning twelve items by nth-of-type
 * to buy a row of four is not worth the fragility; 2x2 with each card filling its half is even, it
 * fills the row, and it is what the band already did.
 * ------------------------------------------------------------------ */
@media (min-width: 1024px) and (max-width: 1439.98px) {
  body.page-id-5 .wp-block-post-content.wp-block-post-content
    #dc-59-1881 > .wp-block-columns > .wp-block-column {
    display: grid !important;
    grid-template-columns: .85fr 1fr !important;
    /* EIGHT rows, not six: the column holds nine children (the photograph plus eight text blocks
     * and spacers). Declare too few and the surplus lands in an implicit row - which, with the
     * photograph spanning column 2, put the closing paragraph underneath the photograph on the
     * right instead of below the text on the left. Count the children; do not estimate them. */
    grid-template-rows: repeat(8, auto) !important;
    column-gap: var(--dm-5) !important;
    align-items: start !important;
  }
  body.page-id-5 .wp-block-post-content.wp-block-post-content
    #dc-59-1881 > .wp-block-columns > .wp-block-column > .wp-block-columns:has(figure #dc-59-1882) {
    grid-column: 2 !important;
    grid-row: 1 / -1 !important;
    align-self: center !important;
  }
}

/* ------------------------------------------------------------------ *
 * 100. THE PRIVACY PAGE STOPPED HALFWAY ACROSS, AND STARTED TOO HIGH.
 *
 * The body is capped at a 68ch measure and pinned to the left rail, which is right on every other
 * page because every other page has something in the other half - a photograph, a mosaic, a rider.
 * This one has nothing, so at 1440 the text ran 48..718 and 720px of black sat beside it for the
 * length of the page. A measure column with an empty half beside it does not read as a rail; it
 * reads as a page that failed to finish.
 *
 * So the column centres from 768 up. This is the one page on the site that is a single column of
 * prose and nothing else, which is exactly the case where centring is the convention rather than a
 * departure - the text stays left-aligned inside it, so nothing about the reading changes.
 *
 * THE CAP MOVES TO THE CONTAINER, and that is the whole trick. Centring the elements themselves was
 * tried first and looked far worse than the bug: `max-width: 68ch` resolves against EACH element's
 * own font-size, so the 46px h1, the 26px h2 and the 17px paragraph are three different widths, and
 * centring three different widths gives three different left edges. One capped, centred container
 * and no cap on the children keeps every line starting on the same rail.
 *
 * TOP CLEARANCE. The section's 96px of padding is measured from its own top, and at 1440 the
 * section begins at y=24 UNDER the header - so the eyebrow landed at y=120 against a header ending
 * at 119. One pixel. Below 1440 the header is in normal flow and the same padding yields 120px of
 * air, which is why this only shows at the one width the artboard covers.
 * ------------------------------------------------------------------ */
@media (min-width: 768px) {
  .wp-block-post-content.wp-block-post-content #dm-privacy {
    max-width: 816px !important;      /* 720 of measure inside 48px of padding each side */
    margin-left: auto !important;
    margin-right: auto !important;
  }
  .wp-block-post-content.wp-block-post-content #dm-privacy p,
  .wp-block-post-content.wp-block-post-content #dm-privacy h1,
  .wp-block-post-content.wp-block-post-content #dm-privacy h2 {
    max-width: none !important;
  }
}
@media (min-width: 1440px) {
  .wp-block-post-content.wp-block-post-content #dm-privacy {
    padding-top: calc(96px + var(--dm-5)) !important;
  }
}

/* ------------------------------------------------------------------ *
 * 101. THE FILTERED GALLERY WAS NOT A GRID, IT WAS SEVEN DIFFERENT SIZES.
 *
 * Unfiltered, the eight tiles are one uniform grid. Choose a category and they came back 845, 600
 * and 412px wide in the same two-column row - the page's main interaction, and the one state no
 * capture had ever been taken of, because a section screenshot does not click a chip.
 *
 * Section 78 already says `width: auto; max-width: none` on these. It matched, and it lost. Every
 * tile carries a generated `body.page-id-6 .wp-block-post-content #dc-59-2388 { max-width: 412px }`
 * at (1,2,1), and section 78's selector is `(0,5,0)` - five classes and an attribute, and not one
 * id, so an id beats all of it. This is the trap in HANDOFF section 2.3 for the ninth time, and the
 * measurement that finds it is `max-width` computing to 412px on a cell that is 600px wide.
 *
 * Restated at (1,4,0) - the same id the generated rule uses, plus four classes - which wins on
 * class count. All eight ids are named. Seven would have looked fixed on six of the four filters.
 * ------------------------------------------------------------------ */
@media (min-width: 1024px) {
  .wp-block-post-content.wp-block-post-content .dm-galgrid.is-filtering > #dc-59-2388,
  .wp-block-post-content.wp-block-post-content .dm-galgrid.is-filtering > #dc-59-2399,
  .wp-block-post-content.wp-block-post-content .dm-galgrid.is-filtering > #dc-59-2410,
  .wp-block-post-content.wp-block-post-content .dm-galgrid.is-filtering > #dc-59-2421,
  .wp-block-post-content.wp-block-post-content .dm-galgrid.is-filtering > #dc-59-2432,
  .wp-block-post-content.wp-block-post-content .dm-galgrid.is-filtering > #dc-59-2443,
  .wp-block-post-content.wp-block-post-content .dm-galgrid.is-filtering > #dc-59-2454,
  .wp-block-post-content.wp-block-post-content .dm-galgrid.is-filtering > #dc-59-2465 {
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
  }
}

/* ------------------------------------------------------------------ *
 * 102. THE GALLERY DOMAS CAN ADD TO.
 *
 * The eight photographs in the artboard are blocks in the page. Anything he uploads is rendered by
 * inc/gallery-cms.php as rows BELOW them - the mosaic itself is never touched, so 1440 stays
 * pixel-exact whether the gallery holds eight photographs or eighty.
 *
 * The rows are built from the mosaic's own vocabulary rather than repeating its composition: the
 * same 412 / 628 / 845 column widths, the same 21-22px gutters, the same band heights. Which row a
 * photograph lands in is chosen from ITS OWN shape, so a portrait gets a portrait slot and a
 * panorama gets a wide one - see domas_gal_layout().
 *
 * `aspect-ratio: var(--dm-ar)` is what makes one rule work at every width. At 1440 the row is
 * 1,278px wide and the ratio yields the artboard's band height exactly; below that the row narrows
 * and the height follows, with no breakpoint and no second set of numbers.
 *
 * The radius follows the mosaic: 40px at 1440, 16 below it, which is what section 30 already sets
 * on the eight - a 40px radius on a 350px-wide tile reads as a pill.
 * ------------------------------------------------------------------ */
.wp-block-post-content.wp-block-post-content .dm-xgal {
  display: flex !important;
  flex-direction: column !important;
  gap: 24px !important;
  margin-top: 24px !important;
}
.wp-block-post-content.wp-block-post-content .dm-xrow {
  display: grid !important;
  grid-template-columns: var(--dm-cols) !important;
  gap: var(--dm-gap, 21px) !important;
  aspect-ratio: var(--dm-ar) !important;
}
.wp-block-post-content.wp-block-post-content .dm-xtile {
  position: relative !important;
  overflow: hidden !important;
  border-radius: 16px !important;
  min-width: 0 !important;
  background: #131417 !important;
}
/*
 * ABSOLUTELY POSITIONED, and that is not decoration. `aspect-ratio` on the row sets a PREFERRED
 * height; content that is intrinsically taller still wins. An `<img>` in normal flow contributes
 * its natural height, and a percentage height against an auto-height parent resolves to auto - so
 * the first version rendered a 400px row at 533 and a 550px row at 1,025, each photograph at its
 * own full height. Taking the image out of flow removes it from the row's height calculation, and
 * the ratio then holds at every width.
 */
.wp-block-post-content.wp-block-post-content .dm-xtile img {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;   /* object-position is per photograph, set by the focal picker */
  display: block !important;
}
/* Hidden until "Daugiau akimirkų", and hidden by the filter when a row has nothing left in it. */
.wp-block-post-content.wp-block-post-content .dm-xrow--more,
.wp-block-post-content.wp-block-post-content .dm-xrow--empty { display: none !important; }
.wp-block-post-content.wp-block-post-content .dm-xgal.is-open .dm-xrow--more { display: grid !important; }
.wp-block-post-content.wp-block-post-content .dm-xgal.is-open .dm-xrow--empty { display: none !important; }

/* The same ghost control the gallery's other secondary button uses - one secondary button, section 53. */
.wp-block-post-content.wp-block-post-content .dm-xmore {
  align-self: center !important;
  min-height: 52px !important;
  padding: 0 32px !important;
  background: transparent !important;
  border: 1px solid rgba(255, 255, 255, .25) !important;
  border-radius: 9999px !important;
  color: #fff !important;
  font-family: "Montserrat", sans-serif !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  letter-spacing: .04em !important;
  text-transform: uppercase !important;
  cursor: pointer !important;
}
.wp-block-post-content.wp-block-post-content .dm-xmore:hover {
  border-color: #e22f2d !important;
  color: #e22f2d !important;
}

/*
 * BELOW 1440 THERE IS NO MOSAIC, SO THERE ARE NO ROWS EITHER.
 *
 * The row shapes are the artboard's composition and the artboard only exists at 1440. Everywhere
 * below it section 30 has already made the eight one uniform TWO-COLUMN SQUARE GRID - 135px tiles
 * at 320, 469px at 1024 - and a photograph Domas adds has to look like it belongs to that grid, not
 * like a different gallery bolted underneath. The first version rendered the eight as squares and
 * his as full-width 4:3, which is exactly what the operator saw.
 *
 * `display: contents` twice, so the tiles become grid items of THE SAME canvas the eight are in,
 * and then take section 30's own rules. The column gap is not copied - it cannot be, it is a
 * percentage that works out at 10px at 390 and 28.16 at 1280 - it is inherited by being the same
 * grid. Nothing to keep in sync and nothing to drift.
 */
@media (max-width: 1439.98px) {
  /*
   * SUBGRID, not `display: contents`. Flattening the container into the canvas grid was tried
   * first and put every added photograph at the TOP OF THE PAGE: the canvas places the eight by
   * explicit row, so auto-placed items take the earliest free cells, which are above the mosaic.
   * The tiles measured 170x170 in the right columns and the eye found them 1,228px too high.
   *
   * As a subgrid the block spans both canvas columns and inherits the tracks and the column gap
   * (`clamp(10px, 2.2vw, 32px)`) rather than restating them, so the added photographs land in the
   * same two columns as the eight and cannot drift out of them.
   */
  .wp-block-post-content.wp-block-post-content .dm-xgal {
    display: grid !important;
    grid-column: 1 / -1 !important;
    grid-template-columns: subgrid !important;
    /* `normal` so the subgrid takes the PARENT's column gap. Section 102's base rule sets
     * `gap: 24px` for the 1440 rows, and a specified gap overrides what subgrid would inherit -
     * which rendered 163px tiles on a 24px gutter beside the mosaic's 170px tiles on a 10px one. */
    column-gap: normal !important;
    row-gap: 0 !important;
    margin: 0 !important;
  }
  .wp-block-post-content.wp-block-post-content .dm-xrow { display: contents !important; }

  /* Section 30's rules for the eight, verbatim, so his are indistinguishable from them. */
  .wp-block-post-content.wp-block-post-content .dm-xtile {
    grid-column: auto !important;
    width: auto !important;
    height: auto !important;
    min-height: 0 !important;
    aspect-ratio: 1 / 1 !important;
    border-radius: 16px !important;
    margin: 0 0 var(--dm-1) 0 !important;
  }
  /* A hidden row must still be hidden once its children are promoted out of it. */
  .wp-block-post-content.wp-block-post-content .dm-xrow--more,
  .wp-block-post-content.wp-block-post-content .dm-xrow--empty { display: none !important; }
  .wp-block-post-content.wp-block-post-content .dm-xgal.is-open .dm-xrow--more { display: contents !important; }
  .wp-block-post-content.wp-block-post-content .dm-xgal.is-open .dm-xrow--empty { display: none !important; }

  /* The button is a grid item now, and belongs across the full width rather than in one cell.
   * The BOTTOM margin is what keeps it off "Sekti Instagram", which follows it immediately - the
   * two pills were touching, edge to edge, with a measured gap of 0 at 390 and at 768. Two separate
   * destinations stacked with no air between them read as one control. */
  .wp-block-post-content.wp-block-post-content .dm-xmore {
    grid-column: 1 / -1 !important;
    justify-self: center !important;
    margin: var(--dm-2) 0 var(--dm-3) !important;
  }
}

/*
 * AT 1440 NOTHING MOVES ON ITS OWN. Every block on this page is absolutely positioned inside a
 * container of a fixed height, so extra rows would render on top of the Instagram button. The three
 * measurements come from PHP (`#dm-gal-metrics`): where the mosaic ends, how tall the visible rows
 * are, and how tall they all are once "Daugiau akimirkų" is pressed.
 *
 * `padding-bottom` grows the canvas rather than `height`, so the generated 2,964px is never
 * restated here - if the artboard changes, this still works.
 */
@media (min-width: 1440px) {
  body.page-id-6 .wp-block-post-content.wp-block-post-content .dm-xgal {
    position: absolute !important;
    top: var(--dm-gal-top) !important;
    /*
     * CENTRED, not pinned. `left: 81px` is the mosaic's position at 1440 and ONLY at 1440 - above
     * it the canvas grows and grid.css shifts the content column to keep it centred, so the mosaic
     * runs 161..1439 at 1600 and 641..1919 at 2560 while a pinned block stays at 81. That is 560px
     * out at 2560, and it is the exact thing the operator said must never be hard-coded.
     *
     * `left: 0; right: 0` with a definite width and auto margins centres in whatever the canvas
     * happens to be, which is where the mosaic is at every one of those widths.
     */
    left: 0 !important;
    right: 0 !important;
    width: 1278px !important;
    margin: 0 auto !important;
    z-index: 6 !important;
  }
  body.page-id-6 .wp-block-post-content.wp-block-post-content .dm-xtile { border-radius: 40px !important; }

  /*
   * THE SHIFT IS SIGNED, and that is the whole difference from the first version.
   *
   * It was a padding, which can only make the page longer - fine for photographs Domas ADDS. But a
   * filter makes the mosaic SHORTER: choose TRENIRUOTĖS and four slots fill instead of eight, the
   * mosaic ends 798px higher, and nothing below it moves because nothing here is in normal flow.
   * That was 590px of black above the Instagram button.
   *
   * So the button and the footer are translated by a value that can go either way, and the canvas
   * is set outright rather than padded. All four elements up the chain carry the height - the same
   * thing the privacy page's footer needed - or the page keeps its old length regardless.
   *
   * The 2964px fallback is the artboard's own canvas and is only ever used when the gallery holds
   * no photographs at all, where it is exactly right. It is declared as DOMAS_GAL_CANVAS in
   * inc/gallery-cms.php and asserted by tools/gallery-check.mjs.
   */
  body.page-id-6,
  body.page-id-6 .wp-site-blocks,
  body.page-id-6 .wp-site-blocks > .wp-block-group,
  body.page-id-6 .wp-block-post-content.wp-block-post-content {
    height: var(--dm-gal-canvas, 2964px) !important;
  }
  body.page-id-6 .wp-block-post-content.wp-block-post-content #dc-59-2476,
  body.page-id-6 .wp-block-post-content.wp-block-post-content #dc-105-774 {
    transform: translateY(var(--dm-gal-shift, 0px)) !important;
  }
}

/* ------------------------------------------------------------------ *
 * 103. REMOVED - filtering no longer re-flows anything.
 *
 * This section collapsed the added rows into one even grid while a chip was on, because the chips
 * hid tiles in the browser and a part-emptied row left a hole. Filtering is a page load now
 * (`?kategorija=`), rendered by the same PHP that renders the unfiltered gallery, so a filtered row
 * is simply a row with fewer photographs in it and there is nothing to collapse.
 *
 * The rules it held are gone rather than left dormant: a superseded block that still matches is how
 * a later fix silently does nothing, three times in this file's history.
 * ------------------------------------------------------------------ */

/* ------------------------------------------------------------------ *
 * 104. AT 1440 THE CHIPS HAD NO VISIBLE STATE AT ALL.
 *
 * Below 1440 section 27 makes them pills and fills the chosen one red. At 1440 they are the
 * artboard's own row of labels, and the artboard draws MOTOKROSAS in red because it is showing what
 * a CHOSEN chip looks like. At rest that is correct. The moment anything is chosen it is a lie:
 * `aria-pressed` flips, the grid re-flows, and the chips do not move - so you click ENDURO, ENDURO
 * looks exactly like its neighbours, and MOTOKROSAS still looks like the one that is on.
 *
 * Found while checking that the filter gathers the photographs; nothing reported it, because every
 * check this build has asks whether a control WORKS, not whether it looks like it did anything.
 *
 * Scoped to `body.dm-gal-filtered`, which the SERVER sets only while a category is being shown, so the default
 * state is the artboard untouched and the 1440 diff does not move.
 *
 * The chosen chip takes the artboard's own red - #dc2626, the colour it draws MOTOKROSAS in - and
 * the rest take the grey it draws the others in. The ICONS keep their baked colours, with one
 * exception: MOTOKROSAS's bike is a red asset, and leaving it red beside a grey label while ENDURO
 * is chosen is the same contradiction in miniature, so it desaturates with its label. Recolouring
 * all four would need a mask per asset for no gain - the red label is what marks the choice.
 * ------------------------------------------------------------------ */
/*
 * STATED AT THE CHIP'S OWN ID, because every one of them carries a generated
 * `body.page-id-6 #dc-59-2352{color:#d6d6d7!important}` at (1,1,1) - and the first version of this
 * was (0,5,1), five classes and an attribute with no id at all. It matched, it was !important, and
 * it lost. All four ids are named; three would have left one chip that never lights up.
 */
@media (min-width: 1440px) {
  body.dm-gal-filtered .wp-block-post-content.wp-block-post-content #dc-59-2324,
  body.dm-gal-filtered .wp-block-post-content.wp-block-post-content #dc-59-2336,
  body.dm-gal-filtered .wp-block-post-content.wp-block-post-content #dc-59-2352,
  body.dm-gal-filtered .wp-block-post-content.wp-block-post-content #dc-59-2358 {
    color: rgb(214, 214, 215) !important;
  }
  body.dm-gal-filtered .wp-block-post-content.wp-block-post-content #dc-59-2324[aria-pressed="true"],
  body.dm-gal-filtered .wp-block-post-content.wp-block-post-content #dc-59-2336[aria-pressed="true"],
  body.dm-gal-filtered .wp-block-post-content.wp-block-post-content #dc-59-2352[aria-pressed="true"],
  body.dm-gal-filtered .wp-block-post-content.wp-block-post-content #dc-59-2358[aria-pressed="true"] {
    color: #dc2626 !important;
  }
  /* MOTOKROSAS's bike is a red asset. Left red beside a grey label while ENDURO is chosen it is
   * the same contradiction in miniature, so it desaturates with its label and comes back with it. */
  body.dm-gal-filtered .wp-block-post-content.wp-block-post-content figure:has(> #dc-59-2313) img {
    filter: grayscale(1) opacity(.85) !important;
  }
  /* (motokrosas is the "everything" chip now and is never the filtered state, so the
   * red bike only ever needs desaturating - never restoring - while a chip is on.) */

  /*
   * AND THE UNDERLINE, which is the last thing still pointing at the wrong chip. The artboard draws
   * a 162px red rule under MOTOKROSAS - it spans the icon and the label together, from the icon's
   * left edge (x=80) to the end of the word (242) - and it is a fixed element that does not move.
   * With the label and icon corrected it was the only thing left saying MOTOKROSAS was chosen.
   *
   * Hidden while a chip is on, and redrawn on whichever chip is pressed: -32px reaches back over
   * the 20px icon and its 12px gap, and 25px below the label's box is where the artboard puts it.
   */
  /* NO `position: relative` here. At 1440 every block on this page is absolutely positioned,
   * including these four - so relative pulled them out of their artboard coordinates and the row
   * collapsed into overlapping labels and icons. An absolutely positioned element is already a
   * containing block for its own pseudo-element; nothing needs to be added. */
  body.dm-gal-filtered .wp-block-post-content.wp-block-post-content #dc-59-2324[aria-pressed="true"]::after,
  body.dm-gal-filtered .wp-block-post-content.wp-block-post-content #dc-59-2336[aria-pressed="true"]::after,
  body.dm-gal-filtered .wp-block-post-content.wp-block-post-content #dc-59-2352[aria-pressed="true"]::after,
  body.dm-gal-filtered .wp-block-post-content.wp-block-post-content #dc-59-2358[aria-pressed="true"]::after {
    content: "" !important;
    position: absolute !important;
    left: -32px !important;
    right: 0 !important;
    bottom: -25px !important;
    height: 2px !important;
    background: #dc2626 !important;
  }
  body.dm-gal-filtered .wp-block-post-content.wp-block-post-content #dc-59-2312 { opacity: 0 !important; }
}

/* ------------------------------------------------------------------ *
 * 105. THE FULL-BLEED SEPARATORS STOPPED 240px SHORT OF BOTH EDGES AT 1920.
 *
 * Sixteen of them, on six pages. Every one is a 1440x1 SVG, and above the artboard its BOX grows
 * with the viewport while its INK does not: measured at 1920, `#dc-59-2157` occupies 0..1920 and
 * paints 240..1679. A rule that is supposed to run edge to edge instead floats in the middle with
 * 240px of nothing at each end - and because the content column is centred but 1,312 wide, the ink
 * did not line up with the content either. It matched nothing at all.
 *
 * `object-fit: fill` is ALREADY on all sixteen and does not help. That governs how the replaced
 * element fills its box; the SVG's own `preserveAspectRatio` then maps the viewBox INSIDE that, and
 * its default is `xMidYMid meet` - uniform scale, centred. A 1440-wide viewBox in a 1920 box scales
 * by min(1920/1440, 1/1) = 1 and is centred. That is the 240px, exactly.
 *
 * Editing the SVGs to carry `preserveAspectRatio="none"` would also work and would be wrong here:
 * the pipeline owns `assets/` and overwrites it. So the BOX carries the colour instead. The SVG
 * paints the middle 1,440 and the background paints the whole width, in the same colour and behind
 * the same element opacity, so the two are one continuous line. At 1440 the box is 1,440, the ink
 * is 1,440, and nothing changes - the artboard is untouched.
 *
 * Stated at (1,2,1) because site.css sets `background-color: transparent !important` on each of
 * them at (1,0,0).
 * ------------------------------------------------------------------ */
@media (min-width: 1441px) {
  /* the home stat band, top and bottom */
  .wp-block-post-content.wp-block-post-content img#dc-59-2157,
  .wp-block-post-content.wp-block-post-content img#dc-59-2158 {
    background-color: #e22f2d !important;
  }
  /* apie-doma, either side of its figures */
  .wp-block-post-content.wp-block-post-content img#dc-59-1796,
  .wp-block-post-content.wp-block-post-content img#dc-59-1797 {
    background-color: #1a060a !important;
  }
  /* apie-doma, under the quote */
  .wp-block-post-content.wp-block-post-content img#dc-59-1855 {
    background-color: #260911 !important;
  }
  /* every white separator, across six pages */
  .wp-block-post-content.wp-block-post-content img#dc-103-400,
  .wp-block-post-content.wp-block-post-content img#dc-105-645,
  .wp-block-post-content.wp-block-post-content img#dc-105-775,
  .wp-block-post-content.wp-block-post-content img#dc-103-333,
  .wp-block-post-content.wp-block-post-content img#dc-59-1240,
  .wp-block-post-content.wp-block-post-content img#dc-59-1241,
  .wp-block-post-content.wp-block-post-content img#dc-59-1904,
  .wp-block-post-content.wp-block-post-content img#dc-59-2090,
  .wp-block-post-content.wp-block-post-content img#dc-59-2091,
  .wp-block-post-content.wp-block-post-content img#dc-105-561,
  .wp-block-post-content.wp-block-post-content img#dc-59-1546 {
    background-color: #fff !important;
  }
}

/* ------------------------------------------------------------------ *
 * 106. THE PRIVACY PAGE HAD 266px OF NOTHING ABOVE ITS FOOTER.
 *
 * Measured across all seven at 1440 AND 1920, the gap between the last line of content and the top
 * of the footer is 19 / 74 / 96 / 106 / 112 / 120 - and 266 on this one. Two and a half times its
 * nearest sibling, on the page with the least in it, which is where a void shows most.
 *
 * The cause is the page borrowing apie-doma's chrome. At 1440 and above every block is absolutely
 * positioned, so the footer sits at apie-doma's own y=1585 whatever is above it; apie-doma's
 * content reaches 1479 and this page's reaches 1319. The 160px difference is the whole defect.
 *
 * `translateY` moves the footer, and a NEGATIVE MARGIN on the canvas takes the same 160px off the
 * page - so the void does not simply reappear below the footer. The margin is what avoids restating
 * the generated canvas height here; `height: calc(<that number> - 160px)` would work and would go
 * stale the moment the artboard changes.
 *
 * Scoped to `dm-page-privatumo-politika`, not to a page id: this page declares `page-id-5` on
 * purpose so it can reuse that header and footer, so a page-id selector would move apie-doma's
 * footer too.
 * ------------------------------------------------------------------ */
@media (min-width: 1440px) {
  body.dm-page-privatumo-politika .wp-block-post-content.wp-block-post-content #dc-105-644 {
    transform: translateY(-160px) !important;
  }
  /*
   * AND THE CANVAS COMES DOWN WITH IT, or the void simply moves below the footer - which is what
   * the first attempt did. A negative margin on the content was not enough: the generated height
   * is set on FOUR elements up the chain (`.entry-content`, its group, `.wp-site-blocks`, `body`),
   * so the page stayed 1,916 tall with 160px of empty ground under the copyright.
   *
   * 1,756 is the footer's own bottom edge once lifted, and on every other page the footer band ends
   * exactly at the page bottom - apie-doma is 1,916 and its footer ends at 1,916. Re-measure this
   * with `.probe/footgap.mjs` if the artboard ever changes; the tell is a gap here that is not ~106.
   */
  body.dm-page-privatumo-politika,
  body.dm-page-privatumo-politika .wp-site-blocks,
  body.dm-page-privatumo-politika .wp-site-blocks > .wp-block-group,
  body.dm-page-privatumo-politika .wp-block-post-content.wp-block-post-content {
    height: 1756px !important;
  }
}

/* ------------------------------------------------------------------ *
 * 107. THE "COULD NOT SEND" NOTICE, AND ITS LINK.
 *
 * New on 2026-09-10, with the failure state itself. The notice carries a `mailto:` so the enquiry
 * is not simply lost when the host cannot send - and that anchor arrived in the browser's own
 * #0000EE, underlined, which is precisely what `.probe/uastyled.mjs` exists to catch. It only ever
 * renders on `?dm_sent=mailfail`, which is a state no sweep visits by accident, so it would have
 * shipped looking like a 1996 hyperlink on the one screen a visitor sees when something is wrong.
 *
 * Same treatment as the consent line under the submit button (section 93), because it is the same
 * kind of thing: a quiet sentence with one link in it.
 * ------------------------------------------------------------------ */
.wp-block-post-content.wp-block-post-content .dm-form__note--err a {
  color: #fff !important;
  text-decoration: underline !important;
  text-underline-offset: 2px !important;
  text-decoration-color: rgba(255, 255, 255, .4) !important;
}
.wp-block-post-content.wp-block-post-content .dm-form__note--err a:hover {
  text-decoration-color: #e22f2d !important;
}

/* ------------------------------------------------------------------ *
 * 108. WORDPRESS 7.1 MADE THE COVER'S INNER CONTAINER A CONTAINING BLOCK.
 *
 * Found on the live site 2026-09-10, an hour after launch, by looking at the hero: "BUTKUS" sat
 * 423px below "DOMAS" instead of directly under it, and the subtitle and tagline had been pushed
 * out of view with it. Every automated check was green while that was on screen.
 *
 * It is not our CSS. WordPress changed the core cover block between the version this was built
 * against and the version the client's host runs:
 *
 *   6.7.2  .wp-block-cover__inner-container { color:inherit; width:100%; z-index:1 }
 *   7.1    .wp-block-cover__inner-container { color:inherit; position:relative; width:100% }
 *
 * `z-index:1` became `position:relative`. It reads as a tidy-up - the inner container is a flex
 * child of `.wp-block-cover`, so z-index applied to it even while static, and relative is the more
 * conventional way to write that. But `position:relative` also makes the element a CONTAINING BLOCK,
 * and at 1440 this design absolutely positions every hero element against the COVER. Measured on
 * domasbutkus.lt: the inner container sits at top=423 left=16 inside its cover, so `top:308px`
 * rendered at 731 and `left:110px` at 126 - the whole hero displaced by exactly that offset.
 *
 * Restores the 6.7 declaration verbatim. `z-index:1` is kept because that is what did the work
 * there, and it still applies: the inner container is a flex item, and z-index applies to flex
 * items regardless of position.
 *
 * `!important` is deliberate. Core's rule is (0,1,0) and so is this one, so on source order alone
 * ours already wins - but the host runs LiteSpeed with CSS combining available, and a rule whose
 * correctness depends on staying last in the file is a rule waiting to break when someone ticks a
 * checkbox in a caching plugin.
 *
 * SCOPE: 7 cover blocks over 3 pages - the home hero, kontaktai's, and all five on pasiekimai.
 * ------------------------------------------------------------------ */
.wp-block-cover__inner-container {
  position: static !important;
  z-index: 1;
}

/* ------------------------------------------------------------------ *
 * 109. TWO BANDS THAT ONLY LOOK WRONG ABOVE THE ARTBOARD.
 *
 * Reported 2026-09-11 from a wide monitor. Both are the same mistake in two shapes: an element that
 * is measured against the VIEWPORT sitting beside an element measured against the CONTENT COLUMN.
 * At 1440 those are the same number, so neither was visible, and the wide audit had already logged
 * the first one as "faithful, not a defect" - a verdict taken at 1440, where it is true.
 *
 * A. partnerystes, the KVIEČIAME PRISIJUNGTI band. The photograph #dc-59-2124 is absolutely
 *    positioned at `left: 449px; width: 966px` inside a section that runs from 48px to the viewport
 *    edge. At 1440 that puts its right edge at `right: -23px` - 23px PAST the section, so it reads
 *    as bleeding off the screen, which is what the artboard draws. At 2560 the section is 2512 wide
 *    and the same 966px photograph computes to `right: 537px`: it stops at a hard vertical edge
 *    with half a metre of dead black beyond it. Measured: 1057..2023 in a band ending at 2560.
 *
 *    So the photograph is widened to reach the artboard's own overflow point. `object-fit: cover`
 *    is already on the element, so the extra width crops the frame rather than stretching the rider.
 *
 *    `right: -23px; width: auto` was the obvious expression of that and it does NOTHING. An
 *    absolutely positioned REPLACED element - an <img> - resolves `width: auto` to the image's
 *    INTRINSIC width, never to the gap between left and right. The box is then over-constrained and
 *    `right` is discarded silently. Measured before and after the attempt: photograph 1057..2023,
 *    unchanged, with `right` computing to the -23px I had asked for and the width still 966.
 *
 *    So the width is stated instead. The photograph sits at `left: 449px` plus half the surplus
 *    over 1440, inside a section running 48px..viewport, and has to reach viewport+23. That solves
 *    to `50vw + 246px`: 966px at 1440 - the artboard's own number - and 1526px at 2560. Using
 *    `vw` rather than a percentage is deliberate: where a classic scrollbar makes `100vw` wider
 *    than the content box the photograph overshoots, which bleeds further off-screen and is
 *    invisible. Undershooting is what leaves the black edge, so the error must fall this way.
 *
 * B. pasiekimai, the four-statistic band. Its horizontal hairlines #dc-59-1240 and #dc-59-1241 are
 *    full-bleed - `left: 0; width: 100vw` - while the vertical dividers between the figures sit in
 *    the 1440 content column. Above the artboard the hairlines therefore run on past the outermost
 *    vertical line at both ends, and the empty black they enclose reads as a fifth and sixth cell.
 *    The operator: "after the last vertical lines there's not supposed to be any continuation of
 *    the boxes. So there should only be 4 boxes."
 *
 *    Centring them on 1440 makes both ends of the band land exactly on a vertical divider. At 1440
 *    `left: 50%` minus half of 1440 is 0, so this is a no-op on the artboard - which the pixel diff
 *    has to confirm rather than be assumed.
 * ------------------------------------------------------------------ */
@media (min-width: 1441px) {
  body.dm-page-partnerystes .wp-block-post-content #dc-59-2124 {
    width: calc(50vw + 246px) !important;
  }

  body.dm-page-pasiekimai .wp-block-post-content #dc-59-1240,
  body.dm-page-pasiekimai .wp-block-post-content #dc-59-1241 {
    left: 50% !important;
    transform: translateX(-50%) !important;
    width: 1440px !important;
  }
}
