:root{--black:#000;--purple:#B400FA;--white:#fff;--soft:#f5f5f7;--line:#d9d9df;--muted:#6d6d72}
.support-page{background:var(--white);color:var(--black)}
.support-page .site-nav{position:relative;z-index:20}

.support-hero{position:relative;background:var(--black);color:var(--white);overflow:hidden;min-height:625px}
.support-hero-inner{position:relative;min-height:510px;display:flex;align-items:center;padding:48px 0 84px}
.support-hero-copy{position:relative;z-index:3;width:min(63%,830px)}
.support-hero-copy h1,.faq-intro h2,.privacy-heading h2,.support-cta h2{font:800 clamp(56px,5.7vw,96px)/.9 Montserrat,sans-serif;text-transform:uppercase;letter-spacing:-.045em;margin:12px 0 30px}
.support-hero-copy h1 span,.faq-intro h2 span,.privacy-heading h2 span{color:var(--purple)}
.support-hero-copy .hero-subhead{font:900 clamp(18px,1.55vw,26px)/1.25 Roboto,sans-serif;max-width:740px;margin:0 0 13px}
.support-hero-copy .hero-body{font:400 18px/1.55 Roboto,sans-serif;max-width:680px;margin:0}
.support-hero-mark{position:absolute;right:3%;top:50%;width:min(34vw,500px);aspect-ratio:1;transform:translateY(-45%);opacity:.86}
.support-ring{position:absolute;border:1px solid rgba(255,255,255,.16);border-radius:50%;inset:0}
.support-ring-two{inset:17%}
.support-ring-three{inset:34%}
.support-drop{position:absolute;left:50%;top:50%;width:74px;height:94px;background:var(--purple);border-radius:54% 46% 62% 38% / 69% 62% 38% 31%;transform:translate(-50%,-46%) rotate(45deg);box-shadow:0 0 70px rgba(180,0,250,.28)}

.faq-section{padding:84px 0 92px;background:#fff}
.faq-section-alt{background:var(--soft)}
.faq-layout{display:grid;grid-template-columns:minmax(290px,.72fr) minmax(520px,1.28fr);gap:clamp(50px,7vw,120px);align-items:start}
.faq-intro{position:sticky;top:32px}
.faq-intro h2{font-size:clamp(43px,3.7vw,62px);margin:7px 0 22px}
.faq-intro>p:last-child{font:400 17px/1.55 Roboto,sans-serif;max-width:440px;margin:0}
.faq-list{border-top:1px solid var(--line)}
.faq-item{border-bottom:1px solid var(--line)}
.faq-item summary{list-style:none;cursor:pointer;position:relative;padding:26px 54px 26px 0;font:900 clamp(18px,1.4vw,22px)/1.25 Roboto,sans-serif}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary:hover{color:var(--purple)}
.faq-plus{position:absolute;right:5px;top:50%;width:24px;height:24px;transform:translateY(-50%)}
.faq-plus::before,.faq-plus::after{content:"";position:absolute;background:var(--purple);left:50%;top:50%;transform:translate(-50%,-50%);transition:transform .22s ease}
.faq-plus::before{width:22px;height:2px}.faq-plus::after{width:2px;height:22px}
.faq-item[open] .faq-plus::after{transform:translate(-50%,-50%) rotate(90deg)}
.faq-answer{padding:0 64px 28px 0}
.faq-answer p{font:400 17px/1.58 Roboto,sans-serif;margin:0;color:#27272a}


.support-cta{padding:78px 0;background:#fff}
.support-cta-inner{display:flex;justify-content:space-between;gap:60px;align-items:flex-end}
.support-cta h2{font-size:clamp(46px,4.2vw,70px);margin:7px 0 18px}
.support-cta p:not(.eyebrow){font:400 17px/1.55 Roboto,sans-serif;max-width:700px;margin:0}
.support-cta .btn{flex:0 0 auto;margin-bottom:5px}

@media(max-width:1000px){
.support-hero{min-height:570px}.support-hero-inner{min-height:455px;padding:38px 0 70px}.support-hero-copy{width:69%}.support-hero-mark{right:-4%;width:40vw}
.faq-layout{grid-template-columns:minmax(250px,.7fr) minmax(430px,1.3fr);gap:45px}
}

@media(max-width:760px){
.support-hero{min-height:auto}.support-hero-inner{min-height:0;padding:60px 0 65px}.support-hero-copy{width:100%}.support-hero-copy h1{font-size:clamp(43px,12.5vw,62px)}.support-hero-copy .hero-subhead{font-size:19px}.support-hero-copy .hero-body{font-size:16px}.support-hero-mark{right:-34%;top:45%;width:82vw;opacity:.28}.support-drop{width:54px;height:70px}
.faq-section{padding:58px 0 64px}.faq-layout{display:block}.faq-intro{position:static;margin-bottom:35px}.faq-intro h2{font-size:clamp(38px,10.5vw,52px)}.faq-intro>p:last-child,.faq-answer p{font-size:16px}.faq-item summary{padding:23px 45px 23px 0;font-size:18px}.faq-answer{padding:0 42px 24px 0}
.support-cta{padding:58px 0}.support-cta-inner{display:block}.support-cta h2{font-size:clamp(40px,11vw,56px)}.support-cta p:not(.eyebrow){font-size:16px}.support-cta .btn{margin-top:30px}
}

/* v51 — Privacy uses the same FAQ structure as the sections above. */
.privacy-section{background:#E3E3E7;color:var(--black)}
.privacy-section .faq-list{border-top-color:#C9C9CF}
.privacy-section .faq-item{border-bottom-color:#C9C9CF}
.privacy-section .faq-answer p{color:#27272a}


/* v52 — ONLY change from v51: approved image replaces hero rings/drop */
.support-hero-mark .support-hero-illustration {
  display: block;
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 620px;
  object-fit: contain;
  margin: 0 auto;
}


/* v53 FIX — desktop hero is two clean columns. No overlap. */
@media (min-width: 1001px) {
  .support-hero-inner {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 430px !important;
    gap: 90px !important;
    align-items: center !important;
  }

  .support-hero-copy {
    width: 100% !important;
    max-width: 760px !important;
  }

  .support-hero-mark {
    position: static !important;
    inset: auto !important;
    right: auto !important;
    top: auto !important;
    transform: none !important;
    aspect-ratio: auto !important;
    width: 430px !important;
    height: auto !important;
    opacity: 1 !important;
    align-self: center !important;
    justify-self: end !important;
  }

  .support-hero-mark .support-hero-illustration {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    max-width: 430px !important;
    max-height: 560px !important;
    object-fit: contain !important;
    margin: 0 !important;
  }

  .support-hero-copy .accent-rule {
    width: 100% !important;
  }
}

/* Preserve the existing mobile/tablet behavior, but reset the old absolute transform. */
@media (max-width: 1000px) {
  .support-hero-mark {
    transform: none !important;
  }
}

/* v54: Still Stuck only */
.support-page section.still-stuck-black{background:#000!important;color:#fff!important}
.support-page section.still-stuck-black h1,
.support-page section.still-stuck-black h2,
.support-page section.still-stuck-black h3,
.support-page section.still-stuck-black p{color:#fff!important}
.support-page section.still-stuck-black .eyebrow{color:#B400FA!important}


/* v74 — Support FAQ intro only.
   Restore the larger pre-v73 left-side treatment without touching
   the site-wide typography guide or any other page. */
.support-page .support-section .section-copy h2,
.support-page .support-section .support-copy h2,
.support-page .support-section .support-intro h2,
.support-page .support-section .faq-intro h2,
.support-page .faq-section .section-copy h2,
.support-page .faq-section .support-copy h2,
.support-page .faq-section .support-intro h2,
.support-page .faq-section .faq-intro h2{
  font-size:clamp(38px,3.2vw,56px) !important;
  line-height:1.02 !important;
  letter-spacing:-1px !important;
  font-weight:800 !important;
}

.support-page .support-section .section-copy p,
.support-page .support-section .support-copy p,
.support-page .support-section .support-intro p,
.support-page .support-section .faq-intro p,
.support-page .faq-section .section-copy p,
.support-page .faq-section .support-copy p,
.support-page .faq-section .support-intro p,
.support-page .faq-section .faq-intro p{
  font-size:20px !important;
  line-height:1.55 !important;
  font-weight:400 !important;
}

@media(max-width:760px){
  .support-page .support-section .section-copy h2,
  .support-page .support-section .support-copy h2,
  .support-page .support-section .support-intro h2,
  .support-page .support-section .faq-intro h2,
  .support-page .faq-section .section-copy h2,
  .support-page .faq-section .support-copy h2,
  .support-page .faq-section .support-intro h2,
  .support-page .faq-section .faq-intro h2{
    font-size:clamp(34px,10vw,46px) !important;
  }

  .support-page .support-section .section-copy p,
  .support-page .support-section .support-copy p,
  .support-page .support-section .support-intro p,
  .support-page .support-section .faq-intro p,
  .support-page .faq-section .section-copy p,
  .support-page .faq-section .support-copy p,
  .support-page .faq-section .support-intro p,
  .support-page .faq-section .faq-intro p{
    font-size:18px !important;
  }
}


/* v75 — Restore pre-v73 typography ONLY for Privacy + Still Stuck sections */

/* Privacy + Your Data */
.support-page .privacy-section .faq-intro h2{
  font-size:clamp(43px,3.7vw,62px) !important;
  line-height:.9 !important;
  letter-spacing:-.045em !important;
  font-weight:800 !important;
  margin:7px 0 22px !important;
}
.support-page .privacy-section .faq-intro>p:last-child{
  font-size:17px !important;
  line-height:1.55 !important;
  font-weight:400 !important;
  max-width:440px !important;
  margin:0 !important;
}

/* Still Stuck */
.support-page .support-cta h2{
  font-size:clamp(46px,4.2vw,70px) !important;
  line-height:.9 !important;
  letter-spacing:-.045em !important;
  font-weight:800 !important;
  margin:7px 0 18px !important;
}
.support-page .support-cta p:not(.eyebrow){
  font-size:17px !important;
  line-height:1.55 !important;
  font-weight:400 !important;
  max-width:700px !important;
  margin:0 !important;
}

@media(max-width:760px){
  .support-page .privacy-section .faq-intro h2{
    font-size:clamp(38px,10.5vw,52px) !important;
  }
  .support-page .privacy-section .faq-intro>p:last-child{
    font-size:16px !important;
  }
  .support-page .support-cta h2{
    font-size:clamp(40px,11vw,56px) !important;
  }
  .support-page .support-cta p:not(.eyebrow){
    font-size:16px !important;
  }
}
