:root {
    --tdh-surface: #ffffff;
    --tdh-surface-soft: #fff8ed;
    --tdh-ink: #191919;
    --tdh-ink-soft: #4a4a4a;
    --tdh-accent: #ff7a00;
    --tdh-accent-soft: #ffb25b;
    --tdh-shadow-lg: 0 20px 45px rgba(28, 20, 6, 0.14);
    --tdh-shadow-sm: 0 8px 18px rgba(28, 20, 6, 0.1);
}

html,
body {
    background:
        radial-gradient(900px 420px at 8% -12%, rgba(255, 183, 117, 0.28), transparent 70%),
        radial-gradient(820px 500px at 90% 0%, rgba(255, 138, 51, 0.16), transparent 66%),
        linear-gradient(180deg, #fffefb 0%, #fff8ef 100%);
}

body::before,
body::after {
    content: "";
    position: fixed;
    width: 320px;
    height: 320px;
    border-radius: 50%;
    pointer-events: none;
    z-index: 0;
    filter: blur(2px);
    opacity: 0.45;
}

body::before {
    right: -120px;
    top: 24vh;
    background: radial-gradient(circle, rgba(255, 140, 0, 0.24) 0%, rgba(255, 140, 0, 0) 72%);
}

body::after {
    left: -140px;
    bottom: 10vh;
    background: radial-gradient(circle, rgba(255, 203, 145, 0.3) 0%, rgba(255, 203, 145, 0) 68%);
}

main,
header,
footer,
.urgence-banner {
    position: relative;
    z-index: 1;
}

header {
    backdrop-filter: blur(10px);
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.hero,
.page-hero {
    box-shadow: inset 0 -90px 120px rgba(0, 0, 0, 0.2);
}

.services-grid .service-card,
.benefit-item,
.intervention-card,
.contact-item,
.zone-item,
.why-choose,
.cta-section,
.page-content,
.service-gallery img,
.ville-grid > div {
    transition: transform 0.35s ease, box-shadow 0.35s ease, border-color 0.35s ease;
}

.services-grid .service-card,
.why-choose,
.page-content,
.ville-grid > div {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.98) 0%, rgba(255, 250, 242, 0.98) 100%);
    box-shadow: var(--tdh-shadow-lg);
    border: 1px solid rgba(255, 157, 67, 0.16);
}

.services-grid .service-card:hover,
.why-choose:hover,
.ville-grid > div:hover,
.intervention-card:hover,
.contact-item:hover,
.benefit-item:hover {
    transform: translateY(-6px);
    box-shadow: 0 24px 44px rgba(24, 15, 0, 0.16);
}

.service-gallery img:hover {
    transform: scale(1.04) rotate(-0.2deg);
    box-shadow: 0 18px 28px rgba(25, 16, 3, 0.2);
}

.section-title,
.page-content h2,
.cta-section h2,
.hero h1,
.page-hero h1 {
    letter-spacing: 0.01em;
    text-wrap: balance;
}

.cta-button,
.mail-button {
    background-image: linear-gradient(135deg, #ff7a00 0%, #ffaf54 100%);
    border: 1px solid rgba(255, 184, 109, 0.7);
}

.cta-button:hover,
.mail-button:hover {
    transform: translateY(-4px);
    box-shadow: 0 15px 30px rgba(255, 122, 0, 0.35);
}

@keyframes tdhPulse {
    0% {
        box-shadow: 0 0 0 0 rgba(255, 122, 0, 0.32);
    }
    70% {
        box-shadow: 0 0 0 12px rgba(255, 122, 0, 0);
    }
    100% {
        box-shadow: 0 0 0 0 rgba(255, 122, 0, 0);
    }
}

.cta-button:first-child {
    animation: tdhPulse 2.8s infinite;
}

@media (max-width: 768px) {
    body::before,
    body::after {
        width: 200px;
        height: 200px;
        opacity: 0.35;
    }

    .services-grid .service-card:hover,
    .why-choose:hover,
    .ville-grid > div:hover,
    .intervention-card:hover,
    .contact-item:hover,
    .benefit-item:hover,
    .cta-button:hover,
    .mail-button:hover {
        transform: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    .cta-button:first-child {
        animation: none;
    }

    .services-grid .service-card,
    .benefit-item,
    .intervention-card,
    .contact-item,
    .zone-item,
    .why-choose,
    .cta-section,
    .page-content,
    .service-gallery img,
    .ville-grid > div,
    .cta-button,
    .mail-button {
        transition: none;
    }
}