/*
 Theme Name:   Bricks Child Theme
 Theme URI:    https://bricksbuilder.io/
 Description:  Use this child theme to extend Bricks.
 Author:       Bricks
 Author URI:   https://bricksbuilder.io/
 Template:     bricks
 Version:      1.1
 Text Domain:  bricks
*/
html {
	font-size: 100%;
}
/* ==========================================================================
   55. Quick contact bar
   Call, WhatsApp and a quote tab, pinned to the right edge on a desktop and
   dropped to a three-way bar along the bottom on a phone, where a thumb can
   reach it. Replaces the single sticky pill.

   STANDALONE VERSION - no CSS custom properties. Values inlined:
     --z-overlay 300 | --r-sm 6px | --r-md 12px | --s-3 1.25rem
     --t-micro .78rem | --t-small .875rem
     --c-navy #011C36 | --c-red #E4002B | --c-maroon #A2001F
     --ease cubic-bezier(.22, 1, .36, 1)
     --f-sans "Archivo", "Helvetica Neue", Arial, sans-serif
   ========================================================================== */
.quickbar {
  position: fixed;
  top: 50%;
  right: 0;
  z-index: 300;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  transform: translateY(-50%);
  border-radius: 12px 0 0 12px;
  overflow: hidden;
  box-shadow: -6px 8px 28px rgba(1, 28, 54, .3);
}
.quickbar__btn,
.quickbar__tab {
  display: flex;
  align-items: center;
  justify-content: center;
  transition: filter .2s cubic-bezier(.22, 1, .36, 1), padding .2s cubic-bezier(.22, 1, .36, 1);
}
.quickbar__btn { width: 54px; height: 54px; }
.quickbar__btn--call { background: #011C36; color: #fff; }
.quickbar__btn--wa   { background: #25D366; color: #fff; }
.quickbar__btn--wa:hover   { background: #7ce67a; }
.quickbar__btn--call:hover { background: #023261; }
.quickbar__ico { display: flex; }
.quickbar__icon { width: 22px; height: 22px; fill: currentColor; }
.quickbar__word {
  position: absolute;
  width: 1px; height: 1px;
  overflow: hidden;
  clip-path: inset(50%);
}
.quickbar__tab {
  padding: 1.25rem 0;
  background: #007fba;
  font-size: .78rem;
  font-weight: 800;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: #fff;
  writing-mode: vertical-rl;
  text-orientation: mixed;
  min-height: 168px;
}
.quickbar__tab:hover { background: #2a4083; }
@media (max-width: 700px) {
  .quickbar {
    top: auto;
    bottom: 0;
    left: 0;
    right: 0;
    flex-direction: row;
    transform: none;
    border-radius: 0;
    box-shadow: 0 -4px 20px rgba(1, 28, 54, .32);
  }
  .quickbar__btn { flex: 0 0 auto; width: 68px; height: 56px; }
  .quickbar__tab {
    flex: 1;
    min-height: 0;
    padding: 0;
    writing-mode: horizontal-tb;
    font-size: .875rem;
    letter-spacing: .08em;
  }
}

/* ==========================================================================
   56. WhatsApp button
   Sits with the quote and call buttons in the hero, in WhatsApp's own green
   so it is recognised before it is read.
   ========================================================================== */
.button--wa {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 17px 26px;
  border: 0;
  border-radius: 6px;
  background: #25D366;
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: .01em;
  line-height: 1.2;
  color: #06301A;
  text-align: center;
  white-space: nowrap;
  cursor: pointer;
  transition: background .22s cubic-bezier(.22, 1, .36, 1), transform .22s cubic-bezier(.22, 1, .36, 1), box-shadow .22s cubic-bezier(.22, 1, .36, 1);
}
.button--wa:hover {
  background: #1EBE5A;
  transform: translateY(-2px);
  box-shadow: 0 12px 28px rgba(37, 211, 102, .32);
}
.button--wa:active { transform: translateY(0); }
.button--wa .button__icon { width: 18px; height: 18px; fill: currentColor; }
@media (max-width: 640px) {
  .button--wa { width: 100%; }
}

/* the bar is fixed to the bottom on phones, so the page needs to end above it
   or the last line of the footer sits underneath it permanently */
@media (max-width: 700px) {
  body { padding-bottom: 56px; }
}