/* site.css — site-wide CSS every page needs, moved out of the 38 per-page head fragments
   (CLAUDE.md "Code rules"). Source: Webflow Site settings → custom code (head) and Webflow's
   interaction anti-flicker style. Linked once by src/components/BaseHead.astro, after the Webflow
   stylesheets and before overrides.css — the same position the inline <style> blocks had. */

/* Webflow interactions: hide animated blocks until IX3 has initialised (anti-flicker). */
html.w-mod-js:not(.w-mod-ix3) :is(.get-started-options-columns, .work-with-contractor-container) {visibility: hidden !important;}

/* ---- Webflow site custom code (head) ---- */
  /* --- Hide Number Input Arrows START --- */
  /* Chrome, Safari, Edge, Opera */
  input::-webkit-outer-spin-button,
  input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
  }
  /* Firefox */
  input[type=number] {
    -moz-appearance: textfield;
  }
  /* --- Hide Number Input Arrows END --- */
  .w-dropdown-list, .w-dropdown-list .body-text {
    background: #fffef6 !important;
  }
  .dropdown-list.w--open {
    margin-top: 0 !important;
  }
  .header {
    z-index: 9999;
  }
  .sticky-header {
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  }
  .nav-link-cus.w--current {
    margin: 20px 0 10px;
  }
  .nav-menu-2.menu-cus {
    justify-content: space-between;
  }
  .w-slider-dot {
  background: #E1C2A4;
  }
  .w-slider-dot.w-active {
    background: #E26231;
  }
  /* Custom Form Styling */
  @media only screen and (max-width: 480px) {
    .code-embed-2 {
      width: 100%;
    }
    .code-embed-2 fieldset.form-columns-2 {
      max-width: 100% !important;
    }
    .code-embed-2 fieldset.form-columns-2 .field.hs-form-field .input
    {
      margin-right: 0 !important;
      margin-top: 10px;
      margin-bottom: 10px;;
    }
  }
  @media only screen and (max-width: 900px) { 
    .code-embed-2 { 
      margin-right: 0 !important; 
    }
    .code-embed-2 fieldset.form-columns-2 .hs-form-field:last-child {
      margin-left: 0px !important;
    }
  }
  .code-embed-2 form {
    display: flex;
    flex-direction:column;
    font-family: Metropolis, sans-serif;
  }
  .code-embed-2 fieldset {
    max-width:84% !important;
  }
  #hsForm_34df38fa-f6c7-44e8-afe3-a5f5a0f51c85 fieldset {
    width:100%;
    max-width:100%;
    margin-bottom:30px;
  }
  .code-embed-2 fieldset.form-columns-2 .hs-form-field:first-child {
    width:70%;
  }
  .code-embed-2 fieldset.form-columns-2 .hs-form-field:last-child {
    width:30%;
  }
  .code-embed-2 .field.hs-form-field .input {
    margin-right:20px !important;
  }
  .code-embed-2 label,
  #hsForm_34df38fa-f6c7-44e8-afe3-a5f5a0f51c85 label {
    display:none;
  }
  .code-embed-2 .required-fields {
    color:white;
    font-size:10px;
  }
  .code-embed-2 input.hs-input,
  #hsForm_34df38fa-f6c7-44e8-afe3-a5f5a0f51c85 input.hs-input {
    background-color:#FFFEF5;
    border-radius: 8px;
    border: 1px solid #FFFEF5;
    color: #042d2c;
    font-family: Metropolis, sans-serif;
    font-size: 14px;
    font-weight: 600;
    min-width:100%;
    padding:18px;
    text-align:center;
  }
  .code-embed-2 input.hs-input::placeholder,
  #hsForm_34df38fa-f6c7-44e8-afe3-a5f5a0f51c85 input.hs-input::placeholder {
    color: #042d2c;
    font-family: Metropolis, sans-serif;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 2px;
    text-align:center;
    text-transform:uppercase;
  }
  .code-embed-2 input.hs-input.error,
  #hsForm_34df38fa-f6c7-44e8-afe3-a5f5a0f51c85 input.hs-input.error {
    border:1px solid red;
  }
  .code-embed-2 .hs-button,
  #hsForm_34df38fa-f6c7-44e8-afe3-a5f5a0f51c85 .hs-button {
    align-items: center;
    background-color: #e1c2a4;
    border: 3px solid #dcc3a8;
    border-radius: 50px;
    color: #042d2c;
    display: flex;
    flex-flow: column;
    font-family: Metropolis, sans-serif;
    font-size: 14px;
    font-weight: 600;
    justify-content: center;
    letter-spacing: 2px;
    margin-top:25px;
    min-height:52px;
    padding-right:112px;
    padding-left:112px;
    text-transform: uppercase;
  }
  .code-embed-2 .hs-button:hover,
  #hsForm_34df38fa-f6c7-44e8-afe3-a5f5a0f51c85 .hs-button:hover {
    background-color: #e58247;
    border-color: #e58247;
    cursor: pointer;
  }
  .code-embed-2 .hs-error-msgs,
  .code-embed-2 .hs_error_rollup,
  #hsForm_34df38fa-f6c7-44e8-afe3-a5f5a0f51c85 .hs-error-msgs,
  #hsForm_34df38fa-f6c7-44e8-afe3-a5f5a0f51c85 .hs-error-rollup {
    visibility:hidden !important;
    display:none !important;
  }
  #hsForm_34df38fa-f6c7-44e8-afe3-a5f5a0f51c85 .legal-consent-container {
    color:white;
  }
  #hsForm_34df38fa-f6c7-44e8-afe3-a5f5a0f51c85 a:link,
  #hsForm_34df38fa-f6c7-44e8-afe3-a5f5a0f51c85 a:visited {
    color:white;
    text-decoration:underline;
  }
  #hsForm_34df38fa-f6c7-44e8-afe3-a5f5a0f51c85 a:active,
  #hsForm_34df38fa-f6c7-44e8-afe3-a5f5a0f51c85 a:hover {
    color:white;
    text-decoration:none;
  }
  @media only screen and (max-width: 1480px) and (min-width: 992px){
    .code-embed-2 form {
      flex-direction:column;
    }
  }
  /* Custom Become An Installer Form Styling  */
  #hbspt-form-06de6963-3c1a-4432-9e83-7fdb7b5294e2 .hs-form-field label {
    display:none;
  }
  /* Target the input field with class "text-field" */
  .footer-form .text-field::placeholder, .footer-form .text-field-2::placeholder{
    text-transform: uppercase;
    font-size: 17px;
    font-weight: 700;
  }
