/* ================================================================
   LUXESTATE — Responsive Design System
   Breakpoints: 320 · 480 · 576 · 768 · 992 · 1200 · 1400 · 1600+
   ================================================================ */

:root {
    /* Spacing scale */
    --space-section: clamp(2.5rem, 6vw, 5rem);
    --space-section-lg: clamp(3.75rem, 8vw, 6.25rem);
    --space-block: clamp(1rem, 2.5vw, 1.5rem);
    --space-inline: clamp(0.75rem, 2vw, 1.25rem);
    --space-gap: clamp(0.75rem, 1.5vw, 1.5rem);

    /* Typography scale */
    --text-body: clamp(0.9375rem, 0.9rem + 0.2vw, 1.125rem);
    --text-small: clamp(0.75rem, 0.72rem + 0.1vw, 0.875rem);
    --text-hero: clamp(2.375rem, 1.5rem + 4vw, 4.5rem);
    --text-display: clamp(2rem, 1.2rem + 3.5vw, 3.5rem);
    --text-h2: clamp(1.75rem, 1.1rem + 2.5vw, 2.75rem);
    --text-h3: clamp(1.25rem, 1rem + 1vw, 1.75rem);

    /* Touch targets (WCAG) */
    --touch-min: 48px;
    --btn-pad-y: clamp(0.75rem, 0.6rem + 0.3vw, 1rem);
    --btn-pad-x: clamp(1.25rem, 1rem + 1vw, 2.25rem);

    /* Container */
    --container-pad: clamp(1rem, 4vw, 2rem);
    --container-max: min(1400px, 100% - var(--container-pad) * 2);

    /* Grid columns */
    --grid-cols: 4;
}

@media (max-width: 1399px) { :root { --grid-cols: 3; } }
@media (max-width: 991px)  { :root { --grid-cols: 2; } }
@media (max-width: 575px)  { :root { --grid-cols: 1; } }

/* Global overflow guard */
html {
    overflow-x: hidden;
    -webkit-text-size-adjust: 100%;
    scroll-behavior: smooth;
}

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}

/* Focus visibility */
:focus-visible {
    outline: 2px solid var(--lux-gold, #d4af37);
    outline-offset: 3px;
}

/* Responsive grid utility */
.lux-grid-responsive {
    display: grid;
    grid-template-columns: repeat(var(--grid-cols), minmax(0, 1fr));
    gap: var(--space-gap);
}

/* Images */
img, video {
    max-width: 100%;
    height: auto;
}

.img-cover {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Touch devices — disable hover transforms */
@media (hover: none) and (pointer: coarse) {
    .lux-property-card:hover,
    .lux-btn-gold:hover,
    .lux-bento-cell:hover {
        transform: none !important;
    }
    .lux-property-card:hover .lux-property-image img {
        transform: none !important;
    }
}

/* Skip link */
.lux-skip-link {
    position: absolute;
    left: -9999px;
    top: 0;
    z-index: 100001;
    padding: 12px 24px;
    background: var(--lux-gold, #d4af37);
    color: #0b132b;
    font-weight: 600;
}
.lux-skip-link:focus {
    left: 16px;
    top: 16px;
}
