{"id":3543,"date":"2026-09-10T17:54:22","date_gmt":"2026-09-10T17:54:22","guid":{"rendered":"https:\/\/wonderlookstore.com\/?page_id=3543"},"modified":"2026-09-10T18:06:08","modified_gmt":"2026-09-10T18:06:08","slug":"face-a-face-paris","status":"publish","type":"page","link":"https:\/\/wonderlookstore.com\/?page_id=3543","title":{"rendered":"FACE A FACE Paris"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"3543\" class=\"elementor elementor-3543\">\n\t\t\t\t<div class=\"elementor-element elementor-element-d05efa9 e-flex e-con-boxed e-con e-parent\" data-id=\"d05efa9\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-eadb163 elementor-widget elementor-widget-html\" data-id=\"eadb163\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- Google Fonts & Font Awesome -->\r\n<link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\" \/>\r\n<link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin \/>\r\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Playfair+Display:ital,wght@0,500;0,600;0,700;1,400;1,600&family=Plus+Jakarta+Sans:wght@300;400;500;600;700&display=swap\" rel=\"stylesheet\" \/>\r\n<link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.5.1\/css\/all.min.css\" \/>\r\n\r\n<style>\r\n  :root {\r\n    --bg-body: #FBF9F5;\r\n    --bg-card: #FFFFFF;\r\n    --bg-surface: #F5F1EA;\r\n    --bg-dark: #121212;\r\n    --color-gold: #C5A880;\r\n    --color-gold-hover: #AF8F63;\r\n    --color-gold-light: rgba(197, 168, 128, 0.12);\r\n    --color-dark: #161616;\r\n    --color-text: #42403D;\r\n    --color-muted: #827E77;\r\n    --color-border: #ECE7DF;\r\n    --color-border-dark: #2C2A28;\r\n    --color-whatsapp: #25D366;\r\n    --font-heading: 'Playfair Display', Georgia, serif;\r\n    --font-body: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, sans-serif;\r\n    --radius-sm: 8px;\r\n    --radius-md: 14px;\r\n    --radius-lg: 24px;\r\n    --radius-pill: 999px;\r\n    --shadow-subtle: 0 4px 20px rgba(0, 0, 0, 0.03);\r\n    --shadow-hover: 0 16px 36px rgba(0, 0, 0, 0.08);\r\n    --transition-fast: 0.2s cubic-bezier(0.16, 1, 0.3, 1);\r\n    --transition-smooth: 0.35s cubic-bezier(0.16, 1, 0.3, 1);\r\n    --container-width: 1280px;\r\n  }\r\n\r\n  .wonderlook-wrapper {\r\n    font-family: var(--font-body);\r\n    background-color: var(--bg-body);\r\n    color: var(--color-text);\r\n    line-height: 1.6;\r\n    overflow-x: hidden;\r\n    width: 100%;\r\n    margin: 0;\r\n    padding: 0;\r\n  }\r\n  .wonderlook-wrapper *, .wonderlook-wrapper *::before, .wonderlook-wrapper *::after { margin: 0; padding: 0; box-sizing: border-box; -webkit-font-smoothing: antialiased; }\r\n  .wonderlook-wrapper a { text-decoration: none; color: inherit; transition: color var(--transition-fast); }\r\n  .wonderlook-wrapper button { font-family: inherit; border: none; cursor: pointer; background: none; transition: all var(--transition-fast); }\r\n  .wonderlook-wrapper img { max-width: 100%; height: auto; display: block; }\r\n  .wonderlook-wrapper .container { width: 100%; max-width: var(--container-width); margin: 0 auto; padding: 0 24px; }\r\n\r\n  \/* TOP BAR *\/\r\n  .top-announcement { background: var(--bg-dark); color: #E2DDD5; font-size: 0.75rem; font-weight: 500; padding: 8px 0; border-bottom: 1px solid var(--color-border-dark); position: relative; z-index: 100; }\r\n  .top-announcement .container { display: flex; justify-content: space-between; align-items: center; gap: 16px; }\r\n  .top-announcement-left { display: flex; align-items: center; gap: 20px; }\r\n  .top-badge { display: inline-flex; align-items: center; gap: 6px; }\r\n  .top-badge i { color: var(--color-gold); font-size: 0.8rem; }\r\n  .top-announcement-right { display: flex; align-items: center; gap: 16px; }\r\n  .top-pill { background: rgba(197, 168, 128, 0.15); color: var(--color-gold); padding: 2px 10px; border-radius: var(--radius-pill); font-weight: 600; font-size: 0.7rem; border: 1px solid rgba(197, 168, 128, 0.3); }\r\n\r\n  \/* HEADER *\/\r\n  .header { background: rgba(255, 255, 255, 0.94); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); position: sticky; top: 0; z-index: 990; border-bottom: 1px solid var(--color-border); transition: box-shadow var(--transition-fast); }\r\n  .header.scrolled { box-shadow: 0 8px 25px rgba(0, 0, 0, 0.04); }\r\n  .header-inner { display: flex !important; align-items: center !important; justify-content: space-between !important; height: 94px !important; }\r\n  .brand-logo { display: inline-flex !important; flex-direction: column !important; align-items: center !important; justify-content: center !important; text-decoration: none !important; padding: 0 !important; max-width: 230px !important; max-height: 90px !important; flex-shrink: 0 !important; gap: 0 !important; }\r\n  .header-logo-img { height: 56px !important; max-height: 56px !important; width: auto !important; max-width: 200px !important; object-fit: contain !important; display: block !important; margin: 0 auto !important; mix-blend-mode: multiply; filter: contrast(1.06) saturate(1.05); transition: transform var(--transition-smooth), opacity var(--transition-fast); }\r\n  .brand-logo:hover .header-logo-img { transform: scale(1.03); opacity: 0.95; }\r\n  .logo-subtext { display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: center !important; text-align: center !important; line-height: 1.15 !important; white-space: nowrap !important; }\r\n  .logo-subtext .subtext-line-1 { font-size: 0.54rem !important; font-weight: 700 !important; letter-spacing: 2.8px !important; text-transform: uppercase !important; color: var(--color-dark) !important; display: block !important; margin-bottom: 1px !important; }\r\n  .logo-subtext .subtext-line-2 { font-size: 0.46rem !important; font-weight: 600 !important; letter-spacing: 2px !important; text-transform: uppercase !important; color: var(--color-gold) !important; display: block !important; }\r\n  .brand-logo:hover .subtext-line-2 { color: var(--color-gold-hover) !important; }\r\n\r\n  .nav-desktop { display: flex; align-items: center; gap: 32px; list-style: none; }\r\n  .nav-item { position: relative; }\r\n  .nav-link { font-size: 0.88rem; font-weight: 500; color: var(--color-dark); padding: 8px 0; display: inline-flex; align-items: center; gap: 6px; transition: color var(--transition-fast); }\r\n  .nav-link::after { content: ''; position: absolute; bottom: 0; left: 0; width: 0; height: 2px; background: var(--color-gold); transition: width var(--transition-smooth); }\r\n  .nav-link:hover { color: var(--color-gold); }\r\n  .nav-link:hover::after, .nav-item.active .nav-link::after { width: 100%; }\r\n\r\n  .mega-menu { position: absolute; top: 100%; left: 50%; transform: translateX(-50%) translateY(14px); width: 820px; max-width: 92vw; background: var(--bg-card); border-radius: var(--radius-md); box-shadow: 0 25px 60px rgba(0, 0, 0, 0.12); border: 1px solid var(--color-border); padding: 24px; opacity: 0; visibility: hidden; pointer-events: none; transition: all var(--transition-smooth); z-index: 1000; }\r\n  .nav-item:hover .mega-menu { opacity: 1; visibility: visible; pointer-events: auto; transform: translateX(-50%) translateY(0); }\r\n  .mega-menu-header { display: flex; justify-content: space-between; align-items: center; padding-bottom: 14px; margin-bottom: 16px; border-bottom: 1px solid var(--color-border); }\r\n  .mega-menu-header h4 { font-family: var(--font-heading); font-size: 1.1rem; color: var(--color-dark); }\r\n  .mega-menu-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; }\r\n  .mega-brand-card { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border-radius: var(--radius-sm); border: 1px solid transparent; transition: all var(--transition-fast); background: var(--bg-surface); }\r\n  .mega-brand-card:hover { background: #FFFFFF; border-color: var(--color-gold); transform: translateY(-2px); box-shadow: var(--shadow-subtle); }\r\n  .mega-brand-icon { width: 40px; height: 40px; border-radius: 50%; background: #FFFFFF; display: flex; align-items: center; justify-content: center; color: var(--color-gold); font-size: 1rem; flex-shrink: 0; border: 1px solid var(--color-border); transition: all var(--transition-fast); }\r\n  .mega-brand-card:hover .mega-brand-icon { background: var(--color-gold); color: #FFFFFF; }\r\n  .mega-brand-card h5 { font-size: 0.82rem; font-weight: 600; color: var(--color-dark); margin-bottom: 1px; }\r\n  .mega-brand-card p { font-size: 0.65rem; color: var(--color-muted); line-height: 1.2; }\r\n\r\n  .header-actions { display: flex; align-items: center; gap: 12px; }\r\n  .action-btn { width: 42px; height: 42px; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: var(--color-dark); font-size: 1.05rem; background: var(--bg-surface); position: relative; transition: all var(--transition-fast); cursor: pointer !important; touch-action: manipulation; }\r\n  .action-btn:hover { background: var(--color-gold-light); color: var(--color-gold); }\r\n  .cart-counter { position: absolute; top: -2px; right: -2px; background: var(--color-gold); color: #FFFFFF; font-size: 0.65rem; font-weight: 700; width: 19px; height: 19px; border-radius: 50%; display: flex; align-items: center; justify-content: center; box-shadow: 0 2px 6px rgba(197, 168, 128, 0.4); }\r\n  .mobile-menu-toggle { display: none; font-size: 1.3rem; color: var(--color-dark); }\r\n\r\n  \/* MENU MOBILE *\/\r\n  .mobile-nav-drawer { position: fixed; top: 0; left: 0; width: 300px; height: 100%; background: #FFFFFF; z-index: 99999 !important; transform: translateX(-100%); transition: transform var(--transition-smooth); padding: 24px 18px; display: flex; flex-direction: column; box-shadow: 10px 0 40px rgba(0, 0, 0, 0.15); overflow-y: auto; }\r\n  .mobile-nav-overlay { position: fixed; inset: 0; background: rgba(0,0,0,0.6); backdrop-filter: blur(4px); z-index: 99990 !important; opacity: 0; visibility: hidden; transition: all var(--transition-smooth); }\r\n  .mobile-nav-overlay.open { opacity: 1; visibility: visible; }\r\n  .mobile-nav-overlay.open .mobile-nav-drawer { transform: translateX(0); }\r\n  .mobile-nav-links { list-style: none; margin-top: 20px; display: flex; flex-direction: column; gap: 12px; }\r\n  .mobile-nav-links a.mobile-nav-item { font-size: 1.05rem; font-weight: 600; color: var(--color-dark); display: block; padding: 6px 0; }\r\n  .mobile-nav-sub-toggle { display: flex; justify-content: space-between; align-items: center; font-size: 1.05rem; font-weight: 600; color: var(--color-dark); padding: 6px 0; cursor: pointer; }\r\n  .mobile-nav-sub-toggle i { font-size: 0.8rem; color: var(--color-gold); transition: transform var(--transition-fast); }\r\n  .mobile-nav-sub-toggle.active i { transform: rotate(180deg); }\r\n  .mobile-brands-dropdown { display: none; flex-direction: column; gap: 8px; padding: 10px 0 10px 10px; border-left: 2px solid var(--color-gold); margin: 4px 0 8px 4px; }\r\n  .mobile-brands-dropdown.show { display: flex; }\r\n  .mobile-brand-link { display: flex; align-items: center; gap: 10px; padding: 6px 8px; border-radius: var(--radius-sm); background: var(--bg-surface); text-decoration: none; }\r\n  .mobile-brand-link .m-brand-icon { width: 28px; height: 28px; border-radius: 50%; background: #FFFFFF; color: var(--color-gold); display: flex; align-items: center; justify-content: center; font-size: 0.75rem; flex-shrink: 0; }\r\n  .mobile-brand-link strong { font-size: 0.8rem; color: var(--color-dark); display: block; line-height: 1.2; }\r\n  .mobile-brand-link span { font-size: 0.65rem; color: var(--color-muted); display: block; }\r\n\r\n  \/* FOOTER *\/\r\n  .footer { background: var(--bg-dark); color: #A6A097; padding: 55px 0 25px; font-size: 0.86rem; }\r\n  .footer-grid { display: grid; grid-template-columns: 2fr 1.2fr 1.2fr 1.4fr; gap: 40px; margin-bottom: 40px; }\r\n  .footer-brand .logo-title { color: #FFFFFF !important; font-family: var(--font-heading); font-size: 1.8rem; margin-bottom: 10px; }\r\n  .footer-brand p { line-height: 1.55; margin-bottom: 18px; max-width: 320px; }\r\n  .footer-col h5 { color: #FFFFFF !important; font-family: var(--font-heading); font-size: 1.05rem; margin-bottom: 14px; }\r\n  .footer-links { list-style: none; display: flex; flex-direction: column; gap: 8px; }\r\n  .footer-links a:hover { color: var(--color-gold); padding-left: 4px; }\r\n  .footer-bottom { border-top: 1px solid var(--color-border-dark); padding-top: 20px; display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 14px; font-size: 0.78rem; }\r\n\r\n  \/* ==========================================================================\r\n     HERO FACE \u00c0 FACE PARIS\r\n     ========================================================================== *\/\r\n  .brand-hero {\r\n    position: relative;\r\n    padding: 90px 0 80px;\r\n    background: #1A1A1A;\r\n    color: #FFFFFF;\r\n    text-align: center;\r\n    overflow: hidden;\r\n    min-height: 80vh;\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n  }\r\n\r\n  .brand-hero-bg-wrapper { position: absolute; inset: 0; z-index: 1; overflow: hidden; }\r\n\r\n  .brand-hero-bg-image {\r\n    width: 100%;\r\n    height: 100%;\r\n    object-fit: cover;\r\n    object-position: center 45%;\r\n    image-rendering: -webkit-optimize-contrast;\r\n    image-rendering: high-quality;\r\n    opacity: 0.55;\r\n    filter: brightness(1.02) saturate(1.08) contrast(1.05);\r\n    animation: slowDrift 32s ease-in-out infinite alternate;\r\n    transform-origin: center center;\r\n    will-change: transform;\r\n    backface-visibility: hidden;\r\n  }\r\n\r\n  .brand-hero-bg-overlay {\r\n    position: absolute;\r\n    inset: 0;\r\n    z-index: 2;\r\n    background: linear-gradient(\r\n      180deg, \r\n      rgba(18, 18, 18, 0.72) 0%, \r\n      rgba(18, 18, 18, 0.55) 35%, \r\n      rgba(18, 18, 18, 0.55) 65%, \r\n      rgba(18, 18, 18, 0.85) 100%\r\n    );\r\n    pointer-events: none;\r\n  }\r\n\r\n  @keyframes slowDrift {\r\n    0% { transform: scale(1.06) translate(0, 0); }\r\n    25% { transform: scale(1.08) translate(-2%, 1.2%); }\r\n    50% { transform: scale(1.08) translate(1.5%, -1%); }\r\n    75% { transform: scale(1.08) translate(-1.2%, 2%); }\r\n    100% { transform: scale(1.06) translate(1.8%, -1.5%); }\r\n  }\r\n\r\n  @keyframes mobileDrift {\r\n    0%   { transform: scale(1.10) translateX(-1.5%); }\r\n    50%  { transform: scale(1.10) translateX(1.5%); }\r\n    100% { transform: scale(1.10) translateX(-1.5%); }\r\n  }\r\n\r\n  .brand-hero .container { position: relative; z-index: 3; max-width: 880px; width: 100%; }\r\n\r\n  .brand-hero-eyebrow {\r\n    display: inline-flex;\r\n    align-items: center;\r\n    gap: 6px;\r\n    font-size: 0.65rem;\r\n    font-weight: 700;\r\n    letter-spacing: 2.5px;\r\n    text-transform: uppercase;\r\n    color: var(--color-gold);\r\n    margin-bottom: 12px;\r\n    background: rgba(197, 168, 128, 0.18);\r\n    padding: 5px 18px;\r\n    border-radius: var(--radius-pill);\r\n    border: 1px solid rgba(197, 168, 128, 0.35);\r\n    backdrop-filter: blur(8px);\r\n    -webkit-backdrop-filter: blur(8px);\r\n    white-space: nowrap;\r\n  }\r\n\r\n  .brand-hero h1 {\r\n    font-family: var(--font-heading) !important;\r\n    font-size: clamp(2rem, 5vw, 3.4rem) !important;\r\n    font-weight: 600 !important;\r\n    color: #FFFFFF !important;\r\n    line-height: 1.05 !important;\r\n    letter-spacing: -1px !important;\r\n    margin-bottom: 10px !important;\r\n    text-shadow: 0 4px 20px rgba(0,0,0,0.4);\r\n  }\r\n\r\n  .brand-hero-tagline {\r\n    font-family: var(--font-heading);\r\n    font-style: italic;\r\n    font-size: clamp(0.95rem, 1.6vw, 1.15rem);\r\n    color: #E2DDD5;\r\n    margin-bottom: 18px;\r\n    letter-spacing: 0.5px;\r\n    text-shadow: 0 2px 10px rgba(0,0,0,0.5);\r\n  }\r\n\r\n  .gold-divider { width: 60px; height: 2px; background: var(--color-gold); margin: 14px auto 20px; border-radius: var(--radius-pill); }\r\n\r\n  .brand-hero p.intro-text {\r\n    font-size: clamp(0.88rem, 1.3vw, 1.02rem);\r\n    color: #E8E3DB;\r\n    line-height: 1.7;\r\n    max-width: 620px;\r\n    margin: 0 auto 32px;\r\n    font-weight: 400;\r\n    text-shadow: 0 2px 8px rgba(0,0,0,0.5);\r\n  }\r\n\r\n  .brand-hero-badges {\r\n    display: flex;\r\n    justify-content: center;\r\n    align-items: center;\r\n    flex-wrap: nowrap;\r\n    gap: 10px;\r\n    max-width: 100%;\r\n    margin: 0 auto;\r\n    padding: 0 8px;\r\n  }\r\n\r\n  .brand-hero-badges .chip {\r\n    display: inline-flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    gap: 7px;\r\n    padding: 9px 18px;\r\n    background: rgba(255, 255, 255, 0.10);\r\n    border: 1px solid rgba(255, 255, 255, 0.22);\r\n    backdrop-filter: blur(10px);\r\n    -webkit-backdrop-filter: blur(10px);\r\n    border-radius: var(--radius-pill);\r\n    font-size: 0.76rem;\r\n    color: #FFFFFF;\r\n    font-weight: 500;\r\n    transition: all var(--transition-fast);\r\n    white-space: nowrap;\r\n    flex-shrink: 0;\r\n    min-height: 40px;\r\n  }\r\n\r\n  .brand-hero-badges .chip:hover {\r\n    background: rgba(197, 168, 128, 0.28);\r\n    border-color: rgba(197, 168, 128, 0.55);\r\n    transform: translateY(-2px);\r\n  }\r\n\r\n  .brand-hero-badges .chip i { color: var(--color-gold); font-size: 0.82rem; flex-shrink: 0; }\r\n\r\n  \/* BREADCRUMB *\/\r\n  .brand-breadcrumb { background: var(--bg-card); border-bottom: 1px solid var(--color-border); padding: 14px 0; font-size: 0.82rem; color: var(--color-muted); }\r\n  .brand-breadcrumb .container { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }\r\n  .brand-breadcrumb a { color: var(--color-muted); }\r\n  .brand-breadcrumb a:hover { color: var(--color-gold); }\r\n  .brand-breadcrumb i { font-size: 0.65rem; color: var(--color-border); }\r\n  .brand-breadcrumb .current { color: var(--color-dark); font-weight: 600; }\r\n\r\n  \/* PRODUITS *\/\r\n  .brand-products-section { padding: 60px 0 80px; background: var(--bg-body); }\r\n  .brand-products-header { text-align: center; max-width: 680px; margin: 0 auto 40px; padding: 0 8px; }\r\n  .brand-products-header .section-tag { display: inline-flex; align-items: center; gap: 6px; font-size: 0.7rem; font-weight: 700; letter-spacing: 2.5px; text-transform: uppercase; color: var(--color-gold); margin-bottom: 10px; }\r\n  .brand-products-header h2 { font-family: var(--font-heading) !important; font-size: clamp(1.6rem, 3vw, 2.4rem) !important; font-weight: 600 !important; color: var(--color-dark) !important; line-height: 1.15 !important; margin-bottom: 10px !important; }\r\n  .brand-products-header h2 em { font-style: italic !important; color: var(--color-gold) !important; }\r\n  .brand-products-header p { font-size: clamp(0.86rem, 1.2vw, 0.96rem); color: var(--color-muted); line-height: 1.6; }\r\n\r\n  .woow-products-wrapper { width: 100%; min-height: 200px; position: relative; }\r\n\r\n  \/* WOOCOMMERCE *\/\r\n  .wonderlook-wrapper .woocommerce ul.products,\r\n  .woow-products-wrapper ul.products { display: grid !important; grid-template-columns: repeat(4, 1fr) !important; gap: 22px !important; margin: 0 !important; padding: 0 !important; list-style: none !important; }\r\n  .wonderlook-wrapper .woocommerce ul.products::before,\r\n  .wonderlook-wrapper .woocommerce ul.products::after,\r\n  .woow-products-wrapper ul.products::before,\r\n  .woow-products-wrapper ul.products::after { display: none !important; }\r\n  .wonderlook-wrapper .woocommerce ul.products li.product,\r\n  .woow-products-wrapper ul.products li.product { margin: 0 !important; width: 100% !important; max-width: 100% !important; float: none !important; background: var(--bg-card) !important; border: 1px solid var(--color-border) !important; border-radius: var(--radius-md) !important; overflow: hidden !important; transition: all var(--transition-smooth) !important; box-shadow: var(--shadow-subtle) !important; padding: 0 !important; position: relative !important; text-align: left !important; display: flex !important; flex-direction: column !important; }\r\n  .wonderlook-wrapper .woocommerce ul.products li.product:hover,\r\n  .woow-products-wrapper ul.products li.product:hover { transform: translateY(-6px) !important; box-shadow: 0 16px 36px rgba(197, 168, 128, 0.2) !important; border-color: var(--color-gold) !important; }\r\n  .wonderlook-wrapper .woocommerce ul.products li.product a img,\r\n  .woow-products-wrapper ul.products li.product a img { width: 100% !important; height: auto !important; aspect-ratio: 4 \/ 3 !important; object-fit: cover !important; margin: 0 !important; transition: transform var(--transition-smooth) !important; display: block !important; }\r\n  .wonderlook-wrapper .woocommerce ul.products li.product:hover a img,\r\n  .woow-products-wrapper ul.products li.product:hover a img { transform: scale(1.06) !important; }\r\n\r\n  .wonderlook-wrapper .woocommerce ul.products li.product .onsale,\r\n  .woow-products-wrapper ul.products li.product .onsale { position: absolute !important; top: 12px !important; left: 12px !important; background: #BA3D32 !important; color: #FFFFFF !important; font-size: 0.65rem !important; font-weight: 700 !important; padding: 4px 12px !important; border-radius: var(--radius-pill) !important; text-transform: uppercase !important; z-index: 2 !important; }\r\n  .wonderlook-wrapper .woocommerce ul.products li.product .woocommerce-loop-product__title,\r\n  .wonderlook-wrapper .woocommerce ul.products li.product h2,\r\n  .woow-products-wrapper ul.products li.product .woocommerce-loop-product__title,\r\n  .woow-products-wrapper ul.products li.product h2 { font-family: var(--font-heading) !important; font-size: 1.1rem !important; font-weight: 600 !important; color: var(--color-dark) !important; line-height: 1.3 !important; padding: 18px 20px 4px !important; margin: 0 !important; }\r\n  .wonderlook-wrapper .woocommerce ul.products li.product .product-categories,\r\n  .woow-products-wrapper ul.products li.product .product-categories { font-size: 0.7rem !important; font-weight: 700 !important; letter-spacing: 1.5px !important; text-transform: uppercase !important; color: var(--color-gold) !important; padding: 0 20px !important; display: block !important; }\r\n  .wonderlook-wrapper .woocommerce ul.products li.product .product-categories a,\r\n  .woow-products-wrapper ul.products li.product .product-categories a { color: var(--color-gold) !important; }\r\n  .wonderlook-wrapper .woocommerce ul.products li.product .price,\r\n  .woow-products-wrapper ul.products li.product .price { font-size: 1.15rem !important; font-weight: 700 !important; color: var(--color-dark) !important; padding: 8px 20px 16px !important; display: block !important; margin-top: auto !important; }\r\n  .wonderlook-wrapper .woocommerce ul.products li.product .price del,\r\n  .woow-products-wrapper ul.products li.product .price del { font-size: 0.78rem !important; color: var(--color-muted) !important; text-decoration: line-through !important; margin-right: 6px !important; opacity: 0.7 !important; }\r\n  .wonderlook-wrapper .woocommerce ul.products li.product .price ins,\r\n  .woow-products-wrapper ul.products li.product .price ins { text-decoration: none !important; color: var(--color-dark) !important; }\r\n  .wonderlook-wrapper .woocommerce ul.products li.product .button,\r\n  .woow-products-wrapper ul.products li.product .button { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 6px !important; background: var(--color-dark) !important; color: #FFFFFF !important; padding: 10px 18px !important; border-radius: var(--radius-pill) !important; font-size: 0.78rem !important; font-weight: 600 !important; margin: 0 20px 20px !important; transition: all var(--transition-smooth) !important; border: none !important; width: calc(100% - 40px) !important; }\r\n  .wonderlook-wrapper .woocommerce ul.products li.product .button:hover,\r\n  .woow-products-wrapper ul.products li.product .button:hover { background: var(--color-gold) !important; color: #121212 !important; transform: translateY(-2px) !important; }\r\n\r\n  \/* Pagination *\/\r\n  .wonderlook-wrapper .woocommerce nav.woocommerce-pagination,\r\n  .woow-products-wrapper nav.woocommerce-pagination { margin-top: 50px !important; text-align: center !important; }\r\n  .wonderlook-wrapper .woocommerce nav.woocommerce-pagination ul,\r\n  .woow-products-wrapper nav.woocommerce-pagination ul { display: inline-flex !important; gap: 8px !important; border: none !important; padding: 0 !important; margin: 0 !important; justify-content: center !important; flex-wrap: wrap !important; }\r\n  .wonderlook-wrapper .woocommerce nav.woocommerce-pagination ul li,\r\n  .woow-products-wrapper nav.woocommerce-pagination ul li { border: none !important; margin: 0 !important; }\r\n  .wonderlook-wrapper .woocommerce nav.woocommerce-pagination ul li a,\r\n  .wonderlook-wrapper .woocommerce nav.woocommerce-pagination ul li span,\r\n  .woow-products-wrapper nav.woocommerce-pagination ul li a,\r\n  .woow-products-wrapper nav.woocommerce-pagination ul li span { display: inline-flex !important; align-items: center !important; justify-content: center !important; min-width: 40px !important; height: 40px !important; padding: 0 14px !important; border-radius: var(--radius-pill) !important; background: var(--bg-card) !important; color: var(--color-dark) !important; font-weight: 600 !important; border: 1px solid var(--color-border) !important; }\r\n  .wonderlook-wrapper .woocommerce nav.woocommerce-pagination ul li a:hover,\r\n  .wonderlook-wrapper .woocommerce nav.woocommerce-pagination ul li span.current,\r\n  .woow-products-wrapper nav.woocommerce-pagination ul li a:hover,\r\n  .woow-products-wrapper nav.woocommerce-pagination ul li span.current { background: var(--color-gold) !important; color: #121212 !important; border-color: var(--color-gold) !important; }\r\n\r\n  \/* R\u00c9ASSURANCE *\/\r\n  .brand-reassurance { padding: 40px 0; background: var(--bg-card); border-top: 1px solid var(--color-border); border-bottom: 1px solid var(--color-border); }\r\n  .brand-reassurance-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; text-align: center; }\r\n  .brand-reassurance-item { display: flex; flex-direction: column; align-items: center; gap: 10px; }\r\n  .brand-reassurance-item .icon { width: 52px; height: 52px; border-radius: 50%; background: var(--color-gold-light); color: var(--color-gold); display: flex; align-items: center; justify-content: center; font-size: 1.2rem; border: 1px solid rgba(197, 168, 128, 0.25); transition: all var(--transition-fast); }\r\n  .brand-reassurance-item:hover .icon { background: var(--color-gold); color: #FFFFFF; transform: scale(1.08); }\r\n  .brand-reassurance-item h4 { font-family: var(--font-heading); font-size: 0.95rem; font-weight: 600; color: var(--color-dark); margin: 0; }\r\n  .brand-reassurance-item p { font-size: 0.78rem; color: var(--color-muted); line-height: 1.4; margin: 0; }\r\n\r\n  \/* CTA *\/\r\n  .brand-cta { padding: 55px 0; background: var(--bg-dark); color: #FFFFFF; text-align: center; position: relative; overflow: hidden; }\r\n  .brand-cta::after { content: ''; position: absolute; right: -10%; bottom: -40%; width: 400px; height: 400px; background: radial-gradient(circle, rgba(197, 168, 128, 0.15) 0%, transparent 70%); pointer-events: none; }\r\n  .brand-cta .container { position: relative; z-index: 2; max-width: 640px; padding: 0 20px; }\r\n  .brand-cta h3 { font-family: var(--font-heading) !important; font-size: clamp(1.4rem, 2.8vw, 2.2rem) !important; font-weight: 600 !important; color: #FFFFFF !important; line-height: 1.2 !important; margin-bottom: 12px !important; }\r\n  .brand-cta h3 em { font-style: italic !important; color: var(--color-gold) !important; }\r\n  .brand-cta p { color: #D5D0C8 !important; font-size: clamp(0.85rem, 1.2vw, 0.95rem); margin-bottom: 22px; }\r\n  .brand-cta .cta-btns { display: flex; justify-content: center; gap: 12px; flex-wrap: wrap; }\r\n  .brand-cta .cta-btns a { display: inline-flex; align-items: center; gap: 8px; padding: 12px 28px; border-radius: var(--radius-pill); font-weight: 600; font-size: 0.85rem; transition: all var(--transition-smooth); }\r\n  .brand-cta .cta-btns .btn-gold { background: var(--color-gold); color: #121212 !important; box-shadow: 0 8px 20px rgba(197, 168, 128, 0.3); }\r\n  .brand-cta .cta-btns .btn-gold:hover { background: #D8BD97; transform: translateY(-2px); }\r\n  .brand-cta .cta-btns .btn-glass { background: rgba(255, 255, 255, 0.08); color: #FFFFFF !important; border: 1px solid rgba(255, 255, 255, 0.25); backdrop-filter: blur(8px); }\r\n  .brand-cta .cta-btns .btn-glass:hover { background: #FFFFFF; color: var(--color-dark) !important; }\r\n\r\n  \/* ==========================================================================\r\n     RESPONSIVE\r\n     ========================================================================== *\/\r\n  @media (max-width: 1024px) {\r\n    .container { padding: 0 20px; }\r\n    .nav-desktop { display: none; }\r\n    .mobile-menu-toggle { display: block; }\r\n    .footer-grid { grid-template-columns: 1fr 1fr; }\r\n    .mega-menu { width: 92vw; left: 50%; transform: translateX(-50%) translateY(14px); }\r\n    .nav-item:hover .mega-menu { transform: translateX(-50%) translateY(0); }\r\n    .wonderlook-wrapper .woocommerce ul.products,\r\n    .woow-products-wrapper ul.products { grid-template-columns: repeat(2, 1fr) !important; gap: 18px !important; }\r\n    .brand-hero-badges { flex-wrap: wrap; gap: 10px; }\r\n    .brand-hero { padding: 70px 0 60px; min-height: 70vh; }\r\n    .brand-hero-bg-image { opacity: 0.5; }\r\n    .brand-reassurance-grid { grid-template-columns: repeat(2, 1fr); gap: 20px; }\r\n  }\r\n\r\n  @media (max-width: 768px) {\r\n    .container { padding: 0 16px; }\r\n\r\n    .top-announcement-right { display: none; }\r\n    .top-announcement-left { gap: 12px; flex-wrap: wrap; }\r\n    .top-badge { font-size: 0.68rem; }\r\n\r\n    .header-inner { height: 72px !important; }\r\n    .header-logo-img { height: 42px !important; max-height: 42px !important; max-width: 150px !important; }\r\n    .logo-subtext .subtext-line-1 { font-size: 0.44rem !important; letter-spacing: 1.8px !important; }\r\n    .logo-subtext .subtext-line-2 { font-size: 0.36rem !important; letter-spacing: 1.2px !important; }\r\n    .action-btn { width: 38px !important; height: 38px !important; font-size: 1rem !important; }\r\n\r\n    \/* ===== HERO MOBILE \u2014 IMAGE ENTI\u00c8RE + ANIM\u00c9E ===== *\/\r\n    .brand-hero {\r\n      display: flex !important;\r\n      flex-direction: column !important;\r\n      align-items: stretch !important;\r\n      justify-content: flex-start !important;\r\n      padding: 0 !important;\r\n      min-height: auto !important;\r\n      background: #1A1A1A !important;\r\n      overflow: hidden !important;\r\n    }\r\n\r\n    .brand-hero-bg-wrapper {\r\n      position: relative !important;\r\n      inset: auto !important;\r\n      width: 100% !important;\r\n      height: auto !important;\r\n      aspect-ratio: auto !important;\r\n      flex-shrink: 0 !important;\r\n      overflow: hidden !important;\r\n      z-index: 1 !important;\r\n      background: #1A1A1A !important;\r\n    }\r\n\r\n    .brand-hero-bg-image {\r\n      position: relative !important;\r\n      top: auto !important;\r\n      left: auto !important;\r\n      width: 100% !important;\r\n      height: auto !important;\r\n      object-fit: contain !important;\r\n      object-position: center center !important;\r\n      opacity: 1 !important;\r\n      filter: brightness(0.98) saturate(1.05) !important;\r\n      animation: mobileDrift 18s ease-in-out infinite !important;\r\n      transform-origin: center center !important;\r\n      will-change: transform !important;\r\n      display: block !important;\r\n      image-rendering: auto !important;\r\n    }\r\n\r\n    .brand-hero-bg-overlay {\r\n      position: absolute !important;\r\n      inset: 0 !important;\r\n      background: linear-gradient(\r\n        180deg,\r\n        rgba(26, 26, 26, 0) 0%,\r\n        rgba(26, 26, 26, 0) 55%,\r\n        rgba(26, 26, 26, 0.35) 78%,\r\n        rgba(26, 26, 26, 0.75) 92%,\r\n        rgba(26, 26, 26, 1) 100%\r\n      ) !important;\r\n      z-index: 2 !important;\r\n      pointer-events: none !important;\r\n    }\r\n\r\n    .brand-hero .container {\r\n      position: relative !important;\r\n      z-index: 3 !important;\r\n      padding: 0 20px 36px !important;\r\n      margin-top: -28px !important;\r\n      text-align: center !important;\r\n      max-width: 100% !important;\r\n      width: 100% !important;\r\n    }\r\n\r\n    .brand-hero-eyebrow {\r\n      font-size: 0.54rem !important;\r\n      padding: 5px 13px !important;\r\n      letter-spacing: 1.9px !important;\r\n      margin-bottom: 16px !important;\r\n      gap: 5px !important;\r\n    }\r\n    .brand-hero-eyebrow i { font-size: 0.58rem !important; }\r\n\r\n    .brand-hero h1 {\r\n      font-size: 1.85rem !important;\r\n      letter-spacing: -0.5px !important;\r\n      margin-bottom: 6px !important;\r\n      line-height: 1 !important;\r\n    }\r\n\r\n    .brand-hero-tagline {\r\n      font-size: 0.86rem !important;\r\n      margin-bottom: 14px !important;\r\n      letter-spacing: 0.3px !important;\r\n      line-height: 1.4 !important;\r\n    }\r\n\r\n    .gold-divider {\r\n      width: 40px !important;\r\n      height: 2px !important;\r\n      margin: 10px auto 18px !important;\r\n    }\r\n\r\n    .brand-hero p.intro-text {\r\n      font-size: 0.84rem !important;\r\n      line-height: 1.6 !important;\r\n      margin-bottom: 24px !important;\r\n      padding: 0 4px !important;\r\n      max-width: 100% !important;\r\n    }\r\n\r\n    .brand-hero-badges {\r\n      display: grid !important;\r\n      grid-template-columns: 1fr 1fr !important;\r\n      gap: 8px !important;\r\n      max-width: 380px !important;\r\n      margin: 0 auto !important;\r\n    }\r\n\r\n    .brand-hero-badges .chip {\r\n      padding: 9px 11px !important;\r\n      font-size: 0.68rem !important;\r\n      gap: 5px !important;\r\n      min-height: 40px !important;\r\n      white-space: nowrap !important;\r\n      justify-content: center !important;\r\n      width: 100% !important;\r\n    }\r\n    .brand-hero-badges .chip i { font-size: 0.7rem !important; }\r\n\r\n    .brand-breadcrumb { font-size: 0.7rem; padding: 9px 0; }\r\n    .brand-breadcrumb .container { gap: 5px; }\r\n\r\n    .brand-products-section { padding: 34px 0 44px; }\r\n    .brand-products-header { margin-bottom: 22px; padding: 0 4px; }\r\n    .brand-products-header .section-tag { font-size: 0.66rem; margin-bottom: 8px; }\r\n    .brand-products-header h2 { font-size: 1.42rem !important; margin-bottom: 8px !important; }\r\n    .brand-products-header p { font-size: 0.84rem; line-height: 1.55; }\r\n\r\n    .wonderlook-wrapper .woocommerce ul.products,\r\n    .woow-products-wrapper ul.products { grid-template-columns: 1fr !important; gap: 14px !important; }\r\n    .wonderlook-wrapper .woocommerce ul.products li.product,\r\n    .woow-products-wrapper ul.products li.product { border-radius: var(--radius-md) !important; max-width: 460px !important; margin: 0 auto !important; }\r\n\r\n    .wonderlook-wrapper .woocommerce ul.products li.product .woocommerce-loop-product__title,\r\n    .woow-products-wrapper ul.products li.product .woocommerce-loop-product__title { font-size: 1.02rem !important; padding: 14px 16px 4px !important; }\r\n    .wonderlook-wrapper .woocommerce ul.products li.product .product-categories,\r\n    .woow-products-wrapper ul.products li.product .product-categories { font-size: 0.64rem !important; padding: 0 16px !important; }\r\n    .wonderlook-wrapper .woocommerce ul.products li.product .price,\r\n    .woow-products-wrapper ul.products li.product .price { font-size: 1.02rem !important; padding: 6px 16px 12px !important; }\r\n    .wonderlook-wrapper .woocommerce ul.products li.product .button,\r\n    .woow-products-wrapper ul.products li.product .button { font-size: 0.8rem !important; padding: 10px 14px !important; margin: 0 16px 16px !important; width: calc(100% - 32px) !important; }\r\n\r\n    .brand-reassurance { padding: 28px 0; }\r\n    .brand-reassurance-grid { grid-template-columns: repeat(2, 1fr); gap: 14px 10px; }\r\n    .brand-reassurance-item { gap: 8px; }\r\n    .brand-reassurance-item .icon { width: 42px; height: 42px; font-size: 0.95rem; }\r\n    .brand-reassurance-item h4 { font-size: 0.8rem; }\r\n    .brand-reassurance-item p { font-size: 0.68rem; line-height: 1.35; }\r\n\r\n    .brand-cta { padding: 38px 0; }\r\n    .brand-cta h3 { font-size: 1.3rem !important; margin-bottom: 10px !important; }\r\n    .brand-cta p { font-size: 0.82rem; margin-bottom: 18px; }\r\n    .brand-cta .cta-btns { gap: 9px; }\r\n    .brand-cta .cta-btns a { font-size: 0.78rem; padding: 10px 20px; width: 100%; justify-content: center; }\r\n\r\n    .footer { padding: 28px 0 15px !important; }\r\n    .footer-grid { grid-template-columns: 1fr 1fr !important; gap: 18px 14px !important; margin-bottom: 18px !important; }\r\n    .footer-brand { grid-column: 1 \/ -1; text-align: center; }\r\n    .footer-brand .logo-title { font-size: 1.35rem !important; margin-bottom: 4px !important; }\r\n    .footer-brand p { font-size: 0.75rem !important; margin: 0 auto 10px !important; }\r\n    .footer-col h5 { font-size: 0.84rem !important; margin-bottom: 8px !important; border-bottom: 1px solid rgba(255,255,255,0.08); padding-bottom: 4px; }\r\n    .footer-links { gap: 6px; }\r\n    .footer-links a { font-size: 0.73rem !important; }\r\n    .footer-col p { font-size: 0.73rem !important; margin-bottom: 4px !important; }\r\n    .footer-bottom { padding-top: 12px !important; font-size: 0.68rem !important; flex-direction: column; gap: 8px; text-align: center; }\r\n\r\n    .mega-menu-grid { grid-template-columns: 1fr; }\r\n  }\r\n\r\n  @media (max-width: 480px) {\r\n    .container { padding: 0 14px; }\r\n    .brand-hero .container { padding: 0 16px 32px !important; margin-top: -24px !important; }\r\n    .brand-hero h1 { font-size: 1.65rem !important; }\r\n    .brand-hero-tagline { font-size: 0.8rem !important; }\r\n    .brand-hero p.intro-text { font-size: 0.8rem !important; line-height: 1.55 !important; margin-bottom: 20px !important; }\r\n    .brand-hero-eyebrow { font-size: 0.5rem !important; padding: 4px 10px !important; letter-spacing: 1.4px !important; margin-bottom: 14px !important; }\r\n    .brand-hero-badges { grid-template-columns: 1fr 1fr !important; gap: 7px !important; max-width: 100% !important; }\r\n    .brand-hero-badges .chip { font-size: 0.62rem !important; padding: 8px 7px !important; gap: 4px !important; min-height: 36px !important; }\r\n    .brand-hero-badges .chip i { font-size: 0.64rem !important; }\r\n\r\n    .brand-products-section { padding: 28px 0 38px; }\r\n    .brand-products-header h2 { font-size: 1.3rem !important; }\r\n    .brand-reassurance-grid { grid-template-columns: 1fr 1fr; gap: 12px 8px; }\r\n    .brand-cta h3 { font-size: 1.15rem !important; }\r\n  }\r\n\r\n  @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {\r\n    .brand-hero-bg-image { image-rendering: -webkit-optimize-contrast; image-rendering: high-quality; }\r\n  }\r\n\r\n  @media (prefers-reduced-motion: reduce) {\r\n    .brand-hero-bg-image { animation: none !important; }\r\n  }\r\n<\/style>\r\n\r\n<div class=\"wonderlook-wrapper\">\r\n\r\n  <aside class=\"top-announcement\" aria-label=\"Informations de service\">\r\n    <div class=\"container\">\r\n      <div class=\"top-announcement-left\">\r\n        <span class=\"top-badge\"><i class=\"fas fa-truck-fast\"><\/i> Livraison Gratuite d\u00e8s 600 DH partout au Maroc<\/span>\r\n        <span class=\"top-badge\"><i class=\"fas fa-wand-magic-sparkles\"><\/i> Conseil Visagisme &amp; Morphologie Personnalis\u00e9<\/span>\r\n      <\/div>\r\n      <div class=\"top-announcement-right\">\r\n        <span class=\"top-badge\"><i class=\"fas fa-phone-alt\"><\/i> Fez : 05 22 12 34 56<\/span>\r\n        <span class=\"top-pill\"><i class=\"fas fa-money-bill-wave\"><\/i> Paiement \u00e0 la livraison (Cash \/ TPE)<\/span>\r\n      <\/div>\r\n    <\/div>\r\n  <\/aside>\r\n\r\n  <header class=\"header\" id=\"main-header\">\r\n    <div class=\"container\">\r\n      <div class=\"header-inner\">\r\n        <button class=\"mobile-menu-toggle\" id=\"open-menu-btn\" aria-label=\"Menu Mobile\"><i class=\"fas fa-bars-staggered\"><\/i><\/button>\r\n        <a href=\"#\" class=\"brand-logo\" aria-label=\"Wonder Look Accueil\">\r\n          <img decoding=\"async\" src=\"https:\/\/i.ibb.co\/VpJ5C7mV\/Logo.png\" alt=\"Wonder Look\" class=\"header-logo-img\" \/>\r\n          <div class=\"logo-subtext\">\r\n            <span class=\"subtext-line-1\">OPTICAL &amp; SUNGLASSES<\/span>\r\n            <span class=\"subtext-line-2\">MAISON D'OPTIQUE &ndash; MAROC<\/span>\r\n          <\/div>\r\n        <\/a>\r\n        <nav aria-label=\"Navigation principale\">\r\n          <ul class=\"nav-desktop\">\r\n            <li class=\"nav-item\"><a href=\"#\" class=\"nav-link\">Accueil<\/a><\/li>\r\n            <li class=\"nav-item active\">\r\n              <a href=\"#collections\" class=\"nav-link\">Montures de Cr\u00e9ateurs <i class=\"fas fa-chevron-down\" style=\"font-size:0.65rem;\"><\/i><\/a>\r\n              <div class=\"mega-menu\">\r\n                <div class=\"mega-menu-header\">\r\n                  <h4>Collections Internationales &amp; Exclusives<\/h4>\r\n                  <a href=\"https:\/\/wonderlookstore.com\/?page_id=3505\" style=\"font-size:0.8rem; font-weight:600; color:var(--color-gold);\">Voir tout le catalogue &rarr;<\/a>\r\n                <\/div>\r\n                <div class=\"mega-menu-grid\">\r\n                  <a href=\"#\" class=\"mega-brand-card\"><div class=\"mega-brand-icon\"><i class=\"fas fa-palette\"><\/i><\/div><div><h5>WOOW<\/h5><p>Designs cr\u00e9atifs, color\u00e9s et audacieux<\/p><\/div><\/a>\r\n                  <a href=\"#\" class=\"mega-brand-card\"><div class=\"mega-brand-icon\"><i class=\"fas fa-landmark\"><\/i><\/div><div><h5>FACE \u00c0 FACE Paris<\/h5><p>Inspir\u00e9 de l'art et de l'architecture<\/p><\/div><\/a>\r\n                  <a href=\"#\" class=\"mega-brand-card\"><div class=\"mega-brand-icon\"><i class=\"fas fa-child\"><\/i><\/div><div><h5>NIFTIES<\/h5><p>Montures l\u00e9g\u00e8res pour petits visages<\/p><\/div><\/a>\r\n                  <a href=\"#\" class=\"mega-brand-card\"><div class=\"mega-brand-icon\"><i class=\"fas fa-city\"><\/i><\/div><div><h5>CHARLES STONE New York<\/h5><p>Style new-yorkais, \u00e9l\u00e9gance contemporaine<\/p><\/div><\/a>\r\n                  <a href=\"#\" class=\"mega-brand-card\"><div class=\"mega-brand-icon\"><i class=\"fas fa-gem\"><\/i><\/div><div><h5>INFACE<\/h5><p>Lignes \u00e9pur\u00e9es et intemporelles<\/p><\/div><\/a>\r\n                  <a href=\"#\" class=\"mega-brand-card\"><div class=\"mega-brand-icon\"><i class=\"fas fa-crown\"><\/i><\/div><div><h5>WILLIAM MORRIS London<\/h5><p>\u00c9l\u00e9gance londonienne, raffinement et qualit\u00e9<\/p><\/div><\/a>\r\n                  <a href=\"#\" class=\"mega-brand-card\"><div class=\"mega-brand-icon\"><i class=\"fas fa-signature\"><\/i><\/div><div><h5>PRODESIGN Denmark<\/h5><p>Design scandinave, \u00e9l\u00e9gance et confort<\/p><\/div><\/a>\r\n                  <a href=\"#\" class=\"mega-brand-card\"><div class=\"mega-brand-icon\"><i class=\"fas fa-star\"><\/i><\/div><div><h5>BELVA<\/h5><p>Montures contemporaines made in Morocco<\/p><\/div><\/a>\r\n                  <a href=\"#\" class=\"mega-brand-card\"><div class=\"mega-brand-icon\"><i class=\"fas fa-eye\"><\/i><\/div><div><h5>FRESHVUE Lens<\/h5><p>Lentilles de contact, vision nette et confort<\/p><\/div><\/a>\r\n                  <a href=\"#\" class=\"mega-brand-card\"><div class=\"mega-brand-icon\"><i class=\"fas fa-leaf\"><\/i><\/div><div><h5>KILSGAARD<\/h5><p>Minimalisme scandinave, montures raffin\u00e9es<\/p><\/div><\/a>\r\n                <\/div>\r\n              <\/div>\r\n            <\/li>\r\n            <li class=\"nav-item\"><a href=\"https:\/\/wonderlookstore.com\/?page_id=3472\" class=\"nav-link\">Conseil Visagisme<\/a><\/li>\r\n            <li class=\"nav-item\"><a href=\"https:\/\/wonderlookstore.com\/?page_id=3505\" class=\"nav-link\">Boutiques<\/a><\/li>\r\n          <\/ul>\r\n        <\/nav>\r\n        <div class=\"header-actions\">\r\n          <button class=\"action-btn\" title=\"Rechercher\" aria-label=\"Rechercher\"><i class=\"fas fa-magnifying-glass\"><\/i><\/button>\r\n          <button class=\"action-btn\" id=\"open-cart-btn\" title=\"Mon Panier\" aria-label=\"Mon Panier\">\r\n            <i class=\"fas fa-bag-shopping\"><\/i>\r\n            <span class=\"cart-counter\" id=\"cart-count\">0<\/span>\r\n          <\/button>\r\n        <\/div>\r\n      <\/div>\r\n    <\/div>\r\n  <\/header>\r\n\r\n  <div class=\"mobile-nav-overlay\" id=\"mobile-overlay\">\r\n    <div class=\"mobile-nav-drawer\">\r\n      <div style=\"display:flex; justify-content:space-between; align-items:center;\">\r\n        <a href=\"#\" class=\"brand-logo\" aria-label=\"Wonder Look Accueil\">\r\n          <img decoding=\"async\" src=\"https:\/\/i.ibb.co\/VpJ5C7mV\/Logo.png\" alt=\"Wonder Look\" class=\"header-logo-img\" style=\"height:44px !important; max-height:44px !important; width:auto !important; max-width:150px !important; object-fit:contain !important; display:block !important;\" \/>\r\n        <\/a>\r\n        <button id=\"close-menu-btn\" style=\"font-size:1.3rem; color:var(--color-dark);\"><i class=\"fas fa-times\"><\/i><\/button>\r\n      <\/div>\r\n      <ul class=\"mobile-nav-links\">\r\n        <li><a href=\"#\" class=\"mobile-nav-item\">Accueil<\/a><\/li>\r\n        <li>\r\n          <div class=\"mobile-nav-sub-toggle\" id=\"mobile-brands-toggle\">\r\n            <span>Nos Montures de Cr\u00e9ateurs<\/span>\r\n            <i class=\"fas fa-chevron-down\" id=\"mobile-chevron\"><\/i>\r\n          <\/div>\r\n          <div class=\"mobile-brands-dropdown\" id=\"mobile-brands-list\">\r\n            <a href=\"#\" class=\"mobile-brand-link\"><div class=\"m-brand-icon\"><i class=\"fas fa-palette\"><\/i><\/div><div><strong>WOOW<\/strong><span>Designs cr\u00e9atifs &amp; audacieux<\/span><\/div><\/a>\r\n            <a href=\"#\" class=\"mobile-brand-link\"><div class=\"m-brand-icon\"><i class=\"fas fa-landmark\"><\/i><\/div><div><strong>FACE \u00c0 FACE Paris<\/strong><span>Art &amp; architecture<\/span><\/div><\/a>\r\n            <a href=\"#\" class=\"mobile-brand-link\"><div class=\"m-brand-icon\"><i class=\"fas fa-child\"><\/i><\/div><div><strong>NIFTIES<\/strong><span>Pour petits visages<\/span><\/div><\/a>\r\n            <a href=\"#\" class=\"mobile-brand-link\"><div class=\"m-brand-icon\"><i class=\"fas fa-city\"><\/i><\/div><div><strong>CHARLES STONE New York<\/strong><span>Style new-yorkais<\/span><\/div><\/a>\r\n            <a href=\"#\" class=\"mobile-brand-link\"><div class=\"m-brand-icon\"><i class=\"fas fa-gem\"><\/i><\/div><div><strong>INFACE<\/strong><span>Lignes \u00e9pur\u00e9es<\/span><\/div><\/a>\r\n            <a href=\"#\" class=\"mobile-brand-link\"><div class=\"m-brand-icon\"><i class=\"fas fa-crown\"><\/i><\/div><div><strong>WILLIAM MORRIS London<\/strong><span>\u00c9l\u00e9gance londonienne<\/span><\/div><\/a>\r\n            <a href=\"#\" class=\"mobile-brand-link\"><div class=\"m-brand-icon\"><i class=\"fas fa-signature\"><\/i><\/div><div><strong>PRODESIGN Denmark<\/strong><span>Design scandinave<\/span><\/div><\/a>\r\n            <a href=\"#\" class=\"mobile-brand-link\"><div class=\"m-brand-icon\"><i class=\"fas fa-star\"><\/i><\/div><div><strong>BELVA<\/strong><span>Made in Morocco<\/span><\/div><\/a>\r\n            <a href=\"#\" class=\"mobile-brand-link\"><div class=\"m-brand-icon\"><i class=\"fas fa-eye\"><\/i><\/div><div><strong>FRESHVUE Lens<\/strong><span>Lentilles de contact<\/span><\/div><\/a>\r\n            <a href=\"#\" class=\"mobile-brand-link\"><div class=\"m-brand-icon\"><i class=\"fas fa-leaf\"><\/i><\/div><div><strong>KILSGAARD<\/strong><span>Minimalisme scandinave<\/span><\/div><\/a>\r\n          <\/div>\r\n        <\/li>\r\n        <li><a href=\"https:\/\/wonderlookstore.com\/?page_id=3472\" class=\"mobile-nav-item\">Conseil &amp; Visagisme<\/a><\/li>\r\n        <li><a href=\"https:\/\/wonderlookstore.com\/?page_id=3505\" class=\"mobile-nav-item\">Boutiques<\/a><\/li>\r\n      <\/ul>\r\n      <div style=\"margin-top:auto; padding-top:16px; border-top:1px solid var(--color-border);\">\r\n        <p style=\"font-size:0.75rem; color:var(--color-muted); margin-bottom:4px;\">Service Client Fez<\/p>\r\n        <a href=\"tel:+212522123456\" style=\"font-weight:700; color:var(--color-dark); display:block; margin-bottom:8px; font-size:0.9rem;\">+212 5 22 12 34 56<\/a>\r\n        <a href=\"https:\/\/wa.me\/212600000000\" style=\"background:#25D366; color:#FFFFFF !important; padding:8px 12px; border-radius:999px; font-weight:600; font-size:0.8rem; display:inline-flex; align-items:center; gap:8px; width:100%; justify-content:center;\">\r\n          <i class=\"fab fa-whatsapp\"><\/i> WhatsApp Direct\r\n        <\/a>\r\n      <\/div>\r\n    <\/div>\r\n  <\/div>\r\n\r\n  <main>\r\n\r\n    <!-- ================= HERO FACE \u00c0 FACE PARIS ================= -->\r\n    <section class=\"brand-hero\">\r\n      <div class=\"brand-hero-bg-wrapper\">\r\n        <img \r\n          src=\"https:\/\/i.ibb.co\/FLcZ9g54\/face-a-face.jpg\" \r\n          alt=\"Face \u00e0 Face Paris Background\" \r\n          class=\"brand-hero-bg-image\"\r\n          loading=\"eager\"\r\n          fetchpriority=\"high\"\r\n          decoding=\"async\"\r\n        \/>\r\n        <div class=\"brand-hero-bg-overlay\"><\/div>\r\n      <\/div>\r\n      <div class=\"container\">\r\n        <span class=\"brand-hero-eyebrow\"><i class=\"fas fa-landmark\"><\/i> Marque Cr\u00e9ateur &bull; Paris<\/span>\r\n        <h1>Face \u00e0 Face<\/h1>\r\n        <p class=\"brand-hero-tagline\">L'audace parisienne, l'art de la vision<\/p>\r\n        <div class=\"gold-divider\"><\/div>\r\n        <p class=\"intro-text\">\r\n          Depuis 1995, FACE A FACE r\u00e9invente la lunetterie en fusionnant l'art moderne, \r\n          l'architecture et le design contemporain. Des formes sculpturales, des couleurs vibrantes \r\n          et des mat\u00e9riaux d'exception \u2014 pour celles et ceux qui osent un regard diff\u00e9rent.\r\n        <\/p>\r\n        <div class=\"brand-hero-badges\">\r\n          <span class=\"chip\"><i class=\"fas fa-palette\"><\/i> Design avant-gardiste<\/span>\r\n          <span class=\"chip\"><i class=\"fas fa-gem\"><\/i> Ac\u00e9tate bio &amp; titane<\/span>\r\n          <span class=\"chip\"><i class=\"fas fa-award\"><\/i> Origine France Garantie<\/span>\r\n          <span class=\"chip\"><i class=\"fas fa-crown\"><\/i> \u00c9dition 3.0<\/span>\r\n        <\/div>\r\n      <\/div>\r\n    <\/section>\r\n\r\n    <!-- ================= BREADCRUMB ================= -->\r\n    <nav class=\"brand-breadcrumb\" aria-label=\"Fil d'Ariane\">\r\n      <div class=\"container\">\r\n        <a href=\"#\">Accueil<\/a>\r\n        <i class=\"fas fa-chevron-right\"><\/i>\r\n        <a href=\"https:\/\/wonderlookstore.com\/?page_id=3505\">Montures de Cr\u00e9ateurs<\/a>\r\n        <i class=\"fas fa-chevron-right\"><\/i>\r\n        <span class=\"current\">Face \u00e0 Face Paris<\/span>\r\n      <\/div>\r\n    <\/nav>\r\n\r\n    <!-- ================= PRODUITS ================= -->\r\n    <section class=\"brand-products-section\">\r\n      <div class=\"container\">\r\n        <div class=\"brand-products-header\">\r\n          <span class=\"section-tag\"><i class=\"fas fa-star\"><\/i> Collection FACE A FACE<\/span>\r\n          <h2>Nos <em>montures<\/em> FACE A FACE<\/h2>\r\n          <p>D\u00e9couvrez la s\u00e9lection exclusive des cr\u00e9ations parisiennes les plus audacieuses \u2014 o\u00f9 chaque monture est une \u0153uvre d'art \u00e0 porter.<\/p>\r\n        <\/div>\r\n\r\n        <div class=\"woow-products-wrapper\">\r\n          <?php echo do_shortcode('[products category=\"face-a-face-paris\" limit=\"12\" columns=\"4\" paginate=\"true\"]'); ?>\r\n        <\/div>\r\n      <\/div>\r\n    <\/section>\r\n\r\n    <!-- ================= R\u00c9ASSURANCE ================= -->\r\n    <section class=\"brand-reassurance\">\r\n      <div class=\"container\">\r\n        <div class=\"brand-reassurance-grid\">\r\n          <div class=\"brand-reassurance-item\"><div class=\"icon\"><i class=\"fas fa-truck-fast\"><\/i><\/div><h4>Livraison 24\/48h<\/h4><p>Exp\u00e9dition rapide partout au Maroc<\/p><\/div>\r\n          <div class=\"brand-reassurance-item\"><div class=\"icon\"><i class=\"fas fa-hand-holding-dollar\"><\/i><\/div><h4>Paiement \u00e0 la livraison<\/h4><p>Esp\u00e8ces ou carte sur TPE<\/p><\/div>\r\n          <div class=\"brand-reassurance-item\"><div class=\"icon\"><i class=\"fas fa-certificate\"><\/i><\/div><h4>100% Original<\/h4><p>\u00c9tui &amp; certificat de conformit\u00e9<\/p><\/div>\r\n          <div class=\"brand-reassurance-item\"><div class=\"icon\"><i class=\"fas fa-screwdriver-wrench\"><\/i><\/div><h4>Ajustement \u00e0 vie<\/h4><p>R\u00e9glage &amp; entretien offerts<\/p><\/div>\r\n        <\/div>\r\n      <\/div>\r\n    <\/section>\r\n\r\n    <!-- ================= CTA ================= -->\r\n    <section class=\"brand-cta\">\r\n      <div class=\"container\">\r\n        <h3>Besoin d'un <em>conseil personnalis\u00e9<\/em> ?<\/h3>\r\n        <p>Nos experts en visagisme vous accompagnent pour choisir la monture Face \u00e0 Face parfaite adapt\u00e9e \u00e0 votre style et votre morphologie.<\/p>\r\n        <div class=\"cta-btns\">\r\n          <a href=\"https:\/\/wonderlookstore.com\/?page_id=3472\" class=\"btn-gold\"><i class=\"fas fa-wand-magic-sparkles\"><\/i> Conseil Visagisme<\/a>\r\n          <a href=\"https:\/\/wa.me\/212660462426?text=Bonjour%20Wonder%20Look,%20je%20souhaite%20des%20informations%20sur%20les%20montures%20Face%20%C3%A0%20Face%20Paris\" target=\"_blank\" rel=\"noopener\" class=\"btn-glass\"><i class=\"fab fa-whatsapp\"><\/i> Contacter via WhatsApp<\/a>\r\n        <\/div>\r\n      <\/div>\r\n    <\/section>\r\n  <\/main>\r\n\r\n  <!-- ================= FOOTER ================= -->\r\n  <footer class=\"footer\" id=\"contact\">\r\n    <div class=\"container\">\r\n      <div class=\"footer-grid\">\r\n        <div class=\"footer-brand\">\r\n          <div class=\"logo-title\">Wonder<span>Look<\/span><\/div>\r\n          <p>Maison d'optique haut de gamme. Nous combinons l'artisanat scandinave, la finesse londonienne et l'accueil marocain pour magnifier votre vue.<\/p>\r\n        <\/div>\r\n        <div class=\"footer-col\">\r\n          <h5>Nos Marques<\/h5>\r\n          <ul class=\"footer-links\">\r\n            <li><a href=\"#\">WOOW<\/a><\/li>\r\n            <li><a href=\"#\">FACE \u00c0 FACE Paris<\/a><\/li>\r\n            <li><a href=\"#\">NIFTIES<\/a><\/li>\r\n            <li><a href=\"#\">CHARLES STONE New York<\/a><\/li>\r\n            <li><a href=\"#\">INFACE<\/a><\/li>\r\n            <li><a href=\"#\">WILLIAM MORRIS London<\/a><\/li>\r\n            <li><a href=\"#\">PRODESIGN Denmark<\/a><\/li>\r\n            <li><a href=\"#\">BELVA<\/a><\/li>\r\n            <li><a href=\"#\">FRESHVUE Lens<\/a><\/li>\r\n            <li><a href=\"#\">KILSGAARD<\/a><\/li>\r\n          <\/ul>\r\n        <\/div>\r\n        <div class=\"footer-col\">\r\n          <h5>Pages Utilitaires<\/h5>\r\n          <ul class=\"footer-links\">\r\n            <li><a href=\"https:\/\/wonderlookstore.com\/?page_id=3\">Politique de confidentialit\u00e9<\/a><\/li>\r\n            <li><a href=\"https:\/\/wonderlookstore.com\/?page_id=3127\">\u00c0 propos<\/a><\/li>\r\n            <li><a href=\"https:\/\/wonderlookstore.com\/?page_id=3472\">Contactez-nous<\/a><\/li>\r\n            <li><a href=\"https:\/\/wonderlookstore.com\/?page_id=3474\">Conditions d'utilisation<\/a><\/li>\r\n          <\/ul>\r\n        <\/div>\r\n        <div class=\"footer-col\">\r\n          <h5>Boutiques au Maroc<\/h5>\r\n          <p style=\"margin-bottom:10px;\"><i class=\"fas fa-location-dot\" style=\"color:var(--color-gold);\"><\/i> Angle Bd d'Anfa &amp; Rue Jean Jaur\u00e8s, Fez<\/p>\r\n          <p><i class=\"fas fa-phone\" style=\"color:var(--color-gold);\"><\/i> 05 22 12 34 56<\/p>\r\n        <\/div>\r\n      <\/div>\r\n      <div class=\"footer-bottom\">\r\n        <span>&copy; 2026 Wonder Look Maroc. Soci\u00e9t\u00e9 de Lunetterie et d'Optique. Tous droits r\u00e9serv\u00e9s.<\/span>\r\n        <div style=\"display:flex; gap:16px; align-items:center;\">\r\n          <span><i class=\"fab fa-cc-visa\"><\/i> Visa<\/span>\r\n          <span><i class=\"fab fa-cc-mastercard\"><\/i> Mastercard<\/span>\r\n          <span><i class=\"fas fa-money-bill-1\"><\/i> Cash \u00e0 la livraison<\/span>\r\n        <\/div>\r\n      <\/div>\r\n    <\/div>\r\n  <\/footer>\r\n<\/div>\r\n\r\n<script>\r\n  (function() {\r\n    const openBtn = document.getElementById('open-menu-btn');\r\n    const closeBtn = document.getElementById('close-menu-btn');\r\n    const overlay = document.getElementById('mobile-overlay');\r\n    function toggleMobile(open) {\r\n      if (open) { overlay.classList.add('open'); document.body.style.overflow = 'hidden'; }\r\n      else { overlay.classList.remove('open'); document.body.style.overflow = ''; }\r\n    }\r\n    if (openBtn) openBtn.addEventListener('click', function(e) { e.stopPropagation(); toggleMobile(true); });\r\n    if (closeBtn) closeBtn.addEventListener('click', function() { toggleMobile(false); });\r\n    if (overlay) overlay.addEventListener('click', function(e) { if (e.target === overlay) toggleMobile(false); });\r\n    const brandToggle = document.getElementById('mobile-brands-toggle');\r\n    const brandList = document.getElementById('mobile-brands-list');\r\n    if (brandToggle && brandList) {\r\n      brandToggle.addEventListener('click', function() {\r\n        brandList.classList.toggle('show');\r\n        this.classList.toggle('active');\r\n      });\r\n    }\r\n    const header = document.getElementById('main-header');\r\n    if (header) {\r\n      window.addEventListener('scroll', function() {\r\n        if (window.scrollY > 30) header.classList.add('scrolled');\r\n        else header.classList.remove('scrolled');\r\n      });\r\n    }\r\n    const cartCount = document.getElementById('cart-count');\r\n    if (cartCount) cartCount.textContent = '0';\r\n  })();\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Livraison Gratuite d\u00e8s 600 DH partout au Maroc Conseil Visagisme &amp; Morphologie Personnalis\u00e9 Fez : 05 22 12 34 56 Paiement \u00e0 la livraison (Cash \/ TPE) OPTICAL &amp; SUNGLASSES MAISON D&rsquo;OPTIQUE &ndash; MAROC Accueil Montures de Cr\u00e9ateurs Collections Internationales &amp; Exclusives Voir tout le catalogue &rarr; WOOW Designs cr\u00e9atifs, color\u00e9s et audacieux FACE \u00c0 [&hellip;]<\/p>\n","protected":false},"author":0,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_canvas","meta":{"footnotes":""},"class_list":["post-3543","page","type-page","status-publish","hentry"],"blocksy_meta":{"styles_descriptor":{"styles":{"desktop":"","tablet":"","mobile":""},"google_fonts":[],"version":8}},"_links":{"self":[{"href":"https:\/\/wonderlookstore.com\/index.php?rest_route=\/wp\/v2\/pages\/3543","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wonderlookstore.com\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/wonderlookstore.com\/index.php?rest_route=\/wp\/v2\/types\/page"}],"replies":[{"embeddable":true,"href":"https:\/\/wonderlookstore.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=3543"}],"version-history":[{"count":5,"href":"https:\/\/wonderlookstore.com\/index.php?rest_route=\/wp\/v2\/pages\/3543\/revisions"}],"predecessor-version":[{"id":3594,"href":"https:\/\/wonderlookstore.com\/index.php?rest_route=\/wp\/v2\/pages\/3543\/revisions\/3594"}],"wp:attachment":[{"href":"https:\/\/wonderlookstore.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=3543"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}