@charset "UTF-8";
@font-face { font-family: "Estedad"; src: url("/fonts/estedad-variable.woff2") format("woff2"); font-style: normal; font-weight: 100 900; font-display: swap; }
:root {
  color-scheme: light;
  --ink: #252330;
  --ink-soft: #555361;
  --muted: #85818b;
  --paper: #f6f5f1;
  --white: #fffefa;
  --line: #e5e2dc;
  --purple: #6451dc;
  --purple-deep: #292448;
  --lime: #c8f477;
  --orange: #fb9169;
  --pink: #ed91b5;
  --radius-xl: 34px;
  --shadow: 0 24px 64px rgba(37, 35, 48, .09);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 95px; }
body { margin: 0; background: var(--paper); color: var(--ink); font-family: "Estedad", "Vazirmatn", Tahoma, Arial, sans-serif; font-size: 15px; line-height: 1.8; -webkit-font-smoothing: antialiased; }
button, input { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
a { color: inherit; text-decoration: none; }
button { color: inherit; }
svg { display: block; }
::selection { color: var(--ink); background: var(--lime); }
[hidden] { display: none !important; }
.page-width { width: min(1240px, calc(100% - 64px)); margin-inline: auto; }
.skip-link { position: fixed; z-index: 1000; inset-block-start: 10px; inset-inline-start: 12px; padding: 10px 16px; color: white; background: var(--purple-deep); border-radius: 12px; transform: translateY(-160%); transition: transform .2s; }
.skip-link:focus { transform: translateY(0); }
.announcement { min-height: 37px; display: flex; align-items: center; justify-content: center; gap: 10px; padding: 4px 20px; color: #f5f3ff; background: #272439; font-size: 11px; letter-spacing: .01em; }
.announcement a { color: #d6f796; transition: color .2s; }
.announcement a:hover { color: #fff; }
.announcement a span { display: inline-block; margin-inline-start: 5px; }
.announcement-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--lime); box-shadow: 0 0 0 4px rgba(200, 244, 119, .12); }
.announcement-divider { width: 1px; height: 14px; background: rgba(255,255,255,.25); }
.site-header { position: sticky; z-index: 30; inset-block-start: 0; background: rgba(246, 245, 241, .88); backdrop-filter: blur(18px); border-bottom: 1px solid rgba(221, 218, 210, .65); }
.header-inner { width: min(1330px, calc(100% - 56px)); min-height: 78px; margin-inline: auto; display: flex; align-items: center; justify-content: space-between; gap: 28px; }
.brand { display: inline-flex; align-items: center; gap: 10px; flex: 0 0 auto; }
.brand-mark { position: relative; width: 43px; height: 43px; display: grid; place-items: center; border-radius: 50%; background: linear-gradient(var(--paper), var(--paper)) padding-box, conic-gradient(from 210deg, #ffc642, #fa5a59, #ea35aa, #8059f6, #ffc642) border-box; border: 3px solid transparent; box-shadow: 0 3px 9px rgba(91, 72, 186, .12); }
.brand-mark span { position: relative; z-index: 1; top: -2px; color: #211f2c; font-size: 22px; font-weight: 900; line-height: 1; }
.brand-mark i { position: absolute; width: 22px; height: 7px; inset-inline-start: 9px; inset-block-end: 7px; border-bottom: 2px solid #efbc29; border-radius: 50%; transform: rotate(-8deg); }
.brand-mark i::after { content: ""; position: absolute; inset-inline-end: -2px; inset-block-end: -2px; width: 4px; height: 4px; border-top: 1.8px solid #efbc29; border-inline-end: 1.8px solid #efbc29; transform: rotate(35deg); }
.brand-wordmark { display: flex; flex-direction: column; align-items: flex-start; line-height: 1.1; }
.brand-wordmark strong { font-size: 17px; font-weight: 750; }
.brand-wordmark small { margin-top: 4px; color: #77737f; font-size: 9px; font-weight: 500; }
.desktop-nav { height: 78px; display: flex; align-items: center; justify-content: center; gap: clamp(20px, 3vw, 42px); }
.nav-link { position: relative; color: #696673; font-size: 13px; font-weight: 600; transition: color .2s; }
.nav-link:hover, .nav-link.active { color: var(--ink); }
.nav-link.active::after { content: ""; position: absolute; width: 4px; height: 4px; inset-inline-start: calc(50% - 2px); inset-block-end: -11px; border-radius: 50%; background: var(--purple); }
.header-actions { display: flex; align-items: center; gap: 12px; }
.searchbox { width: 205px; height: 42px; display: flex; align-items: center; gap: 9px; padding: 0 12px; border: 1px solid #e6e3dc; border-radius: 13px; background: rgba(255,255,255,.62); transition: border-color .2s, box-shadow .2s; }
.searchbox:focus-within { border-color: #b7aef4; box-shadow: 0 0 0 3px rgba(100, 81, 220, .08); }
.searchbox svg, .mobile-search-row > svg { width: 17px; height: 17px; fill: none; stroke: #8c8995; stroke-width: 1.7; flex: 0 0 auto; }
.searchbox input, .mobile-search-row input { min-width: 0; width: 100%; border: 0; outline: 0; color: var(--ink); background: transparent; font-size: 11px; }
.searchbox input::placeholder, .mobile-search-row input::placeholder { color: #9a97a1; }
.searchbox kbd { direction: ltr; color: #aaa6b0; font-family: inherit; font-size: 9px; white-space: nowrap; }
.cart-button { height: 42px; display: flex; align-items: center; gap: 7px; padding: 0 11px; border: 1px solid #e6e3dc; border-radius: 13px; background: #fffefa; cursor: pointer; transition: transform .2s, border-color .2s, background .2s; }
.cart-button:hover { transform: translateY(-1px); border-color: #c9c3ee; background: #fff; }
.cart-button > svg { width: 19px; height: 19px; fill: none; stroke: var(--ink); stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.cart-label { font-size: 11px; font-weight: 700; white-space: nowrap; }
.cart-count { min-width: 19px; height: 19px; display: grid; place-items: center; padding: 0 4px; border-radius: 7px; color: #292448; background: var(--lime); font-size: 10px; font-weight: 800; }
.mobile-search, .mobile-search-row { display: none; }

.hero { position: relative; min-height: 558px; display: grid; grid-template-columns: 1fr .95fr; align-items: center; gap: 5.4%; padding-block: 51px 40px; }
.hero-copy { position: relative; z-index: 2; padding-inline-start: clamp(10px, 4vw, 57px); }
.eyebrow { display: flex; align-items: center; gap: 8px; margin: 0 0 17px; color: #77717f; font-size: 11px; font-weight: 700; letter-spacing: .01em; }
.eyebrow-icon { width: 21px; height: 21px; display: grid; place-items: center; color: var(--purple); background: #eae6ff; border-radius: 8px; font-size: 14px; }
.hero h1 { margin: 0; color: #272435; font-size: clamp(42px, 4.7vw, 60px); font-weight: 600; line-height: 1.4; }
.hero h1 > span:first-of-type { position: relative; color: var(--purple); }
.hero h1 > span:first-of-type::after { content: ""; position: absolute; z-index: -1; width: 96%; height: 12px; inset-inline-start: 0; inset-block-end: 7px; border-radius: 100%; background: #d6f494; transform: rotate(-2deg); opacity: .75; }
.hero-period, .heading-period { color: #f18360; }
.hero-description { max-width: 420px; margin: 19px 0 25px; color: #696572; font-size: 14px; line-height: 2.05; }
.hero-actions { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.button { min-height: 48px; display: inline-flex; align-items: center; justify-content: center; gap: 18px; padding: 0 22px; border: 1px solid transparent; border-radius: 13px; font-size: 12px; font-weight: 800; cursor: pointer; transition: transform .2s, box-shadow .2s, background .2s; }
.button:hover { transform: translateY(-2px); }
.button > span:last-child { font-size: 17px; line-height: 1; }
.button-dark { color: white; background: #29263b; box-shadow: 0 9px 22px rgba(43, 39, 62, .15); }
.button-dark:hover { background: #463c82; box-shadow: 0 12px 25px rgba(77, 65, 151, .22); }
.button-quiet { min-height: 46px; gap: 10px; color: #605c69; background: transparent; }
.button-quiet:hover { color: var(--purple); background: white; }
.play-icon { width: 25px; height: 25px; display: grid; place-items: center; border: 1px solid #dcd8e0; border-radius: 50%; color: var(--purple); font-size: 18px; }
.hero-footnote { display: flex; align-items: center; gap: 9px; margin-top: 36px; color: #83808b; font-size: 10px; }
.hero-footnote a { color: #5b4dcc; font-weight: 700; direction: ltr; }
.mini-avatar { width: 23px; height: 23px; display: grid; place-items: center; border: 2px solid white; border-radius: 50%; color: #29263b; background: linear-gradient(135deg, #fc7e6a, #d6f494); font-size: 12px; font-weight: 900; box-shadow: 0 2px 5px #d7d2cc; }
.hero-visual { position: relative; min-width: 0; aspect-ratio: 1 / .92; isolation: isolate; border: 1px solid rgba(255,255,255,.85); border-radius: 34% 30% 34% 27% / 28% 31% 28% 34%; background: radial-gradient(ellipse at 47% 48%, #fffefa 0 25%, transparent 64%), radial-gradient(ellipse at 72% 28%, rgba(224, 214, 255, .92), transparent 46%), radial-gradient(ellipse at 23% 77%, rgba(246, 226, 202, .85), transparent 45%), linear-gradient(145deg, #eeebff, #faf8ef 68%); box-shadow: inset 0 0 70px rgba(255,255,255,.65), 0 17px 50px rgba(48, 39, 73, .055); }
.hero-visual::before { content: ""; position: absolute; width: 73%; aspect-ratio: 1; inset-inline-start: 12%; inset-block-start: 10%; border: 1px solid rgba(113, 92, 216, .13); border-radius: 50%; }
.hero-visual::after { content: ""; position: absolute; width: 54%; aspect-ratio: 1; inset-inline-start: 22%; inset-block-start: 20%; border: 1px dashed rgba(113, 92, 216, .2); border-radius: 50%; }
.visual-orbit { position: absolute; z-index: 1; border: 1px solid rgba(116, 99, 200, .18); border-radius: 50%; pointer-events: none; }
.orbit-one { width: 82%; height: 33%; inset-inline-start: 8%; inset-block-start: 38%; transform: rotate(-28deg); }
.orbit-two { width: 75%; height: 25%; inset-inline-start: 13%; inset-block-start: 43%; transform: rotate(30deg); border-style: dashed; border-color: rgba(238, 136, 103, .22); }
.hero-product { position: absolute; z-index: 3; filter: drop-shadow(0 20px 13px rgba(48, 43, 64, .16)); }
.hero-product svg { width: 100%; height: auto; overflow: visible; }
.hero-phone { width: 42%; inset-inline-start: 31%; inset-block-start: 16%; transform: rotate(5deg); animation: float-phone 5.5s ease-in-out infinite; }
.hero-mic { width: 38%; inset-inline-start: 54%; inset-block-start: 55%; transform: rotate(-8deg); animation: float-mic 6s ease-in-out infinite; }
.hero-light { width: 23%; inset-inline-start: 13%; inset-block-start: 61%; transform: rotate(-12deg); animation: float-light 6.5s ease-in-out infinite; }
.float-label { position: absolute; z-index: 4; display: flex; align-items: center; gap: 9px; padding: 10px 14px; border: 1px solid rgba(255,255,255,.85); border-radius: 13px; color: #777280; background: rgba(255,255,255,.72); box-shadow: 0 10px 28px rgba(37, 35, 48, .09); font-size: 9px; line-height: 1.7; backdrop-filter: blur(8px); }
.float-label b { color: #312e40; font-size: 10px; }
.float-label-top { inset-inline-end: 3%; inset-block-start: 20%; transform: rotate(3deg); }
.float-label-bottom { inset-inline-start: 1%; inset-block-end: 17%; transform: rotate(-4deg); }
.label-spark { width: 24px; height: 24px; display: grid; place-items: center; border-radius: 8px; color: #5947d5; background: #ebe7ff; font-size: 13px; }
.pulse-dot { width: 9px; height: 9px; border-radius: 50%; background: #6da85a; box-shadow: 0 0 0 4px #e5f4d6; }
.visual-spark { position: absolute; z-index: 2; color: #f29a69; animation: twinkle 3s ease-in-out infinite; }
.spark-one { inset-inline-start: 21%; inset-block-start: 24%; font-size: 23px; }
.spark-two { inset-inline-end: 17%; inset-block-end: 25%; color: #745ddf; font-size: 24px; animation-delay: .8s; }
.spark-three { inset-inline-end: 9%; inset-block-start: 51%; font-size: 27px; animation-delay: 1.5s; }
.hero-sticker { position: absolute; z-index: 5; width: 70px; height: 70px; display: grid; align-content: center; justify-items: center; inset-inline-end: 18%; inset-block-end: 7%; border: 2px solid #f3d052; border-radius: 50%; color: #29263b; background: #d3f390; font-size: 9px; font-weight: 700; line-height: 1.2; transform: rotate(10deg); box-shadow: 0 6px 15px rgba(86, 94, 43, .1); }
.hero-sticker strong { font-size: 18px; font-weight: 900; }
.hero-index { position: absolute; inset-inline-end: 3px; inset-block-end: 63px; display: flex; align-items: center; gap: 8px; color: #9b97a2; font-size: 9px; direction: ltr; }
.hero-index span:first-child { color: var(--purple); font-weight: 800; }
.hero-index i { width: 35px; height: 1px; background: #c8c3ce; }
@keyframes float-phone { 0%,100% { margin-top: 0; } 50% { margin-top: -9px; } }
@keyframes float-mic { 0%,100% { margin-top: 0; } 50% { margin-top: 8px; } }
@keyframes float-light { 0%,100% { margin-top: 0; } 50% { margin-top: -6px; } }
@keyframes twinkle { 0%,100% { transform: scale(1) rotate(0); opacity: .72; } 50% { transform: scale(1.2) rotate(10deg); opacity: 1; } }

.quick-note { min-height: 78px; display: flex; align-items: center; gap: 15px; margin-block: 8px 94px; padding: 13px 20px; border: 1px solid #e9e6df; border-radius: 17px; background: rgba(255,255,255,.57); }
.note-icon { width: 42px; height: 42px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 13px; color: #5c4dcf; background: #ebe8ff; }
.note-icon svg { width: 21px; height: 21px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.quick-note > div:nth-child(2) { display: flex; flex-direction: column; gap: 2px; }
.quick-note strong { font-size: 12px; font-weight: 800; }
.quick-note > div:nth-child(2) span { color: #85818c; font-size: 10px; }
.quick-note > a { margin-inline-start: auto; color: var(--purple); font-size: 11px; font-weight: 800; white-space: nowrap; }
.quick-note > a span { margin-inline-start: 6px; font-size: 15px; }

.categories-section { padding-block: 0 105px; }
.section-heading { display: flex; align-items: end; justify-content: space-between; gap: 24px; margin-bottom: 25px; }
.section-heading .eyebrow { margin-bottom: 5px; }
.section-heading .eyebrow span, .about-intro .eyebrow span, .instagram-heading .eyebrow span { color: var(--purple); font-size: 15px; }
.section-heading h2, .instagram-heading h2 { margin: 0; font-size: clamp(25px, 3.2vw, 37px); font-weight: 750; line-height: 1.5; }
.text-link { padding-bottom: 5px; color: #5c52a3; font-size: 11px; font-weight: 800; white-space: nowrap; }
.text-link span { margin-inline-start: 5px; font-size: 16px; }
.category-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 14px; }
.category-card { min-width: 0; min-height: 217px; display: flex; flex-direction: column; align-items: flex-start; padding: 10px 11px 15px; overflow: hidden; border: 1px solid rgba(230,226,219,.9); border-radius: 20px; text-align: right; background: #fffefa; cursor: pointer; transition: transform .25s, box-shadow .25s, border-color .25s; }
.category-card:hover { transform: translateY(-5px); border-color: #d8d2fb; box-shadow: 0 15px 35px rgba(52, 46, 77, .09); }
.category-art { position: relative; width: 100%; height: 135px; display: grid; place-items: center; overflow: hidden; border-radius: 14px; }
.category-art::before, .category-art::after { content: ""; position: absolute; border: 1px solid rgba(255,255,255,.45); border-radius: 50%; }
.category-art::before { width: 95px; height: 95px; inset-inline-start: -9px; inset-block-start: -20px; }
.category-art::after { width: 125px; height: 125px; inset-inline-end: -30px; inset-block-end: -72px; }
.art-content { background: linear-gradient(135deg, #e4dcff, #b8aaff); }
.art-power { background: linear-gradient(135deg, #fce5bf, #facb89); }
.art-home { background: linear-gradient(135deg, #cee4f7, #9fcce1); }
.art-kids { background: linear-gradient(135deg, #ffe1e8, #f8b8ca); }
.art-care { background: linear-gradient(135deg, #e3efd0, #c4dfab); }
.category-art > i { position: absolute; z-index: 2; inset-inline-end: 15px; inset-block-start: 12px; color: rgba(255,255,255,.85); font-style: normal; font-size: 20px; }
.mini-phone { position: absolute; z-index: 1; width: 41px; height: 72px; inset-inline-start: calc(50% - 34px); inset-block-start: 30px; border: 3px solid #363044; border-radius: 9px; background: linear-gradient(150deg, #dcff95, #5bb0ac); transform: rotate(10deg); box-shadow: 8px 8px 0 rgba(64,45,132,.2); }
.mini-phone::after { content: ""; position: absolute; width: 12px; height: 2px; inset-inline-start: 12px; inset-block-start: 4px; border-radius: 3px; background: #464052; }
.mini-tripod { position: absolute; width: 3px; height: 69px; inset-inline-start: calc(50% + 19px); inset-block-start: 51px; border-radius: 4px; background: #3c344f; transform: rotate(-6deg); }
.mini-tripod::after { content: ""; position: absolute; width: 34px; height: 25px; inset-inline-start: -16px; inset-block-end: -3px; border-inline-start: 3px solid #3c344f; border-inline-end: 3px solid #3c344f; border-bottom: 3px solid #3c344f; transform: perspective(10px) rotateX(3deg); }
.mini-lamp { position: relative; z-index: 1; width: 47px; height: 65px; margin-top: 13px; border: 3px solid #70553c; border-radius: 25px 25px 12px 12px; background: linear-gradient(#fff4c7, #f4a460); box-shadow: 0 8px 20px rgba(171, 108, 48, .18); }
.mini-lamp::before { content: ""; position: absolute; width: 25px; height: 13px; inset-inline-start: 8px; inset-block-start: -14px; border: 3px solid #70553c; border-bottom: 0; border-radius: 15px 15px 0 0; }
.mini-lamp::after { content: ""; position: absolute; width: 30px; height: 4px; inset-inline-start: 6px; inset-block-end: 11px; border-radius: 3px; background: rgba(255,255,255,.6); }
.mini-robot { position: relative; z-index: 1; width: 95px; height: 48px; margin-top: 26px; border: 3px solid #68717b; border-radius: 50%; background: linear-gradient(#fff, #d8e2e7); box-shadow: 0 8px 13px rgba(45, 74, 94, .19); }
.mini-robot::before { content: ""; position: absolute; width: 9px; height: 9px; inset-inline-start: calc(50% - 5px); inset-block-start: 9px; border: 2px solid #66717b; border-radius: 50%; background: #b8eb72; }
.mini-robot::after { content: ""; position: absolute; width: 70%; height: 3px; inset-inline-start: 15%; inset-block-end: 9px; border-radius: 50%; background: #b8bec4; }
.mini-bunny { position: relative; z-index: 1; width: 52px; height: 54px; margin-top: 18px; border: 2px solid #bc9fa0; border-radius: 52% 52% 43% 43%; background: #fff9ec; box-shadow: 0 8px 14px rgba(155, 90, 113, .15); }
.mini-bunny::before, .mini-bunny::after { content: ""; position: absolute; width: 15px; height: 35px; inset-block-start: -30px; border: 2px solid #bc9fa0; border-radius: 50%; background: #fff9ec; }
.mini-bunny::before { inset-inline-start: 3px; transform: rotate(-15deg); }.mini-bunny::after { inset-inline-end: 3px; transform: rotate(15deg); }
.mini-bunny + i { color: #dd91a9; }
.mini-kit { position: relative; z-index: 1; width: 65px; height: 54px; display: grid; place-items: center; margin-top: 15px; border: 3px solid #9eaa8f; border-radius: 11px; color: #f16e5a; background: #fffdf5; font-size: 34px; font-weight: 900; box-shadow: 0 8px 15px rgba(76, 101, 61, .14); }
.category-title { margin-top: 11px; font-size: 12px; font-weight: 750; }
.category-meta { width: 100%; display: flex; align-items: center; justify-content: space-between; color: #96929c; font-size: 9px; }
.category-meta b { color: #6f62d4; font-size: 13px; }

.products-section { padding-block: 0 108px; }
.product-heading { margin-bottom: 22px; }
.section-subtitle { margin: 0 0 5px; color: #898590; font-size: 11px; }
.filter-bar { display: flex; align-items: center; gap: 8px; margin-bottom: 23px; overflow-x: auto; padding-bottom: 4px; scrollbar-width: none; }
.filter-bar::-webkit-scrollbar { display: none; }
.filter-chip { min-height: 34px; flex: 0 0 auto; padding: 0 15px; border: 1px solid #e4e1dc; border-radius: 10px; color: #77737e; background: rgba(255,255,255,.64); font-size: 10px; font-weight: 700; cursor: pointer; transition: color .2s, border-color .2s, background .2s; }
.filter-chip:hover { border-color: #c9c1f2; color: var(--purple); }
.filter-chip.selected { border-color: #29263b; color: white; background: #29263b; }
.product-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 26px 18px; }
.product-card { min-width: 0; overflow: hidden; border: 1px solid #e9e6df; border-radius: 21px; background: #fffefa; transition: transform .25s, box-shadow .25s, border-color .25s; }
.product-card:hover { transform: translateY(-4px); border-color: #ded9f4; box-shadow: 0 16px 40px rgba(45, 40, 66, .09); }
.product-card.filtered-out { display: none; }
.product-visual { position: relative; height: 257px; display: grid; place-items: center; overflow: hidden; isolation: isolate; }
.product-visual::before { content: ""; position: absolute; z-index: -1; width: 188px; height: 188px; border: 1px solid rgba(255,255,255,.48); border-radius: 50%; }
.product-visual::after { content: ""; position: absolute; z-index: -1; width: 270px; height: 270px; inset-inline-end: -132px; inset-block-end: -179px; border: 1px solid rgba(255,255,255,.42); border-radius: 50%; }
.product-visual-purple { background: linear-gradient(140deg, #f0eaff, #d9d0ff 54%, #c2b6f4); }
.product-visual-peach { background: linear-gradient(140deg, #fff1e4, #f7cfb8 55%, #f4bba6); }
.product-visual-lime { background: linear-gradient(140deg, #eef8dd, #d3eab0 55%, #c3e095); }
.product-visual-blue { background: linear-gradient(140deg, #e6f2f5, #c5e0e7 55%, #a9cfdd); }
.product-visual-pink { background: linear-gradient(140deg, #fbeaf0, #f3cedc 55%, #e7b7cb); }
.product-visual-cream { background: linear-gradient(140deg, #f5efe4, #e9dec9 55%, #dfd3bf); }
.product-svg { position: relative; z-index: 1; width: 75%; max-width: 240px; height: 90%; overflow: visible; filter: drop-shadow(0 13px 9px rgba(53, 45, 58, .13)); transition: transform .35s; }
.product-card:hover .product-svg { transform: translateY(-5px) scale(1.025); }
.product-tag { position: absolute; z-index: 2; inset-block-start: 14px; inset-inline-start: 14px; padding: 5px 9px; border-radius: 7px; font-size: 9px; font-weight: 800; }
.tag-lime { color: #3d4b2e; background: rgba(217, 249, 157, .92); }
.tag-dark { color: #35303c; background: rgba(255, 255, 255, .72); backdrop-filter: blur(5px); }
.favorite-button { position: absolute; z-index: 2; width: 31px; height: 31px; display: grid; place-items: center; inset-block-start: 11px; inset-inline-end: 11px; padding: 0; border: 1px solid rgba(255,255,255,.8); border-radius: 10px; color: #5c5567; background: rgba(255,255,255,.63); cursor: pointer; transition: color .2s, transform .2s, background .2s; }
.favorite-button:hover { transform: scale(1.06); }
.favorite-button svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linejoin: round; }
.favorite-button[aria-pressed="true"] { color: #e96c86; background: white; }
.favorite-button[aria-pressed="true"] svg { fill: #f59aaa; }
.visual-caption { position: absolute; z-index: 2; inset-inline-start: 14px; inset-block-end: 11px; color: rgba(51, 47, 61, .55); font-size: 8px; font-weight: 800; letter-spacing: .05em; direction: ltr; }
.visual-caption i { margin-inline: 2px; color: rgba(51, 47, 61, .3); font-style: normal; }
.product-info { padding: 16px 17px 15px; }
.product-meta { display: flex; align-items: center; gap: 7px; color: #95909a; font-size: 9px; }
.meta-dot { width: 3px; height: 3px; border-radius: 50%; background: #b8b4bd; }
.product-info h3 { margin: 6px 0 11px; font-size: 15px; font-weight: 700; }
.product-bottom { display: flex; align-items: center; justify-content: space-between; padding-top: 10px; border-top: 1px solid #f0ede8; }
.ask-price { color: #6d5dd7; font-size: 10px; font-weight: 800; }
.add-button { width: 32px; height: 32px; display: grid; place-items: center; border: 1px solid #d9d5ed; border-radius: 10px; color: #5547c3; background: #f8f6ff; font-size: 21px; line-height: 1; cursor: pointer; transition: color .2s, background .2s, transform .2s; }
.add-button:hover { transform: rotate(90deg); color: white; background: #5c4dcc; }
.empty-results { margin: 50px 0; padding: 35px 15px; border: 1px dashed #d9d4e4; border-radius: 18px; color: #77727e; text-align: center; font-size: 13px; }
.empty-results a { color: var(--purple); font-weight: 800; }
.catalog-note { display: flex; align-items: center; gap: 8px; margin: 19px 0 0; color: #8a8690; font-size: 10px; }
.catalog-note span { color: #82a94d; font-size: 15px; }

.creator-feature { position: relative; min-height: 396px; display: grid; grid-template-columns: .88fr 1fr; align-items: center; gap: 7%; padding: 52px clamp(34px, 7vw, 92px); overflow: hidden; border-radius: 30px; color: white; background: #29263b; isolation: isolate; }
.creator-feature::before { content: ""; position: absolute; z-index: -1; width: 470px; height: 470px; inset-inline-start: 23%; inset-block-start: -200px; border: 1px solid rgba(219, 212, 255, .12); border-radius: 50%; box-shadow: 0 0 0 45px rgba(219, 212, 255, .025), 0 0 0 100px rgba(219, 212, 255, .02); }
.creator-feature::after { content: ""; position: absolute; z-index: -1; width: 250px; height: 250px; inset-inline-end: -66px; inset-block-end: -130px; border-radius: 50%; background: rgba(108, 81, 195, .19); filter: blur(2px); }
.creator-copy { position: relative; z-index: 2; }
.eyebrow-light { color: #bab6c9; }
.eyebrow-light span { color: var(--lime); }
.creator-copy h2 { margin: 0; font-size: clamp(39px, 5vw, 60px); font-weight: 700; line-height: 1.38; }
.creator-copy h2 span { color: var(--lime); }
.creator-copy > p:not(.eyebrow) { max-width: 370px; margin: 14px 0 19px; color: #c3bfce; font-size: 12px; line-height: 2; }
.button-lime { min-height: 43px; gap: 16px; padding-inline: 17px; color: #29263b; background: var(--lime); font-size: 10px; }
.button-lime:hover { background: #d7f99c; box-shadow: 0 9px 22px rgba(200, 244, 119, .14); }
.creator-art { position: relative; min-height: 288px; display: grid; place-items: center; isolation: isolate; }
.creator-glow { position: absolute; width: 270px; height: 270px; border-radius: 50%; background: radial-gradient(circle, rgba(186, 246, 113, .34), rgba(162, 91, 232, .17) 47%, transparent 72%); filter: blur(10px); }
.creator-ring { position: absolute; width: 246px; height: 246px; border: 1px solid rgba(222, 211, 255, .18); border-radius: 50%; transform: rotate(-24deg) scaleY(.55); }
.ring-small { width: 310px; height: 310px; transform: rotate(42deg) scaleY(.3); border-color: rgba(255, 154, 106, .34); }
.creator-phone { position: relative; z-index: 1; width: 130px; height: 224px; display: grid; place-items: center; border: 7px solid #181722; border-radius: 24px; background: linear-gradient(145deg, #d6f895, #8981e1 55%, #ef9971); box-shadow: 0 20px 36px rgba(7, 7, 13, .38), inset 0 0 0 1px rgba(255,255,255,.25); transform: rotate(-7deg); }
.creator-phone::before { content: ""; position: absolute; width: 47px; height: 12px; inset-block-start: 6px; border-radius: 8px; background: #181722; }
.creator-phone span { width: 57px; height: 57px; border: 1px solid rgba(255,255,255,.64); border-radius: 50%; background: rgba(242, 245, 204, .3); box-shadow: 0 0 0 10px rgba(255,255,255,.1); }
.creator-phone i { position: absolute; width: 88px; height: 42px; inset-block-end: 21px; border-radius: 44px 44px 9px 9px; background: linear-gradient(135deg, rgba(48,35,96,.65), rgba(255,255,255,.3)); }
.creator-mic { position: absolute; z-index: 2; width: 51px; height: 69px; inset-inline-start: 22%; inset-block-end: 43px; border: 5px solid #3d3a49; border-radius: 15px; background: linear-gradient(155deg, #d0cbc4, #706e78); transform: rotate(11deg); box-shadow: 0 13px 18px rgba(8, 7, 12, .3); }
.creator-mic::before { content: ""; position: absolute; width: 31px; height: 16px; inset-inline-start: 5px; inset-block-start: 8px; border-radius: 10px; background: #52505c; }
.creator-mic::after { content: ""; position: absolute; width: 6px; height: 6px; inset-inline-start: 18px; inset-block-end: 7px; border-radius: 50%; background: var(--lime); }
.creator-mic-dot { position: absolute; z-index: 1; width: 45px; height: 16px; inset-inline-start: 21%; inset-block-end: 26px; border-radius: 50%; background: rgba(5,5,10,.33); filter: blur(3px); }
.creator-star { position: absolute; color: var(--lime); font-size: 23px; }
.star-a { inset-inline-start: 19%; inset-block-start: 33px; }.star-b { inset-inline-end: 21%; inset-block-end: 47px; color: #ff9b77; font-size: 32px; }
.creator-sticker { position: absolute; z-index: 2; inset-inline-end: 12%; inset-block-start: 17%; padding: 8px 10px; border: 1px solid rgba(255,255,255,.38); border-radius: 9px; color: #f2edff; background: rgba(30, 27, 43, .35); font-family: Arial, sans-serif; font-size: 8px; line-height: 1.25; letter-spacing: .14em; transform: rotate(8deg); }
.creator-sticker b { color: var(--lime); font-size: 13px; }
.creator-number { position: absolute; inset-inline-end: 23px; inset-block-end: 19px; display: flex; align-items: center; gap: 8px; color: #a9a5b6; direction: ltr; font-size: 9px; }
.creator-number span:first-child { color: var(--lime); font-weight: 800; }
.creator-number i { width: 35px; height: 1px; background: #666276; }

.about-section { display: grid; grid-template-columns: .92fr 1fr; align-items: center; gap: 9%; padding-block: 120px 108px; }
.about-intro .eyebrow { margin-bottom: 8px; }
.about-intro h2 { margin: 0; font-size: clamp(32px, 4.4vw, 51px); font-weight: 700; line-height: 1.5; }
.about-intro h2 span { position: relative; color: #5d4dcd; }
.about-intro h2 span::after { content: ""; position: absolute; height: 8px; inset-inline: -3px; inset-block-end: 5px; z-index: -1; border-radius: 50%; background: #d5f494; }
.about-intro > p:not(.eyebrow) { max-width: 430px; margin: 16px 0 20px; color: #77737e; font-size: 12px; line-height: 2.1; }
.button-outline { min-height: 42px; gap: 12px; padding-inline: 15px; border-color: #d9d5e2; color: #474253; background: transparent; font-size: 10px; }
.button-outline:hover { border-color: #b8adf1; color: var(--purple); background: white; }
.about-points { display: flex; flex-direction: column; gap: 12px; }
.about-point { display: flex; align-items: center; gap: 14px; min-height: 83px; padding: 14px 14px; border: 1px solid #e8e5de; border-radius: 16px; background: rgba(255,255,255,.58); transition: transform .2s, background .2s; }
.about-point:hover { transform: translateX(-4px); background: #fffefa; }
.point-icon { width: 42px; height: 42px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 13px; font-size: 11px; font-weight: 900; }
.point-purple { color: #5b4ccc; background: #eeebff; }.point-orange { color: #a5533c; background: #ffe7db; }.point-lime { color: #577332; background: #e9f7d5; }
.about-point strong { font-size: 12px; font-weight: 750; }
.about-point p { margin: 2px 0 0; color: #898590; font-size: 10px; }
.point-arrow { margin-inline-start: auto; color: #9993aa; font-size: 16px; }

.instagram-section { padding-block: 4px 112px; }
.instagram-heading { display: flex; align-items: end; justify-content: space-between; gap: 20px; margin-bottom: 21px; }
.instagram-heading .eyebrow { margin-bottom: 5px; }
.instagram-link { display: inline-flex; align-items: center; gap: 8px; padding-bottom: 5px; color: #5147b1; font-size: 11px; font-weight: 800; direction: ltr; white-space: nowrap; }
.instagram-glyph { width: 22px; height: 22px; display: grid; place-items: center; border: 1.5px solid currentColor; border-radius: 7px; font-size: 19px; line-height: 1; }
.instagram-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 13px; }
.insta-card { position: relative; min-height: 236px; display: flex; align-items: center; justify-content: center; overflow: hidden; border-radius: 17px; text-align: center; isolation: isolate; transition: transform .23s; }
.insta-card:hover { transform: translateY(-4px) rotate(.4deg); }
.insta-card::before { content: ""; position: absolute; z-index: -1; width: 190px; height: 190px; inset-inline-start: calc(50% - 95px); inset-block-start: -81px; border: 1px solid rgba(255,255,255,.3); border-radius: 50%; box-shadow: 0 0 0 28px rgba(255,255,255,.08), 0 0 0 57px rgba(255,255,255,.055); }
.insta-one { color: white; background: linear-gradient(145deg, #705ab0, #bb71bd 58%, #f39a96); }
.insta-two { color: white; background: linear-gradient(145deg, #e08b69, #d68c8a 54%, #9f6bb4); }
.insta-three { color: white; background: linear-gradient(145deg, #d4966d, #ccad83 55%, #6d7e85); }
.insta-four { color: white; background: linear-gradient(145deg, #c66c95, #945e9f 54%, #584a94); }
.insta-reel { position: absolute; z-index: 3; inset-inline-end: 12px; inset-block-start: 12px; width: 24px; height: 24px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.65); border-radius: 8px; color: white; background: rgba(255,255,255,.18); font-size: 9px; backdrop-filter: blur(5px); }
.insta-card b { position: absolute; z-index: 2; inset-block-start: 32%; inset-inline: 0; font-size: 19px; font-weight: 700; line-height: 1.5; text-shadow: 0 3px 14px rgba(48, 30, 74, .2); }
.insta-card > i { position: absolute; z-index: 2; inset-block-end: 20px; inset-inline: 0; font-size: 10px; font-style: normal; font-weight: 600; }
.insta-art-phone { position: absolute; width: 66px; height: 108px; inset-inline-start: calc(50% - 33px); inset-block-start: 20px; border: 5px solid rgba(255,255,255,.48); border-radius: 13px; background: linear-gradient(140deg, #d8f693, #ee8e9c 60%, #5e4fa6); transform: rotate(13deg); box-shadow: 0 12px 25px rgba(42, 26, 77, .22); }
.insta-art-phone::after { content: ""; position: absolute; width: 31px; height: 31px; inset-inline-start: 12px; inset-block-start: 32px; border: 1px solid rgba(255,255,255,.7); border-radius: 50%; }
.insta-art-case { position: absolute; width: 112px; height: 56px; inset-inline-start: calc(50% - 56px); inset-block-start: 50px; border: 2px solid rgba(255,255,255,.57); border-radius: 17px; background: linear-gradient(150deg, #42424c, #1b1b25); box-shadow: 0 11px 24px rgba(42, 26, 77, .23); transform: rotate(-8deg); }
.insta-art-case::before, .insta-art-case::after { content: ""; position: absolute; width: 20px; height: 29px; inset-block-start: -38px; border: 2px solid rgba(255,255,255,.72); border-radius: 8px; background: #34343d; }
.insta-art-case::before { inset-inline-start: 22px; }.insta-art-case::after { inset-inline-start: 69px; }
.insta-art-lamp { position: absolute; width: 55px; height: 95px; inset-inline-start: calc(50% - 28px); inset-block-start: 21px; border: 3px solid rgba(255,255,255,.75); border-radius: 28px 28px 13px 13px; background: linear-gradient(#fff1b8, #f1a26c 76%, #f5e9d2 77%); box-shadow: 0 13px 23px rgba(48, 38, 23, .18); transform: rotate(9deg); }
.insta-art-bag { position: absolute; width: 91px; height: 86px; inset-inline-start: calc(50% - 45px); inset-block-start: 30px; border: 2px solid rgba(255,255,255,.7); border-radius: 10px 10px 23px 23px; background: linear-gradient(140deg, #ffe38a, #fa9b74 55%, #a35d9a); transform: rotate(-8deg); box-shadow: 0 14px 22px rgba(42, 26, 77, .2); }
.insta-art-bag::before { content: ""; position: absolute; width: 34px; height: 24px; inset-inline-start: 26px; inset-block-start: -23px; border: 2px solid rgba(255,255,255,.75); border-bottom: 0; border-radius: 20px 20px 0 0; }
.instagram-caption { margin: 12px 0 0; color: #96919b; font-size: 9px; text-align: center; }
.instagram-caption span { margin-inline: 4px; color: #7162d2; }

.site-footer { color: #ebe8f0; background: #282538; }
.footer-top { min-height: 106px; display: flex; align-items: center; justify-content: space-between; gap: 20px; border-bottom: 1px solid rgba(255,255,255,.12); }
.footer-brand .brand-mark { background: linear-gradient(#fffefa, #fffefa) padding-box, conic-gradient(from 210deg, #ffc642, #fa5a59, #ea35aa, #8059f6, #ffc642) border-box; }
.footer-brand .brand-wordmark strong { color: white; }.footer-brand .brand-wordmark small { color: #aaa6b5; }
.footer-top > p { margin: 0; color: #aaa6b5; font-size: 11px; }
.footer-instagram { padding: 8px 13px; border: 1px solid rgba(255,255,255,.22); border-radius: 9px; color: #e3ddf9; font-size: 10px; font-weight: 700; }
.footer-instagram span { margin-inline-start: 5px; color: var(--lime); font-size: 14px; }
.footer-bottom { min-height: 58px; display: flex; align-items: center; justify-content: space-between; gap: 15px; color: #aaa6b5; font-size: 9px; }
.footer-location { display: inline-flex; align-items: center; gap: 7px; }
.footer-location i { width: 6px; height: 6px; border-radius: 50%; background: var(--lime); }
.mobile-dock { display: none; }

.drawer-scrim { position: fixed; z-index: 80; inset: 0; background: rgba(25, 23, 35, .4); backdrop-filter: blur(3px); opacity: 0; transition: opacity .25s; }
.drawer-scrim.is-open { opacity: 1; }
.cart-drawer { position: fixed; z-index: 81; inset-block: 0; inset-inline-start: 0; width: min(430px, 100%); display: flex; flex-direction: column; padding: 25px 24px 21px; background: var(--paper); box-shadow: -15px 0 55px rgba(25, 23, 35, .16); transform: translateX(105%); transition: transform .3s cubic-bezier(.2,.7,.25,1); }
.cart-drawer.is-open { transform: translateX(0); }
.drawer-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 15px; padding-bottom: 17px; border-bottom: 1px solid var(--line); }
.drawer-head .eyebrow { margin-bottom: 3px; font-size: 10px; }.drawer-head .eyebrow span { color: var(--purple); }
.drawer-head h2 { margin: 0; font-size: 23px; font-weight: 750; }
.drawer-head h2 span { color: #8e8994; font-size: 13px; font-weight: 600; }
.icon-button { width: 38px; height: 38px; display: grid; place-items: center; padding: 0; border: 1px solid var(--line); border-radius: 12px; color: #696471; background: white; cursor: pointer; }
.close-cart span { font-size: 25px; line-height: 1; }
.drawer-body { min-height: 0; flex: 1; overflow-y: auto; padding-block: 8px 14px; }
.drawer-empty { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 15px; text-align: center; }
.empty-bag { width: 69px; height: 69px; display: grid; place-items: center; margin-bottom: 13px; border-radius: 23px; color: #6554d5; background: #ebe8ff; }
.empty-bag svg { width: 34px; height: 34px; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.drawer-empty strong { font-size: 15px; font-weight: 750; }.drawer-empty p { max-width: 240px; margin: 4px 0 16px; color: #8e8994; font-size: 11px; }
.drawer-empty .button { min-height: 42px; }
.cart-item { display: grid; grid-template-columns: 61px 1fr auto; align-items: center; gap: 12px; padding: 12px 0; border-bottom: 1px solid #e9e5de; }
.cart-item-art { width: 61px; height: 61px; display: grid; place-items: center; border-radius: 13px; color: #5547c3; background: linear-gradient(145deg, #eeeaff, #d4ccff); font-size: 25px; font-weight: 800; }
.cart-item:nth-child(3n + 2) .cart-item-art { color: #a75e46; background: linear-gradient(145deg, #ffe9d9, #f4c5b0); }
.cart-item:nth-child(3n) .cart-item-art { color: #59753a; background: linear-gradient(145deg, #e6f4d5, #cce7ab); }
.cart-item-copy strong { display: block; font-size: 12px; font-weight: 750; }.cart-item-copy span { display: block; color: #918c97; font-size: 9px; }
.quantity-control { display: flex; align-items: center; gap: 7px; margin-top: 7px; }
.quantity-control button { width: 22px; height: 22px; display: grid; place-items: center; padding: 0; border: 1px solid #ddd8e5; border-radius: 7px; color: #5e53a6; background: white; font-size: 14px; cursor: pointer; }
.quantity-control span { min-width: 17px; color: var(--ink); font-size: 10px; font-weight: 800; text-align: center; }
.remove-item { width: 25px; height: 25px; display: grid; place-items: center; border: 0; border-radius: 7px; color: #a49eaa; background: transparent; cursor: pointer; font-size: 16px; }
.remove-item:hover { color: #d6606b; background: #fff0ef; }
.drawer-footer { padding-top: 13px; border-top: 1px solid var(--line); }
.price-note { display: flex; align-items: center; gap: 7px; margin: 0 0 12px; color: #898490; font-size: 10px; }
.price-note span { color: #80a94c; }
.copy-order { width: 100%; min-height: 47px; justify-content: center; }
.drawer-ig-link { display: block; margin-top: 11px; color: #6453ce; font-size: 10px; font-weight: 800; text-align: center; }
.drawer-ig-link span { margin-inline-start: 5px; font-size: 13px; }
.toast { position: fixed; z-index: 100; inset-inline-start: 50%; inset-block-end: 27px; max-width: calc(100% - 30px); padding: 11px 17px; border: 1px solid rgba(255,255,255,.2); border-radius: 12px; color: white; background: #2e2b41; box-shadow: 0 10px 30px rgba(34,31,50,.22); font-size: 11px; font-weight: 700; text-align: center; opacity: 0; pointer-events: none; transform: translate(-50%, 12px); transition: opacity .22s, transform .22s; }
.toast.is-visible { opacity: 1; transform: translate(-50%, 0); }

@media (max-width: 1050px) {
  .header-inner { gap: 18px; }
  .desktop-nav { gap: 20px; }
  .searchbox { width: 175px; }
  .hero { min-height: 490px; gap: 3%; }
  .hero-copy { padding-inline-start: 0; }
  .hero h1 { font-size: clamp(36px, 4.2vw, 44px); line-height: 1.38; }
  .hero-visual { width: 100%; }
  .category-grid { gap: 10px; }
  .product-visual { height: 224px; }
}
@media (max-width: 820px) {
  .page-width { width: min(100% - 42px, 680px); }
  .header-inner { width: calc(100% - 38px); min-height: 70px; }
  .desktop-nav { gap: 15px; }
  .desktop-nav .nav-link { font-size: 11px; }
  .searchbox { width: 41px; justify-content: center; padding: 0; }
  .searchbox input, .searchbox kbd { display: none; }
  .hero { min-height: 430px; grid-template-columns: 1.02fr .98fr; padding-top: 43px; }
  .hero h1 { font-size: clamp(42px, 5.2vw, 54px); }
  .hero-description { font-size: 12px; }
  .hero-visual { align-self: center; }
  .float-label { padding: 8px 10px; }
  .quick-note { margin-bottom: 77px; }
  .category-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .category-card { min-height: 204px; }
  .product-grid { gap: 15px 12px; }
  .product-visual { height: 205px; }
  .product-info { padding-inline: 13px; }
  .creator-feature { min-height: 360px; padding-inline: 43px; gap: 3%; }
  .creator-art { transform: scale(.88); }
  .about-section { gap: 5%; }
  .insta-card { min-height: 195px; }
  .insta-card b { font-size: 16px; }
}
@media (max-width: 640px) {
  html { scroll-padding-top: 79px; }
  body { padding-bottom: 72px; font-size: 14px; }
  .page-width { width: calc(100% - 36px); }
  .announcement { min-height: 34px; gap: 7px; font-size: 9px; }
  .announcement-divider { height: 12px; }
  .header-inner { width: calc(100% - 30px); min-height: 65px; gap: 9px; }
  .brand { gap: 7px; }.brand-mark { width: 39px; height: 39px; }.brand-wordmark strong { font-size: 15px; }.brand-wordmark small { font-size: 8px; }
  .desktop-nav { display: none; }
  .header-actions { gap: 7px; margin-inline-start: auto; }
  .searchbox { display: none; }
  .mobile-search { width: 38px; height: 38px; display: grid; border-color: transparent; background: transparent; }
  .mobile-search svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-width: 1.7; }
  .cart-button { width: 94px; height: 38px; gap: 6px; padding-inline: 8px; border-radius: 11px; }
  .cart-button > svg { width: 17px; height: 17px; }.cart-label { font-size: 10px; }
  .cart-count { min-width: 17px; height: 17px; font-size: 9px; }
  .mobile-search-row { width: calc(100% - 30px); height: 42px; display: none; align-items: center; gap: 9px; margin: 0 auto 11px; padding: 0 12px; border: 1px solid #e1ddef; border-radius: 12px; background: white; }
  .mobile-search-row.is-open { display: flex; }
  .mobile-search-row button { width: 23px; height: 23px; padding: 0; border: 0; border-radius: 7px; color: #85818b; background: #f4f2f8; font-size: 19px; line-height: 1; }
  .mobile-search-row input { font-size: 12px; }
  .hero { min-height: 0; grid-template-columns: 1fr; gap: 18px; padding-block: 34px 29px; }
  .hero-copy { padding-inline: 3px; }
  .eyebrow { margin-bottom: 11px; font-size: 9px; }.eyebrow-icon { width: 19px; height: 19px; font-size: 12px; }
  .hero h1 { font-size: clamp(39px, 10vw, 53px); line-height: 1.32; }
  .hero h1 > span:first-of-type::after { height: 8px; inset-block-end: 4px; }
  .hero-description { max-width: 350px; margin: 11px 0 16px; font-size: 11px; line-height: 1.95; }
  .hero-actions { gap: 7px; }.button { min-height: 43px; gap: 11px; padding-inline: 15px; border-radius: 11px; font-size: 10px; }
  .button-quiet { min-height: 42px; }.play-icon { width: 21px; height: 21px; }
  .hero-footnote { flex-wrap: wrap; gap: 6px; margin-top: 17px; font-size: 9px; }
  .hero-visual { width: 100%; max-width: 440px; min-height: 290px; margin-inline: auto; aspect-ratio: 1 / .78; border-radius: 28% 25% 28% 25% / 25% 27% 25% 29%; }
  .hero-phone { width: 39%; inset-inline-start: 31%; inset-block-start: 12%; }
  .hero-mic { width: 37%; inset-inline-start: 55%; inset-block-start: 52%; }
  .hero-light { width: 22%; inset-inline-start: 13%; inset-block-start: 58%; }
  .float-label { padding: 7px 9px; border-radius: 10px; font-size: 8px; }.float-label b { font-size: 9px; }.label-spark { width: 20px; height: 20px; }
  .float-label-top { inset-inline-end: 1%; inset-block-start: 13%; }.float-label-bottom { inset-inline-start: 0; inset-block-end: 12%; }
  .hero-sticker { width: 57px; height: 57px; inset-inline-end: 15%; inset-block-end: 2%; font-size: 7px; }.hero-sticker strong { font-size: 15px; }
  .hero-index { display: none; }
  .quick-note { min-height: 67px; gap: 10px; margin-block: 0 63px; padding: 9px 11px; border-radius: 14px; }
  .note-icon { width: 36px; height: 36px; border-radius: 11px; }.note-icon svg { width: 19px; height: 19px; }
  .quick-note strong { font-size: 10px; }.quick-note > div:nth-child(2) span { max-width: 190px; font-size: 8px; line-height: 1.6; }
  .quick-note > a { font-size: 9px; }.quick-note > a span { margin-inline-start: 3px; font-size: 12px; }
  .categories-section { padding-bottom: 67px; }
  .section-heading { align-items: end; gap: 10px; margin-bottom: 16px; }.section-heading .eyebrow { margin-bottom: 3px; }
  .section-heading h2, .instagram-heading h2 { font-size: clamp(23px, 6vw, 30px); }
  .text-link { padding-bottom: 3px; font-size: 9px; }.text-link span { font-size: 13px; }
  .category-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .category-card { min-height: 184px; padding: 8px 8px 11px; border-radius: 16px; }
  .category-card:last-child { display: none; }
  .category-art { height: 116px; border-radius: 12px; }
  .category-title { margin-top: 8px; font-size: 11px; }.category-meta { font-size: 8px; }
  .mini-phone { transform: scale(.86) rotate(10deg); }.mini-tripod { transform: scale(.9) rotate(-6deg); }
  .products-section { padding-bottom: 68px; }
  .product-heading { align-items: flex-start; flex-direction: column; gap: 3px; margin-bottom: 14px; }
  .product-heading .section-subtitle { margin: 0; font-size: 9px; }
  .filter-bar { gap: 6px; margin: 0 -18px 15px; padding-inline: 18px; }
  .filter-chip { min-height: 31px; padding-inline: 12px; font-size: 9px; }
  .product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .product-card { border-radius: 15px; }
  .product-visual { height: clamp(150px, 47vw, 215px); }
  .product-svg { width: 90%; height: 88%; }
  .product-tag { inset-block-start: 9px; inset-inline-start: 8px; padding: 4px 6px; border-radius: 6px; font-size: 7px; }
  .favorite-button { width: 27px; height: 27px; inset-block-start: 7px; inset-inline-end: 7px; border-radius: 8px; }.favorite-button svg { width: 14px; height: 14px; }
  .visual-caption { inset-inline-start: 9px; inset-block-end: 7px; font-size: 7px; }
  .product-info { padding: 10px 10px 10px; }
  .product-meta { gap: 4px; font-size: 7px; }.product-info h3 { min-height: 41px; margin: 5px 0 6px; font-size: 11px; line-height: 1.8; }
  .product-bottom { padding-top: 7px; }.ask-price { max-width: calc(100% - 37px); font-size: 8px; }.add-button { width: 29px; height: 29px; border-radius: 9px; font-size: 19px; }
  .catalog-note { align-items: flex-start; margin-top: 13px; font-size: 8px; line-height: 1.8; }
  .creator-feature { width: calc(100% - 26px); min-height: 0; grid-template-columns: 1fr; gap: 0; padding: 30px 23px 0; border-radius: 23px; }
  .creator-copy .eyebrow { margin-bottom: 8px; }.creator-copy h2 { font-size: 43px; }.creator-copy > p:not(.eyebrow) { max-width: 330px; margin: 7px 0 13px; font-size: 10px; }
  .button-lime { min-height: 39px; padding-inline: 13px; font-size: 9px; }
  .creator-art { min-height: 240px; margin-top: -2px; transform: scale(.8); transform-origin: center top; }
  .creator-number { inset-inline-end: 14px; inset-block-end: 12px; }
  .about-section { grid-template-columns: 1fr; gap: 25px; padding-block: 67px 70px; }
  .about-intro .eyebrow { margin-bottom: 5px; }.about-intro h2 { font-size: 36px; }.about-intro > p:not(.eyebrow) { margin: 10px 0 13px; font-size: 10px; }
  .button-outline { min-height: 39px; font-size: 9px; }
  .about-points { gap: 8px; }.about-point { min-height: 72px; gap: 10px; padding: 10px; border-radius: 13px; }
  .point-icon { width: 36px; height: 36px; border-radius: 10px; font-size: 9px; }.about-point strong { font-size: 10px; }.about-point p { font-size: 8px; }.point-arrow { font-size: 13px; }
  .instagram-section { padding-bottom: 71px; }
  .instagram-heading { align-items: flex-start; flex-direction: column; gap: 9px; margin-bottom: 14px; }.instagram-heading h2 { font-size: 23px; }
  .instagram-link { align-self: flex-end; font-size: 10px; }.instagram-glyph { width: 20px; height: 20px; font-size: 17px; }
  .instagram-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .insta-card { min-height: clamp(158px, 46vw, 205px); border-radius: 13px; }
  .insta-card b { inset-block-start: 34%; font-size: 15px; }.insta-card > i { inset-block-end: 13px; font-size: 8px; }
  .insta-reel { width: 21px; height: 21px; inset-inline-end: 8px; inset-block-start: 8px; border-radius: 6px; font-size: 8px; }
  .insta-art-phone { width: 55px; height: 91px; inset-inline-start: calc(50% - 27px); inset-block-start: 13px; }.insta-art-phone::after { width: 25px; height: 25px; inset-inline-start: 10px; inset-block-start: 27px; }
  .insta-art-case { width: 92px; height: 48px; inset-inline-start: calc(50% - 46px); inset-block-start: 37px; }.insta-art-case::before, .insta-art-case::after { width: 17px; height: 24px; inset-block-start: -30px; }.insta-art-case::before { inset-inline-start: 18px; }.insta-art-case::after { inset-inline-start: 56px; }
  .insta-art-lamp { width: 45px; height: 79px; inset-inline-start: calc(50% - 23px); inset-block-start: 13px; }.insta-art-bag { width: 76px; height: 71px; inset-inline-start: calc(50% - 38px); inset-block-start: 20px; }
  .instagram-caption { font-size: 8px; line-height: 1.8; }
  .footer-top { min-height: 89px; gap: 8px; }.footer-top > p { display: none; }.footer-brand .brand-mark { width: 37px; height: 37px; }
  .footer-instagram { padding: 7px 9px; font-size: 9px; }.footer-bottom { min-height: 0; flex-wrap: wrap; justify-content: center; gap: 5px 15px; padding-block: 12px 15px; font-size: 8px; text-align: center; }.footer-bottom > span:last-child { width: 100%; }
  .mobile-dock { position: fixed; z-index: 50; inset-inline: 0; inset-block-end: 0; height: 66px; display: grid; grid-template-columns: repeat(4, 1fr); align-items: center; padding: 5px 8px max(5px, env(safe-area-inset-bottom)); border-top: 1px solid #e5e1dc; background: rgba(255,254,250,.95); box-shadow: 0 -7px 25px rgba(39, 36, 52, .06); backdrop-filter: blur(15px); }
  .dock-link { min-width: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; padding: 0; border: 0; color: #94909a; background: none; font-size: 8px; font-weight: 600; }
  .dock-link > svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
  .dock-active { color: #5e4ccd; font-weight: 800; }
  .dock-bag { position: relative; display: block; }.dock-bag svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
  .dock-bag b { position: absolute; min-width: 14px; height: 14px; display: grid; place-items: center; inset-inline-start: -7px; inset-block-start: -4px; padding: 0 2px; border: 1.5px solid white; border-radius: 5px; color: #29263b; background: var(--lime); font-size: 7px; }
  .cart-drawer { width: min(420px, 100%); padding: 19px 17px max(16px, env(safe-area-inset-bottom)); }
  .drawer-head h2 { font-size: 20px; }.cart-item { grid-template-columns: 54px 1fr auto; gap: 9px; }.cart-item-art { width: 54px; height: 54px; }
  .toast { inset-block-end: 79px; font-size: 10px; }
}
@media (max-width: 380px) {
  .page-width { width: calc(100% - 28px); }
  .hero h1 { font-size: 42px; }
  .quick-note { gap: 7px; padding-inline: 8px; }.quick-note > a { font-size: 8px; }
  .category-card { min-height: 174px; }.category-art { height: 107px; }
  .product-meta { font-size: 6.5px; }.product-info h3 { font-size: 10px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}
