/*
 * Amanah Theme — page-content.css
 * ══════════════════════════════════════════════════════════════
 * All bespoke content page styles.
 * Covers: About, Vault, Authenticity, FAQ, Charity, Shipping,
 *         Contact, Refunds, and shared page utilities.
 *
 * Loaded via functions.php on all am-page-* templates.
 * Append future page styles to the bottom of this file.
 *
 * @package Amanah
 * @version 1.1.0
 * ══════════════════════════════════════════════════════════════
 */


/* ══════════════════════════════════════════════════════════════
   ISOLATION FIX
   Prevent slide-out cart panel from bleeding over page content.
   The cart JS adds .open on the overlay, which can sometimes
   remain on page transitions. This ensures z-index is correct
   and the page content is never obscured.
══════════════════════════════════════════════════════════════ */

.am-about,
.am-page {
    position: relative;
    z-index: 1;
}

/* Cart overlay must sit ABOVE page content but not leak */
.am-cart-overlay {
    z-index: 500 !important;
}

.am-cart-panel {
    z-index: 501 !important;
}

/* If cart is NOT open, ensure it's truly hidden */
.am-cart-overlay:not(.open) {
    pointer-events: none !important;
    opacity: 0 !important;
}

.am-cart-panel:not(.open) {
    transform: translateX(100%) !important;
}


/* ══════════════════════════════════════════════════════════════
   SHARED PAGE SECTION UTILITIES
   Used across all content pages
══════════════════════════════════════════════════════════════ */

.am-section {
    padding: var(--am-space-3xl) 0;
}

.am-section--cream {
    background: var(--am-cream);
}

.am-section--dark {
    background: var(--am-black);
    color: var(--am-white);
}

.am-section--dark p {
    color: var(--am-light-grey);
}

.am-gold-label {
    color: var(--am-gold);
    display: block;
    margin-bottom: 12px;
}

/* Shared heading style for all content pages */
.am-about-h2 {
    font-family: var(--am-font-display);
    font-size: clamp(26px, 4vw, 44px);
    font-weight: 400;
    line-height: 1.15;
    letter-spacing: -0.01em;
    color: inherit;
    margin: 0 0 24px;
}

/* Arrow text link used throughout */
.am-text-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--am-gold);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    text-decoration: none;
    transition: gap var(--am-duration) var(--am-ease),
                color var(--am-duration) var(--am-ease);
    margin-top: 8px;
}

.am-text-link:hover {
    gap: 10px;
    color: var(--am-gold-light);
}

/* Ghost/outline button for dark backgrounds */
.am-btn-ghost {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    text-decoration: none;
    padding: 14px 32px;
    border-radius: var(--am-radius);
    transition: all var(--am-duration) var(--am-ease);
    cursor: pointer;
    background: transparent;
    color: var(--am-white);
    border: 1px solid rgba(255, 255, 255, 0.3);
}

.am-btn-ghost:hover {
    border-color: var(--am-gold);
    color: var(--am-gold);
    background: transparent;
}


/* ══════════════════════════════════════════════════════════════
   ABOUT — HERO
   Full-bleed black with radial gold glow
══════════════════════════════════════════════════════════════ */

.am-about-hero {
    background: var(--am-black) !important; /* !important overrides any Savoy page.css defaults */
    min-height: 62vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: var(--am-space-4xl) var(--am-space-xl) var(--am-space-3xl);
    position: relative;
    overflow: hidden;
    z-index: 1;
}

/* Subtle radial gold glow */
.am-about-hero::before {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(ellipse 60% 50% at 50% 60%, rgba(201, 168, 76, 0.07) 0%, transparent 70%);
    pointer-events: none;
    z-index: 0;
}

.am-about-hero-inner {
    position: relative;
    z-index: 1;
    max-width: 860px;
    width: 100%;
}

.am-about-hero .am-label {
    margin-bottom: 20px;
}

.am-about-headline {
    font-family: var(--am-font-display);
    font-size: clamp(44px, 7vw, 88px);
    font-weight: 300;
    color: var(--am-white);
    line-height: 1.05;
    letter-spacing: -0.02em;
    margin: 0 0 24px;
}

.am-about-subhead {
    font-size: clamp(15px, 1.8vw, 18px);
    color: var(--am-light-grey);
    line-height: 1.8;
    max-width: 640px;
    margin: 0 auto 36px;
    font-weight: 300;
}

.am-about-hero-ctas {
    display: flex;
    gap: 16px;
    justify-content: center;
    flex-wrap: wrap;
}

/* Decorative geometric rule at bottom of hero */
.am-about-hero-rule {
    display: flex;
    align-items: center;
    gap: 12px;
    padding-top: var(--am-space-2xl);
    color: rgba(201, 168, 76, 0.3);
    position: relative;
    z-index: 1;
}

.am-about-hero-rule span {
    display: block;
    width: 60px;
    height: 1px;
    background: rgba(201, 168, 76, 0.2);
}


/* ══════════════════════════════════════════════════════════════
   ABOUT — QURANIC OPENING STATEMENT
══════════════════════════════════════════════════════════════ */

.am-about-statement {
    background: var(--am-off-white);
    padding: var(--am-space-3xl) 0;
    text-align: center;
}

.am-about-pullquote {
    max-width: 780px;
    margin: 0 auto;
    border: none;
    padding: 0;
}

.am-about-arabic {
    display: block;
    font-family: var(--am-font-arabic);
    font-size: clamp(20px, 3vw, 32px);
    color: var(--am-gold);
    line-height: 2;
    margin-bottom: 16px;
    letter-spacing: 0.02em;
    font-style:normal;
}

.am-about-pullquote cite {
    display: block;
    font-style: italic;
    font-family: var(--am-font-display);
    font-size: clamp(14px, 1.5vw, 17px);
    color: var(--am-grey);
    line-height: 1.8;
}

.am-about-pullquote cite em {
    color: var(--am-gold-deep);
    font-style: normal;
}


/* ══════════════════════════════════════════════════════════════
   ABOUT — EDITORIAL SPLIT LAYOUT
   Reused on all content pages (About, Vault, Authenticity, etc.)
══════════════════════════════════════════════════════════════ */

.am-about-split {
    display: grid;
    gap: 80px;
    align-items: center;
}

.am-about-split--ltr {
    grid-template-columns: 1fr 1fr;
}

/* RTL: image goes to the left column */
.am-about-split--rtl {
    grid-template-columns: 1fr 1fr;
}

.am-about-split--rtl .am-about-split-media {
    order: -1;
}

.am-about-split-text {
    max-width: 520px;
}

.am-about-split-text p {
    font-size: 15px;
    color: var(--am-grey);
    line-height: 1.9;
    margin-bottom: 18px;
}

.am-about-split-text p:last-of-type {
    margin-bottom: 0;
}

.am-about-split-text strong {
    color: var(--am-black);
    font-weight: 600;
}

/* Dark section override for split text */
.am-section--dark .am-about-split-text p {
    color: var(--am-light-grey);
}

.am-section--dark .am-about-split-text strong {
    color: var(--am-white);
}

/* Figure / image */
.am-about-fig {
    margin: 0;
    position: relative;
}

.am-about-fig img {
    width: 100%;
    height: auto;
    object-fit: cover;
    object-position: center top;
    display: block;
    border-radius: var(--am-radius);
    aspect-ratio: 4 / 5;
}

.am-about-fig figcaption {
    font-size: 10px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--am-gold);
    font-weight: 500;
    margin-top: 12px;
    padding-left: 2px;
}

/* Ghost border offset accent */
.am-about-fig::after {
    content: '';
    position: absolute;
    top: 12px;
    left: 12px;
    right: -12px;
    bottom: -12px;
    border: 1px solid rgba(201, 168, 76, 0.18);
    border-radius: var(--am-radius);
    pointer-events: none;
    z-index: -1;
}


/* ══════════════════════════════════════════════════════════════
   ABOUT — STAT BAR
══════════════════════════════════════════════════════════════ */

.am-about-stats {
    background: var(--am-near-black);
    padding: var(--am-space-2xl) 0;
    border-top: 1px solid rgba(201, 168, 76, 0.08);
    border-bottom: 1px solid rgba(201, 168, 76, 0.08);
}

.am-about-stats-grid {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0;
    flex-wrap: wrap;
}

.am-about-stat {
    text-align: center;
    padding: 20px 60px;
}

.am-about-stat-num {
    display: block;
    font-family: var(--am-font-display);
    font-size: clamp(36px, 5vw, 56px);
    font-weight: 300;
    color: var(--am-gold);
    line-height: 1;
    margin-bottom: 8px;
}

.am-about-stat-label {
    display: block;
    font-size: 10px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--am-light-grey);
    line-height: 1.7;
    font-weight: 500;
}

.am-about-stat-divider {
    width: 1px;
    height: 48px;
    background: rgba(201, 168, 76, 0.15);
    flex-shrink: 0;
}


/* ══════════════════════════════════════════════════════════════
   ABOUT — VALUES GRID
══════════════════════════════════════════════════════════════ */

.am-about-values-header {
    text-align: center;
    max-width: 640px;
    margin: 0 auto var(--am-space-2xl);
}

.am-about-values-intro {
    font-size: 15px;
    color: var(--am-grey);
    line-height: 1.8;
    margin: 0;
}

.am-about-values-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1px;
    background: rgba(201, 168, 76, 0.12);
    border: 1px solid rgba(201, 168, 76, 0.12);
    border-radius: var(--am-radius);
    overflow: hidden;
}

.am-about-value-card {
    background: var(--am-off-white);
    padding: 40px 32px;
    transition: background var(--am-duration) var(--am-ease);
}

.am-about-value-card:hover {
    background: var(--am-cream);
}

.am-about-value-num {
    font-family: var(--am-font-display);
    font-size: 36px;
    font-weight: 300;
    color: rgba(201, 168, 76, 0.22);
    line-height: 1;
    margin-bottom: 20px;
}

.am-about-value-title {
    font-family: var(--am-font-display);
    font-size: 18px;
    font-weight: 400;
    color: var(--am-black);
    margin: 0 0 14px;
    line-height: 1.4;
}

.am-about-value-title span[lang="ar"] {
    font-family: var(--am-font-arabic);
    font-size: 16px;
    color: var(--am-gold);
}

.am-about-value-card p {
    font-size: 13px;
    color: var(--am-grey);
    line-height: 1.9;
    margin: 0;
}


/* ══════════════════════════════════════════════════════════════
   ABOUT — CHARITY SECTION
══════════════════════════════════════════════════════════════ */

.am-about-hadith-quote {
    margin: 24px 0 28px !important;
}

.am-about-hadith-quote em {
    font-style: italic;
    color: var(--am-light-grey);
}

.am-about-hadith-quote small {
    font-size: 10px;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--am-gold);
    display: block;
    margin-top: 4px;
}

.am-about-fig--charity {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 360px;
}

/* Remove the ghost border on the charity badge figure */
.am-about-fig--charity::after {
    display: none;
}

.am-about-charity-badge {
    border: 1px solid rgba(201, 168, 76, 0.25);
    background: rgba(201, 168, 76, 0.04);
    border-radius: var(--am-radius-lg);
    padding: 56px 48px;
    text-align: center;
    width: 100%;
    max-width: 320px;
}

.am-about-charity-pct {
    display: block;
    font-family: var(--am-font-display);
    font-size: 96px;
    font-weight: 300;
    color: var(--am-gold);
    line-height: 1;
    margin-bottom: 16px;
}

.am-about-charity-text {
    display: block;
    font-size: 13px;
    color: var(--am-light-grey);
    letter-spacing: 0.04em;
    line-height: 1.9;
}


/* ══════════════════════════════════════════════════════════════
   ABOUT — TEAM
══════════════════════════════════════════════════════════════ */

.am-about-team-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 40px;
}

.am-about-team-card {
    display: flex;
    flex-direction: column;
}

.am-about-team-photo {
    margin-bottom: 20px;
    border-radius: var(--am-radius);
    overflow: hidden;
    aspect-ratio: 3 / 4;
    background: var(--am-dark);
}

.am-about-team-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center top;
    display: block;
    transition: transform 0.6s var(--am-ease);
}

.am-about-team-card:hover .am-about-team-photo img {
    transform: scale(1.03);
}

.am-about-team-photo--placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--am-dark);
}

.am-about-team-initials {
    font-family: var(--am-font-display);
    font-size: 48px;
    font-weight: 300;
    color: var(--am-gold);
    opacity: 0.35;
}

.am-about-team-name {
    font-family: var(--am-font-display);
    font-size: 20px;
    font-weight: 400;
    color: var(--am-black);
    margin: 0 0 4px;
}

.am-about-team-role {
    display: block;
    font-size: 10px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--am-gold);
    font-weight: 600;
    margin-bottom: 12px;
}

.am-about-team-bio {
    font-size: 13px;
    color: var(--am-grey);
    line-height: 1.85;
    margin: 0 0 16px;
    flex: 1;
}

.am-about-team-linkedin {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--am-gold);
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    text-decoration: none;
    transition: color var(--am-duration) var(--am-ease);
}

.am-about-team-linkedin:hover {
    color: var(--am-gold-light);
}


/* ══════════════════════════════════════════════════════════════
   ABOUT — CERTIFICATIONS STRIP
══════════════════════════════════════════════════════════════ */

.am-about-certs {
    background: var(--am-cream);
    padding: var(--am-space-2xl) 0;
    border-top: 1px solid rgba(201, 168, 76, 0.1);
    border-bottom: 1px solid rgba(201, 168, 76, 0.1);
}

.am-about-certs-grid {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 60px;
    flex-wrap: wrap;
    margin-bottom: 32px;
}

.am-about-cert-item {
    text-align: center;
}

.am-about-cert-name {
    display: block;
    font-family: var(--am-font-display);
    font-size: 26px;
    font-weight: 400;
    color: var(--am-gold);
    letter-spacing: 0.06em;
    margin-bottom: 4px;
}

.am-about-cert-desc {
    display: block;
    font-size: 10px;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--am-grey);
    font-weight: 500;
}

.am-about-certs-cta {
    text-align: center;
}


/* ══════════════════════════════════════════════════════════════
   ABOUT — CLOSING CTA
══════════════════════════════════════════════════════════════ */

.am-about-cta {
    padding: var(--am-space-4xl) 0;
}

.am-about-cta-heading {
    font-family: var(--am-font-display);
    font-size: clamp(26px, 4.5vw, 52px);
    font-weight: 300;
    color: var(--am-white);
    line-height: 1.2;
    margin: 0 0 20px;
}

.am-about-cta-sub {
    font-size: 16px;
    color: var(--am-grey);
    line-height: 1.8;
    max-width: 560px;
    margin: 0 auto 36px;
}


/* ══════════════════════════════════════════════════════════════
   ABOUT — PAGE NAV (Net-a-Porter internal link grid)
══════════════════════════════════════════════════════════════ */

.am-about-pagenav {
    background: var(--am-off-white);
    padding: var(--am-space-3xl) 0;
    border-top: 1px solid rgba(201, 168, 76, 0.1);
}

.am-about-pagenav-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1px;
    background: rgba(201, 168, 76, 0.1);
    border: 1px solid rgba(201, 168, 76, 0.1);
    border-radius: var(--am-radius);
    overflow: hidden;
}

.am-about-pagenav-item {
    display: flex;
    flex-direction: column;
    padding: 32px 28px;
    background: var(--am-off-white);
    text-decoration: none;
    border-bottom: 2px solid transparent;
    transition: all var(--am-duration) var(--am-ease);
}

.am-about-pagenav-item:hover {
    background: var(--am-white);
    border-bottom-color: var(--am-gold);
}

.am-about-pagenav-title {
    font-size: 13px;
    font-weight: 600;
    color: var(--am-black);
    letter-spacing: 0.04em;
    margin-bottom: 6px;
    transition: color var(--am-duration) var(--am-ease);
}

.am-about-pagenav-item:hover .am-about-pagenav-title {
    color: var(--am-gold);
}

.am-about-pagenav-desc {
    font-size: 12px;
    color: var(--am-grey);
    line-height: 1.6;
}


/* ══════════════════════════════════════════════════════════════
   RESPONSIVE — About page
══════════════════════════════════════════════════════════════ */

/* Large tablet */
@media (max-width: 1100px) {
    .am-about-stat {
        padding: 20px 40px;
    }
}

/* Tablet */
@media (max-width: 1024px) {
    .am-about-values-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .am-about-team-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .am-about-pagenav-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .am-about-certs-grid {
        gap: 40px;
    }
}

/* Portrait tablet / large phone */
@media (max-width: 850px) {

    .am-about-split--ltr,
    .am-about-split--rtl {
        grid-template-columns: 1fr;
        gap: 40px;
    }

    .am-about-split--rtl .am-about-split-media {
        order: 0; /* image below text on mobile */
    }

    .am-about-split-text {
        max-width: 100%;
    }

    .am-about-stats-grid {
        flex-direction: column;
        gap: 0;
    }

    .am-about-stat-divider {
        width: 48px;
        height: 1px;
        margin: 4px auto;
    }

    .am-about-stat {
        padding: 20px 20px;
    }

    /* On mobile, image renders after text — remove ghost offset */
    .am-about-fig::after {
        display: none;
    }
}

/* Phone */
@media (max-width: 640px) {

    .am-about-hero {
        padding: var(--am-space-3xl) 20px var(--am-space-2xl);
        min-height: auto;
    }

    .am-about-hero-ctas {
        flex-direction: column;
        align-items: center;
    }

    .am-about-hero-ctas .am-btn,
    .am-about-hero-ctas .am-btn-ghost {
        width: 100%;
        max-width: 320px;
        justify-content: center;
    }

    .am-about-values-grid {
        grid-template-columns: 1fr;
    }

    .am-about-value-card {
        padding: 28px 24px;
    }

    .am-about-team-grid {
        grid-template-columns: 1fr;
    }

    .am-about-pagenav-grid {
        grid-template-columns: 1fr;
    }

    .am-about-certs-grid {
        gap: 28px;
    }

    .am-about-charity-badge {
        padding: 40px 32px;
    }

    .am-about-charity-pct {
        font-size: 72px;
    }

    .am-about-pagenav-item {
        padding: 24px 20px;
    }
}


/* ══════════════════════════════════════════════════════════════
   RTL SUPPORT (Arabic / WPML)
   When WPML switches to Arabic, the html element gets dir="rtl"
   and lang="ar". These overrides handle layout mirroring.
══════════════════════════════════════════════════════════════ */

[dir="rtl"] .am-about-split--ltr {
    direction: rtl;
}

[dir="rtl"] .am-about-split--rtl .am-about-split-media {
    order: 0;
}

[dir="rtl"] .am-about-split--ltr .am-about-split-media {
    order: -1;
}

[dir="rtl"] .am-about-hero-ctas {
    direction: rtl;
}

[dir="rtl"] .am-about-fig::after {
    left: -12px;
    right: 12px;
}

[dir="rtl"] .am-text-link svg {
    transform: scaleX(-1);
}

[dir="rtl"] .am-about-pagenav-item {
    text-align: right;
}

[dir="rtl"] .am-about-certs-grid {
    direction: rtl;
}

[dir="rtl"] .am-about-value-card {
    text-align: right;
}

[dir="rtl"] .am-about-stats-grid {
    direction: rtl;
}

[dir="rtl"] .am-about-team-info {
    text-align: right;
}

[dir="rtl"] .am-about-team-linkedin {
    flex-direction: row-reverse;
}

/* Arabic body font override when in RTL mode */
[dir="rtl"] body,
[dir="rtl"] p,
[dir="rtl"] .am-about-split-text p,
[dir="rtl"] .am-about-value-card p,
[dir="rtl"] .am-about-team-bio,
[dir="rtl"] .am-about-values-intro {
    font-family: var(--am-font-arabic);
    font-size: 15px;
    line-height: 2;
}

[dir="rtl"] h1,
[dir="rtl"] h2,
[dir="rtl"] h3,
[dir="rtl"] .am-about-h2,
[dir="rtl"] .am-about-headline,
[dir="rtl"] .am-about-cta-heading {
    font-family: var(--am-font-arabic);
    letter-spacing: 0;
}

[dir="rtl"] .am-label,
[dir="rtl"] .am-gold-label,
[dir="rtl"] .am-about-team-role,
[dir="rtl"] .am-about-cert-desc,
[dir="rtl"] .am-about-stat-label {
    letter-spacing: 0;
    font-family: var(--am-font-arabic);
}


/* ══════════════════════════════════════════════════════════════ */
/*   FUTURE PAGES — append styles below this line */
/*   ══════════════════════════════════════════════════════════════ */
/*   page-vault.php        → VAULT */
/*   page-authenticity.php → AUTHENTICITY */
/*   page-faq.php          → FAQ */
/*   page-charity.php      → CHARITY */
/*   page-shipping.php     → SHIPPING */
/*   page-contact.php      → CONTACT */
/*   page-refunds.php      → REFUNDS */
/*══════════════════════════════════════════════════════════════ */


/* ══════════════════════════════════════════════════════════════
   VAULT — page-vault.php
   Append this entire block to the bottom of page-content.css
   ══════════════════════════════════════════════════════════════ */


/* ── VAULT HERO ── */

.am-vault-hero {
    background: var(--am-black) !important;
    min-height: 68vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: var(--am-space-4xl) var(--am-space-xl) var(--am-space-3xl);
    position: relative;
    overflow: hidden;
    z-index: 1;
}

/* Layered gold radial — deeper than about hero */
.am-vault-hero::before {
    content: '';
    position: absolute;
    inset: 0;
    background:
        radial-gradient(ellipse 80% 60% at 50% 80%, rgba(201, 168, 76, 0.08) 0%, transparent 65%),
        radial-gradient(ellipse 40% 30% at 30% 20%, rgba(201, 168, 76, 0.04) 0%, transparent 60%);
    pointer-events: none;
    z-index: 0;
}

.am-vault-hero-inner {
    position: relative;
    z-index: 1;
    max-width: 900px;
    width: 100%;
}

.am-vault-headline {
    font-family: var(--am-font-display);
    font-size: clamp(52px, 8.5vw, 104px);
    font-weight: 300;
    color: var(--am-white);
    line-height: 1;
    letter-spacing: -0.03em;
    margin: 0 0 28px;
}

/* "Dubai." rendered in gold */
.am-vault-headline-city {
    color: var(--am-gold);
    background: var(--am-gold-shimmer);
    background-size: 200% auto;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    animation: shimmer 6s linear infinite;
    display: block;
}

.am-vault-subhead {
    font-size: clamp(14px, 1.8vw, 17px);
    color: var(--am-light-grey);
    line-height: 1.85;
    max-width: 620px;
    margin: 0 auto 36px;
    font-weight: 300;
}

.am-vault-hero-ctas {
    display: flex;
    gap: 16px;
    justify-content: center;
    flex-wrap: wrap;
    margin-bottom: 36px;
}

/* Credential badge strip */
.am-vault-hero-badges {
    display: flex;
    gap: 24px;
    justify-content: center;
    flex-wrap: wrap;
}

.am-vault-hero-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 10px;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    font-weight: 600;
    color: rgba(201, 168, 76, 0.7);
    padding: 6px 14px;
    border: 1px solid rgba(201, 168, 76, 0.15);
    border-radius: var(--am-radius-pill);
}

.am-vault-hero-badge svg {
    color: var(--am-gold);
    flex-shrink: 0;
}


/* ── WHY BAR ── */

.am-vault-why-bar {
    background: var(--am-near-black);
    padding: var(--am-space-xl) 0;
    border-top: 1px solid rgba(201, 168, 76, 0.08);
    border-bottom: 1px solid rgba(201, 168, 76, 0.08);
}

.am-vault-why-grid {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 1px;
    background: rgba(201, 168, 76, 0.06);
}

.am-vault-why-item {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    padding: 28px 24px;
    background: var(--am-near-black);
    transition: background var(--am-duration) var(--am-ease);
}

.am-vault-why-item:hover {
    background: rgba(201, 168, 76, 0.04);
}

.am-vault-why-icon {
    color: var(--am-gold);
    flex-shrink: 0;
    margin-top: 2px;
}

.am-vault-why-item strong {
    display: block;
    font-size: 11px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--am-white);
    font-weight: 600;
    margin-bottom: 6px;
}

.am-vault-why-item span {
    display: block;
    font-size: 12px;
    color: var(--am-grey);
    line-height: 1.7;
}


/* ── HOW IT WORKS — 3 steps ── */

.am-vault-steps {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1px;
    background: rgba(201, 168, 76, 0.1);
    border: 1px solid rgba(201, 168, 76, 0.1);
    border-radius: var(--am-radius);
    overflow: hidden;
}

