/* site.css — small additions layered on top of the theme styles (style.css).
   Keep this lean; it exists so we never have to edit the imported theme CSS. */

/* Form submission feedback (contact + "before you go" forms) */
.solvair-form-response {
    margin: 1em 0;
    padding: 0.8em 1em;
    border-radius: 6px;
    font-size: 1em;
    line-height: 1.4;
}
.solvair-form-response.is-ok {
    background: #e6f4ea;
    color: #1e7e34;
    border: 1px solid #b7dfc1;
}
.solvair-form-response.is-error {
    background: #fde8e8;
    color: #b02a37;
    border: 1px solid #f3c2c7;
}

/* ------------------------------------------------------------------ */
/* Core improvements 2026-07-13 (Jason's list)                         */
/* ------------------------------------------------------------------ */

/* 1. Hero: kill the hairline at the header/video junction.
   ROOT CAUSE (measured 2026-07-13): #hero-video is a GPU-composited layer at a
   FRACTIONAL offset (top:-0.6em → y=…40625) clipped by .home-hero's overflow:hidden
   exactly at the visible junction row; the compositor anti-aliases that clip edge
   into a 1px blend line (invisible in screenshots = software raster; moves on
   scroll = fractional phase change). Fix: paint the header ABOVE the hero and tuck
   the hero's clip edge 2px UNDER the opaque header, so the AA row can never show. */
.header { position: relative; z-index: 2; }
.home-hero { margin-top: -2px; }
/* SECOND exposure (found 2026-07-13, Chromium-only): at 1601–1920px and
   992–1139px the theme positions the video 4em/3em BELOW the hero top, so its
   composited top edge floats mid-hero over the white background — Blink
   anti-aliases that floating layer edge into the visible hairline (Firefox
   snaps it). Cover the edge with a 4px hero-painted white strip straddling it:
   white-on-white above, white on the video's near-white sky below. Framing
   unchanged. */
@media only screen and (max-width: 1920px) and (min-width: 1601px) {
    .home-hero { position: relative; }
    .home-hero::before {
        content: '';
        position: absolute;
        left: 0; right: 0;
        top: calc(4em - 2px);
        height: 4px;
        background: #fff;
        z-index: 1;
        pointer-events: none;
    }
}
@media only screen and (max-width: 1139px) and (min-width: 992px) {
    .home-hero { position: relative; }
    .home-hero::before {
        content: '';
        position: absolute;
        left: 0; right: 0;
        top: calc(3em - 2px);
        height: 4px;
        background: #fff;
        z-index: 1;
        pointer-events: none;
    }
}

