/* ── Request a Demo page ── */
body.inner-page { background: var(--Royal-Blue-Blue-900, #051A3C); }

/* Container — matches index.html breakpoint ladder (capped at 1320px) */
.container { width: 100%; max-width: 100%; margin-right: auto; margin-left: auto; padding-right: 1rem; padding-left: 1rem; }
@media (min-width: 576px)  { .container { max-width: 540px; } }
@media (min-width: 768px)  { .container { max-width: 720px; } }
@media (min-width: 992px)  { .container { max-width: 960px; } }
@media (min-width: 1200px) { .container { max-width: 1140px; } }
@media (min-width: 1400px) { .container { max-width: 1320px; } }

.req { color: #e53e3e; }

/* ── EYEBROW / GRADIENT TEXT (dark hero) ── */
.rd-hero__eyebrow { display:inline-flex; align-items:center; gap:8px; padding:7px 16px; border-radius:50px; border:1px solid rgba(255,255,255,.14); background:rgba(255,255,255,.04); font-family:'Inter',sans-serif; font-size:11px; font-weight:600; letter-spacing:1.6px; text-transform:uppercase; color:rgba(252,252,252,.65); margin:0; }
.pr-gradient { font-style:normal; background:linear-gradient(110deg,#4AE7FF 0%,#4075C9 25%,#E879F9 55%,#4AE7FF 80%,#4075C9 100%); background-size:260% auto; -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; color:transparent; animation:heroShimmer 5s linear infinite; }
@keyframes heroShimmer { 0% { background-position:0% center; } 100% { background-position:260% center; } }
/* .ah-accent (style.css) never sets font-style, so <em class="ah-accent"> (video title)
   falls back to the browser default italic for <em> — style.css already strips italic
   from its sibling accent classes (.th-accent, .ph-accent, etc.) but not this one. */
.ah-accent { font-style: normal; }

/* ── HERO (dark) ── */
.rd-hero {
    position: relative; overflow: hidden;
    padding: 96px 0 56px;
    background: var(--Royal-Blue-Blue-900, #051A3C);
}
.rd-hero .hero-grid {
    -webkit-mask-image: radial-gradient(ellipse 130% 100% at 50% 0%, #000 0%, rgba(0,0,0,.5) 60%, transparent 90%);
            mask-image: radial-gradient(ellipse 130% 100% at 50% 0%, #000 0%, rgba(0,0,0,.5) 60%, transparent 90%);
}
.rd-hero .hero-orbs { overflow: visible; }
.rd-hero .orb-violet { left: -5%; top: 5%; bottom: auto; width: 480px; height: 480px; }
.rd-hero .orb-cyan   { left: 50%; top: 10%; bottom: auto; transform: translateX(-50%); width: 620px; height: 480px; }
.rd-hero .orb-blue   { right: -5%; top: 5%; bottom: auto; width: 480px; height: 480px; }

/* two-column left/right layout */
.rd-hero__layout {
    position: relative; z-index: 4;
    display: grid; grid-template-columns: 1fr 0.92fr;
    gap: 56px; align-items: start;
}
.rd-hero__inner {
    display: flex; flex-direction: column; align-items: flex-start; gap: 20px;
}
.rd-hero__title {
    font-family: 'Space Grotesk', sans-serif; font-weight: 300;
    font-size: 52px; line-height: 60px; letter-spacing: -0.8px;
    color: var(--Base-White, #fcfcfc); margin: 0;
}
.rd-hero__desc {
    font-family: 'Inter', sans-serif; font-size: 17px; line-height: 27px;
    color: rgba(252,252,252,.68);
    margin: 0; max-width: 460px;
}
.rd-hero__list {
    list-style: none; margin: 6px 0 0; padding: 0;
    display: flex; flex-direction: column; gap: 14px;
}
.rd-hero__list li {
    display: flex; align-items: flex-start; gap: 12px;
    font-family: 'Inter', sans-serif; font-size: 15px; line-height: 24px;
    color: rgba(252,252,252,.82);
}
.rd-check {
    flex-shrink: 0; width: 22px; height: 22px; margin-top: 1px;
    display: inline-flex; align-items: center; justify-content: center;
    border-radius: 50%;
}
.rd-check svg { width: 13px; height: 13px; }
.rd-check--good {
    background: rgba(28,169,201,.18); color: var(--Turquoise-SkyBlue-500, #1ca9c9);
}
.rd-check--accent {
    background: rgba(232,121,249,.16); color: #e879f9;
}
.rd-hero__visual-wrap {
    position: relative;
    margin-top: 28px; width: 100%; max-width: 500px;
}
.rd-hero__visual-wrap::before {
    content: '';
    position: absolute; inset: -34px;
    background:
        radial-gradient(55% 55% at 26% 22%, rgba(64,117,201,.32) 0%, transparent 72%),
        radial-gradient(46% 46% at 82% 84%, rgba(232,121,249,.22) 0%, transparent 72%);
    filter: blur(10px);
    z-index: 0; pointer-events: none;
}
.rd-hero__visual {
    position: relative; z-index: 1;
    width: 100%;
}
.rd-hero__visual img { display: block; width: 100%; height: auto; }
.rd-hero__glow {
    position: absolute; left: 50%; top: 40%; transform: translate(-50%,-50%);
    width: 860px; height: 480px;
    background: radial-gradient(50% 50% at 50% 50%, rgba(28,169,201,.18) 0%, rgba(64,117,201,.09) 55%, transparent 100%);
    filter: blur(70px); pointer-events: none; z-index: 2;
}

/* Form card — sticks in view as the page scrolls */
.rd-hero__right { position: sticky; top: 32px; z-index: 4; align-self: start; }
.rd-form-card {
    background: var(--Base-White, #fcfcfc);
    border-radius: 20px;
    padding: 36px 40px 40px;
    box-shadow: 0 8px 40px -10px rgba(5,26,60,.16), 0 0 0 1px rgba(64,117,201,.10);
    position: relative; overflow: hidden;
}
.rd-form-card::before {
    content: ''; position: absolute; top: 0; left: 0; right: 0; height: 4px;
    background: var(--AI-Agents-Text, linear-gradient(83.02deg, #4AE7FF 51.42%, #4075C9 63.25%, #E879F9 76.03%));
    border-radius: 20px 20px 0 0;
}
.rd-form-card__title {
    font-family: 'Space Grotesk', sans-serif; font-weight: 500;
    font-size: 24px; line-height: 32px; letter-spacing: -0.2px;
    color: var(--Royal-Blue-Blue-900, #051A3C);
    margin: 0 0 6px;
}
.rd-form-card__sub {
    font-family: 'Inter', sans-serif; font-size: 14px; line-height: 22px;
    color: var(--blueGray-500, #64748B);
    margin: 0 0 22px;
}
.rd-form { display: flex; flex-direction: column; gap: 16px; }
.rd-form__group { display: flex; flex-direction: column; gap: 6px; }
.rd-form__label {
    font-family: 'Inter', sans-serif; font-size: 13px; font-weight: 500;
    color: var(--blueGray-700, #334155);
}
.rd-form__input,
.rd-form__textarea {
    width: 100%; box-sizing: border-box;
    padding: 11px 14px;
    border: 1px solid var(--blueGray-200, #E2E8F0);
    border-radius: 6px;
    background: #F8FAFC;
    font-family: 'Inter', sans-serif; font-size: 14px;
    color: var(--blueGray-700, #334155);
    outline: none;
    transition: border-color .18s, box-shadow .18s;
    -webkit-appearance: none; appearance: none;
}
.rd-form__input::placeholder,
.rd-form__textarea::placeholder { color: #94A3B8; }
.rd-form__input:focus,
.rd-form__textarea:focus {
    border-color: var(--Royal-Blue-Blue-300, #7aa3e5);
    box-shadow: 0 0 0 3px rgba(64,117,201,.12);
    background: var(--Base-White, #fcfcfc);
}
.rd-form__textarea { resize: vertical; min-height: 76px; }
.rd-form__checkbox-row {
    display: flex; align-items: flex-start; gap: 10px;
    margin-top: 2px;
}
.rd-form__checkbox-row input[type="checkbox"] {
    width: 15px; height: 15px; margin-top: 2px; flex-shrink: 0;
    accent-color: var(--Royal-Blue-Blue-400, #4075c9); cursor: pointer;
}
.rd-form__checkbox-label {
    font-family: 'Inter', sans-serif; font-size: 12.5px; line-height: 20px;
    color: #4a5568;
}
.rd-form__checkbox-label a {
    color: var(--Royal-Blue-Blue-400, #4075c9); text-decoration: underline;
}
.rd-form__recaptcha {
    display: flex; align-items: center; gap: 0;
    border: 1px solid var(--blueGray-200, #E2E8F0);
    border-radius: 4px; overflow: hidden;
    width: fit-content; background: #F8FAFC;
}
.rd-form__recaptcha-text {
    padding: 14px 16px;
    font-family: 'Inter', sans-serif; font-size: 12px;
    color: #4a5568; line-height: 1.3;
    border-right: 1px solid var(--blueGray-200, #E2E8F0);
}
.rd-form__recaptcha-logo {
    padding: 10px 14px;
    display: flex; flex-direction: column; align-items: center; gap: 3px;
}
.rd-form__recaptcha-logo svg { width: 32px; height: 32px; }
.rd-form__recaptcha-logo span {
    font-size: 8px; color: #94A3B8; white-space: nowrap;
}
.rd-form__submit {
    display: inline-flex; align-items: center; justify-content: center;
    padding: 13px 32px; border-radius: 6px;
    border: none; cursor: pointer;
    background: var(--Royal-Blue-Blue-400, #4075c9);
    font-family: 'Inter', sans-serif; font-size: 14px; font-weight: 700;
    color: var(--Base-White, #fcfcfc);
    width: 100%;
    transition: background .18s, transform .18s;
}
.rd-form__submit:hover { background: var(--Royal-Blue-Blue-500, #0e48a5); transform: translateY(-1px); }

/* HubSpot embed: match the reference page's native .rd-form controls. */
.rd-form-card .hs-form,
.rd-form-card form.hs-form {
    display: flex;
    flex-direction: column;
    gap: 16px;
    margin: 0;
}
.rd-form-card .hs-form-field {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin: 0;
}
.rd-form-card .hs-form-field > label,
.rd-form-card .hs-form label:not(.hs-error-msg) {
    font-family: 'Inter', sans-serif;
    font-size: 13px;
    font-weight: 500;
    line-height: 1.4;
    color: var(--blueGray-700, #334155);
    margin: 0;
}
.rd-form-card .hs-form .hs-input:not([type="checkbox"]):not([type="radio"]),
.rd-form-card .hs-form input[type="text"],
.rd-form-card .hs-form input[type="email"],
.rd-form-card .hs-form input[type="tel"],
.rd-form-card .hs-form input[type="number"],
.rd-form-card .hs-form select,
.rd-form-card .hs-form textarea {
    width: 100% !important;
    box-sizing: border-box;
    padding: 11px 14px;
    border: 1px solid var(--blueGray-200, #E2E8F0);
    border-radius: 6px;
    background: #F8FAFC;
    font-family: 'Inter', sans-serif;
    font-size: 14px;
    line-height: 20px;
    color: var(--blueGray-700, #334155);
    outline: none;
    box-shadow: none;
    transition: border-color .18s, box-shadow .18s, background .18s;
    -webkit-appearance: none;
    appearance: none;
}
.rd-form-card .hs-form textarea {
    min-height: 76px;
    resize: vertical;
}
.rd-form-card .hs-form .hs-input::placeholder,
.rd-form-card .hs-form textarea::placeholder {
    color: #94A3B8;
}
.rd-form-card .hs-form .hs-input:focus,
.rd-form-card .hs-form textarea:focus,
.rd-form-card .hs-form select:focus {
    border-color: var(--Royal-Blue-Blue-300, #7aa3e5);
    box-shadow: 0 0 0 3px rgba(64,117,201,.12);
    background: var(--Base-White, #fcfcfc);
}
.rd-form-card .hs-form .input,
.rd-form-card .hs-form .hs-input {
    margin: 0;
}
.rd-form-card .hs-form ul,
.rd-form-card .hs-form li {
    list-style: none;
    margin: 0;
    padding: 0;
}
.rd-form-card .hs-form .inputs-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.rd-form-card .hs-form .hs-form-checkbox-display,
.rd-form-card .hs-form .hs-form-booleancheckbox-display,
.rd-form-card .hs-form .legal-consent-container label {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font-family: 'Inter', sans-serif;
    font-size: 12.5px;
    font-weight: 400;
    line-height: 20px;
    color: #4a5568;
}
.rd-form-card .hs-form input[type="checkbox"],
.rd-form-card .hs-form input[type="radio"] {
    width: 15px !important;
    height: 15px;
    margin: 2px 0 0;
    flex-shrink: 0;
    accent-color: var(--Royal-Blue-Blue-400, #4075c9);
    cursor: pointer;
}
.rd-form-card .hs-form .legal-consent-container,
.rd-form-card .hs-form .hs-richtext {
    font-family: 'Inter', sans-serif;
    font-size: 12.5px;
    line-height: 20px;
    color: #4a5568;
}
.rd-form-card .hs-form a {
    color: var(--Royal-Blue-Blue-400, #4075c9);
    text-decoration: underline;
}
.rd-form-card .hs-form .hs-error-msgs {
    gap: 4px;
    margin-top: 4px;
}
.rd-form-card .hs-form .hs-error-msg {
    font-family: 'Inter', sans-serif;
    font-size: 12px;
    font-weight: 500;
    color: #e53e3e;
}
.rd-form-card .hs-form .hs_submit,
.rd-form-card .hs-form .actions {
    margin: 0;
}
.rd-form-card .hs-form input[type="submit"],
.rd-form-card .hs-form .hs-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    padding: 13px 32px;
    border: none;
    border-radius: 6px;
    background: var(--Royal-Blue-Blue-400, #4075c9);
    font-family: 'Inter', sans-serif;
    font-size: 14px;
    font-weight: 700;
    line-height: 20px;
    color: var(--Base-White, #fcfcfc);
    cursor: pointer;
    transition: background .18s, transform .18s;
}
.rd-form-card .hs-form input[type="submit"]:hover,
.rd-form-card .hs-form .hs-button:hover {
    background: var(--Royal-Blue-Blue-500, #0e48a5);
    transform: translateY(-1px);
}

/* ── TRUSTED LOGOS ──
   Structure copied from lumenore-ask-me.html's .trusted-section, but
   recolored for a white background. style.css has a global
   `.trusted-section { background: #051A3C !important; }` rule (tuned
   for dark-hero pages like ask-me.html), so overriding it here also
   needs !important to win. Logo set + both grey/color variants come
   straight from the Figma "logos" frame (each brand has a hand-tuned
   grey mark, not a filtered one) — two stacked <img>s per item
   crossfade on hover instead of the brightness(0)+opacity CSS-filter
   trick used elsewhere, so we render Figma's actual grey artwork.
   Fixed image box + object-fit: contain keeps sizing consistent across
   this logo set's very different native dimensions. */
/* style.css has `.trusted-section { padding-top: 8px !important; }` (a
   hack for pages where this section sits directly under a dark hero so
   the seam disappears) — needs !important here too, or that rule wins
   and crams the heading right up against the section's top edge. */
.trusted-section { padding: 64px 0 !important; background: var(--Base-White, #fcfcfc) !important; }
/* Heading centered above, logo strip full-width below (not the
   side-by-side row + divider layout ask-me.html uses). Tighter gap than
   the first pass — 36px row-gap plus the marquee item's own 96px-tall
   box (copied from ask-me.html's side-by-side layout, sized to match
   its h3 line-height) added up to a much bigger visual gap than
   intended once stacked. */
.trusted-row { display: flex; flex-direction: column; align-items: center; gap: 20px; }
.trusted-section h3 {
    font-family: 'Space Grotesk', sans-serif; font-weight: 500;
    font-size: 19px; line-height: 28px; letter-spacing: -0.3px;
    color: var(--Royal-Blue-Blue-900, #051A3C);
    text-align: center; margin: 0;
    max-width: 560px;
}

.trusted-marquee {
    width: 100%;
    position: relative; overflow: hidden;
    -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 8%, #000 92%, transparent 100%);
            mask-image: linear-gradient(90deg, transparent 0%, #000 8%, #000 92%, transparent 100%);
}
.trusted-marquee__track {
    display: flex; align-items: center;
    width: max-content; gap: 14px;
    animation: trustedMarqueeScroll 70s linear infinite;
}
.trusted-marquee:hover .trusted-marquee__track { animation-play-state: paused; }
@keyframes trustedMarqueeScroll {
    from { transform: translateX(0); }
    to   { transform: translateX(-50%); }
}
.trusted-marquee__item {
    position: relative;
    flex: 0 0 auto;
    display: flex; align-items: center; justify-content: center;
    height: 64px; padding: 0 22px;
}
.trusted-marquee__logo {
    width: 104px; height: 36px;
    object-fit: contain;
    transition: opacity .3s ease;
}
.trusted-marquee__logo--color {
    position: absolute; inset: 0; margin: auto;
    opacity: 0;
}
.trusted-marquee__item:hover .trusted-marquee__logo--grey { opacity: 0; }
.trusted-marquee__item:hover .trusted-marquee__logo--color { opacity: 1; }
@media (prefers-reduced-motion: reduce) {
    .trusted-marquee__track { animation: none; }
}
/* ── VIDEO ("Got 90 seconds?") — copy stacked above the thumbnail,
   CTA lives on the thumbnail itself. Light section background, with the
   same subtle dot-grid texture used on other light sections (e.g.
   start-for-free.css's .sff-products) instead of a plain flat fill. */
.rd-video {
    position: relative; overflow: hidden;
    background: #F8FAFC;
    padding: 88px 0;
    border-top: 1px solid rgba(14,72,165,.08);
    border-bottom: 1px solid rgba(14,72,165,.08);
}
.rd-video::before {
    content: '';
    position: absolute; inset: 0;
    background-image: radial-gradient(rgba(40,99,195,.14) 1px, transparent 1px);
    background-size: 24px 24px;
    -webkit-mask-image: radial-gradient(ellipse 90% 100% at 50% 50%, #000 0%, rgba(0,0,0,.4) 60%, transparent 90%);
            mask-image: radial-gradient(ellipse 90% 100% at 50% 50%, #000 0%, rgba(0,0,0,.4) 60%, transparent 90%);
    pointer-events: none;
}
.rd-video__glow {
    position: absolute; left: 50%; top: 10%; transform: translateX(-50%);
    width: 900px; height: 500px; border-radius: 50%;
    background: radial-gradient(50% 50% at 50% 50%, rgba(28,169,201,.10) 0%, rgba(119,71,182,.05) 55%, transparent 100%);
    filter: blur(70px); pointer-events: none;
}
.rd-video__intro {
    position: relative; z-index: 1;
    text-align: center; max-width: 640px; margin: 0 auto 40px;
}
.rd-video__title {
    font-family: 'Space Grotesk', sans-serif; font-weight: 300;
    font-size: 44px; line-height: 54px; letter-spacing: -0.6px;
    color: var(--Royal-Blue-Blue-900, #051A3C);
    margin: 0 0 14px;
}
.rd-video__desc {
    font-family: 'Inter', sans-serif; font-size: 18px; line-height: 28px;
    color: #4a5568;
    margin: 0;
}
.rd-video__thumb {
    position: relative; z-index: 1;
    display: block; width: 100%; max-width: 900px; margin: 0 auto;
    aspect-ratio: 16 / 9;
    padding: 0; border: none; cursor: pointer; background: #0d1e49;
    border-radius: 20px; overflow: hidden;
    box-shadow: 0 30px 70px -20px rgba(5,26,60,.30), 0 0 0 1px rgba(14,72,165,.08);
}
.rd-video__img {
    position: absolute; inset: 0; width: 100%; height: 100%;
    object-fit: cover; object-position: 50% 68%;
    transition: transform .4s ease;
}
.rd-video__thumb:hover .rd-video__img { transform: scale(1.04); }
.rd-video__overlay {
    position: absolute; inset: 0;
    background: linear-gradient(180deg, rgba(5,15,40,.12) 0%, rgba(5,15,40,.18) 55%, rgba(5,15,40,.45) 100%);
    transition: background .3s ease;
}
.rd-video__thumb:hover .rd-video__overlay { background: linear-gradient(180deg, rgba(5,15,40,.18) 0%, rgba(5,15,40,.26) 55%, rgba(5,15,40,.52) 100%); }
.rd-video__cta {
    position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%);
    z-index: 1;
    display: inline-flex; align-items: center; gap: 10px;
    padding: 15px 34px; border-radius: 50px;
    background: var(--Royal-Blue-Blue-400, #4075c9);
    font-family: 'Inter', sans-serif; font-size: 15px; font-weight: 700;
    color: var(--Base-White, #fcfcfc);
    box-shadow: 0 10px 24px -6px rgba(64,117,201,.6);
    transition: background .2s ease, transform .2s ease, box-shadow .2s ease;
}
.rd-video__thumb:hover .rd-video__cta { background: var(--Royal-Blue-Blue-500, #0e48a5); transform: translate(-50%,-50%) translateY(-2px); box-shadow: 0 14px 30px -6px rgba(64,117,201,.65); }
.rd-video__play {
    display: inline-flex; align-items: center; justify-content: center;
    width: 22px; height: 22px; flex-shrink: 0;
}
.rd-video__play svg { width: 100%; height: 100%; }

/* ── YouTube lightbox modal (mirrors partners.html) ── */
.yt-modal {
    position: fixed; inset: 0; z-index: 9999;
    display: flex; align-items: center; justify-content: center;
    padding: 24px;
}
.yt-modal[hidden] { display: none; }
.yt-modal__backdrop {
    position: absolute; inset: 0;
    background: rgba(5,26,60,.88);
    backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
    cursor: pointer;
}
.yt-modal__box {
    position: relative; z-index: 1;
    width: 100%; max-width: 900px;
    border-radius: 16px; overflow: hidden;
    box-shadow: 0 32px 80px rgba(0,0,0,.6);
    animation: ytModalIn .22s ease;
}
@keyframes ytModalIn {
    from { opacity: 0; transform: scale(.96); }
    to   { opacity: 1; transform: scale(1); }
}
.yt-modal__close {
    position: absolute; top: 12px; right: 12px; z-index: 2;
    width: 36px; height: 36px; border-radius: 50%;
    border: none; cursor: pointer;
    background: rgba(0,0,0,.55); color: var(--Base-White, #fcfcfc);
    display: flex; align-items: center; justify-content: center;
    transition: background .18s;
}
.yt-modal__close:hover { background: rgba(0,0,0,.85); }
.yt-modal__ratio {
    position: relative; padding-bottom: 56.25%;
    height: 0; background: #000;
}
.yt-modal__ratio iframe {
    position: absolute; inset: 0; width: 100%; height: 100%;
}
@media (prefers-reduced-motion: reduce) {
    .yt-modal__box { animation: none; }
}

/* ── TESTIMONIALS (white) ──
   .section-testimonial / .ts-wrap / .ts-cards / .ts-panel etc. are
   styled globally in style.css (same component as index.html), text
   already defaults to dark-on-light. But style.css's own background
   rule (line ~11913) is a gradient fading to transparent at the bottom —
   built for index.html, where a dark .page-finale wrapper bleeds through
   on purpose. This page's body is dark navy directly (no such wrapper),
   so that same fade let the dark body color show through as an unwanted
   gradient band. Forcing a flat white here (!important, since that's
   what the rule we're overriding uses) instead of touching style.css. */
.section-testimonial {
    background: var(--Base-White, #fcfcfc) !important;
    padding: 56px 0 72px;
}
.testimonial-intro { margin-bottom: 40px; }

/* ── FAQ ("Before you decide", reused from index.html) ──
   .before-decide / .bd-intro / .bd-faq / .faq-item are already styled
   globally in style.css (built for a dark parent) — this section just
   supplies that dark background. */
.rd-faq {
    position: relative;
    background: linear-gradient(160deg, #1d0b42 0%, #0d1e49 45%, #051A3C 100%);
    padding: 96px 0;
    overflow: hidden;
}
.rd-faq::before {
    content: '';
    position: absolute; inset: 0;
    background: radial-gradient(ellipse 70% 80% at 15% 50%, rgba(85,41,142,.40) 0%, transparent 65%);
    pointer-events: none;
}
.rd-faq .container { position: relative; z-index: 1; }
.rd-faq .bd-faq .faq-answer {
    max-height: 0;
    overflow: hidden;
    opacity: 0;
    padding-top: 0;
    transition: max-height .35s ease, padding .35s ease, opacity .3s ease;
}
.rd-faq .bd-faq .faq-item.is-open .faq-answer {
    max-height: 320px !important;
    opacity: 1 !important;
    padding-top: 16px !important;
}
.rd-faq .bd-faq .faq-item.is-open .faq-toggle::after {
    opacity: 0 !important;
}

/* ── RESPONSIVE ── */
@media (max-width: 1200px) {
    .rd-hero__layout { grid-template-columns: 1fr; gap: 48px; }
    .rd-hero__inner { align-items: center; text-align: center; }
    .rd-hero__desc { max-width: 640px; }
    .rd-hero__visual-wrap { max-width: 560px; }
    .rd-hero__right { position: static; max-width: 560px; margin: 0 auto; width: 100%; }
}
@media (max-width: 768px) {
    .rd-hero { padding: 72px 0 56px; }
    .rd-hero__title { font-size: 38px; line-height: 46px; }
    .rd-hero__list li { text-align: left; }
    .rd-form-card { padding: 28px 22px 32px; }
    .rd-video__title { font-size: 30px; }
    .rd-video__desc { font-size: 15px; }
    .rd-video__cta { padding: 13px 26px; font-size: 14px; }
}