before the pills) + "Follow Us" title share one look so the two footer sub-headings match. */ footer.bootscore-footer .footer_widget:has(+ .footer_widget ol.wp-block-list) p, footer.bootscore-footer .footer_widget .social_network .title { font-size: 16px; font-weight: 700; line-height: 24px; margin-bottom: 4px; color: #fff; } /* Content links (paragraphs / lists in blocks & post content, incl. FAQ/ accordion bodies): brand red, no underline, underline-on-hover offset 3px. Excludes button-style links. */ .site-main :where(p, li) a:not(.button):not(.wp-element-button), .site-main .accordion-body a:not(.button):not(.wp-element-button) { color: var(--Secondary-100, #CF2B24); font-weight: 600; text-decoration: none; } .site-main :where(p, li) a:not(.button):not(.wp-element-button):hover, .site-main .accordion-body a:not(.button):not(.wp-element-button):hover { text-decoration: underline; text-underline-offset: 3px; } /* Footer catalogues: turn the numbered List block into download pills. */ footer.bootscore-footer .footer_widget ol.wp-block-list { list-style: none; margin: 18px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 9px; counter-reset: none; } footer.bootscore-footer .footer_widget ol.wp-block-list li { margin: 0; padding: 0; list-style: none; } footer.bootscore-footer .footer_widget ol.wp-block-list li::before { content: none; /* kill the block-list ordered counter */ } footer.bootscore-footer .footer_widget ol.wp-block-list li > a { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; font-size: 12px; font-weight: 500; line-height: 1.2; color: #fff; text-decoration: none; background: rgba(255, 255, 255, .08); border: 1px solid rgba(255, 255, 255, .18); border-radius: 999px; transition: background-color .18s ease, border-color .18s ease, transform .18s ease; } footer.bootscore-footer .footer_widget ol.wp-block-list li > a::before { content: ""; width: 13px; height: 13px; flex-shrink: 0; background: no-repeat center / contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4'/%3E%3Cpolyline points='7 10 12 15 17 10'/%3E%3Cline x1='12' y1='15' x2='12' y2='3'/%3E%3C/svg%3E"); } footer.bootscore-footer .footer_widget ol.wp-block-list li > a:hover { background: var(--Secondary-100, #CF2B24); border-color: var(--Secondary-100, #CF2B24); transform: translateY(-1px); } /* Footer catalogues spacing tweaks on mobile (columns stacked < 992px): tighten the gap between the social links and the catalogues heading, and add room below the pills before the next stacked column. */ @media (max-width: 991.98px) { footer.bootscore-footer .footer_widget .wp-block-spacer { height: 10px !important; } footer.bootscore-footer .footer_widget .social-networks { margin-bottom: 18px; } footer.bootscore-footer .footer_widget ol.wp-block-list { margin-bottom: 36px; } } footer.bootscore-footer .bootscore-footer-info { background-color: var(--Primary-100, #061735); color: #fff; } footer.bootscore-footer .bootscore-footer-info a { color: #fff; text-decoration: none; } footer.bootscore-footer .bootscore-copyright { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; color: #fff; padding-top: 32px; padding-bottom: 32px; border-top: 1px solid rgba(255, 255, 255, .95); font-size: 13px; } footer.bootscore-footer .bootscore-copyright a { font-size: 13px; } footer.bootscore-footer .footer_widget .social-networks { display: flex; gap: 32px; padding-top: 16px; margin-bottom: 14px; } footer.bootscore-footer .footer_widget .social-networks a:hover>svg path { fill: var(--Secondary-100, #CF2B24); } footer.bootscore-footer a:hover { color: var(--Secondary-100, #CF2B24); } footer.bootscore-footer #footer-menu li a { padding: 0; } footer.bootscore-footer #footer-menu { display: flex; gap: 40px; } .btn-primary-top { background-color: rgb(217, 217, 217); border-radius: 16px; height: 48px; padding: 16px 22px; display: flex; justify-content: center; align-items: center; } .btn-primary-top:active, .btn-primary-top:hover { background-color: var(--Secondary-100, #CF2B24); } .btn-primary-top:hover i { color: #fff; } .description p { font-weight: 400; line-height: 24px; } .description p:last-child { margin-bottom: 0; } input, select { background-repeat: no-repeat; background-position: 24px center; } select { background-size: auto; } input[name="your-name"] { background-image: url('assets/img/user.svg'); padding-left: 56px; } input[name="your-email"], input[type="email"] { background-image: url('assets/img/mail.svg'); padding-left: 56px; } input[type="tel"] { background-image: url('assets/img/phone.svg'); padding-left: 56px; } input.location, select.location { background-image: url('assets/img/location.svg'); padding-left: 56px; } input.need { background-image: url('assets/img/frame.svg'); padding-left: 56px; } input.message { background-image: url('assets/img/edit.svg'); padding-left: 56px; } @media screen and (max-width:992px) { .container.g-0 .order-lg-first.order-first li ul.sub-menu:not(.active) { display: none; } .button.but-red { display: none; } footer div.footer_widget>div:nth-child(2) { margin-bottom: 32px; } .container, .container-fluid, .container-sm, .container-md, .container-lg, .container-xl, .container-xxl { padding-right: 16px; padding-left: 16px; } .background_text { display: none; } .display-h1 { font-size: 40px; line-height: 54px; } h2, .h2 { font-size: 32px; font-style: normal; line-height: 42px; } .top-bar-widget ul.menu li a { padding: 12px 0 12px 0; } /*header #nav-main .container { padding: 1px 24px; padding-right: 16px; }*/ header #nav-main .container { padding: 1px 15px; padding-right: 15px; } footer.bootscore-footer .footer-block-sidebar { padding-top: 80px; padding-bottom: 80px; } footer.bootscore-footer .footer_widget .block-1-footer { gap: 32px; } footer.bootscore-footer .footer_widget>div:nth-child(2) { display: none; } footer.bootscore-footer .footer_widget .widget-title::after { cursor: pointer; background-image: url('data:image/svg+xml,'); background-repeat: no-repeat; background-position: 100% center; width: fit-content; padding-right: 32px; content: ''; } footer.bootscore-footer .footer_widget .widget-title.open::after { background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3cg id='icons/outline/arrow-up-simple'%3e%3cpath id='Icon (Stroke)' fill-rule='evenodd' clip-rule='evenodd' d='M2.19526 11.138C1.93491 10.8776 1.93491 10.4555 2.19526 10.1952L7.5286 4.86185C7.78895 4.6015 8.21106 4.6015 8.4714 4.86185L13.8047 10.1952C14.0651 10.4555 14.0651 10.8776 13.8047 11.138C13.5444 11.3983 13.1223 11.3983 12.8619 11.138L8 6.27606L3.13807 11.138C2.87772 11.3983 2.45561 11.3983 2.19526 11.138Z' fill='%23CF2B24'/%3e%3c/g%3e%3c/svg%3e "); } footer.bootscore-footer .footer_widget .widget-title.open { color: var(--Secondary-100, #CF2B24); } /*footer.bootscore-footer .footer_widget .menu-contact-us-footer-container { display: flex !important; }*/ footer.bootscore-footer .footer_widget .social_network { margin-bottom: 24px; } /*footer.bootscore-footer div.col-12:nth-child(5)>div:nth-child(1)>div:nth-child(1)::after { content: none; }*/ .h2-m { font-size: 40px; font-weight: 700; } .header-top-menu ul#menu-header-top.menu>li.menu-item-has-children ul li.menu-item> :where(a, p) { display: none; } .header-top-menu ul#menu-header-top.menu>li.menu-item-has-children ul li.menu-item>a:first-child::after { content: ''; width: 24px; height: 24px; background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M20.7071%207.29289C21.0976%207.68342%2021.0976%208.31658%2020.7071%208.70711L12.7071%2016.7071C12.3166%2017.0976%2011.6834%2017.0976%2011.2929%2016.7071L3.29289%208.70711C2.90237%208.31658%202.90237%207.68342%203.29289%207.29289C3.68342%206.90237%204.31658%206.90237%204.70711%207.29289L12%2014.5858L19.2929%207.29289C19.6834%206.90237%2020.3166%206.90237%2020.7071%207.29289Z%22%20fill%3D%22%23061735%22%2F%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M20.7071%207.29289C21.0976%207.68342%2021.0976%208.31658%2020.7071%208.70711L12.7071%2016.7071C12.3166%2017.0976%2011.6834%2017.0976%2011.2929%2016.7071L3.29289%208.70711C2.90237%208.31658%202.90237%207.68342%203.29289%207.29289C3.68342%206.90237%204.31658%206.90237%204.70711%207.29289L12%2014.5858L19.2929%207.29289C19.6834%206.90237%2020.3166%206.90237%2020.7071%207.29289Z%22%20fill%3D%22white%22%20fill-opacity%3D%220.7%22%2F%3E%3C%2Fsvg%3E"); background-repeat: no-repeat; background-position: right center; background-size: contain; } .header-top-menu ul#menu-header-top.menu>li.menu-item-has-children ul li.menu-item>a.active:first-child::after { background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M3.29289%2016.7071C2.90237%2016.3166%202.90237%2015.6834%203.29289%2015.2929L11.2929%207.29289C11.6834%206.90237%2012.3166%206.90237%2012.7071%207.29289L20.7071%2015.2929C21.0976%2015.6834%2021.0976%2016.3166%2020.7071%2016.7071C20.3166%2017.0976%2019.6834%2017.0976%2019.2929%2016.7071L12%209.41421L4.70711%2016.7071C4.31658%2017.0976%203.68342%2017.0976%203.29289%2016.7071Z%22%20fill%3D%22%23061735%22%2F%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M3.29289%2016.7071C2.90237%2016.3166%202.90237%2015.6834%203.29289%2015.2929L11.2929%207.29289C11.6834%206.90237%2012.3166%206.90237%2012.7071%207.29289L20.7071%2015.2929C21.0976%2015.6834%2021.0976%2016.3166%2020.7071%2016.7071C20.3166%2017.0976%2019.6834%2017.0976%2019.2929%2016.7071L12%209.41421L4.70711%2016.7071C4.31658%2017.0976%203.68342%2017.0976%203.29289%2016.7071Z%22%20fill%3D%22white%22%20fill-opacity%3D%220.7%22%2F%3E%3C%2Fsvg%3E"); } .header-top-menu ul#menu-header-top.menu>li.menu-item-has-children ul li.menu-item>a:first-child, .header-top-menu ul#menu-header-top.menu>li.menu-item-has-children ul li.menu-item> :where(a, p).active { display: flex; justify-content: space-between; } .header-top-menu .menu { padding-left: 0; margin-bottom: 0; } .header-top-menu .container-menu { padding-bottom: 50px; top: 47px; } } @media screen and (max-width:768px) { .bootscore-copyright div #footer-menu a { display: flex; margin-top: 24px; margin-bottom: 24px; } } input.wpcf7-not-valid { border-color: var(--Secondary-100, #CF2B24); } .wpcf7-form-control-wrap { display: flex; flex-direction: column; gap: 8px; } .wpcf7-not-valid-tip { font-size: 14px; font-style: normal; font-weight: 400; line-height: 20px; color: var(--Alert-Main-Red, #DA1E28); } /* single */ section.blog-header { margin-top: 51px; } .post-meta { gap: 16px; display: flex; margin-bottom: 40px; } .post-meta .author-avatar { border-radius: 50px; overflow: hidden; max-width: 56px; max-height: 56px; } .post-meta .author-avatar img { width: 100%; height: 100%; object-fit: cover; } .post-meta .author-name a, .post-meta .author-name { color: var(--Text-100, #040611); font-size: 16px; font-style: normal; font-weight: 600; line-height: 20px; text-decoration: none; } .post-meta .post-date { font-weight: 300; line-height: 22px; } .post-meta .author-information { display: flex; flex-direction: column; gap: 8px; } .blog-header .back-to { color: var(--Primary-100, #061735); text-align: center; font-size: 16px; font-style: normal; font-weight: 600; line-height: 20px; text-decoration: none; display: flex; justify-content: center; align-items: center; width: fit-content; gap: 12px; padding: 16px; margin-left: -20px; border-radius: 32px; transition: background 0.3s ease, color 0.3s ease; } .blog-header .back-to:hover svg path { fill: var(--Secondary-100, #CF2B24); transition: fill 0.3s ease; } .blog-header .back-to:hover { color: var(--Secondary-100, #CF2B24); } .blog-header h1 { margin-top: 16px; margin-bottom: 16px; } .tags-links { gap: 16px; display: flex; margin-top: 24px; flex-wrap: wrap; } .button-tag { display: flex; width: fit-content; padding: 8px 12px; justify-content: center; align-items: center; color: var(--Text-100, #040611); font-feature-settings: 'liga' off, 'clig' off; font-size: 14px; font-style: normal; font-weight: 400; line-height: 20px; border-radius: 32px; background: var(--Primary-5, linear-gradient(0deg, rgba(255, 255, 255, 0.95) 0%, rgba(255, 255, 255, 0.95) 100%), #061735); overflow: hidden; transition: background 0.3s ease, color 0.3s ease; } .button-tag:hover { background: var(--Primary-50, linear-gradient(0deg, rgba(255, 255, 255, 0.50) 0%, rgba(255, 255, 255, 0.50) 100%), #061735); color: #fff; } .blog-header .description p:not(:last-child) { margin-bottom: 24px; } .blog-bacground { margin-top: 40px; } .blog-bacground img { border-radius: 32px; } /* ============================================================ Blog single — clean editorial layout. Breadcrumb bar on white, then the featured image as the hero with title + meta set on a navy scrim. Flat, generous rhythm in the article body; every content element styled. ============================================================ */ /* Hero spans the full container; article body gets a wider (~1000px) column. */ @media (min-width: 992px) { .single .blog-header .col-lg-8 { flex: 0 0 auto; width: 100%; max-width: none; } .single .content-single-post .col-lg-8 { flex: 0 0 auto; width: 83.33333%; max-width: 1020px; } } /* --- nav row (back link + breadcrumbs), laid over the hero image --- */ .single .blog-header__nav { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; } .single .blog-header__nav .back-to { padding: 8px 12px; margin-left: -12px; } .single .blog-header__nav #breadcrumbs { margin: 0; padding: 0 !important; /* wp-custom-css adds a global 32px padding-top that broke vertical alignment */ font-size: 14px; line-height: 20px; color: rgba(6, 23, 53, .55); } .single .blog-header__nav #breadcrumbs a { color: rgba(6, 23, 53, .8); font-weight: 600; text-decoration: none; } .single .blog-header__nav #breadcrumbs a:hover { color: var(--Secondary-100, #CF2B24); } /* Over the image: pin to the top, switch to white */ .single .blog-hero--image .blog-header__nav { position: absolute; top: 0; left: 0; right: 0; z-index: 2; padding: 24px 48px; } .single .blog-hero--image .blog-header__nav .back-to { color: #fff; } .single .blog-hero--image .blog-header__nav .back-to svg path { fill: #fff; transition: fill .3s ease; } .single .blog-hero--image .blog-header__nav .back-to:hover { color: var(--Secondary-100, #CF2B24); } .single .blog-hero--image .blog-header__nav .back-to:hover svg path { fill: var(--Secondary-100, #CF2B24); } .single .blog-hero--image .blog-header__nav #breadcrumbs { color: rgba(255, 255, 255, .75); } .single .blog-hero--image .blog-header__nav #breadcrumbs a { color: rgba(255, 255, 255, .95); } /* Plain variant keeps the nav on white above the title */ .single .blog-hero--plain .blog-header__nav { margin-bottom: 24px; } /* --- hero: featured image with title/meta on a navy scrim --- */ .single .blog-hero--image { position: relative; overflow: hidden; border-radius: 24px; min-height: 420px; display: flex; align-items: flex-end; } .single .blog-hero__image { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; border-radius: 0; margin: 0; } .single .blog-hero__scrim { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(6, 23, 53, .66) 0%, rgba(6, 23, 53, .28) 24%, rgba(6, 23, 53, .28) 40%, rgba(6, 23, 53, .72) 68%, rgba(6, 23, 53, .94) 100%); } .single .blog-hero__content { position: relative; z-index: 1; padding: 48px; width: 100%; } .single .blog-hero--image h1 { margin: 0 0 20px; color: #fff; font-size: 44px; line-height: 1.15; letter-spacing: -.01em; max-width: 22ch; } /* Plain variant when the post has no featured image */ .single .blog-hero--plain .blog-hero__content { padding: 8px 0 24px; border-bottom: 1px solid rgba(6, 23, 53, .1); } .single .blog-hero--plain h1 { margin: 0 0 20px; color: var(--Primary-100, #061735); font-size: 44px; line-height: 1.15; letter-spacing: -.01em; } .single .blog-hero--plain .blog-hero__meta { color: rgba(6, 23, 53, .8); } .single .blog-hero--plain .blog-hero__category { margin-bottom: 16px; } /* Category chip */ .single .blog-hero__category { display: inline-flex; align-items: center; width: fit-content; padding: 7px 16px; margin-bottom: 18px; border-radius: 32px; background: var(--Secondary-100, #CF2B24); color: #fff; font-size: 13px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; text-decoration: none; transition: background .3s ease; } .single .blog-hero__category:hover { background: #fff; color: var(--Secondary-100, #CF2B24); } /* Meta row: author / date / read time with icons */ .single .blog-hero__meta { display: flex; align-items: center; gap: 12px 28px; flex-wrap: wrap; color: rgba(255, 255, 255, .92); font-size: 15px; font-weight: 500; } .single .blog-hero__meta-item { display: inline-flex; align-items: center; gap: 8px; line-height: 1; white-space: nowrap; } .single .blog-hero__meta-item svg { color: var(--Secondary-100, #CF2B24); flex-shrink: 0; } .single .blog-hero--image .blog-hero__meta-item svg { color: #fff; opacity: .85; } .single .blog-hero__avatar { width: 32px; height: 32px; border-radius: 50%; object-fit: cover; box-shadow: 0 0 0 2px rgba(255, 255, 255, .6); } /* Optional short description under the hero */ .single .blog-header__description { margin-top: 28px; max-width: 70ch; font-size: 18px; line-height: 1.6; color: rgba(6, 23, 53, .8); } /* ============================================================ Blog single — article body rhythm & element styling ============================================================ */ .single .content-single-post .container { padding-top: 56px; padding-bottom: 24px; } /* Content images: flat corners, breathing room */ .single .content-single-post .container img { border-radius: 0; margin: 8px 0 16px; max-width: 100%; height: auto; } /* Headings rhythm (h2 brand red comes from the template rule) */ .single .content-single-post :where(h2, h3, h4) { margin-top: 48px; margin-bottom: 20px; line-height: 1.25; } .single .content-single-post :where(h2):first-child { margin-top: 0; } /* Blockquotes: navy panel with red spine */ .single .content-single-post blockquote { margin: 40px 0; padding: 28px 32px; background: #f5f7fb; border-left: 4px solid var(--Secondary-100, #CF2B24); color: var(--Primary-100, #061735); font-size: 18px; line-height: 1.6; } .single .content-single-post blockquote p { margin-bottom: 12px; } .single .content-single-post blockquote p:last-child { margin-bottom: 0; } .single .content-single-post blockquote cite { display: block; margin-top: 8px; font-style: normal; font-size: 14px; font-weight: 600; color: rgba(6, 23, 53, .6); } /* Post buttons: brand pill (beats the inline bg + btn-primary classes) */ .single .content-single-post .wp-block-button__link { display: inline-flex; align-items: center; justify-content: center; padding: 14px 28px; border-radius: 32px !important; border: none; background-color: var(--Secondary-100, #CF2B24) !important; color: #fff !important; font-size: 16px; font-weight: 600; line-height: 20px; text-decoration: none; box-shadow: none; transition: background-color .3s ease; } .single .content-single-post .wp-block-button__link:hover { background-color: var(--Primary-100, #061735) !important; color: #fff !important; } .single .content-single-post .wp-block-buttons { margin: 32px 0 40px; } /* Table of contents box. The plugin ships `display:table; width:auto`, which makes the box shrink-wrap (and so "warp") when the list is toggled closed — force a stable block box and background in both open and minimized states. */ .single .content-single-post #toc_container, .single .content-single-post #toc_container.contracted { display: block !important; width: 100% !important; margin: 0 0 40px; padding: 28px 32px; background: #f5f7fb !important; border: 1px solid rgba(6, 23, 53, .08); border-radius: 16px; font-size: 15px; } .single .content-single-post #toc_container .toc_title { margin-bottom: 12px; font-size: 18px; font-weight: 700; color: var(--Primary-100, #061735); text-align: left; } .single .content-single-post #toc_container .toc_list li { margin-bottom: 6px; } .single .content-single-post #toc_container a { color: var(--Primary-100, #061735); text-decoration: none; } .single .content-single-post #toc_container a:hover { color: var(--Secondary-100, #CF2B24); } .single .content-single-post #toc_container .toc_number { color: var(--Secondary-100, #CF2B24); font-weight: 700; } /* FAQ (accordion block) inside a post: clear, balanced separation from the article body — the block ships page-level 100px paddings that read wrong inside the reading column. */ .single .content-single-post .block-cbg-accordion { margin-top: 56px; } .single .content-single-post .block-cbg-accordion .container { padding-top: 56px; padding-bottom: 56px; } @media (max-width: 991px) { .single .blog-hero--image { min-height: 340px; border-radius: 16px; } .single .blog-hero__content { padding: 24px; } .single .blog-hero--image .blog-header__nav { padding: 12px 24px; } .single .blog-hero--image h1, .single .blog-hero--plain h1 { font-size: 30px; } .single .blog-hero__meta { font-size: 14px; gap: 10px 20px; } .single .content-single-post .container { padding-top: 40px; } } /* ============================================================ Blog single — related posts cards ============================================================ */ .single .related-posts .container { padding-top: 48px; padding-bottom: 100px; } .single .related-posts .related-card { position: relative; /* anchor for the stretched title link */ display: flex; flex-direction: column; height: 100%; background: #fff; border: 1px solid rgba(6, 23, 53, .1); border-radius: 24px; overflow: hidden; transition: border-color .3s ease; } /* Whole tile clickable: the title link stretches over the card */ .single .related-posts .related-card__title::after { content: ""; position: absolute; inset: 0; z-index: 1; } .single .related-posts .related-card:hover { border-color: rgba(6, 23, 53, .3); } .single .related-posts .related-card:hover .related-card__title { color: var(--Secondary-100, #CF2B24); } .single .related-posts .related-card:hover .related-card__more svg { transform: translateX(4px); } .single .related-posts .related-card__image { display: block; aspect-ratio: 16 / 9; overflow: hidden; } .single .related-posts .related-card__image img { width: 100%; height: 100%; object-fit: cover; border-radius: 0; margin: 0; transition: transform .4s ease; } .single .related-posts .related-card:hover .related-card__image img { transform: scale(1.04); } .single .related-posts .related-card__body { display: flex; flex-direction: column; flex-grow: 1; gap: 12px; padding: 24px; } .single .related-posts .related-card__meta { display: flex; align-items: center; gap: 8px 20px; flex-wrap: wrap; font-size: 13px; font-weight: 500; color: rgba(6, 23, 53, .65); } .single .related-posts .related-card__meta span { display: inline-flex; align-items: center; gap: 6px; line-height: 1; white-space: nowrap; } .single .related-posts .related-card__meta svg { color: var(--Secondary-100, #CF2B24); flex-shrink: 0; } .single .related-posts .related-card__title { display: block; color: var(--Primary-100, #061735); font-size: 20px; font-weight: 700; line-height: 1.3; text-decoration: none; transition: color .3s ease; } .single .related-posts .related-card__title:hover { color: var(--Secondary-100, #CF2B24); } .single .related-posts .related-card__excerpt { color: rgba(6, 23, 53, .7); font-size: 15px; line-height: 1.55; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; } .single .related-posts .related-card__excerpt p { margin: 0; } .single .related-posts .related-card__more { display: inline-flex; align-items: center; gap: 8px; margin-top: auto; padding-top: 4px; color: var(--Secondary-100, #CF2B24); font-size: 15px; font-weight: 700; text-decoration: none; } .single .related-posts .related-card__more svg { transition: transform .3s ease; } .single .related-posts .related-card__more:hover svg { transform: translateX(4px); } /* Equal-height slides in the slick slider */ .single .related-posts-slider .slick-track { display: flex; } .single .related-posts-slider .slick-slide { height: auto; } .single .related-posts-slider .slick-slide > div { height: 100%; } /* .container-filling { background: var(--Primary-100, #061735); height: 296px; width: 100%; margin-top: calc(-296px + 56px); } */ .related-posts .container { padding-top: 100px; padding-bottom: 100px; } .related-posts .container .h1 { margin-bottom: 56px; } .related-posts img { border-radius: 32px; margin-bottom: 32px; } #breadcrumbs a { color: black; font-weight: 700; text-decoration: none; } .related-posts .tags-links { margin-top: 16px; } .related-posts :where(.description, .post-meta) { margin-top: 24px; } .related-posts-slider .slick-slide { margin: 0 12px; } .archive h1 { margin-bottom: 40px; } .archive .cart-product { display: flex; flex-direction: column; border-radius: 32px; background: var(--Primary-5, linear-gradient(0deg, rgba(255, 255, 255, 0.95) 0%, rgba(255, 255, 255, 0.95) 100%), #061735); gap: 12px; padding: 35px; align-items: center; height: 100%; justify-content: center; } .archive #content.archive { padding-top: 80px; padding-bottom: 100px; } .archive #content.archive-project .related-posts, .archive #content.archive-product .related-posts, .row.related-posts.archive { row-gap: 24px; } .archive #content.archive-project .related-posts .card .card-body .button, .archive #content.archive-product .related-posts .cart-product .button, .row.related-posts.archive .cart-product .button { background: var(--Secondary-100, #CF2B24); margin-top: 12px; } .archive #content.archive-project .related-posts .card .card-body .button:hover, .archive #content.archive-product .related-posts .cart-product .button:hover, .row.related-posts.archive .cart-product .button:hover, .block-cbg-ready-start-project .background_picture .button:hover { background: var(--Secondary-100, #b22d27); } .archive #content.archive-product .related-posts .cart-product img { margin-bottom: 0; } .archive #content.archive-project .related-posts .card img { border-radius: 0; margin-bottom: 0; } .archive #content.archive-project .related-posts .card .card-body { display: flex; flex-direction: column; gap: 25px; } .archive #content.archive-project .related-posts .card { --bs-card-border-radius: 32px; overflow: hidden; background: var(--Primary-5, linear-gradient(0deg, rgba(255, 255, 255, 0.95) 0%, rgba(255, 255, 255, 0.95) 100%), #061735); border: none; } /* pagination */ .pagination { margin-top: 64px; border: none !important; --bs-pagination-border-width: 0; } .pagination .page-item { border-radius: 8px; overflow: hidden; height: fit-content; } .pagination .page-link.active, .pagination .active>.page-link { background: var(--Primary-15, linear-gradient(0deg, rgba(255, 255, 255, 0.85) 0%, rgba(255, 255, 255, 0.85) 100%), #061735) !important; border: none; --bs-pagination-active-color: var(--Text-100, #040611); } .pagination .page-link { font-style: normal; font-weight: 600; line-height: 20px; --bs-pagination-font-size: 16px; --bs-pagination-color: var(--Text-80, #4F5158); width: 40px; height: 40px; display: flex; justify-content: center; align-items: center; padding: 0; } .page-link:hover { --bs-pagination-hover-color: var(--Text-100, #040611); background: var(--Primary-5, linear-gradient(0deg, rgba(255, 255, 255, 0.95) 0%, rgba(255, 255, 255, 0.95) 100%), #061735); } /* end pagination */ @media (max-width: 992px) { .related-posts-slider.slick-slider .slick-prev { display: none; } section.blog-header { margin-top: 60px; } section.blog-header .back-to { margin-left: -16px; } .blog-header h1 { font-weight: 700; } section.blog-bacground { margin-top: 48px; } section.blog-bacground img { border-radius: 24px; } section.related-posts .container { padding-top: 64px; padding-bottom: 64px; } section.related-posts .container .h1 { font-weight: 700; } .pagination { margin-top: 48px; } } #menu-header-menu { display: flex; align-items: center; gap: 1px; list-style-type: none; margin: 0; padding: 0; margin-left: auto; } #menu-header-menu>li>.mega-menu { display: none; } #menu-header-menu>li.menu-item { padding: 8px 8px; position: relative; } #menu-header-menu>li.menu-item a { color: var(--Text-100, #040611); font-size: 16px; font-style: normal; font-weight: 400; line-height: 24px; text-decoration: none; display: inline-flex; align-items: center; } #menu-header-menu>li.menu-item-object-custom>a:nth-child(1) { border-radius: 32px; padding: 8px 12px; } #menu-header-menu>li.menu-item-object-custom:not(.button.but-red)>a:nth-child(1):hover { background: #f3f4f5; } #menu-header-menu>li.menu-item-has-children>a::after { content: ''; background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3cpath fill-rule='evenodd' clip-rule='evenodd' d='M13.8047 4.86128C14.0651 5.12163 14.0651 5.54374 13.8047 5.80409L8.4714 11.1374C8.21105 11.3978 7.78894 11.3978 7.5286 11.1374L2.19526 5.80409C1.93491 5.54374 1.93491 5.12163 2.19526 4.86128C2.45561 4.60093 2.87772 4.60093 3.13807 4.86128L8 9.72321L12.8619 4.86128C13.1223 4.60093 13.5444 4.60093 13.8047 4.86128Z' fill='%23040611'/%3e%3c/svg%3e"); width: 16px; height: 16px; display: inline-flex; justify-content: center; align-items: center; background-position: center; background-size: auto; margin-left: 8px; } #menu-header-menu>li.menu-item-has-children:hover>a::after { background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3cg id='icons/outline/arrow-up-simple'%3e%3cpath id='Icon (Stroke)' fill-rule='evenodd' clip-rule='evenodd' d='M2.19526 11.1381C1.93491 10.8778 1.93491 10.4557 2.19526 10.1953L7.5286 4.86197C7.78895 4.60162 8.21106 4.60162 8.4714 4.86197L13.8047 10.1953C14.0651 10.4557 14.0651 10.8778 13.8047 11.1381C13.5444 11.3985 13.1223 11.3985 12.8619 11.1381L8 6.27618L3.13807 11.1381C2.87772 11.3985 2.45561 11.3985 2.19526 11.1381Z' fill='%23CF2B24'/%3e%3c/g%3e%3c/svg%3e "); } #menu-header-menu>li.menu-item-has-children:hover>a { color: var(--Secondary-100, #CF2B24); } ul#menu-header-menu .container-menu { width: 100vw; position: fixed; left: 0; right: 0; top: 113px; z-index: 9; padding-top: 22px; } .admin-bar ul#menu-header-menu .container-menu { top: 145px; } ul#menu-header-menu .container-menu>.container.g-0 { border-radius: 32px; border: 1px solid var(--Primary-15, #061735); background: var(--Text-White, #FCFCFC); box-shadow: -386px 428px 161px 0px rgba(128, 128, 128, 0.00), -247px 274px 147px 0px rgba(128, 128, 128, 0.01), -139px 154px 124px 0px rgba(128, 128, 128, 0.02), -62px 68px 92px 0px rgba(128, 128, 128, 0.03), -15px 17px 51px 0px rgba(128, 128, 128, 0.04); padding-top: 40px; padding-bottom: 40px; } ul#menu-header-menu .container-menu>.container li.menu-item a { text-decoration: none; color: var(--Primary-100, #061735); text-align: center; font-family: 'Plus Jakarta Sans', 'Sora', sans-serif; font-size: 16px; font-style: normal; font-weight: 600; line-height: 20px; text-align: left; transition: 0.3s; } ul#menu-header-menu .container-menu>.container li.menu-item a:hover { color: #cf2b24; } #menu-header-menu ul { list-style-type: none; margin: 0; padding: 0; } #menu-header-menu .sub-menu.row { row-gap: 10px; } #menu-header-menu>li.menu-item ul.order-lg-first a, #menu-header-menu .sub-menu.row li>a.nav-link { height: 48px; padding: 16px; justify-content: center; align-items: center; border-radius: 32px; display: flex; width: fit-content; color: var(--Primary-100, #061735); font-size: 16px; font-style: normal; font-weight: 600; line-height: 20px; } #menu-header-menu>li.menu-item ul.order-lg-first a.nav-link.active, #menu-header-menu .sub-menu.row li>a.nav-link.active { background: var(--Secondary-15, linear-gradient(0deg, rgba(255, 255, 255, 0.85) 0%, rgba(255, 255, 255, 0.85) 100%), #CF2B24); margin-left: 16px; margin-right: 16px; } #menu-header-menu>li.menu-item ul.order-lg-first a:hover { color: #CF2B24; } #menu-header-menu .sub-menu.row .tab-pane { display: none !important; } #menu-header-menu .sub-menu.row .tab-pane.active.show { display: flex !important; position: relative; } #menu-header-menu .container-menu ul.order-lg-first { position: relative; } #menu-header-menu .container-menu ul.order-lg-first::after { content: ''; background: var(--Primary-15, linear-gradient(0deg, rgba(255, 255, 255, 0.85) 0%, rgba(255, 255, 255, 0.85) 100%), #061735); width: 1px; height: 100%; display: flex; right: 0; top: 0; position: absolute; } #menu-header-menu .container-menu { opacity: 0; /* Initially hidden */ transition: opacity 0.5s ease; /* Smooth fade transition */ pointer-events: none; /* Prevent interaction when hidden */ position: absolute; top: 100%; /* Position it below the parent link */ left: 0; width: 100%; /* Adjust as needed */ } /* Show mega menu on hover of the parent menu item */ #menu-header-menu .menu-item-has-children:hover .container-menu { opacity: 1; /* Fade in when parent is hovered */ pointer-events: auto; /* Enable interaction */ } /* #menu-header-menu .container-menu { //transform-origin: top; //transform: scaleY(0); transition: transform 0.5s ease-out; } #menu-header-menu>li.menu-item-has-children:hover .container-menu { transform: scaleY(1); } */ #menu-header-menu li.button.but-red { padding: 14px 24px; border-radius: 32px; background: var(--Secondary-100, #CF2B24); cursor: pointer; margin-left: 20px; } #menu-header-menu>li.button.but-red a { color: var(--Text-White, #FCFCFC); font-weight: 600; line-height: 20px; background: none; padding: 0; } #menu-header-menu li.button.but-red:hover { background: var(--Primary-90, linear-gradient(0deg, rgba(255, 255, 255, 0.10) 0%, rgba(255, 255, 255, 0.10) 100%), #061735); } #menu-header-menu>li.active>a:nth-child(1) { color: var(--Secondary-100, #CF2B24); font-weight: 600; line-height: 20px; } .btn-close { position: absolute; right: 20px; top: 20px; z-index: 99; } .btn-close:hover { background: var(--bs-btn-close-bg); padding: 0.25em 0.25em; } .modal-body .wpcf7-form { display: flex !important; flex-direction: column; gap: 24px; align-items: center; padding: 15px; } .modal-content { --bs-modal-bg: var(--Text-White, #FCFCFC); --bs-modal-border-radius: 32px; --bs-modal-border-width: 1px; --bs-modal-border-color: var(--Primary-15, #061735); } .modal-content .h3 span { color: var(--Secondary-100, #CF2B24); } .modal-content .h3 { border-bottom: 1px solid var(--Primary-15, #061735); padding-bottom: 20px; } @media screen and (max-width:992px) { #menu-header-menu { flex-direction: column; gap: 24px; align-items: flex-start; } #menu-header-menu>li.menu-item-object-custom>a:nth-child(1) { border-radius: 0; padding: 0; } #menu-header-menu>li.menu-item-object-custom:not(.button.but-red)>a:nth-child(1):hover { background: none; } #menu-header-menu>li.menu-item { padding: 0; } ul#menu-header-menu .container-menu { width: 100%; position: static; } ul#menu-header-menu .container-menu>.container.g-0 { border: none; background: none; border-radius: 0; box-shadow: none; padding: 0; margin: 0; } #menu-header-menu .container-menu { height: 0; } #menu-header-menu>li.menu-item ul.order-lg-first a.nav-link.active { background-color: transparent; color: var(--Secondary-100, #CF2B24); } #menu-header-menu .container-menu ul.order-lg-first::after { content: none; } #menu-header-menu>li.menu-item-has-children:hover .container-menu { transform: scaleY(0); } #menu-header-menu .container-menu.active { height: auto !important; transform: scaleY(1) !important; } #menu-header-menu .sub-menu.row li>a.nav-link.active { /* background: ; */ } a.nav-link[data-bs-toggle="tab"]::after { content: ''; background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3cpath fill-rule='evenodd' clip-rule='evenodd' d='M13.8047 4.86128C14.0651 5.12163 14.0651 5.54374 13.8047 5.80409L8.4714 11.1374C8.21105 11.3978 7.78894 11.3978 7.5286 11.1374L2.19526 5.80409C1.93491 5.54374 1.93491 5.12163 2.19526 4.86128C2.45561 4.60093 2.87772 4.60093 3.13807 4.86128L8 9.72321L12.8619 4.86128C13.1223 4.60093 13.5444 4.60093 13.8047 4.86128Z' fill='%23040611'/%3e%3c/svg%3e"); width: 16px; height: 20px; display: inline-flex; justify-content: center; align-items: center; background-position: center bottom; background-size: auto; margin-left: 8px; } #menu-header-menu .sub-menu.row li>a.nav-link.active { background: none; color: var(--Secondary-100, #CF2B24); font-weight: 700; } #menu-header-menu .sub-menu.row li>a.nav-link { padding: 0; height: auto; font-weight: 300; } ul#menu-header-menu .container-menu>.container li.menu-item a { font-weight: 300; } #menu-header-menu .sub-menu.row { row-gap: 10px; } .sub-menu .main-sub-menu a:first-child { margin-top: 24px; } } .single figure { width: fit-content; display: inline-flex; gap: 10px; padding: 5px; } #nav-main .background-red { background: var(--Secondary-100, #CF2B24); } @media screen and (max-width:390px) { a.navbar-brand img.d-td-none.me-2 { width: 75px; } #nav-main .background-red { background: var(--Secondary-100, #CF2B24); padding: 10px; font-size: 14px; } #nav-main .navbar-brand { --bs-navbar-brand-margin-end: 0; } } .modal-body .fieldset-cf7mls.cf7mls_current_fs { display: flex !important; flex-direction: column; gap: 24px; align-items: center; padding: 15px; } .wpcf7-form .spinner-border { display: none } .wpcf7-form.submitting .spinner-border { display: inline-block; } .wpcf7-form .cf7mls_back { background: none; color: #061735; } form.wpcf7-form .two-buttons button { width: fit-content; gap: 12px; } form.wpcf7-form .two-buttons { display: flex; width: 100%; justify-content: space-between; } ul#menu-header-menu .container-menu>.container li.menu-item.current-menu-item a { color: var(--Secondary-100, #CF2B24); } .header-nav-menu .sub-menu .sub-menu .menu-item.menu-item-type-taxonomy.menu-item-object-product_category a { padding: 12px 22px; border-radius: 32px; background: var(--Secondary-100, #CF2B24); color: white !important; } .header-nav-menu .sub-menu .sub-menu .menu-item a { padding: 12px 0; } select.postform { background-size: 12px; background-position: right 20px center; } @media (min-width: 767px) { .custom-form-location-page { display: none; } } .custom-form-location-page { border-radius: 32px; border: 1px solid #DADCE1; background: var(--Text-White, #FCFCFC); padding: 40px; margin-left: 15px; margin-right: 15px; } .custom-form-location-page form.wpcf7-form .fieldset-cf7mls, .custom-form-location-page form.wpcf7-form { display: flex !important; flex-direction: column; gap: 24px; align-items: center; } /* 19 Feb 2025 corrections */ /* Header is opaque white at ALL times — prevents the hero flashing through the transparent header before it pins, and the see-through gap above the mega menu when opened just before the sticky state kicks in. */ header#masthead { background-color: #fff; } header#masthead.fixed { width: 100%; position:fixed; top:44px; background:white; z-index:999; /* visible separation from the white page + soft depth */ border-bottom: 1px solid rgba(6, 23, 53, .12); box-shadow: 0 6px 20px -10px rgba(6, 23, 53, .28); } header#masthead.fixed + div { padding-top: 136px; } @media (max-width: 390px) { header#masthead.fixed + div { padding-top: 124px; } } .header-top-menu.fixed { width: 100%; position:fixed; top:0; z-index:99999; } .fixed ul#menu-header-menu .container-menu { padding-top: 16px; } @media (min-width: 992px) and (max-width: 1200px) { header #nav-main .container { padding-left: 15px; padding-right: 15px; } #menu-header-menu>li.menu-item-object-custom>a:nth-child(1), #menu-header-menu>li.menu-item-object-custom>span.menu-link.main-menu-link, #menu-header-menu>li.menu-item-object-page>a:nth-child(1) { padding-left: 0px; padding-right: 0px; font-size: 15px; } /* Keep every top-level item on a single line and tighten the row so it fits between 992px and the desktop layout without wrapping. */ #menu-header-menu > li.menu-item { margin-left: 14px; margin-right: 14px; } #menu-header-menu > li.menu-item > a { white-space: nowrap; } /* Trim the CTA so it doesn't crowd the links at this width */ #menu-header-menu li.button.but-red, #nav-main .button.but-red { padding: 12px 18px; margin-left: 12px; } } /* Never let a top-level item break mid-word on desktop */ @media (min-width: 992px) { #menu-header-menu > li.menu-item > a { white-space: nowrap; } /* Keep the logo at its natural size — stop the flex row from squishing it (brand doesn't shrink) without overriding its dimensions. */ #nav-main .navbar-brand { flex: 0 0 auto; } a.navbar-brand img.d-td-none.me-2 { flex-shrink: 0; } } /* Tightest desktop band — shrink a touch more so 6 items + logo + CTA fit. Match the same high-specificity selectors so the font size actually wins. */ @media (min-width: 992px) and (max-width: 1080px) { #menu-header-menu>li.menu-item-object-custom>a:nth-child(1), #menu-header-menu>li.menu-item-object-custom>span.menu-link.main-menu-link, #menu-header-menu>li.menu-item-object-page>a:nth-child(1), #menu-header-menu>li.menu-item > a { font-size: 14px; } #menu-header-menu > li.menu-item { margin-left: 8px; margin-right: 8px; } #menu-header-menu li.button.but-red, #nav-main .button.but-red { padding: 11px 16px; margin-left: 10px; } } @media screen and (max-width:992px) { #nav-main .button.but-red { //display: none !important; font-size: 10px; padding: 10px 16px } header.header-sticky-top.fixed #nav-main .button.but-red { display: block !important; } .display-h1 { font-size: 32px; line-height: 1.2; margin-bottom: 0px; } .custom-form-location-page { padding: 30px 15px; } .custom-form-location-page .h3 { font-size: 24px; } .button { font-size: 14px; } input:focus-visible { outline: none; } h2, .h2, .h1 { font-size: 26px !important; line-height: 34px !important; margin-bottom: 20px !important; } header .header-actions button i{ font-size: 22px; } a.navbar-brand img.d-td-none.me-2 { width: 83px; } } .phone-number-topbar { padding: 14px 0 14px 0; color: var(--Text-White, #FCFCFC); text-align: center; font-size: 16px; font-weight: 600; line-height: 20px; display: flex; text-decoration: none; align-items: center; gap: 12px; justify-content: center; } .grecaptcha-badge { display: none !important; } .custom-form-location-page .h3 span { color: var(--Secondary-100, #CF2B24); } /* * =================TEMP========================================== * */ @media (max-width: 767px) { div.header-top-menu { display: none; } header#masthead.fixed { top: 0px; } } /* * ================================================================ * */ @media (min-width: 767px) { .header-phone-menu, .header-phone-button { display: none; } } .header-phone-button { border-radius: 32px; background: var(--Secondary-Primary-100, #061735); padding: 7px 16px 9px 16px; } .header-phone-menu .container > div { display: flex; flex-direction: column; margin-bottom: 20px; } .header-phone-menu .container > div a { color: var(--Text-100, #040611); font-size: 16px; font-style: normal; } .header-phone-menu .container { padding-top: 20px; } .header-phone-button img { width: 16px; height: 16px; } #masthead:not(.fixed) .header-phone-button { //margin-left: 27%; //display: none; } /* youtube embed fix */ .youtube-embed { max-width: 850px; margin: 0 auto; } .youtube-embed iframe { width: 100vw; aspect-ratio: 16 / 9; height: 500px; } /* #offcanvas-navbar-phone #offcanvas-navbar-phone-button */ /* Section Styling */ .quote-block-v2 { background-size: cover; background-position: center; position: relative; padding: 20px 0; color: #fff; background-size: cover; background-position: center; border-radius: 20px; overflow: hidden; padding-left: 36px; padding-right: 41px; } .quote-block-v2 .container { position: relative; z-index: 2; } /* Text Section */ .quote-text h1, .quote-text h2, .quote-text h3 { font-weight: 700; margin-bottom: 15px; line-height: 1.3; } .quote-text h3 { font-weight: 400; font-size: 1.2rem; color: white; } .quote-text ul { list-style: none; padding-left: 0; margin-top: 20px; } .quote-text li { margin-bottom: 10px; font-size: 1rem; display: flex; align-items: center; } .quote-text li::before { content: "✔"; margin-right: 10px; color: #6cb800; /* soft green */ font-weight: bold; } /* Form Container */ /*.quote-form { background: #fff; border-radius: 16px; padding: 35px 30px; max-width: 420px; margin-left: auto; color: #000; box-shadow: 0 6px 24px rgba(0, 0, 0, 0.15); min-height: 440px; } .quote-form h4 { font-size: 1.5rem; margin-bottom: 25px; font-weight: 600; } /* Form Fields */ /* .quote-form input, .quote-form textarea { width: 100%; padding: 12px 16px 12px 42px; border: 1px solid #ccc; margin-bottom: 16px; border-radius: 8px; font-size: 1rem; background-color: #f9f9f9; position: relative; } */ /* Form Field Icons - Optional Font Awesome or Inline SVG */ .quote-form input[type="text"], .quote-form input[type="email"], .quote-form input[type="tel"] { background-repeat: no-repeat; background-position: 12px center; background-size: 18px; } .quote-form input[type="text"] { background-image: url('data:image/svg+xml;utf8,'); } .quote-form input[type="tel"] { background-image: url('data:image/svg+xml;utf8,'); } /* Submit Button */ .quote-form input[type="submit"], .quote-form button { background-color: #6cb800; color: #fff; font-weight: 600; padding: 12px; border: none; width: 100%; border-radius: 50px; transition: background 0.3s ease; } .quote-form input[type="submit"]:hover { background-color: #5aa500; cursor: pointer; } .quote-form small { display: block; margin-top: 12px; font-size: 0.85rem; color: #555; } /* Mobile */ @media (max-width: 768px) { .quote-block-v2 { padding: 16px 15px; } .awards-section { justify-content: center; display: flex; gap: 8px; } .award-item { /*max-width: 42px !important;*/ } .quote-text { text-align: left; margin: 0 auto; } .quote-form { margin-top: 40px; } } .awards-section { gap: 20px; flex-wrap: wrap; align-items: center; } .award-item { display: inline-block; max-width: 80px; text-align: center; } .award-img { max-height: 60px; object-fit: contain; transition: transform 0.3s ease; display: block; margin: 0 auto; } .award-img:hover { transform: scale(1.05); } .award-title { color: #fff; font-size: 0.85rem; margin-top: 6px; } .quote-block-v2 .quote-text ul { list-style: none; padding-left: 0; margin-top: 20px; margin-bottom: 30px; } .cbg-header-bg { background-image: linear-gradient(rgba(0, 0, 0, 0.65), rgba(0, 0, 0, 0.65)), var(--bg-url); background-size: cover; background-position: center; border-radius: 32px; padding: 80px 48px; aspect-ratio: 16 / 9; width: 100%; height: auto; } .cbg-header { align-items: center; height: auto; } .cbg-header .col-md-5 { min-height: 500px; } .quote-form .wpcf7 { border-radius: 32px; border: 1px solid #DADCE1; background: var(--Text-White, #FCFCFC); padding: 40px; max-width: 496px; } /* Mobile */ @media (max-width: 768px) { .cbg-header-bg { background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), var(--bg-url); background-size: cover; background-position: center; border-radius: 25px; padding: 32px; aspect-ratio: 16 / 9; /* Keeps height consistent */ } .quote-form .wpcf7 { padding: 24px; } } @media (max-width: 767px) { .cbg-form { display: none !important; } } /* ===== Mega menu — rebuilt tab structure (tablist column + .tab-content panels) ===== */ /* Desktop: only the active province panel is visible */ #menu-header-menu .tab-content > .tab-pane { display: none; } #menu-header-menu .tab-content > .tab-pane.active.show { display: block; } /* City list inside a panel is the flex grid (was previously the pane itself) */ #menu-header-menu .tab-pane > ul.sub-menu.row { display: flex; } /* Keyboard focus outline for tabs and panels */ #menu-header-menu a[role="tab"]:focus-visible, #menu-header-menu .tab-pane:focus-visible { outline: 2px solid #CF2B24; outline-offset: 2px; } @media screen and (max-width: 992px) { /* custom.js moves the tapped panel out of .tab-content into the province