.page-faq{
  --faq-card: var(--ink-2);
  --faq-card-deep: var(--ink);
  --faq-line: rgba(211,222,232,.12);
  --faq-red-weak: rgba(230,57,70,.14);
  --faq-gold-weak: rgba(244,162,97,.14);
  --faq-neon-weak: rgba(0,229,255,.1);
  position:relative;
  color: var(--blue-gray);
  overflow-x: clip;
}

.page-faq .faq-hero{
  position:relative;
  padding-top:24px;
  overflow:hidden;
}

.page-faq .faq-hero::before{
  content:"";
  position:absolute;
  top:0;
  right:4%;
  width:120%;
  height:220px;
  background:repeating-linear-gradient(-12deg, transparent 0 24px, rgba(0,229,255,.035) 24px 26px, transparent 26px 64px);
  pointer-events:none;
}

.page-faq .faq-hero__inner{
  position:relative;
  z-index:1;
}

.page-faq .breadcrumb{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:8px;
  font-size:13px;
  color:rgba(211,222,232,.66);
  margin-bottom:22px;
}

.page-faq .breadcrumb a{
  color:var(--blue-gray);
  text-decoration:none;
  transition:color .3s;
}

.page-faq .breadcrumb a:hover{
  color:var(--gold);
}

.page-faq .breadcrumb__sep{
  color:rgba(211,222,232,.4);
}

.page-faq .faq-hero__grid{
  display:grid;
  gap:28px;
  align-items:center;
}

.page-faq .faq-hero__content{
  max-width:760px;
}

.page-faq .faq-hero__eyebrow{
  display:inline-block;
  font-family:var(--font-mono);
  font-size:12px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--neon);
  background:rgba(0,229,255,.08);
  border:1px solid rgba(0,229,255,.22);
  padding:6px 14px;
  border-radius:999px;
}

.page-faq .faq-hero h1{
  font-family:var(--font-display);
  font-size:clamp(2.1rem, 5vw, 3.4rem);
  line-height:1.08;
  letter-spacing:-.02em;
  color:var(--white);
  margin:14px 0 14px;
}

.page-faq .faq-hero__lead{
  font-size:15px;
  line-height:1.75;
  color:rgba(211,222,232,.84);
  max-width:680px;
}

.page-faq .faq-stats{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:24px;
}

.page-faq .faq-stat{
  background:rgba(19,39,67,.72);
  border:1px solid var(--faq-line);
  border-radius:18px;
  padding:12px 18px;
  display:grid;
  gap:4px;
}

.page-faq .faq-stat__num{
  font-family:var(--font-mono);
  font-size:18px;
  color:var(--white);
}

.page-faq .faq-stat__label{
  font-size:12px;
  color:rgba(211,222,232,.66);
}

.page-faq .faq-hero__visual{
  position:relative;
  margin:0 auto;
  width:min(230px, 76vw);
  background:linear-gradient(180deg, rgba(230,57,70,.2), rgba(19,39,67,.42));
  border:1px solid rgba(230,57,70,.34);
  border-radius:36px;
  padding:20px 20px 16px;
  text-align:center;
}

.page-faq .faq-hero__visual img{
  display:block;
  width:200px;
  max-width:100%;
  height:auto;
  object-fit:cover;
  border-radius:24px;
  margin-inline:auto;
}

.page-faq .faq-hero__visual figcaption{
  margin-top:12px;
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.1em;
  color:rgba(211,222,232,.7);
  text-transform:uppercase;
}

.page-faq .faq-hero__pulse{
  position:absolute;
  inset:-12px;
  border-radius:44px;
  border:1px dashed rgba(244,162,97,.52);
  animation:faqPulse 6s ease-in-out infinite;
  pointer-events:none;
}

@keyframes faqPulse{
  0%,100%{ transform:scale(1); opacity:.62; }
  50%{ transform:scale(1.04); opacity:.25; }
}

.page-faq .faq-tabs{
  position:relative;
  z-index:2;
  display:flex;
  gap:10px;
  overflow-x:auto;
  padding-block:22px 4px;
  scrollbar-width:none;
  -webkit-overflow-scrolling:touch;
}

.page-faq .faq-tabs::-webkit-scrollbar{
  display:none;
}

.page-faq .faq-tab{
  flex:0 0 auto;
  font-size:14px;
  font-weight:600;
  color:var(--blue-gray);
  background:var(--faq-card);
  border:1px solid var(--faq-line);
  border-radius:999px;
  padding:10px 20px;
  text-decoration:none;
  white-space:nowrap;
  transition:background .3s ease, color .3s ease, border-color .3s ease, transform .3s ease;
}

.page-faq .faq-tab:hover,
.page-faq .faq-tab:focus-visible{
  background:var(--faq-gold-weak);
  border-color:var(--gold);
  color:var(--white);
  transform:translateY(-2px);
}

.page-faq .faq-tab--active{
  background:var(--red);
  border-color:var(--red);
  color:var(--white);
}

