:root {
  color-scheme: light;
  --ink: #0d1b2a;
  --navy: #112240;
  --gold: #c9a84c;
  --gold-light: #e2c97e;
  --paper: #f5f0e8;
  --white: #fffefa;
  --muted: #737a7d;
  --line: rgba(13, 27, 42, .13);
  --coral: #df755d;
  --teal: #4a8c83;
  font-family: Inter, sans-serif;
  color: var(--ink);
  background: var(--paper);
}

* { box-sizing: border-box; }
[hidden] { display: none !important; }
html { scroll-behavior: smooth; }
body { margin: 0; min-width: 320px; background: var(--paper); }
button, a { font: inherit; }
button { color: inherit; }
a { color: inherit; }

.shop-header { height: 78px; padding: 0 6vw; display: grid; grid-template-columns: 1fr 1fr 1fr; align-items: center; border-bottom: 1px solid var(--line); background: rgba(245,240,232,.94); }
.announcement-bar { overflow: hidden; padding: 9px 0; background: var(--ink); color: var(--paper); }
.announcement-track { width: max-content; display: flex; animation: announcement-scroll 32s linear infinite; }
.announcement-track span { padding: 0 30px; font-size: 9px; letter-spacing: .5px; white-space: nowrap; }
.announcement-track span::after { content: "✦"; margin-left: 60px; color: var(--gold-light); }
.announcement-bar:hover .announcement-track { animation-play-state: paused; }
.brand { width: fit-content; display: flex; align-items: baseline; gap: 0; color: var(--ink); font: 600 24px/1 'Cormorant Garamond', serif; letter-spacing: 2px; text-decoration: none; }
.brand span { color: var(--gold); }
.brand small { margin-left: 12px; color: var(--muted); font: 600 9px/1 Inter, sans-serif; letter-spacing: 1.4px; }
.back-link { justify-self: center; color: var(--muted); font-size: 11px; text-decoration: none; transition: color .2s; }
.back-link:hover, .admin-entry:hover { color: var(--gold); }
.cart-trigger { justify-self: end; display: flex; align-items: center; gap: 10px; padding: 8px 0 8px 12px; border: 0; background: transparent; font-size: 12px; cursor: pointer; }
.cart-trigger span { width: 24px; height: 24px; display: grid; place-items: center; border-radius: 50%; background: var(--ink); color: white; font-size: 10px; }