.am-vault-step {
    background: var(--am-cream);
    padding: 48px 36px 48px 40px;
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 0;
    transition: background var(--am-duration) var(--am-ease);
}

.am-vault-step:hover {
    background: var(--am-white);
}

.am-vault-step-num {
    font-family: var(--am-font-display);
    font-size: 56px;
    font-weight: 300;
    color: rgba(201, 168, 76, 0.18);
    line-height: 1;
    margin-bottom: 20px;
}

.am-vault-step-content {
    flex: 1;
}

.am-vault-step-title {
    font-family: var(--am-font-display);
    font-size: 22px;
    font-weight: 400;
    color: var(--am-black);
    margin: 0 0 12px;
    letter-spacing: 0.01em;
}

.am-vault-step-content p {
    font-size: 14px;
    color: var(--am-grey);
    line-height: 1.85;
    margin: 0;
}

/* Arrow between steps — shown top-right of each card */
.am-vault-step-arrow {
    position: absolute;
    top: 50%;
    right: -13px;
    transform: translateY(-50%);
    color: rgba(201, 168, 76, 0.3);
    z-index: 2;
    background: var(--am-cream);
    border-radius: 50%;
    width: 26px;
    height: 26px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(201, 168, 76, 0.15);
}

.am-vault-step-arrow--hidden {
    display: none;
}


/* ── BENEFITS GRID — 6 cards, 3×2 ── */

.am-vault-benefits-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1px;
    background: rgba(201, 168, 76, 0.1);
    border: 1px solid rgba(201, 168, 76, 0.1);
    border-radius: var(--am-radius);
    overflow: hidden;
}

.am-vault-benefit-card {
    background: var(--am-off-white);
    padding: 36px 32px;
    transition: background var(--am-duration) var(--am-ease);
}

.am-vault-benefit-card:hover {
    background: var(--am-white);
}

.am-vault-benefit-icon {
    color: var(--am-gold);
    margin-bottom: 16px;
    display: block;
}

.am-vault-benefit-card h3 {
    font-family: var(--am-font-display);
    font-size: 18px;
    font-weight: 400;
    color: var(--am-black);
    margin: 0 0 10px;
}

.am-vault-benefit-card p {
    font-size: 13px;
    color: var(--am-grey);
    line-height: 1.85;
    margin: 0;
}


/* ── PRICING PLANS ── */

.am-vault-plans-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    margin-bottom: 32px;
}

.am-vault-plan-card {
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(201, 168, 76, 0.15);
    border-radius: var(--am-radius-lg);
    padding: 40px 32px;
    display: flex;
    flex-direction: column;
    gap: 0;
    position: relative;
    transition: border-color var(--am-duration) var(--am-ease),
                background var(--am-duration) var(--am-ease);
}

.am-vault-plan-card:hover {
    border-color: rgba(201, 168, 76, 0.35);
    background: rgba(255, 255, 255, 0.06);
}

/* Featured plan */
.am-vault-plan-card--featured {
    background: rgba(201, 168, 76, 0.07);
    border-color: rgba(201, 168, 76, 0.4);
    border-width: 2px;
}

.am-vault-plan-card--featured:hover {
    background: rgba(201, 168, 76, 0.1);
}

/* "Most Popular" badge */
.am-vault-plan-badge {
    position: absolute;
    top: -13px;
    left: 50%;
    transform: translateX(-50%);
    background: var(--am-gold);
    color: var(--am-black);
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    padding: 4px 16px;
    border-radius: var(--am-radius-pill);
    white-space: nowrap;
}

.am-vault-plan-name {
    font-size: 10px;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--am-gold);
    font-weight: 600;
    margin-bottom: 16px;
}

.am-vault-plan-price {
    margin-bottom: 28px;
}

.am-vault-plan-price-val {
    display: block;
    font-family: var(--am-font-display);
    font-size: 40px;
    font-weight: 300;
    color: var(--am-white);
    line-height: 1;
    margin-bottom: 4px;
}

.am-vault-plan-price-val small {
    font-size: 16px;
    font-family: var(--am-font-body);
    color: var(--am-grey);
    font-weight: 400;
}

.am-vault-plan-price-per {
    display: block;
    font-size: 11px;
    color: var(--am-grey);
    letter-spacing: 0.04em;
}

.am-vault-plan-features {
    list-style: none;
    padding: 0;
    margin: 0 0 32px;
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.am-vault-plan-features li {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font-size: 13px;
    color: var(--am-light-grey);
    line-height: 1.6;
}

.am-vault-plan-features li::before {
    content: '✓';
    color: var(--am-gold);
    font-size: 11px;
    font-weight: 700;
    flex-shrink: 0;
    margin-top: 2px;
}

/* Outline button for non-featured plans in dark context */
.am-vault-plan-btn-outline {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    text-decoration: none;
    padding: 14px 32px;
    border-radius: var(--am-radius);
    transition: all var(--am-duration) var(--am-ease);
    cursor: pointer;
    background: transparent;
    color: var(--am-white);
    border: 1px solid rgba(255, 255, 255, 0.2);
}

.am-vault-plan-btn-outline:hover {
    border-color: var(--am-gold);
    color: var(--am-gold);
}

.am-vault-plans-footnote {
    text-align: center;
    font-size: 12px;
    color: var(--am-grey);
    margin: 0;
    letter-spacing: 0.02em;
}


/* ── COMPLIANCE BADGES ── */

.am-vault-compliance-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 24px 0 28px;
}

.am-vault-compliance-item {
    font-size: 10px;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    font-weight: 600;
    color: var(--am-gold);
    padding: 5px 14px;
    border: 1px solid rgba(201, 168, 76, 0.25);
    border-radius: var(--am-radius-pill);
}


/* ── FAQ ACCORDION ── */

.am-vault-faq-inner {
    max-width: 760px;
    margin: 0 auto;
}

.am-vault-faq-header {
    margin-bottom: 40px;
}

.am-vault-faq-list {
    display: flex;
    flex-direction: column;
    gap: 0;
    border: 1px solid rgba(201, 168, 76, 0.1);
    border-radius: var(--am-radius);
    overflow: hidden;
}

.am-vault-faq-item {
    border-bottom: 1px solid rgba(201, 168, 76, 0.08);
}

.am-vault-faq-item:last-child {
    border-bottom: none;
}

.am-vault-faq-q {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 22px 28px;
    cursor: pointer;
    font-size: 14px;
    font-weight: 600;
    color: var(--am-black);
    list-style: none;
    background: var(--am-off-white);
    transition: background var(--am-duration) var(--am-ease),
                color var(--am-duration) var(--am-ease);
    user-select: none;
}

/* Remove default marker */
.am-vault-faq-q::-webkit-details-marker { display: none; }
.am-vault-faq-q::marker { display: none; }

.am-vault-faq-q:hover {
    background: var(--am-cream);
    color: var(--am-gold);
}

details[open] .am-vault-faq-q {
    color: var(--am-gold);
    background: var(--am-cream);
}

.am-vault-faq-icon {
    flex-shrink: 0;
    color: var(--am-gold);
    transition: transform var(--am-duration) var(--am-ease);
}

details[open] .am-vault-faq-icon {
    transform: rotate(180deg);
}

.am-vault-faq-a {
    padding: 0 28px 24px;
    background: var(--am-off-white);
}

.am-vault-faq-a p {
    font-size: 14px;
    color: var(--am-grey);
    line-height: 1.85;
    margin: 0;
    padding-top: 4px;
}

.am-vault-faq-cta {
    margin-top: 32px;
    text-align: center;
}


/* ══════════════════════════════════════════════════════════════
   VAULT RESPONSIVE
══════════════════════════════════════════════════════════════ */

/* Large tablet */
@media (max-width: 1100px) {
    .am-vault-why-grid {
        grid-template-columns: repeat(3, 1fr);
    }
}

/* Tablet */
@media (max-width: 1024px) {

    .am-vault-plans-grid {
        grid-template-columns: 1fr 1fr;
        gap: 20px;
    }

    .am-vault-benefits-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .am-vault-why-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .am-vault-steps {
        grid-template-columns: 1fr;
    }

    .am-vault-step-arrow {
        display: none;
    }
}

/* Portrait tablet */
@media (max-width: 850px) {

    .am-vault-hero {
        min-height: auto;
        padding: var(--am-space-3xl) 20px var(--am-space-2xl);
    }

    .am-vault-headline {
        font-size: clamp(44px, 10vw, 72px);
    }

    .am-vault-hero-badges {
        gap: 12px;
    }
}

/* Phone */
@media (max-width: 640px) {

    .am-vault-headline {
        font-size: clamp(36px, 12vw, 56px);
        letter-spacing: -0.02em;
    }

    .am-vault-hero-ctas {
        flex-direction: column;
        align-items: center;
    }

    .am-vault-hero-ctas .am-btn,
    .am-vault-hero-ctas .am-btn-ghost {
        width: 100%;
        max-width: 320px;
        justify-content: center;
    }

    .am-vault-hero-badges {
        flex-direction: column;
        align-items: center;
    }

    .am-vault-why-grid {
        grid-template-columns: 1fr;
    }

    .am-vault-plans-grid {
        grid-template-columns: 1fr;
    }

    .am-vault-plan-card {
        padding: 32px 24px;
    }

    .am-vault-benefits-grid {
        grid-template-columns: 1fr;
    }

    .am-vault-benefit-card {
        padding: 28px 24px;
    }

    .am-vault-faq-q {
        padding: 18px 20px;
        font-size: 13px;
    }

    .am-vault-faq-a {
        padding: 0 20px 20px;
    }

    .am-vault-compliance-badges {
        gap: 6px;
    }
}


/* ── RTL support (WPML Arabic) ── */

[dir="rtl"] .am-vault-why-item {
    flex-direction: row-reverse;
    text-align: right;
}

[dir="rtl"] .am-vault-faq-q {
    flex-direction: row-reverse;
    text-align: right;
}

[dir="rtl"] .am-vault-plan-features li {
    flex-direction: row-reverse;
    text-align: right;
}

[dir="rtl"] .am-vault-compliance-badges {
    direction: rtl;
}

[dir="rtl"] .am-vault-hero-badges {
    direction: rtl;
}

[dir="rtl"] .am-vault-step {
    text-align: right;
}

















/* ══════════════════════════════════════════════════════════════
   AUTHENTICITY — page-authenticity.php
   Append this entire block to the bottom of page-content.css
   ══════════════════════════════════════════════════════════════ */


/* ── AUTHENTICITY HERO ── */

.am-auth-hero {
    background: var(--am-black) !important;
    min-height: 70vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: var(--am-space-4xl) var(--am-space-xl) var(--am-space-3xl);
    position: relative;
    overflow: hidden;
    z-index: 1;
}

/* Radial glow — asymmetric, slightly offset */
.am-auth-hero::before {
    content: '';
    position: absolute;
    inset: 0;
    background:
        radial-gradient(ellipse 70% 55% at 50% 70%, rgba(201, 168, 76, 0.07) 0%, transparent 65%),
        radial-gradient(ellipse 30% 25% at 80% 15%, rgba(201, 168, 76, 0.03) 0%, transparent 60%);
    pointer-events: none;
    z-index: 0;
}

.am-auth-hero-inner {
    position: relative;
    z-index: 1;
    max-width: 860px;
    width: 100%;
}

.am-auth-headline {
    font-family: var(--am-font-display);
    font-size: clamp(44px, 7vw, 88px);
    font-weight: 300;
    color: var(--am-white);
    line-height: 1.0;
    letter-spacing: -0.025em;
    margin: 16px 0 28px;
}

/* "No Exceptions." — emphasis line in gold */
.am-auth-headline-accent {
    display: block;
    background: var(--am-gold-shimmer);
    background-size: 200% auto;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    animation: shimmer 6s linear infinite;
}

.am-auth-subhead {
    font-size: clamp(14px, 1.7vw, 17px);
    color: var(--am-light-grey);
    line-height: 1.85;
    max-width: 640px;
    margin: 0 auto 40px;
    font-weight: 300;
}

/* Certification strip in hero */
.am-auth-hero-certs {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0;
    flex-wrap: wrap;
    border: 1px solid rgba(201, 168, 76, 0.15);
    border-radius: var(--am-radius);
    overflow: hidden;
    max-width: 720px;
    margin: 0 auto;
}

.am-auth-hero-cert {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 18px 28px;
    flex: 1;
    min-width: 120px;
}

.am-auth-hero-cert-abbr {
    font-family: var(--am-font-display);
    font-size: 20px;
    font-weight: 400;
    color: var(--am-gold);
    letter-spacing: 0.05em;
    margin-bottom: 4px;
    line-height: 1;
}

.am-auth-hero-cert-name {
    font-size: 9px;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.4);
    font-weight: 500;
    text-align: center;
}

.am-auth-hero-cert-sep {
    width: 1px;
    height: 36px;
    background: rgba(201, 168, 76, 0.12);
    flex-shrink: 0;
}


/* ── OPENING STATEMENT — 2-col layout ── */

.am-auth-statement {
    background: var(--am-off-white);
    padding: var(--am-space-3xl) 0;
}

.am-auth-statement-inner {
    display: grid;
    grid-template-columns: 1fr 340px;
    gap: 80px;
    align-items: center;
}

.am-auth-statement-text .am-about-h2 {
    margin-bottom: 20px;
}

.am-auth-statement-text p {
    font-size: 15px;
    color: var(--am-grey);
    line-height: 1.9;
    margin-bottom: 18px;
}

.am-auth-statement-text p:last-child {
    margin-bottom: 0;
}

/* 999.9 purity badge */
.am-auth-purity-badge {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    border: 1px solid rgba(201, 168, 76, 0.2);
    border-radius: var(--am-radius-lg);
    padding: 48px 32px;
    background: var(--am-white);
}

.am-auth-purity-val {
    font-family: var(--am-font-display);
    font-size: 64px;
    font-weight: 300;
    color: var(--am-gold);
    line-height: 1;
    letter-spacing: -0.02em;
}

.am-auth-purity-label {
    font-size: 11px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--am-black);
    font-weight: 600;
    margin-top: 8px;
}

.am-auth-purity-divider {
    width: 40px;
    height: 1px;
    background: rgba(201, 168, 76, 0.3);
    margin: 16px auto;
}

.am-auth-purity-sub {
    font-size: 11px;
    color: var(--am-grey);
    letter-spacing: 0.04em;
    line-height: 1.6;
}


/* ── CERT SECTION SHARED — numbered editorial sections ── */

.am-auth-cert {
    scroll-margin-top: 80px; /* offset for sticky nav */
}

/* Large ghost number behind each cert heading */
.am-auth-cert-number {
    font-family: var(--am-font-display);
    font-size: 72px;
    font-weight: 300;
    color: rgba(201, 168, 76, 0.12);
    line-height: 1;
    margin-bottom: 8px;
    letter-spacing: -0.02em;
}

.am-auth-cert-number--light {
    color: rgba(255, 255, 255, 0.08);
}

/* "What this certifies" block */
.am-auth-cert-what {
    margin-top: 28px;
    padding: 20px 24px;
    background: rgba(201, 168, 76, 0.04);
    border-left: 2px solid var(--am-gold);
    border-radius: 0 var(--am-radius) var(--am-radius) 0;
}

.am-auth-cert-what--dark {
    background: rgba(201, 168, 76, 0.06);
}

.am-auth-cert-what-title {
    display: block;
    font-size: 9px;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--am-gold);
    font-weight: 700;
    margin-bottom: 12px;
}

.am-auth-cert-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.am-auth-cert-list li {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font-size: 13px;
    color: var(--am-grey);
    line-height: 1.6;
}

.am-auth-cert-list--dark li {
    color: var(--am-light-grey);
}

.am-auth-cert-list li::before {
    content: '✓';
    color: var(--am-gold);
    font-size: 11px;
    font-weight: 700;
    flex-shrink: 0;
    margin-top: 1px;
}

/* External cert link */
.am-auth-cert-link {
    color: var(--am-gold);
    text-decoration: none;
    font-size: 12px;
    letter-spacing: 0.02em;
    transition: color var(--am-duration) var(--am-ease);
}

.am-auth-cert-link:hover {
    color: var(--am-gold-light);
    text-decoration: underline;
}


/* ── CERT CARD — replaces image in split sections ── */

.am-auth-cert-card {
    border: 1px solid rgba(201, 168, 76, 0.2);
    border-radius: var(--am-radius-lg);
    overflow: hidden;
    background: var(--am-white);
    /* Matches the visual weight of an image in the split */
    height: 100%;
    display: flex;
    flex-direction: column;
}

.am-auth-cert-card--dark {
    background: rgba(255, 255, 255, 0.04);
    border-color: rgba(201, 168, 76, 0.2);
}

/* Large abbreviation header */
.am-auth-cert-card-abbr {
    background: var(--am-black);
    color: var(--am-gold);
    font-family: var(--am-font-display);
    font-size: 40px;
    font-weight: 300;
    letter-spacing: 0.08em;
    text-align: center;
    padding: 48px 32px;
    line-height: 1;
}

.am-auth-cert-card-body {
    padding: 0;
    flex: 1;
}

/* Spec rows */
.am-auth-cert-card-row {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 16px;
    padding: 14px 24px;
    border-bottom: 1px solid rgba(201, 168, 76, 0.08);
    font-size: 12px;
}

.am-auth-cert-card-row:last-child {
    border-bottom: none;
}

.am-auth-cert-card-row span {
    color: var(--am-grey);
    letter-spacing: 0.04em;
    flex-shrink: 0;
}

.am-auth-cert-card-row strong {
    color: var(--am-black);
    font-weight: 600;
    text-align: right;
    font-size: 12px;
}

/* Dark card variant row colours */
.am-auth-cert-card--dark .am-auth-cert-card-row span {
    color: var(--am-grey);
}

.am-auth-cert-card--dark .am-auth-cert-card-row strong {
    color: var(--am-light-grey);
}

.am-auth-cert-card--dark .am-auth-cert-card-row {
    border-bottom-color: rgba(255, 255, 255, 0.05);
}

/* AML Clear / Active — green status */
.am-auth-aml-clear {
    color: #22C55E !important;
}


/* ── PHYSICAL STANDARD GRID — 4 cards ── */

.am-auth-physical-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1px;
    background: rgba(201, 168, 76, 0.1);
    border: 1px solid rgba(201, 168, 76, 0.1);
    border-radius: var(--am-radius);
    overflow: hidden;
}

.am-auth-physical-card {
    background: var(--am-off-white);
    padding: 36px 28px;
    transition: background var(--am-duration) var(--am-ease);
}

.am-auth-physical-card:hover {
    background: var(--am-white);
}

.am-auth-physical-icon {
    color: var(--am-gold);
    margin-bottom: 16px;
    display: block;
}

.am-auth-physical-card h3 {
    font-family: var(--am-font-display);
    font-size: 18px;
    font-weight: 400;
    color: var(--am-black);
    margin: 0 0 10px;
}

.am-auth-physical-card p {
    font-size: 13px;
    color: var(--am-grey);
    line-height: 1.85;
    margin: 0;
}


/* ── VERIFY CTA SECTION ── */

.am-auth-verify {
    padding: var(--am-space-3xl) 0;
}

.am-auth-verify-inner {
    display: grid;
    grid-template-columns: 1fr 340px;
    gap: 80px;
    align-items: center;
}

.am-auth-verify-text p {
    font-size: 15px;
    color: var(--am-light-grey);
    line-height: 1.85;
    margin-bottom: 18px;
}

.am-auth-verify-text .am-btn-gold {
    margin-top: 8px;
}

/* Animated blockchain card */
.am-auth-verify-card {
    border: 1px solid rgba(201, 168, 76, 0.2);
    border-radius: var(--am-radius-lg);
    padding: 40px 32px;
    text-align: center;
    background: rgba(201, 168, 76, 0.04);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px;
}

.am-auth-verify-card-icon {
    color: var(--am-gold);
    display: block;
}

.am-auth-verify-card-text {
    font-size: 13px;
    color: var(--am-light-grey);
    line-height: 1.75;
    margin: 0;
}

/* Decorative chain link visualisation */
.am-auth-verify-card-chain {
    display: flex;
    align-items: center;
    gap: 4px;
    margin-top: 4px;
}

.am-auth-verify-card-chain span {
    display: block;
    width: 36px;
    height: 12px;
    border: 1px solid rgba(201, 168, 76, 0.25);
    border-radius: 6px;
    animation: chainPulse 2.4s ease-in-out infinite;
}

.am-auth-verify-card-chain span:nth-child(1) { animation-delay: 0s; }
.am-auth-verify-card-chain span:nth-child(2) { animation-delay: 0.2s; }
.am-auth-verify-card-chain span:nth-child(3) { animation-delay: 0.4s; }
.am-auth-verify-card-chain span:nth-child(4) { animation-delay: 0.6s; }
.am-auth-verify-card-chain span:nth-child(5) { animation-delay: 0.8s; }

@keyframes chainPulse {
    0%, 100% { border-color: rgba(201, 168, 76, 0.15); background: transparent; }
    50%       { border-color: rgba(201, 168, 76, 0.5);  background: rgba(201, 168, 76, 0.06); }
}

/* Closing CTA override — light version */
.am-auth .am-about-cta.am-section {
    background: var(--am-off-white);
}

/* am-btn-primary for the light CTA context */
.am-btn-primary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    text-decoration: none;
    padding: 14px 32px;
    border-radius: var(--am-radius);
    transition: all var(--am-duration) var(--am-ease);
    cursor: pointer;
    background: var(--am-black);
    color: var(--am-white);
    border: 1px solid var(--am-black);
}

.am-btn-primary:hover {
    background: var(--am-dark);
    color: var(--am-gold);
    border-color: var(--am-dark);
}


/* ══════════════════════════════════════════════════════════════
   AUTHENTICITY RESPONSIVE
══════════════════════════════════════════════════════════════ */

/* Tablet */
@media (max-width: 1024px) {

    .am-auth-statement-inner {
        grid-template-columns: 1fr;
        gap: 40px;
    }

    .am-auth-purity-badge {
        max-width: 320px;
        margin: 0 auto;
    }

    .am-auth-physical-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .am-auth-verify-inner {
        grid-template-columns: 1fr;
        gap: 40px;
    }

    .am-auth-verify-card {
        max-width: 400px;
    }

    .am-auth-hero-certs {
        flex-direction: row;
    }
}

/* Portrait tablet */
@media (max-width: 850px) {

    .am-auth-hero {
        min-height: auto;
        padding: var(--am-space-3xl) 20px var(--am-space-2xl);
    }

    .am-auth-hero-cert {
        padding: 14px 20px;
    }

    .am-auth-hero-cert-abbr {
        font-size: 16px;
    }

    /* Replace cert card with simpler version on mobile */
    .am-auth-cert-card {
        max-width: 100%;
    }

    .am-auth-cert-card-abbr {
        font-size: 32px;
        padding: 32px 24px;
    }
}

/* Phone */
@media (max-width: 640px) {

    .am-auth-headline {
        font-size: clamp(36px, 11vw, 60px);
        letter-spacing: -0.02em;
    }

    .am-auth-hero-certs {
        flex-direction: column;
        max-width: 280px;
    }

    .am-auth-hero-cert-sep {
        width: 48px;
        height: 1px;
    }

    .am-auth-physical-grid {
        grid-template-columns: 1fr;
    }

    .am-auth-physical-card {
        padding: 28px 24px;
    }

    .am-auth-cert-card-row {
        flex-direction: column;
        gap: 4px;
        padding: 12px 20px;
    }

    .am-auth-cert-card-row strong {
        text-align: left;
    }

    .am-auth-cert-card-abbr {
        padding: 28px 20px;
    }

    .am-auth-verify-card-chain span {
        width: 28px;
    }
}


/* ── RTL support (WPML Arabic) ── */

[dir="rtl"] .am-auth-cert-what {
    border-left: none;
    border-right: 2px solid var(--am-gold);
    border-radius: var(--am-radius) 0 0 var(--am-radius);
}

[dir="rtl"] .am-auth-cert-list li {
    flex-direction: row-reverse;
    text-align: right;
}

[dir="rtl"] .am-auth-cert-card-row {
    flex-direction: row-reverse;
    text-align: right;
}

[dir="rtl"] .am-auth-cert-card-row strong {
    text-align: left;
}

[dir="rtl"] .am-auth-physical-card {
    text-align: right;
}

[dir="rtl"] .am-auth-hero-certs {
    direction: rtl;
}

[dir="rtl"] .am-auth-verify-inner {
    direction: rtl;
}

[dir="rtl"] .am-auth-verify-text {
    text-align: right;
}

[dir="rtl"] .am-auth-verify-card-chain {
    direction: ltr; /* keep chain visual L→R regardless of language */
}















