.elementor-272 .elementor-element.elementor-element-5f5d806{--display:flex;--min-height:100px;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:center;--margin-top:0px;--margin-bottom:-100px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;--z-index:5;}.elementor-272 .elementor-element.elementor-element-8173f00{--display:flex;--justify-content:center;}.elementor-widget-image .widget-image-caption{color:var( --e-global-color-text );font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );line-height:var( --e-global-typography-text-line-height );}.elementor-272 .elementor-element.elementor-element-49a14dc{--display:flex;--justify-content:center;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-272 .elementor-element.elementor-element-d429dee .elementskit-menu-container{height:80px;max-width:100%;border-radius:0px 0px 0px 0px;}.elementor-272 .elementor-element.elementor-element-d429dee .elementskit-navbar-nav > li > a{font-family:"Montserrat", Sans-serif;font-weight:500;color:#FFFFFF;padding:0px 15px 0px 15px;}.elementor-272 .elementor-element.elementor-element-d429dee .elementskit-navbar-nav > li > a:hover{color:#707070;}.elementor-272 .elementor-element.elementor-element-d429dee .elementskit-navbar-nav > li > a:focus{color:#707070;}.elementor-272 .elementor-element.elementor-element-d429dee .elementskit-navbar-nav > li > a:active{color:#707070;}.elementor-272 .elementor-element.elementor-element-d429dee .elementskit-navbar-nav > li:hover > a{color:#707070;}.elementor-272 .elementor-element.elementor-element-d429dee .elementskit-navbar-nav > li:hover > a .elementskit-submenu-indicator{color:#707070;}.elementor-272 .elementor-element.elementor-element-d429dee .elementskit-navbar-nav > li > a:hover .elementskit-submenu-indicator{color:#707070;}.elementor-272 .elementor-element.elementor-element-d429dee .elementskit-navbar-nav > li > a:focus .elementskit-submenu-indicator{color:#707070;}.elementor-272 .elementor-element.elementor-element-d429dee .elementskit-navbar-nav > li > a:active .elementskit-submenu-indicator{color:#707070;}.elementor-272 .elementor-element.elementor-element-d429dee .elementskit-navbar-nav > li.current-menu-item > a{color:#FFFFFF;border-style:solid;border-width:0px 0px 1px 0px;}.elementor-272 .elementor-element.elementor-element-d429dee .elementskit-navbar-nav > li.current-menu-ancestor > a{color:#FFFFFF;}.elementor-272 .elementor-element.elementor-element-d429dee .elementskit-navbar-nav > li.current-menu-ancestor > a .elementskit-submenu-indicator{color:#FFFFFF;}.elementor-272 .elementor-element.elementor-element-d429dee .elementskit-navbar-nav > li > a .elementskit-submenu-indicator{color:#FFFFFF;fill:#FFFFFF;}.elementor-272 .elementor-element.elementor-element-d429dee .elementskit-navbar-nav > li > a .ekit-submenu-indicator-icon{color:#FFFFFF;fill:#FFFFFF;}.elementor-272 .elementor-element.elementor-element-d429dee .elementskit-navbar-nav .elementskit-submenu-panel > li > a{font-family:"Montserrat", Sans-serif;font-weight:400;padding:15px 15px 15px 15px;color:#000000;}.elementor-272 .elementor-element.elementor-element-d429dee .elementskit-navbar-nav .elementskit-submenu-panel > li > a:hover{color:#707070;}.elementor-272 .elementor-element.elementor-element-d429dee .elementskit-navbar-nav .elementskit-submenu-panel > li > a:focus{color:#707070;}.elementor-272 .elementor-element.elementor-element-d429dee .elementskit-navbar-nav .elementskit-submenu-panel > li > a:active{color:#707070;}.elementor-272 .elementor-element.elementor-element-d429dee .elementskit-navbar-nav .elementskit-submenu-panel > li:hover > a{color:#707070;}.elementor-272 .elementor-element.elementor-element-d429dee .elementskit-navbar-nav .elementskit-submenu-panel > li.current-menu-item > a{color:#707070 !important;}.elementor-272 .elementor-element.elementor-element-d429dee .elementskit-submenu-panel{padding:15px 0px 15px 0px;}.elementor-272 .elementor-element.elementor-element-d429dee .elementskit-navbar-nav .elementskit-submenu-panel{border-radius:0px 0px 0px 0px;min-width:220px;}.elementor-272 .elementor-element.elementor-element-d429dee button.elementskit-menu-hamburger{float:right;}.elementor-272 .elementor-element.elementor-element-d429dee button.elementskit-menu-hamburger .elementskit-menu-hamburger-icon{background-color:rgba(0, 0, 0, 0.5);}.elementor-272 .elementor-element.elementor-element-d429dee button.elementskit-menu-hamburger > .ekit-menu-icon{color:rgba(0, 0, 0, 0.5);}.elementor-272 .elementor-element.elementor-element-d429dee button.elementskit-menu-hamburger:hover .elementskit-menu-hamburger-icon{background-color:rgba(0, 0, 0, 0.5);}.elementor-272 .elementor-element.elementor-element-d429dee button.elementskit-menu-hamburger:hover > .ekit-menu-icon{color:rgba(0, 0, 0, 0.5);}.elementor-272 .elementor-element.elementor-element-d429dee button.elementskit-menu-close{color:rgba(51, 51, 51, 1);}.elementor-272 .elementor-element.elementor-element-d429dee button.elementskit-menu-close:hover{color:rgba(0, 0, 0, 0.5);}.elementor-272 .elementor-element.elementor-element-e9ed953{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:flex-end;--align-items:center;}.elementor-widget-button .elementor-button{background-color:var( --e-global-color-accent );font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-size:var( --e-global-typography-accent-font-size );font-weight:var( --e-global-typography-accent-font-weight );text-transform:var( --e-global-typography-accent-text-transform );letter-spacing:var( --e-global-typography-accent-letter-spacing );}.elementor-272 .elementor-element.elementor-element-d7c7a01{width:auto;max-width:auto;}:root{--page-title-display:none;}@media(min-width:768px){.elementor-272 .elementor-element.elementor-element-5f5d806{--content-width:1440px;}.elementor-272 .elementor-element.elementor-element-8173f00{--width:23%;}.elementor-272 .elementor-element.elementor-element-e9ed953{--width:10%;}}@media(max-width:1024px){.elementor-widget-image .widget-image-caption{line-height:var( --e-global-typography-text-line-height );}.elementor-272 .elementor-element.elementor-element-d429dee .elementskit-nav-identity-panel{padding:10px 0px 10px 0px;}.elementor-272 .elementor-element.elementor-element-d429dee .elementskit-menu-container{max-width:350%;border-radius:0px 0px 0px 0px;}.elementor-272 .elementor-element.elementor-element-d429dee .elementskit-navbar-nav > li > a{color:#000000;padding:10px 15px 10px 15px;}.elementor-272 .elementor-element.elementor-element-d429dee .elementskit-navbar-nav .elementskit-submenu-panel > li > a{padding:15px 15px 15px 15px;}.elementor-272 .elementor-element.elementor-element-d429dee .elementskit-navbar-nav .elementskit-submenu-panel{border-radius:0px 0px 0px 0px;}.elementor-272 .elementor-element.elementor-element-d429dee button.elementskit-menu-hamburger{padding:8px 8px 8px 8px;width:45px;border-radius:3px;}.elementor-272 .elementor-element.elementor-element-d429dee button.elementskit-menu-close{padding:8px 8px 8px 8px;margin:12px 12px 12px 12px;width:45px;border-radius:3px;}.elementor-272 .elementor-element.elementor-element-d429dee .elementskit-nav-logo > img{max-width:160px;max-height:60px;}.elementor-272 .elementor-element.elementor-element-d429dee .elementskit-nav-logo{margin:5px 0px 5px 0px;padding:5px 5px 5px 5px;}.elementor-widget-button .elementor-button{font-size:var( --e-global-typography-accent-font-size );letter-spacing:var( --e-global-typography-accent-letter-spacing );}}@media(max-width:767px){.elementor-widget-image .widget-image-caption{line-height:var( --e-global-typography-text-line-height );}.elementor-272 .elementor-element.elementor-element-d429dee .elementskit-nav-logo > img{max-width:120px;max-height:50px;}.elementor-widget-button .elementor-button{font-size:var( --e-global-typography-accent-font-size );letter-spacing:var( --e-global-typography-accent-letter-spacing );}}/* Start custom CSS *//* ===================================================================== DÉTENTE — HEADER v2 · "quiet editorial frame" Scope: header template 272 only. Root = .ekit-template-content-header States (set by the header script): .dt-fixed / .dt-static, .dt-scrolled, .dt-hidden, .dt-light. Mega-menu open is detected with :has(). ===================================================================== */ /* ---------- 0 · Tokens + frame ------------------------------------- */ .ekit-template-content-header{ --dt-hh:96px; --dt-logo:188px; --dt-pad:60px; --dt-ink:#FFF9EF; --dt-line:rgba(255,249,239,.22); --dt-accent:#C9B08A; --dt-ease:cubic-bezier(.22,1,.36,1); position:absolute; top:var(--wp-admin--admin-bar--height,0px); left:0; right:0; z-index:100; isolation:isolate; transition:top .5s var(--dt-ease); } .ekit-template-content-header.dt-fixed{position:fixed;} .ekit-template-content-header.dt-fixed.dt-hidden{top:calc(-1 * var(--dt-hh) - 8px);} /* Solid (ivory) state: after scrolling, or while the mega menu is open */ .ekit-template-content-header.dt-scrolled{--dt-hh:76px; --dt-logo:156px;} .ekit-template-content-header.dt-scrolled, .ekit-template-content-header.dt-light{--dt-ink:#153630; --dt-line:rgba(21,54,48,.12); --dt-accent:#A88A5C;} /* Layer 1 — ivory glass (behind everything, pseudo so fixed children are unaffected) */ .ekit-template-content-header::before{ content:''; position:absolute; inset:0; z-index:-1; pointer-events:none; background:rgba(255,249,239,.93); -webkit-backdrop-filter:blur(18px) saturate(140%); backdrop-filter:blur(18px) saturate(140%); box-shadow:0 1px 0 rgba(21,54,48,.07), 0 18px 40px -30px rgba(21,54,48,.35); opacity:0; transition:opacity .5s var(--dt-ease); } .ekit-template-content-header.dt-scrolled::before{opacity:1;} /* Layer 2 — soft top scrim so ivory type stays legible on light photography */ .ekit-template-content-header::after{ content:''; position:absolute; left:0; right:0; top:0; height:170%; z-index:-2; pointer-events:none; background:linear-gradient(180deg,rgba(12,30,26,.36) 0%,rgba(12,30,26,.14) 55%,rgba(12,30,26,0) 100%); transition:opacity .5s var(--dt-ease); } .ekit-template-content-header.dt-scrolled::after, .ekit-template-content-header.dt-light::after{opacity:0;} /* Header row */ .ekit-template-content-header .elementor-element.elementor-element-5f5d806{ --min-height:var(--dt-hh)!important; --margin-bottom:0px!important; --padding-left:var(--dt-pad)!important; --padding-right:var(--dt-pad)!important; --flex-wrap:nowrap!important; --align-items:center!important; --gap:0px!important; background:transparent!important; transition:min-height .5s var(--dt-ease); } .ekit-template-content-header .elementor-element-5f5d806 > .e-con-inner{ position:relative; flex-wrap:nowrap!important; align-items:center!important; gap:0!important; } /* Editorial hairline under the bar, drawn on the content width */ .ekit-template-content-header .elementor-element-5f5d806 > .e-con-inner::after{ content:''; position:absolute; left:0; right:0; bottom:0; height:1px; background:var(--dt-line); transition:background-color .5s var(--dt-ease), opacity .5s; } .ekit-template-content-header.dt-scrolled .elementor-element-5f5d806 > .e-con-inner::after{opacity:0;} /* ---------- 1 · Logo (brand anchor) -------------------------------- */ .ekit-template-content-header .elementor-element.elementor-element-8173f00{ --width:auto!important; flex:1 1 0!important; min-width:0; --justify-content:center; --padding-left:0px; --padding-right:0px; } .ekit-template-content-header .elementor-element-60f4b0a{width:var(--dt-logo)!important; max-width:none!important; transition:width .5s var(--dt-ease);} .ekit-template-content-header .elementor-element-60f4b0a a{ display:block; line-height:0; border-radius:2px; background-color:var(--dt-ink); -webkit-mask:url('/wp-content/uploads/2026/09/detante-logo-white.png') center/100% 100% no-repeat; mask:url('/wp-content/uploads/2026/09/detante-logo-white.png') center/100% 100% no-repeat; transition:background-color .5s var(--dt-ease); } .ekit-template-content-header .elementor-element-60f4b0a img{ width:100%!important; max-width:100%!important; height:auto!important; opacity:0; display:block; } .ekit-template-content-header .elementor-element-60f4b0a a:focus-visible{outline:2px solid var(--dt-accent); outline-offset:6px;} /* ---------- 2 · Right column: booking CTA -------------------------- */ .ekit-template-content-header .elementor-element.elementor-element-e9ed953{ --width:auto!important; flex:1 1 0!important; min-width:0; --flex-direction:row!important; --justify-content:flex-end!important; --align-items:center!important; --padding-left:0px; --padding-right:0px; --gap:0px; } .ekit-template-content-header .dt-hdr-js{display:none!important;} .ekit-template-content-header .dt-hdr-cta{width:auto!important; margin:0!important;} .ekit-template-content-header .dt-hdr-cta .elementor-button{ display:inline-flex; align-items:center; justify-content:center; gap:0; height:44px; padding:0 24px!important; border-radius:0!important; font-family:'Jost',sans-serif!important; font-size:12px!important; font-weight:500!important; letter-spacing:.16em!important; text-transform:uppercase!important; line-height:1!important; white-space:nowrap; color:var(--dt-ink)!important; background:transparent!important; border:1px solid var(--dt-line)!important; border-color:color-mix(in srgb,var(--dt-ink) 55%,transparent)!important; box-shadow:none!important; transition:background-color .45s var(--dt-ease), color .45s var(--dt-ease), border-color .45s var(--dt-ease); } .ekit-template-content-header .dt-hdr-cta .elementor-button:hover, .ekit-template-content-header .dt-hdr-cta .elementor-button:focus-visible{ background:#FFF9EF!important; color:#153630!important; border-color:#FFF9EF!important; } /* On ivory the CTA becomes the one solid element of the bar */ .ekit-template-content-header.dt-scrolled .dt-hdr-cta .elementor-button, .ekit-template-content-header.dt-light .dt-hdr-cta .elementor-button{background:#153630!important; color:#FFF9EF!important; border-color:#153630!important;} .ekit-template-content-header.dt-scrolled .dt-hdr-cta .elementor-button:hover, .ekit-template-content-header.dt-light .dt-hdr-cta .elementor-button:hover, .ekit-template-content-header.dt-scrolled .dt-hdr-cta .elementor-button:focus-visible, .ekit-template-content-header.dt-light .dt-hdr-cta .elementor-button:focus-visible{background:#1F4A42!important; border-color:#1F4A42!important; color:#FFF9EF!important;} .ekit-template-content-header .dt-hdr-cta .elementor-button:focus-visible{outline:2px solid var(--dt-accent); outline-offset:3px;} .ekit-template-content-header .dt-hdr-cta .elementor-button-text{display:inline-flex; gap:.5em;} /* Columns carry no default container padding (keeps the bar exactly --dt-hh tall) */ .ekit-template-content-header .elementor-element.elementor-element-8173f00, .ekit-template-content-header .elementor-element.elementor-element-49a14dc, .ekit-template-content-header .elementor-element.elementor-element-e9ed953{--padding-top:0px!important; --padding-bottom:0px!important;} /* ---------- 3 · Desktop navigation (≥1025) ------------------------- */ @media (min-width:1025px){ .ekit-template-content-header .dt-panel-foot{display:none!important;} .ekit-template-content-header .elementor-element.elementor-element-49a14dc{--width:auto!important; flex:0 0 auto!important;} .ekit-template-content-header .elementor-element-d429dee .elementskit-menu-container{height:var(--dt-hh)!important; background:transparent!important; transition:height .5s var(--dt-ease);} .ekit-template-content-header .elementor-element-d429dee .elementskit-navbar-nav > li > a{ position:relative; height:100%; font-family:'Montserrat',sans-serif!important; font-size:14px!important; font-weight:500!important; letter-spacing:.02em!important; line-height:1!important; text-transform:none!important; padding:0 19px!important; color:var(--dt-ink)!important; border:0!important; transition:color .5s var(--dt-ease), opacity .3s; } /* Quiet the siblings while one item is pointed at */ .ekit-template-content-header .elementor-element-d429dee .elementskit-navbar-nav:hover > li:not(:hover) > a{opacity:.62;} /* Gold hairline: grows on hover, sits under the current section */ .ekit-template-content-header .elementor-element-d429dee .elementskit-navbar-nav > li > a::after{ content:''; position:absolute; left:19px; right:19px; top:calc(50% + 14px); height:1px; background:var(--dt-accent); transform:scaleX(0); transform-origin:left center; transition:transform .6s var(--dt-ease), background-color .5s; } .ekit-template-content-header .elementor-element-d429dee .elementskit-navbar-nav > li > a.ekit-menu-dropdown-toggle::after{right:35px;} .ekit-template-content-header .elementor-element-d429dee .elementskit-navbar-nav > li:hover > a::after, .ekit-template-content-header .elementor-element-d429dee .elementskit-navbar-nav > li > a:focus-visible::after, .ekit-template-content-header .elementor-element-d429dee .elementskit-navbar-nav > li.current-menu-item > a::after, .ekit-template-content-header .elementor-element-d429dee .elementskit-navbar-nav > li.current-menu-ancestor > a::after{transform:scaleX(1);} .ekit-template-content-header .elementor-element-d429dee .elementskit-navbar-nav > li > a:focus-visible{outline:none;} .ekit-template-content-header .elementor-element-d429dee .elementskit-navbar-nav > li > a:focus-visible::before{ content:''; position:absolute; inset:calc(50% - 18px) 8px; border:1px solid var(--dt-accent); } /* Chevron */ .ekit-template-content-header .elementor-element-d429dee .elementskit-navbar-nav > li > a .elementskit-submenu-indicator{ width:9px!important; height:9px!important; margin-left:8px!important; margin-top:1px; fill:var(--dt-ink)!important; color:var(--dt-ink)!important; transition:transform .5s var(--dt-ease), fill .5s; } .ekit-template-content-header .elementor-element-d429dee .elementskit-navbar-nav > li:hover > a .elementskit-submenu-indicator{transform:rotate(180deg);} /* Mega menu open: the bar keeps its own state; the glass panel floats beneath it */ /* Mega menu — a contained Liquid Glass panel floating under the navigation (max 1200px, centred on the nav). Material, from back to front: 1 · backdrop: strong blur + saturation; contrast softened and lifted so dark photography still reads as light behind the text 2 · body: a thin warm-ivory tint (not an opaque sheet) 3 · light in the material: specular gloss top-left, a faint diagonal streak, a warm pool low right, a forest pool low left, fine grain (background layers) 4 · thickness: bright top rim, soft lensing light along every edge, darker lower inner edge (inset shadows) 5 · luminous edge: gradient ring, brightest top-left, fading around the sides (::after) 6 · depth: contact line + three soft shadows (outer shadows) */ .ekit-template-content-header{--dt-mega-w:min(1200px, calc(100vw - 2 * var(--dt-pad)));} .ekit-template-content-header .elementskit-megamenu-panel{ top:calc(var(--dt-hh) + 12px)!important; margin-top:0!important; left:calc(50% - var(--dt-mega-w) / 2)!important; right:auto!important; width:var(--dt-mega-w)!important; max-width:none!important; border:0!important; border-radius:18px; overflow:hidden; background: radial-gradient(75% 55% at 10% -8%,rgba(255,255,255,.42),rgba(255,255,255,0) 62%), linear-gradient(112deg,rgba(255,255,255,0) 20%,rgba(255,255,255,.12) 27%,rgba(255,255,255,0) 34%), radial-gradient(65% 85% at 102% 108%,rgba(201,176,138,.16),rgba(201,176,138,0) 60%), radial-gradient(55% 80% at -4% 104%,rgba(21,54,48,.14),rgba(21,54,48,0) 60%), url("data:image/svg+xml;utf8,"), linear-gradient(180deg,rgba(252,248,240,.64) 0%,rgba(246,241,231,.6) 100%)!important; -webkit-backdrop-filter:blur(30px) saturate(175%) contrast(.72) brightness(1.3); backdrop-filter:blur(30px) saturate(175%) contrast(.72) brightness(1.3); box-shadow: inset 0 1px .5px rgba(255,255,255,.9), inset 0 -1px .5px rgba(255,255,255,.28), inset 0 0 0 1px rgba(255,255,255,.1), inset 0 0 26px rgba(255,255,255,.22), inset 0 22px 34px -28px rgba(255,255,255,.7), inset 0 -28px 44px -34px rgba(21,54,48,.3), 0 0 0 .5px rgba(21,54,48,.12), 0 2px 6px rgba(12,30,26,.1), 0 20px 40px -16px rgba(12,30,26,.34), 0 56px 100px -36px rgba(12,30,26,.5)!important; } .ekit-template-content-header .elementskit-megamenu-panel::after{ content:''; position:absolute; inset:0; z-index:3; border-radius:inherit; pointer-events:none; padding:1.5px; background:linear-gradient(165deg,rgba(255,255,255,1) 0%,rgba(255,255,255,.5) 18%,rgba(255,255,255,.06) 46%,rgba(255,255,255,.14) 74%,rgba(255,255,255,.55) 100%); -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0); -webkit-mask-composite:xor; mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0); mask-composite:exclude; } /* invisible bridge over the 12px gap (on the menu item, because the panel clips its own edges) */ .ekit-template-content-header .elementor-element-d429dee .elementskit-navbar-nav > li.elementskit-megamenu-has:hover::after{ content:''; position:absolute; left:0; right:0; top:100%; height:16px; } /* content: the frame fills the panel; the four categories share its width on a grid (never wider than the panel) */ .ekit-template-content-header .elementor-392 .e-5a9a9f3-bfe7{--muted-foreground:#34433E; min-width:0!important; width:100%!important; max-width:none!important; box-sizing:border-box; padding-left:52px!important; padding-right:52px!important;} .ekit-template-content-header .elementor-392 .e-f052543-7caf{ display:grid!important; grid-template-columns:minmax(0,1.75fr) minmax(0,1fr) minmax(0,.7fr) minmax(0,1.15fr); column-gap:clamp(24px,3vw,44px)!important; row-gap:0!important; min-width:0!important; flex:1 1 auto!important; } .ekit-template-content-header .elementor-392 .e-f052543-7caf > *{min-width:0!important; width:auto!important;} /* compact desktop (1025–1199): the decorative brand pane steps aside so the four categories keep their room */ @media (max-width:1199px){ .ekit-template-content-header .elementor-392 .e-2f252e-9629{display:none!important;} .ekit-template-content-header .elementor-392 .e-5a9a9f3-bfe7{padding-left:36px!important; padding-right:36px!important;} } /* end mega panel */ /* Dim the page under the open sheet (pointer-transparent) */ body:has(.ekit-template-content-header .elementskit-megamenu-has:is(:hover,:focus-within))::after{ content:''; position:fixed; inset:0; z-index:99; pointer-events:none; background:rgba(21,54,48,.1); animation:dtDim .5s var(--dt-ease) both; } @keyframes dtDim{from{opacity:0}to{opacity:1}} } /* Laptop: same 40px gutter as the page sections */ @media (min-width:1025px) and (max-width:1366px){ .ekit-template-content-header{--dt-pad:40px;} } /* Compact desktop (1025–1279): keep everything on one calm line */ @media (min-width:1025px) and (max-width:1279px){ .ekit-template-content-header{--dt-pad:40px; --dt-logo:156px;} .ekit-template-content-header.dt-scrolled{--dt-logo:140px;} .ekit-template-content-header .elementor-element-d429dee .elementskit-navbar-nav > li > a{padding:0 12px!important; font-size:13.5px!important; letter-spacing:.01em!important;} .ekit-template-content-header .elementor-element-d429dee .elementskit-navbar-nav > li > a::after{left:12px; right:12px;} .ekit-template-content-header .elementor-element-d429dee .elementskit-navbar-nav > li > a.ekit-menu-dropdown-toggle::after{right:28px;} .ekit-template-content-header .dt-hdr-cta .elementor-button{padding:0 18px!important;} .ekit-template-content-header .dt-hdr-cta .dt-l{display:none;} } /* ---------- 4 · Tablet + mobile bar (≤1024) ------------------------ */ @media (max-width:1024px){ .ekit-template-content-header{--dt-hh:84px; --dt-logo:150px; --dt-pad:32px;} .ekit-template-content-header.dt-scrolled{--dt-hh:68px; --dt-logo:132px;} .ekit-template-content-header .elementor-element.elementor-element-8173f00{order:1;} .ekit-template-content-header .elementor-element.elementor-element-e9ed953{order:2; flex:0 0 auto!important;} .ekit-template-content-header .elementor-element.elementor-element-49a14dc{order:3; --width:auto!important; flex:0 0 auto!important; margin-left:14px;} .ekit-template-content-header .elementor-element.elementor-element-d429dee{width:auto!important; margin-left:auto;} .ekit-template-content-header .dt-hdr-cta .elementor-button{height:40px; padding:0 18px!important; font-size:11.5px!important;} .ekit-template-content-header .dt-hdr-cta .dt-l{display:none;} /* Hamburger: two fine asymmetric lines, 44px target, no box */ .ekit-template-content-header button.elementskit-menu-hamburger, .ekit-template-content-header button.elementskit-menu-hamburger:hover, .ekit-template-content-header button.elementskit-menu-hamburger:focus, .ekit-template-content-header button.elementskit-menu-hamburger:active{ width:44px!important; height:44px!important; padding:0!important; margin:0!important; float:none!important; display:flex!important; flex-direction:column; align-items:flex-end; justify-content:center; gap:7px; border:0!important; border-radius:0!important; background:transparent!important; box-shadow:none!important; } .ekit-template-content-header button.elementskit-menu-hamburger .elementskit-menu-hamburger-icon{ display:block; width:26px!important; height:1.5px!important; margin:0!important; border-radius:0; background-color:var(--dt-ink)!important; opacity:1!important; transition:width .45s var(--dt-ease), background-color .5s; } .ekit-template-content-header button.elementskit-menu-hamburger .elementskit-menu-hamburger-icon:nth-child(2){display:none;} .ekit-template-content-header button.elementskit-menu-hamburger .elementskit-menu-hamburger-icon:nth-child(3){width:17px!important;} .ekit-template-content-header button.elementskit-menu-hamburger:hover .elementskit-menu-hamburger-icon:nth-child(3){width:26px!important;} .ekit-template-content-header button.elementskit-menu-hamburger:focus-visible{outline:2px solid var(--dt-accent)!important; outline-offset:2px;} } @media (max-width:767px){ .ekit-template-content-header{--dt-hh:72px; --dt-logo:132px; --dt-pad:20px;} .ekit-template-content-header.dt-scrolled{--dt-hh:62px; --dt-logo:118px;} /* keeps the earlier one-row fix: logo left, menu right, no wrapping, CTA lives in the panel */ .ekit-template-content-header .elementor-element.elementor-element-e9ed953{display:none!important;} .ekit-template-content-header .elementor-element.elementor-element-8173f00 img{width:100%!important; max-width:100%!important;} .ekit-template-content-header .elementor-element.elementor-element-49a14dc{margin-left:auto; margin-right:-10px;} } /* ---------- 5 · Full-screen menu panel (≤1024) --------------------- */ @media (max-width:1024px){ .ekit-template-content-header .elementskit-menu-container.elementskit-menu-offcanvas-elements{ background:#FFF9EF!important; height:100%!important; height:100dvh!important; display:flex!important; flex-direction:column; justify-content:flex-start!important; overflow-y:auto!important; overflow-x:hidden!important; overscroll-behavior:contain; -webkit-overflow-scrolling:touch; touch-action:pan-y; /* scroll inside the panel, never the page behind */ padding:0 32px calc(28px + env(safe-area-inset-bottom))!important; transition:left .7s var(--dt-ease), visibility .7s!important; } .ekit-template-content-header .elementskit-menu-offcanvas-elements .elementskit-submenu-panel{background:#FFF9EF!important; padding:0!important; box-shadow:none!important; border:0!important;} /* Top row: green logo + fine close cross, same height as the bar */ .ekit-template-content-header .elementskit-nav-identity-panel{ display:flex!important; align-items:center; justify-content:space-between; min-height:84px; padding:0!important; margin:0 0 12px!important; border-bottom:1px solid rgba(21,54,48,.1); flex:0 0 auto; order:-1; } .ekit-template-content-header .dt-panel-logo{ display:block; width:132px; aspect-ratio:1006/306; background:#153630; -webkit-mask:url('/wp-content/uploads/2026/09/detante-logo-white.png') center/100% 100% no-repeat; mask:url('/wp-content/uploads/2026/09/detante-logo-white.png') center/100% 100% no-repeat; } .ekit-template-content-header button.elementskit-menu-close, .ekit-template-content-header button.elementskit-menu-close:hover, .ekit-template-content-header button.elementskit-menu-close:focus, .ekit-template-content-header button.elementskit-menu-close:active{ position:relative; width:44px!important; height:44px!important; margin:0 -10px 0 auto!important; padding:0!important; font-size:0!important; color:transparent!important; background:transparent!important; border:0!important; border-radius:0!important; } .ekit-template-content-header button.elementskit-menu-close::before, .ekit-template-content-header button.elementskit-menu-close::after{ content:''; position:absolute; left:11px; right:11px; top:50%; height:1.5px; background:#153630; transform:rotate(45deg); transition:transform .45s var(--dt-ease); } .ekit-template-content-header button.elementskit-menu-close::after{transform:rotate(-45deg);} .ekit-template-content-header button.elementskit-menu-close:hover::before{transform:rotate(135deg);} .ekit-template-content-header button.elementskit-menu-close:hover::after{transform:rotate(45deg);} .ekit-template-content-header button.elementskit-menu-close:focus-visible{outline:2px solid #153630!important; outline-offset:0;} /* Level 1 — editorial list (Instrument Serif, numbered like the site's sections) */ .ekit-template-content-header .elementskit-menu-offcanvas-elements .elementskit-navbar-nav{counter-reset:dtn; height:auto!important; flex:0 0 auto; width:100%!important; max-width:100%!important; margin:0!important;} .ekit-template-content-header .elementskit-menu-offcanvas-elements .elementskit-navbar-nav li, .ekit-template-content-header .elementskit-menu-offcanvas-elements .elementskit-submenu-panel{max-width:100%; box-sizing:border-box;} .ekit-template-content-header .elementskit-menu-offcanvas-elements .elementskit-navbar-nav > li{height:auto!important; border-bottom:1px solid rgba(21,54,48,.1);} .ekit-template-content-header .elementskit-menu-offcanvas-elements .elementskit-navbar-nav > li > a{ display:flex!important; align-items:center!important; justify-content:flex-start!important; height:auto!important; min-height:66px; padding:14px 0!important; border:0!important; font-family:'Instrument Serif',serif!important; font-size:30px!important; font-weight:400!important; line-height:1.1!important; letter-spacing:-.005em!important; text-transform:none!important; color:#153630!important; transition:color .35s, padding .45s var(--dt-ease); } .ekit-template-content-header .elementskit-menu-offcanvas-elements .elementskit-navbar-nav > li > a::before{ counter-increment:dtn; content:counter(dtn,decimal-leading-zero); flex:0 0 36px; align-self:center; margin-top:4px; font-family:'Instrument Serif',serif; font-style:italic; font-size:14px; letter-spacing:0; color:#86683C; } .ekit-template-content-header .elementskit-menu-offcanvas-elements .elementskit-navbar-nav > li.current-menu-item > a, .ekit-template-content-header .elementskit-menu-offcanvas-elements .elementskit-navbar-nav > li.current-menu-ancestor > a{font-style:italic!important; font-weight:400!important;} .ekit-template-content-header .elementskit-menu-offcanvas-elements .elementskit-navbar-nav > li > a:active{color:#1F4A42!important;} /* Chevron toggles — fine, borderless, 44px tap area, turn when open */ .ekit-template-content-header .elementskit-menu-offcanvas-elements .elementskit-submenu-indicator{ box-sizing:content-box!important; width:12px!important; height:12px!important; padding:16px 4px 16px 16px!important; margin:-16px 0 -16px auto!important; border:0!important; border-radius:0!important; background:transparent!important; fill:#153630!important; color:#153630!important; transition:transform .45s var(--dt-ease); } .ekit-template-content-header .elementskit-menu-offcanvas-elements li:has(> .elementskit-dropdown-open) > a > .elementskit-submenu-indicator{transform:rotate(180deg);} /* Level 2 — categories as Jost labels */ .ekit-template-content-header .elementskit-menu-offcanvas-elements .elementskit-submenu-panel{margin:0 0 12px!important;} .ekit-template-content-header .elementskit-menu-offcanvas-elements .elementskit-dropdown-open{animation:dtSub .5s var(--dt-ease) both;} .ekit-template-content-header .elementskit-menu-offcanvas-elements .elementskit-submenu-panel > li > a{ display:flex!important; align-items:center!important; min-height:48px; padding:12px 0 12px 36px!important; border:0!important; font-family:'Jost',sans-serif!important; font-size:12px!important; font-weight:500!important; line-height:1.4!important; letter-spacing:.14em!important; text-transform:uppercase!important; color:#86683C!important; } /* Level 3 — treatments */ .ekit-template-content-header .elementskit-menu-offcanvas-elements .elementskit-submenu-panel .elementskit-submenu-panel{margin:0 0 6px!important; border-left:1px solid rgba(168,138,92,.35)!important; margin-left:37px!important;} .ekit-template-content-header .elementskit-menu-offcanvas-elements .elementskit-submenu-panel .elementskit-submenu-panel > li > a{ min-height:44px; padding:10px 0 10px 18px!important; font-family:'Montserrat',sans-serif!important; font-size:15px!important; font-weight:400!important; letter-spacing:0!important; text-transform:none!important; color:#153630!important; } /* Level 4 — references */ .ekit-template-content-header .elementskit-menu-offcanvas-elements .elementskit-submenu-panel .elementskit-submenu-panel .elementskit-submenu-panel{margin-left:18px!important; border-left-color:rgba(21,54,48,.12)!important;} .ekit-template-content-header .elementskit-menu-offcanvas-elements .elementskit-submenu-panel .elementskit-submenu-panel .elementskit-submenu-panel > li > a{font-size:14px!important; color:#4A4540!important; min-height:40px; padding:8px 0 8px 16px!important;} .ekit-template-content-header .elementskit-menu-offcanvas-elements .elementskit-submenu-panel li.current-menu-item > a{color:#153630!important; font-weight:600!important;} /* Booking block pinned to the bottom of the panel */ .ekit-template-content-header .dt-panel-foot{margin-top:auto; padding-top:36px; flex:0 0 auto; order:2;} .ekit-template-content-header .dt-panel-foot small{display:block; margin-bottom:14px; font-family:'Jost',sans-serif; font-size:12px; font-weight:500; letter-spacing:.14em; text-transform:uppercase; color:#86683C;} .ekit-template-content-header .dt-panel-cta{ display:flex; align-items:center; justify-content:center; height:54px; background:#153630; color:#FFF9EF!important; font-family:'Jost',sans-serif; font-size:12.5px; font-weight:500; letter-spacing:.16em; text-transform:uppercase; text-decoration:none; transition:background-color .4s var(--dt-ease); } .ekit-template-content-header .dt-panel-cta:hover,.ekit-template-content-header .dt-panel-cta:focus-visible{background:#1F4A42;} .ekit-template-content-header .dt-panel-cta:focus-visible{outline:2px solid #153630; outline-offset:3px;} /* Reveal choreography */ .ekit-template-content-header .elementskit-menu-offcanvas-elements.active .elementskit-navbar-nav > li, .ekit-template-content-header .elementskit-menu-offcanvas-elements.active .dt-panel-foot{animation:dtItem .7s var(--dt-ease) both;} .ekit-template-content-header .elementskit-menu-offcanvas-elements.active .elementskit-navbar-nav > li:nth-child(1){animation-delay:.16s;} .ekit-template-content-header .elementskit-menu-offcanvas-elements.active .elementskit-navbar-nav > li:nth-child(2){animation-delay:.21s;} .ekit-template-content-header .elementskit-menu-offcanvas-elements.active .elementskit-navbar-nav > li:nth-child(3){animation-delay:.26s;} .ekit-template-content-header .elementskit-menu-offcanvas-elements.active .elementskit-navbar-nav > li:nth-child(4){animation-delay:.31s;} .ekit-template-content-header .elementskit-menu-offcanvas-elements.active .elementskit-navbar-nav > li:nth-child(5){animation-delay:.36s;} .ekit-template-content-header .elementskit-menu-offcanvas-elements.active .dt-panel-foot{animation-delay:.44s;} @keyframes dtItem{from{opacity:0; transform:translate3d(0,14px,0);}to{opacity:1; transform:none;}} @keyframes dtSub{from{opacity:0; transform:translate3d(0,-6px,0);}to{opacity:1; transform:none;}} } @media (max-width:767px){ .ekit-template-content-header .elementskit-menu-container.elementskit-menu-offcanvas-elements{padding-left:20px!important; padding-right:20px!important;} .ekit-template-content-header .elementskit-nav-identity-panel{min-height:72px;} .ekit-template-content-header .dt-panel-logo{width:120px;} .ekit-template-content-header .elementskit-menu-offcanvas-elements .elementskit-navbar-nav > li > a{font-size:28px!important; min-height:62px;} } /* ---------- 5b · Médecine à domicile — a distinct service, quietly marked ---------- Menu item "Médecine à domicile" carries the CSS class dt-nav-home (Appearance → Menus). Same motif as hero slide 04: a small gold dot. ANSWER TO SLIDE 04: when the hero's slide 04 becomes the active slide (Elementor adds .swiper-slide-active), the item answers once: it lights up, a warm light passes through it, the gold underline draws from left to right, the dot flares — then everything returns to normal (≈2.6 s). Replays at every new activation. */ @media (min-width:1025px){ .ekit-template-content-header .elementor-element-d429dee .elementskit-navbar-nav > li.dt-nav-home > a{ background-image: radial-gradient(closest-side,rgba(255,244,220,.34),rgba(255,244,220,0)), radial-gradient(closest-side,rgba(201,176,138,.2),rgba(201,176,138,0)); background-repeat:no-repeat,no-repeat; background-position:-80% 50%,center; background-size:38% 70%,0% 0%; transition:color .5s var(--dt-ease), opacity .3s, background-size .8s var(--dt-ease); } .ekit-template-content-header .elementor-element-d429dee .elementskit-navbar-nav > li.dt-nav-home:hover > a, .ekit-template-content-header .elementor-element-d429dee .elementskit-navbar-nav > li.dt-nav-home > a:focus-visible{background-size:38% 70%,100% 80%;} .ekit-template-content-header .elementor-element-d429dee .elementskit-navbar-nav > li.dt-nav-home > a:not(:focus-visible)::before{ content:''; display:inline-block; flex:none; width:5px; height:5px; margin-right:10px; border-radius:50%; background:var(--dt-accent); animation:dtHomeDot 4.8s ease-in-out infinite; } @keyframes dtHomeDot{0%,100%{opacity:.7; box-shadow:0 0 0 0 rgba(201,176,138,0);}50%{opacity:1; box-shadow:0 0 0 5px rgba(201,176,138,.18);}} /* answer to slide 04 (only while the header sits over the hero) */ body:has(.dt-hero .swiper-slide-active .dt-slide-home) .ekit-template-content-header:not(.dt-scrolled) .elementor-element-d429dee .elementskit-navbar-nav > li.dt-nav-home > a{ animation:dtHomeAnswer 2.6s cubic-bezier(.33,0,.2,1) .8s backwards; } body:has(.dt-hero .swiper-slide-active .dt-slide-home) .ekit-template-content-header:not(.dt-scrolled) .elementor-element-d429dee .elementskit-navbar-nav > li.dt-nav-home > a::after{ animation:dtHomeAnswerLine 2.6s cubic-bezier(.33,0,.2,1) .8s backwards; } body:has(.dt-hero .swiper-slide-active .dt-slide-home) .ekit-template-content-header:not(.dt-scrolled) .elementor-element-d429dee .elementskit-navbar-nav > li.dt-nav-home > a:not(:focus-visible)::before{ animation:dtHomeDot 4.8s ease-in-out infinite, dtHomeAnswerDot 2.6s ease-out .8s backwards; } @keyframes dtHomeAnswer{ 0%{background-position:-80% 50%,center; background-size:38% 70%,0% 0%; text-shadow:0 0 0 rgba(255,236,200,0);} 25%{background-size:38% 70%,100% 76%; text-shadow:0 0 16px rgba(255,236,200,.6);} 75%{background-position:180% 50%,center; background-size:38% 70%,80% 60%; text-shadow:0 0 10px rgba(255,236,200,.3);} 100%{background-position:180% 50%,center; background-size:38% 70%,0% 0%; text-shadow:0 0 0 rgba(255,236,200,0);} } @keyframes dtHomeAnswerLine{ 0%{transform:scaleX(0); transform-origin:left center; opacity:1; box-shadow:0 0 0 rgba(201,176,138,0);} 45%{transform:scaleX(1); transform-origin:left center; opacity:1; box-shadow:0 0 8px rgba(230,205,160,.7);} 80%{transform:scaleX(1); transform-origin:left center; opacity:1; box-shadow:0 0 4px rgba(230,205,160,.3);} 100%{transform:scaleX(1); transform-origin:left center; opacity:0; box-shadow:0 0 0 rgba(201,176,138,0);} } @keyframes dtHomeAnswerDot{ 0%{opacity:.7; transform:scale(1); box-shadow:0 0 0 0 rgba(201,176,138,0);} 25%{opacity:1; transform:scale(1.35); box-shadow:0 0 0 3px rgba(201,176,138,.3),0 0 12px 3px rgba(240,215,170,.65);} 100%{opacity:.7; transform:scale(1); box-shadow:0 0 0 10px rgba(201,176,138,0),0 0 0 0 rgba(240,215,170,0);} } } @media (max-width:1024px){ .ekit-template-content-header .elementskit-menu-offcanvas-elements .elementskit-navbar-nav > li.dt-nav-home{ background: linear-gradient(100deg,rgba(255,249,239,0) 38%,rgba(255,249,239,.85) 50%,rgba(255,249,239,0) 62%) no-repeat, linear-gradient(90deg,rgba(242,232,214,.95) 0%,rgba(242,232,214,.3) 100%); background-size:260% 100%,100% 100%; background-position:120% 0,0 0; animation:dtHomeSheen 9s ease-in-out 1.4s infinite; } @keyframes dtHomeSheen{0%{background-position:120% 0,0 0;}30%,100%{background-position:-20% 0,0 0;}} .ekit-template-content-header .elementskit-menu-offcanvas-elements .elementskit-navbar-nav > li.dt-nav-home > a::after{ content:'7 j / 7'; margin-left:auto; padding:6px 9px 5px; border:1px solid rgba(168,138,92,.5); font-family:'Jost',sans-serif; font-size:10px; font-weight:500; font-style:normal; line-height:1; letter-spacing:.16em; text-transform:uppercase; white-space:nowrap; color:#86683C; } } /* ---------- 6 · Accessibility fallbacks ---------------------------- */ @supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){ .ekit-template-content-header::before{background:#FFF9EF;} .ekit-template-content-header .elementskit-megamenu-panel{background:#FFF9EF!important;} } @media (prefers-reduced-motion:reduce){ .ekit-template-content-header, .ekit-template-content-header *, .ekit-template-content-header *::before, .ekit-template-content-header *::after, .ekit-template-content-header::before, .ekit-template-content-header::after{transition-duration:.01ms!important; animation:none!important;} }/* End custom CSS */