/* Kauno gidas — native-layout port (DB pages 10 / 11).
   apglebk.css and blocks.css are NOT edited (other agents work in them in
   parallel); the three rules this port needs live here.

   1) .kaunas-main-content is now a direct child of the constrained
      .kaunas-guide-page-wrapper, so core clamps it to the 1264 rail. Core
      writes that clamp inside :where() (zero specificity), so apglebk.css's
      `.kaunas-main-content { max-width: 1280px }` would win and the rail would
      come out 80/1280 instead of 88/1264. Restate the cap as the layout's own
      content size so core's value is what applies.

   2) (retired) the extra 20px mobile padding inherited from .ap-container was
      dropped on 5 Sep 2026 so the guide's copy sits on the shared gutter.

   3) Two classes on this page match the verifier's *-wrapper ban and are raw
      <div>s inside wp:html (so they are not exempted as block-layout
      elements). They are not width wrappers, so the page content was renamed
      and their rules are restated here verbatim from apglebk.css:
        .kaunas-back-wrapper         -> .kaunas-back-row
        .kaunas-route-finder-wrapper -> .kaunas-route-finder-grid
      The originals stay in apglebk.css, simply unused by this page. */

.kaunas-main-content {
    max-width: var(--wp--style--global--content-size);
}

@media (max-width: 640px) {
    /* blocks.css zeroes the wrapper's horizontal padding at <=640 with
       !important. Before the port the rail came from .ap-container's
       width:min(), so that was harmless; now the wrapper's global padding IS
       the rail, and zeroing it puts the guide column on 0..402 instead of
       41..361. Give the gutter back (same value core would have used). */
    .kaunas-guide-page-wrapper {
        padding-left: var(--wp--style--root--padding-left) !important;
        padding-right: var(--wp--style--root--padding-right) !important;
    }
    /* The 20px inner padding that used to sit on .ap-container here is gone:
       guide copy now sits on the shared 41px mobile gutter like every page. */
}

.kaunas-back-row {
    margin-bottom: 1.5rem;
}

.kaunas-route-finder-grid {
    display: grid;
    grid-template-columns: 1.2fr 1fr;
    gap: 2.5rem;
    align-items: center;
    background: #F3F4F1;
    border-radius: 24px;
    padding: 2.5rem;
    margin-bottom: 2.5rem;
}

@media (max-width: 992px) {
    .kaunas-route-finder-grid {
        grid-template-columns: 1fr;
    }
}

/* The curved banner is a rail-width rounded card at every width (owner's
   call, 5 Sep 2026): on mobile it sits on the 41px gutter with the same 28px
   corners as the events hero card, instead of the full-bleed band the Figma
   mobile frame showed. blocks.css and apglebk.css still carry the old
   full-bleed/0-radius mobile rules with !important; override them here. */
@media (max-width: 768px) {
    .kaunas-guide-page-wrapper > .kaunas-curved-banner {
        margin-left: auto !important;
        margin-right: auto !important;
        border-radius: 28px !important;
        padding-left: 1rem;
        padding-right: 1rem;
    }
}