/* GetnDrive Visual Rebrand — regional Cars landing reading layout. v0.2.10.36 * * Enqueued by getndrive_visual_rebrand_enqueue_assets() ONLY when * getndrive_visual_rebrand_is_regional_cars_landing_request() is true: a Regional Routing * DESTINATION Cars route (`/{en|ru}/{country}/{destination}/cars/` of a live region). That is * route-gated, not query-gated, so these rules also load on a dated Cars result page, where the * same regional information is still on the page below the results. They are NOT loaded on the * homepage, country-level Cars routes, any Motorbikes route, vehicle unit pages, legacy * `/car-rental/` catalog routes, Partner pages, wp-admin/CRM or the Rental Map. * * Kept out of getndrive-visual-rebrand-pass.css on purpose: that stylesheet is SHA-frozen by the * rendered-evidence checkers, and no other route needs these rules. */ /* ===================================================================== Regional Cars landing layout — v0.2.10.16 (ADR-208), first-screen and post-catalog rhythm v0.2.10.17 (ADR-209), one template for all eight destinations v0.2.10.18 (ADR-210) Scope: the eight live Thailand destination Cars routes and their dated result pages, EN/RU. Since Regional Routing 0.3.13 all eight carry an approved Hero (Bangkok, Koh Samui, Phuket, Pattaya, Hua Hin, Krabi, Koh Phangan, Chiang Mai), so every clean page opens Hero -> search form, and the Hero stylesheet owns that first screen. Nothing here styles a Hero. WHAT THIS FILE OWNS A. The search form stays in normal flow (0.2.10.17). Its desktop sticky rail is released per route by the server flag the script reads, and the two rules below are the stylesheet half of the same contract, so the form can never become a fixed overlay over the catalog, the category cards, the region text or the FAQ on these routes even with a stale cached script. Nothing about the form's fields, autocomplete, validation, dates, submission or URL handling is touched, and no other route is affected (this file does not load there). B. Retired in 0.2.10.18. The `order` rules that put the search form above the heading on the four destinations that had no Hero are gone: no live destination renders that presentation any more. A page whose Hero fails closed (missing asset, disabled entry) keeps the catalog's own default order from the main stylesheet — a usable page, never a broken Hero — and a dated page keeps the dated-search pass's order. C. The post-catalog reading section: the same centred public CONTENT rail as the Hero copy (`--gnd-public-content`, <= 1180px) instead of the extra-wide catalog rail. Since 0.2.10.35 (Nik's review of the Krabi/Bangkok prototype; ADR-229 amendment) it is ONE editorial rule for every market state — populated, empty and safe_unknown: the overview, the practical notes and the FAQ share one centred reading axis, `min(100%, 50rem)` = 800px, with left-aligned text, headings and hairlines filling that axis; the overview paragraphs follow one another, the four notes are four open items in sequence, and the FAQ is one open vertical list with every question directly above its own answer; each block title carries a short teal mark. It replaces the 0.2.10.16-0.2.10.34 left-aligned 512px measure, the 2 x 2 notes, and the partner_recruitment-only overview columns, FAQ width and rhythm (H3, I3, I4, J), which are removed, not overridden. No accordion, no JavaScript, every answer in the HTML and on screen. D. The catalog's own "What happens after you choose a car" block is put on that same rail (0.2.10.17), so the page ends on one column instead of a full-width card under a full-width catalog. Presentation only: its markup, its title and its four lines are Vehicles' and untouched. E. The empty destination state (0.2.10.22, R1). When a destination has no published cars, Vehicles renders one `--empty-region` section holding a single `__results` box with an H2 and one sentence. The frozen main stylesheet paints that box as the tinted sea-wave results band, because the Cars-only `--plain` override is not loaded when there are no records. This file resets that inner box to a plain statement on the reading rail, keeps one quiet hairline under it, caps the note at the same readable measure the regional section uses, and steps the H2 down to the regional title scale. From 768px the box is centred on the viewport at the reading rail's own width, so its left edge is the regional column's left edge at every desktop width and not the inner edge of the padded Vehicles catalog card it sits in (Codex F2). Since 0.2.10.23 the empty state's OWN outer catalog section is plain as well: no card background, border, radius or padding behind the message (the live smoke still showed the pale rounded panel). Copy and markup are Vehicles' and untouched, the outer card keeps its surface in every state that has records, and nothing here knows how many records exist: the rules apply only when Vehicles itself rendered `--empty-region`. F. The partner-recruitment block (0.2.10.22, R2). Routing renders it only in the `partner_recruitment` market state. Its lead and its benefits list are held to the same shared reading measure as the overview and the FAQ, and the benefits run one column below 768px and exactly two from 768px — the practical-notes pattern — instead of spreading to three `auto-fit` tracks across the rail. Its surface, its CTA, its copy and its position are Routing's and the main stylesheet's, and are not touched here. Since 0.2.10.23 the card itself is held to that same measure, so it wraps its content on the column's left edge instead of running the full reading rail with an empty field to the right. G. The catalog-slot partner-recruitment section (0.2.10.31, ADR-229). When a destination has no publicly eligible cars and Market Context is `partner_recruitment`, Vehicles asks Routing for one section and puts it in the catalog slot inside a `--catalog-recruitment` root. Vehicles does so ONLY when this build declares the `regional-cars-catalog-recruitment` style capability AND this file is enqueued, so these rules can never be missing where the section is. One restrained white surface on the catalog rail: hairline border, the soft shadow token, an 8px radius, no image. Each text column is held to `min(var(--gnd-public-readable), 32rem)`; `--gnd-rcl-measure` is the Routing section's token and does not reach the catalog slot. Below 1024px one column in DOM order (status, H2, body, three points, full- width CTA); from 1024px two columns by grid areas — status/H2/body/CTA left, the points right — without reordering the DOM. Copy, CTA URL and whether the section exists are Routing's and Vehicles'. Since 0.2.10.33 only the root reset stays here; the section itself is presented by family I. H. The empty destination composition (0.2.10.32, Nik's 2026-09-27 review of the live Krabi page; ADR-229 amendment). Only in Routing's `partner_recruitment` market state — the regional section's own `data-gnd-market-state` attribute, and the recruitment section, which Routing renders only in that state. From 768px the recruitment card sits on the regional content rail instead of the wider catalog rail; from 1024px it is two zones (status, H2, body and the one CTA; the three points behind a 1px divider) and shorter. From 1024px the overview's two paragraphs and the four FAQ items use the practical notes' two columns and gap, so the right half of the rail is no longer empty; each FAQ item keeps its own separator. Less white under the FAQ. Populated pages, `safe_unknown`, Motorbikes, country pages, hubs and `/car-rental/` are untouched (the state or the section is absent, or the file is not loaded). No copy, markup, order, heading or link changes. Since 0.2.10.33 the white two-zone card (H2) and the 2 x 2 FAQ (H4) are superseded by family I; since 0.2.10.35 the overview columns (H3) are superseded by C's shared axis. Only H1 remains. I. The editorial invitation and the vertical FAQ (0.2.10.33, Nik's review of the installed 0.2.10.32 page; ADR-229 amendment). Same scope as H. The recruitment section becomes two audiences in one container: the no-cars status stays a short statement on the page for travelers, and the invitation to rental businesses sits on ONE brand-navy panel (the footer's navy) with a white H2, the three approved facts on a quiet route line, and one teal CTA. Copy, markup, DOM and focus order, the CTA URL and the number of headings, facts and links are unchanged. Its FAQ rule (I3) and chapter rhythm (I4), and family J's empty-state FAQ width (0.2.10.34), are superseded in 0.2.10.35 by C's shared editorial axis, which gives every state the rhythm and the teal title mark I4 introduced. Deliberately restrained, per DESIGN.md: hairline separators, no nested cards, no card wall, no shadows, no side stripes, no oversized radii, no decorative icons, no gradients, no glass, no animation. Family I's navy panel is the one deliberate surface on the page's white, flat and without a shadow; C's short teal title mark is the one ornament. The section stays visually subordinate to finding a vehicle: the block titles step DOWN from the catalog/Hero scale rather than up. Every text container keeps `min-width: 0` and `overflow-wrap: anywhere` so a long Russian compound can never force page-level horizontal scrolling at 360px. ===================================================================== */ /* -- A. the search form is a normal-flow section, never an overlay -------- */ /* The desktop rail is released for these routes by `window.gndRentalStickyRail = false` (printed inline before getndrive-homepage-v2.js by the same route gate that enqueues this file), so the stuck classes are never written here. These two rules are the stylesheet half of that contract: should the class ever be written anyway — a cached script, a future regression — the rail still stays in flow and the reserved hole still collapses, because an `!important` author declaration outranks the inline height the script would set. */ body.getndrive-visual-rebrand.gnd-public-rental-shell .sch-rental-page--request .sch-rental-hero__form.is-rental-stuck { position: static !important; top: auto !important; left: auto !important; z-index: auto !important; width: 100% !important; transform: none !important; } body.getndrive-visual-rebrand.gnd-public-rental-shell .sch-rental-page--request .gnd-rental-sticky-shell.is-rental-stuck-shell { height: auto !important; min-height: 0 !important; } /* -- D. post-catalog block on the reading rail ---------------------------- */ /* "What happens after you choose a car": kept exactly as the catalog renders it — same markup, same title, same four lines, same compact card — but held to the reading rail instead of the 2000px catalog rail, so it stays visually subordinate to the catalog above it and the page ends on one column. The category cards ABOVE the grid (`--lead`) are deliberately not touched. */ body.getndrive-visual-rebrand.gnd-public-rental-shell .sch-demo-vehicles .sch-demo-vehicles__presearch--tail { box-sizing: border-box !important; width: 100% !important; /* The catalog section already centres its own content box, so capping at the reading token and re-centring lands this block on the same rail as the regional section below it wherever the catalog rail is the wider of the two. `100%` keeps it inside the section's padding at the widths where the catalog rail is already narrower than the token. */ max-width: min(var(--gnd-public-content), 100%) !important; margin-left: auto !important; margin-right: auto !important; } /* -- E. the empty destination state: a calm statement, not a band --------- */ /* * The OUTER catalog surface (0.2.10.23). Vehicles renders the empty message inside the same * `.sch-demo-vehicles--search-first` section that every catalog state uses, and that section paints * itself as the catalog card — `#f7f8fa`, `1px solid #e5e7eb`, an 8px radius and `32px 24px` padding * from Vehicles' own stylesheet; the main Rebrand stylesheet only trims its top. With the inner band * gone (R1) that card was the last surface left behind one heading and one sentence, and on the live * empty destinations it still read as a large pale rounded panel between the search form and the * regional information. * * Ownership, checked in the rendered DOM: the search form (`#rental-request`) is NOT inside this * section. It lives in the `.sch-rental-hero` block that precedes the catalog section as a sibling, so * resetting the empty section's own surface cannot touch the form. The selector carries * `--empty-region`, the class Vehicles adds ONLY when the destination has no published cars, so the * full and sparse catalogs — which never carry it — keep their card exactly as before, and nothing * here reads inventory. Four declarations, each `!important` because the main stylesheet trims the * section's top padding with `!important`: the surface, all four borders, the radius and the padding. * The section's width and centring stay the main stylesheet's; the inner box still centres itself on * the reading rail (below) and still keeps its one bottom hairline as the transition into the regional * information. No shadow is declared because none exists to clear; the browser evidence asserts the * computed `box-shadow: none`. */ body.getndrive-visual-rebrand.gnd-public-rental-shell .sch-demo-vehicles.sch-demo-vehicles--empty-region { background: transparent !important; border: 0 !important; border-radius: 0 !important; padding: 0 !important; } /* * `--empty-region` is rendered by Vehicles only when the destination has no published cars, so this * family needs no count, no inventory read and no market state: it styles what Vehicles actually * rendered. The frozen main stylesheet paints EVERY `.sch-demo-vehicles__results` as the tinted * sea-wave band with `background`, `border`, `border-radius` and `padding`, each `!important` * (getndrive-visual-rebrand-pass.css:9999 and :10762). The Cars-only `--plain` override that keeps * the full and small catalogs flat is not enqueued when there are no records, so the empty page was * the ONLY state with a coloured, rounded card behind one heading and one sentence. * * This rule is the override, not an edit: the main stylesheet stays byte-identical. The selector * carries the two empty-state classes as well as the shell, so it outranks the frozen selector, and * the four reset declarations repeat `!important` because a plain declaration cannot beat one. * * `background: transparent` clears the gradient too: the shorthand resets `background-image` along * with the colour. `border: 0` clears all four sides FIRST, and the bottom hairline is declared * AFTER it as a longhand, so top, left and right stay at 0 and only the one documented separator * survives. That hairline is the only border this family may declare, and it is a real border: no * pseudo-element, no generated content, no shadow, no outline, no background image. * * The space between the sentence and the hairline is the note's own bottom margin (the frozen * `__results-head p` rule, 18px !important), not padding, so the box stays at zero padding. */ body.getndrive-visual-rebrand.gnd-public-rental-shell .sch-demo-vehicles.sch-demo-vehicles--empty-region .sch-demo-vehicles__results { box-sizing: border-box !important; width: 100% !important; /* The same reading rail the post-grid tail takes, so the empty statement reads as the first item of the regional column below it rather than as a catalog-width banner. Below 768px this cap is the whole contract; from 768px the breakpoint rule at the end of this file re-centres the box on the viewport, because `100%` here is the padded Vehicles card's content box, not the rail. */ max-width: min(var(--gnd-public-content), 100%) !important; margin-left: auto !important; margin-right: auto !important; background: transparent !important; border: 0 !important; border-radius: 0 !important; padding: 0 !important; border-bottom: 1px solid var(--gnd-line) !important; } /* One step DOWN to the regional title scale: the same clamp the section's own block titles use, so the empty statement never reads as a second Hero above the region text. */ body.getndrive-visual-rebrand.gnd-public-rental-shell .sch-demo-vehicles.sch-demo-vehicles--empty-region .sch-demo-vehicles__results-head h2 { font-size: clamp(20px, 1.6vw, 26px); line-height: 1.25; } /* * The note takes the same readable measure as the regional prose, written out rather than taken * from `--gnd-rcl-measure`. That token is declared on the Routing section, which is injected AFTER * this catalog and is therefore a SIBLING, not an ancestor: custom properties inherit only from * ancestors, so `var(--gnd-rcl-measure)` would be undefined here and the cap would silently fall * back to `none`. `--gnd-public-readable` is a public-shell token on the page root, so it does * resolve at this node, and the literal is the same value the section declares — the two measures * match by value. This family never declares `--gnd-rcl-measure` itself: a second declaration could * drift away from the section's own without anything noticing. */ body.getndrive-visual-rebrand.gnd-public-rental-shell .sch-demo-vehicles.sch-demo-vehicles--empty-region .sch-demo-vehicles__results-head p { min-width: 0; max-width: min(var(--gnd-public-readable), 32rem); color: var(--gnd-muted); overflow-wrap: anywhere; } /* -- G. the catalog-slot partner-recruitment section (0.2.10.31) ----------- */ /* * The catalog root that holds the section. Vehicles paints every `.sch-demo-vehicles` root as the catalog * card (`#f7f8fa`, a border, an 8px radius and `32px 24px` padding); here that card would put a grey panel * around the one white section, so the root keeps its width and margins and loses its surface — the same four * resets, with `!important` for the same reason, as the empty-region root above. `--catalog-recruitment` is * rendered ONLY with the section inside it. */ body.getndrive-visual-rebrand.gnd-public-rental-shell .sch-demo-vehicles.sch-demo-vehicles--catalog-recruitment { background: transparent !important; border: 0 !important; border-radius: 0 !important; padding: 0 !important; } /* Since 0.2.10.33 the section itself is presented by family I at the end of this file (Nik's 2026-09-27 review of the installed 0.2.10.32 page): the white card that stood here is replaced by the navy invitation, not overridden. */ /* -- H. The empty destination composition (0.2.10.32) ---------------------- */ /* * Nik reviewed the live guest view of /en/thailand/krabi/cars/ on 2026-09-27: the recruitment section worked, but the * page read as unfinished — a catalog-width white card, then the overview and the four FAQ items in a 512px column on * the left of a 1180px white rail with the right half empty, and an 80px white band above the footer. * * Scoped to the regional section's own `data-gnd-market-state="partner_recruitment"` attribute, which Routing renders * only when a destination has no publicly eligible cars. Populated destinations (`live_catalog`), `safe_unknown`, * Motorbikes, country pages and hubs never match; this file is not loaded on `/car-rental/`. * * Since 0.2.10.33 H2 — the white two-zone card — and H4 — the 2 x 2 FAQ — are removed (family I presents the section as * the navy invitation). Since 0.2.10.35 H3 — the overview's two columns — is removed too: the overview, notes and FAQ * of EVERY state share C's one editorial axis. Only H1 remains. */ /* H1. The white under the last FAQ item is the section's own bottom padding (main stylesheet, up to 80px). */ body.getndrive-visual-rebrand.gnd-public-rental-shell .gnd-region-landing--destination.gnd-region-landing--cars[data-gnd-market-state="partner_recruitment"] { padding-bottom: clamp(28px, 3vw, 40px); } /* -- Breakpoints for G and H: see the end of this file. -------------------- */ /* -- C1. Section rail ----------------------------------------------------- */ body.getndrive-visual-rebrand.gnd-public-rental-shell .gnd-region-landing--destination.gnd-region-landing--cars { /* The partner-recruitment fallback block's reading measure (C5). 32rem is 512px at the shipped root size; the readable token stays the outer bound. Since 0.2.10.35 the overview, the notes and the FAQ read on the wider editorial axis below instead. */ --gnd-rcl-measure: min(var(--gnd-public-readable), 32rem); /* The editorial axis (0.2.10.35): ONE centred reading column for the overview, the practical notes and the FAQ in every market state. 50rem is 800px at the shipped root size: at a 1280px viewport the 1180px rail leaves equal 240px margins each side of it; on tablets the rail is narrower than 800px, so the axis is the rail; on phones it is the gutter-padded column. `100%` is resolved where the token is used, against the block's own container. */ --gnd-rcl-axis: min(100%, 50rem); width: var(--gnd-public-content) !important; max-width: var(--gnd-public-content) !important; margin-left: auto !important; margin-right: auto !important; padding-left: 0 !important; padding-right: 0 !important; } /* The content column fills the section rail; the blocks centre themselves on it (C2). */ body.getndrive-visual-rebrand.gnd-public-rental-shell .gnd-region-landing--destination.gnd-region-landing--cars .gnd-region-landing__inner { width: 100% !important; max-width: none !important; padding-left: 0 !important; padding-right: 0 !important; } /* -- C2. The shared editorial axis (0.2.10.35) --------------------------------- */ /* * Nik reviewed the Krabi (empty) and Bangkok (populated) prototype on 2026-09-27 and chose the 800px centred reading * column for all eight destination pages. Every regional block sits on the axis: centred on the rail, its title, text * and hairlines filling the axis, text left-aligned. Equal white on both sides on desktop, nothing stranded on the * left. The rule has no market-state attribute on purpose: populated, empty and safe_unknown pages read the same. */ body.getndrive-visual-rebrand.gnd-public-rental-shell .gnd-region-landing--destination.gnd-region-landing--cars .gnd-region-landing__block { box-sizing: border-box; width: 100%; max-width: var(--gnd-rcl-axis); margin-left: auto; margin-right: auto; } /* One chapter rhythm: more air between the blocks than inside them. */ body.getndrive-visual-rebrand.gnd-public-rental-shell .gnd-region-landing--destination.gnd-region-landing--cars .gnd-region-landing__block + .gnd-region-landing__block { margin-top: clamp(44px, 5vw, 72px); } /* Subordinate to the catalog above and to the navy invitation's H2: below the catalog/Hero scale. */ body.getndrive-visual-rebrand.gnd-public-rental-shell .gnd-region-landing--destination.gnd-region-landing--cars .gnd-region-landing__title { margin: 0 0 18px; font-size: clamp(22px, 1.9vw, 28px); line-height: 1.25; } /* A short teal mark above each title (an empty generated box: no text, icon or image), so each block starts visibly without a card or a band. */ body.getndrive-visual-rebrand.gnd-public-rental-shell .gnd-region-landing--destination.gnd-region-landing--cars .gnd-region-landing__title::before { content: ""; display: block; width: 36px; height: 3px; margin: 0 0 14px; border-radius: 2px; background: var(--gnd-teal); } /* -- C3. Overview: paragraphs in sequence on the axis ----------------------- */ body.getndrive-visual-rebrand.gnd-public-rental-shell .gnd-region-landing--destination.gnd-region-landing--cars .gnd-region-overview__text { min-width: 0; max-width: none; margin: 0 0 16px; font-size: 16px; line-height: 1.7; overflow-wrap: anywhere; } body.getndrive-visual-rebrand.gnd-public-rental-shell .gnd-region-landing--destination.gnd-region-landing--cars .gnd-region-overview__text:last-child { margin-bottom: 0; } /* -- C4. Practical notes: four open items in sequence ------------------------ */ /* One item per row at every width, in Routing's order, on the FAQ's hairline pattern (a rule above the list, one under each item). `display: block` replaces the main stylesheet's auto-fit grid and the former 2 x 2. */ body.getndrive-visual-rebrand.gnd-public-rental-shell .gnd-region-landing--destination.gnd-region-landing--cars .gnd-region-notes__list { display: block; margin: 0; padding: 0; border-top: 1px solid var(--gnd-line); } body.getndrive-visual-rebrand.gnd-public-rental-shell .gnd-region-landing--destination.gnd-region-landing--cars .gnd-region-notes__item { min-width: 0; padding: 18px 0; border-top: 0; border-bottom: 1px solid var(--gnd-line); } body.getndrive-visual-rebrand.gnd-public-rental-shell .gnd-region-landing--destination.gnd-region-landing--cars .gnd-region-notes__term { margin: 0 0 6px; color: var(--gnd-navy); font-size: 16px; font-weight: 800; line-height: 1.35; overflow-wrap: anywhere; } body.getndrive-visual-rebrand.gnd-public-rental-shell .gnd-region-landing--destination.gnd-region-landing--cars .gnd-region-notes__text { min-width: 0; max-width: none; margin: 0; font-size: 15.5px; line-height: 1.65; overflow-wrap: anywhere; } /* -- C5a. FAQ: one open vertical list on the axis --------------------------- */ /* `display: block` is the repair (ADR-208): the question and its answer are two stacked blocks in DOM order, so no question/answer column pair can exist here at any width. Not an accordion: every answer stays on screen. */ body.getndrive-visual-rebrand.gnd-public-rental-shell .gnd-region-landing--destination.gnd-region-landing--cars .gnd-region-faq__list { display: block; max-width: none; border-top: 1px solid var(--gnd-line); } body.getndrive-visual-rebrand.gnd-public-rental-shell .gnd-region-landing--destination.gnd-region-landing--cars .gnd-region-faq__item { display: block !important; min-width: 0; padding: 18px 0; border-bottom: 1px solid var(--gnd-line); } body.getndrive-visual-rebrand.gnd-public-rental-shell .gnd-region-landing--destination.gnd-region-landing--cars .gnd-region-faq__q { min-width: 0; max-width: none; margin: 0 0 6px; color: var(--gnd-navy); font-size: 16.5px; font-weight: 800; line-height: 1.35; overflow-wrap: anywhere; } body.getndrive-visual-rebrand.gnd-public-rental-shell .gnd-region-landing--destination.gnd-region-landing--cars .gnd-region-faq__a { min-width: 0; max-width: none; margin: 0; color: var(--gnd-muted); font-size: 15.5px; line-height: 1.65; overflow-wrap: anywhere; } /* -- C5. Partner recruitment: the same reading measure --------------------- */ /* * Routing renders this block only in the `partner_recruitment` market state, so — as with the empty * state above — nothing here reads inventory: these rules apply when the block exists. The block * keeps its own subtle surface, border, radius, padding and CTA from the main stylesheet: it * addresses a different reader (a partner, not a traveller) and one quiet card makes that change of * audience visible. Only its measure and its column count change. * * Before this pass the lead ran to `74ch` and the benefits list took * `auto-fit minmax(min(100%, 300px), 1fr)` across the section rail, so on a 1180px rail the block * read as three columns about 600px wider than the 512px measure every other paragraph in the * section uses. Both now take `--gnd-rcl-measure`, the ONE token declared on the section above, so * the partner block cannot drift away from the overview, the notes and the FAQ again. */ /* * The card itself (0.2.10.23). `.gnd-region-partner` is one `__block` of the reading column, so it ran * the full 1180px rail while its lead and benefits stopped at the 512px measure — a wide pale card with * a large empty field to the right of two short columns. Held to the same measure it wraps its content * and starts on the column's left edge like the overview, the notes and the FAQ. Only the width is * set: its surface, border, radius, padding, kicker, copy, benefits, CTA and URL stay exactly as the * main stylesheet and Routing render them, and whether it appears is still Routing's market state. */ /* * 0.2.10.35: the axis (C2) centres every block. The partner card keeps its 0.2.10.23 width (the measure, so it still * wraps its content), but instead of centring at that width it starts on the axis's LEFT edge, where every title and * paragraph above and below it starts. This fallback appears only when the catalog slot does not carry the navy * invitation (for example a partner filter with no match on an empty destination). */ body.getndrive-visual-rebrand.gnd-public-rental-shell .gnd-region-landing--destination.gnd-region-landing--cars .gnd-region-partner { max-width: var(--gnd-rcl-measure); margin-left: calc((100% - var(--gnd-rcl-axis)) / 2); margin-right: auto; } body.getndrive-visual-rebrand.gnd-public-rental-shell .gnd-region-landing--destination.gnd-region-landing--cars .gnd-region-partner__lead { min-width: 0; max-width: var(--gnd-rcl-measure); overflow-wrap: anywhere; } /* One column by default (phones), exactly two from 768px: the practical-notes pattern, replacing the auto-fit track list that produced the third column on the rail. */ body.getndrive-visual-rebrand.gnd-public-rental-shell .gnd-region-landing--destination.gnd-region-landing--cars .gnd-region-partner__benefits { min-width: 0; max-width: var(--gnd-rcl-measure); grid-template-columns: minmax(0, 1fr) !important; } /* -- Breakpoints ---------------------------------------------------------- */ @media (min-width: 768px) { /* C3-C5a on tablets: the axis is the content rail here; a half-step up in size for the longer line. */ body.getndrive-visual-rebrand.gnd-public-rental-shell .gnd-region-landing--destination.gnd-region-landing--cars .gnd-region-overview__text { font-size: 17px; line-height: 1.75; } body.getndrive-visual-rebrand.gnd-public-rental-shell .gnd-region-landing--destination.gnd-region-landing--cars .gnd-region-notes__term, body.getndrive-visual-rebrand.gnd-public-rental-shell .gnd-region-landing--destination.gnd-region-landing--cars .gnd-region-faq__q { font-size: 17.5px; } body.getndrive-visual-rebrand.gnd-public-rental-shell .gnd-region-landing--destination.gnd-region-landing--cars .gnd-region-notes__text, body.getndrive-visual-rebrand.gnd-public-rental-shell .gnd-region-landing--destination.gnd-region-landing--cars .gnd-region-faq__a { font-size: 17px; line-height: 1.7; } body.getndrive-visual-rebrand.gnd-public-rental-shell .gnd-region-landing--destination.gnd-region-landing--cars .gnd-region-notes__item, body.getndrive-visual-rebrand.gnd-public-rental-shell .gnd-region-landing--destination.gnd-region-landing--cars .gnd-region-faq__item { padding: 22px 0; } body.getndrive-visual-rebrand.gnd-public-rental-shell .gnd-region-landing--destination.gnd-region-landing--cars .gnd-region-partner__benefits { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } /* * E (R1, Codex F2): the empty statement shares the regional column's LEFT EDGE at every desktop * width. The box sits inside the outer Vehicles catalog card, whose own 24px padding and 1px * border are Vehicles-owned and untouched, so `100%` at this node is the card's CONTENT box and * `margin: auto` centres the box inside that padding: at 768 and 1024 the cap did not bind and the * box started 25px right of the section. `--gnd-public-content` is a viewport token * (`100vw` minus the page gutters, at most 1180px), the same token the regional section is * sized and centred with. Giving the box that width and a horizontal margin of half the * container minus half the rail centres it on the VIEWPORT, because the card is itself centred: * the margin is negative where the card is narrower than the rail plus its padding (768, 1024) * and positive where the card is wider (1280, 1440), and in both cases the box lands exactly * where the section does. Phones keep the base rule: the section is full-width with the page * gutter there and the contract starts at 768px. Width and margins only; no border, background, * padding or radius is restated here. */ body.getndrive-visual-rebrand.gnd-public-rental-shell .sch-demo-vehicles.sch-demo-vehicles--empty-region .sch-demo-vehicles__results { width: var(--gnd-public-content) !important; max-width: var(--gnd-public-content) !important; margin-left: calc(50% - var(--gnd-public-content) / 2) !important; margin-right: calc(50% - var(--gnd-public-content) / 2) !important; } } /* C3-C5a from 1024px: the 800px axis is centred with equal white each side. ONE body size (18px) for the overview, the note text and the answers, and 19px for note terms and questions, so the three blocks read as one text. At 800px and 18px that is about 90-95 characters per EN line and about 80 per RU line (measured in check-visual.mjs). */ @media (min-width: 1024px) { body.getndrive-visual-rebrand.gnd-public-rental-shell .gnd-region-landing--destination.gnd-region-landing--cars .gnd-region-overview__text { font-size: 18px; line-height: 1.75; } body.getndrive-visual-rebrand.gnd-public-rental-shell .gnd-region-landing--destination.gnd-region-landing--cars .gnd-region-notes__term, body.getndrive-visual-rebrand.gnd-public-rental-shell .gnd-region-landing--destination.gnd-region-landing--cars .gnd-region-faq__q { font-size: 19px; } body.getndrive-visual-rebrand.gnd-public-rental-shell .gnd-region-landing--destination.gnd-region-landing--cars .gnd-region-notes__text, body.getndrive-visual-rebrand.gnd-public-rental-shell .gnd-region-landing--destination.gnd-region-landing--cars .gnd-region-faq__a { font-size: 18px; line-height: 1.75; } } /* Phones keep the existing full-width section with the page gutter (main stylesheet v0.2.9.29). */ @media (max-width: 767px) { body.getndrive-visual-rebrand.gnd-public-rental-shell .gnd-region-landing--destination.gnd-region-landing--cars { width: 100% !important; max-width: 100% !important; padding-left: var(--gnd-page-gutter, 16px) !important; padding-right: var(--gnd-page-gutter, 16px) !important; } } /* -- I. The editorial invitation and the vertical FAQ (0.2.10.33) ----------- */ /* * Nik reviewed the installed 0.2.10.32 guest page (RU Krabi, 2026-09-27 14:59): the partner section still read as one * more large, pale, text-heavy card, the page as a wall of text, and the FAQ had become two columns. He asked for a * stronger, distinctly GetnDrive invitation, a clearer rhythm without extra cards, and the FAQ as one open vertical list. * * Scope: the section Routing renders only in `partner_recruitment`, as the direct child of Vehicles' * `--catalog-recruitment` root (I1-I2). Populated `live_catalog`, `safe_unknown`, Motorbikes, country pages, hubs and * `/car-rental/` never match. I3 (the partner-state FAQ on the full rail) and I4 (the partner-state chapter rhythm and * teal title mark) are removed in 0.2.10.35: C2-C5a give every state that rhythm, that mark and one editorial axis. Presentation only: the status, the one H2, the body, the three approved facts, the one CTA and its prefilled * URL are Routing's; DOM, reading and focus order are unchanged (no `order`; the grid places the existing elements in * their own order). The only generated content is empty (`content: ""`): the panel surface and the route marks. * * I1. Two audiences in one section. The intro wrapper is `display: contents` (a plain
with no role, so nothing is * lost to assistive technology), which makes the status, the H2 and the body grid items of the section itself. The * status — the factual no-cars line for travelers — takes the first row on the page's white, on the rail's left edge, * like the empty-catalog statement it replaces. Everything addressed to rental businesses sits below it on ONE navy * panel, painted by the section's `::before` across the remaining rows; the side and end tracks are the panel's * padding. One column below 1024px (status; panel: H2, body, facts, full-width CTA). From 1024px the H2, body and CTA * stay left and the three facts sit right, vertically centred on them. */ body.getndrive-visual-rebrand.gnd-public-rental-shell .sch-demo-vehicles--catalog-recruitment > .gnd-cars-recruitment { --gnd-rci-pad: clamp(24px, 3.4vw, 48px); box-sizing: border-box; display: grid; grid-template-columns: var(--gnd-rci-pad) minmax(0, 1fr) var(--gnd-rci-pad); grid-template-rows: auto 18px var(--gnd-rci-pad) auto auto auto auto var(--gnd-rci-pad); width: 100%; margin: 0 0 clamp(28px, 3.4vw, 48px); padding: 0; color: var(--gnd-ink); } body.getndrive-visual-rebrand.gnd-public-rental-shell .sch-demo-vehicles--catalog-recruitment > .gnd-cars-recruitment::before { content: ""; grid-column: 1 / -1; grid-row: 3 / -1; border-radius: 8px; background: var(--gnd-navy); } body.getndrive-visual-rebrand.gnd-public-rental-shell .sch-demo-vehicles--catalog-recruitment > .gnd-cars-recruitment .gnd-cars-recruitment__intro { display: contents; } body.getndrive-visual-rebrand.gnd-public-rental-shell .sch-demo-vehicles--catalog-recruitment > .gnd-cars-recruitment .gnd-cars-recruitment__status { grid-column: 1 / -1; grid-row: 1; min-width: 0; max-width: min(var(--gnd-public-readable), 40rem); margin: 0; color: var(--gnd-navy); font-size: clamp(16px, 1.25vw, 18px); font-weight: 700; line-height: 1.45; overflow-wrap: anywhere; } body.getndrive-visual-rebrand.gnd-public-rental-shell .sch-demo-vehicles--catalog-recruitment > .gnd-cars-recruitment .gnd-cars-recruitment__title { grid-column: 2; grid-row: 4; min-width: 0; max-width: min(var(--gnd-public-readable), 32rem); margin: 0 0 14px; color: #ffffff; font-size: clamp(24px, 2.4vw, 34px); line-height: 1.15; overflow-wrap: anywhere; } body.getndrive-visual-rebrand.gnd-public-rental-shell .sch-demo-vehicles--catalog-recruitment > .gnd-cars-recruitment .gnd-cars-recruitment__body { grid-column: 2; grid-row: 5; min-width: 0; max-width: min(var(--gnd-public-readable), 32rem); margin: 0 0 24px; color: var(--gnd-subtle); font-size: 16px; line-height: 1.65; overflow-wrap: anywhere; } /* * I2. The three approved facts on a quiet route line: a small teal ring in front of each fact and a teal-deep line * joining them, both empty generated boxes with no text, no icon font and no image. The facts stay a plain