/* ==========================================================================
   VELVET BREW — main stylesheet
   Imports the full modular system. Order matters (tokens → reset → type → ...).
   ========================================================================== */
@import url("base/variables.css");
@import url("base/reset.css");
@import url("base/typography.css");
@import url("base/utilities.css");

@import url("layout/grid.css");
@import url("layout/header.css");
@import url("layout/navigation.css");
@import url("layout/footer.css");
@import url("layout/cart.css");

@import url("pages/home.css");
@import url("pages/brand-story.css");
@import url("pages/products.css");
@import url("pages/product-detail.css");
@import url("pages/about.css");
@import url("pages/blog.css");
@import url("pages/checkout.css");

/* Custom cursor (desktop, pointer:fine only) */
@media (hover: hover) and (pointer: fine) {
  .cursor-dot, .cursor-ring { position: fixed; top: 0; left: 0; pointer-events: none; z-index: var(--z-cursor); border-radius: 50%; mix-blend-mode: difference; }
  .cursor-dot { width: 6px; height: 6px; background: #fff; translate: -50% -50%; transition: transform 0.2s ease; }
  .cursor-ring { 
    width: 36px; height: 36px; 
    border: 1px solid rgba(255, 255, 255, 0.8); 
    translate: -50% -50%; 
    transition: width 0.3s var(--ease-out), height 0.3s var(--ease-out), background 0.3s var(--ease-out), border-color 0.3s var(--ease-out);
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
  }
  .cursor-label {
    color: #fff;
    font-family: var(--font-body);
    font-size: 9px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    opacity: 0;
    transform: scale(0.7);
    transition: opacity 0.25s var(--ease-out), transform 0.25s var(--ease-out);
    pointer-events: none;
    display: inline-block;
  }
  .cursor-ring.hover { 
    width: 60px; height: 60px; 
    background: rgba(255, 255, 255, 0.12); 
  }
  .cursor-ring.hover-active {
    width: 76px; height: 76px;
    background: rgba(255, 255, 255, 0.15);
    border-color: rgba(255, 255, 255, 0.95);
  }
  .cursor-ring.hover-active .cursor-label {
    opacity: 1;
    transform: scale(1);
  }
  body.has-cursor, body.has-cursor * { cursor: none; }
}

/* Page-load curtain */
.page-curtain { position: fixed; inset: 0; z-index: calc(var(--z-modal) + 10); background: var(--bg-inverse); display: grid; place-items: center; transition: transform 0.6s var(--ease-in-out); }
.page-curtain.lifted { transform: translateY(-100%); pointer-events: none; }
.page-curtain .pc-mark { font-family: var(--font-display); font-weight: 800; font-size: clamp(2rem,8vw,4rem); color: var(--bg); opacity: 0.9; letter-spacing: -0.03em; }

/* Lenis */
html.lenis, html.lenis body { height: auto; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }
.lenis.lenis-stopped { overflow: hidden; }