/* ==========================================================
   Store v2 — Kasim Elite Digital Global
   Loaded only by store.html and product-*.html, after styles.css.
   Uses the tokens already defined in styles.css.
   ========================================================== */

/* Visually hidden text for screen readers */
.vh{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* ---------- Store grid additions ---------- */
.cover.c-book{display:flex;align-items:center;justify-content:center;padding:18px;background:linear-gradient(160deg,#0a1336,#030303 70%);text-decoration:none}
.cover.c-book img{position:relative;z-index:1;max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;border-radius:6px;box-shadow:0 18px 40px -14px rgba(0,0,0,.8)}
.badge.book{background:var(--ivory);color:var(--ink);left:auto;right:18px;width:auto;max-width:max-content}
.product-link{color:inherit;text-decoration:none}
.product-link:hover{color:var(--gold-hi)}
.more-link{display:inline-flex;align-items:center;min-height:44px;color:var(--gold-hi);font-size:15px;font-weight:500;text-decoration:underline;text-underline-offset:3px}
.product .more-link{justify-content:center}
.more-link:hover{color:var(--ivory)}

/* ---------- Product page ---------- */
.pdp{padding:clamp(32px,5vw,64px) 0 0}
.pdp .floor{padding-bottom:clamp(48px,7vw,88px)}
.crumbs{display:flex;flex-wrap:wrap;gap:10px;align-items:center;font-size:14px;color:var(--muted);margin-bottom:clamp(24px,4vw,40px)}
.crumbs a{color:var(--gold-hi)}
.pdp-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(28px,5vw,72px);align-items:center}
.pdp-cover{position:relative;border-radius:var(--radius-lg);border:1px solid var(--line);padding:clamp(18px,3vw,36px);background:linear-gradient(160deg,#0a1336,#030303 70%);overflow:hidden}
.pdp-cover::after{content:"";position:absolute;left:50%;bottom:-40%;width:120%;height:70%;transform:translateX(-50%);background:radial-gradient(50% 50% at 50% 50%,rgba(212,175,55,.30),transparent 70%);pointer-events:none}
.pdp-cover img{position:relative;z-index:1;display:block;width:100%;height:auto;border-radius:8px;box-shadow:0 30px 60px -20px rgba(0,0,0,.85)}
.pdp-kind{font-size:13px;letter-spacing:.06em;text-transform:uppercase;color:var(--gold-hi)}
.pdp-info h1{font-size:clamp(40px,5.2vw,64px);margin-top:12px;max-width:14ch}
.pdp-by{margin-top:14px;color:var(--muted);font-size:15.5px}
.pdp-by a{color:var(--ivory)}
.pdp-info .lede{margin-top:20px}
.pdp-price{margin-top:24px;padding-top:0}
.pdp-price strong{font-size:40px}
.pdp-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:18px}
.pdp-note{margin-top:16px;color:var(--muted);font-size:14.5px;max-width:48ch}

.pdp-body h2{font-size:clamp(30px,3.4vw,42px);margin-bottom:22px}
.pdp-cols{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,6vw,80px)}
.facts-list{margin:28px 0 0;border-top:1px solid var(--line-soft)}
.facts-list div{display:flex;justify-content:space-between;gap:16px;padding:14px 0;border-bottom:1px solid var(--line-soft);font-size:15.5px}
.facts-list dt{color:var(--muted)}
.facts-list dd{margin:0;color:var(--ivory);text-align:right}

.steps-title{margin-top:clamp(56px,8vw,96px)}
.steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:16px;counter-reset:step}
.steps li{counter-increment:step;display:flex;flex-direction:column;gap:8px;padding:24px;border-radius:var(--radius-lg);border:1px solid var(--line-soft);background:rgba(255,255,240,.02)}
.steps li::before{content:counter(step);display:grid;place-items:center;width:34px;height:34px;border-radius:999px;border:1px solid var(--line);color:var(--gold-hi);font-weight:600;font-size:15px;margin-bottom:6px}
.steps b{font-size:17px;font-weight:600;color:var(--ivory)}
.steps span{color:var(--muted);font-size:15px}

.author{display:flex;gap:clamp(18px,3vw,32px);align-items:flex-start;margin-top:clamp(56px,8vw,96px);padding:clamp(22px,3vw,36px);border-radius:var(--radius-lg);border:1px solid var(--line);background:linear-gradient(135deg,rgba(212,175,55,.08),rgba(30,58,138,.12))}
.author img{flex:none;width:96px;height:96px;border-radius:999px;object-fit:cover;border:1px solid var(--line)}
.author h2{font-size:clamp(26px,2.6vw,32px);margin-bottom:10px}
.author p{color:var(--muted);font-size:16px;max-width:60ch}

@media (max-width:880px){
  .pdp-grid,.pdp-cols{grid-template-columns:1fr}
  .pdp-cover{max-width:460px}
  .steps{grid-template-columns:1fr}
}
@media (max-width:600px){
  .pdp-actions .btn{width:100%}
  .author{flex-direction:column}
}
