/* =====================================================
 * TYPOGRAPHIE - SYSTÈME NORMALISÉ
 * Dynasty Dream - Toutes les définitions de polices centralisées
 * ===================================================== */

/* =====================================================
 * VARIABLES DE POLICES
 * ===================================================== */
:root {
    /* Familles de polices principales - Option Luxe Premium */
    --font-family-base: 'Playfair Display', Georgia, 'Times New Roman', serif;
    --font-family-display: 'Playfair Display', Georgia, 'Times New Roman', serif;
    --font-family-text: 'Playfair Display', Georgia, 'Times New Roman', serif;
    --font-family-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace;
    
    /* Tailles de police normalisées - Harmonisées pour cohérence visuelle */
    --font-size-xs: 11px;     /* Badges, très petit texte */
    --font-size-sm: 12px;     /* Labels, hints, metadata */
    --font-size-base: 13px;   /* Boutons secondaires, petits éléments */
    --font-size-md: 14px;     /* Navigation, boutons, inputs */
    --font-size-lg: 15px;     /* Body text, paragraphes (augmenté pour lisibilité) */
    --font-size-xl: 17px;     /* Sous-titres, texte important */
    --font-size-2xl: 19px;    /* Titres de cartes, petites sections */
    --font-size-3xl: 22px;    /* Titres de sections moyennes */
    --font-size-4xl: 26px;    /* Sous-titres de page */
    --font-size-5xl: 30px;    /* Titres de page principaux */
    --font-size-6xl: 34px;    /* Sous-titres hero */
    --font-size-7xl: 38px;    /* Titres hero (réduit pour cohérence) */
    
    /* Poids de police */
    --font-weight-normal: 400;
    --font-weight-medium: 500;
    --font-weight-semibold: 600;
    --font-weight-bold: 700;
    --font-weight-extrabold: 800;
    
    /* Hauteurs de ligne */
    --line-height-tight: 1.1;
    --line-height-normal: 1.2;
    --line-height-relaxed: 1.3;
    --line-height-loose: 1.4;
    --line-height-base: 1.5;
    --line-height-comfortable: 1.6;
    
    /* Espacement des lettres */
    --letter-spacing-tight: -0.02em;
    --letter-spacing-normal: -0.01em;
    --letter-spacing-relaxed: -0.005em;
    --letter-spacing-loose: 0;
    --letter-spacing-wide: 0.01em;
    --letter-spacing-wider: 0.5px;
    
    /* Transformations de texte */
    --text-transform-none: none;
    --text-transform-uppercase: uppercase;
    --text-transform-lowercase: lowercase;
    --text-transform-capitalize: capitalize;
}

/* =====================================================
 * POLICE DE BASE (BODY)
 * ===================================================== */
body {
    font-family: var(--font-family-base);
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-normal);
    line-height: var(--line-height-base);
    letter-spacing: var(--letter-spacing-loose);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

html {
    font-family: var(--font-family-base);
}

/* =====================================================
 * TITRES (HEADINGS)
 * ===================================================== */
h1, .h1 {
    font-family: var(--font-family-display);
    font-size: var(--font-size-7xl);
    font-weight: var(--font-weight-extrabold);
    line-height: var(--line-height-tight);
    letter-spacing: var(--letter-spacing-tight);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

h2, .h2 {
    font-family: var(--font-family-display);
    font-size: var(--font-size-6xl);
    font-weight: var(--font-weight-extrabold);
    line-height: var(--line-height-normal);
    letter-spacing: var(--letter-spacing-tight);
}

h3, .h3 {
    font-family: var(--font-family-display);
    font-size: var(--font-size-5xl);
    font-weight: var(--font-weight-bold);
    line-height: var(--line-height-normal);
    letter-spacing: var(--letter-spacing-normal);
}

h4, .h4 {
    font-family: var(--font-family-display);
    font-size: var(--font-size-4xl);
    font-weight: var(--font-weight-bold);
    line-height: var(--line-height-relaxed);
    letter-spacing: var(--letter-spacing-normal);
}

h5, .h5 {
    font-family: var(--font-family-display);
    font-size: var(--font-size-3xl);
    font-weight: var(--font-weight-semibold);
    line-height: var(--line-height-relaxed);
    letter-spacing: var(--letter-spacing-normal);
}

h6, .h6 {
    font-family: var(--font-family-display);
    font-size: var(--font-size-2xl);
    font-weight: var(--font-weight-semibold);
    line-height: var(--line-height-relaxed);
    letter-spacing: var(--letter-spacing-normal);
}

/* =====================================================
 * TEXTES ET PARAGRAPHES
 * ===================================================== */
p, .text {
    font-family: var(--font-family-text);
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-normal);
    line-height: var(--line-height-base);
    letter-spacing: var(--letter-spacing-relaxed);
}

