/* === Tailwind-lite purged utilities (handcrafted for this page) === */
/* Breakpoints */
@media (min-width: 640px){:root{--sm:1}}
@media (min-width: 768px){:root{--md:1}}
@media (min-width: 1280px){:root{--xl:1}}

/* Layout helpers */
.mx-auto{margin-left:auto;margin-right:auto}
.relative{position:relative}
.absolute{position:absolute}
.inline-flex{display:inline-flex}
.flex{display:flex}
.grid{display:grid}
.hidden{display:none}
.block{display:block}

/* Flex & Grid alignment */
.items-center{align-items:center}
.items-end{align-items:flex-end}
.justify-between{justify-content:space-between}
.justify-end{justify-content:flex-end}
.flex-wrap{flex-wrap:wrap}
/* gap utilities */
.gap-2{gap:.5rem}
.gap-3{gap:.75rem}
.gap-4{gap:1rem}
.gap-6{gap:1.5rem}

/* Grid columns */
.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}
/* responsive grid */
@media (min-width:640px){.sm\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:768px){
  .md\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
  .md\:grid-cols-5{grid-template-columns:repeat(5,minmax(0,1fr))}
  .md\:col-span-2{grid-column:span 2/span 2}
  .md\:col-span-3{grid-column:span 3/span 3}
  .md\:order-1{order:1}
  .md\:order-2{order:2}
}
@media (min-width:1280px){.xl\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}}

/* Spacing */
.p-4{padding:1rem}
.p-6{padding:1.5rem}
.px-3{padding-left:.75rem;padding-right:.75rem}
.px-4{padding-left:1rem;padding-right:1rem}
.py-2{padding-top:.5rem;padding-bottom:.5rem}
.py-2\.5{padding-top:.625rem;padding-bottom:.625rem}
.py-8{padding-top:2rem;padding-bottom:2rem}
.py-12{padding-top:3rem;padding-bottom:3rem}
.mt-1{margin-top:.25rem}
.mt-2{margin-top:.5rem}
.mt-3{margin-top:.75rem}
.mt-4{margin-top:1rem}
.mt-6{margin-top:1.5rem}
.mb-2{margin-bottom:.5rem}
.mb-3{margin-bottom:.75rem}
.mb-4{margin-bottom:1rem}
.mb-6{margin-bottom:1.5rem}
.mb-8{margin-bottom:2rem}

/* Sizing & container */
.max-w-6xl{max-width:72rem}
.max-w-7xl{max-width:80rem}
.w-full{width:100%}

/* Typography */
.text-sm{font-size:.875rem;line-height:1.25rem}
.text-lg{font-size:1.125rem;line-height:1.75rem}
.text-xl{font-size:1.25rem;line-height:1.75rem}
.text-2xl{font-size:1.5rem;line-height:2rem}
/* responsive text */
@media (min-width:640px){.sm\:text-3xl{font-size:1.875rem;line-height:2.25rem}}
.font-medium{font-weight:500}
.font-semibold{font-weight:600}
.font-bold{font-weight:700}
.leading-snug{line-height:1.375}
.tracking-tight{letter-spacing:-.015em}

/* Colors (approximate Tailwind neutrals & brand) */
.text-neutral-400{color:#9ca3af}
.text-neutral-500{color:#6b7280}
.text-neutral-600{color:#52525b}
.text-neutral-700{color:#404040}
.bg-white{background:#fff}
.bg-blue-50{background:#eff6ff}
.text-blue-700{color:#1d4ed8}
.text-blue-600{color:#2563eb}
.hover\:underline:hover{text-decoration:underline}

/* Borders & radius */
.border{border-width:1px;border-style:solid;border-color:#e5e7eb}
.border-dashed{border-style:dashed}
.border-neutral-200{border-color:#e5e7eb}
.border-neutral-300{border-color:#d1d5db}
.rounded-2xl{border-radius:1rem}
.rounded-xl{border-radius:.75rem}
.rounded-full{border-radius:9999px}

/* Buttons / states */
.hover\:bg-neutral-100:hover{background:#f5f5f5}

/* Utilities */
.inline-block{display:inline-block}
.overflow-hidden{overflow:hidden}

/* Accessibility helpers used */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* Cards layout used in Products */
.pc-media{position:relative;width:100%;aspect-ratio:16/10;background:#f5f5f4;overflow:hidden}
.pc-media--square{aspect-ratio:1/1}
article.border{background:#fff}

/* Ensure icons layout matches expectation */
i.ti{display:inline-block;line-height:1}