/* ══════════════════════════════════════════════════════════════
   FAQ — page-faq.php
   Append this entire block to the bottom of page-content.css
   ══════════════════════════════════════════════════════════════ */


/* ── FAQ HERO ── */

.am-faq-hero {
    background: var(--am-black) !important;
    min-height: 44vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: var(--am-space-4xl) var(--am-space-xl) var(--am-space-3xl);
    position: relative;
    overflow: hidden;
    z-index: 1;
}

.am-faq-hero::before {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(ellipse 50% 60% at 50% 80%, rgba(201, 168, 76, 0.06) 0%, transparent 70%);
    pointer-events: none;
    z-index: 0;
}

.am-faq-hero-inner {
    position: relative;
    z-index: 1;
    max-width: 720px;
    width: 100%;
}

.am-faq-headline {
    font-family: var(--am-font-display);
    font-size: clamp(40px, 6vw, 76px);
    font-weight: 300;
    color: var(--am-white);
    line-height: 1.08;
    letter-spacing: -0.02em;
    margin: 16px 0 24px;
}

.am-faq-subhead {
    font-size: clamp(14px, 1.6vw, 16px);
    color: var(--am-light-grey);
    line-height: 1.85;
    max-width: 560px;
    margin: 0 auto;
    font-weight: 300;
}


/* ── CATEGORY NAV (mobile pill strip) ── */

.am-faq-cat-nav {
    background: var(--am-off-white);
    border-bottom: 1px solid rgba(201, 168, 76, 0.1);
    position: sticky;
    top: 72px; /* below the main nav */
    z-index: 100;
    overflow: hidden;
}

.am-faq-cat-nav-inner {
    display: flex;
    gap: 8px;
    padding: 14px 0;
    overflow-x: auto;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
}

.am-faq-cat-nav-inner::-webkit-scrollbar {
    display: none;
}

.am-faq-cat-pill {
    display: inline-flex;
    align-items: center;
    white-space: nowrap;
    padding: 7px 18px;
    border: 1px solid rgba(201, 168, 76, 0.2);
    border-radius: var(--am-radius-pill);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.06em;
    color: var(--am-grey);
    text-decoration: none;
    flex-shrink: 0;
    transition: all var(--am-duration) var(--am-ease);
}

.am-faq-cat-pill:hover,
.am-faq-cat-pill.active {
    background: var(--am-black);
    border-color: var(--am-black);
    color: var(--am-gold);
}


/* ── FAQ BODY — sidebar + content layout ── */

.am-faq-body {
    padding: var(--am-space-3xl) 0 var(--am-space-4xl);
    background: var(--am-off-white);
}

.am-faq-layout {
    display: grid;
    grid-template-columns: 240px 1fr;
    gap: 60px;
    align-items: start;
}


/* ── SIDEBAR ── */

.am-faq-sidebar {
    position: sticky;
    top: 130px; /* below nav + category pill bar */
}

.am-faq-sidebar-inner {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.am-faq-sidebar-label {
    display: block;
    font-size: 9px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--am-gold);
    font-weight: 700;
    margin-bottom: 16px;
    padding-bottom: 12px;
    border-bottom: 1px solid rgba(201, 168, 76, 0.12);
}

.am-faq-sidebar nav {
    display: flex;
    flex-direction: column;
    gap: 2px;
    margin-bottom: 32px;
}

.am-faq-sidebar-link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 10px 12px;
    border-radius: var(--am-radius);
    font-size: 13px;
    color: var(--am-grey);
    text-decoration: none;
    transition: all var(--am-duration) var(--am-ease);
    border-left: 2px solid transparent;
}

.am-faq-sidebar-link:hover,
.am-faq-sidebar-link.active {
    color: var(--am-black);
    background: var(--am-white);
    border-left-color: var(--am-gold);
}

.am-faq-sidebar-count {
    font-size: 10px;
    color: var(--am-light-grey);
    background: var(--am-cream);
    padding: 2px 7px;
    border-radius: var(--am-radius-pill);
    font-weight: 600;
    flex-shrink: 0;
}

/* Mini CTA in sidebar */
.am-faq-sidebar-cta {
    padding: 20px;
    background: var(--am-cream);
    border: 1px solid rgba(201, 168, 76, 0.12);
    border-radius: var(--am-radius);
    text-align: center;
}

.am-faq-sidebar-cta p {
    font-size: 12px;
    color: var(--am-grey);
    line-height: 1.6;
    margin: 0 0 14px;
}

.am-btn-small {
    padding: 10px 20px;
    font-size: 10px;
    letter-spacing: 0.12em;
}


/* ── FAQ CATEGORIES & ACCORDIONS ── */

.am-faq-content {
    display: flex;
    flex-direction: column;
    gap: var(--am-space-2xl);
}

.am-faq-category {
    scroll-margin-top: 130px; /* offset for sticky nav + pill bar */
}

.am-faq-cat-header {
    display: flex;
    align-items: baseline;
    gap: 14px;
    margin-bottom: 20px;
    padding-bottom: 16px;
    border-bottom: 1px solid rgba(201, 168, 76, 0.15);
}

.am-faq-cat-title {
    font-family: var(--am-font-display);
    font-size: 26px;
    font-weight: 400;
    color: var(--am-black);
    margin: 0;
    letter-spacing: 0.01em;
}

.am-faq-cat-count {
    font-size: 10px;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--am-gold);
    font-weight: 600;
    white-space: nowrap;
}

.am-faq-list {
    display: flex;
    flex-direction: column;
    gap: 0;
    border: 1px solid rgba(201, 168, 76, 0.1);
    border-radius: var(--am-radius);
    overflow: hidden;
}

/* ── Individual accordion item ── */
.am-faq-item {
    border-bottom: 1px solid rgba(201, 168, 76, 0.07);
    background: var(--am-white);
}

.am-faq-item:last-child {
    border-bottom: none;
}

.am-faq-q {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 20px 24px;
    cursor: pointer;
    list-style: none;
    user-select: none;
    transition: background var(--am-duration) var(--am-ease);
    /* No marker */
}

.am-faq-q::-webkit-details-marker { display: none; }
.am-faq-q::marker { display: none; }

.am-faq-q:hover {
    background: var(--am-off-white);
}

details[open] > .am-faq-q {
    background: var(--am-off-white);
    border-bottom: 1px solid rgba(201, 168, 76, 0.08);
}

.am-faq-q-text {
    font-size: 14px;
    font-weight: 600;
    color: var(--am-black);
    line-height: 1.5;
    flex: 1;
    transition: color var(--am-duration) var(--am-ease);
}

details[open] > .am-faq-q .am-faq-q-text {
    color: var(--am-gold);
}

.am-faq-q-icon {
    flex-shrink: 0;
    color: var(--am-gold);
    display: flex;
    align-items: center;
    transition: transform var(--am-duration) var(--am-ease);
}

details[open] > .am-faq-q .am-faq-q-icon {
    transform: rotate(180deg);
}

.am-faq-a {
    padding: 20px 24px 24px;
    background: var(--am-white);
}

.am-faq-a p {
    font-size: 14px;
    color: var(--am-grey);
    line-height: 1.9;
    margin: 0 0 12px;
}

.am-faq-a p:last-child {
    margin-bottom: 0;
}

/* ACF wysiwyg output — style any lists or links */
.am-faq-a ul,
.am-faq-a ol {
    padding-left: 20px;
    margin: 8px 0 12px;
}

.am-faq-a li {
    font-size: 14px;
    color: var(--am-grey);
    line-height: 1.8;
    margin-bottom: 6px;
}

.am-faq-a a {
    color: var(--am-gold);
    text-decoration: underline;
    text-underline-offset: 2px;
}

.am-faq-a strong {
    color: var(--am-black);
    font-weight: 600;
}


/* ── STILL NEED HELP — contact strip ── */

.am-faq-help {
    padding: var(--am-space-3xl) 0;
}

.am-faq-help-inner {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 80px;
    align-items: center;
}

.am-faq-help-text p {
    font-size: 15px;
    color: var(--am-light-grey);
    line-height: 1.85;
    margin: 0;
}

.am-faq-help-channels {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.am-faq-help-channel {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 18px 20px;
    border: 1px solid rgba(201, 168, 76, 0.15);
    border-radius: var(--am-radius);
    text-decoration: none;
    background: rgba(255, 255, 255, 0.03);
    transition: all var(--am-duration) var(--am-ease);
}

.am-faq-help-channel:hover {
    border-color: rgba(201, 168, 76, 0.35);
    background: rgba(201, 168, 76, 0.05);
}

.am-faq-help-channel-icon {
    color: var(--am-gold);
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border: 1px solid rgba(201, 168, 76, 0.2);
    border-radius: 50%;
}

.am-faq-help-channel-label {
    display: block;
    font-size: 9px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--am-gold);
    font-weight: 700;
    margin-bottom: 3px;
}

.am-faq-help-channel-value {
    display: block;
    font-size: 14px;
    color: var(--am-white);
    font-weight: 400;
    letter-spacing: 0.01em;
}


/* ══════════════════════════════════════════════════════════════
   FAQ RESPONSIVE
══════════════════════════════════════════════════════════════ */

/* Tablet — hide sidebar, keep pill nav */
@media (max-width: 1024px) {

    .am-faq-layout {
        grid-template-columns: 1fr;
        gap: 40px;
    }

    .am-faq-sidebar {
        display: none; /* Replaced by sticky pill nav on mobile */
    }

    .am-faq-help-inner {
        grid-template-columns: 1fr;
        gap: 40px;
    }
}

/* Portrait tablet */
@media (max-width: 850px) {

    .am-faq-hero {
        min-height: auto;
        padding: var(--am-space-3xl) 20px var(--am-space-2xl);
    }

    .am-faq-cat-nav {
        top: 64px; /* mobile nav height */
    }

    .am-faq-category {
        scroll-margin-top: 110px;
    }
}

/* Phone */
@media (max-width: 640px) {

    .am-faq-headline {
        font-size: clamp(34px, 10vw, 52px);
    }

    .am-faq-body {
        padding: var(--am-space-2xl) 0 var(--am-space-3xl);
    }

    .am-faq-q {
        padding: 16px 18px;
        gap: 12px;
    }

    .am-faq-q-text {
        font-size: 13px;
    }

    .am-faq-a {
        padding: 16px 18px 20px;
    }

    .am-faq-a p {
        font-size: 13px;
    }

    .am-faq-cat-header {
        flex-direction: column;
        align-items: flex-start;
        gap: 4px;
    }

    .am-faq-cat-title {
        font-size: 22px;
    }

    .am-faq-help-channel {
        padding: 14px 16px;
    }
}


/* ── RTL support (WPML Arabic) ── */

[dir="rtl"] .am-faq-sidebar-link {
    border-left: none;
    border-right: 2px solid transparent;
    flex-direction: row-reverse;
}

[dir="rtl"] .am-faq-sidebar-link:hover,
[dir="rtl"] .am-faq-sidebar-link.active {
    border-right-color: var(--am-gold);
    border-left: none;
}

[dir="rtl"] .am-faq-q {
    flex-direction: row-reverse;
    text-align: right;
}

[dir="rtl"] .am-faq-cat-header {
    flex-direction: row-reverse;
}

[dir="rtl"] .am-faq-cat-nav-inner {
    direction: rtl;
}

[dir="rtl"] .am-faq-help-channel {
    flex-direction: row-reverse;
    text-align: right;
}

[dir="rtl"] .am-faq-a {
    text-align: right;
}

[dir="rtl"] .am-faq-a ul,
[dir="rtl"] .am-faq-a ol {
    padding-left: 0;
    padding-right: 20px;
}

[dir="rtl"] .am-faq-a p,
[dir="rtl"] .am-faq-a li {
    font-family: var(--am-font-arabic);
    line-height: 2;
}

[dir="rtl"] .am-faq-q-text {
    font-family: var(--am-font-arabic);
    line-height: 1.8;
}









/* ══════════════════════════════════════════════════════════════
   CHARITY COMMITMENT — page-charity.php
   Append this entire block to the bottom of page-content.css
   ══════════════════════════════════════════════════════════════ */


/* ── CHARITY HERO ── */

.am-charity-hero {
    background: var(--am-black) !important;
    min-height: 68vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: var(--am-space-4xl) var(--am-space-xl) var(--am-space-3xl);
    position: relative;
    overflow: hidden;
    z-index: 1;
}

.am-charity-hero::before {
    content: '';
    position: absolute;
    inset: 0;
    background:
        radial-gradient(ellipse 70% 50% at 50% 75%, rgba(201, 168, 76, 0.08) 0%, transparent 65%),
        radial-gradient(ellipse 30% 20% at 20% 20%, rgba(201, 168, 76, 0.03) 0%, transparent 60%);
    pointer-events: none;
    z-index: 0;
}

.am-charity-hero-inner {
    position: relative;
    z-index: 1;
    max-width: 860px;
    width: 100%;
}

/* Hero headline — enormous 5% with supporting text */
.am-charity-headline {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 32px;
    margin: 16px 0 28px;
    flex-wrap: wrap;
}

.am-charity-headline-pct {
    font-family: var(--am-font-display);
    font-size: clamp(80px, 14vw, 160px);
    font-weight: 300;
    line-height: 1;
    letter-spacing: -0.04em;
    /* Gold shimmer on the large number */
    background: var(--am-gold-shimmer);
    background-size: 200% auto;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    animation: shimmer 6s linear infinite;
    flex-shrink: 0;
}

.am-charity-headline-rest {
    font-family: var(--am-font-display);
    font-size: clamp(20px, 3.5vw, 36px);
    font-weight: 300;
    color: var(--am-white);
    line-height: 1.3;
    text-align: left;
    letter-spacing: -0.01em;
}

.am-charity-subhead {
    font-size: clamp(14px, 1.6vw, 16px);
    color: var(--am-light-grey);
    line-height: 1.9;
    max-width: 640px;
    margin: 0 auto;
    font-weight: 300;
}


/* ── 95% / 5% SPLIT VISUAL ── */

.am-charity-split-visual {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 360px;
}

.am-charity-split-breakdown {
    border: 1px solid rgba(201, 168, 76, 0.2);
    border-radius: var(--am-radius-lg);
    overflow: hidden;
    width: 100%;
    max-width: 360px;
    background: var(--am-white);
}

.am-charity-split-row {
    display: flex;
    align-items: center;
    gap: 20px;
    padding: 32px 28px;
}

.am-charity-split-row--gold {
    background: rgba(201, 168, 76, 0.04);
}

.am-charity-split-pct {
    font-family: var(--am-font-display);
    font-size: 52px;
    font-weight: 300;
    color: var(--am-light-grey);
    line-height: 1;
    letter-spacing: -0.02em;
    flex-shrink: 0;
    min-width: 90px;
}

.am-charity-split-row--gold .am-charity-split-pct {
    color: var(--am-gold);
}

.am-charity-split-label {
    font-size: 13px;
    color: var(--am-grey);
    line-height: 1.6;
}

.am-charity-split-row--gold .am-charity-split-label {
    color: var(--am-black);
    font-weight: 500;
}

.am-charity-split-divider {
    height: 1px;
    background: rgba(201, 168, 76, 0.12);
    margin: 0;
}

.am-charity-split-footnote {
    padding: 14px 28px;
    font-size: 11px;
    color: var(--am-grey);
    letter-spacing: 0.04em;
    line-height: 1.6;
    background: var(--am-off-white);
    text-align: center;
    border-top: 1px solid rgba(201, 168, 76, 0.1);
}


/* ── HOW IT WORKS — 3-step giving cycle ── */

.am-charity-how {
    padding: var(--am-space-3xl) 0;
}

.am-charity-steps {
    display: flex;
    align-items: flex-start;
    gap: 0;
    margin-top: var(--am-space-xl);
}

.am-charity-step {
    flex: 1;
    padding: 40px 36px;
    background: var(--am-white);
    border: 1px solid rgba(201, 168, 76, 0.1);
    border-radius: var(--am-radius);
    display: flex;
    flex-direction: column;
    gap: 0;
    transition: border-color var(--am-duration) var(--am-ease),
                box-shadow var(--am-duration) var(--am-ease);
}

.am-charity-step:hover {
    border-color: rgba(201, 168, 76, 0.3);
    box-shadow: var(--am-shadow-gold);
}

.am-charity-step-num {
    font-family: var(--am-font-display);
    font-size: 48px;
    font-weight: 300;
    color: rgba(201, 168, 76, 0.18);
    line-height: 1;
    margin-bottom: 16px;
}

.am-charity-step-icon {
    color: var(--am-gold);
    margin-bottom: 20px;
    display: block;
}

.am-charity-step-title {
    font-family: var(--am-font-display);
    font-size: 22px;
    font-weight: 400;
    color: var(--am-black);
    margin: 0 0 12px;
}

.am-charity-step p {
    font-size: 13px;
    color: var(--am-grey);
    line-height: 1.85;
    margin: 0;
}

/* Arrow connector between steps */
.am-charity-step-connector {
    display: flex;
    align-items: center;
    justify-content: center;
    color: rgba(201, 168, 76, 0.3);
    padding: 0 8px;
    flex-shrink: 0;
    margin-top: 80px; /* vertically centre with step content */
}


/* ── CAUSE CARDS — 4 pillars ── */

.am-charity-causes-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1px;
    background: rgba(201, 168, 76, 0.1);
    border: 1px solid rgba(201, 168, 76, 0.1);
    border-radius: var(--am-radius);
    overflow: hidden;
}

.am-charity-cause-card {
    background: var(--am-off-white);
    padding: 40px 28px;
    display: flex;
    flex-direction: column;
    gap: 0;
    transition: background var(--am-duration) var(--am-ease);
}

.am-charity-cause-card:hover {
    background: var(--am-white);
}

.am-charity-cause-icon {
    color: var(--am-gold);
    margin-bottom: 20px;
    display: block;
}

.am-charity-cause-title {
    font-family: var(--am-font-display);
    font-size: 20px;
    font-weight: 400;
    color: var(--am-black);
    margin: 0 0 12px;
    line-height: 1.3;
}

.am-charity-cause-card p {
    font-size: 13px;
    color: var(--am-grey);
    line-height: 1.85;
    margin: 0 0 20px;
    flex: 1;
}

/* Example tag pills */
.am-charity-cause-examples {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: auto;
}

.am-charity-cause-examples span {
    font-size: 10px;
    letter-spacing: 0.08em;
    color: var(--am-gold);
    background: rgba(201, 168, 76, 0.08);
    border: 1px solid rgba(201, 168, 76, 0.18);
    padding: 3px 10px;
    border-radius: var(--am-radius-pill);
    font-weight: 500;
}


/* ── 100% POLICY — dark section visuals ── */

.am-charity-hundred-visual {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 400px;
}

.am-charity-hundred-badge {
    border: 1px solid rgba(201, 168, 76, 0.25);
    background: rgba(201, 168, 76, 0.04);
    border-radius: var(--am-radius-lg);
    padding: 56px 48px;
    text-align: center;
    width: 100%;
    max-width: 320px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0;
}

.am-charity-hundred-num {
    display: block;
    font-family: var(--am-font-display);
    font-size: 80px;
    font-weight: 300;
    color: var(--am-gold);
    line-height: 1;
    letter-spacing: -0.03em;
    margin-bottom: 8px;
}

.am-charity-hundred-label {
    display: block;
    font-size: 11px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--am-light-grey);
    font-weight: 600;
    margin-bottom: 20px;
}

.am-charity-hundred-rule {
    width: 40px;
    height: 1px;
    background: rgba(201, 168, 76, 0.3);
    margin-bottom: 20px;
}

.am-charity-hundred-sub {
    display: block;
    font-size: 12px;
    color: var(--am-grey);
    line-height: 1.8;
    letter-spacing: 0.02em;
}

/* Hadith quote within the dark section */
.am-charity-hadith {
    margin: 28px 0 0;
    padding: 20px 24px;
    border-left: 2px solid rgba(201, 168, 76, 0.3);
    background: rgba(201, 168, 76, 0.04);
    border-radius: 0 var(--am-radius) var(--am-radius) 0;
}

.am-charity-hadith p {
    font-family: var(--am-font-display);
    font-style: italic;
    font-size: 15px;
    color: var(--am-light-grey) !important;
    line-height: 1.7;
    margin: 0 0 8px !important;
}

.am-charity-hadith cite {
    font-size: 10px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--am-gold);
    font-weight: 600;
    font-style: normal;
    display: block;
}


/* ── GIVING CRITERIA ── */

.am-charity-criteria-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1px;
    background: rgba(201, 168, 76, 0.1);
    border: 1px solid rgba(201, 168, 76, 0.1);
    border-radius: var(--am-radius);
    overflow: hidden;
    margin-bottom: 32px;
}

.am-charity-criteria-item {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    padding: 28px 28px;
    background: var(--am-cream);
    transition: background var(--am-duration) var(--am-ease);
}

.am-charity-criteria-item:hover {
    background: var(--am-white);
}

.am-charity-criteria-check {
    font-size: 14px;
    font-weight: 700;
    color: var(--am-gold);
    flex-shrink: 0;
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(201, 168, 76, 0.25);
    border-radius: 50%;
    line-height: 1;
    margin-top: 2px;
}

.am-charity-criteria-item strong {
    display: block;
    font-size: 13px;
    font-weight: 600;
    color: var(--am-black);
    margin-bottom: 6px;
    letter-spacing: 0.01em;
}

.am-charity-criteria-item p {
    font-size: 13px;
    color: var(--am-grey);
    line-height: 1.7;
    margin: 0;
}

.am-charity-partner-note {
    text-align: center;
    padding: 20px;
    background: var(--am-white);
    border: 1px solid rgba(201, 168, 76, 0.12);
    border-radius: var(--am-radius);
}

.am-charity-partner-note p {
    font-size: 14px;
    color: var(--am-grey);
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 4px;
}


/* ── SADAQAH JARIYAH — editorial statement ── */

.am-charity-jariyah {
    padding: var(--am-space-3xl) 0;
    background: var(--am-off-white);
}

.am-charity-jariyah-inner {
    display: grid;
    grid-template-columns: 1fr 320px;
    gap: 80px;
    align-items: center;
}

.am-charity-jariyah-text p {
    font-size: 15px;
    color: var(--am-grey);
    line-height: 1.9;
    margin-bottom: 18px;
}

.am-charity-jariyah-text p:last-child {
    margin-bottom: 0;
}

.am-charity-jariyah-aside {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

.am-charity-jariyah-arabic {
    font-family: var(--am-font-arabic);
    font-size: clamp(28px, 4vw, 44px);
    color: var(--am-gold);
    line-height: 1.8;
    margin-bottom: 12px;
    letter-spacing: 0.02em;
}

.am-charity-jariyah-trans {
    font-size: 10px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--am-grey);
    font-weight: 600;
}


/* ══════════════════════════════════════════════════════════════
   CHARITY RESPONSIVE
══════════════════════════════════════════════════════════════ */

/* Tablet */
@media (max-width: 1024px) {

    .am-charity-causes-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .am-charity-criteria-grid {
        grid-template-columns: 1fr;
    }

    .am-charity-jariyah-inner {
        grid-template-columns: 1fr;
        gap: 40px;
    }

    .am-charity-jariyah-aside {
        border-top: 1px solid rgba(201, 168, 76, 0.1);
        padding-top: 32px;
    }
}

/* Portrait tablet */
@media (max-width: 850px) {

    .am-charity-hero {
        min-height: auto;
        padding: var(--am-space-3xl) 20px var(--am-space-2xl);
    }

    .am-charity-headline {
        flex-direction: column;
        gap: 12px;
    }

    .am-charity-headline-rest {
        text-align: center;
    }

    .am-charity-steps {
        flex-direction: column;
        gap: 16px;
    }

    .am-charity-step-connector {
        transform: rotate(90deg);
        margin: 0 auto;
        padding: 4px 0;
    }

    .am-charity-split-visual {
        min-height: auto;
    }
}

/* Phone */
@media (max-width: 640px) {

    .am-charity-headline-pct {
        font-size: clamp(72px, 20vw, 120px);
    }

    .am-charity-causes-grid {
        grid-template-columns: 1fr;
    }

    .am-charity-cause-card {
        padding: 28px 24px;
    }

    .am-charity-step {
        padding: 28px 24px;
    }

    .am-charity-hundred-badge {
        padding: 40px 28px;
    }

    .am-charity-hundred-num {
        font-size: 64px;
    }

    .am-charity-hadith {
        padding: 16px 18px;
    }

    .am-charity-criteria-item {
        padding: 20px 20px;
    }

    .am-charity-partner-note p {
        flex-direction: column;
        gap: 8px;
    }
}


/* ── RTL support (WPML Arabic) ── */

