/* ==========================================================================
   HOTEL DARSHAN - CENTRALIZED FLUID RESPONSIVE TOKENS
   ========================================================================== */

:root {
    /* Color Palette */
    --color-bg-primary: #F7F3EC;      /* Warm Cream */
    --color-bg-secondary: #F1EBE1;    /* Soft Beige / Champagne */
    --color-bg-card: #FFFDF8;         /* Ivory Card */
    --color-text-primary: #342A22;    /* Deep Charcoal Earth */
    --color-text-secondary: #6B625A;  /* Soft Warm Gray */
    --color-gold-accent: #C79A3B;     /* Soft Heritage Gold */
    --color-gold-hover: #B98B2C;      /* Warm Hover Gold */
    --color-border: #E4DBCF;          /* Soft Border */
    --color-shadow: rgba(55, 45, 35, 0.08); /* Organic Soft Shadow */

    /* Typography Definitions */
    --font-heading: "Cormorant Garamond", Georgia, serif;
    --font-body: "Manrope", system-ui, -apple-system, sans-serif;

    /* Fluid Typography Curves (Calculated via clamp) */
    --font-size-hero-title: clamp(2.35rem, 5.5vw + 1rem, 5.75rem); /* 37.6px -> 92px */
    --font-size-section-title: clamp(2.15rem, 3.5vw + 0.8rem, 4.25rem); /* 34.4px -> 68px */
    --font-size-card-title: clamp(1.35rem, 1.8vw + 0.5rem, 2.2rem); /* 21.6px -> 35.2px */
    --font-size-body-lg: clamp(1rem, 0.8vw + 0.7rem, 1.2rem);
    --font-size-body-md: clamp(0.9rem, 0.5vw + 0.75rem, 1.05rem);
    --font-size-body-sm: clamp(0.8rem, 0.4vw + 0.65rem, 0.875rem);

    /* Fluid Section Vertical Paddings */
    --section-padding-y: clamp(4.5rem, 8vw + 1rem, 9rem);
    --container-padding-x: clamp(1rem, 3vw + 0.5rem, 2.5rem);

    /* Touch & Accessibility Bounds */
    --min-touch-target: 48px;
    --radius-card-lg: clamp(18px, 2vw + 10px, 32px);
    --radius-card-md: clamp(14px, 1.5vw + 8px, 24px);
    --radius-pill: 100px;

    /* Transitions & Easing */
    --ease-editorial: cubic-bezier(0.2, 0.8, 0.2, 1);
    --transition-gentle: 0.5s var(--ease-editorial);
}

/* Global Reset for Zero Horizontal Scrolling */
*, *::before, *::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

html {
    font-size: 100%;
    scroll-behavior: smooth;
    -webkit-text-size-adjust: 100%;
    overflow-x: hidden;
}

body {
    width: 100%;
    min-height: 100vh;
    overflow-x: hidden;
    background-color: var(--color-bg-primary);
    color: var(--color-text-primary);
    font-family: var(--font-body);
    line-height: 1.6;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
}

img, picture, video, canvas, svg {
    display: block;
    max-width: 100%;
    height: auto;
}

button, input, select, textarea {
    font: inherit;
    color: inherit;
}