PageSourceSearch

https://www.clinique.com/cart

html clinique.com collected 2026-10-01 10:28:32 UTC 498,470 bytes, 11,747 lines download raw bytes

1<!doctype html>
2<html class='no-js' lang='en'>
3  <head>
4    
5<script type='speculationrules'>
6  {
7    "prerender": [
8      {
9        "where": {
10          "href_matches": "/*"
11        },
12        "eagerness": "conservative"
13      }
14    ]
15  }
16</script>
16
17<meta charset='utf-8' data-svg-sprite-path='//www.clinique.com/cdn/shop/t/104/assets/icons.svg?v=158214021495967969081790357996'>
18    <meta http-equiv='X-UA-Compatible' content='IE=edge'><meta name='viewport' content='width=device-width,initial-scale=1,maximum-scale=1'>
19    <meta name='theme-color' content=''>
20    <link rel='canonical' href='https://www.clinique.com/cart'>
21
22    <style>
23      [cloak] {
24        display: none !important;
25      }
26    </style>
26<script>
27  (() => {const cartParams = new URLSearchParams(window.location.search);
28      cartParams.set('cart_drawer', 'open');
29      window.location.replace('/?' + cartParams.toString() + window.location.hash);
30      return;const params = new URLSearchParams(window.location.search);
31    if (!params.has('cart_drawer')) return;
32
33    params.delete('cart_drawer');
34    const newSearch = params.toString();
35    const newUrl = window.location.pathname + (newSearch ? '?' + newSearch : '') + window.location.hash;
36    window.history.replaceState({}, '', newUrl);
37
38    customElements.whenDefined('app-provider').then(() => {
39      const provider = document.querySelector('app-provider');
40      if (!provider) return;
41      provider.dispatchEvent(new CustomEvent('modal-dialog::open', {
42        detail: 'cart-drawer-dialog',
43        bubbles: true,
44        composed: true,
45      }));
46    });
47  })();
48</script>
48
49
50<link rel='dns-prefetch' href='https://cdn.shopify.com'>
51<link rel='dns-prefetch' href='https://cdn.jsdelivr.net'>
52<link rel='dns-prefetch' href='https://forms.shopifyapps.com'><link href="//www.clinique.com/cdn/shop/files/Clinique_Logo.png?format=webp&amp;v=1787760300&amp;width=150" as="image" fetchpriority="high" imagesrcset="//www.clinique.com/cdn/shop/files/Clinique_Logo.png?format=webp&amp;v=1787760300&amp;width=150 150w, //www.clinique.com/cdn/shop/files/Clinique_Logo.png?format=webp&amp;v=1787760300&amp;width=225 225w, //www.clinique.com/cdn/shop/files/Clinique_Logo.png?format=webp&amp;v=1787760300&amp;width=300 300w" imagesizes="(max-width: 300px) 50vw, 150px" rel="preload">
53<link
54        rel='icon'
55        type='image/png'
56        href='//www.clinique.com/cdn/shop/files/Clinique_Favicon.png?crop=center&height=32&v=1790010255&width=32'
57      >
58
59<link
60  rel='preload'
61  href='//www.clinique.com/cdn/shop/t/104/assets/CliniquesHelveticaNeue.woff2?v=125086157697061236531790357966'
62  as='font'
63  type='font/woff2'
64  crossorigin='anonymous'
65  fetchpriority='high'
66>
67
68<style>
69  @font-face {
70    font-family: 'Cliniques Helvetica Neue';
71    font-style: normal;
72    font-weight: 200;
73    font-display: swap;
74    src:
75      url('//www.clinique.com/cdn/shop/t/104/assets/CliniquesHelveticaNeue-Lt.woff2?v=182270640829397200591790357963') format('woff2'),
76      url('//www.clinique.com/cdn/shop/t/104/assets/CliniquesHelveticaNeue-Lt.woff?v=14160853798911482691790357963') format('woff');
77    ascent-override: 85%;
78    descent-override: 15%;
79    line-gap-override: 0%;
80  }
81
82  @font-face {
83    font-family: 'Cliniques Helvetica Neue';
84    font-style: italic;
85    font-weight: 200;
86    font-display: swap;
87    src:
88      url('//www.clinique.com/cdn/shop/t/104/assets/CliniquesHelveticaNeue-LtIt.woff2?v=77607789781271664051790357964') format('woff2'),
89      url('//www.clinique.com/cdn/shop/t/104/assets/CliniquesHelveticaNeue-LtIt.woff?v=62253523772976675291790357963') format('woff');
90    ascent-override: 85%;
91    descent-override: 15%;
92    line-gap-override: 0%;
93  }
94
95  @font-face {
96    font-family: 'Cliniques Helvetica Neue';
97    font-style: normal;
98    font-weight: 400;
99    font-display: swap;
100    src:
101      url('//www.clinique.com/cdn/shop/t/104/assets/CliniquesHelveticaNeue.woff2?v=125086157697061236531790357966') format('woff2'),
102      url('//www.clinique.com/cdn/shop/t/104/assets/CliniquesHelveticaNeue.woff?v=93067576488209164481790357966') format('woff');
103    ascent-override: 85%;
104    descent-override: 15%;
105    line-gap-override: 0%;
106  }
107
108  @font-face {
109    font-family: 'Cliniques Helvetica Neue';
110    font-style: italic;
111    font-weight: 400;
112    font-display: swap;
113    src:
114      url('//www.clinique.com/cdn/shop/t/104/assets/CliniquesHelveticaNeue-It.woff2?v=172432244769002356831790357962') format('woff2'),
115      url('//www.clinique.com/cdn/shop/t/104/assets/CliniquesHelveticaNeue-It.woff?v=158244320057742091871790357962') format('woff');
116    ascent-override: 85%;
117    descent-override: 15%;
118    line-gap-override: 0%;
119  }
120
121  @font-face {
122    font-family: 'Cliniques Helvetica Neue';
123    font-style: normal;
124    font-weight: 600;
125    font-display: swap;
126    src:
127      url('//www.clinique.com/cdn/shop/t/104/assets/CliniquesHelveticaNeue-Md.woff2?v=14357670289318713811790357965') format('woff2'),
128      url('//www.clinique.com/cdn/shop/t/104/assets/CliniquesHelveticaNeue-Md.woff?v=70511931460927211471790357964') format('woff');
129    ascent-override: 85%;
130    descent-override: 15%;
131    line-gap-override: 0%;
132  }
133
134  @font-face {
135    font-family: 'Cliniques Helvetica Neue';
136    font-style: italic;
137    font-weight: 600;
138    font-display: swap;
139    src:
140      url('//www.clinique.com/cdn/shop/t/104/assets/CliniquesHelveticaNeue-MdIt.woff2?v=36347674467240647261790357965') format('woff2'),
141      url('//www.clinique.com/cdn/shop/t/104/assets/CliniquesHelveticaNeue-MdIt.woff?v=153426712643845818381790357965') format('woff');
142    ascent-override: 85%;
143    descent-override: 15%;
144    line-gap-override: 0%;
145  }
146
147  @font-face {
148    font-family: 'Cliniques Helvetica Neue';
149    font-style: normal;
150    font-weight: 800;
151    font-display: swap;
152    src:
153      url('//www.clinique.com/cdn/shop/t/104/assets/CliniquesHelveticaNeue-Bd.woff2?v=11447011895426651301790357961') format('woff2'),
154      url('//www.clinique.com/cdn/shop/t/104/assets/CliniquesHelveticaNeue-Bd.woff?v=58276883919295317171790357960') format('woff');
155    ascent-override: 85%;
156    descent-override: 15%;
157    line-gap-override: 0%;
158  }
159
160  @font-face {
161    font-family: 'Cliniques Helvetica Neue';
162    font-style: italic;
163    font-weight: 800;
164    font-display: swap;
165    src:
166      url('//www.clinique.com/cdn/shop/t/104/assets/CliniquesHelveticaNeue-BdIt.woff2?v=91609444986628372831790357962') format('woff2'),
167      url('//www.clinique.com/cdn/shop/t/104/assets/CliniquesHelveticaNeue-BdIt.woff?v=182849713428435524321790357961') format('woff');
168    ascent-override: 85%;
169    descent-override: 15%;
170    line-gap-override: 0%;
171  }
172</style>
173<title>
174      Your Shopping Cart | Clinique
175    </title>
176
177    
178
179<style>/*! tailwindcss v4.1.8 | MIT License | https://tailwindcss.com */@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-scroll-snap-strictness:proximity;--tw-border-style:solid;--tw-outline-style:solid;--tw-duration:initial;--tw-ease:initial}}
179}@layer theme{:root{--color-black:#000;--spacing:.25rem;--font-weight-light:300;--font-weight-medium:500;--radius-sm:1rem;--ease-in-out:cubic-bezier(.4,0,.2,1);--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4,0,.2,1);--color-foreground:#1a1a1a;--color-background:#fff;--color-link:#1a1a1a;--color-focus:#adddb7;--color-overlay:#0003;--font-family-primary:"Cliniques Helvetica Neue";--Typography-Nav-Link-L1-Font-Weight:600;--Typography-Nav-Link-L1-Font-Size:.8125rem;--Typography-Nav-Link-L1-Font-Size-Desktop:.875rem;--Typography-Nav-Link-L1-Line-Height:1.0769;--Typography-Nav-Link-L1-Line-Height-Desktop:1;--Typography-Nav-Link-L1-Letter-Spacing:0;--Typography-Nav-Link-L1-Text-Transform:none;--Typography-Header-Announcement-Bar-Font-Weight:400;--Typography-Header-Announcement-Bar-Font-Size:.8125rem;--Typography-Header-Announcement-Bar-Font-Size-Desktop:.875rem;--Typography-Header-Announcement-Bar-Line-Height:1.5385;--Typography-Header-Announcement-Bar-Line-Height-Desktop:1.2857;--Typography-Header-Announcement-Bar-Letter-Spacing:0;--Typography-Header-Announcement-Bar-Text-Transform:none;--spacing-3xs:min(max( 4px ,calc(calc(100vw/1440)*4)),4px);--spacing-2xs:min(max( 8px ,calc(calc(100vw/1440)*8)),8px);--spacing-xs:min(max( 12px ,calc(calc(100vw/1440)*12)),12px);--spacing-sm:min(max( 16px ,calc(calc(100vw/1440)*16)),16px);--spacing-md:min(max( 24px ,calc(calc(100vw/1440)*32)),32px);--spacing-lg:min(max( 36px ,calc(calc(100vw/1440)*40)),40px);--spacing-sm-sm:1rem;--spacing-pagemargin:min(max( 16px ,calc(calc(100vw/1440)*64)),64px);--spacing-header-linkspacing:min(max( 16px ,calc(calc(100vw/1440)*32)),32px);--radius-none:0;--max-width-full:100%;--leading-none:1}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html{-webkit-text-size-adjust:100%;-moz-tab-size:4;tab-size:4;line-height:1.5;font-family:var(--default-font-family,ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}ul{list-style:none}img{vertical-align:middle;display:block}img{max-width:100%;height:auto}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab,red,red)){::placeholder{color:color-mix(in oklab,currentcolor 50%,transparent)}}}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::file-selector-button{-webkit-appearance:button;-moz-appearance:button;appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}h6{font-family:var(--font-family-primary,"Cliniques Helvetica Neue");text-transform:none;font-size:1.125rem;font-style:normal;font-weight:200;line-height:1.1667;text-decoration:none}@media (min-width:1024px){h6{font-size:1.25rem;line-height:1.2}}p{font-family:var(--font-family-primary,"Cliniques Helvetica Neue");text-transform:none;font-size:1rem;font-style:normal;font-weight:400;line-height:1.3125;text-decoration:none}@media (min-width:1024px){p{line-height:1.5}}a{text-decoration:none}a:hover{text-decoration:underline}html{scroll-behavior:smooth}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}html{scrollbar-gutter:stable;overflow-anchor:none}body{padding-right:var(--scrollbar-width);color:var(--color-foreground);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:clip}@supports (scrollbar-gutter:stable){html:has(modal-dialog[open]) body,html:has(extended-dialog[open]) body{padding-right:0}html:has(modal-dialog[open]) .announcement-bar-wrapper,html:has(extended-dialog[open]) .announcement-bar-wrapper{margin-right:0}}.announcement-bar-wrapper{margin-right:calc(var(--scrollbar-width)*-1)}html:has(modal-dialog[open]),html:has(extended-dialog[open]){overflow:hidden}svg-icon{width:1em;height:1em;font-size:var(--icon-size,inherit);color:inherit;display:inline-flex;box-sizing:content-box!important}svg-icon[hidden]{display:none!important}.rte a:not(.btn){color:var(--color-link);-webkit-text-decoration-color:var(--color-link);text-decoration-color:var(--color-link);text-underline-offset:5px;text-decoration-line:underline!important}*{scrollbar-color:initial;scrollbar-width:initial}}
179@layer components{.body-xs{font-family:var(--font-family-primary,"Cliniques Helvetica Neue");text-transform:none;font-size:.6875rem;font-style:normal;font-weight:400;line-height:1.2727;text-decoration:none}.nav-link{font-family:var(--font-family-primary,"Cliniques Helvetica Neue");font-weight:var(--Typography-Nav-Link-L1-Font-Weight,600);font-style:normal;font-size:var(--Typography-Nav-Link-L1-Font-Size,.8125rem);line-height:var(--Typography-Nav-Link-L1-Line-Height,1.0769);letter-spacing:var(--Typography-Nav-Link-L1-Letter-Spacing,0);text-transform:var(--Typography-Nav-Link-L1-Text-Transform,none);text-decoration:none}@media (min-width:1024px){.nav-link{font-size:var(--Typography-Nav-Link-L1-Font-Size-Desktop,.875rem);line-height:var(--Typography-Nav-Link-L1-Line-Height-Desktop,1)}}.text-legal{font-family:var(--font-family-primary,"Cliniques Helvetica Neue");text-transform:none;font-size:.6875rem;font-style:normal;font-weight:400;line-height:1.2727;text-decoration:none}.h6{font-family:var(--font-family-primary,"Cliniques Helvetica Neue");text-transform:none;font-size:1.125rem;font-style:normal;font-weight:200;line-height:1.1667;text-decoration:none}@media (min-width:1024px){.h6{font-size:1.25rem;line-height:1.2}}.body,.p{font-family:var(--font-family-primary,"Cliniques Helvetica Neue");text-transform:none;font-size:1rem;font-style:normal;font-weight:400;line-height:1.3125;text-decoration:none}@media (min-width:1024px){.body,.p{line-height:1.5}}.badge-text{font-family:var(--font-family-primary,"Cliniques Helvetica Neue");text-transform:uppercase;font-size:.5rem;font-style:normal;font-weight:600;line-height:1;text-decoration:none}.rte{font-family:var(--font-family-primary,"Cliniques Helvetica Neue");text-transform:none;font-size:1rem;font-style:normal;font-weight:400;line-height:1.3125;text-decoration:none}@media (min-width:1024px){.rte{line-height:1.5}}.rte>:first-child{margin-top:calc(var(--spacing)*0)}.rte>:last-child{margin-bottom:calc(var(--spacing)*0)}.rte>ul>li,.rte ul>li{list-style-position:outside}.rte img:not([style*=float]):not([style*=Float]){margin-inline:auto;margin-block:var(--spacing-md);max-width:100%;height:auto;max-width:var(--max-width-full);border-radius:var(--radius-sm);border-style:var(--tw-border-style);border-width:1px;display:block}.rte ul{margin-left:var(--spacing-xs);width:fit-content;padding-inline-start:var(--spacing-2xs);list-style-type:disc}.rte ul li{margin-top:var(--spacing-2xs)}.rte ul li li{margin-left:2.5em;list-style:circle}.rte ul li li li{list-style:square}.rte h6{margin-bottom:var(--spacing-sm);font-family:var(--font-family-primary,"Cliniques Helvetica Neue");text-transform:none;font-size:1.125rem;font-style:normal;font-weight:200;line-height:1.1667;text-decoration:none}@media (min-width:1024px){.rte h6{font-size:1.25rem;line-height:1.2}}.rte p,.rte>ul,.rte>div>ul{margin-bottom:var(--spacing-sm)}.core-carousel-slides{scroll-snap-type:x var(--tw-scroll-snap-strictness);--tw-scroll-snap-strictness:mandatory;gap:var(--core-carousel-gap);scrollbar-width:none;width:100%;display:flex;overflow:auto clip}.core-carousel-slides::-webkit-scrollbar{display:none}.core-carousel-slide{width:calc(var(--core-carousel-slide-width) - var(--core-carousel-slide-gap-per-slide));max-width:100%;max-width:var(--max-width-full);scroll-snap-align:center;flex:none;position:relative}.core-carousel-slides:has(>.regimen-slide){grid-auto-columns:calc(var(--core-carousel-slide-width) - var(--core-carousel-slide-gap-per-slide));row-gap:var(--spacing-md);grid-template-rows:auto 1fr;grid-auto-flow:column;display:grid}.core-carousel-button{z-index:2;height:calc(var(--spacing)*10);width:calc(var(--spacing)*10);transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration));--tw-duration:.2s;--tw-ease:var(--ease-in-out);transition-duration:.2s;transition-timing-function:var(--ease-in-out);border-radius:3.40282e38px;justify-content:center;align-items:center;display:flex}.core-carousel-button[aria-hidden=true]{display:none}.announcement-bar .core-carousel-button{padding:calc(var(--spacing)*0);align-items:flex-end}@media (min-width:48rem){.announcement-bar .core-carousel-button{left:calc(var(--spacing)*0);width:calc(var(--spacing)*3);height:calc(var(--spacing)*3)}}.announcement-bar .core-carousel-button-next{right:calc(var(--spacing)*0)!important}@media (min-width:48rem){.announcement-bar .core-carousel-button-next{left:var(--spacing-xs)}}}@layer utilities{.pointer-events-auto{pointer-events:auto}.pointer-events-none{pointer-events:none}.invisible{visibility:hidden}.visible{visibility:visible}.sr-only{clip:rect(0,0,0,0);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.absolute{position:absolute}.relative{position:relative}.sticky{position:sticky}.top-0{top:calc(var(--spacing)*0)}.top-1{top:calc(var(--spacing)*1)}.top-1\.25{top:calc(var(--spacing)*1.25)}.top-\[90\%\]{top:90%}.right-0{right:calc(var(--spacing)*0)}.right-0\.25{right:calc(var(--spacing)*.25)}.left-0{left:calc(var(--spacing)*0)}.z-50{z-index:50}.z-\[-1\]{z-index:-1}.block{display:block}
179.flex{display:flex}.grid{display:grid}.hidden{display:none}.inline{display:inline}.inline-flex{display:inline-flex}.size-1{width:calc(var(--spacing)*1);height:calc(var(--spacing)*1)}.size-1\.5{width:calc(var(--spacing)*1.5);height:calc(var(--spacing)*1.5)}.size-2{width:calc(var(--spacing)*2);height:calc(var(--spacing)*2)}.size-3{width:calc(var(--spacing)*3);height:calc(var(--spacing)*3)}.size-3\.5{width:calc(var(--spacing)*3.5);height:calc(var(--spacing)*3.5)}.size-7{width:calc(var(--spacing)*7);height:calc(var(--spacing)*7)}.size-7\.5{width:calc(var(--spacing)*7.5);height:calc(var(--spacing)*7.5)}.h-8{height:calc(var(--spacing)*8)}.h-11{height:calc(var(--spacing)*11)}.h-11\.5{height:calc(var(--spacing)*11.5)}.h-\[calc\(100vh-var\(--header-height\)\+10px\)\]{height:calc(100vh - var(--header-height) + 10px)}.h-auto{height:auto}.h-fit{height:fit-content}.h-full{height:100%}.w-30{width:calc(var(--spacing)*30)}.w-auto{width:auto}.w-fit{width:fit-content}.w-full{width:100%}.max-w-\[70vw\]{max-width:70vw}.flex-1{flex:1}.shrink-0{flex-shrink:0}.-rotate-90{rotate:-90deg}.rotate-90{rotate:90deg}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.place-items-center{place-items:center}.items-center{align-items:center}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.justify-end{justify-content:flex-end}.justify-start{justify-content:flex-start}.gap-0{gap:calc(var(--spacing)*0)}.gap-1{gap:calc(var(--spacing)*1)}.gap-2{gap:calc(var(--spacing)*2)}.gap-2xs{gap:var(--spacing-2xs)}.gap-3xs{gap:var(--spacing-3xs)}.gap-lg{gap:var(--spacing-lg)}.gap-sm{gap:var(--spacing-sm)}.gap-x-\[var\(--spacing-header-linkspacing\,2rem\)\]{column-gap:var(--spacing-header-linkspacing,2rem)}.rounded-none{border-radius:0;border-radius:var(--radius-none)}.bg-\(--color-overlay\){background-color:var(--color-overlay)}.bg-background{background-color:var(--color-background)}.bg-transparent{background-color:#0000}.object-contain{object-fit:contain}.px-3xs{padding-inline:var(--spacing-3xs)}.px-pagemargin{padding-inline:var(--spacing-pagemargin)}.px-xs{padding-inline:var(--spacing-xs)}.py-2xs{padding-block:var(--spacing-2xs)}.ps-0{padding-inline-start:calc(var(--spacing)*0)}.pe-0{padding-inline-end:calc(var(--spacing)*0)}.pt-0{padding-top:calc(var(--spacing)*0)}.pt-sm{padding-top:var(--spacing-sm)}.pb-0{padding-bottom:calc(var(--spacing)*0)}.pb-2xs{padding-bottom:var(--spacing-2xs)}.text-center{text-align:center}.text-left{text-align:left}.nav-link{font-family:var(--font-family-primary,"Cliniques Helvetica Neue");font-weight:var(--Typography-Nav-Link-L1-Font-Weight,600);font-style:normal;font-size:var(--Typography-Nav-Link-L1-Font-Size,.8125rem);line-height:var(--Typography-Nav-Link-L1-Line-Height,1.0769);letter-spacing:var(--Typography-Nav-Link-L1-Letter-Spacing,0);text-transform:var(--Typography-Nav-Link-L1-Text-Transform,none);text-decoration:none}@media (min-width:1024px){.nav-link{font-size:var(--Typography-Nav-Link-L1-Font-Size-Desktop,.875rem);line-height:var(--Typography-Nav-Link-L1-Line-Height-Desktop,1)}}.h6{font-family:var(--font-family-primary,"Cliniques Helvetica Neue");text-transform:none;font-size:1.125rem;font-style:normal;font-weight:200;line-height:1.1667;text-decoration:none}@media (min-width:1024px){.h6{font-size:1.25rem;line-height:1.2}}.body{font-family:var(--font-family-primary,"Cliniques Helvetica Neue");text-transform:none;font-size:1rem;font-style:normal;font-weight:400;line-height:1.3125;text-decoration:none}@media (min-width:1024px){.body{line-height:1.5}}.p{font-family:var(--font-family-primary,"Cliniques Helvetica Neue");text-transform:none;font-size:1rem;font-style:normal;font-weight:400;line-height:1.3125;text-decoration:none}@media (min-width:1024px){.p{line-height:1.5}}.badge-text{font-family:var(--font-family-primary,"Cliniques Helvetica Neue");text-transform:uppercase;font-size:.5rem;font-style:normal;font-weight:600;line-height:1;text-decoration:none}.body-xs{font-family:var(--font-family-primary,"Cliniques Helvetica Neue");text-transform:none;font-size:.6875rem;font-style:normal;font-weight:400;line-height:1.2727;text-decoration:none}.text-legal{font-family:var(--font-family-primary,"Cliniques Helvetica Neue");text-transform:none;font-size:.6875rem;font-style:normal;font-weight:400;line-height:1.2727;text-decoration:none}.leading-none{line-height:1;line-height:var(--leading-none)}.font-light{font-weight:var(--font-weight-light)}.font-medium{font-weight:var(--font-weight-medium)}.text-black{color:var(--color-black)}.text-foreground{color:var(--color-foreground)}.text-inherit{color:inherit}
179.uppercase{text-transform:uppercase}.no-underline{text-decoration-line:none}.underline{text-decoration-line:underline}.underline-offset-2{text-underline-offset:2px}.underline-offset-8{text-underline-offset:8px}.opacity-0{opacity:0}.opacity-100{opacity:1}.outline{outline-style:var(--tw-outline-style);outline-width:1px}.transition-\[opacity\,display\]{transition-property:opacity,display;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-\[opacity\,visibility\]{transition-property:opacity,visibility;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-opacity{transition-property:opacity;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.\[transition-behavior\:allow-discrete\]{transition-behavior:allow-discrete}.duration-200{--tw-duration:.2s;transition-duration:.2s}.ease-in-out{--tw-ease:var(--ease-in-out);transition-timing-function:var(--ease-in-out)}.will-change-transform{will-change:transform}.group-focus-within\:pointer-events-auto:is(:where(.group):focus-within *){pointer-events:auto}.group-focus-within\:visible:is(:where(.group):focus-within *){visibility:visible}.group-focus-within\:block:is(:where(.group):focus-within *){display:block}.group-focus-within\:opacity-100:is(:where(.group):focus-within *){opacity:1}.group-\[\[open\]\]\/menutoggle\:hidden:is(:where(.group\/menutoggle)[open] *){display:none}.group-\[\[open\]\]\/menutoggle\:inline-flex:is(:where(.group\/menutoggle)[open] *){display:inline-flex}.peer-has-\[\[aria-expanded\=\"true\"\]\]\:pointer-events-auto:is(:where(.peer):has([aria-expanded=true])~*){pointer-events:auto}.peer-has-\[\[aria-expanded\=\"true\"\]\]\:visible:is(:where(.peer):has([aria-expanded=true])~*){visibility:visible}.peer-has-\[\[aria-expanded\=\"true\"\]\]\:block:is(:where(.peer):has([aria-expanded=true])~*){display:block}.peer-has-\[\[aria-expanded\=\"true\"\]\]\:opacity-100:is(:where(.peer):has([aria-expanded=true])~*){opacity:1}.empty\:hidden:empty{display:none}@media (hover:hover){.hover\:no-underline:hover{text-decoration-line:none}.hover\:underline:hover{text-decoration-line:underline}.hover\:opacity-70:hover{opacity:.7}}.focus-visible\:outline:focus-visible{outline-style:var(--tw-outline-style);outline-width:1px}.focus-visible\:outline-2:focus-visible{outline-style:var(--tw-outline-style);outline-width:2px}.focus-visible\:outline-offset-2:focus-visible{outline-offset:2px}.focus-visible\:outline-\[var\(--color-focus\)\]:focus-visible{outline-color:var(--color-focus)}@media not all and (min-width:48rem){.max-md\:py-\(--spacing-3xs\){padding-block:var(--spacing-3xs)}}@media (min-width:48rem){.md\:flex{display:flex}.md\:hidden{display:none}.md\:inline{display:inline}.md\:size-2{width:calc(var(--spacing)*2);height:calc(var(--spacing)*2)}.md\:h-auto{height:auto}.md\:w-\(--header-logo-width\){width:var(--header-logo-width)}.md\:max-w-\[50vw\]{max-width:50vw}.md\:justify-start{justify-content:flex-start}.md\:ps-10{padding-inline-start:calc(var(--spacing)*10)}.md\:pt-sm{padding-top:var(--spacing-sm)}.md\:pb-2xs{padding-bottom:var(--spacing-2xs)}.md\:text-left{text-align:left}}@media (min-width:64rem){.lg\:flex{display:flex}.lg\:grid{display:grid}.lg\:hidden{display:none}.lg\:px-xs{padding-inline:var(--spacing-xs)}}@starting-style{.starting\:peer-has-\[\[aria-expanded\=\"true\"\]\]\:opacity-0:is(:where(.peer):has([aria-expanded=true])~*){opacity:0}}.\[\&_a\]\:underline-offset-2 a{text-underline-offset:2px}.\[\&\:has\(cart-total\[aria-hidden\=\"true\"\]\)\]\:hidden:has(cart-total[aria-hidden=true]){display:none}}@media not all and (min-width:48rem){:root{--spacing-pagemargin:var(--spacing-sm-sm)}}div:has(>.mobile-menu-sublist){padding-block-start:.75rem}.announcement-bar .body-xs,.announcement-bar .text-legal{font-family:var(--font-family-primary,"Cliniques Helvetica Neue");font-weight:var(--Typography-Header-Announcement-Bar-Font-Weight,400);font-style:normal;font-size:var(--Typography-Header-Announcement-Bar-Font-Size,.8125rem);line-height:var(--Typography-Header-Announcement-Bar-Line-Height,1.5385);letter-spacing:var(--Typography-Header-Announcement-Bar-Letter-Spacing,0);text-transform:var(--Typography-Header-Announcement-Bar-Text-Transform,none);text-decoration:none}@media (min-width:1024px){.announcement-bar .body-xs,.announcement-bar .text-legal{font-size:var(--Typography-Header-Announcement-Bar-Font-Size-Desktop,.875rem);line-height:var(--Typography-Header-Announcement-Bar-Line-Height-Desktop,1.2857)}}@keyframes skeleton-pulse{0%,to{background-color:var(--color-grey-300)}50%{background-color:var(--color-grey-200)}}@keyframes elc-pulse{50%{opacity:.5}}@property --tw-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-y{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-z{syntax:"*";inherits:false;initial-value:0}@property --tw-scale-x{syntax:"*";inherits:false;initial-value:1}@property --tw-scale-y{syntax:"*";inherits:false;initial-value:1}@property --tw-scale-z{syntax:"*";inherits:false;initial-value:1}@property --tw-rotate-x{syntax:"*";inherits:false}@property --tw-rotate-y{syntax:"*";inherits:false}@property --tw-rotate-z{syntax:"*";inherits:false}@property --tw-skew-x{syntax:"*";inherits:false}@property --tw-skew-y{syntax:"*";inherits:false}@property --tw-pan-x{syntax:"*";inherits:false}@property --tw-pan-y{syntax:"*";inherits:false}@property --tw-pinch-zoom{syntax:"*";inherits:false}@property --tw-scroll-snap-strictness{syntax:"*";inherits:false;initial-value:proximity}@property --tw-space-y-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-divide-y-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-leading{syntax:"*";inherits:false}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-tracking{syntax:"*";inherits:false}@property --tw-ordinal{syntax:"*";inherits:false}@property --tw-slashed-zero{syntax:"*";inherits:false}@property --tw-numeric-figure{syntax:"*";inherits:false}@property --tw-numeric-spacing{syntax:"*";inherits:false}@property --tw-numeric-fraction{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-outline-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-blur{syntax:"*";inherits:false}@property --tw-brightness{syntax:"*";inherits:false}@property --tw-contrast{syntax:"*";inherits:false}@property --tw-grayscale{syntax:"*";inherits:false}@property --tw-hue-rotate{syntax:"*";inherits:false}@property --tw-invert{syntax:"*";inherits:false}@property --tw-opacity{syntax:"*";inherits:false}@property --tw-saturate{syntax:"*";inherits:false}@property --tw-sepia{syntax:"*";inherits:false}@property --tw-drop-shadow{syntax:"*";inherits:false}@property --tw-drop-shadow-color{syntax:"*";inherits:false}@property --tw-drop-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:"*";inherits:false}@property --tw-backdrop-blur{syntax:"*";inherits:false}@property --tw-backdrop-brightness{syntax:"*";inherits:false}@property --tw-backdrop-contrast{syntax:"*";inherits:false}@property --tw-backdrop-grayscale{syntax:"*";inherits:false}@property --tw-backdrop-hue-rotate{syntax:"*";inherits:false}@property --tw-backdrop-invert{syntax:"*";inherits:false}@property --tw-backdrop-opacity{syntax:"*";inherits:false}@property --tw-backdrop-saturate{syntax:"*";inherits:false}@property --tw-backdrop-sepia{syntax:"*";inherits:false}@property --tw-duration{syntax:"*";inherits:false}@property --tw-ease{syntax:"*";inherits:false}@property --tw-text-shadow-color{syntax:"*";inherits:false}@property --tw-text-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-content{syntax:"*";inherits:false;initial-value:""}@property --tw-border-spacing-x{syntax:"<length>";inherits:false;initial-value:0}@property --tw-border-spacing-y{syntax:"<length>";inherits:false;initial-value:0}@layer base {
180    .content-for-layout { opacity: 0 }
181    .content-for-layout .shopify-section { opacity: 0 }
182    .content-for-layout .shopify-section:first-child { opacity: 1 }
183  }@layer utilities {
184    .aspect-video{aspect-ratio:16/9}
185    .overflow-hidden{overflow:hidden}
186    .max-h-dvh{max-height:100dvh}
187    .inset-0{inset:calc(var(--spacing)*0)}
188    .object-cover{object-fit:cover}
189    .aspect-\(--block-aspect-ratio-mobile\,auto\){aspect-ratio:var(--block-aspect-ratio-mobile,auto)}
190    .h-\(--block-height-mobile\,100\%\){height:var(--block-height-mobile,100%)}
191    .h-\(--block-height-mobile\,auto\){height:var(--block-height-mobile,auto)}
192    @media (min-width:48rem){
193      .md\:aspect-\(--block-aspect-ratio\,auto\){aspect-ratio:var(--block-aspect-ratio,auto)}
194      .md\:h-\(--block-height\,100\%\){height:var(--block-height,100%)}
195      .md\:h-\(--block-height\,auto\){height:var(--block-height,auto)}
196    }
197  }.elc-select__label,.product-card__option-rail-selected,.product-card__size-chip-label,[data-shade-desc],[data-vto-panel-selected-label]{text-transform:none}@media (width<48rem){:root{--spacing-pagemargin:16px}}.announcement-bar .body-xs,.announcement-bar .text-legal{font-family:var(--font-family-primary,"Cliniques Helvetica Neue");font-weight:var(--Typography-Header-Announcement-Bar-Font-Weight,400);font-style:normal;font-size:var(--Typography-Header-Announcement-Bar-Font-Size,.8125rem);line-height:var(--Typography-Header-Announcement-Bar-Line-Height,1.5385);letter-spacing:var(--Typography-Header-Announcement-Bar-Letter-Spacing,0);text-transform:var(--Typography-Header-Announcement-Bar-Text-Transform,none);text-decoration:none}
198  @media (min-width:1024px){
199    .announcement-bar .body-xs,.announcement-bar .text-legal{font-size:var(--Typography-Header-Announcement-Bar-Font-Size-Desktop,.875rem);line-height:var(--Typography-Header-Announcement-Bar-Line-Height-Desktop,1.2857)}
200  }@layer theme{:root{--spacing-icon-sm:12px;--spacing-icon-md:16px;--spacing-icon-lg:24px}}
201  @layer utilities{.icon-sm{--icon-size:var(--spacing-icon-sm);font-size:var(--icon-size)}.icon-md{--icon-size:var(--spacing-icon-md);font-size:var(--icon-size)}.icon-lg{--icon-size:var(--spacing-icon-lg);font-size:var(--icon-size)}.size-icon-md{width:var(--spacing-icon-md);height:var(--spacing-icon-md)}@media (width>=48rem){.md\:icon-sm{--icon-size:var(--spacing-icon-sm);font-size:var(--icon-size)}}}
202</style>
203
204
205
206
207<meta property='og:site_name' content='Clinique Laboratories, LLC'>
208<meta property='og:url' content='https://www.clinique.com/cart'>
209<meta property='og:title' content='Your Shopping Cart'>
210<meta property='og:type' content='website'>
211<meta property='og:description' content='Shop Clinique and spend $75 to pick 4 holiday travel necessities at checkout. Choose your favorites and make them yours. Limited time only.'><meta name='twitter:card' content='summary_large_image'>
212<meta name='twitter:title' content='Your Shopping Cart'>
213<meta name='twitter:description' content='Shop Clinique and spend $75 to pick 4 holiday travel necessities at checkout. Choose your favorites and make them yours. Limited time only.'>
214
215
216<script type='application/ld+json'>
217  {
218    "@context": "https://schema.org",
219    "@graph": [
220        {
221          "@context": "http://schema.org",
222          "@type": "Organization",
223          "name": "Clinique Laboratories, LLC",
224      
225        "logo": "https:\/\/www.clinique.com\/cdn\/shop\/files\/Clinique_Logo.png?format=webp\u0026v=1787760300\u0026width=500",
226      
227      "sameAs": [
228        "",
229        "https:\/\/www.facebook.com\/cliniqueUS",
230        "https:\/\/www.pinterest.com\/clinique\/",
231        "https:\/\/www.instagram.com\/Clinique\/",
232        "https:\/\/www.tiktok.com\/@clinique",
233        "",
234        "",
235        "https:\/\/www.youtube.com\/Clinique",
236        "",
237        ""
238      ],
239      "url": "https:\/\/www.clinique.com"
240    }
241    ]
242  }
243</script>
vendor: 1 bytes, line 243
243
244<script>window.performance && window.performance.mark && window.performance.mark('shopify.content_for_header.start');</script>
244<meta id="shopify-digital-wallet" name="shopify-digital-wallet" content="/73815621771/digital_wallets/dialog">
245<link rel="ucp" href="/.well-known/ucp" version="2026-08-25">
245<script async="async" src="/checkouts/internal/preloads.js?locale=en-US&default_configuration_id=4558454923"></script>
245
246<link rel="preconnect" href="https://shop.app" crossorigin="anonymous">
247<script async="async" src="https://shop.app/checkouts/internal/preloads.js?locale=en-US&default_configuration_id=4558454923&shop_id=73815621771" crossorigin="anonymous"></script>
vendor: 1 bytes, line 247
247
248<script id="apple-pay-shop-capabilities" type="application/json">{"shopId":73815621771,"countryCode":"US","currencyCode":"USD","merchantCapabilities":["supports3DS"],"merchantId":"gid:\/\/shopify\/Shop\/73815621771","merchantName":"Clinique Laboratories, LLC","requiredBillingContactFields":["postalAddress","email","phone"],"requiredShippingContactFields":["postalAddress","email","phone"],"shippingType":"shipping","supportedNetworks":["visa","masterCard","amex","discover","elo","jcb"],"total":{"type":"pending","label":"Clinique Laboratories, LLC","amount":"1.00"},"shopifyPaymentsEnabled":true,"supportsSubscriptions":true}</script>
vendor: 1 bytes, line 248
248
249<script id="shopify-features" type="application/json">{"accessToken":"3ea6e581d01b4e4d8da2c374df820d17","betas":["rich-media-storefront-analytics"],"domain":"www.clinique.com","predictiveSearch":true,"shopId":73815621771,"locale":"en"}</script>
vendor: 1 bytes, line 249
249
250<script>var Shopify = Shopify || {};
251Shopify.shop = "elc-us-cl-prod.myshopify.com";
252Shopify.locale = "en";
253Shopify.currency = {"active":"USD","rate":"1.0"};
254Shopify.country = "US";
255Shopify.theme = {"name":"FFS_mit_092526_CE","id":187530772675,"schema_name":"elc-clinique","schema_version":"2.1.0","theme_store_id":null,"role":"main"};
256Shopify.theme.handle = "null";
257Shopify.theme.style = {"id":null,"handle":null};
258Shopify.cdnHost = "www.clinique.com/cdn";
259Shopify.routes = Shopify.routes || {};
260Shopify.routes.root = "/";
261Shopify.shopJsCdnBaseUrl = "https://cdn.shopify.com/shopifycloud/shop-js";</script>
vendor: 1 bytes, line 261
261
262<script type="module">!function(o){(o.Shopify=o.Shopify||{}).modules=!0}(window);</script>
vendor: 1 bytes, line 262
262
263<script>!function(o){function n(){var o=[];function n(){o.push(Array.prototype.slice.apply(arguments))}return n.q=o,n}var t=o.Shopify=o.Shopify||{};t.loadFeatures=n(),t.autoloadFeatures=n()}(window);</script>
vendor: 1 bytes, line 263
263
264<script>
265  window.ShopifyPay = window.ShopifyPay || {};
266  window.ShopifyPay.apiHost = "shop.app\/pay";
267  window.ShopifyPay.redirectState = null;
268</script>
vendor: 1 bytes, line 268
268
269<script>
270  window.Shopify = window.Shopify || {};
271  window.Shopify.SignInWithShop = window.Shopify.SignInWithShop || {};
272  window.Shopify.SignInWithShop.assetMetrics = { sampleRate: 0.25 };
273  window.Shopify.SignInWithShop.eligible = true;
274</script>
vendor: 1 bytes, line 274
274
275<script id="shop-js-analytics" type="application/json">{"pageType":"cart"}</script>
vendor: 1 bytes, line 275
275
276<script>
277  window.Shopify = window.Shopify || {};
278  if (!window.Shopify.featureAssets) window.Shopify.featureAssets = {};
279  window.Shopify.featureAssets['shop-js'] = {"avatar":["modules/v2/loader.avatar.en.esm.js"],"checkout-modal":["modules/v2/loader.checkout-modal.en.esm.js"],"init-customer-accounts-sign-up":["modules/v2/loader.init-customer-accounts-sign-up.en.esm.js"],"init-customer-accounts":["modules/v2/loader.init-customer-accounts.en.esm.js"],"init-fed-cm":["modules/v2/loader.init-fed-cm.en.esm.js"],"init-shop-cart-sync":["modules/v2/loader.init-shop-cart-sync.en.esm.js"],"init-shop-email-lookup-coordinator":["modules/v2/loader.init-shop-email-lookup-coordinator.en.esm.js"],"init-shop-for-new-customer-accounts":["modules/v2/loader.init-shop-for-new-customer-accounts.en.esm.js"],"init-shop-user-recognition":["modules/v2/loader.init-shop-user-recognition.en.esm.js"],"init-windoid":["modules/v2/loader.init-windoid.en.esm.js"],"lead-capture":["modules/v2/loader.lead-capture.en.esm.js"],"listener":["modules/v2/loader.listener.en.esm.js"],"pay-button":["modules/v2/loader.pay-button.en.esm.js"],"payment-terms":["modules/v2/loader.payment-terms.en.esm.js"],"shop-button":["modules/v2/loader.shop-button.en.esm.js"],"shop-cart-sync":["modules/v2/loader.shop-cart-sync.en.esm.js"],"shop-cash-offers":["modules/v2/loader.shop-cash-offers.en.esm.js"],"shop-follow-button":["modules/v2/loader.shop-follow-button.en.esm.js"],"shop-login-button":["modules/v2/loader.shop-login-button.en.esm.js"],"shop-login":["modules/v2/loader.shop-login.en.esm.js"],"shop-toast-manager":["modules/v2/loader.shop-toast-manager.en.esm.js"],"shop-user-recognition":["modules/v2/loader.shop-user-recognition.en.esm.js"]};
280</script>
vendor: 1 bytes, line 280
280
281<script>(function() {
282  var isLoaded = false;
283  function asyncLoad() {
284    if (isLoaded) return;
285    isLoaded = true;
286    var urls = ["https:\/\/beacon.riskified.com\/?shop=elc-us-cl-prod.myshopify.com","https:\/\/ecom-app.rakutenadvertising.io\/rakuten_advertising.js?shop=elc-us-cl-prod.myshopify.com","https:\/\/tag.rmp.rakuten.com\/111844.ct.js?shop=elc-us-cl-prod.myshopify.com"];
287    for (var i = 0; i < urls.length; i++) {
288      var s = document.createElement('script');
289      s.type = 'text/javascript';
290      s.async = true;
291      s.src = urls[i];
292      var x = document.getElementsByTagName('script')[0];
293      x.parentNode.insertBefore(s, x);
294    }
295  };
296  if(window.attachEvent) {
297    window.attachEvent('onload', asyncLoad);
298  } else {
299    window.addEventListener('load', asyncLoad, false);
300  }
301})();</script>
vendor: 1 bytes, line 301
301
302<script id="__st">var __st={"a":73815621771,"offset":-14400,"reqid":"1903d741-9aac-4892-b2cd-c17c52df7f51-1790850511","pageurl":"www.clinique.com\/cart","u":"6818b3c3af9c","p":"cart"};</script>
vendor: 1 bytes, line 302
302
303<script>window.ShopifyPaypalV4VisibilityTracking = true;</script>
vendor: 1 bytes, line 303
303
304<script id="captcha-bootstrap">!function(){'use strict';const t='contact',e='account',n='new_comment',o=[[t,t],['blogs',n],['comments',n],[t,'customer']],c=[[e,'customer_login'],[e,'guest_login'],[e,'recover_customer_password'],[e,'create_customer']],r=t=>t.map((([t,e])=>`form[action*='/${t}']:not([data-nocaptcha='true']) input[name='form_type'][value='${e}']`)).join(','),a=t=>()=>t?[...document.querySelectorAll(t)].map((t=>t.form)):[];function s(){const t=[...o],e=r(t);return a(e)}const i='password',u='form_key',d=['recaptcha-v3-token','g-recaptcha-response','h-captcha-response',i],f=()=>{try{return window.sessionStorage}catch{return}},m='__shopify_v',_=t=>t.elements[u];function p(t,e,n=!1){try{const o=window.sessionStorage,c=JSON.parse(o.getItem(e)),{data:r}=function(t){const{data:e,action:n}=t;return t[m]||n?{data:e,action:n}:{data:t,action:n}}(c);for(const[e,n]of Object.entries(r))t.elements[e]&&(t.elements[e].value=n);n&&o.removeItem(e)}catch(o){console.error('form repopulation failed',{error:o})}}const l='form_type',E='cptcha';function T(t){t.dataset[E]=!0}const w=window,h=w.document,L='Shopify',v='ce_forms',y='captcha';let A=!1;((t,e)=>{const n=(g='f06e6c50-85a8-45c8-87d0-21a2b65856fe',I='https://cdn.shopify.com/shopifycloud/storefront-forms-hcaptcha/ce_storefront_forms_captcha_hcaptcha.v1.5.3.iife.js',D={infoText:'Protected by hCaptcha',privacyText:'Privacy',termsText:'Terms'},(t,e,n)=>{const o=w[L][v],c=o.bindForm;if(c)return c(t,g,e,D).then(n);var r;o.q.push([[t,g,e,D],n]),r=I,A||(h.body.append(Object.assign(h.createElement('script'),{id:'captcha-provider',async:!0,src:r})),A=!0)});var g,I,D;w[L]=w[L]||{},w[L][v]=w[L][v]||{},w[L][v].q=[],w[L][y]=w[L][y]||{},w[L][y].protect=function(t,e){n(t,void 0,e),T(t)},Object.freeze(w[L][y]),function(t,e,n,w,h,L){const[v,y,A,g]=function(t,e,n){const i=e?o:[],u=t?c:[],d=[...i,...u],f=r(d),m=r(i),_=r(d.filter((([t,e])=>n.includes(e))));return[a(f),a(m),a(_),s()]}(w,h,L),I=t=>{const e=t.target;return e instanceof HTMLFormElement?e:e&&e.form},D=t=>v().includes(t);t.addEventListener('submit',(t=>{const e=I(t);if(!e)return;const n=D(e)&&!e.dataset.hcaptchaBound&&!e.dataset.recaptchaBound,o=_(e),c=g().includes(e)&&(!o||!o.value);(n||c)&&t.preventDefault(),c&&!n&&(function(t){try{if(!f())return;!function(t){const e=f();if(!e)return;const n=_(t);if(!n)return;const o=n.value;o&&e.removeItem(o)}(t);const e=Array.from(Array(32),(()=>Math.random().toString(36)[2])).join('');!function(t,e){_(t)||t.append(Object.assign(document.createElement('input'),{type:'hidden',name:u})),t.elements[u].value=e}(t,e),function(t,e){const n=f();if(!n)return;const o=[...t.querySelectorAll(`input[type='${i}']`)].map((({name:t})=>t)),c=[...d,...o],r={};for(const[a,s]of new FormData(t).entries())c.includes(a)||(r[a]=s);n.setItem(e,JSON.stringify({[m]:1,action:t.action,data:r}))}(t,e)}catch(e){console.error('failed to persist form',e)}}(e),e.submit())}));const S=(t,e)=>{t&&!t.dataset[E]&&(n(t,e.some((e=>e===t))),T(t))};for(const o of['focusin','change'])t.addEventListener(o,(t=>{const e=I(t);D(e)&&S(e,y())}));const B=e.get('form_key'),M=e.get(l),P=B&&M;t.addEventListener('DOMContentLoaded',(()=>{const t=y();if(P)for(const e of t)e.elements[l].value===M&&p(e,B);[...new Set([...A(),...v().filter((t=>'true'===t.dataset.shopifyCaptcha))])].forEach((e=>S(e,t)))}))}(h,new URLSearchParams(w.location.search),n,t,e,['guest_login'])})(!0,!0)}();</script>
vendor: 1 bytes, line 304
304
305<script integrity="sha256-JjoPp5ZfB1sSAs5SQaol1x1GgvveM+BgmRzyDexInEQ=" data-source-attribution="shopify.loadfeatures" defer="defer" src="//www.clinique.com/cdn/shopifycloud/storefront/assets/storefront/load_feature-1bd60354.js" crossorigin="anonymous"></script>
vendor: 1 bytes, line 305
305
306<script>(function () {var userAgent = navigator.userAgent;var platform = navigator.platform;var maxTouchPoints = navigator.maxTouchPoints || 0;var isIOS = /iPad|iPhone|iPod/.test(platform) || (platform === 'MacIntel' && maxTouchPoints > 1);var isMacSafari = platform.indexOf('Mac') === 0 && /Safari/.test(userAgent) && !/Chrome|Chromium|CriOS|FxiOS|Edg|OPR|Android/.test(userAgent);var isAppleSafari = isIOS || isMacSafari;if (isAppleSafari) {fetch('/sf_private_access_tokens' + location.search).catch(function () {});}function browserMajorVersion(pattern) {var match = userAgent.match(pattern);return match ? parseInt(match[1], 10) : null;}function shouldLoadAutosizesPolyfill() {if (!window.PerformanceObserver?.supportedEntryTypes?.includes('paint')) {return false;}var chromeVersion = browserMajorVersion(/Chrome\/(\d+)/);if (chromeVersion !== null) {return chromeVersion < 126;}var firefoxVersion = browserMajorVersion(/Firefox\/(\d+)/);if (firefoxVersion !== null) {return firefoxVersion < 150;}var safariVersion = isAppleSafari ? browserMajorVersion(/Version\/(\d+).*Safari\//) : null;if (safariVersion !== null) {return safariVersion < 27;}return true;}if (shouldLoadAutosizesPolyfill()) {var autosizesScript = document.createElement('script');autosizesScript.async = true;autosizesScript.crossOrigin = 'anonymous';autosizesScript.src = "//www.clinique.com/cdn/shopifycloud/storefront/assets/storefront/autosizes-84416378.js";(document.head || document.documentElement).appendChild(autosizesScript);}window.ShopifyAnalytics = window.ShopifyAnalytics || {};window.ShopifyAnalytics.performance = window.ShopifyAnalytics.performance || {};(function () {var LONG_FRAME_THRESHOLD = 50;var longAnimationFrames = [];var activeRafId = null;function collectLongFrames() {var previousTime = null;function rafMonitor(now) {if (activeRafId === null) {return;}var delta = now - previousTime;if (delta > LONG_FRAME_THRESHOLD) {longAnimationFrames.push({startTime: previousTime,endTime: now,});}previousTime = now;activeRafId = requestAnimationFrame(rafMonitor);}previousTime = performance.now();activeRafId = requestAnimationFrame(rafMonitor);}if (!window.PerformanceObserver?.supportedEntryTypes?.includes('long-animation-frame')) {collectLongFrames();var timeoutId = setTimeout(function () {cancelAnimationFrame(activeRafId);}, 10000);window.ShopifyAnalytics.performance.getLongAnimationFrames = function (stopCollection) {if (stopCollection === undefined) {stopCollection = false;}if (stopCollection) {clearTimeout(timeoutId);cancelAnimationFrame(activeRafId);}return longAnimationFrames;};}})();})();</script>
306<script crossorigin="anonymous" defer="defer" src="//www.clinique.com/cdn/shopifycloud/storefront/assets/shopify_pay/storefront-616277c7.js?v=20250812"></script>
vendor: 1 bytes, line 306
306
307<script id="shopify-origin-trials" async="async" integrity="sha256-qJbe/jEZBHtr5W/BlA2cKAz3vkXu6vJQyLjgvgCC86g=" src="//cdn.shopify.com/shopifycloud/storefront/assets/storefront/origin_trials-318ab40a.js" crossorigin="anonymous" onload="window.__shopifyOriginTrialsDone = true" onerror="window.__shopifyOriginTrialsDone = true"></script>
vendor: 1 bytes, line 307
307
308<script>
309  window.Shopify = window.Shopify || {};
310  window.Shopify.MCP = window.Shopify.MCP || {};
311  window.Shopify.MCP.enabled = true;
312  window.Shopify.MCP.shop = "elc-us-cl-prod.myshopify.com";
313  window.Shopify.MCP.mcpEndpoint = "https:\/\/www.clinique.com\/api\/mcp";
314  window.Shopify.MCP.tools = [{"name":"search_shop_policies_and_faqs","description":"Used to get facts about the stores policies, products, or services.\nSome examples of questions you can ask are:\n  - What is your return policy?\n  - What is your shipping policy?\n  - What is your phone number?\n  - What are your hours of operation?\"\n","inputSchema":{"$schema":"https:\/\/json-schema.org\/draft\/2020-12\/schema","type":"object","properties":{"query":{"type":"string","description":"A natural language query."},"context":{"type":"string","description":"Additional information about the request such as user demographics, mood, location, or other relevant details that could help in tailoring the response appropriately."}},"required":["query"]}}];
315</script>
vendor: 1 bytes, line 315
315
316<script>(()=>{var d="shopify:webmcp_adapter_loaded",n=Symbol.for("shopify.webmcp_adapter_loading");function s(c,a,{win:r=window,doc:o=document}={}){function p(){try{return r.localStorage.getItem(d)==="true"}catch{return!1}}function l(){try{r.localStorage.setItem(d,"true")}catch{}}function u(){return typeof(o.modelContext||r.navigator?.modelContext)?.registerTool=="function"}function f(){if(r[n]||!u())return;let t=o.head||o.getElementsByTagName("head")[0];if(!t)return;let e=o.createElement("script");e.type="module",e.crossOrigin="anonymous",a&&(e.integrity=a),e.src=c,e.addEventListener("load",l,{once:!0}),e.addEventListener("error",()=>{r[n]=!1},{once:!0}),t.appendChild(e),r[n]=!0}function _(t){let e=o.getElementById("shopify-origin-trials");if(!e||r.__shopifyOriginTrialsDone){t();return}e.addEventListener("load",t,{once:!0}),e.addEventListener("error",t,{once:!0})}function i(){_(()=>r.setTimeout(f,0))}function m(){o.addEventListener("DOMContentLoaded",i,{once:!0})}p()?i():m()}s("\/\/www.clinique.com\/cdn\/shopifycloud\/storefront\/assets\/storefront\/webmcp-c6b62ece.js","sha256-ke4DDuBjdvea3vxLWxHc9E9nq8zihuG4IfYEGbb77ys=");})();
317</script>
vendor: 1 bytes, line 317
317
318<script data-source-attribution="shopify.dynamic_checkout.dynamic.init">var Shopify=Shopify||{};Shopify.PaymentButton=Shopify.PaymentButton||{isStorefrontPortableWallets:!0,init:function(){window.Shopify.PaymentButton.init=function(){};var t=document.createElement("script");t.src="https://www.clinique.com/cdn/shopifycloud/portable-wallets/latest/portable-wallets.en.js",t.type="module",document.head.appendChild(t)}};
319</script>
vendor: 1 bytes, line 319
319
320<script data-source-attribution="shopify.dynamic_checkout.buyer_consent">
321  function portableWalletsHideBuyerConsent(e){var t=document.getElementById("shopify-buyer-consent"),n=document.getElementById("shopify-subscription-policy-button");t&&n&&(t.classList.add("hidden"),t.setAttribute("aria-hidden","true"),n.removeEventListener("click",e))}function portableWalletsShowBuyerConsent(e){var t=document.getElementById("shopify-buyer-consent"),n=document.getElementById("shopify-subscription-policy-button");t&&n&&(t.classList.remove("hidden"),t.removeAttribute("aria-hidden"),n.addEventListener("click",e))}window.Shopify?.PaymentButton&&(window.Shopify.PaymentButton.hideBuyerConsent=portableWalletsHideBuyerConsent,window.Shopify.PaymentButton.showBuyerConsent=portableWalletsShowBuyerConsent);
322</script>
vendor: 1 bytes, line 322
322
323<script data-source-attribution="shopify.dynamic_checkout.cart.bootstrap">document.addEventListener("DOMContentLoaded",(function(){function t(){return document.querySelector("shopify-accelerated-checkout-cart, shopify-accelerated-checkout")}if(t())Shopify.PaymentButton.init();else{new MutationObserver((function(e,n){t()&&(Shopify.PaymentButton.init(),n.disconnect())})).observe(document.body,{childList:!0,subtree:!0})}}));
324</script>
324
325<link id="shopify-accelerated-checkout-styles" rel="stylesheet" media="screen" href="https://www.clinique.com/cdn/shopifycloud/portable-wallets/latest/accelerated-checkout-backwards-compat.css" crossorigin="anonymous">
326<style id="shopify-accelerated-checkout-cart">
327        #shopify-buyer-consent {
328  margin-top: 1em;
329  display: inline-block;
330  width: 100%;
331}
332
333#shopify-buyer-consent.hidden {
334  display: none;
335}
336
337#shopify-subscription-policy-button {
338  background: none;
339  border: none;
340  padding: 0;
341  text-decoration: underline;
342  font-size: inherit;
343  cursor: pointer;
344}
345
346#shopify-subscription-policy-button::before {
347  box-shadow: none;
348}
349
350      </style>
351<link rel="stylesheet" media="screen" href="//www.clinique.com/cdn/shop/t/104/compiled_assets/styles.css?v=137381772481659415871790697846">
352<script id="shopify-cfh-end">window.performance && window.performance.mark && window.performance.mark('shopify.content_for_header.end');</script>
352
353<style data-shopify>
354  :root,
355    .color-scheme-1 {--color-background: #ffffff;
356    --color-foreground: #1a1a1a;
357    --color-foreground-secondary: #666666;
358    --color-accent-01: #adddb7;
359    --color-accent-02: #ffffff;
360    --color-border-01: #cccccc;
361    --color-border-02: #e6e6e6;
362    --color-disabled: #cccccc;
363    --color-link: #1a1a1a;--button-primary-color: #ffffff;--button-primary-hover-color: #000000;--button-primary-disabled-color: #999999;--button-primary-bg: #000000;--button-primary-hover-bg: #ffffff;--button-primary-disabled-bg: #ffffff;--button-primary-border: #000000;--button-primary-hover-border: #000000;--button-primary-border-disabled: #cccccc;--button-secondary-color: #000000;--button-secondary-hover-color: #ffffff;--button-secondary-disabled-color: #999999;--button-secondary-bg: rgba(0,0,0,0);--button-secondary-hover-bg: #000000;--button-secondary-disabled-bg: #ffffff;--button-secondary-border: #000000;--button-secondary-hover-border: #000000;--button-secondary-border-disabled: #cccccc;--button-tertiary-color: #000000;--button-tertiary-hover-color: #000000;--button-tertiary-disabled-color: #cccccc;--button-tertiary-bg: rgba(0,0,0,0);--button-tertiary-hover-bg: rgba(0,0,0,0);--button-tertiary-disabled-bg: rgba(0,0,0,0);--button-tertiary-border: #000000;--button-tertiary-hover-border: #000000;--button-tertiary-border-disabled: #cccccc;}
364  
365    .color-scheme-2 {--color-background: #fafafa;
366    --color-foreground: #1a1a1a;
367    --color-foreground-secondary: #666666;
368    --color-accent-01: #adddb7;
369    --color-accent-02: #ffffff;
370    --color-border-01: #cccccc;
371    --color-border-02: #e6e6e6;
372    --color-disabled: #cccccc;
373    --color-link: #1a1a1a;--button-primary-color: #ffffff;--button-primary-hover-color: #000000;--button-primary-disabled-color: #999999;--button-primary-bg: #000000;--button-primary-hover-bg: #ffffff;--button-primary-disabled-bg: #ffffff;--button-primary-border: #000000;--button-primary-hover-border: #000000;--button-primary-border-disabled: #cccccc;--button-secondary-color: #000000;--button-secondary-hover-color: #ffffff;--button-secondary-disabled-color: #999999;--button-secondary-bg: rgba(0,0,0,0);--button-secondary-hover-bg: #000000;--button-secondary-disabled-bg: #ffffff;--button-secondary-border: #000000;--button-secondary-hover-border: #000000;--button-secondary-border-disabled: #cccccc;--button-tertiary-color: #000000;--button-tertiary-hover-color: #000000;--button-tertiary-disabled-color: #cccccc;--button-tertiary-bg: rgba(0,0,0,0);--button-tertiary-hover-bg: rgba(0,0,0,0);--button-tertiary-disabled-bg: rgba(0,0,0,0);--button-tertiary-border: #000000;--button-tertiary-hover-border: #000000;--button-tertiary-border-disabled: #cccccc;}
374  
375    .color-scheme-3 {--color-background: #000000;
376    --color-foreground: #ffffff;
377    --color-foreground-secondary: #cccccc;
378    --color-accent-01: #adddb7;
379    --color-accent-02: #ffffff;
380    --color-border-01: #666666;
381    --color-border-02: #cccccc;
382    --color-disabled: #666666;
383    --color-link: #ffffff;--button-primary-color: #000000;--button-primary-hover-color: #ffffff;--button-primary-disabled-color: #999999;--button-primary-bg: #ffffff;--button-primary-hover-bg: #000000;--button-primary-disabled-bg: #ffffff;--button-primary-border: #ffffff;--button-primary-hover-border: #ffffff;--button-primary-border-disabled: #cccccc;--button-secondary-color: #ffffff;--button-secondary-hover-color: #000000;--button-secondary-disabled-color: #999999;--button-secondary-bg: rgba(0,0,0,0);--button-secondary-hover-bg: #ffffff;--button-secondary-disabled-bg: #ffffff;--button-secondary-border: #ffffff;--button-secondary-hover-border: #ffffff;--button-secondary-border-disabled: #cccccc;--button-tertiary-color: #ffffff;--button-tertiary-hover-color: #ffffff;--button-tertiary-disabled-color: #cccccc;--button-tertiary-bg: rgba(0,0,0,0);--button-tertiary-hover-bg: rgba(0,0,0,0);--button-tertiary-disabled-bg: rgba(0,0,0,0);--button-tertiary-border: #ffffff;--button-tertiary-hover-border: #ffffff;--button-tertiary-border-disabled: #cccccc;}
384  
385    .color-scheme-4 {--color-background: #666666;
386    --color-foreground: #ffffff;
387    --color-foreground-secondary: #cccccc;
388    --color-accent-01: #adddb7;
389    --color-accent-02: #ffffff;
390    --color-border-01: #666666;
391    --color-border-02: #cccccc;
392    --color-disabled: #666666;
393    --color-link: #ffffff;--button-primary-color: #000000;--button-primary-hover-color: #ffffff;--button-primary-disabled-color: #999999;--button-primary-bg: #ffffff;--button-primary-hover-bg: #000000;--button-primary-disabled-bg: #ffffff;--button-primary-border: #ffffff;--button-primary-hover-border: #ffffff;--button-primary-border-disabled: #cccccc;--button-secondary-color: #ffffff;--button-secondary-hover-color: #000000;--button-secondary-disabled-color: #999999;--button-secondary-bg: rgba(0,0,0,0);--button-secondary-hover-bg: #ffffff;--button-secondary-disabled-bg: #ffffff;--button-secondary-border: #ffffff;--button-secondary-hover-border: #ffffff;--button-secondary-border-disabled: #cccccc;--button-tertiary-color: #ffffff;--button-tertiary-hover-color: #ffffff;--button-tertiary-disabled-color: #cccccc;--button-tertiary-bg: rgba(0,0,0,0);--button-tertiary-hover-bg: rgba(0,0,0,0);--button-tertiary-disabled-bg: rgba(0,0,0,0);--button-tertiary-border: #ffffff;--button-tertiary-hover-border: #ffffff;--button-tertiary-border-disabled: #cccccc;}
394  
395    .color-scheme-5 {--color-background: rgba(0,0,0,0);
396    --color-foreground: #ffffff;
397    --color-foreground-secondary: #cccccc;
398    --color-accent-01: #adddb7;
399    --color-accent-02: #ffffff;
400    --color-border-01: #666666;
401    --color-border-02: #cccccc;
402    --color-disabled: #666666;
403    --color-link: #ffffff;--button-primary-color: #000000;--button-primary-hover-color: #ffffff;--button-primary-disabled-color: #999999;--button-primary-bg: #ffffff;--button-primary-hover-bg: #000000;--button-primary-disabled-bg: #ffffff;--button-primary-border: #ffffff;--button-primary-hover-border: #ffffff;--button-primary-border-disabled: #cccccc;--button-secondary-color: #ffffff;--button-secondary-hover-color: #000000;--button-secondary-disabled-color: #999999;--button-secondary-bg: rgba(0,0,0,0);--button-secondary-hover-bg: #ffffff;--button-secondary-disabled-bg: #ffffff;--button-secondary-border: #ffffff;--button-secondary-hover-border: #ffffff;--button-secondary-border-disabled: #cccccc;--button-tertiary-color: #ffffff;--button-tertiary-hover-color: #ffffff;--button-tertiary-disabled-color: #cccccc;--button-tertiary-bg: rgba(0,0,0,0);--button-tertiary-hover-bg: rgba(0,0,0,0);--button-tertiary-disabled-bg: rgba(0,0,0,0);--button-tertiary-border: #ffffff;--button-tertiary-hover-border: #ffffff;--button-tertiary-border-disabled: #cccccc;}
404  
405    .color-scheme-7e95cfdb-88b8-42ad-beb3-bc5821fc49a4 {--color-background: #adddb7;
406    --color-foreground: #1a1a1a;
407    --color-foreground-secondary: #666666;
408    --color-accent-01: #ffffff;
409    --color-accent-02: #ffffff;
410    --color-border-01: #cccccc;
411    --color-border-02: #e6e6e6;
412    --color-disabled: #cccccc;
413    --color-link: #1a1a1a;--button-primary-color: #ffffff;--button-primary-hover-color: #000000;--button-primary-disabled-color: #999999;--button-primary-bg: #000000;--button-primary-hover-bg: #ffffff;--button-primary-disabled-bg: #ffffff;--button-primary-border: #000000;--button-primary-hover-border: #000000;--button-primary-border-disabled: #cccccc;--button-secondary-color: #000000;--button-secondary-hover-color: #ffffff;--button-secondary-disabled-color: #999999;--button-secondary-bg: rgba(0,0,0,0);--button-secondary-hover-bg: #000000;--button-secondary-disabled-bg: #ffffff;--button-secondary-border: #000000;--button-secondary-hover-border: #000000;--button-secondary-border-disabled: #cccccc;--button-tertiary-color: #000000;--button-tertiary-hover-color: #000000;--button-tertiary-disabled-color: #cccccc;--button-tertiary-bg: rgba(0,0,0,0);--button-tertiary-hover-bg: rgba(0,0,0,0);--button-tertiary-disabled-bg: rgba(0,0,0,0);--button-tertiary-border: #000000;--button-tertiary-hover-border: #000000;--button-tertiary-border-disabled: #cccccc;}
414  
415    .color-scheme-00772c4c-7c65-4dfa-8779-ddb27e613bca {--color-background: rgba(0,0,0,0);
416    --color-foreground: #1a1a1a;
417    --color-foreground-secondary: #666666;
418    --color-accent-01: #adddb7;
419    --color-accent-02: #ffffff;
420    --color-border-01: #cccccc;
421    --color-border-02: #e6e6e6;
422    --color-disabled: #cccccc;
423    --color-link: #1a1a1a;--button-primary-color: #ffffff;--button-primary-hover-color: #000000;--button-primary-disabled-color: #999999;--button-primary-bg: #000000;--button-primary-hover-bg: #ffffff;--button-primary-disabled-bg: #ffffff;--button-primary-border: #000000;--button-primary-hover-border: #000000;--button-primary-border-disabled: #cccccc;--button-secondary-color: #000000;--button-secondary-hover-color: #ffffff;--button-secondary-disabled-color: #999999;--button-secondary-bg: rgba(0,0,0,0);--button-secondary-hover-bg: #000000;--button-secondary-disabled-bg: #ffffff;--button-secondary-border: #000000;--button-secondary-hover-border: #000000;--button-secondary-border-disabled: #cccccc;--button-tertiary-color: #000000;--button-tertiary-hover-color: #000000;--button-tertiary-disabled-color: #cccccc;--button-tertiary-bg: rgba(0,0,0,0);--button-tertiary-hover-bg: rgba(0,0,0,0);--button-tertiary-disabled-bg: rgba(0,0,0,0);--button-tertiary-border: #000000;--button-tertiary-hover-border: #000000;--button-tertiary-border-disabled: #cccccc;}
424  
425</style>
426<style data-shopify>
427:root {--color-danger: #DD0000;--color-warning: #FFE7B6;--color-success: #78AC83;--color-focus: #3B52E8;}
428</style>
429
430
431
432
433  <link rel='preload' href='//www.clinique.com/cdn/shop/t/104/assets/index.IviYpGM_.min.css' as='style'>
434  <link
435    rel='stylesheet'
436    href='//www.clinique.com/cdn/shop/t/104/assets/index.IviYpGM_.min.css'
437    media='print'
438    onload='this.media="all";this.onload=null;'
439    
440      id='main-stylesheet'
441    
442  >
443  <noscript>
444    <link
445      rel='stylesheet'
446      href='//www.clinique.com/cdn/shop/t/104/assets/index.IviYpGM_.min.css'
447      
448        id='main-stylesheet'
449      
450    >
451  </noscript>
452<script>
453  
454  document.documentElement.className = document.documentElement.className.replace('no-js', 'js')
455</script>
455
456
457<script>
458  
459  window.routes = {
460    cart_add_url: '/cart/add',
461    cart_change_url: '/cart/change',
462    cart_update_url: '/cart/update',
463  }
464
465  window.cartStrings = {
466    error: `There was an error while updating your cart. Please try again.`,
467    quantityError: `You can only add {{ quantity }} of this item to your cart.`,
468    itemCountOne: `{{ count }} item`,
469    itemCountOther: `{{ count }} items`,
470  }
471
472  window.variantStrings = {
473    addToCart: `Add to Bag`,
474    soldOut: `Out of Stock`,
475    unavailable: `Unavailable`,
476  }
477
478  
479  window.__STOREFRONT_ACCESS_TOKEN__ = ""
480  window.__CART__ = {"note":null,"attributes":{},"original_total_price":0,"total_price":0,"total_discount":0,"total_weight":0.0,"item_count":0,"items":[],"requires_shipping":false,"currency":"USD","items_subtotal_price":0,"cart_level_discount_applications":[],"checkout_charge_amount":0}
481
482  
483  window.__T1_PROXY_BASE__ = "\/apps\/talonone-proxy\/api\/public"
484  window.__VENDORS__ = {
485    nosto: {
486      enabled: false ?? false
487    },
488  }
489
490  
491  window.__FHR_CONFIG__ = {
492    env: "live1",
493    region: "us1",
494    store: "clinique_us",
495    scope: "\/\/catalog01\/en_US"
496  }
497</script>
497
498
499
500
501
502
503  
503<script src="//www.clinique.com/cdn/shop/t/104/assets/core-app-provider.SlgOxSuS.min.js" type="module" crossorigin="anonymous"></script>
503
504  <link rel="modulepreload" href="//www.clinique.com/cdn/shop/t/104/assets/aria-live-region-context.Cpevadk3.min.js" crossorigin="anonymous">
505  <link rel="modulepreload" href="//www.clinique.com/cdn/shop/t/104/assets/cart-sections.BcMbGr3r.min.js" crossorigin="anonymous">
506  <link rel="modulepreload" href="//www.clinique.com/cdn/shop/t/104/assets/deferred-media.CV21xjbU.min.js" crossorigin="anonymous">
507  <link rel="modulepreload" href="//www.clinique.com/cdn/shop/t/104/assets/modal-context.CE7TbCWB.min.js" crossorigin="anonymous">
508  <link rel="modulepreload" href="//www.clinique.com/cdn/shop/t/104/assets/quickshop.CfUuCQCc.min.js" crossorigin="anonymous">
509  <link rel="modulepreload" href="//www.clinique.com/cdn/shop/t/104/assets/vendor-lit.2u3dzq2T.min.js" crossorigin="anonymous">
510
511
512
513
514  
514<script src="//www.clinique.com/cdn/shop/t/104/assets/core-global.BpgdXxhs.min.js" type="module" crossorigin="anonymous"></script>
514
515  <link rel="modulepreload" href="//www.clinique.com/cdn/shop/t/104/assets/preload-helper.M8DPJa5q.min.js" crossorigin="anonymous">
516  <link rel="modulepreload" href="//www.clinique.com/cdn/shop/t/104/assets/vendor.D2HIaoTS.min.js" crossorigin="anonymous">
517  <link rel="modulepreload" href="//www.clinique.com/cdn/shop/t/104/assets/revive.CLV8-SeV.min.js" crossorigin="anonymous">
518
519
520
521
522  
522<script src="//www.clinique.com/cdn/shop/t/104/assets/carousel-fits.Q3mPBIA-.min.js" type="module" crossorigin="anonymous"></script>
522
523
524
525
526
527  
527<script src="//www.clinique.com/cdn/shop/t/104/assets/core-icon.Cau1cGTi.min.js" type="module" crossorigin="anonymous"></script>
527
528  <link rel="modulepreload" href="//www.clinique.com/cdn/shop/t/104/assets/BaseElement.wji90fuE.min.js" crossorigin="anonymous">
529  <link rel="modulepreload" href="//www.clinique.com/cdn/shop/t/104/assets/vendor-lit.2u3dzq2T.min.js" crossorigin="anonymous">
530  <link rel="modulepreload" href="//www.clinique.com/cdn/shop/t/104/assets/vendor.D2HIaoTS.min.js" crossorigin="anonymous">
531
532
533  <link href="//www.clinique.com/cdn/shop/t/104/assets/icons.svg?v=158214021495967969081790357996" as="fetch" type="image/svg+xml" crossorigin="anonymous" rel="preload">
534
535
536<!-- BEGIN app block: shopify://apps/fredhopper-product-discovery/blocks/credentials-sdk-embed/8076bb16-bced-4451-900e-ee6afc486221 -->
537
538<script src="https://cdn.shopify.com/extensions/01a01a96-0548-7cfe-afd6-50b050ceb73b/fredhopper-product-discovery-66/assets/fredhopper-sdk.js" async></script>
538
539
540
541<script>
542  const crownpeakCredentials = '6c8061e5c4c43a07e7b747f6f5449ac1:AFSOg9hbsNoc1j1N27YMLLi3sccuHC067MaX83NliGYTbPtdRIatwBOOyAxs8lmTBT47+KeYLA82hlk6Xtz2tNNzMu3EbrGnvIjk3CpH05ooFiKPcSEaCPqVWoUUQ2qMadg/5rBOt7gmMVpMKKhM/k5jHz3SsGanY6d/jj5/mCU=';
543  window.fredhopper = window.fredhopper || {};
544  window.fredhopper.credentials = window.fredhopper.credentials || {};
545  window.fredhopper.credentials.hash = crownpeakCredentials;
546</script>
546
547
548
549<script>
550  (function () {
551    var language = "en";
552    var country = "US";
553    var market = "us";
554
555    // Without both halves the pixel omits metadata.locale rather than guessing a region.
556    if (!language || !country) return;
557
558    document.cookie = 'crownpeak-locale=' + language + '~' + country + '; path=/; SameSite=Lax';
559
560    function publishLocale() {
561      if (window.Shopify && window.Shopify.analytics) {
562        window.Shopify.analytics.publish('crownpeak_locale', {
563          language: language,
564          country: country,
565          market: market
566        });
567      }
568    }
569
570    if (document.readyState === 'loading') {
571      document.addEventListener('DOMContentLoaded', publishLocale);
572    } else {
573      publishLocale();
574    }
575  })();
576</script>
576
577
578
579<!-- END app block --><link href="https://monorail-edge.shopifysvc.com" rel="dns-prefetch">
580<script>(function(){if ("sendBeacon" in navigator && "performance" in window) {try {var session_token_from_headers = performance.getEntriesByType('navigation')[0].serverTiming.find(x => x.name == '_s').description;} catch {var session_token_from_headers = undefined;}var session_cookie_matches = document.cookie.match(/_shopify_s=([^;]*)/);var session_token_from_cookie = session_cookie_matches && session_cookie_matches.length === 2 ? session_cookie_matches[1] : "";var session_token = session_token_from_headers || session_token_from_cookie || "";function handle_abandonment_event(e) {var entries = performance.getEntries().filter(function(entry) {return /monorail-edge.shopifysvc.com/.test(entry.name);});if (!window.abandonment_tracked && entries.length === 0) {window.abandonment_tracked = true;var currentMs = Date.now();var navigation_start = performance.timing.navigationStart;var payload = {shop_id: 73815621771,url: window.location.href,navigation_start,duration: currentMs - navigation_start,session_token,page_type: "cart"};window.navigator.sendBeacon("https://monorail-edge.shopifysvc.com/v1/produce", JSON.stringify({schema_id: "online_store_buyer_site_abandonment/1.1",payload: payload,metadata: {event_created_at_ms: currentMs,event_sent_at_ms: currentMs}}));}}window.addEventListener('pagehide', handle_abandonment_event);}}());</script>
vendor: 1 bytes, line 580
580
581<script>
582  window.__TREKKIE_SHIM_QUEUE = window.__TREKKIE_SHIM_QUEUE || [];
583</script>
vendor: 1 bytes, line 583
583
584<script>(function(){var wpmLoader=function(){"use strict";var e=/Googlebot|Storebot-Google|bingbot|Baiduspider|YandexBot|DuckDuckBot|Slurp|facebookexternalhit|Twitterbot|LinkedInBot|Applebot|AdsBot-Google|Mediapartners-Google|APIs-Google|PetalBot|SemrushBot|AhrefsBot|MJ12bot|DotBot|Acunetix|PerplexityBot|Perplexity-User/i,t=/bytedance/i;function i(){try{var e=document.cookie;if(!e||"string"!=typeof e)return;for(var t=0,i=e.split(";");t<i.length;t++){var n=i[t],r=n.indexOf("=");if(-1!==r){var o=n.slice(0,r).trim();if(o){var a=void 0;try{a=decodeURIComponent(o)}catch(e){a=o}if("_shopify_s"===a){var d=n.slice(r+1).trim();try{return decodeURIComponent(d)}catch(e){return d}}}}}return}catch(e){return}}function n(e){try{"undefined"!=typeof console&&"function"==typeof console.warn&&console.warn(e)}catch(e){}}function r(e,t){return"string"==typeof e&&e.length>0&&e.length<=t?e:void 0}function o(e){var t;switch(null==(t=null==e?void 0:e.navigation)?void 0:t.type){case 0:return"navigate";case 1:return"reload";case 2:return"back_forward";default:return}}function a(){var e,t,i;try{var n=null==(i=null==(t=null==(e=self.ShopifyAnalytics)?void 0:e.lib)?void 0:t.trekkie)?void 0:i.state;return"awaiting-consent"===n||"initialized"===n?n:void 0}catch(e){return}}return function(d,s,u,l){var c=arguments.length>4&&void 0!==arguments[4]?arguments[4]:{};try{var p=c.trekkieShim;!0!==p&&"true"!==p||null!=window.__TREKKIE_SHIM_QUEUE||(window.__TREKKIE_SHIM_QUEUE=[])}catch(e){}var f,v,h,y,g=(v=(f={modern:/Edge?\/(1{2}[4-9]|1[2-9]\d|[2-9]\d{2}|\d{4,})\.\d+(\.\d+|)|Firefox\/(1{2}[4-9]|1[2-9]\d|[2-9]\d{2}|\d{4,})\.\d+(\.\d+|)|Chrom(ium|e)\/(9{2}|\d{3,})\.\d+(\.\d+|)|(Maci|X1{2}).+ Version\/(15\.\d+|(1[6-9]|[2-9]\d|\d{3,})\.\d+)([,.]\d+|)( \(\w+\)|)( Mobile\/\w+|) Safari\/|Chrome.+OPR\/(9{2}|\d{3,})\.\d+\.\d+|(CPU[ +]OS|iPhone[ +]OS|CPU[ +]iPhone|CPU IPhone OS|CPU iPad OS)[ +]+(15[._]\d+|(1[6-9]|[2-9]\d|\d{3,})[._]\d+)([._]\d+|)|Android:?[ /-](14[89]|1[5-9]\d|[2-9]\d{2}|\d{4,})(\.\d+|)(\.\d+|)|Android.+Firefox\/(15\d|1[6-9]\d|[2-9]\d{2}|\d{4,})\.\d+(\.\d+|)|Android.+Chrom(ium|e)\/(14[89]|1[5-9]\d|[2-9]\d{2}|\d{4,})\.\d+(\.\d+|)|SamsungBrowser\/([2-9]\d|\d{3,})\.\d+/,legacy:/Edge?\/(1[6-9]|[2-9]\d|\d{3,})\.\d+(\.\d+|)|Firefox\/(5[4-9]|[6-9]\d|\d{3,})\.\d+(\.\d+|)|Chrom(ium|e)\/(5[1-9]|[6-9]\d|\d{3,})\.\d+(\.\d+|)([\d.]+$|.*Safari\/(?![\d.]+ Edge\/[\d.]+$))|(Maci|X1{2}).+ Version\/(10\.\d+|(1[1-9]|[2-9]\d|\d{3,})\.\d+)([,.]\d+|)( \(\w+\)|)( Mobile\/\w+|) Safari\/|Chrome.+OPR\/(3[89]|[4-9]\d|\d{3,})\.\d+\.\d+|(CPU[ +]OS|iPhone[ +]OS|CPU[ +]iPhone|CPU IPhone OS|CPU iPad OS)[ +]+(10[._]\d+|(1[1-9]|[2-9]\d|\d{3,})[._]\d+)([._]\d+|)|Android:?[ /-](14[89]|1[5-9]\d|[2-9]\d{2}|\d{4,})(\.\d+|)(\.\d+|)|Mobile Safari.+OPR\/([89]\d|\d{3,})\.\d+\.\d+|Android.+Firefox\/(15\d|1[6-9]\d|[2-9]\d{2}|\d{4,})\.\d+(\.\d+|)|Android.+Chrom(ium|e)\/(14[89]|1[5-9]\d|[2-9]\d{2}|\d{4,})\.\d+(\.\d+|)|Android.+(UC? ?Browser|UCWEB|U3)[ /]?(15\.([5-9]|\d{2,})|(1[6-9]|[2-9]\d|\d{3,})\.\d+)\.\d+|SamsungBrowser\/(5\.\d+|([6-9]|\d{2,})\.\d+)|Android.+MQ{2}Browser\/(14(\.(9|\d{2,})|)|(1[5-9]|[2-9]\d|\d{3,})(\.\d+|))(\.\d+|)|K[Aa][Ii]OS\/(3\.\d+|([4-9]|\d{2,})\.\d+)(\.\d+|)/}).modern,h=f.legacy,(y=navigator.userAgent).match(e)?"bot":y.match(v)?"modern":y.match(h)?"legacy":y.match(t)?"bot":"unknown"),m=function(e){var t,i,n=r(e,128);try{var a=window.performance,d=null==(t=null==a?void 0:a.getEntriesByType)?void 0:t.call(a,"navigation")[0];if(!d)return{requestId:n,navigationType:o(a)};var s="type"in d?r(d.type,64):void 0,u="serverTiming"in d&&Array.isArray(d.serverTiming)?d.serverTiming:[];return{requestId:null!=n?n:r(null==(i=u.find(function(e){return"requestID"===e.name}))?void 0:i.description,128),navigationType:s}}catch(e){return{requestId:n}}}(c.requestId),w=function(e){var t=e.version,r=e.browserTarget,o=e.surface,a=e.shopId,d=e.monorailEndpoint,s=window.location.href;return{emit:function(e){var u=e.status,l=e.errorMsg,c=e.failureReason,p=e.useKeepaliveFallback,f=void 0!==p&&p,v=e.navigationType,h=e.pagehidePersisted,y=e.requestId,g=e.trekkieState;if(d){var m,w;try{var b=(new Date).getTime();m=JSON.stringify({metadata:{event_sent_at_ms:b},events:[{schema_id:"web_pixels_manager_load/3.3",payload:{version:t,bundle_target:r,page_url:s,status:u,surface:o,error_msg:l,failure_reason:c,navigation_type:v,pagehide_persisted:h,request_id:y,trekkie_state:g,shop_id:a,visit_token:i()},metadata:{event_created_at_ms:b}}]})}catch(e){return}try{if("function"==typeof window.navigator.sendBeacon&&-1===(w=window.navigator.userAgent).indexOf("iPhone; CPU iPhone OS 12_")&&-1===w.indexOf("iPad; CPU OS 12_")&&-1===w.indexOf("iPod touch; CPU iPhone OS 12_")&&window.navigator.sendBeacon.bind(window.navigator)(d,m))return}catch(e){}if(f)try{"function"==typeof window.fetch&&window.fetch(d,{method:"POST",headers:{"Content-Type":"text/plain"},body:m,keepalive:!0}
584).catch(function(){})}catch(e){}else try{var _=new XMLHttpRequest;_.open("POST",d,!0),_.setRequestHeader("Content-Type","text/plain"),_.send(m)}catch(e){n("[Web Pixels Manager] Got an unhandled error while logging to Monorail.")}}else n("[Web Pixels Manager] No Monorail endpoint provided, skipping logging.")}}}({version:u,browserTarget:g,surface:d.surface,shopId:d.shopId,monorailEndpoint:d.monorailEndpoint});if(Boolean(null==(_=null==(b=window.Shopify)?void 0:b.analytics)?void 0:_.replayQueue))w.emit({status:"setup-skipped",errorMsg:"replay queue already initialized."});else{var b,_;w.emit({status:"setup-started"}),window.Shopify=window.Shopify||{};var S=window.Shopify;S.analytics=S.analytics||{};var P=S.analytics;P.replayQueue=[],P.publish=function(e,t,i){return P.replayQueue.push([e,t,i]),!0};try{self.performance.mark("wpm:start")}catch(e){}var k,C="modern"===g?"modern":"legacy",E=(null!=l?l:{modern:"",legacy:""})[C],I=[(k={baseUrl:s,hashVersion:u,buildTarget:C}).baseUrl,"/wpm","/b",k.hashVersion,"modern"===k.buildTarget?"m":"l",".js"].join(""),O=!1,T=!1;try{c.browserTarget=g,function(){O=!0;try{window.addEventListener("pagehide",M)}catch(e){O=!1}}(),R(function(){try{R(x)}catch(e){D(e)}}),w.emit({status:"loading",requestId:m.requestId,navigationType:m.navigationType,trekkieState:a()})}catch(e){D(e)}}function U(){var e;if(q(),!function(){var e,t;return Boolean(null==(t=null==(e=window.Shopify)?void 0:e.analytics)?void 0:t.initialized)}()){var t,i,n;try{if("function"!=typeof(null==(e=window.webPixelsManager)?void 0:e.init))return void A();if(!(null!==(n=i=t=window.webPixelsManager.init(d))&&"function"!=typeof n&&Object(n)===n&&"publish"in i&&"function"==typeof i.publish&&"publishCustomEvent"in i&&"function"==typeof i.publishCustomEvent&&"visitor"in i&&"function"==typeof i.visitor))return void A()}catch(e){return void A(e)}var r=window.Shopify.analytics;r.replayQueue.forEach(function(e){var i=e[0],n=e[1],r=e[2];t.publishCustomEvent(i,n,r)}),r.replayQueue=[],r.publish=t.publishCustomEvent,r.visitor=t.visitor,r.initialized=!0}}function A(e){B("manager_api_unavailable",void 0===e?void 0:Q(e))}function x(){B("script_load_failed","".concat(I," has failed to load"))}function B(e,t){T||(T=!0,q(),w.emit({status:"failed",errorMsg:t,failureReason:e,requestId:m.requestId,navigationType:m.navigationType,trekkieState:a()}))}function M(e){O&&(q(),w.emit({status:"pagehide-while-loading",useKeepaliveFallback:!0,pagehidePersisted:e.persisted,requestId:m.requestId,navigationType:m.navigationType,trekkieState:a()}))}function q(){O=!1;try{window.removeEventListener("pagehide",M)}catch(e){}}function R(e){var t;!function(e){var t=e.src,i=e.async,n=void 0===i||i,r=e.onload,o=e.onerror,a=e.sri,d=e.scriptDataAttributes,s=void 0===d?{}:d,u=document.createElement("script"),l=document.querySelector("head"),c=document.querySelector("body");if(u.async=n,u.src=t,a&&(u.integrity=a,u.crossOrigin="anonymous"),s)for(var p in s)if(Object.prototype.hasOwnProperty.call(s,p))try{u.dataset[p]=String(s[p])}catch(e){}if(r&&u.addEventListener("load",r),o&&u.addEventListener("error",o),l)l.appendChild(u);else{if(!c)throw new Error("Did not find a head or body element to append the script");c.appendChild(u)}}({src:I,async:!0,onload:U,onerror:e,sri:(t=E,"string"==typeof t&&/^sha384-[A-Za-z0-9+/=]+$/.test(t)?E:""),scriptDataAttributes:c})}function D(e){B("script_append_failed",Q(e))}function Q(e){return e instanceof Error?e.message:"Unknown error"}}}();wpmLoader({shopId: 73815621771,storefrontBaseUrl: "https://www.clinique.com",extensionsBaseUrl: "https://extensions.shopifycdn.com/cdn/shopifycloud/web-pixels-manager",monorailEndpoint: "https://www.clinique.com/.well-known/shopify/monorail/unstable/produce_batch",surface: "storefront-renderer",enabledBetaFlags: ["4c64608a","16072cab","8450a54b","7ee89bf1"],webPixelsConfigList: [{"id":"2463498435","configuration":"{\"appSettingSchemaVersion\":\"2.0\",\"sdkUrl\":\"sdk.iad-06.braze.com\",\"sdkVersion\":\"6.8.0\",\"userTrackingBehavior\":\"on_visit\",\"apiKey\":\"4005379f-4bae-4b04-8635-cb81c57d2ea7\",\"shopDomain\":\"elc-us-cl-prod.myshopify.com\",\"features\":\"WEB_SDK_FEATURE,ACCOUNT_LOGIN_FEATURE,VIEW_PRODUCTS_FEATURE,PURCHASE_COMMERCE_EVENTS_FEATURE,IN_BROW
584SER_MESSAGES_FEATURE\",\"appEmbedEnabled\":\"true\",\"selectedExternalId\":\"shopify-customer-id\",\"customIdEndpoint\":\"none\",\"thirdPartyTagManagerEnabled\":\"false\"}","eventPayloadVersion":"v1","runtimeContext":"STRICT","scriptVersion":"822da2ffc90491a56bbbb828cb94f546","type":"APP","apiClientId":4371083,"privacyPurposes":["ANALYTICS","MARKETING"],"dataSharingAdjustments":{"protectedCustomerApprovalScopes":["read_customer_address","read_customer_email","read_customer_name","read_customer_personal_data","read_customer_phone"],"dataSharingControls":["share_all_events"]},"dataSharingState":"optimized"},{"id":"2463334595","configuration":"{\"accountID\":\"3c70737a-352b-4cb6-8a74-75221db5a43f\"}","eventPayloadVersion":"v1","runtimeContext":"STRICT","scriptVersion":"f6185fe0ed9245b68125d7904ffd9d70","type":"APP","apiClientId":97976549377,"privacyPurposes":["ANALYTICS","MARKETING"],"dataSharingAdjustments":{"protectedCustomerApprovalScopes":["read_customer_address","read_customer_email","read_customer_name","read_customer_personal_data"],"dataSharingControls":["share_all_events"]},"dataSharingState":"optimized"},{"id":"2463269059","configuration":"{\"webhookEndpoint\":\"https:\/\/webhooks.fivetran.com\/internal\/0676639e-195f-4c9e-ac7c-29e6f3fcbf21\",\"includedEvents\":\"search_submitted\"}","eventPayloadVersion":"v1","runtimeContext":"STRICT","scriptVersion":"7a344a9f0c58f3b1ff6255bb24dbeb15","type":"APP","apiClientId":1540791,"privacyPurposes":["ANALYTICS","MARKETING","SALE_OF_DATA"],"dataSharingAdjustments":{"protectedCustomerApprovalScopes":["read_customer_address","read_customer_email","read_customer_name","read_customer_personal_data","read_customer_phone"],"dataSharingControls":["share_all_events"]},"dataSharingState":"optimized"},{"id":"2461827267","configuration":"{\"loggingEnabled\":\"true\",\"serverPixelEnabled\":\"true\",\"useShopifyItemLevelTax\":\"false\",\"ranMid\":\"24775\"}","eventPayloadVersion":"v1","runtimeContext":"STRICT","scriptVersion":"3c4e0707a22db0bd439a5e4b720ea9d0","type":"APP","apiClientId":2531653,"privacyPurposes":["ANALYTICS"],"dataSharingAdjustments":{"protectedCustomerApprovalScopes":["read_customer_address","read_customer_personal_data"],"dataSharingControls":["share_all_events"]},"dataSharingState":"unrestricted"},{"id":"2461499587","configuration":"{\"trackerKey\":\"6a1801d4-14a3-4da6-bfe0-37c05b38bd2e\",\"region\":\"us1\",\"viewEventDelay\":\"1500\"}","eventPayloadVersion":"v1","runtimeContext":"STRICT","scriptVersion":"62449fd64ce79512829790533a3f5309","type":"APP","apiClientId":253726654465,"privacyPurposes":["ANALYTICS","MARKETING","SALE_OF_DATA"],"dataSharingAdjustments":{"protectedCustomerApprovalScopes":[],"dataSharingControls":["share_all_events"]},"dataSharingState":"optimized"},{"id":"156664003","eventPayloadVersion":"1","runtimeContext":"LAX","scriptVersion":"5","type":"CUSTOM","privacyPurposes":[],"name":"Tealium","dataSharingAdjustments":{"protectedCustomerApprovalScopes":[],"dataSharingControls":["share_all_events"]},"dataSharingState":"optimized"},{"id":"shopify-app-pixel","configuration":"{}","eventPayloadVersion":"v1","runtimeContext":"STRICT","scriptVersion":"0530","apiClientId":"shopify-pixel","type":"APP","privacyPurposes":["ANALYTICS","MARKETING"]},{"id":"shopify-custom-pixel","eventPayloadVersion":"v1","runtimeContext":"LAX","scriptVersion":"0530","apiClientId":"shopify-pixel","type":"CUSTOM","privacyPurposes":["ANALYTICS","MARKETING"]}],isMerchantRequest: false,initData: {"shop":{"name":"Clinique Laboratories, LLC","paymentSettings":{"currencyCode":"USD"},"myshopifyDomain":"elc-us-cl-prod.myshopify.com","countryCode":"US","storefrontUrl":"https:\/\/www.clinique.com"},"customer":null,"cart":null,"checkout":null,"productVariants":[],"products":[{"id":"14944581386435","handle":"great-skin-everywhere-for-dry-combination-skin","isCollective":null,"title":null,"type":null,"untranslatedTitle":null,"url":null,"vendor":null,"remoteShopId":null,"variants":[{"id":"54074081542339","image":null,"price":null,"sku":null,"title":null,"untranslatedTitle":null}]},{"id":"14944578601155","handle":"ready-in-5-skincare-makeup-set","isCollective":null,"title":null,"type":null,"untranslatedTitle":null,"url":null,"vendor":null,"remoteShopId":null,"variants":[{"id":"54074077610179","image":null,"price":null,"sku":null,"title":null,"untranslatedTitle":null}]}
584,{"id":"14944327565507","handle":"chubby-stick-shadow-tint-for-eyes","isCollective":null,"title":null,"type":null,"untranslatedTitle":null,"url":null,"vendor":null,"remoteShopId":null,"variants":[{"id":"54073290522819","image":null,"price":null,"sku":null,"title":null,"untranslatedTitle":null}]},{"id":"14944581189827","handle":"clinique-smart-clinical-repair-collagen-pdrn-cream","isCollective":null,"title":null,"type":null,"untranslatedTitle":null,"url":null,"vendor":null,"remoteShopId":null,"variants":[{"id":"54074081345731","image":null,"price":null,"sku":null,"title":null,"untranslatedTitle":null}]},{"id":"14944578568387","handle":"moisture-surge-exfoliating-glow-cleanser","isCollective":null,"title":null,"type":null,"untranslatedTitle":null,"url":null,"vendor":null,"remoteShopId":null,"variants":[{"id":"54074077577411","image":null,"price":null,"sku":null,"title":null,"untranslatedTitle":null}]},{"id":"14944305938627","handle":"moisture-surge-100h-auto-replenishing-hydrator","isCollective":null,"title":null,"type":null,"untranslatedTitle":null,"url":null,"vendor":null,"remoteShopId":null,"variants":[{"id":"54073268568259","image":null,"price":null,"sku":null,"title":null,"untranslatedTitle":null}]},{"id":"14944341622979","handle":"almost-lipstick-in-black-honey-pink-honey-and-nude-honey","isCollective":null,"title":null,"type":null,"untranslatedTitle":null,"url":null,"vendor":null,"remoteShopId":null,"variants":[{"id":"54073304580291","image":null,"price":null,"sku":null,"title":null,"untranslatedTitle":null}]},{"id":"14944327925955","handle":"clinique-happy-in-paradise-limited-edition-eau-de-parfum-spray","isCollective":null,"title":null,"type":null,"untranslatedTitle":null,"url":null,"vendor":null,"remoteShopId":null,"variants":[{"id":"54073290850499","image":null,"price":null,"sku":null,"title":null,"untranslatedTitle":null}]},{"id":"14944333594819","handle":"clinique-for-men-daily-hydrator-broad-spectrum-spf-35","isCollective":null,"title":null,"type":null,"untranslatedTitle":null,"url":null,"vendor":null,"remoteShopId":null,"variants":[{"id":"54073296552131","image":null,"price":null,"sku":null,"title":null,"untranslatedTitle":null}]}],"purchasingCompany":null},},"https://www.clinique.com/cdn","5982071ew7ea472e3p69b68784m2150dfea",{"modern":"","legacy":""},{"trekkieShim":true,"agentContext":true,"apiClientId":"580111","facebookCapiEnabled":"false","themeId":"187530772675","themePublished":"true","eventMetadataId":"4fa5c13c-2b97-48f0-a064-59a457669905","pageType":"cart","shopId":"73815621771","storefrontBaseUrl":"https:\/\/www.clinique.com","extensionBaseUrl":"https:\/\/extensions.shopifycdn.com\/cdn\/shopifycloud\/web-pixels-manager","surface":"storefront-renderer","enabledBetaFlags":"[\"4c64608a\", \"16072cab\", \"8450a54b\", \"7ee89bf1\"]","isMerchantRequest":"false","hashVersion":"5982071ew7ea472e3p69b68784m2150dfea","publish":"custom","events":"[[\"page_viewed\",{}]]"});})();</script>
584<script>
585  window.ShopifyAnalytics = window.ShopifyAnalytics || {};
586  window.ShopifyAnalytics.meta = window.ShopifyAnalytics.meta || {};
587  window.ShopifyAnalytics.meta.currency = 'USD';
588  var meta = {"page":{"pageType":"cart","requestId":"1903d741-9aac-4892-b2cd-c17c52df7f51-1790850511"}};
589  for (var attr in meta) {
590    window.ShopifyAnalytics.meta[attr] = meta[attr];
591  }
592</script>
vendor: 1 bytes, line 592
592
593<script class="analytics">
594  (function () {
595    var customDocumentWrite = function(content) {
596      var jquery = null;
597
598      if (window.jQuery) {
599        jquery = window.jQuery;
600      } else if (window.Checkout && window.Checkout.$) {
601        jquery = window.Checkout.$;
602      }
603
604      if (jquery) {
605        jquery('body').append(content);
606      }
607    };
608
609    var hasLoggedConversion = function(token) {
610      if (token) {
611        return document.cookie.indexOf('loggedConversion=' + token) !== -1;
612      }
613      return false;
614    }
615
616    var setCookieIfConversion = function(token) {
617      if (token) {
618        var twoMonthsFromNow = new Date(Date.now());
619        twoMonthsFromNow.setMonth(twoMonthsFromNow.getMonth() + 2);
620
621        document.cookie = 'loggedConversion=' + token + '; expires=' + twoMonthsFromNow;
622      }
623    }
624
625    var trekkie = window.ShopifyAnalytics.lib = window.trekkie = window.trekkie || [];
626    window.ShopifyAnalytics.lib.trekkie = window.trekkie;
627    if (trekkie.integrations) {
628      return;
629    }
630    trekkie.methods = [
631      'identify',
632      'page',
633      'ready',
634      'track',
635      'trackForm',
636      'trackLink'
637    ];
638    trekkie.factory = function(method) {
639      return function() {
640        var args = Array.prototype.slice.call(arguments);
641        args.unshift(method);
642        trekkie.push(args);
643        if (method == 'track' || method == 'page') {
644          var pageUrl;
645          try {
646            pageUrl = window.location.href;
647          } catch (e) {}
648          var pageReferrer;
649          try {
650            pageReferrer = document.referrer;
651          } catch (e) {}
652          try {
653            if (window.__TREKKIE_SHIM_QUEUE == null) {
654              window.__TREKKIE_SHIM_QUEUE = [];
655            }
656            window.__TREKKIE_SHIM_QUEUE.push({
657              from: 'trekkie-stub',
658              method: method,
659              args: args.slice(1),
660              pageContext: {
661                url: pageUrl,
662                referrer: pageReferrer
663              }
664            });
665          } catch (e) {
666            // no-op
667          }
668        }
669        return trekkie;
670      };
671    };
672    for (var i = 0; i < trekkie.methods.length; i++) {
673      var key = trekkie.methods[i];
674      trekkie[key] = trekkie.factory(key);
675    }
676    trekkie.load = function(config) {
677      trekkie.config = config || {};
678      trekkie.config.initialDocumentCookie = document.cookie;
679      var first = document.getElementsByTagName('script')[0];
680var script = document.createElement('script');
681script.type = 'text/javascript';
682script.onerror = function(e) {
683  var scriptFallback = document.createElement('script');
684  scriptFallback.type = 'text/javascript';
685  scriptFallback.onerror = function(error) {
686          var Monorail = {
687      produce: function produce(monorailDomain, schemaId, payload) {
688        var currentMs = new Date().getTime();
689        var event = {
690          schema_id: schemaId,
691          payload: payload,
692          metadata: {
693            event_created_at_ms: currentMs,
694            event_sent_at_ms: currentMs
695          }
696        };
697        return Monorail.sendRequest("https://" + monorailDomain + "/v1/produce", JSON.stringify(event));
698      },
699      sendRequest: function sendRequest(endpointUrl, payload) {
700        // Try the sendBeacon API
701        if (window && window.navigator && typeof window.navigator.sendBeacon === 'function' && typeof window.Blob === 'function' && !Monorail.isIos12()) {
702          var blobData = new window.Blob([payload], {
703            type: 'text/plain'
704          });
705
706          if (window.navigator.sendBeacon(endpointUrl, blobData)) {
707            return true;
708          } // sendBeacon was not successful
709
710        } // XHR beacon
711
712        var xhr = new XMLHttpRequest();
713
714        try {
715          xhr.open('POST', endpointUrl);
716          xhr.setRequestHeader('Content-Type', 'text/plain');
717          xhr.send(payload);
718        } catch (e) {
719          console.log(e);
720        }
721
722        return false;
723      },
724      isIos12: function isIos12() {
725        return window.navigator.userAgent.lastIndexOf('iPhone; CPU iPhone OS 12_') !== -1 || window.navigator.userAgent.lastIndexOf('iPad; CPU OS 12_') !== -1;
726      }
727    };
728    Monorail.produce('monorail-edge.shopifysvc.com',
729      'trekkie_storefront_load_errors/1.1',
730      {shop_id: 73815621771,
731      theme_id: 187530772675,
732      app_name: "storefront",
733      context_url: window.location.href,
734      source_url: "//www.clinique.com/cdn/s/trekkie.storefront.2f6d7d7ede7d24234881a9cd5f47e679642fa1f6.min.js"});
735
736  };
737  scriptFallback.async = true;
738  scriptFallback.src = '//www.clinique.com/cdn/s/trekkie.storefront.2f6d7d7ede7d24234881a9cd5f47e679642fa1f6.min.js';
739  first.parentNode.insertBefore(scriptFallback, first);
740};
741script.async = true;
742script.src = '//www.clinique.com/cdn/s/trekkie.storefront.2f6d7d7ede7d24234881a9cd5f47e679642fa1f6.min.js';
743first.parentNode.insertBefore(script, first);
744
745    };
746    trekkie.load(
747      {"Trekkie":{"appName":"storefront","development":false,"defaultAttributes":{"shopId":73815621771,"isMerchantRequest":null,"themeId":187530772675,"themeCityHash":"3272558061850364462","contentLanguage":"en","currency":"USD","eventMetadataId":"4fa5c13c-2b97-48f0-a064-59a457669905"},"isServerSideCookieWritingEnabled":true,"monorailRegion":"shop_domain","enabledBetaFlags":["764d78cb","8450a54b","7ee89bf1","4c64608a"]},"Session Attribution":{},"S2S":{"facebookCapiEnabled":false,"source":"trekkie-storefront-renderer","apiClientId":580111}}
748    );
749
750    var loaded = false;
751    trekkie.ready(function() {
752      if (loaded) return;
753      loaded = true;
754
755      window.ShopifyAnalytics.lib = window.trekkie;
756
757      var originalDocumentWrite = document.write;
758      document.write = customDocumentWrite;
759      try { window.ShopifyAnalytics.merchantGoogleAnalytics.call(this); } catch(error) {};
760      document.write = originalDocumentWrite;
761
762      var match = window.location.pathname.match(/checkouts\/(.+)\/(thank_you|post_purchase)/)
763      var token = match? match[1]: undefined;
764      if (!hasLoggedConversion(token)) {
765        setCookieIfConversion(token);
766        
767      }
768    });
769
770    window.ShopifyAnalytics.lib.page(null,{"pageType":"cart","requestId":"1903d741-9aac-4892-b2cd-c17c52df7f51-1790850511","shopifyEmitted":true});
771
772    var eventsListenerScript = document.createElement('script');
773    eventsListenerScript.async = true;
774    eventsListenerScript.src = "//www.clinique.com/cdn/shopifycloud/storefront/assets/shop_events_listener-4e26a9ce.js";
775    document.getElementsByTagName('head')[0].appendChild(eventsListenerScript);
776})();</script>
vendor: 1 bytes, line 776
776
777<script
778  defer
779  src="https://www.clinique.com/cdn/shopifycloud/perf-kit/shopify-perf-kit-3.9.4.min.js"
780  data-application="storefront-renderer"
781  data-shop-id="73815621771"
782  data-render-region="gcp-europe-west1"
783  data-page-type="cart"
784  data-theme-instance-id="187530772675"
785  data-theme-name="elc-clinique"
786  data-theme-version="2.1.0"
787  data-monorail-region="shop_domain"
788  data-resource-timing-sampling-rate="10"
789  data-shs="true"
790  data-shs-beacon="true"
791  data-shs-export-with-fetch="true"
792  data-shs-logs-sample-rate="1"
793  data-shs-beacon-endpoint="https://www.clinique.com/api/collect"
794></script>
794
795<meta name="shopify-y" content="4ddff00d-3335-4603-b583-fdffb5c43e5b" data-expiration="1822408111000"><meta name="shopify-s" content="2ff8c29c-d4c4-4f74-a722-205e62099e9a" data-expiration="1790852311000"><meta name="new-cookie-storage-activated" content="t">
796</head>
797
798  <body class='template-cart bg-background'><app-provider>
799  <!-- ##start:entry-lazy##core/core-aria-live-region.ts##end:entry-lazy## -->
800
801<aria-live-region></aria-live-region>
802        <a class='skip-to-content-link sr-only' href='#main'>
803          Skip to content
804        </a>
805  <!-- ##start:entry-lazy##main-header.js##end:entry-lazy## -->
806
807<main-header id='main-header' class='sticky top-0 z-50 grid w-full grid-cols-1 ease-in-out will-change-transform'><!-- BEGIN sections: header-group -->
808<div id="shopify-section-sections--27364774248643__announcement-bar" class="shopify-section shopify-section-group-header-group relative announcement-bar-wrapper"><div class='
809
810color-scheme-3 bg-background text-foreground
811 announcement-bar flex items-center gap-sm bg-background px-pagemargin py-2xs text-foreground'>
812  
813    
814      
815  <!-- ##start:entry-lazy##core/core-carousel.ts##end:entry-lazy## -->
816
817
818      <core-carousel
819        class='w-full'
820        role='group'
821        aria-label='Announcement'
822        style='--core-carousel-slide-width: 100%; --core-carousel-slide-gap-per-slide: 0px; --core-carousel-gap: 0px;'
823        data-loop='true'
824        
825          data-slide-interval='8000'
826        
827      >
828        <button
829          class='core-carousel-button core-carousel-button-prev rotate-90 bg-transparent text-inherit'
830          data-carousel-prev
831          aria-label='Slide left'
832        >
833          
834<svg-icon
835  src='icon-caret'
836  class='icon-md md:icon-sm'
837
838  
839
840  
841  
842></svg-icon>
843
844        </button>
845        <button
846          class='core-carousel-button core-carousel-button-next -rotate-90 bg-transparent text-inherit'
847          data-carousel-next
848          aria-label='Slide right'
849        >
850          
851<svg-icon
852  src='icon-caret'
853  class='icon-md md:icon-sm'
854
855  
856
857  
858  
859></svg-icon>
860
861        </button>
862
863        <div
864          class='core-carousel-slides'
865          aria-atomic='false'
866          aria-live='off'
867          data-carousel-slides
868        >
869          <div
870  class='core-carousel-slide flex items-center justify-center md:justify-start md:ps-10'
871  
872  role='group'
873  aria-roledescription='slide'
874  data-carousel-slide
875  tabindex='0'
876>
877  <p class='rte max-w-[70vw] text-center md:max-w-[50vw] md:text-left [&_a]:underline-offset-2'>
878    <span class='body-xs font-light md:hidden'>Join Smart Rewards and get free standard shipping with any order. <a href="/pages/smart-rewards" title="Smart Rewards"><span style="text-decoration:underline">Learn More</span> </a></span>
879    <span class='hidden body-xs font-light md:inline'>Join Smart Rewards and get free standard shipping with any order. <a href="/pages/smart-rewards" title="Smart Rewards"><span style="text-decoration:underline">Learn More</span> </a></span>
880  </p>
881</div>
882
883
884<div
885  class='core-carousel-slide flex items-center justify-center md:justify-start md:ps-10'
886  
887  role='group'
888  aria-roledescription='slide'
889  data-carousel-slide
890  tabindex='0'
891>
892  <p class='rte max-w-[70vw] text-center md:max-w-[50vw] md:text-left [&_a]:underline-offset-2'>
893    <span class='body-xs font-light md:hidden'>Choose 4 travel essentials with eligible $75 purchase. <a href="/collections/bestsellers" title="Bestsellers"><span style="text-decoration:underline">Shop Now</span></a></span>
894    <span class='hidden body-xs font-light md:inline'>Choose 4 travel essentials with eligible $75 purchase. <a href="/collections/bestsellers" title="Bestsellers"><span style="text-decoration:underline">Shop Now</span></a></span>
895  </p>
896</div>
897
898
899
900        </div>
901      </core-carousel>
902    
903  
904  <div class='hidden shrink-0 items-center justify-end gap-lg md:flex w-auto'>
905    
906<a
907    href='/pages/smart-rewards'
908    class='w-fit text-legal font-medium'
909  >
910    Smart Rewards
911  </a>
912</div>
913</div>
914
915
916</div><div id="shopify-section-sections--27364774248643__main" class="shopify-section shopify-section-group-header-group section-header">
917<style>
918  #main-header {
919    --color-background: #ffffff;
920    --color-foreground: #1a1a1a;
921    --color-foreground-secondary: #666666;
922    --color-accent-01: #adddb7;
923    --color-accent-02: #ffffff;
924    --color-border-01: #cccccc;
925    --color-border-02: #e6e6e6;
926    --color-disabled: #cccccc;
927    --color-link: #1a1a1a;
928    background-color: var(--color-background);
929    color: var(--color-foreground);
930  }
931</style><header
932  class='
933
934color-scheme-1 bg-background text-foreground
935 relative flex h-11.5 w-full flex-col justify-center gap-sm bg-background px-pagemargin md:h-auto md:pt-sm md:pb-2xs'
936  data-desktop-logo-position='center'
937  data-mobile-logo-position='center'
938><div class='hidden w-full grid-cols-3 items-center lg:grid'>
939      <div></div>
940      <div class='flex justify-center'><div id="shopify-block-AYUs3MkpKOVEzRlBMS__header-logo" class="shopify-block"><a
941  href='/'
942  class='
943pt-0 
944pb-0 
945ps-0 
946pe-0 flex h-fit rounded-none h6 uppercase focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[var(--color-focus)]'
947><div
948      class='relative flex h-full w-30 md:w-(--header-logo-width)'
949      style='--header-logo-width: 150px'
950    ><span class='header-logo__img header-logo__img--default flex h-full w-full'>
951<img src="//www.clinique.com/cdn/shop/files/Clinique_Logo.png?format=webp&amp;v=1787760300&amp;width=600" alt="Clinique Laboratories, LLC" srcset="//www.clinique.com/cdn/shop/files/Clinique_Logo.png?format=webp&amp;v=1787760300&amp;width=150 150w, //www.clinique.com/cdn/shop/files/Clinique_Logo.png?format=webp&amp;v=1787760300&amp;width=225 225w, //www.clinique.com/cdn/shop/files/Clinique_Logo.png?format=webp&amp;v=1787760300&amp;width=300 300w" width="600" height="123" loading="eager" sizes="(max-width: 300px) 50vw, 150px" class="w-full block  object-contain" fetchpriority="high"></span></div></a>
952
953
954</div>
955
956</div><div class='flex items-center justify-end gap-0'><button
957    type='button'
958    data-search-trigger
959    aria-haspopup='dialog' aria-controls='header-search-panel' aria-expanded='false'
960    class=' flex size-7.5 items-center justify-center gap-3xs rounded-none transition-opacity hover:opacity-70 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[var(--color-focus)] aria-disabled:cursor-default aria-disabled:opacity-40'
961  >
962    <span class='pointer-events-none inline-flex'>
963<svg-icon
964  src='icon-search'
965  class='icon-md'
966
967  
968
969  
970  
971></svg-icon>
972</span>
973    <span class='sr-only'>Search</span>
974  </button><a
975        href='https://www.clinique.com/customer_authentication/redirect?locale=en&region_country=US'
976        class='flex shrink-0 items-center justify-center gap-2xs px-3xs transition-opacity hover:no-underline hover:opacity-70 focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[var(--color-focus)] lg:px-xs'
977      >
978<svg-icon
979  src='icon-account'
980  class='icon-md shrink-0'
981
982  
983
984  
985  
986></svg-icon>
987
988
989<span class='sr-only'>Log in</span>
990      </a>
991<dialog-toggle modal-id='cart-drawer-dialog' class='inline-flex place-items-center'><a
992      aria-haspopup='dialog' aria-controls='cart-drawer-dialog'
993      href='/cart'
994      class='relative flex size-7.5 shrink-0 place-items-center items-center justify-center rounded-none transition-opacity hover:opacity-70 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[var(--color-focus)]'
995      id='cart-icon-bubble'
996    >
997<svg-icon
998  src='icon-cart'
999  class='icon-md'
1000
1001  
1002
1003  
1004  
1005></svg-icon>
1006<span class='sr-only'>Cart</span>
1007      <div class='absolute top-1.25 right-0.25 flex size-1.5 items-center justify-center text-center badge-text leading-none text-foreground empty:hidden [&:has(cart-total[aria-hidden="true"])]:hidden'>
1008  <!-- ##start:entry-lazy##component-cart-total.js##end:entry-lazy## -->
1009
1010<cart-total
1011          cloak
1012          aria-hidden='true'
1013          translation='{ "cart_count": "###count### items" }'
1014        ></cart-total>
1015      </div>
1016    </a>
1017</dialog-toggle></div></div><nav
1018    class='hidden w-full lg:flex justify-center'
1019    aria-label='Menu'
1020  ><!-- ##start:entry-media-KG1pbi13aWR0aDogMTAyNHB4KQ==##mega-menu.ts##end:entry-media## -->
1021
1022<mega-menu class='color-scheme-1' >
1023  <ul class='flex h-8 flex-wrap items-center gap-x-[var(--spacing-header-linkspacing,2rem)]' role='list'>
1024    <li id='Details-HeaderMenu-AZDhHYnRFUnBMckNzU__header_mega_menu_VQ6B4T' >
1025  <div
1026    id='HeaderMenu-AZDhHYnRFUnBMckNzU__header_mega_menu_VQ6B4T'
1027    class='p peer flex items-center'
1028  >
1029    <a
1030      class='pb-2xs nav-link flex underline-offset-8 aria-expanded:underline  hover:underline text-danger'
1031      href='/collections/all-gifts-sets'
1032      
1033        menu-trigger
1034        aria-haspopup='true'
1035        aria-expanded='false'
1036        aria-controls='MegaMenu-Content-AZDhHYnRFUnBMckNzU__header_mega_menu_VQ6B4T'
1037      
1038      
1039    >Holiday Gifts + Sets</a>
1040  </div><div
1041      id='MegaMenu-Content-AZDhHYnRFUnBMckNzU__header_mega_menu_VQ6B4T'
1042      class='bg-background text-foreground starting:peer-has-[[aria-expanded="true"]]:opacity-0 absolute left-0 right-0 top-[90%] hidden opacity-0 transition-[opacity,display] duration-200 [transition-behavior:allow-discrete] group-focus-within:block group-focus-within:opacity-100 peer-has-[[aria-expanded="true"]]:block peer-has-[[aria-expanded="true"]]:opacity-100'
1043      aria-hidden='true'
1044      role='region'
1045      menu
1046      aria-labelledby='HeaderMenu-AZDhHYnRFUnBMckNzU__header_mega_menu_VQ6B4T'
1047    >
1048      <button
1049        type='button'
1050        menu-close
1051        class='top-2xs right-sm size-7.5 absolute z-10 flex items-center justify-center rounded-none focus-visible:outline focus-visible:outline-offset-2 focus-visible:outline-[var(--color-focus)]'
1052        aria-label='Close'
1053      >
1054<svg-icon
1055  src='icon-close'
1056  class='icon-md'
1057
1058  
1059
1060  
1061  
1062></svg-icon>
1063</button>
1064      <div class='mega-menu-panel px-pagemargin py-lg flex max-h-[calc(100vh-var(--header-height)+10px)] flex-col overflow-y-auto'><div class='mega-menu-content flex flex-col gap-md mx-auto w-fit max-w-full'><a
1065              href='/collections/all-gifts-sets'
1066              class='btn btn-tertiary gap-2xs py-2xs flex items-center '
1067            >
1068              <span>Shop All
1069                Holiday Gifts + Sets</span>
1070
1071              
1072            </a><div class='mega-menu-columns gap-md flex w-full items-start'><ul
1073                class='max-w-pageviewport flex list-none flex-wrap gap-md w-fit shrink-0'
1074                role='list'
1075              >
1076                
1077<li
1078  class='max-w-[220px] min-w-[140px]'
1079  
1080>
1081  <a
1082    id='HeaderMenu-ANXF1amZPdk5DUzJpN__header_link_list_LJwQkt'
1083    href='#'
1084    class='mega-menu-column-title mb-md block nav-link-l2 underline-offset-2 cursor-default'
1085    
1086  >
1087    Shop by Price
1088  </a><ul class='mega-menu-sublist grid list-none gap-sm' role='list'><li class='leading-0'>
1089          <a
1090            id='HeaderMenu-ANXF1amZPdk5DUzJpN__header_link_list_LJwQkt-gifts-25-under'
1091            href='/collections/gifts-under-25'
1092            class='nav-link-l3 underline-offset-2 hover:underline'
1093            
1094          >
1095            Gifts $25 &amp; Under
1096          </a>
1097        </li><li class='leading-0'>
1098          <a
1099            id='HeaderMenu-ANXF1amZPdk5DUzJpN__header_link_list_LJwQkt-gifts-60-under'
1100            href='/collections/gifts-under-60'
1101            class='nav-link-l3 underline-offset-2 hover:underline'
1102            
1103          >
1104            Gifts $60 &amp; Under
1105          </a>
1106        </li><li class='leading-0'>
1107          <a
1108            id='HeaderMenu-ANXF1amZPdk5DUzJpN__header_link_list_LJwQkt-gifts-99-under'
1109            href='/collections/gifts-under-99'
1110            class='nav-link-l3 underline-offset-2 hover:underline'
1111            
1112          >
1113            Gifts $99 &amp; Under
1114          </a>
1115        </li><li class='leading-0'>
1116          <a
1117            id='HeaderMenu-ANXF1amZPdk5DUzJpN__header_link_list_LJwQkt-luxury-gifts'
1118            href='/collections/luxury-gifts'
1119            class='nav-link-l3 underline-offset-2 hover:underline'
1120            
1121          >
1122            Luxury Gifts
1123          </a>
1124        </li></ul></li>
1125
1126
1127<li
1128  class='max-w-[220px] min-w-[140px]'
1129  
1130>
1131  <a
1132    id='HeaderMenu-AeTM4SmsvdmJRUHFnL__header_link_list_k77Act'
1133    href='#'
1134    class='mega-menu-column-title mb-md block nav-link-l2 underline-offset-2 cursor-default'
1135    
1136  >
1137    Shop by Category
1138  </a><ul class='mega-menu-sublist grid list-none gap-sm' role='list'><li class='leading-0'>
1139          <a
1140            id='HeaderMenu-AeTM4SmsvdmJRUHFnL__header_link_list_k77Act-stocking-stuffers'
1141            href='/collections/stocking-stuffers'
1142            class='nav-link-l3 underline-offset-2 hover:underline'
1143            
1144          >
1145            Stocking Stuffers
1146          </a>
1147        </li><li class='leading-0'>
1148          <a
1149            id='HeaderMenu-AeTM4SmsvdmJRUHFnL__header_link_list_k77Act-skincare-gift-sets'
1150            href='/collections/all-gifts-sets?fh_f_fhr_product_type=skincaregifts'
1151            class='nav-link-l3 underline-offset-2 hover:underline'
1152            
1153          >
1154            Skincare Gift Sets
1155          </a>
1156        </li><li class='leading-0'>
1157          <a
1158            id='HeaderMenu-AeTM4SmsvdmJRUHFnL__header_link_list_k77Act-makeup-gift-sets'
1159            href='/collections/all-gifts-sets?fh_f_fhr_product_type=makeupgifts'
1160            class='nav-link-l3 underline-offset-2 hover:underline'
1161            
1162          >
1163            Makeup Gift Sets
1164          </a>
1165        </li><li class='leading-0'>
1166          <a
1167            id='HeaderMenu-AeTM4SmsvdmJRUHFnL__header_link_list_k77Act-fragrance-gift-sets'
1168            href='/collections/all-gifts-sets?fh_f_fhr_product_type=fragrancesets'
1169            class='nav-link-l3 underline-offset-2 hover:underline'
1170            
1171          >
1172            Fragrance Gift Sets
1173          </a>
1174        </li><li class='leading-0'>
1175          <a
1176            id='HeaderMenu-AeTM4SmsvdmJRUHFnL__header_link_list_k77Act-gift-sets-for-men'
1177            href='/collections/mens-gifts-sets'
1178            class='nav-link-l3 underline-offset-2 hover:underline'
1179            
1180          >
1181            Gift Sets for Men
1182          </a>
1183        </li><li class='leading-0'>
1184          <a
1185            id='HeaderMenu-AeTM4SmsvdmJRUHFnL__header_link_list_k77Act-holiday-gift-guide'
1186            href='/pages/holiday-gift-guide'
1187            class='nav-link-l3 underline-offset-2 hover:underline'
1188            
1189          >
1190            Holiday Gift Guide
1191          </a>
1192        </li><li class='leading-0'>
1193          <a
1194            id='HeaderMenu-AeTM4SmsvdmJRUHFnL__header_link_list_k77Act-gift-finder-quiz'
1195            href='/pages/holiday-gift-finder-quiz'
1196            class='nav-link-l3 underline-offset-2 hover:underline'
1197            
1198          >
1199            Gift Finder Quiz
1200          </a>
1201        </li><li class='leading-0'>
1202          <a
1203            id='HeaderMenu-AeTM4SmsvdmJRUHFnL__header_link_list_k77Act-gift-with-purchase'
1204            href='/pages/gift-with-purchase'
1205            class='nav-link-l3 underline-offset-2 hover:underline'
1206            
1207          >
1208            Gift with Purchase
1209          </a>
1210        </li></ul></li>
1211
1212
1213              </ul><ul
1214                class='gap-md grid h-full list-none grid-cols-[repeat(var(--mega-menu-image-cols),var(--mega-menu-image-col-width))]'
1215                style='--mega-menu-image-cols: 2; --mega-menu-image-col-width: min(calc(100vw / 7.2), 400px);'
1216                role='list'
1217              >
1218                
1219<li>
1220  
1221<a href='/products/great-skin-everywhere-for-dry-combination-skin' class='mega-menu-tile grid grid-cols-1 gap-2xs'><div class='relative' style='aspect-ratio: 1'>
1222<picture class=''>
1223  <source
1224    media='(max-width: 767px)'
1225    srcset='//www.clinique.com/cdn/shop/files/gnavtout_3step_dry.png?format=webp&v=1790626696&width=300 300w'
1226    sizes='200px'
1227    width='400'
1228    height='400'
1229  >
1230<img src="//www.clinique.com/cdn/shop/files/gnavtout_3step_dry.png?format=webp&amp;v=1790626696&amp;width=400" srcset="//www.clinique.com/cdn/shop/files/gnavtout_3step_dry.png?format=webp&amp;v=1790626696&amp;width=200 200w, //www.clinique.com/cdn/shop/files/gnavtout_3step_dry.png?format=webp&amp;v=1790626696&amp;width=400 400w" width="400" height="400" loading="lazy" sizes="200px" class="w-full block w-full h-full object-cover object-cover" fetchpriority="low"></picture>
1231</div>
1232  <p class='mega-menu-tile-title body-xs'>Great Skin Everywhere: For Dry Combination Skin</p></a></li>
1233
1234
1235<li>
1236  
1237<a href='/products/ready-in-5-skincare-makeup-set' class='mega-menu-tile grid grid-cols-1 gap-2xs'><div class='relative' style='aspect-ratio: 1'>
1238<picture class=''>
1239  <source
1240    media='(max-width: 767px)'
1241    srcset='//www.clinique.com/cdn/shop/files/gnavtout_readyin5.png?format=webp&v=1790626778&width=300 300w'
1242    sizes='200px'
1243    width='400'
1244    height='400'
1245  >
1246<img src="//www.clinique.com/cdn/shop/files/gnavtout_readyin5.png?format=webp&amp;v=1790626778&amp;width=400" srcset="//www.clinique.com/cdn/shop/files/gnavtout_readyin5.png?format=webp&amp;v=1790626778&amp;width=200 200w, //www.clinique.com/cdn/shop/files/gnavtout_readyin5.png?format=webp&amp;v=1790626778&amp;width=400 400w" width="400" height="400" loading="lazy" sizes="200px" class="w-full block w-full h-full object-cover object-cover" fetchpriority="low"></picture>
1247</div>
1248  <p class='mega-menu-tile-title body-xs'>Ready In 5 Skincare + Makeup Set</p></a></li>
1249
1250
1251              </ul></div>
1252        </div>
1253      </div>
1254    </div>
1255
1256    <div
1257      class='pointer-events-none invisible absolute left-0 right-0 top-[90%] z-[-1] opacity-0 transition-[opacity,visibility] duration-200 group-focus-within:pointer-events-auto group-focus-within:visible group-focus-within:opacity-100 peer-has-[[aria-expanded="true"]]:pointer-events-auto peer-has-[[aria-expanded="true"]]:visible peer-has-[[aria-expanded="true"]]:opacity-100'
1258      aria-hidden='true'
1259    >
1260      <div class='bg-(--color-overlay) h-[calc(100vh-var(--header-height)+10px)]'></div>
1261    </div></li>
1262
1263<li id='Details-HeaderMenu-ARDVXWUY0UHQ0dGNid__header_mega_menu_ntic3g' >
1264  <div
1265    id='HeaderMenu-ARDVXWUY0UHQ0dGNid__header_mega_menu_ntic3g'
1266    class='p peer flex items-center'
1267  >
1268    <a
1269      class='pb-2xs nav-link flex underline-offset-8 aria-expanded:underline  hover:underline'
1270      href='/collections/just-arrived'
1271      
1272        menu-trigger
1273        aria-haspopup='true'
1274        aria-expanded='false'
1275        aria-controls='MegaMenu-Content-ARDVXWUY0UHQ0dGNid__header_mega_menu_ntic3g'
1276      
1277      
1278    >New</a>
1279  </div><div
1280      id='MegaMenu-Content-ARDVXWUY0UHQ0dGNid__header_mega_menu_ntic3g'
1281      class='bg-background text-foreground starting:peer-has-[[aria-expanded="true"]]:opacity-0 absolute left-0 right-0 top-[90%] hidden opacity-0 transition-[opacity,display] duration-200 [transition-behavior:allow-discrete] group-focus-within:block group-focus-within:opacity-100 peer-has-[[aria-expanded="true"]]:block peer-has-[[aria-expanded="true"]]:opacity-100'
1282      aria-hidden='true'
1283      role='region'
1284      menu
1285      aria-labelledby='HeaderMenu-ARDVXWUY0UHQ0dGNid__header_mega_menu_ntic3g'
1286    >
1287      <button
1288        type='button'
1289        menu-close
1290        class='top-2xs right-sm size-7.5 absolute z-10 flex items-center justify-center rounded-none focus-visible:outline focus-visible:outline-offset-2 focus-visible:outline-[var(--color-focus)]'
1291        aria-label='Close'
1292      >
1293<svg-icon
1294  src='icon-close'
1295  class='icon-md'
1296
1297  
1298
1299  
1300  
1301></svg-icon>
1302</button>
1303      <div class='mega-menu-panel px-pagemargin py-lg flex max-h-[calc(100vh-var(--header-height)+10px)] flex-col overflow-y-auto'><div class='mega-menu-content flex flex-col gap-md mx-auto w-fit max-w-full'><a
1304              href='/collections/just-arrived'
1305              class='btn btn-tertiary gap-2xs py-2xs flex items-center '
1306            >
1307              <span>Shop All
1308                New</span>
1309
1310              
1311            </a><div class='mega-menu-columns gap-md flex w-full items-start'><ul
1312                class='max-w-pageviewport flex list-none flex-wrap gap-md w-fit shrink-0'
1313                role='list'
1314              >
1315                
1316<li
1317  class='max-w-[220px] min-w-[140px]'
1318  
1319>
1320  <a
1321    id='HeaderMenu-AVm1xSGtDcW9rWU9Mb__header_link_list_dVwFtJ'
1322    href='#'
1323    class='mega-menu-column-title mb-md block nav-link-l2 underline-offset-2 cursor-default'
1324    
1325  >
1326    New Skincare
1327  </a><ul class='mega-menu-sublist grid list-none gap-sm' role='list'><li class='leading-0'>
1328          <a
1329            id='HeaderMenu-AVm1xSGtDcW9rWU9Mb__header_link_list_dVwFtJ-daily-calm'
1330            href='/pages/daily-calm-collection'
1331            class='nav-link-l3 underline-offset-2 hover:underline'
1332            
1333          >
1334            Daily Calm
1335          </a>
1336        </li><li class='leading-0'>
1337          <a
1338            id='HeaderMenu-AVm1xSGtDcW9rWU9Mb__header_link_list_dVwFtJ-moisture-surge-exfoliating-glow-cleanser'
1339            href='/products/moisture-surge-exfoliating-glow-cleanser'
1340            class='nav-link-l3 underline-offset-2 hover:underline'
1341            
1342          >
1343            Moisture Surge Exfoliating Glow Cleanser
1344          </a>
1345        </li><li class='leading-0'>
1346          <a
1347            id='HeaderMenu-AVm1xSGtDcW9rWU9Mb__header_link_list_dVwFtJ-smart-clinical-repair-collagen-pdrn-cream'
1348            href='/products/clinique-smart-clinical-repair-collagen-pdrn-cream'
1349            class='nav-link-l3 underline-offset-2 hover:underline'
1350            
1351          >
1352            Smart Clinical Repair Collagen + PDRN Cream
1353          </a>
1354        </li></ul></li>
1355
1356
1357<li
1358  class='max-w-[220px] min-w-[140px]'
1359  
1360>
1361  <a
1362    id='HeaderMenu-ASUNKVnEzL3NlVFZlZ__header_link_list_6raXbW'
1363    href='#'
1364    class='mega-menu-column-title mb-md block nav-link-l2 underline-offset-2 cursor-default'
1365    
1366  >
1367    New Makeup
1368  </a><ul class='mega-menu-sublist grid list-none gap-sm' role='list'><li class='leading-0'>
1369          <a
1370            id='HeaderMenu-ASUNKVnEzL3NlVFZlZ__header_link_list_6raXbW-black-honey-collection'
1371            href='/pages/black-honey'
1372            class='nav-link-l3 underline-offset-2 hover:underline'
1373            
1374          >
1375            Black Honey Collection
1376          </a>
1377        </li><li class='leading-0'>
1378          <a
1379            id='HeaderMenu-ASUNKVnEzL3NlVFZlZ__header_link_list_6raXbW-chubby-stick-shadow-tint-for-eyes'
1380            href='/products/chubby-stick-shadow-tint-for-eyes'
1381            class='nav-link-l3 underline-offset-2 hover:underline'
1382            
1383          >
1384            Chubby Stick Shadow Tint For Eyes
1385          </a>
1386        </li><li class='leading-0'>
1387          <a
1388            id='HeaderMenu-ASUNKVnEzL3NlVFZlZ__header_link_list_6raXbW-quickliner-lustre-eyeliner'
1389            href='/products/quickliner-for-eyes-intense-lustre-eyeliner'
1390            class='nav-link-l3 underline-offset-2 hover:underline'
1391            
1392          >
1393            Quickliner Lustre Eyeliner
1394          </a>
1395        </li><li class='leading-0'>
1396          <a
1397            id='HeaderMenu-ASUNKVnEzL3NlVFZlZ__header_link_list_6raXbW-daily-calm'
1398            href='/pages/daily-calm-collection'
1399            class='nav-link-l3 underline-offset-2 hover:underline'
1400            
1401          >
1402            Daily Calm
1403          </a>
1404        </li></ul></li>
1405
1406
1407<li
1408  class='max-w-[220px] min-w-[140px]'
1409  
1410>
1411  <a
1412    id='HeaderMenu-AQWVxRnYvN2pNVXBuY__header_link_list_tGmGJj'
1413    href='#'
1414    class='mega-menu-column-title mb-md block nav-link-l2 underline-offset-2 cursor-default'
1415    
1416  >
1417    Featured
1418  </a><ul class='mega-menu-sublist grid list-none gap-sm' role='list'><li class='leading-0'>
1419          <a
1420            id='HeaderMenu-AQWVxRnYvN2pNVXBuY__header_link_list_tGmGJj-the-look-lab'
1421            href='/pages/trends'
1422            class='nav-link-l3 underline-offset-2 hover:underline'
1423            
1424          >
1425            The Look Lab
1426          </a>
1427        </li><li class='leading-0'>
1428          <a
1429            id='HeaderMenu-AQWVxRnYvN2pNVXBuY__header_link_list_tGmGJj-fsa-eligible'
1430            href='/collections/fsa-hsa-eligible-skincare-products'
1431            class='nav-link-l3 underline-offset-2 hover:underline'
1432            
1433          >
1434            FSA Eligible
1435          </a>
1436        </li><li class='leading-0'>
1437          <a
1438            id='HeaderMenu-AQWVxRnYvN2pNVXBuY__header_link_list_tGmGJj-acuvue®-partnership'
1439            href='/pages/clinique-acuvue-partnership'
1440            class='nav-link-l3 underline-offset-2 hover:underline'
1441            
1442          >
1443            ACUVUE® Partnership
1444          </a>
1445        </li></ul></li>
1446
1447
1448              </ul><ul
1449                class='gap-md grid h-full list-none grid-cols-[repeat(var(--mega-menu-image-cols),var(--mega-menu-image-col-width))]'
1450                style='--mega-menu-image-cols: 3; --mega-menu-image-col-width: min(calc(100vw / 7.2), 400px);'
1451                role='list'
1452              >
1453                
1454<li>
1455  
1456<a href='/products/chubby-stick-shadow-tint-for-eyes' class='mega-menu-tile grid grid-cols-1 gap-2xs'><div class='relative' style='aspect-ratio: 1'>
1457<picture class=''>
1458  <source
1459    media='(max-width: 767px)'
1460    srcset='//www.clinique.com/cdn/shop/files/chubbyeye_gnav.jpg?format=webp&v=1788453869&width=300 300w, //www.clinique.com/cdn/shop/files/chubbyeye_gnav.jpg?format=webp&v=1788453869&width=450 450w'
1461    sizes='200px'
1462    width='488'
1463    height='488'
1464  >
1465<img src="//www.clinique.com/cdn/shop/files/chubbyeye_gnav.jpg?format=webp&amp;v=1788453869&amp;width=488" srcset="//www.clinique.com/cdn/shop/files/chubbyeye_gnav.jpg?format=webp&amp;v=1788453869&amp;width=200 200w, //www.clinique.com/cdn/shop/files/chubbyeye_gnav.jpg?format=webp&amp;v=1788453869&amp;width=400 400w" width="488" height="488" loading="lazy" sizes="200px" class="w-full block w-full h-full object-cover object-cover" fetchpriority="low"></picture>
1466</div>
1467  <p class='mega-menu-tile-title body-xs'>Easy Chubby Sticks in 6 wearable shades for eyes.</p></a></li>
1468
1469
1470<li>
1471  
1472<a href='/products/clinique-smart-clinical-repair-collagen-pdrn-cream' class='mega-menu-tile grid grid-cols-1 gap-2xs'><div class='relative' style='aspect-ratio: 1'>
1473<picture class=''>
1474  <source
1475    media='(max-width: 767px)'
1476    srcset='//www.clinique.com/cdn/shop/files/smartpdrn_gnav.jpg?format=webp&v=1788453892&width=300 300w, //www.clinique.com/cdn/shop/files/smartpdrn_gnav.jpg?format=webp&v=1788453892&width=450 450w'
1477    sizes='200px'
1478    width='486'
1479    height='486'
1480  >
1481<img src="//www.clinique.com/cdn/shop/files/smartpdrn_gnav.jpg?format=webp&amp;v=1788453892&amp;width=486" srcset="//www.clinique.com/cdn/shop/files/smartpdrn_gnav.jpg?format=webp&amp;v=1788453892&amp;width=200 200w, //www.clinique.com/cdn/shop/files/smartpdrn_gnav.jpg?format=webp&amp;v=1788453892&amp;width=400 400w" width="486" height="486" loading="lazy" sizes="200px" class="w-full block w-full h-full object-cover object-cover" fetchpriority="low"></picture>
1482</div>
1483  <p class='mega-menu-tile-title body-xs'>Clinique Smart Clinical Repair™ Collagen + PDRN Cream</p></a></li>
1484
1485
1486<li>
1487  
1488<a href='/products/moisture-surge-exfoliating-glow-cleanser' class='mega-menu-tile grid grid-cols-1 gap-2xs'><div class='relative' style='aspect-ratio: 1'>
1489<picture class=''>
1490  <source
1491    media='(max-width: 767px)'
1492    srcset='//www.clinique.com/cdn/shop/files/mscleanser_gnav.jpg?format=webp&v=1788453869&width=300 300w, //www.clinique.com/cdn/shop/files/mscleanser_gnav.jpg?format=webp&v=1788453869&width=450 450w'
1493    sizes='200px'
1494    width='486'
1495    height='486'
1496  >
1497<img src="//www.clinique.com/cdn/shop/files/mscleanser_gnav.jpg?format=webp&amp;v=1788453869&amp;width=486" srcset="//www.clinique.com/cdn/shop/files/mscleanser_gnav.jpg?format=webp&amp;v=1788453869&amp;width=200 200w, //www.clinique.com/cdn/shop/files/mscleanser_gnav.jpg?format=webp&amp;v=1788453869&amp;width=400 400w" width="486" height="486" loading="lazy" sizes="200px" class="w-full block w-full h-full object-cover object-cover" fetchpriority="low"></picture>
1498</div>
1499  <p class='mega-menu-tile-title body-xs'>Moisture Surge™ Exfoliating Glow Cleanser</p></a></li>
1500
1501
1502              </ul></div>
1503        </div>
1504      </div>
1505    </div>
1506
1507    <div
1508      class='pointer-events-none invisible absolute left-0 right-0 top-[90%] z-[-1] opacity-0 transition-[opacity,visibility] duration-200 group-focus-within:pointer-events-auto group-focus-within:visible group-focus-within:opacity-100 peer-has-[[aria-expanded="true"]]:pointer-events-auto peer-has-[[aria-expanded="true"]]:visible peer-has-[[aria-expanded="true"]]:opacity-100'
1509      aria-hidden='true'
1510    >
1511      <div class='bg-(--color-overlay) h-[calc(100vh-var(--header-height)+10px)]'></div>
1512    </div></li>
1513
1514<li id='Details-HeaderMenu-ATGdmRDNqbDlxUmtuZ__header_mega_menu_LTB3YT' >
1515  <div
1516    id='HeaderMenu-ATGdmRDNqbDlxUmtuZ__header_mega_menu_LTB3YT'
1517    class='p peer flex items-center'
1518  >
1519    <a
1520      class='pb-2xs nav-link flex underline-offset-8 aria-expanded:underline  hover:underline'
1521      href='/collections/bestsellers'
1522      
1523        menu-trigger
1524        aria-haspopup='true'
1525        aria-expanded='false'
1526        aria-controls='MegaMenu-Content-ATGdmRDNqbDlxUmtuZ__header_mega_menu_LTB3YT'
1527      
1528      
1529    >Bestsellers</a>
1530  </div><div
1531      id='MegaMenu-Content-ATGdmRDNqbDlxUmtuZ__header_mega_menu_LTB3YT'
1532      class='bg-background text-foreground starting:peer-has-[[aria-expanded="true"]]:opacity-0 absolute left-0 right-0 top-[90%] hidden opacity-0 transition-[opacity,display] duration-200 [transition-behavior:allow-discrete] group-focus-within:block group-focus-within:opacity-100 peer-has-[[aria-expanded="true"]]:block peer-has-[[aria-expanded="true"]]:opacity-100'
1533      aria-hidden='true'
1534      role='region'
1535      menu
1536      aria-labelledby='HeaderMenu-ATGdmRDNqbDlxUmtuZ__header_mega_menu_LTB3YT'
1537    >
1538      <button
1539        type='button'
1540        menu-close
1541        class='top-2xs right-sm size-7.5 absolute z-10 flex items-center justify-center rounded-none focus-visible:outline focus-visible:outline-offset-2 focus-visible:outline-[var(--color-focus)]'
1542        aria-label='Close'
1543      >
1544<svg-icon
1545  src='icon-close'
1546  class='icon-md'
1547
1548  
1549
1550  
1551  
1552></svg-icon>
1553</button>
1554      <div class='mega-menu-panel px-pagemargin py-lg flex max-h-[calc(100vh-var(--header-height)+10px)] flex-col overflow-y-auto'><div class='mega-menu-content flex flex-col gap-md mx-auto w-fit max-w-full'><a
1555              href='/collections/bestsellers'
1556              class='btn btn-tertiary gap-2xs py-2xs flex items-center '
1557            >
1558              <span>Shop All
1559                Bestsellers</span>
1560
1561              
1562            </a><div class='mega-menu-columns gap-md flex w-full items-start'><ul
1563                class='max-w-pageviewport flex list-none flex-wrap gap-md w-fit'
1564                role='list'
1565              >
1566                
1567<li
1568  class='max-w-[220px] min-w-[140px]'
1569  
1570>
1571  <a
1572    id='HeaderMenu-AMkEvOUhEbU84YnNwS__header_link_list_aQRnkF'
1573    href='#'
1574    class='mega-menu-column-title mb-md block nav-link-l2 underline-offset-2 cursor-default'
1575    
1576  >
1577    Skincare Bestsellers
1578  </a><ul class='mega-menu-sublist grid list-none gap-sm' role='list'><li class='leading-0'>
1579          <a
1580            id='HeaderMenu-AMkEvOUhEbU84YnNwS__header_link_list_aQRnkF-shop-all-skincare-bestsellers'
1581            href='/collections/bestsellers?fh_f_fhr_product_type=cleansersfacewash%2Cexfoliatorstoners%2Ceyecare%2Cfaceserums%2Cmoisturizersfacecreams'
1582            class='nav-link-l3 underline-offset-2 hover:underline'
1583            
1584          >
1585            Shop All Skincare Bestsellers
1586          </a>
1587        </li><li class='leading-0'>
1588          <a
1589            id='HeaderMenu-AMkEvOUhEbU84YnNwS__header_link_list_aQRnkF-moisture-surge-100h'
1590            href='/products/moisture-surge-100h-auto-replenishing-hydrator'
1591            class='nav-link-l3 underline-offset-2 hover:underline'
1592            
1593          >
1594            Moisture Surge 100H
1595          </a>
1596        </li><li class='leading-0'>
1597          <a
1598            id='HeaderMenu-AMkEvOUhEbU84YnNwS__header_link_list_aQRnkF-dramatically-different-lotion'
1599            href='/products/dramatically-different-moisturizing-lotion'
1600            class='nav-link-l3 underline-offset-2 hover:underline'
1601            
1602          >
1603            Dramatically Different Lotion
1604          </a>
1605        </li><li class='leading-0'>
1606          <a
1607            id='HeaderMenu-AMkEvOUhEbU84YnNwS__header_link_list_aQRnkF-smart-clinical-repair-serum'
1608            href='/products/clinique-smart-clinical-repair-wrinkle-correcting-serum'
1609            class='nav-link-l3 underline-offset-2 hover:underline'
1610            
1611          >
1612            Smart Clinical Repair Serum
1613          </a>
1614        </li></ul></li>
1615
1616
1617<li
1618  class='max-w-[220px] min-w-[140px]'
1619  
1620>
1621  <a
1622    id='HeaderMenu-AOTE0dEtKeFMxcVZHN__header_link_list_mtpPDm'
1623    href='#'
1624    class='mega-menu-column-title mb-md block nav-link-l2 underline-offset-2 cursor-default'
1625    
1626  >
1627    Makeup Bestsellers
1628  </a><ul class='mega-menu-sublist grid list-none gap-sm' role='list'><li class='leading-0'>
1629          <a
1630            id='HeaderMenu-AOTE0dEtKeFMxcVZHN__header_link_list_mtpPDm-shop-all-makeup-bestsellers'
1631            href='/collections/bestsellers?fh_f_fhr_product_type=concealercolorcorrector%2Ceyeliner%2Cfoundation%2Clipglossbalm%2Clipstick%2Cmascara%2Cpowder'
1632            class='nav-link-l3 underline-offset-2 hover:underline'
1633            
1634          >
1635            Shop All Makeup Bestsellers
1636          </a>
1637        </li><li class='leading-0'>
1638          <a
1639            id='HeaderMenu-AOTE0dEtKeFMxcVZHN__header_link_list_mtpPDm-black-honey-almost-lipstick'
1640            href='/products/almost-lipstick-in-black-honey-pink-honey-and-nude-honey'
1641            class='nav-link-l3 underline-offset-2 hover:underline'
1642            
1643          >
1644            Black Honey Almost Lipstick
1645          </a>
1646        </li><li class='leading-0'>
1647          <a
1648            id='HeaderMenu-AOTE0dEtKeFMxcVZHN__header_link_list_mtpPDm-even-better-makeup-spf-15'
1649            href='/products/even-better-makeup-broad-spectrum-spf-15'
1650            class='nav-link-l3 underline-offset-2 hover:underline'
1651            
1652          >
1653            Even Better Makeup SPF 15
1654          </a>
1655        </li><li class='leading-0'>
1656          <a
1657            id='HeaderMenu-AOTE0dEtKeFMxcVZHN__header_link_list_mtpPDm-high-impact-mascara'
1658            href='/products/high-impact-high-fi-full-volume-mascara'
1659            class='nav-link-l3 underline-offset-2 hover:underline'
1660            
1661          >
1662            High Impact Mascara
1663          </a>
1664        </li><li class='leading-0'>
1665          <a
1666            id='HeaderMenu-AOTE0dEtKeFMxcVZHN__header_link_list_mtpPDm-chubby-stick-lip-color-balm'
1667            href='/products/chubby-stick-moisturizing-lip-color-balm'
1668            class='nav-link-l3 underline-offset-2 hover:underline'
1669            
1670          >
1671            Chubby Stick Lip Color Balm
1672          </a>
1673        </li></ul></li>
1674
1675
1676<li
1677  class='max-w-[220px] min-w-[140px]'
1678  
1679>
1680  <a
1681    id='HeaderMenu-AVHdiMU9HemdFRFdid__header_link_list_qQpNHC'
1682    href='#'
1683    class='mega-menu-column-title mb-md block nav-link-l2 underline-offset-2 cursor-default'
1684    
1685  >
1686    Fragrance Bestsellers
1687  </a><ul class='mega-menu-sublist grid list-none gap-sm' role='list'><li class='leading-0'>
1688          <a
1689            id='HeaderMenu-AVHdiMU9HemdFRFdid__header_link_list_qQpNHC-shop-all-fragrance-bestsellers'
1690            href='/collections/bestsellers?fh_f_fhr_product_type=perfume'
1691            class='nav-link-l3 underline-offset-2 hover:underline'
1692            
1693          >
1694            Shop All Fragrance Bestsellers
1695          </a>
1696        </li><li class='leading-0'>
1697          <a
1698            id='HeaderMenu-AVHdiMU9HemdFRFdid__header_link_list_qQpNHC-happy'
1699            href='/products/clinique-happy-eau-de-parfum-spray'
1700            class='nav-link-l3 underline-offset-2 hover:underline'
1701            
1702          >
1703            Happy
1704          </a>
1705        </li><li class='leading-0'>
1706          <a
1707            id='HeaderMenu-AVHdiMU9HemdFRFdid__header_link_list_qQpNHC-aromatics-elixir'
1708            href='/collections/aromatics-elixir'
1709            class='nav-link-l3 underline-offset-2 hover:underline'
1710            
1711          >
1712            Aromatics Elixir
1713          </a>
1714        </li><li class='leading-0'>
1715          <a
1716            id='HeaderMenu-AVHdiMU9HemdFRFdid__header_link_list_qQpNHC-my-happy-fragrance-mists'
1717            href='/pages/clinique-happy'
1718            class='nav-link-l3 underline-offset-2 hover:underline'
1719            
1720          >
1721            My Happy Fragrance Mists
1722          </a>
1723        </li></ul></li>
1724
1725
1726<li
1727  class='max-w-[220px] min-w-[140px]'
1728  
1729>
1730  <a
1731    id='HeaderMenu-AaVNIMEJUbTlRTU9kd__header_link_list_7kUcmi'
1732    href='#'
1733    class='mega-menu-column-title mb-md block nav-link-l2 underline-offset-2 cursor-default'
1734    
1735  >
1736    Men&#39;s Bestsellers
1737  </a><ul class='mega-menu-sublist grid list-none gap-sm' role='list'><li class='leading-0'>
1738          <a
1739            id='HeaderMenu-AaVNIMEJUbTlRTU9kd__header_link_list_7kUcmi-shop-all-mens-bestsellers'
1740            href='/collections/bestsellers?fh_f_elc_product_collection=cliniqueformen'
1741            class='nav-link-l3 underline-offset-2 hover:underline'
1742            
1743          >
1744            Shop All Men&#39;s Bestsellers
1745          </a>
1746        </li><li class='leading-0'>
1747          <a
1748            id='HeaderMenu-AaVNIMEJUbTlRTU9kd__header_link_list_7kUcmi-anti-age-moisturizer'
1749            href='/products/clinique-for-men-anti-age-moisturizer'
1750            class='nav-link-l3 underline-offset-2 hover:underline'
1751            
1752          >
1753            Anti-Age Moisturizer
1754          </a>
1755        </li><li class='leading-0'>
1756          <a
1757            id='HeaderMenu-AaVNIMEJUbTlRTU9kd__header_link_list_7kUcmi-moisturizing-lotion'
1758            href='/products/clinique-for-men-moisturizing-lotion'
1759            class='nav-link-l3 underline-offset-2 hover:underline'
1760            
1761          >
1762            Moisturizing Lotion
1763          </a>
1764        </li><li class='leading-0'>
1765          <a
1766            id='HeaderMenu-AaVNIMEJUbTlRTU9kd__header_link_list_7kUcmi-face-wash'
1767            href='/products/clinique-for-men-face-wash'
1768            class='nav-link-l3 underline-offset-2 hover:underline'
1769            
1770          >
1771            Face Wash
1772          </a>
1773        </li><li class='leading-0'>
1774          <a
1775            id='HeaderMenu-AaVNIMEJUbTlRTU9kd__header_link_list_7kUcmi-face-scrub'
1776            href='/products/clinique-for-men-face-scrub'
1777            class='nav-link-l3 underline-offset-2 hover:underline'
1778            
1779          >
1780            Face Scrub
1781          </a>
1782        </li></ul></li>
1783
1784
1785              </ul><ul
1786                class='gap-md grid h-full list-none grid-cols-[repeat(var(--mega-menu-image-cols),var(--mega-menu-image-col-width))]'
1787                style='--mega-menu-image-cols: 2; --mega-menu-image-col-width: min(calc(100vw / 7.2), 400px);'
1788                role='list'
1789              >
1790                
1791<li>
1792  
1793<a href='/products/moisture-surge-100h-auto-replenishing-hydrator' class='mega-menu-tile grid grid-cols-1 gap-2xs'><div class='relative' style='aspect-ratio: 1'>
1794<picture class=''>
1795  <source
1796    media='(max-width: 767px)'
1797    srcset='//www.clinique.com/cdn/shop/files/gnav_bs_ms100h.jpg?format=webp&v=1789568765&width=300 300w, //www.clinique.com/cdn/shop/files/gnav_bs_ms100h.jpg?format=webp&v=1789568765&width=450 450w'
1798    sizes='200px'
1799    width='564'
1800    height='563'
1801  >
1802<img src="//www.clinique.com/cdn/shop/files/gnav_bs_ms100h.jpg?format=webp&amp;v=1789568765&amp;width=564" srcset="//www.clinique.com/cdn/shop/files/gnav_bs_ms100h.jpg?format=webp&amp;v=1789568765&amp;width=200 200w, //www.clinique.com/cdn/shop/files/gnav_bs_ms100h.jpg?format=webp&amp;v=1789568765&amp;width=400 400w" width="564" height="563" loading="lazy" sizes="200px" class="w-full block w-full h-full object-cover object-cover" fetchpriority="low"></picture>
1803</div>
1804  <p class='mega-menu-tile-title body-xs'>Moisture Surge™ 100H Auto-Replenishing Hydrator</p></a></li>
1805
1806
1807<li>
1808  
1809<a href='/products/almost-lipstick-in-black-honey-pink-honey-and-nude-honey' class='mega-menu-tile grid grid-cols-1 gap-2xs'><div class='relative' style='aspect-ratio: 1'>
1810<picture class=''>
1811  <source
1812    media='(max-width: 767px)'
1813    srcset='//www.clinique.com/cdn/shop/files/gnav_bs_blackhoney.jpg?format=webp&v=1789568774&width=300 300w, //www.clinique.com/cdn/shop/files/gnav_bs_blackhoney.jpg?format=webp&v=1789568774&width=450 450w'
1814    sizes='200px'
1815    width='564'
1816    height='563'
1817  >
1818<img src="//www.clinique.com/cdn/shop/files/gnav_bs_blackhoney.jpg?format=webp&amp;v=1789568774&amp;width=564" srcset="//www.clinique.com/cdn/shop/files/gnav_bs_blackhoney.jpg?format=webp&amp;v=1789568774&amp;width=200 200w, //www.clinique.com/cdn/shop/files/gnav_bs_blackhoney.jpg?format=webp&amp;v=1789568774&amp;width=400 400w" width="564" height="563" loading="lazy" sizes="200px" class="w-full block w-full h-full object-cover object-cover" fetchpriority="low"></picture>
1819</div>
1820  <p class='mega-menu-tile-title body-xs'>Almost Lipstick in Black Honey</p></a></li>
1821
1822
1823              </ul></div>
1824        </div>
1825      </div>
1826    </div>
1827
1828    <div
1829      class='pointer-events-none invisible absolute left-0 right-0 top-[90%] z-[-1] opacity-0 transition-[opacity,visibility] duration-200 group-focus-within:pointer-events-auto group-focus-within:visible group-focus-within:opacity-100 peer-has-[[aria-expanded="true"]]:pointer-events-auto peer-has-[[aria-expanded="true"]]:visible peer-has-[[aria-expanded="true"]]:opacity-100'
1830      aria-hidden='true'
1831    >
1832      <div class='bg-(--color-overlay) h-[calc(100vh-var(--header-height)+10px)]'></div>
1833    </div></li>
1834
1835<li id='Details-HeaderMenu-ATXV1K0RvM1JHOWFGe__header_mega_menu_aQwqnX' >
1836  <div
1837    id='HeaderMenu-ATXV1K0RvM1JHOWFGe__header_mega_menu_aQwqnX'
1838    class='p peer flex items-center'
1839  >
1840    <a
1841      class='pb-2xs nav-link flex underline-offset-8 aria-expanded:underline  hover:underline'
1842      href='/collections/skincare-all'
1843      
1844        menu-trigger
1845        aria-haspopup='true'
1846        aria-expanded='false'
1847        aria-controls='MegaMenu-Content-ATXV1K0RvM1JHOWFGe__header_mega_menu_aQwqnX'
1848      
1849      
1850    >Skincare</a>
1851  </div><div
1852      id='MegaMenu-Content-ATXV1K0RvM1JHOWFGe__header_mega_menu_aQwqnX'
1853      class='bg-background text-foreground starting:peer-has-[[aria-expanded="true"]]:opacity-0 absolute left-0 right-0 top-[90%] hidden opacity-0 transition-[opacity,display] duration-200 [transition-behavior:allow-discrete] group-focus-within:block group-focus-within:opacity-100 peer-has-[[aria-expanded="true"]]:block peer-has-[[aria-expanded="true"]]:opacity-100'
1854      aria-hidden='true'
1855      role='region'
1856      menu
1857      aria-labelledby='HeaderMenu-ATXV1K0RvM1JHOWFGe__header_mega_menu_aQwqnX'
1858    >
1859      <button
1860        type='button'
1861        menu-close
1862        class='top-2xs right-sm size-7.5 absolute z-10 flex items-center justify-center rounded-none focus-visible:outline focus-visible:outline-offset-2 focus-visible:outline-[var(--color-focus)]'
1863        aria-label='Close'
1864      >
1865<svg-icon
1866  src='icon-close'
1867  class='icon-md'
1868
1869  
1870
1871  
1872  
1873></svg-icon>
1874</button>
1875      <div class='mega-menu-panel px-pagemargin py-lg flex max-h-[calc(100vh-var(--header-height)+10px)] flex-col overflow-y-auto'><div class='mega-menu-content flex flex-col gap-md'><a
1876              href='/collections/skincare-all'
1877              class='btn btn-tertiary gap-2xs py-2xs flex items-center '
1878            >
1879              <span>Shop All
1880                Skincare</span>
1881
1882              
1883            </a><div class='mega-menu-columns gap-md flex w-full items-start'><ul
1884                class='max-w-pageviewport flex list-none flex-wrap gap-md w-full justify-between'
1885                role='list'
1886              >
1887                
1888<li
1889  class='max-w-[220px] min-w-[140px]'
1890  
1891>
1892  <a
1893    id='HeaderMenu-AR0VPWVRNWGtyK1QrW__header_link_list_EzKkHL'
1894    href='#'
1895    class='mega-menu-column-title mb-md block nav-link-l2 underline-offset-2 cursor-default'
1896    
1897  >
1898    Shop by Category
1899  </a><ul class='mega-menu-sublist grid list-none gap-sm' role='list'><li class='leading-0'>
1900          <a
1901            id='HeaderMenu-AR0VPWVRNWGtyK1QrW__header_link_list_EzKkHL-moisturizers-face-creams'
1902            href='/collections/moisturizers'
1903            class='nav-link-l3 underline-offset-2 hover:underline'
1904            
1905          >
1906            Moisturizers + Face Creams
1907          </a>
1908        </li><li class='leading-0'>
1909          <a
1910            id='HeaderMenu-AR0VPWVRNWGtyK1QrW__header_link_list_EzKkHL-cleansers-face-wash'
1911            href='/collections/cleansers-face-wash'
1912            class='nav-link-l3 underline-offset-2 hover:underline'
1913            
1914          >
1915            Cleansers + Face Wash
1916          </a>
1917        </li><li class='leading-0'>
1918          <a
1919            id='HeaderMenu-AR0VPWVRNWGtyK1QrW__header_link_list_EzKkHL-face-serums'
1920            href='/collections/serums'
1921            class='nav-link-l3 underline-offset-2 hover:underline'
1922            
1923          >
1924            Face Serums
1925          </a>
1926        </li><li class='leading-0'>
1927          <a
1928            id='HeaderMenu-AR0VPWVRNWGtyK1QrW__header_link_list_EzKkHL-eye-care'
1929            href='/collections/eye-care'
1930            class='nav-link-l3 underline-offset-2 hover:underline'
1931            
1932          >
1933            Eye Care
1934          </a>
1935        </li><li class='leading-0'>
1936          <a
1937            id='HeaderMenu-AR0VPWVRNWGtyK1QrW__header_link_list_EzKkHL-exfoliators-toners'
1938            href='/collections/exfoliators'
1939            class='nav-link-l3 underline-offset-2 hover:underline'
1940            
1941          >
1942            Exfoliators + Toners
1943          </a>
1944        </li><li class='leading-0'>
1945          <a
1946            id='HeaderMenu-AR0VPWVRNWGtyK1QrW__header_link_list_EzKkHL-sunscreen-spf'
1947            href='/collections/spf-sun-protection'
1948            class='nav-link-l3 underline-offset-2 hover:underline'
1949            
1950          >
1951            Sunscreen + SPF
1952          </a>
1953        </li><li class='leading-0'>
1954          <a
1955            id='HeaderMenu-AR0VPWVRNWGtyK1QrW__header_link_list_EzKkHL-face-masks'
1956            href='/collections/face-masks'
1957            class='nav-link-l3 underline-offset-2 hover:underline'
1958            
1959          >
1960            Face Masks
1961          </a>
1962        </li><li class='leading-0'>
1963          <a
1964            id='HeaderMenu-AR0VPWVRNWGtyK1QrW__header_link_list_EzKkHL-lip-care'
1965            href='/collections/lip-care'
1966            class='nav-link-l3 underline-offset-2 hover:underline'
1967            
1968          >
1969            Lip Care
1970          </a>
1971        </li><li class='leading-0'>
1972          <a
1973            id='HeaderMenu-AR0VPWVRNWGtyK1QrW__header_link_list_EzKkHL-makeup-removers'
1974            href='/collections/makeup-removers'
1975            class='nav-link-l3 underline-offset-2 hover:underline'
1976            
1977          >
1978            Makeup Removers
1979          </a>
1980        </li><li class='leading-0'>
1981          <a
1982            id='HeaderMenu-AR0VPWVRNWGtyK1QrW__header_link_list_EzKkHL-body-care'
1983            href='/collections/hand-body-care'
1984            class='nav-link-l3 underline-offset-2 hover:underline'
1985            
1986          >
1987            Body Care
1988          </a>
1989        </li><li class='leading-0'>
1990          <a
1991            id='HeaderMenu-AR0VPWVRNWGtyK1QrW__header_link_list_EzKkHL-essences-mists'
1992            href='/collections/face-essence-lotions'
1993            class='nav-link-l3 underline-offset-2 hover:underline'
1994            
1995          >
1996            Essences + Mists
1997          </a>
1998        </li></ul></li>
1999
2000
2001<li
2002  class='max-w-[220px] min-w-[140px]'
2003  
2004>
2005  <a
2006    id='HeaderMenu-AN0l3dnJ2MFhuZ0lmM__header_link_list_Y9MYET'
2007    href='#'
2008    class='mega-menu-column-title mb-md block nav-link-l2 underline-offset-2 cursor-default'
2009    
2010  >
2011    Shop by Skin Concern
2012  </a><ul class='mega-menu-sublist grid list-none gap-sm' role='list'><li class='leading-0'>
2013          <a
2014            id='HeaderMenu-AN0l3dnJ2MFhuZ0lmM__header_link_list_Y9MYET-all-skin-concerns'
2015            href='/pages/skin-concern'
2016            class='nav-link-l3 underline-offset-2 hover:underline'
2017            
2018          >
2019            All Skin Concerns
2020          </a>
2021        </li><li class='leading-0'>
2022          <a
2023            id='HeaderMenu-AN0l3dnJ2MFhuZ0lmM__header_link_list_Y9MYET-dry-skin'
2024            href='/collections/skincare-for-dry-skin'
2025            class='nav-link-l3 underline-offset-2 hover:underline'
2026            
2027          >
2028            Dry Skin
2029          </a>
2030        </li><li class='leading-0'>
2031          <a
2032            id='HeaderMenu-AN0l3dnJ2MFhuZ0lmM__header_link_list_Y9MYET-anti-aging'
2033            href='/collections/anti-aging-skincare'
2034            class='nav-link-l3 underline-offset-2 hover:underline'
2035            
2036          >
2037            Anti-Aging
2038          </a>
2039        </li><li class='leading-0'>
2040          <a
2041            id='HeaderMenu-AN0l3dnJ2MFhuZ0lmM__header_link_list_Y9MYET-dark-undereye-circles'
2042            href='/collections/under-eye-dark-circles-treatment'
2043            class='nav-link-l3 underline-offset-2 hover:underline'
2044            
2045          >
2046            Dark Undereye Circles
2047          </a>
2048        </li><li class='leading-0'>
2049          <a
2050            id='HeaderMenu-AN0l3dnJ2MFhuZ0lmM__header_link_list_Y9MYET-dark-spots'
2051            href='/collections/dark-spots-treatment'
2052            class='nav-link-l3 underline-offset-2 hover:underline'
2053            
2054          >
2055            Dark Spots
2056          </a>
2057        </li><li class='leading-0'>
2058          <a
2059            id='HeaderMenu-AN0l3dnJ2MFhuZ0lmM__header_link_list_Y9MYET-acne-blackheads'
2060            href='/collections/acne-skincare'
2061            class='nav-link-l3 underline-offset-2 hover:underline'
2062            
2063          >
2064            Acne + Blackheads
2065          </a>
2066        </li><li class='leading-0'>
2067          <a
2068            id='HeaderMenu-AN0l3dnJ2MFhuZ0lmM__header_link_list_Y9MYET-sun-protection'
2069            href='/collections/spf-sun-protection'
2070            class='nav-link-l3 underline-offset-2 hover:underline'
2071            
2072          >
2073            Sun Protection
2074          </a>
2075        </li><li class='leading-0'>
2076          <a
2077            id='HeaderMenu-AN0l3dnJ2MFhuZ0lmM__header_link_list_Y9MYET-redness'
2078            href='/collections/skincare-for-redness'
2079            class='nav-link-l3 underline-offset-2 hover:underline'
2080            
2081          >
2082            Redness
2083          </a>
2084        </li><li class='leading-0'>
2085          <a
2086            id='HeaderMenu-AN0l3dnJ2MFhuZ0lmM__header_link_list_Y9MYET-sensitive-skin'
2087            href='/collections/skin-concern-sensitive-skin'
2088            class='nav-link-l3 underline-offset-2 hover:underline'
2089            
2090          >
2091            Sensitive Skin
2092          </a>
2093        </li></ul></li>
2094
2095
2096<li
2097  class='max-w-[220px] min-w-[140px]'
2098  
2099>
2100  <a
2101    id='HeaderMenu-ANXl2M1ZNOGhleVgye__header_link_list_kiCzFV'
2102    href='#'
2103    class='mega-menu-column-title mb-md block nav-link-l2 underline-offset-2 cursor-default'
2104    
2105  >
2106    Shop by Skin Types
2107  </a><ul class='mega-menu-sublist grid list-none gap-sm' role='list'><li class='leading-0'>
2108          <a
2109            id='HeaderMenu-ANXl2M1ZNOGhleVgye__header_link_list_kiCzFV-very-dry-to-dry'
2110            href='/collections/skincare-all?fh_f_elc_product_skin_type=very_dry_to_dry'
2111            class='nav-link-l3 underline-offset-2 hover:underline'
2112            
2113          >
2114            Very Dry to Dry
2115          </a>
2116        </li><li class='leading-0'>
2117          <a
2118            id='HeaderMenu-ANXl2M1ZNOGhleVgye__header_link_list_kiCzFV-dry-combination'
2119            href='/collections/skincare-all?fh_f_elc_product_skin_type=combination'
2120            class='nav-link-l3 underline-offset-2 hover:underline'
2121            
2122          >
2123            Dry Combination
2124          </a>
2125        </li><li class='leading-0'>
2126          <a
2127            id='HeaderMenu-ANXl2M1ZNOGhleVgye__header_link_list_kiCzFV-oily-combination'
2128            href='/collections/skincare-all?fh_f_elc_product_skin_type=combination%2Coily'
2129            class='nav-link-l3 underline-offset-2 hover:underline'
2130            
2131          >
2132            Oily Combination
2133          </a>
2134        </li><li class='leading-0'>
2135          <a
2136            id='HeaderMenu-ANXl2M1ZNOGhleVgye__header_link_list_kiCzFV-oily'
2137            href='/collections/skincare-all?fh_f_elc_product_skin_type=oily'
2138            class='nav-link-l3 underline-offset-2 hover:underline'
2139            
2140          >
2141            Oily
2142          </a>
2143        </li><li class='leading-0'>
2144          <a
2145            id='HeaderMenu-ANXl2M1ZNOGhleVgye__header_link_list_kiCzFV-acne-prone'
2146            href='/collections/acne-skincare'
2147            class='nav-link-l3 underline-offset-2 hover:underline'
2148            
2149          >
2150            Acne-Prone
2151          </a>
2152        </li><li class='leading-0'>
2153          <a
2154            id='HeaderMenu-ANXl2M1ZNOGhleVgye__header_link_list_kiCzFV-sensitive-skin'
2155            href='/collections/skin-concern-sensitive-skin'
2156            class='nav-link-l3 underline-offset-2 hover:underline'
2157            
2158          >
2159            Sensitive Skin
2160          </a>
2161        </li></ul></li>
2162
2163
2164<li
2165  class='max-w-[220px] min-w-[140px]'
2166  
2167>
2168  <a
2169    id='HeaderMenu-AU1lqbmpGVjFSbU51d__header_link_list_Cp94k9'
2170    href='#'
2171    class='mega-menu-column-title mb-md block nav-link-l2 underline-offset-2 cursor-default'
2172    
2173  >
2174    Key Ingredients
2175  </a><ul class='mega-menu-sublist grid list-none gap-sm' role='list'><li class='leading-0'>
2176          <a
2177            id='HeaderMenu-AU1lqbmpGVjFSbU51d__header_link_list_Cp94k9-all-ingredients'
2178            href='/pages/ingredients'
2179            class='nav-link-l3 underline-offset-2 hover:underline'
2180            
2181          >
2182            All Ingredients
2183          </a>
2184        </li><li class='leading-0'>
2185          <a
2186            id='HeaderMenu-AU1lqbmpGVjFSbU51d__header_link_list_Cp94k9-hyaluronic-acid'
2187            href='/pages/ingredients-hyaluronic-acid'
2188            class='nav-link-l3 underline-offset-2 hover:underline'
2189            
2190          >
2191            Hyaluronic Acid
2192          </a>
2193        </li><li class='leading-0'>
2194          <a
2195            id='HeaderMenu-AU1lqbmpGVjFSbU51d__header_link_list_Cp94k9-salicylic-acid-bha'
2196            href='/pages/ingredients-salicylic-acid'
2197            class='nav-link-l3 underline-offset-2 hover:underline'
2198            
2199          >
2200            Salicylic Acid (BHA)
2201          </a>
2202        </li><li class='leading-0'>
2203          <a
2204            id='HeaderMenu-AU1lqbmpGVjFSbU51d__header_link_list_Cp94k9-retinol'
2205            href='/pages/ingredients-retinol'
2206            class='nav-link-l3 underline-offset-2 hover:underline'
2207            
2208          >
2209            Retinol
2210          </a>
2211        </li><li class='leading-0'>
2212          <a
2213            id='HeaderMenu-AU1lqbmpGVjFSbU51d__header_link_list_Cp94k9-retinoid'
2214            href='/pages/ingredients-retinoid'
2215            class='nav-link-l3 underline-offset-2 hover:underline'
2216            
2217          >
2218            Retinoid
2219          </a>
2220        </li><li class='leading-0'>
2221          <a
2222            id='HeaderMenu-AU1lqbmpGVjFSbU51d__header_link_list_Cp94k9-vitamin-c'
2223            href='/pages/ingredients-vitamin-c'
2224            class='nav-link-l3 underline-offset-2 hover:underline'
2225            
2226          >
2227            Vitamin C
2228          </a>
2229        </li><li class='leading-0'>
2230          <a
2231            id='HeaderMenu-AU1lqbmpGVjFSbU51d__header_link_list_Cp94k9-aloe-bioferment'
2232            href='/pages/ingredients-aloe-bioferment-ha-complex'
2233            class='nav-link-l3 underline-offset-2 hover:underline'
2234            
2235          >
2236            Aloe Bioferment
2237          </a>
2238        </li><li class='leading-0'>
2239          <a
2240            id='HeaderMenu-AU1lqbmpGVjFSbU51d__header_link_list_Cp94k9-peptides'
2241            href='/pages/ingredients-peptides'
2242            class='nav-link-l3 underline-offset-2 hover:underline'
2243            
2244          >
2245            Peptides
2246          </a>
2247        </li><li class='leading-0'>
2248          <a
2249            id='HeaderMenu-AU1lqbmpGVjFSbU51d__header_link_list_Cp94k9-lactobacillus-ferment'
2250            href='/pages/ingredients-lactobacillus'
2251            class='nav-link-l3 underline-offset-2 hover:underline'
2252            
2253          >
2254            Lactobacillus Ferment
2255          </a>
2256        </li><li class='leading-0'>
2257          <a
2258            id='HeaderMenu-AU1lqbmpGVjFSbU51d__header_link_list_Cp94k9-collagen'
2259            href='/pages/ingredients-collagen'
2260            class='nav-link-l3 underline-offset-2 hover:underline'
2261            
2262          >
2263            Collagen
2264          </a>
2265        </li><li class='leading-0'>
2266          <a
2267            id='HeaderMenu-AU1lqbmpGVjFSbU51d__header_link_list_Cp94k9-pdrn'
2268            href='/pages/ingredients-pdrn'
2269            class='nav-link-l3 underline-offset-2 hover:underline'
2270            
2271          >
2272            PDRN
2273          </a>
2274        </li></ul></li>
2275
2276
2277<li
2278  class='max-w-[220px] min-w-[140px]'
2279  
2280>
2281  <a
2282    id='HeaderMenu-AdXExdnp3U1BZQXk5R__header_link_list_8AqHAh'
2283    href='#'
2284    class='mega-menu-column-title mb-md block nav-link-l2 underline-offset-2 cursor-default'
2285    
2286  >
2287    Collections
2288  </a><ul class='mega-menu-sublist grid list-none gap-sm' role='list'><li class='leading-0'>
2289          <a
2290            id='HeaderMenu-AdXExdnp3U1BZQXk5R__header_link_list_8AqHAh-3-step-routine'
2291            href='/pages/3-step-skincare'
2292            class='nav-link-l3 underline-offset-2 hover:underline'
2293            
2294          >
2295            3-Step Routine
2296          </a>
2297        </li><li class='leading-0'>
2298          <a
2299            id='HeaderMenu-AdXExdnp3U1BZQXk5R__header_link_list_8AqHAh-smart-clinical-repair'
2300            href='/pages/clinique-smart-skincare'
2301            class='nav-link-l3 underline-offset-2 hover:underline'
2302            
2303          >
2304            Smart Clinical Repair
2305          </a>
2306        </li><li class='leading-0'>
2307          <a
2308            id='HeaderMenu-AdXExdnp3U1BZQXk5R__header_link_list_8AqHAh-moisture-surge'
2309            href='/pages/dry-skin-solutions-skincare'
2310            class='nav-link-l3 underline-offset-2 hover:underline'
2311            
2312          >
2313            Moisture Surge
2314          </a>
2315        </li><li class='leading-0'>
2316          <a
2317            id='HeaderMenu-AdXExdnp3U1BZQXk5R__header_link_list_8AqHAh-even-better'
2318            href='/collections/dark-spots-treatment'
2319            class='nav-link-l3 underline-offset-2 hover:underline'
2320            
2321          >
2322            Even Better
2323          </a>
2324        </li><li class='leading-0'>
2325          <a
2326            id='HeaderMenu-AdXExdnp3U1BZQXk5R__header_link_list_8AqHAh-take-the-day-off'
2327            href='/collections/take-the-day-off'
2328            class='nav-link-l3 underline-offset-2 hover:underline'
2329            
2330          >
2331            Take The Day Off
2332          </a>
2333        </li><li class='leading-0'>
2334          <a
2335            id='HeaderMenu-AdXExdnp3U1BZQXk5R__header_link_list_8AqHAh-dramatically-different'
2336            href='/pages/dramatically-different'
2337            class='nav-link-l3 underline-offset-2 hover:underline'
2338            
2339          >
2340            Dramatically Different 
2341          </a>
2342        </li><li class='leading-0'>
2343          <a
2344            id='HeaderMenu-AdXExdnp3U1BZQXk5R__header_link_list_8AqHAh-daily-calm'
2345            href='/pages/daily-calm-collection'
2346            class='nav-link-l3 underline-offset-2 hover:underline'
2347            
2348          >
2349            Daily Calm
2350          </a>
2351        </li><li class='leading-0'>
2352          <a
2353            id='HeaderMenu-AdXExdnp3U1BZQXk5R__header_link_list_8AqHAh-uv-solutions'
2354            href='/pages/uv-solutions'
2355            class='nav-link-l3 underline-offset-2 hover:underline'
2356            
2357          >
2358            UV Solutions
2359          </a>
2360        </li><li class='leading-0'>
2361          <a
2362            id='HeaderMenu-AdXExdnp3U1BZQXk5R__header_link_list_8AqHAh-clinique-for-men'
2363            href='/collections/men-skincare'
2364            class='nav-link-l3 underline-offset-2 hover:underline'
2365            
2366          >
2367            Clinique For Men
2368          </a>
2369        </li></ul></li>
2370
2371
2372<li
2373  class='max-w-[220px] min-w-[140px]'
2374  
2375>
2376  <a
2377    id='HeaderMenu-AcUhpRDVlZlVNR1JxY__header_link_list_3xLWqH'
2378    href='#'
2379    class='mega-menu-column-title mb-md block nav-link-l2 underline-offset-2 cursor-default'
2380    
2381  >
2382    Featured
2383  </a><ul class='mega-menu-sublist grid list-none gap-sm' role='list'><li class='leading-0'>
2384          <a
2385            id='HeaderMenu-AcUhpRDVlZlVNR1JxY__header_link_list_3xLWqH-skincare-gifts'
2386            href='/collections/all-gifts-sets?fh_f_fhr_product_type=skincaregifts'
2387            class='nav-link-l3 underline-offset-2 hover:underline'
2388            
2389          >
2390            Skincare Gifts
2391          </a>
2392        </li><li class='leading-0'>
2393          <a
2394            id='HeaderMenu-AcUhpRDVlZlVNR1JxY__header_link_list_3xLWqH-mens-skincare'
2395            href='/collections/men-skincare'
2396            class='nav-link-l3 underline-offset-2 hover:underline'
2397            
2398          >
2399            Men&#39;s Skincare
2400          </a>
2401        </li><li class='leading-0'>
2402          <a
2403            id='HeaderMenu-AcUhpRDVlZlVNR1JxY__header_link_list_3xLWqH-discontinued-products'
2404            href='/pages/discontinued-products'
2405            class='nav-link-l3 underline-offset-2 hover:underline'
2406            
2407          >
2408            Discontinued Products
2409          </a>
2410        </li><li class='leading-0'>
2411          <a
2412            id='HeaderMenu-AcUhpRDVlZlVNR1JxY__header_link_list_3xLWqH-fsa-eligible'
2413            href='/collections/fsa-hsa-eligible-skincare-products'
2414            class='nav-link-l3 underline-offset-2 hover:underline'
2415            
2416          >
2417            FSA Eligible
2418          </a>
2419        </li><li class='leading-0'>
2420          <a
2421            id='HeaderMenu-AcUhpRDVlZlVNR1JxY__header_link_list_3xLWqH-clinical-reality-skin-diagnostic'
2422            href='/pages/clinicalreality'
2423            class='nav-link-l3 underline-offset-2 hover:underline'
2424            
2425          >
2426            Clinical Reality Skin Diagnostic
2427          </a>
2428        </li><li class='leading-0'>
2429          <a
2430            id='HeaderMenu-AcUhpRDVlZlVNR1JxY__header_link_list_3xLWqH-skincare-finder-quiz'
2431            href='/pages/skincare-quiz'
2432            class='nav-link-l3 underline-offset-2 hover:underline'
2433            
2434          >
2435            Skincare Finder Quiz
2436          </a>
2437        </li><li class='leading-0'>
2438          <a
2439            id='HeaderMenu-AcUhpRDVlZlVNR1JxY__header_link_list_3xLWqH-travel-sizes'
2440            href='/collections/travel-size'
2441            class='nav-link-l3 underline-offset-2 hover:underline'
2442            
2443          >
2444            Travel Sizes
2445          </a>
2446        </li></ul></li>
2447
2448
2449              </ul></div>
2450        </div>
2451      </div>
2452    </div>
2453
2454    <div
2455      class='pointer-events-none invisible absolute left-0 right-0 top-[90%] z-[-1] opacity-0 transition-[opacity,visibility] duration-200 group-focus-within:
2455pointer-events-auto group-focus-within:visible group-focus-within:opacity-100 peer-has-[[aria-expanded="true"]]:pointer-events-auto peer-has-[[aria-expanded="true"]]:visible peer-has-[[aria-expanded="true"]]:opacity-100'
2456      aria-hidden='true'
2457    >
2458      <div class='bg-(--color-overlay) h-[calc(100vh-var(--header-height)+10px)]'></div>
2459    </div></li>
2460
2461<li id='Details-HeaderMenu-AaENKUUNwOUJlZ0dla__header_mega_menu_JA48GE' >
2462  <div
2463    id='HeaderMenu-AaENKUUNwOUJlZ0dla__header_mega_menu_JA48GE'
2464    class='p peer flex items-center'
2465  >
2466    <a
2467      class='pb-2xs nav-link flex underline-offset-8 aria-expanded:underline  hover:underline'
2468      href='/collections/makeup-clinique'
2469      
2470        menu-trigger
2471        aria-haspopup='true'
2472        aria-expanded='false'
2473        aria-controls='MegaMenu-Content-AaENKUUNwOUJlZ0dla__header_mega_menu_JA48GE'
2474      
2475      
2476    >Makeup</a>
2477  </div><div
2478      id='MegaMenu-Content-AaENKUUNwOUJlZ0dla__header_mega_menu_JA48GE'
2479      class='bg-background text-foreground starting:peer-has-[[aria-expanded="true"]]:opacity-0 absolute left-0 right-0 top-[90%] hidden opacity-0 transition-[opacity,display] duration-200 [transition-behavior:allow-discrete] group-focus-within:block group-focus-within:opacity-100 peer-has-[[aria-expanded="true"]]:block peer-has-[[aria-expanded="true"]]:opacity-100'
2480      aria-hidden='true'
2481      role='region'
2482      menu
2483      aria-labelledby='HeaderMenu-AaENKUUNwOUJlZ0dla__header_mega_menu_JA48GE'
2484    >
2485      <button
2486        type='button'
2487        menu-close
2488        class='top-2xs right-sm size-7.5 absolute z-10 flex items-center justify-center rounded-none focus-visible:outline focus-visible:outline-offset-2 focus-visible:outline-[var(--color-focus)]'
2489        aria-label='Close'
2490      >
2491<svg-icon
2492  src='icon-close'
2493  class='icon-md'
2494
2495  
2496
2497  
2498  
2499></svg-icon>
2500</button>
2501      <div class='mega-menu-panel px-pagemargin py-lg flex max-h-[calc(100vh-var(--header-height)+10px)] flex-col overflow-y-auto'><div class='mega-menu-content flex flex-col gap-md'><a
2502              href='/collections/makeup-clinique'
2503              class='btn btn-tertiary gap-2xs py-2xs flex items-center '
2504            >
2505              <span>Shop All
2506                Makeup</span>
2507
2508              
2509            </a><div class='mega-menu-columns gap-md flex w-full items-start'><ul
2510                class='max-w-pageviewport flex list-none flex-wrap gap-md w-full justify-between'
2511                role='list'
2512              >
2513                
2514<li
2515  class='max-w-[220px] min-w-[140px]'
2516  
2517>
2518  <a
2519    id='HeaderMenu-AK3BCS2JsRGxUcnZzY__header_link_list_q4rUTN'
2520    href='#'
2521    class='mega-menu-column-title mb-md block nav-link-l2 underline-offset-2 cursor-default'
2522    
2523  >
2524    Face
2525  </a><ul class='mega-menu-sublist grid list-none gap-sm' role='list'><li class='leading-0'>
2526          <a
2527            id='HeaderMenu-AK3BCS2JsRGxUcnZzY__header_link_list_q4rUTN-shop-all-face'
2528            href='/collections/face-makeup'
2529            class='nav-link-l3 underline-offset-2 hover:underline'
2530            
2531          >
2532            Shop All Face
2533          </a>
2534        </li><li class='leading-0'>
2535          <a
2536            id='HeaderMenu-AK3BCS2JsRGxUcnZzY__header_link_list_q4rUTN-foundation'
2537            href='/collections/foundations'
2538            class='nav-link-l3 underline-offset-2 hover:underline'
2539            
2540          >
2541            Foundation
2542          </a>
2543        </li><li class='leading-0'>
2544          <a
2545            id='HeaderMenu-AK3BCS2JsRGxUcnZzY__header_link_list_q4rUTN-concealer'
2546            href='/collections/concealers'
2547            class='nav-link-l3 underline-offset-2 hover:underline'
2548            
2549          >
2550            Concealer
2551          </a>
2552        </li><li class='leading-0'>
2553          <a
2554            id='HeaderMenu-AK3BCS2JsRGxUcnZzY__header_link_list_q4rUTN-face-powder'
2555            href='/collections/face-powders'
2556            class='nav-link-l3 underline-offset-2 hover:underline'
2557            
2558          >
2559            Face Powder
2560          </a>
2561        </li><li class='leading-0'>
2562          <a
2563            id='HeaderMenu-AK3BCS2JsRGxUcnZzY__header_link_list_q4rUTN-face-primer'
2564            href='/collections/face-primer'
2565            class='nav-link-l3 underline-offset-2 hover:underline'
2566            
2567          >
2568            Face Primer
2569          </a>
2570        </li><li class='leading-0'>
2571          <a
2572            id='HeaderMenu-AK3BCS2JsRGxUcnZzY__header_link_list_q4rUTN-blush'
2573            href='/collections/blush'
2574            class='nav-link-l3 underline-offset-2 hover:underline'
2575            
2576          >
2577            Blush
2578          </a>
2579        </li><li class='leading-0'>
2580          <a
2581            id='HeaderMenu-AK3BCS2JsRGxUcnZzY__header_link_list_q4rUTN-bronzer-highlighter'
2582            href='/collections/bronzers'
2583            class='nav-link-l3 underline-offset-2 hover:underline'
2584            
2585          >
2586            Bronzer + Highlighter
2587          </a>
2588        </li><li class='leading-0'>
2589          <a
2590            id='HeaderMenu-AK3BCS2JsRGxUcnZzY__header_link_list_q4rUTN-tinted-moisturizer'
2591            href='/collections/bb-and-cc-cream'
2592            class='nav-link-l3 underline-offset-2 hover:underline'
2593            
2594          >
2595            Tinted Moisturizer
2596          </a>
2597        </li><li class='leading-0'>
2598          <a
2599            id='HeaderMenu-AK3BCS2JsRGxUcnZzY__header_link_list_q4rUTN-setting-spray'
2600            href='/products/set-the-day-makeup-setting-spray'
2601            class='nav-link-l3 underline-offset-2 hover:underline'
2602            
2603          >
2604            Setting Spray
2605          </a>
2606        </li></ul></li>
2607
2608
2609<li
2610  class='max-w-[220px] min-w-[140px]'
2611  
2612>
2613  <a
2614    id='HeaderMenu-ANVZlcnkvYTlmdnhvN__header_link_list_CazCna'
2615    href='#'
2616    class='mega-menu-column-title mb-md block nav-link-l2 underline-offset-2 cursor-default'
2617    
2618  >
2619    Lip
2620  </a><ul class='mega-menu-sublist grid list-none gap-sm' role='list'><li class='leading-0'>
2621          <a
2622            id='HeaderMenu-ANVZlcnkvYTlmdnhvN__header_link_list_CazCna-shop-all-lip'
2623            href='/collections/lip-makeup'
2624            class='nav-link-l3 underline-offset-2 hover:underline'
2625            
2626          >
2627            Shop All Lip
2628          </a>
2629        </li><li class='leading-0'>
2630          <a
2631            id='HeaderMenu-ANVZlcnkvYTlmdnhvN__header_link_list_CazCna-lipstick'
2632            href='/collections/lipsticks'
2633            class='nav-link-l3 underline-offset-2 hover:underline'
2634            
2635          >
2636            Lipstick
2637          </a>
2638        </li><li class='leading-0'>
2639          <a
2640            id='HeaderMenu-ANVZlcnkvYTlmdnhvN__header_link_list_CazCna-lip-gloss-balm'
2641            href='/collections/lip-glosses'
2642            class='nav-link-l3 underline-offset-2 hover:underline'
2643            
2644          >
2645            Lip Gloss + Balm
2646          </a>
2647        </li><li class='leading-0'>
2648          <a
2649            id='HeaderMenu-ANVZlcnkvYTlmdnhvN__header_link_list_CazCna-lip-liner'
2650            href='/products/quickliner-for-lips'
2651            class='nav-link-l3 underline-offset-2 hover:underline'
2652            
2653          >
2654            Lip Liner
2655          </a>
2656        </li></ul></li>
2657
2658
2659<li
2660  class='max-w-[220px] min-w-[140px]'
2661  
2662>
2663  <a
2664    id='HeaderMenu-AQ3ptN3BUMXZpL0RJU__header_link_list_qQKA9K'
2665    href='#'
2666    class='mega-menu-column-title mb-md block nav-link-l2 underline-offset-2 cursor-default'
2667    
2668  >
2669    Eye
2670  </a><ul class='mega-menu-sublist grid list-none gap-sm' role='list'><li class='leading-0'>
2671          <a
2672            id='HeaderMenu-AQ3ptN3BUMXZpL0RJU__header_link_list_qQKA9K-shop-all-eye'
2673            href='/collections/eye-makeup'
2674            class='nav-link-l3 underline-offset-2 hover:underline'
2675            
2676          >
2677            Shop All Eye
2678          </a>
2679        </li><li class='leading-0'>
2680          <a
2681            id='HeaderMenu-AQ3ptN3BUMXZpL0RJU__header_link_list_qQKA9K-mascara'
2682            href='/collections/mascara'
2683            class='nav-link-l3 underline-offset-2 hover:underline'
2684            
2685          >
2686            Mascara
2687          </a>
2688        </li><li class='leading-0'>
2689          <a
2690            id='HeaderMenu-AQ3ptN3BUMXZpL0RJU__header_link_list_qQKA9K-eyeliner'
2691            href='/collections/eyeliners'
2692            class='nav-link-l3 underline-offset-2 hover:underline'
2693            
2694          >
2695            Eyeliner
2696          </a>
2697        </li><li class='leading-0'>
2698          <a
2699            id='HeaderMenu-AQ3ptN3BUMXZpL0RJU__header_link_list_qQKA9K-eye-shadow-
2699primer'
2700            href='/collections/eye-shadows'
2701            class='nav-link-l3 underline-offset-2 hover:underline'
2702            
2703          >
2704            Eye Shadow + Primer
2705          </a>
2706        </li><li class='leading-0'>
2707          <a
2708            id='HeaderMenu-AQ3ptN3BUMXZpL0RJU__header_link_list_qQKA9K-brows'
2709            href='/collections/brows'
2710            class='nav-link-l3 underline-offset-2 hover:underline'
2711            
2712          >
2713            Brows
2714          </a>
2715        </li><li class='leading-0'>
2716          <a
2717            id='HeaderMenu-AQ3ptN3BUMXZpL0RJU__header_link_list_qQKA9K-acuvue®-partnership'
2718            href='/pages/clinique-acuvue-partnership'
2719            class='nav-link-l3 underline-offset-2 hover:underline'
2720            
2721          >
2722            ACUVUE® Partnership
2723          </a>
2724        </li></ul></li>
2725
2726
2727<li
2728  class='max-w-[220px] min-w-[140px]'
2729  
2730>
2731  <a
2732    id='HeaderMenu-Ad3FvM0dwbmt6WkF2R__header_link_list_p9iH8N'
2733    href='#'
2734    class='mega-menu-column-title mb-md block nav-link-l2 underline-offset-2 cursor-default'
2735    
2736  >
2737    Makeup Accesories
2738  </a><ul class='mega-menu-sublist grid list-none gap-sm' role='list'><li class='leading-0'>
2739          <a
2740            id='HeaderMenu-Ad3FvM0dwbmt6WkF2R__header_link_list_p9iH8N-makeup-remover'
2741            href='/collections/makeup-removers'
2742            class='nav-link-l3 underline-offset-2 hover:underline'
2743            
2744          >
2745            Makeup Remover
2746          </a>
2747        </li><li class='leading-0'>
2748          <a
2749            id='HeaderMenu-Ad3FvM0dwbmt6WkF2R__header_link_list_p9iH8N-makeup-brushes'
2750            href='/collections/makeup-brushes'
2751            class='nav-link-l3 underline-offset-2 hover:underline'
2752            
2753          >
2754            Makeup Brushes
2755          </a>
2756        </li></ul></li>
2757
2758
2759<li
2760  class='max-w-[220px] min-w-[140px]'
2761  
2762>
2763  <a
2764    id='HeaderMenu-AZloyKzhWZTQ3ZnJ5Z__header_link_list_DhQmha'
2765    href='#'
2766    class='mega-menu-column-title mb-md block nav-link-l2 underline-offset-2 cursor-default'
2767    
2768  >
2769    Collections
2770  </a><ul class='mega-menu-sublist grid list-none gap-sm' role='list'><li class='leading-0'>
2771          <a
2772            id='HeaderMenu-AZloyKzhWZTQ3ZnJ5Z__header_link_list_DhQmha-black-honey'
2773            href='/pages/black-honey'
2774            class='nav-link-l3 underline-offset-2 hover:underline'
2775            
2776          >
2777            Black Honey
2778          </a>
2779        </li><li class='leading-0'>
2780          <a
2781            id='HeaderMenu-AZloyKzhWZTQ3ZnJ5Z__header_link_list_DhQmha-even-better-makeup'
2782            href='/pages/even-better-makeup'
2783            class='nav-link-l3 underline-offset-2 hover:underline'
2784            
2785          >
2786            Even Better Makeup
2787          </a>
2788        </li><li class='leading-0'>
2789          <a
2790            id='HeaderMenu-AZloyKzhWZTQ3ZnJ5Z__header_link_list_DhQmha-take-the-day-off'
2791            href='/collections/skincare-all?fh_f_elc_product_collection=takethedayoff'
2792            class='nav-link-l3 underline-offset-2 hover:underline'
2793            
2794          >
2795            Take The Day Off
2796          </a>
2797        </li><li class='leading-0'>
2798          <a
2799            id='HeaderMenu-AZloyKzhWZTQ3ZnJ5Z__header_link_list_DhQmha-chubby-sticks'
2800            href='/pages/chubby-stick'
2801            class='nav-link-l3 underline-offset-2 hover:underline'
2802            
2803          >
2804            Chubby Sticks
2805          </a>
2806        </li></ul></li>
2807
2808
2809<li
2810  class='max-w-[220px] min-w-[140px]'
2811  
2812>
2813  <a
2814    id='HeaderMenu-AN000Qi9BeEFnb1BaV__header_link_list_U3J6RE'
2815    href='#'
2816    class='mega-menu-column-title mb-md block nav-link-l2 underline-offset-2 cursor-default'
2817    
2818  >
2819    Featured
2820  </a><ul class='mega-menu-sublist grid list-none gap-sm' role='list'><li class='leading-0'>
2821          <a
2822            id='HeaderMenu-AN000Qi9BeEFnb1BaV__header_link_list_U3J6RE-makeup-gifts'
2823            href='/collections/all-gifts-sets?fh_f_fhr_product_type=makeupgifts'
2824            class='nav-link-l3 underline-offset-2 hover:underline'
2825            
2826          >
2827            Makeup Gifts
2828          </a>
2829        </li><li class='leading-0'>
2830          <a
2831            id='HeaderMenu-AN000Qi9BeEFnb1BaV__header_link_list_U3J6RE-discontinued-products'
2832            href='/pages/discontinued-products'
2833            class='nav-link-l3 underline-offset-2 hover:underline'
2834            
2835          >
2836            Discontinued Products
2837          </a>
2838        </li><li class='leading-0'>
2839          <a
2840            id='HeaderMenu-AN000Qi9BeEFnb1BaV__header_link_list_U3J6RE-fsa-eligible'
2841            href='/collections/fsa-hsa-eligible-skincare-products'
2842            class='nav-link-l3 underline-offset-2 hover:underline'
2843            
2844          >
2845            FSA Eligible
2846          </a>
2847        </li><li class='leading-0'>
2848          <a
2849            id='HeaderMenu-AN000Qi9BeEFnb1BaV__header_link_list_U3J6RE-risk-free-foundation-trial'
2850            href='/pages/risk-free-trial'
2851            class='nav-link-l3 underline-offset-2 hover:underline'
2852            
2853          >
2854            Risk-Free Foundation Trial
2855          </a>
2856        </li><li class='leading-0'>
2857          <a
2858            id='HeaderMenu-AN000Qi9BeEFnb1BaV__header_link_list_U3J6RE-foundation-finder-quiz'
2859            href='/pages/foundation-finder-quiz'
2860            class='nav-link-l3 underline-offset-2 hover:underline'
2861            
2862          >
2863            Foundation Finder Quiz
2864          </a>
2865        </li><li class='leading-0'>
2866          <a
2867            id='HeaderMenu-AN000Qi9BeEFnb1BaV__header_link_list_U3J6RE-makeup-virtual-try-on'
2868            href='/pages/makeup-virtual-try-on'
2869            class='nav-link-l3 underline-offset-2 hover:underline'
2870            
2871          >
2872            Makeup Virtual Try-On
2873          </a>
2874        </li><li class='leading-0'>
2875          <a
2876            id='HeaderMenu-AN000Qi9BeEFnb1BaV__header_link_list_U3J6RE-mascara-finder-quiz'
2877            href='/pages/mascara-quiz'
2878            class='nav-link-l3 underline-offset-2 hover:underline'
2879            
2880          >
2881            Mascara Finder Quiz
2882          </a>
2883        </li><li class='leading-0'>
2884          <a
2885            id='HeaderMenu-AN000Qi9BeEFnb1BaV__header_link_list_U3J6RE-the-look-lab'
2886            href='/pages/trends'
2887            class='nav-link-l3 underline-offset-2 hover:underline'
2888            
2889          >
2890            The Look Lab
2891          </a>
2892        </li></ul></li>
2893
2894
2895              </ul></div>
2896        </div>
2897      </div>
2898    </div>
2899
2900    <div
2901      class='pointer-events-none invisible absolute left-0 right-0 top-[90%] z-[-1] opacity-0 transition-[opacity,visibility] duration-200 group-focus-within:
2901pointer-events-auto group-focus-within:visible group-focus-within:opacity-100 peer-has-[[aria-expanded="true"]]:pointer-events-auto peer-has-[[aria-expanded="true"]]:visible peer-has-[[aria-expanded="true"]]:opacity-100'
2902      aria-hidden='true'
2903    >
2904      <div class='bg-(--color-overlay) h-[calc(100vh-var(--header-height)+10px)]'></div>
2905    </div></li>
2906
2907<li id='Details-HeaderMenu-AdzFrQUg4UThnVXcyN__header_mega_menu_KnNcax' >
2908  <div
2909    id='HeaderMenu-AdzFrQUg4UThnVXcyN__header_mega_menu_KnNcax'
2910    class='p peer flex items-center'
2911  >
2912    <a
2913      class='pb-2xs nav-link flex underline-offset-8 aria-expanded:underline  hover:underline'
2914      href='/collections/fragrance'
2915      
2916        menu-trigger
2917        aria-haspopup='true'
2918        aria-expanded='false'
2919        aria-controls='MegaMenu-Content-AdzFrQUg4UThnVXcyN__header_mega_menu_KnNcax'
2920      
2921      
2922    >Fragrance</a>
2923  </div><div
2924      id='MegaMenu-Content-AdzFrQUg4UThnVXcyN__header_mega_menu_KnNcax'
2925      class='bg-background text-foreground starting:peer-has-[[aria-expanded="true"]]:opacity-0 absolute left-0 right-0 top-[90%] hidden opacity-0 transition-[opacity,display] duration-200 [transition-behavior:allow-discrete] group-focus-within:block group-focus-within:opacity-100 peer-has-[[aria-expanded="true"]]:block peer-has-[[aria-expanded="true"]]:opacity-100'
2926      aria-hidden='true'
2927      role='region'
2928      menu
2929      aria-labelledby='HeaderMenu-AdzFrQUg4UThnVXcyN__header_mega_menu_KnNcax'
2930    >
2931      <button
2932        type='button'
2933        menu-close
2934        class='top-2xs right-sm size-7.5 absolute z-10 flex items-center justify-center rounded-none focus-visible:outline focus-visible:outline-offset-2 focus-visible:outline-[var(--color-focus)]'
2935        aria-label='Close'
2936      >
2937<svg-icon
2938  src='icon-close'
2939  class='icon-md'
2940
2941  
2942
2943  
2944  
2945></svg-icon>
2946</button>
2947      <div class='mega-menu-panel px-pagemargin py-lg flex max-h-[calc(100vh-var(--header-height)+10px)] flex-col overflow-y-auto'><div class='mega-menu-content flex flex-col gap-md mx-auto w-fit max-w-full'><a
2948              href='/collections/fragrance'
2949              class='btn btn-tertiary gap-2xs py-2xs flex items-center '
2950            >
2951              <span>Shop All
2952                Fragrance</span>
2953
2954              
2955            </a><div class='mega-menu-columns gap-md flex w-full items-start'><ul
2956                class='max-w-pageviewport flex list-none flex-wrap gap-md w-fit shrink-0'
2957                role='list'
2958              >
2959                
2960<li
2961  class='max-w-[220px] min-w-[140px]'
2962  
2963>
2964  <a
2965    id='HeaderMenu-AenltWDBxbUlrZkpxZ__header_link_list_fUYbN6'
2966    href='#'
2967    class='mega-menu-column-title mb-md block nav-link-l2 underline-offset-2 cursor-default'
2968    
2969  >
2970    Shop by Category
2971  </a><ul class='mega-menu-sublist grid list-none gap-sm' role='list'><li class='leading-0'>
2972          <a
2973            id='HeaderMenu-AenltWDBxbUlrZkpxZ__header_link_list_fUYbN6-perfume'
2974            href='/collections/fragrance'
2975            class='nav-link-l3 underline-offset-2 hover:underline'
2976            
2977          >
2978            Perfume
2979          </a>
2980        </li><li class='leading-0'>
2981          <a
2982            id='HeaderMenu-AenltWDBxbUlrZkpxZ__header_link_list_fUYbN6-bath-body'
2983            href='/collections/hand-body-care'
2984            class='nav-link-l3 underline-offset-2 hover:underline'
2985            
2986          >
2987            Bath + Body
2988          </a>
2989        </li><li class='leading-0'>
2990          <a
2991            id='HeaderMenu-AenltWDBxbUlrZkpxZ__header_link_list_fUYbN6-mens-cologne'
2992            href='/products/clinique-happy-cologne-spray'
2993            class='nav-link-l3 underline-offset-2 hover:underline'
2994            
2995          >
2996            Men&#39;s Cologne
2997          </a>
2998        </li></ul></li>
2999
3000
3001<li
3002  class='max-w-[220px] min-w-[140px]'
3003  
3004>
3005  <a
3006    id='HeaderMenu-AMk5ob0VERm10YlhnN__header_link_list_hkRgaD'
3007    href='#'
3008    class='mega-menu-column-title mb-md block nav-link-l2 underline-offset-2 cursor-default'
3009    
3010  >
3011    Collections
3012  </a><ul class='mega-menu-sublist grid list-none gap-sm' role='list'><li class='leading-0'>
3013          <a
3014            id='HeaderMenu-AMk5ob0VERm10YlhnN__header_link_list_hkRgaD-happy'
3015            href='/pages/clinique-happy'
3016            class='nav-link-l3 underline-offset-2 hover:underline'
3017            
3018          >
3019            Happy
3020          </a>
3021        </li><li class='leading-0'>
3022          <a
3023            id='HeaderMenu-AMk5ob0VERm10YlhnN__header_link_list_hkRgaD-aromatics-elixir'
3024            href='/collections/aromatics-elixir'
3025            class='nav-link-l3 underline-offset-2 hover:underline'
3026            
3027          >
3028            Aromatics Elixir
3029          </a>
3030        </li><li class='leading-0'>
3031          <a
3032            id='HeaderMenu-AMk5ob0VERm10YlhnN__header_link_list_hkRgaD-calyx'
3033            href='/products/calyx-eau-de-parfum-spray'
3034            class='nav-link-l3 underline-offset-2 hover:underline'
3035            
3036          >
3037            Calyx
3038          </a>
3039        </li></ul></li>
3040
3041
3042<li
3043  class='max-w-[220px] min-w-[140px]'
3044  
3045>
3046  <a
3047    id='HeaderMenu-AaEVwOFBDQ2NBUThka__header_link_list_Yhd973'
3048    href='#'
3049    class='mega-menu-column-title mb-md block nav-link-l2 underline-offset-2 cursor-default'
3050    
3051  >
3052    Featured
3053  </a><ul class='mega-menu-sublist grid list-none gap-sm' role='list'><li class='leading-0'>
3054          <a
3055            id='HeaderMenu-AaEVwOFBDQ2NBUThka__header_link_list_Yhd973-fragrance-sets'
3056            href='/collections/all-gifts-sets?fh_f_fhr_product_type=fragrancesets'
3057            class='nav-link-l3 underline-offset-2 hover:underline'
3058            
3059          >
3060            Fragrance Sets
3061          </a>
3062        </li><li class='leading-0'>
3063          <a
3064            id='HeaderMenu-AaEVwOFBDQ2NBUThka__header_link_list_Yhd973-find-your-scent'
3065            href='/pages/discover-clinique-fragrance'
3066            class='nav-link-l3 underline-offset-2 hover:underline'
3067            
3068          >
3069            Find Your Scent
3070          </a>
3071        </li></ul></li>
3072
3073
3074              </ul><ul
3075                class='gap-md grid h-full list-none grid-cols-[repeat(var(--mega-menu-image-cols),var(--mega-menu-image-col-width))]'
3076                style='--mega-menu-image-cols: 2; --mega-menu-image-col-width: min(calc(100vw / 7.2), 400px);'
3077                role='list'
3078              >
3079                
3080<li>
3081  
3082<a href='/products/clinique-happy-in-paradise-limited-edition-eau-de-parfum-spray' class='mega-menu-tile grid grid-cols-1 gap-2xs'><div class='relative' style='aspect-ratio: 1'>
3083<picture class=''>
3084  <source
3085    media='(max-width: 767px)'
3086    srcset='//www.clinique.com/cdn/shop/files/gnav_happy.jpg?format=webp&v=1788454364&width=300 300w, //www.clinique.com/cdn/shop/files/gnav_happy.jpg?format=webp&v=1788454364&width=450 450w, //www.clinique.com/cdn/shop/files/gnav_happy.jpg?format=webp&v=1788454364&width=600 600w, //www.clinique.com/cdn/shop/files/gnav_happy.jpg?format=webp&v=1788454364&width=750 750w, //www.clinique.com/cdn/shop/files/gnav_happy.jpg?format=webp&v=1788454364&width=900 900w, //www.clinique.com/cdn/shop/files/gnav_happy.jpg?format=webp&v=1788454364&width=1050 1050w'
3087    sizes='200px'
3088    width='2400'
3089    height='2400'
3090  >
3091<img src="//www.clinique.com/cdn/shop/files/gnav_happy.jpg?format=webp&amp;v=1788454364&amp;width=2400" srcset="//www.clinique.com/cdn/shop/files/gnav_happy.jpg?format=webp&amp;v=1788454364&amp;width=200 200w, //www.clinique.com/cdn/shop/files/gnav_happy.jpg?format=webp&amp;v=1788454364&amp;width=400 400w" width="2400" height="2400" loading="lazy" sizes="200px" class="w-full block w-full h-full object-cover object-cover" fetchpriority="low"></picture>
3092</div>
3093  <p class='mega-menu-tile-title body-xs'>Our bestselling scent uplifts with every spritz.</p></a></li>
3094
3095
3096<li>
3097  
3098<a href='/pages/discover-clinique-fragrance' class='mega-menu-tile grid grid-cols-1 gap-2xs'><div class='relative' style='aspect-ratio: 1'>
3099<picture class=''>
3100  <source
3101    media='(max-width: 767px)'
3102    srcset='//www.clinique.com/cdn/shop/files/gnav_fragrancefinder.jpg?format=webp&v=1788454364&width=300 300w, //www.clinique.com/cdn/shop/files/gnav_fragrancefinder.jpg?format=webp&v=1788454364&width=450 450w'
3103    sizes='200px'
3104    width='564'
3105    height='563'
3106  >
3107<img src="//www.clinique.com/cdn/shop/files/gnav_fragrancefinder.jpg?format=webp&amp;v=1788454364&amp;width=564" srcset="//www.clinique.com/cdn/shop/files/gnav_fragrancefinder.jpg?format=webp&amp;v=1788454364&amp;width=200 200w, //www.clinique.com/cdn/shop/files/gnav_fragrancefinder.jpg?format=webp&amp;v=1788454364&amp;width=400 400w" width="564" height="563" loading="lazy" sizes="200px" class="w-full block w-full h-full object-cover object-cover" fetchpriority="low"></picture>
3108</div>
3109  <p class='mega-menu-tile-title body-xs'>Fragrances for every mood. All allergy tested. Find yours.</p></a></li>
3110
3111
3112              </ul></div>
3113        </div>
3114      </div>
3115    </div>
3116
3117    <div
3118      class='pointer-events-none invisible absolute left-0 right-0 top-[90%] z-[-1] opacity-0 transition-[opacity,visibility] duration-200 group-focus-within:pointer-events-auto group-focus-within:visible group-focus-within:opacity-100 peer-has-[[aria-expanded="true"]]:pointer-events-auto peer-has-[[aria-expanded="true"]]:visible peer-has-[[aria-expanded="true"]]:opacity-100'
3119      aria-hidden='true'
3120    >
3121      <div class='bg-(--color-overlay) h-[calc(100vh-var(--header-height)+10px)]'></div>
3122    </div></li>
3123
3124<li id='Details-HeaderMenu-AZHVNZzA2bWJQK091Z__header_mega_menu_TP8ciR' >
3125  <div
3126    id='HeaderMenu-AZHVNZzA2bWJQK091Z__header_mega_menu_TP8ciR'
3127    class='p peer flex items-center'
3128  >
3129    <a
3130      class='pb-2xs nav-link flex underline-offset-8 aria-expanded:underline  hover:underline'
3131      href='/collections/men-skincare'
3132      
3133        menu-trigger
3134        aria-haspopup='true'
3135        aria-expanded='false'
3136        aria-controls='MegaMenu-Content-AZHVNZzA2bWJQK091Z__header_mega_menu_TP8ciR'
3137      
3138      
3139    >Men</a>
3140  </div><div
3141      id='MegaMenu-Content-AZHVNZzA2bWJQK091Z__header_mega_menu_TP8ciR'
3142      class='bg-background text-foreground starting:peer-has-[[aria-expanded="true"]]:opacity-0 absolute left-0 right-0 top-[90%] hidden opacity-0 transition-[opacity,display] duration-200 [transition-behavior:allow-discrete] group-focus-within:block group-focus-within:opacity-100 peer-has-[[aria-expanded="true"]]:block peer-has-[[aria-expanded="true"]]:opacity-100'
3143      aria-hidden='true'
3144      role='region'
3145      menu
3146      aria-labelledby='HeaderMenu-AZHVNZzA2bWJQK091Z__header_mega_menu_TP8ciR'
3147    >
3148      <button
3149        type='button'
3150        menu-close
3151        class='top-2xs right-sm size-7.5 absolute z-10 flex items-center justify-center rounded-none focus-visible:outline focus-visible:outline-offset-2 focus-visible:outline-[var(--color-focus)]'
3152        aria-label='Close'
3153      >
3154<svg-icon
3155  src='icon-close'
3156  class='icon-md'
3157
3158  
3159
3160  
3161  
3162></svg-icon>
3163</button>
3164      <div class='mega-menu-panel px-pagemargin py-lg flex max-h-[calc(100vh-var(--header-height)+10px)] flex-col overflow-y-auto'><div class='mega-menu-content flex flex-col gap-md mx-auto w-fit max-w-full'><a
3165              href='/collections/men-skincare'
3166              class='btn btn-tertiary gap-2xs py-2xs flex items-center '
3167            >
3168              <span>Shop All
3169                Men</span>
3170
3171              
3172            </a><div class='mega-menu-columns gap-md flex w-full items-start'><ul
3173                class='max-w-pageviewport flex list-none flex-wrap gap-md w-fit shrink-0'
3174                role='list'
3175              >
3176                
3177<li
3178  class='max-w-[220px] min-w-[140px]'
3179  
3180>
3181  <a
3182    id='HeaderMenu-ARlRXRGN1cFMrZCtwN__header_link_list_CpVWbf'
3183    href='/collections/mens-gifts-sets'
3184    class='mega-menu-column-title mb-md block nav-link-l2 underline-offset-2 hover:underline'
3185    
3186  >
3187    Shop by Category
3188  </a><ul class='mega-menu-sublist grid list-none gap-sm' role='list'><li class='leading-0'>
3189          <a
3190            id='HeaderMenu-ARlRXRGN1cFMrZCtwN__header_link_list_CpVWbf-moisturizers-face-creams'
3191            href='/collections/moisturizers-and-face-creams-for-men'
3192            class='nav-link-l3 underline-offset-2 hover:underline'
3193            
3194          >
3195            Moisturizers + Face Creams
3196          </a>
3197        </li><li class='leading-0'>
3198          <a
3199            id='HeaderMenu-ARlRXRGN1cFMrZCtwN__header_link_list_CpVWbf-cleansers-exfoliators'
3200            href='/collections/cleanse-exfoliate'
3201            class='nav-link-l3 underline-offset-2 hover:underline'
3202            
3203          >
3204            Cleansers + Exfoliators
3205          </a>
3206        </li><li class='leading-0'>
3207          <a
3208            id='HeaderMenu-ARlRXRGN1cFMrZCtwN__header_link_list_CpVWbf-shave'
3209            href='/collections/shave'
3210            class='nav-link-l3 underline-offset-2 hover:underline'
3211            
3212          >
3213            Shave
3214          </a>
3215        </li><li class='leading-0'>
3216          <a
3217            id='HeaderMenu-ARlRXRGN1cFMrZCtwN__header_link_list_CpVWbf-cologne'
3218            href='/products/clinique-happy-cologne-spray'
3219            class='nav-link-l3 underline-offset-2 hover:underline'
3220            
3221          >
3222            Cologne
3223          </a>
3224        </li><li class='leading-0'>
3225          <a
3226            id='HeaderMenu-ARlRXRGN1cFMrZCtwN__header_link_list_CpVWbf-mens-gift-sets'
3227            href='/collections/mens-gifts-sets'
3228            class='nav-link-l3 underline-offset-2 hover:underline'
3229            
3230          >
3231            Men&#39;s Gift Sets
3232          </a>
3233        </li></ul></li>
3234
3235
3236<li
3237  class='max-w-[220px] min-w-[140px]'
3238  
3239>
3240  <a
3241    id='HeaderMenu-AWFJTRXpkamNYTFlIW__header_link_list_LLXjjT'
3242    href='#'
3243    class='mega-menu-column-title mb-md block nav-link-l2 underline-offset-2 cursor-default'
3244    
3245  >
3246    Shop by Skin Type
3247  </a><ul class='mega-menu-sublist grid list-none gap-sm' role='list'><li class='leading-0'>
3248          <a
3249            id='HeaderMenu-AWFJTRXpkamNYTFlIW__header_link_list_LLXjjT-very-dry-to-dry'
3250            href='/collections/men-skincare?fh_f_elc_product_skin_type=very_dry_to_dry'
3251            class='nav-link-l3 underline-offset-2 hover:underline'
3252            
3253          >
3254            Very Dry to Dry
3255          </a>
3256        </li><li class='leading-0'>
3257          <a
3258            id='HeaderMenu-AWFJTRXpkamNYTFlIW__header_link_list_LLXjjT-dry-combination'
3259            href='/collections/men-skincare?fh_f_elc_product_skin_type=combination%2Cvery_dry_to_dry'
3260            class='nav-link-l3 underline-offset-2 hover:underline'
3261            
3262          >
3263            Dry Combination
3264          </a>
3265        </li><li class='leading-0'>
3266          <a
3267            id='HeaderMenu-AWFJTRXpkamNYTFlIW__header_link_list_LLXjjT-oily-combination'
3268            href='/collections/men-skincare?fh_f_elc_product_skin_type=combination%2Coily'
3269            class='nav-link-l3 underline-offset-2 hover:underline'
3270            
3271          >
3272            Oily Combination
3273          </a>
3274        </li><li class='leading-0'>
3275          <a
3276            id='HeaderMenu-AWFJTRXpkamNYTFlIW__header_link_list_LLXjjT-oily'
3277            href='/collections/men-skincare?fh_f_elc_product_skin_type=oily'
3278            class='nav-link-l3 underline-offset-2 hover:underline'
3279            
3280          >
3281            Oily
3282          </a>
3283        </li></ul></li>
3284
3285
3286              </ul><ul
3287                class='gap-md grid h-full list-none grid-cols-[repeat(var(--mega-menu-image-cols),var(--mega-menu-image-col-width))]'
3288                style='--mega-menu-image-cols: 2; --mega-menu-image-col-width: min(calc(100vw / 7.2), 400px);'
3289                role='list'
3290              >
3291                
3292<li>
3293  
3294<a href='/products/clinique-for-men-daily-hydrator-broad-spectrum-spf-35' class='mega-menu-tile grid grid-cols-1 gap-2xs'><div class='relative' style='aspect-ratio: 1'>
3295<picture class=''>
3296  <source
3297    media='(max-width: 767px)'
3298    srcset='//www.clinique.com/cdn/shop/files/gnav_cfm_hydrator.jpg?format=webp&v=1788454364&width=300 300w, //www.clinique.com/cdn/shop/files/gnav_cfm_hydrator.jpg?format=webp&v=1788454364&width=450 450w'
3299    sizes='200px'
3300    width='486'
3301    height='486'
3302  >
3303<img src="//www.clinique.com/cdn/shop/files/gnav_cfm_hydrator.jpg?format=webp&amp;v=1788454364&amp;width=486" srcset="//www.clinique.com/cdn/shop/files/gnav_cfm_hydrator.jpg?format=webp&amp;v=1788454364&amp;width=200 200w, //www.clinique.com/cdn/shop/files/gnav_cfm_hydrator.jpg?format=webp&amp;v=1788454364&amp;width=400 400w" width="486" height="486" loading="lazy" sizes="200px" class="w-full block w-full h-full object-cover object-cover" fetchpriority="low"></picture>
3304</div>
3305  <p class='mega-menu-tile-title body-xs'>Clinique For Men™ Daily Hydrator Broad Spectrum SPF 35</p></a></li>
3306
3307
3308<li>
3309  
3310<a href='/collections/mens-skincare' class='mega-menu-tile grid grid-cols-1 gap-2xs'><div class='relative' style='aspect-ratio: 1'>
3311<picture class=''>
3312  <source
3313    media='(max-width: 767px)'
3314    srcset='//www.clinique.com/cdn/shop/files/gnav_formen.jpg?format=webp&v=1788454364&width=300 300w, //www.clinique.com/cdn/shop/files/gnav_formen.jpg?format=webp&v=1788454364&width=450 450w'
3315    sizes='200px'
3316    width='510'
3317    height='510'
3318  >
3319<img src="//www.clinique.com/cdn/shop/files/gnav_formen.jpg?format=webp&amp;v=1788454364&amp;width=510" srcset="//www.clinique.com/cdn/shop/files/gnav_formen.jpg?format=webp&amp;v=1788454364&amp;width=200 200w, //www.clinique.com/cdn/shop/files/gnav_formen.jpg?format=webp&amp;v=1788454364&amp;width=400 400w" width="510" height="510" loading="lazy" sizes="200px" class="w-full block w-full h-full object-cover object-cover" fetchpriority="low"></picture>
3320</div>
3321  <p class='mega-menu-tile-title body-xs'>Skincare favorites to keep him looking and feeling his best.</p></a></li>
3322
3323
3324              </ul></div>
3325        </div>
3326      </div>
3327    </div>
3328
3329    <div
3330      class='pointer-events-none invisible absolute left-0 right-0 top-[90%] z-[-1] opacity-0 transition-[opacity,visibility] duration-200 group-focus-within:pointer-events-auto group-focus-within:visible group-focus-within:opacity-100 peer-has-[[aria-expanded="true"]]:pointer-events-auto peer-has-[[aria-expanded="true"]]:visible peer-has-[[aria-expanded="true"]]:opacity-100'
3331      aria-hidden='true'
3332    >
3333      <div class='bg-(--color-overlay) h-[calc(100vh-var(--header-height)+10px)]'></div>
3334    </div></li>
3335
3336<li id='Details-HeaderMenu-AQXJYcUtVWVEwNXJxd__header_mega_menu_TqptdD' >
3337  <div
3338    id='HeaderMenu-AQXJYcUtVWVEwNXJxd__header_mega_menu_TqptdD'
3339    class='p peer flex items-center'
3340  >
3341    <a
3342      class='pb-2xs nav-link flex underline-offset-8 aria-expanded:underline  hover:underline'
3343      href='/pages/offers'
3344      
3345        menu-trigger
3346        aria-haspopup='true'
3347        aria-expanded='false'
3348        aria-controls='MegaMenu-Content-AQXJYcUtVWVEwNXJxd__header_mega_menu_TqptdD'
3349      
3350      
3351    >Offers</a>
3352  </div><div
3353      id='MegaMenu-Content-AQXJYcUtVWVEwNXJxd__header_mega_menu_TqptdD'
3354      class='bg-background text-foreground starting:peer-has-[[aria-expanded="true"]]:opacity-0 absolute left-0 right-0 top-[90%] hidden opacity-0 transition-[opacity,display] duration-200 [transition-behavior:allow-discrete] group-focus-within:block group-focus-within:opacity-100 peer-has-[[aria-expanded="true"]]:block peer-has-[[aria-expanded="true"]]:opacity-100'
3355      aria-hidden='true'
3356      role='region'
3357      menu
3358      aria-labelledby='HeaderMenu-AQXJYcUtVWVEwNXJxd__header_mega_menu_TqptdD'
3359    >
3360      <button
3361        type='button'
3362        menu-close
3363        class='top-2xs right-sm size-7.5 absolute z-10 flex items-center justify-center rounded-none focus-visible:outline focus-visible:outline-offset-2 focus-visible:outline-[var(--color-focus)]'
3364        aria-label='Close'
3365      >
3366<svg-icon
3367  src='icon-close'
3368  class='icon-md'
3369
3370  
3371
3372  
3373  
3374></svg-icon>
3375</button>
3376      <div class='mega-menu-panel px-pagemargin py-lg flex max-h-[calc(100vh-var(--header-height)+10px)] flex-col overflow-y-auto'><div class='mega-menu-content flex flex-col gap-md mx-auto w-fit max-w-full'><a
3377              href='/pages/offers'
3378              class='btn btn-tertiary gap-2xs py-2xs flex items-center '
3379            >
3380              <span>Shop All
3381                Offers</span>
3382
3383              
3384            </a><div class='mega-menu-columns gap-md flex w-full items-start'><ul
3385                class='max-w-pageviewport flex list-none flex-wrap gap-md w-fit shrink-0'
3386                role='list'
3387              >
3388                
3389<li
3390  class='max-w-[220px] min-w-[140px]'
3391  
3392>
3393  <a
3394    id='HeaderMenu-ATnQyRlZKTDVRaGxWM__header_link_list_DLwrgL'
3395    href='#'
3396    class='mega-menu-column-title mb-md block nav-link-l2 underline-offset-2 cursor-default'
3397    
3398  >
3399    All Offers
3400  </a><ul class='mega-menu-sublist grid list-none gap-sm' role='list'><li class='leading-0'>
3401          <a
3402            id='HeaderMenu-ATnQyRlZKTDVRaGxWM__header_link_list_DLwrgL-medical-community'
3403            href='/pages/medical-professionals'
3404            class='nav-link-l3 underline-offset-2 hover:underline'
3405            
3406          >
3407            Medical Community
3408          </a>
3409        </li><li class='leading-0'>
3410          <a
3411            id='HeaderMenu-ATnQyRlZKTDVRaGxWM__header_link_list_DLwrgL-risk-free-foundation-trial'
3412            href='/pages/risk-free-trial'
3413            class='nav-link-l3 underline-offset-2 hover:underline'
3414            
3415          >
3416            Risk-Free Foundation Trial
3417          </a>
3418        </li><li class='leading-0'>
3419          <a
3420            id='HeaderMenu-ATnQyRlZKTDVRaGxWM__header_link_list_DLwrgL-egift-card'
3421            href='/products/clinique-egift-card'
3422            class='nav-link-l3 underline-offset-2 hover:underline'
3423            
3424          >
3425            eGift Card
3426          </a>
3427        </li></ul></li>
3428
3429<li>
3430  <a
3431    id='HeaderMenu-pages-smart-rewards'
3432    href='/pages/smart-rewards'
3433    class='nav-link block flex items-center pb-2xs underline-offset-8 transition-colors hover:underline hover:opacity-70 focus-visible:outline focus-visible:outline-offset-2 focus-visible:outline-current'
3434
3435    
3436
3437    
3438
3439    
3440
3441    
3442  >Smart Rewards</a>
3443</li>
3444
3445              </ul><ul
3446                class='gap-md grid h-full list-none grid-cols-[repeat(var(--mega-menu-image-cols),var(--mega-menu-image-col-width))]'
3447                style='--mega-menu-image-cols: 2; --mega-menu-image-col-width: min(calc(100vw / 7.2), 400px);'
3448                role='list'
3449              >
3450                
3451<li>
3452  
3453<a href='/collections/bestsellers' class='mega-menu-tile grid grid-cols-1 gap-2xs'><div class='relative' style='aspect-ratio: 1'>
3454<picture class=''>
3455  <source
3456    media='(max-width: 767px)'
3457    srcset='//www.clinique.com/cdn/shop/files/FY26_SEPT_PICK_YOUR_TRAVEL_NECESSITIES_NAV.jpg?format=webp&v=1789569796&width=300 300w, //www.clinique.com/cdn/shop/files/FY26_SEPT_PICK_YOUR_TRAVEL_NECESSITIES_NAV.jpg?format=webp&v=1789569796&width=450 450w'
3458    sizes='200px'
3459    width='486'
3460    height='486'
3461  >
3462<img src="//www.clinique.com/cdn/shop/files/FY26_SEPT_PICK_YOUR_TRAVEL_NECESSITIES_NAV.jpg?format=webp&amp;v=1789569796&amp;width=486" srcset="//www.clinique.com/cdn/shop/files/FY26_SEPT_PICK_YOUR_TRAVEL_NECESSITIES_NAV.jpg?format=webp&amp;v=1789569796&amp;width=200 200w, //www.clinique.com/cdn/shop/files/FY26_SEPT_PICK_YOUR_TRAVEL_NECESSITIES_NAV.jpg?format=webp&amp;v=1789569796&amp;width=400 400w" width="486" height="486" loading="lazy" sizes="200px" class="w-full block w-full h-full object-cover object-cover" fetchpriority="low"></picture>
3463</div>
3464  <p class='mega-menu-tile-title body-xs'>Travel ready. Pick 4 on-the-go essentials with eligible $75 purchase</p></a></li>
3465
3466
3467<li>
3468  
3469<a href='/pages/smart-rewards' class='mega-menu-tile grid grid-cols-1 gap-2xs'><div class='relative' style='aspect-ratio: 1'>
3470<picture class=''>
3471  <source
3472    media='(max-width: 767px)'
3473    srcset='//www.clinique.com/cdn/shop/files/052126_offersnav_tout_loyaltyredeem2x.jpg?format=webp&v=1788454364&width=300 300w, //www.clinique.com/cdn/shop/files/052126_offersnav_tout_loyaltyredeem2x.jpg?format=webp&v=1788454364&width=450 450w'
3474    sizes='200px'
3475    width='486'
3476    height='486'
3477  >
3478<img src="//www.clinique.com/cdn/shop/files/052126_offersnav_tout_loyaltyredeem2x.jpg?format=webp&amp;v=1788454364&amp;width=486" srcset="//www.clinique.com/cdn/shop/files/052126_offersnav_tout_loyaltyredeem2x.jpg?format=webp&amp;v=1788454364&amp;width=200 200w, //www.clinique.com/cdn/shop/files/052126_offersnav_tout_loyaltyredeem2x.jpg?format=webp&amp;v=1788454364&amp;width=400 400w" width="486" height="486" loading="lazy" sizes="200px" class="w-full block w-full h-full object-cover object-cover" fetchpriority="low"></picture>
3479</div>
3480  <p class='mega-menu-tile-title body-xs'>Join Smart Rewards and get free standard shipping with any order.</p></a></li>
3481
3482
3483              </ul></div>
3484        </div>
3485      </div>
3486    </div>
3487
3488    <div
3489      class='pointer-events-none invisible absolute left-0 right-0 top-[90%] z-[-1] opacity-0 transition-[opacity,visibility] duration-200 group-focus-within:pointer-events-auto group-focus-within:visible group-focus-within:opacity-100 peer-has-[[aria-expanded="true"]]:pointer-events-auto peer-has-[[aria-expanded="true"]]:visible peer-has-[[aria-expanded="true"]]:opacity-100'
3490      aria-hidden='true'
3491    >
3492      <div class='bg-(--color-overlay) h-[calc(100vh-var(--header-height)+10px)]'></div>
3493    </div></li>
3494
3495<li id='Details-HeaderMenu-Adk1Vcml2VWt0dWRXK__header_mega_menu_zCxM4C' >
3496  <div
3497    id='HeaderMenu-Adk1Vcml2VWt0dWRXK__header_mega_menu_zCxM4C'
3498    class='p peer flex items-center'
3499  >
3500    <a
3501      class='pb-2xs nav-link flex underline-offset-8 aria-expanded:underline  hover:underline'
3502      href='/pages/services'
3503      
3504        menu-trigger
3505        aria-haspopup='true'
3506        aria-expanded='false'
3507        aria-controls='MegaMenu-Content-Adk1Vcml2VWt0dWRXK__header_mega_menu_zCxM4C'
3508      
3509      
3510    >Services</a>
3511  </div><div
3512      id='MegaMenu-Content-Adk1Vcml2VWt0dWRXK__header_mega_menu_zCxM4C'
3513      class='bg-background text-foreground starting:peer-has-[[aria-expanded="true"]]:opacity-0 absolute left-0 right-0 top-[90%] hidden opacity-0 transition-[opacity,display] duration-200 [transition-behavior:allow-discrete] group-focus-within:block group-focus-within:opacity-100 peer-has-[[aria-expanded="true"]]:block peer-has-[[aria-expanded="true"]]:opacity-100'
3514      aria-hidden='true'
3515      role='region'
3516      menu
3517      aria-labelledby='HeaderMenu-Adk1Vcml2VWt0dWRXK__header_mega_menu_zCxM4C'
3518    >
3519      <button
3520        type='button'
3521        menu-close
3522        class='top-2xs right-sm size-7.5 absolute z-10 flex items-center justify-center rounded-none focus-visible:outline focus-visible:outline-offset-2 focus-visible:outline-[var(--color-focus)]'
3523        aria-label='Close'
3524      >
3525<svg-icon
3526  src='icon-close'
3527  class='icon-md'
3528
3529  
3530
3531  
3532  
3533></svg-icon>
3534</button>
3535      <div class='mega-menu-panel px-pagemargin py-lg flex max-h-[calc(100vh-var(--header-height)+10px)] flex-col overflow-y-auto'><div class='mega-menu-content flex flex-col gap-md mx-auto w-fit max-w-full'><a
3536              href='/pages/services'
3537              class='btn btn-tertiary gap-2xs py-2xs flex items-center '
3538            >
3539              <span>Shop All
3540                Services</span>
3541
3542              
3543            </a><div class='mega-menu-columns gap-md flex w-full items-start'><ul
3544                class='max-w-pageviewport flex list-none flex-wrap gap-md w-fit'
3545                role='list'
3546              >
3547                
3548<li
3549  class='max-w-[220px] min-w-[140px]'
3550  
3551>
3552  <a
3553    id='HeaderMenu-ARDdEOTJYdldBSmJ6b__header_link_list_qDGtF4'
3554    href='#'
3555    class='mega-menu-column-title mb-md block nav-link-l2 underline-offset-2 cursor-default'
3556    
3557  >
3558    Skincare Services
3559  </a><ul class='mega-menu-sublist grid list-none gap-sm' role='list'><li class='leading-0'>
3560          <a
3561            id='HeaderMenu-ARDdEOTJYdldBSmJ6b__header_link_list_qDGtF4-clinical-reality-skin-diagnostic'
3562            href='/pages/clinicalreality'
3563            class='nav-link-l3 underline-offset-2 hover:underline'
3564            
3565          >
3566            Clinical Reality Skin Diagnostic
3567          </a>
3568        </li><li class='leading-0'>
3569          <a
3570            id='HeaderMenu-ARDdEOTJYdldBSmJ6b__header_link_list_qDGtF4-skincare-finder-quiz'
3571            href='/pages/skincare-quiz'
3572            class='nav-link-l3 underline-offset-2 hover:underline'
3573            
3574          >
3575            Skincare Finder Quiz
3576          </a>
3577        </li></ul></li>
3578
3579
3580<li
3581  class='max-w-[220px] min-w-[140px]'
3582  
3583>
3584  <a
3585    id='HeaderMenu-AcmpTeGVEblVuSjdNK__header_link_list_6VLjTR'
3586    href='#'
3587    class='mega-menu-column-title mb-md block nav-link-l2 underline-offset-2 cursor-default'
3588    
3589  >
3590    Makeup Services
3591  </a><ul class='mega-menu-sublist grid list-none gap-sm' role='list'><li class='leading-0'>
3592          <a
3593            id='HeaderMenu-AcmpTeGVEblVuSjdNK__header_link_list_6VLjTR-risk-free-foundation-trial'
3594            href='/pages/risk-free-trial'
3595            class='nav-link-l3 underline-offset-2 hover:underline'
3596            
3597          >
3598            Risk-Free Foundation Trial
3599          </a>
3600        </li><li class='leading-0'>
3601          <a
3602            id='HeaderMenu-AcmpTeGVEblVuSjdNK__header_link_list_6VLjTR-foundation-finder'
3603            href='/pages/foundation-finder-quiz'
3604            class='nav-link-l3 underline-offset-2 hover:underline'
3605            
3606          >
3607            Foundation Finder
3608          </a>
3609        </li><li class='leading-0'>
3610          <a
3611            id='HeaderMenu-AcmpTeGVEblVuSjdNK__header_link_list_6VLjTR-makeup-virtual-try-on'
3612            href='/pages/makeup-virtual-try-on'
3613            class='nav-link-l3 underline-offset-2 hover:underline'
3614            
3615          >
3616            Makeup Virtual Try-On
3617          </a>
3618        </li><li class='leading-0'>
3619          <a
3620            id='HeaderMenu-AcmpTeGVEblVuSjdNK__header_link_list_6VLjTR-mascara-finder'
3621            href='/pages/mascara-quiz'
3622            class='nav-link-l3 underline-offset-2 hover:underline'
3623            
3624          >
3625            Mascara Finder
3626          </a>
3627        </li><li class='leading-0'>
3628          <a
3629            id='HeaderMenu-AcmpTeGVEblVuSjdNK__header_link_list_6VLjTR-acuvue®-partnership'
3630            href='/pages/clinique-acuvue-partnership'
3631            class='nav-link-l3 underline-offset-2 hover:underline'
3632            
3633          >
3634            ACUVUE® Partnership
3635          </a>
3636        </li></ul></li>
3637
3638
3639<li
3640  class='max-w-[220px] min-w-[140px]'
3641  
3642>
3643  <a
3644    id='HeaderMenu-AeHNTZlcwMm1jdlJDL__header_link_list_ihKMFb'
3645    href='#'
3646    class='mega-menu-column-title mb-md block nav-link-l2 underline-offset-2 cursor-default'
3647    
3648  >
3649    Fragrance Services
3650  </a><ul class='mega-menu-sublist grid list-none gap-sm' role='list'><li class='leading-0'>
3651          <a
3652            id='HeaderMenu-AeHNTZlcwMm1jdlJDL__header_link_list_ihKMFb-find-your-scent'
3653            href='/pages/discover-clinique-fragrance'
3654            class='nav-link-l3 underline-offset-2 hover:underline'
3655            
3656          >
3657            Find Your Scent
3658          </a>
3659        </li></ul></li>
3660
3661
3662<li
3663  class='max-w-[220px] min-w-[140px]'
3664  
3665>
3666  <a
3667    id='HeaderMenu-AQ1ZuL0dnNU9JcUxVK__header_link_list_tqXcLf'
3668    href='#'
3669    class='mega-menu-column-title mb-md block nav-link-l2 underline-offset-2 cursor-default'
3670    
3671  >
3672    Expert Advice
3673  </a><ul class='mega-menu-sublist grid list-none gap-sm' role='list'><li class='leading-0'>
3674          <a
3675            id='HeaderMenu-AQ1ZuL0dnNU9JcUxVK__header_link_list_tqXcLf-customer-service'
3676            href='/pages/contact-us'
3677            class='nav-link-l3 underline-offset-2 hover:underline'
3678            
3679          >
3680            Customer Service
3681          </a>
3682        </li><li class='leading-0'>
3683          <a
3684            id='HeaderMenu-AQ1ZuL0dnNU9JcUxVK__header_link_list_tqXcLf-in-store-consultations'
3685            href='/pages/store-locator'
3686            class='nav-link-l3 underline-offset-2 hover:underline'
3687            
3688          >
3689            In-Store Consultations
3690          </a>
3691        </li><li class='leading-0'>
3692          <a
3693            id='HeaderMenu-AQ1ZuL0dnNU9JcUxVK__header_link_list_tqXcLf-the-look-lab'
3694            href='/pages/trends'
3695            class='nav-link-l3 underline-offset-2 hover:underline'
3696            
3697          >
3698            The Look Lab
3699          </a>
3700        </li></ul></li>
3701
3702
3703              </ul><ul
3704                class='gap-md grid h-full list-none grid-cols-[repeat(var(--mega-menu-image-cols),var(--mega-menu-image-col-width))]'
3705                style='--mega-menu-image-cols: 1; --mega-menu-image-col-width: min(calc(100vw / 7.2), 400px);'
3706                role='list'
3707              >
3708                
3709<li>
3710  
3711<a href='/pages/skincare-quiz' class='mega-menu-tile grid grid-cols-1 gap-2xs'><div class='relative' style='aspect-ratio: 1'>
3712<picture class=''>
3713  <source
3714    media='(max-width: 767px)'
3715    srcset='//www.clinique.com/cdn/shop/files/gnav_skincare_quiz.jpg?format=webp&v=1788454574&width=300 300w, //www.clinique.com/cdn/shop/files/gnav_skincare_quiz.jpg?format=webp&v=1788454574&width=450 450w, //www.clinique.com/cdn/shop/files/gnav_skincare_quiz.jpg?format=webp&v=1788454574&width=600 600w'
3716    sizes='200px'
3717    width='632'
3718    height='632'
3719  >
3720<img src="//www.clinique.com/cdn/shop/files/gnav_skincare_quiz.jpg?format=webp&amp;v=1788454574&amp;width=632" srcset="//www.clinique.com/cdn/shop/files/gnav_skincare_quiz.jpg?format=webp&amp;v=1788454574&amp;width=200 200w, //www.clinique.com/cdn/shop/files/gnav_skincare_quiz.jpg?format=webp&amp;v=1788454574&amp;width=400 400w" width="632" height="632" loading="lazy" sizes="200px" class="w-full block w-full h-full object-cover object-cover" fetchpriority="low"></picture>
3721</div>
3722  <p class='mega-menu-tile-title body-xs'>Skincare Finder. 3 quick questions lock in on key products for your routine.</p></a></li>
3723
3724
3725              </ul></div>
3726        </div>
3727      </div>
3728    </div>
3729
3730    <div
3731      class='pointer-events-none invisible absolute left-0 right-0 top-[90%] z-[-1] opacity-0 transition-[opacity,visibility] duration-200 group-focus-within:pointer-events-auto group-focus-within:visible group-focus-within:opacity-100 peer-has-[[aria-expanded="true"]]:pointer-events-auto peer-has-[[aria-expanded="true"]]:visible peer-has-[[aria-expanded="true"]]:opacity-100'
3732      aria-hidden='true'
3733    >
3734      <div class='bg-(--color-overlay) h-[calc(100vh-var(--header-height)+10px)]'></div>
3735    </div></li>
3736
3737
3738  </ul>
3739</mega-menu>
3740</nav><div class='flex w-full items-center justify-between lg:hidden'>
3741      <div class='flex flex-1 items-center justify-start gap-2xs'><div>
3742<dialog-toggle modal-id='mobile-menu-drawer' class='inline-flex place-items-center'><button
3743    aria-haspopup='dialog'
3744    aria-controls='mobile-menu-drawer'
3745    class="group/menutoggle flex size-7.5 items-center justify-center rounded-none focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[var(--color-focus)] lg:hidden"
3746    
3747  >
3748<svg-icon
3749  src='icon-hamburger'
3750  class='icon-md group-[[open]]/menutoggle:hidden'
3751
3752  
3753
3754  
3755  
3756></svg-icon>
3757
3758<svg-icon
3759  src='icon-close'
3760  class='icon-md group-[[open]]/menutoggle:inline-flex hidden'
3761
3762  
3763
3764  
3765  
3766></svg-icon>
3767<span class="sr-only">Menu</span>
3768  </button>
3769</dialog-toggle>
3770
3771  <!-- ##start:entry-lazy##main-header.js##end:entry-lazy## -->
3772
3773
3774
3775
3776<extended-dialog
3777    cloak
3778    type='drawer'
3779    id='mobile-menu-drawer'
3780
3781    
3782      url=''
3783    
3784
3785    
3786
3787    
3788      anchor='left'
3789    
3790
3791    
3792      close-on-backdrop-click='true'
3793    
3794
3795    
3796      without-title='true'
3797    
3798
3799    
3800
3801    
3802
3803    
3804
3805    
3806      parent-class='bg-background text-foreground mobile-menu-dialog color-scheme-1'
3807    
3808
3809    
3810
3811    
3812  ><p slot='header' class='h5' data-slot='header'>Menu</p>
3813  <div id='menu-drawer' class='mobile-menu-panel-body grid min-h-full grid-cols-1 grid-rows-[1fr_auto] pt-sm pb-lg'>
3814    <nav aria-label='Main Menu Drawer'>
3815      <ul class='grid list-none grid-cols-1 px-sm' role='list'>
3816        <li>
3817<dialog-toggle modal-id='Details-menu-drawer-menu-item-AZDhHYnRFUnBMckNzU__header_mega_menu_VQ6B4T' class='w-full'><button
3818      class="mobile-menu-l1-row nav-link inline-flex w-full items-center justify-between py-accordion-paddingvertical text-danger"
3819      aria-haspopup='dialog'
3820      aria-controls='Details-menu-drawer-menu-item-AZDhHYnRFUnBMckNzU__header_mega_menu_VQ6B4T'
3821    >
3822      <span>Holiday Gifts + Sets</span>
3823      
3824<svg-icon
3825  src='icon-caret'
3826  class='icon-md -rotate-90'
3827
3828  
3829
3830  
3831  
3832></svg-icon>
3833
3834    </button>
3835</dialog-toggle>
3836<extended-dialog
3837    cloak
3838    type='drawer'
3839    id='Details-menu-drawer-menu-item-AZDhHYnRFUnBMckNzU__header_mega_menu_VQ6B4T'
3840
3841    
3842      url=''
3843    
3844
3845    
3846
3847    
3848      anchor='left'
3849    
3850
3851    
3852      close-on-backdrop-click='true'
3853    
3854
3855    
3856
3857    
3858
3859    
3860
3861    
3862
3863    
3864      parent-class='bg-background text-foreground mobile-menu-dialog color-scheme-1'
3865    
3866
3867    
3868
3869    
3870  ><div slot='header' class='relative flex w-full items-center'>
3871      <dialog-toggle modal-id='Details-menu-drawer-menu-item-AZDhHYnRFUnBMckNzU__header_mega_menu_VQ6B4T' class='size-icon-md shrink-0'>
3872        <button class="flex" type='button' aria-label='Back'>
3873<svg-icon
3874  src='icon-caret'
3875  class='icon-md rotate-90'
3876
3877  
3878
3879  
3880  
3881></svg-icon>
3882</button>
3883      </dialog-toggle>
3884      <span class='mobile-menu-panel-title text-legal pointer-events-none absolute inset-0 flex items-center justify-center font-medium'>Holiday Gifts + Sets</span>
3885    </div>
3886
3887    <div class='mobile-menu-panel-body px-sm py-lg flex flex-col overflow-y-auto'><a
3888          href='/collections/all-gifts-sets'
3889          class='mb-sm btn btn-tertiary gap-2xs flex items-center '
3890        >
3891          <span>Shop All Holiday Gifts + Sets</span>
3892          
3893          
3894        </a><ul class='mb-xl grid list-none grid-cols-1' role='list'>
3895          <li class='list-none'>
3896  <!-- ##start:entry-lazy##core/core-accordion.ts##end:entry-lazy## -->
3897
3898<custom-accordion
3899  class='group block w-full border-solid border-accordion-border [&[expanded]]:border-accordion-border-active mobile-menu-row border-b !border-border-02 [&[expanded]]:!border-foreground py-accordion-paddingvertical'
3900  
3901  
3902>
3903  <button
3904    type='button'
3905    aria-expanded='false'
3906    aria-controls='Details-ANXF1amZPdk5DUzJpN__header_link_list_LJwQkt'
3907    data-accordion-toggle
3908    class='flex w-full min-w-0 items-center justify-between gap-xs p outline-none focus-visible:ring-2 focus-visible:ring-focus focus-visible:ring-offset-2 max-md:p-0 focus-visible:ring-offset-background'
3909  >
3910    <span class='min-w-0 flex-1 text-start nav-link-l2'>Shop by Price</span>
3911    <span class='flex shrink-0 items-center' aria-hidden='true'>
3912<svg-icon
3913  src='icon-plus'
3914  class='icon-md shrink-0 group-has-[[data-open]]:hidden'
3915
3916  
3917
3918  
3919  
3920></svg-icon>
3921
3922<svg-icon
3923  src='icon-minus'
3924  class='icon-md shrink-0 group-has-[[data-open]]:block hidden'
3925
3926  
3927
3928  
3929  
3930></svg-icon>
3931</span>
3932  </button>
3933  <div
3934    id='Details-ANXF1amZPdk5DUzJpN__header_link_list_LJwQkt'
3935    class=' invisible grid grid-rows-[0fr] max-md:px-0 text-foreground-secondary transition-[visibility,grid-template-rows] duration-300 [overflow-anchor:none] group-has-[[data-open]]:visible group-has-[[data-open]]:grid-rows-[1fr]'
3936    data-accordion-content
3937    
3938  >
3939    <div class='overflow-hidden'>
3940      <div class='pt-5 [&_*:last-child]:mb-0'>
3941        
3942          <ul class='mobile-menu-sublist grid list-none grid-cols-1 gap-y-0 ps-sm pb-xs' role='list'><li class='list-none py-xs first:pt-0 last:pb-0'>
3943            <a
3944              id='HeaderDrawer-ANXF1amZPdk5DUzJpN__header_link_list_LJwQkt-gifts-25-under'
3945              href='/collections/gifts-under-25'
3946              class='flex w-full items-center nav-link-l3'
3947              
3948            >
3949              Gifts $25 &amp; Under
3950            </a>
3951          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
3952            <a
3953              id='HeaderDrawer-ANXF1amZPdk5DUzJpN__header_link_list_LJwQkt-gifts-60-under'
3954              href='/collections/gifts-under-60'
3955              class='flex w-full items-center nav-link-l3'
3956              
3957            >
3958              Gifts $60 &amp; Under
3959            </a>
3960          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
3961            <a
3962              id='HeaderDrawer-ANXF1amZPdk5DUzJpN__header_link_list_LJwQkt-gifts-99-under'
3963              href='/collections/gifts-under-99'
3964              class='flex w-full items-center nav-link-l3'
3965              
3966            >
3967              Gifts $99 &amp; Under
3968            </a>
3969          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
3970            <a
3971              id='HeaderDrawer-ANXF1amZPdk5DUzJpN__header_link_list_LJwQkt-luxury-gifts'
3972              href='/collections/luxury-gifts'
3973              class='flex w-full items-center nav-link-l3'
3974              
3975            >
3976              Luxury Gifts
3977            </a>
3978          </li></ul>
3979        
3980      </div>
3981    </div>
3982  </div>
3983</custom-accordion>
3984</li>
3985<li class='list-none'>
3986  <!-- ##start:entry-lazy##core/core-accordion.ts##end:entry-lazy## -->
3987
3988<custom-accordion
3989  class='group block w-full border-solid border-accordion-border [&[expanded]]:border-accordion-border-active mobile-menu-row border-b !border-border-02 [&[expanded]]:!border-foreground py-accordion-paddingvertical'
3990  
3991  
3992>
3993  <button
3994    type='button'
3995    aria-expanded='false'
3996    aria-controls='Details-AeTM4SmsvdmJRUHFnL__header_link_list_k77Act'
3997    data-accordion-toggle
3998    class='flex w-full min-w-0 items-center justify-between gap-xs p outline-none focus-visible:ring-2 focus-visible:ring-focus focus-visible:ring-offset-2 max-md:p-0 focus-visible:ring-offset-background'
3999  >
4000    <span class='min-w-0 flex-1 text-start nav-link-l2'>Shop by Category</span>
4001    <span class='flex shrink-0 items-center' aria-hidden='true'>
4002<svg-icon
4003  src='icon-plus'
4004  class='icon-md shrink-0 group-has-[[data-open]]:hidden'
4005
4006  
4007
4008  
4009  
4010></svg-icon>
4011
4012<svg-icon
4013  src='icon-minus'
4014  class='icon-md shrink-0 group-has-[[data-open]]:block hidden'
4015
4016  
4017
4018  
4019  
4020></svg-icon>
4021</span>
4022  </button>
4023  <div
4024    id='Details-AeTM4SmsvdmJRUHFnL__header_link_list_k77Act'
4025    class=' invisible grid grid-rows-[0fr] max-md:px-0 text-foreground-secondary transition-[visibility,grid-template-rows] duration-300 [overflow-anchor:none] group-has-[[data-open]]:visible group-has-[[data-open]]:grid-rows-[1fr]'
4026    data-accordion-content
4027    
4028  >
4029    <div class='overflow-hidden'>
4030      <div class='pt-5 [&_*:last-child]:mb-0'>
4031        
4032          <ul class='mobile-menu-sublist grid list-none grid-cols-1 gap-y-0 ps-sm pb-xs' role='list'><li class='list-none py-xs first:pt-0 last:pb-0'>
4033            <a
4034              id='HeaderDrawer-AeTM4SmsvdmJRUHFnL__header_link_list_k77Act-stocking-stuffers'
4035              href='/collections/stocking-stuffers'
4036              class='flex w-full items-center nav-link-l3'
4037              
4038            >
4039              Stocking Stuffers
4040            </a>
4041          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
4042            <a
4043              id='HeaderDrawer-AeTM4SmsvdmJRUHFnL__header_link_list_k77Act-skincare-gift-sets'
4044              href='/collections/all-gifts-sets?fh_f_fhr_product_type=skincaregifts'
4045              class='flex w-full items-center nav-link-l3'
4046              
4047            >
4048              Skincare Gift Sets
4049            </a>
4050          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
4051            <a
4052              id='HeaderDrawer-AeTM4SmsvdmJRUHFnL__header_link_list_k77Act-makeup-gift-sets'
4053              href='/collections/all-gifts-sets?fh_f_fhr_product_type=makeupgifts'
4054              class='flex w-full items-center nav-link-l3'
4055              
4056            >
4057              Makeup Gift Sets
4058            </a>
4059          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
4060            <a
4061              id='HeaderDrawer-AeTM4SmsvdmJRUHFnL__header_link_list_k77Act-fragrance-gift-sets'
4062              href='/collections/all-gifts-sets?fh_f_fhr_product_type=fragrancesets'
4063              class='flex w-full items-center nav-link-l3'
4064              
4065            >
4066              Fragrance Gift Sets
4067            </a>
4068          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
4069            <a
4070              id='HeaderDrawer-AeTM4SmsvdmJRUHFnL__header_link_list_k77Act-gift-sets-for-men'
4071              href='/collections/mens-gifts-sets'
4072              class='flex w-full items-center nav-link-l3'
4073              
4074            >
4075              Gift Sets for Men
4076            </a>
4077          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
4078            <a
4079              id='HeaderDrawer-AeTM4SmsvdmJRUHFnL__header_link_list_k77Act-holiday-gift-guide'
4080              href='/pages/holiday-gift-guide'
4081              class='flex w-full items-center nav-link-l3'
4082              
4083            >
4084              Holiday Gift Guide
4085            </a>
4086          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
4087            <a
4088              id='HeaderDrawer-AeTM4SmsvdmJRUHFnL__header_link_list_k77Act-gift-finder-quiz'
4089              href='/pages/holiday-gift-finder-quiz'
4090              class='flex w-full items-center nav-link-l3'
4091              
4092            >
4093              Gift Finder Quiz
4094            </a>
4095          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
4096            <a
4097              id='HeaderDrawer-AeTM4SmsvdmJRUHFnL__header_link_list_k77Act-gift-with-purchase'
4098              href='/pages/gift-with-purchase'
4099              class='flex w-full items-center nav-link-l3'
4100              
4101            >
4102              Gift with Purchase
4103            </a>
4104          </li></ul>
4105        
4106      </div>
4107    </div>
4108  </div>
4109</custom-accordion>
4110</li>
4111
4112        </ul><ul class='gap-y-md grid list-none grid-cols-1' role='list'>
4113          
4114<li>
4115  
4116<a href='/products/great-skin-everywhere-for-dry-combination-skin' class='flex items-center gap-sm'><div class='size-30 rounded-images-radius relative shrink-0 overflow-hidden'>
4117<picture class=''>
4118  <source
4119    media='(max-width: 767px)'
4120    srcset='//www.clinique.com/cdn/shop/files/gnavtout_3step_dry.png?format=webp&v=1790626696&width=300 300w'
4121    sizes='120px'
4122    width='400'
4123    height='400'
4124  >
4125<img src="//www.clinique.com/cdn/shop/files/gnavtout_3step_dry.png?format=webp&amp;v=1790626696&amp;width=400" srcset="//www.clinique.com/cdn/shop/files/gnavtout_3step_dry.png?format=webp&amp;v=1790626696&amp;width=120 120w, //www.clinique.com/cdn/shop/files/gnavtout_3step_dry.png?format=webp&amp;v=1790626696&amp;width=240 240w" width="400" height="400" loading="lazy" sizes="120px" class="w-full block size-full object-cover object-cover" fetchpriority="low"></picture>
4126</div><p class='mega-menu-tile-title body-sm font-light'>Great Skin Everywhere: For Dry Combination Skin</p></a></li>
4127
4128
4129
4130<li>
4131  
4132<a href='/products/ready-in-5-skincare-makeup-set' class='flex items-center gap-sm'><div class='size-30 rounded-images-radius relative shrink-0 overflow-hidden'>
4133<picture class=''>
4134  <source
4135    media='(max-width: 767px)'
4136    srcset='//www.clinique.com/cdn/shop/files/gnavtout_readyin5.png?format=webp&v=1790626778&width=300 300w'
4137    sizes='120px'
4138    width='400'
4139    height='400'
4140  >
4141<img src="//www.clinique.com/cdn/shop/files/gnavtout_readyin5.png?format=webp&amp;v=1790626778&amp;width=400" srcset="//www.clinique.com/cdn/shop/files/gnavtout_readyin5.png?format=webp&amp;v=1790626778&amp;width=120 120w, //www.clinique.com/cdn/shop/files/gnavtout_readyin5.png?format=webp&amp;v=1790626778&amp;width=240 240w" width="400" height="400" loading="lazy" sizes="120px" class="w-full block size-full object-cover object-cover" fetchpriority="low"></picture>
4142</div><p class='mega-menu-tile-title body-sm font-light'>Ready In 5 Skincare + Makeup Set</p></a></li>
4143
4144
4145
4146        </ul></div>
4147  </extended-dialog></li>
4148<li>
4149<dialog-toggle modal-id='Details-menu-drawer-menu-item-ARDVXWUY0UHQ0dGNid__header_mega_menu_ntic3g' class='w-full'><button
4150      class="mobile-menu-l1-row nav-link inline-flex w-full items-center justify-between py-accordion-paddingvertical"
4151      aria-haspopup='dialog'
4152      aria-controls='Details-menu-drawer-menu-item-ARDVXWUY0UHQ0dGNid__header_mega_menu_ntic3g'
4153    >
4154      <span>New</span>
4155      
4156<svg-icon
4157  src='icon-caret'
4158  class='icon-md -rotate-90'
4159
4160  
4161
4162  
4163  
4164></svg-icon>
4165
4166    </button>
4167</dialog-toggle>
4168<extended-dialog
4169    cloak
4170    type='drawer'
4171    id='Details-menu-drawer-menu-item-ARDVXWUY0UHQ0dGNid__header_mega_menu_ntic3g'
4172
4173    
4174      url=''
4175    
4176
4177    
4178
4179    
4180      anchor='left'
4181    
4182
4183    
4184      close-on-backdrop-click='true'
4185    
4186
4187    
4188
4189    
4190
4191    
4192
4193    
4194
4195    
4196      parent-class='bg-background text-foreground mobile-menu-dialog color-scheme-1'
4197    
4198
4199    
4200
4201    
4202  ><div slot='header' class='relative flex w-full items-center'>
4203      <dialog-toggle modal-id='Details-menu-drawer-menu-item-ARDVXWUY0UHQ0dGNid__header_mega_menu_ntic3g' class='size-icon-md shrink-0'>
4204        <button class="flex" type='button' aria-label='Back'>
4205<svg-icon
4206  src='icon-caret'
4207  class='icon-md rotate-90'
4208
4209  
4210
4211  
4212  
4213></svg-icon>
4214</button>
4215      </dialog-toggle>
4216      <span class='mobile-menu-panel-title text-legal pointer-events-none absolute inset-0 flex items-center justify-center font-medium'>New</span>
4217    </div>
4218
4219    <div class='mobile-menu-panel-body px-sm py-lg flex flex-col overflow-y-auto'><a
4220          href='/collections/just-arrived'
4221          class='mb-sm btn btn-tertiary gap-2xs flex items-center '
4222        >
4223          <span>Shop All New</span>
4224          
4225          
4226        </a><ul class='mb-xl grid list-none grid-cols-1' role='list'>
4227          <li class='list-none'>
4228  <!-- ##start:entry-lazy##core/core-accordion.ts##end:entry-lazy## -->
4229
4230<custom-accordion
4231  class='group block w-full border-solid border-accordion-border [&[expanded]]:border-accordion-border-active mobile-menu-row border-b !border-border-02 [&[expanded]]:!border-foreground py-accordion-paddingvertical'
4232  
4233  
4234>
4235  <button
4236    type='button'
4237    aria-expanded='false'
4238    aria-controls='Details-AVm1xSGtDcW9rWU9Mb__header_link_list_dVwFtJ'
4239    data-accordion-toggle
4240    class='flex w-full min-w-0 items-center justify-between gap-xs p outline-none focus-visible:ring-2 focus-visible:ring-focus focus-visible:ring-offset-2 max-md:p-0 focus-visible:ring-offset-background'
4241  >
4242    <span class='min-w-0 flex-1 text-start nav-link-l2'>New Skincare</span>
4243    <span class='flex shrink-0 items-center' aria-hidden='true'>
4244<svg-icon
4245  src='icon-plus'
4246  class='icon-md shrink-0 group-has-[[data-open]]:hidden'
4247
4248  
4249
4250  
4251  
4252></svg-icon>
4253
4254<svg-icon
4255  src='icon-minus'
4256  class='icon-md shrink-0 group-has-[[data-open]]:block hidden'
4257
4258  
4259
4260  
4261  
4262></svg-icon>
4263</span>
4264  </button>
4265  <div
4266    id='Details-AVm1xSGtDcW9rWU9Mb__header_link_list_dVwFtJ'
4267    class=' invisible grid grid-rows-[0fr] max-md:px-0 text-foreground-secondary transition-[visibility,grid-template-rows] duration-300 [overflow-anchor:none] group-has-[[data-open]]:visible group-has-[[data-open]]:grid-rows-[1fr]'
4268    data-accordion-content
4269    
4270  >
4271    <div class='overflow-hidden'>
4272      <div class='pt-5 [&_*:last-child]:mb-0'>
4273        
4274          <ul class='mobile-menu-sublist grid list-none grid-cols-1 gap-y-0 ps-sm pb-xs' role='list'><li class='list-none py-xs first:pt-0 last:pb-0'>
4275            <a
4276              id='HeaderDrawer-AVm1xSGtDcW9rWU9Mb__header_link_list_dVwFtJ-daily-calm'
4277              href='/pages/daily-calm-collection'
4278              class='flex w-full items-center nav-link-l3'
4279              
4280            >
4281              Daily Calm
4282            </a>
4283          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
4284            <a
4285              id='HeaderDrawer-AVm1xSGtDcW9rWU9Mb__header_link_list_dVwFtJ-moisture-surge-exfoliating-glow-cleanser'
4286              href='/products/moisture-surge-exfoliating-glow-cleanser'
4287              class='flex w-full items-center nav-link-l3'
4288              
4289            >
4290              Moisture Surge Exfoliating Glow Cleanser
4291            </a>
4292          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
4293            <a
4294              id='HeaderDrawer-AVm1xSGtDcW9rWU9Mb__header_link_list_dVwFtJ-smart-clinical-repair-collagen-pdrn-cream'
4295              href='/products/clinique-smart-clinical-repair-collagen-pdrn-cream'
4296              class='flex w-full items-center nav-link-l3'
4297              
4298            >
4299              Smart Clinical Repair Collagen + PDRN Cream
4300            </a>
4301          </li></ul>
4302        
4303      </div>
4304    </div>
4305  </div>
4306</custom-accordion>
4307</li>
4308<li class='list-none'>
4309  <!-- ##start:entry-lazy##core/core-accordion.ts##end:entry-lazy## -->
4310
4311<custom-accordion
4312  class='group block w-full border-solid border-accordion-border [&[expanded]]:border-accordion-border-active mobile-menu-row border-b !border-border-02 [&[expanded]]:!border-foreground py-accordion-paddingvertical'
4313  
4314  
4315>
4316  <button
4317    type='button'
4318    aria-expanded='false'
4319    aria-controls='Details-ASUNKVnEzL3NlVFZlZ__header_link_list_6raXbW'
4320    data-accordion-toggle
4321    class='flex w-full min-w-0 items-center justify-between gap-xs p outline-none focus-visible:ring-2 focus-visible:ring-focus focus-visible:ring-offset-2 max-md:p-0 focus-visible:ring-offset-background'
4322  >
4323    <span class='min-w-0 flex-1 text-start nav-link-l2'>New Makeup</span>
4324    <span class='flex shrink-0 items-center' aria-hidden='true'>
4325<svg-icon
4326  src='icon-plus'
4327  class='icon-md shrink-0 group-has-[[data-open]]:hidden'
4328
4329  
4330
4331  
4332  
4333></svg-icon>
4334
4335<svg-icon
4336  src='icon-minus'
4337  class='icon-md shrink-0 group-has-[[data-open]]:block hidden'
4338
4339  
4340
4341  
4342  
4343></svg-icon>
4344</span>
4345  </button>
4346  <div
4347    id='Details-ASUNKVnEzL3NlVFZlZ__header_link_list_6raXbW'
4348    class=' invisible grid grid-rows-[0fr] max-md:px-0 text-foreground-secondary transition-[visibility,grid-template-rows] duration-300 [overflow-anchor:none] group-has-[[data-open]]:visible group-has-[[data-open]]:grid-rows-[1fr]'
4349    data-accordion-content
4350    
4351  >
4352    <div class='overflow-hidden'>
4353      <div class='pt-5 [&_*:last-child]:mb-0'>
4354        
4355          <ul class='mobile-menu-sublist grid list-none grid-cols-1 gap-y-0 ps-sm pb-xs' role='list'><li class='list-none py-xs first:pt-0 last:pb-0'>
4356            <a
4357              id='HeaderDrawer-ASUNKVnEzL3NlVFZlZ__header_link_list_6raXbW-black-honey-collection'
4358              href='/pages/black-honey'
4359              class='flex w-full items-center nav-link-l3'
4360              
4361            >
4362              Black Honey Collection
4363            </a>
4364          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
4365            <a
4366              id='HeaderDrawer-ASUNKVnEzL3NlVFZlZ__header_link_list_6raXbW-chubby-stick-shadow-tint-for-eyes'
4367              href='/products/chubby-stick-shadow-tint-for-eyes'
4368              class='flex w-full items-center nav-link-l3'
4369              
4370            >
4371              Chubby Stick Shadow Tint For Eyes
4372            </a>
4373          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
4374            <a
4375              id='HeaderDrawer-ASUNKVnEzL3NlVFZlZ__header_link_list_6raXbW-quickliner-lustre-eyeliner'
4376              href='/products/quickliner-for-eyes-intense-lustre-eyeliner'
4377              class='flex w-full items-center nav-link-l3'
4378              
4379            >
4380              Quickliner Lustre Eyeliner
4381            </a>
4382          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
4383            <a
4384              id='HeaderDrawer-ASUNKVnEzL3NlVFZlZ__header_link_list_6raXbW-daily-calm'
4385              href='/pages/daily-calm-collection'
4386              class='flex w-full items-center nav-link-l3'
4387              
4388            >
4389              Daily Calm
4390            </a>
4391          </li></ul>
4392        
4393      </div>
4394    </div>
4395  </div>
4396</custom-accordion>
4397</li>
4398<li class='list-none'>
4399  <!-- ##start:entry-lazy##core/core-accordion.ts##end:entry-lazy## -->
4400
4401<custom-accordion
4402  class='group block w-full border-solid border-accordion-border [&[expanded]]:border-accordion-border-active mobile-menu-row border-b !border-border-02 [&[expanded]]:!border-foreground py-accordion-paddingvertical'
4403  
4404  
4405>
4406  <button
4407    type='button'
4408    aria-expanded='false'
4409    aria-controls='Details-AQWVxRnYvN2pNVXBuY__header_link_list_tGmGJj'
4410    data-accordion-toggle
4411    class='flex w-full min-w-0 items-center justify-between gap-xs p outline-none focus-visible:ring-2 focus-visible:ring-focus focus-visible:ring-offset-2 max-md:p-0 focus-visible:ring-offset-background'
4412  >
4413    <span class='min-w-0 flex-1 text-start nav-link-l2'>Featured</span>
4414    <span class='flex shrink-0 items-center' aria-hidden='true'>
4415<svg-icon
4416  src='icon-plus'
4417  class='icon-md shrink-0 group-has-[[data-open]]:hidden'
4418
4419  
4420
4421  
4422  
4423></svg-icon>
4424
4425<svg-icon
4426  src='icon-minus'
4427  class='icon-md shrink-0 group-has-[[data-open]]:block hidden'
4428
4429  
4430
4431  
4432  
4433></svg-icon>
4434</span>
4435  </button>
4436  <div
4437    id='Details-AQWVxRnYvN2pNVXBuY__header_link_list_tGmGJj'
4438    class=' invisible grid grid-rows-[0fr] max-md:px-0 text-foreground-secondary transition-[visibility,grid-template-rows] duration-300 [overflow-anchor:none] group-has-[[data-open]]:visible group-has-[[data-open]]:grid-rows-[1fr]'
4439    data-accordion-content
4440    
4441  >
4442    <div class='overflow-hidden'>
4443      <div class='pt-5 [&_*:last-child]:mb-0'>
4444        
4445          <ul class='mobile-menu-sublist grid list-none grid-cols-1 gap-y-0 ps-sm pb-xs' role='list'><li class='list-none py-xs first:pt-0 last:pb-0'>
4446            <a
4447              id='HeaderDrawer-AQWVxRnYvN2pNVXBuY__header_link_list_tGmGJj-the-look-lab'
4448              href='/pages/trends'
4449              class='flex w-full items-center nav-link-l3'
4450              
4451            >
4452              The Look Lab
4453            </a>
4454          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
4455            <a
4456              id='HeaderDrawer-AQWVxRnYvN2pNVXBuY__header_link_list_tGmGJj-fsa-eligible'
4457              href='/collections/fsa-hsa-eligible-skincare-products'
4458              class='flex w-full items-center nav-link-l3'
4459              
4460            >
4461              FSA Eligible
4462            </a>
4463          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
4464            <a
4465              id='HeaderDrawer-AQWVxRnYvN2pNVXBuY__header_link_list_tGmGJj-acuvue®-partnership'
4466              href='/pages/clinique-acuvue-partnership'
4467              class='flex w-full items-center nav-link-l3'
4468              
4469            >
4470              ACUVUE® Partnership
4471            </a>
4472          </li></ul>
4473        
4474      </div>
4475    </div>
4476  </div>
4477</custom-accordion>
4478</li>
4479
4480        </ul><ul class='gap-y-md grid list-none grid-cols-1' role='list'>
4481          
4482<li>
4483  
4484<a href='/products/chubby-stick-shadow-tint-for-eyes' class='flex items-center gap-sm'><div class='size-30 rounded-images-radius relative shrink-0 overflow-hidden'>
4485<picture class=''>
4486  <source
4487    media='(max-width: 767px)'
4488    srcset='//www.clinique.com/cdn/shop/files/chubbyeye_gnav.jpg?format=webp&v=1788453869&width=300 300w, //www.clinique.com/cdn/shop/files/chubbyeye_gnav.jpg?format=webp&v=1788453869&width=450 450w'
4489    sizes='120px'
4490    width='488'
4491    height='488'
4492  >
4493<img src="//www.clinique.com/cdn/shop/files/chubbyeye_gnav.jpg?format=webp&amp;v=1788453869&amp;width=488" srcset="//www.clinique.com/cdn/shop/files/chubbyeye_gnav.jpg?format=webp&amp;v=1788453869&amp;width=120 120w, //www.clinique.com/cdn/shop/files/chubbyeye_gnav.jpg?format=webp&amp;v=1788453869&amp;width=240 240w" width="488" height="488" loading="lazy" sizes="120px" class="w-full block size-full object-cover object-cover" fetchpriority="low"></picture>
4494</div><p class='mega-menu-tile-title body-sm font-light'>Easy Chubby Sticks in 6 wearable shades for eyes.</p></a></li>
4495
4496
4497
4498<li>
4499  
4500<a href='/products/clinique-smart-clinical-repair-collagen-pdrn-cream' class='flex items-center gap-sm'><div class='size-30 rounded-images-radius relative shrink-0 overflow-hidden'>
4501<picture class=''>
4502  <source
4503    media='(max-width: 767px)'
4504    srcset='//www.clinique.com/cdn/shop/files/smartpdrn_gnav.jpg?format=webp&v=1788453892&width=300 300w, //www.clinique.com/cdn/shop/files/smartpdrn_gnav.jpg?format=webp&v=1788453892&width=450 450w'
4505    sizes='120px'
4506    width='486'
4507    height='486'
4508  >
4509<img src="//www.clinique.com/cdn/shop/files/smartpdrn_gnav.jpg?format=webp&amp;v=1788453892&amp;width=486" srcset="//www.clinique.com/cdn/shop/files/smartpdrn_gnav.jpg?format=webp&amp;v=1788453892&amp;width=120 120w, //www.clinique.com/cdn/shop/files/smartpdrn_gnav.jpg?format=webp&amp;v=1788453892&amp;width=240 240w" width="486" height="486" loading="lazy" sizes="120px" class="w-full block size-full object-cover object-cover" fetchpriority="low"></picture>
4510</div><p class='mega-menu-tile-title body-sm font-light'>Clinique Smart Clinical Repair™ Collagen + PDRN Cream</p></a></li>
4511
4512
4513
4514<li>
4515  
4516<a href='/products/moisture-surge-exfoliating-glow-cleanser' class='flex items-center gap-sm'><div class='size-30 rounded-images-radius relative shrink-0 overflow-hidden'>
4517<picture class=''>
4518  <source
4519    media='(max-width: 767px)'
4520    srcset='//www.clinique.com/cdn/shop/files/mscleanser_gnav.jpg?format=webp&v=1788453869&width=300 300w, //www.clinique.com/cdn/shop/files/mscleanser_gnav.jpg?format=webp&v=1788453869&width=450 450w'
4521    sizes='120px'
4522    width='486'
4523    height='486'
4524  >
4525<img src="//www.clinique.com/cdn/shop/files/mscleanser_gnav.jpg?format=webp&amp;v=1788453869&amp;width=486" srcset="//www.clinique.com/cdn/shop/files/mscleanser_gnav.jpg?format=webp&amp;v=1788453869&amp;width=120 120w, //www.clinique.com/cdn/shop/files/mscleanser_gnav.jpg?format=webp&amp;v=1788453869&amp;width=240 240w" width="486" height="486" loading="lazy" sizes="120px" class="w-full block size-full object-cover object-cover" fetchpriority="low"></picture>
4526</div><p class='mega-menu-tile-title body-sm font-light'>Moisture Surge™ Exfoliating Glow Cleanser</p></a></li>
4527
4528
4529
4530        </ul></div>
4531  </extended-dialog></li>
4532<li>
4533<dialog-toggle modal-id='Details-menu-drawer-menu-item-ATGdmRDNqbDlxUmtuZ__header_mega_menu_LTB3YT' class='w-full'><button
4534      class="mobile-menu-l1-row nav-link inline-flex w-full items-center justify-between py-accordion-paddingvertical"
4535      aria-haspopup='dialog'
4536      aria-controls='Details-menu-drawer-menu-item-ATGdmRDNqbDlxUmtuZ__header_mega_menu_LTB3YT'
4537    >
4538      <span>Bestsellers</span>
4539      
4540<svg-icon
4541  src='icon-caret'
4542  class='icon-md -rotate-90'
4543
4544  
4545
4546  
4547  
4548></svg-icon>
4549
4550    </button>
4551</dialog-toggle>
4552<extended-dialog
4553    cloak
4554    type='drawer'
4555    id='Details-menu-drawer-menu-item-ATGdmRDNqbDlxUmtuZ__header_mega_menu_LTB3YT'
4556
4557    
4558      url=''
4559    
4560
4561    
4562
4563    
4564      anchor='left'
4565    
4566
4567    
4568      close-on-backdrop-click='true'
4569    
4570
4571    
4572
4573    
4574
4575    
4576
4577    
4578
4579    
4580      parent-class='bg-background text-foreground mobile-menu-dialog color-scheme-1'
4581    
4582
4583    
4584
4585    
4586  ><div slot='header' class='relative flex w-full items-center'>
4587      <dialog-toggle modal-id='Details-menu-drawer-menu-item-ATGdmRDNqbDlxUmtuZ__header_mega_menu_LTB3YT' class='size-icon-md shrink-0'>
4588        <button class="flex" type='button' aria-label='Back'>
4589<svg-icon
4590  src='icon-caret'
4591  class='icon-md rotate-90'
4592
4593  
4594
4595  
4596  
4597></svg-icon>
4598</button>
4599      </dialog-toggle>
4600      <span class='mobile-menu-panel-title text-legal pointer-events-none absolute inset-0 flex items-center justify-center font-medium'>Bestsellers</span>
4601    </div>
4602
4603    <div class='mobile-menu-panel-body px-sm py-lg flex flex-col overflow-y-auto'><a
4604          href='/collections/bestsellers'
4605          class='mb-sm btn btn-tertiary gap-2xs flex items-center '
4606        >
4607          <span>Shop All Bestsellers</span>
4608          
4609          
4610        </a><ul class='mb-xl grid list-none grid-cols-1' role='list'>
4611          <li class='list-none'>
4612  <!-- ##start:entry-lazy##core/core-accordion.ts##end:entry-lazy## -->
4613
4614<custom-accordion
4615  class='group block w-full border-solid border-accordion-border [&[expanded]]:border-accordion-border-active mobile-menu-row border-b !border-border-02 [&[expanded]]:!border-foreground py-accordion-paddingvertical'
4616  
4617  
4618>
4619  <button
4620    type='button'
4621    aria-expanded='false'
4622    aria-controls='Details-AMkEvOUhEbU84YnNwS__header_link_list_aQRnkF'
4623    data-accordion-toggle
4624    class='flex w-full min-w-0 items-center justify-between gap-xs p outline-none focus-visible:ring-2 focus-visible:ring-focus focus-visible:ring-offset-2 max-md:p-0 focus-visible:ring-offset-background'
4625  >
4626    <span class='min-w-0 flex-1 text-start nav-link-l2'>Skincare Bestsellers</span>
4627    <span class='flex shrink-0 items-center' aria-hidden='true'>
4628<svg-icon
4629  src='icon-plus'
4630  class='icon-md shrink-0 group-has-[[data-open]]:hidden'
4631
4632  
4633
4634  
4635  
4636></svg-icon>
4637
4638<svg-icon
4639  src='icon-minus'
4640  class='icon-md shrink-0 group-has-[[data-open]]:block hidden'
4641
4642  
4643
4644  
4645  
4646></svg-icon>
4647</span>
4648  </button>
4649  <div
4650    id='Details-AMkEvOUhEbU84YnNwS__header_link_list_aQRnkF'
4651    class=' invisible grid grid-rows-[0fr] max-md:px-0 text-foreground-secondary transition-[visibility,grid-template-rows] duration-300 [overflow-anchor:none] group-has-[[data-open]]:visible group-has-[[data-open]]:grid-rows-[1fr]'
4652    data-accordion-content
4653    
4654  >
4655    <div class='overflow-hidden'>
4656      <div class='pt-5 [&_*:last-child]:mb-0'>
4657        
4658          <ul class='mobile-menu-sublist grid list-none grid-cols-1 gap-y-0 ps-sm pb-xs' role='list'><li class='list-none py-xs first:pt-0 last:pb-0'>
4659            <a
4660              id='HeaderDrawer-AMkEvOUhEbU84YnNwS__header_link_list_aQRnkF-shop-all-skincare-bestsellers'
4661              href='/collections/bestsellers?fh_f_fhr_product_type=cleansersfacewash%2Cexfoliatorstoners%2Ceyecare%2Cfaceserums%2Cmoisturizersfacecreams'
4662              class='flex w-full items-center nav-link-l3'
4663              
4664            >
4665              Shop All Skincare Bestsellers
4666            </a>
4667          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
4668            <a
4669              id='HeaderDrawer-AMkEvOUhEbU84YnNwS__header_link_list_aQRnkF-moisture-surge-100h'
4670              href='/products/moisture-surge-100h-auto-replenishing-hydrator'
4671              class='flex w-full items-center nav-link-l3'
4672              
4673            >
4674              Moisture Surge 100H
4675            </a>
4676          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
4677            <a
4678              id='HeaderDrawer-AMkEvOUhEbU84YnNwS__header_link_list_aQRnkF-dramatically-different-lotion'
4679              href='/products/dramatically-different-moisturizing-lotion'
4680              class='flex w-full items-center nav-link-l3'
4681              
4682            >
4683              Dramatically Different Lotion
4684            </a>
4685          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
4686            <a
4687              id='HeaderDrawer-AMkEvOUhEbU84YnNwS__header_link_list_aQRnkF-smart-clinical-repair-serum'
4688              href='/products/clinique-smart-clinical-repair-wrinkle-correcting-serum'
4689              class='flex w-full items-center nav-link-l3'
4690              
4691            >
4692              Smart Clinical Repair Serum
4693            </a>
4694          </li></ul>
4695        
4696      </div>
4697    </div>
4698  </div>
4699</custom-accordion>
4700</li>
4701<li class='list-none'>
4702  <!-- ##start:entry-lazy##core/core-accordion.ts##end:entry-lazy## -->
4703
4704<custom-accordion
4705  class='group block w-full border-solid border-accordion-border [&[expanded]]:border-accordion-border-active mobile-menu-row border-b !border-border-02 [&[expanded]]:!border-foreground py-accordion-paddingvertical'
4706  
4707  
4708>
4709  <button
4710    type='button'
4711    aria-expanded='false'
4712    aria-controls='Details-AOTE0dEtKeFMxcVZHN__header_link_list_mtpPDm'
4713    data-accordion-toggle
4714    class='flex w-full min-w-0 items-center justify-between gap-xs p outline-none focus-visible:ring-2 focus-visible:ring-focus focus-visible:ring-offset-2 max-md:p-0 focus-visible:ring-offset-background'
4715  >
4716    <span class='min-w-0 flex-1 text-start nav-link-l2'>Makeup Bestsellers</span>
4717    <span class='flex shrink-0 items-center' aria-hidden='true'>
4718<svg-icon
4719  src='icon-plus'
4720  class='icon-md shrink-0 group-has-[[data-open]]:hidden'
4721
4722  
4723
4724  
4725  
4726></svg-icon>
4727
4728<svg-icon
4729  src='icon-minus'
4730  class='icon-md shrink-0 group-has-[[data-open]]:block hidden'
4731
4732  
4733
4734  
4735  
4736></svg-icon>
4737</span>
4738  </button>
4739  <div
4740    id='Details-AOTE0dEtKeFMxcVZHN__header_link_list_mtpPDm'
4741    class=' invisible grid grid-rows-[0fr] max-md:px-0 text-foreground-secondary transition-[visibility,grid-template-rows] duration-300 [overflow-anchor:none] group-has-[[data-open]]:visible group-has-[[data-open]]:grid-rows-[1fr]'
4742    data-accordion-content
4743    
4744  >
4745    <div class='overflow-hidden'>
4746      <div class='pt-5 [&_*:last-child]:mb-0'>
4747        
4748          <ul class='mobile-menu-sublist grid list-none grid-cols-1 gap-y-0 ps-sm pb-xs' role='list'><li class='list-none py-xs first:pt-0 last:pb-0'>
4749            <a
4750              id='HeaderDrawer-AOTE0dEtKeFMxcVZHN__header_link_list_mtpPDm-shop-all-makeup-bestsellers'
4751              href='/collections/bestsellers?fh_f_fhr_product_type=concealercolorcorrector%2Ceyeliner%2Cfoundation%2Clipglossbalm%2Clipstick%2Cmascara%2Cpowder'
4752              class='flex w-full items-center nav-link-l3'
4753              
4754            >
4755              Shop All Makeup Bestsellers
4756            </a>
4757          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
4758            <a
4759              id='HeaderDrawer-AOTE0dEtKeFMxcVZHN__header_link_list_mtpPDm-black-honey-almost-lipstick'
4760              href='/products/almost-lipstick-in-black-honey-pink-honey-and-nude-honey'
4761              class='flex w-full items-center nav-link-l3'
4762              
4763            >
4764              Black Honey Almost Lipstick
4765            </a>
4766          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
4767            <a
4768              id='HeaderDrawer-AOTE0dEtKeFMxcVZHN__header_link_list_mtpPDm-even-better-makeup-spf-15'
4769              href='/products/even-better-makeup-broad-spectrum-spf-15'
4770              class='flex w-full items-center nav-link-l3'
4771              
4772            >
4773              Even Better Makeup SPF 15
4774            </a>
4775          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
4776            <a
4777              id='HeaderDrawer-AOTE0dEtKeFMxcVZHN__header_link_list_mtpPDm-high-impact-mascara'
4778              href='/products/high-impact-high-fi-full-volume-mascara'
4779              class='flex w-full items-center nav-link-l3'
4780              
4781            >
4782              High Impact Mascara
4783            </a>
4784          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
4785            <a
4786              id='HeaderDrawer-AOTE0dEtKeFMxcVZHN__header_link_list_mtpPDm-chubby-stick-lip-color-balm'
4787              href='/products/chubby-stick-moisturizing-lip-color-balm'
4788              class='flex w-full items-center nav-link-l3'
4789              
4790            >
4791              Chubby Stick Lip Color Balm
4792            </a>
4793          </li></ul>
4794        
4795      </div>
4796    </div>
4797  </div>
4798</custom-accordion>
4799</li>
4800<li class='list-none'>
4801  <!-- ##start:entry-lazy##core/core-accordion.ts##end:entry-lazy## -->
4802
4803<custom-accordion
4804  class='group block w-full border-solid border-accordion-border [&[expanded]]:border-accordion-border-active mobile-menu-row border-b !border-border-02 [&[expanded]]:!border-foreground py-accordion-paddingvertical'
4805  
4806  
4807>
4808  <button
4809    type='button'
4810    aria-expanded='false'
4811    aria-controls='Details-AVHdiMU9HemdFRFdid__header_link_list_qQpNHC'
4812    data-accordion-toggle
4813    class='flex w-full min-w-0 items-center justify-between gap-xs p outline-none focus-visible:ring-2 focus-visible:ring-focus focus-visible:ring-offset-2 max-md:p-0 focus-visible:ring-offset-background'
4814  >
4815    <span class='min-w-0 flex-1 text-start nav-link-l2'>Fragrance Bestsellers</span>
4816    <span class='flex shrink-0 items-center' aria-hidden='true'>
4817<svg-icon
4818  src='icon-plus'
4819  class='icon-md shrink-0 group-has-[[data-open]]:hidden'
4820
4821  
4822
4823  
4824  
4825></svg-icon>
4826
4827<svg-icon
4828  src='icon-minus'
4829  class='icon-md shrink-0 group-has-[[data-open]]:block hidden'
4830
4831  
4832
4833  
4834  
4835></svg-icon>
4836</span>
4837  </button>
4838  <div
4839    id='Details-AVHdiMU9HemdFRFdid__header_link_list_qQpNHC'
4840    class=' invisible grid grid-rows-[0fr] max-md:px-0 text-foreground-secondary transition-[visibility,grid-template-rows] duration-300 [overflow-anchor:none] group-has-[[data-open]]:visible group-has-[[data-open]]:grid-rows-[1fr]'
4841    data-accordion-content
4842    
4843  >
4844    <div class='overflow-hidden'>
4845      <div class='pt-5 [&_*:last-child]:mb-0'>
4846        
4847          <ul class='mobile-menu-sublist grid list-none grid-cols-1 gap-y-0 ps-sm pb-xs' role='list'><li class='list-none py-xs first:pt-0 last:pb-0'>
4848            <a
4849              id='HeaderDrawer-AVHdiMU9HemdFRFdid__header_link_list_qQpNHC-shop-all-fragrance-bestsellers'
4850              href='/collections/bestsellers?fh_f_fhr_product_type=perfume'
4851              class='flex w-full items-center nav-link-l3'
4852              
4853            >
4854              Shop All Fragrance Bestsellers
4855            </a>
4856          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
4857            <a
4858              id='HeaderDrawer-AVHdiMU9HemdFRFdid__header_link_list_qQpNHC-happy'
4859              href='/products/clinique-happy-eau-de-parfum-spray'
4860              class='flex w-full items-center nav-link-l3'
4861              
4862            >
4863              Happy
4864            </a>
4865          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
4866            <a
4867              id='HeaderDrawer-AVHdiMU9HemdFRFdid__header_link_list_qQpNHC-aromatics-elixir'
4868              href='/collections/aromatics-elixir'
4869              class='flex w-full items-center nav-link-l3'
4870              
4871            >
4872              Aromatics Elixir
4873            </a>
4874          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
4875            <a
4876              id='HeaderDrawer-AVHdiMU9HemdFRFdid__header_link_list_qQpNHC-my-happy-fragrance-mists'
4877              href='/pages/clinique-happy'
4878              class='flex w-full items-center nav-link-l3'
4879              
4880            >
4881              My Happy Fragrance Mists
4882            </a>
4883          </li></ul>
4884        
4885      </div>
4886    </div>
4887  </div>
4888</custom-accordion>
4889</li>
4890<li class='list-none'>
4891  <!-- ##start:entry-lazy##core/core-accordion.ts##end:entry-lazy## -->
4892
4893<custom-accordion
4894  class='group block w-full border-solid border-accordion-border [&[expanded]]:border-accordion-border-active mobile-menu-row border-b !border-border-02 [&[expanded]]:!border-foreground py-accordion-paddingvertical'
4895  
4896  
4897>
4898  <button
4899    type='button'
4900    aria-expanded='false'
4901    aria-controls='Details-AaVNIMEJUbTlRTU9kd__header_link_list_7kUcmi'
4902    data-accordion-toggle
4903    class='flex w-full min-w-0 items-center justify-between gap-xs p outline-none focus-visible:ring-2 focus-visible:ring-focus focus-visible:ring-offset-2 max-md:p-0 focus-visible:ring-offset-background'
4904  >
4905    <span class='min-w-0 flex-1 text-start nav-link-l2'>Men&#39;s Bestsellers</span>
4906    <span class='flex shrink-0 items-center' aria-hidden='true'>
4907<svg-icon
4908  src='icon-plus'
4909  class='icon-md shrink-0 group-has-[[data-open]]:hidden'
4910
4911  
4912
4913  
4914  
4915></svg-icon>
4916
4917<svg-icon
4918  src='icon-minus'
4919  class='icon-md shrink-0 group-has-[[data-open]]:block hidden'
4920
4921  
4922
4923  
4924  
4925></svg-icon>
4926</span>
4927  </button>
4928  <div
4929    id='Details-AaVNIMEJUbTlRTU9kd__header_link_list_7kUcmi'
4930    class=' invisible grid grid-rows-[0fr] max-md:px-0 text-foreground-secondary transition-[visibility,grid-template-rows] duration-300 [overflow-anchor:none] group-has-[[data-open]]:visible group-has-[[data-open]]:grid-rows-[1fr]'
4931    data-accordion-content
4932    
4933  >
4934    <div class='overflow-hidden'>
4935      <div class='pt-5 [&_*:last-child]:mb-0'>
4936        
4937          <ul class='mobile-menu-sublist grid list-none grid-cols-1 gap-y-0 ps-sm pb-xs' role='list'><li class='list-none py-xs first:pt-0 last:pb-0'>
4938            <a
4939              id='HeaderDrawer-AaVNIMEJUbTlRTU9kd__header_link_list_7kUcmi-shop-all-mens-bestsellers'
4940              href='/collections/bestsellers?fh_f_elc_product_collection=cliniqueformen'
4941              class='flex w-full items-center nav-link-l3'
4942              
4943            >
4944              Shop All Men&#39;s Bestsellers
4945            </a>
4946          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
4947            <a
4948              id='HeaderDrawer-AaVNIMEJUbTlRTU9kd__header_link_list_7kUcmi-anti-age-moisturizer'
4949              href='/products/clinique-for-men-anti-age-moisturizer'
4950              class='flex w-full items-center nav-link-l3'
4951              
4952            >
4953              Anti-Age Moisturizer
4954            </a>
4955          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
4956            <a
4957              id='HeaderDrawer-AaVNIMEJUbTlRTU9kd__header_link_list_7kUcmi-moisturizing-lotion'
4958              href='/products/clinique-for-men-moisturizing-lotion'
4959              class='flex w-full items-center nav-link-l3'
4960              
4961            >
4962              Moisturizing Lotion
4963            </a>
4964          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
4965            <a
4966              id='HeaderDrawer-AaVNIMEJUbTlRTU9kd__header_link_list_7kUcmi-face-wash'
4967              href='/products/clinique-for-men-face-wash'
4968              class='flex w-full items-center nav-link-l3'
4969              
4970            >
4971              Face Wash
4972            </a>
4973          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
4974            <a
4975              id='HeaderDrawer-AaVNIMEJUbTlRTU9kd__header_link_list_7kUcmi-face-scrub'
4976              href='/products/clinique-for-men-face-scrub'
4977              class='flex w-full items-center nav-link-l3'
4978              
4979            >
4980              Face Scrub
4981            </a>
4982          </li></ul>
4983        
4984      </div>
4985    </div>
4986  </div>
4987</custom-accordion>
4988</li>
4989
4990        </ul><ul class='gap-y-md grid list-none grid-cols-1' role='list'>
4991          
4992<li>
4993  
4994<a href='/products/moisture-surge-100h-auto-replenishing-hydrator' class='flex items-center gap-sm'><div class='size-30 rounded-images-radius relative shrink-0 overflow-hidden'>
4995<picture class=''>
4996  <source
4997    media='(max-width: 767px)'
4998    srcset='//www.clinique.com/cdn/shop/files/gnav_bs_ms100h.jpg?format=webp&v=1789568765&width=300 300w, //www.clinique.com/cdn/shop/files/gnav_bs_ms100h.jpg?format=webp&v=1789568765&width=450 450w'
4999    sizes='120px'
5000    width='564'
5001    height='563'
5002  >
5003<img src="//www.clinique.com/cdn/shop/files/gnav_bs_ms100h.jpg?format=webp&amp;v=1789568765&amp;width=564" srcset="//www.clinique.com/cdn/shop/files/gnav_bs_ms100h.jpg?format=webp&amp;v=1789568765&amp;width=120 120w, //www.clinique.com/cdn/shop/files/gnav_bs_ms100h.jpg?format=webp&amp;v=1789568765&amp;width=240 240w" width="564" height="563" loading="lazy" sizes="120px" class="w-full block size-full object-cover object-cover" fetchpriority="low"></picture>
5004</div><p class='mega-menu-tile-title body-sm font-light'>Moisture Surge™ 100H Auto-Replenishing Hydrator</p></a></li>
5005
5006
5007
5008<li>
5009  
5010<a href='/products/almost-lipstick-in-black-honey-pink-honey-and-nude-honey' class='flex items-center gap-sm'><div class='size-30 rounded-images-radius relative shrink-0 overflow-hidden'>
5011<picture class=''>
5012  <source
5013    media='(max-width: 767px)'
5014    srcset='//www.clinique.com/cdn/shop/files/gnav_bs_blackhoney.jpg?format=webp&v=1789568774&width=300 300w, //www.clinique.com/cdn/shop/files/gnav_bs_blackhoney.jpg?format=webp&v=1789568774&width=450 450w'
5015    sizes='120px'
5016    width='564'
5017    height='563'
5018  >
5019<img src="//www.clinique.com/cdn/shop/files/gnav_bs_blackhoney.jpg?format=webp&amp;v=1789568774&amp;width=564" srcset="//www.clinique.com/cdn/shop/files/gnav_bs_blackhoney.jpg?format=webp&amp;v=1789568774&amp;width=120 120w, //www.clinique.com/cdn/shop/files/gnav_bs_blackhoney.jpg?format=webp&amp;v=1789568774&amp;width=240 240w" width="564" height="563" loading="lazy" sizes="120px" class="w-full block size-full object-cover object-cover" fetchpriority="low"></picture>
5020</div><p class='mega-menu-tile-title body-sm font-light'>Almost Lipstick in Black Honey</p></a></li>
5021
5022
5023
5024        </ul></div>
5025  </extended-dialog></li>
5026<li>
5027<dialog-toggle modal-id='Details-menu-drawer-menu-item-ATXV1K0RvM1JHOWFGe__header_mega_menu_aQwqnX' class='w-full'><button
5028      class="mobile-menu-l1-row nav-link inline-flex w-full items-center justify-between py-accordion-paddingvertical"
5029      aria-haspopup='dialog'
5030      aria-controls='Details-menu-drawer-menu-item-ATXV1K0RvM1JHOWFGe__header_mega_menu_aQwqnX'
5031    >
5032      <span>Skincare</span>
5033      
5034<svg-icon
5035  src='icon-caret'
5036  class='icon-md -rotate-90'
5037
5038  
5039
5040  
5041  
5042></svg-icon>
5043
5044    </button>
5045</dialog-toggle>
5046<extended-dialog
5047    cloak
5048    type='drawer'
5049    id='Details-menu-drawer-menu-item-ATXV1K0RvM1JHOWFGe__header_mega_menu_aQwqnX'
5050
5051    
5052      url=''
5053    
5054
5055    
5056
5057    
5058      anchor='left'
5059    
5060
5061    
5062      close-on-backdrop-click='true'
5063    
5064
5065    
5066
5067    
5068
5069    
5070
5071    
5072
5073    
5074      parent-class='bg-background text-foreground mobile-menu-dialog color-scheme-1'
5075    
5076
5077    
5078
5079    
5080  ><div slot='header' class='relative flex w-full items-center'>
5081      <dialog-toggle modal-id='Details-menu-drawer-menu-item-ATXV1K0RvM1JHOWFGe__header_mega_menu_aQwqnX' class='size-icon-md shrink-0'>
5082        <button class="flex" type='button' aria-label='Back'>
5083<svg-icon
5084  src='icon-caret'
5085  class='icon-md rotate-90'
5086
5087  
5088
5089  
5090  
5091></svg-icon>
5092</button>
5093      </dialog-toggle>
5094      <span class='mobile-menu-panel-title text-legal pointer-events-none absolute inset-0 flex items-center justify-center font-medium'>Skincare</span>
5095    </div>
5096
5097    <div class='mobile-menu-panel-body px-sm py-lg flex flex-col overflow-y-auto'><a
5098          href='/collections/skincare-all'
5099          class='mb-sm btn btn-tertiary gap-2xs flex items-center '
5100        >
5101          <span>Shop All Skincare</span>
5102          
5103          
5104        </a><ul class='mb-xl grid list-none grid-cols-1' role='list'>
5105          <li class='list-none'>
5106  <!-- ##start:entry-lazy##core/core-accordion.ts##end:entry-lazy## -->
5107
5108<custom-accordion
5109  class='group block w-full border-solid border-accordion-border [&[expanded]]:border-accordion-border-active mobile-menu-row border-b !border-border-02 [&[expanded]]:!border-foreground py-accordion-paddingvertical'
5110  
5111  
5112>
5113  <button
5114    type='button'
5115    aria-expanded='false'
5116    aria-controls='Details-AR0VPWVRNWGtyK1QrW__header_link_list_EzKkHL'
5117    data-accordion-toggle
5118    class='flex w-full min-w-0 items-center justify-between gap-xs p outline-none focus-visible:ring-2 focus-visible:ring-focus focus-visible:ring-offset-2 max-md:p-0 focus-visible:ring-offset-background'
5119  >
5120    <span class='min-w-0 flex-1 text-start nav-link-l2'>Shop by Category</span>
5121    <span class='flex shrink-0 items-center' aria-hidden='true'>
5122<svg-icon
5123  src='icon-plus'
5124  class='icon-md shrink-0 group-has-[[data-open]]:hidden'
5125
5126  
5127
5128  
5129  
5130></svg-icon>
5131
5132<svg-icon
5133  src='icon-minus'
5134  class='icon-md shrink-0 group-has-[[data-open]]:block hidden'
5135
5136  
5137
5138  
5139  
5140></svg-icon>
5141</span>
5142  </button>
5143  <div
5144    id='Details-AR0VPWVRNWGtyK1QrW__header_link_list_EzKkHL'
5145    class=' invisible grid grid-rows-[0fr] max-md:px-0 text-foreground-secondary transition-[visibility,grid-template-rows] duration-300 [overflow-anchor:none] group-has-[[data-open]]:visible group-has-[[data-open]]:grid-rows-[1fr]'
5146    data-accordion-content
5147    
5148  >
5149    <div class='overflow-hidden'>
5150      <div class='pt-5 [&_*:last-child]:mb-0'>
5151        
5152          <ul class='mobile-menu-sublist grid list-none grid-cols-1 gap-y-0 ps-sm pb-xs' role='list'><li class='list-none py-xs first:pt-0 last:pb-0'>
5153            <a
5154              id='HeaderDrawer-AR0VPWVRNWGtyK1QrW__header_link_list_EzKkHL-moisturizers-face-creams'
5155              href='/collections/moisturizers'
5156              class='flex w-full items-center nav-link-l3'
5157              
5158            >
5159              Moisturizers + Face Creams
5160            </a>
5161          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
5162            <a
5163              id='HeaderDrawer-AR0VPWVRNWGtyK1QrW__header_link_list_EzKkHL-cleansers-face-wash'
5164              href='/collections/cleansers-face-wash'
5165              class='flex w-full items-center nav-link-l3'
5166              
5167            >
5168              Cleansers + Face Wash
5169            </a>
5170          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
5171            <a
5172              id='HeaderDrawer-AR0VPWVRNWGtyK1QrW__header_link_list_EzKkHL-face-serums'
5173              href='/collections/serums'
5174              class='flex w-full items-center nav-link-l3'
5175              
5176            >
5177              Face Serums
5178            </a>
5179          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
5180            <a
5181              id='HeaderDrawer-AR0VPWVRNWGtyK1QrW__header_link_list_EzKkHL-eye
5181-care'
5182              href='/collections/eye-care'
5183              class='flex w-full items-center nav-link-l3'
5184              
5185            >
5186              Eye Care
5187            </a>
5188          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
5189            <a
5190              id='HeaderDrawer-AR0VPWVRNWGtyK1QrW__header_link_list_EzKkHL-exfoliators-toners'
5191              href='/collections/exfoliators'
5192              class='flex w-full items-center nav-link-l3'
5193              
5194            >
5195              Exfoliators + Toners
5196            </a>
5197          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
5198            <a
5199              id='HeaderDrawer-AR0VPWVRNWGtyK1QrW__header_link_list_EzKkHL-sunscreen-spf'
5200              href='/collections/spf-sun-protection'
5201              class='flex w-full items-center nav-link-l3'
5202              
5203            >
5204              Sunscreen + SPF
5205            </a>
5206          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
5207            <a
5208              id='HeaderDrawer-AR0VPWVRNWGtyK1QrW__header_link_list_EzKkHL-face-masks'
5209              href='/collections/face-masks'
5210              class='flex w-full items-center nav-link-l3'
5211              
5212            >
5213              Face Masks
5214            </a>
5215          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
5216            <a
5217              id='HeaderDrawer-AR0VPWVRNWGtyK1QrW__header_link_list_EzKkHL-lip-care'
5218              href='/collections/lip-care'
5219              class='flex w-full items-center nav-link-l3'
5220              
5221            >
5222              Lip Care
5223            </a>
5224          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
5225            <a
5226              id='HeaderDrawer-AR0VPWVRNWGtyK1QrW__header_link_list_EzKkHL-makeup-removers'
5227              href='/collections/makeup-removers'
5228              class='flex w-full items-center nav-link-l3'
5229              
5230            >
5231              Makeup Removers
5232            </a>
5233          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
5234            <a
5235              id='HeaderDrawer-AR0VPWVRNWGtyK1QrW__header_link_list_EzKkHL-body-care'
5236              href='/collections/hand-body-care'
5237              class='flex w-full items-center nav-link-l3'
5238              
5239            >
5240              Body Care
5241            </a>
5242          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
5243            <a
5244              id='HeaderDrawer-AR0VPWVRNWGtyK1QrW__header_link_list_EzKkHL-essences-mists'
5245              href='/collections/face-essence-lotions'
5246              class='flex w-full items-center nav-link-l3'
5247              
5248            >
5249              Essences + Mists
5250            </a>
5251          </li></ul>
5252        
5253      </div>
5254    </div>
5255  </div>
5256</custom-accordion>
5257</li>
5258<li class='list-none'>
5259  <!-- ##start:entry-lazy##core/core-accordion.ts##end:entry-lazy## -->
5260
5261<custom-accordion
5262  class='group block w-full border-solid border-accordion-border [&[expanded]]:border-accordion-border-active mobile-menu-row border-b !border-border-02 [&[expanded]]:!border-foreground py-accordion-paddingvertical'
5263  
5264  
5265>
5266  <button
5267    type='button'
5268    aria-expanded='false'
5269    aria-controls='Details-AN0l3dnJ2MFhuZ0lmM__header_link_list_Y9MYET'
5270    data-accordion-toggle
5271    class='flex w-full min-w-0 items-center justify-between gap-xs p outline-none focus-visible:ring-2 focus-visible:ring-focus focus-visible:ring-offset-2 max-md:p-0 focus-visible:ring-offset-background'
5272  >
5273    <span class='min-w-0 flex-1 text-start nav-link-l2'>Shop by Skin Concern</span>
5274    <span class='flex shrink-0 items-center' aria-hidden='true'>
5275<svg-icon
5276  src='icon-plus'
5277  class='icon-md shrink-0 group-has-[[data-open]]:hidden'
5278
5279  
5280
5281  
5282  
5283></svg-icon>
5284
5285<svg-icon
5286  src='icon-minus'
5287  class='icon-md shrink-0 group-has-[[data-open]]:block hidden'
5288
5289  
5290
5291  
5292  
5293></svg-icon>
5294</span>
5295  </button>
5296  <div
5297    id='Details-AN0l3dnJ2MFhuZ0lmM__header_link_list_Y9MYET'
5298    class=' invisible grid grid-rows-[0fr] max-md:px-0 text-foreground-secondary transition-[visibility,grid-template-rows] duration-300 [overflow-anchor:none] group-has-[[data-open]]:visible group-has-[[data-open]]:gri
5298d-rows-[1fr]'
5299    data-accordion-content
5300    
5301  >
5302    <div class='overflow-hidden'>
5303      <div class='pt-5 [&_*:last-child]:mb-0'>
5304        
5305          <ul class='mobile-menu-sublist grid list-none grid-cols-1 gap-y-0 ps-sm pb-xs' role='list'><li class='list-none py-xs first:pt-0 last:pb-0'>
5306            <a
5307              id='HeaderDrawer-AN0l3dnJ2MFhuZ0lmM__header_link_list_Y9MYET-all-skin-concerns'
5308              href='/pages/skin-concern'
5309              class='flex w-full items-center nav-link-l3'
5310              
5311            >
5312              All Skin Concerns
5313            </a>
5314          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
5315            <a
5316              id='HeaderDrawer-AN0l3dnJ2MFhuZ0lmM__header_link_list_Y9MYET-dry-skin'
5317              href='/collections/skincare-for-dry-skin'
5318              class='flex w-full items-center nav-link-l3'
5319              
5320            >
5321              Dry Skin
5322            </a>
5323          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
5324            <a
5325              id='HeaderDrawer-AN0l3dnJ2MFhuZ0lmM__header_link_list_Y9MYET-anti-aging'
5326              href='/collections/anti-aging-skincare'
5327              class='flex w-full items-center nav-link-l3'
5328              
5329            >
5330              Anti-Aging
5331            </a>
5332          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
5333            <a
5334              id='HeaderDrawer-AN0l3dnJ2MFhuZ0lmM__header_link_list_Y9MYET-dark-undereye-circles'
5335              href='/collections/under-eye-dark-circles-treatment'
5336              class='flex w-full items-center nav-link-l3'
5337              
5338            >
5339              Dark Undereye Circles
5340            </a>
5341          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
5342            <a
5343              id='HeaderDrawer-AN0l3dnJ2MFhuZ0lmM__header_link_list_Y9MYET-dark-spots'
5344              href='/collections/dark-spots-treatment'
5345              class='flex w-full items-center nav-link-l3'
5346              
5347            >
5348              Dark Spots
5349            </a>
5350          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
5351            <a
5352              id='HeaderDrawer-AN0l3dnJ2MFhuZ0lmM__header_link_list_Y9MYET-acne-blackheads'
5353              href='/collections/acne-skincare'
5354              class='flex w-full items-center nav-link-l3'
5355              
5356            >
5357              Acne + Blackheads
5358            </a>
5359          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
5360            <a
5361              id='HeaderDrawer-AN0l3dnJ2MFhuZ0lmM__header_link_list_Y9MYET-sun-protection'
5362              href='/collections/spf-sun-protection'
5363              class='flex w-full items-center nav-link-l3'
5364              
5365            >
5366              Sun Protection
5367            </a>
5368          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
5369            <a
5370              id='HeaderDrawer-AN0l3dnJ2MFhuZ0lmM__header_link_list_Y9MYET-redness'
5371              href='/collections/skincare-for-redness'
5372              class='flex w-full items-center nav-link-l3'
5373              
5374            >
5375              Redness
5376            </a>
5377          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
5378            <a
5379              id='HeaderDrawer-AN0l3dnJ2MFhuZ0lmM__header_link_list_Y9MYET-sensitive-skin'
5380              href='/collections/skin-concern-sensitive-skin'
5381              class='flex w-full items-center nav-link-l3'
5382              
5383            >
5384              Sensitive Skin
5385            </a>
5386          </li></ul>
5387        
5388      </div>
5389    </div>
5390  </div>
5391</custom-accordion>
5392</li>
5393<li class='list-none'>
5394  <!-- ##start:entry-lazy##core/core-accordion.ts##end:entry-lazy## -->
5395
5396<custom-accordion
5397  class='group block w-full border-solid border-accordion-border [&[expanded]]:border-accordion-border-active mobile-menu-row border-b !border-border-02 [&[expanded]]:!border-foreground py-accordion-paddingvertical'
5398  
5399  
5400>
5401  <button
5402    type='button'
5403    aria-expanded='false'
5404    aria-controls='Details-ANXl2M1ZNOGhleVgye__header_link_list_kiCzFV'
5405    data-accordion-toggle
5406    class='flex w-full min-w-0 items-center justify-between gap-xs p outline-none focus-visible:ring-2 focus-visible:ring-focus focus-visible:ring-offset-2 max-md:p-0 focus-visible:ring-offset-background'
5407  >
5408    <span class='min-w-0 flex-1 text-start nav-link-l2'>Shop by Skin Types</span>
5409    <span class='flex shrink-0 items-center' aria-hidden='true'>
5410<svg-icon
5411  src='icon-plus'
5412  class='icon-md shrink-0 group-has-[[data-open]]:hidden'
5413
5414  
5415
5416  
5417  
5418></svg-icon>
5419
5420<svg-icon
5421  src='icon-minus'
5422  class='icon-md shrink-0 group-has-[[data-open]]:block hidden'
5423
5424  
5425
5426  
5427  
5428></svg-icon>
5429</span>
5430  </button>
5431  <div
5432    id='Details-ANXl2M1ZNOGhleVgye__header_link_list_kiCzFV'
5433    class=' invisible grid grid-rows-[0fr] max-md:px-0 text-foreground-secondary transition-[visibility,grid-template-rows] duration-300 [overflow-anchor:none] group-has-[[data-open]]:visible group-has-[[data-open]]:grid-rows-[1fr]'
5434    data-accordion-content
5435    
5436  >
5437    <div class='overflow-hidden'>
5438      <div class='pt-5 [&_*:last-child]:mb-0'>
5439        
5440          <ul class='mobile-menu-sublist grid list-none grid-cols-1 gap-y-0 ps-sm pb-xs' role='list'><li class='list-none py-xs first:pt-0 last:pb-0'>
5441            <a
5442              id='HeaderDrawer-ANXl2M1ZNOGhleVgye__header_link_list_kiCzFV-very-dry-to-dry'
5443              href='/collections/skincare-all?fh_f_elc_product_skin_type=very_dry_to_dry'
5444              class='flex w-full items-center nav-link-l3'
5445              
5446            >
5447              Very Dry to Dry
5448            </a>
5449          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
5450            <a
5451              id='HeaderDrawer-ANXl2M1ZNOGhleVgye__header_link_list_kiCzFV-dry-combination'
5452              href='/collections/skincare-all?fh_f_elc_product_skin_type=combination'
5453              class='flex w-full items-center nav-link-l3'
5454              
5455            >
5456              Dry Combination
5457            </a>
5458          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
5459            <a
5460              id='HeaderDrawer-ANXl2M1ZNOGhleVgye__header_link_list_kiCzFV-oily-combination'
5461              href='/collections/skincare-all?fh_f_elc_product_skin_type=combination%2Coily'
5462              class='flex w-full items-center nav-link-l3'
5463              
5464            >
5465              Oily Combination
5466            </a>
5467          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
5468            <a
5469              id='HeaderDrawer-ANXl2M1ZNOGhleVgye__header_link_list_kiCzFV-oily'
5470              href='/collections/skincare-all?fh_f_elc_product_skin_type=oily'
5471              class='flex w-full items-center nav-link-l3'
5472              
5473            >
5474              Oily
5475            </a>
5476          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
5477            <a
5478              id='HeaderDrawer-ANXl2M1ZNOGhleVgye__header_link_list_kiCzFV-acne-prone'
5479              href='/collections/acne-skincare'
5480              class='flex w-full items-center nav-link-l3'
5481              
5482            >
5483              Acne-Prone
5484            </a>
5485          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
5486            <a
5487              id='HeaderDrawer-ANXl2M1ZNOGhleVgye__header_link_list_kiCzFV-sensitive-skin'
5488              href='/collections/skin-concern-sensitive-skin'
5489              class='flex w-full items-center nav-link-l3'
5490              
5491            >
5492              Sensitive Skin
5493            </a>
5494          </li></ul>
5495        
5496      </div>
5497    </div>
5498  </div>
5499</custom-accordion>
5500</li>
5501<li class='list-none'>
5502  <!-- ##start:entry-lazy##core/core-accordion.ts##end:entry-lazy## -->
5503
5504<custom-accordion
5505  class='group block w-full border-solid border-accordion-border [&[expanded]]:border-accordion-border-active mobile-menu-row border-b !border-border-02 [&[expanded]]:!border-foreground py-accordion-paddingvertical'
5506  
5507  
5508>
5509  <button
5510    type='button'
5511    aria-expanded='false'
5512    aria-controls='Details-AU1lqbmpGVjFSbU51d__header_link_list_Cp94k9'
5513    data-accordion-toggle
5514    class='flex w-full min-w-0 items-center justify-between gap-xs p outline-none focus-visible:ring-2 focus-visible:ring-focus focus-visible:ring-offset-2 max-md:p-0 focus-visible:ring-offset-background'
5515  >
5516    <span class='min-w-0 flex-1 text-start nav-link-l2'>Key Ingredients</span>
5517    <span class='flex shrink-0 items-center' aria-hidden='true'>
5518<svg-icon
5519  src='icon-plus'
5520  class='icon-md shrink-0 group-has-[[data-open]]:hidden'
5521
5522  
5523
5524  
5525  
5526></svg-icon>
5527
5528<svg-icon
5529  src='icon-minus'
5530  class='icon-md shrink-0 group-has-[[data-open]]:block hidden'
5531
5532  
5533
5534  
5535  
5536></svg-icon>
5537</span>
5538  </button>
5539  <div
5540    id='Details-AU1lqbmpGVjFSbU51d__header_link_list_Cp94k9'
5541    class=' invisible grid grid-rows-[0fr] max-md:px-0 text-foreground-secondary transition-[visibility,grid-template-rows] duration-300 [overflow-anchor:none] group-has-[[data-open]]:visible group-has-[[data-open]]:gri
5541d-rows-[1fr]'
5542    data-accordion-content
5543    
5544  >
5545    <div class='overflow-hidden'>
5546      <div class='pt-5 [&_*:last-child]:mb-0'>
5547        
5548          <ul class='mobile-menu-sublist grid list-none grid-cols-1 gap-y-0 ps-sm pb-xs' role='list'><li class='list-none py-xs first:pt-0 last:pb-0'>
5549            <a
5550              id='HeaderDrawer-AU1lqbmpGVjFSbU51d__header_link_list_Cp94k9-all-ingredients'
5551              href='/pages/ingredients'
5552              class='flex w-full items-center nav-link-l3'
5553              
5554            >
5555              All Ingredients
5556            </a>
5557          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
5558            <a
5559              id='HeaderDrawer-AU1lqbmpGVjFSbU51d__header_link_list_Cp94k9-hyaluronic-acid'
5560              href='/pages/ingredients-hyaluronic-acid'
5561              class='flex w-full items-center nav-link-l3'
5562              
5563            >
5564              Hyaluronic Acid
5565            </a>
5566          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
5567            <a
5568              id='HeaderDrawer-AU1lqbmpGVjFSbU51d__header_link_list_Cp94k9-salicylic-acid-bha'
5569              href='/pages/ingredients-salicylic-acid'
5570              class='flex w-full items-center nav-link-l3'
5571              
5572            >
5573              Salicylic Acid (BHA)
5574            </a>
5575          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
5576            <a
5577              id='HeaderDrawer-AU1lqbmpGVjFSbU51d__header_link_list_Cp94k9-retinol'
5578              href='/pages/ingredients-retinol'
5579              class='flex w-full items-center nav-link-l3'
5580              
5581            >
5582              Retinol
5583            </a>
5584          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
5585            <a
5586              id='HeaderDrawer-AU1lqbmpGVjFSbU51d__header_link_list_Cp94k9-retinoid'
5587              href='/pages/ingredients-retinoid'
5588              class='flex w-full items-center nav-link-l3'
5589              
5590            >
5591              Retinoid
5592            </a>
5593          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
5594            <a
5595              id='HeaderDrawer-AU1lqbmpGVjFSbU51d__header_link_list_Cp94k9-vitamin-c'
5596              href='/pages/ingredients-vitamin-c'
5597              class='flex w-full items-center nav-link-l3'
5598              
5599            >
5600              Vitamin C
5601            </a>
5602          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
5603            <a
5604              id='HeaderDrawer-AU1lqbmpGVjFSbU51d__header_link_list_Cp94k9-aloe-bioferment'
5605              href='/pages/ingredients-aloe-bioferment-ha-complex'
5606              class='flex w-full items-center nav-link-l3'
5607              
5608            >
5609              Aloe Bioferment
5610            </a>
5611          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
5612            <a
5613              id='HeaderDrawer-AU1lqbmpGVjFSbU51d__header_link_list_Cp94k9-peptides'
5614              href='/pages/ingredients-peptides'
5615              class='flex w-full items-center nav-link-l3'
5616              
5617            >
5618              Peptides
5619            </a>
5620          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
5621            <a
5622              id='HeaderDrawer-AU1lqbmpGVjFSbU51d__header_link_list_Cp94k9-lactobacillus-ferment'
5623              href='/pages/ingredients-lactobacillus'
5624              class='flex w-full items-center nav-link-l3'
5625              
5626            >
5627              Lactobacillus Ferment
5628            </a>
5629          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
5630            <a
5631              id='HeaderDrawer-AU1lqbmpGVjFSbU51d__header_link_list_Cp94k9-collagen'
5632              href='/pages/ingredients-collagen'
5633              class='flex w-full items-center nav-link-l3'
5634              
5635            >
5636              Collagen
5637            </a>
5638          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
5639            <a
5640              id='HeaderDrawer-AU1lqbmpGVjFSbU51d__header_link_list_Cp94k9-pdrn'
5641              href='/pages/ingredients-pdrn'
5642              class='flex w-full items-center nav-link-l3'
5643              
5644            >
5645              PDRN
5646            </a>
5647          </li></ul>
5648        
5649      </div>
5650    </div>
5651  </div>
5652</custom-accordion>
5653</li>
5654<li class='list-none'>
5655  <!-- ##start:entry-lazy##core/core-accordion.ts##end:entry-lazy## -->
5656
5657<custom-accordion
5658  class='group block w-full border-solid border-accordion-border [&[expanded]]:border-accordion-border-active mobile-menu-row border-b !border-border-02 [&[expanded]]:!border-foreground py-accordion-paddingvertical'
5659  
5660  
5661>
5662  <button
5663    type='button'
5664    aria-expanded='false'
5665    aria-controls='Details-AdXExdnp3U1BZQXk5R__header_link_list_8AqHAh'
5666    data-accordion-toggle
5667    class='flex w-full min-w-0 items-center justify-between gap-xs p outline-none focus-visible:ring-2 focus-visible:ring-focus focus-visible:ring-offset-2 max-md:p-0 focus-visible:ring-offset-background'
5668  >
5669    <span class='min-w-0 flex-1 text-start nav-link-l2'>Collections</span>
5670    <span class='flex shrink-0 items-center' aria-hidden='true'>
5671<svg-icon
5672  src='icon-plus'
5673  class='icon-md shrink-0 group-has-[[data-open]]:hidden'
5674
5675  
5676
5677  
5678  
5679></svg-icon>
5680
5681<svg-icon
5682  src='icon-minus'
5683  class='icon-md shrink-0 group-has-[[data-open]]:block hidden'
5684
5685  
5686
5687  
5688  
5689></svg-icon>
5690</span>
5691  </button>
5692  <div
5693    id='Details-AdXExdnp3U1BZQXk5R__header_link_list_8AqHAh'
5694    class=' invisible grid grid-rows-[0fr] max-md:px-0 text-foreground-secondary transition-[visibility,grid-template-rows] duration-300 [overflow-anchor:none] group-has-[[data-open]]:visible group-has-[[data-open]]:grid-rows-[1fr]'
5695    data-accordion-content
5696    
5697  >
5698    <div class='overflow-hidden'>
5699      <div class='pt-5 [&_*:last-child]:mb-0'>
5700        
5701          <ul class='mobile-menu-sublist grid list-none grid-cols-1 gap-y-0 ps-sm pb-xs' role='list'><li class='list-none py-xs first:pt-0 last:pb-0'>
5702            <a
5703              id='HeaderDrawer-AdXExdnp3U1BZQXk5R__header_link_list_8AqHAh-3-step-routine'
5704              href='/pages/3-step-skincare'
5705              class='flex w-full items-center nav-link-l3'
5706              
5707            >
5708              3-Step Routine
5709            </a>
5710          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
5711            <a
5712              id='HeaderDrawer-AdXExdnp3U1BZQXk5R__header_link_list_8AqHAh-smart-clinical-repair'
5713              href='/pages/clinique-smart-skincare'
5714              class='flex w-full items-center nav-link-l3'
5715              
5716            >
5717              Smart Clinical Repair
5718            </a>
5719          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
5720            <a
5721              id='HeaderDrawer-AdXExdnp3U1BZQXk5R__header_link_list_8AqHAh-moisture-surge'
5722              href='/pages/dry-skin-solutions-skincare'
5723              class='flex w-full items-center nav-link-l3'
5724              
5725            >
5726              Moisture Surge
5727            </a>
5728          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
5729            <a
5730              id='HeaderDrawer-AdXExdnp3U1BZQXk5R__header_link_list_8AqHAh-even-better'
5731              href='/collections/dark-spots-treatment'
5732              class='flex w-full items-center nav-link-l3'
5733              
5734            >
5735              Even Better
5736            </a>
5737          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
5738            <a
5739              id='HeaderDrawer-AdXExdnp3U1BZQXk5R__header_link_list_8AqHAh-take-the-day-off'
5740              href='/collections/take-the-day-off'
5741              class='flex w-full items-center nav-link-l3'
5742              
5743            >
5744              Take The Day Off
5745            </a>
5746          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
5747            <a
5748              id='HeaderDrawer-AdXExdnp3U1BZQXk5R__header_link_list_8AqHAh-dramatically-different'
5749              href='/pages/dramatically-different'
5750              class='flex w-full items-center nav-link-l3'
5751              
5752            >
5753              Dramatically Different 
5754            </a>
5755          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
5756            <a
5757              id='HeaderDrawer-AdXExdnp3U1BZQXk5R__header_link_list_8AqHAh-daily-calm'
5758              href='/pages/daily-calm-collection'
5759              class='flex w-full items-center nav-link-l3'
5760              
5761            >
5762              Daily Calm
5763            </a>
5764          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
5765            <a
5766              id='HeaderDrawer-AdXExdnp3U1BZQXk5R__header_link_list_8AqHAh-uv-solutions'
5767              href='/pages/uv-solutions'
5768              class='flex w-full items-center nav-link-l3'
5769              
5770            >
5771              UV Solutions
5772            </a>
5773          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
5774            <a
5775              id='HeaderDrawer-AdXExdnp3U1BZQXk5R__header_link_list_8AqHAh-clinique-for-men'
5776              href='/collections/men-skincare'
5777              class='flex w-full items-center nav-link-l3'
5778              
5779            >
5780              Clinique For Men
5781            </a>
5782          </li></ul>
5783        
5784      </div>
5785    </div>
5786  </div>
5787</custom-accordion>
5788</li>
5789<li class='list-none'>
5790  <!-- ##start:entry-lazy##core/core-accordion.ts##end:entry-lazy## -->
5791
5792<custom-accordion
5793  class='group block w-full border-solid border-accordion-border [&[expanded]]:border-accordion-border-active mobile-menu-row border-b !border-border-02 [&[expanded]]:!border-foreground py-accordion-paddingvertical'
5794  
5795  
5796>
5797  <button
5798    type='button'
5799    aria-expanded='false'
5800    aria-controls='Details-AcUhpRDVlZlVNR1JxY__header_link_list_3xLWqH'
5801    data-accordion-toggle
5802    class='flex w-full min-w-0 items-center justify-between gap-xs p outline-none focus-visible:ring-2 focus-visible:ring-focus focus-visible:ring-offset-2 max-md:p-0 focus-visible:ring-offset-background'
5803  >
5804    <span class='min-w-0 flex-1 text-start nav-link-l2'>Featured</span>
5805    <span class='flex shrink-0 items-center' aria-hidden='true'>
5806<svg-icon
5807  src='icon-plus'
5808  class='icon-md shrink-0 group-has-[[data-open]]:hidden'
5809
5810  
5811
5812  
5813  
5814></svg-icon>
5815
5816<svg-icon
5817  src='icon-minus'
5818  class='icon-md shrink-0 group-has-[[data-open]]:block hidden'
5819
5820  
5821
5822  
5823  
5824></svg-icon>
5825</span>
5826  </button>
5827  <div
5828    id='Details-AcUhpRDVlZlVNR1JxY__header_link_list_3xLWqH'
5829    class=' invisible grid grid-rows-[0fr] max-md:px-0 text-foreground-secondary transition-[visibility,grid-template-rows] duration-300 [overflow-anchor:none] group-has-[[data-open]]:visible group-has-[[data-open]]:grid-rows-[1fr]'
5830    data-accordion-content
5831    
5832  >
5833    <div class='overflow-hidden'>
5834      <div class='pt-5 [&_*:last-child]:mb-0'>
5835        
5836          <ul class='mobile-menu-sublist grid list-none grid-cols-1 gap-y-0 ps-sm pb-xs' role='list'><li class='list-none py-xs first:pt-0 last:pb-0'>
5837            <a
5838              id='HeaderDrawer-AcUhpRDVlZlVNR1JxY__header_link_list_3xLWqH-skincare-gifts'
5839              href='/collections/all-gifts-sets?fh_f_fhr_product_type=skincaregifts'
5840              class='flex w-full items-center nav-link-l3'
5841              
5842            >
5843              Skincare Gifts
5844            </a>
5845          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
5846            <a
5847              id='HeaderDrawer-AcUhpRDVlZlVNR1JxY__header_link_list_3xLWqH-mens-skincare'
5848              href='/collections/men-skincare'
5849              class='flex w-full items-center nav-link-l3'
5850              
5851            >
5852              Men&#39;s Skincare
5853            </a>
5854          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
5855            <a
5856              id='HeaderDrawer-AcUhpRDVlZlVNR1JxY__header_link_list_3xLWqH-discontinued-products'
5857              href='/pages/discontinued-products'
5858              class='flex w-full items-center nav-link-l3'
5859              
5860            >
5861              Discontinued Products
5862            </a>
5863          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
5864            <a
5865              id='HeaderDrawer-AcUhpRDVlZlVNR1JxY__header_link_list_3xLWqH-fsa-eligible'
5866              href='/collections/fsa-hsa-eligible-skincare-products'
5867              class='flex w-full items-center nav-link-l3'
5868              
5869            >
5870              FSA Eligible
5871            </a>
5872          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
5873            <a
5874              id='HeaderDrawer-AcUhpRDVlZlVNR1JxY__header_link_list_3xLWqH-clinical-reality-skin-diagnostic'
5875              href='/pages/clinicalreality'
5876              class='flex w-full items-center nav-link-l3'
5877              
5878            >
5879              Clinical Reality Skin Diagnostic
5880            </a>
5881          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
5882            <a
5883              id='HeaderDrawer-AcUhpRDVlZlVNR1JxY__header_link_list_3xLWqH-skincare-finder-quiz'
5884              href='/pages/skincare-quiz'
5885              class='flex w-full items-center nav-link-l3'
5886              
5887            >
5888              Skincare Finder Quiz
5889            </a>
5890          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
5891            <a
5892              id='HeaderDrawer-AcUhpRDVlZlVNR1JxY__header_link_list_3xLWqH-travel-sizes'
5893              href='/collections/travel-size'
5894              class='flex w-full items-center nav-link-l3'
5895              
5896            >
5897              Travel Sizes
5898            </a>
5899          </li></ul>
5900        
5901      </div>
5902    </div>
5903  </div>
5904</custom-accordion>
5905</li>
5906
5907        </ul></div>
5908  </extended-dialog></li>
5909<li>
5910<dialog-toggle modal-id='Details-menu-drawer-menu-item-AaENKUUNwOUJlZ0dla__header_mega_menu_JA48GE' class='w-full'><button
5911      class="mobile-menu-l1-row nav-link inline-flex w-full items-center justify-between py-accordion-paddingvertical"
5912      aria-haspopup='dialog'
5913      aria-controls='Details-menu-drawer-menu-item-AaENKUUNwOUJlZ0dla__header_mega_menu_JA48GE'
5914    >
5915      <span>Makeup</span>
5916      
5917<svg-icon
5918  src='icon-caret'
5919  class='icon-md -rotate-90'
5920
5921  
5922
5923  
5924  
5925></svg-icon>
5926
5927    </button>
5928</dialog-toggle>
5929<extended-dialog
5930    cloak
5931    type='drawer'
5932    id='Details-menu-drawer-menu-item-AaENKUUNwOUJlZ0dla__header_mega_menu_JA48GE'
5933
5934    
5935      url=''
5936    
5937
5938    
5939
5940    
5941      anchor='left'
5942    
5943
5944    
5945      close-on-backdrop-click='true'
5946    
5947
5948    
5949
5950    
5951
5952    
5953
5954    
5955
5956    
5957      parent-class='bg-background text-foreground mobile-menu-dialog color-scheme-1'
5958    
5959
5960    
5961
5962    
5963  ><div slot='header' class='relative flex w-full items-center'>
5964      <dialog-toggle modal-id='Details-menu-drawer-menu-item-AaENKUUNwOUJlZ0dla__header_mega_menu_JA48GE' class='size-icon-md shrink-0'>
5965        <button class="flex" type='button' aria-label='Back'>
5966<svg-icon
5967  src='icon-caret'
5968  class='icon-md rotate-90'
5969
5970  
5971
5972  
5973  
5974></svg-icon>
5975</button>
5976      </dialog-toggle>
5977      <span class='mobile-menu-panel-title text-legal pointer-events-none absolute inset-0 flex items-center justify-center font-medium'>Makeup</span>
5978    </div>
5979
5980    <div class='mobile-menu-panel-body px-sm py-lg flex flex-col overflow-y-auto'><a
5981          href='/collections/makeup-clinique'
5982          class='mb-sm btn btn-tertiary gap-2xs flex items-center '
5983        >
5984          <span>Shop All Makeup</span>
5985          
5986          
5987        </a><ul class='mb-xl grid list-none grid-cols-1' role='list'>
5988          <li class='list-none'>
5989  <!-- ##start:entry-lazy##core/core-accordion.ts##end:entry-lazy## -->
5990
5991<custom-accordion
5992  class='group block w-full border-solid border-accordion-border [&[expanded]]:border-accordion-border-active mobile-menu-row border-b !border-border-02 [&[expanded]]:!border-foreground py-accordion-paddingvertical'
5993  
5994  
5995>
5996  <button
5997    type='button'
5998    aria-expanded='false'
5999    aria-controls='Details-AK3BCS2JsRGxUcnZzY__header_link_list_q4rUTN'
6000    data-accordion-toggle
6001    class='flex w-full min-w-0 items-center justify-between gap-xs p outline-none focus-visible:ring-2 focus-visible:ring-focus focus-visible:ring-offset-2 max-md:p-0 focus-visible:ring-offset-background'
6002  >
6003    <span class='min-w-0 flex-1 text-start nav-link-l2'>Face</span>
6004    <span class='flex shrink-0 items-center' aria-hidden='true'>
6005<svg-icon
6006  src='icon-plus'
6007  class='icon-md shrink-0 group-has-[[data-open]]:hidden'
6008
6009  
6010
6011  
6012  
6013></svg-icon>
6014
6015<svg-icon
6016  src='icon-minus'
6017  class='icon-md shrink-0 group-has-[[data-open]]:block hidden'
6018
6019  
6020
6021  
6022  
6023></svg-icon>
6024</span>
6025  </button>
6026  <div
6027    id='Details-AK3BCS2JsRGxUcnZzY__header_link_list_q4rUTN'
6028    class=' invisible grid grid-rows-[0fr] max-md:px-0 text-foreground-secondary transition-[visibility,grid-template-rows] duration-300 [overflow-anchor:none] group-has-[[data-open]]:visible group-has-[[data-open]]:grid-rows-[1fr]'
6029    data-accordion-content
6030    
6031  >
6032    <div class='overflow-hidden'>
6033      <div class='pt-5 [&_*:last-child]:mb-0'>
6034        
6035          <ul class='mobile-menu-sublist grid list-none grid-cols-1 gap-y-0 ps-sm pb-xs' role='list'><li class='list-none py-xs first:pt-0 last:pb-0'>
6036            <a
6037              id='HeaderDrawer-AK3BCS2JsRGxUcnZzY__header_link_list_q4rUTN-shop-all-face'
6038              href='/collections/face-makeup'
6039              class='flex w-full items-center nav-link-l3'
6040              
6041            >
6042              Shop All Face
6043            </a>
6044          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
6045            <a
6046              id='HeaderDrawer-AK3BCS2JsRGxUcnZzY__header_link_list_q4rUTN-foundation'
6047              href='/collections/foundations'
6048              class='flex w-full items-center nav-link-l3'
6049              
6050            >
6051              Foundation
6052            </a>
6053          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
6054            <a
6055              id='HeaderDrawer-AK3BCS2JsRGxUcnZzY__header_link_list_q4rUTN-concealer'
6056              href='/collections/concealers'
6057              class='flex w-full items-center nav-link-l3'
6058              
6059            >
6060              Concealer
6061            </a>
6062          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
6063            <a
6064              id='HeaderDrawer-AK3BCS2JsRGxUcnZzY__header_link_list_q4rUTN-face-powder'
6065              href='/collections/face-powders'
6066              class='flex w-full items-center nav-link-l3'
6067              
6068            >
6069              Face Powder
6070            </a>
6071          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
6072            <a
6073              id='HeaderDrawer-AK3BCS2JsRGxUcnZzY__header_link_list_q4rUTN-face-primer'
6074              href='/collections/face-primer'
6075              class='flex w-full items-center nav-link-l3'
6076              
6077            >
6078              Face Primer
6079            </a>
6080          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
6081            <a
6082              id='HeaderDrawer-AK3BCS2JsRGxUcnZzY__header_link_list_q4rUTN-blush'
6083              href='/collections/blush'
6084              class='flex w-full items-center nav-link-l3'
6085              
6086            >
6087              Blush
6088            </a>
6089          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
6090            <a
6091              id='HeaderDrawer-AK3BCS2JsRGxUcnZzY__header_link_list_q4rUTN-bronzer-highlighter'
6092              href='/collections/bronzers'
6093              class='flex w-full items-center nav-link-l3'
6094              
6095            >
6096              Bronzer + Highlighter
6097            </a>
6098          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
6099            <a
6100              id='HeaderDrawer-AK3BCS2JsRGxUcnZzY__header_link_list_q4rUTN-tinted-moisturizer'
6101              href='/collections/bb-and-cc-cream'
6102              class='flex w-full items-center nav-link-l3'
6103              
6104            >
6105              Tinted Moisturizer
6106            </a>
6107          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
6108            <a
6109              id='HeaderDrawer-AK3BCS2JsRGxUcnZzY__header_link_list_q4rUTN-setting-spray'
6110              href='/products/set-the-day-makeup-setting-spray'
6111              class='flex w-full items-center nav-link-l3'
6112              
6113            >
6114              Setting Spray
6115            </a>
6116          </li></ul>
6117        
6118      </div>
6119    </div>
6120  </div>
6121</custom-accordion>
6122</li>
6123<li class='list-none'>
6124  <!-- ##start:entry-lazy##core/core-accordion.ts##end:entry-lazy## -->
6125
6126<custom-accordion
6127  class='group block w-full border-solid border-accordion-border [&[expanded]]:border-accordion-border-active mobile-menu-row border-b !border-border-02 [&[expanded]]:!border-foreground py-accordion-paddingvertical'
6128  
6129  
6130>
6131  <button
6132    type='button'
6133    aria-expanded='false'
6134    aria-controls='Details-ANVZlcnkvYTlmdnhvN__header_link_list_CazCna'
6135    data-accordion-toggle
6136    class='flex w-full min-w-0 items-center justify-between gap-xs p outline-none focus-visible:ring-2 focus-visible:ring-focus focus-visible:ring-offset-2 max-md:p-0 focus-visible:ring-offset-background'
6137  >
6138    <span class='min-w-0 flex-1 text-start nav-link-l2'>Lip</span>
6139    <span class='flex shrink-0 items-center' aria-hidden='true'>
6140<svg-icon
6141  src='icon-plus'
6142  class='icon-md shrink-0 group-has-[[data-open]]:hidden'
6143
6144  
6145
6146  
6147  
6148></svg-icon>
6149
6150<svg-icon
6151  src='icon-minus'
6152  class='icon-md shrink-0 group-has-[[data-open]]:block hidden'
6153
6154  
6155
6156  
6157  
6158></svg-icon>
6159</span>
6160  </button>
6161  <div
6162    id='Details-ANVZlcnkvYTlmdnhvN__header_link_list_CazCna'
6163    class=' invisible grid grid-rows-[0fr] max-md:px-0 text-foreground-secondary transition-[visibility,grid-template-rows] duration-300 [overflow-anchor:none] group-has-[[data-open]]:visible group-has-[[data-open]]:grid-rows-[1fr]'
6164    data-accordion-content
6165    
6166  >
6167    <div class='overflow-hidden'>
6168      <div class='pt-5 [&_*:last-child]:mb-0'>
6169        
6170          <ul class='mobile-menu-sublist grid list-none grid-cols-1 gap-y-0 ps-sm pb-xs' role='list'><li class='list-none py-xs first:pt-0 last:pb-0'>
6171            <a
6172              id='HeaderDrawer-ANVZlcnkvYTlmdnhvN__header_link_list_CazCna-shop-all-lip'
6173              href='/collections/lip-makeup'
6174              class='flex w-full items-center nav-link-l3'
6175              
6176            >
6177              Shop All Lip
6178            </a>
6179          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
6180            <a
6181              id='HeaderDrawer-ANVZlcnkvYTlmdnhvN__header_link_list_CazCna-lipstick'
6182              href='/collections/lipsticks'
6183              class='flex w-full items-center nav-link-l3'
6184              
6185            >
6186              Lipstick
6187            </a>
6188          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
6189            <a
6190              id='HeaderDrawer-ANVZlcnkvYTlmdnhvN__header_link_list_CazCna-lip-gloss-balm'
6191              href='/collections/lip-glosses'
6192              class='flex w-full items-center nav-link-l3'
6193              
6194            >
6195              Lip Gloss + Balm
6196            </a>
6197          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
6198            <a
6199              id='HeaderDrawer-ANVZlcnkvYTlmdnhvN__header_link_list_CazCna-lip-liner'
6200              href='/products/quickliner-for-lips'
6201              class='flex w-full items-center nav-link-l3'
6202              
6203            >
6204              Lip Liner
6205            </a>
6206          </li></ul>
6207        
6208      </div>
6209    </div>
6210  </div>
6211</custom-accordion>
6212</li>
6213<li class='list-none'>
6214  <!-- ##start:entry-lazy##core/core-accordion.ts##end:entry-lazy## -->
6215
6216<custom-accordion
6217  class='group block w-full border-solid border-accordion-border [&[expanded]]:border-accordion-border-active mobile-menu-row border-b !border-border-02 [&[expanded]]:!border-foreground py-accordion-paddingvertical'
6218  
6219  
6220>
6221  <button
6222    type='button'
6223    aria-expanded='false'
6224    aria-controls='Details-AQ3ptN3BUMXZpL0RJU__header_link_list_qQKA9K'
6225    data-accordion-toggle
6226    class='flex w-full min-w-0 items-center justify-between gap-xs p outline-none focus-visible:ring-2 focus-visible:ring-focus focus-visible:ring-offset-2 max-md:p-0 focus-visible:ring-offset-background'
6227  >
6228    <span class='min-w-0 flex-1 text-start nav-link-l2'>Eye</span>
6229    <span class='flex shrink-0 items-center' aria-hidden='true'>
6230<svg-icon
6231  src='icon-plus'
6232  class='icon-md shrink-0 group-has-[[data-open]]:hidden'
6233
6234  
6235
6236  
6237  
6238></svg-icon>
6239
6240<svg-icon
6241  src='icon-minus'
6242  class='icon-md shrink-0 group-has-[[data-open]]:block hidden'
6243
6244  
6245
6246  
6247  
6248></svg-icon>
6249</span>
6250  </button>
6251  <div
6252    id='Details-AQ3ptN3BUMXZpL0RJU__header_link_list_qQKA9K'
6253    class=' invisible grid grid-rows-[0fr] max-md:px-0 text-foreground-secondary transition-[visibility,grid-template-rows] duration-300 [overflow-anchor:none] group-has-[[data-open]]:visible group-has-[[data-open]]:grid-rows-[1fr]'
6254    data-accordion-content
6255    
6256  >
6257    <div class='overflow-hidden'>
6258      <div class='pt-5 [&_*:last-child]:mb-0'>
6259        
6260          <ul class='mobile-menu-sublist grid list-none grid-cols-1 gap-y-0 ps-sm pb-xs' role='list'><li class='list-none py-xs first:pt-0 last:pb-0'>
6261            <a
6262              id='HeaderDrawer-AQ3ptN3BUMXZpL0RJU__header_link_list_qQKA9K-shop-all-eye'
6263              href='/collections/eye-makeup'
6264              class='flex w-full items-center nav-link-l3'
6265              
6266            >
6267              Shop All Eye
6268            </a>
6269          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
6270            <a
6271              id='HeaderDrawer-AQ3ptN3BUMXZpL0RJU__header_link_list_qQKA9K-mascara'
6272              href='/collections/mascara'
6273              class='flex w-full items-center nav-link-l3'
6274              
6275            >
6276              Mascara
6277            </a>
6278          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
6279            <a
6280              id='HeaderDrawer-AQ3ptN3BUMXZpL0RJU__header_link_list_qQKA9K-eyeliner'
6281              href='/collections/eyeliners'
6282              class='flex w-full items-center nav-link-l3'
6283              
6284            >
6285              Eyeliner
6286            </a>
6287          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
6288            <a
6289              id='HeaderDrawer-AQ3ptN3BUMXZpL0RJU__header_link_list_qQKA9K-eye-shadow-primer'
6290              href='/collections/eye-shadows'
6291              class='flex w-full items-center nav-link-l3'
6292              
6293            >
6294              Eye Shadow + Primer
6295            </a>
6296          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
6297            <a
6298              id='HeaderDrawer-AQ3ptN3BUMXZpL0RJU__header_link_list_qQKA9K-brows'
6299              href='/collections/brows'
6300              class='flex w-full items-center nav-link-l3'
6301              
6302            >
6303              Brows
6304            </a>
6305          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
6306            <a
6307              id='HeaderDrawer-AQ3ptN3BUMXZpL0RJU__header_link_list_qQKA9K-acuvue®-partnership'
6308              href='/pages/clinique-acuvue-partnership'
6309              class='flex w-full items-center nav-link-l3'
6310              
6311            >
6312              ACUVUE® Partnership
6313            </a>
6314          </li></ul>
6315        
6316      </div>
6317    </div>
6318  </div>
6319</custom-accordion>
6320</li>
6321<li class='list-none'>
6322  <!-- ##start:entry-lazy##core/core-accordion.ts##end:entry-lazy## -->
6323
6324<custom-accordion
6325  class='group block w-full border-solid border-accordion-border [&[expanded]]:border-accordion-border-active mobile-menu-row border-b !border-border-02 [&[expanded]]:!border-foreground py-accordion-paddingvertical'
6326  
6327  
6328>
6329  <button
6330    type='button'
6331    aria-expanded='false'
6332    aria-controls='Details-Ad3FvM0dwbmt6WkF2R__header_link_list_p9iH8N'
6333    data-accordion-toggle
6334    class='flex w-full min-w-0 items-center justify-between gap-xs p outline-none focus-visible:ring-2 focus-visible:ring-focus focus-visible:ring-offset-2 max-md:p-0 focus-visible:ring-offset-background'
6335  >
6336    <span class='min-w-0 flex-1 text-start nav-link-l2'>Makeup Accesories</span>
6337    <span class='flex shrink-0 items-center' aria-hidden='true'>
6338<svg-icon
6339  src='icon-plus'
6340  class='icon-md shrink-0 group-has-[[data-open]]:hidden'
6341
6342  
6343
6344  
6345  
6346></svg-icon>
6347
6348<svg-icon
6349  src='icon-minus'
6350  class='icon-md shrink-0 group-has-[[data-open]]:block hidden'
6351
6352  
6353
6354  
6355  
6356></svg-icon>
6357</span>
6358  </button>
6359  <div
6360    id='Details-Ad3FvM0dwbmt6WkF2R__header_link_list_p9iH8N'
6361    class=' invisible grid grid-rows-[0fr] max-md:px-0 text-foreground-secondary transition-[visibility,grid-template-rows] duration-300 [overflow-anchor:none] group-has-[[data-open]]:visible group-has-[[data-open]]:gri
6361d-rows-[1fr]'
6362    data-accordion-content
6363    
6364  >
6365    <div class='overflow-hidden'>
6366      <div class='pt-5 [&_*:last-child]:mb-0'>
6367        
6368          <ul class='mobile-menu-sublist grid list-none grid-cols-1 gap-y-0 ps-sm pb-xs' role='list'><li class='list-none py-xs first:pt-0 last:pb-0'>
6369            <a
6370              id='HeaderDrawer-Ad3FvM0dwbmt6WkF2R__header_link_list_p9iH8N-makeup-remover'
6371              href='/collections/makeup-removers'
6372              class='flex w-full items-center nav-link-l3'
6373              
6374            >
6375              Makeup Remover
6376            </a>
6377          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
6378            <a
6379              id='HeaderDrawer-Ad3FvM0dwbmt6WkF2R__header_link_list_p9iH8N-makeup-brushes'
6380              href='/collections/makeup-brushes'
6381              class='flex w-full items-center nav-link-l3'
6382              
6383            >
6384              Makeup Brushes
6385            </a>
6386          </li></ul>
6387        
6388      </div>
6389    </div>
6390  </div>
6391</custom-accordion>
6392</li>
6393<li class='list-none'>
6394  <!-- ##start:entry-lazy##core/core-accordion.ts##end:entry-lazy## -->
6395
6396<custom-accordion
6397  class='group block w-full border-solid border-accordion-border [&[expanded]]:border-accordion-border-active mobile-menu-row border-b !border-border-02 [&[expanded]]:!border-foreground py-accordion-paddingvertical'
6398  
6399  
6400>
6401  <button
6402    type='button'
6403    aria-expanded='false'
6404    aria-controls='Details-AZloyKzhWZTQ3ZnJ5Z__header_link_list_DhQmha'
6405    data-accordion-toggle
6406    class='flex w-full min-w-0 items-center justify-between gap-xs p outline-none focus-visible:ring-2 focus-visible:ring-focus focus-visible:ring-offset-2 max-md:p-0 focus-visible:ring-offset-background'
6407  >
6408    <span class='min-w-0 flex-1 text-start nav-link-l2'>Collections</span>
6409    <span class='flex shrink-0 items-center' aria-hidden='true'>
6410<svg-icon
6411  src='icon-plus'
6412  class='icon-md shrink-0 group-has-[[data-open]]:hidden'
6413
6414  
6415
6416  
6417  
6418></svg-icon>
6419
6420<svg-icon
6421  src='icon-minus'
6422  class='icon-md shrink-0 group-has-[[data-open]]:block hidden'
6423
6424  
6425
6426  
6427  
6428></svg-icon>
6429</span>
6430  </button>
6431  <div
6432    id='Details-AZloyKzhWZTQ3ZnJ5Z__header_link_list_DhQmha'
6433    class=' invisible grid grid-rows-[0fr] max-md:px-0 text-foreground-secondary transition-[visibility,grid-template-rows] duration-300 [overflow-anchor:none] group-has-[[data-open]]:visible group-has-[[data-open]]:grid-rows-[1fr]'
6434    data-accordion-content
6435    
6436  >
6437    <div class='overflow-hidden'>
6438      <div class='pt-5 [&_*:last-child]:mb-0'>
6439        
6440          <ul class='mobile-menu-sublist grid list-none grid-cols-1 gap-y-0 ps-sm pb-xs' role='list'><li class='list-none py-xs first:pt-0 last:pb-0'>
6441            <a
6442              id='HeaderDrawer-AZloyKzhWZTQ3ZnJ5Z__header_link_list_DhQmha-black-honey'
6443              href='/pages/black-honey'
6444              class='flex w-full items-center nav-link-l3'
6445              
6446            >
6447              Black Honey
6448            </a>
6449          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
6450            <a
6451              id='HeaderDrawer-AZloyKzhWZTQ3ZnJ5Z__header_link_list_DhQmha-even-better-makeup'
6452              href='/pages/even-better-makeup'
6453              class='flex w-full items-center nav-link-l3'
6454              
6455            >
6456              Even Better Makeup
6457            </a>
6458          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
6459            <a
6460              id='HeaderDrawer-AZloyKzhWZTQ3ZnJ5Z__header_link_list_DhQmha-take-the-day-off'
6461              href='/collections/skincare-all?fh_f_elc_product_collection=takethedayoff'
6462              class='flex w-full items-center nav-link-l3'
6463              
6464            >
6465              Take The Day Off
6466            </a>
6467          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
6468            <a
6469              id='HeaderDrawer-AZloyKzhWZTQ3ZnJ5Z__header_link_list_DhQmha-chubby-sticks'
6470              href='/pages/chubby-stick'
6471              class='flex w-full items-center nav-link-l3'
6472              
6473            >
6474              Chubby Sticks
6475            </a>
6476          </li></ul>
6477        
6478      </div>
6479    </div>
6480  </div>
6481</custom-accordion>
6482</li>
6483<li class='list-none'>
6484  <!-- ##start:entry-lazy##core/core-accordion.ts##end:entry-lazy## -->
6485
6486<custom-accordion
6487  class='group block w-full border-solid border-accordion-border [&[expanded]]:border-accordion-border-active mobile-menu-row border-b !border-border-02 [&[expanded]]:!border-foreground py-accordion-paddingvertical'
6488  
6489  
6490>
6491  <button
6492    type='button'
6493    aria-expanded='false'
6494    aria-controls='Details-AN000Qi9BeEFnb1BaV__header_link_list_U3J6RE'
6495    data-accordion-toggle
6496    class='flex w-full min-w-0 items-center justify-between gap-xs p outline-none focus-visible:ring-2 focus-visible:ring-focus focus-visible:ring-offset-2 max-md:p-0 focus-visible:ring-offset-background'
6497  >
6498    <span class='min-w-0 flex-1 text-start nav-link-l2'>Featured</span>
6499    <span class='flex shrink-0 items-center' aria-hidden='true'>
6500<svg-icon
6501  src='icon-plus'
6502  class='icon-md shrink-0 group-has-[[data-open]]:hidden'
6503
6504  
6505
6506  
6507  
6508></svg-icon>
6509
6510<svg-icon
6511  src='icon-minus'
6512  class='icon-md shrink-0 group-has-[[data-open]]:block hidden'
6513
6514  
6515
6516  
6517  
6518></svg-icon>
6519</span>
6520  </button>
6521  <div
6522    id='Details-AN000Qi9BeEFnb1BaV__header_link_list_U3J6RE'
6523    class=' invisible grid grid-rows-[0fr] max-md:px-0 text-foreground-secondary transition-[visibility,grid-template-rows] duration-300 [overflow-anchor:none] group-has-[[data-open]]:visible group-has-[[data-open]]:grid-rows-[1fr]'
6524    data-accordion-content
6525    
6526  >
6527    <div class='overflow-hidden'>
6528      <div class='pt-5 [&_*:last-child]:mb-0'>
6529        
6530          <ul class='mobile-menu-sublist grid list-none grid-cols-1 gap-y-0 ps-sm pb-xs' role='list'><li class='list-none py-xs first:pt-0 last:pb-0'>
6531            <a
6532              id='HeaderDrawer-AN000Qi9BeEFnb1BaV__header_link_list_U3J6RE-makeup-gifts'
6533              href='/collections/all-gifts-sets?fh_f_fhr_product_type=makeupgifts'
6534              class='flex w-full items-center nav-link-l3'
6535              
6536            >
6537              Makeup Gifts
6538            </a>
6539          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
6540            <a
6541              id='HeaderDrawer-AN000Qi9BeEFnb1BaV__header_link_list_U3J6RE-discontinued-products'
6542              href='/pages/discontinued-products'
6543              class='flex w-full items-center nav-link-l3'
6544              
6545            >
6546              Discontinued Products
6547            </a>
6548          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
6549            <a
6550              id='HeaderDrawer-AN000Qi9BeEFnb1BaV__header_link_list_U3J6RE-fsa-eligible'
6551              href='/collections/fsa-hsa-eligible-skincare-products'
6552              class='flex w-full items-center nav-link-l3'
6553              
6554            >
6555              FSA Eligible
6556            </a>
6557          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
6558            <a
6559              id='HeaderDrawer-AN000Qi9BeEFnb1BaV__header_link_list_U3J6RE-risk-free-foundation-trial'
6560              href='/pages/risk-free-trial'
6561              class='flex w-full items-center nav-link-l3'
6562              
6563            >
6564              Risk-Free Foundation Trial
6565            </a>
6566          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
6567            <a
6568              id='HeaderDrawer-AN000Qi9BeEFnb1BaV__header_link_list_U3J6RE-foundation-finder-quiz'
6569              href='/pages/foundation-finder-quiz'
6570              class='flex w-full items-center nav-link-l3'
6571              
6572            >
6573              Foundation Finder Quiz
6574            </a>
6575          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
6576            <a
6577              id='HeaderDrawer-AN000Qi9BeEFnb1BaV__header_link_list_U3J6RE-makeup-virtual-try-on'
6578              href='/pages/makeup-virtual-try-on'
6579              class='flex w-full items-center nav-link-l3'
6580              
6581            >
6582              Makeup Virtual Try-On
6583            </a>
6584          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
6585            <a
6586              id='HeaderDrawer-AN000Qi9BeEFnb1BaV__header_link_list_U3J6RE-mascara-finder-quiz'
6587              href='/pages/mascara-quiz'
6588              class='flex w-full items-center nav-link-l3'
6589              
6590            >
6591              Mascara Finder Quiz
6592            </a>
6593          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
6594            <a
6595              id='HeaderDrawer-AN000Qi9BeEFnb1BaV__header_link_list_U3J6RE-the-look-lab'
6596              href='/pages/trends'
6597              class='flex w-full items-center nav-link-l3'
6598              
6599            >
6600              The Look Lab
6601            </a>
6602          </li></ul>
6603        
6604      </div>
6605    </div>
6606  </div>
6607</custom-accordion>
6608</li>
6609
6610        </ul></div>
6611  </extended-dialog></li>
6612<li>
6613<dialog-toggle modal-id='Details-menu-drawer-menu-item-AdzFrQUg4UThnVXcyN__header_mega_menu_KnNcax' class='w-full'><button
6614      class="mobile-menu-l1-row nav-link inline-flex w-full items-center justify-between py-accordion-paddingvertical"
6615      aria-haspopup='dialog'
6616      aria-controls='Details-menu-drawer-menu-item-AdzFrQUg4UThnVXcyN__header_mega_menu_KnNcax'
6617    >
6618      <span>Fragrance</span>
6619      
6620<svg-icon
6621  src='icon-caret'
6622  class='icon-md -rotate-90'
6623
6624  
6625
6626  
6627  
6628></svg-icon>
6629
6630    </button>
6631</dialog-toggle>
6632<extended-dialog
6633    cloak
6634    type='drawer'
6635    id='Details-menu-drawer-menu-item-AdzFrQUg4UThnVXcyN__header_mega_menu_KnNcax'
6636
6637    
6638      url=''
6639    
6640
6641    
6642
6643    
6644      anchor='left'
6645    
6646
6647    
6648      close-on-backdrop-click='true'
6649    
6650
6651    
6652
6653    
6654
6655    
6656
6657    
6658
6659    
6660      parent-class='bg-background text-foreground mobile-menu-dialog color-scheme-1'
6661    
6662
6663    
6664
6665    
6666  ><div slot='header' class='relative flex w-full items-center'>
6667      <dialog-toggle modal-id='Details-menu-drawer-menu-item-AdzFrQUg4UThnVXcyN__header_mega_menu_KnNcax' class='size-icon-md shrink-0'>
6668        <button class="flex" type='button' aria-label='Back'>
6669<svg-icon
6670  src='icon-caret'
6671  class='icon-md rotate-90'
6672
6673  
6674
6675  
6676  
6677></svg-icon>
6678</button>
6679      </dialog-toggle>
6680      <span class='mobile-menu-panel-title text-legal pointer-events-none absolute inset-0 flex items-center justify-center font-medium'>Fragrance</span>
6681    </div>
6682
6683    <div class='mobile-menu-panel-body px-sm py-lg flex flex-col overflow-y-auto'><a
6684          href='/collections/fragrance'
6685          class='mb-sm btn btn-tertiary gap-2xs flex items-center '
6686        >
6687          <span>Shop All Fragrance</span>
6688          
6689          
6690        </a><ul class='mb-xl grid list-none grid-cols-1' role='list'>
6691          <li class='list-none'>
6692  <!-- ##start:entry-lazy##core/core-accordion.ts##end:entry-lazy## -->
6693
6694<custom-accordion
6695  class='group block w-full border-solid border-accordion-border [&[expanded]]:border-accordion-border-active mobile-menu-row border-b !border-border-02 [&[expanded]]:!border-foreground py-accordion-paddingvertical'
6696  
6697  
6698>
6699  <button
6700    type='button'
6701    aria-expanded='false'
6702    aria-controls='Details-AenltWDBxbUlrZkpxZ__header_link_list_fUYbN6'
6703    data-accordion-toggle
6704    class='flex w-full min-w-0 items-center justify-between gap-xs p outline-none focus-visible:ring-2 focus-visible:ring-focus focus-visible:ring-offset-2 max-md:p-0 focus-visible:ring-offset-background'
6705  >
6706    <span class='min-w-0 flex-1 text-start nav-link-l2'>Shop by Category</span>
6707    <span class='flex shrink-0 items-center' aria-hidden='true'>
6708<svg-icon
6709  src='icon-plus'
6710  class='icon-md shrink-0 group-has-[[data-open]]:hidden'
6711
6712  
6713
6714  
6715  
6716></svg-icon>
6717
6718<svg-icon
6719  src='icon-minus'
6720  class='icon-md shrink-0 group-has-[[data-open]]:block hidden'
6721
6722  
6723
6724  
6725  
6726></svg-icon>
6727</span>
6728  </button>
6729  <div
6730    id='Details-AenltWDBxbUlrZkpxZ__header_link_list_fUYbN6'
6731    class=' invisible grid grid-rows-[0fr] max-md:px-0 text-foreground-secondary transition-[visibility,grid-template-rows] duration-300 [overflow-anchor:none] group-has-[[data-open]]:visible group-has-[[data-open]]:grid-rows-[1fr]'
6732    data-accordion-content
6733    
6734  >
6735    <div class='overflow-hidden'>
6736      <div class='pt-5 [&_*:last-child]:mb-0'>
6737        
6738          <ul class='mobile-menu-sublist grid list-none grid-cols-1 gap-y-0 ps-sm pb-xs' role='list'><li class='list-none py-xs first:pt-0 last:pb-0'>
6739            <a
6740              id='HeaderDrawer-AenltWDBxbUlrZkpxZ__header_link_list_fUYbN6-perfume'
6741              href='/collections/fragrance'
6742              class='flex w-full items-center nav-link-l3'
6743              
6744            >
6745              Perfume
6746            </a>
6747          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
6748            <a
6749              id='HeaderDrawer-AenltWDBxbUlrZkpxZ__header_link_list_fUYbN6-bath-body'
6750              href='/collections/hand-body-care'
6751              class='flex w-full items-center nav-link-l3'
6752              
6753            >
6754              Bath + Body
6755            </a>
6756          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
6757            <a
6758              id='HeaderDrawer-AenltWDBxbUlrZkpxZ__header_link_list_fUYbN6-mens-cologne'
6759              href='/products/clinique-happy-cologne-spray'
6760              class='flex w-full items-center nav-link-l3'
6761              
6762            >
6763              Men&#39;s Cologne
6764            </a>
6765          </li></ul>
6766        
6767      </div>
6768    </div>
6769  </div>
6770</custom-accordion>
6771</li>
6772<li class='list-none'>
6773  <!-- ##start:entry-lazy##core/core-accordion.ts##end:entry-lazy## -->
6774
6775<custom-accordion
6776  class='group block w-full border-solid border-accordion-border [&[expanded]]:border-accordion-border-active mobile-menu-row border-b !border-border-02 [&[expanded]]:!border-foreground py-accordion-paddingvertical'
6777  
6778  
6779>
6780  <button
6781    type='button'
6782    aria-expanded='false'
6783    aria-controls='Details-AMk5ob0VERm10YlhnN__header_link_list_hkRgaD'
6784    data-accordion-toggle
6785    class='flex w-full min-w-0 items-center justify-between gap-xs p outline-none focus-visible:ring-2 focus-visible:ring-focus focus-visible:ring-offset-2 max-md:p-0 focus-visible:ring-offset-background'
6786  >
6787    <span class='min-w-0 flex-1 text-start nav-link-l2'>Collections</span>
6788    <span class='flex shrink-0 items-center' aria-hidden='true'>
6789<svg-icon
6790  src='icon-plus'
6791  class='icon-md shrink-0 group-has-[[data-open]]:hidden'
6792
6793  
6794
6795  
6796  
6797></svg-icon>
6798
6799<svg-icon
6800  src='icon-minus'
6801  class='icon-md shrink-0 group-has-[[data-open]]:block hidden'
6802
6803  
6804
6805  
6806  
6807></svg-icon>
6808</span>
6809  </button>
6810  <div
6811    id='Details-AMk5ob0VERm10YlhnN__header_link_list_hkRgaD'
6812    class=' invisible grid grid-rows-[0fr] max-md:px-0 text-foreground-secondary transition-[visibility,grid-template-rows] duration-300 [overflow-anchor:none] group-has-[[data-open]]:visible group-has-[[data-open]]:grid-rows-[1fr]'
6813    data-accordion-content
6814    
6815  >
6816    <div class='overflow-hidden'>
6817      <div class='pt-5 [&_*:last-child]:mb-0'>
6818        
6819          <ul class='mobile-menu-sublist grid list-none grid-cols-1 gap-y-0 ps-sm pb-xs' role='list'><li class='list-none py-xs first:pt-0 last:pb-0'>
6820            <a
6821              id='HeaderDrawer-AMk5ob0VERm10YlhnN__header_link_list_hkRgaD-happy'
6822              href='/pages/clinique-happy'
6823              class='flex w-full items-center nav-link-l3'
6824              
6825            >
6826              Happy
6827            </a>
6828          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
6829            <a
6830              id='HeaderDrawer-AMk5ob0VERm10YlhnN__header_link_list_hkRgaD-aromatics-elixir'
6831              href='/collections/aromatics-elixir'
6832              class='flex w-full items-center nav-link-l3'
6833              
6834            >
6835              Aromatics Elixir
6836            </a>
6837          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
6838            <a
6839              id='HeaderDrawer-AMk5ob0VERm10YlhnN__header_link_list_hkRgaD-calyx'
6840              href='/products/calyx-eau-de-parfum-spray'
6841              class='flex w-full items-center nav-link-l3'
6842              
6843            >
6844              Calyx
6845            </a>
6846          </li></ul>
6847        
6848      </div>
6849    </div>
6850  </div>
6851</custom-accordion>
6852</li>
6853<li class='list-none'>
6854  <!-- ##start:entry-lazy##core/core-accordion.ts##end:entry-lazy## -->
6855
6856<custom-accordion
6857  class='group block w-full border-solid border-accordion-border [&[expanded]]:border-accordion-border-active mobile-menu-row border-b !border-border-02 [&[expanded]]:!border-foreground py-accordion-paddingvertical'
6858  
6859  
6860>
6861  <button
6862    type='button'
6863    aria-expanded='false'
6864    aria-controls='Details-AaEVwOFBDQ2NBUThka__header_link_list_Yhd973'
6865    data-accordion-toggle
6866    class='flex w-full min-w-0 items-center justify-between gap-xs p outline-none focus-visible:ring-2 focus-visible:ring-focus focus-visible:ring-offset-2 max-md:p-0 focus-visible:ring-offset-background'
6867  >
6868    <span class='min-w-0 flex-1 text-start nav-link-l2'>Featured</span>
6869    <span class='flex shrink-0 items-center' aria-hidden='true'>
6870<svg-icon
6871  src='icon-plus'
6872  class='icon-md shrink-0 group-has-[[data-open]]:hidden'
6873
6874  
6875
6876  
6877  
6878></svg-icon>
6879
6880<svg-icon
6881  src='icon-minus'
6882  class='icon-md shrink-0 group-has-[[data-open]]:block hidden'
6883
6884  
6885
6886  
6887  
6888></svg-icon>
6889</span>
6890  </button>
6891  <div
6892    id='Details-AaEVwOFBDQ2NBUThka__header_link_list_Yhd973'
6893    class=' invisible grid grid-rows-[0fr] max-md:px-0 text-foreground-secondary transition-[visibility,grid-template-rows] duration-300 [overflow-anchor:none] group-has-[[data-open]]:visible group-has-[[data-open]]:grid-rows-[1fr]'
6894    data-accordion-content
6895    
6896  >
6897    <div class='overflow-hidden'>
6898      <div class='pt-5 [&_*:last-child]:mb-0'>
6899        
6900          <ul class='mobile-menu-sublist grid list-none grid-cols-1 gap-y-0 ps-sm pb-xs' role='list'><li class='list-none py-xs first:pt-0 last:pb-0'>
6901            <a
6902              id='HeaderDrawer-AaEVwOFBDQ2NBUThka__header_link_list_Yhd973-fragrance-sets'
6903              href='/collections/all-gifts-sets?fh_f_fhr_product_type=fragrancesets'
6904              class='flex w-full items-center nav-link-l3'
6905              
6906            >
6907              Fragrance Sets
6908            </a>
6909          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
6910            <a
6911              id='HeaderDrawer-AaEVwOFBDQ2NBUThka__header_link_list_Yhd973-find-your-scent'
6912              href='/pages/discover-clinique-fragrance'
6913              class='flex w-full items-center nav-link-l3'
6914              
6915            >
6916              Find Your Scent
6917            </a>
6918          </li></ul>
6919        
6920      </div>
6921    </div>
6922  </div>
6923</custom-accordion>
6924</li>
6925
6926        </ul><ul class='gap-y-md grid list-none grid-cols-1' role='list'>
6927          
6928<li>
6929  
6930<a href='/products/clinique-happy-in-paradise-limited-edition-eau-de-parfum-spray' class='flex items-center gap-sm'><div class='size-30 rounded-images-radius relative shrink-0 overflow-hidden'>
6931<picture class=''>
6932  <source
6933    media='(max-width: 767px)'
6934    srcset='//www.clinique.com/cdn/shop/files/gnav_happy.jpg?format=webp&v=1788454364&width=300 300w, //www.clinique.com/cdn/shop/files/gnav_happy.jpg?format=webp&v=1788454364&width=450 450w, //www.clinique.com/cdn/shop/files/gnav_happy.jpg?format=webp&v=1788454364&width=600 600w, //www.clinique.com/cdn/shop/files/gnav_happy.jpg?format=webp&v=1788454364&width=750 750w, //www.clinique.com/cdn/shop/files/gnav_happy.jpg?format=webp&v=1788454364&width=900 900w, //www.clinique.com/cdn/shop/files/gnav_happy.jpg?format=webp&v=1788454364&width=1050 1050w'
6935    sizes='120px'
6936    width='2400'
6937    height='2400'
6938  >
6939<img src="//www.clinique.com/cdn/shop/files/gnav_happy.jpg?format=webp&amp;v=1788454364&amp;width=2400" srcset="//www.clinique.com/cdn/shop/files/gnav_happy.jpg?format=webp&amp;v=1788454364&amp;width=120 120w, //www.clinique.com/cdn/shop/files/gnav_happy.jpg?format=webp&amp;v=1788454364&amp;width=240 240w" width="2400" height="2400" loading="lazy" sizes="120px" class="w-full block size-full object-cover object-cover" fetchpriority="low"></picture>
6940</div><p class='mega-menu-tile-title body-sm font-light'>Our bestselling scent uplifts with every spritz.</p></a></li>
6941
6942
6943
6944<li>
6945  
6946<a href='/pages/discover-clinique-fragrance' class='flex items-center gap-sm'><div class='size-30 rounded-images-radius relative shrink-0 overflow-hidden'>
6947<picture class=''>
6948  <source
6949    media='(max-width: 767px)'
6950    srcset='//www.clinique.com/cdn/shop/files/gnav_fragrancefinder.jpg?format=webp&v=1788454364&width=300 300w, //www.clinique.com/cdn/shop/files/gnav_fragrancefinder.jpg?format=webp&v=1788454364&width=450 450w'
6951    sizes='120px'
6952    width='564'
6953    height='563'
6954  >
6955<img src="//www.clinique.com/cdn/shop/files/gnav_fragrancefinder.jpg?format=webp&amp;v=1788454364&amp;width=564" srcset="//www.clinique.com/cdn/shop/files/gnav_fragrancefinder.jpg?format=webp&amp;v=1788454364&amp;width=120 120w, //www.clinique.com/cdn/shop/files/gnav_fragrancefinder.jpg?format=webp&amp;v=1788454364&amp;width=240 240w" width="564" height="563" loading="lazy" sizes="120px" class="w-full block size-full object-cover object-cover" fetchpriority="low"></picture>
6956</div><p class='mega-menu-tile-title body-sm font-light'>Fragrances for every mood. All allergy tested. Find yours.</p></a></li>
6957
6958
6959
6960        </ul></div>
6961  </extended-dialog></li>
6962<li>
6963<dialog-toggle modal-id='Details-menu-drawer-menu-item-AZHVNZzA2bWJQK091Z__header_mega_menu_TP8ciR' class='w-full'><button
6964      class="mobile-menu-l1-row nav-link inline-flex w-full items-center justify-between py-accordion-paddingvertical"
6965      aria-haspopup='dialog'
6966      aria-controls='Details-menu-drawer-menu-item-AZHVNZzA2bWJQK091Z__header_mega_menu_TP8ciR'
6967    >
6968      <span>Men</span>
6969      
6970<svg-icon
6971  src='icon-caret'
6972  class='icon-md -rotate-90'
6973
6974  
6975
6976  
6977  
6978></svg-icon>
6979
6980    </button>
6981</dialog-toggle>
6982<extended-dialog
6983    cloak
6984    type='drawer'
6985    id='Details-menu-drawer-menu-item-AZHVNZzA2bWJQK091Z__header_mega_menu_TP8ciR'
6986
6987    
6988      url=''
6989    
6990
6991    
6992
6993    
6994      anchor='left'
6995    
6996
6997    
6998      close-on-backdrop-click='true'
6999    
7000
7001    
7002
7003    
7004
7005    
7006
7007    
7008
7009    
7010      parent-class='bg-background text-foreground mobile-menu-dialog color-scheme-1'
7011    
7012
7013    
7014
7015    
7016  ><div slot='header' class='relative flex w-full items-center'>
7017      <dialog-toggle modal-id='Details-menu-drawer-menu-item-AZHVNZzA2bWJQK091Z__header_mega_menu_TP8ciR' class='size-icon-md shrink-0'>
7018        <button class="flex" type='button' aria-label='Back'>
7019<svg-icon
7020  src='icon-caret'
7021  class='icon-md rotate-90'
7022
7023  
7024
7025  
7026  
7027></svg-icon>
7028</button>
7029      </dialog-toggle>
7030      <span class='mobile-menu-panel-title text-legal pointer-events-none absolute inset-0 flex items-center justify-center font-medium'>Men</span>
7031    </div>
7032
7033    <div class='mobile-menu-panel-body px-sm py-lg flex flex-col overflow-y-auto'><a
7034          href='/collections/men-skincare'
7035          class='mb-sm btn btn-tertiary gap-2xs flex items-center '
7036        >
7037          <span>Shop All Men</span>
7038          
7039          
7040        </a><ul class='mb-xl grid list-none grid-cols-1' role='list'>
7041          <li class='list-none'>
7042  <!-- ##start:entry-lazy##core/core-accordion.ts##end:entry-lazy## -->
7043
7044<custom-accordion
7045  class='group block w-full border-solid border-accordion-border [&[expanded]]:border-accordion-border-active mobile-menu-row border-b !border-border-02 [&[expanded]]:!border-foreground py-accordion-paddingvertical'
7046  
7047  
7048>
7049  <button
7050    type='button'
7051    aria-expanded='false'
7052    aria-controls='Details-ARlRXRGN1cFMrZCtwN__header_link_list_CpVWbf'
7053    data-accordion-toggle
7054    class='flex w-full min-w-0 items-center justify-between gap-xs p outline-none focus-visible:ring-2 focus-visible:ring-focus focus-visible:ring-offset-2 max-md:p-0 focus-visible:ring-offset-background'
7055  >
7056    <span class='min-w-0 flex-1 text-start nav-link-l2'>Shop by Category</span>
7057    <span class='flex shrink-0 items-center' aria-hidden='true'>
7058<svg-icon
7059  src='icon-plus'
7060  class='icon-md shrink-0 group-has-[[data-open]]:hidden'
7061
7062  
7063
7064  
7065  
7066></svg-icon>
7067
7068<svg-icon
7069  src='icon-minus'
7070  class='icon-md shrink-0 group-has-[[data-open]]:block hidden'
7071
7072  
7073
7074  
7075  
7076></svg-icon>
7077</span>
7078  </button>
7079  <div
7080    id='Details-ARlRXRGN1cFMrZCtwN__header_link_list_CpVWbf'
7081    class=' invisible grid grid-rows-[0fr] max-md:px-0 text-foreground-secondary transition-[visibility,grid-template-rows] duration-300 [overflow-anchor:none] group-has-[[data-open]]:visible group-has-[[data-open]]:grid-rows-[1fr]'
7082    data-accordion-content
7083    
7084  >
7085    <div class='overflow-hidden'>
7086      <div class='pt-5 [&_*:last-child]:mb-0'>
7087        
7088          <ul class='mobile-menu-sublist grid list-none grid-cols-1 gap-y-0 ps-sm pb-xs' role='list'><li class='mb-3xs list-none last:mb-0'>
7089            <a
7090              href='/collections/mens-gifts-sets'
7091              class='flex w-full items-center gap-2xs py-2xs nav-link-l2'
7092            >
7093              <span>Shop All Shop by Category</span>
7094<svg-icon
7095  src='icon-arrow'
7096  class='icon-md'
7097
7098  
7099
7100  
7101  
7102></svg-icon>
7103</a>
7104          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
7105            <a
7106              id='HeaderDrawer-ARlRXRGN1cFMrZCtwN__header_link_list_CpVWbf-moisturizers-face-creams'
7107              href='/collections/moisturizers-and-face-creams-for-men'
7108              class='flex w-full items-center nav-link-l3'
7109              
7110            >
7111              Moisturizers + Face Creams
7112            </a>
7113          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
7114            <a
7115              id='HeaderDrawer-ARlRXRGN1cFMrZCtwN__header_link_list_CpVWbf-cleansers-exfoliators'
7116              href='/collections/cleanse-exfoliate'
7117              class='flex w-full items-center nav-link-l3'
7118              
7119            >
7120              Cleansers + Exfoliators
7121            </a>
7122          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
7123            <a
7124              id='HeaderDrawer-ARlRXRGN1cFMrZCtwN__header_link_list_CpVWbf-shave'
7125              href='/collections/shave'
7126              class='flex w-full items-center nav-link-l3'
7127              
7128            >
7129              Shave
7130            </a>
7131          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
7132            <a
7133              id='HeaderDrawer-ARlRXRGN1cFMrZCtwN__header_link_list_CpVWbf-cologne'
7134              href='/products/clinique-happy-cologne-spray'
7135              class='flex w-full items-center nav-link-l3'
7136              
7137            >
7138              Cologne
7139            </a>
7140          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
7141            <a
7142              id='HeaderDrawer-ARlRXRGN1cFMrZCtwN__header_link_list_CpVWbf-mens-gift-sets'
7143              href='/collections/mens-gifts-sets'
7144              class='flex w-full items-center nav-link-l3'
7145              
7146            >
7147              Men&#39;s Gift Sets
7148            </a>
7149          </li></ul>
7150        
7151      </div>
7152    </div>
7153  </div>
7154</custom-accordion>
7155</li>
7156<li class='list-none'>
7157  <!-- ##start:entry-lazy##core/core-accordion.ts##end:entry-lazy## -->
7158
7159<custom-accordion
7160  class='group block w-full border-solid border-accordion-border [&[expanded]]:border-accordion-border-active mobile-menu-row border-b !border-border-02 [&[expanded]]:!border-foreground py-accordion-paddingvertical'
7161  
7162  
7163>
7164  <button
7165    type='button'
7166    aria-expanded='false'
7167    aria-controls='Details-AWFJTRXpkamNYTFlIW__header_link_list_LLXjjT'
7168    data-accordion-toggle
7169    class='flex w-full min-w-0 items-center justify-between gap-xs p outline-none focus-visible:ring-2 focus-visible:ring-focus focus-visible:ring-offset-2 max-md:p-0 focus-visible:ring-offset-background'
7170  >
7171    <span class='min-w-0 flex-1 text-start nav-link-l2'>Shop by Skin Type</span>
7172    <span class='flex shrink-0 items-center' aria-hidden='true'>
7173<svg-icon
7174  src='icon-plus'
7175  class='icon-md shrink-0 group-has-[[data-open]]:hidden'
7176
7177  
7178
7179  
7180  
7181></svg-icon>
7182
7183<svg-icon
7184  src='icon-minus'
7185  class='icon-md shrink-0 group-has-[[data-open]]:block hidden'
7186
7187  
7188
7189  
7190  
7191></svg-icon>
7192</span>
7193  </button>
7194  <div
7195    id='Details-AWFJTRXpkamNYTFlIW__header_link_list_LLXjjT'
7196    class=' invisible grid grid-rows-[0fr] max-md:px-0 text-foreground-secondary transition-[visibility,grid-template-rows] duration-300 [overflow-anchor:none] group-has-[[data-open]]:visible group-has-[[data-open]]:grid-rows-[1fr]'
7197    data-accordion-content
7198    
7199  >
7200    <div class='overflow-hidden'>
7201      <div class='pt-5 [&_*:last-child]:mb-0'>
7202        
7203          <ul class='mobile-menu-sublist grid list-none grid-cols-1 gap-y-0 ps-sm pb-xs' role='list'><li class='list-none py-xs first:pt-0 last:pb-0'>
7204            <a
7205              id='HeaderDrawer-AWFJTRXpkamNYTFlIW__header_link_list_LLXjjT-very-dry-to-dry'
7206              href='/collections/men-skincare?fh_f_elc_product_skin_type=very_dry_to_dry'
7207              class='flex w-full items-center nav-link-l3'
7208              
7209            >
7210              Very Dry to Dry
7211            </a>
7212          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
7213            <a
7214              id='HeaderDrawer-AWFJTRXpkamNYTFlIW__header_link_list_LLXjjT-dry-combination'
7215              href='/collections/men-skincare?fh_f_elc_product_skin_type=combination%2Cvery_dry_to_dry'
7216              class='flex w-full items-center nav-link-l3'
7217              
7218            >
7219              Dry Combination
7220            </a>
7221          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
7222            <a
7223              id='HeaderDrawer-AWFJTRXpkamNYTFlIW__header_link_list_LLXjjT-oily-combination'
7224              href='/collections/men-skincare?fh_f_elc_product_skin_type=combination%2Coily'
7225              class='flex w-full items-center nav-link-l3'
7226              
7227            >
7228              Oily Combination
7229            </a>
7230          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
7231            <a
7232              id='HeaderDrawer-AWFJTRXpkamNYTFlIW__header_link_list_LLXjjT-oily'
7233              href='/collections/men-skincare?fh_f_elc_product_skin_type=oily'
7234              class='flex w-full items-center nav-link-l3'
7235              
7236            >
7237              Oily
7238            </a>
7239          </li></ul>
7240        
7241      </div>
7242    </div>
7243  </div>
7244</custom-accordion>
7245</li>
7246
7247        </ul><ul class='gap-y-md grid list-none grid-cols-1' role='list'>
7248          
7249<li>
7250  
7251<a href='/products/clinique-for-men-daily-hydrator-broad-spectrum-spf-35' class='flex items-center gap-sm'><div class='size-30 rounded-images-radius relative shrink-0 overflow-hidden'>
7252<picture class=''>
7253  <source
7254    media='(max-width: 767px)'
7255    srcset='//www.clinique.com/cdn/shop/files/gnav_cfm_hydrator.jpg?format=webp&v=1788454364&width=300 300w, //www.clinique.com/cdn/shop/files/gnav_cfm_hydrator.jpg?format=webp&v=1788454364&width=450 450w'
7256    sizes='120px'
7257    width='486'
7258    height='486'
7259  >
7260<img src="//www.clinique.com/cdn/shop/files/gnav_cfm_hydrator.jpg?format=webp&amp;v=1788454364&amp;width=486" srcset="//www.clinique.com/cdn/shop/files/gnav_cfm_hydrator.jpg?format=webp&amp;v=1788454364&amp;width=120 120w, //www.clinique.com/cdn/shop/files/gnav_cfm_hydrator.jpg?format=webp&amp;v=1788454364&amp;width=240 240w" width="486" height="486" loading="lazy" sizes="120px" class="w-full block size-full object-cover object-cover" fetchpriority="low"></picture>
7261</div><p class='mega-menu-tile-title body-sm font-light'>Clinique For Men™ Daily Hydrator Broad Spectrum SPF 35</p></a></li>
7262
7263
7264
7265<li>
7266  
7267<a href='/collections/mens-skincare' class='flex items-center gap-sm'><div class='size-30 rounded-images-radius relative shrink-0 overflow-hidden'>
7268<picture class=''>
7269  <source
7270    media='(max-width: 767px)'
7271    srcset='//www.clinique.com/cdn/shop/files/gnav_formen.jpg?format=webp&v=1788454364&width=300 300w, //www.clinique.com/cdn/shop/files/gnav_formen.jpg?format=webp&v=1788454364&width=450 450w'
7272    sizes='120px'
7273    width='510'
7274    height='510'
7275  >
7276<img src="//www.clinique.com/cdn/shop/files/gnav_formen.jpg?format=webp&amp;v=1788454364&amp;width=510" srcset="//www.clinique.com/cdn/shop/files/gnav_formen.jpg?format=webp&amp;v=1788454364&amp;width=120 120w, //www.clinique.com/cdn/shop/files/gnav_formen.jpg?format=webp&amp;v=1788454364&amp;width=240 240w" width="510" height="510" loading="lazy" sizes="120px" class="w-full block size-full object-cover object-cover" fetchpriority="low"></picture>
7277</div><p class='mega-menu-tile-title body-sm font-light'>Skincare favorites to keep him looking and feeling his best.</p></a></li>
7278
7279
7280
7281        </ul></div>
7282  </extended-dialog></li>
7283<li>
7284<dialog-toggle modal-id='Details-menu-drawer-menu-item-AQXJYcUtVWVEwNXJxd__header_mega_menu_TqptdD' class='w-full'><button
7285      class="mobile-menu-l1-row nav-link inline-flex w-full items-center justify-between py-accordion-paddingvertical"
7286      aria-haspopup='dialog'
7287      aria-controls='Details-menu-drawer-menu-item-AQXJYcUtVWVEwNXJxd__header_mega_menu_TqptdD'
7288    >
7289      <span>Offers</span>
7290      
7291<svg-icon
7292  src='icon-caret'
7293  class='icon-md -rotate-90'
7294
7295  
7296
7297  
7298  
7299></svg-icon>
7300
7301    </button>
7302</dialog-toggle>
7303<extended-dialog
7304    cloak
7305    type='drawer'
7306    id='Details-menu-drawer-menu-item-AQXJYcUtVWVEwNXJxd__header_mega_menu_TqptdD'
7307
7308    
7309      url=''
7310    
7311
7312    
7313
7314    
7315      anchor='left'
7316    
7317
7318    
7319      close-on-backdrop-click='true'
7320    
7321
7322    
7323
7324    
7325
7326    
7327
7328    
7329
7330    
7331      parent-class='bg-background text-foreground mobile-menu-dialog color-scheme-1'
7332    
7333
7334    
7335
7336    
7337  ><div slot='header' class='relative flex w-full items-center'>
7338      <dialog-toggle modal-id='Details-menu-drawer-menu-item-AQXJYcUtVWVEwNXJxd__header_mega_menu_TqptdD' class='size-icon-md shrink-0'>
7339        <button class="flex" type='button' aria-label='Back'>
7340<svg-icon
7341  src='icon-caret'
7342  class='icon-md rotate-90'
7343
7344  
7345
7346  
7347  
7348></svg-icon>
7349</button>
7350      </dialog-toggle>
7351      <span class='mobile-menu-panel-title text-legal pointer-events-none absolute inset-0 flex items-center justify-center font-medium'>Offers</span>
7352    </div>
7353
7354    <div class='mobile-menu-panel-body px-sm py-lg flex flex-col overflow-y-auto'><a
7355          href='/pages/offers'
7356          class='mb-sm btn btn-tertiary gap-2xs flex items-center '
7357        >
7358          <span>Shop All Offers</span>
7359          
7360          
7361        </a><ul class='mb-xl grid list-none grid-cols-1' role='list'>
7362          <li class='list-none'>
7363  <!-- ##start:entry-lazy##core/core-accordion.ts##end:entry-lazy## -->
7364
7365<custom-accordion
7366  class='group block w-full border-solid border-accordion-border [&[expanded]]:border-accordion-border-active mobile-menu-row border-b !border-border-02 [&[expanded]]:!border-foreground py-accordion-paddingvertical'
7367  
7368  
7369>
7370  <button
7371    type='button'
7372    aria-expanded='false'
7373    aria-controls='Details-ATnQyRlZKTDVRaGxWM__header_link_list_DLwrgL'
7374    data-accordion-toggle
7375    class='flex w-full min-w-0 items-center justify-between gap-xs p outline-none focus-visible:ring-2 focus-visible:ring-focus focus-visible:ring-offset-2 max-md:p-0 focus-visible:ring-offset-background'
7376  >
7377    <span class='min-w-0 flex-1 text-start nav-link-l2'>All Offers</span>
7378    <span class='flex shrink-0 items-center' aria-hidden='true'>
7379<svg-icon
7380  src='icon-plus'
7381  class='icon-md shrink-0 group-has-[[data-open]]:hidden'
7382
7383  
7384
7385  
7386  
7387></svg-icon>
7388
7389<svg-icon
7390  src='icon-minus'
7391  class='icon-md shrink-0 group-has-[[data-open]]:block hidden'
7392
7393  
7394
7395  
7396  
7397></svg-icon>
7398</span>
7399  </button>
7400  <div
7401    id='Details-ATnQyRlZKTDVRaGxWM__header_link_list_DLwrgL'
7402    class=' invisible grid grid-rows-[0fr] max-md:px-0 text-foreground-secondary transition-[visibility,grid-template-rows] duration-300 [overflow-anchor:none] group-has-[[data-open]]:visible group-has-[[data-open]]:grid-rows-[1fr]'
7403    data-accordion-content
7404    
7405  >
7406    <div class='overflow-hidden'>
7407      <div class='pt-5 [&_*:last-child]:mb-0'>
7408        
7409          <ul class='mobile-menu-sublist grid list-none grid-cols-1 gap-y-0 ps-sm pb-xs' role='list'><li class='list-none py-xs first:pt-0 last:pb-0'>
7410            <a
7411              id='HeaderDrawer-ATnQyRlZKTDVRaGxWM__header_link_list_DLwrgL-medical-community'
7412              href='/pages/medical-professionals'
7413              class='flex w-full items-center nav-link-l3'
7414              
7415            >
7416              Medical Community
7417            </a>
7418          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
7419            <a
7420              id='HeaderDrawer-ATnQyRlZKTDVRaGxWM__header_link_list_DLwrgL-risk-free-foundation-trial'
7421              href='/pages/risk-free-trial'
7422              class='flex w-full items-center nav-link-l3'
7423              
7424            >
7425              Risk-Free Foundation Trial
7426            </a>
7427          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
7428            <a
7429              id='HeaderDrawer-ATnQyRlZKTDVRaGxWM__header_link_list_DLwrgL-egift-card'
7430              href='/products/clinique-egift-card'
7431              class='flex w-full items-center nav-link-l3'
7432              
7433            >
7434              eGift Card
7435            </a>
7436          </li></ul>
7437        
7438      </div>
7439    </div>
7440  </div>
7441</custom-accordion>
7442</li>
7443
7444<li class='mobile-menu-row list-none border-b border-border-01'>
7445  <a
7446    href='/pages/smart-rewards'
7447    class='flex w-full items-center py-6 body-sm font-light uppercase'
7448    
7449    
7450    
7451  >Smart Rewards</a>
7452</li>
7453
7454
7455
7456        </ul><ul class='gap-y-md grid list-none grid-cols-1' role='list'>
7457          
7458<li>
7459  
7460<a href='/collections/bestsellers' class='flex items-center gap-sm'><div class='size-30 rounded-images-radius relative shrink-0 overflow-hidden'>
7461<picture class=''>
7462  <source
7463    media='(max-width: 767px)'
7464    srcset='//www.clinique.com/cdn/shop/files/FY26_SEPT_PICK_YOUR_TRAVEL_NECESSITIES_NAV.jpg?format=webp&v=1789569796&width=300 300w, //www.clinique.com/cdn/shop/files/FY26_SEPT_PICK_YOUR_TRAVEL_NECESSITIES_NAV.jpg?format=webp&v=1789569796&width=450 450w'
7465    sizes='120px'
7466    width='486'
7467    height='486'
7468  >
7469<img src="//www.clinique.com/cdn/shop/files/FY26_SEPT_PICK_YOUR_TRAVEL_NECESSITIES_NAV.jpg?format=webp&amp;v=1789569796&amp;width=486" srcset="//www.clinique.com/cdn/shop/files/FY26_SEPT_PICK_YOUR_TRAVEL_NECESSITIES_NAV.jpg?format=webp&amp;v=1789569796&amp;width=120 120w, //www.clinique.com/cdn/shop/files/FY26_SEPT_PICK_YOUR_TRAVEL_NECESSITIES_NAV.jpg?format=webp&amp;v=1789569796&amp;width=240 240w" width="486" height="486" loading="lazy" sizes="120px" class="w-full block size-full object-cover object-cover" fetchpriority="low"></picture>
7470</div><p class='mega-menu-tile-title body-sm font-light'>Travel ready. Pick 4 on-the-go essentials with eligible $75 purchase</p></a></li>
7471
7472
7473
7474<li>
7475  
7476<a href='/pages/smart-rewards' class='flex items-center gap-sm'><div class='size-30 rounded-images-radius relative shrink-0 overflow-hidden'>
7477<picture class=''>
7478  <source
7479    media='(max-width: 767px)'
7480    srcset='//www.clinique.com/cdn/shop/files/052126_offersnav_tout_loyaltyredeem2x.jpg?format=webp&v=1788454364&width=300 300w, //www.clinique.com/cdn/shop/files/052126_offersnav_tout_loyaltyredeem2x.jpg?format=webp&v=1788454364&width=450 450w'
7481    sizes='120px'
7482    width='486'
7483    height='486'
7484  >
7485<img src="//www.clinique.com/cdn/shop/files/052126_offersnav_tout_loyaltyredeem2x.jpg?format=webp&amp;v=1788454364&amp;width=486" srcset="//www.clinique.com/cdn/shop/files/052126_offersnav_tout_loyaltyredeem2x.jpg?format=webp&amp;v=1788454364&amp;width=120 120w, //www.clinique.com/cdn/shop/files/052126_offersnav_tout_loyaltyredeem2x.jpg?format=webp&amp;v=1788454364&amp;width=240 240w" width="486" height="486" loading="lazy" sizes="120px" class="w-full block size-full object-cover object-cover" fetchpriority="low"></picture>
7486</div><p class='mega-menu-tile-title body-sm font-light'>Join Smart Rewards and get free standard shipping with any order.</p></a></li>
7487
7488
7489
7490        </ul></div>
7491  </extended-dialog></li>
7492<li>
7493<dialog-toggle modal-id='Details-menu-drawer-menu-item-Adk1Vcml2VWt0dWRXK__header_mega_menu_zCxM4C' class='w-full'><button
7494      class="mobile-menu-l1-row nav-link inline-flex w-full items-center justify-between py-accordion-paddingvertical"
7495      aria-haspopup='dialog'
7496      aria-controls='Details-menu-drawer-menu-item-Adk1Vcml2VWt0dWRXK__header_mega_menu_zCxM4C'
7497    >
7498      <span>Services</span>
7499      
7500<svg-icon
7501  src='icon-caret'
7502  class='icon-md -rotate-90'
7503
7504  
7505
7506  
7507  
7508></svg-icon>
7509
7510    </button>
7511</dialog-toggle>
7512<extended-dialog
7513    cloak
7514    type='drawer'
7515    id='Details-menu-drawer-menu-item-Adk1Vcml2VWt0dWRXK__header_mega_menu_zCxM4C'
7516
7517    
7518      url=''
7519    
7520
7521    
7522
7523    
7524      anchor='left'
7525    
7526
7527    
7528      close-on-backdrop-click='true'
7529    
7530
7531    
7532
7533    
7534
7535    
7536
7537    
7538
7539    
7540      parent-class='bg-background text-foreground mobile-menu-dialog color-scheme-1'
7541    
7542
7543    
7544
7545    
7546  ><div slot='header' class='relative flex w-full items-center'>
7547      <dialog-toggle modal-id='Details-menu-drawer-menu-item-Adk1Vcml2VWt0dWRXK__header_mega_menu_zCxM4C' class='size-icon-md shrink-0'>
7548        <button class="flex" type='button' aria-label='Back'>
7549<svg-icon
7550  src='icon-caret'
7551  class='icon-md rotate-90'
7552
7553  
7554
7555  
7556  
7557></svg-icon>
7558</button>
7559      </dialog-toggle>
7560      <span class='mobile-menu-panel-title text-legal pointer-events-none absolute inset-0 flex items-center justify-center font-medium'>Services</span>
7561    </div>
7562
7563    <div class='mobile-menu-panel-body px-sm py-lg flex flex-col overflow-y-auto'><a
7564          href='/pages/services'
7565          class='mb-sm btn btn-tertiary gap-2xs flex items-center '
7566        >
7567          <span>Shop All Services</span>
7568          
7569          
7570        </a><ul class='mb-xl grid list-none grid-cols-1' role='list'>
7571          <li class='list-none'>
7572  <!-- ##start:entry-lazy##core/core-accordion.ts##end:entry-lazy## -->
7573
7574<custom-accordion
7575  class='group block w-full border-solid border-accordion-border [&[expanded]]:border-accordion-border-active mobile-menu-row border-b !border-border-02 [&[expanded]]:!border-foreground py-accordion-paddingvertical'
7576  
7577  
7578>
7579  <button
7580    type='button'
7581    aria-expanded='false'
7582    aria-controls='Details-ARDdEOTJYdldBSmJ6b__header_link_list_qDGtF4'
7583    data-accordion-toggle
7584    class='flex w-full min-w-0 items-center justify-between gap-xs p outline-none focus-visible:ring-2 focus-visible:ring-focus focus-visible:ring-offset-2 max-md:p-0 focus-visible:ring-offset-background'
7585  >
7586    <span class='min-w-0 flex-1 text-start nav-link-l2'>Skincare Services</span>
7587    <span class='flex shrink-0 items-center' aria-hidden='true'>
7588<svg-icon
7589  src='icon-plus'
7590  class='icon-md shrink-0 group-has-[[data-open]]:hidden'
7591
7592  
7593
7594  
7595  
7596></svg-icon>
7597
7598<svg-icon
7599  src='icon-minus'
7600  class='icon-md shrink-0 group-has-[[data-open]]:block hidden'
7601
7602  
7603
7604  
7605  
7606></svg-icon>
7607</span>
7608  </button>
7609  <div
7610    id='Details-ARDdEOTJYdldBSmJ6b__header_link_list_qDGtF4'
7611    class=' invisible grid grid-rows-[0fr] max-md:px-0 text-foreground-secondary transition-[visibility,grid-template-rows] duration-300 [overflow-anchor:none] group-has-[[data-open]]:visible group-has-[[data-open]]:grid-rows-[1fr]'
7612    data-accordion-content
7613    
7614  >
7615    <div class='overflow-hidden'>
7616      <div class='pt-5 [&_*:last-child]:mb-0'>
7617        
7618          <ul class='mobile-menu-sublist grid list-none grid-cols-1 gap-y-0 ps-sm pb-xs' role='list'><li class='list-none py-xs first:pt-0 last:pb-0'>
7619            <a
7620              id='HeaderDrawer-ARDdEOTJYdldBSmJ6b__header_link_list_qDGtF4-clinical-reality-skin-diagnostic'
7621              href='/pages/clinicalreality'
7622              class='flex w-full items-center nav-link-l3'
7623              
7624            >
7625              Clinical Reality Skin Diagnostic
7626            </a>
7627          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
7628            <a
7629              id='HeaderDrawer-ARDdEOTJYdldBSmJ6b__header_link_list_qDGtF4-skincare-finder-quiz'
7630              href='/pages/skincare-quiz'
7631              class='flex w-full items-center nav-link-l3'
7632              
7633            >
7634              Skincare Finder Quiz
7635            </a>
7636          </li></ul>
7637        
7638      </div>
7639    </div>
7640  </div>
7641</custom-accordion>
7642</li>
7643<li class='list-none'>
7644  <!-- ##start:entry-lazy##core/core-accordion.ts##end:entry-lazy## -->
7645
7646<custom-accordion
7647  class='group block w-full border-solid border-accordion-border [&[expanded]]:border-accordion-border-active mobile-menu-row border-b !border-border-02 [&[expanded]]:!border-foreground py-accordion-paddingvertical'
7648  
7649  
7650>
7651  <button
7652    type='button'
7653    aria-expanded='false'
7654    aria-controls='Details-AcmpTeGVEblVuSjdNK__header_link_list_6VLjTR'
7655    data-accordion-toggle
7656    class='flex w-full min-w-0 items-center justify-between gap-xs p outline-none focus-visible:ring-2 focus-visible:ring-focus focus-visible:ring-offset-2 max-md:p-0 focus-visible:ring-offset-background'
7657  >
7658    <span class='min-w-0 flex-1 text-start nav-link-l2'>Makeup Services</span>
7659    <span class='flex shrink-0 items-center' aria-hidden='true'>
7660<svg-icon
7661  src='icon-plus'
7662  class='icon-md shrink-0 group-has-[[data-open]]:hidden'
7663
7664  
7665
7666  
7667  
7668></svg-icon>
7669
7670<svg-icon
7671  src='icon-minus'
7672  class='icon-md shrink-0 group-has-[[data-open]]:block hidden'
7673
7674  
7675
7676  
7677  
7678></svg-icon>
7679</span>
7680  </button>
7681  <div
7682    id='Details-AcmpTeGVEblVuSjdNK__header_link_list_6VLjTR'
7683    class=' invisible grid grid-rows-[0fr] max-md:px-0 text-foreground-secondary transition-[visibility,grid-template-rows] duration-300 [overflow-anchor:none] group-has-[[data-open]]:visible group-has-[[data-open]]:grid-rows-[1fr]'
7684    data-accordion-content
7685    
7686  >
7687    <div class='overflow-hidden'>
7688      <div class='pt-5 [&_*:last-child]:mb-0'>
7689        
7690          <ul class='mobile-menu-sublist grid list-none grid-cols-1 gap-y-0 ps-sm pb-xs' role='list'><li class='list-none py-xs first:pt-0 last:pb-0'>
7691            <a
7692              id='HeaderDrawer-AcmpTeGVEblVuSjdNK__header_link_list_6VLjTR-risk-free-foundation-trial'
7693              href='/pages/risk-free-trial'
7694              class='flex w-full items-center nav-link-l3'
7695              
7696            >
7697              Risk-Free Foundation Trial
7698            </a>
7699          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
7700            <a
7701              id='HeaderDrawer-AcmpTeGVEblVuSjdNK__header_link_list_6VLjTR-foundation-finder'
7702              href='/pages/foundation-finder-quiz'
7703              class='flex w-full items-center nav-link-l3'
7704              
7705            >
7706              Foundation Finder
7707            </a>
7708          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
7709            <a
7710              id='HeaderDrawer-AcmpTeGVEblVuSjdNK__header_link_list_6VLjTR-makeup-virtual-try-on'
7711              href='/pages/makeup-virtual-try-on'
7712              class='flex w-full items-center nav-link-l3'
7713              
7714            >
7715              Makeup Virtual Try-On
7716            </a>
7717          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
7718            <a
7719              id='HeaderDrawer-AcmpTeGVEblVuSjdNK__header_link_list_6VLjTR-mascara-finder'
7720              href='/pages/mascara-quiz'
7721              class='flex w-full items-center nav-link-l3'
7722              
7723            >
7724              Mascara Finder
7725            </a>
7726          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
7727            <a
7728              id='HeaderDrawer-AcmpTeGVEblVuSjdNK__header_link_list_6VLjTR-acuvue®-partnership'
7729              href='/pages/clinique-acuvue-partnership'
7730              class='flex w-full items-center nav-link-l3'
7731              
7732            >
7733              ACUVUE® Partnership
7734            </a>
7735          </li></ul>
7736        
7737      </div>
7738    </div>
7739  </div>
7740</custom-accordion>
7741</li>
7742<li class='list-none'>
7743  <!-- ##start:entry-lazy##core/core-accordion.ts##end:entry-lazy## -->
7744
7745<custom-accordion
7746  class='group block w-full border-solid border-accordion-border [&[expanded]]:border-accordion-border-active mobile-menu-row border-b !border-border-02 [&[expanded]]:!border-foreground py-accordion-paddingvertical'
7747  
7748  
7749>
7750  <button
7751    type='button'
7752    aria-expanded='false'
7753    aria-controls='Details-AeHNTZlcwMm1jdlJDL__header_link_list_ihKMFb'
7754    data-accordion-toggle
7755    class='flex w-full min-w-0 items-center justify-between gap-xs p outline-none focus-visible:ring-2 focus-visible:ring-focus focus-visible:ring-offset-2 max-md:p-0 focus-visible:ring-offset-background'
7756  >
7757    <span class='min-w-0 flex-1 text-start nav-link-l2'>Fragrance Services</span>
7758    <span class='flex shrink-0 items-center' aria-hidden='true'>
7759<svg-icon
7760  src='icon-plus'
7761  class='icon-md shrink-0 group-has-[[data-open]]:hidden'
7762
7763  
7764
7765  
7766  
7767></svg-icon>
7768
7769<svg-icon
7770  src='icon-minus'
7771  class='icon-md shrink-0 group-has-[[data-open]]:block hidden'
7772
7773  
7774
7775  
7776  
7777></svg-icon>
7778</span>
7779  </button>
7780  <div
7781    id='Details-AeHNTZlcwMm1jdlJDL__header_link_list_ihKMFb'
7782    class=' invisible grid grid-rows-[0fr] max-md:px-0 text-foreground-secondary transition-[visibility,grid-template-rows] duration-300 [overflow-anchor:none] group-has-[[data-open]]:visible group-has-[[data-open]]:gri
7782d-rows-[1fr]'
7783    data-accordion-content
7784    
7785  >
7786    <div class='overflow-hidden'>
7787      <div class='pt-5 [&_*:last-child]:mb-0'>
7788        
7789          <ul class='mobile-menu-sublist grid list-none grid-cols-1 gap-y-0 ps-sm pb-xs' role='list'><li class='list-none py-xs first:pt-0 last:pb-0'>
7790            <a
7791              id='HeaderDrawer-AeHNTZlcwMm1jdlJDL__header_link_list_ihKMFb-find-your-scent'
7792              href='/pages/discover-clinique-fragrance'
7793              class='flex w-full items-center nav-link-l3'
7794              
7795            >
7796              Find Your Scent
7797            </a>
7798          </li></ul>
7799        
7800      </div>
7801    </div>
7802  </div>
7803</custom-accordion>
7804</li>
7805<li class='list-none'>
7806  <!-- ##start:entry-lazy##core/core-accordion.ts##end:entry-lazy## -->
7807
7808<custom-accordion
7809  class='group block w-full border-solid border-accordion-border [&[expanded]]:border-accordion-border-active mobile-menu-row border-b !border-border-02 [&[expanded]]:!border-foreground py-accordion-paddingvertical'
7810  
7811  
7812>
7813  <button
7814    type='button'
7815    aria-expanded='false'
7816    aria-controls='Details-AQ1ZuL0dnNU9JcUxVK__header_link_list_tqXcLf'
7817    data-accordion-toggle
7818    class='flex w-full min-w-0 items-center justify-between gap-xs p outline-none focus-visible:ring-2 focus-visible:ring-focus focus-visible:ring-offset-2 max-md:p-0 focus-visible:ring-offset-background'
7819  >
7820    <span class='min-w-0 flex-1 text-start nav-link-l2'>Expert Advice</span>
7821    <span class='flex shrink-0 items-center' aria-hidden='true'>
7822<svg-icon
7823  src='icon-plus'
7824  class='icon-md shrink-0 group-has-[[data-open]]:hidden'
7825
7826  
7827
7828  
7829  
7830></svg-icon>
7831
7832<svg-icon
7833  src='icon-minus'
7834  class='icon-md shrink-0 group-has-[[data-open]]:block hidden'
7835
7836  
7837
7838  
7839  
7840></svg-icon>
7841</span>
7842  </button>
7843  <div
7844    id='Details-AQ1ZuL0dnNU9JcUxVK__header_link_list_tqXcLf'
7845    class=' invisible grid grid-rows-[0fr] max-md:px-0 text-foreground-secondary transition-[visibility,grid-template-rows] duration-300 [overflow-anchor:none] group-has-[[data-open]]:visible group-has-[[data-open]]:grid-rows-[1fr]'
7846    data-accordion-content
7847    
7848  >
7849    <div class='overflow-hidden'>
7850      <div class='pt-5 [&_*:last-child]:mb-0'>
7851        
7852          <ul class='mobile-menu-sublist grid list-none grid-cols-1 gap-y-0 ps-sm pb-xs' role='list'><li class='list-none py-xs first:pt-0 last:pb-0'>
7853            <a
7854              id='HeaderDrawer-AQ1ZuL0dnNU9JcUxVK__header_link_list_tqXcLf-customer-service'
7855              href='/pages/contact-us'
7856              class='flex w-full items-center nav-link-l3'
7857              
7858            >
7859              Customer Service
7860            </a>
7861          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
7862            <a
7863              id='HeaderDrawer-AQ1ZuL0dnNU9JcUxVK__header_link_list_tqXcLf-in-store-consultations'
7864              href='/pages/store-locator'
7865              class='flex w-full items-center nav-link-l3'
7866              
7867            >
7868              In-Store Consultations
7869            </a>
7870          </li><li class='list-none py-xs first:pt-0 last:pb-0'>
7871            <a
7872              id='HeaderDrawer-AQ1ZuL0dnNU9JcUxVK__header_link_list_tqXcLf-the-look-lab'
7873              href='/pages/trends'
7874              class='flex w-full items-center nav-link-l3'
7875              
7876            >
7877              The Look Lab
7878            </a>
7879          </li></ul>
7880        
7881      </div>
7882    </div>
7883  </div>
7884</custom-accordion>
7885</li>
7886
7887        </ul><ul class='gap-y-md grid list-none grid-cols-1' role='list'>
7888          
7889<li>
7890  
7891<a href='/pages/skincare-quiz' class='flex items-center gap-sm'><div class='size-30 rounded-images-radius relative shrink-0 overflow-hidden'>
7892<picture class=''>
7893  <source
7894    media='(max-width: 767px)'
7895    srcset='//www.clinique.com/cdn/shop/files/gnav_skincare_quiz.jpg?format=webp&v=1788454574&width=300 300w, //www.clinique.com/cdn/shop/files/gnav_skincare_quiz.jpg?format=webp&v=1788454574&width=450 450w, //www.clinique.com/cdn/shop/files/gnav_skincare_quiz.jpg?format=webp&v=1788454574&width=600 600w'
7896    sizes='120px'
7897    width='632'
7898    height='632'
7899  >
7900<img src="//www.clinique.com/cdn/shop/files/gnav_skincare_quiz.jpg?format=webp&amp;v=1788454574&amp;width=632" srcset="//www.clinique.com/cdn/shop/files/gnav_skincare_quiz.jpg?format=webp&amp;v=1788454574&amp;width=120 120w, //www.clinique.com/cdn/shop/files/gnav_skincare_quiz.jpg?format=webp&amp;v=1788454574&amp;width=240 240w" width="632" height="632" loading="lazy" sizes="120px" class="w-full block size-full object-cover object-cover" fetchpriority="low"></picture>
7901</div><p class='mega-menu-tile-title body-sm font-light'>Skincare Finder. 3 quick questions lock in on key products for your routine.</p></a></li>
7902
7903
7904
7905        </ul></div>
7906  </extended-dialog></li>
7907
7908      </ul>
7909    </nav>
7910    <div class='mobile-menu-utilities flex flex-col gap-md px-sm pt-accordion-paddingvertical'><div class='flex flex-col gap-sm'>
7911<a
7912            href='https://www.clinique.com/customer_authentication/redirect?locale=en&region_country=US'
7913            class='btn min-h-0'
7914            variant='secondary'
7915          >
7916<svg-icon
7917  src='icon-account'
7918  class='icon-md shrink-0'
7919
7920  
7921
7922  
7923  
7924></svg-icon>
7925
7926<span class="mobile-menu-signin-label text-body-xs font-normal text-foreground">Log In / Sign Up</span>
7927          </a>
7928        </div>
7929<a
7930    href='/pages/smart-rewards'
7931    class='w-fit text-legal font-medium mobile-menu-utility-link'
7932  >
7933    Smart Rewards
7934  </a>
7935
7936    </div>
7937  </div>
7938
7939  </extended-dialog>
7940</div>
7941
7942
7943<button
7944    type='button'
7945    data-search-trigger
7946    aria-haspopup='dialog' aria-controls='header-search-panel' aria-expanded='false'
7947    class=' flex size-7.5 items-center justify-center gap-3xs rounded-none transition-opacity hover:opacity-70 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[var(--color-focus)] aria-disabled:cursor-default aria-disabled:opacity-40'
7948  >
7949    <span class='pointer-events-none inline-flex'>
7950<svg-icon
7951  src='icon-search'
7952  class='icon-md'
7953
7954  
7955
7956  
7957  
7958></svg-icon>
7959</span>
7960    <span class='sr-only'>Search</span>
7961  </button></div>
7962
7963      <div class='shrink-0'><div id="shopify-block-AYUs3MkpKOVEzRlBMS__header-logo" class="shopify-block"><a
7964  href='/'
7965  class='
7966pt-0 
7967pb-0 
7968ps-0 
7969pe-0 flex h-fit rounded-none h6 uppercase focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[var(--color-focus)]'
7970><div
7971      class='relative flex h-full w-30 md:w-(--header-logo-width)'
7972      style='--header-logo-width: 150px'
7973    ><span class='header-logo__img header-logo__img--default flex h-full w-full'>
7974<img src="//www.clinique.com/cdn/shop/files/Clinique_Logo.png?format=webp&amp;v=1787760300&amp;width=600" alt="Clinique Laboratories, LLC" srcset="//www.clinique.com/cdn/shop/files/Clinique_Logo.png?format=webp&amp;v=1787760300&amp;width=150 150w, //www.clinique.com/cdn/shop/files/Clinique_Logo.png?format=webp&amp;v=1787760300&amp;width=225 225w, //www.clinique.com/cdn/shop/files/Clinique_Logo.png?format=webp&amp;v=1787760300&amp;width=300 300w" width="600" height="123" loading="eager" sizes="(max-width: 300px) 50vw, 150px" class="w-full block  object-contain" fetchpriority="high"></span></div></a>
7975
7976
7977</div>
7978
7979</div>
7980
7981      <div class='flex flex-1 items-center justify-end gap-2xs'><a
7982        href='https://www.clinique.com/customer_authentication/redirect?locale=en&region_country=US'
7983        class='flex shrink-0 items-center justify-center gap-2xs px-3xs transition-opacity hover:no-underline hover:opacity-70 focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[var(--color-focus)] lg:px-xs'
7984      >
7985<svg-icon
7986  src='icon-account'
7987  class='icon-md shrink-0'
7988
7989  
7990
7991  
7992  
7993></svg-icon>
7994
7995
7996<span class='sr-only'>Log in</span>
7997      </a>
7998<dialog-toggle modal-id='cart-drawer-dialog' class='inline-flex place-items-center'><a
7999      aria-haspopup='dialog' aria-controls='cart-drawer-dialog'
8000      href='/cart'
8001      class='relative flex size-7.5 shrink-0 place-items-center items-center justify-center rounded-none transition-opacity hover:opacity-70 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[var(--color-focus)]'
8002      id='cart-icon-bubble'
8003    >
8004<svg-icon
8005  src='icon-cart'
8006  class='icon-md'
8007
8008  
8009
8010  
8011  
8012></svg-icon>
8013<span class='sr-only'>Cart</span>
8014      <div class='absolute top-1.25 right-0.25 flex size-1.5 items-center justify-center text-center badge-text leading-none text-foreground empty:hidden [&:has(cart-total[aria-hidden="true"])]:hidden'>
8015  <!-- ##start:entry-lazy##component-cart-total.js##end:entry-lazy## -->
8016
8017<cart-total
8018          cloak
8019          aria-hidden='true'
8020          translation='{ "cart_count": "###count### items" }'
8021        ></cart-total>
8022      </div>
8023    </a>
8024</dialog-toggle></div>
8025    </div>
8026
8027  <!-- ##start:entry-eager##search-dropdown.ts##end:entry-eager## -->
8028
8029<search-dropdown
8030  class='contents'
8031  data-min-chars='3'
8032  data-max-trending='5'
8033  data-max-suggested='5'
8034  data-max-products='4'
8035  data-search-path='/search'
8036  data-currency='USD'
8037  data-locale='en-US'
8038  data-image-aspect='aspect-product-image'
8039  data-card-alignment='center'
8040  
8041><div
8042    class='fixed inset-x-0 top-0 z-30 h-dvh bg-(--color-overlay)'
8043    data-search-overlay
8044    hidden
8045  ></div><div
8046    id='header-search-panel'
8047    class='fixed inset-x-0 top-0 z-40 h-dvh overflow-y-auto overscroll-contain bg-background shadow-[2px_2px_15px_#0000001a] lg:h-auto lg:max-h-dvh'
8048    data-search-panel
8049    role='dialog'
8050    aria-modal='false'
8051    aria-label='Search'
8052    hidden
8053  >
8054    <div class='flex flex-col gap-sm px-pagemargin py-sm lg:gap-xl lg:py-md'><div class='flex items-center gap-md'>
8055
8056  <!-- ##start:entry-eager##search-field.ts##end:entry-eager## -->
8057
8058<form
8059  action='/search'
8060  method='get'
8061  role='search'
8062  data-form='header-search'
8063  class='w-full grow'
8064><search-field class='group/search relative flex items-center gap-2xs'>
8065    
8066
8067    
8068
8069    <button
8070      data-search-submit
8071      type='submit'
8072      class='absolute top-1/2 left-0 z-10 flex size-7.5 -translate-y-1/2 items-center justify-center rounded-none align-middle'
8073    >
8074      
8075<svg-icon
8076  src='icon-search'
8077  class='icon-md'
8078
8079  
8080
8081  
8082  
8083></svg-icon>
8084
8085      <span class='sr-only'>Search</span>
8086    </button>
8087<div class="w-full [&_[data-slot=input]]:font-normal [&_[data-slot=input]]:pl-8.5 group">
8088        <div
8089          class="relative w-full group"
8090          
8091        ><label for="header-search" class="sr-only">Search</label><input
8092            class="text-body-md flex items-center self-stretch w-full gap-2xs appearance-none h-(--spacing-forms-height) py-3xs px-(--spacing-forms-padding) rounded-(--radius-forms-radius) border-[length:var(--spacing-forms-borderwidth)] border-solid text-(--color-forms-text) bg-(--color-forms-background) border-(--color-forms-border) disabled:text-(--color-forms-text-disabled) disabled:border-(--color-forms-border-disabled) hover:border-(--color-forms-border-hover) focus:border-(--color-forms-border-hover) focus:outline-hidden focu
8092s:ring-0 group-[[error]]:ring-danger group-[[error]]:border-[transparent] group-[[error]]:ring-[length:var(--spacing-forms-borderwidth-error)] group-[[error]]:focus:ring-[length:var(--spacing-forms-borderwidth-error)] read-only:bg-background-secondary"
8093            
8094              placeholder="Search"
8095            
8096            type="search"
8097            id="header-search"
8098            name="q"
8099            data-slot='input'
8100            
8101              value=""
8102            
8103
8104            
8105
8106            
8107
8108            
8109
8110            
8111
8112            
8113              autocomplete="off"
8114            
8115
8116            
8117
8118            
8119
8120            
8121
8122            
8123role='combobox'
8124        aria-expanded='false'
8125        aria-controls='header-search-panel'
8126        aria-haspopup='listbox'
8127        aria-autocomplete='list'autocorrect='off'
8128      autocomplete='off'
8129      autocapitalize='off'
8130      spellcheck='false'
8131    
8132          /></div></div>
8133<button
8134      type='button'
8135      class='absolute top-1/2 right-2xs z-10 -translate-y-1/2 overflow-hidden p-3xs font-normal group-has-[input:placeholder-shown]/search:hidden'
8136      data-search-clear
8137    >
8138      <span class='btn' variant='tertiary'>Clear</span>
8139    </button>
8140  </search-field><input type='hidden' name='type' value='product'>
8141  <input type='hidden' name='options[prefix]' value='last'>
8142</form>
8143<button
8144          type='button'
8145          class='
8146            touch-target flex size-icon-md shrink-0 items-center justify-end rounded-none transition-opacity
8147            hover:opacity-70 focus-visible:outline-2
8148            focus-visible:outline-offset-2 focus-visible:outline-[var(--color-focus)]
8149          '
8150          data-search-close
8151          aria-label='Close'
8152        >
8153<svg-icon
8154  src='icon-close'
8155  class='icon-md'
8156
8157  
8158
8159  
8160  
8161></svg-icon>
8162</button>
8163      </div><p
8164        class='body-md font-normal'
8165        data-search-no-results
8166        data-no-results-template='No results found for “{{ term }}”.'
8167        hidden
8168      ></p><div class='flex flex-col gap-lg lg:flex-row lg:gap-xl' data-search-state='empty'>
8169        <section class='lg:w-[200px] lg:shrink-0' data-tray='trending' hidden>
8170          <h2 class='body-lg lg:body-sm !font-normal uppercase'>Trending terms</h2>
8171          <ul
8172            class='mt-sm flex flex-col gap-xs'
8173            role='listbox'
8174            aria-label='Trending terms'
8175            data-list='trending'
8176          ></ul>
8177        </section>
8178
8179        <section class='lg:min-w-0 lg:flex-1' data-tray='best-sellers' hidden>
8180          <h2 class='body-lg lg:body-sm !font-normal uppercase mb-sm'>Bestselling products</h2>
8181          <div
8182            class='flex flex-col gap-0 lg:grid lg:grid-cols-4 lg:items-stretch lg:gap-1.25'
8183            data-grid='best-sellers'
8184          ></div>
8185        </section>
8186      </div><div class='flex flex-col gap-lg lg:flex-row lg:gap-xl' data-search-state='typed' hidden>
8187        <section class='lg:w-[200px] lg:shrink-0' data-tray='suggested' hidden>
8188          <h2 class='body-lg lg:body-sm !font-normal uppercase'>Suggested searches</h2>
8189          <ul
8190            class='mt-sm flex flex-col gap-xs'
8191            role='listbox'
8192            aria-label='Suggested searches'
8193            data-list='suggested'
8194          ></ul>
8195        </section>
8196
8197        <section class='lg:min-w-0 lg:flex-1' data-tray='top-results'>
8198          <div class='flex items-center justify-between gap-sm lg:mb-sm lg:items-start'>
8199            <h2 class='body-lg lg:body-sm !font-normal uppercase'>Top results</h2>
8200            <a
8201              class='btn h-6.25 min-h-0 font-normal lg:h-8.75'
8202              data-view-all
8203              variant='secondary'
8204              href='/search'
8205            >
8206              View all
8207            </a>
8208          </div>
8209          <div
8210            class='flex flex-col gap-0 lg:grid lg:grid-cols-4 lg:items-stretch lg:gap-1.25'
8211            data-grid='top-results'
8212          ></div>
8213        </section>
8214      </div>
8215
8216      <p class='body-xs text-foreground-secondary' data-search-unavailable hidden>
8217        Search is currently unavailable. Press enter to see all results.
8218      </p>
8219
8220      <span
8221        class='sr-only'
8222        role='status'
8223        aria-live='polite'
8224        data-search-status
8225        data-count-template='{{ count }} results'
8226      ></span>
8227    </div>
8228  </div>
8229</search-dropdown>
8230</header>
8231
8232
8233</div>
8234<!-- END sections: header-group --></main-header>
8235
8236        <main
8237          id='main'
8238          class='content-for-layout focus-none grid grid-cols-1'
8239          role='main'
8240          tabindex='-1'
8241        >
8242          <div id="shopify-section-template--27364770087107__cart-header" class="shopify-section">
8243<div class='flex flex-col items-center justify-center gap-sm px-pagemargin py-xl lg:py-2xl 2xl:container'>
8244    <div class='flex flex-col items-center justify-center gap-2xs'>
8245      <h2 class='text-heading-5'>Your cart is currently empty.</h2>
8246      <p>We can help you with that.</p>
8247    </div>
8248    <a class='btn' variant='primary' href=''>Continue shopping</a>
8249  </div>
8250</div><div id="shopify-section-template--27364770087107__cart-body" class="shopify-section">
8251
8252</div>
8253        </main>
8254
8255        <footer id='main-footer'><!-- BEGIN sections: footer-group -->
8256<div id="shopify-section-sections--27364774183107__main" class="shopify-section shopify-section-group-footer-group">
8257<div
8258  class='relative isolate overflow-hidden 
8259
8260color-scheme-1 bg-background text-foreground
8261'
8262  
8263><div
8264    class='relative z-[2] grid w-full grid-cols-1 gap-y-2xl px-pagemargin py-lg '
8265    
8266  >
8267    <div class='grid w-full gap-y-2xl'>
8268
8269
8270
8271
8272
8273
8274<div
8275    class='flex [&>*]:min-w-0 flex-col md:flex-row    w-full     text-center color-scheme-1 bg-background text-foreground justify-between items-start pt-0 pb-0 ps-0 pe-0       relative   gap-xs md:gap-xl'
8276    
8277    
8278    style='
8279      
8280 --group-inline-align: center;
8281    '
8282  >
8283    
8284
8285
8286
8287
8288
8289
8290<div
8291    class='flex [&>*]:min-w-0 flex-col md:flex-row    w-full     text-start  justify-start items-center pt-0 pb-0 ps-0 pe-0       relative   gap-xs md:gap-xs'
8292    
8293    
8294    style='
8295      
8296 --group-inline-align: start;
8297    '
8298  >
8299    <div class='accordion-menu-block w-full min-w-0' ><div
8300      class='hidden w-full md:block'>
8301      <nav aria-label='Menu' class='overflow-x-auto md:w-full'>
8302        <div
8303          class='justify-content-start grid w-full min-w-0 items-start justify-items-start gap-x-2xl'
8304          style='grid-template-columns: repeat(auto-fit, minmax(min(100%, 145px), max-content));'
8305        ><div class='max-w-full min-w-0'><h3 class='mb-sm max-w-full text-footer-accordion-label text-[inherit] md:break-words'>
8306                  Shopping
8307                </h3>
8308                <ul class='flex flex-col gap-xs' role='list'><li>
8309                      <a class='text-[inherit] max-md:text-body-xs md:text-body-xs-standard max-md:whitespace-nowrap md:whitespace-normal md:break-words md:hover:underline underline-offset-2
8310focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[color:var(--color-focus)]
8311' href='/pages/offers'>Offers</a>
8312                    </li><li>
8313                      <a class='text-[inherit] max-md:text-body-xs md:text-body-xs-standard max-md:whitespace-nowrap md:whitespace-normal md:break-words md:hover:underline underline-offset-2
8314focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[color:var(--color-focus)]
8315' href='/pages/smart-rewards'>Smart Rewards Loyalty</a>
8316                    </li><li>
8317                      <a class='text-[inherit] max-md:text-body-xs md:text-body-xs-standard max-md:whitespace-nowrap md:whitespace-normal md:break-words md:hover:underline underline-offset-2
8318focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[color:var(--color-focus)]
8319' href='/products/clinique-egift-card'>eGift Cards</a>
8320                    </li><li>
8321                      <a class='text-[inherit] max-md:text-body-xs md:text-body-xs-standard max-md:whitespace-nowrap md:whitespace-normal md:break-words md:hover:underline underline-offset-2
8322focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[color:var(--color-focus)]
8323' href='/pages/store-locator'>Store Locator</a>
8324                    </li><li>
8325                      <a class='text-[inherit] max-md:text-body-xs md:text-body-xs-standard max-md:whitespace-nowrap md:whitespace-normal md:break-words md:hover:underline underline-offset-2
8326focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[color:var(--color-focus)]
8327' href='/pages/medical-professionals'>Medical Community</a>
8328                    </li><li>
8329                      <a class='text-[inherit] max-md:text-body-xs md:text-body-xs-standard max-md:whitespace-nowrap md:whitespace-normal md:break-words md:hover:underline underline-offset-2
8330focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[color:var(--color-focus)]
8331' href='/pages/discontinued-products'>Discontinued Products</a>
8332                    </li></ul></div><div class='max-w-full min-w-0'><h3 class='mb-sm max-w-full text-footer-accordion-label text-[inherit] md:break-words'>
8333                  About Brand
8334                </h3>
8335                <ul class='flex flex-col gap-xs' role='list'><li>
8336                      <a class='text-[inherit] max-md:text-body-xs md:text-body-xs-standard max-md:whitespace-nowrap md:whitespace-normal md:break-words md:hover:underline underline-offset-2
8337focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[color:var(--color-focus)]
8338' href='/pages/our-philosophy'>Clinique Philosopy</a>
8339                    </li><li>
8340                      <a class='text-[inherit] max-md:text-body-xs md:text-body-xs-standard max-md:whitespace-nowrap md:whitespace-normal md:break-words md:hover:underline underline-offset-2
8341focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[color:var(--color-focus)]
8342' href='/pages/eye-safety'>Eye Safety</a>
8343                    </li><li>
8344                      <a class='text-[inherit] max-md:text-body-xs md:text-body-xs-standard max-md:whitespace-nowrap md:whitespace-normal md:break-words md:hover:underline underline-offset-2
8345focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[color:var(--color-focus)]
8346' href='/pages/sustainability-responsible-packaging'>Sustainability</a>
8347                    </li><li>
8348                      <a class='text-[inherit] max-md:text-body-xs md:text-body-xs-standard max-md:whitespace-nowrap md:whitespace-normal md:break-words md:hover:underline underline-offset-2
8349focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[color:var(--color-focus)]
8350' href='/pages/ingredients'>Ingredients</a>
8351                    </li><li>
8352                      <a class='text-[inherit] max-md:text-body-xs md:text-body-xs-standard max-md:whitespace-nowrap md:whitespace-normal md:break-words md:hover:underline underline-offset-2
8353focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[color:var(--color-focus)]
8354' href='/pages/services'>Skin Services</a>
8355                    </li><li>
8356                      <a class='text-[inherit] max-md:text-body-xs md:text-body-xs-standard max-md:whitespace-nowrap md:whitespace-normal md:break-words md:hover:underline underline-offset-2
8357focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[color:var(--color-focus)]
8358' href='https://www.elcompanies.com/en/our-brands/clinique'>Corporate Info</a>
8359                    </li></ul></div><div class='max-w-full min-w-0'><h3 class='mb-sm max-w-full text-footer-accordion-label text-[inherit] md:break-words'>
8360                  Need Help?
8361                </h3>
8362                <ul class='flex flex-col gap-xs' role='list'><li>
8363                      <a class='text-[inherit] max-md:text-body-xs md:text-body-xs-standard max-md:whitespace-nowrap md:whitespace-normal md:break-words md:hover:underline underline-offset-2
8364focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[color:var(--color-focus)]
8365' href='https://shopify.com/73815621771/account/orders'>Track My Order</a>
8366                    </li><li>
8367                      <a class='text-[inherit] max-md:text-body-xs md:text-body-xs-standard max-md:whitespace-nowrap md:whitespace-normal md:break-words md:hover:underline underline-offset-2
8368focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[color:var(--color-focus)]
8369' href='/pages/parcellab-returns-clinique-en'>Start a Return</a>
8370                    </li><li>
8371                      <a class='text-[inherit] max-md:text-body-xs md:text-body-xs-standard max-md:whitespace-nowrap md:whitespace-normal md:break-words md:hover:underline underline-offset-2
8372focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[color:var(--color-focus)]
8373' href='/policies/refund-policy'>Returns &amp; Exchanges</a>
8374                    </li><li>
8375                      <a class='text-[inherit] max-md:text-body-xs md:text-body-xs-standard max-md:whitespace-nowrap md:whitespace-normal md:break-words md:hover:underline underline-offset-2
8376focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[color:var(--color-focus)]
8377' href='/policies/shipping-policy'>Shipping</a>
8378                    </li><li>
8379                      <a class='text-[inherit] max-md:text-body-xs md:text-body-xs-standard max-md:whitespace-nowrap md:whitespace-normal md:break-words md:hover:underline underline-offset-2
8380focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[color:var(--color-focus)]
8381' href='https://shopify.com/73815621771/account'>Account Sign-up/Login</a>
8382                    </li><li>
8383                      <a class='text-[inherit] max-md:text-body-xs md:text-body-xs-standard max-md:whitespace-nowrap md:whitespace-normal md:break-words md:hover:underline underline-offset-2
8384focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[color:var(--color-focus)]
8385' href='/pages/order-faqs'>FAQ</a>
8386                    </li><li>
8387                      <a class='text-[inherit] max-md:text-body-xs md:text-body-xs-standard max-md:whitespace-nowrap md:whitespace-normal md:break-words md:hover:underline underline-offset-2
8388focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[color:var(--color-focus)]
8389' href='/pages/contact-us'>Live Chat with Customer Services</a>
8390                    </li><li>
8391                      <a class='text-[inherit] max-md:text-body-xs md:text-body-xs-standard max-md:whitespace-nowrap md:whitespace-normal md:break-words md:hover:underline underline-offset-2
8392focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[color:var(--color-focus)]
8393' href='tel:+18004194041'>1-800-419-4041</a>
8394                    </li></ul></div><div class='max-w-full min-w-0'><h3 class='mb-sm max-w-full text-footer-accordion-label text-[inherit] md:break-words'>
8395                  Privacy And Terms
8396                </h3>
8397                <ul class='flex flex-col gap-xs' role='list'><li>
8398                      <a class='text-[inherit] max-md:text-body-xs md:text-body-xs-standard max-md:whitespace-nowrap md:whitespace-normal md:break-words md:hover:underline underline-offset-2
8399focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[color:var(--color-focus)]
8400' href='/policies/privacy-policy'>Privacy Policy</a>
8401                    </li><li>
8402                      <a class='text-[inherit] max-md:text-body-xs md:text-body-xs-standard max-md:whitespace-nowrap md:whitespace-normal md:break-words md:hover:underline underline-offset-2
8403focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[color:var(--color-focus)]
8404' href='#privacy-choices'>Do Not Sell or Share My Personal Information / Targeted Ads</a>
8405                    </li><li>
8406                      <a class='text-[inherit] max-md:text-body-xs md:text-body-xs-standard max-md:whitespace-nowrap md:whitespace-normal md:break-words md:hover:underline underline-offset-2
8407focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[color:var(--color-focus)]
8408' href='https://privacyportal.onetrust.com/webform/84bcbfa6-9d87-4573-b6f8-acfb1a7839a8/51605180-d44a-45d9-bf11-2ae9c0b07028?source=footer'>Limit Use of My Sensitive Personal Information</a>
8409                    </li><li>
8410                      <a class='text-[inherit] max-md:text-body-xs md:text-body-xs-standard max-md:whitespace-nowrap md:whitespace-normal md:break-words md:hover:underline underline-offset-2
8411focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[color:var(--color-focus)]
8412' href='/policies/terms-of-service'>Terms &amp; Conditions</a>
8413                    </li><li>
8414                      <a class='text-[inherit] max-md:text-body-xs md:text-body-xs-standard max-md:whitespace-nowrap md:whitespace-normal md:break-words md:hover:underline underline-offset-2
8415focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[color:var(--color-focus)]
8416' href='/pages/supplier-relations'>Supplier Relations</a>
8417                    </li><li>
8418                      <a class='text-[inherit] max-md:text-body-xs md:text-body-xs-standard max-md:whitespace-nowrap md:whitespace-normal md:break-words md:hover:underline underline-offset-2
8419focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[color:var(--color-focus)]
8420' href='/pages/clinique-accessibility-statement'>Accessibility</a>
8421                    </li><li>
8422                      <a class='text-[inherit] max-md:text-body-xs md:text-body-xs-standard max-md:whitespace-nowrap md:whitespace-normal md:break-words md:hover:underline underline-offset-2
8423focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[color:var(--color-focus)]
8424' href='/pages/consumer-health-data-privacy-statement'>Consumer Health Data Privacy Statement</a>
8425                    </li></ul></div></div>
8426      </nav>
8427    </div><nav class='md:hidden' aria-label='Menu'>
8428  <!-- ##start:entry-lazy##core/core-accordion.ts##end:entry-lazy## -->
8429
8430<custom-accordion
8431  class='group block w-full border-solid border-accordion-border [&[expanded]]:border-accordion-border-active border-b max-md:px-0 max-md:py-accordion-paddingvertical md:py-sm'
8432  
8433  
8434>
8435  <button
8436    type='button'
8437    aria-expanded='false'
8438    aria-controls='Details-AQUp5c0ZEczJxTTNwV__accordion_menu_9xt6kr-1'
8439    data-accordion-toggle
8440    class='flex w-full min-w-0 items-center justify-between gap-xs p outline-none focus-visible:ring-2 focus-visible:ring-focus focus-visible:ring-offset-2 max-md:p-0 focus-visible:ring-offset-background text-inherit'
8441  >
8442    <span class='min-w-0 flex-1 text-start text-footer-accordion-label text-[inherit]'>Shopping</span>
8443    <span class='flex shrink-0 items-center' aria-hidden='true'>
8444<svg-icon
8445  src='icon-plus'
8446  class='shrink-0 group-has-[[data-open]]:hidden'
8447
8448  
8449
8450  
8451  
8452></svg-icon>
8453
8454<svg-icon
8455  src='icon-minus'
8456  class='shrink-0 group-has-[[data-open]]:block hidden'
8457
8458  
8459
8460  
8461  
8462></svg-icon>
8463</span>
8464  </button>
8465  <div
8466    id='Details-AQUp5c0ZEczJxTTNwV__accordion_menu_9xt6kr-1'
8467    class=' invisible grid grid-rows-[0fr] max-md:px-0 text-inherit transition-[visibility,grid-template-rows] duration-300 [overflow-anchor:none] group-has-[[data-open]]:visible group-has-[[data-open]]:grid-rows-[1fr]'
8468    data-accordion-content
8469    
8470  >
8471    <div class='overflow-hidden'>
8472      <div class='pt-xs [&_*:last-child]:mb-0'>
8473        
8474          <ul class='flex flex-col gap-xs' role='list'><li>
8475                  <a class='text-[inherit] max-md:text-body-xs md:text-body-xs-standard max-md:whitespace-nowrap md:whitespace-normal md:break-words md:hover:underline underline-offset-2
8476focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[color:var(--color-focus)]
8477' href='/pages/offers'>Offers</a>
8478                </li><li>
8479                  <a class='text-[inherit] max-md:text-body-xs md:text-body-xs-standard max-md:whitespace-nowrap md:whitespace-normal md:break-words md:hover:underline underline-offset-2
8480focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[color:var(--color-focus)]
8481' href='/pages/smart-rewards'>Smart Rewards Loyalty</a>
8482                </li><li>
8483                  <a class='text-[inherit] max-md:text-body-xs md:text-body-xs-standard max-md:whitespace-nowrap md:whitespace-normal md:break-words md:hover:underline underline-offset-2
8484focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[color:var(--color-focus)]
8485' href='/products/clinique-egift-card'>eGift Cards</a>
8486                </li><li>
8487                  <a class='text-[inherit] max-md:text-body-xs md:text-body-xs-standard max-md:whitespace-nowrap md:whitespace-normal md:break-words md:hover:underline underline-offset-2
8488focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[color:var(--color-focus)]
8489' href='/pages/store-locator'>Store Locator</a>
8490                </li><li>
8491                  <a class='text-[inherit] max-md:text-body-xs md:text-body-xs-standard max-md:whitespace-nowrap md:whitespace-normal md:break-words md:hover:underline underline-offset-2
8492focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[color:var(--color-focus)]
8493' href='/pages/medical-professionals'>Medical Community</a>
8494                </li><li>
8495                  <a class='text-[inherit] max-md:text-body-xs md:text-body-xs-standard max-md:whitespace-nowrap md:whitespace-normal md:break-words md:hover:underline underline-offset-2
8496focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[color:var(--color-focus)]
8497' href='/pages/discontinued-products'>Discontinued Products</a>
8498                </li></ul>
8499        
8500      </div>
8501    </div>
8502  </div>
8503</custom-accordion>
8504
8505  <!-- ##start:entry-lazy##core/core-accordion.ts##end:entry-lazy## -->
8506
8507<custom-accordion
8508  class='group block w-full border-solid border-accordion-border [&[expanded]]:border-accordion-border-active border-b max-md:px-0 max-md:py-accordion-paddingvertical md:py-sm'
8509  
8510  
8511>
8512  <button
8513    type='button'
8514    aria-expanded='false'
8515    aria-controls='Details-AQUp5c0ZEczJxTTNwV__accordion_menu_9xt6kr-2'
8516    data-accordion-toggle
8517    class='flex w-full min-w-0 items-center justify-between gap-xs p outline-none focus-visible:ring-2 focus-visible:ring-focus focus-visible:ring-offset-2 max-md:p-0 focus-visible:ring-offset-background text-inherit'
8518  >
8519    <span class='min-w-0 flex-1 text-start text-footer-accordion-label text-[inherit]'>About Brand</span>
8520    <span class='flex shrink-0 items-center' aria-hidden='true'>
8521<svg-icon
8522  src='icon-plus'
8523  class='shrink-0 group-has-[[data-open]]:hidden'
8524
8525  
8526
8527  
8528  
8529></svg-icon>
8530
8531<svg-icon
8532  src='icon-minus'
8533  class='shrink-0 group-has-[[data-open]]:block hidden'
8534
8535  
8536
8537  
8538  
8539></svg-icon>
8540</span>
8541  </button>
8542  <div
8543    id='Details-AQUp5c0ZEczJxTTNwV__accordion_menu_9xt6kr-2'
8544    class=' invisible grid grid-rows-[0fr] max-md:px-0 text-inherit transition-[visibility,grid-template-rows] duration-300 [overflow-anchor:none] group-has-[[data-open]]:visible group-has-[[data-open]]:gri
8544d-rows-[1fr]'
8545    data-accordion-content
8546    
8547  >
8548    <div class='overflow-hidden'>
8549      <div class='pt-xs [&_*:last-child]:mb-0'>
8550        
8551          <ul class='flex flex-col gap-xs' role='list'><li>
8552                  <a class='text-[inherit] max-md:text-body-xs md:text-body-xs-standard max-md:whitespace-nowrap md:whitespace-normal md:break-words md:hover:underline underline-offset-2
8553focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[color:var(--color-focus)]
8554' href='/pages/our-philosophy'>Clinique Philosopy</a>
8555                </li><li>
8556                  <a class='text-[inherit] max-md:text-body-xs md:text-body-xs-standard max-md:whitespace-nowrap md:whitespace-normal md:break-words md:hover:underline underline-offset-2
8557focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[color:var(--color-focus)]
8558' href='/pages/eye-safety'>Eye Safety</a>
8559                </li><li>
8560                  <a class='text-[inherit] max-md:text-body-xs md:text-body-xs-standard max-md:whitespace-nowrap md:whitespace-normal md:break-words md:hover:underline underline-offset-2
8561focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[color:var(--color-focus)]
8562' href='/pages/sustainability-responsible-packaging'>Sustainability</a>
8563                </li><li>
8564                  <a class='text-[inherit] max-md:text-body-xs md:text-body-xs-standard max-md:whitespace-nowrap md:whitespace-normal md:break-words md:hover:underline underline-offset-2
8565focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[color:var(--color-focus)]
8566' href='/pages/ingredients'>Ingredients</a>
8567                </li><li>
8568                  <a class='text-[inherit] max-md:text-body-xs md:text-body-xs-standard max-md:whitespace-nowrap md:whitespace-normal md:break-words md:hover:underline underline-offset-2
8569focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[color:var(--color-focus)]
8570' href='/pages/services'>Skin Services</a>
8571                </li><li>
8572                  <a class='text-[inherit] max-md:text-body-xs md:text-body-xs-standard max-md:whitespace-nowrap md:whitespace-normal md:break-words md:hover:underline underline-offset-2
8573focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[color:var(--color-focus)]
8574' href='https://www.elcompanies.com/en/our-brands/clinique'>Corporate Info</a>
8575                </li></ul>
8576        
8577      </div>
8578    </div>
8579  </div>
8580</custom-accordion>
8581
8582  <!-- ##start:entry-lazy##core/core-accordion.ts##end:entry-lazy## -->
8583
8584<custom-accordion
8585  class='group block w-full border-solid border-accordion-border [&[expanded]]:border-accordion-border-active border-b max-md:px-0 max-md:py-accordion-paddingvertical md:py-sm'
8586  
8587  
8588>
8589  <button
8590    type='button'
8591    aria-expanded='false'
8592    aria-controls='Details-AQUp5c0ZEczJxTTNwV__accordion_menu_9xt6kr-3'
8593    data-accordion-toggle
8594    class='flex w-full min-w-0 items-center justify-between gap-xs p outline-none focus-visible:ring-2 focus-visible:ring-focus focus-visible:ring-offset-2 max-md:p-0 focus-visible:ring-offset-background text-inherit'
8595  >
8596    <span class='min-w-0 flex-1 text-start text-footer-accordion-label text-[inherit]'>Need Help?</span>
8597    <span class='flex shrink-0 items-center' aria-hidden='true'>
8598<svg-icon
8599  src='icon-plus'
8600  class='shrink-0 group-has-[[data-open]]:hidden'
8601
8602  
8603
8604  
8605  
8606></svg-icon>
8607
8608<svg-icon
8609  src='icon-minus'
8610  class='shrink-0 group-has-[[data-open]]:block hidden'
8611
8612  
8613
8614  
8615  
8616></svg-icon>
8617</span>
8618  </button>
8619  <div
8620    id='Details-AQUp5c0ZEczJxTTNwV__accordion_menu_9xt6kr-3'
8621    class=' invisible grid grid-rows-[0fr] max-md:px-0 text-inherit transition-[visibility,grid-template-rows] duration-300 [overflow-anchor:none] group-has-[[data-open]]:visible group-has-[[data-open]]:grid-rows-[1fr]'
8622    data-accordion-content
8623    
8624  >
8625    <div class='overflow-hidden'>
8626      <div class='pt-xs [&_*:last-child]:mb-0'>
8627        
8628          <ul class='flex flex-col gap-xs' role='list'><li>
8629                  <a class='text-[inherit] max-md:text-body-xs md:text-body-xs-standard max-md:whitespace-nowrap md:whitespace-normal md:break-words md:hover:underline underline-offset-2
8630focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[color:var(--color-focus)]
8631' href='https://shopify.com/73815621771/account/orders'>Track My Order</a>
8632                </li><li>
8633                  <a class='text-[inherit] max-md:text-body-xs md:text-body-xs-standard max-md:whitespace-nowrap md:whitespace-normal md:break-words md:hover:underline underline-offset-2
8634focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[color:var(--color-focus)]
8635' href='/pages/parcellab-returns-clinique-en'>Start a Return</a>
8636                </li><li>
8637                  <a class='text-[inherit] max-md:text-body-xs md:text-body-xs-standard max-md:whitespace-nowrap md:whitespace-normal md:break-words md:hover:underline underline-offset-2
8638focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[color:var(--color-focus)]
8639' href='/policies/refund-policy'>Returns &amp; Exchanges</a>
8640                </li><li>
8641                  <a class='text-[inherit] max-md:text-body-xs md:text-body-xs-standard max-md:whitespace-nowrap md:whitespace-normal md:break-words md:hover:underline underline-offset-2
8642focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[color:var(--color-focus)]
8643' href='/policies/shipping-policy'>Shipping</a>
8644                </li><li>
8645                  <a class='text-[inherit] max-md:text-body-xs md:text-body-xs-standard max-md:whitespace-nowrap md:whitespace-normal md:break-words md:hover:underline underline-offset-2
8646focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[color:var(--color-focus)]
8647' href='https://shopify.com/73815621771/account'>Account Sign-up/Login</a>
8648                </li><li>
8649                  <a class='text-[inherit] max-md:text-body-xs md:text-body-xs-standard max-md:whitespace-nowrap md:whitespace-normal md:break-words md:hover:underline underline-offset-2
8650focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[color:var(--color-focus)]
8651' href='/pages/order-faqs'>FAQ</a>
8652                </li><li>
8653                  <a class='text-[inherit] max-md:text-body-xs md:text-body-xs-standard max-md:whitespace-nowrap md:whitespace-normal md:break-words md:hover:underline underline-offset-2
8654focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[color:var(--color-focus)]
8655' href='/pages/contact-us'>Live Chat with Customer Services</a>
8656                </li><li>
8657                  <a class='text-[inherit] max-md:text-body-xs md:text-body-xs-standard max-md:whitespace-nowrap md:whitespace-normal md:break-words md:hover:underline underline-offset-2
8658focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[color:var(--color-focus)]
8659' href='tel:+18004194041'>1-800-419-4041</a>
8660                </li></ul>
8661        
8662      </div>
8663    </div>
8664  </div>
8665</custom-accordion>
8666
8667  <!-- ##start:entry-lazy##core/core-accordion.ts##end:entry-lazy## -->
8668
8669<custom-accordion
8670  class='group block w-full border-solid border-accordion-border [&[expanded]]:border-accordion-border-active border-b max-md:px-0 max-md:py-accordion-paddingvertical md:py-sm'
8671  
8672  
8673>
8674  <button
8675    type='button'
8676    aria-expanded='false'
8677    aria-controls='Details-AQUp5c0ZEczJxTTNwV__accordion_menu_9xt6kr-4'
8678    data-accordion-toggle
8679    class='flex w-full min-w-0 items-center justify-between gap-xs p outline-none focus-visible:ring-2 focus-visible:ring-focus focus-visible:ring-offset-2 max-md:p-0 focus-visible:ring-offset-background text-inherit'
8680  >
8681    <span class='min-w-0 flex-1 text-start text-footer-accordion-label text-[inherit]'>Privacy And Terms</span>
8682    <span class='flex shrink-0 items-center' aria-hidden='true'>
8683<svg-icon
8684  src='icon-plus'
8685  class='shrink-0 group-has-[[data-open]]:hidden'
8686
8687  
8688
8689  
8690  
8691></svg-icon>
8692
8693<svg-icon
8694  src='icon-minus'
8695  class='shrink-0 group-has-[[data-open]]:block hidden'
8696
8697  
8698
8699  
8700  
8701></svg-icon>
8702</span>
8703  </button>
8704  <div
8705    id='Details-AQUp5c0ZEczJxTTNwV__accordion_menu_9xt6kr-4'
8706    class=' invisible grid grid-rows-[0fr] max-md:px-0 text-inherit transition-[visibility,grid-template-rows] duration-300 [overflow-anchor:none] group-has-[[data-open]]:visible group-has-[[data-open]]:grid-rows-[1fr]'
8707    data-accordion-content
8708    
8709  >
8710    <div class='overflow-hidden'>
8711      <div class='pt-xs [&_*:last-child]:mb-0'>
8712        
8713          <ul class='flex flex-col gap-xs' role='list'><li>
8714                  <a class='text-[inherit] max-md:text-body-xs md:text-body-xs-standard max-md:whitespace-nowrap md:whitespace-normal md:break-words md:hover:underline underline-offset-2
8715focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[color:var(--color-focus)]
8716' href='/policies/privacy-policy'>Privacy Policy</a>
8717                </li><li>
8718                  <a class='text-[inherit] max-md:text-body-xs md:text-body-xs-standard max-md:whitespace-nowrap md:whitespace-normal md:break-words md:hover:underline underline-offset-2
8719focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[color:var(--color-focus)]
8720' href='#privacy-choices'>Do Not Sell or Share My Personal Information / Targeted Ads</a>
8721                </li><li>
8722                  <a class='text-[inherit] max-md:text-body-xs md:text-body-xs-standard max-md:whitespace-nowrap md:whitespace-normal md:break-words md:hover:underline underline-offset-2
8723focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[color:var(--color-focus)]
8724' href='https://privacyportal.onetrust.com/webform/84bcbfa6-9d87-4573-b6f8-acfb1a7839a8/51605180-d44a-45d9-bf11-2ae9c0b07028?source=footer'>Limit Use of My Sensitive Personal Information</a>
8725                </li><li>
8726                  <a class='text-[inherit] max-md:text-body-xs md:text-body-xs-standard max-md:whitespace-nowrap md:whitespace-normal md:break-words md:hover:underline underline-offset-2
8727focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[color:var(--color-focus)]
8728' href='/policies/terms-of-service'>Terms &amp; Conditions</a>
8729                </li><li>
8730                  <a class='text-[inherit] max-md:text-body-xs md:text-body-xs-standard max-md:whitespace-nowrap md:whitespace-normal md:break-words md:hover:underline underline-offset-2
8731focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[color:var(--color-focus)]
8732' href='/pages/supplier-relations'>Supplier Relations</a>
8733                </li><li>
8734                  <a class='text-[inherit] max-md:text-body-xs md:text-body-xs-standard max-md:whitespace-nowrap md:whitespace-normal md:break-words md:hover:underline underline-offset-2
8735focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[color:var(--color-focus)]
8736' href='/pages/clinique-accessibility-statement'>Accessibility</a>
8737                </li><li>
8738                  <a class='text-[inherit] max-md:text-body-xs md:text-body-xs-standard max-md:whitespace-nowrap md:whitespace-normal md:break-words md:hover:underline underline-offset-2
8739focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[color:var(--color-focus)]
8740' href='/pages/consumer-health-data-privacy-statement'>Consumer Health Data Privacy Statement</a>
8741                </li></ul>
8742        
8743      </div>
8744    </div>
8745  </div>
8746</custom-accordion>
8747</nav>
8748  </div>
8749
8750  </div>
8751
8752
8753
8754
8755
8756
8757
8758
8759<div
8760    class='flex [&>*]:min-w-0 flex-col    w-(--core-section-mobile-width-percentage) md:w-(--core-section-width-percentage)                   text-start color-scheme-1 bg-background text-foreground items-start justify-center pt-md pb-0 ps-0 pe-0 md:pt-0 md:pb-0 md:ps-0 md:pe-0       relative   gap-xs md:gap-xs'
8761    
8762    
8763    style='
8764      
8765        --core-section-width-percentage: 45%;
8766        --core-section-mobile-width-percentage: 100%;
8767      
8768 --group-inline-align: start;
8769    '
8770  >
8771    
8772  <!-- ##start:entry-eager##alert-banner.ts,footer-opt-in-form.ts##end:entry-eager## -->
8773
8774<style>
8775    #AQ0R4eWVvR3ZYZ1hDW__footer_opt_in_UEVXLJ {--footer-opt-in-width: 100%;}
8776
8777    /* Required asterisk — Figma float-label; color from Critical/Danger inverse token */
8778    #AQ0R4eWVvR3ZYZ1hDW__footer_opt_in_UEVXLJ footer-opt-in-form input[required] ~ label::after {
8779      content: '*';
8780      color: var(--color-critical-inverse);
8781      margin-inline-start: var(--spacing-3xs);
8782    }
8783
8784    @media (min-width: 768px) {
8785      #AQ0R4eWVvR3ZYZ1hDW__footer_opt_in_UEVXLJ {--footer-opt-in-width: 100%;max-width: 360px;}
8786    }
8787  </style>
8788
8789  <div
8790    id='AQ0R4eWVvR3ZYZ1hDW__footer_opt_in_UEVXLJ'
8791    class='grid w-(--footer-opt-in-width) grid-cols-1 gap-xs'
8792    
8793  ><div class='email-signup-header grid grid-cols-1 gap-2xs'>
8794        
8795<div
8796  class='body-sm   [&_h1]:[font:inherit] [&_h1]:text-inherit [&_h1]:[text-transform:inherit] [&_h2]:[font:inherit] [&_h2]:text-inherit [&_h2]:[text-transform:inherit] [&_h3]:[font:inherit] [&_h3]:text-inherit [&_h3]:[text-transform:inherit] [&_h4]:[font:inherit] [&_h4]:text-inherit [&_h4]:[text-transform:inherit] [&_h5]:[font:inherit] [&_h5]:text-inherit [&_h5]:[text-transform:inherit] [&_h6]:[font:inherit] [&_h6]:text-inherit [&_h6]:[text-transform:inherit] [&_p]:[font:inherit] [&_p]:text-inherit [&_p]:[text-transform:inherit] text-block w-full'
8797  id='AdGhqdmd1ejFtMUp0W__core_heading_zM8Urh'
8798  
8799><p>Get access to Clinique news and exclusive deals.</p></div>
8800
8801
8802<div
8803  class='body-sm  pt-0 pb-0 ps-0 pe-0 [&_h1]:[font:inherit] [&_h1]:text-inherit [&_h1]:[text-transform:inherit] [&_h2]:[font:inherit] [&_h2]:text-inherit [&_h2]:[text-transform:inherit] [&_h3]:[font:inherit] [&_h3]:text-inherit [&_h3]:[text-transform:inherit] [&_h4]:[font:inherit] [&_h4]:text-inherit [&_h4]:[text-transform:inherit] [&_h5]:[font:inherit] [&_h5]:text-inherit [&_h5]:[text-transform:inherit] [&_h6]:[font:inherit] [&_h6]:text-inherit [&_h6]:[text-transform:inherit] [&_p]:[font:inherit] [&_p]:text-inherit [&_p]:[text-transform:inherit] text-block w-full'
8804  id='AdXlLMmp2TnJaNUNRQ__core_text_eiwm3q'
8805  
8806><p>Sign up to receive updates and special offers.</p></div>
8807
8808
8809      </div><footer-opt-in-form
8810      class='group/footer-opt-in w-full'
8811      dial-code='+1'
8812      market='US'
8813      email-consent-required='true'
8814      sms-copy-version='sms-v1-US'
8815    ><form method="post" action="/contact#AQ0R4eWVvR3ZYZ1hDW__footer_opt_in_UEVXLJ-form" id="AQ0R4eWVvR3ZYZ1hDW__footer_opt_in_UEVXLJ-form" accept-charset="UTF-8" class="flex flex-col gap-(--spacing-forms-gapvertical)" novalidate="novalidate"><input type="hidden" name="form_type" value="customer" /><input type="hidden" name="utf8" value="✓" /><input type='hidden' name='contact[tags]' value='Footer opt-in, newsletter'>
8816        <input type='hidden' name='return_to' value='/cart?customer_posted=true'>
8817        <div
8818          class='js-footer-opt-in-result'
8819          hidden
8820          
8821          
8822        ></div>
8823<div class="w-full group">
8824        <div
8825          class="relative w-full group peer flex flex-col justify-center h-(--spacing-forms-height) px-(--spacing-forms-padding) rounded-(--radius-forms-radius) border-[length:var(--spacing-forms-borderwidth)] border-solid bg-(--color-forms-background) border-(--color-forms-border) hover:border-(--color-forms-border-hover) focus-within:border-(--color-forms-border-hover) has-[:disabled]:border-(--color-forms-border-disabled) [&[error]]:border-[transparent] [&[error]]:ring-danger [&[error]]:ring-[length:var(--spacing-forms-borderwidth-error)] [&[error]]:focus-within:border-(--color-forms-border-hover)"
8826          
8827        ><input
8828            class="body-sm normal-case peer py-3xs -my-3xs w-full appearance-none border-0 bg-transparent px-0 focus:outline-hidden focu
8828s:ring-0 text-(--color-forms-text) disabled:text-(--color-forms-text-disabled) read-only:bg-background-secondary"
8829            
8830              placeholder=" "
8831            
8832            type="email"
8833            id="AQ0R4eWVvR3ZYZ1hDW__footer_opt_in_UEVXLJ-email"
8834            name="contact[email]"
8835            data-slot='input'
8836            
8837              value=""
8838            
8839
8840            
8841
8842            
8843
8844            
8845
8846            
8847              required
8848            
8849
8850            
8851              autocomplete="email"
8852            
8853
8854            
8855
8856            
8857
8858            
8859
8860            
8861          /><label
8862              for="AQ0R4eWVvR3ZYZ1hDW__footer_opt_in_UEVXLJ-email"
8863              class=" order-first cursor-text body-xs normal-case text-foreground-secondary peer-placeholder-shown:absolute peer-placeholder-shown:inset-x-(--spacing-forms-padding) peer-placeholder-shown:inset-y-0 peer-placeholder-shown:flex peer-placeholder-shown:items-center peer-placeholder-shown:body-sm peer-placeholder-shown:normal-case peer-focus:static peer-focus:body-xs peer-focus:normal-case peer-disabled:text-(--color-forms-text-disabled)"
8864            >
8865              Email Address
8866            </label></div></div>
8867<div
8868  class='js-footer-opt-in-validation-email-required hidden group-data-[state="error-validation-email-required"]/footer-opt-in:block'
8869  
8870>
8871  <alert-banner
8872    variant='default'
8873    type='error'
8874    description='Email address is required to sign up'
8875    disable-close
8876  ></alert-banner>
8877</div>
8878<div
8879  class='js-footer-opt-in-validation-email hidden group-data-[state="error-validation-email"]/footer-opt-in:block'
8880  
8881>
8882  <alert-banner
8883    variant='default'
8884    type='error'
8885    description='Invalid email address format (ex. [email protected])'
8886    disable-close
8887  ></alert-banner>
8888</div>
8889<div
8890            data-email-consent
8891            hidden
8892            class='grid grid-cols-1 gap-2xs [&[data-invalid]_input[type="checkbox"]]:border-danger'
8893          >
8894<div class="inline-flex items-start justify-start gap-x-xs group/checkbox">
8895        <label
8896          class="relative flex cursor-pointer items-center"
8897          for="AQ0R4eWVvR3ZYZ1hDW__footer_opt_in_UEVXLJ-email-consent"
8898        >
8899          <input
8900            type="checkbox"
8901            class="peer relative size-4 cursor-pointer appearance-none border transition-all disabled:border-border-01 border-current checked:border-current"
8902            id="AQ0R4eWVvR3ZYZ1hDW__footer_opt_in_UEVXLJ-email-consent"
8903            value="on"
8904            name="email_consent"
8905            aria-labelledby="AQ0R4eWVvR3ZYZ1hDW__footer_opt_in_UEVXLJ-email-consent_label"
8906
8907            
8908
8909            
8910
8911            
8912
8913            
8914              required
8915            
8916
8917            
8918
8919            
8920          />
8921          <span
8922            class="pointer-events-none absolute size-icon-sm opacity-0 transition-opacity text-inherit peer-disabled:text-border top-2/4 left-2/4 -translate-x-2/4 -translate-y-2/4 peer-checked:opacity-100 peer-disabled:border-border-01"
8923          >
8924<svg-icon
8925  src='icon-checkmark'
8926  class='block icon-sm'
8927
8928  
8929
8930  
8931  
8932></svg-icon>
8933</span>
8934        </label>
8935        <label
8936          class="mt-px cursor-pointer select-none text-inherit group-has-[:disabled]/checkbox:text-border text-body"
8937          for="AQ0R4eWVvR3ZYZ1hDW__footer_opt_in_UEVXLJ-email-consent"
8938        >
8939          <div>
8940            <p id="AQ0R4eWVvR3ZYZ1hDW__footer_opt_in_UEVXLJ-email-consent_label" class="block text-body leading-none text-inherit group-has-[:disabled]/checkbox:opacity-50 ">
8941              Sign me up to hear from Clinique! To learn more, view our <a target="_blank" rel="noopener" href="/policies/privacy-policy" target="_blank" title="Privacy Policy"><span style="text-decoration:underline">Privacy Policy</span></a>.
8942            </p></div>
8943        </label>
8944      </div>
8945<div
8946  class='js-footer-opt-in-validation-email-consent hidden group-data-[state="error-validation-email-consent"]/footer-opt-in:block'
8947  
8948>
8949  <alert-banner
8950    variant='default'
8951    type='error'
8952    description='Please check the box to continue'
8953    disable-close
8954  ></alert-banner>
8955</div>
8956</div><div
8957  class='js-footer-opt-in-server-error hidden group-data-[state="error-server"]/footer-opt-in:block'
8958  
8959>
8960  <alert-banner
8961    variant='default'
8962    type='error'
8963    description='We could not process your request. Please try again.'
8964    disable-close
8965  ></alert-banner>
8966</div>
8967<div
8968  class='js-footer-opt-in-api-error hidden group-data-[state="error-api"]/footer-opt-in:block'
8969  
8970>
8971  <alert-banner
8972    variant='default'
8973    type='error'
8974    description='There was an error processing your request. Please try again later.'
8975    disable-close
8976  ></alert-banner>
8977</div>
8978<div
8979  class='js-footer-opt-in-sms-partial-error hidden group-data-[state="error-api-sms-partial"]/footer-opt-in:block'
8980  
8981    tabindex='-1'
8982  
8983>
8984  <alert-banner
8985    variant='default'
8986    type='error'
8987    description='You&#39;re signed up for email. We couldn&#39;t confirm your SMS signup — please try again.'
8988    disable-close
8989  ></alert-banner>
8990</div>
8991<div
8992  class='js-footer-opt-in-success hidden group-data-[state="success"]/footer-opt-in:block'
8993  
8994    tabindex='-1'
8995  
8996>
8997  <alert-banner
8998    variant='default'
8999    type='success'
9000    description='Thanks for signing up for Clinique emails!'
9001    disable-close
9002  ></alert-banner>
9003</div>
9004<button
9005          type='button'
9006          class='js-footer-opt-in-submit btn w-full group-data-[state="loading"]/footer-opt-in:pointer-events-none group-data-[state="loading"]/footer-opt-in:opacity-70'
9007          variant='primary'
9008        >
9009          Sign Up
9010        </button></form></footer-opt-in-form>
9011  </div>
9012
9013  </div>
9014
9015
9016  </div>
9017
9018</div>
9019
9020    <div class='grid w-full gap-sm'>
9021      <div
9022        class='flex w-full min-w-0 flex-row flex-wrap items-center justify-between gap-x-md gap-y-md'
9023      >
9024        <div
9025          class='flex max-w-full min-w-0 flex-1 flex-col items-center max-md:gap-y-2xl md:flex-row md:flex-wrap md:items-center md:justify-start md:gap-x-md md:gap-y-xs lg:gap-x-xs'
9026        >
9027<ul class='flex w-full max-md:justify-center shrink-0 list-none flex-row flex-wrap items-center gap-md md:w-auto' role='list'><li class='flex size-4 shrink-0 items-center justify-center'>
9028        <a
9029          href='https://www.facebook.com/cliniqueUS'
9030          class='block rounded-xs leading-none text-[inherit] hover:opacity-90
9031focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[color:var(--color-focus)]
9032'
9033          target='_blank'
9034          rel='noopener noreferrer'
9035          aria-describedby='a11y-external-message'
9036        >
9037          <img src="//www.clinique.com/cdn/shop/files/fb-icon.svg?v=1790109236&amp;width=48" alt="Facebook" srcset="//www.clinique.com/cdn/shop/files/fb-icon.svg?v=1790109236&amp;width=16 16w, //www.clinique.com/cdn/shop/files/fb-icon.svg?v=1790109236&amp;width=32 32w, //www.clinique.com/cdn/shop/files/fb-icon.svg?v=1790109236&amp;width=48 48w" width="48" height="48" loading="lazy" sizes="16px" class="h-4 w-4 max-h-full max-w-full object-contain" fetchpriority="low">
9038        </a>
9039      </li><li class='flex size-4 shrink-0 items-center justify-center'>
9040        <a
9041          href='https://www.pinterest.com/clinique/'
9042          class='block rounded-xs leading-none text-[inherit] hover:opacity-90
9043focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[color:var(--color-focus)]
9044'
9045          target='_blank'
9046          rel='noopener noreferrer'
9047          aria-describedby='a11y-external-message'
9048        >
9049          <img src="//www.clinique.com/cdn/shop/files/pinterest-icon.svg?v=1790109236&amp;width=48" alt="Pinterest" srcset="//www.clinique.com/cdn/shop/files/pinterest-icon.svg?v=1790109236&amp;width=16 16w, //www.clinique.com/cdn/shop/files/pinterest-icon.svg?v=1790109236&amp;width=32 32w, //www.clinique.com/cdn/shop/files/pinterest-icon.svg?v=1790109236&amp;width=48 48w" width="48" height="48" loading="lazy" sizes="16px" class="h-4 w-4 max-h-full max-w-full object-contain" fetchpriority="low">
9050        </a>
9051      </li><li class='flex size-4 shrink-0 items-center justify-center'>
9052        <a
9053          href='https://www.instagram.com/Clinique/'
9054          class='block rounded-xs leading-none text-[inherit] hover:opacity-90
9055focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[color:var(--color-focus)]
9056'
9057          target='_blank'
9058          rel='noopener noreferrer'
9059          aria-describedby='a11y-external-message'
9060        >
9061          <img src="//www.clinique.com/cdn/shop/files/new-instagram-logo-glyph.svg?v=1788214472&amp;width=48" alt="Instagram" srcset="//www.clinique.com/cdn/shop/files/new-instagram-logo-glyph.svg?v=1788214472&amp;width=16 16w, //www.clinique.com/cdn/shop/files/new-instagram-logo-glyph.svg?v=1788214472&amp;width=32 32w, //www.clinique.com/cdn/shop/files/new-instagram-logo-glyph.svg?v=1788214472&amp;width=48 48w" width="48" height="3" loading="lazy" sizes="16px" class="h-4 w-4 max-h-full max-w-full object-contain" fetchpriority="low">
9062        </a>
9063      </li><li class='flex size-4 shrink-0 items-center justify-center'>
9064        <a
9065          href='https://www.tiktok.com/@clinique'
9066          class='block rounded-xs leading-none text-[inherit] hover:opacity-90
9067focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[color:var(--color-focus)]
9068'
9069          target='_blank'
9070          rel='noopener noreferrer'
9071          aria-describedby='a11y-external-message'
9072        >
9073          <img src="//www.clinique.com/cdn/shop/files/Layer_1_6029be36-30f6-41dc-9841-54da108a2fd9.svg?v=1790109235&amp;width=48" alt="TikTok" srcset="//www.clinique.com/cdn/shop/files/Layer_1_6029be36-30f6-41dc-9841-54da108a2fd9.svg?v=1790109235&amp;width=16 16w, //www.clinique.com/cdn/shop/files/Layer_1_6029be36-30f6-41dc-9841-54da108a2fd9.svg?v=1790109235&amp;width=32 32w, //www.clinique.com/cdn/shop/files/Layer_1_6029be36-30f6-41dc-9841-54da108a2fd9.svg?v=1790109235&amp;width=48 48w" width="48" height="48" loading="lazy" sizes="16px" class="h-4 w-4 max-h-full max-w-full object-contain" fetchpriority="low">
9074        </a>
9075      </li><li class='flex size-4 shrink-0 items-center justify-center'>
9076        <a
9077          href='https://www.youtube.com/Clinique'
9078          class='block rounded-xs leading-none text-[inherit] hover:opacity-90
9079focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[color:var(--color-focus)]
9080'
9081          target='_blank'
9082          rel='noopener noreferrer'
9083          aria-describedby='a11y-external-message'
9084        >
9085          <img src="//www.clinique.com/cdn/shop/files/youtube-icon.svg?v=1790109235&amp;width=48" alt="YouTube" srcset="//www.clinique.com/cdn/shop/files/youtube-icon.svg?v=1790109235&amp;width=16 16w, //www.clinique.com/cdn/shop/files/youtube-icon.svg?v=1790109235&amp;width=32 32w, //www.clinique.com/cdn/shop/files/youtube-icon.svg?v=1790109235&amp;width=48 48w" width="48" height="48" loading="lazy" sizes="16px" class="h-4 w-4 max-h-full max-w-full object-contain" fetchpriority="low">
9086        </a>
9087      </li></ul><div
9088            class='flex w-full min-w-0 max-md:flex-col max-md:items-center md:ms-auto md:w-auto md:max-w-full md:flex-row md:flex-wrap md:items-center md:justify-end md:gap-x-md md:gap-y-xs'
9089          ><p class='shrink-0 text-body-xs-standard max-md:mt-pagemargin max-md:w-full max-md:basis-full max-md:text-center md:mt-0 md:text-end'>© 2026 Clinique Laboratories, LLC. All Rights Reserved</p>
9090          </div>
9091        </div></div></div>
9092  </div></div>
9093
9094
9095</div>
9096<!-- END sections: footer-group --></footer>
9097
9098        <ul hidden>
9099          <li id='a11y-refresh-page-message'>
9100            Choosing a selection results in a full page refresh.
9101          </li>
9102          <li id='a11y-new-window-message'>
9103            Opens in a new window.
9104          </li>
9105          <li id='a11y-external-message'>
9106            Opens external website.
9107          </li>
9108        </ul>
9109
9110<extended-dialog
9111    cloak
9112    type='drawer'
9113    id='cart-drawer-dialog'
9114
9115    
9116      url=''
9117    
9118
9119    
9120
9121    
9122      anchor='right'
9123    
9124
9125    
9126      close-on-backdrop-click='true'
9127    
9128
9129    
9130
9131    
9132
9133    
9134
9135    
9136
9137    
9138      parent-class='cart-drawer-dialog 
9139
9140color-scheme-1 bg-background text-foreground
9141
9142
9143'
9144    
9145
9146    
9147
9148    
9149  ><p slot='header' class='h5' data-slot='header'>
9150  <!-- ##start:entry-lazy##component-cart-total.js##end:entry-lazy## -->
9151
9152<span class='flex flex-col gap-2xs'>
9153  <span class='flex items-center gap-2xs text-subtitle-md'>
9154    <span>Shopping Bag</span>
9155    <span class='cart-drawer-dialog__count [&:has(cart-total[aria-hidden="true"])]:hidden'>
9156      <cart-total
9157        class="before:content-['('] after:content-[')']"
9158        cloak
9159        aria-hidden='true'
9160        translation='{ "cart_count": "###count### items" }'
9161      ></cart-total>
9162    </span>
9163  </span>
9164<span
9165  data-t1-free-shipping
9166  data-away-template='###amount### away from FREE shipping'
9167  data-unlocked-message='Congratulations! You&#39;ve earned FREE shipping'
9168  data-empty-message='Add items to earn FREE shipping'
9169  class='text-body-sm font-normal uppercase empty:hidden'
9170  aria-live='polite'
9171  hidden
9172></span>
9173
9174  </span></p>
9175
9176  <!-- ##start:entry-lazy##core/core-cart-sections.ts##end:entry-lazy## -->
9177
9178
9179  <!-- ##start:entry-lazy##alert-banner.ts##end:entry-lazy## -->
9180
9181
9182  <!-- ##start:entry-lazy##talon-one-cart.ts##end:entry-lazy## -->
9183
9184
9185  <!-- ##start:entry-lazy##talon-one-coupon.ts##end:entry-lazy## -->
9186
9187
9188  <!-- ##start:entry-lazy##overlay-panel.ts##end:entry-lazy## -->
9189
9190
9191  <!-- ##start:entry-lazy##overlay-panel-toggle.ts##end:entry-lazy## -->
9192
9193
9194  <!-- ##start:entry-lazy##cart-samples-panel.ts##end:entry-lazy## -->
9195
9196
9197  <!-- ##start:entry-lazy##cart-gwp-panel.ts##end:entry-lazy## -->
9198
9199
9200  <!-- ##start:entry-lazy##talon-one-mini-cart-rewards.ts##end:entry-lazy## -->
9201
9202
9203  <!-- ##start:entry-lazy##cart-addon-availability.ts##end:entry-lazy## -->
9204
9205<cart-sections
9206  section-id='cart-drawer'
9207  class='bg-background-secondary flex h-full min-h-0 flex-col overflow-hidden'
9208  cloak
9209  register-for-cart-updates
9210><div
9211    data-addon-oos
9212    data-message='An item in your bag is no longer available and was removed.'
9213    data-close-label='Close'
9214    class='gap-2xs bg-background px-sm py-2xs hidden flex-col has-[alert-banner]:flex'
9215  ></div><div
9216    data-cart-add-error
9217    data-message='We couldn&amp;#39;t add that item to your bag.'
9218    data-close-label='Close'
9219    class='gap-2xs bg-background px-sm py-2xs hidden flex-col has-[alert-banner]:flex'
9220  ></div>
9221  
9222<talon-one-cart hidden></talon-one-cart>
9223    <div class='px-sm py-md flex h-full flex-1 flex-col items-center justify-center text-center'>
9224      <p class='mb-xs text-subtitle-md font-normal'>Your cart is empty</p><p class='mb-md text-body-md max-w-sm font-light'>
9225          <a href='https://www.clinique.com/customer_authentication/redirect?locale=en&region_country=US' class='link underline'>Sign in</a>
9226          for faster checkout and eligible offers.
9227        </p><a
9228        href='/'
9229        class='btn rounded-none'
9230        variant='primary'
9231      >Continue shopping</a>
9232    </div>
9233  
9234</cart-sections><cart-addon-availability hidden></cart-addon-availability>
9235
9236<cart-samples-panel
9237  slot='overlay-panel'
9238  panel-id='CartSamplesPanel'
9239  role='dialog'
9240  aria-modal='true'
9241  aria-labelledby='CartSamplesPanel-heading'
9242  aria-hidden='true'
9243  inert
9244  cloak
9245  class='pointer-events-none absolute inset-0 translate-x-full bg-background transition-transform delay-0 duration-300 ease-in-out motion-reduce:transition-none'
9246>
9247  <div class='grid h-full grid-cols-1 grid-rows-[auto_minmax(0,_1fr)_auto]'><div class='flex flex-col gap-md px-sm py-md'>
9248      <button
9249        type='button'
9250        data-samples-back
9251        class='flex w-fit items-center gap-2xs pb-6 text-body-sm font-normal uppercase focus-visible:ring-2 focus-visible:ring-focus focus-visible:ring-offset-2 focus-visible:ring-offset-background focus-visible:outline-none'
9252      >
9253<svg-icon
9254  src='icon-caret'
9255  class='icon-md rotate-90'
9256
9257  
9258
9259  
9260  
9261></svg-icon>
9262Back
9263      </button>
9264
9265      <div class='flex flex-col'>
9266        <h2
9267          id='CartSamplesPanel-heading'
9268          data-samples-heading
9269          class='pb-6 text-subtitle-md font-normal uppercase'
9270        >
9271          Choose Free Samples
9272        </h2>
9273        <p class='pb-6 text-body-sm font-normal uppercase'>
9274          Add complimentary samples to your order.
9275        </p>
9276      </div>
9277    </div><div class='scrollbar-thin overflow-x-hidden overflow-y-auto overscroll-contain px-sm pb-sm scrollbar-thumb-background-secondary'>
9278      <div data-samples-groups class='flex flex-col gap-lg'></div>
9279      <p
9280        data-samples-empty
9281        hidden
9282        class='py-md text-center text-body-sm font-normal uppercase'
9283      >
9284        No samples are available right now.
9285      </p>
9286    </div><div class='group/samples-footer flex flex-col gap-sm bg-background p-sm [box-shadow:2px_2px_30px_0_rgba(0,0,0,0.10)]'>
9287      <div
9288        data-samples-toast
9289        data-message='Limit reached, Remove a sample to add another'
9290        class='empty:hidden'
9291      ></div>
9292      <div
9293        data-samples-error
9294        data-message='Something went wrong adding your samples. Please try again.'
9295        data-sold-out-message='A sample you selected just sold out and was removed. Please choose another.'
9296        class='empty:hidden'
9297      ></div><div class='hidden w-full border-t border-t-border-02 group-has-[alert-banner]/samples-footer:block'></div>
9298
9299      <button
9300        type='button'
9301        data-samples-cta
9302        variant='primary'
9303        disabled
9304        class='btn rounded-none'
9305      ><span
9306          data-samples-count
9307          data-count-template='%added% of %total%'
9308          class='empty:hidden'
9309        ></span>
9310        Add Samples
9311      </button>
9312    </div>
9313  </div><template data-group-template>
9314    <section data-samples-group class='flex flex-col gap-sm'>
9315      <h3 data-samples-group-heading class='text-subtitle-md font-normal uppercase empty:hidden'></h3>
9316      <div
9317        data-samples-limit
9318        data-message='Limit reached, Remove a sample to add another'
9319        class='empty:hidden'
9320      ></div>
9321      <ul data-samples-list role='list' class='grid grid-cols-2 gap-x-sm gap-y-md'></ul>
9322    </section>
9323  </template><template data-sample-card-template>
9324    <li
9325      data-sample-card
9326      class='has-[input:disabled:not(:checked)]:opacity-50'
9327    >
9328      <label
9329        data-sample-label
9330        class='relative block h-full cursor-pointer has-[:disabled]:cursor-default has-[input:disabled:not(:checked)]:text-disabled'
9331      >
9332        <input
9333          type='checkbox'
9334          data-sample-input
9335          class='peer sr-only'
9336        ><span
9337          aria-hidden='true'
9338          class='absolute top-sm left-xs z-[1] flex size-6 items-center justify-center border border-forms-border bg-background text-background peer-checked:border-foreground peer-checked:bg-foreground peer-checked:text-background peer-focus-visible:ring-2 peer-focus-visible:ring-focus peer-focus-visible:ring-offset-2 peer-focus-visible:ring-offset-background peer-disabled:opacity-80'
9339        >
9340<svg-icon
9341  src='icon-checkmark'
9342  class='icon-md'
9343
9344  
9345
9346  
9347  
9348></svg-icon>
9349</span>
9350        <span data-sample-card-slot class='block size-full'></span>
9351      </label>
9352    </li>
9353  </template>
9354</cart-samples-panel>
9355
9356<cart-gwp-panel
9357    slot='overlay-panel'
9358    panel-id='CartGwpPanel'
9359    role='dialog'
9360    aria-modal='true'
9361    aria-labelledby='CartGwpPanel-heading'
9362    aria-hidden='true'
9363    inert
9364    cloak
9365    class='bg-background pointer-events-none absolute inset-0 translate-x-full transition-transform delay-0 duration-300 ease-in-out motion-reduce:transition-none'
9366  >
9367    <div class='grid h-full grid-cols-1 grid-rows-[auto_minmax(0,_1fr)_auto]'><div class='px-sm py-md'>
9368        <button
9369          type='button'
9370          data-gwp-back
9371          class='gap-2xs text-body-sm focus-visible:ring-focus focus-visible:ring-offset-background flex w-fit items-center font-normal uppercase focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2'
9372        >
9373<svg-icon
9374  src='icon-caret'
9375  class='icon-md rotate-90'
9376
9377  
9378
9379  
9380  
9381></svg-icon>
9382Back
9383        </button>
9384      </div><div class='scrollbar-thumb-background-secondary overflow-y-auto overscroll-contain scrollbar-thin'>
9385        <div class='gap-2xs bg-background-secondary px-sm py-md flex flex-col'>
9386          <div class='gap-2xs flex flex-col'>
9387            <h2
9388              id='CartGwpPanel-heading'
9389              data-gwp-heading
9390              class='text-subtitle-md font-normal uppercase'
9391            >
9392              Choose your gift
9393            </h2>
9394            <p class='text-body-sm font-normal uppercase'>
9395              Add a complimentary gift to your order.
9396            </p>
9397          </div><ul data-gwp-status role='list' class='gap-2xs flex flex-col empty:hidden'></ul>
9398        </div>
9399        <div data-gwp-groups class='gap-lg px-sm py-md flex flex-col'></div>
9400        <p
9401          data-gwp-empty
9402          hidden
9403          class='px-sm py-md text-body-sm text-center font-normal uppercase'
9404        >
9405          No gifts are available right now.
9406        </p>
9407      </div><div class='group/gwp-footer gap-sm bg-background p-sm flex flex-col [box-shadow:2px_2px_30px_0_rgba(0,0,0,0.10)]'>
9408        <div
9409          data-gwp-error
9410          data-message='Something went wrong adding your gift. Please try again.'
9411          class='empty:hidden'
9412        ></div>
9413        <div class='border-t-border-02 hidden w-full border-t group-has-[alert-banner]/gwp-footer:block'></div>
9414
9415        <button
9416          type='button'
9417          data-gwp-cta
9418          variant='primary'
9419          disabled
9420          class='btn rounded-none'
9421        >
9422          <span
9423            data-gwp-count
9424            data-count-template='%added% of %total%'
9425            class='empty:hidden'
9426          ></span>
9427          Add gifts
9428        </button>
9429      </div>
9430    </div><template data-gwp-status-template>
9431      <li class='gap-3xs flex items-center'>
9432        <span
9433          data-gwp-status-met
9434          aria-hidden='true'
9435          class='size-icon-md bg-foreground text-background flex shrink-0 items-center justify-center rounded-full'
9436        >
9437<svg-icon
9438  src='icon-checkmark'
9439  class='icon-sm'
9440
9441  
9442
9443  
9444  
9445></svg-icon>
9446</span>
9447        <span
9448          data-gwp-status-unmet
9449          aria-hidden='true'
9450          hidden
9451          class='size-icon-md border-foreground shrink-0 rounded-full border'
9452        ></span>
9453        <span
9454          data-gwp-status-state
9455          data-met='Unlocked:'
9456          data-unmet='Locked:'
9457          class='sr-only'
9458        ></span>
9459        <span
9460          data-gwp-status-label
9461          class='text-body-sm font-normal uppercase'
9462        ></span>
9463      </li>
9464    </template><template data-tier-template>
9465      <section data-gwp-tier class='gap-sm flex flex-col'>
9466        <div class='gap-2xs flex flex-col'>
9467          <p
9468            data-gwp-tier-eyebrow
9469            data-qualified='You&amp;#39;ve qualified!'
9470            data-spend-more='Spend %amount% more for your next gift'
9471            class='text-body-sm font-normal uppercase empty:hidden'
9472          ></p>
9473          <h3 data-gwp-tier-heading class='text-subtitle-md font-normal uppercase empty:hidden'></h3>
9474        </div>
9475        <div data-gwp-categories class='gap-md flex flex-col'></div>
9476      </section>
9477    </template><template data-category-template>
9478      <div data-gwp-category class='gap-sm flex flex-col'>
9479        <div data-gwp-category-divider class='gap-sm flex items-center'>
9480          <span class='bg-border-01 h-px flex-1'></span>
9481          <span
9482            data-gwp-category-heading
9483            class='text-body-sm whitespace-nowrap text-center font-normal uppercase'
9484          ></span>
9485          <span class='bg-border-01 h-px flex-1'></span>
9486        </div>
9487        <p data-gwp-category-empty hidden class='text-body-sm font-normal'>
9488          No gifts are currently available to select. Please check back soon.
9489        </p>
9490        <ul data-gwp-card-list role='list' class='gap-sm flex flex-col'></ul>
9491        <div
9492          data-gwp-limit
9493          data-message='You&amp;#39;ve reached your gift limit. Deselect one to choose another.'
9494          class='empty:hidden'
9495        ></div>
9496      </div>
9497    </template><template data-gwp-card-template>
9498      <li data-gwp-card class='data-[added=true]:opacity-70'>
9499        <label
9500          data-gwp-label
9501          class='group/reward gap-xs has-[:disabled]:text-disabled relative flex cursor-pointer items-center has-[:disabled]:cursor-default'
9502        >
9503          <input type='radio' data-gwp-input class='peer sr-only'>
9504          <span
9505            data-gwp-toggle
9506            data-toggle-radio
9507            aria-hidden='true'
9508            class='border-forms-border bg-background peer-checked:border-foreground peer-focus-visible:ring-focus peer-focus-visible:ring-offset-background before:size-icon-md before:bg-foreground relative size-6 shrink-0 rounded-full border before:absolute before:inset-0 before:m-auto before:hidden before:rounded-full before:content-[""] peer-checked:before:block peer-focus-visible:ring-2 peer-focus-visible:ring-offset-2 peer-disabled:opacity-50'
9509          ></span>
9510          <span
9511            data-gwp-toggle
9512            data-toggle-check
9513            aria-hidden='true'
9514            class='border-forms-border bg-background text-background peer-checked:border-foreground peer-checked:bg-foreground peer-focus-visible:ring-focus peer-focus-visible:ring-offset-background flex size-6 shrink-0 items-center justify-center border peer-focus-visible:ring-2 peer-focus-visible:ring-offset-2 peer-disabled:opacity-50'
9515          >
9516<svg-icon
9517  src='icon-checkmark'
9518  class='icon-md'
9519
9520  
9521
9522  
9523  
9524></svg-icon>
9525</span>
9526          <span data-gwp-card-slot class='block min-w-0 flex-1'></span>
9527        </label>
9528      </li>
9529    </template>
9530  </cart-gwp-panel>
9531<talon-one-mini-cart-rewards
9532    slot='overlay-panel'
9533    panel-id='CartLoyaltyRewardsPanel'
9534    customer-state='guest'
9535    role='dialog'
9536    aria-modal='true'
9537    aria-labelledby='CartLoyaltyRewardsPanel-heading'
9538    aria-hidden='true'
9539    inert
9540    cloak
9541    class='pointer-events-none absolute inset-0 translate-x-full overflow-hidden bg-background transition-transform delay-0 duration-300 ease-in-out motion-reduce:transition-none'
9542    back-label='Back'
9543    heading='Redeem Rewards'
9544    heading-id='CartLoyaltyRewardsPanel-heading'
9545    supporting-copy='Redeem your points for the rewards below.'
9546    tier-label='%tier% Tier'
9547    points-label='%count% Points'
9548    points-balance-label='%points% points'
9549    apply-label='Apply'
9550    applied-label='Applied'
9551    remove-label='Remove'
9552    limit-label='One reward per order'
9553    out-of-stock-label='Out of Stock'
9554    empty-bag-label='Add at least one item to your bag to redeem a reward.'
9555    birthday-heading='Birthday Reward'
9556    perks-heading='Perks'
9557    free-label='Free'
9558    error-label='Something went wrong. Please try again.'
9559  ></talon-one-mini-cart-rewards>
9560  </extended-dialog>
9561  <!-- ##start:entry-lazy##cart-promo-guard.ts##end:entry-lazy## -->
9562
9563
9564
9565<modal-dialog
9566    cloak
9567    type='modal'
9568    id='CartExpiredPromoModal'
9569
9570    
9571      url=''
9572    
9573
9574    
9575
9576    
9577
9578    
9579      close-on-backdrop-click='true'
9580    
9581
9582    
9583
9584    
9585
9586    
9587
9588    
9589
9590    
9591
9592    
9593
9594    
9595
9596    
9597  ><p slot='header' class='h5' data-slot='header'><span class='text-subtitle-md'>Promotion ended</span></p><div class='flex flex-col gap-sm p-sm'>
9598    <p class='text-body-md font-light'>These complimentary items are no longer available and were removed from your bag:</p>
9599    <ul data-promo-guard-items class='list-disc ps-md text-body-md' hidden></ul>
9600    <div class='grid grid-cols-1 gap-2xs'>
9601      <button
9602        type='button'
9603        class='btn rounded-button-radius'
9604        variant='primary'
9605        data-promo-guard-continue
9606      >Continue to checkout</button>
9607      <button
9608        type='button'
9609        class='btn rounded-button-radius'
9610        variant='secondary'
9611        data-promo-guard-close
9612      >Back to bag</button>
9613    </div>
9614  </div>
9615  </modal-dialog><cart-promo-guard modal-id='CartExpiredPromoModal' hidden></cart-promo-guard>
9616
9617  <!-- ##start:entry-lazy##core/core-quickshop.ts,core/core-main-product.ts,flattened-main-product.ts,flattened-product-form.ts,core/core-swiper-with-media.ts##end:entry-lazy## -->
9618
9619<quick-shop modal-id='quick-shop-modal'>
9620  
9621<modal-dialog
9622    cloak
9623    type='drawer'
9624    id='quick-shop-modal'
9625
9626    
9627      url=''
9628    
9629
9630    
9631
9632    
9633      anchor='right'
9634    
9635
9636    
9637      close-on-backdrop-click='true'
9638    
9639
9640    
9641
9642    
9643
9644    
9645
9646    
9647
9648    
9649
9650    
9651
9652    
9653
9654    
9655  ><p slot='header' class='h5' data-slot='header'>Quick view</p>
9656  </modal-dialog>
9657</quick-shop>
9658
9659
9660  <!-- ##start:entry-eager##talon-one-price-state.ts##end:entry-eager## -->
9661
9662<talon-one-price-state
9663    hidden
9664    price-state='generic'
9665    data-effect-generic='STP_Effect_Generic'
9666    data-effect-macpro='STP_Effect_MACPRO'
9667      data-bundle-pricing
9668  ></talon-one-price-state></app-provider>
9669  <!-- ##start:entry-lazy##core/core-dialog.ts##end:entry-lazy## -->
9670
9671
9672  <!-- ##start:entry-eager##extended-dialog.ts##end:entry-eager## -->
9673
9674
9675  <!-- ##start:entry-lazy##elc-dynamic-product-card.ts##end:entry-lazy## -->
9676
9677
9678  <!-- ##start:entry-lazy##back-in-stock.ts##end:entry-lazy## -->
9679
9680<script>
9681  document.addEventListener('DOMContentLoaded', function () {
9682    document.querySelectorAll('a[href="#privacy-choices"]').forEach(function (link) {
9683      link.addEventListener('click', function (event) {
9684        event.preventDefault()
9685        window.OneTrust?.ToggleInfoDisplay()
9686      })
9687    })
9688  })
9689</script>
9689
9690
9691<script>
9692  window.pwr =
9693    window.pwr ||
9694    function () {
9695      ;(pwr.q = pwr.q || []).push(arguments)
9696    }
9697
9698  window.pwrRender = function (config) {
9699    var attempts = 0
9700    var maxAttempts = 100
9701    var interval = setInterval(function () {
9702      attempts++
9703      if (typeof pwr === 'function' && !pwr.q) {
9704        clearInterval(interval)
9705        pwr('render', config)
9706      } else if (attempts >= maxAttempts) {
9707        clearInterval(interval)
9708      }
9709    }, 100)
9710  }
9711</script>
9711
9712  <!-- ##start:entry-lazy##powerreviews-stars.ts##end:entry-lazy## -->
9713
9714
9715<script src='https://ui.powerreviews.com/stable/4.1/ui.js' async></script>
9715
9716
9717
9718
9719  <div id="shopify-block-AUzhjL0lvK2xmWm5Kb__4010738206109609373" class="shopify-block shopify-app-block">
9720
9721<script
9722  defer
9723>
9724  const asciiString = String.fromCharCode.apply(
9725    null,
9726    '100d56b022811ef399abd8dd376caf7a24f258292b5be9f93293c58a1476a567'.match(/\w{2}/g).map((a) => parseInt(a, 16))
9727  );
9728  const signature = btoa(asciiString).replace(/\+/g, '-').replace(/\//g, '_').replace(/=+$/, '');
9729  const fullToken = `eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJjdXN0b21lcklkIjoxLCJleHAiOjE3OTA4NTQxMTEsImlhdCI6MTc5MDg1MDUxMSwic2hvcElkIjogIjczODE1NjIxNzcxIiwic2hvcERvbWFpbiI6ICJ3d3cuY2xpbmlxdWUuY29tIn0.${signature}`;
9730  const apiUrl = 'https://shopify-integration.europe-west1.talon.one';
9731  const fetchCustomerProfile = async () => {
9732    const res = await fetch(`${apiUrl}/api/v1/customer-profile`, {
9733      headers: {
9734        Authorization: `Bearer ${fullToken}`,
9735        'ngrok-skip-browser-warning': 'true',
9736      },
9737      method: 'GET',
9738    });
9739    const json = await res.json();
9740    window.TalonOne = { customerProfile: json, ...window.TalonOne };
9741    // force reload because the secret wasn't set
9742    if (!json.success && json.refresh) document.location.reload();
9743    return json;
9744  };
9745
9746  const fetchSessionEffects = async (sessionId, cart) => {
9747    const profileId = '' ? '' : undefined;
9748    const res = await fetch(`${apiUrl}/api/v1/session/${sessionId}`, {
9749      headers: {
9750        Authorization: `Bearer ${fullToken}`,
9751        'ngrok-skip-browser-warning': 'true',
9752        'x-request-ts': new Date().toISOString(),
9753        'Content-Type': 'application/json',
9754      },
9755      method: 'PUT',
9756      body: JSON.stringify({ cart, profileId }),
9757    });
9758    const json = await res.json();
9759    if (!json?.effects) return undefined;
9760    window.TalonOne = { sessionEffects: json, ...window.TalonOne };
9761    return json;
9762  };
9763
9764  async function handleCart() {
9765    const res = await fetch('/cart.js', { method: 'GET' });
9766    if (!res.ok) {
9767      console.error(await res.text());
9768      return;
9769    }
9770    const data = await res.json();
9771    const sessionId = data?.attributes?.talon_one_session_id;
9772    const sessionEffects = data?.attributes?.talon_one_session_effects;
9773    if (data?.token) {
9774      const cartId = data.token.split('?')[0];
9775      console.log('current cart id: ', cartId);
9776      const sessionFromAPI = await fetchSessionEffects(cartId, data);
9777      const effectString = JSON.stringify(sessionFromAPI?.effects);
9778      if (!data.items.length) return; // the cart is empty
9779      if (cartId !== sessionId || effectString !== sessionEffects) {
9780        console.log('Attempting to set the cart id into the cart attributes');
9781        // add custom param to know is T1 app sending the update event
9782        const updateRes = await fetch('/cart/update.js?t1-update=1', {
9783          method: 'POST',
9784          headers: {
9785            'Content-Type': 'application/json',
9786            'x-t1-update': '1',
9787          },
9788          body: JSON.stringify({
9789            attributes: {
9790              talon_one_session_id: cartId,
9791              talon_one_session_effects: effectString,
9792            },
9793          }),
9794          keepalive: true,
9795        });
9796        if (!updateRes.ok) {
9797          console.error(await res.text());
9798          return;
9799        } else {
9800          console.log('Successfully added cart id and session effects into the cart attributes');
9801          displayTestingView(cartId, effectString);
9802        }
9803      } else {
9804        console.log('Cart is already updated');
9805      }
9806    }
9807  }
9808
9809  async function syncSessionIdOnly() {
9810    const res = await fetch('/cart.js', { method: 'GET' });
9811    if (!res.ok) {
9812      console.error(await res.text());
9813      return;
9814    }
9815    const data = await res.json();
9816    if (!data?.token) return;
9817    const cartId = data.token.split('?')[0];
9818    const sessionId = data?.attributes?.talon_one_session_id;
9819    if (cartId === sessionId) return;
9820    console.log('Attempting to set the cart id into the cart attributes (fast path)');
9821    const updateRes = await fetch('/cart/update.js?t1-update=1', {
9822      method: 'POST',
9823      headers: {
9824        'Content-Type': 'application/json',
9825        'x-t1-update': '1',
9826      },
9827      body: JSON.stringify({
9828        attributes: {
9829          talon_one_session_id: cartId,
9830        },
9831      }),
9832      keepalive: true,
9833    });
9834    if (!updateRes.ok) {
9835      console.error(await updateRes.text());
9836    } else {
9837      console.log('Successfully set the cart id into the cart attributes (fast path)');
9838    }
9839  }
9840
9841  function displayTestingView(cartId, effectString) {
9842    const testingView = document.querySelector('#t1-cart-testing-display');
9843    if (testingView) {
9844      testingView.innerHTML = `
9845        <h4>Session ID: ${cartId}</h4>
9846        <br/>
9847        <p>${effectString}</p>
9848      `;
9849    }
9850  }
9851
9852  function getSenderURL(resource) {
9853    return typeof resource === 'string' ? resource : resource instanceof URL ? resource.href : String(resource ?? '');
9854  }
9855
9856  // Convert fetch(new Request(url, options)) into fetch(url, config) shape,
9857  // so the rest of the listener can rely on a plain config object.
9858  // Returns null if normalization fails (e.g. non-clonable body).
9859    async function normalizeFetchArgs(args) {
9860      let resource = args[0];
9861      let config = args[1] || {};
9862
9863      if (!(resource instanceof Request)) {
9864        return { resource, config };
9865      }
9866
9867      try {
9868        // Helper to preserve explicit falsy values (e.g. keepalive: false or referrer: '')
9869        const getVal = (key) => (config[key] !== undefined ? config[key] : resource[key]);
9870
9871        const method = (config.method || resource.method || 'GET').toUpperCase();
9872        const isGetOrHead = method === 'GET' || method === 'HEAD';
9873
9874        // Only parse body if it's NOT a GET/HEAD request
9875        let finalBody = config.body;
9876        if (!isGetOrHead && finalBody === undefined && resource.body) {
9877          const cloned = resource.clone();
9878          finalBody = await cloned.text();
9879        }
9880
9881        const newConfig = {
9882          method: method,
9883          headers: config.headers || new Headers(resource.headers),
9884          mode: getVal('mode'),
9885          credentials: getVal('credentials'),
9886          cache: getVal('cache'),
9887          redirect: getVal('redirect'),
9888          referrer: getVal('referrer'),
9889          integrity: getVal('integrity'),
9890          signal: getVal('signal'),
9891          keepalive: getVal('keepalive'),
9892        };
9893
9894        if (!isGetOrHead && finalBody !== undefined) {
9895          newConfig.body = finalBody;
9896        }
9897
9898        args[0] = resource.url;
9899        args[1] = newConfig;
9900
9901        return { resource: resource.url, config: newConfig };
9902      } catch (e) {
9903        console.error('[Talon.One] Error normalizing Request object:', e);
9904        return null;
9905      }
9906  }
9907
9908  // "Buy with Shop" creates the cart via the Storefront GraphQL API instead
9909  // of the REST /cart endpoints, so inject the session id directly into the
9910  // cartCreate mutation body before it's sent.
9911  async function injectSessionIdIntoCartCreate(senderURL, config, originalFetch) {
9912    if (!senderURL.includes('graphql')) return;
9913    if (!config || !config.body || typeof config.body !== 'string') return;
9914
9915    try {
9916      const body = JSON.parse(config.body);
9917      const isCartCreate =
9918        (typeof body.query === 'string' && body.query.includes('cartCreate')) ||
9919        (typeof body.operationName === 'string' && body.operationName.toLowerCase().includes('cartcreate'));
9920
9921      if (!isCartCreate || !body.variables?.input) return;
9922
9923      const attributes = body.variables.input.attributes || [];
9924      const alreadyHasSessionId = attributes.some((a) => a.key === 'talon_one_session_id');
9925      if (alreadyHasSessionId) return;
9926
9927      // Fetch fresh cart using originalFetch to avoid recursion loops
9928      const cartId = await getCartToken(originalFetch);
9929      if (!cartId) return;
9930
9931      attributes.push({ key: 'talon_one_session_id', value: cartId });
9932      body.variables.input.attributes = attributes;
9933      config.body = JSON.stringify(body);
9934      console.log('[Talon.One] Injected cart.token into cartCreate GQL mutation:', cartId);
9935    } catch (e) {
9936      // Ignore non-JSON request bodies
9937    }
9938  }
9939
9940  function isCartMutationUrl(senderURL) {
9941    return (
9942      senderURL.includes('/cart/add.js') ||
9943      senderURL.includes('/cart/update.js') ||
9944      senderURL.includes('/cart/change.js') ||
9945      senderURL.includes('/cart/clear.js') ||
9946      senderURL.includes('/cart/add') ||
9947      senderURL.includes('/cart/update') ||
9948      senderURL.includes('/cart/change') ||
9949      senderURL.includes('/cart/clear')
9950    );
9951  }
9952
9953  function listenToCartChanges() {
9954    (function (ns, originalFetch) {
9955      if (typeof originalFetch !== 'function') return;
9956
9957      ns.fetch = async function (...args) {
9958        const normalized = await normalizeFetchArgs(args, originalFetch);
9959        if (!normalized) return originalFetch.apply(this, args);
9960        const { resource, config } = normalized;
9961
9962        const senderURL = getSenderURL(resource);
9963
9964        await injectSessionIdIntoCartCreate(senderURL, config, originalFetch);
9965
9966        if (senderURL?.includes('t1-update')) {
9967          return originalFetch.apply(this, args);
9968        }
9969
9970        const response = await originalFetch.apply(this, args);
9971
9972        try {
9973          if (isCartMutationUrl(senderURL)) {
9974            handleCart();
9975          }
9976        } catch (e) {
9977          console.error('[Talon.One] Error during cart listener handling:', e);
9978        }
9979
9980        return response;
9981      };
9982    })(window, window.fetch);
9983  }
9984
9985  async function getCartToken(originalFetch) {
9986    // 1. Check for the cart cookie first (fast path)
9987    const match = document.cookie.match(/(?:^|; )cart=([^;]*)/);
9988    if (match && match[1]) {
9989      // Strip the ?key= part from the cookie token
9990      const decodedCookie = decodeURIComponent(match[1]);
9991      return decodedCookie.split('?')[0]; 
9992    }
9993
9994    // 2. Fallback to network request if cookie is missing
9995    const controller = new AbortController();
9996    const timeoutId = setTimeout(() => controller.abort(), 2000); 
9997
9998    try {
9999      const cartRes = await originalFetch('/cart.js', { signal: controller.signal });
10000      clearTimeout(timeoutId);
10001      if (cartRes.ok) {
10002        const cartData = await cartRes.json();
10003        if (cartData?.token) {
10004          // Strip the ?key= or any other param parts  from the API response
10005          return cartData.token.split('?')[0];
10006        }
10007      }
10008    } catch (e) {
10009      clearTimeout(timeoutId);
10010      if (e.name !== 'AbortError') console.error('[Talon.One]', e);
10011    }
10012    return null;
10013  }
10014
10015  // Register fetch listener immediately (no DOM dependency) for early interception
10016  listenToCartChanges();
10017
10018  document.addEventListener('DOMContentLoaded', () => {
10019    if (document.location.pathname.includes('cart')) {
10020      // cart is a page type
10021      handleCart();
10022    } else {
10023      syncSessionIdOnly();
10024    }
10025    const customerId = '';
10026    // is not a guest
10027    if (customerId) {
10028      fetchCustomerProfile();
10029    }
10030  });
10031</script>
10031
10032
10033<script src="https://cdn.shopify.com/extensions/01a0d7a7-04c7-7322-9688-656d84f887e8/talon-one-prod-44/assets/date-fns.js" defer></script>
10033
10034
10035
10036</div><div id="shopify-block-AYVh2eG5seWR6K0EzZ__6141582171523228424" class="shopify-block shopify-app-block">
10036<script src="//cdn.shopify.com/extensions/01a0ca72-e20e-7e37-b11b-69467298a8ea/29-adb7c67ff991881fe58b32352c944a481bbcbb8b/assets/BrazeUtilities.js" type="text/javascript"></script>
vendor: 1 bytes, line 10036
10036
10037<script src="//cdn.shopify.com/extensions/01a0ca72-e20e-7e37-b11b-69467298a8ea/29-adb7c67ff991881fe58b32352c944a481bbcbb8b/assets/BrazeBannerScript.js" type="text/javascript"></script>
10037
10038
10039<script type="text/javascript">
10040  const brazeWebSDKPoller = setInterval(()=>{
10041    // if the conditional is false, then we don't need to poll anymore and should clear the interval
10042    // if the conditional is true, but readValueFromLocalStorageWithRetry doesn't exist, we should retry
10043    // if the conditional is true and readValueFromLocalStorageWithRetry exists we should load the script and clear the interval
10044    readValueFromLocalStorageWithRetry('brazeAppSettings').then((data) => {
10045      loadScriptTag("https://cdn.shopify.com/extensions/01a0ca72-e20e-7e37-b11b-69467298a8ea/29-adb7c67ff991881fe58b32352c944a481bbcbb8b/assets/BrazeWebSdkScript.js", "module");
10046    });
10047    clearInterval(brazeWebSDKPoller);
10048  }, 2000)
10049</script>
10049
10050
10051
10052</div><div id="shopify-block-AR0ZQTGVQazVBTzRQU__11704793998288879478" class="shopify-block shopify-app-block">
10053
10054<script>
10055  // Define tealiumSettings window variable
10056  window.tealiumSettings = {};
10057  window.utag_cfg_ovrd = window.utag_cfg_ovrd || {}; // Tealium utag overrides.
10058  window.utag_cfg_ovrd.noview = true;
10059  window.utag_cfg_ovrd.readywait = false;
10060
10061  // get Value of cookie
10062  function getCookieVal(name) {
10063    const value = `; ${document.cookie}`;
10064    const parts = value.split(`; ${name}=`);
10065    if (parts.length === 2) {
10066      return parts.pop().split(';').shift();
10067    }
10068    return null;
10069  }
10070
10071  // set cookie in user's browser if not exist
10072  function setCookieVal(name, value, days) {
10073    if (getCookieVal(name) === '' || getCookieVal(name) === null || getCookieVal(name) === undefined) {
10074      let expires = '';
10075      if (days) {
10076        const date = new Date();
10077        date.setTime(date.getTime() + days * 24 * 60 * 60 * 1000);
10078        expires = '; expires=' + date.toUTCString();
10079      }
10080      document.cookie = name + '=' + (value || '') + expires + '; path=/';
10081    }
10082  }
10083
10084  // force set cookie - always updates
10085  function forceSetCookie(name, value, days) {
10086    let expires = '';
10087    if (days) {
10088      const date = new Date();
10089      date.setTime(date.getTime() + days * 24 * 60 * 60 * 1000);
10090      expires = '; expires=' + date.toUTCString();
10091    }
10092    document.cookie = name + '=' + (value || '') + expires + '; path=/';
10093  }
10094
10095  //remove cookie from user's browser if exist
10096  function removeCookie(name) {
10097    if (getCookieVal(name) !== '' || getCookieVal(name) !== null || getCookieVal(name) !== undefined) {
10098      document.cookie = name + '=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;';
10099    }
10100  }
10101
10102  // Check debug cookie once per page load and make it globally available
10103  window.isDebugEnabled = getCookieVal('tealium_debug');
10104
10105  // Helper function for conditional logging
10106  function debugLog(...args) {
10107    if (window.isDebugEnabled) {
10108      console.log('[Tealium Theme]', ...args);
10109    }
10110  }
10111
10112  // Make debugLog available globally for other snippets
10113  window.debugLog = debugLog;
10114
10115  // Handle debug mode and environment override
10116  // Debug is enabled if: (1) toggle is on, OR (2) environment override is provided
10117  const debugToggle = '0' === '1';
10118  const envOverride = '';
10119  const debugEnabled = debugToggle || envOverride !== '';
10120
10121  if (debugEnabled) {
10122    // Set tealium_debug cookie (with environment override if provided, otherwise just 'true')
10123    forceSetCookie('tealium_debug', envOverride !== '' ? envOverride : 'true', 1);
10124    forceSetCookie('utagdb', true, 1);
10125
10126    // Set environment override if provided
10127    if (envOverride !== '') {
10128      window.tealiumSettings.environment_ovd = envOverride;
10129    }
10130  } else {
10131    // if tealium_debug is disabled, then remove cookie from user's browser if exist
10132    removeCookie('tealium_debug');
10133    removeCookie('utagdb');
10134  }
10135
10136  // Handle markets debug window
10137  const marketsDebugToggle = '0' === '1';
10138
10139  if (marketsDebugToggle) {
10140    // Set markets_debug cookie
10141    forceSetCookie('markets_debug', 'true', 1);
10142  } else {
10143    // if markets_debug is disabled, then remove cookie from user's browser if exist
10144    removeCookie('markets_debug');
10145  }
10146
10147</script>
10147
10148  
10148<script>
10149    debugLog('Tealium Client Settings loaded');
10150    debugLog('Split cookie enabled:', false);
10151    debugLog('Split cookie allowlist:', '');
10152
10153    // Set split cookie configuration for utag.js AND tealium core
10154    const splitCookieEnabled = false;
10155
10156    if (splitCookieEnabled) {
10157      window.utag_cfg_ovrd.split_cookie = true;
10158
10159      // Set allowlist from metaobject
10160      try {
10161        // Use | json filter to properly serialize the value, then parse it
10162        const allowlistJson = [];
10163        if (allowlistJson) {
10164          // The value is stored as a JSON string, so parse it once
10165          const allowlist = typeof allowlistJson === 'string' ? JSON.parse(allowlistJson) : allowlistJson;
10166          window.utag_cfg_ovrd.split_cookie_allowlist = allowlist;
10167
10168          // Also set on tealiumSettings for tealium_core.liquid to use
10169          window.tealiumSettings.splitCookie = true;
10170          window.tealiumSettings.splitCookieAllowlist = allowlist;
10171
10172          debugLog('Split cookie allowlist set:', allowlist);
10173        }
10174      } catch (e) {
10175        console.error('[Tealium Theme] Failed to parse split_cookie_allowlist:', e);
10176      }
10177    } else {
10178      window.utag_cfg_ovrd.split_cookie = false;
10179      window.tealiumSettings.splitCookie = false;
10180      window.tealiumSettings.splitCookieAllowlist = [];
10181    }
10182  </script>
10182
10183
10184
10185
10186
10187  
10188  
10189
10190  
10191  
10191<script>
10192    debugLog('Tealium Meta Objects loaded');
10193    debugLog('Market:', 'us');
10194    debugLog('Using market override:', false);
10195    debugLog('Account:', 'esteelauder');
10196    debugLog('Client-side profile:', 'clinique-us-shopifytmp');
10197    debugLog('Server-side profile:', 'main');
10198    debugLog('Environment:', window.tealiumSettings.environment_ovd ?? 'prod');
10199    debugLog('First party domain:', '');
10200
10201    // Set Meta Object Values in window variable (market-aware)
10202    window.tealiumSettings.account = 'esteelauder';
10203    window.tealiumSettings.clientSideProfile = 'clinique-us-shopifytmp';
10204    window.tealiumSettings.serverSideProfile = 'main';
10205    window.tealiumSettings.environment = window.tealiumSettings.environment_ovd ?? 'prod';
10206    window.tealiumSettings.firstPartyDomain = '//tags.tiqcdn.com/utag/';
10207    window.tealiumSettings.ssFirstPartyDomain = 'https://collect.tealiumiq.com';
10208
10209    // These fields only exist on global config, not market profiles
10210    
10211      window.tealiumSettings.checkoutTracking = 'both_side';
10212      window.tealiumSettings.serverSideOnly = false;
10213      window.tealiumSettings.serverSideDataSourceId = 'iqrr6b';
10214      window.tealiumSettings.storefrontToken = '';
10215    
10216
10217    // Store data source ID in localStorage for custom pixel access (both_side mode)
10218    if (window.tealiumSettings.checkoutTracking === 'both_side' && window.tealiumSettings.serverSideDataSourceId) {
10219      try {
10220        localStorage.setItem('tealium_datasource', window.tealiumSettings.serverSideDataSourceId);
10221        debugLog('Data source ID stored in localStorage:', window.tealiumSettings.serverSideDataSourceId);
10222      } catch (e) {
10223        console.error('[Tealium Theme] Failed to store data source ID in localStorage:', e);
10224      }
10225    }
10226
10227    // Load custom data layer config for market overrides
10228    
10229  </script>
10229<!-- BEGIN app snippet: tealium_core -->
10229<script>
10230  (function () {
10231    'use strict';
10232
10233    // Tealium configuration using IIFE
10234    window.tealium = (function () {
10235      var tealium = {
10236        cookies: {},
10237        token: '',
10238        localdomain: window.location.hostname.replace('www.', ''),
10239        config: {
10240          account: window.tealiumSettings.account,
10241          clientProfile: window.tealiumSettings.clientSideProfile,
10242          serverProfile: window.tealiumSettings.serverSideProfile,
10243          environment: window.tealiumSettings.environment,
10244          storefrontToken: window.tealiumSettings.storefrontToken,
10245          dataSourceId: window.tealiumSettings.serverSideDataSourceId,
10246          ssFirstPartyDomain: window.tealiumSettings.ssFirstPartyDomain || 'https://collect.tealiumiq.com',
10247          domain: document.location.host,
10248          splitCookie: window.tealiumSettings.splitCookie || false,
10249          splitCookieAllowlist: window.tealiumSettings.splitCookieAllowlist || [],
10250        },
10251        currentPath: document.location.pathname,
10252      };
10253
10254      window.debugLog('Tealium Core initialized for:', tealium.config.account);
10255
10256      // Initialize tracking ID
10257      if (typeof tealium.hitid == 'undefined') {
10258        tealium.hitid = new Date().valueOf().toString() + Math.random().toString() + 0;
10259      }
10260
10261      if (typeof document.referrer !== 'undefined') {
10262        tealium.referrer = document.referrer;
10263      }
10264
10265      // Performance data
10266      tealium.navdata = performance.getEntriesByType('navigation');
10267      if (tealium.navdata.length > 0) {
10268        tealium.navigationEntries = performance.getEntriesByType('navigation')[0];
10269        tealium.ttfb = tealium.navigationEntries.responseStart - tealium.navigationEntries.requestStart;
10270      } else {
10271        tealium.ttfb = 'brokenSafariTTFB';
10272      }
10273
10274      // Function to get query string parameter
10275      tealium.getQueryParam = function (param) {
10276        var urlParams = new URLSearchParams(window.location.search);
10277        return urlParams.get(param) || '';
10278      };
10279
10280      // Cookie functions
10281      tealium.getCookie = function (c_name) {
10282        // If it's an array, get all cookies and return object
10283        if (Array.isArray(c_name)) {
10284          var result = {};
10285          for (var i = 0; i < c_name.length; i++) {
10286            var cookieName = c_name[i];
10287            if (document.cookie.length > 0) {
10288              var c_start = document.cookie.indexOf(cookieName + '=');
10289              if (c_start != -1) {
10290                c_start = c_start + cookieName.length + 1;
10291                var c_end = document.cookie.indexOf(';', c_start);
10292                if (c_end == -1) {
10293                  c_end = document.cookie.length;
10294                }
10295                result[cookieName] = unescape(document.cookie.substring(c_start, c_end));
10296              } else {
10297                result[cookieName] = '';
10298              }
10299            } else {
10300              result[cookieName] = '';
10301            }
10302          }
10303          return result;
10304        }
10305
10306        // Original single cookie logic
10307        if (document.cookie.length > 0) {
10308          var c_start = document.cookie.indexOf(c_name + '=');
10309          if (c_start != -1) {
10310            c_start = c_start + c_name.length + 1;
10311            var c_end = document.cookie.indexOf(';', c_start);
10312            if (c_end == -1) {
10313              c_end = document.cookie.length;
10314            }
10315            return unescape(document.cookie.substring(c_start, c_end));
10316          }
10317        }
10318        return '';
10319      };
10320
10321      tealium.setCookie = function (c_name, c_value, days) {
10322        var expires = '';
10323        if (days) {
10324          var date = new Date();
10325          date.setTime(date.getTime() + days * 24 * 60 * 60 * 1000);
10326          expires = '; expires=' + date.toUTCString();
10327        }
10328        document.cookie = c_name + '=' + c_value + expires + ';Path=/; domain=' + tealium.config.domain + ';';
10329        window.debugLog('Tealium: Cookie set:', c_name, '=', c_value);
10330      };
10331
10332      tealium.writeUtagMain = function (serialized, days, parseFunc, serializeFunc) {
10333        var COOKIE_NAME = 'utag_main';
10334
10335        // Check if cookie has delimiters (parseable format)
10336        var hasDelimiters = serialized.includes('$') && serialized.includes(':');
10337
10338        if (tealium.config.splitCookie && hasDelimiters) {
10339          // Split cookie mode: parse and separate by allowlist
10340          var cookieData = parseFunc(serialized);
10341          var allowlist = tealium.config.splitCookieAllowlist;
10342          var allowedData = {};
10343          var individualCookies = {};
10344
10345          window.debugLog('Tealium: Splitting cookies, allowlist:', allowlist);
10346
10347          Object.keys(cookieData).forEach(function (key) {
10348            if (cookieData[key] !== undefined && cookieData[key] !== '') {
10349              if (allowlist.includes(key)) {
10350                allowedData[key] = cookieData[key];
10351              } else {
10352                individualCookies[key] = cookieData[key];
10353              }
10354            }
10355          });
10356
10357          // Write utag_main with only allowlisted values
10358          var allowedSerialized = serializeFunc(allowedData);
10359          tealium.setCookie(COOKIE_NAME, allowedSerialized, days);
10360          window.debugLog('Tealium: utag_main written with allowlisted values:', allowedData);
10361
10362          // Write individual cookies for non-allowlisted values
10363          Object.keys(individualCookies).forEach(function (key) {
10364            var cookieName = 'utag_main_' + key;
10365            tealium.setCookie(cookieName, individualCookies[key], days);
10366          });
10367          window.debugLog('Tealium: Individual cookies written:', Object.keys(individualCookies));
10368
10369        } else {
10370          // Standard mode or unparseable format: write single combined cookie
10371          if (!hasDelimiters && tealium.config.splitCookie) {
10372            window.debugLog('Tealium: Cookie has no delimiters, preserving as-is (cannot split)');
10373          }
10374          tealium.setCookie(COOKIE_NAME, serialized, days);
10375        }
10376      };
10377
10378      tealium.delCookie = function (c_name) {
10379        document.cookie =
10380          c_name +
10381          '=' +
10382          null +
10383          ';Path=/; Expires=Thu, 01 Jan 1970 00:00:01 GMT; domain=' +
10384          tealium.config.domain +
10385          ';';
10386      };
10387
10388      tealium.manageUtagMain = function () {
10389        // --- Helpers ---
10390        function parseUtagMain(cookie) {
10391          const parts = {};
10392          cookie.split('$').forEach((p) => {
10393            if (!p) return;
10394            const [key, value] = p.split(':');
10395            parts[key] = value;
10396          });
10397          return parts;
10398        }
10399
10400        function serializeUtagMain(obj) {
10401          return Object.entries(obj)
10402            .map(([k, v]) => `${k}:${v}`)
10403            .filter(([k, v]) => v !== '' && v != null)
10404            .join('$');
10405        }
10406
10407        // --- Port of utag.js utag.ut.vi / utag.ut.pad (ut4.54) ---
10408        // Must stay byte-for-byte compatible with utag.js so v_ids we mint look
10409        // exactly like the ones utag.js mints (hex, no dashes).
10410        function pad(a, b) {
10411          a = '' + (a - 0).toString(16);
10412          let d = '';
10413          for (let c = 0; c < b - a.length; c++) d += '0';
10414          return d + a;
10415        }
10416
10417        function tealiumVid() {
10418          let a = pad(Date.now(), 12);
10419          const b = '' + Math.random();
10420          a += pad(b.substring(2, b.length), 16);
10421
10422          try {
10423            a += pad(navigator.plugins.length ? navigator.plugins.length : 0, 2);
10424            a += pad(navigator.userAgent.length, 3);
10425            a += pad(document.URL.length, 4);
10426            a += pad(navigator.appVersion.length, 3);
10427            a += pad(screen.width + screen.height + parseInt(screen.colorDepth ? screen.colorDepth : screen.pixelDepth), 5);
10428          } catch (e) {
10429            if (window.utag && typeof window.utag.DB === 'function') window.utag.DB(e);
10430            a += '12345';
10431          }
10432
10433          return a;
10434        }
10435
10436        // --- Constants ---
10437        const SESSION_DURATION = 30 * 60 * 1000; // 30 minutes
10438        const COOKIE_LIFETIME_DAYS = 395;
10439        const COOKIE_NAME = 'utag_main';
10440
10441        let utagMain = window.tealium.getCookie(COOKIE_NAME);
10442        let now = Date.now();
10443        let data;
10444
10445        // Existing v_id, if any: split_cookie (utag.js 4.50+) keeps it in its own
10446        // utag_main_v_id cookie, otherwise it lives inside utag_main.
10447        const vidMatch = utagMain ? utagMain.match(/v_id:([^$]+)/) : null;
10448        const existingVid = window.tealium.getCookie('utag_main_v_id') || (vidMatch ? vidMatch[1] : '');
10449
10450        // --- Determine cookie type ---
10451        const isNewFormat = utagMain && utagMain.includes('v_id:') && utagMain.includes('$_sn:');
10452
10453        if (!utagMain) {
10454          // No cookie → create new format, minting v_id the same way utag.js does
10455          data = {
10456            v_id: existingVid || tealiumVid(),
10457            _sn: 1,
10458            _se: 1,
10459            _ss: 1,
10460            _st: now + SESSION_DURATION,
10461            ses_id: Math.floor(Math.random() * 1e9),
10462            _pn: 1,
10463          };
10464          window.debugLog('Tealium: Created new utag_main cookie:', data.v_id);
10465        } else if (!isNewFormat) {
10466          // Legacy cookie → preserve as-is (never rewritten), report its existing v_id
10467          data = {
10468            v_id: existingVid,
10469            raw_cookie: utagMain,
10470          };
10471          window.debugLog('Tealium: Detected legacy utag_main cookie, using existing v_id:', existingVid);
10472        } else {
10473          // Existing new-format cookie
10474          data = parseUtagMain(utagMain);
10475          const expired = !data._st || now > parseInt(data._st, 10);
10476
10477          if (expired) {
10478            // Start new session
10479            data._sn = (parseInt(data._sn, 10) || 0) + 1;
10480            data._se = 1;
10481            data._ss = 1;
10482            data._st = now + SESSION_DURATION;
10483            data.ses_id = Math.floor(Math.random() * 1e9);
10484            data._pn = (parseInt(data._pn, 10) || 0) + 1;
10485
10486            window.debugLog('Tealium: Started new session:', data.ses_id);
10487          } else {
10488            // Continue current session
10489            data._ss = '';
10490            data._se = (parseInt(data._se, 10) || 0) + 1;
10491            data._pn = (parseInt(data._pn, 10) || 0) + 1;
10492            data._st = now + SESSION_DURATION;
10493
10494            window.debugLog('Tealium: Continued session:', data.ses_id);
10495          }
10496        }
10497
10498        // --- Write cookie ---
10499        const serialized = isNewFormat || !utagMain ? serializeUtagMain(data) : utagMain;
10500        window.tealium.writeUtagMain(serialized, COOKIE_LIFETIME_DAYS, parseUtagMain, serializeUtagMain);
10501
10502        return data;
10503      };
10504
10505      // Get OS detection
10506      tealium.getOS = function () {
10507        var platform = navigator.platform;
10508        if (platform.includes('Mac')) return 'mac';
10509        if (platform === 'iPhone') return 'iphone';
10510        if (platform === 'iPad') return 'ipad';
10511        if (platform === 'iPod') return 'ipod';
10512        if (platform.includes('Win')) return 'windows';
10513        if (platform.includes('Linux')) return 'linux';
10514        return 'other';
10515      };
10516
10517      // Send tracking data to Tealium collect endpoint
10518      tealium.sendToCollect = function (eventType, eventData) {
10519        window.debugLog('Tealium: Sending to collect endpoint:', eventType);
10520
10521        var utagMain = tealium.getCookie('utag_main');
10522
10523        if (!utagMain) {
10524          console.error('Tealium: Missing utag_main cookie');
10525          return;
10526        }
10527
10528        // Visitor id, the same lookup manageUtagMain uses above: split_cookie
10529        // (utag.js 4.50+) keeps v_id in its own utag_main_v_id cookie, otherwise it is
10530        // inside utag_main as v_id:xxx$. Reading utag_main alone sent an empty visitor
10531        // id on every browser event whenever split cookie was on.
10532        var vIdMatch = utagMain.match(/v_id:([^$]+)/);
10533        var visitorId = tealium.getCookie('utag_main_v_id') || (vIdMatch ? vIdMatch[1] : '');
10534
10535        var cookieNames = ['_fbc', '_fbp', '_ga', '_shopify_y', '_shopify_s', '__kla_id', '_ttp'];
10536        var cookies = tealium.getCookie(cookieNames);
10537
10538        // Get cart token from Shopify's cart cookie
10539        var cartToken = tealium.getCookie('cart') || '';
10540        if (!cartToken) {
10541          window.debugLog('Tealium: No cart token yet (expected on first page view)');
10542        }
10543
10544        var collectData = {
10545          // Event type
10546          tealium_event: eventType,
10547          'cp.utag_main': utagMain,
10548          tealium_visitor_id: visitorId,
10549
10550          // Cart token for correlation - CRITICAL
10551          cart_token: cartToken,
10552
10553          // Event-specific data
10554          page_url: window.location.href,
10555          page_title: document.title,
10556          timestamp: Date.now(),
10557          ttfb: tealium.ttfb,
10558          os: tealium.getOS(),
10559          referrer: tealium.referrer || '',
10560
10561          // Shop data
10562          shop_domain: 'www.clinique.com',
10563          page_type: 'cart',
10564        };
10565
10566        // Add cookies to collect data
10567        Object.keys(cookies).forEach(function (key) {
10568          if (cookies[key]) {
10569            collectData['cp.' + key] = cookies[key];
10570          }
10571        });
10572
10573        // Merge event data directly into collectData (flattened, not stringified)
10574        if (eventData && typeof eventData === 'object') {
10575          Object.keys(eventData).forEach(function (key) {
10576            collectData[key] = eventData[key];
10577          });
10578        }
10579
10580        window.debugLog('Tealium: Collect data:', collectData);
10581
10582        // Add Tealium configuration to payload (same as Lambda)
10583        var configBody = {
10584          tealium_account: tealium.config.account,
10585          tealium_profile: tealium.config.serverProfile,
10586          tealium_environment: tealium.config.environment
10587        };
10588
10589        // Add data source ID if available (for server-side tracking)
10590        if (tealium.config.dataSourceId) {
10591          configBody.tealium_datasource = tealium.config.dataSourceId;
10592        }
10593
10594        // Merge collect data with config (same as Lambda spread pattern)
10595        var payload = JSON.stringify({ ...collectData, ...configBody });
10596
10597        window.debugLog('Tealium: POST payload:', payload);
10598
10599        // Send via POST to /event endpoint (use first-party domain if configured)
10600        // Ensure ssFirstPartyDomain has trailing slash
10601        var domain = tealium.config.ssFirstPartyDomain;
10602        if (domain && !domain.endsWith('/')) {
10603          domain += '/';
10604        }
10605        const collectUrl = domain + 'event';
10606        window.debugLog('Tealium: Collect URL:', collectUrl);
10607
10608        fetch(collectUrl, {
10609          method: 'POST',
10610          headers: {
10611            'Content-Type': 'application/json'
10612          },
10613          body: payload
10614        })
10615          .then(function (response) {
10616            if (response.ok) {
10617              window.debugLog('Tealium: Data sent to collect endpoint successfully');
10618            } else {
10619              console.error('Tealium: Failed to send data, status:', response.status);
10620            }
10621          })
10622          .catch(function (error) {
10623            console.error('Tealium: Failed to send data to collect endpoint:', error);
10624          });
10625      };
10626
10627      // Function to get cart token via API
10628      tealium.getCartToken = function () {
10629        return fetch('/cart.js')
10630          .then(function (response) {
10631            return response.json();
10632          })
10633          .then(function (cart) {
10634            var fullToken = cart.token || null;
10635            return fullToken ? fullToken.split('?')[0] : null;
10636          })
10637          .catch(function (error) {
10638            console.warn('Tealium: Failed to get cart token:', error);
10639            return null;
10640          });
10641      };
10642
10643      // Return the tealium object
10644      return tealium;
10645    })();
10646
10647    // Initialize utag_main cookie
10648    window.tealium.manageUtagMain();
10649  })();
10650</script>
10650
10651  
10652    <!-- BEGIN app snippet: tealium_server_side -->
10653
10654
10655
10656
10657
10658<script>
10659  (function() {
10660    'use strict';
10661    window.debugLog('Tealium: Server Side Tracking Loaded');
10662
10663    // Send initial page view landing event
10664    window.tealium.getCartToken().then(function (cartToken) {
10665      window.tealium.token = cartToken;
10666      window.debugLog('Tealium: Cart token:', cartToken);
10667
10668      var landingData = {
10669        cart_token: cartToken,
10670      };
10671
10672      // Merge product data if on PDP
10673      if (window.tealiumProductData) {
10674        landingData = Object.assign({}, landingData, window.tealiumProductData);
10675        window.debugLog('Tealium: Product data added to landing event');
10676      }
10677
10678      // Merge customer data if logged in
10679      if (window.tealiumCustomerData) {
10680        landingData = Object.assign({}, landingData, window.tealiumCustomerData);
10681        window.debugLog('Tealium: Customer data added to landing event');
10682      }
10683
10684      // Merge collection data if on collection page
10685      if (window.tealiumCollectionData) {
10686        landingData = Object.assign({}, landingData, window.tealiumCollectionData);
10687        window.debugLog('Tealium: Collection data added to landing event');
10688      }
10689
10690      // Merge collection products array data
10691      if (window.tealiumCollectionProducts) {
10692        landingData = Object.assign({}, landingData, window.tealiumCollectionProducts);
10693        window.debugLog('Tealium: Collection products added to landing event');
10694      }
10695
10696      window.tealium.sendToCollect('landing', landingData);
10697    });
10698
10699    // Cart attributes state
10700    var lastCartToken = null;
10701    var isProcessing = false;
10702    var debounceTimer = null;
10703    var attributesAdded = false;
10704
10705    // Simple cookie getter
10706    window.tealium.getCookieSimple = function (name) {
10707      const value = `; ${document.cookie}`;
10708      const parts = value.split(`; ${name}=`);
10709      if (parts.length === 2) return parts.pop().split(';').shift();
10710      return null;
10711    };
10712
10713    // Capture and persist tracking params on every page load
10714    window.tealium.captureTrackingParams = function() {
10715      const urlParams = new URLSearchParams(window.location.search);
10716
10717      const trackingParams = [
10718        'fbclid', 'gclid', 'gbraid', 'wbraid', 'msclkid',
10719        'ttclid', 'twclid', 'li_fat_id', 'ScCid', '_kx'
10720      ];
10721      const utmParams = ['utm_source', 'utm_medium', 'utm_campaign', 'utm_term', 'utm_content'];
10722      const allParams = trackingParams.concat(utmParams);
10723
10724      allParams.forEach(function(param) {
10725        const value = urlParams.get(param);
10726        if (value) {
10727          sessionStorage.setItem('tealium_' + param, value);
10728          window.debugLog('Tealium: Captured param:', param, '=', value);
10729        }
10730      });
10731    };
10732
10733    window.tealium.getTealiumTrackingAttributes = function (cartToken) {
10734      const attributes = [];
10735
10736      // Get Tealium visitor data from utag_main cookie
10737      const utagMain = window.tealium.getCookieSimple('utag_main');
10738      if (utagMain) attributes.push({ key: 'tealium_utag_main', value: utagMain });
10739
10740      // The Tealium visitor id, read straight from the data layer utag.js builds.
10741      // This is what server-side events stitch on, and it is not always in
10742      // utag_main, so it goes on the cart as its own attribute.
10743      const visitorId =
10744        window.utag && window.utag.data ? window.utag.data['cp.utag_main_v_id'] : null;
10745      if (visitorId) {
10746        attributes.push({ key: 'tealium_visitor_id', value: visitorId });
10747      } else {
10748        window.debugLog('Tealium: No visitor id on utag.data, cart attribute omitted');
10749      }
10750
10751      // Add cart token - CRITICAL for correlation
10752      if (cartToken) {
10753        attributes.push({ key: 'tealium_cart_token', value: cartToken });
10754      }
10755
10756      // Retrieve persisted tracking params from sessionStorage
10757      const trackingParams = [
10758        'fbclid', 'gclid', 'gbraid', 'wbraid', 'msclkid',
10759        'ttclid', 'twclid', 'li_fat_id', 'ScCid', '_kx'
10760      ];
10761      const utmParams = ['utm_source', 'utm_medium', 'utm_campaign', 'utm_term', 'utm_content'];
10762      const allParams = trackingParams.concat(utmParams);
10763
10764      allParams.forEach(function(param) {
10765        const value = sessionStorage.getItem('tealium_' + param);
10766        if (value) {
10767          attributes.push({ key: 'tealium_' + param, value: value });
10768        }
10769      });
10770
10771      window.debugLog('Tealium: Attributes to add to cart:', attributes);
10772      return attributes;
10773    };
10774
10775    window.tealium.updateCartAttributesWithTracking = function (cartToken, trackingAttributes) {
10776      const getCartQuery = `
10777        query getCart($cartId: ID!) {
10778            cart(id: $cartId) {
10779                attributes {
10780                    key
10781                    value
10782                }
10783            }
10784        }
10785    `;
10786
10787      const updateMutation = `
10788        mutation cartAttributesUpdate($cartId: ID!, $attributes: [AttributeInput!]!) {
10789            cartAttributesUpdate(cartId: $cartId, attributes: $attributes) {
10790                cart {
10791                    id
10792                    attributes {
10793                        key
10794                        value
10795                    }
10796                }
10797                userErrors {
10798                    field
10799                    message
10800                }
10801            }
10802        }
10803    `;
10804
10805      try {
10806        const cartId = `gid://shopify/Cart/${cartToken}`;
10807        const storefrontToken = window.tealium.config.storefrontToken;
10808
10809        if (!storefrontToken) {
10810          console.error('Tealium: No storefront token available');
10811          return;
10812        }
10813
10814        fetch(`https://${window.Shopify.shop}/api/2025-01/graphql.json`, {
10815          method: 'POST',
10816          headers: {
10817            'Content-Type': 'application/json',
10818            'X-Shopify-Storefront-Access-Token': storefrontToken,
10819          },
10820          body: JSON.stringify({
10821            query: getCartQuery,
10822            variables: { cartId },
10823          }),
10824        })
10825          .then(function (cartResponse) {
10826            return cartResponse.json();
10827          })
10828          .then(function (cartResult) {
10829            window.debugLog('Tealium: Cart query result:', cartResult);
10830
10831            const cart = cartResult.data?.cart;
10832
10833            if (!cart) {
10834              console.error('Tealium: Cart not found');
10835              return;
10836            }
10837
10838            const existingAttributes = cart.attributes || [];
10839
10840            // Check if our tracking attributes already exist
10841            const hasTealiumAttributes = existingAttributes.some((attr) => attr.key.startsWith('tealium_'));
10842            if (hasTealiumAttributes) {
10843              window.debugLog('Tealium: Tracking attributes already exist');
10844              return;
10845            }
10846
10847            // Merge existing with new tracking attributes
10848            const allAttributes = [...existingAttributes, ...trackingAttributes];
10849
10850            window.debugLog('Tealium: Merging attributes:', {
10851              existing: existingAttributes,
10852              new: trackingAttributes,
10853              merged: allAttributes,
10854            });
10855
10856            // Update with all attributes
10857            return fetch(`https://${window.Shopify.shop}/api/2025-01/graphql.json`, {
10858              method: 'POST',
10859              headers: {
10860                'Content-Type': 'application/json',
10861                'X-Shopify-Storefront-Access-Token': storefrontToken,
10862              },
10863              body: JSON.stringify({
10864                query: updateMutation,
10865                variables: {
10866                  cartId,
10867                  attributes: allAttributes,
10868                },
10869              }),
10870            })
10871              .then(function (updateResponse) {
10872                return updateResponse.json();
10873              })
10874              .then(function (updateResult) {
10875                window.debugLog('Tealium: Cart attributes update result:', updateResult);
10876
10877                if (updateResult.errors) {
10878                  console.error('Tealium: Cart attributes update failed:', updateResult.errors);
10879                } else if (updateResult.data?.cartAttributesUpdate?.userErrors?.length > 0) {
10880                  console.error(
10881                    'Tealium: Cart attributes update user errors:',
10882                    updateResult.data.cartAttributesUpdate.userErrors
10883                  );
10884                } else {
10885                  window.debugLog('Tealium: Cart attributes updated successfully');
10886                  sessionStorage.setItem('tealiumCartAttributesVerified_' + cartToken, 'true');
10887                }
10888              })
10889              .catch(function (error) {
10890                console.error('Tealium: Failed to update cart attributes:', error);
10891              });
10892          })
10893          .catch(function (error) {
10894            console.error('Tealium: Failed to fetch cart:', error);
10895          });
10896      } catch (error) {
10897        console.error('Tealium: Failed to update cart attributes:', error);
10898      }
10899    };
10900
10901    // Intercept fetch for cart requests
10902    var originalFetch = window.fetch;
10903    window.fetch = function() {
10904      var args = arguments;
10905      var url = args[0];
10906
10907      var isCartRequest = typeof url === 'string' &&
10908        (url.includes('/cart/add') || url.includes('/cart/change') || url.includes('/cart/update'));
10909
10910      return originalFetch.apply(this, args).then(function(response) {
10911        if (isCartRequest && response.ok && !attributesAdded) {
10912          window.debugLog('Tealium: Cart request detected via fetch');
10913          setTimeout(function() {
10914            window.tealium.addAttributesOnce();
10915          }, 200);
10916        }
10917        return response;
10918      });
10919    };
10920
10921    // Intercept XHR for cart requests
10922    var originalOpen = XMLHttpRequest.prototype.open;
10923    var originalSend = XMLHttpRequest.prototype.send;
10924
10925    XMLHttpRequest.prototype.open = function(method, url, async, user, pass) {
10926      this._interceptedUrl = url;
10927      return originalOpen.apply(this, arguments);
10928    };
10929
10930    XMLHttpRequest.prototype.send = function(body) {
10931      var url = this._interceptedUrl;
10932      var isCartRequest = url &&
10933        (url.includes('/cart/add') || url.includes('/cart/change') || url.includes('/cart/update'));
10934
10935      if (isCartRequest && !attributesAdded) {
10936        window.debugLog('Tealium: Cart request detected via XHR');
10937        this.addEventListener('load', function() {
10938          if (this.status >= 200 && this.status < 300) {
10939            setTimeout(function() {
10940              window.tealium.addAttributesOnce();
10941            }, 200);
10942          }
10943        });
10944      }
10945      return originalSend.apply(this, arguments);
10946    };
10947
10948    // Add attributes only once
10949    window.tealium.addAttributesOnce = function() {
10950      if (attributesAdded) {
10951        window.debugLog('Tealium: Attributes already added, skipping');
10952        return;
10953      }
10954
10955      fetch('/cart.js')
10956        .then(function(response) { return response.json(); })
10957        .then(function(cart) {
10958          if (cart.token && cart.item_count > 0) {
10959            window.debugLog('Tealium: Cart found:', cart.token);
10960            attributesAdded = true;
10961
10962            if (window.tealium.config.storefrontToken) {
10963              var trackingAttributes = window.tealium.getTealiumTrackingAttributes(cart.token);
10964              if (trackingAttributes.length > 0) {
10965                window.tealium.updateCartAttributesWithTracking(cart.token, trackingAttributes);
10966              }
10967            } else {
10968              window.debugLog('Tealium: Storefront API disabled, skipping cart attributes');
10969            }
10970          }
10971        })
10972        .catch(function(error) {
10973          console.error('Tealium: Failed in addAttributesOnce:', error);
10974        });
10975    };
10976
10977    window.tealium.observeCartChanges = function () {
10978      var cartObserver = new PerformanceObserver(function (list) {
10979        list.getEntries().forEach(function (entry) {
10980          var isValidRequestType = ['xmlhttprequest', 'fetch'].includes(entry.initiatorType);
10981          var isCartJsRequest = entry.name.includes('/cart.js');
10982
10983          if (isValidRequestType && isCartJsRequest && !isProcessing) {
10984            clearTimeout(debounceTimer);
10985            debounceTimer = setTimeout(window.tealium.checkForCartChanges, 500);
10986          }
10987        });
10988      });
10989      cartObserver.observe({ entryTypes: ['resource'] });
10990    };
10991
10992    window.tealium.checkForCartChanges = function () {
10993      if (isProcessing) return;
10994
10995      try {
10996        isProcessing = true;
10997
10998        fetch('/cart.js')
10999          .then(function (response) {
11000            return response.json();
11001          })
11002          .then(function (cart) {
11003            if (
11004              cart.item_count > 0 &&
11005              cart.token !== lastCartToken &&
11006              !sessionStorage.getItem('cart_' + cart.token)
11007            ) {
11008              window.debugLog('Tealium: New cart detected:', cart.token);
11009              lastCartToken = cart.token;
11010              window.tealium.handleCartChange(cart);
11011            }
11012          })
11013          .catch(function (error) {
11014            console.error('Tealium: Failed to check cart changes:', error);
11015          })
11016          .finally(function () {
11017            setTimeout(function () {
11018              isProcessing = false;
11019            }, 2000);
11020          });
11021      } catch (error) {
11022        console.error('Tealium: Failed to check cart changes:', error);
11023        setTimeout(function () {
11024          isProcessing = false;
11025        }, 2000);
11026      }
11027    };
11028
11029    window.tealium.handleCartChange = function (cart) {
11030      try {
11031        const cartToken = cart.token;
11032        sessionStorage.setItem('cart_' + cartToken, 'true');
11033
11034        if (window.tealium.config.storefrontToken) {
11035          const trackingAttributes = window.tealium.getTealiumTrackingAttributes(cartToken);
11036          if (trackingAttributes.length > 0) {
11037            window.debugLog('Tealium: Adding tracking attributes to cart:', cartToken);
11038            window.tealium.updateCartAttributesWithTracking(cartToken, trackingAttributes);
11039          }
11040        } else {
11041          window.debugLog('Tealium: Storefront API disabled, skipping cart attributes');
11042        }
11043
11044        // Send cart change event to collect endpoint
11045        window.tealium.sendToCollect('cart_cl_updated', {
11046          cart_token: cartToken
11047        });
11048      } catch (error) {
11049        console.error('Tealium: Failed to handle cart change:', error);
11050      }
11051    };
11052
11053    window.tealium.checkExistingCart = function () {
11054      fetch('/cart.js')
11055        .then(function (response) {
11056          return response.json();
11057        })
11058        .then(function (cart) {
11059          if (cart.token && cart.item_count > 0) {
11060            window.debugLog('Tealium: Existing cart found on page load:', cart.token);
11061            window.tealium.handleCartChange(cart);
11062          } else {
11063            window.debugLog('Tealium: No existing cart found');
11064          }
11065        })
11066        .catch(function (error) {
11067          console.error('Tealium: Failed to check existing cart:', error);
11068        });
11069    };
11070
11071    document.addEventListener('DOMContentLoaded', function () {
11072      // Capture tracking params from URL on every page load
11073      window.tealium.captureTrackingParams();
11074
11075      window.tealium.observeCartChanges();
11076      // Check for existing cart when page loads
11077      setTimeout(window.tealium.checkExistingCart, 1000);
11078    });
11079  })();
11080</script>
11080
11081<!-- END app snippet -->
11082  
11083
11084<!-- END app snippet -->
11085
11086    <!-- BEGIN app snippet: tealium_client -->
11086<script>
11087  window.utag_data = {};
11088  function isCart(){
11089
11090     window.utag_data = {
11091      "site_section": "cart",
11092      "product_id": [
11093      
11094      ],
11095      "product_quantity": [
11096      
11097      ],
11098      "product_price": [
11099      
11100      ],
11101      "product_name": [
11102      
11103      ],
11104      "product_sku": [
11105      
11106      ],
11107      "page_type": "cart"
11108   }
11109
11110  }
11111
11112  function isProduct(){
11113
11114       window.utag_data = {
11115
11116      "site_section": "product",
11117      "product_id" : [""],
11118      "product_name" : [""],
11119      "product_brand" : [""],
11120
11121      
11122
11123      "page_type": "product"
11124    }
11125
11126  }
11127
11128
11129// Non Checkout sections
11130      var ptype = "cart";
11131      window.debugLog("page type:", ptype )
11132
11133     if (ptype == 'cart'){
11134
11135         isCart();
11136
11137     }else if (ptype =="collection"){
11138
11139         window.utag_data = {
11140          "site_section": "collection",
11141          "page_type": "collection"
11142        }
11143
11144     }else if (ptype == "product"){
11145
11146       isProduct();
11147
11148     }else if (ptype =="page"){
11149         window.utag_data = {
11150          "site_section": "page",
11151          "page_type": "page"
11152        }
11153     }else if(ptype == "search"){
11154         window.utag_data = {
11155            "site_section": "search",
11156            "search_results": "",
11157            "search_keyword": "",
11158            "page_type": "search"
11159        }
11160
11161     }else if (ptype =="index"){
11162
11163          window.utag_data = {
11164          "site_section": "home",
11165          "page_type": "home"
11166        }
11167
11168     }
11169
11170// Global UDO Vars
11171var GlobalUDO = {
11172
11173"page_name": "Your Shopping Cart",
11174"language_code": "en",
11175
11176
11177  "customer_logged_in": "false",
11178
11179
11180
11181
11182  "cart_total_items": "0",
11183  "cart_total_value": "0.00",
11184
11185
11186};
11187
11188// Add server-side data source ID for both_side mode
11189if (window.tealiumSettings.checkoutTracking === 'both_side' && window.tealiumSettings.serverSideDataSourceId) {
11190  GlobalUDO.tealium_datasource = window.tealiumSettings.serverSideDataSourceId;
11191}
11192
11193window.utag_data = {...window.utag_data, ...GlobalUDO};
11194
11195// Merge custom data layer config if exists (market overrides)
11196if (window.tealiumSettings.customDataLayer) {
11197  window.debugLog('Merging custom data layer config into utag_data');
11198  window.utag_data = {...window.utag_data, ...window.tealiumSettings.customDataLayer};
11199  window.debugLog('Custom data layer merged:', window.tealiumSettings.customDataLayer);
11200}
11201</script>
11201
11202
11203<script type="text/javascript">
11204  // Load utag.js using client-side profile
11205  (function (a, b, c, d) {
11206    // Ensure firstPartyDomain has trailing slash and handle "null" string
11207    var domain = window.tealiumSettings.firstPartyDomain;
11208    var useFirstParty = domain && domain !== 'null' && domain !== '' && domain !== '//tags.tiqcdn.com/utag/';
11209
11210    if (!useFirstParty) {
11211      domain = '//tags.tiqcdn.com/utag/';
11212    }
11213    if (domain && !domain.endsWith('/')) {
11214      domain += '/';
11215    }
11216
11217    // When using first-party domain, don't append account (it's already in the domain path)
11218    // Standard CDN: //tags.tiqcdn.com/utag/{account}/{profile}/{env}/utag.js
11219    // First-party:  https://data.example.com/{profile}/{env}/utag.js
11220    a = domain +
11221      (useFirstParty ? '' : window.tealiumSettings.account + '/') +
11222      window.tealiumSettings.clientSideProfile +  // Use client-side profile
11223      '/' +
11224      window.tealiumSettings.environment +
11225      '/' +
11226      'utag.js';
11227    b = document;
11228    c = 'script';
11229    d = b.createElement(c);
11230    d.src = a;
11231    d.type = 'text/java' + c;
11232    d.async = true;
11233    a = b.getElementsByTagName(c)[0];
11234    a.parentNode.insertBefore(d, a);
11235  })();
11236</script>
11236
11237
11238<!-- BEGIN app snippet: tealium_que -->
11238<script>
11239  window.debugLog('QUE File from Theme APP');
11240
11241  var ptype = "cart";
11242
11243  
11244
11245  
11246    // Set empty que if it doesn't already exist
11247    if (!localStorage.getItem('tealium_que')) {
11248       localStorage.setItem('tealium_que',JSON.stringify([]));
11249    }  
11250  
11251
11252    //DOM Loaded - check cookie in case we missed it on last page.
11253    
11254    // manual cookie check
11255    function hasCookie(name) {
11256      return document.cookie.split(';').some(c => c.trim().startsWith(name + '='));
11257    }
11258    
11259    function delete_cookie(name) {
11260        document.cookie = name + '=;expires=Thu, 01 Jan 1970 00:00:01 GMT;';
11261    };
11262    
11263    function setCookie(name, value, days) {
11264    const expires = new Date();
11265    expires.setTime(expires.getTime() + (days * 24 * 60 * 60 * 1000));
11266    document.cookie = `${name}=${value};expires=${expires.toUTCString()};path=/`;
11267    }
11268
11269
11270    // not used, but keeping it around in case we need it for edge case.   
11271    function poll_it(){    
11272         var sleep = duration => new Promise(resolve => setTimeout(resolve, duration));      
11273         var poll = (promiseFn, duration) => {
11274             return promiseFn().then(() => {
11275                 return sleep(duration).then(() => {
11276                     // If the cookie has been found, resolve with 'stop'
11277                     if (hasCookie('tealium_que')) {
11278                         console.log("Triggered Que Process -check_cookie Poll");
11279                         return 'stop';
11280                     } else {
11281                         // If the cookie hasn't been found, continue polling
11282                         return poll(promiseFn, duration);
11283                     }
11284                 });
11285             });
11286         };
11287         
11288         poll(() => {
11289             return new Promise(resolve => {
11290                 window.debugLog('Check Cookie');
11291                 resolve(); // Resolve the promise to continue polling
11292             });
11293         }, 1000).then(result => {
11294             if (result === 'stop') {
11295                 window.debugLog('Polling stopped.');
11296                 process_que();
11297             }
11298         });
11299      
11300    }
11301     
11302    // change event where supported
11303    window.debugLog("ENTERING COOKIE HANDLERS   ---------------------------------")
11304    var cookieDesc = Object.getOwnPropertyDescriptor(Document.prototype, 'cookie') || Object.getOwnPropertyDescriptor(HTMLDocument.prototype, 'cookie'); 
11305    if (typeof window.cookieStore !== 'undefined'){
11306      window.cookieStore.addEventListener('change', function(c){ 
11307         if (c.changed.length > 0){  // don't care about deletes, just in case checking the array and not assuming ours is the only change.
11308            //console.log(c);
11309            c.changed.forEach(function(c_list){
11310               if (c_list.name == 'tealium_que'){
11311                  // process que
11312                  window.debugLog("Triggered Que Process - cookiestore");
11313                  process_que();
11314               }
11315            })
11316         }
11317      });
11318    } else if (cookieDesc && cookieDesc.configurable) {
11319        Object.defineProperty(document, 'cookie', {
11320            get: function() {
11321                return cookieDesc.get.call(document);
11322            },
11323            set: function(val) {
11324                //window.debugLog(val);
11325                if (val.match(/tealium_que=pending/) ) {
11326                    window.debugLog("Safari iOS Cookie Caught!!");
11327                    process_que();
11328                    cookieDesc.set.call(document, val);
11329                }
11330                else {
11331                    cookieDesc.set.call(document, val);
11332                }
11333            }
11334        });
11335    }
11336
11337    // All for nav changes, if for some reason the que didn't already get triggered. use send beacon or fetch with keepalive!!!!!
11338    document.onvisibilitychange = () => {
11339      window.debugLog("Vis State ",document.visibilityState);
11340      if (document.visibilityState === "hidden") {
11341        window.debugLog("Triggered Que Process - onvisibilitychange");
11342        process_que()
11343      }
11344    };
11345
11346    function process_que(){
11347      // grab local storage and fire tealium events    
11348      let que = JSON.parse( localStorage.getItem('tealium_que')) ;
11349      if (que){
11350        if (que.length < 1){
11351           window.debugLog("Que len ",que.length)
11352           delete_cookie('tealium_que'); // just in case we double fire somehow
11353           return;
11354        }else{
11355           window.debugLog("QUE Has Items");
11356           window.debugLog("Que to process ", que)
11357           que_events_to_tealium(que); // sync call as is all localStorage
11358           clear_que();
11359        }
11360      }
11361    } 
11362
11363
11364function cartReduce(cart){
11365
11366 const indexedData = cart.reduce((acc, item) => {
11367  acc[item.variant_id] = item;
11368  return acc;
11369 }, {});
11370
11371 return indexedData;
11372}
11373
11374function get_current_cart(caller,t){
11375  fetch(window.Shopify.routes.root + 'cart.js', {
11376    method: 'GET',
11377  })
11378  .then(response => {
11379    if (!response.ok) {
11380        throw new Error('Network response was not ok');
11381    }
11382    return response.json();
11383  })
11384  .then(data => {
11385    window.debugLog("CART FROM FETCH: ", data);
11386     caller.call(this,data,t)
11387  })
11388  .catch(error => {
11389    console.error('There was a problem with the fetch operation:', error);
11390  });
11391}  
11392
11393function cart_update(current_cart, apdata){
11394
11395  var eventData = apdata.event_data.cartLine;
11396  var product = eventData.merchandise.product;
11397  var full_cart = current_cart;
11398  var shop_cart = full_cart.items;
11399  let cart = cartReduce(shop_cart);
11400
11401  window.debugLog("FULL CART ",full_cart) ;
11402  window.debugLog("CART ITEMS ",cart);
11403 
11404    // Preparing the Tealium tag data
11405    var tealiumTagData = {
11406      tealium_event: apdata.event_name,
11407      product_id: Array.of(eventData.merchandise.id), // variant
11408      product_name: Array.of(eventData.merchandise.untranslatedTitle || product.untranslatedTitle),
11409      product_unit_price: Array.of(eventData.merchandise.price.amount),
11410      product_quantity: Array.of(eventData.quantity),
11411      product_brand: Array.of(product.vendor),
11412      product_category: Array.of(product.product_type || ""),
11413      product_image_url: Array.of(eventData.merchandise.image.src),
11414      product_url: Array.of(product.url),
11415      product_one_variant: Array.of(product.hasOnlyDefaultVariant),
11416      product_main_id: Array.of(product.id),
11417      product_normal_price: Array.of(eventData.merchandise.price.amount),
11418      product_currency: full_cart.currency
11419    };
11420
11421    // Firing the Tealium tag
11422
11423    tealiumTagData   = {...window.utag_data, ...tealiumTagData}; 
11424  
11425    utag.link(tealiumTagData);
11426     
11427   }
11428    
11429function cart_view(data){  
11430      var eventData = data.event_data.cart; 
11431      // Preparing the Tealium tag data
11432      var tealiumTagData = {
11433       tealium_event: 'cart_view',
11434       tealium_event: data.event_name,
11435       product_id: eventData.lines.map(line => line.merchandise.product.id),
11436       product_name: eventData.lines.map(line => line.merchandise.product.untranslatedTitle),
11437       product_brand: eventData.lines.map(line => line.merchandise.product.vendor), 
11438       product_category: eventData.lines.map(line => line.merchandise.product.type),  
11439       product_url: eventData.lines.map(line => line.merchandise.product.url), 
11440       product_unit_price: eventData.lines.map(line => line.merchandise.price.amount),
11441       product_image_url:  eventData.lines.map(line => line.merchandise.image.src),    
11442       product_quantity: eventData.lines.map(line => line.quantity),       
11443       product_currency: Shopify.currency.active,
11444       cart_total_items: eventData.totalQuantity,
11445       cart_total_value: eventData.cost.totalAmount.amount 
11446      };
11447       // Firing the Tealium tag
11448  
11449      tealiumTagData   = {...window.utag_data, ...tealiumTagData};  
11450       
11451      utag.view(tealiumTagData);
11452    }
11453
11454
11455function search(data){ // handled in main app-embed, not sure if we really need the event at all. 
11456  var eventData = data.event_data.searchResult;
11457  var tealiumTagData = {
11458       tealium_event: "search",
11459       site_section: "search",
11460       page_type: "search",
11461       search_results: eventData.productVariants.length,
11462       search_keyword: eventData.query,
11463       product_on_page: eventData.productVariants.map(product => product.id)
11464  }
11465   tealiumTagData   = {...window.utag_data, ...tealiumTagData}; 
11466   utag.link(tealiumTagData);
11467 
11468}
11469
11470function collection_view(data){
11471   //window.utag_cfg_ovrd.noview = true
11472   var eventData = data.event_data.collection;  //productVariants && title
11473    window.debugLog("Collection data from Que", data)
11474    
11475    var tealiumTagData = {
11476 
11477     tealium_event: "category_view",
11478     product_on_page: eventData.productVariants.map(product => product.id)
11479
11480    }
11481    tealiumTagData   = {...window.utag_data, ...tealiumTagData}; 
11482    utag.link(tealiumTagData);
11483}  
11484
11485  
11486function product_view(data){
11487   //window.utag_cfg_ovrd.noview = true
11488   var eventData = data.productVariant;  //productVariants && title
11489    window.debugLog("Product data ", data)
11490    var tealiumTagData = {
11491 
11492     tealium_event: "product_view"
11493
11494    }
11495    tealiumTagData   = {...window.utag_data, ...tealiumTagData}; 
11496    utag.link(tealiumTagData);
11497}  
11498
11499function page_view(data){
11500 
11501    var tealiumTagData = {
11502     tealium_event: "page_view"
11503    }
11504  
11505    tealiumTagData   = {...window.utag_data, ...tealiumTagData}; 
11506    utag.view(tealiumTagData);
11507}    
11508 
11509 
11510  
11511function que_events_to_tealium(q_data){
11512
11513      // Check if utag is ready before processing events
11514      if (typeof utag === 'undefined') {
11515          window.debugLog('utag not yet loaded, waiting...');
11516
11517          // Poll for utag to be ready
11518          var checkUtag = setInterval(function() {
11519              if (typeof utag !== 'undefined') {
11520                  window.debugLog('utag loaded, processing queue');
11521                  clearInterval(checkUtag);
11522                  processEvents(q_data);
11523              }
11524          }, 100); // Check every 100ms
11525
11526          // Timeout after 10 seconds
11527          setTimeout(function() {
11528              if (typeof utag === 'undefined') {
11529                  console.error('utag failed to load after 10 seconds, queue not processed');
11530                  clearInterval(checkUtag);
11531              }
11532          }, 10000);
11533
11534          return;
11535      }
11536
11537      // If utag is already loaded, process immediately
11538      processEvents(q_data);
11539    }
11540
11541function processEvents(q_data) {
11542      //utag.view(event data blah blah)
11543      q_data.forEach(function(t){
11544          window.debugLog("Mapping Events utag.view")
11545          window.debugLog("Parsing Event Data",t.name);
11546          window.debugLog("Firing utag.views");
11547          if (t.name && !t.event_name){
11548            t.event_name = t.name
11549          }
11550          if (!t.event_name){
11551            console.error("DOM EVENT DETECTED",t)
11552          }
11553
11554          switch (t.event_name) {
11555            case 'page_view':
11556              window.debugLog('SENDING Page View');
11557              page_view(t);
11558              break;
11559            case 'category_view':
11560              window.debugLog('SENDING Collection View');
11561              collection_view(t);
11562              break;
11563            case 'product_view':
11564              window.debugLog("SENDING Product View");
11565              product_view(t);
11566              break;
11567            case 'cart_add':
11568              window.debugLog('SENDING: add to cart');
11569              get_current_cart(cart_update, t);
11570            break;
11571            case 'cart_remove':
11572              window.debugLog('SENDING: removed cart')
11573              get_current_cart(cart_update, t);
11574            break;
11575            case 'cart_view':
11576              window.debugLog('SENDING: cart_view');
11577              cart_view(t);
11578            break;
11579            case 'search':
11580              window.debugLog('SENDING: search');
11581              search(t);
11582              break;
11583            default:
11584               window.debugLog('------------Unhanded Event-', t.event_name);
11585          }
11586      });
11587
11588    // TODO:  checkout_started,
11589    }
11590    
11591function clear_que(){
11592        localStorage.setItem('tealium_que',JSON.stringify([])); 
11593        delete_cookie('tealium_que');
11594    }
11595</script>
11595<!-- END app snippet -->
11596<!-- END app snippet -->
11597  
11598
11599<!-- BEGIN app snippet: market-switcher-dev -->
11600
11601
11602
11603
11604
11605
11606
11607
11608<div id="tealium-markets-debug" style="display: none; position: fixed; top: 50%; right: 20px; transform: translateY(-50%); background: white; border: 2px solid #000; padding: 15px; z-index: 9999; font-family: monospace; font-size: 11px; box-shadow: 0 2px 10px rgba(0,0,0,0.2); max-width: 300px; max-height: 80vh; overflow-y: auto;">
11609  <h3 style="margin: 0 0 10px 0; font-size: 14px; border-bottom: 2px solid #000; padding-bottom: 5px;">Market Debug</h3>
11610
11611  <p style="margin: 0 0 3px 0;"><strong>Market:</strong> us</p>
11612  <p style="margin: 0 0 10px 0;"><strong>Country:</strong> US</p>
11613
11614  <div style="margin: 10px 0; padding: 8px; background: #e3f2fd; border: 2px solid #2196F3; font-size: 10px;">
11615    <p style="margin: 0 0 3px 0; font-weight: bold; color: #1976D2;">DEBUG INFO:</p>
11616    <p style="margin: 2px 0;">Market handle: "us"</p>
11617    <p style="margin: 2px 0;">Global config exists: NO</p>
11618    <p style="margin: 2px 0;">Market profile exists: NO</p>
11619    
11620  </div>
11621
11622  
11623    <p style="margin: 0 0 5px 0; padding: 5px; background: #FFD700; border: 1px solid #FFA500;"><strong>Using Global Config</strong></p>
11624  
11625
11626  
11627
11628  
11629    <div style="margin: 10px 0; padding: 10px; background: #f5f5f5; border: 1px solid #ccc;">
11630      <p style="margin: 0 0 5px 0; font-weight: bold;">ACTIVE CONFIG:</p>
11631      <p style="margin: 0 0 3px 0;"><strong>Account:</strong> esteelauder</p>
11632      <p style="margin: 0 0 3px 0;"><strong>Environment:</strong> prod</p>
11633
11634      
11635        <p style="margin: 0 0 3px 0;"><strong>Client Profile:</strong> clinique-us-shopifytmp</p>
11636      
11637
11638      
11639        <p style="margin: 0 0 3px 0;"><strong>Server Profile:</strong> main</p>
11640      
11641
11642      
11643
11644      
11645    </div>
11646  
11647
11648  <form method="post" action="/localization" id="MarketSwitcherForm" accept-charset="UTF-8" class="shopify-localization-form" enctype="multipart/form-data"><input type="hidden" name="form_type" value="localization" /><input type="hidden" name="utf8" value="✓" /><input type="hidden" name="_method" value="put" /><input type="hidden" name="return_to" value="/cart" />
11649    <label style="display: block; margin: 10px 0 5px 0;">Switch Country:</label>
11650    <select name="country_code" style="width: 100%; padding: 5px; margin-bottom: 8px;">
11651      
11652        <option value="US" selected>
11653          United States (US)
11654        </option>
11655      
11656    </select>
11657
11658    <label style="display: block; margin: 5px 0;">Switch Language:</label>
11659    <select name="language_code" id="languageSelector" style="width: 100%; padding: 5px; margin-bottom: 8px;">
11660      
11661      
11662      
11663        
11664          
11665            
11666            <option value="en" selected>
11667              English (en)
11668            </option>
11669          
11670        
11671      
11672    </select>
11673
11674    <button type="submit" style="width: 100%; padding: 8px; background: #4CAF50; color: white; border: none; cursor: pointer; font-weight: bold;">Apply</button>
11675  </form>
11676
11677  
11677<script>
11678    (function() {
11679      // Build map of country -> available languages
11680      var countryLanguages = {
11681        
11682          'US': ['en']
11683        
11684      };
11685
11686      var countrySelect = document.querySelector('#MarketSwitcherForm select[name="country_code"]');
11687      var languageSelect = document.getElementById('languageSelector');
11688
11689      function updateLanguageOptions() {
11690        var selectedCountry = countrySelect.value;
11691        var availableLangs = countryLanguages[selectedCountry] || [];
11692        var currentLangValue = languageSelect.value;
11693        var firstAvailable = null;
11694
11695        for (var i = 0; i < languageSelect.options.length; i++) {
11696          var option = languageSelect.options[i];
11697          var isAvailable = availableLangs.indexOf(option.value) !== -1;
11698
11699          option.disabled = !isAvailable;
11700          option.style.color = isAvailable ? '' : '#999';
11701
11702          if (isAvailable && !firstAvailable) {
11703            firstAvailable = option.value;
11704          }
11705        }
11706
11707        // If current selection is not available, switch to first available
11708        if (availableLangs.indexOf(currentLangValue) === -1 && firstAvailable) {
11709          languageSelect.value = firstAvailable;
11710        }
11711      }
11712
11713      countrySelect.addEventListener('change', updateLanguageOptions);
11714
11715      // Run on page load to set initial state
11716      updateLanguageOptions();
11717    })();
11718  </script>
11718
11719</div>
11720
11721<script>
11722  (function() {
11723    // Check for markets_debug cookie
11724    const getCookie = function(name) {
11725      const value = `; ${document.cookie}`;
11726      const parts = value.split(`; ${name}=`);
11727      if (parts.length === 2) {
11728        return parts.pop().split(';').shift();
11729      }
11730      return null;
11731    };
11732
11733    const marketsDebug = getCookie('markets_debug');
11734
11735    // Only show debug window if cookie is set to 'true'
11736    if (marketsDebug === 'true') {
11737      const debugPanel = document.getElementById('tealium-markets-debug');
11738      if (debugPanel) {
11739        debugPanel.style.display = 'block';
11740      }
11741    }
11742  })();
11743</script>
11743
11744<!-- END app snippet -->
11745</div>
11745<script src="https://cdn.shopify.com/storefront/standard-actions.js" type="module" data-source-attribution="shopify.standard_actions"></script>
11745
11746</body>
11747</html>

Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.