/* ============================================================
     ZAHYA — Products / interior-page overrides
     Loads on top of style.css. Only contains rules that are
     unique to these pages or that intentionally differ from
     style.css; anything identical to style.css was removed.
     ============================================================ */

  .btn-sm{ padding:.68rem 1.4rem; font-size:.72rem; }

  .reveal{ opacity:0; transform:translateY(24px); transition:opacity .8s var(--ease), transform .8s var(--ease); }
  .reveal.is-in{ opacity:1; transform:translateY(0); }

  /* ---------------- Utility bar (differs from style.css) ---------------- */
  .utility-bar{ background:var(--band); color:var(--text-soft); font-size:.76rem; letter-spacing:.06em; }

  /* ---------------- Breadcrumb ---------------- */
  .breadcrumb{ background:var(--surface); border-bottom:1px solid var(--line-soft); font-size:.78rem; color:var(--text-soft); }
  .breadcrumb .wrap{ display:flex; align-items:center; flex-wrap:wrap; padding-block:1.1rem; }
  .breadcrumb a:hover{ color:var(--maroon); }
  .breadcrumb .sep{ opacity:.5; margin-inline:.5rem; }
  .breadcrumb .current{ color:var(--text); font-weight:600; }

  .section-head{ margin-bottom:2.6rem; }
  .section-head p{ max-width:52ch; }

  /* ---------------- Story prose ---------------- */
  .story-prose{ padding-block:0 clamp(3.5rem,7vw,6rem); background:var(--ground); }
  .story-prose .wrap{ max-width:820px; }
  .story-prose p{ color:var(--text-soft); font-size:1.03rem; margin-bottom:1.3rem; }
  .story-prose p:last-child{ margin-bottom:0; }

  /* ---------------- Values ---------------- */
  .values{ padding-block:clamp(3.5rem,7vw,6rem); background:var(--surface); border-block:1px solid var(--line-soft); }
  .values-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:1.4rem; }
  .value-card{ background:var(--ground); border:1px solid var(--line-soft); border-radius:var(--radius); padding:2rem 1.7rem; display:flex; flex-direction:column; gap:1.1rem; }
  .value-card .v-icon{ width:44px; height:44px; border-radius:50%; background:var(--surface-alt); display:flex; align-items:center; justify-content:center; color:var(--maroon); flex:none; }
  .value-card .v-icon svg{ width:20px; height:20px; }
  .value-card h3{ font-size:1.1rem; }
  .value-card p{ font-size:.9rem; color:var(--text-soft); }

  /* ---------------- Process ---------------- */
  .process{ padding-block:clamp(3.5rem,7vw,6rem); background:var(--ground); }
  .process-steps{ display:grid; grid-template-columns:repeat(5,1fr); gap:1.6rem; position:relative; counter-reset:step; }
  .process-steps::before{ content:""; position:absolute; top:26px; left:8%; right:8%; height:1px; background:var(--line); z-index:0; }
  .step-item{ position:relative; z-index:1; display:flex; flex-direction:column; gap:.8rem; text-align:center; align-items:center; }
  .step-badge{ width:52px; height:52px; border-radius:50%; background:var(--surface); border:1px solid var(--line); display:flex; align-items:center; justify-content:center; color:var(--maroon); font-family:var(--font-display); font-size:1.15rem; flex:none; }
  .step-label{ font-size:.66rem; letter-spacing:.12em; text-transform:uppercase; color:var(--accent-pop); font-weight:600; }
  .step-item h3{ font-size:1rem; }
  .step-item p{ font-size:.84rem; color:var(--text-soft); max-width:22ch; }

  /* ---------------- Team ---------------- */
  .team{ padding-block:clamp(3.5rem,7vw,6rem); background:var(--surface); border-block:1px solid var(--line-soft); }
  .team-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.8rem; }
  .team-card{ display:flex; flex-direction:column; gap:1rem; }
  .team-visual{ aspect-ratio:1/1; border-radius:var(--radius); overflow:hidden; }
  .team-visual .visual-icon svg{ width:38%; height:38%; }
  .team-card h3{ font-size:1.18rem; margin-top:.1rem; }
  .team-role{ display:block; font-size:.74rem; letter-spacing:.08em; text-transform:uppercase; color:var(--accent-pop); font-weight:600; margin-bottom:.2rem; }
  .team-card p.bio{ font-size:.92rem; color:var(--text-soft); }

  /* ---------------- Responsive ---------------- */
  @media (max-width:1080px){
    .values-grid{ grid-template-columns:repeat(2,1fr); }
    .process-steps{ grid-template-columns:repeat(3,1fr); row-gap:2.4rem; }
    .process-steps::before{ display:none; }
  }
  @media (max-width:820px){
    .team-grid{ grid-template-columns:1fr 1fr; }
  }
  @media (max-width:560px){
    .footer-top{ grid-template-columns:1fr; }
    .values-grid{ grid-template-columns:1fr; }
    .process-steps{ grid-template-columns:1fr 1fr; }
    .team-grid{ grid-template-columns:1fr; }
  }

  /* ---------------- Shop grid + filters (Products/Shop-All page) ---------------- */
  .shop-grid{ padding-block:clamp(3.5rem,7vw,6rem) clamp(5rem,9vw,8rem); background:var(--ground); }
  .filter-bar{ display:flex; flex-wrap:wrap; gap:.7rem; margin-bottom:2.6rem; }
  .filter-btn{ padding:.62rem 1.3rem; font-size:.76rem; font-weight:600; letter-spacing:.05em; border:1px solid var(--line); border-radius:999px; background:var(--surface); color:var(--text-soft); transition:background .3s var(--ease), color .3s var(--ease), border-color .3s var(--ease); }
  .filter-btn:hover{ border-color:var(--maroon); color:var(--maroon); }
  .filter-btn.is-active{ background:var(--maroon); border-color:var(--maroon); color:#fff7f2; }
  .filter-count{ display:inline-block; margin-inline-start:.3rem; opacity:.7; font-weight:400; }
  .products-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.6rem; }
  .prod-tile{ display:flex; flex-direction:column; gap:.9rem; }
  .prod-tile-link{ display:flex; flex-direction:column; gap:.9rem; color:inherit; }
  .prod-tile.flip-move{ transition:transform .5s var(--ease); }
  .prod-tile.flip-enter{ opacity:0; transform:scale(.92); }
  .prod-tile.flip-enter-active{ opacity:1; transform:scale(1); transition:opacity .45s var(--ease), transform .45s var(--ease); }
  .prod-tile.flip-leave{ opacity:0; transform:scale(.92); transition:opacity .22s var(--ease), transform .22s var(--ease); pointer-events:none; }
  .prod-tile-visual{ aspect-ratio:1/1; border-radius:var(--radius); position:relative; overflow:hidden; background:#fff; display:flex; align-items:center; justify-content:center; }
  .prod-tile-visual .tag{ position:absolute; top:.8rem; inset-inline-start:.8rem; z-index:2; background:var(--chip-ink); color:var(--ink); font-size:.64rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; padding:.3rem .6rem; border-radius:999px; }
  .prod-tile-visual img{ width:100%; height:100%; object-fit:contain; padding:1.5rem; box-sizing:border-box; transition:transform .6s var(--ease); }
  .prod-tile:hover .prod-tile-visual img{ transform:scale(1.06); }
  .prod-tile-body{ display:flex; flex-direction:column; gap:.3rem; }
  .prod-tile-cat{ font-size:.7rem; letter-spacing:.07em; text-transform:uppercase; color:var(--text-soft); }
  .prod-tile h3{ font-size:1.1rem; }
  .prod-tile-foot{ display:flex; justify-content:space-between; align-items:center; margin-top:.2rem; }
  .prod-tile-price{ font-family:var(--font-display); font-size:1.08rem; color:var(--accent-pop); }
  .tile-add{ display:inline-flex; align-items:center; gap:.4rem; padding:.5rem .9rem; border:1px solid var(--maroon); border-radius:999px; color:var(--maroon); font-size:.74rem; font-weight:600; letter-spacing:.04em; text-transform:uppercase; transition:background .3s var(--ease), color .3s var(--ease); }
  .tile-add svg{ width:15px; height:15px; }
  .tile-add:hover{ background:var(--maroon); color:#fff7f2; }
  .tile-add.added{ background:var(--olive); border-color:var(--olive); color:#fff7f2; }
  .tile-add span{ white-space:nowrap; }
  .no-results{ grid-column:1/-1; text-align:center; color:var(--text-soft); padding:3rem 1rem; font-size:.94rem; }
  .prod-note{ margin-top:2.4rem; font-size:.92rem; color:var(--text-soft); text-align:center; }
  .prod-note a{ color:var(--maroon); text-decoration:underline; }
  @media (max-width:1080px){
    .products-grid{ grid-template-columns:repeat(2,1fr); }
  }
  @media (max-width:560px){
    .products-grid{ grid-template-columns:1fr; }
  }