/* ── AATHAAR HERO ── */
.aath-hero{background:var(--bg);border-bottom:1px solid var(--border-accent);padding:80px 52px;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:80px;transition:background .3s}
.aath-brand-row{display:flex;align-items:center;gap:18px;margin-bottom:24px}
.aath-logo-img{height:64px;width:auto}
.aath-title{font-family:var(--title);font-size:clamp(2rem,3.5vw,3.2rem);font-weight:400;margin-bottom:8px;letter-spacing:0.08em;color:var(--text)}
html.aathaar-dark .aath-title{color:var(--gold)}
.aath-subtitle{font-size:0.75rem;letter-spacing:0.2em;text-transform:uppercase;color:var(--gold3);margin-bottom:22px}
.aath-verse{font-family:var(--serif);font-style:italic;font-size:0.95rem;color:var(--muted);border-left:2px solid var(--gold3);padding-left:18px;margin-bottom:26px;line-height:1.85}
.aath-hero-desc{font-size:0.875rem;line-height:2.1;color:var(--text3);max-width:460px;margin-bottom:32px}
.aath-hero-img{width:100%;aspect-ratio:1;object-fit:cover;border:1px solid var(--border-accent)}
html.aathaar-dark .aath-hero-img{box-shadow:0 40px 80px rgba(0,0,0,0.6)}
html.cream .aath-hero-img{box-shadow:0 20px 60px rgba(0,0,0,0.1)}

/* AATHAAR finishes bar */
.finishes-bar{background:var(--surface);border-bottom:1px solid var(--border);padding:22px 52px;display:flex;align-items:center;gap:36px;flex-wrap:wrap}
.finish-label{font-size:0.55rem;letter-spacing:0.22em;text-transform:uppercase;color:var(--muted);white-space:nowrap}
.finish-opt{display:flex;align-items:center;gap:9px;cursor:pointer;opacity:0.7;transition:opacity .2s}
.finish-opt:hover{opacity:1}
.swatch{width:26px;height:26px;border-radius:50%;border:2px solid var(--border)}
.finish-name{font-size:0.62rem;letter-spacing:0.1em;text-transform:uppercase;color:var(--text3)}

/* AATHAAR styling */
html.cream .btn-red,
html.aathaar-dark .btn-red{background:#0b0b0b!important;color:var(--gold2)!important;border:1px solid rgba(201,169,110,.45)!important}
html.cream .btn-red:hover,
html.aathaar-dark .btn-red:hover{background:var(--gold3)!important;color:#fff!important;border-color:var(--gold)!important}
html.cream #persistent-basket-bar,
html.aathaar-dark #persistent-basket-bar,
html.cream .persistent-basket-bar,
html.aathaar-dark .persistent-basket-bar{background:#9A7A45!important;border-top:1px solid rgba(0,0,0,.28)!important;box-shadow:0 -4px 24px rgba(0,0,0,.18)!important}
html.cream #persistent-basket-bar #pbb-count,
html.aathaar-dark #persistent-basket-bar #pbb-count{color:rgba(0,0,0,.62)!important}
html.cream #persistent-basket-bar #pbb-total,
html.aathaar-dark #persistent-basket-bar #pbb-total,
html.cream #persistent-basket-bar a,
html.aathaar-dark #persistent-basket-bar a{color:#050505!important}
html.cream #persistent-basket-bar .persistent-basket-cta,
html.aathaar-dark #persistent-basket-bar .persistent-basket-cta,
html.cream #persistent-basket-bar a > div:last-child,
html.aathaar-dark #persistent-basket-bar a > div:last-child{background:#050505!important;border:1px solid rgba(5,5,5,.35)!important}
html.cream #persistent-basket-bar .persistent-basket-cta span,
html.aathaar-dark #persistent-basket-bar .persistent-basket-cta span,
html.cream #persistent-basket-bar a > div:last-child span,
html.aathaar-dark #persistent-basket-bar a > div:last-child span{color:#D8BC7A!important}
html body a[href="/aathaar/99-names-of-allah/"],
html body a[href="/aathaar/99-names-of-allah"],
html body a[href*="99-names-of-allah"],
html body .aathaar-view-99-btn,
html body .view-99-names-btn,
html body a[href*="99-names-of-allah"]:hover,
html body .aathaar-view-99-btn:hover,
html body .view-99-names-btn:hover{background:#B08A44!important;background-color:#B08A44!important;color:#050505!important;border-color:#B08A44!important;box-shadow:none!important}
html body a[href*="99-names-of-allah"] *,
html body a[href*="99-names-of-allah"]:hover *,
html body .aathaar-view-99-btn *,
html body .view-99-names-btn *{color:#050505!important}
@media(max-width:600px){.aathaar-99-layout{padding-left:20px!important;padding-right:20px!important}.aathaar-99-visual{margin-top:18px!important;margin-bottom:26px!important}.aathaar-99-visual-label,.aathaar-99-visual-caption{font-size:.52rem!important;line-height:1.7!important}.aathaar-99-description{margin-top:0!important}}

/* ── 99 NAMES PAGE MOBILE ── */
@media(max-width:600px) {
  /* Edition cards stack better */
  .edition-cards{grid-template-columns:1fr!important}

  /* Tile canvas full width on mobile */
  #tile-canvas{max-width:100%!important}

  /* Key specs 3-col stays but smaller */
  #tile-canvas + div + div{font-size:0.58rem}
}

/* Finishes section removed from AATHAAR model */
.finishes-bar{display:none!important}