.hp-faq-page .entry-header,
.hp-faq-page .wp-block-post-title{display:none!important}
.hp-faq-page .entry-content{max-width:none!important;margin:0!important;padding:0!important}

.hp-faq{
  --faq-ink:#14212b;
  --faq-muted:#6c7881;
  --faq-line:#e3e8eb;
  --faq-red:#ef233c;
  --faq-soft:#f7f8f8;
  --faq-white:#fff;
  color:var(--faq-ink);
  background:#fff;
  font-family:"Nunito Sans",sans-serif;
  scroll-behavior:smooth;
}
.hp-faq *{box-sizing:border-box}
.hp-faq a{text-underline-offset:3px}

.hp-faq__hero,
.hp-faq__topic-nav,
.hp-faq__layout,
.hp-faq__footer-note{
  width:min(1180px,calc(100% - 64px));
  margin-inline:auto;
}

/* Quiet editorial introduction: no duplicate popular-topics card. */
.hp-faq__hero{
  padding:76px 0 42px;
  border-bottom:1px solid var(--faq-line);
}
.hp-faq__hero-copy{max-width:900px}
.hp-faq__kicker{
  margin:0 0 12px;
  color:var(--faq-red);
  font-size:.7rem;
  font-weight:900;
  letter-spacing:.17em;
  text-transform:uppercase;
}
.hp-faq__hero h1{
  max-width:780px;
  margin:0;
  font-size:clamp(2.8rem,5.1vw,5rem);
  line-height:.98;
  letter-spacing:-.055em;
  text-wrap:balance;
}
.hp-faq__intro{
  max-width:730px;
  margin:22px 0 0;
  color:var(--faq-muted);
  font-size:1rem;
  line-height:1.72;
}

/* Category rail remains the only topic navigation. */
.hp-faq__topic-nav{
  position:sticky;
  top:82px;
  z-index:20;
  display:flex;
  gap:32px;
  padding:0;
  border-bottom:1px solid var(--faq-line);
  background:rgba(255,255,255,.96);
  backdrop-filter:blur(12px);
  overflow-x:auto;
  scrollbar-width:none;
}
.hp-faq__topic-nav::-webkit-scrollbar{display:none}
.hp-faq__topic-nav a{
  position:relative;
  flex:0 0 auto;
  padding:20px 0 16px;
  color:#7a858d;
  font-size:.8rem;
  font-weight:850;
  text-decoration:none;
  transition:color .2s ease;
}
.hp-faq__topic-nav a:after{
  position:absolute;
  left:0;
  right:0;
  bottom:-1px;
  height:2px;
  background:var(--faq-red);
  content:"";
  transform:scaleX(0);
  transform-origin:left;
  transition:transform .22s ease;
}
.hp-faq__topic-nav a:hover,
.hp-faq__topic-nav a.is-active{color:var(--faq-ink)}
.hp-faq__topic-nav a.is-active:after{transform:scaleX(1)}

/* No redundant sidebar: the question groups use the full content width. */
.hp-faq__layout{padding:54px 0 96px}
.hp-faq__groups{width:100%;max-width:none}

/* Each category feels like a presentation panel: concise heading rail + questions. */
.hp-faq__group{
  display:grid;
  grid-template-columns:minmax(200px,260px) minmax(0,1fr);
  gap:clamp(46px,6vw,84px);
  scroll-margin-top:148px;
  padding:0 0 66px;
  margin:0 0 66px;
  border-bottom:1px solid var(--faq-line);
  opacity:1;
  transform:none;
  transition:
    opacity .58s cubic-bezier(.22,.72,.18,1),
    transform .58s cubic-bezier(.22,.72,.18,1);
}
.hp-faq.is-ready .hp-faq__group{opacity:0;transform:translate3d(0,24px,0)}
.hp-faq.is-ready .hp-faq__group.is-visible{opacity:1;transform:none}
.hp-faq__group:last-child{margin-bottom:0;padding-bottom:0;border-bottom:0}

