body { font-family: 'Inter', sans-serif; }
.font-serif { font-family: 'Playfair Display', serif; }

.glass { background: rgba(255,255,255,0.08); backdrop-filter: blur(24px); border: 1px solid rgba(255,255,255,0.12); }
.glass-light { background: rgba(255,255,255,0.92); backdrop-filter: blur(12px); border-bottom: 1px solid rgba(0,0,0,0.06); }
.hero-gradient { background: linear-gradient(135deg,#0f172a 0%,#1e293b 40%,#0f172a 100%); }

.tab-btn.active { background: #1E3A8A; color: #fff; }
.tab-content { display: none; }
.tab-content.active { display: block; }

.acc-content { max-height: 0; overflow: hidden; transition: max-height 0.4s ease; }
.acc-content.open { max-height: 3000px; }
.acc-trigger.open svg { transform: rotate(180deg); }
.acc-trigger svg { transition: transform 0.3s ease; }

.nav-link { position: relative; }
.nav-link::after { content: ''; position: absolute; bottom: -2px; left: 0; width: 0; height: 2px; background: #2563EB; transition: width 0.3s ease; }
.nav-link:hover::after, .nav-link.active::after { width: 100%; }

.mobile-menu { transform: translateX(100%); transition: transform 0.3s ease; }
.mobile-menu.open { transform: translateX(0); }

.img-placeholder { background: linear-gradient(135deg,#f1f5f9 0%,#e2e8f0 100%); display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; padding:2rem; border:2px dashed #cbd5e1; border-radius:1rem; min-height:280px; }
.img-placeholder.dark { background: linear-gradient(135deg,#1e293b 0%,#0f172a 100%); border-color:#334155; }

.cookie-banner { transform: translateY(100%); transition: transform 0.5s ease; }
.cookie-banner.show { transform: translateY(0); }

@media (max-width:768px) {
    .dropdown-menu { display: none !important; }
}

/* Mode édition visuelle */
.edit-mode-active [contenteditable="true"]:hover {
    outline: 2px dashed #2563EB;
    outline-offset: 2px;
    cursor: text;
    background: rgba(37,99,235,0.05);
}
.edit-mode-active .upload-zone {
    cursor: pointer;
    transition: all 0.2s ease;
}
.edit-mode-active .upload-zone:hover {
    outline: 2px dashed #2563EB;
    background: #EFF6FF;
}
.edit-mode-active .editable-img {
    cursor: pointer;
    transition: all 0.2s ease;
}
.edit-mode-active .editable-img:hover {
    outline: 3px solid #2563EB;
    outline-offset: 2px;
    opacity: 0.85;
}

/* ============================================
   Optimisation mobile (<= 640px)
   Le design desktop reste strictement inchangé
   ============================================ */
@media (max-width: 640px) {
    html, body { overflow-x: hidden; }
    body { -webkit-text-size-adjust: 100%; }

    /* Titres : échelle réduite et lisible */
    body .text-7xl { font-size: 2.25rem; line-height: 1.1; }
    body .text-6xl { font-size: 2rem;    line-height: 1.15; }
    body .text-5xl { font-size: 1.75rem; line-height: 1.2; }
    body .text-4xl { font-size: 1.5rem;  line-height: 1.25; }
    body .text-3xl { font-size: 1.35rem; line-height: 1.3; }
    body .text-2xl { font-size: 1.2rem;  line-height: 1.35; }
    body .text-xl  { font-size: 1.05rem; line-height: 1.5; }

    /* Espacements verticaux resserrés */
    body .py-32 { padding-top: 3.5rem; padding-bottom: 3.5rem; }
    body .py-24 { padding-top: 3rem;   padding-bottom: 3rem; }
    body .py-20 { padding-top: 2.5rem; padding-bottom: 2.5rem; }
    body .py-16 { padding-top: 2.25rem; padding-bottom: 2.25rem; }
    body .pt-32 { padding-top: 9.5rem; }
    body .pt-28 { padding-top: 9rem; }
    body #disclaimerBar p { font-size: 0.6875rem; line-height: 1.35; text-align: center; }
    body #disclaimerBar .py-2 { padding-top: 0.375rem; padding-bottom: 0.375rem; }
    body .mb-16 { margin-bottom: 2rem; }
    body .mb-12 { margin-bottom: 1.75rem; }
    body .gap-12 { gap: 1.5rem; }
    body .gap-10 { gap: 1.25rem; }
    body .gap-8  { gap: 1rem; }

    /* Cartes : padding intérieur adapté au petit écran */
    body .p-12 { padding: 1.5rem; }
    body .p-10 { padding: 1.5rem; }
    body .p-8  { padding: 1.25rem; }
    body .px-8 { padding-left: 1.25rem; padding-right: 1.25rem; }

    /* Médias */
    body img, body svg, body video, body iframe { max-width: 100%; height: auto; }

    /* Tableaux : défilement horizontal contenu dans la page */
    body .overflow-x-auto { max-width: 100%; -webkit-overflow-scrolling: touch; }
    body table { font-size: 0.8125rem; }

    /* Confort tactile */
    body a, body button { -webkit-tap-highlight-color: rgba(37,99,235,0.15); }
    body a[href^="tel:"], body button, body .btn { min-height: 44px; }

    /* Éviter les débordements de longs mots / URLs */
    body p, body li, body h1, body h2, body h3 { overflow-wrap: break-word; }
    body td, body th { word-break: normal; overflow-wrap: normal; }
}