.text-sm {
    font-size: var(--font-size-base);
    line-height: var(--line-height-relaxed);
}

.text-xs {
    font-size: var(--font-size-sm);
    line-height: var(--line-height-relaxed);
}

.text-lg {
    font-size: var(--font-size-xl);
    line-height: var(--line-height-comfortable);
}

/* =====================================================
 * BOUTONS ET ÉLÉMENTS INTERACTIFS
 * ===================================================== */
button, .btn, .button {
    font-family: var(--font-family-text);
    font-size: var(--font-size-md);
    font-weight: var(--font-weight-semibold);
    letter-spacing: var(--letter-spacing-normal);
    line-height: var(--line-height-normal);
}

.btn-sm {
    font-size: var(--font-size-base);
}

.btn-lg {
    font-size: var(--font-size-lg);
}

/* =====================================================
 * NAVIGATION
 * ===================================================== */
.menu__link, .nav-link {
    font-family: var(--font-family-text);
    font-size: var(--font-size-md);
    font-weight: var(--font-weight-semibold);
    letter-spacing: var(--letter-spacing-normal);
    line-height: var(--line-height-normal);
}

/* =====================================================
 * CARTES ET COMPOSANTS PREMIUM
 * ===================================================== */
.lux-title, .card-title, .premium-title {
    font-family: var(--font-family-display);
    font-size: var(--font-size-2xl);
    font-weight: var(--font-weight-bold);
    line-height: var(--line-height-relaxed);
    letter-spacing: var(--letter-spacing-tight);
}

.lux-desc, .card-description, .premium-subtitle {
    font-family: var(--font-family-text);
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-normal);
    line-height: var(--line-height-base);
    letter-spacing: var(--letter-spacing-relaxed);
}

.lux-btn, .card-button {
    font-family: var(--font-family-text);
    font-size: var(--font-size-base);
    font-weight: var(--font-weight-semibold);
    letter-spacing: var(--letter-spacing-normal);
}

.lux-price-badge, .price-badge {
    font-family: var(--font-family-display);
    font-size: var(--font-size-md);
    font-weight: var(--font-weight-bold);
    line-height: var(--line-height-normal);
    letter-spacing: var(--letter-spacing-normal);
}

/* =====================================================
 * TAGS ET BADGES
 * ===================================================== */
.tag, .badge, .lux-tags span {
    font-family: var(--font-family-text);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    letter-spacing: var(--letter-spacing-normal);
    line-height: var(--line-height-normal);
}

/* =====================================================
 * MODALES
 * ===================================================== */
.modal-title, .modal-header h2 {
    font-family: var(--font-family-display);
    font-size: var(--font-size-4xl);
    font-weight: var(--font-weight-extrabold);
    line-height: var(--line-height-normal);
    letter-spacing: var(--letter-spacing-tight);
}

.modal-text, .modal-content p {
    font-family: var(--font-family-text);
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-normal);
    line-height: var(--line-height-base);
}

.modal-type, .modal-duration {
    font-family: var(--font-family-text);
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-semibold);
}

.price-amount {
    font-family: var(--font-family-display);
    font-size: var(--font-size-6xl);
    font-weight: var(--font-weight-extrabold);
    line-height: var(--line-height-tight);
}

.price-currency {
    font-family: var(--font-family-display);
    font-size: var(--font-size-2xl);
    font-weight: var(--font-weight-semibold);
    line-height: var(--line-height-normal);
}

.modal-booking-btn {
    font-family: var(--font-family-text);
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-semibold);
}

.timeline-time {
    font-family: var(--font-family-text);
    font-size: var(--font-size-md);
    font-weight: var(--font-weight-semibold);
}

.timeline-content {
    font-family: var(--font-family-text);
    font-size: var(--font-size-lg);
    line-height: var(--line-height-base);
}

/* =====================================================
 * PRICING
 * ===================================================== */
.pricing-card-title {
    font-family: var(--font-family-display);
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-semibold);
    line-height: var(--line-height-normal);
}

.pricing-card-description {
    font-family: var(--font-family-text);
    font-size: var(--font-size-base);
    line-height: var(--line-height-relaxed);
}

.pricing-price {
    font-family: var(--font-family-display);
    font-size: var(--font-size-3xl);
    font-weight: var(--font-weight-bold);
    line-height: var(--line-height-tight);
}