.hp-faq__group-heading{
  display:block;
  margin:0;
  padding-top:5px;
}
.hp-faq__group-heading>p{
  margin:0 0 18px;
  color:var(--faq-red);
  font-size:.7rem;
  font-weight:900;
  letter-spacing:.08em;
}
.hp-faq__group-heading span{
  display:block;
  margin-bottom:7px;
  color:#8b969e;
  font-size:.64rem;
  font-weight:900;
  letter-spacing:.14em;
  text-transform:uppercase;
}
.hp-faq__group-heading h2{
  margin:0;
  font-size:clamp(1.7rem,2.3vw,2.35rem);
  line-height:1.05;
  letter-spacing:-.04em;
}

/* Questions are open editorial rows rather than boxed cards. */
.hp-faq__list{
  display:grid;
  gap:0;
  border-top:1px solid var(--faq-line);
}
.hp-faq__list details{
  position:relative;
  border-bottom:1px solid var(--faq-line);
  background:#fff;
  box-shadow:none;
  transform:translateY(0);
  transition:
    transform .2s cubic-bezier(.22,.72,.18,1),
    box-shadow .2s ease,
    background .2s ease,
    border-color .2s ease;
}
.hp-faq__list details:hover{
  z-index:2;
  transform:none;
  background:#fff;
  border-color:transparent;
  box-shadow:0 14px 34px rgba(20,33,43,.075);
}
.hp-faq__list details[open],
.hp-faq__list details.is-active{
  z-index:1;
  transform:none;
  background:#fafbfb;
  border-color:#d8dfe3;
  box-shadow:inset 3px 0 0 var(--faq-red);
}
.hp-faq__list summary{
  position:relative;
  padding:23px 64px 23px 22px;
  color:var(--faq-ink);
  font-size:1rem;
  font-weight:850;
  line-height:1.45;
  cursor:pointer;
  list-style:none;
  outline:none;
}
.hp-faq__list summary::-webkit-details-marker{display:none}
.hp-faq__list summary:after{
  position:absolute;
  right:20px;
  top:50%;
  display:grid;
  width:28px;
  height:28px;
  place-items:center;
  border:1px solid #d4dce0;
  border-radius:50%;
  color:var(--faq-red);
  font-size:1rem;
  font-weight:650;
  line-height:1;
  content:"+";
  transform:translateY(-50%) rotate(0);
  transition:
    transform .22s ease,
    background .2s ease,
    color .2s ease,
    border-color .2s ease;
}
.hp-faq__list details:hover summary:after{
  border-color:var(--faq-red);
  transform:translateY(-50%) scale(1.06);
}
.hp-faq__list details[open] summary:after{
  content:"−";
  border-color:var(--faq-ink);
  background:var(--faq-ink);
  color:#fff;
  transform:translateY(-50%) rotate(180deg);
}
.hp-faq__list summary:focus-visible{
  box-shadow:inset 0 0 0 2px rgba(239,35,60,.22);
}
.hp-faq__list details>div{
  padding:0 64px 25px 22px;
  animation:hpFaqAnswerIn .34s cubic-bezier(.22,.72,.18,1) both;
}
.hp-faq__list p{
  max-width:760px;
  margin:0;
  color:var(--faq-muted);
  font-size:.93rem;
  line-height:1.75;
}
.hp-faq__list p+p{margin-top:10px}
.hp-faq__list a{
  display:inline-flex;
  margin-top:13px;
  color:var(--faq-ink);
  font-size:.82rem;
  font-weight:900;
  text-decoration:none;
}
.hp-faq__list a:after{
  margin-left:7px;
  color:var(--faq-red);
  content:"↗";
}
@keyframes hpFaqAnswerIn{
  from{opacity:0;transform:translate3d(0,8px,0)}
  to{opacity:1;transform:none}
}

