/* ============================================================
   AMAZONITA CREATIVA — UTILITIES
   ============================================================ */

/* --- DISPLAY --- */
.block   { display: block; }
.inline  { display: inline; }
.hidden  { display: none !important; }
.sr-only {
  position: absolute; width: 1px; height: 1px;
  padding: 0; margin: -1px; overflow: hidden;
  clip: rect(0,0,0,0); white-space: nowrap; border-width: 0;
}

/* --- TEXT ALIGN --- */
.text-left    { text-align: left; }
.text-center  { text-align: center; }
.text-right   { text-align: right; }

/* --- TEXT COLORS --- */
.text-accent   { color: var(--clr-accent); }
.text-accent2  { color: var(--clr-accent2); }
.text-muted    { color: var(--clr-text-muted); }
.text-faint    { color: var(--clr-text-faint); }
.text-white    { color: var(--clr-white); }
.text-gradient {
  background: var(--grad-accent);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

/* --- FONT --- */
.font-display { font-family: var(--font-display); }
.font-mono    { font-family: var(--font-mono); }
.font-bold    { font-weight: 700; }
.font-black   { font-weight: 900; }

/* --- SPACING HELPERS --- */
.mt-auto { margin-top: auto; }
.mb-4    { margin-bottom: var(--space-4); }
.mb-6    { margin-bottom: var(--space-6); }
.mb-8    { margin-bottom: var(--space-8); }
.mt-8    { margin-top: var(--space-8); }

/* --- POSITION --- */
.relative { position: relative; }
.absolute { position: absolute; }

/* --- OVERFLOW --- */
.overflow-hidden { overflow: hidden; }

/* --- BACKGROUNDS --- */
.bg-surface     { background: var(--clr-surface); }
.bg-surface-alt { background: var(--clr-surface-alt); }
.bg-alt         { background: var(--clr-bg-alt); }

/* --- BORDER --- */
.border-top    { border-top: 1px solid var(--clr-border); }
.border-bottom { border-bottom: 1px solid var(--clr-border); }

/* --- ROUNDED --- */
.rounded-full { border-radius: var(--radius-full); }
.rounded-2xl  { border-radius: var(--radius-2xl); }

/* --- SHADOWS --- */
.shadow-glow { box-shadow: var(--shadow-glow); }

/* --- ASPECT RATIOS --- */
.aspect-square { aspect-ratio: 1/1; }
.aspect-video  { aspect-ratio: 16/9; }

/* --- FULL WIDTH --- */
.w-full  { width: 100%; }
.h-full  { height: 100%; }
.min-h-screen { min-height: 100svh; }

/* --- PAGE TITLE --- */
.page-hero {
  padding-top: calc(80px + var(--space-16));
  padding-bottom: var(--space-16);
  border-bottom: 1px solid var(--clr-border);
  margin-bottom: var(--space-16);
  position: relative;
}

.page-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse at 50% 100%, rgba(94,255,163,0.05) 0%, transparent 60%);
  pointer-events: none;
}

.page-hero__breadcrumb {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  font-size: var(--text-xs);
  font-weight: 600;
  letter-spacing: var(--tracking-wide);
  text-transform: uppercase;
  color: var(--clr-text-faint);
  margin-bottom: var(--space-6);
}

.page-hero__breadcrumb a { transition: color var(--dur-fast); }
.page-hero__breadcrumb a:hover { color: var(--clr-accent); }
.page-hero__breadcrumb span { color: var(--clr-accent); }

.page-hero__title {
  font-family: var(--font-display);
  font-size: clamp(var(--text-4xl), 6vw, var(--text-7xl));
  font-weight: 800;
  letter-spacing: var(--tracking-tight);
  line-height: var(--leading-tight);
}

.page-hero__desc {
  font-size: clamp(var(--text-base), 2vw, var(--text-xl));
  color: var(--clr-text-muted);
  max-width: 600px;
  line-height: var(--leading-loose);
  margin-top: var(--space-5);
}

/* --- WOOCOMMERCE NOTICES --- */
.woocommerce-message,
.woocommerce-error,
.woocommerce-info {
  background: var(--clr-surface);
  border: 1px solid var(--clr-border);
  border-radius: var(--radius-xl);
  padding: var(--space-4) var(--space-6);
  margin-bottom: var(--space-4);
  font-size: var(--text-sm);
  display: flex;
  align-items: center;
  gap: var(--space-3);
}

.woocommerce-message { border-color: rgba(94,255,163,0.3); color: var(--clr-accent); }
.woocommerce-error   { border-color: rgba(239,68,68,0.3);  color: #f87171; }
.woocommerce-info    { border-color: rgba(167,139,250,0.3); color: var(--clr-accent2); }