/* Shared site styles for The Leighton Collective.
 * "Digital Kennel" design system — tactile, squishable, kid-friendly. */

/* Material Symbols default weight tuning. */
.material-symbols-outlined {
  font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
  vertical-align: middle;
}

/* Primary CTA — lifted button with a "squish" press. */
.squish-shadow {
  box-shadow: 0 4px 0 0 rgba(127, 86, 0, 0.2);
  transition: transform 0.1s ease, box-shadow 0.1s ease;
}
.squish-shadow:active {
  transform: translateY(3px);
  box-shadow: 0 0 0 0 transparent;
}

/* Inset-press variant for secondary buttons. */
.squish-active {
  transition: transform 0.1s ease, box-shadow 0.1s ease;
}
.squish-active:active {
  transform: scale(0.96);
  box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.1);
}

/* Asymmetric "blob" mask for product imagery. */
.blob-shape,
.blob-mask,
.organic-blob {
  border-radius: 60% 40% 30% 70% / 60% 30% 70% 40%;
}

/* Stitched dashed border for "Custom Studio" badges. */
.stitched-border,
.badge-stitch,
.dashed-stitch {
  border: 2px dashed #7f5600;
}

/* FOUC mitigation while partials load. */
[data-mount] {
  min-height: 0;
}

/* Cart drawer transitions. */
.cart-drawer {
  transform: translateX(100%);
  transition: transform 0.25s ease-out;
}
.cart-drawer.open {
  transform: translateX(0);
}
.cart-backdrop {
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.2s ease-out;
}
.cart-backdrop.open {
  opacity: 1;
  pointer-events: auto;
}

/* Print-friendly Adoption Certificate. */
@media print {
  .no-print { display: none !important; }
  body { background: white !important; }
  .print-full {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }
}

/* Hide elements until JS swaps loading → ready. */
.js-cloak { visibility: hidden; }
.js-ready .js-cloak { visibility: visible; }