/* Final contact strip stays compact and separate from the FAQ questions. */
.hp-faq__footer-note{
  display:grid;
  grid-template-columns:1fr 1.2fr auto;
  gap:42px;
  align-items:center;
  margin-bottom:82px;
  padding:30px 0;
  border-top:1px solid var(--faq-line);
  border-bottom:1px solid var(--faq-line);
}
.hp-faq__footer-note .hp-faq__kicker{margin-bottom:7px}
.hp-faq__footer-note h2{
  margin:0;
  font-size:1.45rem;
  letter-spacing:-.035em;
}
.hp-faq__footer-note>p{
  margin:0;
  color:var(--faq-muted);
  font-size:.88rem;
  line-height:1.6;
}
.hp-faq__footer-note>a{
  white-space:nowrap;
  color:var(--faq-ink);
  font-weight:900;
  text-decoration:none;
}
.hp-faq__footer-note>a span{color:var(--faq-red)}

@media(max-width:900px){
  .hp-faq__group{
    grid-template-columns:1fr;
    gap:24px;
    padding-bottom:52px;
    margin-bottom:52px;
  }
  .hp-faq__group-heading{
    display:grid;
    grid-template-columns:42px 1fr;
    gap:14px;
    align-items:start;
  }
  .hp-faq__group-heading>p{margin:5px 0 0}
  .hp-faq__footer-note{grid-template-columns:1fr 1fr}
  .hp-faq__footer-note>a{grid-column:1/-1}
}

@media(max-width:700px){
  .hp-faq__hero,
  .hp-faq__topic-nav,
  .hp-faq__layout,
  .hp-faq__footer-note{
    width:min(100% - 32px,1180px);
  }
  .hp-faq__hero{padding:48px 0 30px}
  .hp-faq__hero h1{font-size:clamp(2.35rem,11vw,3.5rem)}
  .hp-faq__topic-nav{top:64px;gap:22px}
  .hp-faq__topic-nav a{padding:17px 0 14px}
  .hp-faq__layout{padding:38px 0 64px}
  .hp-faq__group{
    gap:20px;
    padding-bottom:42px;
    margin-bottom:42px;
    scroll-margin-top:126px;
  }
  .hp-faq__group-heading{grid-template-columns:32px 1fr;gap:10px}
  .hp-faq__list summary{
    padding:19px 52px 19px 16px;
    font-size:.95rem;
  }
  .hp-faq__list summary:after{right:15px;width:25px;height:25px}
  .hp-faq__list details>div{padding:0 42px 20px 16px}
  .hp-faq__footer-note{
    grid-template-columns:1fr;
    gap:14px;
    margin-bottom:56px;
    padding:24px 0;
  }
  .hp-faq__footer-note>a{grid-column:auto}
}

@media(prefers-reduced-motion:reduce){
  .hp-faq__group,
  .hp-faq__list details,
  .hp-faq__list summary:after{
    transition:none!important;
    transform:none!important;
  }
  .hp-faq__group{opacity:1!important}
  .hp-faq__list details>div{animation:none!important}
}