.page-faq .faq-ruler{
  height:1px;
  margin:14px 0 36px;
  background:linear-gradient(90deg, rgba(230,57,70,.42), rgba(244,162,97,.26), transparent 80%);
  border:0;
}

.page-faq .faq-section,
.page-faq .faq-block{
  scroll-margin-top:92px;
}

.page-faq .faq-section__head{
  display:grid;
  gap:10px;
  margin-bottom:26px;
}

.page-faq .faq-section__head h2{
  font-family:var(--font-display);
  font-size:clamp(1.6rem, 3.4vw, 2.4rem);
  line-height:1.2;
  color:var(--white);
}

.page-faq .faq-section__desc{
  font-size:14px;
  line-height:1.7;
  color:rgba(211,222,232,.74);
  max-width:660px;
}

.page-faq .faq-kicker{
  font-family:var(--font-mono);
  font-size:12px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--red);
  font-weight:500;
}

.page-faq .faq-list{
  display:grid;
  gap:14px;
}

.page-faq .faq-item{
  background:var(--faq-card);
  border:1px solid var(--faq-line);
  border-radius:24px;
  overflow:hidden;
  transition:border-color .3s ease, box-shadow .3s ease;
}

.page-faq .faq-item[open]{
  border-color:rgba(230,57,70,.42);
  box-shadow:0 18px 40px rgba(4,10,26,.38);
}

.page-faq .faq-summary{
  list-style:none;
  display:flex;
  align-items:center;
  gap:14px;
  padding:18px 20px;
  cursor:pointer;
  user-select:none;
}

.page-faq .faq-summary::-webkit-details-marker{
  display:none;
}

.page-faq .faq-q-num{
  flex:0 0 auto;
  font-family:var(--font-mono);
  font-size:13px;
  color:var(--gold);
  background:var(--faq-gold-weak);
  border-radius:999px;
  padding:4px 12px;
}

.page-faq .faq-q-text{
  font-size:15px;
  font-weight:600;
  line-height:1.5;
  color:var(--white);
}

.page-faq .faq-icon{
  margin-left:auto;
  flex:0 0 auto;
  width:32px;
  height:32px;
  display:grid;
  place-items:center;
  border-radius:50%;
  border:1px solid rgba(211,222,232,.28);
  color:var(--blue-gray);
  font-size:20px;
  line-height:1;
  font-family:var(--font-text);
  transition:transform .35s cubic-bezier(.22,.61,.36,1), background .35s ease, border-color .35s ease, color .35s ease;
}

.page-faq .faq-item[open] .faq-icon{
  transform:rotate(45deg);
  background:var(--red);
  border-color:var(--red);
  color:var(--white);
}

.page-faq .faq-answer{
  padding:2px 20px 24px;
  font-size:14px;
  line-height:1.7;
  color:rgba(211,222,232,.84);
}

.page-faq .faq-item[open] .faq-answer{
  animation:faqAnswerIn .42s cubic-bezier(.22,.61,.36,1);
}

@keyframes faqAnswerIn{
  from{ opacity:0; transform:translateY(-8px); }
  to{ opacity:1; transform:none; }
}

.page-faq .faq-answer p + p{
  margin-top:10px;
}

.page-faq .faq-answer a{
  color:var(--neon);
  text-decoration:none;
}

.page-faq .faq-answer a:hover{
  text-decoration:underline;
}

.page-faq .faq-steps{
  margin:14px 0 0;
  padding:0;
  list-style:none;
  counter-reset:faqStep;
  display:grid;
  gap:10px;
}

.page-faq .faq-steps li{
  counter-increment:faqStep;
  display:grid;
  grid-template-columns:28px 1fr;
  gap:10px;
  align-items:flex-start;
}

.page-faq .faq-steps li::before{
  content:counter(faqStep, decimal-leading-zero);
  font-family:var(--font-mono);
  font-size:12px;
  color:var(--gold);
  background:var(--faq-gold-weak);
  border-radius:999px;
  width:28px;
  height:28px;
  display:grid;
  place-items:center;
  margin-top:2px;
}

.page-faq .faq-blocks{
  margin-top:44px;
  display:grid;
  gap:24px;
}

.page-faq .faq-block{
  position:relative;
  background:linear-gradient(180deg, rgba(19,39,67,.72), rgba(19,39,67,.92));
  border:1px solid var(--faq-line);
  border-radius:28px;
  padding:30px 20px 26px;
  overflow:hidden;
}

.page-faq .faq-block::before{
  content:"";
  position:absolute;
  top:0;
  left:0;
  right:0;
  height:3px;
  background:var(--red);
}

.page-faq .faq-block--watch::before{
  background:var(--gold);
}

.page-faq .faq-block--data::before{
  background:var(--neon);
}

.page-faq .faq-block--device::before{
  background:linear-gradient(90deg, var(--red), var(--gold), var(--neon));
}

.page-faq .faq-block__head{
  display:grid;
  gap:6px;
  margin-bottom:20px;
}

.page-faq .faq-block__num{
  font-family:var(--font-mono);
  font-size:13px;
  letter-spacing:.1em;
  color:var(--red);
}