/* Image Rotate Class */
.image-rotate {
  position: absolute;
  right: -40%;
  top: -70%;
  animation: mymove 15s linear infinite;
}
.rotate-small-logo {
  animation: mymove 15s linear infinite;
}
@keyframes mymove{
    from{ transform: rotate(-360deg); }
    to{ transform: rotate(360deg); }
}
@media only screen and (max-width:768px){
  .image-rotate {
      position: absolute;
      right: -60%;
      top: -30%;
      animation: mymove 15s linear infinite;
  }
}
  input, input::placeholder {
    text-align: center;
  }
  /* Check Zip Code Form */
  #wf-form-Check-Area-Zip-Code-Form #zip, #wf-form-Check-Area-Zip-Code-Form #zip::placeholder {
    text-align: center;
  }
  /* Cala Available Form  */
  #cala-available-form .hs-form-frame {
    width: 100%;
  }
  .faqs-title {
    white-space: break-spaces;
  }
/* @media only screen and (max-width: 1400px) and (min-width: 450px) {
    .w-container {
      max-width: 90% !important;
    }
    .w-layout-layout {
      max-width: 90%;
    }
  } */
  @media only screen and (max-width: 1370px) and (min-width: 1090px){
    .header .nav-link-cus.w-nav-link {
      padding: 0;
      margin-left: 10px;
      margin-right: 10px;
    }
  }
  @media only screen and (max-width: 1480px) and (min-width: 992px) {
    .nav-menu-2.menu-cus {
      width: 75%;
      grid-column-gap: 0;
    }
    .div-block-17 {
      width: 15%;
    }
    .brand-2 {
      width: 50% !important;
    }
  }
  @media only screen and (max-width: 1150px) and (min-width: 992px){
    .nav-menu-2.menu-cus {
      grid-column-gap: 0px;
    }
  }   
  @media only screen and (max-width: 1024px) and (min-width: 992px){
    .header .nav-link-cus.w-nav-link {
      padding: 0;
      margin: 0;
      margin-right: 5px;
    }
  }
  .faqs-section .w-icon-dropdown-toggle:before {
    content: url(https://cdn.calasystems.com/images/b7abdfc946877161/668e8a32c7881ff4c1623b0c_plus_icon_faqs.svg);
  }
  .faqs-section .w--open .w-icon-dropdown-toggle:before {
    content: url(https://cdn.calasystems.com/images/ca12797a669d9315/668e8a29695e2d3ec3263e1f_minus_icon_faqs.svg);
  }
  @media only screen and (max-width:1420px){
    .header-wrap nav.w-nav-menu a {
      padding: 10px 10px;
      font-size: 16px;
      margin-top: 10px;
    }
    .btn-header.w-button {
      margin-top: 2px !important;
      padding: 10px 30px !important;
    }
  }
  .socail-icon-wrap img:hover {
    filter: brightness(0.8);
  }
  .w-nav-button.w--open {
    color: #112c2c !important;
    background-color: #fffef7 !important;
  }
  .w-nav-overlay [data-nav-menu-open] {
    background: #FFFEF7 !important;
    border-top: 7px solid #D46939;
  }
  nav.menu-cus .w-nav-link.w--current {
    color: #e26132 !important;
    font-weight: 600 !important;
  }
  @media only screen and (max-width:1400px){
    .nav-link-cus.mar-right {
      margin-right: 20px;
    }
  }
  @media only screen and (max-width:991px){
    .nav-link-cus.mar-right {
      margin-right: auto;
    }
    .menu-cus {
      padding: 20px 0px;
    }
    .banner-h1 br {
      display: none;
    }
    .menu_icon.w-nav-button {
      margin-right: 0 !important;
    }
    .nav-link-cus.w--current{
      margin: 20px;     
    }
    .brand-2 {
      width: 50% !important;
      display: flex;
      justify-content: center;
      align-items: center;
      min-height: 60px;
    }
    .menu-cus a {
      max-width: 100% !important;
    }
  }
  @media only screen and (max-width:768px){
    .menu-button-2.w-nav-button {
      display: grid !important;
      justify-content: end !important;
    }
  }
  @media only screen and (max-width:1460px) and (min-width:1200px){
    .menu-btn.w-button {
      padding-left: 30px;
      padding-right: 30px;
    }
  }
  @media only screen and (max-width:1222px) and (min-width:991px){
    .menu-btn.w-button {
      padding: 15px;
      min-height: fit-content;
    }
  }
  .menu-cus .w-nav-link.w--current {
    color: #112c2c !important;
    font-weight: 800;
  }
  /*Menu animation*/
  .menu_icon {
    width: 55px;
    height: 55px;
    margin: auto;
    z-index: 10;
    cursor: pointer;
    position: relative;
    display: flex;
    align-items: center;
    padding: 5px 0;
  }
  .menu_icon div {
    position: absolute;
    display: block;
    height: 5px;
    width: 60px;
    background-color: black;
    transform: rotate(0);
    transition: all 200ms cubic-bezier(0.895, 0.03, 0.685, 0.22);
  }
  div.one {
    top: 0px;
  }
  div.two {
    top: 25px;
  }
  div.three {
    top: 50px;
  }
  .clicked .one {
    transform: translateY(25px) rotate(45deg);
  }
  .clicked .two {
    opacity: 0;
  }
  .clicked .three {
    transform: translateY(-25px) rotate(-45deg);
  }
  .menu_icon.w-nav-button{
    zoom:0.6;
    margin-top:20px;
  }
  @media only screen and (min-width:992px){
    .menu_icon.w-nav-button{
      display:none;}
  }
  @media only screen and (max-width:768px){
    .menu_icon{
      margin-right:50px !important;
    }
    .menu_icon.w-nav-button{
      zoom:0.4;
      margin-top:50px;
    }
    .nav-link-cus {
      text-align: center;
    }
  }   
  @media only screen and (max-width:991px) {
    .faqs-section .dropdown-toggle.w--open {
      width: 100%;
    }
    .cala-header-nav-menu[data-nav-menu-open] {
      display: flex !important;
      flex-direction: column;
      gap: 0;
  	}
    .nav-link-cus.w--current {
      margin: 20px 0 10px;
    }
    .cala-header-nav-menu #get-started-nav-link {
      order: -1;
    }
  }
  /* Define a CSS class for limiting the number of characters in a text block */
  .textlimit {
    display: -webkit-box;
    overflow: hidden;
    -webkit-line-clamp: 5;
    -webkit-box-orient: vertical;
  }  
  .textlimit p {
    margin: 0px !important;
  }
  .read-article {
    width: fit-content;
  }
  @media only screen and (min-width:768px){
    .featured-news-img {
      width: 100%;
      object-fit: cover;
      border-radius: 10px;
    }
  }

/* ---- Cookiebot banner branding ---- */
a#CybotCookiebotDialogPoweredbyCybot,
div#CybotCookiebotDialogPoweredByText {
  display: none;
}
#CookiebotWidget .CookiebotWidget-body .CookiebotWidget-main-logo {
  display: none; 
}