/*
  Koyamadai — Core utilities (semantic names)
  - Numeric / ad-hoc utility classes removed as requested
  - Spacing references use theme presets: --wp--preset--spacing--<slug>
  - Keep :is() selector pattern per style guide
*/

/* -----------------------------
  Spacing (margin)
  slugs from theme.json: 3xs,2xs,xs,sm,md,lg,xl,2xl,3xl,4xl,...
------------------------------ */
:is(.u-m-0) {
  margin: 0;
}
:is(.u-m-3-xs) {
  margin: var(--wp--preset--spacing--3-xs);
}
:is(.u-m-2-xs) {
  margin: var(--wp--preset--spacing--2-xs);
}
:is(.u-m-xs) {
  margin: var(--wp--preset--spacing--xs);
}
:is(.u-m-sm) {
  margin: var(--wp--preset--spacing--sm);
}
:is(.u-m-md) {
  margin: var(--wp--preset--spacing--base);
}
:is(.u-m-lg) {
  margin: var(--wp--preset--spacing--lg);
}
:is(.u-m-xl) {
  margin: var(--wp--preset--spacing--xl);
}
:is(.u-m-2-xl) {
  margin: var(--wp--preset--spacing--2-xl);
}
:is(.u-m-3-xl) {
  margin: var(--wp--preset--spacing--3-xl);
}

:is(.u-mt-0) {
  margin-top: 0;
}
:is(.u-mt-3-xs) {
  margin-top: var(--wp--preset--spacing--3-xs);
}
:is(.u-mt-2-xs) {
  margin-top: var(--wp--preset--spacing--2-xs);
}
:is(.u-mt-xs) {
  margin-top: var(--wp--preset--spacing--xs);
}
:is(.u-mt-sm) {
  margin-top: var(--wp--preset--spacing--sm);
}
:is(.u-mt-md) {
  margin-top: var(--wp--preset--spacing--base);
}
:is(.u-mt-lg) {
  margin-top: var(--wp--preset--spacing--lg);
}
:is(.u-mt-xl) {
  margin-top: var(--wp--preset--spacing--xl);
}

:is(.u-mb-0) {
  margin-bottom: 0;
}
:is(.u-mb-3-xs) {
  margin-bottom: var(--wp--preset--spacing--3-xs);
}
:is(.u-mb-2-xs) {
  margin-bottom: var(--wp--preset--spacing--2-xs);
}
:is(.u-mb-xs) {
  margin-bottom: var(--wp--preset--spacing--xs);
}
:is(.u-mb-sm) {
  margin-bottom: var(--wp--preset--spacing--sm);
}
:is(.u-mb-md) {
  margin-bottom: var(--wp--preset--spacing--base);
}
:is(.u-mb-lg) {
  margin-bottom: var(--wp--preset--spacing--lg);
}
:is(.u-mb-xl) {
  margin-bottom: var(--wp--preset--spacing--xl);
}

:is(.u-ml-0) {
  margin-left: 0;
}
:is(.u-ml-auto) {
  margin-left: auto;
}
:is(.u-mr-0) {
  margin-right: 0;
}
:is(.u-mr-auto) {
  margin-right: auto;
}
:is(.u-mx-auto) {
  margin-left: auto;
  margin-right: auto;
}

