(function(){ var s=document.createElement('style'); s.id='ee-golden-warmth'; s.textContent="/* ============================================================\n EXPAT EXPRESS \u2014 \"Golden Warmth\" Design System (Phases 1\u20135)\n expatexpress.fr | GeneratePress + GenerateBlocks\n ============================================================ */\n\n/* --- 1. DESIGN TOKENS --- */\n:root {\n --ee-deep: #1E2330; --ee-charcoal: #2D2A35; --ee-warm-gray: #6B6577;\n --ee-golden: #B88B4A; --ee-golden-hover: #A27035; --ee-sand: #DDCA7D;\n --ee-blush: #E8D5D0; --ee-cream: #FAF6EB; --ee-snow: #FEFCF8; --ee-white: #FFFFFF;\n --ee-success: #4CAF82; --ee-info: #5B9BD5; --ee-coral: #DC7864;\n --ee-border: #E8E0D0;\n --ee-shadow-sm: 0 1px 3px rgba(46,42,53,0.04);\n --ee-shadow-md: 0 4px 16px rgba(46,42,53,0.08);\n --ee-shadow-lg: 0 8px 32px rgba(46,42,53,0.12);\n --ee-shadow-warm: 0 8px 30px rgba(184,139,74,0.12);\n --ee-radius-sm: 8px; --ee-radius-md: 12px; --ee-radius-lg: 16px; --ee-radius-xl: 24px;\n --ee-gap: 48px;\n}\n\n/* --- 2. BASE & TYPOGRAPHY --- */\nbody { background: var(--ee-snow); color: var(--ee-charcoal); font-family: 'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif; font-size: 17px; line-height: 1.75; -webkit-font-smoothing: antialiased; }\nh1,h2,h3,h4,h5,h6 { font-family: 'Poppins','Inter',sans-serif; color: var(--ee-charcoal); font-weight: 700; line-height: 1.2; }\nh1 { font-size: clamp(2rem,5vw,3.25rem); line-height: 1.15; }\nh2 { font-size: clamp(1.5rem,3.5vw,2.25rem); }\nh3 { font-size: clamp(1.25rem,2.5vw,1.625rem); line-height: 1.3; font-weight: 600; }\nh4 { font-size: 1.125rem; line-height: 1.35; font-weight: 600; }\na, a:visited { color: var(--ee-golden) !important; transition: color .3s ease; text-decoration: none; } /* GP-override */\na:hover { color: var(--ee-golden-hover) !important; }\n\n/* --- 3. HEADER & NAVIGATION --- */\n.site-header { background: var(--ee-white); border-bottom: 2px solid var(--ee-golden) !important; box-shadow: var(--ee-shadow-sm); transition: all .3s ease; } /* GP-override */\n.site-header.scrolled { background: rgba(255,255,255,0.92); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); }\n.site-title a { color: var(--ee-charcoal) !important; font-weight: 800; font-family: 'Poppins',sans-serif; } /* GP-override */\n.main-navigation a, .main-navigation .main-nav ul li a { font-weight: 500; font-size: 15px; color: var(--ee-charcoal) !important; padding: 8px 16px; border-radius: var(--ee-radius-sm); transition: all .3s ease; position: relative; } /* GP-override */\n.main-navigation a::after { content: ''; position: absolute; bottom: 2px; left: 16px; right: 16px; height: 2px; background: var(--ee-golden); transform: scaleX(0); transition: transform .3s ease; }\n.main-navigation a:hover::after, .main-navigation .current-menu-item > a::after { transform: scaleX(1); }\n.main-navigation a:hover, .main-navigation .current-menu-item > a { color: var(--ee-golden) !important; background: var(--ee-cream) !important; }\n\n/* --- 4. HERO --- */\n.ee-hero { background: linear-gradient(135deg, var(--ee-deep) 0%, var(--ee-charcoal) 60%, rgba(232,213,208,0.15) 100%); color: #fff; padding: 96px 40px; border-radius: var(--ee-radius-xl); margin-bottom: 40px; overflow: hidden; }\n.ee-hero h1, .ee-hero h2 { color: #fff !important; }\n.ee-hero p { color: rgba(255,255,255,0.9) !important; }\n.ee-hero .ee-btn-primary { background: var(--ee-golden); color: #fff; padding: 16px 32px; border-radius: var(--ee-radius-sm); font-weight: 600; font-size: 15px; display: inline-block; transition: all .3s ease; border: 2px solid var(--ee-golden); }\n.ee-hero .ee-btn-primary:hover { background: var(--ee-golden-hover); border-color: var(--ee-golden-hover); transform: translateY(-2px); box-shadow: var(--ee-shadow-lg); color: #fff; }\n.ee-hero .ee-btn-secondary { background: transparent; color: var(--ee-golden); padding: 16px 32px; border-radius: var(--ee-radius-sm); border: 2px solid var(--ee-golden); font-weight: 600; display: inline-block; transition: all .3s ease; }\n.ee-hero .ee-btn-secondary:hover { background: var(--ee-golden); color: #fff; transform: translateY(-2px); }\n.ee-hero::before { display: none !important; } /* GP-override: remove green circle */\n\n/* --- 5. BUTTONS --- */\n.ee-btn-primary, .button.is-primary, .wp-block-button__link { background: var(--ee-golden) !important; color: #fff !important; border-radius: var(--ee-radius-sm); font-weight: 600; font-size: 15px; padding: 12px 28px; border: none; transition: all .3s ease; } /* GP-override */\n.ee-btn-primary:hover, .button.is-primary:hover, .wp-block-button__link:hover { background: var(--ee-golden-hover) !important; transform: translateY(-2px); box-shadow: var(--ee-shadow-md); }\nbutton, input[type=\"submit\"] { background: var(--ee-golden); color: #fff; border: none; border-radius: var(--ee-radius-sm); font-weight: 600; padding: 12px 28px; cursor: pointer; transition: all .3s ease; }\nbutton:hover, input[type=\"submit\"]:hover { background: var(--ee-golden-hover); }\n\n/* --- 6. CARDS (base) --- */\n.card, .ee-card, article.post, .inside-article { background: var(--ee-white); border: 1px solid var(--ee-border); border-radius: var(--ee-radius-md); padding: 28px; transition: all .3s ease; box-shadow: var(--ee-shadow-md); margin-bottom: 24px; }\n.card:hover, .ee-card:hover, article.post:hover { transform: translateY(-4px); box-shadow: var(--ee-shadow-lg); border-color: var(--ee-golden); }\n.ee-card-accent { background: linear-gradient(135deg, var(--ee-cream), #f5f0e3); border-color: var(--ee-sand); }\n\n/* --- 7. SECTIONS --- */\n.ee-section-dark { background: linear-gradient(135deg, var(--ee-deep), var(--ee-charcoal)) !important; color: #fff; border-radius: var(--ee-radius-lg); padding: 48px 32px; margin: 32px 0; } /* GP-override */\n.ee-section-dark h2, .ee-section-dark h3 { color: #fff !important; }\n.ee-section-dark a { color: var(--ee-sand) !important; }\n.ee-section-dark a:hover { color: #fff !important; }\n.ee-section-light { background: var(--ee-cream); border-radius: var(--ee-radius-lg); padding: 48px 32px; margin: 32px 0; }\n\n/* --- 8. BLOG LIST --- */\n.generate-columns-container article { border: 1px solid var(--ee-border); border-radius: var(--ee-radius-md); padding: 24px; background: var(--ee-white); transition: all .3s ease; box-shadow: var(--ee-shadow-sm); margin-bottom: 24px; }\n.generate-columns-container article:hover { transform: translateY(-3px); box-shadow: var(--ee-shadow-lg); border-color: var(--ee-golden); }\n.entry-title a { color: var(--ee-charcoal) !important; text-decoration: none; font-weight: 700; } /* GP-override */\n.entry-title a:hover { color: var(--ee-golden) !important; }\n.entry-meta { color: var(--ee-warm-gray) !important; font-size: .85rem; } /* GP-override */\n.entry-meta a { color: var(--ee-golden) !important; }\n.cat-links a, .tag-links a { background: var(--ee-cream); color: var(--ee-charcoal); padding: 3px 10px; border-radius: 20px; font-size: .8rem; font-weight: 600; border: 1px solid var(--ee-sand); transition: all .3s ease; }\n.cat-links a:hover, .tag-links a:hover { background: var(--ee-golden); color: #fff; border-color: var(--ee-golden); }\n.read-more, a.read-more { color: var(--ee-golden); font-weight: 600; font-size: .9rem; }\n.read-more::after { content: ' \u2192'; transition: margin-left .3s; }\n.read-more:hover::after { margin-left: 4px; }\n.post-image a, .post-image a:hover { color: transparent !important; }\n\n/* --- 9. SINGLE ARTICLE --- */\n.single .entry-header { margin-bottom: 2rem; padding-bottom: 1.5rem; border-bottom: 3px solid var(--ee-golden); }\n.single .entry-title { font-size: clamp(1.8rem,4vw,2.5rem); color: var(--ee-charcoal); }\n.single .entry-content h2, .wp-block-heading { color: var(--ee-charcoal); position: relative; padding-bottom: .5rem; border-bottom: none; margin-top: 3rem; }\n.single .entry-content h2::after { content: ''; position: absolute; bottom: 0; left: 0; width: 60px; height: 3px; background: var(--ee-golden); transition: width .4s ease; }\n.single .entry-content h2:hover::after { width: 100%; }\n.single .entry-content h3 { color: var(--ee-charcoal); margin-top: 2rem; padding-left: 16px; border-left: 3px solid var(--ee-golden); }\n.single .entry-content p { font-size: 1.05rem; line-height: 1.8; margin-bottom: 1.5rem; }\n.single .entry-content blockquote { border-left: 4px solid var(--ee-golden); background: var(--ee-blush); padding: 20px 24px; border-radius: 0 var(--ee-radius-md) var(--ee-radius-md) 0; margin: 2rem 0; font-style: italic; }\n.inside-article a, .entry-content a { color: var(--ee-golden); }\n.inside-article a:hover, .entry-content a:hover { color: var(--ee-golden-hover); }\n\n/* --- 10. CALLOUT BOXES --- */\n.ee-callout-info, .ee-callout-tip, .ee-callout-warning { padding: 20px 20px 20px 56px; border-radius: var(--ee-radius-md); margin: 1.5rem 0; border-left: 4px solid; position: relative; }\n.ee-callout-info { background: rgba(91,155,213,0.08); border-left-color: var(--ee-info); }\n.ee-callout-tip { background: rgba(184,139,74,0.08); border-left-color: var(--ee-golden); }\n.ee-callout-warning { background: rgba(220,120,100,0.08); border-left-color: var(--ee-coral); }\n.ee-callout-info::before, .ee-callout-tip::before, .ee-callout-warning::before { position: absolute; left: 18px; top: 20px; font-size: 1.3rem; }\n.ee-callout-info::before { content: '\u2139\ufe0f'; }\n.ee-callout-tip::before { content: '\ud83d\udca1'; }\n.ee-callout-warning::before { content: '\u26a0\ufe0f'; }\n\n/* --- 11. FORMS --- */\ninput[type=\"text\"], input[type=\"email\"], input[type=\"url\"], input[type=\"tel\"], input[type=\"number\"], textarea, select { border: 1px solid var(--ee-border); border-radius: var(--ee-radius-sm); padding: 12px 16px; font-size: 16px; transition: all .3s ease; background: var(--ee-white); width: 100%; }\ninput:focus, textarea:focus, select:focus { outline: none; border-color: var(--ee-golden); box-shadow: 0 0 0 3px rgba(184,139,74,0.15); }\n::placeholder { color: var(--ee-warm-gray); }\n\n/* --- 12. TABLES --- */\n.wp-block-table th, .entry-content th { background: var(--ee-deep) !important; color: var(--ee-sand) !important; padding: 14px 18px; font-weight: 600; } /* GP-override */\n.wp-block-table td, .entry-content td { padding: 12px 18px; border-bottom: 1px solid var(--ee-border); }\n.wp-block-table tr:nth-child(even), .entry-content tr:nth-child(even) { background: var(--ee-cream); }\n.wp-block-table tr:hover td, .entry-content tr:hover td { background: #f0ebe0; }\n\n/* --- 13. BREADCRUMBS --- */\n.ee-breadcrumbs { padding: 12px 0; font-size: .85rem; color: var(--ee-warm-gray); margin-bottom: 1rem; }\n.ee-breadcrumbs a { color: var(--ee-golden); }\n.ee-breadcrumbs .separator { margin: 0 8px; color: #c4b99a; }\n\n/* --- 14. PAGINATION --- */\n.pagination .page-numbers { border: 1px solid var(--ee-border); border-radius: var(--ee-radius-sm); padding: 8px 14px; margin: 0 4px; font-weight: 600; color: var(--ee-charcoal); transition: all .3s ease; }\n.pagination .page-numbers.current, .pagination .page-numbers:hover { background: var(--ee-golden) !important; color: #fff !important; border-color: var(--ee-golden) !important; } /* GP-override */\n\n/* --- 15. WIDGETS & SIDEBAR --- */\n.widget { background: var(--ee-white); border: 1px solid var(--ee-border); border-radius: var(--ee-radius-md); padding: 24px; margin-bottom: 24px; box-shadow: var(--ee-shadow-sm); }\n.widget-title { color: var(--ee-charcoal) !important; font-weight: 700; padding-bottom: .75rem; border-bottom: 2px solid var(--ee-golden) !important; margin-bottom: 1rem; } /* GP-override */\n.sidebar .widget a { color: var(--ee-golden); }\n.sidebar .widget a:hover { color: var(--ee-golden-hover); }\n\n/* --- 16. FOOTER (base) --- */\n.site-footer, .footer-bar { background: var(--ee-deep) !important; color: rgba(255,255,255,0.8) !important; padding: 48px 0 24px; } /* GP-override */\n.site-footer a, .footer-bar a, .site-info a { color: var(--ee-sand) !important; transition: color .3s ease; }\n.site-footer a:hover { color: #fff !important; }\n.site-info { color: rgba(255,255,255,0.6) !important; font-size: .9rem; }\n\n/* --- 17. UTILITIES --- */\n.ee-highlight-box { background: linear-gradient(135deg, var(--ee-cream), #f5f0e3); border: 1px solid var(--ee-sand); border-radius: var(--ee-radius-md); padding: 24px; margin: 2rem 0; }\n.ee-faq { background: var(--ee-cream); border-radius: var(--ee-radius-md); padding: 32px; margin: 2rem 0; }\n\n/* --- MOBILE LOGO FIX --- */\n.site-logo.mobile-header-logo img[src*=\"safewheels\"], .site-logo.mobile-header-logo img[src*=\"generatepress.com\"], .navigation-branding img[src*=\"safewheels\"], .navigation-branding img[src*=\"generatepress.com\"] { content: url('https://expatexpress.fr/wp-content/uploads/2026/03/expatexpress-logo.png') !important; height: 45px !important; width: auto !important; } /* GP-override */\n\n/* GP-override: neutralize GP blue palette */\n:root { --contrast: var(--ee-charcoal); --contrast-2: var(--ee-warm-gray); --contrast-3: #b8b0a0; --base: var(--ee-cream); --base-2: var(--ee-white); --accent: var(--ee-golden); --accent-2: var(--ee-golden-hover); --accent-3: var(--ee-golden-hover); }\n\n\n/* ============================================================\n PHASE 3: HOMEPAGE \u2014 DESTINATION CARDS\n ============================================================ */\n\n/* --- 20. DESTINATION CARDS --- */\n.ee-dest-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 24px; margin: var(--ee-gap) 0; }\n.ee-dest-card { position: relative; height: 280px; border-radius: var(--ee-radius-lg); overflow: hidden; background-size: cover; background-position: center; cursor: pointer; transition: transform .4s ease, box-shadow .4s ease; box-shadow: var(--ee-shadow-md); }\n.ee-dest-card::after { content: ''; position: absolute; inset: 0; background: linear-gradient(to top, rgba(30,35,48,0.85) 0%, rgba(30,35,48,0.2) 50%, transparent 100%); transition: background .4s ease; }\n.ee-dest-card:hover { transform: scale(1.03); box-shadow: var(--ee-shadow-lg), 0 12px 40px rgba(30,35,48,0.18); }\n.ee-dest-card:hover::after { background: linear-gradient(to top, rgba(30,35,48,0.92) 0%, rgba(30,35,48,0.35) 50%, transparent 100%); }\n.ee-dest-card__content { position: absolute; bottom: 0; left: 0; right: 0; z-index: 2; padding: 24px; color: #fff; }\n.ee-dest-card__title { font-family: 'Poppins',sans-serif; font-size: 1.35rem; font-weight: 700; color: #fff !important; margin: 0 0 4px; }\n.ee-dest-card__desc { font-size: .9rem; color: rgba(255,255,255,0.8); margin: 0; line-height: 1.4; }\n.ee-dest-card__arrow { position: absolute; bottom: 20px; right: 20px; z-index: 3; width: 40px; height: 40px; background: var(--ee-golden); color: #fff !important; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 1.1rem; transition: all .3s ease; }\n.ee-dest-card:hover .ee-dest-card__arrow { background: var(--ee-golden-hover); transform: translateX(3px); }\n.ee-dest-grid--asymmetric .ee-dest-card:first-child { grid-column: span 2; height: 340px; }\n\n\n/* ============================================================\n PHASE 3: HOMEPAGE \u2014 GUIDES TH\u00c9MATIQUES\n ============================================================ */\n\n/* --- 21. GUIDES SECTION (cream) --- */\n.ee-section-guides { background: var(--ee-cream); border-radius: var(--ee-radius-lg); padding: 56px 32px; margin: var(--ee-gap) 0; }\n.ee-section-guides h2 { text-align: center; margin-bottom: 40px; }\n.ee-guides-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 24px; }\n.ee-guide-card { background: var(--ee-white); border-radius: var(--ee-radius-md); padding: 28px; border-left: 3px solid var(--ee-golden); box-shadow: var(--ee-shadow-sm); transition: all .3s ease; }\n.ee-guide-card:hover { background: var(--ee-blush); box-shadow: var(--ee-shadow-md); transform: translateY(-3px); }\n.ee-guide-card__icon { font-size: 2rem; margin-bottom: 12px; display: block; }\n.ee-guide-card__title { font-family: 'Poppins',sans-serif; font-size: 1.1rem; font-weight: 700; color: var(--ee-charcoal); margin: 0 0 8px; }\n.ee-guide-card__desc { font-size: .92rem; color: var(--ee-warm-gray); line-height: 1.6; margin: 0; }\n\n\n/* ============================================================\n PHASE 3: HOMEPAGE \u2014 OUTILS PRATIQUES\n ============================================================ */\n\n/* --- 22. OUTILS PRATIQUES --- */\n.ee-outils-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 28px; margin: var(--ee-gap) 0; }\n.ee-outil-card { background: var(--ee-white); border: 1px solid var(--ee-border); border-radius: var(--ee-radius-lg); padding: 36px 28px; text-align: center; transition: all .35s ease; box-shadow: var(--ee-shadow-sm); }\n.ee-outil-card:hover { background: var(--ee-blush); box-shadow: var(--ee-shadow-warm); transform: translateY(-5px); border-color: var(--ee-golden); }\n.ee-outil-card__icon { font-size: 2.5rem; margin-bottom: 16px; display: block; }\n.ee-outil-card__title { font-family: 'Poppins',sans-serif; font-weight: 700; font-size: 1.15rem; margin: 0 0 10px; color: var(--ee-charcoal); }\n.ee-outil-card__desc { font-size: .92rem; color: var(--ee-warm-gray); line-height: 1.6; margin: 0 0 20px; }\n.ee-outil-card__cta { display: inline-block; background: var(--ee-golden); color: #fff !important; padding: 10px 24px; border-radius: var(--ee-radius-sm); font-weight: 600; font-size: .9rem; transition: all .3s ease; }\n.ee-outil-card__cta:hover { background: var(--ee-golden-hover); transform: translateY(-2px); box-shadow: var(--ee-shadow-md); color: #fff !important; }\n\n\n/* ============================================================\n PHASE 3: HOMEPAGE \u2014 DERNIERS ARTICLES\n ============================================================ */\n\n/* --- 23. LATEST POSTS --- */\n.ee-latest-posts { margin: var(--ee-gap) 0; }\n.ee-latest-posts h2 { margin-bottom: 32px; }\n.ee-latest-post-card { display: flex; background: var(--ee-white); border: 1px solid var(--ee-border); border-radius: var(--ee-radius-md); overflow: hidden; margin-bottom: 20px; transition: all .3s ease; box-shadow: var(--ee-shadow-sm); min-height: 180px; }\n.ee-latest-post-card:hover { box-shadow: var(--ee-shadow-lg); border-color: var(--ee-golden); transform: translateY(-3px); }\n.ee-latest-post-card__thumb { flex: 0 0 200px; background-size: cover; background-position: center; min-height: 180px; }\n.ee-latest-post-card__content { flex: 1; padding: 24px 28px; display: flex; flex-direction: column; justify-content: center; }\n.ee-latest-post-card__meta { display: flex; align-items: center; gap: 12px; font-size: .8rem; color: var(--ee-warm-gray); margin-bottom: 8px; }\n.ee-latest-post-card__badge { background: var(--ee-cream); color: var(--ee-golden); padding: 2px 10px; border-radius: 20px; font-weight: 600; font-size: .75rem; border: 1px solid var(--ee-sand); }\n.ee-latest-post-card__title { font-family: 'Poppins',sans-serif; font-size: 1.15rem; font-weight: 700; color: var(--ee-charcoal) !important; margin: 0 0 8px; line-height: 1.3; }\n.ee-latest-post-card__excerpt { font-size: .9rem; color: var(--ee-warm-gray); margin: 0 0 12px; line-height: 1.55; }\n.ee-latest-post-card__link { color: var(--ee-golden) !important; font-weight: 600; font-size: .9rem; }\n.ee-latest-post-card__link::after { content: ' \u2192'; transition: margin-left .3s; }\n.ee-latest-post-card__link:hover::after { margin-left: 5px; }\n\n\n/* ============================================================\n PHASE 4: FOOTER (enhanced)\n ============================================================ */\n\n/* --- 24. FOOTER --- */\n.ee-footer { background: var(--ee-deep) !important; color: rgba(255,255,255,0.8); }\n.ee-footer-newsletter { background: linear-gradient(135deg, var(--ee-charcoal), var(--ee-deep)); padding: 48px 32px; text-align: center; border-bottom: 1px solid rgba(255,255,255,0.08); }\n.ee-footer-newsletter h3 { color: #fff !important; font-size: 1.5rem; margin-bottom: 8px; }\n.ee-footer-newsletter p { color: rgba(255,255,255,0.65); margin-bottom: 20px; }\n.ee-footer-newsletter-form { display: flex; gap: 12px; max-width: 500px; margin: 0 auto; }\n.ee-footer-newsletter-form input[type=\"email\"] { flex: 1; background: rgba(255,255,255,0.08); border: 1px solid rgba(255,255,255,0.15); color: #fff; border-radius: var(--ee-radius-sm); padding: 12px 16px; }\n.ee-footer-newsletter-form input[type=\"email\"]::placeholder { color: rgba(255,255,255,0.45); }\n.ee-footer-newsletter-form button { background: var(--ee-golden); color: #fff; padding: 12px 28px; border-radius: var(--ee-radius-sm); font-weight: 600; border: none; cursor: pointer; transition: background .3s; white-space: nowrap; }\n.ee-footer-newsletter-form button:hover { background: var(--ee-golden-hover); }\n.ee-footer-columns { display: grid; grid-template-columns: repeat(4,1fr); gap: 32px; padding: 64px 32px; max-width: 1200px; margin: 0 auto; }\n.ee-footer-col h4 { color: #fff !important; font-size: 1rem; font-weight: 700; margin-bottom: 20px; padding-bottom: 10px; border-bottom: 2px solid var(--ee-golden); }\n.ee-footer-col ul { list-style: none; margin: 0; padding: 0; }\n.ee-footer-col li { margin-bottom: 10px; }\n.ee-footer-col a { color: var(--ee-sand) !important; font-size: .92rem; }\n.ee-footer-col a:hover { color: #fff !important; }\n.ee-footer-social { display: flex; gap: 16px; padding: 24px 32px; justify-content: center; border-top: 1px solid rgba(255,255,255,0.08); }\n.ee-footer-social a { display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; background: rgba(255,255,255,0.06); border-radius: 50%; color: var(--ee-sand) !important; font-size: 1.1rem; transition: all .3s ease; }\n.ee-footer-social a:hover { background: var(--ee-golden); color: #fff !important; transform: translateY(-2px); }\n.ee-footer-copyright { text-align: center; padding: 20px 32px; font-size: .85rem; color: rgba(255,255,255,0.45); border-top: 1px solid rgba(255,255,255,0.06); }\n\n\n/* ============================================================\n PHASE 4: BLOG PAGE\n ============================================================ */\n\n/* --- 25. BLOG PAGE --- */\n.ee-blog-hero { background: linear-gradient(135deg, var(--ee-cream), var(--ee-blush)); padding: 56px 32px; border-radius: var(--ee-radius-xl); text-align: center; margin-bottom: 32px; }\n.ee-blog-hero h1 { font-size: clamp(2rem,4vw,2.75rem); margin-bottom: 20px; }\n.ee-blog-search { max-width: 480px; margin: 0 auto; position: relative; }\n.ee-blog-search input[type=\"search\"], .ee-blog-search input[type=\"text\"] { width: 100%; padding: 14px 20px 14px 48px; border: 1px solid var(--ee-border); border-radius: 50px; font-size: 1rem; background: var(--ee-white); box-shadow: var(--ee-shadow-sm); }\n.ee-blog-search input:focus { border-color: var(--ee-golden); box-shadow: 0 0 0 3px rgba(184,139,74,0.15); }\n.ee-blog-search::before { content: '\ud83d\udd0d'; position: absolute; left: 18px; top: 50%; transform: translateY(-50%); font-size: 1.1rem; z-index: 1; }\n\n/* Category filter pills */\n.ee-category-pills { display: flex; gap: 10px; overflow-x: auto; padding: 8px 0 16px; margin-bottom: 28px; scrollbar-width: thin; -webkit-overflow-scrolling: touch; }\n.ee-category-pills::-webkit-scrollbar { height: 4px; }\n.ee-category-pills::-webkit-scrollbar-thumb { background: var(--ee-border); border-radius: 4px; }\n.ee-category-pill { display: inline-block; padding: 8px 20px; border-radius: 50px; font-size: .88rem; font-weight: 600; white-space: nowrap; background: var(--ee-white); color: var(--ee-charcoal) !important; border: 1px solid var(--ee-border); transition: all .3s ease; cursor: pointer; }\n.ee-category-pill:hover, .ee-category-pill--active { background: var(--ee-golden); color: #fff !important; border-color: var(--ee-golden); }\n\n/* Blog card grid */\n.ee-blog-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 28px; margin-bottom: var(--ee-gap); }\n.ee-blog-card { background: var(--ee-white); border: 1px solid var(--ee-border); border-radius: var(--ee-radius-lg); overflow: hidden; box-shadow: var(--ee-shadow-sm); transition: all .35s ease; display: flex; flex-direction: column; }\n.ee-blog-card:hover { box-shadow: var(--ee-shadow-lg); border-color: var(--ee-golden); transform: translateY(-4px); }\n.ee-blog-card__image-wrap { height: 200px; overflow: hidden; background: var(--ee-cream); }\n.ee-blog-card__image-wrap img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s ease; }\n.ee-blog-card:hover .ee-blog-card__image-wrap img { transform: scale(1.05); }\n.ee-blog-card__body { padding: 24px; flex: 1; display: flex; flex-direction: column; }\n.ee-blog-card__meta { font-size: .8rem; color: var(--ee-warm-gray); margin-bottom: 8px; display: flex; align-items: center; gap: 10px; }\n.ee-blog-card__title { font-family: 'Poppins',sans-serif; font-size: 1.1rem; font-weight: 700; line-height: 1.3; color: var(--ee-charcoal); margin: 0 0 10px; }\n.ee-blog-card__excerpt { font-size: .9rem; color: var(--ee-warm-gray); line-height: 1.6; margin: 0 0 16px; flex: 1; }\n.ee-blog-card__cta { display: inline-block; background: var(--ee-golden); color: #fff !important; padding: 10px 22px; border-radius: var(--ee-radius-sm); font-weight: 600; font-size: .88rem; transition: all .3s ease; text-align: center; align-self: flex-start; }\n.ee-blog-card__cta:hover { background: var(--ee-golden-hover); color: #fff !important; }\n\n/* Featured first post */\n.ee-blog-grid .ee-blog-card--featured { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr 1fr; }\n.ee-blog-card--featured .ee-blog-card__image-wrap { height: 100%; min-height: 300px; }\n.ee-blog-card--featured .ee-blog-card__body { padding: 36px; justify-content: center; }\n.ee-blog-card--featured .ee-blog-card__title { font-size: 1.5rem; }\n\n\n/* ============================================================\n PHASE 4: ARTICLE TEMPLATE (enhanced)\n ============================================================ */\n\n/* --- 26. ARTICLE TEMPLATE --- */\n.single .ee-article-hero { width: 100vw; margin-left: calc(-50vw + 50%); height: 400px; background-size: cover; background-position: center; position: relative; margin-bottom: 40px; }\n.single .ee-article-hero::after { content: ''; position: absolute; inset: 0; background: linear-gradient(to top, rgba(30,35,48,0.6), transparent 60%); }\n\n/* TOC sidebar */\n.ee-toc-sidebar { position: sticky; top: 100px; background: var(--ee-cream); border-radius: var(--ee-radius-md); padding: 24px; border: 1px solid var(--ee-border); max-height: calc(100vh - 140px); overflow-y: auto; }\n.ee-toc-sidebar h4 { font-size: .95rem; text-transform: uppercase; letter-spacing: .05em; color: var(--ee-warm-gray); margin-bottom: 12px; padding-bottom: 8px; border-bottom: 1px solid var(--ee-border); }\n.ee-toc-sidebar ul { list-style: none; margin: 0; padding: 0; }\n.ee-toc-sidebar li { margin-bottom: 6px; }\n.ee-toc-sidebar a { font-size: .88rem; color: var(--ee-charcoal) !important; display: block; padding: 4px 8px; border-radius: 4px; transition: all .2s ease; }\n.ee-toc-sidebar a:hover, .ee-toc-sidebar a.active { background: var(--ee-golden); color: #fff !important; }\n.ee-toc-sidebar li.level-3 a { padding-left: 20px; font-size: .84rem; }\n\n/* Pull quotes */\n.ee-pullquote, .single .entry-content blockquote.is-style-large { position: relative; border-left: none; background: var(--ee-cream); padding: 40px 36px 28px 50px; border-radius: var(--ee-radius-md); margin: 2.5rem 0; font-style: italic; font-size: 1.2rem; line-height: 1.7; color: var(--ee-charcoal); }\n.ee-pullquote::before, .single .entry-content blockquote.is-style-large::before { content: '\\201C'; position: absolute; top: 12px; left: 14px; font-size: 4rem; font-family: Georgia,serif; color: var(--ee-golden); line-height: 1; opacity: 0.5; }\n\n\n/* ============================================================\n PHASE 4: CONTACT FORM\n ============================================================ */\n\n/* --- 27. CONTACT FORM --- */\n.ee-contact-form { max-width: 640px; margin: 0 auto; }\n.ee-contact-form label { display: block; font-weight: 600; font-size: .92rem; color: var(--ee-charcoal); margin-bottom: 6px; }\n.ee-contact-form .form-group { margin-bottom: 20px; }\n.ee-contact-form input[type=\"text\"], .ee-contact-form input[type=\"email\"], .ee-contact-form input[type=\"tel\"], .ee-contact-form textarea, .ee-contact-form select { border: 1px solid var(--ee-border); border-radius: var(--ee-radius-sm); padding: 12px 16px; font-size: 1rem; width: 100%; transition: all .3s ease; background: var(--ee-white); }\n.ee-contact-form input:focus, .ee-contact-form textarea:focus { outline: none; border-color: var(--ee-golden); box-shadow: 0 0 0 3px rgba(184,139,74,0.15); }\n.ee-contact-form textarea { min-height: 150px; resize: vertical; }\n.ee-contact-form input[type=\"submit\"], .ee-contact-form .ee-submit-btn { width: 100%; background: var(--ee-golden); color: #fff; border: none; border-radius: var(--ee-radius-sm); padding: 16px; font-weight: 600; font-size: 1rem; cursor: pointer; transition: all .3s ease; }\n.ee-contact-form input[type=\"submit\"]:hover, .ee-contact-form .ee-submit-btn:hover { background: var(--ee-golden-hover); transform: translateY(-2px); box-shadow: var(--ee-shadow-md); }\n\n/* WPForms / CF7 compat */\n.wpforms-container input, .wpforms-container textarea, .wpcf7 input[type=\"text\"], .wpcf7 input[type=\"email\"], .wpcf7 textarea { border: 1px solid var(--ee-border) !important; border-radius: var(--ee-radius-sm) !important; padding: 12px 16px !important; }\n.wpforms-container input:focus, .wpcf7 input:focus, .wpforms-container textarea:focus, .wpcf7 textarea:focus { border-color: var(--ee-golden) !important; box-shadow: 0 0 0 3px rgba(184,139,74,0.15) !important; }\n.wpforms-submit, .wpcf7 input[type=\"submit\"] { width: 100% !important; background: var(--ee-golden) !important; color: #fff !important; padding: 16px !important; border-radius: var(--ee-radius-sm) !important; font-weight: 600 !important; }\n\n\n/* ============================================================\n PHASE 5: SCROLL ANIMATIONS\n ============================================================ */\n\n/* --- 28. SCROLL ANIMATIONS --- */\n.ee-fade-in { opacity: 0; transform: translateY(20px); transition: opacity .6s ease, transform .6s ease; }\n.ee-fade-in.ee-visible { opacity: 1; transform: translateY(0); }\n.ee-fade-in-left { opacity: 0; transform: translateX(-30px); transition: opacity .6s ease, transform .6s ease; }\n.ee-fade-in-left.ee-visible { opacity: 1; transform: translateX(0); }\n.ee-fade-in-right { opacity: 0; transform: translateX(30px); transition: opacity .6s ease, transform .6s ease; }\n.ee-fade-in-right.ee-visible { opacity: 1; transform: translateX(0); }\n.ee-animate { opacity: 0; transform: translateY(20px); transition: opacity .6s ease, transform .6s ease; }\n.ee-animate.ee-visible { opacity: 1; transform: translateY(0); }\n.ee-delay-1 { transition-delay: .1s; } .ee-delay-2 { transition-delay: .2s; }\n.ee-delay-3 { transition-delay: .3s; } .ee-delay-4 { transition-delay: .4s; }\n.ee-delay-5 { transition-delay: .5s; }\n\n/*\n * Intersection Observer JS (add to footer or custom JS):\n *\n * document.addEventListener('DOMContentLoaded', function() {\n * var io = new IntersectionObserver(function(entries) {\n * entries.forEach(function(e) {\n * if (e.isIntersecting) { e.target.classList.add('ee-visible'); io.unobserve(e.target); }\n * });\n * }, { threshold: 0.1, rootMargin: '0px 0px -40px 0px' });\n * document.querySelectorAll('.ee-fade-in,.ee-fade-in-left,.ee-fade-in-right,.ee-animate')\n * .forEach(function(el) { io.observe(el); });\n * });\n */\n\n\n/* ============================================================\n PHASE 5: ENHANCED RESPONSIVE\n ============================================================ */\n\n/* --- 29. RESPONSIVE --- */\n@media (max-width: 1280px) { .ee-hero { padding: 80px 32px; } }\n\n@media (max-width: 1024px) {\n .ee-hero { padding: 64px 28px; }\n .ee-section-dark, .ee-section-light, .ee-section-guides { padding: 40px 24px; }\n .ee-dest-grid { grid-template-columns: repeat(2,1fr); }\n .ee-dest-grid--asymmetric .ee-dest-card:first-child { grid-column: span 2; }\n .ee-guides-grid, .ee-outils-grid { grid-template-columns: repeat(2,1fr); }\n .ee-blog-grid { grid-template-columns: repeat(2,1fr); }\n .ee-blog-grid .ee-blog-card--featured { grid-column: 1 / -1; }\n .ee-footer-columns { grid-template-columns: repeat(2,1fr); }\n}\n\n@media (max-width: 768px) {\n :root { --ee-gap: 32px; }\n .ee-hero { padding: 48px 20px; border-radius: var(--ee-radius-lg); }\n .ee-hero h1 { font-size: 1.75rem; }\n .ee-hero .ee-btn-primary, .ee-hero .ee-btn-secondary { display: block; width: 100%; text-align: center; margin-bottom: 12px; }\n .card, .ee-card { padding: 20px; }\n .ee-section-dark, .ee-section-light, .ee-section-guides { padding: 32px 16px; }\n .generate-columns-container article { padding: 16px; }\n h1 { font-size: 1.75rem; } h2 { font-size: 1.4rem; } h3 { font-size: 1.15rem; }\n body { font-size: 16px; }\n\n /* Destination cards stack */\n .ee-dest-grid { grid-template-columns: 1fr; gap: 16px; }\n .ee-dest-grid--asymmetric .ee-dest-card:first-child { grid-column: span 1; height: 280px; }\n .ee-dest-card { height: 240px; }\n\n /* Guides & Outils stack */\n .ee-guides-grid, .ee-outils-grid { grid-template-columns: 1fr; gap: 16px; }\n\n /* Latest posts stack */\n .ee-latest-post-card { flex-direction: column; }\n .ee-latest-post-card__thumb { flex: none; height: 180px; min-height: auto; }\n .ee-latest-post-card__content { padding: 20px; }\n\n /* Footer */\n .ee-footer-columns { grid-template-columns: 1fr; gap: 28px; padding: 40px 20px; }\n .ee-footer-newsletter { padding: 36px 20px; }\n .ee-footer-newsletter-form { flex-direction: column; }\n .ee-footer-newsletter-form button { width: 100%; }\n\n /* Blog */\n .ee-blog-grid { grid-template-columns: 1fr; gap: 20px; }\n .ee-blog-grid .ee-blog-card--featured { grid-template-columns: 1fr; }\n .ee-blog-card--featured .ee-blog-card__image-wrap { min-height: 200px; }\n .ee-blog-card--featured .ee-blog-card__body { padding: 24px; }\n .ee-blog-card--featured .ee-blog-card__title { font-size: 1.25rem; }\n .ee-blog-hero { padding: 40px 20px; border-radius: var(--ee-radius-lg); }\n\n /* Article */\n .single .ee-article-hero { height: 250px; }\n .ee-toc-sidebar { position: static; margin-bottom: 24px; max-height: none; }\n .ee-contact-form { padding: 0 8px; }\n}\n\n@media (max-width: 480px) {\n .ee-dest-card { height: 200px; }\n .ee-dest-card__title { font-size: 1.15rem; }\n .ee-blog-hero h1 { font-size: 1.5rem; }\n .ee-latest-post-card__thumb { height: 140px; }\n .ee-outil-card { padding: 24px 20px; }\n .ee-footer-social { gap: 12px; }\n}\n\n@media print {\n .ee-hero, .site-header, .site-footer, .ee-footer, .ee-toc-sidebar, .ee-category-pills { display: none; }\n body { color: #000; background: #fff; font-size: 12pt; }\n a { color: #000 !important; text-decoration: underline; }\n}\n"; document.head.appendChild(s); })();