[dir="rtl"] .am-charity-headline {
    flex-direction: row-reverse;
}

[dir="rtl"] .am-charity-headline-rest {
    text-align: right;
}

[dir="rtl"] .am-charity-hadith {
    border-left: none;
    border-right: 2px solid rgba(201, 168, 76, 0.3);
    border-radius: var(--am-radius) 0 0 var(--am-radius);
}

[dir="rtl"] .am-charity-criteria-item {
    flex-direction: row-reverse;
    text-align: right;
}

[dir="rtl"] .am-charity-cause-card {
    text-align: right;
}

[dir="rtl"] .am-charity-cause-examples {
    justify-content: flex-end;
}

[dir="rtl"] .am-charity-steps {
    flex-direction: row-reverse;
}

[dir="rtl"] .am-charity-step-connector svg {
    transform: scaleX(-1);
}

[dir="rtl"] .am-charity-partner-note p {
    flex-direction: row-reverse;
}

[dir="rtl"] .am-charity-split-row {
    flex-direction: row-reverse;
    text-align: right;
}































/* ══════════════════════════════════════════════════════════════
   SHIPPING & DELIVERY — page-shipping.php
   Append this entire block to the bottom of page-content.css
   ══════════════════════════════════════════════════════════════ */


/* ── SHIPPING HERO ── */

.am-shipping-hero {
    background: var(--am-black) !important;
    min-height: 50vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: var(--am-space-4xl) var(--am-space-xl) var(--am-space-3xl);
    position: relative;
    overflow: hidden;
    z-index: 1;
}

.am-shipping-hero::before {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(ellipse 60% 55% at 50% 75%, rgba(201, 168, 76, 0.06) 0%, transparent 65%);
    pointer-events: none;
    z-index: 0;
}

.am-shipping-hero-inner {
    position: relative;
    z-index: 1;
    max-width: 720px;
    width: 100%;
}

.am-shipping-headline {
    font-family: var(--am-font-display);
    font-size: clamp(44px, 7vw, 84px);
    font-weight: 300;
    color: var(--am-white);
    line-height: 1.05;
    letter-spacing: -0.025em;
    margin: 16px 0 24px;
}

.am-shipping-subhead {
    font-size: clamp(14px, 1.6vw, 16px);
    color: var(--am-light-grey);
    line-height: 1.85;
    max-width: 580px;
    margin: 0 auto;
    font-weight: 300;
}


/* ── TRUST BAR ── */

.am-shipping-trust-bar {
    background: var(--am-near-black);
    padding: var(--am-space-xl) 0;
    border-top: 1px solid rgba(201, 168, 76, 0.08);
    border-bottom: 1px solid rgba(201, 168, 76, 0.08);
}

.am-shipping-trust-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1px;
    background: rgba(201, 168, 76, 0.06);
}

.am-shipping-trust-item {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    padding: 24px 20px;
    background: var(--am-near-black);
    transition: background var(--am-duration) var(--am-ease);
}

.am-shipping-trust-item:hover {
    background: rgba(201, 168, 76, 0.04);
}

.am-shipping-trust-icon {
    color: var(--am-gold);
    flex-shrink: 0;
    margin-top: 2px;
}

.am-shipping-trust-item strong {
    display: block;
    font-size: 11px;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--am-white);
    font-weight: 600;
    margin-bottom: 4px;
}

.am-shipping-trust-item span {
    display: block;
    font-size: 12px;
    color: var(--am-grey);
    line-height: 1.6;
}


/* ── DELIVERY OPTIONS — Ship vs Vault ── */

.am-shipping-options {
    padding: var(--am-space-3xl) 0;
}

.am-shipping-options-grid {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    gap: 0;
    align-items: stretch;
    border: 1px solid rgba(201, 168, 76, 0.12);
    border-radius: var(--am-radius-lg);
    overflow: hidden;
}

.am-shipping-option-card {
    padding: 40px 36px;
    background: var(--am-white);
    display: flex;
    flex-direction: column;
    gap: 0;
    position: relative;
}

/* Vault card gets a subtle gold tint */
.am-shipping-option-card--vault {
    background: rgba(201, 168, 76, 0.03);
    border-left: 1px solid rgba(201, 168, 76, 0.15);
}

/* "Free" badge on vault card */
.am-shipping-option-badge {
    position: absolute;
    top: 20px;
    right: 20px;
    background: var(--am-gold);
    color: var(--am-black);
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    padding: 4px 12px;
    border-radius: var(--am-radius-pill);
}

.am-shipping-option-icon {
    color: var(--am-gold);
    margin-bottom: 16px;
    display: block;
}

.am-shipping-option-title {
    font-family: var(--am-font-display);
    font-size: 24px;
    font-weight: 400;
    color: var(--am-black);
    margin: 0 0 12px;
}

.am-shipping-option-desc {
    font-size: 14px;
    color: var(--am-grey);
    line-height: 1.8;
    margin-bottom: 24px;
}

.am-shipping-option-list {
    list-style: none;
    padding: 0;
    margin: 0 0 24px;
    display: flex;
    flex-direction: column;
    gap: 9px;
    flex: 1;
}

.am-shipping-option-list li {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font-size: 13px;
    color: var(--am-grey);
    line-height: 1.5;
}

.am-shipping-option-list li::before {
    content: '✓';
    color: var(--am-gold);
    font-size: 11px;
    font-weight: 700;
    flex-shrink: 0;
    margin-top: 1px;
}

.am-shipping-option-note {
    font-size: 11px;
    color: var(--am-light-grey);
    line-height: 1.6;
    padding: 14px 16px;
    background: rgba(201, 168, 76, 0.04);
    border: 1px solid rgba(201, 168, 76, 0.1);
    border-radius: var(--am-radius);
    margin-top: auto;
}

/* "or" divider column */
.am-shipping-options-or {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 0 20px;
    background: var(--am-cream);
    gap: 12px;
}

.am-shipping-options-or span {
    font-size: 10px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--am-grey);
    font-weight: 600;
}

.am-shipping-options-or-line {
    flex: 1;
    width: 1px;
    background: rgba(201, 168, 76, 0.15);
    max-height: 80px;
}


/* ── TIMELINE TABLE ── */

.am-shipping-timeline-table {
    border: 1px solid rgba(201, 168, 76, 0.12);
    border-radius: var(--am-radius);
    overflow: hidden;
    margin-bottom: 16px;
}

.am-shipping-tl-row {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr 1fr;
    border-bottom: 1px solid rgba(201, 168, 76, 0.07);
}

.am-shipping-tl-row:last-child {
    border-bottom: none;
}

.am-shipping-tl-row--header {
    background: var(--am-black);
}

.am-shipping-tl-row--vault {
    background: rgba(201, 168, 76, 0.03);
}

.am-shipping-tl-cell {
    padding: 16px 20px;
    font-size: 13px;
    color: var(--am-grey);
    border-right: 1px solid rgba(201, 168, 76, 0.07);
    display: flex;
    align-items: center;
}

.am-shipping-tl-cell:last-child {
    border-right: none;
}

.am-shipping-tl-row--header .am-shipping-tl-cell {
    font-size: 9px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--am-gold);
    font-weight: 700;
    padding: 14px 20px;
    background: var(--am-black);
    border-right-color: rgba(201, 168, 76, 0.1);
}

.am-shipping-tl-cell--stage {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 18px 20px;
    background: var(--am-off-white);
}

.am-shipping-tl-stage-name {
    font-size: 13px;
    font-weight: 600;
    color: var(--am-black);
    display: block;
}

.am-shipping-tl-stage-desc {
    font-size: 11px;
    color: var(--am-light-grey);
    display: block;
    letter-spacing: 0.02em;
}

.am-shipping-tl-cell strong {
    font-size: 14px;
    color: var(--am-black);
    font-weight: 600;
    display: block;
}

.am-shipping-tl-cell--na {
    font-size: 11px;
    color: var(--am-light-grey);
    font-style: italic;
}

/* Vault row spans last 3 columns */
.am-shipping-tl-row--vault {
    grid-template-columns: 2fr 3fr;
}

.am-shipping-tl-cell--span {
    font-size: 13px;
    color: var(--am-grey);
    align-items: center;
    gap: 0;
}

.am-shipping-timeline-note {
    font-size: 12px;
    color: var(--am-light-grey);
    line-height: 1.7;
    margin: 0;
}


/* ── PACKAGING LAYERS (dark section) ── */

.am-shipping-packaging-layers {
    display: flex;
    flex-direction: column;
    gap: 0;
    margin-top: 28px;
    border: 1px solid rgba(201, 168, 76, 0.12);
    border-radius: var(--am-radius);
    overflow: hidden;
}

.am-shipping-packaging-layer {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    padding: 20px 24px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
    transition: background var(--am-duration) var(--am-ease);
}

.am-shipping-packaging-layer:last-child {
    border-bottom: none;
}

.am-shipping-packaging-layer:hover {
    background: rgba(201, 168, 76, 0.04);
}

.am-shipping-packaging-layer-num {
    font-family: var(--am-font-display);
    font-size: 28px;
    font-weight: 300;
    color: rgba(201, 168, 76, 0.3);
    line-height: 1;
    flex-shrink: 0;
    min-width: 32px;
    margin-top: 2px;
}

.am-shipping-packaging-layer strong {
    display: block;
    font-size: 12px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--am-gold);
    font-weight: 600;
    margin-bottom: 6px;
}

.am-shipping-packaging-layer p {
    font-size: 13px;
    color: var(--am-light-grey);
    line-height: 1.75;
    margin: 0;
}


/* ── CUSTOMS NOTICE CARD ── */

.am-shipping-customs-card {
    border: 1px solid rgba(201, 168, 76, 0.2);
    border-radius: var(--am-radius-lg);
    overflow: hidden;
    background: var(--am-white);
    height: 100%;
}

.am-shipping-customs-card-header {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 16px 24px;
    background: rgba(201, 168, 76, 0.06);
    border-bottom: 1px solid rgba(201, 168, 76, 0.12);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--am-gold);
}

.am-shipping-customs-card-body {
    padding: 24px;
}

.am-shipping-customs-card-body p {
    font-size: 14px;
    color: var(--am-black);
    line-height: 1.7;
    font-weight: 500;
    margin-bottom: 16px;
}

.am-shipping-customs-card-body ul {
    list-style: none;
    padding: 0;
    margin: 0 0 24px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.am-shipping-customs-card-body li {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font-size: 13px;
    color: var(--am-grey);
    line-height: 1.6;
}

.am-shipping-customs-card-body li::before {
    content: '—';
    color: var(--am-gold);
    font-weight: 700;
    flex-shrink: 0;
}

.am-shipping-customs-card-cta {
    padding-top: 20px;
    border-top: 1px solid rgba(201, 168, 76, 0.1);
}

.am-shipping-customs-card-cta p {
    font-size: 12px;
    color: var(--am-grey);
    margin-bottom: 12px;
    font-weight: 400;
}


/* ── RESTRICTED COUNTRIES ── */

.am-shipping-restricted {
    padding: var(--am-space-3xl) 0;
    background: var(--am-off-white);
}

.am-shipping-restricted-inner {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 80px;
    align-items: start;
}

.am-shipping-restricted-text p {
    font-size: 15px;
    color: var(--am-grey);
    line-height: 1.85;
    margin-bottom: 16px;
}

.am-shipping-restricted-note {
    font-size: 12px !important;
    color: var(--am-light-grey) !important;
    font-style: italic;
    margin: 0 !important;
}

.am-shipping-restricted-list {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-content: flex-start;
}

.am-shipping-restricted-country {
    display: inline-flex;
    align-items: center;
    padding: 8px 16px;
    font-size: 12px;
    font-weight: 500;
    color: var(--am-grey);
    background: var(--am-white);
    border: 1px solid rgba(201, 168, 76, 0.12);
    border-radius: var(--am-radius-pill);
    letter-spacing: 0.02em;
    transition: all var(--am-duration) var(--am-ease);
}

.am-shipping-restricted-country:hover {
    border-color: rgba(201, 168, 76, 0.3);
    color: var(--am-black);
}


/* ── POLICY CARDS ── */

.am-shipping-policy-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1px;
    background: rgba(201, 168, 76, 0.1);
    border: 1px solid rgba(201, 168, 76, 0.1);
    border-radius: var(--am-radius);
    overflow: hidden;
}

.am-shipping-policy-card {
    background: var(--am-cream);
    padding: 36px 32px;
    display: flex;
    flex-direction: column;
    gap: 0;
    transition: background var(--am-duration) var(--am-ease);
}

.am-shipping-policy-card:hover {
    background: var(--am-white);
}

/* Note/warning card gets a subtle amber tint */
.am-shipping-policy-card--note {
    background: rgba(201, 168, 76, 0.04);
}

.am-shipping-policy-card--note:hover {
    background: rgba(201, 168, 76, 0.07);
}

.am-shipping-policy-icon {
    color: var(--am-gold);
    margin-bottom: 16px;
    display: block;
}

.am-shipping-policy-card h3 {
    font-family: var(--am-font-display);
    font-size: 20px;
    font-weight: 400;
    color: var(--am-black);
    margin: 0 0 12px;
}

.am-shipping-policy-card p {
    font-size: 13px;
    color: var(--am-grey);
    line-height: 1.85;
    margin: 0;
}


/* ══════════════════════════════════════════════════════════════
   SHIPPING RESPONSIVE
══════════════════════════════════════════════════════════════ */

/* Tablet */
@media (max-width: 1024px) {

    .am-shipping-trust-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .am-shipping-options-grid {
        grid-template-columns: 1fr;
    }

    .am-shipping-options-or {
        flex-direction: row;
        padding: 16px 0;
    }

    .am-shipping-options-or-line {
        flex: 1;
        max-height: 1px;
        width: auto;
        height: 1px;
    }

    .am-shipping-option-card--vault {
        border-left: none;
        border-top: 1px solid rgba(201, 168, 76, 0.15);
    }

    .am-shipping-tl-row {
        grid-template-columns: 1.5fr 1fr 1fr 1fr;
    }

    .am-shipping-restricted-inner {
        grid-template-columns: 1fr;
        gap: 40px;
    }

    .am-shipping-policy-grid {
        grid-template-columns: 1fr;
    }
}

/* Portrait tablet */
@media (max-width: 850px) {

    .am-shipping-hero {
        min-height: auto;
        padding: var(--am-space-3xl) 20px var(--am-space-2xl);
    }

    /* Timeline: hide last two delivery columns, keep stage + standard */
    .am-shipping-tl-row {
        grid-template-columns: 1fr 1fr;
    }

    .am-shipping-tl-row .am-shipping-tl-cell:nth-child(3),
    .am-shipping-tl-row .am-shipping-tl-cell:nth-child(4) {
        display: none;
    }

    .am-shipping-tl-row--header .am-shipping-tl-cell:nth-child(3),
    .am-shipping-tl-row--header .am-shipping-tl-cell:nth-child(4) {
        display: none;
    }

    .am-shipping-tl-row--vault {
        grid-template-columns: 1fr;
    }
}

/* Phone */
@media (max-width: 640px) {

    .am-shipping-headline {
        font-size: clamp(36px, 11vw, 60px);
    }

    .am-shipping-trust-grid {
        grid-template-columns: 1fr;
    }

    .am-shipping-option-card {
        padding: 28px 24px;
    }

    .am-shipping-packaging-layer {
        padding: 16px 18px;
    }

    .am-shipping-restricted-list {
        gap: 6px;
    }

    .am-shipping-restricted-country {
        font-size: 11px;
        padding: 7px 12px;
    }

    .am-shipping-policy-card {
        padding: 28px 24px;
    }

    .am-shipping-customs-card-body {
        padding: 20px;
    }
}


/* ── RTL support (WPML Arabic) ── */

[dir="rtl"] .am-shipping-trust-item {
    flex-direction: row-reverse;
    text-align: right;
}

[dir="rtl"] .am-shipping-option-badge {
    right: auto;
    left: 20px;
}

[dir="rtl"] .am-shipping-option-list li {
    flex-direction: row-reverse;
    text-align: right;
}

[dir="rtl"] .am-shipping-packaging-layer {
    flex-direction: row-reverse;
    text-align: right;
}

[dir="rtl"] .am-shipping-customs-card-body li {
    flex-direction: row-reverse;
    text-align: right;
}

[dir="rtl"] .am-shipping-restricted-list {
    direction: rtl;
}

[dir="rtl"] .am-shipping-tl-row {
    direction: rtl;
}

[dir="rtl"] .am-shipping-policy-card {
    text-align: right;
}

[dir="rtl"] .am-shipping-options-or-line {
    transform: scaleX(-1);
}










/* ══════════════════════════════════════════════════════════════
   CONTACT US — page-contact.php
   Append this entire block to the bottom of page-content.css
   ══════════════════════════════════════════════════════════════ */


/* ── CONTACT HERO ── */

.am-contact-hero {
    background: var(--am-black) !important;
    min-height: 46vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: var(--am-space-4xl) var(--am-space-xl) var(--am-space-3xl);
    position: relative;
    overflow: hidden;
    z-index: 1;
}

.am-contact-hero::before {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(ellipse 55% 55% at 50% 75%, rgba(201, 168, 76, 0.06) 0%, transparent 65%);
    pointer-events: none;
    z-index: 0;
}

.am-contact-hero-inner {
    position: relative;
    z-index: 1;
    max-width: 640px;
    width: 100%;
}

.am-contact-headline {
    font-family: var(--am-font-display);
    font-size: clamp(44px, 7vw, 84px);
    font-weight: 300;
    color: var(--am-white);
    line-height: 1.05;
    letter-spacing: -0.025em;
    margin: 16px 0 24px;
}

.am-contact-subhead {
    font-size: clamp(14px, 1.6vw, 16px);
    color: var(--am-light-grey);
    line-height: 1.85;
    max-width: 520px;
    margin: 0 auto;
    font-weight: 300;
}


/* ── CONTACT CHANNELS — 3 cards ── */

.am-contact-channels {
    background: var(--am-off-white);
    padding: var(--am-space-2xl) 0;
    border-bottom: 1px solid rgba(201, 168, 76, 0.08);
}

.am-contact-channels-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
}

.am-contact-channel-card {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 24px 20px;
    background: var(--am-white);
    border: 1px solid rgba(201, 168, 76, 0.12);
    border-radius: var(--am-radius);
    text-decoration: none;
    transition: all var(--am-duration) var(--am-ease);
    position: relative;
    overflow: hidden;
}

.am-contact-channel-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 2px;
    background: transparent;
    transition: background var(--am-duration) var(--am-ease);
}

.am-contact-channel-card:hover {
    border-color: rgba(201, 168, 76, 0.3);
    box-shadow: var(--am-shadow-gold);
    transform: translateY(-2px);
}

.am-contact-channel-card:hover::before {
    background: linear-gradient(90deg, var(--am-gold), var(--am-gold-light), var(--am-gold));
}

/* WhatsApp card gets a subtle green tint on hover */
.am-contact-channel-card--whatsapp:hover {
    border-color: rgba(37, 211, 102, 0.3);
}

.am-contact-channel-card--whatsapp:hover::before {
    background: linear-gradient(90deg, #25D366, #128C7E, #25D366);
}

.am-contact-channel-card--whatsapp .am-contact-channel-icon {
    color: #25D366;
}

.am-contact-channel-icon {
    color: var(--am-gold);
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 52px;
    height: 52px;
    border: 1px solid rgba(201, 168, 76, 0.15);
    border-radius: 50%;
    background: var(--am-off-white);
    transition: all var(--am-duration) var(--am-ease);
}

.am-contact-channel-card:hover .am-contact-channel-icon {
    background: var(--am-black);
    border-color: transparent;
}

.am-contact-channel-card--whatsapp:hover .am-contact-channel-icon {
    background: #25D366;
    border-color: transparent;
}

.am-contact-channel-card--whatsapp:hover .am-contact-channel-icon svg {
    fill: var(--am-white);
}

.am-contact-channel-card:hover .am-contact-channel-icon svg {
    stroke: var(--am-gold);
}

.am-contact-channel-body {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.am-contact-channel-label {
    font-size: 9px;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--am-gold);
    font-weight: 700;
}

.am-contact-channel-value {
    font-size: 15px;
    font-weight: 500;
    color: var(--am-black);
    letter-spacing: 0.01em;
}

.am-contact-channel-note {
    font-size: 11px;
    color: var(--am-grey);
    line-height: 1.5;
}

.am-contact-channel-arrow {
    color: var(--am-light-grey);
    flex-shrink: 0;
    transition: color var(--am-duration) var(--am-ease),
                transform var(--am-duration) var(--am-ease);
}

.am-contact-channel-card:hover .am-contact-channel-arrow {
    color: var(--am-gold);
    transform: translateX(3px);
}


/* ── ENQUIRY FORM SECTION ── */

.am-contact-form-section {
    padding: var(--am-space-3xl) 0;
}

.am-contact-form-layout {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 80px;
    align-items: start;
}

/* Left intro column */
.am-contact-form-intro p {
    font-size: 15px;
    color: var(--am-grey);
    line-height: 1.85;
    margin-bottom: 28px;
}

/* Popular enquiries prompt grid */
.am-contact-form-prompts {
    margin-bottom: 28px;
}

.am-contact-prompts-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}

.am-contact-prompt {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 12px;
    color: var(--am-grey);
    padding: 10px 12px;
    background: var(--am-white);
    border: 1px solid rgba(201, 168, 76, 0.1);
    border-radius: var(--am-radius);
    transition: all var(--am-duration) var(--am-ease);
    cursor: default;
}

.am-contact-prompt:hover {
    border-color: rgba(201, 168, 76, 0.25);
    color: var(--am-black);
}

.am-contact-prompt svg {
    color: var(--am-gold);
    flex-shrink: 0;
}

/* Female concierge note */
.am-contact-female-note {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 16px 18px;
    background: rgba(201, 168, 76, 0.04);
    border: 1px solid rgba(201, 168, 76, 0.12);
    border-left: 3px solid var(--am-gold);
    border-radius: 0 var(--am-radius) var(--am-radius) 0;
}

.am-contact-female-note svg {
    color: var(--am-gold);
    flex-shrink: 0;
    margin-top: 2px;
}

.am-contact-female-note p {
    font-size: 13px !important;
    color: var(--am-grey) !important;
    line-height: 1.7 !important;
    margin: 0 !important;
}


/* ── NATIVE FORM STYLES ── */

.am-contact-cf7-wrap,
.am-contact-native-form {
    background: var(--am-white);
    border: 1px solid rgba(201, 168, 76, 0.12);
    border-radius: var(--am-radius-lg);
    padding: 36px 32px;
}

/* CF7 overrides — style CF7 to match our design language */
.am-contact-cf7-wrap .wpcf7-form {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.am-contact-cf7-wrap label,
.am-contact-cf7-wrap .wpcf7-form-control-wrap {
    display: block;
    width: 100%;
}

/* Shared field styles */
.am-contact-field-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    margin-bottom: 20px;
}

.am-contact-field {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-bottom: 20px;
}

.am-contact-field label,
.am-contact-cf7-wrap label {
    font-size: 10px !important;
    letter-spacing: 0.12em !important;
    text-transform: uppercase !important;
    font-weight: 600 !important;
    color: var(--am-grey) !important;
}

.am-contact-field label span {
    color: var(--am-gold);
}

.am-contact-field input,
.am-contact-field textarea,
.am-contact-field select,
.am-contact-cf7-wrap input[type="text"],
.am-contact-cf7-wrap input[type="email"],
.am-contact-cf7-wrap input[type="tel"],
.am-contact-cf7-wrap textarea,
.am-contact-cf7-wrap select {
    width: 100%;
    padding: 13px 16px !important;
    border: 1px solid #E2DDD6 !important;
    border-radius: var(--am-radius) !important;
    font-family: var(--am-font-body) !important;
    font-size: 14px !important;
    color: var(--am-black) !important;
    background: var(--am-off-white) !important;
    transition: border-color var(--am-duration) var(--am-ease),
                box-shadow var(--am-duration) var(--am-ease) !important;
    outline: none !important;
    -webkit-appearance: none;
    appearance: none;
}

.am-contact-field input:focus,
.am-contact-field textarea:focus,
.am-contact-field select:focus,
.am-contact-cf7-wrap input:focus,
.am-contact-cf7-wrap textarea:focus,
.am-contact-cf7-wrap select:focus {
    border-color: var(--am-gold) !important;
    box-shadow: 0 0 0 3px rgba(201, 168, 76, 0.08) !important;
    background: var(--am-white) !important;
}

.am-contact-field input::placeholder,
.am-contact-field textarea::placeholder,
.am-contact-cf7-wrap input::placeholder,
.am-contact-cf7-wrap textarea::placeholder {
    color: var(--am-light-grey) !important;
}