/* Vertical margin (top and bottom) */
:is(.u-my-0) {
  margin-top: 0;
  margin-bottom: 0;
}
:is(.u-my-:where(.sec-006-features)) {
  margin-top: var(--wp--preset--spacing--3-xs);
  margin-bottom: var(--wp--preset--spacing--3-xs);
}
:is(.u-my-2-xs) {
  margin-top: var(--wp--preset--spacing--2-xs);
  margin-bottom: var(--wp--preset--spacing--2-xs);
}
:is(.u-my-xs) {
  margin-top: var(--wp--preset--spacing--xs);
  margin-bottom: var(--wp--preset--spacing--xs);
}
:is(.u-my-sm) {
  margin-top: var(--wp--preset--spacing--sm);
  margin-bottom: var(--wp--preset--spacing--sm);
}
:is(.u-my-md) {
  margin-top: var(--wp--preset--spacing--base);
  margin-bottom: var(--wp--preset--spacing--base);
}
:is(.u-my-lg) {
  margin-top: var(--wp--preset--spacing--lg);
  margin-bottom: var(--wp--preset--spacing--lg);
}
:is(.u-my-xl) {
  margin-top: var(--wp--preset--spacing--xl);
  margin-bottom: var(--wp--preset--spacing--xl);
}
:is(.u-my-2-xl) {
  margin-top: var(--wp--preset--spacing--2-xl);
  margin-bottom: var(--wp--preset--spacing--2-xl);
}
:is(.u-my-3-xl) {
  margin-top: var(--wp--preset--spacing--3-xl);
  margin-bottom: var(--wp--preset--spacing--3-xl);
}
:is(.u-my-auto) {
  margin-top: auto;
  margin-bottom: auto;
}

/* -----------------------------
  Spacing (padding)
------------------------------ */
:is(.u-p-0) {
  padding: 0;
}
:is(.u-p-3-xs) {
  padding: var(--wp--preset--spacing--3-xs);
}
:is(.u-p-2-xs) {
  padding: var(--wp--preset--spacing--2-xs);
}
:is(.u-p-xs) {
  padding: var(--wp--preset--spacing--xs);
}
:is(.u-p-sm) {
  padding: var(--wp--preset--spacing--sm);
}
:is(.u-p-base) {
  padding: var(--wp--preset--spacing--base);
}
:is(.u-p-lg) {
  padding: var(--wp--preset--spacing--lg);
}
:is(.u-p-xl) {
  padding: var(--wp--preset--spacing--xl);
}

:is(.u-p-2-xl) {
  padding: var(--wp--preset--spacing--2-xl);
}

:is(.u-p-3-xl) {
  padding: var(--wp--preset--spacing--3-xl);
}

/* Axis: X (left & right) */
:is(.u-px-0) {
  padding-left: 0;
  padding-right: 0;
}
:is(.u-px-3-xs) {
  padding-left: var(--wp--preset--spacing--3-xs);
  padding-right: var(--wp--preset--spacing--3-xs);
}
:is(.u-px-2-xs) {
  padding-left: var(--wp--preset--spacing--2-xs);
  padding-right: var(--wp--preset--spacing--2-xs);
}
:is(.u-px-xs) {
  padding-left: var(--wp--preset--spacing--xs);
  padding-right: var(--wp--preset--spacing--xs);
}
:is(.u-px-sm) {
  padding-left: var(--wp--preset--spacing--sm);
  padding-right: var(--wp--preset--spacing--sm);
}
:is(.u-px-base) {
  padding-left: var(--wp--preset--spacing--base);
  padding-right: var(--wp--preset--spacing--base);
}
:is(.u-px-lg) {
  padding-left: var(--wp--preset--spacing--lg);
  padding-right: var(--wp--preset--spacing--lg);
}
:is(.u-px-xl) {
  padding-left: var(--wp--preset--spacing--xl);
  padding-right: var(--wp--preset--spacing--xl);
}
:is(.u-px-2-xl) {
  padding-left: var(--wp--preset--spacing--2-xl);
  padding-right: var(--wp--preset--spacing--2-xl);
}
:is(.u-px-3-xl) {
  padding-left: var(--wp--preset--spacing--3-xl);
  padding-right: var(--wp--preset--spacing--3-xl);
}

