/* ==========================================================================
   Contact page (2026), DW-71: port rules
   ==========================================================================
   The design's contact page (contact.html, 916df3f) as rendered by the
   module: its own stylesheets (contact/manifest.php), layout/layout.css for
   the shared header and footer, then these rules. Every rule here says
   which difference from the design it closes.
   ========================================================================== */

/* The form in the middle of the first screen on desktop (26 Oct 2026, asked
   on staging: "form cần nằm giữa screen"). The design's own top padding,
   clamp(10rem, 18vw, 18rem) (pages/contact.css), pushed the form half below
   the fold on a laptop: at 1440 × 900 it ran from 376 to 1073 px. The block
   now takes the screen left under the announcement bar (2.75rem on one line
   from 1024 px) and the sticky navbar (--dul-header-h, set by layout.js),
   and centres its row in it. The two columns stay top-aligned to each other
   and the sky behind them does not move. On a screen too short for the
   form, it simply starts just under the header. Phones keep the design's
   stacked layout. */
@media (min-width: 1024px) {
  html .contact-page {
    min-height: calc(100svh - var(--dul-header-h, 4.5rem) - 2.75rem);
    padding-block: clamp(1.5rem, 4vh, 3rem);
    align-content: center;
  }
}

/* A client logo that links its project page (28 Oct 2026, asked by the
   user; the design links none of its client logos, du2026_client_logo_url()).
   The link takes the logo's place without moving it: a flex box, it is the
   row's item where the list is a flex row and a block where the logo was
   one (the hero's marquee), with no line box around the logo; it can shrink
   as the logo could. */
.du2026-logo-link { display: flex; align-items: center; min-width: 0; max-width: 100%; }