/* ==========================================================================
   Compass IT — responsive overrides
   Companion to compass.css. All breakpoint-specific rules live here so the
   base file stays focused on layout and theming.
   Load order: bootstrap → owl/animations/etc → style.css → responsive.css
              → compass.css → compass-responsive.css
   ========================================================================== */


/* --------------------------------------------------------------------------
   Hero — scale top padding so headline clears the (shorter) mobile nav
   -------------------------------------------------------------------------- */
@media (max-width: 991px) {
    .cit-hero-content { padding: 220px 0 100px; }
}
@media (max-width: 575px) {
    .cit-hero-content { padding: 180px 0 80px; }
}


/* --------------------------------------------------------------------------
   Navigation — mobile sizing and the persistent logo-crop fix
   -------------------------------------------------------------------------- */
@media (max-width: 991px) {
    /* Override the theme's mobile brand padding (18px 0) so brand block
       doesn't exceed the scrolled bar height. */
    header#pq-header.pq-header-style-1 .pq-bottom-header .navbar .navbar-brand {
        padding: 8px 0 !important;
    }
    header#pq-header .pq-bottom-header { min-height: 180px; }
    header#pq-header .pq-bottom-header .navbar .navbar-brand img.cit-logo-primary { height: 160px !important; }
    header#pq-header .pq-bottom-header .navbar .navbar-brand img.cit-logo-horizontal { height: 48px !important; }
    /* Scrolled: 48px logo + 8+8 brand pad = 64px; bar is 96px for breathing room */
    header#pq-header.cit-scrolled .pq-bottom-header { min-height: 96px; }
    /* Give the hamburger a little right margin */
    header#pq-header .pq-bottom-header .navbar-toggler { margin: 0 12px 0 15px !important; }
}

@media (max-width: 767px) {
    /* Theme forces .navbar-brand img height: 55px at <=767; reassert ours */
    header#pq-header .pq-bottom-header .navbar .navbar-brand img.cit-logo-horizontal { height: 44px !important; }
    /* General mobile tweaks that lived in the inline block */
    .cit-hero h1 { font-size: 38px; letter-spacing: -0.5px; }
    .cit-about-areas { grid-template-columns: 1fr; }
    .cit-trust-item { margin-bottom: 16px; }
    .cit-hero-panel { margin-left: 0; margin-top: 32px; }
    /* Footer logo */
    footer#pq-footer .pq-footer-logo.cit-footer-logo { max-height: 80px; }
}

@media (max-width: 575px) {
    header#pq-header .pq-bottom-header { min-height: 140px; }
    header#pq-header .pq-bottom-header .navbar .navbar-brand img.cit-logo-primary { height: 120px !important; }
    header#pq-header .pq-bottom-header .navbar .navbar-brand img.cit-logo-horizontal { height: 40px !important; }
    header#pq-header.cit-scrolled .pq-bottom-header { min-height: 84px; }
    header#pq-header .pq-bottom-header .navbar-toggler {
        margin: 0 10px 0 12px !important;
        padding: 10px 14px !important;
    }
    /* What You Get grid collapses to a single column */
    .cit-wyg-grid { grid-template-columns: 1fr; }
}

@media (max-width: 479px) {
    /* Theme forces .navbar-brand img height: 50px at <=479 + padding: 0 on brand; reassert ours */
    header#pq-header.pq-header-style-1 .pq-bottom-header .navbar .navbar-brand { padding: 8px 0 !important; }
    header#pq-header.pq-header-style-1 .pq-bottom-header .navbar { padding: 0 !important; }
    header#pq-header .pq-bottom-header .navbar .navbar-brand img.cit-logo-horizontal { height: 36px !important; }
}


/* --------------------------------------------------------------------------
   Accessibility — respect reduced-motion preference
   -------------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
    .cit-reveal {
        opacity: 1;
        transform: none;
        transition: none;
    }
}