.am-contact-field textarea {
    resize: vertical;
    min-height: 140px;
}

/* Select arrow */
.am-contact-field select {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23C9A84C' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 14px center !important;
    padding-right: 40px !important;
    cursor: pointer;
}

/* Checkbox field */
.am-contact-field--check {
    margin-bottom: 24px;
}

.am-contact-checkbox-label {
    display: flex !important;
    align-items: flex-start !important;
    gap: 10px !important;
    cursor: pointer;
    text-transform: none !important;
    letter-spacing: 0 !important;
    font-size: 13px !important;
    color: var(--am-grey) !important;
    line-height: 1.6 !important;
}

.am-contact-checkbox-label input[type="checkbox"] {
    width: 18px !important;
    height: 18px !important;
    min-width: 18px;
    margin-top: 1px !important;
    padding: 0 !important;
    border: 1px solid rgba(201, 168, 76, 0.3) !important;
    border-radius: 3px !important;
    background: var(--am-white) !important;
    cursor: pointer;
    accent-color: var(--am-gold);
}

/* Submit button */
.am-contact-native-form .am-btn-full {
    margin-bottom: 16px;
}

/* CF7 submit override */
.am-contact-cf7-wrap .wpcf7-submit {
    width: 100%;
    padding: 16px 24px !important;
    background: var(--am-gold) !important;
    color: var(--am-black) !important;
    border: 2px solid var(--am-gold) !important;
    font-family: var(--am-font-body) !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    letter-spacing: 0.16em !important;
    text-transform: uppercase !important;
    border-radius: var(--am-radius) !important;
    cursor: pointer !important;
    transition: all var(--am-duration) var(--am-ease) !important;
    margin-top: 8px;
}

.am-contact-cf7-wrap .wpcf7-submit:hover {
    background: var(--am-gold-deep) !important;
    border-color: var(--am-gold-deep) !important;
}

/* CF7 success / error messages */
.am-contact-cf7-wrap .wpcf7-response-output {
    margin: 12px 0 0 !important;
    padding: 12px 16px !important;
    font-size: 13px !important;
    border-radius: var(--am-radius) !important;
    border: none !important;
}

.am-contact-cf7-wrap .wpcf7-mail-sent-ok {
    background: var(--am-success-bg) !important;
    color: var(--am-success) !important;
    border-left: 3px solid #22C55E !important;
}

.am-contact-cf7-wrap .wpcf7-validation-errors,
.am-contact-cf7-wrap .wpcf7-mail-sent-ng {
    background: var(--am-error-bg) !important;
    color: var(--am-error) !important;
    border-left: 3px solid #EF4444 !important;
}

.am-contact-form-privacy {
    font-size: 11px;
    color: var(--am-light-grey);
    line-height: 1.6;
    margin: 0;
    text-align: center;
}

.am-contact-form-privacy a {
    color: var(--am-gold);
    text-decoration: underline;
    text-underline-offset: 2px;
}


/* ── VISIT US — address + map ── */

.am-contact-visit {
    padding: var(--am-space-3xl) 0;
    background: var(--am-off-white);
}

.am-contact-visit-inner {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: start;
}

.am-contact-address-block .am-about-h2 {
    margin-bottom: 24px;
}

.am-contact-address {
    font-style: normal;
    font-size: 14px;
    line-height: 1.9;
    color: var(--am-grey);
    margin-bottom: 0;
    display: block;
}

.am-contact-address strong {
    display: block;
    font-size: 13px;
    font-weight: 600;
    color: var(--am-black);
    letter-spacing: 0.02em;
    margin-bottom: 4px;
}

/* English address */
.am-contact-address--en {
    padding-bottom: 20px;
    margin-bottom: 20px;
    border-bottom: 1px solid rgba(201, 168, 76, 0.1);
}

/* Arabic address */
.am-contact-address--ar {
    font-family: var(--am-font-arabic);
    font-size: 15px;
    line-height: 2;
    color: var(--am-grey);
    padding-bottom: 24px;
    margin-bottom: 24px;
    border-bottom: 1px solid rgba(201, 168, 76, 0.1);
}

/* Contact detail rows */
.am-contact-address-details {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-bottom: 24px;
}

.am-contact-detail-row {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 13px;
    color: var(--am-grey);
}

.am-contact-detail-row svg {
    color: var(--am-gold);
    flex-shrink: 0;
}

.am-contact-detail-row a {
    color: var(--am-gold);
    text-decoration: none;
    font-weight: 500;
    transition: color var(--am-duration) var(--am-ease);
}

.am-contact-detail-row a:hover {
    color: var(--am-gold-light);
}

/* Vault visit note */
.am-contact-vault-visit-note {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 14px 16px;
    background: rgba(201, 168, 76, 0.04);
    border: 1px solid rgba(201, 168, 76, 0.12);
    border-radius: var(--am-radius);
}

.am-contact-vault-visit-note svg {
    color: var(--am-gold);
    flex-shrink: 0;
    margin-top: 2px;
}

.am-contact-vault-visit-note p {
    font-size: 12px;
    color: var(--am-grey);
    line-height: 1.7;
    margin: 0;
}

/* Map */
.am-contact-map-wrap {
    position: relative;
    border-radius: var(--am-radius-lg);
    overflow: hidden;
    border: 1px solid rgba(201, 168, 76, 0.15);
}

.am-contact-map-placeholder {
    width: 100%;
    height: 420px;
    background: var(--am-dark);
}

.am-contact-map-placeholder iframe {
    display: block;
    width: 100%;
    height: 100%;
    filter: grayscale(20%) contrast(1.05);
}

/* Overlay label on map */
.am-contact-map-overlay-label {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 12px 20px;
    background: rgba(10, 10, 10, 0.85);
    backdrop-filter: blur(8px);
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.08em;
    color: var(--am-gold);
}

.am-contact-map-overlay-label svg {
    color: var(--am-gold);
}


/* ── CAREERS ── */

.am-contact-careers {
    padding: var(--am-space-3xl) 0;
}

.am-contact-careers-inner {
    display: grid;
    grid-template-columns: 1fr 340px;
    gap: 80px;
    align-items: center;
}

.am-contact-careers-text p {
    font-size: 15px;
    color: var(--am-light-grey);
    line-height: 1.85;
    margin-bottom: 16px;
}

.am-contact-careers-text p:last-child {
    margin-bottom: 0;
}

.am-contact-careers-email-card {
    border: 1px solid rgba(201, 168, 76, 0.2);
    border-radius: var(--am-radius-lg);
    padding: 40px 32px;
    text-align: center;
    background: rgba(201, 168, 76, 0.04);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
}

.am-contact-careers-label {
    font-size: 10px;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--am-grey);
    font-weight: 600;
}

.am-contact-careers-address {
    font-family: var(--am-font-display);
    font-size: 22px;
    font-weight: 400;
    color: var(--am-gold);
    text-decoration: none;
    letter-spacing: 0.02em;
    transition: color var(--am-duration) var(--am-ease);
    line-height: 1.3;
}

.am-contact-careers-address:hover {
    color: var(--am-gold-light);
}

.am-contact-careers-note {
    font-size: 11px;
    color: var(--am-grey);
    letter-spacing: 0.04em;
}


/* ══════════════════════════════════════════════════════════════
   CONTACT RESPONSIVE
══════════════════════════════════════════════════════════════ */

/* Tablet */
@media (max-width: 1024px) {

    .am-contact-channels-grid {
        grid-template-columns: 1fr;
        gap: 10px;
    }

    .am-contact-form-layout {
        grid-template-columns: 1fr;
        gap: 40px;
    }

    .am-contact-visit-inner {
        grid-template-columns: 1fr;
        gap: 40px;
    }

    .am-contact-careers-inner {
        grid-template-columns: 1fr;
        gap: 40px;
    }

    .am-contact-careers-email-card {
        max-width: 400px;
    }

    .am-contact-map-placeholder {
        height: 300px;
    }
}

/* Portrait tablet */
@media (max-width: 850px) {

    .am-contact-hero {
        min-height: auto;
        padding: var(--am-space-3xl) 20px var(--am-space-2xl);
    }

    .am-contact-prompts-grid {
        grid-template-columns: 1fr;
    }
}

/* Phone */
@media (max-width: 640px) {

    .am-contact-headline {
        font-size: clamp(36px, 11vw, 60px);
    }

    .am-contact-field-row {
        grid-template-columns: 1fr;
    }

    .am-contact-cf7-wrap,
    .am-contact-native-form {
        padding: 24px 20px;
    }

    .am-contact-channels-grid {
        gap: 8px;
    }

    .am-contact-channel-card {
        padding: 18px 16px;
    }

    .am-contact-channel-icon {
        width: 44px;
        height: 44px;
    }

    .am-contact-channel-value {
        font-size: 13px;
    }

    .am-contact-careers-email-card {
        padding: 28px 20px;
    }

    .am-contact-careers-address {
        font-size: 18px;
    }

    .am-contact-map-placeholder {
        height: 240px;
    }
}


/* ── RTL support (WPML Arabic) ── */

[dir="rtl"] .am-contact-channel-card {
    flex-direction: row-reverse;
}

[dir="rtl"] .am-contact-channel-arrow {
    transform: scaleX(-1);
}

[dir="rtl"] .am-contact-channel-card:hover .am-contact-channel-arrow {
    transform: scaleX(-1) translateX(-3px);
}

[dir="rtl"] .am-contact-female-note {
    flex-direction: row-reverse;
    border-left: none;
    border-right: 3px solid var(--am-gold);
    border-radius: var(--am-radius) 0 0 var(--am-radius);
    text-align: right;
}

[dir="rtl"] .am-contact-vault-visit-note {
    flex-direction: row-reverse;
    text-align: right;
}

[dir="rtl"] .am-contact-detail-row {
    flex-direction: row-reverse;
    text-align: right;
}

[dir="rtl"] .am-contact-form-layout {
    direction: rtl;
}

[dir="rtl"] .am-contact-field label {
    text-align: right;
}

[dir="rtl"] .am-contact-field input,
[dir="rtl"] .am-contact-field textarea,
[dir="rtl"] .am-contact-field select {
    text-align: right;
    font-family: var(--am-font-arabic) !important;
}

[dir="rtl"] .am-contact-checkbox-label {
    flex-direction: row-reverse;
}

[dir="rtl"] .am-contact-prompt {
    flex-direction: row-reverse;
    text-align: right;
}

[dir="rtl"] .am-contact-careers-inner {
    direction: rtl;
}

[dir="rtl"] .am-contact-map-overlay-label {
    flex-direction: row-reverse;
}

[dir="rtl"] .am-contact-address--en {
    /* Keep English address LTR even in RTL context */
    direction: ltr;
    text-align: left;
}
















/* ══════════════════════════════════════════════════════════════
   RETURNS & REFUNDS — page-refunds.php
   Append this entire block to the bottom of page-content.css
   ══════════════════════════════════════════════════════════════ */


/* ── REFUNDS HERO ── */

.am-refunds-hero {
    background: var(--am-black) !important;
    min-height: 52vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: var(--am-space-4xl) var(--am-space-xl) var(--am-space-3xl);
    position: relative;
    overflow: hidden;
    z-index: 1;
}

.am-refunds-hero::before {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(ellipse 55% 50% at 50% 75%, rgba(201, 168, 76, 0.05) 0%, transparent 65%);
    pointer-events: none;
    z-index: 0;
}

.am-refunds-hero-inner {
    position: relative;
    z-index: 1;
    max-width: 720px;
    width: 100%;
}

.am-refunds-headline {
    font-family: var(--am-font-display);
    font-size: clamp(44px, 7vw, 84px);
    font-weight: 300;
    color: var(--am-white);
    line-height: 1.05;
    letter-spacing: -0.025em;
    margin: 16px 0 24px;
}

.am-refunds-subhead {
    font-size: clamp(14px, 1.6vw, 16px);
    color: var(--am-light-grey);
    line-height: 1.85;
    max-width: 560px;
    margin: 0 auto 36px;
    font-weight: 300;
}

/* Policy status strip */
.am-refunds-status-strip {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
}

.am-refunds-status-item {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.06em;
    padding: 7px 16px;
    border-radius: var(--am-radius-pill);
    white-space: nowrap;
}

.am-refunds-status-item--no {
    background: rgba(239, 68, 68, 0.08);
    border: 1px solid rgba(239, 68, 68, 0.2);
    color: #FCA5A5;
}

.am-refunds-status-item--no svg {
    stroke: #EF4444;
}

.am-refunds-status-item--yes {
    background: rgba(34, 197, 94, 0.08);
    border: 1px solid rgba(34, 197, 94, 0.2);
    color: #86EFAC;
}

.am-refunds-status-item--yes svg {
    stroke: #22C55E;
}


/* ── POLICY LAYOUT — text + summary card ── */

.am-refunds-policy-layout {
    display: grid;
    grid-template-columns: 1fr 360px;
    gap: 80px;
    align-items: start;
}

.am-refunds-policy-text p {
    font-size: 15px;
    color: var(--am-grey);
    line-height: 1.9;
    margin-bottom: 18px;
}

.am-refunds-policy-text p:last-child {
    margin-bottom: 0;
}

/* Summary card */
.am-refunds-policy-card {
    border: 1px solid rgba(201, 168, 76, 0.15);
    border-radius: var(--am-radius-lg);
    overflow: hidden;
    background: var(--am-white);
    position: sticky;
    top: 100px;
}

.am-refunds-policy-card-header {
    background: var(--am-black);
    color: var(--am-gold);
    font-size: 10px;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    font-weight: 700;
    padding: 14px 20px;
    text-align: center;
}

.am-refunds-policy-card-body {
    padding: 0;
}

.am-refunds-policy-row {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 13px 18px;
    border-bottom: 1px solid rgba(201, 168, 76, 0.06);
    transition: background var(--am-duration) var(--am-ease);
}

.am-refunds-policy-row:last-child {
    border-bottom: none;
}

.am-refunds-policy-row:hover {
    background: var(--am-off-white);
}

.am-refunds-policy-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    flex-shrink: 0;
}

.am-refunds-policy-dot--no  { background: #EF4444; }
.am-refunds-policy-dot--yes { background: #22C55E; }

.am-refunds-policy-row strong {
    display: block;
    font-size: 12px;
    font-weight: 600;
    color: var(--am-black);
    margin-bottom: 2px;
}

.am-refunds-policy-row span:last-child {
    display: block;
    font-size: 11px;
    color: var(--am-grey);
    line-height: 1.4;
}

.am-refunds-policy-card-footer {
    background: var(--am-off-white);
    padding: 10px 18px;
    font-size: 10px;
    color: var(--am-light-grey);
    letter-spacing: 0.06em;
    text-align: center;
    border-top: 1px solid rgba(201, 168, 76, 0.08);
}

.am-refunds-policy-card-footer time {
    font-weight: 500;
}


/* ── WHAT IS COVERED — 2 exception cards ── */

.am-refunds-covered-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
    margin-bottom: 24px;
}

.am-refunds-covered-card {
    background: var(--am-white);
    border: 1px solid rgba(201, 168, 76, 0.12);
    border-top: 3px solid #22C55E;
    border-radius: var(--am-radius);
    padding: 36px 32px;
    display: flex;
    flex-direction: column;
    gap: 0;
    transition: box-shadow var(--am-duration) var(--am-ease);
}

.am-refunds-covered-card:hover {
    box-shadow: 0 8px 32px rgba(34, 197, 94, 0.08);
}

.am-refunds-covered-icon {
    color: #22C55E;
    margin-bottom: 16px;
    display: block;
}

.am-refunds-covered-card h3 {
    font-family: var(--am-font-display);
    font-size: 22px;
    font-weight: 400;
    color: var(--am-black);
    margin: 0 0 12px;
}

.am-refunds-covered-card p {
    font-size: 14px;
    color: var(--am-grey);
    line-height: 1.85;
    margin: 0 0 20px;
    flex: 1;
}

/* Step list */
.am-refunds-covered-steps {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 16px 18px;
    background: rgba(34, 197, 94, 0.04);
    border: 1px solid rgba(34, 197, 94, 0.12);
    border-radius: var(--am-radius);
    counter-reset: covered-steps;
}

.am-refunds-covered-steps span {
    font-size: 12px;
    color: var(--am-grey);
    line-height: 1.5;
    padding-left: 2px;
}

.am-refunds-covered-note {
    font-size: 13px;
    color: var(--am-light-grey);
    line-height: 1.7;
    font-style: italic;
    padding: 16px 20px;
    background: rgba(201, 168, 76, 0.04);
    border-left: 2px solid rgba(201, 168, 76, 0.2);
    border-radius: 0 var(--am-radius) var(--am-radius) 0;
    margin: 0;
}


/* ── ALTERNATIVES — A / B / C ── */

.am-refunds-alternatives {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1px;
    background: rgba(201, 168, 76, 0.1);
    border: 1px solid rgba(201, 168, 76, 0.1);
    border-radius: var(--am-radius);
    overflow: hidden;
}

.am-refunds-alternative {
    background: var(--am-off-white);
    padding: 40px 32px;
    display: flex;
    flex-direction: column;
    gap: 0;
    transition: background var(--am-duration) var(--am-ease);
}

.am-refunds-alternative:hover {
    background: var(--am-white);
}

.am-refunds-alt-num {
    font-family: var(--am-font-display);
    font-size: 52px;
    font-weight: 300;
    color: rgba(201, 168, 76, 0.2);
    line-height: 1;
    margin-bottom: 16px;
    letter-spacing: -0.02em;
}

.am-refunds-alt-content h3 {
    font-family: var(--am-font-display);
    font-size: 20px;
    font-weight: 400;
    color: var(--am-black);
    margin: 0 0 12px;
}

.am-refunds-alt-content p {
    font-size: 13px;
    color: var(--am-grey);
    line-height: 1.85;
    margin: 0 0 16px;
    flex: 1;
}


/* ── CUSTOMS FLOW DIAGRAM ── */

.am-refunds-customs-note {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 14px 16px;
    background: rgba(201, 168, 76, 0.04);
    border: 1px solid rgba(201, 168, 76, 0.12);
    border-left: 3px solid var(--am-gold);
    border-radius: 0 var(--am-radius) var(--am-radius) 0;
    margin: 20px 0 0;
}

.am-refunds-customs-note svg {
    color: var(--am-gold);
    flex-shrink: 0;
    margin-top: 2px;
}

.am-refunds-customs-note p {
    font-size: 13px;
    color: var(--am-grey);
    line-height: 1.7;
    margin: 0;
}

/* Flow diagram */
.am-refunds-customs-flow {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0;
    padding: 40px 32px;
    background: var(--am-white);
    border: 1px solid rgba(201, 168, 76, 0.12);
    border-radius: var(--am-radius-lg);
}

.am-refunds-flow-step {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 20px;
    background: var(--am-off-white);
    border: 1px solid rgba(201, 168, 76, 0.1);
    border-radius: var(--am-radius);
    width: 100%;
    font-size: 13px;
    color: var(--am-black);
    font-weight: 500;
}

.am-refunds-flow-icon {
    color: var(--am-gold);
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: rgba(201, 168, 76, 0.08);
    border-radius: 50%;
}

.am-refunds-flow-arrow {
    font-size: 18px;
    color: rgba(201, 168, 76, 0.4);
    padding: 6px 0;
    line-height: 1;
}

.am-refunds-flow-fork {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    gap: 8px;
    width: 100%;
    align-items: center;
}

.am-refunds-flow-or {
    font-size: 10px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--am-grey);
    font-weight: 600;
    text-align: center;
}


/* ── CUSTOM MINTING TABLE ── */

.am-refunds-custom-inner {
    display: grid;
    grid-template-columns: 1fr 360px;
    gap: 80px;
    align-items: start;
}

.am-refunds-custom-text p {
    font-size: 15px;
    color: var(--am-grey);
    line-height: 1.85;
    margin-bottom: 16px;
}

.am-refunds-custom-table {
    border: 1px solid rgba(201, 168, 76, 0.12);
    border-radius: var(--am-radius);
    overflow: hidden;
    background: var(--am-white);
}

.am-refunds-custom-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 14px 20px;
    border-bottom: 1px solid rgba(201, 168, 76, 0.07);
    font-size: 13px;
    gap: 16px;
}

.am-refunds-custom-row:last-child {
    border-bottom: none;
}

.am-refunds-custom-row > span:first-child {
    color: var(--am-grey);
}

.am-refunds-custom-status {
    font-size: 11px;
    font-weight: 700;
    padding: 4px 12px;
    border-radius: var(--am-radius-pill);
    white-space: nowrap;
    letter-spacing: 0.06em;
}

.am-refunds-custom-status--no {
    background: rgba(239, 68, 68, 0.08);
    color: #EF4444;
}

.am-refunds-custom-status--case {
    background: rgba(201, 168, 76, 0.1);
    color: var(--am-gold);
}


/* ── SELL-BACK VISUAL ── */

.am-refunds-sellback-visual {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 380px;
}

.am-refunds-sellback-badge {
    border: 1px solid rgba(201, 168, 76, 0.25);
    background: rgba(201, 168, 76, 0.04);
    border-radius: var(--am-radius-lg);
    padding: 48px 40px;
    text-align: center;
    width: 100%;
    max-width: 300px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
}

.am-refunds-sellback-label {
    font-size: 11px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--am-gold);
    font-weight: 700;
}

.am-refunds-sellback-sub {
    font-size: 11px;
    color: var(--am-grey);
    letter-spacing: 0.06em;
}

.am-refunds-sellback-divider {
    width: 40px;
    height: 1px;
    background: rgba(201, 168, 76, 0.2);
    margin: 4px 0;
}

.am-refunds-sellback-rates {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
}

.am-refunds-sellback-rates span {
    font-size: 12px;
    color: var(--am-light-grey);
    line-height: 1.6;
}

.am-refunds-sellback-currencies {
    display: flex;
    gap: 8px;
    margin-top: 4px;
}

.am-refunds-sellback-currencies span {
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.1em;
    color: var(--am-gold);
    padding: 4px 12px;
    border: 1px solid rgba(201, 168, 76, 0.2);
    border-radius: var(--am-radius-pill);
}

/* Sell-back numbered steps */
.am-refunds-sellback-steps {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-top: 24px;
    padding: 20px 24px;
    border: 1px solid rgba(201, 168, 76, 0.15);
    border-radius: var(--am-radius);
    background: rgba(201, 168, 76, 0.04);
}

.am-refunds-sellback-step {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    font-size: 13px;
    color: var(--am-light-grey);
    line-height: 1.5;
}

.am-refunds-sellback-step-num {
    font-family: var(--am-font-display);
    font-size: 18px;
    font-weight: 300;
    color: var(--am-gold);
    line-height: 1;
    flex-shrink: 0;
    min-width: 18px;
}


/* ── ESTATE SECTION ── */

.am-refunds-estate {
    padding: var(--am-space-3xl) 0;
}

.am-refunds-estate-inner {
    display: grid;
    grid-template-columns: 1fr 320px;
    gap: 80px;
    align-items: start;
}

.am-refunds-estate-text p {
    font-size: 15px;
    color: var(--am-grey);
    line-height: 1.85;
    margin-bottom: 16px;
}

.am-refunds-estate-docs {
    list-style: none;
    padding: 0;
    margin: 0 0 20px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 16px 20px;
    background: var(--am-white);
    border: 1px solid rgba(201, 168, 76, 0.12);
    border-radius: var(--am-radius);
}

.am-refunds-estate-docs li {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font-size: 13px;
    color: var(--am-grey);
    line-height: 1.6;
}

.am-refunds-estate-docs li::before {
    content: '—';
    color: var(--am-gold);
    font-weight: 700;
    flex-shrink: 0;
}

.am-refunds-estate-hadith {
    border: 1px solid rgba(201, 168, 76, 0.15);
    border-radius: var(--am-radius-lg);
    padding: 36px 28px;
    text-align: center;
    background: var(--am-white);
}

.am-refunds-estate-note {
    margin-top: 20px;
    padding-top: 20px;
    border-top: 1px solid rgba(201, 168, 76, 0.1);
    font-size: 12px;
    color: var(--am-grey);
    line-height: 1.7;
}


/* ══════════════════════════════════════════════════════════════
   REFUNDS RESPONSIVE
══════════════════════════════════════════════════════════════ */

/* Tablet */
@media (max-width: 1024px) {

    .am-refunds-policy-layout {
        grid-template-columns: 1fr;
        gap: 40px;
    }

    .am-refunds-policy-card {
        position: static;
        max-width: 480px;
    }

    .am-refunds-alternatives {
        grid-template-columns: 1fr;
    }

    .am-refunds-custom-inner {
        grid-template-columns: 1fr;
        gap: 40px;
    }

    .am-refunds-custom-table {
        max-width: 480px;
    }

    .am-refunds-estate-inner {
        grid-template-columns: 1fr;
        gap: 40px;
    }

    .am-refunds-estate-hadith {
        max-width: 400px;
    }
}