/* Main contact form synced with the popup's modern treatment (Jason 2026-07-13) */
.contact-page-box .wpcf7-form input.wpcf7-text,
.contact-page-box .wpcf7-form textarea.wpcf7-textarea {
    padding: 13px 16px;
    font-size: 15.5px;
    line-height: 1.4;
    color: #2b3037;
    background: #fff;
    border: 1px solid #d5dae2;
    border-radius: 6px;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.contact-page-box .wpcf7-form input.wpcf7-text:focus,
.contact-page-box .wpcf7-form textarea.wpcf7-textarea:focus {
    outline: none;
    border-color: #1a63ab;
    box-shadow: 0 0 0 3px rgba(26, 99, 171, 0.14);
}
.contact-page-box .wpcf7-form ::placeholder { color: #98a0ab; }
.contact-page-box .wpcf7-form input[type="submit"] {
    border: 0;
    border-radius: 6px;
    font-weight: 600;
    letter-spacing: 0.2px;
    cursor: pointer;
    box-shadow: 0 2px 6px rgba(120, 150, 30, 0.25);
    transition: background-color 0.2s ease, transform 0.15s ease, box-shadow 0.2s ease;
}
.contact-page-box .wpcf7-form input[type="submit"]:hover {
    background-color: #a2c22d;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(120, 150, 30, 0.3);
}
/* Consent checkboxes: readable size + aligned checkbox, all widths */
.contact-page-box .wpcf7-form p.checkbox { font-size: 14.5px; line-height: 1.5; }
.contact-page-box .wpcf7-form p.checkbox label {
    display: grid;
    grid-template-columns: 18px 1fr;
    gap: 10px;
    align-items: start;
    cursor: pointer;
}
.contact-page-box .wpcf7-form p.checkbox input[type="checkbox"] {
    width: 16px;
    height: 16px;
    margin-top: 3px;
}

/* 2b. Warranty breakout: Jason's spec 2026-07-13 (all widths) */
.warranty-breakout { padding: 20px 0; margin: 6vh 0 1vh; }

/* 4. Brochure popup: download panel + "request a printed version" form
   (opened by the Download PDF button, mirroring the solvair.co.uk popup) */
.popup-print[hidden] { display: none; }
.popup-print { position: fixed; inset: 0; z-index: 10000; }
.popup-print-overlay { position: absolute; inset: 0; background: rgba(20, 22, 60, 0.72); }
.popup-print-dialog {
    position: relative;
    background: #fff;
    max-width: 820px;
    width: calc(100% - 32px);
    margin: 6vh auto 0;
    padding: 0;                          /* bands manage their own padding */
    border-radius: 8px;
    box-shadow: 0 18px 50px rgba(0, 0, 0, 0.35);
    max-height: 88vh;
    overflow-y: auto;
}
.popup-band { padding: 34px 42px 32px; }
.popup-band-download { background: #fff; }
.popup-band-request { background: #f4f6f8; }
.popup-print-dialog h2 { margin: 0 0 10px; font-size: 27px; }
.popup-band p { margin: 0 0 18px; font-size: 15.5px; line-height: 1.6; color: #3a3f47; }
.popup-print-dl-btn { display: inline-block; border-radius: 6px; padding: 14px 26px; font-size: 16px; }
.popup-print-filesize { font-size: 12.5px !important; margin: 12px 0 0 !important; color: #7a8089; }
.popup-print-intro { margin: 0 0 20px !important; }
.popup-print-grid { display: grid; grid-template-columns: 1fr; gap: 0 24px; }
@media (min-width: 640px) {
    .popup-print-grid { grid-template-columns: 1fr 1fr; }
    .popup-print-address textarea { height: calc(100% - 14px); }
}
@media (max-width: 639px) {
    /* stack in natural order with the submit LAST (after the address) */
    .popup-print-grid { display: flex; flex-direction: column; }
    .popup-print-fields, .popup-print-address { display: contents; }
    .popup-print-form input[type="submit"] { order: 9; }
    .popup-band { padding: 26px 24px; }
}
.popup-print-form input.wpcf7-text,
.popup-print-form textarea.wpcf7-textarea {
    width: 100%;
    margin: 0 0 14px;
    padding: 13px 16px;
    font-size: 15.5px;
    line-height: 1.4;
    color: #2b3037;
    background: #fff;
    border: 1px solid #d5dae2;
    border-radius: 6px;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.popup-print-form input.wpcf7-text:focus,
.popup-print-form textarea.wpcf7-textarea:focus {
    outline: none;
    border-color: #1a63ab;
    box-shadow: 0 0 0 3px rgba(26, 99, 171, 0.14);
}
.popup-print-form ::placeholder { color: #98a0ab; }
.popup-print-address textarea { min-height: 150px; resize: vertical; }
.popup-print-form input[type="submit"] {
    width: 100%; display: block; margin: 0 0 14px;
    background-color: #b0d039; color: #fff; border: 0; border-radius: 6px;
    padding: 14px 0; font-size: 16.5px; font-weight: 600; letter-spacing: 0.2px;
    cursor: pointer;
    box-shadow: 0 2px 6px rgba(120, 150, 30, 0.25);
    transition: background-color 0.2s ease, transform 0.15s ease, box-shadow 0.2s ease;
}
.popup-print-form input[type="submit"]:hover {
    background-color: #a2c22d;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(120, 150, 30, 0.3);
}
.popup-print-next { margin: 8px 0 0 !important; font-size: 13.5px !important; color: #6a7078; }
.popup-print-close {
    position: absolute; top: 14px; right: 16px; z-index: 1;
    width: 36px; height: 36px; border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    font-size: 24px; line-height: 1; color: #9aa1ab; text-decoration: none;
    transition: background-color 0.15s ease, color 0.15s ease;
}
.popup-print-close:hover { color: #2b3037; background: #eef1f4; }

/* 3. Customers logos: swipable at every width
   (theme set the wrapper to display:block for its old static desktop row) */
.footer-customers .customers-logos .swiper-wrapper { display: flex; align-items: center; }
.footer-customers .customers-logos .swiper-slide { margin: 15px 0; width: auto; display: flex; align-items: center; }
#logos-swiper { cursor: grab; }

/* Mobile tidy-up (2a–2f) */
@media only screen and (max-width: 767px) {

    /* 2f. Header: smaller, tighter; phone + email stacked right */
    .header-inner { padding: 10px 15px 10px !important; }
    .logo-img img { width: 112px; }
    .logo-tagline { font-size: 0.68rem; margin-top: 3px; }
    .header-contact { font-size: 13.5px; line-height: 1.5; text-align: right; }
    /* theme's 479px block centres these + pads the links right — force flush right */
    .header-contact div { text-align: right; }
    .header-contact a { padding-right: 0; }
    .header-contact .header-email { margin-top: 5px; }

    /* 2a. Product cards: single column, image beside text (matches the
       applications/industries mobile language instead of cramped 2-up) */
    .home-product-range .row-cols-2 > .col { flex: 0 0 100%; max-width: 100%; }
    .home-product-range .card {
        display: grid;
        grid-template-columns: 36% 1fr;
        column-gap: 20px;
        align-items: start;
        margin: 15px 0;
        text-align: left;
    }
    .home-product-range .card-img { grid-row: 1 / 3; border-radius: 4px; }
    .home-product-range .card-title { margin: 0 0 4px; font-size: 20px; }
    .home-product-range .card-text { font-size: 14px; line-height: 1.45; }

    /* 2a. Applications + industries: centre thumbs on their text, even rhythm */
    .home-applications .card .row,
    .home-industries .card .row { align-items: center; }
    .home-applications .card,
    .home-industries .card { margin-bottom: 25px; }
    .home-applications .card-img,
    .home-industries .card-img { border-radius: 4px; }
    .home-applications .card .col-8,
    .home-industries .card .col-8 { padding-left: 20px; }
    .home-applications .card-text,
    .home-industries .card-text { font-size: 14px; line-height: 1.45; }
    .home-applications .card-title,
    .home-industries .card-title { margin-bottom: 4px; font-size: 20px; }

    /* 2b. Warranty breakout: badge and text vertically centred, tighter */
    .warranty-breakout { padding-top: 30px; padding-bottom: 35px; }
    .warranty-breakout .row .row { align-items: center; }
    .warranty-breakout .warranty-img { position: relative; top: -42px; }
    .warranty-breakout .warranty-img img { max-width: 100%; height: auto; }
    .warranty-breakout .warranty-text h2 { margin: 0 0 6px; font-size: 24px; }
    .warranty-breakout .warranty-text span { font-size: 14px; line-height: 1.45; display: block; }

    /* 2c. Brochure: image first so it reads as part of the block */
    .printedmat-intro .row { flex-direction: column-reverse; }
    .printedmat-intro .row > .col:last-child { justify-content: center; padding-bottom: 8px; }
    .printedmat-intro img { max-width: 78%; height: auto; margin: 0 auto; display: block; }
    .printedmat-intro .col.pb-5 { padding-bottom: 24px !important; text-align: center; }
    .printedmat-intro h2 { font-size: 26px; }

    /* 2d. Contact section + form */
    .contact-page-box { padding-top: 34px; }
    .contact-page-box .contact-info {
        flex-direction: column;
        align-items: flex-start !important;
        gap: 6px !important;
        margin-bottom: 24px !important;
    }
    .contact-page-box .contact-info a { font-size: 18px; }
    .contact-page-box h2 { font-size: 26px; }
    .wpcf7-form .contact-form-row { display: block; }
    /* uniform vertical rhythm: kill the p margins that made the textarea gap
       bigger than the field gaps, give every control the same spacing */
    .wpcf7-form .contact-form-row .left { padding-bottom: 0; }
    .wpcf7-form .contact-form-row .left p,
    .wpcf7-form .contact-form-row .right p { margin: 0; }
    .wpcf7-form .contact-form-row .right p.checkbox { margin: 10px 0 0; }
    .wpcf7-form .contact-form-row input.wpcf7-text { margin-bottom: 16px; }
    .wpcf7-form .contact-form-row textarea { margin-bottom: 16px; }
    .wpcf7-form .contact-form-row input[type="submit"],
    .wpcf7-form input[type="submit"] { width: 100%; display: block; margin-top: 0; }
    .wpcf7-form p.checkbox { margin: 10px 0 0; }

    /* 5. Customers strapline: balanced two lines, centred */
    .footer-customers .customers-text .strapline {
        display: inline-block;
        max-width: 34ch;
    }

    /* 2e. Footer: centred, tighter */
    .footer-bottom { padding: 12px 0; }
    .footer-bottom .footer_nav,
    .footer-bottom .designby { text-align: center; font-size: 13px; line-height: 1.45; }
    .footer-bottom .designby { margin-top: 4px; padding-top: 0; }
}