/* 3.13.54.47 — F&Q refinement: continuous open-state accent and a more polished answer layout. */
.hp-faq__list{
  border:1px solid #e1e6e9;
  border-bottom:0;
  background:#fff;
}
.hp-faq__list details,
body.hp-depth-v40 .hp-faq__list details{
  position:relative;
  overflow:visible;
  border:0;
  border-bottom:1px solid #e1e6e9;
  background:#fff;
  box-shadow:none;
  transform:none;
}
.hp-faq__list details:hover,
body.hp-depth-v40 .hp-faq__list details:hover{
  z-index:2;
  border-color:#e1e6e9;
  background:#fff;
  box-shadow:0 10px 28px rgba(20,33,43,.055);
  transform:none;
}
.hp-faq__list details[open],
.hp-faq__list details.is-active,
body.hp-depth-v40 .hp-faq__list details[open],
body.hp-depth-v40 .hp-faq__list details.is-active{
  z-index:3;
  border-color:#dfe4e7;
  background:#fff;
  box-shadow:0 18px 44px rgba(20,33,43,.07);
  transform:none;
}
/* Draw the red state line independently from borders so adjacent open rows join without gaps. */
.hp-faq__list details[open]::before,
.hp-faq__list details.is-active::before,
body.hp-depth-v40 .hp-faq__list details[open]::before,
body.hp-depth-v40 .hp-faq__list details.is-active::before{
  content:"";
  position:absolute;
  z-index:6;
  left:-1px;
  top:-1px;
  bottom:-1px;
  width:3px;
  background:var(--faq-red);
  pointer-events:none;
}
.hp-faq__list details[open] + details[open]::before,
.hp-faq__list details.is-active + details.is-active::before{
  top:-2px;
}
.hp-faq__list summary{
  padding:25px 70px 25px 28px;
  font-size:1.02rem;
  line-height:1.45;
}
.hp-faq__list details[open] summary,
.hp-faq__list details.is-active summary{
  padding-bottom:20px;
  border-bottom:1px solid #edf0f2;
}
.hp-faq__list summary:after{
  right:24px;
  width:30px;
  height:30px;
}
.hp-faq__list details>div,
body.hp-depth-v40 .hp-faq__list details>div{
  position:relative;
  margin:0;
  padding:20px 70px 26px 28px;
  background:linear-gradient(90deg,#f7f9fa 0%,#fbfcfc 62%,#fff 100%);
  animation:hpFaqAnswerIn .3s cubic-bezier(.22,.72,.18,1) both;
}
.hp-faq__list details>div::before{
  display:block;
  margin-bottom:9px;
  color:var(--faq-red);
  content:"ANSWER";
  font-size:.64rem;
  font-weight:950;
  letter-spacing:.16em;
  line-height:1;
}
.hp-faq__list p{
  max-width:850px;
  color:#63717b;
  font-size:.95rem;
  line-height:1.82;
}
.hp-faq__list p+p{margin-top:12px}
.hp-faq__list a{
  display:inline-flex;
  align-items:center;
  min-height:36px;
  margin-top:16px;
  padding:8px 12px;
  border:1px solid #dce2e5;
  background:#fff;
  color:var(--faq-ink);
  font-size:.78rem;
  font-weight:900;
  line-height:1.2;
  text-decoration:none;
  transition:border-color .18s ease,color .18s ease,background .18s ease;
}
.hp-faq__list a:hover{
  border-color:var(--faq-red);
  background:#fff;
  color:var(--faq-red);
}
.hp-faq__list a:after{margin-left:8px}

@media(max-width:700px){
  .hp-faq__list summary{padding:20px 54px 20px 18px;font-size:.96rem}
  .hp-faq__list details[open] summary,
  .hp-faq__list details.is-active summary{padding-bottom:17px}
  .hp-faq__list summary:after{right:16px;width:26px;height:26px}
  .hp-faq__list details>div,
  body.hp-depth-v40 .hp-faq__list details>div{padding:17px 22px 22px 18px}
  .hp-faq__list p{font-size:.91rem;line-height:1.75}
}


/* 3.13.54.60 — cleaner F&Q index rail and fully-collapsed initial state. */
@media(min-width:901px){
  .hp-faq__group-heading h2{font-size:clamp(1.45rem,1.8vw,1.9rem)!important;line-height:1.12!important;letter-spacing:-.035em!important;white-space:nowrap!important}
}
.hp-faq__group-heading span{display:none!important}
@media(max-width:900px){.hp-faq__group-heading h2{white-space:normal!important}}

/* 3.13.54.87 — F&Q: smoother accent rail, cleaner focus state and a more designed top edge. */
.hp-faq__list{
  position:relative!important;
  border:0!important;
  border-bottom:0!important;
  background:#fff!important;
  box-shadow:0 18px 52px rgba(20,33,43,.035)!important;
}
.hp-faq__list::before{
  content:"";
  position:absolute;
  z-index:8;
  top:0;
  left:0;
  right:0;
  height:1px;
  background:#dfe5e8;
  pointer-events:none;
}
.hp-faq__list::after{
  content:"";
  position:absolute;
  z-index:9;
  top:-1px;
  left:0;
  width:68px;
  height:3px;
  border-radius:0 999px 999px 0;
  background:var(--faq-red);
  box-shadow:0 5px 14px rgba(239,35,60,.14);
  pointer-events:none;
}
.hp-faq__list details,
body.hp-depth-v40 .hp-faq__list details{
  position:relative!important;
  overflow:hidden!important;
  border:0!important;
  border-bottom:1px solid #e2e7ea!important;
  background:#fff!important;
  box-shadow:none!important;
  transform:none!important;
  transition:background-color .32s ease,box-shadow .32s ease!important;
}
.hp-faq__list details:hover,
body.hp-depth-v40 .hp-faq__list details:hover{
  border-color:#e2e7ea!important;
  background:#fff!important;
  box-shadow:0 12px 30px rgba(20,33,43,.045)!important;
}
.hp-faq__list details[open],
.hp-faq__list details.is-active,
body.hp-depth-v40 .hp-faq__list details[open],
body.hp-depth-v40 .hp-faq__list details.is-active{
  border-color:#e2e7ea!important;
  background:#fff!important;
  box-shadow:0 18px 42px rgba(20,33,43,.055)!important;
}
/* Keep the accent rail present in every row, then animate it instead of creating/removing it. */
.hp-faq__list details::before,
body.hp-depth-v40 .hp-faq__list details::before{
  content:""!important;
  position:absolute!important;
  z-index:10!important;
  left:0!important;
  top:0!important;
  bottom:auto!important;
  width:3px!important;
  height:100%!important;
  background:var(--faq-red)!important;
  opacity:0!important;
  transform:scaleY(0)!important;
  transform-origin:top center!important;
  transition:transform .52s cubic-bezier(.2,.82,.2,1),opacity .22s ease!important;
  will-change:transform,opacity!important;
  pointer-events:none!important;
}
.hp-faq__list details.is-active:not(.is-closing)::before,
.hp-faq__list details[open]:not(.is-closing)::before,
body.hp-depth-v40 .hp-faq__list details.is-active:not(.is-closing)::before,
body.hp-depth-v40 .hp-faq__list details[open]:not(.is-closing)::before{
  opacity:1!important;
  transform:scaleY(1)!important;
}
.hp-faq__list details.is-closing::before,
body.hp-depth-v40 .hp-faq__list details.is-closing::before{
  opacity:.12!important;
  transform:scaleY(0)!important;
  transform-origin:bottom center!important;
}
.hp-faq__list summary{
  border:0!important;
  outline:0!important;
  box-shadow:none!important;
  -webkit-tap-highlight-color:transparent;
  transition:padding .36s cubic-bezier(.22,.72,.18,1),background-color .25s ease!important;
}
.hp-faq__list summary:focus,
.hp-faq__list summary:focus-visible{
  border:0!important;
  outline:0!important;
  box-shadow:none!important;
}
/* Keyboard focus stays visible on the +/- control, not as a red frame around the whole question. */
.hp-faq__list summary:focus-visible::after{
  box-shadow:0 0 0 4px rgba(20,33,43,.10)!important;
}
.hp-faq__list details>div,
body.hp-depth-v40 .hp-faq__list details>div{
  overflow:hidden!important;
  animation:none!important;
  opacity:0;
  transform:translate3d(0,-8px,0);
  transition:
    height .48s cubic-bezier(.2,.82,.2,1),
    padding-top .48s cubic-bezier(.2,.82,.2,1),
    padding-bottom .48s cubic-bezier(.2,.82,.2,1),
    opacity .28s ease,
    transform .48s cubic-bezier(.2,.82,.2,1)!important;
  will-change:height,opacity,transform;
}
.hp-faq__list details.is-active>div,
body.hp-depth-v40 .hp-faq__list details.is-active>div{
  opacity:1;
  transform:none;
}
.hp-faq__list details.is-closing>div,
body.hp-depth-v40 .hp-faq__list details.is-closing>div{
  opacity:0;
  transform:translate3d(0,-6px,0);
}
.hp-faq__list details.is-closing summary:after{
  content:"+"!important;
  border-color:#d4dce0!important;
  background:#fff!important;
  color:var(--faq-red)!important;
  transform:translateY(-50%) rotate(0)!important;
}
@media(max-width:700px){
  .hp-faq__list::after{width:52px;height:3px}
}
@media(prefers-reduced-motion:reduce){
  .hp-faq__list details::before,
  .hp-faq__list details>div{
    transition:none!important;
  }
}
