html { scroll-behavior: smooth; }
.adv-faq { background: #0a0a0d; color: var(--fg); margin-inline: calc(50% - 50vw); } .adv-faq-hero {
position: relative; overflow: hidden; box-sizing: border-box;
min-height: 78svh;
display: flex; align-items: center; justify-content: center;
padding: clamp(6rem, 12vh, 8rem) clamp(1.25rem, 5vw, 3rem) clamp(2rem, 4vh, 3rem);
background: radial-gradient(135% 105% at 50% 20%, #150e22 0%, #0c0913 48%, #0a0a0d 100%);
margin-inline: calc(50% - 50vw);
text-align: center;
}
.adv-faq-hero__bg { position: absolute; inset: 0; z-index: 0; pointer-events: none; }
.adv-faq-hero__glow {
position: absolute; left: 50%; top: -10%; translate: -50% 0; border-radius: 50%; filter: blur(70px);
width: 56vw; height: 56vw; max-width: 640px; max-height: 640px;
background: radial-gradient(circle, rgba(123, 67, 196, .45), transparent 64%); opacity: .6;
}
.adv-faq-hero__stars {
position: absolute; inset: 0; opacity: .4;
background-image:
radial-gradient(1px 1px at 15% 30%, rgba(244, 243, 247, .7), transparent),
radial-gradient(1px 1px at 32% 68%, rgba(244, 243, 247, .5), transparent),
radial-gradient(1px 1px at 52% 40%, rgba(200, 162, 75, .5), transparent),
radial-gradient(1px 1px at 68% 78%, rgba(244, 243, 247, .5), transparent),
radial-gradient(1px 1px at 82% 25%, rgba(244, 243, 247, .6), transparent),
radial-gradient(1px 1px at 90% 60%, rgba(123, 67, 196, .6), transparent);
background-size: 600px 600px;
} .adv-faq-hero__qmarks { position: absolute; inset: 0; z-index: 1; pointer-events: none; }
.adv-faq-hero__qmark {
position: absolute; display: flex; align-items: center; justify-content: center;
border-radius: 50%; font-family: var(--font-head); font-weight: 800; color: var(--gold);
background: linear-gradient(160deg, rgba(123, 67, 196, .22), rgba(10, 10, 13, .5));
border: 1px solid rgba(123, 67, 196, .35);
box-shadow: 0 14px 30px -12px rgba(0, 0, 0, .6), inset 0 1px 0 rgba(255, 255, 255, .08);
}
.adv-faq-hero__qmark--1 { top: 18%;  left: 14%; width: 53px; height: 53px; font-size: 1.43rem; }
.adv-faq-hero__qmark--2 { top: 24%;  right: 15%; width: 42px; height: 42px; font-size: 1.16rem; }
.adv-faq-hero__qmark--3 { top: 54%;  left: 11%; width: 59px; height: 59px; font-size: 1.65rem; }
.adv-faq-hero__qmark--4 { bottom: 18%; right: 14%; width: 48px; height: 48px; font-size: 1.32rem; }
.adv-faq-hero__qmark--5 { bottom: 24%; left: 24%; width: 37px; height: 37px; font-size: 1.01rem; opacity: .85; }
.adv-js .adv-faq-hero__qmark { opacity: 0; filter: blur(10px); transform: translateY(22px) scale(.8); }
.adv-faq-hero__qmarks.is-in .adv-faq-hero__qmark--1 { animation: adv-faq-qmark-in .8s var(--ease) .15s both; }
.adv-faq-hero__qmarks.is-in .adv-faq-hero__qmark--2 { animation: adv-faq-qmark-in .8s var(--ease) .32s both; }
.adv-faq-hero__qmarks.is-in .adv-faq-hero__qmark--3 { animation: adv-faq-qmark-in .8s var(--ease) .1s both; }
.adv-faq-hero__qmarks.is-in .adv-faq-hero__qmark--4 { animation: adv-faq-qmark-in .8s var(--ease) .46s both; }
.adv-faq-hero__qmarks.is-in .adv-faq-hero__qmark--5 { animation: adv-faq-qmark-in .8s var(--ease) .6s both; }
@keyframes adv-faq-qmark-in { to { opacity: 1; filter: blur(0); transform: translateY(0) scale(1); } }
@media (min-width: 861px) {
.adv-faq-hero__qmarks.is-in .adv-faq-hero__qmark--1 { animation-name: adv-faq-qmark-in, adv-faq-qmark-float; animation-duration: .8s, 5.2s; animation-delay: .15s, .95s; animation-timing-function: var(--ease), ease-in-out; animation-iteration-count: 1, infinite; animation-fill-mode: both, none; }
.adv-faq-hero__qmarks.is-in .adv-faq-hero__qmark--2 { animation-name: adv-faq-qmark-in, adv-faq-qmark-float; animation-duration: .8s, 4.4s; animation-delay: .32s, 1.12s; animation-timing-function: var(--ease), ease-in-out; animation-iteration-count: 1, infinite; animation-fill-mode: both, none; }
.adv-faq-hero__qmarks.is-in .adv-faq-hero__qmark--3 { animation-name: adv-faq-qmark-in, adv-faq-qmark-float; animation-duration: .8s, 5.8s; animation-delay: .1s, .9s; animation-timing-function: var(--ease), ease-in-out; animation-iteration-count: 1, infinite; animation-fill-mode: both, none; }
.adv-faq-hero__qmarks.is-in .adv-faq-hero__qmark--4 { animation-name: adv-faq-qmark-in, adv-faq-qmark-float; animation-duration: .8s, 4.9s; animation-delay: .46s, 1.26s; animation-timing-function: var(--ease), ease-in-out; animation-iteration-count: 1, infinite; animation-fill-mode: both, none; }
.adv-faq-hero__qmarks.is-in .adv-faq-hero__qmark--5 { animation-name: adv-faq-qmark-in, adv-faq-qmark-float; animation-duration: .8s, 5.1s; animation-delay: .6s, 1.4s; animation-timing-function: var(--ease), ease-in-out; animation-iteration-count: 1, infinite; animation-fill-mode: both, none; }
}
@keyframes adv-faq-qmark-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-12px); } }
@media (max-width: 860px) {
.adv-faq-hero__qmarks { display: none; }
}
@media (prefers-reduced-motion: reduce) {
.adv-faq-hero__qmark { animation: none !important; opacity: 1; filter: none; transform: none; }
}
.adv-faq-hero__col { position: relative; z-index: 2; max-width: 40rem; margin-inline: auto; }
.adv-faq-hero__badge { justify-content: center; }
.adv-faq-hero__h1 {
margin: 1rem 0 0; font-family: var(--font-head); font-weight: 800;
font-size: clamp(2.1rem, 4.6vw, 3.6rem); line-height: 1.08; letter-spacing: -.015em; color: var(--fg);
}
@media (max-width: 860px) { .adv-faq-hero__h1 { line-height: 1.15; } }
.adv-faq-hl {
background: linear-gradient(180deg, #e9cf94 0%, #c8a24b 55%, #b0883a 100%);
-webkit-background-clip: text; background-clip: text;
-webkit-text-fill-color: transparent; color: var(--gold);
-webkit-box-decoration-break: clone; box-decoration-break: clone;
}
.adv-faq-hero__lead {
margin: 1.1rem auto 0; max-width: 32rem;
font-family: var(--font-body); font-size: clamp(.98rem, 1.3vw, 1.12rem); line-height: 1.7; color: rgba(244, 243, 247, .74);
}
.adv-faq-hero__actions { display: flex; flex-wrap: wrap; justify-content: center; gap: .8rem; margin-top: clamp(1.6rem, 3vw, 2.2rem); } .adv-faq-wrap { max-width: calc(1280px + 4rem); margin: 0 auto; padding: clamp(2rem, 5vw, 3rem) clamp(1.25rem, 5vw, 2rem) clamp(5rem, 10vw, 8rem); box-sizing: border-box; } .adv-faq-list { max-width: 46rem; margin: 0 auto; display: flex; flex-direction: column; gap: .9rem; }
.adv-faq__item {
border-radius: 16px; overflow: hidden;
background: linear-gradient(180deg, rgba(255, 255, 255, .05), rgba(255, 255, 255, .015));
border: 1px solid rgba(244, 243, 247, .1);
transition: border-color .25s var(--ease);
}
.adv-faq__item.is-open { border-color: rgba(200, 162, 75, .35); }
.adv-faq__q {
all: unset; box-sizing: border-box; display: flex; align-items: center; justify-content: space-between; gap: 1rem;
width: 100%; padding: 1.2rem 1.4rem; cursor: pointer;
font-family: var(--font-head); font-weight: 700; font-size: 1rem; color: var(--fg); line-height: 1.4;
}
@media (hover: hover) { .adv-faq__q:hover { color: var(--gold); } }
.adv-faq__q:focus-visible { outline: 2px solid var(--gold); outline-offset: -2px; border-radius: 12px; }
.adv-faq__ico {
position: relative; flex: 0 0 auto; width: 22px; height: 22px;
}
.adv-faq__ico::before, .adv-faq__ico::after {
content: ""; position: absolute; top: 50%; left: 50%; translate: -50% -50%;
background: currentColor; border-radius: 2px; transition: transform .3s var(--ease), opacity .3s var(--ease);
}
.adv-faq__ico::before { width: 14px; height: 2px; }
.adv-faq__ico::after { width: 2px; height: 14px; }
.adv-faq__item.is-open .adv-faq__ico::after { transform: translate(-50%, -50%) rotate(90deg); opacity: 0; }
.adv-faq__item.is-open .adv-faq__ico::before { background: var(--gold); } .adv-faq__a {
display: grid; grid-template-rows: 0fr;
transition: grid-template-rows .38s var(--ease);
}
.adv-faq__item.is-open .adv-faq__a { grid-template-rows: 1fr; }
.adv-faq__a-inner { overflow: hidden; }
.adv-faq__a-inner p {
margin: 0 1.4rem 1rem; padding-top: .2rem;
font-family: var(--font-body); font-size: .95rem; line-height: 1.7; color: var(--muted);
}
.adv-faq__a-inner p:first-child { padding-top: 0; }
.adv-faq__a-inner p:last-child { margin-bottom: 1.3rem; }
.adv-faq__a-inner a { color: var(--gold); text-decoration: underline; text-underline-offset: 3px; }
.adv-faq__a-inner a:hover, .adv-faq__a-inner a:focus-visible { color: #fff; }
.adv-faq__a-inner strong { color: var(--fg); font-weight: 700; }
@media (prefers-reduced-motion: reduce) {
.adv-faq__a, .adv-faq__ico::before, .adv-faq__ico::after { transition: none; }
} @media (max-width: 860px) {
.adv-faq-hero { min-height: auto; padding-top: calc(clamp(6rem, 12vh, 8rem) + 24px); } .adv-faq__q { padding: 1.05rem 1.1rem; font-size: .95rem; }
}