:root {
  --ink: #171714;
  --muted: #6d6c64;
  --paper: #f7f5ef;
  --cream: #ede9df;
  --line: #dedbd2;
  --lime: #d8ff55;
  --purple: #a696ff;
  --orange: #ff8d4d;
  --blue: #82ccff;
  --white: #fff;
  --radius: 22px;
  --shadow: 0 20px 55px rgba(28, 26, 18, 0.1);
}

* { box-sizing: border-box; }
[hidden] { display: none !important; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: var(--paper); font-family: "DM Sans", sans-serif; }
body.drawer-open { overflow: hidden; }
button, input { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button { color: inherit; }
a { color: inherit; text-decoration: none; }
.shell { width: min(1440px, calc(100% - 64px)); margin-inline: auto; }

.announcement { height: 34px; padding: 0 28px; display: flex; align-items: center; justify-content: center; background: var(--ink); color: #fff; font-size: 12px; letter-spacing: .02em; position: relative; }
.announcement p { margin: 0; }
.announcement p strong { color: var(--lime); font-family: "Manrope", sans-serif; font-size: 10px; letter-spacing: .14em; }
.country-button { position: absolute; right: 28px; top: 0; height: 34px; border: 0; color: #fff; background: transparent; display: flex; align-items: center; gap: 7px; font-size: 11px; cursor: pointer; }
.country-dot { width: 14px; height: 14px; display: inline-block; border-radius: 50%; background: linear-gradient(#1774d0 0 55%, #fff 55%); border: 1px solid rgba(255,255,255,.45); }

.site-header { background: rgba(247,245,239,.96); border-bottom: 1px solid var(--line); position: sticky; top: 0; z-index: 40; backdrop-filter: blur(14px); }
.header-main { min-height: 86px; display: grid; grid-template-columns: 170px minmax(260px, 1fr) auto; gap: 34px; align-items: center; }
.logo { width: max-content; display: inline-flex; align-items: center; gap: 9px; color: var(--ink); font: 800 25px/1 "Manrope", sans-serif; letter-spacing: -.075em; }
.logo svg { width: 33px; height: 33px; flex: 0 0 auto; overflow: visible; }
.logo svg path { fill: var(--ink); }
.logo svg circle { fill: var(--lime); stroke: var(--ink); stroke-width: 4px; }
.logo span { display: block; }
.search { height: 48px; border: 1px solid #cac7bd; border-radius: 100px; background: #fff; display: grid; grid-template-columns: 24px 1fr auto; align-items: center; gap: 10px; padding: 4px 5px 4px 18px; transition: border-color .2s, box-shadow .2s; }
.search:focus-within { border-color: var(--ink); box-shadow: 0 0 0 3px rgba(23,23,20,.08); }
.search svg { width: 19px; fill: none; stroke: currentColor; stroke-width: 1.8; }
.search input { min-width: 0; border: 0; outline: 0; background: transparent; color: var(--ink); }
.search input::placeholder { color: #8b8981; }
.search button { border: 0; border-radius: 100px; background: var(--ink); color: #fff; height: 38px; padding: 0 19px; cursor: pointer; font-weight: 600; font-size: 13px; }
.header-actions { display: flex; gap: 18px; }
.icon-action { position: relative; border: 0; background: none; padding: 4px 2px; display: grid; justify-items: center; gap: 3px; font-size: 10px; cursor: pointer; }
.icon-action svg { width: 23px; height: 23px; fill: none; stroke: currentColor; stroke-width: 1.65; stroke-linecap: round; stroke-linejoin: round; }
.cart-icon-wrap { position: relative; }
.cart-count { position: absolute; right: -8px; top: -8px; min-width: 18px; height: 18px; padding: 0 4px; display: grid; place-items: center; border-radius: 50px; background: var(--lime); border: 2px solid var(--paper); font-size: 9px; }
.category-nav { height: 45px; display: flex; align-items: stretch; gap: 33px; overflow-x: auto; scrollbar-width: none; }
.category-nav::-webkit-scrollbar { display: none; }
.category-nav button { flex: 0 0 auto; border: 0; background: none; padding: 0; cursor: pointer; font-weight: 600; font-size: 13px; position: relative; }
.category-nav button:not(.all-categories)::after { content: ""; position: absolute; height: 2px; background: var(--ink); left: 0; right: 100%; bottom: 0; transition: right .2s; }
.category-nav button:hover::after, .category-nav button.active::after { right: 0; }
.category-nav .all-categories { display: flex; align-items: center; gap: 9px; border-right: 1px solid var(--line); padding-right: 30px; }
.category-nav .sale-link { margin-left: auto; color: #df4d20; }

.hero { min-height: 620px; margin-top: 24px; border-radius: 30px; overflow: hidden; background: #d9ff57; display: grid; grid-template-columns: 50% 50%; position: relative; }
.hero::before { content: ""; position: absolute; width: 650px; height: 650px; left: -250px; bottom: -520px; border: 1px solid rgba(0,0,0,.16); border-radius: 50%; box-shadow: 0 0 0 60px rgba(255,255,255,.09), 0 0 0 120px rgba(255,255,255,.08); }
.hero-copy { padding: 82px 30px 54px 78px; position: relative; z-index: 2; }
.eyebrow { margin: 0 0 20px; font-family: "Manrope", sans-serif; font-size: 11px; font-weight: 800; letter-spacing: .14em; }
.eyebrow.dark { color: #74716a; }
.hero h1 { max-width: 720px; font: 800 clamp(52px, 5vw, 78px)/.99 "Manrope", sans-serif; letter-spacing: -.065em; margin: 0; }
.hero h1 em { font-family: Georgia, serif; font-weight: 400; letter-spacing: -.05em; }
.hero-text { max-width: 570px; margin: 27px 0 0; font-size: 17px; line-height: 1.65; }
.hero-buttons { display: flex; gap: 12px; margin-top: 34px; }
.button { min-height: 49px; border-radius: 100px; border: 1px solid var(--ink); padding: 0 23px; display: inline-flex; align-items: center; justify-content: center; font-weight: 700; font-size: 13px; cursor: pointer; }
.button-dark { color: #fff; background: var(--ink); }
.button-light { color: var(--ink); background: rgba(255,255,255,.55); }
.hero-proof { margin-top: 53px; display: flex; gap: 30px; }
.hero-proof span { display: grid; gap: 3px; font-size: 11px; }
.hero-proof strong { font: 800 16px "Manrope", sans-serif; }
.hero-stage { position: relative; min-height: 620px; overflow: hidden; }
.hero-stage::before { content: ""; position: absolute; width: 520px; height: 520px; right: 60px; top: 55px; border-radius: 50%; background: #f3f0e8; box-shadow: inset -30px -30px 80px rgba(118,96,30,.08), 0 40px 70px rgba(53,51,27,.15); }
.hero-orbit { position: absolute; border: 1px solid rgba(23,23,20,.18); border-radius: 50%; }
.orbit-one { width: 580px; height: 260px; right: 20px; top: 190px; transform: rotate(-18deg); }
.orbit-two { width: 420px; height: 580px; right: 110px; top: 35px; transform: rotate(32deg); }
.floating-product { position: absolute; border-radius: 18px; padding: 16px; box-shadow: 0 25px 55px rgba(29,28,20,.2); display: flex; flex-direction: column; justify-content: space-between; }
.floating-product p { margin: 0; font: 700 13px "Manrope", sans-serif; }
.floating-label { font-size: 8px; font-weight: 800; letter-spacing: .13em; }
.product-perfume { width: 190px; height: 258px; right: 290px; top: 105px; background: #ffa775; transform: rotate(-7deg); z-index: 5; }
.perfume-bottle { width: 100px; height: 125px; margin: 3px auto 0; border-radius: 14px 14px 24px 24px; background: rgba(255,255,255,.63); border: 1px solid rgba(255,255,255,.78); position: relative; box-shadow: inset 0 -30px 30px rgba(255,113,61,.15); }
.perfume-bottle::before { content: ""; position: absolute; width: 41px; height: 25px; background: var(--ink); border-radius: 3px 3px 0 0; top: -26px; left: 29px; }
.perfume-bottle i { position: absolute; inset: 45px 12px auto; height: 28px; border-block: 1px solid rgba(0,0,0,.35); }
.product-headphones { width: 205px; height: 224px; right: 85px; top: 230px; background: var(--purple); transform: rotate(8deg); z-index: 4; }
.headphone-shape { width: 120px; height: 115px; margin: auto; border: 17px solid #252422; border-bottom-color: transparent; border-radius: 65px 65px 28px 28px; position: relative; }
.headphone-shape::before, .headphone-shape::after { content: ""; position: absolute; width: 28px; height: 55px; border-radius: 12px; background: #252422; top: 52px; }
.headphone-shape::before { left: -22px; transform: rotate(-7deg); }.headphone-shape::after { right: -22px; transform: rotate(7deg); }
.product-home { width: 190px; height: 205px; right: 285px; bottom: 65px; background: #77c9fa; transform: rotate(5deg); z-index: 6; }
.lamp-shape { width: 110px; height: 110px; margin: auto; position: relative; }
.lamp-shape::before { content: ""; position: absolute; width: 82px; height: 56px; border-radius: 50% 50% 8px 8px; background: #f7f0db; left: 14px; top: 5px; box-shadow: inset -8px -5px 15px rgba(0,0,0,.08); }
.lamp-shape::after { content: ""; position: absolute; width: 8px; height: 51px; background: #24231f; left: 51px; top: 59px; box-shadow: -25px 48px 0 20px #24231f; clip-path: polygon(0 0,100% 0,100% 18%,330% 100%,-230% 100%,0 18%); }
.delivery-pill { position: absolute; z-index: 8; right: 35px; top: 92px; display: flex; gap: 10px; align-items: center; padding: 10px 15px 10px 10px; border-radius: 100px; background: #fff; box-shadow: var(--shadow); transform: rotate(2deg); }
.delivery-pill > span { width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; background: var(--lime); font-weight: 800; }
.delivery-pill p { margin: 0; display: grid; font-size: 11px; }.delivery-pill small { color: var(--muted); }

.benefits { min-height: 104px; display: grid; grid-template-columns: repeat(4, 1fr); align-items: center; border-bottom: 1px solid var(--line); }
.benefits article { display: flex; align-items: center; gap: 14px; padding: 8px 22px; border-right: 1px solid var(--line); }.benefits article:first-child { padding-left: 0; }.benefits article:last-child { border: 0; }
.benefit-icon { width: 37px; height: 37px; flex: 0 0 auto; display: grid; place-items: center; border: 1px solid #bebbb1; border-radius: 50%; }
.benefits p { display: grid; gap: 2px; margin: 0; font-size: 12px; }.benefits small { color: var(--muted); }

.category-section, .products-section { padding-top: 100px; }
.catalog-preview-note { display:flex; align-items:center; justify-content:space-between; gap:24px; margin-bottom:42px; padding:14px 18px; border:1px solid rgba(0,0,0,.13); background:#fff8d9; font-size:12px; line-height:1.45; }
.catalog-preview-note strong { font-size:10px; letter-spacing:.12em; white-space:nowrap; }
.catalog-preview-note span { color:#5f5a4e; }
.section-heading { display: flex; justify-content: space-between; align-items: end; margin-bottom: 32px; }
.section-heading .eyebrow { margin-bottom: 10px; }
.section-heading h2 { margin: 0; font: 800 clamp(34px, 4vw, 52px)/1 "Manrope", sans-serif; letter-spacing: -.055em; }
.text-link { border: 0; background: none; padding: 10px 0; font-weight: 700; font-size: 13px; cursor: pointer; border-bottom: 1px solid var(--ink); }.text-link span { margin-left: 9px; }
.category-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.category-card { height: 390px; border: 0; border-radius: var(--radius); padding: 20px; text-align: left; position: relative; overflow: hidden; cursor: pointer; transition: transform .25s, box-shadow .25s; }
.category-card:hover { transform: translateY(-5px); box-shadow: var(--shadow); }
.category-index { font: 700 10px "Manrope", sans-serif; }
.category-card p { position: absolute; left: 20px; bottom: 21px; margin: 0; display: grid; gap: 5px; }.category-card p strong { font: 800 24px "Manrope", sans-serif; letter-spacing: -.04em; }.category-card p small { color: rgba(23,23,20,.65); }
.round-arrow { position: absolute; right: 20px; bottom: 20px; width: 43px; height: 43px; display: grid; place-items: center; background: var(--ink); color: #fff; border-radius: 50%; font-size: 18px; }
.category-beauty { background: #f2b391; }.category-home { background: #dcd4c7; }.category-tech { background: #b9affc; }.category-gifts { background: #badff3; }
.category-art { position: absolute; width: 210px; height: 225px; left: 50%; top: 55%; transform: translate(-50%,-60%); }
.beauty-art i { position: absolute; width: 92px; height: 145px; left: 20px; top: 50px; border-radius: 12px 12px 30px 30px; background: linear-gradient(135deg,#fcfaf1,#dcb8a5); transform: rotate(-12deg); box-shadow: 0 25px 30px rgba(70,39,25,.2); }.beauty-art i::before { content:""; position:absolute; width:45px; height:25px; left:24px; top:-24px; background:#1e1d1a; border-radius:4px 4px 0 0; }.beauty-art b { position:absolute; width:75px; height:125px; right:25px; top:25px; background:linear-gradient(135deg,#e8baff,#8562e7); border-radius:8px; transform:rotate(11deg); box-shadow:0 25px 30px rgba(70,39,25,.18); }.beauty-art b::after { content:"OLOMIO\A BEAUTY"; white-space:pre; position:absolute; inset:39px 4px; text-align:center; font:700 9px/1.5 "Manrope"; }
.home-art i { position:absolute; width:155px; height:95px; background:#f3eee2; border-radius:50% 50% 9px 9px; top:22px; left:26px; box-shadow:inset -16px -8px 24px rgba(0,0,0,.07),0 20px 30px rgba(0,0,0,.13); }.home-art i::after { content:""; position:absolute; width:11px; height:122px; background:#2b2a27; left:73px; top:91px; }.home-art b { position:absolute; width:110px; height:13px; border-radius:50%; background:#2b2a27; left:50px; bottom:2px; box-shadow:0 12px 15px rgba(0,0,0,.15); }
.tech-art i { position:absolute; width:138px; height:128px; border:21px solid #292824; border-bottom-color:transparent; border-radius:75px 75px 30px 30px; top:12px; left:35px; transform:rotate(-8deg); }.tech-art i::before,.tech-art i::after { content:""; position:absolute; width:36px; height:67px; background:#292824; border-radius:15px; top:65px; }.tech-art i::before { left:-28px; }.tech-art i::after { right:-28px; }.tech-art b { position:absolute; width:90px; height:22px; border-radius:50%; background:rgba(33,27,74,.18); left:60px; bottom:10px; filter:blur(6px); }
.gifts-art i { position:absolute; width:142px; height:122px; left:34px; top:78px; border-radius:7px 7px 18px 18px; background:linear-gradient(145deg,#fff3c9,#f59a64); transform:rotate(-5deg); box-shadow:0 28px 30px rgba(15,65,89,.16); }.gifts-art i::before { content:""; position:absolute; width:22px; height:122px; left:60px; background:#e05462; }.gifts-art b { position:absolute; width:166px; height:30px; left:22px; top:56px; border-radius:8px; background:#e05462; transform:rotate(-5deg); box-shadow:0 10px 17px rgba(15,65,89,.14); }.gifts-art b::before,.gifts-art b::after { content:""; position:absolute; width:48px; height:36px; border:13px solid #e05462; border-radius:50%; top:-47px; }.gifts-art b::before { left:31px; transform:rotate(25deg); }.gifts-art b::after { right:31px; transform:rotate(-25deg); }

.product-heading { align-items: center; }
.product-tabs { display: flex; border: 1px solid var(--line); padding: 4px; border-radius: 100px; background: #fff; }
.product-tabs button { border: 0; border-radius: 100px; background: transparent; height: 34px; padding: 0 16px; font-size: 11px; font-weight: 700; cursor: pointer; }.product-tabs button.active { background: var(--ink); color: #fff; }
.results-message { margin: -10px 0 24px; color: var(--muted); }
.product-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 26px 14px; min-height: 400px; }
.product-card { min-width: 0; }
.product-image { aspect-ratio: .92; overflow: hidden; border-radius: 18px; position: relative; background: #ebe8df; }
.product-image-link { display: block; width: 100%; height: 100%; }
.product-image img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .5s; }.product-card:hover .product-image img { transform: scale(1.04); }
.product-badge { position: absolute; left: 12px; top: 12px; z-index: 2; border-radius: 100px; background: #fff; padding: 6px 10px; font-size: 9px; font-weight: 800; letter-spacing: .05em; }.product-badge.sale { background: var(--orange); color: #fff; }
.favourite-button { position: absolute; right: 12px; top: 12px; z-index: 2; width: 37px; height: 37px; border-radius: 50%; background: rgba(255,255,255,.88); border: 0; display: grid; place-items: center; cursor: pointer; font-size: 20px; }.favourite-button.active { color: #e44b42; background: #fff; }.favourite-button.active span { transform: scale(1.08); }
.quick-add { position: absolute; left: 12px; right: 12px; bottom: 12px; height: 42px; border: 0; border-radius: 100px; background: var(--ink); color: #fff; font-weight: 700; font-size: 12px; cursor: pointer; transform: translateY(60px); transition: transform .25s; }.product-card:hover .quick-add, .quick-add:focus-visible { transform: translateY(0); }
.product-info { padding: 14px 4px 0; }.product-category { margin: 0 0 5px; font-size: 9px; font-weight: 800; letter-spacing: .09em; color: #86837b; }.product-info h3 { margin: 0; font: 700 14px/1.35 "Manrope", sans-serif; }.product-meta { margin-top: 11px; display: flex; align-items: center; justify-content: space-between; }.product-price { font: 800 15px "Manrope", sans-serif; }.product-price del { color: #99968e; font-weight: 500; margin-left: 6px; font-size: 12px; }.product-rating { font-size: 10px; color: #68665f; }
.no-products { grid-column: 1/-1; min-height: 320px; border: 1px dashed #c9c5bb; border-radius: var(--radius); display: grid; place-content: center; text-align: center; color: var(--muted); }.no-products strong { color: var(--ink); font-size: 20px; }

.product-page { padding-top: 28px; padding-bottom: 110px; }
.product-breadcrumb { min-height: 45px; display: flex; align-items: center; gap: 10px; overflow: hidden; color: #79766e; font-size: 11px; white-space: nowrap; }
.product-breadcrumb button { border: 0; background: none; padding: 8px 0; color: var(--ink); cursor: pointer; font-weight: 800; }
.product-breadcrumb strong { overflow: hidden; text-overflow: ellipsis; color: #494741; font-weight: 600; }
.product-detail-layout { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(400px, .92fr); gap: clamp(45px, 6vw, 100px); align-items: start; padding-top: 16px; }
.product-gallery { min-width: 0; }
.product-main-image { position: relative; overflow: hidden; aspect-ratio: 1 / .96; border-radius: 26px; background: #eae7de; }
.product-main-image img { display: block; width: 100%; height: 100%; object-fit: cover; }
.product-buy-panel { position: sticky; top: 185px; padding: 18px 0; }
.product-buy-panel > .product-category { margin-bottom: 13px; }
.product-title-row { display: grid; grid-template-columns: 1fr auto; gap: 20px; align-items: start; }
.product-title-row h1 { margin: 0; max-width: 650px; font: 800 clamp(35px, 4vw, 56px)/1.03 "Manrope", sans-serif; letter-spacing: -.06em; }
.detail-favourite { width: 48px; height: 48px; border: 1px solid var(--line); border-radius: 50%; background: #fff; cursor: pointer; font-size: 25px; }
.detail-favourite.active { color: #e44b42; }
.detail-price { margin-top: 24px; font: 800 25px "Manrope", sans-serif; }
.detail-price del { margin-left: 10px; color: #96938b; font-size: 16px; font-weight: 500; }
.product-buy-panel > span { display: block; margin-top: 7px; color: var(--muted); font-size: 10px; }
.product-preview-warning { display: grid; gap: 5px; margin-top: 24px; padding: 13px 15px; border: 1px solid #e5d798; background: #fff8d9; font-size: 11px; line-height: 1.4; }
.product-preview-warning strong { font: 800 9px "Manrope", sans-serif; letter-spacing: .1em; }
.product-preview-warning span { color: #625d50; }
.product-description { margin: 24px 0 0; max-width: 650px; color: #5f5d56; font-size: 15px; line-height: 1.7; }
.stock-line { display: flex; align-items: center; gap: 8px; margin: 20px 0; font-size: 12px; font-weight: 700; }
.stock-line span { width: 8px; height: 8px; border-radius: 50%; background: #4ca35d; box-shadow: 0 0 0 4px rgba(76,163,93,.12); }
.detail-buy-row { display: grid; grid-template-columns: 120px 1fr; gap: 10px; }
.detail-quantity { min-height: 55px; display: grid; grid-template-columns: 36px 1fr 36px; align-items: center; border: 1px solid #c9c5bb; border-radius: 100px; background: #fff; text-align: center; }
.detail-quantity button { height: 100%; border: 0; background: transparent; cursor: pointer; font-size: 20px; }
.detail-quantity strong { font-size: 13px; }
.detail-add-button { min-height: 55px; border: 0; border-radius: 100px; padding: 0 25px; display: flex; align-items: center; justify-content: space-between; background: var(--ink); color: #fff; cursor: pointer; font-weight: 800; }
.detail-add-button:hover { background: #33322e; }
.detail-benefits { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-top: 20px; }
.detail-benefits > div { min-width: 0; padding: 13px 8px; display: flex; gap: 8px; border-radius: 12px; background: #ece8de; }
.detail-benefits b { width: 25px; height: 25px; flex: 0 0 auto; display: grid; place-items: center; border: 1px solid #bab6ab; border-radius: 50%; font-size: 11px; }
.detail-benefits span { min-width: 0; display: grid; gap: 3px; }
.detail-benefits strong { font-size: 9px; line-height: 1.25; }
.detail-benefits small { color: #78756e; font-size: 8px; line-height: 1.3; }
.product-accordions { margin-top: 24px; border-top: 1px solid var(--line); }
.product-accordions details { border-bottom: 1px solid var(--line); }
.product-accordions summary { min-height: 52px; display: flex; align-items: center; justify-content: space-between; cursor: pointer; list-style: none; font-size: 12px; font-weight: 800; }
.product-accordions summary::-webkit-details-marker { display: none; }
.product-accordions summary span { font-size: 19px; font-weight: 400; transition: transform .2s; }
.product-accordions details[open] summary span { transform: rotate(45deg); }
.product-accordions details p { margin: -2px 0 18px; color: var(--muted); font-size: 12px; line-height: 1.65; }
.related-section { padding-top: 105px; }
.related-grid { min-height: 0; }

.promo { margin-top: 110px; margin-bottom: 110px; min-height: 450px; border-radius: 28px; background: #282728; color: #fff; display: grid; grid-template-columns: 52% 48%; overflow: hidden; }
.promo-copy { padding: 67px 0 60px 70px; position: relative; z-index: 3; }.promo-copy h2 { margin: 0; font: 800 clamp(36px,4vw,56px)/1.05 "Manrope"; letter-spacing: -.055em; }.promo-copy > p:not(.eyebrow) { max-width: 540px; color: #c5c2bd; line-height: 1.6; }
.newsletter { max-width: 480px; margin-top: 31px; display: grid; grid-template-columns: 1fr auto; background: #fff; border-radius: 100px; padding: 5px; }.newsletter input { min-width:0; border:0; outline:0; padding:0 17px; background:transparent; }.newsletter button { border:0; border-radius:100px; background:var(--lime); height:43px; padding:0 20px; font-weight:800; cursor:pointer; }.promo-copy small { display:block; margin-top:12px; color:#94918e; }
.promo-graphic { position:relative; min-height:450px; }.promo-graphic::before { content:""; position:absolute; width:470px; height:470px; border-radius:50%; background:var(--lime); right:-80px; top:-40px; }.promo-word { position:absolute; z-index:1; right:0; bottom:-65px; font:800 260px "Manrope"; color:rgba(255,255,255,.1); letter-spacing:-.1em; }
.promo-card { position:absolute; z-index:2; width:290px; height:175px; border-radius:18px; box-shadow:0 35px 60px rgba(0,0,0,.3); padding:24px; font:800 24px "Manrope"; }.card-back { right:190px; top:70px; transform:rotate(-14deg); background:#ad9dff; color:#33276c; }.card-front { right:60px; top:160px; transform:rotate(10deg); background:#f5f2e9; color:var(--ink); }.card-front strong { background:var(--lime); border-radius:4px; padding:1px 5px; margin-left:3px; }.card-front small { display:block; margin-top:70px; font:600 9px "DM Sans"; letter-spacing:.14em; }

footer { background:#e9e5dc; padding-top:70px; }
.footer-main { display:grid; grid-template-columns:2fr repeat(3,1fr); gap:70px; padding-bottom:70px; }.footer-brand p { max-width:340px; color:var(--muted); line-height:1.6; }.socials { display:flex; gap:8px; margin-top:22px; }.socials a { width:35px; height:35px; border:1px solid #b8b4aa; border-radius:50%; display:grid; place-items:center; font-size:10px; font-weight:800; }
.footer-column { display:flex; flex-direction:column; gap:13px; font-size:13px; }.footer-column h3 { font:800 11px "Manrope"; letter-spacing:.1em; margin:0 0 7px; }.footer-column a { color:#5f5d56; }.footer-column a:hover { color:var(--ink); }
.footer-bottom { min-height:64px; border-top:1px solid #cfcbc1; display:flex; align-items:center; justify-content:space-between; color:#737069; font-size:11px; }

.drawer-overlay { position:fixed; inset:0; z-index:79; background:rgba(15,15,12,.42); opacity:0; pointer-events:none; transition:opacity .28s; backdrop-filter:blur(2px); }
.cart-drawer { position:fixed; z-index:80; inset:0 0 0 auto; width:min(470px,100%); padding:28px; background:#f8f6f0; transform:translateX(105%); transition:transform .32s cubic-bezier(.2,.8,.2,1); display:flex; flex-direction:column; box-shadow:-20px 0 50px rgba(0,0,0,.15); }
body.drawer-open .drawer-overlay { opacity:1; pointer-events:auto; } body.drawer-open .cart-drawer { transform:translateX(0); }
.drawer-header { display:flex; justify-content:space-between; align-items:start; }.drawer-header .eyebrow { margin-bottom:6px; }.drawer-header h2 { margin:0; font:800 31px "Manrope"; letter-spacing:-.05em; }.drawer-header h2 span { color:#85827a; font-size:16px; }.drawer-close { width:40px; height:40px; border:1px solid var(--line); border-radius:50%; background:#fff; font-size:25px; line-height:1; cursor:pointer; }
.shipping-progress { padding:22px 0 18px; border-bottom:1px solid var(--line); }.shipping-progress p { margin:0 0 8px; font-size:11px; }.shipping-progress div { height:5px; border-radius:10px; background:#dedbd2; overflow:hidden; }.shipping-progress span { display:block; width:0; height:100%; background:var(--ink); transition:width .3s; }
.cart-items { overflow:auto; flex:1; }.cart-item { display:grid; grid-template-columns:80px 1fr auto; gap:13px; padding:16px 0; border-bottom:1px solid var(--line); }.cart-item img { width:80px; height:92px; object-fit:cover; border-radius:10px; }.cart-item h3 { margin:3px 0 6px; font:700 13px/1.35 "Manrope"; }.cart-item-price { font-size:12px; font-weight:800; }.quantity { display:flex; align-items:center; width:max-content; border:1px solid var(--line); border-radius:100px; margin-top:11px; }.quantity button { width:27px; height:27px; border:0; background:none; cursor:pointer; }.quantity span { min-width:20px; text-align:center; font-size:11px; }.remove-item { border:0; background:none; padding:2px; align-self:start; color:#8d8981; cursor:pointer; text-decoration:underline; font-size:10px; }
.empty-cart { margin:auto; text-align:center; max-width:300px; }.empty-cart > span { width:90px; height:90px; border-radius:50%; display:grid; place-items:center; margin:0 auto 18px; background:var(--lime); font:800 26px "Manrope"; }.empty-cart h3 { font:800 20px "Manrope"; margin:0 0 8px; }.empty-cart p { color:var(--muted); font-size:13px; line-height:1.5; }.empty-cart .button { margin-top:12px; }
.cart-summary { padding-top:18px; border-top:1px solid var(--line); }.cart-summary > div { display:flex; justify-content:space-between; font-size:16px; }.cart-summary p { color:var(--muted); font-size:10px; }.checkout-button { width:100%; height:52px; border:0; border-radius:100px; background:var(--ink); color:#fff; display:flex; align-items:center; justify-content:space-between; padding:0 22px; font-weight:800; cursor:pointer; }
.toast { position:fixed; z-index:100; left:50%; bottom:25px; transform:translate(-50%,30px); background:var(--ink); color:#fff; border-radius:100px; padding:12px 18px; font-size:12px; opacity:0; pointer-events:none; transition:.25s; box-shadow:var(--shadow); }.toast.show { opacity:1; transform:translate(-50%,0); }

@media (max-width: 1100px) {
  .shell { width:min(100% - 38px,1440px); }.header-main { grid-template-columns:140px 1fr auto; gap:18px; }.header-actions { gap:10px; }.icon-action span:last-child { display:none; }.hero { grid-template-columns:55% 45%; }.hero-copy { padding-left:48px; }.hero-stage { transform:scale(.9); transform-origin:center; }.category-grid,.product-grid { grid-template-columns:repeat(2,1fr); }.category-card { height:350px; }.footer-main { grid-template-columns:1.5fr repeat(3,1fr); gap:35px; }
  .product-detail-layout { grid-template-columns: minmax(0, 1fr) minmax(360px, .9fr); gap: 42px; }
  .detail-benefits { grid-template-columns: 1fr; }
}

@media (max-width: 780px) {
  .shell { width:calc(100% - 28px); }.announcement { justify-content:flex-start; padding-left:14px; }.country-button { right:10px; }.header-main { min-height:118px; grid-template-columns:1fr auto; grid-template-rows:55px 52px; }.logo { font-size:22px; }.search { grid-column:1/-1; grid-row:2; height:43px; padding-left:14px; }.search button { display:none; }.header-actions .icon-action:not(.cart-trigger) { display:none; }.category-nav { width:100%; padding:0 14px; gap:24px; }.category-nav .all-categories { padding-right:20px; }.category-nav .sale-link { margin-left:0; }.hero { min-height:auto; grid-template-columns:1fr; margin-top:14px; }.hero-copy { padding:50px 26px 35px; }.hero h1 { font-size:46px; }.hero-text { font-size:15px; }.hero-buttons { flex-direction:column; align-items:stretch; }.hero-proof { gap:17px; overflow:auto; }.hero-proof span { min-width:110px; }.hero-stage { min-height:440px; transform:none; }.hero-stage::before { width:400px; height:400px; right:-110px; top:5px; }.product-perfume { left:30px; right:auto; top:60px; width:155px; height:220px; }.product-headphones { right:17px; top:120px; width:170px; height:190px; }.product-home { left:90px; right:auto; bottom:15px; width:160px; height:175px; }.delivery-pill { right:15px; top:25px; }.benefits { grid-template-columns:1fr 1fr; padding:14px 0; }.benefits article,.benefits article:first-child { padding:13px 8px; border-right:0; }.category-section,.products-section { padding-top:70px; }.section-heading { align-items:start; gap:20px; }.section-heading h2 { font-size:36px; }.section-heading .text-link { display:none; }.category-grid { grid-template-columns:1fr 1fr; }.category-card { height:300px; padding:15px; }.category-art { transform:translate(-50%,-67%) scale(.76); }.category-card p { left:15px; bottom:16px; }.category-card p strong { font-size:20px; }.category-card p small { display:none; }.round-arrow { width:35px; height:35px; right:14px; bottom:14px; }.product-heading { flex-direction:column; }.product-tabs { max-width:100%; overflow:auto; }.product-grid { gap:24px 10px; }.quick-add { transform:none; height:36px; }.product-info h3 { font-size:12px; }.product-rating { display:none; }.promo { grid-template-columns:1fr; margin-top:70px; margin-bottom:70px; }.promo-copy { padding:50px 24px; }.promo-graphic { min-height:330px; }.promo-graphic::before { width:370px; height:370px; }.promo-card { width:240px; height:145px; }.card-back { right:100px; top:25px; }.card-front { right:25px; top:115px; }.card-front small { margin-top:49px; }.footer-main { grid-template-columns:1fr 1fr; gap:45px 25px; }.footer-brand { grid-column:1/-1; }.footer-bottom { align-items:flex-start; flex-direction:column; justify-content:center; gap:4px; }.footer-bottom p { margin:0; }.cart-drawer { padding:22px 18px; }
}

@media (max-width: 430px) {
  .announcement { height:auto; min-height:46px; padding:7px 58px 7px 12px; text-align:center; line-height:1.35; }.announcement p { max-width:none; white-space:normal; overflow:visible; }.country-button { right:8px; height:100%; font-size:0; }.country-button .country-dot { margin-right:1px; }.hero h1 { font-size:40px; }.hero-stage { min-height:400px; }.product-perfume { left:17px; }.product-headphones { right:3px; }.product-home { left:72px; }.benefits { grid-template-columns:1fr; }.benefits article { border-bottom:1px solid var(--line); }.benefits article:last-child { border:0; }.category-card { height:265px; }.category-art { top:53%; transform:translate(-50%,-70%) scale(.66); }.product-grid { grid-template-columns:1fr 1fr; }.product-image { aspect-ratio:.82; }.newsletter { grid-template-columns:1fr; border-radius:16px; padding:5px; }.newsletter input { height:44px; }.newsletter button { border-radius:12px; }.footer-main { grid-template-columns:1fr; }.footer-brand { grid-column:auto; }
}

@media (max-width: 780px) {
  .catalog-preview-note { align-items:flex-start; flex-direction:column; gap:6px; margin-bottom:28px; }
  .product-page { padding-top: 12px; padding-bottom: 70px; }
  .product-breadcrumb span:not(:first-of-type), .product-breadcrumb strong { display: none; }
  .product-detail-layout { grid-template-columns: 1fr; gap: 18px; padding-top: 4px; }
  .product-main-image { border-radius: 18px; aspect-ratio: 1 / 1.02; }
  .product-buy-panel { position: static; padding-top: 13px; }
  .product-title-row h1 { font-size: 35px; }
  .detail-benefits { grid-template-columns: repeat(3, 1fr); }
  .related-section { padding-top: 70px; }
}

@media (max-width: 520px) {
  .detail-buy-row { grid-template-columns: 104px 1fr; }
  .detail-add-button { padding: 0 17px; font-size: 12px; }
  .detail-benefits { grid-template-columns: 1fr; }
  .detail-benefits > div { padding: 11px 12px; }
}