/* Axis: Y (top & bottom) */
:is(.u-py-0) {
  padding-top: 0;
  padding-bottom: 0;
}
:is(.u-py-3-xs) {
  padding-top: var(--wp--preset--spacing--3-xs);
  padding-bottom: var(--wp--preset--spacing--3-xs);
}
:is(.u-py-2-xs) {
  padding-top: var(--wp--preset--spacing--2-xs);
  padding-bottom: var(--wp--preset--spacing--2-xs);
}
:is(.u-py-xs) {
  padding-top: var(--wp--preset--spacing--xs);
  padding-bottom: var(--wp--preset--spacing--xs);
}
:is(.u-py-sm) {
  padding-top: var(--wp--preset--spacing--sm);
  padding-bottom: var(--wp--preset--spacing--sm);
}
:is(.u-py-base) {
  padding-top: var(--wp--preset--spacing--base);
  padding-bottom: var(--wp--preset--spacing--base);
}
:is(.u-py-lg) {
  padding-top: var(--wp--preset--spacing--lg);
  padding-bottom: var(--wp--preset--spacing--lg);
}
:is(.u-py-xl) {
  padding-top: var(--wp--preset--spacing--xl);
  padding-bottom: var(--wp--preset--spacing--xl);
}
:is(.u-py-2-xl) {
  padding-top: var(--wp--preset--spacing--2-xl);
  padding-bottom: var(--wp--preset--spacing--2-xl);
}
:is(.u-py-3-xl) {
  padding-top: var(--wp--preset--spacing--3-xl);
  padding-bottom: var(--wp--preset--spacing--3-xl);
}

/* Individual sides */
:is(.u-pt-0) {
  padding-top: 0;
}
:is(.u-pt-3-xs) {
  padding-top: var(--wp--preset--spacing--3-xs);
}
:is(.u-pt-2-xs) {
  padding-top: var(--wp--preset--spacing--2-xs);
}
:is(.u-pt-xs) {
  padding-top: var(--wp--preset--spacing--xs);
}
:is(.u-pt-sm) {
  padding-top: var(--wp--preset--spacing--sm);
}
:is(.u-pt-base) {
  padding-top: var(--wp--preset--spacing--base);
}
:is(.u-pt-lg) {
  padding-top: var(--wp--preset--spacing--lg);
}
:is(.u-pt-xl) {
  padding-top: var(--wp--preset--spacing--xl);
}
:is(.u-pt-2-xl) {
  padding-top: var(--wp--preset--spacing--2-xl);
}
:is(.u-pt-3-xl) {
  padding-top: var(--wp--preset--spacing--3-xl);
}

:is(.u-pr-0) {
  padding-right: 0;
}
:is(.u-pr-3-xs) {
  padding-right: var(--wp--preset--spacing--3-xs);
}
:is(.u-pr-2-xs) {
  padding-right: var(--wp--preset--spacing--2-xs);
}
:is(.u-pr-xs) {
  padding-right: var(--wp--preset--spacing--xs);
}
:is(.u-pr-sm) {
  padding-right: var(--wp--preset--spacing--sm);
}
:is(.u-pr-base) {
  padding-right: var(--wp--preset--spacing--base);
}
:is(.u-pr-lg) {
  padding-right: var(--wp--preset--spacing--lg);
}
:is(.u-pr-xl) {
  padding-right: var(--wp--preset--spacing--xl);
}
:is(.u-pr-2-xl) {
  padding-right: var(--wp--preset--spacing--2-xl);
}
:is(.u-pr-3-xl) {
  padding-right: var(--wp--preset--spacing--3-xl);
}

:is(.u-pb-0) {
  padding-bottom: 0;
}
:is(.u-pb-3-xs) {
  padding-bottom: var(--wp--preset--spacing--3-xs);
}
:is(.u-pb-2-xs) {
  padding-bottom: var(--wp--preset--spacing--2-xs);
}
:is(.u-pb-xs) {
  padding-bottom: var(--wp--preset--spacing--xs);
}
:is(.u-pb-sm) {
  padding-bottom: var(--wp--preset--spacing--sm);
}
:is(.u-pb-base) {
  padding-bottom: var(--wp--preset--spacing--base);
}
:is(.u-pb-lg) {
  padding-bottom: var(--wp--preset--spacing--lg);
}
:is(.u-pb-xl) {
  padding-bottom: var(--wp--preset--spacing--xl);
}
:is(.u-pb-2-xl) {
  padding-bottom: var(--wp--preset--spacing--2-xl);
}
:is(.u-pb-3-xl) {
  padding-bottom: var(--wp--preset--spacing--3-xl);
}

