/* =====================================================================
   site-polish.css — design upgrade layer (Masihi + Himalaya)
   Loaded AFTER each page's own <style>. Pure enhancement: agar ye file
   na mile to site bilkul pehle jaisi dikhegi — kuch nahi tootega.
   ===================================================================== */

/* 1. Islamic geometric (8-point star) lattice, woven into the aurora */
body::before{
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='88' height='88' viewBox='0 0 88 88'%3E%3Cg fill='none' stroke='%23D98B3F' stroke-opacity='.07'%3E%3Crect x='26' y='26' width='36' height='36'/%3E%3Crect x='26' y='26' width='36' height='36' transform='rotate(45 44 44)'/%3E%3Ccircle cx='44' cy='44' r='7'/%3E%3Cpath d='M0 0L26 26M88 0L62 26M0 88L26 62M88 88L62 62'/%3E%3C/g%3E%3C/svg%3E"),
    radial-gradient(circle at 10% 6%, rgba(201,162,75,0.20), transparent 40%),
    radial-gradient(circle at 90% 18%, rgba(138,51,36,0.20), transparent 44%),
    radial-gradient(circle at 22% 55%, rgba(72,133,110,0.16), transparent 42%),
    radial-gradient(circle at 32% 88%, rgba(201,162,75,0.14), transparent 46%),
    radial-gradient(circle at 82% 92%, rgba(168,68,47,0.16), transparent 44%),
    radial-gradient(circle at 62% 40%, rgba(90,110,180,0.10), transparent 40%);
  background-size:88px 88px,200% 200%,200% 200%,200% 200%,200% 200%,200% 200%,200% 200%;
}

/* 2. Section headings — ornamental eyebrow lines + diamond divider */
.section-eyebrow{display:inline-flex;align-items:center;gap:.75em;}
.section-eyebrow::before,.section-eyebrow::after{
  content:"";flex:none;width:26px;height:1px;
  background:linear-gradient(90deg,transparent,var(--gold));
}
.section-eyebrow::after{transform:scaleX(-1);}
.section-head h2::after{
  content:"";display:block;width:132px;height:12px;margin:16px auto 0;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 132 12'%3E%3Cpath d='M0 6H50M82 6H132' stroke='%23D98B3F' stroke-opacity='.55'/%3E%3Ccircle cx='55' cy='6' r='1.6' fill='%23D98B3F'/%3E%3Ccircle cx='77' cy='6' r='1.6' fill='%23D98B3F'/%3E%3Cpath d='M66 0L72 6L66 12L60 6Z' fill='%23D98B3F'/%3E%3C/svg%3E") center/contain no-repeat;
}

/* 3. Hero — shimmering gold word + glowing, slowly turning seal */
.hero h1 em{
  background:linear-gradient(100deg,var(--gold) 0%,var(--gold-soft) 42%,#FFE9C4 50%,var(--gold-soft) 58%,var(--gold) 100%);
  background-size:250% 100%;
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;color:transparent;
  animation:polishShine 7s ease-in-out infinite;
  padding-right:.12em;
}
@keyframes polishShine{0%,100%{background-position:100% 0}50%{background-position:0 0}}
.seal{box-shadow:0 0 0 10px rgba(217,139,63,.05),0 0 70px rgba(217,139,63,.22);}
.seal::after{
  content:"";position:absolute;inset:-14px;border-radius:50%;
  border:1px dashed var(--gold);opacity:.45;pointer-events:none;
  animation:polishSpin 60s linear infinite;
}
@keyframes polishSpin{to{transform:rotate(360deg)}}

/* 4. Buttons — depth + lift */
.btn-primary{
  background-image:linear-gradient(135deg,var(--maroon-soft),var(--maroon));
  box-shadow:0 10px 26px -10px rgba(168,68,47,.7),inset 0 1px 0 rgba(255,255,255,.18);
  transition:transform .25s ease,box-shadow .25s ease;
}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 16px 34px -12px rgba(168,68,47,.85),inset 0 1px 0 rgba(255,255,255,.22);}
.btn-ghost{transition:transform .25s ease,border-color .25s ease;}
.btn-ghost:hover{transform:translateY(-2px);border-color:var(--gold);}

/* 5. Trust band — each promise in its own glowing tile */
.trust .wrap{gap:14px;}
.trust .wrap > div{
  padding:18px 12px;border-radius:18px;
  background:linear-gradient(155deg,var(--glass-bg),var(--glass-bg-2));
  border:1px solid var(--line);transition:transform .3s ease,border-color .3s ease;
}
.trust .wrap > div:hover{transform:translateY(-3px);border-color:var(--gold);}
.trust b{
  background:linear-gradient(180deg,var(--gold-soft),var(--gold));
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
}

/* 6. Product cards — lift, gold edge, image zoom */
.home-product-card,.product-card,.testimonial-card,.books-quicklink-card{
  transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s ease,border-color .35s ease;
}
.home-product-card:hover,.product-card:hover{
  transform:translateY(-6px);border-color:rgba(217,139,63,.55);
  box-shadow:0 22px 44px -18px rgba(0,0,0,.6),0 0 0 1px rgba(217,139,63,.25);
}
.home-product-card .card-img,.product-card .card-img{overflow:hidden;}
.home-product-card .card-img img,.product-card .card-img img{transition:transform .6s cubic-bezier(.2,.8,.2,1);}
.home-product-card:hover .card-img img,.product-card:hover .card-img img{transform:scale(1.06);}
.hp-price{font-weight:600;}

/* 7. Feature cards + library link */
.testimonial-card:hover,.books-quicklink-card:hover{transform:translateY(-4px);border-color:rgba(217,139,63,.5);}
.feature-icon{
  display:inline-grid;place-items:center;width:58px;height:58px;border-radius:18px;
  background:radial-gradient(circle at 30% 25%,rgba(242,173,104,.28),rgba(217,139,63,.08));
  border:1px solid var(--line);
}

/* 8. Footer — gold hairline on top */
footer{border-top:1px solid transparent;border-image:linear-gradient(90deg,transparent,var(--gold),transparent) 1;}

/* 9. Keyboard focus + scrollbar in brand colour */
:focus-visible{outline:2px solid var(--gold);outline-offset:3px;border-radius:6px;}
html{scrollbar-color:var(--gold) transparent;}

/* 10. Respect "reduce motion" setting */
@media (prefers-reduced-motion:reduce){
  .hero h1 em,.seal::after{animation:none;}
  .home-product-card,.product-card,.testimonial-card,.books-quicklink-card,.btn-primary,.btn-ghost{transition:none;}
}