/* Portrait tablet */
@media (max-width: 850px) {

    .am-refunds-hero {
        min-height: auto;
        padding: var(--am-space-3xl) 20px var(--am-space-2xl);
    }

    .am-refunds-covered-grid {
        grid-template-columns: 1fr;
    }

    .am-refunds-status-strip {
        flex-direction: column;
        align-items: center;
    }

    .am-refunds-flow-fork {
        grid-template-columns: 1fr;
        gap: 6px;
    }

    .am-refunds-flow-or {
        text-align: left;
        padding: 4px 0;
    }
}

/* Phone */
@media (max-width: 640px) {

    .am-refunds-headline {
        font-size: clamp(36px, 11vw, 60px);
    }

    .am-refunds-covered-card {
        padding: 28px 22px;
    }

    .am-refunds-alternative {
        padding: 28px 24px;
    }

    .am-refunds-sellback-badge {
        padding: 32px 24px;
    }

    .am-refunds-customs-flow {
        padding: 24px 20px;
    }

    .am-refunds-flow-step {
        font-size: 12px;
        padding: 12px 14px;
    }

    .am-refunds-estate-docs {
        padding: 14px 16px;
    }
}


/* ── RTL support (WPML Arabic) ── */

[dir="rtl"] .am-refunds-status-strip {
    direction: rtl;
}

[dir="rtl"] .am-refunds-status-item {
    flex-direction: row-reverse;
}

[dir="rtl"] .am-refunds-policy-row {
    flex-direction: row-reverse;
    text-align: right;
}

[dir="rtl"] .am-refunds-covered-note {
    border-left: none;
    border-right: 2px solid rgba(201, 168, 76, 0.2);
    border-radius: var(--am-radius) 0 0 var(--am-radius);
}

[dir="rtl"] .am-refunds-customs-note {
    flex-direction: row-reverse;
    border-left: none;
    border-right: 3px solid var(--am-gold);
    border-radius: var(--am-radius) 0 0 var(--am-radius);
    text-align: right;
}

[dir="rtl"] .am-refunds-flow-step {
    flex-direction: row-reverse;
    text-align: right;
}

[dir="rtl"] .am-refunds-sellback-step {
    flex-direction: row-reverse;
    text-align: right;
}

[dir="rtl"] .am-refunds-alternative {
    text-align: right;
}

[dir="rtl"] .am-refunds-covered-steps {
    text-align: right;
}

[dir="rtl"] .am-refunds-estate-docs li {
    flex-direction: row-reverse;
    text-align: right;
}

[dir="rtl"] .am-refunds-custom-row {
    flex-direction: row-reverse;
}













































/* ══════════════════════════════════════════════════════════════
   LEGAL PAGES — page-terms.php & page-privacy.php
   Append this entire block to the bottom of page-content.css
   ══════════════════════════════════════════════════════════════ */


/* ── LEGAL HERO ── */

.am-legal-hero {
    background: var(--am-black) !important;
    min-height: 38vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: var(--am-space-4xl) var(--am-space-xl) var(--am-space-3xl);
    position: relative;
    overflow: hidden;
    z-index: 1;
}

.am-legal-hero::before {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(ellipse 50% 50% at 50% 80%, rgba(201, 168, 76, 0.05) 0%, transparent 65%);
    pointer-events: none;
    z-index: 0;
}

.am-legal-hero-inner {
    position: relative;
    z-index: 1;
    max-width: 720px;
    width: 100%;
}

.am-legal-headline {
    font-family: var(--am-font-display);
    font-size: clamp(36px, 5.5vw, 68px);
    font-weight: 300;
    color: var(--am-white);
    line-height: 1.08;
    letter-spacing: -0.02em;
    margin: 16px 0 20px;
}

.am-legal-subhead {
    font-size: clamp(13px, 1.5vw, 15px);
    color: var(--am-light-grey);
    line-height: 1.85;
    max-width: 580px;
    margin: 0 auto;
    font-weight: 300;
}


/* ── META STRIP ── */

.am-legal-meta-strip {
    background: var(--am-near-black);
    border-top: 1px solid rgba(201, 168, 76, 0.08);
    border-bottom: 1px solid rgba(201, 168, 76, 0.08);
    padding: 16px 0;
}

.am-legal-meta-inner {
    display: flex;
    gap: 0;
    justify-content: space-between;
    flex-wrap: wrap;
}

.am-legal-meta-item {
    display: flex;
    flex-direction: column;
    gap: 3px;
    padding: 10px 24px 10px 0;
}

.am-legal-meta-label {
    font-size: 9px;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--am-gold);
    font-weight: 700;
}

.am-legal-meta-value {
    font-size: 13px;
    color: var(--am-light-grey);
    font-weight: 400;
}

.am-legal-meta-value a {
    color: var(--am-gold);
    text-decoration: none;
    transition: color var(--am-duration) var(--am-ease);
}

.am-legal-meta-value a:hover {
    color: var(--am-gold-light);
}


/* ── BODY LAYOUT — sidebar + article ── */

.am-legal-body {
    padding: var(--am-space-3xl) 0 var(--am-space-4xl);
    background: var(--am-off-white);
}

.am-legal-layout {
    display: grid;
    grid-template-columns: 220px 1fr;
    gap: 56px;
    align-items: start;
}


/* ── TABLE OF CONTENTS SIDEBAR ── */

.am-legal-toc {
    position: sticky;
    top: 100px;
}

.am-legal-toc-inner {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.am-legal-toc-label {
    display: block;
    font-size: 9px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--am-gold);
    font-weight: 700;
    margin-bottom: 14px;
    padding-bottom: 12px;
    border-bottom: 1px solid rgba(201, 168, 76, 0.12);
}

.am-legal-toc nav {
    display: flex;
    flex-direction: column;
    gap: 1px;
    margin-bottom: 28px;
}

.am-legal-toc-link {
    display: block;
    padding: 8px 10px;
    font-size: 12px;
    color: var(--am-grey);
    text-decoration: none;
    border-radius: var(--am-radius);
    border-left: 2px solid transparent;
    line-height: 1.4;
    transition: all var(--am-duration) var(--am-ease);
}

.am-legal-toc-link:hover,
.am-legal-toc-link.active {
    color: var(--am-black);
    background: var(--am-white);
    border-left-color: var(--am-gold);
}

.am-legal-toc-cta {
    padding: 18px 16px;
    background: var(--am-cream);
    border: 1px solid rgba(201, 168, 76, 0.1);
    border-radius: var(--am-radius);
    text-align: center;
}

.am-legal-toc-cta p {
    font-size: 12px;
    color: var(--am-grey);
    line-height: 1.5;
    margin: 0 0 12px;
}


/* ── LEGAL ARTICLE CONTENT ── */

.am-legal-content {
    max-width: 720px;
}

/* Sections */
.am-legal-section {
    padding: var(--am-space-xl) 0;
    border-bottom: 1px solid rgba(201, 168, 76, 0.08);
    scroll-margin-top: 100px;
}

.am-legal-section:first-child {
    padding-top: 0;
}

.am-legal-section:last-child {
    border-bottom: none;
}

/* Highlight section (e.g. No Refund Policy, Data Sharing) */
.am-legal-section--highlight {
    background: rgba(201, 168, 76, 0.03);
    padding: var(--am-space-xl) 24px;
    border: 1px solid rgba(201, 168, 76, 0.1);
    border-radius: var(--am-radius);
    margin: var(--am-space-xl) 0;
    border-bottom: 1px solid rgba(201, 168, 76, 0.1);
}

/* Intro paragraphs */
.am-legal-intro-text {
    font-size: 15px;
    color: var(--am-grey);
    line-height: 1.9;
    margin-bottom: 14px;
}

.am-legal-intro-text strong {
    color: var(--am-black);
}

/* H2 section headings */
.am-legal-h2 {
    display: flex;
    align-items: baseline;
    gap: 14px;
    font-family: var(--am-font-display);
    font-size: clamp(20px, 2.5vw, 28px);
    font-weight: 400;
    color: var(--am-black);
    margin: 0 0 18px;
    line-height: 1.2;
    letter-spacing: 0.01em;
}

.am-legal-num {
    font-family: var(--am-font-display);
    font-size: 32px;
    font-weight: 300;
    color: rgba(201, 168, 76, 0.25);
    line-height: 1;
    flex-shrink: 0;
    min-width: 28px;
}

/* H3 sub-headings (cookie categories etc.) */
.am-legal-h3 {
    font-family: var(--am-font-display);
    font-size: 18px;
    font-weight: 400;
    color: var(--am-black);
    margin: 28px 0 12px;
    letter-spacing: 0.01em;
}

/* Body text */
.am-legal-content p {
    font-size: 14px;
    color: var(--am-grey);
    line-height: 1.9;
    margin-bottom: 14px;
}

.am-legal-content p strong {
    color: var(--am-black);
}

/* Lists */
.am-legal-list {
    list-style: none;
    padding: 0;
    margin: 0 0 16px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.am-legal-list li {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font-size: 14px;
    color: var(--am-grey);
    line-height: 1.7;
}

.am-legal-list li::before {
    content: '–';
    color: var(--am-gold);
    font-weight: 700;
    flex-shrink: 0;
    margin-top: 1px;
}

.am-legal-list li strong {
    color: var(--am-black);
}

/* Nested lists */
.am-legal-list--nested {
    margin: 8px 0 0 20px;
}

.am-legal-list--nested li::before {
    content: '·';
    font-size: 16px;
}

/* Compact list for cookie cards */
.am-legal-list--compact {
    gap: 5px;
}

.am-legal-list--compact li {
    font-size: 12px;
}

/* Note text */
.am-legal-note {
    font-size: 12px !important;
    color: var(--am-light-grey) !important;
    font-style: italic;
    padding: 12px 16px;
    background: var(--am-cream);
    border-radius: var(--am-radius);
    margin-top: 8px;
    line-height: 1.7 !important;
}

/* "Last Updated" */
.am-legal-updated {
    font-size: 12px;
    color: var(--am-light-grey);
    margin-top: 20px;
}

/* "See also" link */
.am-legal-see-also {
    font-size: 12px;
    color: var(--am-grey);
    margin-top: 12px;
    display: flex;
    align-items: center;
    gap: 6px;
}

.am-legal-see-also a {
    color: var(--am-gold);
    text-decoration: underline;
    text-underline-offset: 2px;
}

/* Info table (company details etc.) */
.am-legal-info-table {
    border: 1px solid rgba(201, 168, 76, 0.12);
    border-radius: var(--am-radius);
    overflow: hidden;
    background: var(--am-white);
    margin-bottom: 16px;
}

.am-legal-info-row {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 16px;
    padding: 13px 20px;
    border-bottom: 1px solid rgba(201, 168, 76, 0.06);
    font-size: 13px;
}

.am-legal-info-row:last-child {
    border-bottom: none;
}

.am-legal-info-row span {
    color: var(--am-grey);
    flex-shrink: 0;
    min-width: 100px;
}

.am-legal-info-row strong {
    color: var(--am-black);
    font-weight: 500;
    text-align: right;
}

.am-legal-info-row strong a {
    color: var(--am-gold);
    text-decoration: none;
}

.am-legal-info-row strong a:hover {
    color: var(--am-gold-light);
}


/* ── TECHNOLOGY GRID (Privacy page) ── */

.am-legal-tech-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1px;
    background: rgba(201, 168, 76, 0.08);
    border: 1px solid rgba(201, 168, 76, 0.08);
    border-radius: var(--am-radius);
    overflow: hidden;
    margin-bottom: 12px;
}

.am-legal-tech-item {
    background: var(--am-white);
    padding: 16px 18px;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.am-legal-tech-item strong {
    font-size: 12px;
    font-weight: 600;
    color: var(--am-black);
    letter-spacing: 0.01em;
}

.am-legal-tech-item span {
    font-size: 12px;
    color: var(--am-grey);
    line-height: 1.6;
}


/* ── COOKIE POLICY CARDS ── */

.am-legal-cookies-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
    margin-bottom: 28px;
}

.am-legal-cookie-card {
    border-radius: var(--am-radius);
    overflow: hidden;
    border: 1px solid rgba(201, 168, 76, 0.1);
    background: var(--am-white);
}

.am-legal-cookie-card-header {
    padding: 14px 18px;
    display: flex;
    align-items: center;
    gap: 10px;
    border-bottom: 1px solid rgba(201, 168, 76, 0.08);
    background: var(--am-off-white);
}

.am-legal-cookie-card-header h4 {
    font-size: 13px;
    font-weight: 600;
    color: var(--am-black);
    margin: 0;
    letter-spacing: 0.01em;
}

.am-legal-cookie-card p {
    font-size: 12px !important;
    padding: 14px 18px 10px !important;
    margin: 0 !important;
    color: var(--am-grey) !important;
    line-height: 1.7 !important;
}

.am-legal-cookie-card .am-legal-list {
    padding: 0 18px 16px;
    margin: 0;
}

/* Cookie type badges */
.am-legal-cookie-badge {
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    padding: 3px 9px;
    border-radius: var(--am-radius-pill);
    white-space: nowrap;
    flex-shrink: 0;
}

.am-legal-cookie-badge--essential  { background: rgba(34, 197, 94, 0.1);  color: #16A34A; }
.am-legal-cookie-badge--analytics  { background: rgba(59, 130, 246, 0.1); color: #2563EB; }
.am-legal-cookie-badge--functional { background: rgba(168, 85, 247, 0.1); color: #7C3AED; }
.am-legal-cookie-badge--security   { background: rgba(201, 168, 76, 0.1); color: var(--am-gold-deep); }


/* ── LEGAL CONTACT STRIP ── */

.am-legal-contact {
    padding: var(--am-space-3xl) 0;
}

.am-legal-contact-inner {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 60px;
    align-items: center;
}

.am-legal-contact-inner p {
    font-size: 15px;
    color: var(--am-light-grey);
    line-height: 1.8;
    margin: 0;
}

.am-legal-contact-actions {
    display: flex;
    gap: 12px;
    flex-shrink: 0;
}


/* ══════════════════════════════════════════════════════════════
   LEGAL RESPONSIVE
══════════════════════════════════════════════════════════════ */

/* Tablet */
@media (max-width: 1024px) {

    .am-legal-layout {
        grid-template-columns: 1fr;
        gap: 32px;
    }

    .am-legal-toc {
        position: static;
    }

    /* Convert ToC to horizontal scroll pill strip on tablet */
    .am-legal-toc-inner {
        flex-direction: row;
        align-items: center;
        gap: 0;
        overflow-x: auto;
        scrollbar-width: none;
        padding-bottom: 4px;
    }

    .am-legal-toc-inner::-webkit-scrollbar { display: none; }

    .am-legal-toc-label {
        display: none; /* hide on mobile — replaced by scroll context */
    }

    .am-legal-toc nav {
        flex-direction: row;
        gap: 6px;
        flex-wrap: nowrap;
        overflow-x: auto;
        margin-bottom: 0;
        padding-bottom: 0;
        scrollbar-width: none;
    }

    .am-legal-toc-link {
        white-space: nowrap;
        border-left: none;
        border: 1px solid rgba(201, 168, 76, 0.15);
        border-radius: var(--am-radius-pill);
        padding: 6px 14px;
        font-size: 11px;
    }

    .am-legal-toc-link:hover,
    .am-legal-toc-link.active {
        background: var(--am-black);
        border-color: var(--am-black);
        color: var(--am-gold);
    }

    .am-legal-toc-cta {
        display: none; /* hide sidebar CTA on mobile */
    }

    .am-legal-contact-inner {
        grid-template-columns: 1fr;
        gap: 28px;
    }

    .am-legal-contact-actions {
        flex-wrap: wrap;
    }

    .am-legal-tech-grid {
        grid-template-columns: 1fr;
    }
}

/* Portrait tablet */
@media (max-width: 850px) {

    .am-legal-hero {
        min-height: auto;
        padding: var(--am-space-3xl) 20px var(--am-space-2xl);
    }

    .am-legal-meta-inner {
        gap: 16px;
    }

    .am-legal-meta-item {
        padding: 6px 0;
    }

    .am-legal-cookies-grid {
        grid-template-columns: 1fr;
    }
}

/* Phone */
@media (max-width: 640px) {

    .am-legal-headline {
        font-size: clamp(30px, 9vw, 48px);
    }

    .am-legal-meta-inner {
        flex-direction: column;
        gap: 8px;
    }

    .am-legal-info-row {
        flex-direction: column;
        gap: 4px;
    }

    .am-legal-info-row strong {
        text-align: left;
    }

    .am-legal-h2 {
        font-size: 20px;
        gap: 10px;
    }

    .am-legal-num {
        font-size: 26px;
        min-width: 24px;
    }

    .am-legal-section--highlight {
        padding: var(--am-space-lg) 16px;
    }

    .am-legal-contact-actions {
        flex-direction: column;
    }

    .am-legal-contact-actions .am-btn {
        width: 100%;
        justify-content: center;
    }
}


/* ── RTL support (WPML Arabic) ── */

[dir="rtl"] .am-legal-toc-link {
    border-left: none;
    border-right: 2px solid transparent;
    text-align: right;
}

[dir="rtl"] .am-legal-toc-link:hover,
[dir="rtl"] .am-legal-toc-link.active {
    border-right-color: var(--am-gold);
}

[dir="rtl"] .am-legal-h2 {
    flex-direction: row-reverse;
}

[dir="rtl"] .am-legal-list li {
    flex-direction: row-reverse;
    text-align: right;
}

[dir="rtl"] .am-legal-info-row {
    flex-direction: row-reverse;
    text-align: right;
}

[dir="rtl"] .am-legal-info-row strong {
    text-align: left;
}

[dir="rtl"] .am-legal-cookie-card-header {
    flex-direction: row-reverse;
}

[dir="rtl"] .am-legal-tech-item {
    text-align: right;
}

[dir="rtl"] .am-legal-see-also {
    flex-direction: row-reverse;
}

[dir="rtl"] .am-legal-meta-inner {
    direction: rtl;
}

[dir="rtl"] .am-legal-content p,
[dir="rtl"] .am-legal-content li,
[dir="rtl"] .am-legal-intro-text {
    font-family: var(--am-font-arabic);
    line-height: 2;
    text-align: right;
}

[dir="rtl"] .am-legal-h2,
[dir="rtl"] .am-legal-h3 {
    font-family: var(--am-font-arabic);
    letter-spacing: 0;
}




























/* ══════════════════════════════════════════════════════════════
   AMANAH WEALTH PROGRAMME — page-awp.php
   Append this entire block to the bottom of page-content.css
   ══════════════════════════════════════════════════════════════ */


/* ── AWP HERO ── */

.am-awp-hero {
    background: var(--am-black) !important;
    min-height: 90vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: var(--am-space-4xl) var(--am-space-xl) var(--am-space-3xl);
    position: relative;
    overflow: hidden;
    z-index: 1;
}

/* Grid lines texture */
.am-awp-hero-bg {
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
}

.am-awp-hero-grid-lines {
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(rgba(201,168,76,0.04) 1px, transparent 1px),
        linear-gradient(90deg, rgba(201,168,76,0.04) 1px, transparent 1px);
    background-size: 60px 60px;
}

.am-awp-hero-orb {
    position: absolute;
    border-radius: 50%;
    filter: blur(80px);
    pointer-events: none;
}

.am-awp-hero-orb--1 {
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(201,168,76,0.12) 0%, transparent 70%);
    top: -100px;
    left: -100px;
}

.am-awp-hero-orb--2 {
    width: 400px;
    height: 400px;
    background: radial-gradient(circle, rgba(201,168,76,0.08) 0%, transparent 70%);
    bottom: -80px;
    right: -80px;
}

.am-awp-hero-inner {
    position: relative;
    z-index: 1;
    max-width: 900px;
    width: 100%;
}

/* Badge */
.am-awp-hero-eyebrow {
    margin-bottom: 24px;
}

.am-awp-hero-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 10px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    font-weight: 600;
    color: var(--am-gold);
    padding: 8px 20px;
    border: 1px solid rgba(201,168,76,0.3);
    border-radius: var(--am-radius-pill);
    background: rgba(201,168,76,0.06);
}

/* Headline — three stacked lines, alternating gold */
.am-awp-headline {
    display: flex;
    flex-direction: column;
    gap: 4px;
    font-family: var(--am-font-display);
    font-size: clamp(48px, 8vw, 100px);
    font-weight: 300;
    line-height: 1.0;
    letter-spacing: -0.03em;
    margin: 0 0 28px;
}

.am-awp-headline-top {
    color: var(--am-white);
}

.am-awp-headline-mid {
    background: var(--am-gold-shimmer);
    background-size: 200% auto;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    animation: shimmer 5s linear infinite;
}

.am-awp-headline-bot {
    color: var(--am-white);
}

.am-awp-subhead {
    font-size: clamp(14px, 1.7vw, 17px);
    color: var(--am-light-grey);
    line-height: 1.85;
    max-width: 680px;
    margin: 0 auto 36px;
    font-weight: 300;
}

.am-awp-hero-ctas {
    display: flex;
    gap: 14px;
    justify-content: center;
    flex-wrap: wrap;
    margin-bottom: 48px;
}

/* Hero stat strip */
.am-awp-hero-stats {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0;
    flex-wrap: wrap;
    border: 1px solid rgba(201,168,76,0.12);
    border-radius: var(--am-radius);
    background: rgba(255,255,255,0.02);
    max-width: 760px;
    margin: 0 auto;
    overflow: hidden;
}

.am-awp-hero-stat {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 20px 28px;
    gap: 4px;
}

.am-awp-hero-stat-num {
    font-family: var(--am-font-display);
    font-size: clamp(22px, 3vw, 32px);
    font-weight: 300;
    color: var(--am-gold);
    line-height: 1;
    letter-spacing: -0.02em;
}

.am-awp-hero-stat-lbl {
    font-size: 9px;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--am-grey);
    font-weight: 600;
    text-align: center;
    line-height: 1.4;
}

.am-awp-hero-stat-div {
    width: 1px;
    height: 40px;
    background: rgba(201,168,76,0.15);
    flex-shrink: 0;
}


/* ── TRUST BAR ── */

.am-awp-trust-bar {
    background: var(--am-near-black);
    padding: var(--am-space-xl) 0;
    border-top: 1px solid rgba(201,168,76,0.08);
    border-bottom: 1px solid rgba(201,168,76,0.08);
}

.am-awp-trust-grid {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 1px;
    background: rgba(201,168,76,0.06);
}

.am-awp-trust-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 8px;
    padding: 24px 16px;
    background: var(--am-near-black);
    transition: background var(--am-duration) var(--am-ease);
}

.am-awp-trust-item:hover {
    background: rgba(201,168,76,0.04);
}

.am-awp-trust-item svg {
    color: var(--am-gold);
    flex-shrink: 0;
}

.am-awp-trust-item strong {
    display: block;
    font-size: 11px;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--am-white);
    font-weight: 600;
}

.am-awp-trust-item span {
    display: block;
    font-size: 11px;
    color: var(--am-grey);
    line-height: 1.6;
}


/* ── WHAT IS AWP — spec card ── */

.am-awp-what-visual {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 380px;
}

.am-awp-what-card {
    border: 1px solid rgba(201,168,76,0.2);
    border-radius: var(--am-radius-lg);
    overflow: hidden;
    width: 100%;
    max-width: 380px;
    background: var(--am-white);
}

.am-awp-what-card-header {
    background: var(--am-black);
    padding: 14px 20px;
    text-align: center;
}

.am-awp-what-card-label {
    font-size: 10px;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--am-gold);
    font-weight: 700;
}

.am-awp-what-card-rows {
    padding: 0;
}

.am-awp-what-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    padding: 12px 20px;
    border-bottom: 1px solid rgba(201,168,76,0.07);
    font-size: 12px;
}

.am-awp-what-row:last-child {
    border-bottom: none;
}

.am-awp-what-row span {
    color: var(--am-grey);
    flex-shrink: 0;
}

.am-awp-what-row strong {
    color: var(--am-black);
    font-weight: 600;
    text-align: right;
}

.am-awp-green {
    color: #22C55E !important;
}

.am-awp-what-card-footer {
    background: var(--am-off-white);
    padding: 10px 20px;
    text-align: center;
    font-size: 10px;
    color: var(--am-gold);
    letter-spacing: 0.1em;
    border-top: 1px solid rgba(201,168,76,0.1);
}


/* ── AUDIENCE GRID — 4 cards ── */

