/* ==========================================================================
   CleanBreeze — shared header + footer styles.

   EXTRACTED from the main site (cleanbreeze.pt):
     cleanbreezefinal/public_html/media/css/{base,custom}.css

   Only rules whose selectors are actually used by views/Cms/header.tpl and
   views/Cms/footer.tpl are included — the main site's stylesheets are global
   and unscoped, so importing them wholesale would fight the landing page.

   REGENERATE, do not hand-edit: scratchpad/build/extract_css.py
   If the main site's header changes, re-run the extractor rather than patching
   this file, or the two sites will drift.

   Requires Bootstrap 5 (the markup uses data-bs-* and .navbar-expand-lg).
   ========================================================================== */

/* ======================================================================
   from base.css — 1 of 360 rules
   ====================================================================== */
#footer { width: 100%; }
/* ======================================================================
   from custom.css — 56 of 347 rules
   ====================================================================== */
#header { display: flex; align-items: center; justify-content: space-between; padding: 15px 20px; position: absolute; width: 100%; left: 0px; z-index: 1000; padding: 40px 110px; }
#menu_id_19 { display: flex; flex-direction: row; gap: 50px; margin: 0; padding: 0; }
#menu_id_19 li, #menu_id_19 a { color: white; list-style: none; text-decoration: none; color: #FFF; font-family: "Host Grotesk", sans-serif; font-size: 18px; font-style: normal; font-weight: 400; }
.navbar-toggler { border: none; background-color: transparent; outline: none; padding: 5px 10px; z-index: 9999; }
.navbar-toggler-icon { background-color: white; border-radius: 3px; width: 25px; height: 3px; display: block; position: relative; transition: all 0.3s ease; }
.navbar-toggler.collapsed .navbar-toggler-icon::before,
.navbar-toggler.collapsed .navbar-toggler-icon::after { content: ""; background-color: white; width: 25px; height: 3px; position: absolute; left: 0; transition: all 0.3s ease; }
.navbar-toggler-icon::before { content: ""; background-color: white; width: 25px; height: 3px; position: absolute; left: 0; transition: all 0.3s ease; top: -7px; }
.navbar-toggler-icon::after { content: ""; background-color: white; width: 25px; height: 3px; position: absolute; left: 0; transition: all 0.3s ease; top: 7px; right: -10px; }
.navbar-toggler[aria-expanded="true"] .navbar-toggler-icon::before { transform: rotate(45deg) translateY(10px); left: -20px; }
.navbar-toggler[aria-expanded="true"] .navbar-toggler-icon::after { transform: rotate(-45deg) translateY(-10px); left: -20px; }
.navbar-toggler[aria-expanded="true"] .navbar-toggler-icon { width: 0px; }
.dropdown-menu { border: none; font-family: "Host Grotesk", sans-serif; font-size: 18px; font-weight: 400; background: rgba(33, 33, 33, 0.70); border-top: 4px solid #1085B7; border-radius: 0px 0px .25rem .25rem; }
.dropdown-menu .dropdown-item { color: #8F8F8F!important; text-decoration: none; padding: 10px 20px; background-color: transparent; transition: color 0.2s ease-in-out; }
.dropdown-menu .dropdown-item:last-child { padding-bottom: 0px; }
.dropdown-menu .dropdown-item:hover { color: #FFF!important; }
.dropdown-menu .dropdown-item:hover { color: #FFF; }
.logotipoHeader { height: 100px; }
.dropdown-menu.show { left: -172px; }
#footer { background-color: #1085B7; }
.logotipoFooter { filter: brightness(100); height: 70px; }
.containerFooter { display: grid; grid-template-columns: 4fr 1fr 1fr 2fr; }
.iconFlex, .iconFlex a { display: flex; color: #FFF; font-family: "Host Grotesk"; font-size: 16px; font-weight: 400; margin-top: 18px; text-decoration: none; }
.iconFlex img { margin-right: 10px; height: fit-content; }
.titulosMenusFooter { color: #FFF; font-family: "Host Grotesk"; font-size: 18px; font-weight: 700; }
.menusFooter, .menusFooter li a { color: #FFF!important; font-family: "Host Grotesk"; font-size: 16px; font-style: normal; font-weight: 400; line-height: 250%; list-style: none; padding: 0px; text-decoration: none; }
.menusFooter .menus2nd li a { font-size: 12px; }
.bottomFooter { display: grid; grid-template-columns: 1fr 1fr 1fr; }
.bottomFooter div, .bottomFooter a { color: #FFF; font-family: "Host Grotesk"; font-size: 14.286px; font-style: normal; font-weight: 400; line-height: normal; text-decoration: none; }
.bottomFooter div:nth-child(1) { display: flex; align-items: center; }
.bottomFooter div:nth-child(2) { display: flex; justify-content: center; }
.bottomFooter div:nth-child(3) { display: flex; align-items: center; justify-content: right; }
.menus2nd { list-style: none; margin: 0; padding: 0; padding-left: 20px; }
.menus2nd li { margin: 5px 0; }
.menus2nd li a { text-decoration: none; color: #8F8F8F; }
.menus2nd li a:hover { color: #FFF; }
.voltarTopo { max-height: max-content; cursor: pointer; height: fit-content; }
.logotipoHeaderExpanded { display: none; }
.containerHomepage { padding: 80px 110px; font-family: "Host Grotesk"; }
.containerHomepage .containerContactosMapaTitulo:last-child { margin-top: 40px; }

@media (max-width: 1100px) {
    .containerHomepage { padding: 80px 70px; }
    #header { padding: 40px 70px; }
}

@media (max-width: 992px) {
    .containerFooter { display: grid; grid-template-columns: 1fr; }
    .menu1Footer { margin-top: 30px; }
    .bottomFooter { display: grid; grid-template-columns: 1fr; }
    .bottomFooter div:nth-child(1) { justify-content: center; margin-bottom: 20px; }
    .bottomFooter div:nth-child(3) { justify-content: center; margin-top: 20px; }
    #menu_id_19 { flex-direction: column; left: 70px; top: 40px; position: absolute; height: 100vh; gap: 20px; width: 100%; padding-right: 70px; }
    #menuheader.show, #menuheader.collapsing { position: fixed; top: 0px; left: 0px; background: rgba(0, 0, 0, 0.90); backdrop-filter: blur(2.5px); width: 100%; height: 100vh; }
    .logotipoHeaderExpanded { display: block; }
    #menu_id_19 li { padding-right: 70px; }
    .dropdown-menu { background-color: transparent; }
    .dropdown-item { white-space: normal; }
}

@media (max-width: 680px) {
    .logotipoHeader { height: 60px; }
}

@media (max-width: 500px) {
    #header { padding: 40px 40px; }
    .containerHomepage { padding: 80px 40px; }
    #menu_id_19 { left: 40px; }
}