:is(.u-pl-0) {
  padding-left: 0;
}
:is(.u-pl-3-xs) {
  padding-left: var(--wp--preset--spacing--3-xs);
}
:is(.u-pl-2-xs) {
  padding-left: var(--wp--preset--spacing--2-xs);
}
:is(.u-pl-xs) {
  padding-left: var(--wp--preset--spacing--xs);
}
:is(.u-pl-sm) {
  padding-left: var(--wp--preset--spacing--sm);
}
:is(.u-pl-base) {
  padding-left: var(--wp--preset--spacing--base);
}
:is(.u-pl-lg) {
  padding-left: var(--wp--preset--spacing--lg);
}
:is(.u-pl-xl) {
  padding-left: var(--wp--preset--spacing--xl);
}
:is(.u-pl-2-xl) {
  padding-left: var(--wp--preset--spacing--2-xl);
}
:is(.u-pl-3-xl) {
  padding-left: var(--wp--preset--spacing--3-xl);
}

/* -----------------------------
  Display / Layout / Flex / Grid
------------------------------ */
:is(.u-hidden) {
  display: none;
}
:is(.u-block) {
  display: block;
}
:is(.u-inline) {
  display: inline;
}
:is(.u-inline-block) {
  display: inline-block;
}
:is(.u-flex) {
  display: flex;
}
:is(.u-inline-flex) {
  display: inline-flex;
}
:is(.u-grid) {
  display: grid;
}

:is(.u-flex--col) {
  flex-direction: column;
}
:is(.u-flex--wrap) {
  flex-wrap: wrap;
}
:is(.u-flex--center) {
  justify-content: center;
  align-items: center;
}
:is(.u-flex--between) {
  justify-content: space-between;
}

:is(.u-grid--2) {
  grid-template-columns: repeat(2, 1fr);
}
:is(.u-grid--3) {
  grid-template-columns: repeat(3, 1fr);
}
:is(.u-grid--gap-sm) {
  gap: var(--wp--preset--spacing--sm);
}

/* -----------------------------
  Typography / text
------------------------------ */

:is(.u-text-left) {
  text-align: left;
}
:is(.u-text-center) {
  text-align: center;
}
:is(.u-text-right) {
  text-align: right;
}

:is(.u-text-xs) {
  font-size: var(--wp--preset--font-size--tiny);
}
:is(.u-text-sm) {
  font-size: var(--wp--preset--font-size--xs);
}
:is(.u-text-base) {
  font-size: var(--wp--preset--font-size--base);
}
:is(.u-text-lg) {
  font-size: var(--wp--preset--font-size--lg);
}

/* -----------------------------
  Border / Radius / Shadow
------------------------------ */

:is(.u-rounded-none) {
  border-radius: var(--wp--custom--border--radius--none, 0);
}
:is(.u-rounded-sm) {
  border-radius: var(--wp--custom--border--radius--sm);
}
:is(.u-rounded-md) {
  border-radius: var(--wp--custom--border--radius--md);
}
:is(.u-rounded-lg) {
  border-radius: var(--wp--custom--border--radius--lg);
}

:is(.u-shadow-none) {
  box-shadow: none;
}
:is(.u-shadow-sm) {
  box-shadow: var(--wp--custom--shadow--sm, none);
}
:is(.u-shadow-md) {
  box-shadow: var(--wp--custom--shadow--md, none);
}

/* -----------------------------
  Accessibility / helpers
------------------------------ */
:is(.u-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;
}

/* Keep file intentionally small; component-level utilities can live in components/utilities.css */

:is(.text-3-xl) {
  font-size: var(--wp--preset--font-size--3-xl);
}

:is(.text-4-xl) {
  font-size: var(--wp--preset--font-size--4-xl);
}

:is(.text-5-xl) {
  font-size: var(--wp--preset--font-size--5-xl);
}

/* ========================================
   COLOR UTILITIES
   Using theme.json color presets
======================================== */

/* Text colors */
:is(.text-primary-100) {
  color: var(--wp--preset--color--primary-lightest);
}

:is(.text-primary-300) {
  color: var(--wp--preset--color--primary-light);
}

:is(.text-primary-500) {
  color: var(--wp--preset--color--primary);
}