.am-awp-audience-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1px;
    background: rgba(201,168,76,0.1);
    border: 1px solid rgba(201,168,76,0.1);
    border-radius: var(--am-radius);
    overflow: hidden;
}

.am-awp-audience-card {
    background: var(--am-cream);
    padding: 40px 28px;
    display: flex;
    flex-direction: column;
    gap: 0;
    transition: background var(--am-duration) var(--am-ease);
}

.am-awp-audience-card:hover {
    background: var(--am-white);
}

.am-awp-audience-icon {
    color: var(--am-gold);
    margin-bottom: 20px;
    display: block;
}

.am-awp-audience-card h3 {
    font-family: var(--am-font-display);
    font-size: 20px;
    font-weight: 400;
    color: var(--am-black);
    margin: 0 0 12px;
    line-height: 1.3;
}

.am-awp-audience-card p {
    font-size: 13px;
    color: var(--am-grey);
    line-height: 1.85;
    margin: 0 0 20px;
    flex: 1;
}

.am-awp-audience-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: auto;
}

.am-awp-audience-tags span {
    font-size: 10px;
    letter-spacing: 0.07em;
    color: var(--am-gold);
    background: rgba(201,168,76,0.08);
    border: 1px solid rgba(201,168,76,0.18);
    padding: 3px 10px;
    border-radius: var(--am-radius-pill);
    font-weight: 500;
}


/* ── HOW IT WORKS — 4 steps ── */

.am-awp-steps {
    display: flex;
    align-items: flex-start;
    gap: 0;
    margin-top: var(--am-space-xl);
}

.am-awp-step {
    flex: 1;
    padding: 40px 32px;
    background: var(--am-white);
    border: 1px solid rgba(201,168,76,0.1);
    border-radius: var(--am-radius);
    display: flex;
    flex-direction: column;
    gap: 0;
    transition: border-color var(--am-duration) var(--am-ease),
                box-shadow var(--am-duration) var(--am-ease);
}

.am-awp-step:hover {
    border-color: rgba(201,168,76,0.3);
    box-shadow: var(--am-shadow-gold);
}

.am-awp-step-num {
    font-family: var(--am-font-display);
    font-size: 44px;
    font-weight: 300;
    color: rgba(201,168,76,0.18);
    line-height: 1;
    margin-bottom: 14px;
}

.am-awp-step-icon {
    color: var(--am-gold);
    margin-bottom: 18px;
    display: block;
}

.am-awp-step h3 {
    font-family: var(--am-font-display);
    font-size: 20px;
    font-weight: 400;
    color: var(--am-black);
    margin: 0 0 10px;
}

.am-awp-step p {
    font-size: 13px;
    color: var(--am-grey);
    line-height: 1.85;
    margin: 0;
}

.am-awp-step-connector {
    display: flex;
    align-items: center;
    justify-content: center;
    color: rgba(201,168,76,0.3);
    font-size: 20px;
    padding: 0 6px;
    flex-shrink: 0;
    margin-top: 80px;
}


/* ── PERFORMANCE SECTION ── */

.am-awp-performance {
    padding: var(--am-space-3xl) 0;
}

.am-awp-perf-stats {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0;
    flex-wrap: wrap;
    margin-bottom: 40px;
    border: 1px solid rgba(201,168,76,0.12);
    border-radius: var(--am-radius);
    overflow: hidden;
    background: rgba(255,255,255,0.02);
}

.am-awp-perf-stat {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 24px 36px;
    gap: 6px;
    flex: 1;
}

.am-awp-perf-num {
    font-family: var(--am-font-display);
    font-size: clamp(28px, 4vw, 44px);
    font-weight: 300;
    line-height: 1;
    letter-spacing: -0.02em;
}

.am-awp-perf-num--up   { color: #22C55E; }
.am-awp-perf-num--down { color: #EF4444; }

.am-awp-perf-lbl {
    font-size: 10px;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--am-grey);
    font-weight: 600;
    text-align: center;
    line-height: 1.5;
}

.am-awp-perf-div {
    width: 1px;
    height: 48px;
    background: rgba(201,168,76,0.1);
    flex-shrink: 0;
    align-self: center;
}

/* Chart */
.am-awp-chart-wrap {
    border: 1px solid rgba(201,168,76,0.12);
    border-radius: var(--am-radius-lg);
    overflow: hidden;
    background: rgba(255,255,255,0.02);
}

.am-awp-chart-label {
    padding: 14px 20px;
    font-size: 10px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--am-gold);
    font-weight: 700;
    border-bottom: 1px solid rgba(201,168,76,0.1);
    background: rgba(201,168,76,0.04);
}

.am-awp-chart {
    padding: 20px;
}

.am-awp-chart svg {
    width: 100%;
    height: auto;
    display: block;
}

.am-awp-chart-disclaimer {
    padding: 14px 20px;
    font-size: 11px;
    color: var(--am-grey);
    line-height: 1.6;
    border-top: 1px solid rgba(201,168,76,0.08);
    margin: 0;
    font-style: italic;
}


/* ── PRICING — 3 tiers ── */

.am-awp-pricing {
    padding: var(--am-space-3xl) 0;
}

.am-awp-pricing-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    margin-bottom: 24px;
}

.am-awp-price-card {
    background: var(--am-off-white);
    border: 1px solid rgba(201,168,76,0.12);
    border-radius: var(--am-radius-lg);
    padding: 40px 32px;
    display: flex;
    flex-direction: column;
    gap: 0;
    position: relative;
    transition: border-color var(--am-duration) var(--am-ease),
                box-shadow var(--am-duration) var(--am-ease);
}

.am-awp-price-card:hover {
    border-color: rgba(201,168,76,0.3);
    box-shadow: var(--am-shadow-gold);
}

.am-awp-price-card--featured {
    background: var(--am-black);
    border-color: rgba(201,168,76,0.4);
    border-width: 2px;
}

.am-awp-price-card--featured:hover {
    border-color: var(--am-gold);
}

.am-awp-price-badge {
    position: absolute;
    top: -13px;
    left: 50%;
    transform: translateX(-50%);
    background: var(--am-gold);
    color: var(--am-black);
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    padding: 4px 16px;
    border-radius: var(--am-radius-pill);
    white-space: nowrap;
}

.am-awp-price-tier {
    font-size: 10px;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--am-gold);
    font-weight: 700;
    margin-bottom: 14px;
}

.am-awp-price-val {
    font-family: var(--am-font-display);
    font-size: 40px;
    font-weight: 300;
    line-height: 1;
    margin-bottom: 16px;
}

.am-awp-price-card .am-awp-price-val {
    color: var(--am-black);
}

.am-awp-price-card--featured .am-awp-price-val {
    color: var(--am-white);
}

.am-awp-price-from {
    font-family: var(--am-font-body);
    font-size: 13px;
    color: var(--am-grey);
    font-weight: 400;
    margin-right: 4px;
}

.am-awp-price-per {
    font-family: var(--am-font-body);
    font-size: 13px;
    color: var(--am-grey);
    font-weight: 400;
    margin-left: 4px;
}

.am-awp-price-desc {
    font-size: 13px;
    line-height: 1.8;
    margin: 0 0 20px;
    padding-bottom: 20px;
    border-bottom: 1px solid rgba(201,168,76,0.08);
}

.am-awp-price-card .am-awp-price-desc { color: var(--am-grey); }
.am-awp-price-card--featured .am-awp-price-desc { color: var(--am-light-grey); border-bottom-color: rgba(255,255,255,0.06); }

.am-awp-price-list {
    list-style: none;
    padding: 0;
    margin: 0 0 28px;
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.am-awp-price-list li {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font-size: 13px;
    line-height: 1.5;
}

.am-awp-price-card .am-awp-price-list li { color: var(--am-grey); }
.am-awp-price-card--featured .am-awp-price-list li { color: var(--am-light-grey); }

.am-awp-price-list li::before {
    content: '✓';
    color: var(--am-gold);
    font-size: 11px;
    font-weight: 700;
    flex-shrink: 0;
    margin-top: 1px;
}

.am-awp-price-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
}

.am-awp-pricing-note {
    text-align: center;
    font-size: 13px;
    color: var(--am-grey);
    line-height: 1.7;
    margin: 0;
    padding: 16px 20px;
    background: var(--am-cream);
    border: 1px solid rgba(201,168,76,0.1);
    border-radius: var(--am-radius);
}


/* ── TESTIMONIALS ── */

.am-awp-testimonials {
    padding: var(--am-space-3xl) 0;
}

.am-awp-testi-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}

.am-awp-testi {
    background: var(--am-white);
    border: 1px solid rgba(201,168,76,0.12);
    border-radius: var(--am-radius-lg);
    padding: 40px 32px;
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 0;
    transition: box-shadow var(--am-duration) var(--am-ease);
    margin: 0;
}

.am-awp-testi:hover {
    box-shadow: var(--am-shadow-gold);
}

.am-awp-testi--dark {
    background: var(--am-black);
    border-color: rgba(201,168,76,0.2);
}

.am-awp-testi-quote {
    font-family: var(--am-font-display);
    font-size: 80px;
    color: rgba(201,168,76,0.15);
    line-height: 0.7;
    margin-bottom: 16px;
    height: 40px;
    overflow: hidden;
}

.am-awp-testi--dark .am-awp-testi-quote {
    color: rgba(201,168,76,0.2);
}

.am-awp-testi-text {
    font-size: 14px;
    line-height: 1.85;
    margin: 0 0 24px;
    flex: 1;
}

.am-awp-testi .am-awp-testi-text { color: var(--am-grey); }
.am-awp-testi--dark .am-awp-testi-text { color: var(--am-light-grey); }

.am-awp-testi-footer {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    padding-top: 20px;
    border-top: 1px solid rgba(201,168,76,0.1);
    flex-wrap: wrap;
}

.am-awp-testi--dark .am-awp-testi-footer {
    border-top-color: rgba(201,168,76,0.1);
}

.am-awp-testi-avatar {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: var(--am-gold);
    color: var(--am-black);
    font-family: var(--am-font-display);
    font-size: 18px;
    font-weight: 400;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.am-awp-testi-avatar--masjid,
.am-awp-testi-avatar--mosque {
    background: rgba(201,168,76,0.15);
    color: var(--am-gold);
    font-family: var(--am-font-arabic);
}

.am-awp-testi-author {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.am-awp-testi-name {
    display: block;
    font-size: 13px;
    font-weight: 600;
    color: var(--am-black);
}

.am-awp-testi--dark .am-awp-testi-name { color: var(--am-white); }

.am-awp-testi-role {
    display: block;
    font-size: 11px;
    color: var(--am-grey);
    line-height: 1.5;
}

.am-awp-testi-tag {
    display: block;
    font-size: 9px;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--am-gold);
    font-weight: 700;
    margin-top: 4px;
}

/* Result box */
.am-awp-testi-result {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 2px;
    text-align: right;
    flex-shrink: 0;
}

.am-awp-testi-result-num {
    font-family: var(--am-font-display);
    font-size: 22px;
    font-weight: 400;
    color: var(--am-gold);
    line-height: 1;
}

.am-awp-testi-result-lbl {
    font-size: 10px;
    color: var(--am-grey);
    line-height: 1.4;
}


/* ── COMPARISON TABLE ── */

.am-awp-comparison {
    padding: var(--am-space-3xl) 0;
}

.am-awp-comp-table {
    border: 1px solid rgba(201,168,76,0.12);
    border-radius: var(--am-radius);
    overflow: hidden;
}

.am-awp-comp-row {
    display: grid;
    grid-template-columns: 2fr 1.2fr 1fr 1fr 1fr;
    border-bottom: 1px solid rgba(201,168,76,0.07);
}

.am-awp-comp-row:last-child {
    border-bottom: none;
}

.am-awp-comp-row--header {
    background: var(--am-black);
}

.am-awp-comp-row--alt {
    background: rgba(201,168,76,0.02);
}

.am-awp-comp-cell {
    padding: 14px 18px;
    font-size: 13px;
    color: var(--am-grey);
    border-right: 1px solid rgba(201,168,76,0.06);
    display: flex;
    align-items: center;
}

.am-awp-comp-cell:last-child {
    border-right: none;
}

.am-awp-comp-row--header .am-awp-comp-cell {
    font-size: 10px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    font-weight: 700;
    padding: 14px 18px;
    border-right-color: rgba(255,255,255,0.05);
}

.am-awp-comp-cell--feature {
    font-weight: 500;
    color: var(--am-black);
}

.am-awp-comp-row--header .am-awp-comp-cell--feature {
    color: var(--am-light-grey);
}

/* AWP column gets highlight */
.am-awp-comp-cell--awp {
    background: rgba(201,168,76,0.05);
}

.am-awp-comp-row--header .am-awp-comp-cell--awp {
    background: rgba(201,168,76,0.12);
    color: var(--am-gold);
}

/* Tick/cross values */
.am-awp-comp-val {
    font-size: 16px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
}

.am-awp-comp-val--yes     { color: #22C55E; }
.am-awp-comp-val--no      { color: #EF4444; }
.am-awp-comp-val--neutral { color: var(--am-light-grey); font-size: 13px; font-weight: 400; }


/* ── FAQ (reuses global FAQ styles — just the inner wrap) ── */

.am-awp-faq-inner {
    max-width: 840px;
    margin: 0 auto;
}


/* ── APPLY / CTA SECTION ── */

.am-awp-apply {
    padding: var(--am-space-3xl) 0;
}

.am-awp-apply-inner {
    display: grid;
    grid-template-columns: 1fr 480px;
    gap: 80px;
    align-items: start;
}

.am-awp-apply-text p {
    font-size: 15px;
    color: var(--am-light-grey);
    line-height: 1.85;
    margin: 0 0 28px;
}

/* Contact channels in CTA */
.am-awp-apply-channels {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.am-awp-apply-channel {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 18px 20px;
    border: 1px solid rgba(201,168,76,0.15);
    border-radius: var(--am-radius);
    text-decoration: none;
    background: rgba(255,255,255,0.03);
    transition: all var(--am-duration) var(--am-ease);
}

.am-awp-apply-channel:hover {
    border-color: rgba(201,168,76,0.35);
    background: rgba(201,168,76,0.05);
}

.am-awp-apply-channel svg {
    color: var(--am-gold);
    flex-shrink: 0;
    width: 20px;
    height: 20px;
}

.am-awp-apply-channel-lbl {
    display: block;
    font-size: 9px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--am-gold);
    font-weight: 700;
    margin-bottom: 2px;
}

.am-awp-apply-channel-val {
    display: block;
    font-size: 14px;
    color: var(--am-white);
    font-weight: 400;
}

/* Form card */
.am-awp-apply-form-card {
    background: var(--am-white);
    border: 1px solid rgba(201,168,76,0.15);
    border-radius: var(--am-radius-lg);
    padding: 36px 32px;
}

.am-awp-apply-form-title {
    font-family: var(--am-font-display);
    font-size: 22px;
    font-weight: 400;
    color: var(--am-black);
    margin: 0 0 24px;
    padding-bottom: 16px;
    border-bottom: 1px solid rgba(201,168,76,0.1);
}

/* Native form inherits .am-contact-field styles from contact page CSS */
.am-awp-native-form .am-contact-field {
    margin-bottom: 16px;
}

.am-awp-native-form .am-contact-field:last-of-type {
    margin-bottom: 20px;
}


/* ══════════════════════════════════════════════════════════════
   AWP RESPONSIVE
══════════════════════════════════════════════════════════════ */

/* Tablet */
@media (max-width: 1024px) {

    .am-awp-trust-grid {
        grid-template-columns: repeat(3, 1fr);
    }

    .am-awp-audience-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .am-awp-steps {
        flex-direction: column;
        gap: 16px;
    }

    .am-awp-step-connector {
        transform: rotate(90deg);
        margin: 0 auto;
        padding: 4px 0;
    }

    .am-awp-pricing-grid {
        grid-template-columns: 1fr;
        max-width: 500px;
        margin-left: auto;
        margin-right: auto;
    }

    .am-awp-testi-grid {
        grid-template-columns: 1fr;
    }

    .am-awp-comp-row {
        grid-template-columns: 1.5fr 1.2fr 1fr 1fr;
    }

    /* Hide ISA column on tablet */
    .am-awp-comp-row > *:nth-child(4) { display: none; }

    .am-awp-apply-inner {
        grid-template-columns: 1fr;
        gap: 40px;
    }

    .am-awp-perf-stats {
        flex-direction: column;
        border: none;
        gap: 0;
    }

    .am-awp-perf-stat {
        border: 1px solid rgba(201,168,76,0.1);
        border-radius: var(--am-radius);
        margin-bottom: 8px;
    }

    .am-awp-perf-div { display: none; }
}

/* Portrait tablet */
@media (max-width: 850px) {

    .am-awp-hero {
        min-height: auto;
        padding: var(--am-space-3xl) 20px var(--am-space-2xl);
    }

    .am-awp-hero-stats {
        flex-direction: column;
    }

    .am-awp-hero-stat-div {
        width: 48px;
        height: 1px;
    }

    .am-awp-trust-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .am-awp-comp-row {
        grid-template-columns: 1fr 1fr;
    }

    /* Show only feature + AWP on mobile */
    .am-awp-comp-row > *:nth-child(3),
    .am-awp-comp-row > *:nth-child(4),
    .am-awp-comp-row > *:nth-child(5) { display: none; }

    .am-awp-what-visual {
        min-height: auto;
    }
}

/* Phone */
@media (max-width: 640px) {

    .am-awp-headline {
        font-size: clamp(38px, 12vw, 64px);
    }

    .am-awp-trust-grid {
        grid-template-columns: 1fr;
    }

    .am-awp-audience-grid {
        grid-template-columns: 1fr;
    }

    .am-awp-audience-card {
        padding: 28px 24px;
    }

    .am-awp-step {
        padding: 28px 24px;
    }

    .am-awp-testi {
        padding: 28px 24px;
    }

    .am-awp-testi-footer {
        flex-direction: column;
        gap: 12px;
    }

    .am-awp-testi-result {
        align-items: flex-start;
        text-align: left;
    }

    .am-awp-apply-form-card {
        padding: 24px 20px;
    }

    .am-awp-hero-stats {
        max-width: 100%;
    }
}


/* ── RTL support (WPML Arabic) ── */

[dir="rtl"] .am-awp-trust-item {
    text-align: right;
}

[dir="rtl"] .am-awp-audience-card {
    text-align: right;
}

[dir="rtl"] .am-awp-audience-tags {
    justify-content: flex-end;
}

[dir="rtl"] .am-awp-step {
    text-align: right;
}

[dir="rtl"] .am-awp-steps {
    flex-direction: row-reverse;
}

[dir="rtl"] .am-awp-what-row {
    flex-direction: row-reverse;
}

[dir="rtl"] .am-awp-what-row strong {
    text-align: left;
}

[dir="rtl"] .am-awp-comp-row {
    direction: rtl;
}

[dir="rtl"] .am-awp-testi-footer {
    flex-direction: row-reverse;
}

[dir="rtl"] .am-awp-testi-result {
    align-items: flex-start;
    text-align: left;
}

[dir="rtl"] .am-awp-hero-stats {
    direction: rtl;
}

[dir="rtl"] .am-awp-price-list li {
    flex-direction: row-reverse;
    text-align: right;
}

[dir="rtl"] .am-awp-apply-channel {
    flex-direction: row-reverse;
    text-align: right;
}


























/* ══════════════════════════════════════════════════════════════
   HISTORY PAGE — page-history.php
   Append this entire block to the bottom of page-content.css
   ══════════════════════════════════════════════════════════════ */


/* ── HISTORY HERO ── */

.am-history-hero {
    background: var(--am-black) !important;
    min-height: 68vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: var(--am-space-4xl) var(--am-space-xl) var(--am-space-3xl);
    position: relative;
    overflow: hidden;
    z-index: 1;
}

.am-history-hero::before {
    content: '';
    position: absolute;
    inset: 0;
    background:
        radial-gradient(ellipse 70% 55% at 50% 75%, rgba(201, 168, 76, 0.08) 0%, transparent 65%),
        radial-gradient(ellipse 30% 20% at 80% 15%, rgba(201, 168, 76, 0.03) 0%, transparent 60%);
    pointer-events: none;
    z-index: 0;
}

.am-history-hero-inner {
    position: relative;
    z-index: 1;
    max-width: 860px;
    width: 100%;
}

.am-history-headline {
    font-family: var(--am-font-display);
    font-size: clamp(44px, 7vw, 96px);
    font-weight: 300;
    color: var(--am-white);
    line-height: 1.0;
    letter-spacing: -0.025em;
    margin: 16px 0 24px;
}

.am-history-subhead {
    font-size: clamp(14px, 1.7vw, 17px);
    color: var(--am-light-grey);
    line-height: 1.85;
    max-width: 660px;
    margin: 0 auto 36px;
    font-weight: 300;
}

.am-history-hero-ctas {
    display: flex;
    gap: 16px;
    justify-content: center;
    flex-wrap: wrap;
}


/* ── QURANIC ANCHOR ── */

.am-history-statement {
    background: var(--am-off-white);
    padding: var(--am-space-3xl) 0;
    text-align: center;
}

.am-history-statement-body {
    max-width: 760px;
    margin: 24px auto 0;
    font-size: 15px;
    color: var(--am-grey);
    line-height: 1.9;
    font-style: italic;
}


/* ── CHAPTER SECTIONS ── */

.am-history-chapter {
    scroll-margin-top: 80px;
}

/* Roman numeral ghost behind chapter heading */
.am-history-chapter-num {
    font-family: var(--am-font-display);
    font-size: 80px;
    font-weight: 300;
    color: rgba(201, 168, 76, 0.1);
    line-height: 1;
    margin-bottom: 4px;
    letter-spacing: -0.02em;
}

.am-history-chapter-num--light {
    color: rgba(255, 255, 255, 0.07);
}


/* ── PULL STAT — the "1971" year callout ── */

.am-history-pull-stat {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    border: 1px solid rgba(201, 168, 76, 0.2);
    border-radius: var(--am-radius-lg);
    padding: 56px 40px;
    background: rgba(201, 168, 76, 0.03);
    height: 100%;
    min-height: 300px;
}

.am-history-pull-stat--light {
    border-color: rgba(201, 168, 76, 0.2);
    background: rgba(201, 168, 76, 0.04);
}

.am-history-pull-year {
    display: block;
    font-family: var(--am-font-display);
    font-size: clamp(64px, 10vw, 120px);
    font-weight: 300;
    color: var(--am-gold);
    line-height: 1;
    letter-spacing: -0.03em;
    margin-bottom: 20px;
}

.am-history-pull-label {
    display: block;
    font-size: 14px;
    color: var(--am-grey);
    line-height: 1.7;
    max-width: 260px;
    margin: 0 auto;
}

.am-history-pull-stat--light .am-history-pull-label {
    color: var(--am-light-grey);
}


/* ── AMANAH COVENANT SECTION ── */

.am-history-covenant-inner {
    max-width: 800px;
    margin: 0 auto;
    text-align: center;
}

.am-history-covenant-inner p {
    font-size: 15px;
    color: var(--am-grey);
    line-height: 1.9;
    margin-bottom: 18px;
    text-align: left;
}

.am-history-internal-quote {
    margin: 36px 0;
    padding: 28px 32px;
    border: 1px solid rgba(201, 168, 76, 0.18);
    border-left: 3px solid var(--am-gold);
    border-radius: 0 var(--am-radius) var(--am-radius) 0;
    background: rgba(201, 168, 76, 0.03);
    text-align: right;
}

.am-history-internal-quote .am-about-arabic {
    margin-bottom: 12px;
}

.am-history-internal-quote cite {
    display: block;
    font-style: italic;
    font-family: var(--am-font-display);
    font-size: 14px;
    color: var(--am-grey);
    line-height: 1.8;
    text-align: left;
}

.am-history-internal-quote cite em {
    color: var(--am-gold);
    font-style: normal;
}

.am-history-covenant-ctas {
    display: flex;
    gap: 16px;
    justify-content: center;
    flex-wrap: wrap;
    margin-top: 36px;
}


/* ══════════════════════════════════════════════════════════════
   HISTORY RESPONSIVE
══════════════════════════════════════════════════════════════ */

@media (max-width: 850px) {
    .am-history-hero {
        min-height: auto;
        padding: var(--am-space-3xl) 20px var(--am-space-2xl);
    }
    .am-history-pull-stat {
        min-height: auto;
        padding: 36px 28px;
    }
}

@media (max-width: 640px) {
    .am-history-headline {
        font-size: clamp(36px, 12vw, 60px);
    }
    .am-history-hero-ctas {
        flex-direction: column;
        align-items: center;
    }
    .am-history-hero-ctas .am-btn,
    .am-history-hero-ctas .am-btn-ghost {
        width: 100%;
        max-width: 320px;
        justify-content: center;
    }
    .am-history-pull-year {
        font-size: clamp(56px, 18vw, 96px);
    }
    .am-history-internal-quote {
        padding: 20px 20px;
    }
    .am-history-covenant-ctas {
        flex-direction: column;
        align-items: center;
    }
    .am-history-covenant-ctas .am-btn,
    .am-history-covenant-ctas .am-btn-ghost {
        width: 100%;
        max-width: 320px;
        justify-content: center;
    }
}

/* ── RTL support ── */
[dir="rtl"] .am-history-hero-ctas { direction: rtl; }
[dir="rtl"] .am-history-covenant-inner p { text-align: right; }
[dir="rtl"] .am-history-internal-quote {
    border-left: none;
    border-right: 3px solid var(--am-gold);
    border-radius: var(--am-radius) 0 0 var(--am-radius);
    text-align: left;
}
[dir="rtl"] .am-history-internal-quote cite { text-align: right; }
[dir="rtl"] .am-history-covenant-ctas { direction: rtl; }


/* ══════════════════════════════════════════════════════════════
   HALLMARK & CRAFTSMANSHIP PAGE — page-hallmark.php
   Append this entire block to the bottom of page-content.css
   ══════════════════════════════════════════════════════════════ */


/* ── HALLMARK HERO ── */

.am-hallmark-hero {
    background: var(--am-black) !important;
    min-height: 65vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: var(--am-space-4xl) var(--am-space-xl) var(--am-space-3xl);
    position: relative;
    overflow: hidden;
    z-index: 1;
}

.am-hallmark-hero::before {
    content: '';
    position: absolute;
    inset: 0;
    background:
        radial-gradient(ellipse 65% 50% at 50% 70%, rgba(201, 168, 76, 0.09) 0%, transparent 65%),
        radial-gradient(ellipse 25% 20% at 20% 20%, rgba(201, 168, 76, 0.03) 0%, transparent 60%);
    pointer-events: none;
    z-index: 0;
}

.am-hallmark-hero-inner {
    position: relative;
    z-index: 1;
    max-width: 800px;
    width: 100%;
}

.am-hallmark-headline {
    font-family: var(--am-font-display);
    font-size: clamp(44px, 7.5vw, 96px);
    font-weight: 300;
    color: var(--am-white);
    line-height: 1.0;
    letter-spacing: -0.025em;
    margin: 16px 0 24px;
}

.am-hallmark-subhead {
    font-size: clamp(14px, 1.7vw, 17px);
    color: var(--am-light-grey);
    line-height: 1.85;
    max-width: 620px;
    margin: 0 auto 36px;
    font-weight: 300;
}

.am-hallmark-hero-ctas {
    display: flex;
    gap: 16px;
    justify-content: center;
    flex-wrap: wrap;
}


/* ── PHILOSOPHY INTRO ── */

.am-hallmark-intro {
    background: var(--am-off-white);
    padding: var(--am-space-3xl) 0;
}

.am-hallmark-intro-inner {
    max-width: 780px;
    margin: 0 auto;
    text-align: center;
}

.am-hallmark-intro-body {
    font-size: 15px;
    color: var(--am-grey);
    line-height: 1.9;
    margin-bottom: 16px;
}

.am-hallmark-intro-body:last-child {
    margin-bottom: 0;
}


/* ── CHAPTER SECTIONS ── */

.am-hallmark-chapter {
    scroll-margin-top: 80px;
}

.am-hallmark-chapter-num {
    font-family: var(--am-font-display);
    font-size: 72px;
    font-weight: 300;
    color: rgba(201, 168, 76, 0.12);
    line-height: 1;
    margin-bottom: 8px;
    letter-spacing: -0.02em;
}

.am-hallmark-chapter-num--light {
    color: rgba(255, 255, 255, 0.08);
}


/* ── QURANIC VERSE WITHIN CHAPTERS ── */

.am-hallmark-verse {
    margin: 28px 0 0;
    padding: 20px 24px;
    border-left: 2px solid rgba(201, 168, 76, 0.3);
    background: rgba(201, 168, 76, 0.04);
    border-radius: 0 var(--am-radius) var(--am-radius) 0;
}

.am-hallmark-verse .am-about-arabic {
    font-size: clamp(16px, 2.5vw, 22px);
    margin-bottom: 10px;
}

.am-hallmark-verse cite {
    display: block;
    font-style: italic;
    font-family: var(--am-font-display);
    font-size: 13px;
    color: var(--am-grey);
    line-height: 1.7;
}

.am-hallmark-verse cite em {
    color: var(--am-gold);
    font-style: normal;
}


/* ── TAYYIB ID SECTION ── */

.am-hallmark-tayyib-inner {
    max-width: 760px;
    margin: 0 auto;
    text-align: center;
}

.am-hallmark-tayyib-body {
    font-size: 15px;
    color: var(--am-grey);
    line-height: 1.9;
    margin-bottom: 16px;
    text-align: left;
}

.am-hallmark-tayyib-body:last-of-type {
    margin-bottom: 32px;
}

.am-hallmark-tayyib-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1px;
    background: rgba(201, 168, 76, 0.1);
    border: 1px solid rgba(201, 168, 76, 0.1);
    border-radius: var(--am-radius);
    overflow: hidden;
    margin-top: 32px;
}

.am-hallmark-tayyib-item {
    background: var(--am-white);
    padding: 20px 22px;
    display: flex;
    flex-direction: column;
    gap: 4px;
    transition: background var(--am-duration) var(--am-ease);
}

.am-hallmark-tayyib-item:hover {
    background: var(--am-cream);
}

.am-hallmark-tayyib-label {
    font-size: 9px;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--am-gold);
    font-weight: 700;
}

.am-hallmark-tayyib-item strong {
    font-size: 13px;
    color: var(--am-black);
    font-weight: 500;
    line-height: 1.5;
}

/* Tayyib ID link inside the grid */
.am-hallmark-tayyib-item .am-text-link {
    font-size: 12px;
    margin-top: 0;
}


/* ── CRAFTSMANSHIP STANDARDS GRID ── */

.am-hallmark-craft {
    padding: var(--am-space-3xl) 0;
}

.am-hallmark-craft-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1px;
    background: rgba(201, 168, 76, 0.1);
    border: 1px solid rgba(201, 168, 76, 0.1);
    border-radius: var(--am-radius);
    overflow: hidden;
}


