/* ============================================================
   ARUNE SUPERSEO v2.1 — DESIGN SYSTEM
   Foundation layer: tokens, reset, typography, utilities
   ============================================================ */

/* ── Google Fonts ─────────────────────────────────────────── */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=Outfit:wght@400;600;700&display=swap');

/* ── CSS Custom Properties ────────────────────────────────── */
:root {
  /* Colors */
  --color-bg:           #0A0B14;
  --color-surface:      #111224;
  --color-surface-2:    #1A1C30;
  --color-surface-3:    #22253D;
  --color-primary:      #6C63FF;
  --color-primary-dark: #5249E0;
  --color-primary-light:#8A83FF;
  --color-accent:       #00D4AA;
  --color-accent-dark:  #00B090;
  --color-accent-light: #33DEBB;
  --color-danger:       #FF4D6D;
  --color-danger-dark:  #D93A58;
  --color-warning:      #FFB830;
  --color-warning-dark: #E5A020;
  --color-success:      #22D3A5;
  --color-success-dark: #18B88D;
  --color-text-primary: #F0F2FF;
  --color-text-secondary:#8B8FA8;
  --color-text-muted:   #5A5E78;
  --color-border:       rgba(255,255,255,0.08);
  --color-border-hover: rgba(255,255,255,0.15);
  --color-overlay:      rgba(10,11,20,0.85);

  /* Gradients */
  --gradient-primary:   linear-gradient(135deg, #6C63FF 0%, #8A83FF 100%);
  --gradient-accent:    linear-gradient(135deg, #00D4AA 0%, #33DEBB 100%);
  --gradient-danger:    linear-gradient(135deg, #FF4D6D 0%, #FF7A8A 100%);
  --gradient-warning:   linear-gradient(135deg, #FFB830 0%, #FFCF6E 100%);
  --gradient-success:   linear-gradient(135deg, #22D3A5 0%, #44E4BB 100%);
  --gradient-card:      linear-gradient(135deg, rgba(108,99,255,0.08) 0%, rgba(0,212,170,0.05) 100%);
  --gradient-sidebar:   linear-gradient(180deg, #111224 0%, #0D0E1F 100%);

  /* Border Radii */
  --radius-xs:  4px;
  --radius-sm:  8px;
  --radius-md:  12px;
  --radius-lg:  16px;
  --radius-xl:  24px;
  --radius-full:9999px;

  /* Typography */
  --font-sans:    'Inter', system-ui, -apple-system, sans-serif;
  --font-display: 'Outfit', system-ui, sans-serif;
  --font-mono:    'JetBrains Mono', 'Fira Code', 'Courier New', monospace;

  /* Font Sizes */
  --text-xs:   0.625rem;  /* 10px */
  --text-sm:   0.75rem;   /* 12px */
  --text-base: 0.875rem;  /* 14px */
  --text-lg:   1rem;      /* 16px */
  --text-xl:   1.125rem;  /* 18px */
  --text-2xl:  1.25rem;   /* 20px */
  --text-3xl:  1.5rem;    /* 24px */
  --text-4xl:  2rem;      /* 32px */
  --text-5xl:  2.5rem;    /* 40px */

  /* Line Heights */
  --lh-tight:  1.2;
  --lh-snug:   1.4;
  --lh-normal: 1.6;
  --lh-relaxed:1.75;

  /* Shadows */
  --shadow-xs:           0 1px 3px rgba(0,0,0,0.4);
  --shadow-sm:           0 2px 8px rgba(0,0,0,0.4);
  --shadow-card:         0 4px 24px rgba(0,0,0,0.5), 0 1px 4px rgba(0,0,0,0.3);
  --shadow-lg:           0 8px 40px rgba(0,0,0,0.6), 0 2px 8px rgba(0,0,0,0.4);
  --shadow-glow-primary: 0 0 24px rgba(108,99,255,0.35), 0 0 8px rgba(108,99,255,0.2);
  --shadow-glow-accent:  0 0 24px rgba(0,212,170,0.35), 0 0 8px rgba(0,212,170,0.2);
  --shadow-glow-danger:  0 0 24px rgba(255,77,109,0.35), 0 0 8px rgba(255,77,109,0.2);
  --shadow-glow-warning: 0 0 24px rgba(255,184,48,0.3),  0 0 8px rgba(255,184,48,0.15);

  /* Transitions */
  --transition-fast:   0.15s ease;
  --transition-med:    0.3s ease;
  --transition-slow:   0.5s ease;
  --transition-bounce: 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);

  /* Z-index scale */
  --z-base:    1;
  --z-dropdown:50;
  --z-sticky:  100;
  --z-overlay: 200;
  --z-modal:   300;
  --z-toast:   400;

  /* Spacing */
  --space-1:  0.25rem;
  --space-2:  0.5rem;
  --space-3:  0.75rem;
  --space-4:  1rem;
  --space-5:  1.25rem;
  --space-6:  1.5rem;
  --space-8:  2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-16: 4rem;
}

/* ── CSS Reset ────────────────────────────────────────────── */
*,
*::before,
*::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html {
  font-size: 16px;
  scroll-behavior: smooth;
  -webkit-text-size-adjust: 100%;
  -moz-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

body {
  font-family: var(--font-sans);
  font-size: var(--text-base);
  font-weight: 400;
  line-height: var(--lh-normal);
  color: var(--color-text-primary);
  background-color: var(--color-bg);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-x: hidden;
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-display);
  font-weight: 700;
  line-height: var(--lh-tight);
  color: var(--color-text-primary);
}

a {
  color: var(--color-primary-light);
  text-decoration: none;
  transition: color var(--transition-fast);
}

a:hover {
  color: var(--color-primary);
}

img, video, svg {
  display: block;
  max-width: 100%;
}

button {
  cursor: pointer;
  font-family: var(--font-sans);
  border: none;
  background: none;
}

input, textarea, select {
  font-family: var(--font-sans);
  font-size: inherit;
}

ul, ol {
  list-style: none;
}

table {
  border-collapse: collapse;
  width: 100%;
}

/* ── Custom Scrollbar ─────────────────────────────────────── */
::-webkit-scrollbar {
  width: 5px;
  height: 5px;
}

::-webkit-scrollbar-track {
  background: var(--color-surface);
}

::-webkit-scrollbar-thumb {
  background: var(--color-primary);
  border-radius: var(--radius-full);
  opacity: 0.7;
}

::-webkit-scrollbar-thumb:hover {
  background: var(--color-primary-light);
}

* {
  scrollbar-width: thin;
  scrollbar-color: var(--color-primary) var(--color-surface);
}

/* ── Typography Scale ─────────────────────────────────────── */
.text-xs   { font-size: var(--text-xs);   line-height: var(--lh-normal); }
.text-sm   { font-size: var(--text-sm);   line-height: var(--lh-snug);  }
.text-base { font-size: var(--text-base); line-height: var(--lh-normal); }
.text-lg   { font-size: var(--text-lg);   line-height: var(--lh-snug);  }
.text-xl   { font-size: var(--text-xl);   line-height: var(--lh-snug);  }
.text-2xl  { font-size: var(--text-2xl);  line-height: var(--lh-tight); }
.text-3xl  { font-size: var(--text-3xl);  line-height: var(--lh-tight); }
.text-4xl  { font-size: var(--text-4xl);  line-height: var(--lh-tight); }

/* ── Color Utilities ──────────────────────────────────────── */
.text-primary   { color: var(--color-primary); }
.text-accent    { color: var(--color-accent); }
.text-danger    { color: var(--color-danger); }
.text-warning   { color: var(--color-warning); }
.text-success   { color: var(--color-success); }
.text-muted     { color: var(--color-text-secondary); }
.text-white     { color: var(--color-text-primary); }

.bg-primary   { background-color: var(--color-primary); }
.bg-accent    { background-color: var(--color-accent); }
.bg-surface   { background-color: var(--color-surface); }
.bg-surface-2 { background-color: var(--color-surface-2); }
.bg-danger    { background-color: var(--color-danger); }
.bg-warning   { background-color: var(--color-warning); }
.bg-success   { background-color: var(--color-success); }

/* ── Typography Utilities ─────────────────────────────────── */
.font-light    { font-weight: 300; }
.font-normal   { font-weight: 400; }
.font-medium   { font-weight: 500; }
.font-semibold { font-weight: 600; }
.font-bold     { font-weight: 700; }
.font-display  { font-family: var(--font-display); }
.font-mono     { font-family: var(--font-mono); }

.uppercase   { text-transform: uppercase; }
.lowercase   { text-transform: lowercase; }
.capitalize  { text-transform: capitalize; }
.italic      { font-style: italic; }
.text-center { text-align: center; }
.text-right  { text-align: right; }
.text-left   { text-align: left; }

.truncate {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.line-clamp-2 {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.line-clamp-3 {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.no-wrap   { white-space: nowrap; }
.break-all { word-break: break-all; }

/* ── Flex Utilities ───────────────────────────────────────── */
.flex         { display: flex; }
.inline-flex  { display: inline-flex; }
.flex-col     { flex-direction: column; }
.flex-row     { flex-direction: row; }
.flex-wrap    { flex-wrap: wrap; }
.flex-nowrap  { flex-wrap: nowrap; }

.items-start    { align-items: flex-start; }
.items-center   { align-items: center; }
.items-end      { align-items: flex-end; }
.items-stretch  { align-items: stretch; }

.justify-start    { justify-content: flex-start; }
.justify-center   { justify-content: center; }
.justify-end      { justify-content: flex-end; }
.justify-between  { justify-content: space-between; }
.justify-around   { justify-content: space-around; }
.justify-evenly   { justify-content: space-evenly; }

.flex-1    { flex: 1 1 0%; }
.flex-auto { flex: 1 1 auto; }
.flex-none { flex: none; }
.flex-shrink-0 { flex-shrink: 0; }
.flex-grow-1   { flex-grow: 1; }

/* ── Gap Utilities ────────────────────────────────────────── */
.gap-1 { gap: var(--space-1); }
.gap-2 { gap: var(--space-2); }
.gap-3 { gap: var(--space-3); }
.gap-4 { gap: var(--space-4); }
.gap-5 { gap: var(--space-5); }
.gap-6 { gap: var(--space-6); }
.gap-8 { gap: var(--space-8); }

.gap-x-2 { column-gap: var(--space-2); }
.gap-x-4 { column-gap: var(--space-4); }
.gap-y-2 { row-gap: var(--space-2); }
.gap-y-4 { row-gap: var(--space-4); }

/* ── Grid Utilities ───────────────────────────────────────── */
.grid   { display: grid; }
.grid-2 { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--space-4); }
.grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-4); }
.grid-4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--space-4); }

/* ── Spacing Utilities ─────────────────────────────────────── */
.p-0 { padding: 0; }
.p-1 { padding: var(--space-1); }
.p-2 { padding: var(--space-2); }
.p-3 { padding: var(--space-3); }
.p-4 { padding: var(--space-4); }
.p-5 { padding: var(--space-5); }
.p-6 { padding: var(--space-6); }
.p-8 { padding: var(--space-8); }

.px-2 { padding-left: var(--space-2); padding-right: var(--space-2); }
.px-3 { padding-left: var(--space-3); padding-right: var(--space-3); }
.px-4 { padding-left: var(--space-4); padding-right: var(--space-4); }
.px-6 { padding-left: var(--space-6); padding-right: var(--space-6); }

.py-1 { padding-top: var(--space-1); padding-bottom: var(--space-1); }
.py-2 { padding-top: var(--space-2); padding-bottom: var(--space-2); }
.py-3 { padding-top: var(--space-3); padding-bottom: var(--space-3); }
.py-4 { padding-top: var(--space-4); padding-bottom: var(--space-4); }
.py-6 { padding-top: var(--space-6); padding-bottom: var(--space-6); }

.m-0 { margin: 0; }
.m-1 { margin: var(--space-1); }
.m-2 { margin: var(--space-2); }
.m-3 { margin: var(--space-3); }
.m-4 { margin: var(--space-4); }
.m-5 { margin: var(--space-5); }
.m-6 { margin: var(--space-6); }
.m-8 { margin: var(--space-8); }
.m-auto { margin: auto; }

.mt-1 { margin-top: var(--space-1); }
.mt-2 { margin-top: var(--space-2); }
.mt-3 { margin-top: var(--space-3); }
.mt-4 { margin-top: var(--space-4); }
.mt-6 { margin-top: var(--space-6); }
.mt-8 { margin-top: var(--space-8); }
.mt-auto { margin-top: auto; }

.mb-1 { margin-bottom: var(--space-1); }
.mb-2 { margin-bottom: var(--space-2); }
.mb-3 { margin-bottom: var(--space-3); }
.mb-4 { margin-bottom: var(--space-4); }
.mb-6 { margin-bottom: var(--space-6); }
.mb-8 { margin-bottom: var(--space-8); }

.ml-1 { margin-left: var(--space-1); }
.ml-2 { margin-left: var(--space-2); }
.ml-3 { margin-left: var(--space-3); }
.ml-4 { margin-left: var(--space-4); }
.ml-auto { margin-left: auto; }

.mr-1 { margin-right: var(--space-1); }
.mr-2 { margin-right: var(--space-2); }
.mr-3 { margin-right: var(--space-3); }
.mr-4 { margin-right: var(--space-4); }
.mr-auto { margin-right: auto; }

/* ── Width / Height Utilities ─────────────────────────────── */
.w-full  { width: 100%; }
.w-auto  { width: auto; }
.h-full  { height: 100%; }
.h-auto  { height: auto; }

.max-w-sm  { max-width: 380px; }
.max-w-md  { max-width: 540px; }
.max-w-lg  { max-width: 720px; }
.max-w-xl  { max-width: 960px; }
.max-w-2xl { max-width: 1200px; }
.max-w-none { max-width: none; }

/* ── Display Utilities ────────────────────────────────────── */
.block        { display: block; }
.inline-block { display: inline-block; }
.inline       { display: inline; }
.hidden       { display: none; }

/* ── Position Utilities ───────────────────────────────────── */
.relative { position: relative; }
.absolute { position: absolute; }
.fixed    { position: fixed; }
.sticky   { position: sticky; }

/* ── Border Utilities ─────────────────────────────────────── */
.border         { border: 1px solid var(--color-border); }
.border-primary { border-color: var(--color-primary); }
.border-accent  { border-color: var(--color-accent); }
.border-danger  { border-color: var(--color-danger); }
.rounded-sm   { border-radius: var(--radius-sm); }
.rounded-md   { border-radius: var(--radius-md); }
.rounded-lg   { border-radius: var(--radius-lg); }
.rounded-xl   { border-radius: var(--radius-xl); }
.rounded-full { border-radius: var(--radius-full); }

/* ── Overflow Utilities ───────────────────────────────────── */
.overflow-hidden { overflow: hidden; }
.overflow-auto   { overflow: auto; }
.overflow-x-auto { overflow-x: auto; }
.overflow-y-auto { overflow-y: auto; }

/* ── Opacity ──────────────────────────────────────────────── */
.opacity-50 { opacity: 0.5; }
.opacity-75 { opacity: 0.75; }
.opacity-0  { opacity: 0; }
.opacity-100 { opacity: 1; }

/* ── Cursor ───────────────────────────────────────────────── */
.cursor-pointer { cursor: pointer; }
.cursor-default { cursor: default; }
.cursor-not-allowed { cursor: not-allowed; }

/* ── Divider ──────────────────────────────────────────────── */
.divider {
  width: 100%;
  height: 1px;
  background: var(--color-border);
  margin: var(--space-4) 0;
}

/* ── Glass utility ────────────────────────────────────────── */
.glass {
  background: rgba(17,18,36,0.7);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border: 1px solid var(--color-border);
}

/* ── Gradient text ────────────────────────────────────────── */
.gradient-text {
  background: var(--gradient-primary);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.gradient-text-accent {
  background: var(--gradient-accent);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}



/* ================================================================
   ARUNE INTERIORS — PERMANENT PROFESSIONAL CURSOR OVERRIDE
   Completely destroys trishul-cursor and custom image cursors site-wide.
================================================================ */

*, *::before, *::after, html, body {
  cursor: auto !important;
}

a, button, select, textarea, input, .btn, .btn-one, .theme-btn, .submit-btn, .glass-card, .btn-luxury-gold, .btn-luxury-outline {
  cursor: pointer !important;
}

input[type="text"], input[type="email"], input[type="tel"], textarea {
  cursor: text !important;
}

/* Hard disable any magic-cursor or trishul-cursor elements */
#magic-cursor-dot, #magic-cursor-ring, [class*="trishul"], [id*="trishul"] {
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}