/* ============================================================
   سوبر فولي — صفحات الداخل (حكايتنا / الكولكشن / المدونة / المقال)
   ============================================================ */

/* رأس الصفحة الداخلية */
.pagehead{position:relative;background:var(--ink);color:var(--txt);padding:5.5rem 0 4.5rem;overflow:hidden;border-bottom:4px double var(--gold)}
.pagehead__wm{position:absolute;top:-1rem;left:0;white-space:nowrap;font-family:var(--f-latin);font-size:13vw;color:transparent;-webkit-text-stroke:1px rgba(195,155,79,.12);pointer-events:none}
.pagehead .crumbs{font-size:.82rem;color:var(--gold);margin-bottom:1.2rem;letter-spacing:.05em}
.pagehead .crumbs a{color:#b3a88e}
.pagehead .crumbs a:hover{color:var(--gold)}
.pagehead h1{color:var(--paper)}
.pagehead__lead{margin-top:1.2rem;color:#cfc4ab;max-width:36rem;font-size:1.08rem}

/* ---------- حكايتنا ---------- */
.story__grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:4rem;align-items:center}
.story__txt{color:#3b3325;margin-bottom:1.2rem}
.story__txt b{color:var(--gold2)}

.timeline{position:relative;padding-inline-start:2.4rem;max-width:640px;margin-inline:auto}
.timeline::before{content:'';position:absolute;inset-inline-start:7px;top:6px;bottom:6px;border-inline-start:2px dashed var(--gold-soft)}
.tl-item{position:relative;padding-bottom:2.6rem}
.tl-item::before{content:'';position:absolute;inset-inline-start:-2.4rem;top:8px;width:15px;height:15px;border-radius:50%;
  background:var(--gold);box-shadow:0 0 0 4px var(--paper2),0 0 0 5px var(--gold-soft)}
.tl-year{font-family:var(--f-display);font-size:1.8rem;color:var(--gold2)}
.tl-item h3{font-size:1.3rem;margin:.2rem 0 .4rem}
.tl-item p{color:var(--txtd);font-size:.95rem;max-width:30rem}

.quoteband{position:relative;padding:7.5rem 0;overflow:hidden;text-align:center}
.quoteband img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:sepia(.3)}
.quoteband::before{content:'';position:absolute;inset:0;background:rgba(12,10,7,.72);z-index:1}
.quoteband blockquote{position:relative;z-index:2;font-family:var(--f-display);font-weight:400;
  font-size:clamp(1.5rem,3.4vw,2.3rem);line-height:2;color:var(--paper);max-width:800px;margin-inline:auto}
.quoteband cite{display:block;margin-top:1.4rem;font-style:normal;font-family:var(--f-body);font-size:1rem;color:var(--gold)}

.values{display:grid;grid-template-columns:repeat(2,1fr);gap:2rem}
.value{background:var(--cream);border:1px solid var(--linep);padding:2.2rem;position:relative;transition:transform .5s var(--e),box-shadow .5s}
.value:nth-child(even){transform:translateY(26px)}
.value:hover{box-shadow:var(--shadow);transform:translateY(-6px)}
.value:nth-child(even):hover{transform:translateY(20px)}
.value .num{font-family:var(--f-display);font-size:2.6rem;color:transparent;-webkit-text-stroke:1px var(--gold);display:block;margin-bottom:.6rem}
.value h3{font-size:1.35rem;margin-bottom:.5rem}
.value p{color:var(--txtd);font-size:.95rem}

/* ---------- الكولكشن / المنتجات ---------- */
.toolbar{display:flex;justify-content:space-between;align-items:center;gap:1.4rem;flex-wrap:wrap;margin-bottom:1.2rem}
.toolbar__side{display:flex;gap:.8rem;flex-wrap:wrap}
.chips{display:flex;gap:.55rem;flex-wrap:wrap}
.chip{border:1.5px solid var(--ink);background:transparent;color:var(--ink);padding:.42rem 1.15rem;
  font-family:var(--f-body);font-weight:600;font-size:.86rem;border-radius:3px;transition:.3s}
.chip:hover{border-color:var(--gold2);color:var(--gold2)}
.chip.on{background:var(--ink);color:var(--gold);border-color:var(--ink)}
.chip.is-static{background:var(--gold);border-color:var(--gold);color:var(--ink);cursor:default;margin-bottom:.8rem;display:inline-block}
.field{border:1.5px solid var(--ink);background:var(--cream);padding:.5rem 1rem;font-family:var(--f-body);font-size:.9rem;border-radius:3px;color:var(--ink)}
.field:focus{outline:none;border-color:var(--gold2);box-shadow:0 0 0 3px rgba(195,155,79,.2)}
.shop__count{color:var(--muted);font-size:.88rem;margin-bottom:1.8rem}

.grid-products{display:grid;grid-template-columns:repeat(auto-fill,minmax(245px,1fr));gap:1.7rem}
.p-card{background:var(--cream);border:1px solid var(--linep);padding:12px;display:flex;flex-direction:column;
  transition:transform .5s var(--e),box-shadow .5s}
.p-card:hover{transform:translateY(-8px);box-shadow:var(--shadow)}
.p-card__media{position:relative;overflow:hidden;border:1px solid var(--linep);background:var(--paper2)}
.p-card__media img{aspect-ratio:4/5;object-fit:cover;width:100%;filter:sepia(.24);transition:transform .8s var(--e),filter .6s}
.p-card:hover .p-card__media img{transform:scale(1.06);filter:sepia(0)}
.p-badge{position:absolute;top:12px;inset-inline-start:12px;background:var(--ink);color:var(--gold);
  font-size:.7rem;letter-spacing:.08em;padding:.25rem .75rem;z-index:2}
.p-quick{position:absolute;bottom:12px;inset-inline:12px;background:var(--ink);color:var(--paper);
  border:1px solid var(--gold);padding:.6rem;font-family:var(--f-body);font-weight:700;font-size:.85rem;
  opacity:0;transform:translateY(10px);transition:.35s var(--e);z-index:2}
.p-card:hover .p-quick,.p-card:focus-within .p-quick{opacity:1;transform:none}
.p-quick:hover{background:var(--gold);color:var(--ink)}
.p-card__body{padding:1rem .4rem .3rem;display:flex;flex-direction:column;gap:.3rem;flex:1}
.p-cat{font-size:.75rem;color:var(--gold2);font-weight:700;letter-spacing:.08em}
.p-card h3{font-size:1.12rem;font-weight:500}
.p-desc{font-size:.83rem;color:var(--txtd);line-height:1.7}
.p-price{margin-top:auto;padding-top:.7rem;border-top:1px dashed var(--linep);display:flex;gap:.7rem;align-items:baseline}
.p-price b{font-family:var(--f-display);font-size:1.15rem}
.p-price s{color:var(--muted);font-size:.85rem}

.ship-note{margin-top:3.5rem;border:2px dashed var(--gold2);background:var(--cream);padding:1.6rem 2rem;
  display:flex;justify-content:space-between;align-items:center;gap:1.5rem;flex-wrap:wrap}
.ship-note p{font-size:.95rem;color:var(--txtd)}
.empty{text-align:center;color:var(--muted);padding:3rem 0;font-size:1.05rem}

/* نافذة العرض السريع */
.modal{position:fixed;inset:0;z-index:1100;display:grid;place-items:center;padding:1.2rem;visibility:hidden;opacity:0;transition:.35s}
.modal.open{visibility:visible;opacity:1}
.modal__back{position:absolute;inset:0;background:rgba(10,8,5,.78)}
.modal__panel{position:relative;background:var(--paper);width:min(860px,100%);max-height:88vh;overflow:auto;
  border:1px solid var(--gold);outline:6px solid var(--ink);padding:16px;
  display:grid;grid-template-columns:1fr 1.15fr;gap:1.8rem;
  transform:translateY(24px) scale(.97);transition:transform .45s var(--e)}
.modal.open .modal__panel{transform:none}
.modal__x{position:absolute;top:10px;inset-inline-start:10px;width:38px;height:38px;background:var(--ink);color:var(--gold);border:1px solid var(--gold);z-index:3}
.modal__img{border:1px solid var(--linep);align-self:start}
.modal__img img{width:100%;aspect-ratio:4/5;object-fit:cover;filter:sepia(.15)}
.modal__body{padding:.6rem .4rem}
.modal__body h3{font-size:1.6rem;margin:.3rem 0 .6rem}
.modal__price{display:flex;gap:.8rem;align-items:baseline;margin-bottom:1rem}
.modal__price b{font-family:var(--f-display);font-size:1.5rem;color:var(--gold2)}
.modal__price s{color:var(--muted)}
.modal__lbl{font-weight:700;font-size:.9rem;margin:1.2rem 0 .6rem}
.modal__sizes{display:flex;gap:.6rem;flex-wrap:wrap;margin-bottom:1.6rem}
.size-chip{border:1.5px solid var(--ink);background:transparent;padding:.4rem 1rem;font-family:var(--f-body);font-size:.85rem;transition:.25s}
.size-chip.sel,.size-chip:hover{background:var(--ink);color:var(--gold)}
.modal__cta{width:100%}
.modal__note{margin-top:.9rem;font-size:.8rem;color:var(--muted);text-align:center}

/* ---------- المدونة ---------- */
.featured-post{display:grid;grid-template-columns:1.1fr .9fr;gap:0;background:var(--cream);
  border:1px solid var(--linep);padding:13px;margin-bottom:3.2rem}
.featured-post__img{overflow:hidden;border:1px solid var(--linep)}
.featured-post__img img{width:100%;height:100%;object-fit:cover;filter:sepia(.2);transition:.7s var(--e)}
.featured-post:hover .featured-post__img img{filter:sepia(0);transform:scale(1.03)}
.featured-post__body{padding:1.8rem 2rem;display:flex;flex-direction:column;gap:.7rem;justify-content:center}
.featured-post__body h2{font-size:clamp(1.4rem,2.6vw,1.9rem)}
.featured-post__body h2 a:hover{color:var(--gold2)}
.featured-post__body>p{color:var(--txtd);font-size:.95rem}
.featured-post__body .btn{align-self:flex-start;margin-top:.6rem}

/* ---------- المقال ---------- */
.article-wrap{padding-block:5rem 4rem}
.article{max-width:760px;margin-inline:auto}
.article__head{text-align:center;margin-bottom:2.8rem}
.article__head .crumbs{font-size:.8rem;color:var(--gold2);margin-bottom:1.4rem}
.article__head .crumbs a{color:var(--muted)}
.article__head .crumbs a:hover{color:var(--gold2)}
.article__head h1{font-size:clamp(1.9rem,4.4vw,3rem)}
.article__meta{display:flex;align-items:center;gap:.9rem;justify-content:center;margin-top:1.8rem}
.article__meta img{width:48px;height:48px;border-radius:50%;border:2px solid var(--gold);object-fit:cover;filter:sepia(.2)}
.article__meta div{display:flex;flex-direction:column;text-align:start;line-height:1.5}
.article__meta span{font-size:.8rem;color:var(--muted)}
.article__hero{margin-bottom:3rem}
.article__hero img{aspect-ratio:21/9}
.article__body{font-size:1.06rem;color:#2e281e}
.article__body p{margin-bottom:1.5rem}
.article__body h2{font-size:1.65rem;margin:2.8rem 0 1.1rem;position:relative;padding-inline-start:1.8rem}
.article__body h2::before{content:'✦';position:absolute;inset-inline-start:0;color:var(--gold);font-size:1.1rem}
.article__body ul{margin:0 0 1.6rem 1.2rem;list-style:none}
.article__body ul li{position:relative;padding-inline-start:1.6rem;margin-bottom:.6rem}
.article__body ul li::before{content:'✦';position:absolute;inset-inline-start:0;color:var(--gold2);font-size:.8rem;top:.3rem}
.pull{margin:2.8rem 0;border-inline-start:3px solid var(--gold);padding-inline-start:1.6rem;
  font-family:var(--f-display);font-weight:400;font-size:1.5rem;line-height:2.1;color:var(--ink)}
.pull cite{display:block;font-family:var(--f-body);font-style:normal;font-size:.9rem;color:var(--gold2);margin-top:.6rem}

.share{display:flex;align-items:center;gap:.7rem;flex-wrap:wrap;margin-top:3rem;padding-top:1.8rem;border-top:1px dashed var(--linep);font-weight:700;font-size:.92rem}
.share a,.share button{border:1.5px solid var(--ink);background:transparent;padding:.4rem 1.2rem;font-family:var(--f-body);font-weight:600;font-size:.85rem;transition:.3s;color:var(--ink)}
.share a:hover,.share button:hover{background:var(--ink);color:var(--gold)}

.authorbox{display:flex;gap:1.5rem;background:var(--cream);border:1px solid var(--linep);padding:1.8rem;margin-top:3rem;align-items:center}
.authorbox img{width:88px;height:88px;border-radius:50%;border:2px solid var(--gold);object-fit:cover;filter:sepia(.15);flex:none}
.authorbox h3{font-size:1.2rem;margin-bottom:.3rem}
.authorbox p{font-size:.9rem;color:var(--txtd)}

.related{margin-top:4.5rem}
.related h2{margin-bottom:2.2rem}

/* ---------- ريسبونسف صفحات الداخل ---------- */
@media(max-width:1024px){
  .story__grid{grid-template-columns:1fr;gap:3rem}
  .featured-post{grid-template-columns:1fr}
  .featured-post__img img{aspect-ratio:16/9}
  .modal__panel{grid-template-columns:1fr}
  .values{grid-template-columns:1fr}
  .value:nth-child(even){transform:none}
  .value:nth-child(even):hover{transform:translateY(-6px)}
}
@media(max-width:560px){
  .toolbar{flex-direction:column;align-items:stretch}
  .toolbar__side{flex-direction:column}
  .authorbox{flex-direction:column;text-align:center}
  .ship-note{flex-direction:column;text-align:center}
}