/* Page layouts share the homepage's palette, controls, navigation and footer. */
.page-hero { padding-block: 54px; background: linear-gradient(160deg, #080616, #19103a 58%, #090719); }
.hero-grid, .feature-row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.06fr); align-items: center; gap: 64px; }
.hero-grid > *, .feature-row > * { min-width: 0; }
.page-hero h1 { color: var(--violet); font-size: 52px; line-height: 1.5; margin: 20px 0; }
.page-hero .lede { font-size: 18px; }
.page-hero .actions { margin-top: 24px; }
.page-hero .hero-media { margin: 0; }
.hero-media img { width: 100%; height: 320px; object-fit: cover; border-radius: 22px; }
.page-hero .portrait-media img { height: 500px; object-fit: contain; border-radius: 0; }
.page-section { padding-block: 54px; }
.page-section h2 { margin-bottom: 28px; }
.prose { color: var(--muted); font-size: 18px; }
.prose > * + * { margin-top: 28px; }
.reading-width { width: min(900px, calc(100% - 96px)); margin-inline: auto; }
.feature-section { padding-block: 38px; }
.feature-row h2 { font-size: 34px; margin: 0 0 22px; }
.feature-row .eyebrow { margin-bottom: 20px; }
.feature-row p:not(.eyebrow) { font-size: 18px; }
.feature-row figure { margin: 0; }
.feature-row img { width: 100%; height: 300px; object-fit: cover; border-radius: 20px; }
.feature-row.reverse .feature-media { order: 2; }
.feature-row.reverse .feature-copy { order: 1; }
.feature-row .portrait-media img { height: 540px; object-fit: contain; border-radius: 0; }
.status-panel, .gradient-panel { padding: 24px; border: 1px solid #aa8fff47; border-radius: 22px; background: var(--panel-gradient); }
.status-panel h2, .gradient-panel h2 { margin-bottom: 22px; }
.status-panel p + p { margin-top: 18px; }
.status-panel p, .gradient-panel p { font-size: 18px; }
.status-panel .text-link { display: inline-block; margin-top: 22px; }
.trust-strip { padding-block: 24px; background: #0d0a20; }
.trust-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.trust-grid p { color: var(--cyan); font-size: 15px; font-weight: 600; }
.privacy-section { background: linear-gradient(135deg, #171038, #0c091f); }
.privacy-section .eyebrow, .faq-section .eyebrow { margin-bottom: 22px; }
.assurance-list { display: grid; gap: 20px; padding: 0; margin: 30px 0; list-style: none; }
.assurance-list li, .faq-list details, .component-card { padding: 24px; border: 1px solid var(--line); border-radius: 18px; background: var(--surface); }
.assurance-list strong { font-weight: 600; color: var(--text); }
.faq-list { display: grid; gap: 22px; }
.faq-list summary { display: flex; justify-content: space-between; align-items: start; gap: 18px; font-size: 21px; font-weight: 700; line-height: 1.4; color: var(--text); list-style: none; }
.faq-list summary::-webkit-details-marker { display: none; }
.faq-list summary::after { content: "+"; flex: 0 0 auto; color: var(--cyan); }
.faq-list details[open] summary::after { content: "−"; }
.faq-list p { margin-top: 20px; font-size: 18px; }
.support-contact { padding: 24px; border: 1px solid var(--line); border-radius: 20px; background: #15102b; }
.support-contact h2 { font-size: 24px; margin-bottom: 20px; }
.support-contact p + p { margin-top: 16px; }
.policy-intro { padding-block: 42px; }
.policy-intro p + p { margin-top: 24px; }
.policy-toc { display: flex; flex-wrap: wrap; gap: 14px 24px; margin-top: 24px; }
.policy-toc a { text-transform: uppercase; font-size: 11px; }
.policy-section { padding-block: 32px; border-top: 1px solid var(--line); }
.policy-section .section-number { display: block; color: var(--violet); font-size: 12px; font-weight: 700; margin-bottom: 24px; }
.policy-section h2 { margin-bottom: 28px; }
.policy-section p { font-size: 18px; line-height: 1.5; }
.policy-section p + p { margin-top: 28px; }
.legal-content h2 { margin-top: 36px; margin-bottom: 28px; }
.legal-content h2:first-child { margin-top: 0; }
.legal-content p, .legal-content address { font-size: 18px; }
.legal-content .contact-lines { color: var(--cyan); }
.legal-intro .back-link { display: inline-block; margin-top: 22px; font-size: 14px; }
.component-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; gap: 24px; }
.component-card { min-width: 0; }
.component-card > * + * { margin-top: 20px; }
.component-card h2 { color: var(--violet); font-size: 26px; }
.component-card h3 { font-size: 26px; }
.component-card h4 { font-size: 20px; }
.component-card p, .component-card li { font-size: 18px; }
.component-card ul { padding-left: 22px; }
.component-card img { width: 100%; max-height: 200px; object-fit: cover; border-radius: 14px; }
.component-card hr { border: 0; border-top: 1px solid var(--line); }
.component-card pre { overflow: auto; color: var(--muted); font-size: 13px; white-space: pre-wrap; overflow-wrap: anywhere; }
.component-card blockquote { margin-inline: 0; padding-left: 20px; border-left: 3px solid var(--violet); color: var(--muted); }
.table-wrap { overflow-x: auto; }
.component-card table { border-collapse: collapse; width: 100%; font-size: 14px; }
.component-card th, .component-card td { text-align: left; padding: 10px 8px; border-bottom: 1px solid var(--line); color: var(--muted); }
.component-card th { color: var(--cyan); }
.button-examples { display: flex; flex-wrap: wrap; gap: 12px; }
.demo-form { display: grid; gap: 20px; }
.demo-form input:not([type="radio"]):not([type="checkbox"]), .demo-form select, .demo-form textarea { width: 100%; min-height: 48px; border: 1px solid #5a4776; border-radius: 10px; background: #0d0a20; color: var(--text); padding: 12px 16px; }
.demo-form textarea { min-height: 120px; resize: vertical; }
.demo-form .choice { display: flex; gap: 12px; align-items: center; min-height: 44px; color: var(--muted); }
.demo-form input[type="radio"], .demo-form input[type="checkbox"] { accent-color: var(--cyan); }
@media (max-width: 900px) {
    .hero-grid, .feature-row { gap: 36px; }
    .page-hero h1 { font-size: 44px; }
}
@media (max-width: 700px) {
    .page-hero, .page-section { padding-block: 38px; }
    .hero-grid, .feature-row { grid-template-columns: minmax(0, 1fr); gap: 24px; }
    .page-hero h1 { font-size: 36px; margin: 20px 0; }
    .page-hero .eyebrow { font-size: 10px; }
    .page-hero .lede, .prose, .feature-row p:not(.eyebrow), .status-panel p, .gradient-panel p { font-size: 16px; }
    .hero-media img { height: 210px; }
    .page-hero .portrait-media img { height: 430px; }
    .reading-width { width: calc(100% - 48px); }
    .feature-section { padding-block: 30px; }
    .feature-row h2 { font-size: 28px; }
    .feature-row .feature-copy, .feature-row.reverse .feature-copy { order: 1; }
    .feature-row .feature-media, .feature-row.reverse .feature-media { order: 2; }
    .feature-row img { height: 220px; }
    .feature-row .portrait-media img { height: 430px; }
    .trust-grid { grid-template-columns: minmax(0, 1fr); }
    .faq-list summary { font-size: 19px; }
    .faq-list p, .policy-section p, .legal-content p, .legal-content address { font-size: 16px; }
    .policy-section { padding-block: 28px; }
    .component-grid { grid-template-columns: minmax(0, 1fr); }
    .component-card p, .component-card li { font-size: 16px; }
    .component-card table { font-size: 12px; }
}