/* Hand-written corrections on top of the page stylesheets; each rule carries its reason. Loaded last. */

/* Popups are in the page markup and closed via [hidden] (src/scripts/popups.ts); the popup CSS sets display: flex,
   which would otherwise override the hidden attribute. */
[data-4c-popup][hidden] { display: none !important; }
/* Cookie dialog + widget are static markup closed via [hidden] (src/scripts/consent.ts); their CSS sets display. */
[data-4c-consent][hidden] { display: none !important; }

/* Placeholder for external media before consent (Vimeo, Flipsnack, GIA). The original showed these embeds WITHOUT
   consent; the look follows the original content blocker (dark box, white text, blue buttons). */
.fc-cb { position: absolute; inset: 0; z-index: 2; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px; padding: 24px; background: #000; color: #fff; font: 14px/1.5 Roboto, sans-serif; text-align: center; }
.fc-cb p { margin: 0; max-width: 560px; color: #fff; }
.fc-cb-actions { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; }
.fc-cb button { cursor: pointer; border: 0; border-radius: 4px; padding: 10px 16px; background: #0063e3; color: #fff; font: 600 14px/1.3 Roboto, sans-serif; }
.fc-cb button:hover, .fc-cb button:focus-visible { background: #1a73e8; outline: 2px solid #fff; outline-offset: 2px; }
.fc-cb a { color: #fff; text-decoration: underline; font-size: 13px; }
/* wrappers that hold a parked iframe need a box for the placeholder (iframes had their own height);
   .ui-wrapper is sized 16:9 by its aspect-ratio: no min-height there (it made 390 px pages 41 px taller) */
iframe[data-4c-src] { visibility: hidden; }
.ui-wrapper:has(> iframe[data-4c-src]) { position: relative; }
.video-wrapper:has(> iframe[data-4c-src]), .ui-widget-container:has(> iframe[data-4c-src]) { position: relative; min-height: 220px; }

/* Contact form (src/scripts/contact.ts): honeypot off-screen; status line in the original form-message look. */
.fc-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; opacity: 0; }
.ui-form .form-message { font-size: 1em; line-height: 1.4; margin: 10px 0; text-align: center; }
.ui-form .form-message--success { color: #5cb85c; }
.ui-form .form-message--danger { color: #d9534f; }
.ui-form [aria-invalid="true"] { outline: 1px solid #d9534f; }

/* Background videos cover their section (the original sized them by script: a 16:9 box >= the section). Without it
   the video ran at its intrinsic 1920x1080 and sections taller than 1080 px showed a grey band (home hero). */
.ui-background-video-container > .ui-background-video-hosted { width: 100%; height: 100%; object-fit: cover; }