.pricing-original-price {
    font-family: var(--font-family-text);
    font-size: var(--font-size-xs);
}

.pricing-savings {
    font-family: var(--font-family-text);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-semibold);
}

.pricing-feature-text {
    font-family: var(--font-family-text);
    font-size: var(--font-size-base);
    line-height: var(--line-height-relaxed);
}

.pricing-button {
    font-family: var(--font-family-text);
    font-size: var(--font-size-md);
    font-weight: var(--font-weight-semibold);
}

.pricing-premium-title {
    font-family: var(--font-family-display);
    font-size: var(--font-size-5xl);
    font-weight: var(--font-weight-extrabold);
    line-height: var(--line-height-normal);
    letter-spacing: var(--letter-spacing-tight);
}

.pricing-premium-subtitle {
    font-family: var(--font-family-text);
    font-size: var(--font-size-xl);
    line-height: var(--line-height-base);
    font-weight: var(--font-weight-medium);
}

.pricing-toggle-btn {
    font-family: var(--font-family-text);
    font-size: var(--font-size-md);
    font-weight: var(--font-weight-semibold);
}

/* =====================================================
 * SERVICES PROPRIÉTAIRES
 * ===================================================== */
.owner-service-title {
    font-family: var(--font-family-display);
    font-size: var(--font-size-2xl);
    font-weight: var(--font-weight-bold);
    line-height: var(--line-height-relaxed);
}

.owner-service-description {
    font-family: var(--font-family-text);
    font-size: var(--font-size-lg);
    line-height: var(--line-height-loose);
}

.owner-service-duration span:last-child {
    font-family: var(--font-family-text);
    font-size: var(--font-size-md);
}

.owner-service-feature-tag {
    font-family: var(--font-family-text);
    font-size: var(--font-size-sm);
}

.owner-service-button {
    font-family: var(--font-family-text);
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-semibold);
}

.owner-services-title {
    font-family: var(--font-family-display);
    font-size: clamp(28px, 4vw, 42px);
    font-weight: var(--font-weight-extrabold);
    line-height: var(--line-height-normal);
    letter-spacing: var(--letter-spacing-tight);
}

.owner-services-subtitle {
    font-family: var(--font-family-text);
    font-size: var(--font-size-2xl);
    line-height: var(--line-height-base);
    font-weight: var(--font-weight-medium);
}

.owner-services-stat-value {
    font-family: var(--font-family-display);
    font-size: var(--font-size-4xl);
    font-weight: var(--font-weight-extrabold);
}

.owner-services-stat-label {
    font-family: var(--font-family-text);
    font-size: var(--font-size-base);
    text-transform: var(--text-transform-uppercase);
    letter-spacing: var(--letter-spacing-wider);
}

.owner-services-cta-title {
    font-family: var(--font-family-display);
    font-size: var(--font-size-4xl);
    font-weight: var(--font-weight-bold);
}

.owner-services-cta-text {
    font-family: var(--font-family-text);
    font-size: var(--font-size-xl);
    line-height: var(--line-height-base);
}

.owner-services-cta-button {
    font-family: var(--font-family-text);
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-semibold);
}

/* =====================================================
 * BANNIÈRES
 * ===================================================== */
.banner-title, #relume .banner-title {
    font-family: var(--banner-font-family, var(--font-family-display));
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

.banner-text, #relume .banner-text {
    font-family: var(--banner-font-family, var(--font-family-text));
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

/* =====================================================
 * RESPONSIVE - TAILLES MOBILES
 * ===================================================== */
@media (max-width: 768px) {
    h1, .h1 {
        font-size: var(--font-size-5xl);
    }
    
    h2, .h2 {
        font-size: var(--font-size-4xl);
    }
    
    h3, .h3 {
        font-size: var(--font-size-3xl);
    }
    
    .pricing-premium-title {
        font-size: var(--font-size-4xl);
    }
    
    .excursions-header h1,
    .vehicles-header h1 {
        font-size: var(--font-size-4xl) !important;
    }
    
    .excursions-header p,
    .vehicles-header p {
        font-size: var(--font-size-xl) !important;
    }
}

/* =====================================================
 * MONOSPACE (CODE, ETC.)
 * ===================================================== */
code, pre, .mono {
    font-family: var(--font-family-mono);
}

/* =====================================================
 * ACCESSIBILITÉ
 * ===================================================== */
@media (prefers-reduced-motion: reduce) {
    * {
        text-rendering: auto !important;
    }
}