.page-faq .faq-block--watch .faq-block__num{
  color:var(--gold);
}

.page-faq .faq-block--data .faq-block__num{
  color:var(--neon);
}

.page-faq .faq-block__title{
  font-family:var(--font-display);
  font-size:1.45rem;
  line-height:1.2;
  color:var(--white);
}

.page-faq .faq-block__desc{
  font-size:13px;
  line-height:1.65;
  color:rgba(211,222,232,.7);
}

.page-faq .faq-block .faq-item{
  border-radius:18px;
  background:rgba(11,29,58,.58);
}

.page-faq .faq-block .faq-item + .faq-item{
  margin-top:0;
}

.page-faq .faq-block .faq-list{
  gap:12px;
}

.page-faq .faq-flow{
  display:grid;
  gap:24px;
  align-items:center;
  margin-top:6px;
}

.page-faq .faq-flow__figure{
  margin:0;
  border-radius:22px;
  overflow:hidden;
  border:1px solid rgba(244,162,97,.3);
  background:var(--faq-card);
}

.page-faq .faq-flow__figure img{
  display:block;
  width:100%;
  max-width:100%;
  height:auto;
  object-fit:cover;
}

.page-faq .faq-flow__figcaption{
  padding:12px 14px;
  font-family:var(--font-mono);
  font-size:12px;
  letter-spacing:.06em;
  color:var(--gold);
  background:rgba(244,162,97,.08);
}

.page-faq .faq-flow .faq-list{
  align-self:stretch;
}

.page-faq .faq-contact{
  margin-top:56px;
}

.page-faq .faq-contact__inner{
  position:relative;
  border-radius:32px;
  background:linear-gradient(122deg, rgba(230,57,70,.16), rgba(11,29,58,.34) 58%), var(--ink-2);
  border:1px solid rgba(230,57,70,.38);
  padding:34px 22px;
  overflow:hidden;
}

.page-faq .faq-contact__inner::after{
  content:"";
  position:absolute;
  right:-70px;
  bottom:-70px;
  width:260px;
  height:260px;
  border-radius:50%;
  background:radial-gradient(circle, rgba(244,162,97,.18), transparent 70%);
  pointer-events:none;
}

.page-faq .faq-contact__left{
  position:relative;
  z-index:1;
}

.page-faq .faq-contact__left h2{
  font-family:var(--font-display);
  font-size:clamp(1.6rem, 3vw, 2.4rem);
  line-height:1.2;
  color:var(--white);
  margin:10px 0 12px;
}

.page-faq .faq-contact__left p{
  font-size:14px;
  line-height:1.7;
  color:rgba(211,222,232,.8);
  max-width:460px;
  margin-bottom:20px;
}

.page-faq .faq-contact__list{
  position:relative;
  z-index:1;
  list-style:none;
  margin:24px 0 0;
  padding:22px 0 0;
  border-top:1px solid rgba(244,162,97,.22);
  display:grid;
  gap:18px;
}

.page-faq .faq-contact__list li{
  display:grid;
  grid-template-columns:86px 1fr;
  gap:12px;
  align-items:baseline;
}

.page-faq .faq-contact__label{
  font-family:var(--font-mono);
  font-size:12px;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--gold);
}

.page-faq .faq-contact__value{
  font-size:14px;
  line-height:1.55;
  color:var(--blue-gray);
  overflow-wrap:break-word;
}

.page-faq .faq-contact__value strong{
  color:var(--white);
  font-size:15px;
}

@media (min-width: 640px){
  .page-faq .faq-hero__grid{
    grid-template-columns:1fr auto;
  }

  .page-faq .faq-answer{
    padding-left:84px;
  }
}

@media (min-width: 768px){
  .page-faq .faq-blocks{
    grid-template-columns:repeat(2, 1fr);
    align-items:start;
  }

  .page-faq .faq-block--device{
    grid-column:1 / -1;
  }

  .page-faq .faq-flow{
    grid-template-columns:1fr minmax(320px, 420px);
  }

  .page-faq .faq-contact__inner{
    display:grid;
    grid-template-columns:1.1fr 1fr;
    gap:36px;
    align-items:center;
    padding:44px 38px;
  }

  .page-faq .faq-contact__list{
    margin-top:0;
    padding-top:0;
    border-top:0;
    border-left:1px solid rgba(244,162,97,.22);
    padding-left:32px;
  }
}

@media (min-width: 1080px){
  .page-faq .faq-hero{
    padding-top:36px;
  }

  .page-faq .faq-hero h1{
    margin-bottom:18px;
  }

  .page-faq .faq-hero__lead{
    font-size:16px;
  }

  .page-faq .faq-block{
    padding:34px 30px 30px;
  }
}

@media (prefers-reduced-motion: reduce){
  .page-faq .faq-hero__pulse,
  .page-faq .faq-icon,
  .page-faq .faq-item[open] .faq-answer,
  .page-faq .faq-tab{
    animation:none;
    transition:none;
  }
}