

        :root {
            --ts-terracotta: #d08f7b;
            --ts-terracotta-dark: #b56e5f;
            --ts-ivory: #fdf7f2;
        }

        html {
            scroll-behavior: smooth; /* fallback natif si supporté */
        }

        .ts-hero-home {
            position: relative;
            color: #fff;
            text-align: center;
            padding: clamp(6rem, 18vh, 10rem) 1rem clamp(4rem, 12vh, 6rem);
            background: radial-gradient(circle at 40% 30%, var(--ts-terracotta-dark) 0%, var(--ts-terracotta) 45%, var(--ts-ivory) 100%);
            background-size: cover;
            background-position: center;
            overflow: hidden;
            border-radius: 15px;
        }

        /* Image de fond si définie */
        .ts-hero-home[style*="--hero-bg"] {
            background-image: linear-gradient(rgba(208,143,123,.85), rgba(253,247,242,.4)), var(--hero-bg);
        }

        .ts-hero-home::after {
            content: "";
            position: absolute;
            inset: 0;
            background: url('<?php echo get_stylesheet_directory_uri(); ?>/assets/img/texture-noise.png') repeat;
            opacity: .08;
            pointer-events: none;
        }

        .ts-hero-home__inner {
            max-width: 900px;
            margin-inline: auto;
            isolation: isolate;
        }

        .ts-hero-home__title {
            font-family: 'Satisfy', cursive;
            font-size: clamp(2.75rem, 7vw, 4.5rem);
            line-height: 1.15;
            margin: 0 0 1.25rem;
            text-shadow: 0 4px 16px rgba(0,0,0,.18);
        }

        .ts-hero-home__tagline {
            font-family: 'Montserrat', sans-serif;
            font-size: clamp(1.125rem, 2.4vw, 1.4rem);
            line-height: 1.6;
            margin: 0 0 2.75rem;
            color: #f8efea;
        }

        .ts-hero-home__cta-group {
            display: flex;
            flex-wrap: wrap;
            gap: 1rem;
            justify-content: center;
        }

        .cta-btn {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            padding: 1rem 2rem;
            border-radius: 99rem;
            font-family: 'Montserrat', sans-serif;
            font-weight: 600;
            font-size: 1rem;
            letter-spacing: .02em;
            transition: transform .25s ease, background .25s ease, color .25s ease;
            text-decoration: none;
        }

        .cta-btn.primary {
            background: #fff;
            color: var(--ts-terracotta-dark);
        }
        .cta-btn.primary:hover,
        .cta-btn.primary:focus-visible {
            background: var(--ts-ivory);
            transform: translateY(-3px);
        }

        .cta-btn.ghost {
            background: rgba(255,255,255,.15);
            color: #fff;
        }
        .cta-btn.ghost:hover,
        .cta-btn.ghost:focus-visible {
            background: rgba(255,255,255,.25);
            transform: translateY(-3px);
        }

        /* Scroll Hint */
        .ts-scroll-hint {
            position: absolute;
            bottom: 1.5rem;
            left: 50%;
            transform: translateX(-50%);
            display: inline-flex;
            align-items: center;
            justify-content: center;
            background: transparent;
            color: #fff;
            text-decoration: none;
            cursor: pointer;
            animation: bounce 2s infinite;
            opacity: .8;
        }
        .ts-scroll-hint:hover,
        .ts-scroll-hint:focus-visible {
            opacity: 1;
        }
        @keyframes bounce {
            0%, 100% { transform: translate(-50%, 0); }
            50%      { transform: translate(-50%, -8px); }
        }

        /* Préférence : réduire mouvements */
        @media (prefers-reduced-motion: reduce) {
            .ts-scroll-hint {
                animation: none;
            }
        }

        /* Mobile tweaks */
        @media (max-width: 580px) {
            .cta-btn {
                flex: 1 1 auto;
                min-width: 140px;
            }
        }