:is(.text-primary-700) {
  color: var(--wp--preset--color--primary-dark);
}

:is(.text-primary-900) {
  color: var(--wp--preset--color--primary-darkest);
}

:is(.text-brand-100) {
  color: var(--wp--preset--color--secondary-lightest);
}

:is(.text-brand-300) {
  color: var(--wp--preset--color--secondary-light);
}

:is(.text-brand-500) {
  color: var(--wp--preset--color--secondary);
}

:is(.text-brand-700) {
  color: var(--wp--preset--color--secondary-dark);
}

:is(.text-brand-900) {
  color: var(--wp--preset--color--secondary-darkest);
}

:is(.text-gray-100) {
  color: var(--wp--preset--color--gray-lightest);
}

:is(.text-gray-200) {
  color: var(--wp--preset--color--gray-lighter);
}

:is(.text-gray-300) {
  color: var(--wp--preset--color--gray-light);
}

:is(.text-gray-400) {
  color: var(--wp--preset--color--gray);
}

:is(.text-gray-500) {
  color: var(--wp--preset--color--gray-dark);
}

:is(.text-gray-600) {
  color: var(--wp--preset--color--gray-darker);
}

:is(.text-gray-700) {
  color: var(--wp--preset--color--gray-darkest);
}

:is(.text-gray-800) {
  color: var(--wp--preset--color--gray-darkest);
}

:is(.text-gray-900) {
  color: var(--wp--preset--color--gray-darkest);
}

:is(.text-white) {
  color: var(--wp--preset--color--white);
}

:is(.text-black) {
  color: var(--wp--preset--color--black);
}

:is(.text-success) {
  color: var(--wp--preset--color--success);
}

:is(.text-warning) {
  color: var(--wp--preset--color--warning);
}

:is(.text-error) {
  color: var(--wp--preset--color--error);
}

/* Background colors */
:is(.bg-primary-100) {
  background-color: var(--wp--preset--color--primary-lightest);
}

:is(.bg-primary-300) {
  background-color: var(--wp--preset--color--primary-light);
}

:is(.bg-primary-500) {
  background-color: var(--wp--preset--color--primary);
}

:is(.bg-primary-700) {
  background-color: var(--wp--preset--color--primary-dark);
}

:is(.bg-primary-900) {
  background-color: var(--wp--preset--color--primary-darkest);
}

:is(.bg-brand-100) {
  background-color: var(--wp--preset--color--secondary-lightest);
}

:is(.bg-brand-300) {
  background-color: var(--wp--preset--color--secondary-light);
}

:is(.bg-brand-500) {
  background-color: var(--wp--preset--color--secondary);
}

:is(.bg-brand-700) {
  background-color: var(--wp--preset--color--secondary-dark);
}

:is(.bg-brand-900) {
  background-color: var(--wp--preset--color--secondary-darkest);
}

:is(.bg-gray-100) {
  background-color: var(--wp--preset--color--gray-lightest);
}

:is(.bg-gray-200) {
  background-color: var(--wp--preset--color--gray-lighter);
}

:is(.bg-gray-300) {
  background-color: var(--wp--preset--color--gray-light);
}

:is(.bg-gray-400) {
  background-color: var(--wp--preset--color--gray);
}

:is(.bg-gray-500) {
  background-color: var(--wp--preset--color--gray-dark);
}

:is(.bg-gray-600) {
  background-color: var(--wp--preset--color--gray-darker);
}

:is(.bg-gray-700) {
  background-color: var(--wp--preset--color--gray-darkest);
}

:is(.bg-gray-800) {
  background-color: var(--wp--preset--color--gray-darkest);
}

:is(.bg-gray-900) {
  background-color: var(--wp--preset--color--gray-darkest);
}

:is(.bg-white) {
  background-color: var(--wp--preset--color--white);
}

:is(.bg-black) {
  background-color: var(--wp--preset--color--black);
}

:is(.bg-success) {
  background-color: var(--wp--preset--color--success);
}

:is(.bg-warning) {
  background-color: var(--wp--preset--color--warning);
}

:is(.bg-error) {
  background-color: var(--wp--preset--color--error);
}

