/* GSP — FAQ page. Canonical tokens. */

/* ── HERO (compact band, navy) ── */
.faq-hero { position: relative; background: linear-gradient(160deg, var(--navy-800) 0%, #0E1526 100%); padding: clamp(9rem,15vh,11rem) var(--section-x) clamp(3.5rem,7vh,5rem); overflow: hidden; text-align: center; }
.faq-hero-glow { position: absolute; inset: 0; background: radial-gradient(ellipse at 50% 0%, rgba(231,26,33,.12), transparent 55%), radial-gradient(ellipse at 85% 95%, rgba(63,78,109,.32), transparent 60%); }
.faq-hero-inner { position: relative; z-index: 2; max-width: 760px; margin: 0 auto; }
.faq-hero .hero-eyebrow { justify-content: center; }
.faq-hero-title { font-family: var(--font-display); font-weight: 800; font-size: clamp(2.1rem,4.6vw,3.2rem); line-height: 1.1; color: #fff; margin: 0 0 1.1rem; }
.faq-hero-sub { font-size: clamp(.95rem,1.5vw,1.1rem); color: rgba(255,255,255,.62); line-height: 1.6; max-width: 600px; margin: 0 auto; }
.faq-hero .hero-diagonal { position: absolute; bottom: -1px; left: 0; width: 100%; line-height: 0; z-index: 3; }
.faq-hero .hero-diagonal svg { width: 100%; height: 56px; display: block; }

/* ── BODY (accordion, single readable column) ── */
.faq-body { background: var(--white); }
.faq-inner { max-width: 820px; margin: 0 auto; padding: 0 var(--section-x); }
.faq-group { margin-bottom: 3rem; }
.faq-group:last-child { margin-bottom: 0; }
.faq-group-title { font-family: var(--font-display); font-weight: 800; font-size: .78rem; letter-spacing: 2.5px; text-transform: uppercase; color: var(--red-500); margin: 0 0 1.2rem; padding-bottom: .7rem; border-bottom: 1px solid var(--gray-100); }
.faq-list { display: flex; flex-direction: column; gap: .8rem; }

.faq-item { border: 1px solid var(--gray-100); border-radius: var(--radius-lg, 10px); background: var(--white); overflow: hidden; transition: border-color var(--dur) var(--ease), box-shadow var(--dur) var(--ease); }
.faq-item:hover { border-color: var(--gray-200); }
.faq-item.open { border-color: rgba(231,26,33,.35); box-shadow: 0 8px 26px rgba(30,45,79,.08); }
.faq-q { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 1.2rem; background: none; border: none; cursor: pointer; text-align: left; padding: 1.15rem 1.4rem; font-family: var(--font-display); font-weight: 700; font-size: 1rem; color: var(--navy-700); line-height: 1.35; transition: color var(--dur) var(--ease); }
.faq-q:hover { color: var(--red-500); }
.faq-item.open .faq-q { color: var(--navy-700); }
.faq-chevron { flex-shrink: 0; width: 30px; height: 30px; border-radius: 50%; display: flex; align-items: center; justify-content: center; background: var(--gray-50); transition: transform var(--dur) var(--ease), background var(--dur) var(--ease); }
.faq-chevron svg { stroke: var(--navy-700); }
.faq-item.open .faq-chevron { transform: rotate(180deg); background: var(--red-glow); }
.faq-item.open .faq-chevron svg { stroke: var(--red-500); }

.faq-a-wrap { display: grid; grid-template-rows: 0fr; transition: grid-template-rows var(--dur) var(--ease); }
.faq-item.open .faq-a-wrap { grid-template-rows: 1fr; }
.faq-a { overflow: hidden; }
.faq-a p { margin: 0; padding: 0 1.4rem 1.3rem; color: var(--gray-600); font-size: .94rem; line-height: 1.65; }