/* Carlisle homepage FAQ — v1.8.0 clean reference match.
   This file loads after the main responsive stylesheet so it owns the
   final homepage FAQ appearance across desktop, tablet and mobile. */

.home-page .faq{
  height:auto !important;
  min-height:610px;
  padding:115px 40px 104px !important;
  background:#eef4fb !important;
}

.home-page .faq__grid{
  width:100%;
  max-width:1224px;
  margin:0 auto;
  display:grid;
  grid-template-columns:400px 680px;
  gap:95px;
  align-items:start;
}

.home-page .faq__intro{
  min-width:0;
  padding-top:8px;
}

.home-page .faq__intro .eyebrow{
  display:flex;
  align-items:center;
  gap:10px;
  margin:0 0 17px;
  color:#2673db !important;
  font-size:12px;
  line-height:1.35;
  font-weight:700;
  letter-spacing:.24em;
  text-transform:uppercase;
}

.home-page .faq__intro .eyebrow::before{
  content:"";
  flex:0 0 22px;
  width:22px;
  height:1px;
  background:currentColor;
}

.home-page .faq__intro h2{
  margin:0 0 20px;
  max-width:390px;
  color:#06265e;
  font-size:38px;
  line-height:1.03;
  letter-spacing:-.04em;
}

.home-page .faq__intro .section-sub{
  max-width:390px;
  margin:0;
  color:#667da3;
  font-size:15px;
  line-height:1.55;
}

.home-page .faq__intro .btn--outline{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:auto;
  min-width:140px;
  min-height:49px;
  margin-top:26px;
  padding:0 28px;
  border:1px solid #b9c7d9 !important;
  border-radius:999px;
  background:transparent !important;
  color:#082961 !important;
  box-shadow:none !important;
  text-decoration:none;
}

.home-page .faq__list{
  width:680px;
  min-width:0;
  background:#fff;
  border:1px solid #dce4ed !important;
  border-radius:22px;
  overflow:hidden;
  box-shadow:none !important;
}

.home-page .faq-item{
  width:100%;
  margin:0;
  border:0 !important;
  border-bottom:1px solid #e1e7ef !important;
  border-radius:0 !important;
  outline:0 !important;
  background:#fff;
  overflow:hidden;
  box-shadow:none !important;
  transition:background-color 220ms ease;
}

.home-page .faq-item:last-child{
  border-bottom:0 !important;
}

.home-page .faq-item__q{
  width:100%;
  min-height:72px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  margin:0;
  padding:18px 24px;
  border:0 !important;
  border-radius:0 !important;
  outline:0 !important;
  appearance:none;
  -webkit-appearance:none;
  background:transparent !important;
  box-shadow:none !important;
  color:#05255c !important;
  font:inherit;
  font-size:16px;
  line-height:1.35;
  font-weight:600;
  text-align:left;
  cursor:pointer;
}

.home-page .faq-item__q:focus,
.home-page .faq-item__q:active{
  border:0 !important;
  outline:0 !important;
  box-shadow:none !important;
}

.home-page .faq-item__q:focus-visible{
  box-shadow:inset 0 0 0 2px rgba(38,115,219,.45) !important;
}

.home-page .faq-item__icon{
  flex:0 0 32px;
  width:32px;
  height:32px;
  display:grid;
  place-items:center;
  margin-left:auto;
  border:0 !important;
  border-radius:50%;
  background:#f2f4f7 !important;
  color:#0b2a61 !important;
  font-size:17px;
  line-height:1;
  font-weight:500;
  box-shadow:none !important;
  transform:none;
  transition:transform 220ms cubic-bezier(.22,.61,.36,1),background-color 220ms ease,color 220ms ease;
}

.home-page .faq-item__a{
  max-height:0;
  opacity:0;
  overflow:hidden;
  transform:translateY(-4px);
  transition:max-height 340ms cubic-bezier(.22,.61,.36,1),opacity 220ms ease,transform 340ms cubic-bezier(.22,.61,.36,1);
}

.home-page .faq-item__a p{
  max-width:650px;
  margin:0;
  padding:0 24px 24px;
  color:#5f7397;
  font-size:15px;
  line-height:1.6;
}

.home-page .faq-item--open .faq-item__a{
  max-height:250px;
  opacity:1;
  transform:translateY(0);
}

/* Reference keeps the open close icon light, not a dark filled circle. */
.home-page .faq-item--open .faq-item__icon{
  background:#f2f4f7 !important;
  color:#0b2a61 !important;
  transform:none;
}

@media (hover:hover) and (pointer:fine){
  .home-page .faq__intro .btn--outline:hover{
    transform:translateY(-2px);
    border-color:#6f8caf !important;
    background:#fff !important;
  }

  .home-page .faq-item:not(.faq-item--open):hover{
    background:#f9fbfe;
  }

  .home-page .faq-item:not(.faq-item--open):hover .faq-item__q{
    transform:translateX(3px);
  }

  .home-page .faq-item:hover .faq-item__icon{
    background:#e8edf4 !important;
    transform:scale(1.06);
  }
}

@media (max-width:1280px){
  .home-page .faq__grid{
    max-width:1176px;
    grid-template-columns:380px minmax(0,1fr);
    gap:70px;
  }
  .home-page .faq__list{width:100%}
}

@media (max-width:1024px){
  .home-page .faq{
    min-height:0;
    padding:82px 28px 86px !important;
  }
  .home-page .faq__grid{
    grid-template-columns:330px minmax(0,1fr);
    gap:48px;
  }
  .home-page .faq__intro h2{font-size:34px}
}

@media (max-width:820px){
  .home-page .faq{padding:72px 24px 76px !important}
  .home-page .faq__grid{
    grid-template-columns:minmax(0,1fr);
    gap:34px;
  }
  .home-page .faq__intro{max-width:560px}
  .home-page .faq__intro h2{max-width:500px;font-size:34px}
  .home-page .faq__intro .section-sub{max-width:500px}
}

@media (max-width:560px){
  .home-page .faq{padding:58px 18px 64px !important}
  .home-page .faq__grid{gap:28px}
  .home-page .faq__intro .eyebrow{font-size:11px;letter-spacing:.18em}
  .home-page .faq__intro h2{font-size:31px;line-height:1.05}
  .home-page .faq__intro .section-sub{font-size:14px}
  .home-page .faq__intro .btn--outline{min-height:44px;min-width:132px;padding:0 23px}
  .home-page .faq__list{border-radius:18px}
  .home-page .faq-item__q{min-height:66px;padding:16px;font-size:14px;gap:14px}
  .home-page .faq-item__icon{flex-basis:30px;width:30px;height:30px;font-size:16px}
  .home-page .faq-item__a p{padding:0 16px 19px;font-size:13.5px}
}

@media (prefers-reduced-motion:reduce){
  .home-page .faq-item,
  .home-page .faq-item__q,
  .home-page .faq-item__icon,
  .home-page .faq-item__a,
  .home-page .faq__intro .btn--outline{
    transition:none !important;
  }
}