/* ══════════════════════════════════════════════════════════════
   HALLMARK RESPONSIVE
══════════════════════════════════════════════════════════════ */

@media (max-width: 1024px) {
    .am-hallmark-tayyib-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    .am-hallmark-craft-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 850px) {
    .am-hallmark-hero {
        min-height: auto;
        padding: var(--am-space-3xl) 20px var(--am-space-2xl);
    }
}

@media (max-width: 640px) {
    .am-hallmark-headline {
        font-size: clamp(36px, 12vw, 60px);
    }
    .am-hallmark-hero-ctas {
        flex-direction: column;
        align-items: center;
    }
    .am-hallmark-hero-ctas .am-btn,
    .am-hallmark-hero-ctas .am-btn-ghost {
        width: 100%;
        max-width: 320px;
        justify-content: center;
    }
    .am-hallmark-tayyib-grid {
        grid-template-columns: 1fr;
    }
    .am-hallmark-craft-grid {
        grid-template-columns: 1fr;
    }
    .am-hallmark-tayyib-body {
        text-align: left;
    }
    .am-hallmark-verse {
        padding: 16px 18px;
    }
}

/* ── RTL support ── */
[dir="rtl"] .am-hallmark-hero-ctas { direction: rtl; }
[dir="rtl"] .am-hallmark-intro-inner { text-align: right; }
[dir="rtl"] .am-hallmark-tayyib-body { text-align: right; }
[dir="rtl"] .am-hallmark-tayyib-item { text-align: right; }
[dir="rtl"] .am-hallmark-verse {
    border-left: none;
    border-right: 2px solid rgba(201, 168, 76, 0.3);
    border-radius: var(--am-radius) 0 0 var(--am-radius);
}
[dir="rtl"] .am-hallmark-chapter-num { text-align: right; }



















/* ══════════════════════════════════════════════════════════════
   HALLMARK & CRAFTSMANSHIP — page-hallmark.php (v2 rebuild)
   Append this entire block to the bottom of page-content.css
   Replaces the previous am-hallmark-* block entirely.
   ══════════════════════════════════════════════════════════════ */


/* ── HERO ── */

.am-hallmark-hero {
    background: var(--am-black) !important;
    min-height: 82vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: var(--am-space-4xl) var(--am-space-xl) var(--am-space-3xl);
    position: relative;
    overflow: hidden;
    z-index: 1;
}

/* Layered radial — deeper, more atmospheric than other pages */
.am-hallmark-hero::before {
    content: '';
    position: absolute;
    inset: 0;
    background:
        radial-gradient(ellipse 70% 55% at 50% 70%, rgba(201, 168, 76, 0.10) 0%, transparent 60%),
        radial-gradient(ellipse 30% 20% at 20% 15%, rgba(201, 168, 76, 0.04) 0%, transparent 55%),
        radial-gradient(ellipse 25% 20% at 80% 85%, rgba(201, 168, 76, 0.03) 0%, transparent 55%);
    pointer-events: none;
    z-index: 0;
}

.am-hallmark-hero-inner {
    position: relative;
    z-index: 1;
    max-width: 860px;
    width: 100%;
}

.am-hallmark-headline {
    font-family: var(--am-font-display);
    font-size: clamp(52px, 9vw, 112px);
    font-weight: 300;
    color: var(--am-white);
    line-height: 1.0;
    letter-spacing: -0.03em;
    margin: 20px 0 28px;
}

/* Gold shimmer on the third line */
.am-hallmark-headline-gold {
    display: block;
    background: var(--am-gold-shimmer);
    background-size: 200% auto;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    animation: shimmer 6s linear infinite;
}

.am-hallmark-subhead {
    font-size: clamp(14px, 1.7vw, 17px);
    color: var(--am-light-grey);
    line-height: 1.9;
    max-width: 680px;
    margin: 0 auto 36px;
    font-weight: 300;
}

.am-hallmark-hero-ctas {
    display: flex;
    gap: 16px;
    justify-content: center;
    flex-wrap: wrap;
}


/* ── WHAT IS AMANAH — section ── */

.am-hallmark-meaning {
    background: var(--am-white);
}

/* Hadith pullquote */
.am-hallmark-hadith {
    margin: 32px 0 0;
    padding: 24px 28px;
    border: 1px solid rgba(201, 168, 76, 0.18);
    border-left: 3px solid var(--am-gold);
    border-radius: 0 var(--am-radius) var(--am-radius) 0;
    background: rgba(201, 168, 76, 0.03);
    text-align: right;
}

.am-hallmark-hadith .am-about-arabic {
    margin-bottom: 14px;
}

.am-hallmark-hadith cite {
    display: block;
    font-style: italic;
    font-family: var(--am-font-display);
    font-size: 14px;
    color: var(--am-grey);
    line-height: 1.8;
    text-align: left;
}

.am-hallmark-hadith cite em {
    color: var(--am-gold);
    font-style: normal;
}


/* ── VIDEO SECTION ── */

.am-hallmark-video-header {
    text-align: center;
    max-width: 640px;
    margin: 0 auto var(--am-space-xl);
}

.am-hallmark-video-subhead {
    font-size: 15px;
    color: var(--am-grey);
    line-height: 1.8;
    margin: 12px 0 0;
    text-align: center;
}

.am-hallmark-video-wrap {
    max-width: 900px;
    margin: 0 auto;
}

.am-hallmark-video-frame {
    position: relative;
    width: 100%;
    aspect-ratio: 16 / 9;
    border-radius: var(--am-radius-lg);
    overflow: hidden;
    background: var(--am-near-black);
    border: 1px solid rgba(201, 168, 76, 0.15);
}

.am-hallmark-video-frame iframe {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: none;
    display: block;
}

/* Placeholder shown before video URL is inserted */
.am-hallmark-video-placeholder {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 16px;
    background: var(--am-near-black);
    cursor: pointer;
}

.am-hallmark-video-placeholder--dark {
    background: rgba(0, 0, 0, 0.6);
}

.am-hallmark-video-placeholder span {
    font-size: 12px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--am-light-grey);
    font-weight: 600;
}

.am-hallmark-video-play {
    width: 64px;
    height: 64px;
    border-radius: 50%;
    background: var(--am-gold);
    color: var(--am-black);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: transform var(--am-duration) var(--am-ease),
                background var(--am-duration) var(--am-ease);
}

.am-hallmark-video-placeholder:hover .am-hallmark-video-play {
    transform: scale(1.08);
    background: var(--am-gold-light);
}


/* ── BRAND SEAL — Kufic Square centrepiece ── */

.am-hallmark-seal {
    position: relative;
}

/* Visual container for the mark + annotations */
.am-hallmark-seal-visual {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 420px;
}

.am-hallmark-seal-img {
    width: 100%;
    max-width: 580px;
    height: auto;
    display: block;
    filter: drop-shadow(0 0 60px rgba(201, 168, 76, 0.2));
}

/* Annotation system — positioned labels around the mark */
.am-hallmark-seal-annotations {
    position: absolute;
    inset: 0;
    pointer-events: none;
}

.am-hallmark-seal-ann {
    position: absolute;
    display: flex;
    align-items: center;
    gap: 8px;
}

.am-hallmark-seal-ann--top {
    top: 10%;
    left: 10%;
    flex-direction: row;
}

.am-hallmark-seal-ann--right {
    /* top: 50%;
    right: 0; */
    top: 15%;
    left: 10%;
    transform: translateY(-50%);
    flex-direction: row;
}

.am-hallmark-seal-ann--bottom {
    /* bottom: 10%;
    left: 0; */
    top: 17%;
    left: 10%;
    flex-direction: row;
}

.am-hallmark-seal-ann-dot {
    display: block;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--am-gold);
    flex-shrink: 0;
}

.am-hallmark-seal-ann-text {
    font-size: 10px;
    padding:0 5px;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--am-cream);
    background: var(--am-gold);
    /* color: rgba(201, 168, 76, 0.7); */
    font-weight: 600;
    white-space: nowrap;
}

/* Comparator strip — PAMP vs Royal Mint vs Amanah */
.am-hallmark-comparator {
    display: flex;
    flex-direction: column;
    gap: 0;
    margin-top: 32px;
    border: 1px solid rgba(201, 168, 76, 0.12);
    border-radius: var(--am-radius);
    overflow: hidden;
}

.am-hallmark-comp-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 14px 20px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
    background: rgba(255, 255, 255, 0.03);
}

.am-hallmark-comp-item:last-child {
    border-bottom: none;
}

.am-hallmark-comp-item--gold {
    background: rgba(201, 168, 76, 0.07);
    border-top: 1px solid rgba(201, 168, 76, 0.15);
}

.am-hallmark-comp-brand {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--am-light-grey);
}

.am-hallmark-comp-item--gold .am-hallmark-comp-brand {
    color: var(--am-gold);
}

.am-hallmark-comp-symbol {
    font-family: var(--am-font-display);
    font-size: 14px;
    color: var(--am-grey);
    font-style: italic;
}

.am-hallmark-comp-item--gold .am-hallmark-comp-symbol {
    color: var(--am-white);
    font-style: normal;
    font-weight: 500;
}


/* ── HALLMARK CHAPTER NUM (shared) ── */

.am-hallmark-chapter-num {
    font-family: var(--am-font-display);
    font-size: 80px;
    font-weight: 300;
    color: rgba(201, 168, 76, 0.12);
    line-height: 1;
    margin-bottom: 8px;
    letter-spacing: -0.02em;
}

.am-hallmark-chapter-num--light {
    color: rgba(255, 255, 255, 0.07);
}


/* ── QURANIC VERSE (shared within chapters) ── */

.am-hallmark-verse {
    margin: 28px 0 0;
    padding: 20px 24px;
    border-left: 2px solid rgba(201, 168, 76, 0.3);
    background: rgba(201, 168, 76, 0.04);
    border-radius: 0 var(--am-radius) var(--am-radius) 0;
}

.am-hallmark-verse .am-about-arabic {
    font-size: clamp(16px, 2.5vw, 22px);
    margin-bottom: 10px;
}

.am-hallmark-verse cite {
    display: block;
    font-style: italic;
    font-family: var(--am-font-display);
    font-size: 13px;
    color: var(--am-grey);
    line-height: 1.7;
}

.am-hallmark-verse cite em {
    color: var(--am-gold);
    font-style: normal;
}


/* ── REVELATION SECTION — Mountain, Cave & Waves ── */

.am-hallmark-revelation {
    position: relative;
}

.am-hallmark-revelation-header {
    text-align: center;
    margin-bottom: var(--am-space-xl);
}

.am-hallmark-revelation-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    margin-bottom: var(--am-space-xl);
}

.am-hallmark-revelation-col {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.am-hallmark-revelation-img-wrap {
    width: 100%;
    aspect-ratio: 16 / 10;
    border-radius: var(--am-radius);
    overflow: hidden;
    margin-bottom: 24px;
    border: 1px solid rgba(201, 168, 76, 0.12);
    background: var(--am-near-black);
}

.am-hallmark-revelation-img-wrap img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.6s var(--am-ease);
}

.am-hallmark-revelation-col:hover .am-hallmark-revelation-img-wrap img {
    transform: scale(1.03);
}

.am-hallmark-revelation-sub {
    font-family: var(--am-font-display);
    font-size: clamp(20px, 2.5vw, 26px);
    font-weight: 400;
    color: var(--am-white);
    margin: 0 0 16px;
    letter-spacing: 0.01em;
}

/* Full-width pull quote at the bottom of the revelation section */
.am-hallmark-revelation-pullquote {
    text-align: center;
    padding: var(--am-space-xl) 0 0;
    border-top: 1px solid rgba(201, 168, 76, 0.1);
    max-width: 720px;
    margin: 0 auto;
}

.am-hallmark-revelation-pullquote blockquote {
    margin: 0;
    padding: 0;
    border: none;
}

.am-hallmark-revelation-pullquote blockquote p {
    font-family: var(--am-font-display);
    font-style: italic;
    font-size: clamp(18px, 2.5vw, 26px);
    color: var(--am-gold) !important;
    line-height: 1.6;
    margin: 0;
    letter-spacing: -0.01em;
}


/* ── CURATED EDGES — spec strip ── */

.am-hallmark-edge-specs {
    display: flex;
    flex-direction: column;
    gap: 0;
    margin-top: 28px;
    border: 1px solid rgba(201, 168, 76, 0.12);
    border-radius: var(--am-radius);
    overflow: hidden;
    background: var(--am-white);
}

.am-hallmark-edge-spec {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 13px 20px;
    border-bottom: 1px solid rgba(201, 168, 76, 0.07);
    font-size: 12px;
}

.am-hallmark-edge-spec:last-child {
    border-bottom: none;
}

.am-hallmark-edge-spec-label {
    color: var(--am-grey);
    font-size: 10px;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    font-weight: 600;
    flex-shrink: 0;
}

.am-hallmark-edge-spec-val {
    color: var(--am-black);
    font-weight: 500;
    text-align: right;
}


/* ── TAYYIB ID — same as before ── */

.am-hallmark-tayyib-inner {
    max-width: 760px;
    margin: 0 auto;
    text-align: center;
}

.am-hallmark-tayyib-body {
    font-size: 15px;
    color: var(--am-grey);
    line-height: 1.9;
    margin-bottom: 16px;
    text-align: left;
}

.am-hallmark-tayyib-body:last-of-type {
    margin-bottom: 32px;
}

.am-hallmark-tayyib-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1px;
    background: rgba(201, 168, 76, 0.1);
    border: 1px solid rgba(201, 168, 76, 0.1);
    border-radius: var(--am-radius);
    overflow: hidden;
    margin-top: 32px;
    text-align: left;
}

.am-hallmark-tayyib-item {
    background: var(--am-white);
    padding: 20px 22px;
    display: flex;
    flex-direction: column;
    gap: 4px;
    transition: background var(--am-duration) var(--am-ease);
}

.am-hallmark-tayyib-item:hover {
    background: var(--am-cream);
}

.am-hallmark-tayyib-label {
    font-size: 9px;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--am-gold);
    font-weight: 700;
}

.am-hallmark-tayyib-item strong {
    font-size: 13px;
    color: var(--am-black);
    font-weight: 500;
    line-height: 1.5;
}

.am-hallmark-tayyib-item .am-text-link {
    font-size: 12px;
    margin-top: 0;
}


/* ── CRAFTSMANSHIP STANDARDS GRID ── */

.am-hallmark-craft {
    padding: var(--am-space-3xl) 0;
}

.am-hallmark-craft-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1px;
    background: rgba(201, 168, 76, 0.1);
    border: 1px solid rgba(201, 168, 76, 0.1);
    border-radius: var(--am-radius);
    overflow: hidden;
}


/* ══════════════════════════════════════════════════════════════
   HALLMARK RESPONSIVE
══════════════════════════════════════════════════════════════ */

/* Large tablet */
@media (max-width: 1100px) {
    .am-hallmark-seal-annotations {
        display: none; /* annotations need space — hide on smaller screens */
    }
}

/* Tablet */
@media (max-width: 1024px) {
    .am-hallmark-tayyib-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    .am-hallmark-craft-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    .am-hallmark-revelation-grid {
        grid-template-columns: 1fr;
        gap: 48px;
    }
}

/* Portrait tablet */
@media (max-width: 850px) {
    .am-hallmark-hero {
        min-height: auto;
        padding: var(--am-space-3xl) 20px var(--am-space-2xl);
    }
    .am-hallmark-comp-item {
        flex-direction: column;
        align-items: flex-start;
        gap: 4px;
    }
}

/* Phone */
@media (max-width: 640px) {
    .am-hallmark-headline {
        font-size: clamp(40px, 13vw, 68px);
        letter-spacing: -0.025em;
    }
    .am-hallmark-hero-ctas {
        flex-direction: column;
        align-items: center;
    }
    .am-hallmark-hero-ctas .am-btn,
    .am-hallmark-hero-ctas .am-btn-ghost {
        width: 100%;
        max-width: 320px;
        justify-content: center;
    }
    .am-hallmark-tayyib-grid {
        grid-template-columns: 1fr;
    }
    .am-hallmark-craft-grid {
        grid-template-columns: 1fr;
    }
    .am-hallmark-tayyib-body {
        text-align: left;
    }
    .am-hallmark-verse {
        padding: 16px 18px;
    }
    .am-hallmark-hadith {
        padding: 18px 18px;
    }
    .am-hallmark-seal-img {
        max-width: 460px;
    }
    .am-hallmark-video-play {
        width: 52px;
        height: 52px;
    }
    .am-hallmark-revelation-pullquote blockquote p {
        font-size: clamp(16px, 5vw, 20px);
    }
    .am-hallmark-comparator {
        margin-top: 24px;
    }
    .am-hallmark-edge-spec {
        flex-direction: column;
        align-items: flex-start;
        gap: 3px;
    }
    .am-hallmark-edge-spec-val {
        text-align: left;
    }
}


/* ── RTL support (WPML Arabic) ── */

[dir="rtl"] .am-hallmark-hero-ctas { direction: rtl; }

[dir="rtl"] .am-hallmark-hadith {
    border-left: none;
    border-right: 3px solid var(--am-gold);
    border-radius: var(--am-radius) 0 0 var(--am-radius);
    text-align: left;
}
[dir="rtl"] .am-hallmark-hadith cite { text-align: right; }

[dir="rtl"] .am-hallmark-verse {
    border-left: none;
    border-right: 2px solid rgba(201, 168, 76, 0.3);
    border-radius: var(--am-radius) 0 0 var(--am-radius);
}

[dir="rtl"] .am-hallmark-revelation-grid { direction: rtl; }
[dir="rtl"] .am-hallmark-revelation-sub { text-align: right; }

[dir="rtl"] .am-hallmark-comp-item { flex-direction: row-reverse; }
[dir="rtl"] .am-hallmark-tayyib-item { text-align: right; }
[dir="rtl"] .am-hallmark-tayyib-body { text-align: right; }
[dir="rtl"] .am-hallmark-chapter-num { text-align: right; }

[dir="rtl"] .am-hallmark-seal-ann--top,
[dir="rtl"] .am-hallmark-seal-ann--bottom { flex-direction: row-reverse; }
[dir="rtl"] .am-hallmark-seal-ann--right { flex-direction: row; }

[dir="rtl"] .am-hallmark-edge-spec { flex-direction: row-reverse; }
[dir="rtl"] .am-hallmark-edge-spec-val { text-align: left; }