:root {
  color-scheme: dark;
  --page: #080b0e;
  --surface: #0e1217;
  --surface-raised: #141a20;
  --surface-light: #1a2026;
  --line: #2b3238;
  --muted: #a4abb2;
  --text: #f1f1ef;
  --red: #f22f3a;
  --red-hover: #d91f2a;
  --green: #12b86c;
  --wood: #755034;
  --wood-light: #a5794d;
  --display: 'Manrope', 'Trebuchet MS', sans-serif;
  --body: 'DM Sans', 'Segoe UI', sans-serif;
  font-family: var(--body);
  background: var(--page);
  color: var(--text);
  font-synthesis: none;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 82px; }
body { margin: 0; min-width: 320px; background: #090c10; }
a { color: inherit; text-decoration: none; }
button { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button:focus-visible, a:focus-visible, [tabindex="0"]:focus-visible { outline: 2px solid #fff; outline-offset: 3px; }
svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.svg-defs, .visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.site-shell { width: min(100% - 24px, 1420px); margin-inline: auto; border-inline: 1px solid #1b2025; background: var(--page); }
.topbar { position: relative; z-index: 5; display: flex; align-items: center; gap: 22px; min-height: 62px; padding: 0 clamp(17px, 3.1vw, 38px); background: #090b0e; border-bottom: 1px solid #292c30; }
.brand { display: inline-flex; align-items: center; gap: 9px; flex: 0 0 auto; }
.brand-mark { display: block; width: 44px; height: 38px; object-fit: contain; background: #080808; }
.brand-wordmark > span { display: block; font-family: var(--display); font-size: 12px; font-weight: 800; letter-spacing: .25px; white-space: nowrap; }
.brand-wordmark b { color: var(--red); }
.brand-wordmark small { display: block; margin-top: 2px; font-size: 7px; letter-spacing: 2.2px; }
.brand-wordmark small::before, .brand-wordmark small::after { display: inline-block; width: 12px; height: 1px; margin: 0 5px 2px 0; background: var(--red); content: ''; vertical-align: middle; }
.brand-wordmark small::after { margin: 0 0 2px 5px; }
.main-nav { display: flex; align-items: stretch; justify-content: center; gap: clamp(13px, 2vw, 27px); flex: 1; align-self: stretch; }
.main-nav a { position: relative; display: inline-flex; align-items: center; white-space: nowrap; font-size: 11px; color: #e5e6e6; transition: color .2s ease; }
.main-nav a:hover, .main-nav a.active { color: #fff; }
.main-nav a.active::after { position: absolute; right: 0; bottom: 0; left: 0; height: 2px; content: ''; background: var(--red); }
.nav-actions { display: flex; align-items: center; gap: 13px; flex: 0 0 auto; }
.icon-button { display: inline-grid; place-items: center; position: relative; width: 36px; height: 36px; padding: 0; color: var(--text); background: transparent; border: 0; cursor: pointer; }
.icon-button svg { width: 18px; height: 18px; }
.cart-count { position: absolute; top: 1px; right: 0; display: grid; place-items: center; min-width: 15px; height: 15px; padding: 0 3px; border-radius: 50%; background: var(--red); font-size: 9px; }
.button { display: inline-flex; align-items: center; justify-content: center; gap: 9px; min-height: 42px; padding: 0 17px; border: 1px solid transparent; border-radius: 8px; font-size: 12px; font-weight: 700; line-height: 1; cursor: pointer; transition: transform .2s ease, background .2s ease, border-color .2s ease; }
.button:hover { transform: translateY(-1px); }
.button svg { width: 15px; height: 15px; }
.button-red { background: var(--red); color: #fff; }
.button-red:hover { background: var(--red-hover); }
.button-outline { background: #0e1115; border-color: #52585d; color: #f6f6f5; }
.button-outline:hover { background: #1b2026; border-color: #91979b; }
.button-green { background: var(--green); color: #fff; }
.button-green:hover { background: #0da45e; }
.button-small { min-height: 34px; padding: 0 12px; font-size: 10px; font-weight: 500; }
.button-small svg { width: 13px; height: 13px; }
.menu-toggle { display: none; }
.hero { position: relative; display: grid; grid-template-columns: .91fr 1.09fr; min-height: 398px; overflow: hidden; isolation: isolate; background: #08090c; border-bottom: 1px solid #1c2227; }
.hero-copy { z-index: 1; align-self: center; padding: 41px clamp(22px, 4.4vw, 55px); }
.eyebrow, .section-kicker { color: var(--red); font-size: 10px; font-weight: 700; letter-spacing: 1.3px; }
h1, h2, h3, p { margin-top: 0; }
.hero h1 { margin: 11px 0 8px; font-family: var(--display); font-size: clamp(37px, 4.4vw, 56px); font-weight: 800; letter-spacing: 0; line-height: 1.02; }
.hero h1 span, .section-heading h2 span, .create-copy h2 span { color: var(--red); }
.hero-copy > p { max-width: 382px; margin-bottom: 15px; color: #e1e3e4; font-size: 14px; line-height: 1.45; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 9px; }
.hero-actions .button { min-height: 39px; font-size: 11px; }
.wa-icon { flex: 0 0 auto; color: #30df85; }
.hero-trust { display: flex; flex-wrap: wrap; gap: 13px 20px; margin-top: 18px; color: #d5d9db; font-size: 9px; }
.hero-trust span, .promise-strip > span { display: inline-flex; align-items: center; gap: 5px; white-space: nowrap; }
.hero-trust svg { width: 13px; height: 13px; }
.hero-display { position: relative; min-height: 398px; overflow: hidden; background: radial-gradient(ellipse at 56% 41%, #695440 0, #392c24 46%, #171719 81%, #111316 100%); }
.hero-display::before { position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, #08090c 0, transparent 18%, transparent 90%, #090b0e 100%); content: ''; }
.display-window { position: absolute; top: 27px; right: 17%; width: 45%; height: 201px; border: 11px solid #211c19; border-bottom-width: 16px; background: linear-gradient(135deg, #7b8969, #dbb58a 55%, #383e37); opacity: .28; box-shadow: 0 0 0 2px #8a7159, inset 0 0 20px #131313; }
.display-lamp { position: absolute; top: 37px; left: 21%; width: 48px; height: 66px; }
.display-lamp::before { position: absolute; top: 0; left: 18px; width: 11px; height: 37px; border-radius: 3px 3px 1px 1px; background: linear-gradient(90deg, #101112, #483a2a); content: ''; }
.display-lamp::after { position: absolute; top: 31px; left: 2px; width: 42px; height: 22px; background: linear-gradient(180deg, #e4c28d, #7a5129); border-radius: 55% 55% 4px 4px; clip-path: polygon(20% 0,80% 0,100% 100%,0 100%); box-shadow: 0 11px 28px #edbf733b; content: ''; }
.display-lamp span { position: absolute; top: 53px; left: 21px; width: 5px; height: 20px; background: #65442b; }
.mini-print { position: absolute; z-index: 2; top: 59px; left: 6%; display: grid; width: 61px; padding: 5px 5px 8px; transform: rotate(-9deg); background: #efede6; border-radius: 5px; box-shadow: 0 5px 16px #0009; }
.mini-print img { width: 100%; height: 70px; object-fit: cover; object-position: 50% 42%; }
.mini-print-label { padding: 1px 1px 4px; color: #141414; text-align: center; font-size: 6px; font-weight: 700; }
.drawn-arrow { position: absolute; z-index: 3; top: 86px; left: 14%; color: #fff; font-size: 39px; transform: rotate(-15deg); }
.display-photo { position: absolute; bottom: 62px; z-index: 1; padding: 9px; background: #161412; box-shadow: 0 8px 19px #0008; }
.display-photo img { display: block; width: 100%; height: 100%; object-fit: cover; }
.display-photo-small { left: 18%; width: 21%; height: 135px; transform: rotate(-.7deg); }
.frame-gold { border: 8px ridge #aa7949; background: #d6b38b; }
.frame-dark { left: 40%; bottom: 50px; z-index: 2; width: 34%; height: 287px; padding: 12px; background: #241b16; border: 4px solid #87603d; box-shadow: 0 10px 34px #0009, inset 0 0 0 4px #0a0b0b; }
.frame-dark img { border: 7px solid #e8decd; }
.frame-wood { right: 4%; width: 20%; height: 160px; padding: 9px; border: 7px ridge #785336; background: #b18a5d; }
.collage-mini { display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: 1fr 1fr; gap: 4px; width: 100%; height: 100%; padding: 5px; background: #e8dfcc; }
.collage-mini img { width: 100%; height: 100%; object-fit: cover; }
.frame-caption { position: absolute; bottom: 1px; left: 0; width: 100%; color: #c3ac8d; text-align: center; font-size: 5px; }
.display-shelf { position: absolute; right: 0; bottom: 37px; left: 0; z-index: 3; height: 25px; background: linear-gradient(180deg, #704827, #24170e 72%); border-top: 3px solid #a47647; box-shadow: 0 12px 18px #000a; }
.shelf-edge { position: absolute; right: 0; bottom: -13px; left: 0; height: 13px; background: #131313; border-top: 2px solid #604022; }
.handwritten-note { position: absolute; top: 19px; right: 8%; color: #eee7de; font-family: cursive; font-size: 14px; font-style: italic; line-height: 1.45; transform: rotate(-5deg); }
.handwritten-note b { color: var(--red); }
.hero-frame-tag { position: absolute; right: 28%; bottom: 39px; z-index: 4; display: grid; min-width: 143px; padding: 7px 9px; color: #f3f3f0; background: #171b1e; border: 1px solid #30373b; border-radius: 5px; box-shadow: 0 5px 14px #0009; font-size: 9px; }
.hero-frame-tag small { color: #a9afb1; font-size: 8px; }
.hero-frame-tag strong { font-size: 10px; }
.plant { position: absolute; z-index: 4; bottom: 58px; display: block; width: 43px; height: 95px; }
.plant-left { left: 1%; }.plant-right { right: 1%; }
.plant i { position: absolute; bottom: 23px; left: 50%; width: 18px; height: 43px; border: 1px solid #304224; border-radius: 100% 0 100% 0; transform-origin: 50% 100%; background: linear-gradient(150deg, #354426, #162116); }
.plant i:nth-child(1) { transform: rotate(-46deg); }.plant i:nth-child(2) { transform: rotate(-24deg); height: 57px; }.plant i:nth-child(3) { transform: rotate(20deg); height: 58px; }.plant i:nth-child(4) { transform: rotate(44deg); }.plant i:nth-child(5) { transform: rotate(-4deg); height: 68px; }
.plant b { position: absolute; bottom: 0; left: 8px; width: 31px; height: 27px; background: linear-gradient(90deg, #251e18, #675034, #271e17); clip-path: polygon(0 0,100% 0,87% 100%,13% 100%); }
.promise-strip { display: flex; justify-content: center; gap: clamp(20px, 5vw, 72px); min-height: 40px; padding: 10px 16px; border-bottom: 1px solid #1d2327; color: #e2e4e3; font-size: 10px; }
.promise-strip svg { width: 14px; height: 14px; }
.content-section { padding: 22px clamp(19px, 4.1vw, 44px); }
.section-heading { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-bottom: 13px; }
.section-heading h2, .create-copy h2, .contact-ribbon h2 { margin: 0; font-family: var(--display); font-size: clamp(20px, 2vw, 26px); font-weight: 800; letter-spacing: 0; line-height: 1.2; }
.section-heading > div > p { margin: 3px 0 0; color: #afb5b7; font-size: 11px; }
.frame-categories { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 11px; }
.category-card { position: relative; min-width: 0; overflow: hidden; padding: 7px 7px 10px; background: var(--surface); border: 1px solid #30363c; border-radius: 7px; transition: border-color .2s ease, transform .2s ease; }
.category-card:hover, .product-card:hover { transform: translateY(-2px); border-color: #666d72; }
.category-picture { position: relative; display: block; height: 108px; margin-bottom: 7px; overflow: hidden; padding: 7px; background: linear-gradient(135deg,#37271b,#a87949,#442d1d); border: 1px solid #7d6145; box-shadow: inset 0 0 0 3px #1a1511; }
.category-picture > img { display: block; width: 100%; height: 100%; object-fit: cover; border: 4px solid #eee5d4; box-shadow: 0 0 0 4px #271b12; }
.warm-profile { background: linear-gradient(135deg,#422b19,#b58351,#66432c); border-color: #956e45; box-shadow: inset 0 0 0 2px #25170f; }
.warm-profile > img { border: 5px solid #ddd1bc; box-shadow: 0 0 0 3px #38251a; }
.black-profile { background: linear-gradient(135deg,#161819,#5c564d); border-color: #696057; }
.black-profile > img { border: 4px solid #ddd6c6; }
.led-profile { background: linear-gradient(140deg,#211714,#67533a,#251917); box-shadow: inset 0 0 8px 2px #e7a65849; }
.led-profile > img { border: 3px solid #f2c277; box-shadow: 0 0 8px #ffc46c88; }
.gold-profile { background: linear-gradient(140deg,#302215,#bd9157,#392818); border-color: #8e6c43; }
.gold-profile > img { border: 5px solid #ebddc3; box-shadow: 0 0 0 3px #56402b; }
.category-collage, .product-collage { display: grid; width: 100%; height: 100%; grid-template-columns: repeat(2, 1fr); grid-template-rows: repeat(2, 1fr); gap: 4px; padding: 4px; background: #d5c8ae; }
.category-collage img, .product-collage img { display: block; width: 100%; height: 100%; min-height: 0; object-fit: cover; }
.category-card > strong, .category-card > small { display: block; padding-right: 14px; font-size: 10px; }
.category-card > strong { font-weight: 700; }
.category-card > small { margin-top: 2px; color: #d8d8d5; font-size: 9px; }
.category-card > svg { position: absolute; right: 8px; bottom: 9px; width: 12px; height: 12px; }
.create-section { display: grid; grid-template-columns: minmax(200px, .8fr) minmax(0, 1.2fr); gap: 18px; align-items: center; margin: 0 clamp(19px, 4.1vw, 44px); padding: 18px 20px; background: linear-gradient(110deg,#11161b,#0c1014 75%); border: 1px solid #30363c; border-radius: 8px; }
.create-copy h2 { margin-top: 3px; }
.create-copy > p { margin: 5px 0 14px; color: #c2c6c8; font-size: 11px; line-height: 1.5; }
.steps { display: grid; grid-template-columns: repeat(5, 1fr); gap: 9px; margin: 0 0 10px; padding: 0; list-style: none; }
.steps li { display: grid; grid-template-columns: 21px 1fr; align-items: center; column-gap: 5px; min-width: 0; }
.steps li > span { display: grid; place-items: center; width: 20px; height: 20px; border: 1px solid #444b50; border-radius: 50%; background: #22282d; font-size: 9px; }
.steps b { overflow: hidden; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.steps small { grid-column: 1 / -1; margin-top: 5px; color: #aeb4b7; font-size: 8px; line-height: 1.3; }
.frame-designer { display: grid; min-width: 0; gap: 11px; }
#create:not(.has-photo) .create-copy { display: none; }
#create:not(.has-photo) .frame-designer, #create.has-photo .frame-designer { grid-column: 1 / -1; }
.upload-prompt { display: grid; justify-items: center; align-content: center; gap: 11px; min-height: 198px; padding: 22px; color: #f3f3ef; background: radial-gradient(ellipse at 50% 45%,#24292d,#121619 75%); border: 1px dashed #626b70; border-radius: 7px; text-align: center; }
.upload-prompt[hidden], .preview-stage[hidden], .frame-options[hidden], .designer-order-row[hidden], .designer-note[hidden] { display: none; }
.upload-prompt > svg { width: 30px; height: 30px; color: var(--red); }
.upload-prompt > strong { font-family: var(--display); font-size: 16px; }
.upload-prompt > span { color: #b8c0c3; font-size: 11px; }
.upload-prompt > .button { min-height: 39px; }
.upload-prompt > small { color: #90999d; font-size: 9px; }
.designer-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.designer-title { display: inline-flex; align-items: center; gap: 6px; color: #e6e8e8; font-size: 9px; font-weight: 700; letter-spacing: 1px; }
.designer-title svg { width: 15px; height: 15px; color: var(--red); }
.designer-upload { min-height: 32px; padding-inline: 10px; font-size: 9px; }
.designer-upload svg { width: 14px; height: 14px; }
.preview-stage { display: grid; grid-template-rows: 1fr auto; justify-items: center; align-items: center; gap: 8px; min-height: 304px; padding: 12px 16px; overflow: hidden; background: radial-gradient(ellipse at 50% 45%,#303032,#181b1e 68%,#121518); border: 1px solid #32393f; border-radius: 6px; }
.preview-frame { position: relative; display: grid; place-items: center; width: min(100%, 228px); height: 270px; padding: 15px; background: linear-gradient(135deg,#b7905d,#54391f 17%,#87603a 32%,#49301e 58%,#b68d5e); border: 12px solid #68472d; box-shadow: 0 10px 24px #000b,inset 0 0 0 2px #c09a67,inset 0 0 0 5px #382619; transition: background .2s ease, border-color .2s ease, box-shadow .2s ease; }
.preview-frame::before { position: absolute; inset: 3px; z-index: 2; border: 1px solid #f1d19a80; box-shadow: inset 0 0 0 2px #0003; content: ''; pointer-events: none; }
.preview-frame img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center; background: #ddd5c7; border: 5px solid #eee9df; }
.preview-caption { max-width: 100%; overflow: hidden; color: #c4c9cc; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.preview-frame.frame-style-acrylic { padding: 12px; background: linear-gradient(135deg,#f5fbfc,#9daeb2 20%,#e9f0f1 42%,#829297 64%,#f7fbfc); border: 10px solid #cbd5d7; box-shadow: 0 7px 26px #a8d9e566,inset 0 0 0 2px #fff,inset 0 0 0 5px #aab5b8; }
.preview-frame.frame-style-acrylic img { border: 3px solid #fafafa; }
.preview-frame.frame-style-gold { padding: 15px; background: linear-gradient(135deg,#fff0aa,#8d672c 17%,#d8b264 31%,#78602e 60%,#f4d98b); border: 13px solid #b18a42; box-shadow: 0 8px 26px #d6a64455,inset 0 0 0 2px #ffe7a1,inset 0 0 0 5px #77551f; }
.preview-frame.frame-style-black { padding: 17px; background: linear-gradient(135deg,#62686b,#121517 20%,#292e30 48%,#050607 76%,#454a4d); border: 13px solid #111416; box-shadow: 0 10px 24px #000b,inset 0 0 0 1px #aab0b2,inset 0 0 0 5px #050607; }
.preview-frame.frame-style-black img { border: 5px solid #f0eee8; }
.preview-frame.frame-style-led { padding: 13px; background: linear-gradient(135deg,#c5975b,#191513 21%,#51412e 48%,#171311 76%,#bc8b4d); border: 10px solid #483522; box-shadow: 0 0 9px #ffc66b,0 0 21px #e9994380,inset 0 0 0 2px #f2d18c,inset 0 0 0 5px #241a11; }
.preview-frame.frame-style-led img { border: 4px solid #f3dec0; }
#create.has-photo { gap: 10px; padding-block: 12px; }
#create.has-photo .create-copy { display: none; }
#create.has-photo .frame-designer { grid-column: 1 / -1; }
#create.has-photo .preview-stage { min-height: 290px; }
.frame-options { min-width: 0; margin: 0; padding: 0; border: 0; }
.frame-options legend { margin-bottom: 7px; color: #e3e6e7; font-size: 10px; font-weight: 600; }
.frame-option-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 6px; }
.frame-option { position: relative; display: grid; grid-template-rows: 30px auto; gap: 5px; min-width: 0; padding: 6px; background: #14191d; border: 1px solid #3b4349; border-radius: 5px; cursor: pointer; }
.frame-option:has(input:checked) { background: #211b1a; border-color: var(--red); box-shadow: 0 0 0 1px #f22f3a3d; }
.frame-option input { position: absolute; top: 5px; right: 5px; width: 13px; height: 13px; margin: 0; accent-color: var(--red); }
.frame-swatch { display: block; width: 100%; height: 30px; border: 6px solid #795134; background: #ddd6c8; box-shadow: inset 0 0 0 1px #ffffff70; }
.swatch-wood { border-color: #795134; background: linear-gradient(135deg,#bca47c,#64513a); }
.swatch-acrylic { border: 5px solid #dce6e9; background: #b7d1d8; }
.swatch-gold { border: 6px ridge #c9a356; background: #e9dec9; }
.swatch-black { border: 5px solid #080a0c; background: #eee9dc; }
.swatch-led { border: 5px solid #604b31; background: #1b1713; box-shadow: 0 0 6px #f0b45e; }
.frame-option-name { display: grid; gap: 2px; padding-right: 10px; font-size: 8px; font-weight: 600; line-height: 1.25; }
.frame-option-name small { color: #b5bdc1; font-size: 8px; font-weight: 400; white-space: nowrap; }
.designer-order-row { display: grid; grid-template-columns: minmax(104px,.8fr) auto minmax(144px,1.3fr); gap: 9px; align-items: end; }
.designer-size { display: grid; gap: 4px; color: #d6dadd; font-size: 9px; }
.designer-size select, .custom-size-field input { width: 100%; min-width: 0; min-height: 36px; padding: 7px; color: #f1f1ef; background: #0d1216; border: 1px solid #3b444a; border-radius: 5px; font: inherit; }
.designer-price { align-self: center; color: #f1e6d2; font-size: 11px; font-weight: 700; white-space: nowrap; }
.designer-add { min-height: 37px; padding: 0 9px; font-size: 9px; }
.designer-add:disabled { opacity: .52; cursor: not-allowed; }
.custom-size-field { display: grid; grid-template-columns: 112px 1fr; align-items: center; gap: 8px; color: #d6dadd; font-size: 9px; }
.custom-size-field[hidden] { display: none; }
.designer-note { margin: -3px 0 0; color: #aeb6b9; font-size: 9px; line-height: 1.4; }
.occasions-section { padding-top: 22px; }
.occasion-grid { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 9px; }
.occasion-card { overflow: hidden; text-align: center; background: #11161a; border: 1px solid #333a40; border-radius: 6px; transition: border-color .2s ease, transform .2s ease; }
.occasion-card:hover { transform: translateY(-2px); border-color: #737a7f; }
.occasion-card img { display: block; width: 100%; height: 75px; object-fit: cover; }
.occasion-card > span { display: block; padding: 4px 3px 6px; font-size: 10px; font-weight: 700; }
.occasion-card small { display: block; color: #ebebea; font-size: 9px; font-weight: 500; }
.benefits-section { padding-top: 19px; padding-bottom: 19px; }
.benefit-grid { display: grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap: 8px; }
.benefit { display: flex; align-items: center; gap: 8px; min-width: 0; min-height: 57px; padding: 8px; background: #11161a; border: 1px solid #2b3238; border-radius: 6px; }
.benefit > svg { flex: 0 0 19px; width: 19px; height: 19px; }
.benefit span { display: grid; min-width: 0; gap: 3px; }
.benefit b { overflow: hidden; font-size: 9px; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.benefit small { color: #aeb4b7; font-size: 8px; white-space: nowrap; }
.bestsellers-section { padding-top: 19px; }
.product-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 10px; }
.product-card { min-width: 0; overflow: hidden; background: #11161a; border: 1px solid #30373d; border-radius: 7px; transition: border-color .2s ease, transform .2s ease; }
.product-picture { position: relative; display: block; height: 106px; margin: 7px 7px 0; overflow: hidden; padding: 7px; border: 1px solid #95754e; background: linear-gradient(135deg,#4c3521,#bb8c58,#403020); box-shadow: inset 0 0 0 3px #1c1712; }
.product-picture > img { display: block; width: 100%; height: 100%; object-fit: cover; border: 5px solid #e1d6c3; box-shadow: 0 0 0 3px #302319; }
.product-picture.warm-profile > img, .product-picture.dark-profile > img, .product-picture.led-profile > img { border-width: 5px; }
.product-picture.dark-profile { background: linear-gradient(135deg,#111414,#605a4e); }
.product-picture.dark-profile > img { border-color: #e4dfd2; box-shadow: 0 0 0 3px #24201c; }
.product-picture .product-collage { border: 4px solid #e2d5bc; box-shadow: 0 0 0 3px #403020; }
.product-picture.led-profile .led-halo { position: absolute; inset: 13px; box-shadow: inset 0 0 14px #e59b3d7e; pointer-events: none; }
.product-label { position: absolute; top: 13px; left: 13px; padding: 3px 5px; color: #fff; background: #d92732; border-radius: 2px; font-size: 6px; font-weight: 700; letter-spacing: .5px; }
.product-info { padding: 7px; }
.product-info h3 { min-height: 13px; margin: 0; overflow: hidden; font-size: 10px; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.product-info > p { margin: 2px 0 5px; font-size: 9px; }
.rating { display: flex; align-items: center; gap: 4px; min-height: 13px; margin-bottom: 7px; color: #ffc338; font-size: 11px; letter-spacing: 0; }
.rating small { color: #b3b7b8; font-size: 8px; }
.button-order { width: 100%; min-height: 27px; padding: 0 5px; border-radius: 6px; font-size: 9px; }
.reviews-section { padding-top: 17px; padding-bottom: 17px; }
.reviews-next { flex-shrink: 0; }
.review-track { display: grid; grid-auto-columns: minmax(190px,1fr); grid-auto-flow: column; gap: 9px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: thin; scrollbar-color: #41474c transparent; }
.review-card { min-width: 0; padding: 11px 12px; scroll-snap-align: start; background: #11161a; border: 1px solid #30363d; border-radius: 8px; }
.review-person { display: flex; align-items: center; gap: 8px; }
.review-person > img { width: 31px; height: 31px; object-fit: cover; border: 1px solid #525b5c; border-radius: 50%; }
.review-person strong { display: grid; gap: 2px; font-size: 9px; }
.review-person small { color: #ffc338; font-size: 10px; letter-spacing: 0; }
.review-card > p { margin: 7px 0 0; color: #d6d9d9; font-size: 9px; line-height: 1.45; }
.contact-ribbon { display: flex; align-items: center; gap: 8px; min-height: 69px; padding: 11px clamp(20px, 4vw, 44px); background: linear-gradient(100deg,#201b1a,#352c25 55%,#191817); border: 1px solid #423c35; border-radius: 7px; }
.contact-ribbon > div:first-child { flex: 1; }
.contact-ribbon h2 { font-size: clamp(17px, 2.1vw, 24px); }
.contact-ribbon p { margin: 3px 0 0; color: #dad7d3; font-size: 10px; }
.contact-ribbon > .button { flex: 0 0 auto; min-height: 33px; padding: 0 12px; font-size: 9px; }
.contact-ribbon > .button svg { width: 13px; height: 13px; }
.ribbon-frames { display: flex; align-items: center; margin-left: 6px; }
.ribbon-frames img { width: 43px; height: 39px; padding: 3px; object-fit: cover; background: #2d241d; border: 2px solid #a27a50; }
.ribbon-frames img + img { margin-left: -4px; }
.footer { padding: 0 clamp(19px, 4.1vw, 44px); background: #0d1115; border-top: 1px solid #282e33; }
.footer-main { display: grid; grid-template-columns: 1.55fr .8fr .85fr 1.15fr 1fr; gap: 18px; align-items: start; padding: 17px 0 15px; }
.footer-brand > p { margin: 9px 0 8px; color: #c2c6c7; font-size: 9px; line-height: 1.5; }
.social-dots { display: flex; gap: 8px; }
.social-dots a { display: grid; place-items: center; width: 30px; height: 30px; border: 1px solid #545b60; border-radius: 50%; font-size: 12px; }
.social-dots a[href*="wa.me"] { color: #30df85; }
.social-dots a[href*="instagram.com"] { color: #ed7895; }
.social-dots a[href^="mailto:"] { color: #ef5b64; }
.social-dots svg { width: 17px; height: 17px; }
.footer h3 { margin: 2px 0 7px; font-size: 10px; }
.footer-links, .footer-contact { display: grid; justify-items: start; gap: 5px; }
.footer-links a, .footer-contact a, .footer-contact span { color: #c5c9cb; font-size: 8px; }
.footer-contact a { display: flex; align-items: center; gap: 5px; }
.footer-contact svg { width: 12px; height: 12px; }
.map-tile { position: relative; display: grid; place-items: center; height: 72px; overflow: hidden; background-color: #d6d8d0; background-image: linear-gradient(45deg,transparent 44%,#c4c8bf 45%,#c4c8bf 48%,transparent 49%),linear-gradient(-26deg,transparent 40%,#fbfaf3 41%,#fbfaf3 48%,transparent 49%),linear-gradient(95deg,transparent 66%,#c5d8b3 67%,#c5d8b3 80%,transparent 81%); border: 1px solid #89958a; border-radius: 4px; }
.map-road { position: absolute; width: 130%; height: 7px; background: #fffdf4; transform: rotate(-28deg); }
.map-road-a { top: 27px; left: -15%; }.map-road-b { top: 50px; left: -4%; height: 4px; transform: rotate(36deg); }
.map-block { position: absolute; width: 28px; height: 14px; background: #c0d3af; border: 1px solid #adc19c; transform: rotate(-28deg); }
.map-block-a { top: 7px; left: 11px; }.map-block-b { right: 5px; bottom: 5px; }
.map-tile > b { position: relative; display: inline-flex; align-items: center; gap: 3px; padding: 4px 5px; color: #151a19; background: #fffef9; border-radius: 3px; box-shadow: 0 1px 4px #0003; font-size: 8px; }
.map-tile > b svg { width: 12px; height: 12px; color: var(--red); }
.footer-bottom { display: flex; justify-content: space-between; gap: 10px; min-height: 27px; padding: 7px 0; border-top: 1px solid #282e33; color: #aeb4b7; font-size: 8px; }
.footer-bottom > span:last-child { display: flex; gap: 13px; }
.cart-dialog { position: fixed; top: 0; right: 0; bottom: 0; left: auto; width: min(420px,100%); max-width: 100%; max-height: none; margin: 0; padding: 35px 26px; overflow-y: auto; color: var(--text); background: #101419; border: 0; border-left: 1px solid #343b40; box-shadow: -15px 0 40px #0007; }
.cart-dialog[open] { animation: slide-in .25s ease both; }
.cart-dialog::backdrop { background: #030507b8; backdrop-filter: blur(3px); }
.dialog-close { position: absolute; top: 19px; right: 17px; }
.cart-dialog h2 { margin: 7px 0 12px; font-family: var(--display); font-size: 23px; }
.cart-items { display: grid; gap: 10px; }
.cart-empty { margin: 0; padding: 17px; color: #bdc2c4; background: #171d22; border: 1px solid #30373c; border-radius: 7px; font-size: 12px; line-height: 1.6; }
.cart-line { display: grid; gap: 10px; min-width: 0; padding: 11px; background: #171d22; border: 1px solid #30373c; border-radius: 6px; font-size: 11px; }
.cart-line-heading { display: grid; gap: 3px; }
.cart-line-heading strong { font-size: 12px; }
.cart-line-price { color: #b9c0c3; font-size: 10px; }
.cart-line-controls { display: grid; grid-template-columns: minmax(0, 1fr) 72px auto; gap: 8px; align-items: end; }
.cart-line-controls label, .order-field { display: grid; gap: 5px; color: #d6dadd; font-size: 10px; }
.cart-line-controls select, .cart-line-controls input, .order-field input, .order-field select, .order-field textarea { width: 100%; min-width: 0; min-height: 36px; padding: 8px; color: #f1f1ef; background: #0d1216; border: 1px solid #3b444a; border-radius: 5px; font: inherit; }
.cart-line-controls select { padding-right: 21px; }
.cart-line-controls input { text-align: center; }
.cart-line-controls .cart-remove { min-height: 36px; padding: 0 5px; color: #f26a70; background: transparent; border: 0; font: inherit; cursor: pointer; }
.cart-total { display: flex; justify-content: space-between; margin-top: 17px; padding-top: 14px; border-top: 1px solid #30373c; font-size: 13px; font-weight: 700; }
.cart-total span { max-width: 68%; color: #ced3d5; font-size: 11px; font-weight: 500; }
.order-form { display: grid; gap: 9px; margin-top: 14px; }
.order-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.order-fields[hidden], .order-empty-hint[hidden], .order-address[hidden] { display: none; }
.order-field-wide { grid-column: 1 / -1; }
.order-field textarea { min-height: 58px; resize: vertical; }
.order-field input[type="file"] { padding: 7px; font-size: 10px; }
.order-field small, .order-help { color: #aeb7bb; font-size: 10px; line-height: 1.5; }
.order-help { margin: 0; }
.order-empty-hint { margin: 0; color: #b9c0c3; font-size: 11px; }
.order-submit { width: 100%; min-height: 42px; }
.order-submit:disabled { opacity: .48; cursor: not-allowed; }
.toast { position: fixed; right: 20px; bottom: 20px; z-index: 8; max-width: min(330px,calc(100% - 40px)); padding: 12px 16px; transform: translateY(10px); opacity: 0; pointer-events: none; background: #1b2328; border: 1px solid #3b474a; border-radius: 7px; box-shadow: 0 5px 20px #0007; font-size: 12px; transition: opacity .2s ease, transform .2s ease; }
.toast.show { transform: translateY(0); opacity: 1; }
@keyframes slide-in { from { transform: translateX(16px); opacity: .5; } to { transform: translateX(0); opacity: 1; } }

/* Keep content labels readable without changing the compact photo layouts. */
.main-nav a, .hero-actions .button, .nav-order, .button-small, .designer-upload,
.designer-add, .button-order, .contact-ribbon > .button { font-size: 12px; }
.eyebrow, .section-kicker { font-size: 12px; }
.hero-copy > p, .create-copy > p { font-size: 15px; line-height: 1.55; }
.hero-trust { font-size: 11px; }
.promise-strip { font-size: 12px; }
.section-heading > div > p { font-size: 13px; }
.category-card > strong, .occasion-card > span { font-size: 13px; }
.category-card > small, .occasion-card small { font-size: 12px; }
.steps b, .frame-option-name { font-size: 11px; }
.steps small, .frame-option-name small, .designer-note { font-size: 10px; }
.upload-prompt > span { font-size: 14px; }
.upload-prompt > small, .preview-caption { font-size: 11px; }
.designer-title, .frame-options legend, .designer-size, .custom-size-field { font-size: 12px; }
.designer-price { font-size: 14px; }
.benefit b { font-size: 11px; }
.benefit small { font-size: 10px; }
.product-label { font-size: 9px; }
.product-info h3 { min-height: 2.6em; overflow: hidden; display: -webkit-box; font-size: 12px; line-height: 1.3; text-overflow: clip; white-space: normal; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.product-info > p { font-size: 11px; }
.rating small, .review-person strong { font-size: 11px; }
.button-order { min-height: 36px; }
.review-card > p { font-size: 12px; line-height: 1.55; }
.contact-ribbon p { font-size: 12px; }
.contact-ribbon > .button { min-height: 38px; }
.footer-brand > p { font-size: 12px; }
.footer h3 { font-size: 13px; }
.footer-links a, .footer-contact a, .footer-contact span { font-size: 11px; }
.map-tile > b { font-size: 10px; }
.footer-bottom { font-size: 10px; }

@media (max-width: 680px) {
  .brand-wordmark > span { font-size: 12px; }
  .nav-order, .hero-actions .button { font-size: 12px; }
  .eyebrow { font-size: 11px; }
  .hero-copy > p, .create-copy > p { font-size: 14px; }
  .hero-trust { font-size: 10px; }
  .promise-strip { font-size: 11px; }
  .section-heading > div > p { font-size: 12px; }
  .button-small { min-height: 34px; font-size: 11px; }
  .steps b { font-size: 10px; }
  .steps small, .frame-option-name small, .designer-note { font-size: 10px; }
  .frame-option-name { font-size: 10px; }
  .designer-upload, .designer-add, .button-order { font-size: 11px; }
  .contact-ribbon p { font-size: 11px; }
  .contact-ribbon > .button { min-height: 36px; font-size: 10px; }
  .footer-bottom { font-size: 11px; }
}

@media (min-width: 1200px) {
  .hero { min-height: 465px; }
  .hero-display { min-height: 465px; }
  .frame-dark { height: 335px; }
  .display-photo-small { height: 157px; }
  .frame-wood { height: 180px; }
  .category-picture { height: 125px; }
  .product-picture { height: 130px; }
}

@media (max-width: 920px) {
  .topbar { gap: 13px; padding-inline: 18px; }
  .main-nav { position: absolute; top: calc(100% - 1px); right: 0; left: 0; display: none; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; padding: 6px 14px 11px; background: #0b0e11; border-bottom: 1px solid #343a40; box-shadow: 0 14px 18px #0008; }
  .main-nav.open { display: grid; }
  .main-nav a { justify-content: center; min-height: 40px; border-bottom: 1px solid #21272c; font-size: 11px; }
  .main-nav a.active::after { right: auto; width: 23px; }
  .nav-actions { gap: 6px; margin-left: auto; }
  .nav-order { min-height: 35px; padding-inline: 12px; font-size: 10px; }
  .search-button { display: none; }
  .menu-toggle { display: inline-grid; }
  .hero { grid-template-columns: .9fr 1.1fr; }
  .hero-copy { padding-inline: 25px; }
  .hero h1 { font-size: clamp(32px,4.3vw,39px); }
  .hero-trust { gap: 10px; font-size: 8px; }
  .frame-categories { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .category-picture { height: 130px; }
  .benefit-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .product-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .product-picture { height: 150px; }
  .create-section { grid-template-columns: minmax(0,.8fr) minmax(0,1.2fr); gap: 14px; padding: 15px; }
  .steps { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .frame-option-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .designer-order-row { grid-template-columns: minmax(100px,1fr) auto; }
  .designer-add { grid-column: 1 / -1; }
  .footer-main { grid-template-columns: 1.3fr .8fr .8fr 1.1fr; }
  .map-tile { display: none; }
}

@media (max-width: 680px) {
  html { scroll-padding-top: 65px; }
  .site-shell { width: 100%; border: 0; }
  .topbar { min-height: 57px; padding-inline: 14px; gap: 10px; }
  .brand-mark { width: 34px; height: 34px; }
  .brand-wordmark > span { font-size: 11px; }
  .main-nav { position: absolute; top: calc(100% - 1px); right: 0; left: 0; display: none; align-items: stretch; gap: 0; padding: 5px 14px 13px; background: #0b0e11; border-bottom: 1px solid #343a40; box-shadow: 0 14px 18px #0008; }
  .main-nav.open { display: grid; grid-template-columns: 1fr 1fr; }
  .main-nav a { min-height: 42px; padding: 0 8px; border-bottom: 1px solid #21272c; font-size: 12px; }
  .main-nav a.active::after { right: auto; width: 23px; }
  .nav-actions { gap: 2px; margin-left: auto; }
  .search-button { display: none; }
  .icon-button { width: 34px; height: 34px; }
  .nav-order { min-height: 33px; padding-inline: 12px; font-size: 10px; }
  .menu-toggle { display: inline-grid; }
  .hero { grid-template-columns: 1fr; min-height: auto; }
  .hero-copy { padding: 31px 22px 20px; }
  .eyebrow { font-size: 9px; }
  .hero h1 { margin-top: 9px; font-size: clamp(38px,9.6vw,51px); }
  .hero-copy > p { max-width: 360px; margin-bottom: 13px; font-size: 13px; }
  .hero-actions { gap: 8px; }
  .hero-actions .button { min-height: 38px; padding-inline: 12px; font-size: 10px; }
  .hero-trust { gap: 10px 14px; margin-top: 15px; font-size: 8px; }
  .hero-display { min-height: clamp(260px, 72vw, 360px); }
  .display-window { top: 16px; height: 67%; }
  .display-lamp { top: 19px; transform: scale(.8); transform-origin: top left; }
  .mini-print { top: 39px; left: 7%; width: 49px; padding: 4px 4px 6px; }
  .mini-print img { height: 53px; }
  .drawn-arrow { top: 59px; font-size: 31px; }
  .display-photo { bottom: 49px; }
  .display-photo-small { left: 15%; width: 21%; height: 28vw; max-height: 106px; min-height: 83px; padding: 6px; }
  .frame-dark { left: 37%; bottom: 42px; width: 36%; height: 62vw; max-height: 241px; min-height: 187px; padding: 9px; }
  .frame-dark img { border-width: 5px; }
  .frame-wood { right: 3%; width: 20%; height: 33vw; max-height: 135px; min-height: 97px; padding: 5px; border-width: 5px; }
  .display-shelf { bottom: 27px; height: 22px; }
  .shelf-edge { bottom: -10px; height: 10px; }
  .handwritten-note { top: 14px; right: 7%; font-size: 10px; }
  .hero-frame-tag { right: 23%; bottom: 29px; min-width: 119px; padding: 5px 7px; font-size: 7px; }
  .hero-frame-tag small { font-size: 7px; }
  .hero-frame-tag strong { font-size: 8px; }
  .plant { bottom: 42px; transform: scale(.8); transform-origin: bottom; }
  .plant-left { left: 0; }.plant-right { right: 0; }
  .promise-strip { justify-content: flex-start; gap: 18px; overflow-x: auto; min-height: 39px; padding: 10px 17px; font-size: 9px; scrollbar-width: none; }
  .promise-strip::-webkit-scrollbar { display: none; }
  .content-section { padding: 20px 16px; }
  .section-heading { align-items: center; margin-bottom: 11px; }
  .section-heading h2, .create-copy h2 { font-size: 20px; }
  .section-heading > div > p { font-size: 10px; }
  .button-small { min-height: 31px; padding: 0 9px; font-size: 9px; }
  .frame-categories { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; }
  .category-card { padding: 6px 6px 9px; }
  .category-picture { height: clamp(100px,32vw,145px); margin-bottom: 6px; }
  .create-section { grid-template-columns: minmax(0,1fr); gap: 13px; margin-inline: 12px; padding: 16px 15px 14px; }
  .create-copy > p { margin-bottom: 13px; font-size: 10px; }
  .steps { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; margin-bottom: 0; }
  .steps li { grid-template-columns: 18px 1fr; column-gap: 4px; }
  .steps li > span { width: 18px; height: 18px; font-size: 8px; }
  .steps b { font-size: 8px; }
  .steps small { font-size: 7px; }
  .frame-designer { gap: 9px; }
  .preview-stage { min-height: 256px; }
  .preview-frame { width: min(100%,188px); height: 222px; }
  #create.has-photo .preview-stage { min-height: 244px; }
  #create.has-photo .preview-frame { width: min(100%,188px); height: 222px; }
  .frame-option-grid { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 6px; }
  .frame-option { grid-template-rows: 26px auto; padding: 5px; }
  .frame-swatch { height: 26px; }
  .frame-option-name { font-size: 8px; }
  .frame-option-name small { font-size: 7px; }
  .designer-order-row { grid-template-columns: minmax(100px,1fr) auto; }
  .designer-add { grid-column: 1 / -1; min-height: 40px; }
  .custom-size-field { grid-template-columns: 105px minmax(0,1fr); }
  .designer-note { font-size: 8px; }
  .occasions-section { padding-top: 19px; }
  .occasion-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; }
  .occasion-card { display: grid; grid-template-columns: 43% 1fr; align-items: center; min-height: 83px; text-align: left; }
  .occasion-card img { height: 83px; }
  .occasion-card > span { padding: 7px; font-size: 12px; }
  .occasion-card small { font-size: 10px; }
  .benefits-section { padding-top: 17px; padding-bottom: 17px; }
  .benefit-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 7px; }
  .benefit { gap: 6px; min-height: 54px; padding: 7px; }
  .benefit > svg { flex-basis: 17px; width: 17px; height: 17px; }
  .benefit b { font-size: 8px; }
  .benefit small { font-size: 7px; }
  .product-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; }
  .product-picture { height: clamp(112px, 39vw, 166px); margin: 6px 6px 0; padding: 6px; }
  .product-info { padding: 7px 6px; }
  .product-info h3 { font-size: 9px; }
  .product-info > p { font-size: 8px; }
  .product-info .rating { font-size: 10px; }
  .rating small { font-size: 7px; }
  .button-order { min-height: 30px; font-size: 9px; }
  .review-track { grid-auto-columns: minmax(235px,82%); margin-right: -16px; padding-bottom: 4px; }
  .review-card { min-height: 101px; }
  .contact-ribbon { flex-wrap: wrap; gap: 7px; margin: 0 9px; padding: 13px 13px; }
  .contact-ribbon > div:first-child { flex: 1 1 100%; }
  .contact-ribbon h2 { font-size: 18px; }
  .contact-ribbon p { font-size: 9px; }
  .contact-ribbon > .button { flex: 1 1 auto; padding-inline: 8px; font-size: 8px; }
  .ribbon-frames { margin-left: 2px; }
  .ribbon-frames img { width: 34px; height: 32px; }
  .footer { padding-inline: 16px; }
  .footer-main { grid-template-columns: 1fr 1fr; gap: 19px 11px; padding-block: 18px; }
  .footer-brand { grid-column: 1 / -1; }
  .footer-brand > p { font-size: 9px; }
  .footer-contact { align-content: start; }
  .footer-bottom { align-items: flex-start; flex-direction: column; gap: 7px; font-size: 8px; }
  .cart-dialog { padding: 32px 19px; }
}

@media (max-width: 920px) {
  .main-nav a, .nav-order { font-size: 12px; }
  .hero-trust { font-size: 11px; }
}

@media (max-width: 680px) {
  .brand-wordmark > span { font-size: 12px; }
  .eyebrow { font-size: 11px; }
  .hero-copy > p, .create-copy > p { font-size: 14px; }
  .hero-trust { font-size: 10px; }
  .hero-actions .button, .nav-order { font-size: 12px; }
  .handwritten-note { font-size: 12px; }
  .hero-frame-tag { font-size: 9px; }
  .hero-frame-tag small { font-size: 9px; }
  .hero-frame-tag strong { font-size: 10px; }
  .promise-strip { font-size: 11px; }
  .section-heading > div > p { font-size: 12px; }
  .button-small { min-height: 34px; font-size: 11px; }
  .steps b, .frame-option-name { font-size: 11px; }
  .steps small, .frame-option-name small { font-size: 10px; }
  .designer-note { font-size: 11px; }
  .occasion-card small { font-size: 11px; }
  .benefit b { font-size: 11px; }
  .benefit small { font-size: 10px; }
  .product-info h3 { font-size: 12px; }
  .product-info > p { font-size: 11px; }
  .product-info .rating { font-size: 11px; }
  .rating small, .review-person strong { font-size: 11px; }
  .button-order, .designer-upload, .designer-add { font-size: 11px; }
  .contact-ribbon p { font-size: 11px; }
  .contact-ribbon > .button { font-size: 11px; }
  .footer-brand > p { font-size: 12px; }
  .footer-bottom { font-size: 11px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}