.shop-hero { min-height: 550px; display: grid; grid-template-columns: minmax(0, 1fr) minmax(380px, .95fr); align-items: center; gap: 5vw; padding: 68px 10vw 76px; overflow: hidden; }
.hero-copy { position: relative; z-index: 1; animation: arrive .7s both; }
.eyebrow { display: flex; align-items: center; gap: 9px; margin: 0; color: #8c7130; font-size: 10px; font-weight: 700; letter-spacing: 1.5px; text-transform: uppercase; }
.shop-hero .eyebrow > span:first-child { width: 7px; height: 7px; flex: 0 0 7px; border-radius: 50%; background: var(--coral); }
.shop-hero .eyebrow #shop-eyebrow { width: auto; height: auto; border-radius: 0; background: none; }
h1, h2, p { margin-top: 0; }
.shop-hero h1 { margin: 23px 0 16px; font: 500 clamp(54px, 6.4vw, 88px)/.94 'Cormorant Garamond', serif; letter-spacing: 0; }
.shop-hero h1 em { color: var(--teal); font-weight: 400; }
.hero-subtitle { max-width: 320px; margin-bottom: 28px; color: #656c6e; font-size: 13px; line-height: 1.7; }
.hero-actions { display:flex; flex-wrap:wrap; align-items:center; gap:15px 24px; }
.hero-link { display: inline-flex; align-items: center; gap: 18px; padding-bottom: 8px; border-bottom: 1px solid var(--gold); color: var(--ink); font-size: 11px; text-decoration: none; }
.hero-link span { color: var(--gold); font-size: 18px; transition: transform .2s; }
.hero-link:hover span { transform: translate(3px, 3px); }
.hero-link-custom { padding:11px 14px; border:1px solid rgba(13,27,42,.16); border-radius:4px; background:rgba(255,254,250,.6); transition:background .2s,border-color .2s,transform .2s; }
.hero-link-custom:hover { transform:translateY(-2px); border-color:var(--gold); background:var(--white); }

.hero-art { position: relative; width: 100%; max-width: 470px; aspect-ratio: 1.12; justify-self: center; overflow: hidden; background: #e7e0d4; perspective: 900px; transform-style: preserve-3d; animation: arrive .8s .12s both; }
.art-grid { position: absolute; inset: 0; background-image: linear-gradient(rgba(13,27,42,.08) 1px, transparent 1px),linear-gradient(90deg,rgba(13,27,42,.08) 1px,transparent 1px); background-size: 36px 36px; mask-image: linear-gradient(130deg,black,transparent 88%); transform: translate3d(var(--parallax-x,0px),var(--parallax-y,0px),-12px); transition: transform .24s ease-out; }
.art-label { position: absolute; top: 22px; left: 24px; z-index: 2; color: var(--ink); font-size: 8px; font-weight: 700; line-height: 1.7; letter-spacing: 1.4px; }
.art-ring { position: absolute; border: 1px solid rgba(13,27,42,.25); border-radius: 50%; transform: translate3d(var(--parallax-x,0px),var(--parallax-y,0px),0) rotateX(var(--parallax-tilt-y,0deg)) rotateY(var(--parallax-tilt-x,0deg)); transform-style: preserve-3d; transition: transform .24s ease-out; will-change: transform; }
.art-ring-one { width: 56%; aspect-ratio: 1; right: 7%; top: 12%; }
.art-ring-two { width: 36%; aspect-ratio: 1; right: 16%; top: 22%; border-color: rgba(201,168,76,.65); }
.art-block { position: absolute; transform-style: preserve-3d; box-shadow: 18px 20px 35px rgba(13,27,42,.15); transition: transform .24s ease-out; will-change: transform; }
.art-block-one { width: 32%; height: 43%; left: 20%; top: 30%; background: linear-gradient(145deg,#e9b767,#bd7e48); clip-path: polygon(12% 0,100% 12%,88% 100%,0 88%); transform: translate3d(var(--parallax-x,0px),var(--parallax-y,0px),24px) rotateX(var(--parallax-tilt-y,0deg)) rotateY(var(--parallax-tilt-x,0deg)) rotate(-16deg); animation: float-one 6s ease-in-out infinite; }
.art-block-two { width: 23%; height: 34%; left: 53%; top: 40%; background: linear-gradient(145deg,#72a89b,#36716c); clip-path: polygon(0 15%,88% 0,100% 84%,12% 100%); transform: translate3d(var(--parallax-x,0px),var(--parallax-y,0px),18px) rotateX(var(--parallax-tilt-y,0deg)) rotateY(var(--parallax-tilt-x,0deg)) rotate(13deg); animation: float-two 7s ease-in-out infinite; }
.art-block-three { width: 15%; aspect-ratio: 1; left: 41%; top: 17%; background: linear-gradient(135deg,#ed9b82,#c85e4e); clip-path: polygon(50% 0,100% 50%,50% 100%,0 50%); transform: translate3d(var(--parallax-x,0px),var(--parallax-y,0px),32px) rotateX(var(--parallax-tilt-y,0deg)) rotateY(var(--parallax-tilt-x,0deg)) rotate(12deg); animation: float-one 5s ease-in-out infinite reverse; }
.art-orbit { position: absolute; width: 90%; height: 24%; top: 58%; left: 4%; border: 1px solid rgba(13,27,42,.55); border-radius: 50%; transform: translate3d(var(--parallax-x,0px),var(--parallax-y,0px),4px) rotateX(var(--parallax-tilt-y,0deg)) rotateY(var(--parallax-tilt-x,0deg)) rotate(-28deg); transition: transform .24s ease-out; will-change: transform; }

.collection { padding: 72px 8vw 88px; background: var(--white); }
.collection-heading { display: flex; justify-content: space-between; align-items: end; gap: 30px; margin-bottom: 34px; }
.collection-heading h2, .cart-heading h2 { margin: 7px 0 0; font: 500 43px/1 'Cormorant Garamond', serif; }
.collection-tools { display: grid; justify-items: end; gap: 12px; }
.search-field input { width: min(100%, 280px); min-height: 38px; padding: 0 12px; border: 1px solid var(--line); border-radius: 2px; background: var(--white); color: var(--ink); font: inherit; font-size: 11px; }
.search-field input:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }
.visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; clip-path: inset(50%); border: 0; }
.filters { display: flex; flex-wrap: wrap; gap: 7px; }
.filter-button { padding: 8px 13px; border: 1px solid var(--line); border-radius: 2px; background: transparent; color: #565e60; font-size: 10px; cursor: pointer; transition: .2s; }
.filter-button:hover, .filter-button[aria-pressed="true"] { border-color: var(--ink); background: var(--ink); color: white; }
.shop-status { min-height: 24px; margin: 0 0 18px; color: var(--muted); font-size: 12px; }
.product-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 34px 20px; }
.product-card { min-width: 0; animation: arrive .45s both; }
.product-visual { position: relative; aspect-ratio: 1 / 1.08; overflow: hidden; background: #eee9df; }
.product-visual img { width: 100%; height: 100%; display: block; object-fit: cover; transition: transform .6s cubic-bezier(.2,.7,.25,1); }
.product-card:hover .product-visual img { transform: scale(1.045); }
.product-zoom { position:absolute; right:12px; bottom:12px; width:36px; height:36px; display:grid; place-items:center; border:1px solid rgba(255,255,255,.65); border-radius:50%; background:rgba(13,27,42,.72); color:white; font-size:18px; cursor:pointer; transition:transform .2s,background .2s; }
.product-zoom:hover { transform:scale(1.08); background:var(--teal); }
.product-thumbnails { display:flex; gap:7px; margin-top:8px; overflow-x:auto; }
.product-thumbnail { width:46px; height:46px; flex:0 0 46px; padding:0; overflow:hidden; border:1px solid var(--line); border-radius:3px; background:#eee9df; cursor:pointer; opacity:.72; transition:opacity .18s,border-color .18s,transform .18s; }
.product-thumbnail img { width:100%; height:100%; display:block; object-fit:cover; }
.product-thumbnail:hover,.product-thumbnail[aria-pressed=true] { transform:translateY(-1px); border-color:var(--gold); opacity:1; }
.product-variant-fields { grid-column:1/-1; display:grid; grid-template-columns:1fr 1fr; gap:9px; margin-top:3px; }
.product-variant-fields label { display:grid; gap:6px; color:var(--muted); font-size:9px; }
.product-variant-fields select { width:100%; min-height:37px; padding:7px 9px; border:1px solid var(--line); border-radius:4px; background:white; color:var(--ink); font:inherit; font-size:10px; }
.variant-availability { grid-column:1/-1; min-height:15px; margin:0; color:var(--muted); font-size:9px; }
.product-card.has-variants .add-button { grid-column:1/-1; grid-row:auto; }
.product-card.has-variants .product-description { min-height:0; }
.custom-request { padding:88px 8vw; background:linear-gradient(135deg,#ece6da 0%,var(--paper) 58%,#e8eee9 100%); }
.custom-request-grid { display:grid; grid-template-columns:minmax(220px,.72fr) minmax(0,1.28fr); gap:clamp(30px,6vw,82px); align-items:start; max-width:1240px; margin:0 auto; }
.custom-request-intro { position:sticky; top:32px; }
.custom-request-intro h2 { max-width:440px; margin:16px 0 16px; font:500 clamp(42px,5vw,62px)/.98 'Cormorant Garamond',serif; }
.custom-request-intro > p:not(.eyebrow) { max-width:400px; color:#656c6e; font-size:12px; line-height:1.8; }
.custom-steps { display:grid; gap:13px; margin-top:32px; color:#495457; font-size:10px; }
.custom-steps span { display:flex; align-items:center; gap:12px; }
.custom-steps i { width:29px; height:29px; display:grid; place-items:center; border:1px solid rgba(201,168,76,.6); border-radius:50%; color:#8c7130; font-size:9px; font-style:normal; }
.custom-request-form { display:grid; gap:18px; padding:clamp(20px,3vw,34px); border:1px solid rgba(13,27,42,.1); border-radius:9px; background:var(--white); box-shadow:0 18px 48px rgba(13,27,42,.07); animation:arrive .55s .08s both; }
.custom-field-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px 14px; }
.custom-field-grid > div { min-width:0; }
.custom-field-grid label { display:block; margin:0 0 7px; color:#3e4a4f; font-size:10px; font-weight:600; }
.custom-field-grid input,.custom-field-grid select,.custom-field-grid textarea { width:100%; min-height:43px; padding:10px 11px; border:1px solid var(--line); border-radius:5px; outline:none; background:white; color:var(--ink); font:inherit; font-size:11px; transition:border-color .2s,box-shadow .2s; }
.custom-field-grid textarea { min-height:120px; resize:vertical; }
.custom-field-grid input:focus,.custom-field-grid select:focus,.custom-field-grid textarea:focus { border-color:var(--gold); box-shadow:0 0 0 3px rgba(201,168,76,.13); }
.custom-field-wide { grid-column:1/-1; }
.custom-consent { display:flex; align-items:flex-start; gap:9px; margin:0; color:var(--muted); font-size:10px; line-height:1.6; cursor:pointer; }
.custom-consent input { flex:0 0 auto; margin:2px 0 0; accent-color:var(--teal); }
.custom-data-note { margin:-13px 0 0 24px; color:var(--muted); font-size:9px; line-height:1.6; }
.custom-submit { min-height:48px; display:flex; justify-content:space-between; align-items:center; gap:16px; padding:0 17px; border:0; border-radius:5px; background:var(--ink); color:white; font-size:11px; font-weight:600; cursor:pointer; transition:background .2s,transform .2s,box-shadow .2s; }
.custom-submit span { color:var(--gold-light); font-size:17px; transition:transform .2s; }
.custom-submit:hover { transform:translateY(-2px); background:var(--teal); box-shadow:0 8px 20px rgba(13,27,42,.13); }
.custom-submit:hover span { transform:translate(2px,-2px); }
.custom-submit:disabled { opacity:.65; cursor:wait; transform:none; }
.custom-request-status { min-height:18px; margin:-7px 0 0; color:#376d67; font-size:11px; line-height:1.6; }
.custom-request-status.is-error { color:#a24e40; }
.custom-submit:focus-visible { outline:3px solid rgba(201,168,76,.65); outline-offset:3px; }
.product-index { position: absolute; top: 13px; left: 14px; color: var(--ink); font-size: 9px; font-weight: 700; letter-spacing: 1px; }
.product-info { display: grid; grid-template-columns: 1fr auto; align-items: start; gap: 8px 12px; padding-top: 14px; }
.product-info h3 { margin: 0; font: 500 22px/1.05 'Cormorant Garamond', serif; }
.product-price { white-space: nowrap; font-size: 12px; font-weight: 700; }
.product-price del { display: block; margin-top: 4px; color: var(--muted); font-size: 10px; font-weight: 400; }
.offer-badge { position: absolute; top: 13px; right: 14px; padding: 6px 8px; background: var(--coral); color: white; font-size: 9px; font-weight: 700; text-transform: uppercase; letter-spacing: .7px; }
.product-category { grid-column: 1; margin: -1px 0 0; color: var(--muted); font-size: 10px; }
.product-description { grid-column: 1 / -1; min-height: 32px; margin: 0; color: #656c6e; font-size: 10px; line-height: 1.6; }
.add-button { grid-column: 2; grid-row: 2; padding: 8px 11px; border: 1px solid var(--gold); background: transparent; color: var(--ink); font-size: 10px; cursor: pointer; transition: background .2s,color .2s; }
.add-button:hover:not(:disabled) { background: var(--gold); }
.add-button:disabled { border-color: var(--line); color: #9a9a95; cursor: not-allowed; }
.empty-state { max-width: 620px; padding: 56px 0 44px; border-top: 1px solid var(--line); }
.empty-state strong { display: block; margin-bottom: 12px; font: 500 32px/1.05 'Cormorant Garamond', serif; }
.empty-state p { color: var(--muted); font-size: 12px; line-height: 1.7; }

.maker-note { display: flex; align-items: center; gap: 20px; padding: 32px 8vw; background: #e8e2d7; }
.maker-mark { width: 34px; height: 34px; display: grid; place-items: center; border: 1px solid var(--gold); color: #8c7130; font: 600 21px 'Cormorant Garamond', serif; }
.maker-note p { margin: 0; font: 400 16px/1.35 'Cormorant Garamond', serif; }
.maker-note strong { font-weight: 600; }
.maker-number { margin-left: auto; color: #777b78; font-size: 9px; letter-spacing: 1.4px; }
.shop-footer { min-height: 78px; display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 18px 6vw; background: var(--ink); color: var(--paper); }
.brand-footer { color: var(--paper); font-size: 21px; }
.shop-footer > span { color: rgba(245,240,232,.55); font-size: 9px; }
.admin-entry { color: rgba(245,240,232,.42); font-size: 9px; text-decoration: none; transition: color .2s; }
.checkout-result { margin: 0; padding: 17px 8vw; background: #e4efe9; color: #285a4d; font-size: 12px; line-height: 1.6; }
.checkout-result[hidden] { display: none; }
.store-gate { width: min(calc(100% - 40px), 560px); min-height: 46vh; margin: 8vh auto; padding: 45px; border: 1px solid var(--line); background: var(--white); box-shadow: 0 20px 55px rgba(13,27,42,.07); }
.store-gate h1 { margin: 14px 0; font: 500 clamp(36px, 6vw, 58px)/.98 'Cormorant Garamond', serif; }
.store-gate > p:not(.eyebrow):not(.gate-status) { color: var(--muted); font-size: 12px; line-height: 1.7; }
.store-gate form { display: grid; gap: 10px; margin-top: 25px; }
.store-gate label { font-size: 10px; font-weight: 700; }
.store-gate input { min-height: 44px; padding: 10px; border: 1px solid var(--line); background: white; font: inherit; }
.store-gate .primary-button { width: 100%; }
.gate-status { min-height: 18px; margin: 12px 0 0; color: #a24e40; font-size: 11px; }

.cart-backdrop { position: fixed; inset: 0; z-index: 8; background: rgba(13,27,42,.38); opacity: 0; transition: opacity .25s; }
.cart-backdrop:not([hidden]) { opacity: 1; }
.cart-panel { position: fixed; z-index: 9; top: 0; right: 0; bottom: 0; width: min(440px, 100%); display: flex; flex-direction: column; padding: 30px; background: var(--white); box-shadow: -20px 0 60px rgba(13,27,42,.15); transform: translateX(102%); transition: transform .28s cubic-bezier(.2,.7,.25,1); }
.cart-panel.open { transform: translateX(0); }
.cart-heading { display: flex; justify-content: space-between; align-items: center; padding-bottom: 23px; border-bottom: 1px solid var(--line); }
.close-button { width: 36px; height: 36px; border: 1px solid var(--line); background: transparent; font-size: 24px; cursor: pointer; }
.cart-lines { flex: 1; min-height: 0; overflow: auto; padding: 14px 0; }
.cart-empty { padding: 20px 0; color: var(--muted); font-size: 12px; }
.cart-line { display: grid; grid-template-columns: 65px 1fr auto; gap: 12px; padding: 14px 0; border-bottom: 1px solid var(--line); }
.cart-line img { width: 65px; height: 70px; object-fit: cover; background: #eee9df; }
.cart-line h3 { margin: 2px 0 6px; font: 500 19px/1 'Cormorant Garamond', serif; }
.cart-line p { margin: 0; color: var(--muted); font-size: 10px; }
.cart-line .cart-variant { margin: -2px 0 5px; color: var(--teal); font-size: 9px; }
.cart-quantity { display: flex; align-items: center; gap: 9px; margin-top: 10px; }
.cart-quantity button, .remove-line { border: 0; background: transparent; cursor: pointer; }
.cart-quantity button { width: 22px; height: 22px; border: 1px solid var(--line); }
.remove-line { align-self: start; color: var(--muted); font-size: 17px; }
.cart-bottom { max-height: 68vh; flex-shrink: 0; overflow: auto; padding-top: 17px; border-top: 1px solid var(--line); }
.cart-total { display: flex; justify-content: space-between; font-size: 12px; }
.coupon-total { margin-top: 8px; color: #376d67; }
.discounted-subtotal { margin-top: 8px; font-weight: 700; }
.coupon-form { margin: 0 0 16px; }
.coupon-form label { display: block; margin-bottom: 7px; font-size: 10px; font-weight: 700; }
.coupon-form > div { display: flex; gap: 7px; }
.coupon-form input { min-width: 0; min-height: 36px; flex: 1; padding: 7px 9px; border: 1px solid var(--line); background: white; font: inherit; font-size: 11px; }
.coupon-form button { padding: 0 12px; border: 1px solid var(--gold); background: transparent; font-size: 10px; cursor: pointer; }
.coupon-form button:disabled { opacity: .6; cursor: wait; }
.coupon-form p { min-height: 15px; margin: 6px 0 0; color: #376d67; font-size: 9px; }
.checkout-address { display: grid; gap: 8px; margin: 18px 0 12px; }
.address-heading { margin: 0; font-size: 11px; font-weight: 700; }
.checkout-address label { margin: 0 0 -4px; color: #555e61; font-size: 9px; }
.checkout-address input { width: 100%; min-height: 36px; padding: 7px 9px; border: 1px solid var(--line); border-radius: 2px; background: white; color: var(--ink); font: inherit; font-size: 11px; }
.checkout-address input:focus-visible { outline: 2px solid var(--gold); outline-offset: 1px; }
.address-row { display: grid; grid-template-columns: .75fr 1.25fr; gap: 9px; }
.address-row > div { display: grid; gap: 8px; }
.address-suggestions-status { min-height:14px; margin:-4px 0 0; color:var(--muted); font-size:9px; }
.address-hint { margin: 0; color: var(--muted); font-size: 9px; }
.shipping-note, .checkout-note { color: var(--muted); font-size: 10px; line-height: 1.5; }
.shipping-note { margin: 8px 0 18px; }
.checkout-button { width: 100%; min-height: 48px; border: 0; background: var(--ink); color: white; font-size: 11px; cursor: pointer; transition: background .2s; }
.checkout-button:hover:not(:disabled) { background: var(--teal); }
.checkout-button:disabled { background: #a4a7a3; cursor: not-allowed; }
.checkout-note { margin: 10px 0 0; text-align: center; }
.checkout-error { color: #a24e40; }
.photo-lightbox { position:relative; width:min(92vw,1000px); max-width:1000px; max-height:92vh; padding:48px 56px 20px; overflow:visible; border:1px solid rgba(255,255,255,.22); border-radius:9px; background:#0d1b2a; color:white; box-shadow:0 24px 80px rgba(0,0,0,.4); }
.photo-lightbox::backdrop { background:rgba(5,12,20,.86); backdrop-filter:blur(5px); }
.photo-lightbox img { width:100%; height:min(75vh,760px); display:block; object-fit:contain; }
.photo-lightbox p { min-height:15px; margin:12px 0 0; color:rgba(255,255,255,.75); font-size:10px; text-align:center; }
.lightbox-close,.lightbox-nav { position:absolute; display:grid; place-items:center; border:1px solid rgba(255,255,255,.3); border-radius:50%; background:rgba(255,255,255,.1); color:white; cursor:pointer; transition:background .2s,transform .2s; }
.lightbox-close:hover,.lightbox-nav:hover { transform:scale(1.06); background:var(--teal); }
.lightbox-close { top:12px; right:12px; width:36px; height:36px; font-size:24px; }
.lightbox-nav { top:50%; width:40px; height:40px; font-size:30px; transform:translateY(-50%); }
.lightbox-nav:hover { transform:translateY(-50%) scale(1.06); }
.lightbox-previous { left:8px; }
.lightbox-next { right:8px; }

@keyframes arrive { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: translateY(0); } }
@keyframes announcement-scroll { to { transform: translateX(-50%); } }
@keyframes float-one { 0%,100% { translate: 0 0; } 50% { translate: 0 -10px; } }
@keyframes float-two { 0%,100% { translate: 0 0; } 50% { translate: 0 9px; } }
@media (max-width: 850px) { .shop-hero { grid-template-columns: 1fr .9fr; padding-inline: 7vw; gap: 3vw; } .product-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } .collection { padding-inline: 7vw; } .custom-request { padding-inline:7vw; } .custom-request-grid { grid-template-columns:minmax(190px,.65fr) minmax(0,1.35fr); gap:30px; } }
@media (max-width: 620px) { .shop-header { height: 66px; padding-inline: 5vw; grid-template-columns: 1fr auto; } .brand small { font-size: 8px; } .back-link { display: none; } .shop-hero { min-height: 0; grid-template-columns: 1fr; padding: 52px 7vw 40px; gap: 35px; } .shop-hero h1 { font-size: 64px; } .hero-art { width: min(100%,440px); } .hero-actions { gap:12px 18px; } .hero-link { gap:10px; font-size:10px; } .hero-link-custom { padding:9px 10px; } .collection { padding: 52px 6vw 64px; } .collection-heading { display: block; margin-bottom: 26px; } .collection-heading h2 { margin-bottom: 20px; } .collection-tools { justify-items: stretch; } .search-field input { width: 100%; } .filters { gap: 6px; } .filter-button { padding: 7px 10px; } .product-grid { gap: 28px 12px; } .product-info h3 { font-size: 19px; } .product-price { font-size: 10px; } .product-description { min-height: 48px; } .add-button { padding: 7px 8px; font-size: 9px; } .product-thumbnail { width:40px; height:40px; flex-basis:40px; } .custom-request { padding:56px 6vw; } .custom-request-grid { grid-template-columns:1fr; gap:26px; } .custom-request-intro { position:static; } .custom-request-intro h2 { font-size:48px; } .custom-steps { grid-template-columns:1fr; margin-top:22px; } .custom-field-grid { grid-template-columns:1fr; gap:13px; } .custom-field-wide { grid-column:auto; } .custom-request-form { padding:20px 16px; } .maker-note { padding-inline: 6vw; } .shop-footer { flex-wrap: wrap; } .shop-footer > span { order: 3; width: 100%; } .cart-panel { padding: 24px 20px; } .photo-lightbox { width:94vw; padding:42px 37px 16px; } .photo-lightbox img { height:72vh; } .lightbox-nav { width:32px; height:32px; } .lightbox-previous { left:2px; } .lightbox-next { right:2px; } }
@media (max-width: 380px) { .product-grid { grid-template-columns: 1fr; } .shop-hero h1 { font-size: 56px; } }
@media (prefers-reduced-motion: reduce) { *,*::before,*::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; } }
@media (max-width: 620px) { .store-gate { padding: 32px 24px; } }