/* ========================================
   BORDER RADIUS UTILITIES
======================================== */
:is(.rounded-none) {
  border-radius: 0;
}

:is(.rounded-sm) {
  border-radius: 4px;
}

:is(.rounded) {
  border-radius: 8px;
}

:is(.rounded-md) {
  border-radius: 12px;
}

:is(.rounded-lg) {
  border-radius: 16px;
}

:is(.rounded-2-xl) {
  border-radius: 24px;
}

:is(.rounded-3-xl) {
  border-radius: 32px;
}

:is(.rounded-full) {
  border-radius: 9999px;
}

/* ========================================
   POSITION UTILITIES
======================================== */
:is(.relative) {
  position: relative;
}

:is(.absolute) {
  position: absolute;
}

:is(.fixed) {
  position: fixed;
}

:is(.sticky) {
  position: sticky;
}

:is(.static) {
  position: static;
}

/* ========================================
   WIDTH & HEIGHT UTILITIES
======================================== */
:is(.w-auto) {
  width: auto;
}

:is(.w-full) {
  width: 100%;
}

:is(.w-screen) {
  width: 100vw;
}

:is(.h-auto) {
  height: auto;
}

:is(.h-full) {
  height: 100%;
}

:is(.h-screen) {
  height: 100vh;
}

:is(.max-w-none) {
  max-width: none;
}

:is(.max-w-content) {
  max-width: var(--wp--style--layout--content-size, 1080px);
  margin-left: auto;
  margin-right: auto;
}

:is(.max-w-wide) {
  max-width: var(--wp--style--layout--wide-size, 1440px);
  margin-left: auto;
  margin-right: auto;
}

/* ========================================
   ANIMATION UTILITIES
======================================== */
:is(.transition) {
  transition-property: color, background-color, border-color,
    text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter,
    backdrop-filter;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}

:is(.transition-all) {
  transition-property: all;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}

:is(.duration-75) {
  transition-duration: 75ms;
}

:is(.duration-100) {
  transition-duration: 100ms;
}

:is(.duration-150) {
  transition-duration: 150ms;
}

:is(.duration-200) {
  transition-duration: 200ms;
}

:is(.duration-300) {
  transition-duration: 300ms;
}

:is(.duration-500) {
  transition-duration: 500ms;
}

:is(.duration-700) {
  transition-duration: 700ms;
}

:is(.duration-1000) {
  transition-duration: 1000ms;
}

:is(.ease-linear) {
  transition-timing-function: linear;
}

:is(.ease-in) {
  transition-timing-function: cubic-bezier(0.4, 0, 1, 1);
}

:is(.ease-out) {
  transition-timing-function: cubic-bezier(0, 0, 0.2, 1);
}

:is(.ease-in-out) {
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}

/* Fade in animation */
:is(.fade-in) {
  animation: fade-in 0.6s ease both;
}

@keyframes fade-in {
  from {
    opacity: 0;
    transform: translateY(8px);
  }
  to {
    opacity: 1;
    transform: none;
  }
}

:is(.fade-in-up) {
  animation: fadeInUp 0.8s ease-out forwards;
}

@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(30px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* ========================================
   BREAKPOINT UTILITIES (MOBILE-FIRST)
======================================== */

:is(.xl\:block) {
  display: block;
}
:is(.xl\:hidden) {
  display: none;
}
:is(.xl\:flex) {
  display: flex;
}
:is(.xl\:grid) {
  display: grid;
}
:is(.xl\:grid-cols-2) {
  grid-template-columns: repeat(2, 1fr);
}
:is(.xl\:grid-cols-3) {
  grid-template-columns: repeat(3, 1fr);
}
:is(.xl\:grid-cols-4) {
  grid-template-columns: repeat(4, 1fr);
}
:is(.xl\:grid-cols-5) {
  grid-template-columns: repeat(5, 1fr);
}
:is(.xl\:grid-cols-6) {
  grid-template-columns: repeat(6, 1fr);
}

:is(.u-bg-glass) {
  background: rgba(255, 255, 255, 0.95);
  backdrop-filter: blur(10px);
}