/* Maré site bundle: site, newsletter-popup, wp, woo, blog, utility (same order as the former separate links). */

/* ===== mare-jewellery-site.css ===== */
/* =========================================================
   Maré full site - white palette
   Sections mixed from: Aurum (hero), Fe Brilliance (category list, shop row,
   filter/cart drawers, product page), Amoura (bestsellers, lookbook,
   testimonial, story, gallery), Facet (split banner), Rick Brown (contact grid),
   Aurelle (announcement strip, category title, product grid, footer).
   ========================================================= */
:root {
  --mare-pattern: url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'120'%20height%3D'120'%20viewBox%3D'0%200%20120%20120'%3E%3Cg%20fill%3D'none'%20stroke%3D'%231c1c1b'%20stroke-opacity%3D'0.09'%20stroke-width%3D'1'%3E%3Cpath%20d%3D'M16%2054V36a10%2010%200%200%201%2020%200v18'%2F%3E%3Cpath%20d%3D'M76%20114V96a10%2010%200%200%201%2020%200v18'%2F%3E%3C%2Fg%3E%3Cg%20fill%3D'%231c1c1b'%20fill-opacity%3D'0.1'%3E%3Cpath%20d%3D'M26%2039.4Q26%2043%2029.6%2043Q26%2043%2026%2046.6Q26%2043%2022.4%2043Q26%2043%2026%2039.4Z'%2F%3E%3Cpath%20d%3D'M86%2099.4Q86%20103%2089.6%20103Q86%20103%2086%20106.6Q86%20103%2082.4%20103Q86%20103%2086%2099.4Z'%2F%3E%3Cpath%20d%3D'M86%2027.4Q86%2030%2088.6%2030Q86%2030%2086%2032.6Q86%2030%2083.4%2030Q86%2030%2086%2027.4Z'%2F%3E%3Cpath%20d%3D'M26%2089.4Q26%2092%2028.6%2092Q26%2092%2026%2094.6Q26%2092%2023.4%2092Q26%2092%2026%2089.4Z'%2F%3E%3Ccircle%20cx%3D'56'%20cy%3D'72'%20r%3D'.9'%2F%3E%3Ccircle%20cx%3D'116'%20cy%3D'12'%20r%3D'.9'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
  --mare-pattern-light: url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'120'%20height%3D'120'%20viewBox%3D'0%200%20120%20120'%3E%3Cg%20fill%3D'none'%20stroke%3D'%23ffffff'%20stroke-opacity%3D'0.16'%20stroke-width%3D'1'%3E%3Cpath%20d%3D'M16%2054V36a10%2010%200%200%201%2020%200v18'%2F%3E%3Cpath%20d%3D'M76%20114V96a10%2010%200%200%201%2020%200v18'%2F%3E%3C%2Fg%3E%3Cg%20fill%3D'%23ffffff'%20fill-opacity%3D'0.2'%3E%3Cpath%20d%3D'M26%2039.4Q26%2043%2029.6%2043Q26%2043%2026%2046.6Q26%2043%2022.4%2043Q26%2043%2026%2039.4Z'%2F%3E%3Cpath%20d%3D'M86%2099.4Q86%20103%2089.6%20103Q86%20103%2086%20106.6Q86%20103%2082.4%20103Q86%20103%2086%2099.4Z'%2F%3E%3Cpath%20d%3D'M86%2027.4Q86%2030%2088.6%2030Q86%2030%2086%2032.6Q86%2030%2083.4%2030Q86%2030%2086%2027.4Z'%2F%3E%3Cpath%20d%3D'M26%2089.4Q26%2092%2028.6%2092Q26%2092%2026%2094.6Q26%2092%2023.4%2092Q26%2092%2026%2089.4Z'%2F%3E%3Ccircle%20cx%3D'56'%20cy%3D'72'%20r%3D'.9'%2F%3E%3Ccircle%20cx%3D'116'%20cy%3D'12'%20r%3D'.9'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
}
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--bg); color: var(--ink); font: 400 16px/1.6 var(--sans); -webkit-font-smoothing: antialiased; overflow-x: hidden; }
img { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; }
input, select, textarea { font: inherit; color: inherit; }
h1, h2, h3, p { margin: 0; }
h1, h2, h3 { font-family: var(--serif); font-weight: 400; line-height: 1.05; letter-spacing: -.01em; }
ul { margin: 0; padding: 0; list-style: none; }
[hidden] { display: none !important; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.eyebrow { font-size: 12px; letter-spacing: .28em; text-transform: uppercase; color: var(--muted); }
.ulink { font-size: 13px; letter-spacing: .14em; text-transform: uppercase; border-bottom: 1px solid currentColor; padding-bottom: 3px; transition: opacity .25s; }
.ulink:hover { opacity: .55; }
.btn { display: inline-flex; align-items: center; justify-content: center; height: 52px; padding: 0 28px; background: var(--ink); color: #fff; font-size: 13px; letter-spacing: .16em; text-transform: uppercase; transition: background .25s; }
.btn:hover { background: #000; }
.btn-line { background: transparent; color: var(--ink); border: 1px solid var(--ink); }
.btn-line:hover { background: var(--ink); color: #fff; }
.ico { width: 19px; height: 19px; }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible { outline: 1.5px solid var(--ink); outline-offset: 3px; }

/* Image with soft placeholder until the real file exists */
.media { position: relative; overflow: hidden; background: var(--ph); }
.media img { width: 100%; height: 100%; object-fit: cover; transition: transform .9s var(--ease), opacity .5s var(--ease), filter .6s var(--ease); }
.media.ph img { opacity: 0 !important; }
.media.ph::after { content: attr(data-ph); position: absolute; left: 12px; bottom: 12px; font-size: 10px; letter-spacing: .12em; text-transform: uppercase; color: #a2a2a2; }

/* ---------------- Announcement + standard header (Aurelle strip, Fe hide-on-scroll) ---------------- */
.strip { height: 34px; background: var(--ink); color: #fff; display: flex; align-items: center; justify-content: center; font-size: 11px; letter-spacing: .22em; text-transform: uppercase; text-align: center; padding: 0 12px; }
.hdr { position: sticky; top: 0; z-index: 70; background: #fff; border-bottom: 1px solid var(--line); transition: transform .45s var(--ease); }
.hdr.hide { transform: translateY(-100%); }
.hdr-in { height: 76px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; padding: 0 var(--pad); }
.hdr nav { display: flex; gap: 28px; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; }
.hdr nav a { padding: 4px 0; border-bottom: 1px solid transparent; transition: border-color .25s; }
.hdr nav a:hover, .hdr nav a.on { border-color: currentColor; }
.logo { font-family: var(--serif); font-size: 30px; letter-spacing: .32em; text-transform: uppercase; margin-right: -.32em; line-height: 1; }
.hdr-icons { justify-self: end; display: flex; gap: 6px; align-items: center; }
.icon-btn { position: relative; width: 38px; height: 38px; display: inline-grid; place-items: center; transition: opacity .2s; }
.icon-btn:hover { opacity: .6; }
.badge { position: absolute; top: 3px; right: 1px; min-width: 16px; height: 16px; padding: 0 4px; border-radius: 9px; background: var(--ink); color: #fff; font-size: 9px; line-height: 16px; text-align: center; }
.badge[data-n="0"] { display: none; }
.burger { display: none; }

/* ---------------- Drawers (Fe: filter + cart) ---------------- */
.scrim { position: fixed; inset: 0; background: rgba(0, 0, 0, 0.35); opacity: 0; visibility: hidden; transition: .35s var(--ease); z-index: 90; }
.scrim.on { opacity: 1; visibility: visible; }
.drawer { position: fixed; top: 0; right: 0; bottom: 0; width: min(450px, 100%); background: #fff; z-index: 100; transform: translateX(100%); transition: transform .45s var(--ease); display: flex; flex-direction: column; }
.drawer.on { transform: none; }
.drawer.left { right: auto; left: 0; transform: translateX(-100%); }
.drawer.left.on { transform: none; }
.dr-head { height: 70px; flex: none; display: flex; align-items: center; justify-content: space-between; padding: 0 28px; border-bottom: 1px solid var(--line); font-size: 13px; letter-spacing: .18em; text-transform: uppercase; }
.dr-body { flex: 1; overflow: auto; padding: 8px 28px 24px; }
.dr-foot { flex: none; padding: 20px 28px 28px; border-top: 1px solid var(--line); }
.dr-foot .row { display: flex; justify-content: space-between; font-size: 13px; letter-spacing: .14em; text-transform: uppercase; margin-bottom: 16px; }
.dr-foot .btn { width: 100%; }
.dr-foot .two { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.f-group { padding: 22px 0; border-bottom: 1px solid var(--line); }
.f-group h4 { margin: 0 0 14px; font-weight: 400; font-size: 12px; letter-spacing: .2em; text-transform: uppercase; color: var(--muted); }
.f-group label { display: flex; align-items: center; gap: 10px; padding: 6px 0; font-size: 15px; cursor: pointer; }
.f-group input[type=checkbox], .f-group input[type=radio] { width: 15px; height: 15px; accent-color: var(--ink); }
.f-group input[type=range] { width: 100%; accent-color: var(--ink); }
.f-price { display: flex; justify-content: space-between; font-size: 13px; color: var(--muted); margin-top: 6px; }
.cline { display: grid; grid-template-columns: 84px 1fr; gap: 18px; padding: 20px 0; border-bottom: 1px solid var(--line); }
.cline .media { aspect-ratio: 5 / 6; }
.cline .top { display: flex; justify-content: space-between; gap: 10px; }
.cline .n { font-family: var(--serif); font-size: 21px; line-height: 1.1; }
.cline .v { font-size: 13px; color: var(--muted); margin-top: 2px; }
.cline .bot { display: flex; justify-content: space-between; align-items: center; margin-top: 14px; }
.qty { display: inline-grid; grid-template-columns: 30px 28px 30px; align-items: center; height: 34px; border: 1px solid var(--line); text-align: center; font-size: 14px; }
.qty button { height: 100%; }
.rm { font-size: 12px; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); border-bottom: 1px solid currentColor; }
.empty { padding: 80px 0; text-align: center; color: var(--muted); }
.empty .btn { margin-top: 24px; }
.toast { position: fixed; left: 50%; bottom: 24px; transform: translate(-50%, calc(100% + 40px)); visibility: hidden; background: var(--ink); color: #fff; padding: 13px 20px; font-size: 14px; z-index: 120; transition: transform .45s var(--ease); max-width: calc(100% - 32px); text-align: center; }
.toast.on { transform: translate(-50%, 0); visibility: visible; }
.mnav a { display: block; font-family: var(--serif); font-size: 34px; padding: 6px 0; }

/* ---------------- HOME 1: Hero (Aurum) ---------------- */
.hz-head { position: fixed; inset: 0 0 auto 0; z-index: 60; height: 80px; padding: 0 40px; display: flex; align-items: center; justify-content: space-between; color: var(--ink); pointer-events: none; background: rgba(255, 255, 255, 0); border-bottom: 1px solid transparent; transition: background .4s var(--ease), border-color .4s var(--ease); }
.hz-head.solid { background: rgba(255, 255, 255, 0.96); border-bottom-color: var(--line); pointer-events: auto; }
.hz-head a, .hz-head button { pointer-events: auto; }
.hz-nav { display: flex; gap: 24px; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; }
.hz-nav a { transition: opacity .25s; } .hz-nav a:hover { opacity: .6; }
.hz-nav sup { display: inline-grid; place-items: center; min-width: 18px; height: 18px; padding: 0 5px; margin-left: 6px; border-radius: 999px; background: var(--ink, #000); color: #fff; font-size: 10px; font-weight: 500; line-height: 1; letter-spacing: 0; vertical-align: 1px; transition: transform .3s; }
.hz-nav a:hover sup { transform: scale(1.08); }
.hz-mark { position: fixed; left: 50%; top: 0; font-family: var(--serif); font-size: clamp(130px, 19vw, 290px); font-weight: 400; line-height: 1; letter-spacing: -.02em; white-space: nowrap; transform-origin: 50% 0; will-change: transform; }
.hz-mark i { font-style: italic; }
.hz { position: relative; height: 149vh; }
.hz-card { position: absolute; left: 50%; top: 44vh; width: 107vw; height: 105vh; margin-left: -53.5vw; border-radius: 40px; overflow: hidden; will-change: transform; }
.hz-card .media { position: absolute; inset: 0; }
.hz-after { height: 10vh; }

/* ---------------- HOME 2: Category hover list (Fe Brilliance) ---------------- */
.catlist { display: grid; grid-template-columns: 1fr 1fr; min-height: 100vh; border-top: 1px solid var(--line); }
.catlist-names { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 4px; padding: 80px var(--pad); }
.catlist-names .eyebrow { margin-bottom: 28px; }
.catlist-names a { position: relative; font-family: var(--serif); font-size: clamp(56px, 6vw, 88px); line-height: 1.12; color: #c9c9c9; transition: color .4s var(--ease); }
.catlist-names a sup { position: absolute; top: .55em; left: 100%; margin-left: 8px; font-family: var(--sans); font-size: 12px; letter-spacing: .1em; opacity: 0; transition: opacity .3s; }
.catlist-names a.on { color: var(--ink); }
.catlist-names a.on sup { opacity: 1; }
.catlist-imgs { position: relative; min-height: 100vh; }
.catlist-imgs .media { position: absolute; inset: 0; opacity: 0; transition: opacity .7s var(--ease); }
.catlist-imgs .media.on { opacity: 1; }
.catlist-imgs .media img { transform: scale(1.04); transition: transform 1.4s var(--ease); }
.catlist-imgs .media.on img { transform: scale(1); }

/* ---------------- HOME 3: Bestsellers (Amoura) ---------------- */
.sec { padding: clamp(80px, 9vw, 130px) var(--pad); }
.sec-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 24px; margin-bottom: 44px; }
.sec-head h2 { font-size: clamp(40px, 4.4vw, 64px); margin-top: 14px; }
.best { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.bcard { display: block; }
.bcard .media { aspect-ratio: 4 / 5; }
.bcard .media .alt { position: absolute; inset: 0; opacity: 0; }
.bcard .btn-line { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -40%); opacity: 0; transition: opacity .4s var(--ease), transform .4s var(--ease); background: rgba(255, 255, 255, 0.85); white-space: nowrap; z-index: 2; height: 46px; }
.bcard .btn-line:hover { background: var(--ink); color: #fff; }

.bcard:hover .btn-line { opacity: 1; transform: translate(-50%, -50%); }
.bcard .meta { display: flex; justify-content: space-between; gap: 12px; margin-top: 16px; }
.bcard .n { font-family: var(--serif); font-size: 22px; line-height: 1.15; }
.bcard .t { font-size: 13px; color: var(--muted); }
.bcard .p { font-size: 14px; letter-spacing: .08em; white-space: nowrap; }

/* ---------------- HOME 4: Split banner (Facet) ---------------- */
.split { display: grid; grid-template-columns: 1fr 1fr; }
.split-panel { position: relative; display: block; aspect-ratio: 713 / 958; overflow: hidden; color: #fff; }
.split-panel .media { position: absolute; inset: 0; }
.split-panel .media::before { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(to top, rgba(0, 0, 0, 0.42), rgba(0, 0, 0, 0) 36%); pointer-events: none; }
.split-panel:hover .media img { transform: scale(1.03); }
.split-copy { position: absolute; left: 16px; right: 16px; bottom: 34px; z-index: 2; text-align: center; }
.split-copy h2 { font-family: var(--serif); font-size: clamp(34px, 3.6vw, 54px); text-transform: uppercase; letter-spacing: .04em; line-height: 1.2; }
.split-link { position: relative; display: inline-block; margin-top: 10px; font-size: 13px; letter-spacing: .2em; text-transform: uppercase; padding-bottom: 3px; }
.split-link::after { content: ""; position: absolute; left: 0; bottom: 0; width: 100%; height: 1px; background: currentColor; transform: scaleX(0); transform-origin: left; transition: transform .45s var(--ease); }
.split-panel:hover .split-link::after { transform: scaleX(1); }

/* ---------------- HOME 5: Lookbook staggered pair (Amoura) ---------------- */
.look-head { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; align-items: end; margin-bottom: 64px; }
.look-head h2 { font-size: clamp(40px, 4.4vw, 64px); margin-top: 14px; }
.look-head > p { max-width: 440px; justify-self: end; color: var(--muted); font-size: 17px; }
.look-pair { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(16px, 8vw, 116px); align-items: start; padding-bottom: 120px; }
.look-pair .a { aspect-ratio: 605 / 625; will-change: transform; }
.look-pair .b { aspect-ratio: 605 / 736; margin-top: 200px; will-change: transform; }

/* ---------------- HOME 6: Testimonial slider (Amoura) ---------------- */
.testi { display: grid; grid-template-columns: 532fr 760fr; gap: clamp(32px, 6vw, 96px); align-items: center; }
.testi .media { aspect-ratio: 532 / 700; }
.testi blockquote { margin: 0; font-family: var(--serif); font-size: clamp(30px, 3.4vw, 50px); line-height: 1.15; min-height: 3.5em; transition: opacity .35s var(--ease); }
.testi .who { margin-top: 32px; font-size: 13px; letter-spacing: .18em; text-transform: uppercase; }
.testi .who span { color: var(--muted); }
.testi .arrows { display: flex; gap: 10px; margin-top: 44px; align-items: center; }
.testi .arrows button { width: 50px; height: 50px; border: 1px solid var(--line); display: grid; place-items: center; transition: border-color .25s; }
.testi .arrows button:hover { border-color: var(--ink); }
.testi .count { margin-left: 14px; font-size: 13px; letter-spacing: .14em; color: var(--muted); }

/* ---------------- Contact grid (Rick Brown, white) ---------------- */
.cf { position: relative; padding: clamp(100px, 13vw, 200px) 20px; --cols: 4; }
.cf-line { position: absolute; top: 0; bottom: 0; width: calc((100% - 40px - (var(--cols) - 1) * 20px) / var(--cols)); left: calc(20px + (var(--c) - 1) * ((100% - 40px - (var(--cols) - 1) * 20px) / var(--cols) + 20px)); border-left: 1px solid #ebebeb; border-right: 1px solid #ebebeb; pointer-events: none; }
.cf-grid { position: relative; display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; grid-template-areas: "label copy copy a" "c e e b" "d e e ."; align-items: start; }
.cf-label { grid-area: label; font-size: 12px; letter-spacing: .24em; text-transform: uppercase; color: var(--muted); padding-top: 14px; }
.cf-copy { grid-area: copy; }
.cf-copy h2 { font-size: clamp(54px, 6.4vw, 96px); line-height: .9; letter-spacing: -.02em; }
.cf-copy p { max-width: 440px; margin-top: 24px; color: var(--muted); }
.cf-copy .ulink { display: inline-block; margin-top: 30px; }
.cf-a { grid-area: a; aspect-ratio: 331 / 440; }
.cf-c { grid-area: c; aspect-ratio: 331 / 400; }
.cf-e { grid-area: e; aspect-ratio: 683 / 720; }
.cf-b { grid-area: b; aspect-ratio: 331 / 224; background: #fff; }
.cf-d { grid-area: d; aspect-ratio: 331 / 144; background: #fff; }
.cf-form { grid-area: form; }

/* ---------------- Footer (Aurelle, white) ---------------- */
.fw { border-top: 1px solid var(--line); background: #fff; }
.fw-cols { display: grid; grid-template-columns: repeat(3, 1fr) 2fr; gap: 0 48px; padding: 72px var(--pad) 64px; border-bottom: 1px solid var(--line); }
.fw-col { display: flex; flex-direction: column; align-items: flex-start; gap: 15px; }
.fw-head { font-size: 12px; letter-spacing: .22em; text-transform: uppercase; color: var(--muted); margin-bottom: 4px; }
.fw-col a { font-size: 14px; letter-spacing: .08em; color: #545454; transition: color .25s; }
.fw-col a:hover { color: var(--ink); }
.fw-news-title { font-family: var(--serif); font-size: 24px; line-height: 1.2; }
.fw-form { display: flex; align-items: center; width: 100%; border-bottom: 1px solid var(--ink); }
.fw-form input { flex: 1; min-width: 0; height: 46px; border: 0; background: transparent; font-size: 14px; outline: none; }
.fw-form input::placeholder { color: #a2a2a2; }
.fw-form button { width: 36px; height: 36px; display: grid; place-items: center; transition: transform .3s var(--ease); }
.fw-form button:hover { transform: translateX(3px); }
.fw-form.bad { border-bottom-color: #a2412e; }
.fw-msg { font-size: 13px; color: var(--muted); }
.fw-msg:empty { display: none; }
.fw-social { display: flex; gap: 20px; color: #545454; }
.fw-mark { position: relative; display: flex; justify-content: space-between; align-items: center; padding: 28px 46px 10px; cursor: none; user-select: none; }
.fw-slot { position: relative; display: grid; place-items: center; }
.fw-letter { font-family: var(--serif); font-size: clamp(88px, 15vw, 216px); line-height: 1.2; color: #fff; transition: opacity .45s var(--ease), transform .55s var(--ease); }
.fw-pic { position: absolute; left: 50%; top: 50%; width: clamp(66px, 11.1vw, 160px); aspect-ratio: 160 / 233; border-radius: 9px; overflow: hidden; opacity: 0; transform: translate(-50%, -50%) scale(.82); transition: opacity .45s var(--ease), transform .55s var(--ease); background: var(--ph); pointer-events: none; }
.fw-pic img { width: 100%; height: 100%; object-fit: cover; }
.fw-pic.ph img { opacity: 0; }
.fw-slot.on .fw-letter { opacity: 0; transform: scale(.7); }
.fw-slot.on .fw-pic { opacity: 1; transform: translate(-50%, -50%) scale(1); }
.fw-dot { position: absolute; left: 0; top: 0; width: 18px; height: 18px; margin: -9px 0 0 -9px; border-radius: 50%; background: var(--ink); pointer-events: none; opacity: 0; transform: scale(.4); transition: opacity .25s, transform .25s; z-index: 3; }
.fw-mark:hover .fw-dot { opacity: 1; transform: scale(1); }
.fw-bottom { display: flex; justify-content: center; flex-wrap: wrap; gap: 28px; padding: 22px 20px 40px; font-size: 12px; letter-spacing: .08em; color: #999999; }
.fw-bottom a:hover { color: var(--ink); }

/* ---------------- SHOP (Aurelle title + grid, Fe row + filter drawer) ---------------- */
.cat-title { text-align: center; padding: clamp(64px, 8vw, 110px) var(--pad) clamp(48px, 5vw, 72px); }
.crumbs { display: flex; justify-content: center; gap: 10px; font-size: 12px; letter-spacing: .2em; text-transform: uppercase; color: var(--muted); }
.crumbs a:hover { color: var(--ink); }
.cat-title h1 { font-size: clamp(60px, 7vw, 100px); margin-top: 18px; }
.cat-title p { font-family: var(--serif); font-style: italic; font-size: clamp(20px, 1.8vw, 24px); color: var(--muted); margin-top: 12px; }
.cat-chips { display: flex; justify-content: center; flex-wrap: wrap; gap: 8px; margin-top: 30px; }
.chip { height: 36px; padding: 0 16px; display: inline-flex; align-items: center; border: 1px solid var(--line); font-size: 12px; letter-spacing: .16em; text-transform: uppercase; transition: border-color .25s, background .25s, color .25s; }
.chip:hover { border-color: var(--ink); }
.chip.on { background: var(--ink); color: #fff; border-color: var(--ink); }
.shop-row { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; padding: 16px var(--pad); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); font-size: 12px; letter-spacing: .18em; text-transform: uppercase; }
.shop-row .crumbs { justify-content: flex-start; }
.shop-row .filter-btn { text-transform: inherit; letter-spacing: inherit; justify-self: end; display: inline-flex; gap: 8px; align-items: center; }
.grid3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px; padding: 48px var(--pad) clamp(80px, 9vw, 120px); }
.pcard { display: block; border: 1px solid var(--line); }
.pcard .media { aspect-ratio: 5 / 6; background: var(--panel); }
.pcard .media .alt { position: absolute; inset: 0; opacity: 0; }
.pcard:hover .media .alt:not(.missing) { opacity: 1; }
.pcard .add { position: absolute; left: 0; right: 0; bottom: 0; height: 48px; background: var(--ink); color: #fff; font-size: 12px; letter-spacing: .2em; text-transform: uppercase; transform: translateY(100%); transition: transform .4s var(--ease); z-index: 2; }
.pcard:hover .add, .pcard:focus-within .add { transform: none; }
.pcard .cap { padding: 18px 20px 22px; border-top: 1px solid var(--line); text-align: center; }
.pcard .n { font-family: var(--serif); font-size: 22px; line-height: 1.1; }
.pcard .t { font-size: 12px; color: var(--muted); letter-spacing: .06em; margin-top: 3px; }
.pcard .p { font-size: 13px; letter-spacing: .22em; margin-top: 8px; }
.no-results { grid-column: 1 / -1; text-align: center; padding: 80px 0; color: var(--muted); }

/* ---------------- PRODUCT (Fe Brilliance) ---------------- */
.pdp { display: grid; grid-template-columns: 1fr 1fr; border-bottom: 1px solid var(--line); }
.pdp-imgs { display: grid; gap: 4px; }
.pdp-imgs .media { aspect-ratio: 713 / 900; background: var(--panel); }
.pdp-info { position: sticky; top: 76px; align-self: start; padding: 48px clamp(24px, 6vw, 96px) 64px; }
.pdp-info .top { display: flex; justify-content: space-between; align-items: center; }
.pdp-info .crumbs { justify-content: flex-start; }
.pdp-info .eyebrow { margin-top: 40px; display: block; }
.pdp-info h1 { font-size: clamp(46px, 4.4vw, 64px); margin-top: 10px; }
.pdp-info .type { font-family: var(--serif); font-style: italic; font-size: 22px; color: var(--muted); }
.pdp-info .price { font-size: 18px; letter-spacing: .1em; margin-top: 18px; }
.pdp-info .desc { margin-top: 20px; color: #545454; max-width: 480px; }
.opt { margin-top: 28px; }
.opt .lbl { display: block; font-size: 12px; letter-spacing: .2em; text-transform: uppercase; color: var(--muted); margin-bottom: 12px; }
.opt .lbl b { font-weight: 400; color: var(--ink); }
.metal { display: flex; gap: 10px; }
.metal button { display: inline-flex; align-items: center; gap: 10px; height: 42px; padding: 0 16px; border: 1px solid var(--line); font-size: 13px; transition: border-color .25s; }
.metal button i { width: 16px; height: 16px; border-radius: 50%; }
.metal button.on { border-color: var(--ink); }
.sel { width: 100%; max-width: 260px; height: 46px; padding: 0 14px; border: 1px solid var(--line); background: #fff; }
.add-btn { width: 100%; margin-top: 28px; }
.advice { margin-top: 28px; background: var(--panel); padding: 22px 24px; }
.advice h4 { margin: 0 0 6px; font-family: var(--serif); font-weight: 400; font-size: 22px; }
.advice p { font-size: 14px; color: #545454; }
.advice .links { display: flex; gap: 20px; margin-top: 14px; }
.acc { margin-top: 32px; border-top: 1px solid var(--line); }
.acc details { border-bottom: 1px solid var(--line); }
.acc summary { list-style: none; display: flex; justify-content: space-between; align-items: center; padding: 18px 0; cursor: pointer; font-size: 13px; letter-spacing: .18em; text-transform: uppercase; }
.acc summary::-webkit-details-marker { display: none; }
.acc .plus { position: relative; width: 12px; height: 12px; }
.acc .plus::before, .acc .plus::after { content: ""; position: absolute; left: 0; right: 0; top: 50%; height: 1px; background: currentColor; transition: transform .3s var(--ease); }
.acc .plus::after { transform: rotate(90deg); }
.acc details[open] .plus::after { transform: rotate(0); }
.acc ul { padding: 0 0 20px 18px; list-style: disc; color: #545454; font-size: 15px; }
.acc li { margin: 4px 0; }
.heart.on svg { fill: currentColor; }
.related { display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px; }

/* ---------------- ABOUT (Amoura story + gallery, Fe craft split) ---------------- */
.story { position: relative; height: 100vh; min-height: 620px; overflow: hidden; color: #fff; }
.story .media { position: absolute; inset: -12% 0; will-change: transform; background: #8d8d8d; }
.story .media::before { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(to bottom, rgba(0, 0, 0, 0.35), rgba(0, 0, 0, 0.05) 45%, rgba(0, 0, 0, 0.4)); }
.story-in { position: relative; z-index: 2; height: 100%; display: flex; flex-direction: column; justify-content: space-between; padding: 120px var(--pad) 64px; }
.story-in .eyebrow { color: rgba(255, 255, 255, 0.8); }
.story-in h1 { font-size: clamp(54px, 6.6vw, 96px); max-width: 9em; margin-top: 16px; }
.story-in p { max-width: 520px; font-size: 18px; color: rgba(255, 255, 255, 0.9); }
.craft { display: grid; grid-template-columns: 1fr 1fr; min-height: 90vh; }
.craft .media { min-height: 520px; }
.craft-copy { display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center; padding: 80px clamp(24px, 7vw, 120px); }
.craft-copy p:not(.eyebrow) { font-family: var(--serif); font-size: clamp(24px, 2.2vw, 32px); line-height: 1.35; margin-top: 24px; }
.craft-copy .ulink { margin-top: 32px; }
.gallery { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.gallery .media { aspect-ratio: 320 / 417; }
.gallery .cap { margin-top: 12px; font-size: 12px; letter-spacing: .2em; text-transform: uppercase; color: var(--muted); }
.values { display: grid; grid-template-columns: repeat(3, 1fr); gap: 40px; border-top: 1px solid var(--line); padding-top: 48px; }
.values h3 { font-size: 30px; margin: 12px 0 10px; }
.values p { color: var(--muted); }

/* ---------------- CONTACT form ---------------- */
.cform { display: grid; gap: 22px; max-width: 560px; }
.cform label { display: block; font-size: 12px; letter-spacing: .2em; text-transform: uppercase; color: var(--muted); }
.cform input, .cform textarea { display: block; width: 100%; margin-top: 12px; padding: 0 0 12px; border: 0; border-bottom: 1px solid #d8d8d8; background: transparent; font-size: 17px; outline: none; resize: none; transition: border-color .25s; }
.cform input:focus, .cform textarea:focus { border-bottom-color: var(--ink); }
.cform [aria-invalid="true"] { border-bottom-color: #a2412e; }
.cform .err { font-size: 13px; color: #a2412e; }
.cform .btn { justify-self: start; }
.cthanks { max-width: 560px; }
.cthanks h3 { font-size: 40px; }
.cthanks p { color: var(--muted); margin-top: 12px; }
.c-info { display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px; border-top: 1px solid var(--line); padding-top: 40px; }
.c-info h4 { margin: 0 0 8px; font-weight: 400; font-size: 12px; letter-spacing: .2em; text-transform: uppercase; color: var(--muted); }
.c-info p { font-family: var(--serif); font-size: 22px; line-height: 1.3; }
.contact-form-sec { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(32px, 6vw, 96px); align-items: start; }
.contact-form-sec h2 { font-size: clamp(40px, 4.4vw, 64px); margin-top: 14px; }
.contact-form-sec .intro p { color: var(--muted); margin-top: 18px; max-width: 420px; }

/* ---------------- Reveal on scroll ---------------- */
.rv { opacity: 0; transform: translateY(26px); transition: opacity .9s var(--ease), transform .9s var(--ease); }
.rv.in { opacity: 1; transform: none; }

/* =========================================================
   Responsive
   ========================================================= */
@media (max-width: 1080px) {
  .hdr nav { display: none; }
  .burger { display: inline-grid; }
  .hdr-in { grid-template-columns: auto 1fr auto; gap: 12px; }
  .hdr-in .logo { justify-self: center; }
  .best { grid-template-columns: repeat(2, 1fr); gap: 32px 16px; }
  .grid3 { grid-template-columns: repeat(2, 1fr); gap: 20px; }
  .fw-cols { grid-template-columns: 1fr 1fr; gap: 44px 24px; }
  .fw-news { grid-column: 1 / -1; }
}
@media (max-width: 820px) {
  .hz-head { height: 64px; padding: 0 20px; }
  .hz-left a:not(:first-child), .hz-right a:not(:last-child) { display: none; }
  .hz-mark { font-size: 34vw; }
  .hz-card { border-radius: 26px; height: 92vh; }
  .hz { height: 136vh; }
  .catlist { grid-template-columns: 1fr; min-height: 0; }
  .catlist-imgs { min-height: 0; aspect-ratio: 4 / 5; order: -1; }
  .catlist-names { padding: 56px 20px; }
  .catlist-names a { font-size: 56px; }
  .catlist-names a sup { opacity: 1; }
  .split { grid-template-columns: 1fr; }
  .split-panel { aspect-ratio: 3 / 4; }
  .look-head, .testi, .craft, .contact-form-sec { grid-template-columns: 1fr; }
  .look-head > p { justify-self: start; }
  .look-pair { gap: 12px; padding-bottom: 40px; }
  .look-pair .b { margin-top: 80px; }
  .testi blockquote { min-height: 4.6em; }
  .cf { --cols: 2; padding: 100px 16px; }
  .cf-line[style*="--c:3"], .cf-line[style*="--c:4"] { display: none; }
  .cf-line { width: calc((100% - 48px) / 2); left: calc(16px + (var(--c) - 1) * ((100% - 48px) / 2 + 16px)); }
  .cf-grid { grid-template-columns: 1fr 1fr; gap: 16px; grid-template-areas: "label label" "copy copy" "a b" "c d" "e e"; }
  .cf-copy { padding-bottom: 28px; }
  .cf-b, .cf-d { aspect-ratio: auto; align-self: stretch; }
  .pdp { grid-template-columns: 1fr; }
  .pdp-imgs { grid-auto-flow: column; grid-auto-columns: 100%; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; }
  .pdp-imgs::-webkit-scrollbar { display: none; }
  .pdp-imgs .media { scroll-snap-align: start; aspect-ratio: 4 / 5; }
  .pdp-info { position: relative; top: 0; padding: 32px 20px 48px; }
  .related { grid-template-columns: 1fr 1fr; gap: 16px; }
  .related > :nth-child(3) { display: none; }
  .gallery { grid-template-columns: 1fr 1fr; }
  .values, .c-info { grid-template-columns: 1fr; gap: 28px; }
  .fw-mark { padding: 24px 16px 4px; cursor: default; }
  .fw-dot { display: none; }
  .shop-row { grid-template-columns: 1fr 1fr; }
  .shop-row .crumbs { display: none; }
  .shop-row .count { justify-self: start; }
}
@media (max-width: 560px) {
  .grid3 { gap: 12px; padding-top: 28px; }
  .pcard .cap { padding: 12px 8px 16px; }
  .pcard .n { font-size: 19px; }
  .pcard .add { height: 40px; font-size: 10px; transform: none; }
  .best { gap: 28px 10px; }
  .bcard .meta { flex-direction: column; gap: 2px; }
  .bcard .btn-line { display: none; }
  .sec-head { flex-direction: column; align-items: flex-start; }
  .fw-cols { grid-template-columns: 1fr 1fr; padding: 56px 20px 48px; }
  .fw-col:nth-child(3) { grid-column: 1 / -1; }
  .logo { font-size: 24px; }
  .strip { font-size: 9px; letter-spacing: .16em; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition: none !important; animation: none !important; }
  .rv { opacity: 1; transform: none; }
  .hz-card { transform: none !important; width: 100vw; margin-left: -50vw; border-radius: 0; }
  .look-pair .a, .look-pair .b, .story .media { transform: none !important; }
}

/* New hero photo: subject sits right of centre, keep her face in frame when the card crops */
.hz-card .media img { object-position: 64% 32%; }


/* =========================================================
   MARÉ BRAND LAYER: monogram (arch + sparkle), pattern, arch frames
   ========================================================= */
.mono { width: 100%; height: 100%; display: block; }
.spark { width: 10px; height: 10px; display: inline-block; flex: none; }
.pat { }

/* Divider ornament */
.orn { display: flex; align-items: center; justify-content: center; gap: 18px; padding: clamp(56px, 6vw, 88px) var(--pad) 0; color: var(--ink); }
.orn i { display: block; width: min(150px, 22vw); height: 1px; background: #fff; }
.orn .spark { width: 14px; height: 14px; }
.orn + .sec, .orn + .cx { padding-top: clamp(48px, 5vw, 72px); }

/* Header + strip */

/* Hero: arch card + monogram line */
.hz-card { border-radius: 40px; }
.hz-sub { position: absolute; left: 50%; top: 40vh; z-index: 3; transform: translateX(-50%); display: flex; align-items: center; gap: 18px; white-space: nowrap; will-change: opacity, transform; }
.hz-mono { width: 26px; height: 26px; color: var(--ink); }
.hz-sub p { font-size: 12px; letter-spacing: .24em; text-transform: uppercase; color: var(--muted); }
.hz-cta { display: inline-flex; align-items: center; gap: 10px; height: 42px; padding: 0 22px; border: 1px solid var(--ink); border-radius: 999px; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; transition: background .3s, color .3s; }
.hz-cta:hover { background: var(--ink); color: #fff; }

/* Category list: numbers + arch frame */
.catlist-names { align-items: flex-start; padding-left: clamp(40px, 9vw, 150px); }
.catlist-names .num { display: inline-block; width: 46px; font-family: var(--sans); font-size: 12px; letter-spacing: .14em; color: #b4b4b4; vertical-align: .9em; transition: color .4s; }
.catlist-names a.on .num { color: var(--ink); }
.catlist-imgs { padding: clamp(28px, 4vw, 56px); }
.cat-frame { position: relative; height: 100%; min-height: calc(100vh - 2 * clamp(28px, 4vw, 56px)); border-radius: 0; overflow: hidden; background: var(--ph); }
.cat-frame::after { content: ""; position: absolute; inset: 0; border-radius: inherit; box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.06); pointer-events: none; }

/* Bestsellers: crossfade to worn photo, pill + tag */
.bcard .media { background: var(--panel); }
.bcard .media .alt { transition: opacity .6s var(--ease); }
.bcard:hover .media .alt:not(.missing) { opacity: 1; }
.bcard .tag, .pcard .flag { position: absolute; top: 12px; left: 12px; z-index: 2; display: inline-flex; align-items: center; gap: 6px; height: 26px; padding: 0 10px; border-radius: 999px; background: rgba(255, 255, 255, 0.92); font-size: 10px; letter-spacing: .16em; text-transform: uppercase; }
.bcard .pill { position: absolute; right: 14px; bottom: 14px; z-index: 2; display: grid; place-items: center; width: 46px; height: 46px; border-radius: 50%; background: var(--ink); color: #fff; opacity: 0; transform: scale(.6); transition: opacity .35s var(--ease), transform .5s cubic-bezier(.19, 1, .22, 1); }
.bcard .pill svg { width: 16px; height: 16px; transform: rotate(-45deg); transition: transform .5s cubic-bezier(.19, 1, .22, 1); }
.bcard:hover .pill svg { transform: rotate(0deg); }
.bcard .media { overflow: hidden; }
.bcard:hover .pill, .bcard:focus-visible .pill { opacity: 1; transform: none; }

/* Split banner: inset frame, left-aligned numbered copy */
.split { gap: 12px; padding: 12px; }
.split-panel .media::before { background: linear-gradient(to top, rgba(0, 0, 0, 0.45), rgba(0, 0, 0, 0) 42%); }
.split-copy { left: clamp(20px, 3vw, 44px); right: auto; bottom: clamp(24px, 3vw, 44px); text-align: left; }
.split-num { display: block; font-size: 11px; letter-spacing: .24em; margin-bottom: 12px; opacity: .85; }
.split-copy h2 { text-transform: none; letter-spacing: -.01em; font-size: clamp(38px, 4vw, 60px); line-height: 1.05; }
.split-link { margin-top: 16px; }
.split-link::after { transform: scaleX(1); opacity: .6; }
.split-panel:hover .split-link::after { opacity: 1; }

/* Lookbook + testimonial: arch frames */
.look-pair .media { border-radius: 0; }
.testi-pic { padding: clamp(24px, 3vw, 44px) clamp(24px, 3vw, 44px) 0; background-color: var(--panel); }
.testi-pic .media { aspect-ratio: 532 / 680; border-radius: 0; }
.testi-copy { position: relative; }
.qmark { display: block; height: .62em; font-family: var(--serif); font-size: clamp(120px, 12vw, 180px); line-height: 1; color: transparent; -webkit-text-stroke: 1px var(--ink); margin: 0 0 4px -6px; }

/* Contact panel (home teaser + contact page) */
.cx { padding: clamp(40px, 5vw, 72px) var(--pad) clamp(80px, 9vw, 130px); }
.cx-panel { display: grid; grid-template-columns: 1.05fr 1fr; gap: clamp(32px, 6vw, 96px); align-items: center; padding: clamp(36px, 6vw, 96px); background-color: var(--panel); }
.cx-copy h1, .cx-copy h2 { font-size: clamp(50px, 6vw, 92px); line-height: .95; letter-spacing: -.02em; margin-top: 18px; }
.cx-copy p:not(.eyebrow) { max-width: 440px; margin-top: 24px; color: #545454; }
.cx-copy .ulink { display: inline-block; margin-top: 30px; }
.cx-pics { position: relative; padding: 0 0 56px 56px; }
.cx-arch { aspect-ratio: 4 / 5; max-width: 440px; margin-left: auto; border-radius: 0; }
.cx-sq { position: absolute; left: 0; bottom: 0; width: 40%; max-width: 200px; aspect-ratio: 1; border: 8px solid #fff; }

/* Shop cards: arch-top image, flag top-right */
.pcard { border: 0; }
.pcard .media { border-radius: 0; }
.pcard .flag { left: auto; right: 12px; top: auto; bottom: 60px; }
.pcard:hover .flag { opacity: 0; }
.pcard .flag { transition: opacity .3s; }
.pcard .cap { border-top: 0; padding: 18px 12px 6px; }

/* Product: patterned advice + accordion, brand promises */
.advice { background-color: var(--panel); }
.promises { display: flex; flex-wrap: wrap; gap: 10px 22px; margin-top: 18px; font-size: 12px; letter-spacing: .12em; text-transform: uppercase; color: #545454; }
.promises li { display: inline-flex; align-items: center; gap: 8px; }
.promises [data-mono] { width: 16px; height: 16px; color: var(--ink); }
.acc summary { padding-left: 12px; padding-right: 12px; transition: background-color .3s; }
.acc details[open] > summary { background-color: var(--panel); }

/* Drawers + empty state */
.dr-head { }
.empty { margin-top: 20px; padding: 64px 20px; }
.empty-mono { display: block; width: 34px; height: 34px; margin: 0 auto 18px; color: var(--ink); }

/* About values strip */
.values { position: relative; border-top: 0; padding: clamp(48px, 5vw, 72px) clamp(24px, 4vw, 56px); background-color: var(--panel); }
.values-mono { position: absolute; left: 50%; top: 0; width: 44px; height: 44px; padding: 8px; margin: -22px 0 0 -22px; border-radius: 50%; background: #fff; color: var(--ink); }
.values > div { background: rgba(255, 255, 255, 0.85); }

/* Footer (Maré) */
.ft { border-top: 1px solid var(--line); background: #fff; }
.ft-top { display: grid; grid-template-columns: minmax(300px, 1fr) 1.4fr; gap: clamp(32px, 6vw, 96px); padding: clamp(40px, 5vw, 64px) var(--pad); align-items: start; }
.ft-news { padding: clamp(28px, 3vw, 44px); background-color: var(--panel); }
.ft-mono { display: block; width: 30px; height: 30px; color: var(--ink); }
.ft-title { font-family: var(--serif); font-size: clamp(28px, 2.6vw, 36px); line-height: 1.1; margin-top: 22px; }
.ft-sub { font-size: 14px; color: #545454; margin: 10px 0 22px; max-width: 360px; }
.ft-news .fw-form { background: transparent; }
.ft-news .fw-msg { margin-top: 10px; }
.ft-cols { display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px; padding-top: 12px; }
.ft-mark { display: flex; justify-content: space-between; align-items: flex-end; padding: clamp(120px, 14vw, 210px) var(--pad) 0; user-select: none; border-top: 1px solid var(--line); }
.ft-slot { position: relative; cursor: pointer; }
.ft-letter { position: relative; z-index: 2; display: block; font-family: var(--serif); font-size: clamp(96px, 17vw, 250px); line-height: .82; color: transparent; -webkit-text-stroke: 1px #cfcfcf; transition: color .45s var(--ease), -webkit-text-stroke-color .45s var(--ease); }
.ft-slot.on .ft-letter { color: var(--ink); -webkit-text-stroke-color: var(--ink); }
.ft-pic { position: absolute; left: 50%; bottom: 68%; z-index: 1; width: clamp(64px, 8.4vw, 124px); aspect-ratio: 3 / 4; border-radius: 0; overflow: hidden; background: var(--ph); opacity: 0; transform: translate(-50%, 24px) scale(.92); transition: opacity .45s var(--ease), transform .55s var(--ease); pointer-events: none; }
.ft-pic img { width: 100%; height: 100%; object-fit: cover; }
.ft-slot:last-child .ft-pic { bottom: 104%; }
.ft-pic.ph img { opacity: 0; }
.ft-slot.on .ft-pic { opacity: 1; transform: translate(-50%, 0) scale(1); }
.ft-bottom { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 16px 28px; padding: 26px var(--pad) 36px; border-top: 1px solid var(--line); font-size: 12px; letter-spacing: .08em; color: #898989; }
.ft-legal { display: inline-flex; align-items: center; gap: 12px; }
.ft-legal .mono { width: 20px; height: 20px; color: var(--ink); }
.ft-bottom nav { display: flex; gap: 24px; }
.ft-bottom a:hover { color: var(--ink); }

@media (max-width: 1080px) {
  .ft-top { grid-template-columns: 1fr; }
}
@media (max-width: 820px) {
  .hz-sub { flex-direction: column; gap: 10px; white-space: normal; text-align: center; width: 88%; }
  .hz-sub p { font-size: 11px; letter-spacing: .18em; }
  .hz-mono { width: 22px; height: 22px; }
  .catlist-names { padding-left: 24px; }
  .catlist-imgs { padding: 20px 20px 0; }
  .cat-frame { min-height: 0; height: 100%; }
  .split { gap: 8px; padding: 8px; }
  .cx-panel { grid-template-columns: 1fr; padding: 32px 22px; }
  .cx-pics { padding: 0 0 40px 40px; }
  .cx-arch { max-width: none; }
  .pcard .media { border-radius: 0; }
  .ft-cols { grid-template-columns: 1fr 1fr; }
  .ft-cols .fw-col:nth-child(3) { grid-column: 1 / -1; }
  .ft-mark { padding-top: 110px; }
  .ft-letter { font-size: 22vw; }
  .ft-bottom { justify-content: center; text-align: center; }
  .testi-pic { padding: 20px 20px 0; }
}
@media (max-width: 560px) {
  .pcard .media { border-radius: 0; }
  .pcard .flag { display: none; }
  .bcard .pill { display: none; }
  .orn i { width: 18vw; }
}
@media (prefers-reduced-motion: reduce) {
  .hz-card { border-radius: 48vw 48vw 0 0 / 22vw 22vw 0 0; }
}

/* Simple frames (arch shapes removed): hero card keeps the original soft corners */
@media (max-width: 820px) { .hz-card { border-radius: 26px; } }
@media (prefers-reduced-motion: reduce) { .hz-card { border-radius: 0; } }

/* ---------------- HOME: Scroll zoom (layout after Signals "Kidney Verse") ---------------- */
.zm { position: relative; height: 350vh; margin-bottom: -100vh; background: #fff; }
.zm-stage { position: sticky; top: 0; height: 100vh; overflow: hidden; display: flex; align-items: center; justify-content: center; background: #fff; }
.zm-tiles { position: absolute; inset: 0; }
.zt { position: absolute; overflow: hidden; background: var(--ph, #fff); will-change: transform, clip-path; }
.zt img { width: 100%; height: 100%; object-fit: cover; }
.zt.ph img { opacity: 0; }
.zt-s { width: clamp(84px, 8.6vw, 140px); aspect-ratio: 1; }
.zt-s.zt-md { width: clamp(64px, 6.4vw, 104px); }
.zt-v { width: calc(2 * clamp(52px, 5.4vw, 84px)); aspect-ratio: 9 / 8; clip-path: inset(0 25% 0 25%); }
.zt-v.zt-sm { width: calc(2 * clamp(30px, 2.8vw, 44px)); }
.zt-1 { top: 0; right: calc(-1 * clamp(52px, 5.4vw, 84px) / 2); }
.zt-2 { top: 9vh; right: 20%; }
.zt-3 { top: 9vh; left: 5%; }
.zt-4 { top: 30%; left: 20%; }
.zt-5 { bottom: 0; left: calc(-1 * clamp(52px, 5.4vw, 84px) / 2); }
.zt-6 { bottom: 9vh; right: 5%; }
.zt-7 { bottom: 9vh; left: 40%; }
.zt-8 { bottom: 30%; right: 20%; }
.zm-media { position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: 3; overflow: hidden; transform-origin: 50% 50%; transform: scale(.05); will-change: transform; background: var(--ph, #fff); }
.zm-media > img { width: 100%; height: 100%; object-fit: cover; }
.zm-media.ph > img { opacity: 0; }
.zm-cap { position: absolute; left: var(--pad); bottom: clamp(32px, 6vh, 64px); max-width: 420px; padding: 26px 28px; background: rgba(255, 255, 255, 0.94); opacity: 0; transform: translateY(16px); transition: opacity .5s var(--ease), transform .5s var(--ease); pointer-events: none; }
.zm.cap-on .zm-cap { opacity: 1; transform: none; pointer-events: auto; }
.zm-cap-t { font-family: var(--serif); font-size: clamp(22px, 2vw, 28px); line-height: 1.2; margin: 12px 0 18px; }
.zm-words { position: absolute; left: 0; right: 0; top: 50%; height: 1.1em; margin-top: -.55em; z-index: 2; font-family: var(--serif); font-size: clamp(34px, 4.2vw, 64px); line-height: 1; color: var(--ink); white-space: nowrap; pointer-events: none; }
.zm-words span { position: absolute; top: 0; display: block; will-change: transform; }
.zm-l { right: 50%; transform: translateX(-50px); }
.zm-r { left: 50%; transform: translateX(50px); }
.zm + section { position: relative; z-index: 4; background: #fff; }
.zm + .sec { padding-top: clamp(80px, 9vw, 140px) !important; }

@media (max-width: 820px) {
  .zt-4 { display: none; }
  .zt-2 { top: 12vh; }
  .zt-7 { left: 30%; }
  .zm-cap { left: 16px; right: 16px; max-width: none; padding: 20px; }
}
@media (prefers-reduced-motion: reduce) {
  .zm { height: auto; margin-bottom: 0; }
  .zm-stage { position: relative; height: auto; display: block; padding: 0 var(--pad); }
  .zm-tiles, .zm-words { display: none; }
  .zm-media { position: relative; transform: none; aspect-ratio: 16 / 9; }
  .zm-cap { opacity: 1; transform: none; pointer-events: auto; }
}

/* ---------------- HOME: Lookbook editorial (layout + reveals after eladiodieste.com) ---------------- */
.ed { padding: clamp(80px, 9vw, 140px) var(--pad) clamp(90px, 10vw, 150px); background: #fff; }
.ed-div { height: 1px; background: var(--ink); transform: scaleX(0); transform-origin: 0 50%; transition: transform 1.4s cubic-bezier(.19, 1, .22, 1); }
.ed-div.in { transform: scaleX(1); }
.ed-top { padding-top: 24px; }
.ed-lead { margin-top: 32px; font-family: var(--serif); font-size: clamp(30px, 3.9vw, 58px); line-height: 1.04; letter-spacing: -.015em; color: var(--ink); }
.ed-body { padding-top: clamp(90px, 13.7vw, 200px); }
.ed-grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 20px; }
.ed-note { grid-column: 9 / span 4; font-size: 18px; line-height: 1.3; color: #545454; }
.ed-pics { margin-top: 20px; }
.ed-pic { grid-column: span 4; position: relative; margin: 0; aspect-ratio: 912 / 1200; overflow: hidden; background: #fff; }
.ed-pic img { width: 100%; height: 100%; object-fit: cover; opacity: 0; }
.ed-pic.in img { opacity: 1; animation: ed-clip 1.2s cubic-bezier(.41, .35, .2, 1) both; animation-delay: calc(var(--i, 0) * .2s); }
.ed-pic.ph img { opacity: 0 !important; }
.ed-pic figcaption { position: absolute; right: 16px; bottom: 14px; font-size: 13px; letter-spacing: .04em; color: rgba(255, 255, 255, 0.92); text-shadow: 0 1px 10px rgba(0, 0, 0, 0.45); opacity: 0; transition: opacity .3s; transition-delay: calc(var(--i, 0) * .2s + .6s); }
.ed-pic.in figcaption { opacity: 1; }
.ed-div-b { margin-top: 24px; }
@keyframes ed-clip { 0% { clip-path: inset(0 0 100% 0); transform: scale(1.1) translateY(-5%); } 100% { clip-path: inset(0 0 0 0); transform: scale(1); } }
/* line reveal: each line rises out of a mask, 50ms apart */
[data-ed-lines] { opacity: 0; }
[data-ed-lines].ed-ready, [data-ed-lines].in { opacity: 1; }
.ed-w { display: inline-block; white-space: nowrap; }
.ed-lm { display: block; clip-path: inset(-.3em 0 -.3em 0); }
.ed-ln { display: block; translate: 0 1em; opacity: 0; transition: translate 1.4s cubic-bezier(.33, 0, 0, 1), opacity 1.4s cubic-bezier(.33, 0, 0, 1); }
[data-ed-lines].in .ed-ln { translate: 0 0; opacity: 1; transition-delay: calc(var(--line) * 50ms); }
@media (max-width: 820px) {
  .ed-note { grid-column: 1 / -1; font-size: 16px; }
  .ed-pics { display: flex; gap: 12px; overflow-x: auto; scroll-snap-type: x mandatory; margin: 20px calc(-1 * var(--pad)) 0; padding: 0 var(--pad); scrollbar-width: none; }
  .ed-pics::-webkit-scrollbar { display: none; }
  .ed-pic { flex: 0 0 80%; scroll-snap-align: start; }
}
@media (prefers-reduced-motion: reduce) {
  .ed-div { transform: none; transition: none; }
  [data-ed-lines], .ed-ln, .ed-pic img, .ed-pic figcaption { opacity: 1 !important; translate: none !important; animation: none !important; transition: none !important; }
}

/* ---------------- HOME: Gallery (horizontal row + shrinking intro panel, layout after htarchitecte.com) ---------------- */
.gl { position: relative; background: #fff; }
.gl-stage { position: sticky; top: 0; height: 100vh; overflow: hidden; }
.gl-intro { position: absolute; left: 0; top: 0; bottom: 0; width: 50vw; overflow: hidden; z-index: 2; color: #fff; clip-path: inset(0 0 0 0); will-change: clip-path; }
.gl-bg { position: absolute; inset: 0; width: 50vw; }
.gl-bg img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 30%; }
.gl-bg::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0, 0, 0, 0.34) 0%, rgba(0, 0, 0, 0.2) 40%, rgba(0, 0, 0, 0.2) 60%, rgba(0, 0, 0, 0.38) 100%); }
.gl-big, .gl-words span { will-change: transform; text-shadow: 0 2px 24px rgba(0, 0, 0, 0.18); }
.gl-big { position: absolute; font-family: var(--serif); font-size: clamp(120px, 15vw, 230px); line-height: .8; }
.gl-big-a { left: 30px; top: 104px; }
.gl-big-b { right: 30px; bottom: 30px; }
.gl-words { position: absolute; left: 30px; right: 30px; top: 50%; transform: translateY(-50%); display: flex; justify-content: space-between; gap: 16px; font-size: clamp(15px, 1.4vw, 21px); white-space: nowrap; z-index: 1; }
.gl-big { z-index: 1; }
.gl-mark { position: absolute; left: 30px; top: 96px; z-index: 1; display: grid; font-family: var(--serif); font-size: 34px; line-height: .95; color: var(--ink); opacity: 0; transition: opacity .4s var(--ease); }
.gl-mark span:last-child { padding-left: 1.6em; }
.gl.min .gl-mark { opacity: 1; }
.gl-track { position: absolute; left: calc(50vw + 20px); bottom: 20px; display: flex; align-items: flex-end; gap: 20px; margin: 0; padding: 0; list-style: none; will-change: transform; }
.gl-item a { display: block; }
.gl-img { display: block; height: min(55vh, 560px); aspect-ratio: var(--ar); overflow: hidden; background: #fff; }
.gl-img img { width: 100%; height: 100%; object-fit: cover; transition: transform 1s var(--ease); }
.gl-img.ph img { opacity: 0; }
.gl-item a:hover .gl-img img { transform: scale(1.03); }
.gl-cap { display: block; height: 34px; font-family: var(--serif); font-size: 24px; line-height: 1; color: var(--ink); opacity: 0; transform: translateY(6px); transition: opacity .35s var(--ease), transform .35s var(--ease); }
.gl-item a:hover .gl-cap, .gl-item a:focus-visible .gl-cap { opacity: 1; transform: none; }
.gl-end { align-self: center; padding: 0 clamp(40px, 8vw, 120px) 0 clamp(20px, 3vw, 40px); white-space: nowrap; }
@media (hover: none) { .gl-cap { opacity: 1; transform: none; font-size: 18px; height: 28px; } }
@media (max-width: 820px) {
  .gl-intro, .gl-bg { width: 86vw; }
  .gl-track { left: calc(86vw + 12px); gap: 12px; bottom: 16px; }
  .gl-img { height: 48vh; }
  .gl-big { font-size: 34vw; }
  .gl-big-a { left: 18px; top: 80px; } .gl-big-b { right: 18px; bottom: 18px; }
  .gl-words { left: 18px; right: 18px; flex-direction: column; gap: 6px; }
  .gl-mark { left: 16px; top: 84px; font-size: 26px; }
}
@media (prefers-reduced-motion: reduce) {
  .gl-stage { position: relative; height: auto; overflow-x: auto; }
  .gl-intro { display: none; }
  .gl-track { position: relative; left: 0; bottom: 0; padding: 100px var(--pad) 40px; }
  .gl-cap { opacity: 1; transform: none; }
}



/* ---------------- HOME: Testimonials (pinned; one customer per screen of scroll, styled like the other home sections) ---------------- */
.tq { position: relative; background: var(--bg); }
.tq-stage { position: sticky; top: 0; height: 100vh; overflow: hidden; display: flex; flex-direction: column; padding: calc(80px + clamp(28px, 3.4vw, 52px)) var(--pad) clamp(28px, 3.4vw, 52px); }
.tq-count { font-size: 12px; letter-spacing: .28em; color: var(--muted); }
.tq-count b { font-weight: 400; color: var(--ink); }
.tq-body { flex: 1; min-height: 0; display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(40px, 6vw, 112px); }
.tq-text { display: flex; flex-direction: column; min-height: 0; }
.tq-top { display: flex; justify-content: space-between; align-items: center; padding-bottom: 18px; border-bottom: 1px solid var(--line); }
.tq-slides { position: relative; flex: 1; }
.tq-slide { position: absolute; inset: 0; display: flex; flex-direction: column; justify-content: center; gap: clamp(28px, 4vh, 44px); visibility: hidden; transition: visibility 0s .6s; }
.tq-slide.on { visibility: visible; transition-delay: 0s; }
.tq-q { font-family: var(--serif); font-weight: 400; font-size: clamp(22px, 1.9vw, 30px); line-height: 1.32; color: var(--ink); margin: 0; max-width: 24em; }
.tq-q .w { display: inline-block; opacity: 0; transform: translateY(.35em); transition: opacity .4s var(--ease), transform .5s var(--ease); }
.tq-slide.on .tq-q .w { opacity: 1; transform: none; transition: opacity .8s var(--ease), transform 1s cubic-bezier(.19, 1, .22, 1); transition-delay: calc(var(--wi) * 24ms + .2s); }
.tq-who { opacity: 0; transform: translateY(10px); transition: opacity .4s var(--ease), transform .4s var(--ease); }
.tq-slide.on .tq-who { opacity: 1; transform: none; transition: opacity .7s var(--ease) .55s, transform .7s var(--ease) .55s; }
.tq-name { font-size: 13px; letter-spacing: .14em; text-transform: uppercase; color: var(--ink); }
.tq-city { margin-top: 6px; font-size: 13px; color: var(--muted); }
.tq-who .ulink { display: inline-block; margin-top: 20px; }
.tq-who { padding-top: 22px; border-top: 1px solid var(--line); max-width: 24em; }
.tq-fig { display: flex; flex-direction: column; min-height: 0; }
.tq-media { position: relative; display: block; flex: 1; min-height: 0; overflow: hidden; background: var(--ph); }
.tq-bgs { position: absolute; inset: 0; }
.tq-bg { position: absolute; inset: 0; visibility: hidden; }
.tq-bg img { width: 100%; height: 100%; object-fit: cover; }
.tq-bg.was { visibility: visible; z-index: 1; }
.tq-bg.on { visibility: visible; z-index: 2; clip-path: inset(100% 0 0 0); animation: tqWipe 1.1s cubic-bezier(.77, 0, .18, 1) forwards; }
.tq-bg.on img { animation: tqZoom 1.6s cubic-bezier(.19, 1, .22, 1) forwards; }
.tq-bg.first, .tq-bg.first img { animation: none !important; clip-path: none !important; }
@keyframes tqWipe { to { clip-path: inset(0 0 0 0); } }
@keyframes tqZoom { from { transform: scale(1.15); } to { transform: scale(1); } }
.tq-tag { position: absolute; top: 12px; left: 12px; z-index: 3; display: inline-flex; align-items: center; gap: 6px; height: 26px; padding: 0 10px; border-radius: 999px; background: rgba(255, 255, 255, 0.92); font-size: 10px; letter-spacing: .16em; text-transform: uppercase; color: var(--ink); }
.tq-metas { position: relative; height: 62px; margin-top: 16px; }
.tq-meta { position: absolute; inset: 0; display: flex; justify-content: space-between; gap: 12px; opacity: 0; transition: opacity .3s var(--ease); }
.tq-meta.on { opacity: 1; transition: opacity .6s var(--ease) .5s; }
.tq-meta .n { font-family: var(--serif); font-size: 22px; line-height: 1.15; }
.tq-meta .t { font-size: 13px; color: var(--muted); }
.tq-meta .p { font-size: 14px; letter-spacing: .08em; white-space: nowrap; }
@media (max-width: 820px) {
  .tq-stage { padding-top: 88px; padding-bottom: 16px; }
  .tq-body { grid-template-columns: 1fr; grid-template-rows: minmax(0, 1fr) auto; gap: 14px; }
  .tq-fig { order: -1; }
  .tq-metas { height: 44px; margin-top: 10px; }
  .tq-meta .n { font-size: 19px; }
  .tq-slides { min-height: 230px; }
  .tq-slide { padding-right: 0; justify-content: flex-start; gap: 16px; }
  .tq-q { font-size: clamp(19px, 5vw, 22px); }
  .tq-text { order: 2; }
  .tq-top { padding-bottom: 12px; }
  .tq-slide { padding-top: 16px; }
  .tq-who { padding-top: 14px; }
  .tq-who .ulink { margin-top: 12px; }
}
@media (prefers-reduced-motion: reduce) {
  .tq-bg.on, .tq-bg.on img { animation: none; clip-path: none; }
  .tq-q .w, .tq-who, .tq-meta { transition: none !important; }
}


/* ---------------- HOME: Contact (editorial statement, inline photos, live clock, rotating badge) ---------------- */
.cv { position: relative; background: var(--panel); padding: clamp(36px, 4vw, 56px) var(--pad) clamp(56px, 6vw, 96px); margin-top: clamp(56px, 6vw, 96px); overflow: hidden; }
.cv-top { display: flex; justify-content: space-between; align-items: center; gap: 16px; }
.cv-clock { display: flex; align-items: center; gap: 10px; font-size: 12px; letter-spacing: .2em; text-transform: uppercase; color: var(--muted); }
.cv-clock [data-cv-status], .cv-clock [data-cv-time] { color: var(--ink); }
.cv-sep { opacity: .4; }
.cv-dot { width: 7px; height: 7px; border-radius: 50%; background: #898989; box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.5); animation: cvPulse 2.4s ease-out infinite; }
.cv.closed .cv-dot { background: #b8b8b8; animation: none; }
@keyframes cvPulse { 0% { box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.45); } 70%, 100% { box-shadow: 0 0 0 9px rgba(255, 255, 255, 0); } }
.cv-title { margin: clamp(56px, 8vw, 120px) 0 clamp(56px, 7vw, 104px); text-align: center; font-family: var(--serif); font-weight: 400; font-size: clamp(46px, 7.6vw, 124px); line-height: 1.04; letter-spacing: -.02em; }
.cv-line { display: block; overflow: hidden; padding-bottom: .06em; }
.cv-line > span { display: inline-block; transform: translateY(105%); transition: transform 1.2s cubic-bezier(.19, 1, .22, 1); }
.cv-line + .cv-line > span { transition-delay: .12s; }
.cv.in .cv-line > span { transform: none; }
.cv-pic { display: inline-block; vertical-align: -.04em; height: .74em; width: 0; margin: 0 .06em; border-radius: 999px; overflow: hidden; background: var(--ph); transition: width 1.3s cubic-bezier(.77, 0, .18, 1) .55s, margin 1.3s cubic-bezier(.77, 0, .18, 1) .55s; }
.cv.in .cv-pic { width: 1.7em; margin: 0 .14em; }
.cv-pic img { width: 100%; height: 100%; object-fit: cover; transform: scale(1.25); transition: transform 1.8s cubic-bezier(.19, 1, .22, 1) .6s; }
.cv.in .cv-pic img { transform: none; }
.cv-row { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: end; gap: clamp(32px, 5vw, 88px); }
.cv-badge { position: relative; display: grid; place-items: center; width: clamp(128px, 11vw, 168px); aspect-ratio: 1; color: var(--ink); }
.cv-ring { position: absolute; inset: 0; width: 100%; height: 100%; animation: cvSpin 22s linear infinite; }
.cv-ring text { font-family: var(--sans); font-size: 13.4px; letter-spacing: .18em; text-transform: uppercase; fill: currentColor; }
.cv-badge:hover .cv-ring { animation-duration: 8s; }
@keyframes cvSpin { to { transform: rotate(360deg); } }
.cv-core { display: grid; place-items: center; width: 44%; aspect-ratio: 1; border-radius: 50%; background: var(--ink); color: #fff; transition: transform .5s cubic-bezier(.19, 1, .22, 1); }
.cv-core svg { width: 32%; height: 32%; transition: transform .5s cubic-bezier(.19, 1, .22, 1); }
.cv-badge:hover .cv-core { transform: scale(1.12); }
.cv-badge:hover .cv-core svg { transform: rotate(45deg); }
.cv-cols { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; }
.cv-col { padding-top: 18px; border-top: 1px solid #dcdcdc; opacity: 0; transform: translateY(16px); transition: opacity .9s var(--ease), transform .9s var(--ease); }
.cv.in .cv-col { opacity: 1; transform: none; }
.cv.in .cv-col:nth-child(2) { transition-delay: .08s; } .cv.in .cv-col:nth-child(3) { transition-delay: .16s; } .cv.in .cv-col:nth-child(4) { transition-delay: .24s; }
.cv-col .k { font-size: 11px; letter-spacing: .24em; text-transform: uppercase; color: var(--muted); margin-bottom: 14px; }
.cv-col .v { display: inline-block; font-family: var(--serif); font-size: clamp(19px, 1.55vw, 24px); line-height: 1.3; color: var(--ink); }
.cv-col a.v { background: linear-gradient(currentColor, currentColor) 0 100% / 0 1px no-repeat; transition: background-size .5s var(--ease); }
.cv-col a.v:hover { background-size: 100% 1px; }
@media (max-width: 820px) {
  .cv { padding: 28px 18px 56px; }
  .cv-clock { font-size: 10px; letter-spacing: .14em; gap: 7px; }
  .cv-title { font-size: clamp(26px, 7.4vw, 34px); margin: 56px 0 48px; letter-spacing: -.01em; }
  .cv-line > span { white-space: nowrap; }
  .cv.in .cv-pic { width: 1.35em; margin: 0 .1em; }
  .cv-row { grid-template-columns: 1fr; justify-items: center; gap: 40px; }
  .cv-cols { grid-template-columns: 1fr 1fr; gap: 28px 18px; width: 100%; }
  .cv-col .v { font-size: 18px; }
}
@media (prefers-reduced-motion: reduce) {
  .cv-line > span, .cv-pic, .cv-pic img, .cv-col { transition: none !important; }
  .cv-ring, .cv-dot { animation: none; }
}

/* ---------------- HOME: Lookbook now carries the bestseller cards (replaces the separate Bestsellers row) ---------------- */
.ed-head { align-items: end; }
.ed-label { grid-column: 1 / span 4; }
.ed-best-title { font-family: var(--serif); font-weight: 400; font-size: clamp(34px, 3.2vw, 48px); line-height: 1; margin: 12px 0 18px; }
.ed-label .ulink { display: inline-block; }
.ed-best { margin-top: clamp(28px, 3vw, 44px); }
.ed-best .bcard .media img:first-child { opacity: 0; }
.ed-best .bcard.in .media img:first-child { opacity: 1; animation: ed-clip 1.2s cubic-bezier(.41, .35, .2, 1) both; animation-delay: calc(var(--i, 0) * .16s); }
.ed-best .bcard .meta, .ed-best .bcard .tag { opacity: 0; transition: opacity .6s var(--ease); }
.ed-best .bcard.in .meta, .ed-best .bcard.in .tag { opacity: 1; transition-delay: calc(var(--i, 0) * .16s + .7s); }
@media (max-width: 820px) {
  .ed-label { grid-column: 1 / -1; margin-bottom: 20px; }
}
@media (prefers-reduced-motion: reduce) {
  .ed-best .bcard .media img:first-child, .ed-best .bcard .meta, .ed-best .bcard .tag { opacity: 1 !important; animation: none !important; transition: none !important; }
}

.ed-top { padding-top: 0; }
.ed-lead { margin-top: 0; }

/* ---------------- HOME: Hero = gallery layout (B&W intro panel shrinks away, worn photos slide in) ---------------- */
.gl-copy { position: absolute; z-index: 1; left: calc(50vw + 20px); right: var(--pad); top: calc(80px + clamp(24px, 4vh, 48px)); will-change: transform, opacity; }
.gl-copy h1 { margin-top: 16px; font-family: var(--serif); font-weight: 400; font-size: clamp(40px, 4.4vw, 72px); line-height: 1.02; letter-spacing: -.015em; color: var(--ink); }
.gl-cta { display: flex; align-items: center; gap: 26px; margin-top: clamp(20px, 3vh, 32px); }
@media (max-width: 820px) {
  .gl-copy { left: calc(86vw + 12px); right: auto; width: calc(100vw - 36px); }
  .gl-copy h1 { font-size: 36px; }
  .gl-cta { gap: 18px; }
  .gl-cta .btn { height: 46px; padding: 0 20px; font-size: 12px; }
  .gl-hero .gl-img { height: 48vh; }
}
@media (prefers-reduced-motion: reduce) {
  .gl-copy { position: relative; left: 0; top: 0; padding: 100px var(--pad) 0; }
}
.gl-hero { margin-top: calc(-1 * var(--top-off, 0px)); }
.gl-hero .gl-big-a { top: calc(var(--top-off, 80px) + 28px); }
.gl-hero .gl-copy { top: calc(var(--top-off, 80px) + clamp(28px, 6vh, 64px)); }
@media (max-width: 820px) { .gl-hero .gl-big-a { top: calc(var(--top-off, 64px) + 18px); } }
.strip { position: relative; z-index: 71; }
@media (max-width: 820px) { .gl-hero .gl-copy { top: calc(var(--top-off, 64px) + 44px); } .gl-hero.min .gl-mark { opacity: 0; } }

/* Hero: B&W panel starts full width; load animation (photo settles, letters rise, words fade in) */
.gl-hero .gl-intro, .gl-hero .gl-bg { width: 100vw; }
.gl-hero .gl-bg { right: auto; }
.gl-hero .gl-bg img, .gl-hero .gl-big, .gl-hero .gl-words span { opacity: 0; }
.gl-hero.ready .gl-bg img { animation: glHeroZoom 2s cubic-bezier(.19, 1, .22, 1) both; }
.gl-hero.ready .gl-big { animation: glHeroRise 1.5s cubic-bezier(.19, 1, .22, 1) .35s both; }
.gl-hero.ready .gl-big-b { animation-delay: .55s; }
.gl-hero.ready .gl-words span { animation: glHeroWord 1.1s var(--ease) .85s both; }
.gl-hero.ready .gl-words .gw-2 { animation-delay: 1s; }
.gl-hero.ready .gl-words .gw-3 { animation-delay: 1.15s; }
@keyframes glHeroZoom { from { opacity: 0; transform: scale(1.14); } to { opacity: 1; transform: none; } }
@keyframes glHeroRise { from { opacity: 0; translate: 0 45%; } to { opacity: 1; translate: 0 0; } }
@keyframes glHeroWord { from { opacity: 0; translate: 0 14px; } to { opacity: 1; translate: 0 0; } }
@media (prefers-reduced-motion: reduce) {
  .gl-hero .gl-bg img, .gl-hero .gl-big, .gl-hero .gl-words span { opacity: 1; animation: none !important; }
}
.gl-hero .gl-intro { background: #fff; }

/* Studio caption centred on the full-screen photo */
.zm-cap { left: 50%; top: 50%; bottom: auto; right: auto; width: min(440px, calc(100% - 32px)); max-width: none; text-align: center; transform: translate(-50%, calc(-50% + 16px)); }
.zm.cap-on .zm-cap { transform: translate(-50%, -50%); }
@media (max-width: 820px) { .zm-cap { left: 50%; right: auto; } }
@media (prefers-reduced-motion: reduce) { .zm-cap { transform: translate(-50%, -50%); } }

/* Header: wishlist heart with count, signed-in dot on account icon; cart drawer "View cart" link */
.hdr-acct { position: relative; }
.hdr-acct.signed::after { content: ""; position: absolute; right: 6px; bottom: 7px; width: 6px; height: 6px; border-radius: 50%; background: #898989; box-shadow: 0 0 0 2px #fff; }
.dr-foot .dr-viewcart { display: block; width: max-content; margin: 16px auto 0; }

/* ================= BLACK & WHITE THEME additions ================= */
/* Hero: white base under the B&W photo, white space beside the photo row */
.gl-hero .gl-intro { background: #fff; }
/* Contact: inverted black block so it still stands apart without grey panels */
.cv { background: #000; color: #fff; }
.cv .eyebrow, .cv-clock, .cv-col .k { color: rgba(255, 255, 255, .6); }
.cv-clock [data-cv-status], .cv-clock [data-cv-time], .cv-title, .cv-col .v { color: #fff; }
.cv-dot { background: #fff; animation-name: cvPulseW; }
.cv.closed .cv-dot { background: rgba(255, 255, 255, .35); }
@keyframes cvPulseW { 0% { box-shadow: 0 0 0 0 rgba(255, 255, 255, .45); } 70%, 100% { box-shadow: 0 0 0 9px rgba(255, 255, 255, 0); } }
.cv-pic { background: #222; }
.cv-col { border-top-color: rgba(255, 255, 255, .25); }
.cv-badge { color: #fff; }
.cv-core { background: #fff; color: #000; }
/* signed-in dot on the account icon: black instead of green */
.hdr-acct.signed::after { background: #000; }
/* footer wordmark letters: solid black */
.fw-letter { color: #000; }

/* Shop by category: inverted black chapter */
.catlist, .zm + .catlist { background: #000; color: #fff; border-top-color: #000; }
.catlist-names .eyebrow { color: rgba(255, 255, 255, .55); }
.catlist-names a { color: rgba(255, 255, 255, .28); }
.catlist-names a:hover { color: rgba(255, 255, 255, .6); }
.catlist-names a.on, .catlist-names a.on .num { color: #fff; }
.catlist-names .num { color: rgba(255, 255, 255, .35); }
.catlist-names a sup { color: #fff; }
.catlist-imgs .media { background: #111; }

/* Split banner: black frame, continues the black category chapter above */
.split { position: relative; background: #000; gap: clamp(12px, 1.4vw, 20px); padding: 0 clamp(12px, 1.4vw, 20px) clamp(12px, 1.4vw, 20px); }
@media (max-width: 820px) { .split { gap: 8px; padding: 0 8px 8px; } }

/* Black and white theme: outlines replace the old grey panel fills */
.advice { border: 1px solid var(--line); }
.acc details[open] > summary { border-bottom: 1px solid var(--line); }
/* Split banner: deeper black band below the photos */
.split { padding-bottom: clamp(64px, 8vw, 128px); }
@media (max-width: 820px) { .split { padding-bottom: 48px; } }
/* Black chapter spacing: same depth above the category photo, between sections, and below the split */
.catlist-imgs { padding-top: clamp(64px, 8vw, 128px); padding-bottom: 0; }
.split { padding-top: clamp(64px, 8vw, 128px); }
@media (max-width: 820px) { .catlist-imgs { padding-top: 20px; } .split { padding-top: 48px; } }

/* ================= Shared: live studio status ================= */
.studio-clock { display: inline-flex; align-items: center; gap: 10px; font-size: 11px; letter-spacing: .2em; text-transform: uppercase; color: var(--muted); }
.studio-clock [data-sc-status], .studio-clock [data-sc-time] { color: var(--ink); }
.sc-sep { opacity: .4; }
.sc-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--ink); animation: scPulse 2.4s ease-out infinite; }
.studio-clock.closed .sc-dot { opacity: .35; animation: none; }
@keyframes scPulse { 0% { box-shadow: 0 0 0 0 rgba(0, 0, 0, .35); } 70%, 100% { box-shadow: 0 0 0 9px rgba(0, 0, 0, 0); } }
.nw { white-space: nowrap; }

/* ================= HOME: Contact (black editorial split) ================= */
.cv { padding: clamp(80px, 9vw, 140px) var(--pad); margin-top: 0; }
.cv-grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: clamp(40px, 7vw, 130px); align-items: center; }
.cv-left { max-width: 560px; }
.cv .cv-top { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding-bottom: 20px; border-bottom: 1px solid rgba(255, 255, 255, .2); }
.cv .studio-clock { color: rgba(255, 255, 255, .55); }
.cv .studio-clock [data-sc-status], .cv .studio-clock [data-sc-time] { color: #fff; }
.cv .sc-dot { background: #fff; animation-name: scPulseW; }
@keyframes scPulseW { 0% { box-shadow: 0 0 0 0 rgba(255, 255, 255, .45); } 70%, 100% { box-shadow: 0 0 0 9px rgba(255, 255, 255, 0); } }
.cv .cv-title { margin: clamp(36px, 5vw, 64px) 0 0; text-align: left; font-family: var(--serif); font-weight: 400; font-size: clamp(56px, 6.6vw, 112px); line-height: .95; letter-spacing: -.02em; color: #fff; }
.cv-title em { font-style: italic; }
.cv-lead { margin-top: 28px; max-width: 460px; font-size: 16px; line-height: 1.65; color: rgba(255, 255, 255, .68); }
.cv-cta { display: flex; align-items: center; gap: 28px; flex-wrap: wrap; margin-top: 34px; }
.cv .cv-btn { background: #fff; color: #000; }
.cv .cv-btn:hover { background: rgba(255, 255, 255, .85); }
.cv .ulink { color: #fff; }
.cv-list { margin: clamp(40px, 5vw, 60px) 0 0; }
.cv-list > div { display: grid; grid-template-columns: 90px minmax(0, 1fr); gap: 16px; align-items: baseline; padding: 15px 0; border-top: 1px solid rgba(255, 255, 255, .16); }
.cv-list > div:last-child { border-bottom: 1px solid rgba(255, 255, 255, .16); }
.cv-list dt { font-size: 11px; letter-spacing: .22em; text-transform: uppercase; color: rgba(255, 255, 255, .5); }
.cv-list dd { margin: 0; font-family: var(--serif); font-size: 21px; line-height: 1.3; color: #fff; }
.cv-list a { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.cv-list a svg { width: 15px; height: 15px; flex: none; opacity: .35; transform: translateX(-6px); transition: transform .35s var(--ease), opacity .35s var(--ease); }
.cv-list a:hover svg { opacity: 1; transform: none; }
.cv-media { position: relative; margin: 0; }
.cv-photo { aspect-ratio: 4 / 5; overflow: hidden; background: #111; clip-path: inset(100% 0 0 0); transition: clip-path 1.4s cubic-bezier(.77, 0, .18, 1); }
.cv-photo img { width: 100%; height: 100%; object-fit: cover; object-position: 55% 50%; transform: scale(1.15); transition: transform 2.2s cubic-bezier(.19, 1, .22, 1); }
.cv.in .cv-photo { clip-path: inset(0 0 0 0); }
.cv.in .cv-photo img { transform: none; }
.cv-media figcaption { margin-top: 14px; font-size: 11px; letter-spacing: .22em; text-transform: uppercase; color: rgba(255, 255, 255, .5); }
.cv-media .cv-badge { position: absolute; left: 0; top: 50%; transform: translate(-50%, -50%); width: clamp(120px, 10vw, 156px); }
.cv-left > * { opacity: 0; transform: translateY(18px); transition: opacity .9s var(--ease), transform 1s cubic-bezier(.19, 1, .22, 1); }
.cv.in .cv-left > * { opacity: 1; transform: none; }
.cv.in .cv-left > :nth-child(2) { transition-delay: .1s; } .cv.in .cv-left > :nth-child(3) { transition-delay: .2s; } .cv.in .cv-left > :nth-child(4) { transition-delay: .3s; } .cv.in .cv-left > :nth-child(5) { transition-delay: .4s; }
@media (max-width: 900px) {
  .cv { padding: 64px 18px; }
  .cv-grid { grid-template-columns: 1fr; gap: 48px; }
  .cv-media { order: -1; }
  .cv-media .cv-badge { left: auto; right: 16px; top: auto; bottom: 46px; transform: none; width: 112px; }
  .cv .cv-top { flex-wrap: wrap; }
  .cv-list > div { grid-template-columns: 70px minmax(0, 1fr); }
  .cv-list dd { font-size: 18px; }
}
@media (prefers-reduced-motion: reduce) { .cv-photo, .cv-photo img, .cv-left > * { clip-path: none !important; transform: none !important; opacity: 1 !important; transition: none !important; } }

/* ================= CONTACT PAGE ================= */
.cp-in { opacity: 0; transform: translateY(20px); transition: opacity .9s var(--ease), transform 1.1s cubic-bezier(.19, 1, .22, 1); transition-delay: calc(var(--d, 0) * 110ms + .1s); }
.cp.on .cp-in { opacity: 1; transform: none; }
.cp-hero { padding: clamp(40px, 5vw, 72px) var(--pad) 0; }
.cp-hero .crumbs { justify-content: flex-start; }
.cp-hero-grid { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 4fr); gap: clamp(32px, 6vw, 110px); align-items: end; margin-top: clamp(40px, 6vw, 88px); }
.cp-title { font-family: var(--serif); font-weight: 400; font-size: clamp(60px, 8.6vw, 150px); line-height: .92; letter-spacing: -.025em; }
.cp-title em, .cp-form h2 em, .cp-appt h2 em { font-style: italic; }
.cp-hero-side p { margin-top: 22px; font-size: 16px; line-height: 1.65; color: var(--muted); max-width: 400px; }
.cp-banner { margin: clamp(48px, 6vw, 88px) 0 0; height: clamp(320px, 52vh, 560px); overflow: hidden; }
.cp-banner img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 45%; transform: scale(1.12); transition: transform 2.4s cubic-bezier(.19, 1, .22, 1) .3s; }
.cp.on .cp-banner img { transform: none; }
.cp-ways { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); padding: clamp(72px, 8vw, 120px) var(--pad); }
.cp-way { position: relative; display: flex; flex-direction: column; align-items: flex-start; padding: 0 clamp(20px, 3vw, 48px); border-left: 1px solid var(--line); }
.cp-way:first-child { padding-left: 0; border-left: 0; }
.cp-no { font-size: 11px; letter-spacing: .14em; color: var(--muted); margin-bottom: 26px; }
.cp-val { margin-top: 14px; font-family: var(--serif); font-size: clamp(26px, 2.4vw, 36px); line-height: 1.15; }
.cp-note { margin: 14px 0 22px; font-size: 14px; line-height: 1.55; color: var(--muted); max-width: 300px; }
.cp-way .ulink { margin-top: auto; }
.cp-form { background: #000; color: #fff; padding: clamp(96px, 11vw, 168px) var(--pad); scroll-margin-top: 40px; }
.cp-form-wrap { max-width: 640px; margin: 0 auto; text-align: center; }
.cp-form .eyebrow { color: rgba(255, 255, 255, .5); }
.cp-form h2 { margin-top: 16px; font-family: var(--serif); font-weight: 400; font-size: clamp(44px, 4.6vw, 72px); line-height: 1; letter-spacing: -.02em; color: #fff; }
.cp-form h2 em { font-style: italic; }
.cp-form .cform { max-width: none; gap: 34px; margin-top: clamp(48px, 5vw, 72px); text-align: left; }
.cp-form .cform label { color: rgba(255, 255, 255, .5); }
.cp-form .cform input, .cp-form .cform textarea, .cp-form .cform select { width: 100%; color: #fff; background: transparent; border: 0; border-bottom: 1px solid rgba(255, 255, 255, .25); border-radius: 0; font: inherit; font-size: 17px; letter-spacing: 0; text-transform: none; padding: 10px 0; outline: 0; }
.cp-form .cform select { -webkit-appearance: none; appearance: none; cursor: pointer; padding-right: 24px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2 4l4 4 4-4' fill='none' stroke='%23fff' stroke-width='1.1'/%3E%3C/svg%3E") no-repeat right 2px center / 12px; }
.cp-form .cform select option { color: #000; }
.cp-form .cform textarea { resize: none; }
.cp-form .cform input:focus, .cp-form .cform textarea:focus, .cp-form .cform select:focus { border-bottom-color: #fff; }
.cp-form .cform .err { color: #fff; opacity: .7; }
.cp-row { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; }
.cp-send { justify-self: center; margin-top: 8px; display: inline-flex; align-items: center; gap: 12px; padding: 0 0 8px; background: none; border: 0; border-bottom: 1px solid #fff; color: #fff; font: inherit; font-size: 12px; letter-spacing: .22em; text-transform: uppercase; cursor: pointer; }
.cp-send svg { width: 14px; height: 14px; transition: transform .35s var(--ease); }
.cp-send:hover svg { transform: translateX(5px); }
.cp-form .cthanks { margin: 48px auto 0; }
.cp-form .cthanks h3 { color: #fff; font-family: var(--serif); font-weight: 400; }
.cp-form .cthanks p { color: rgba(255, 255, 255, .6); }
.cp-appt { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(40px, 7vw, 120px); align-items: center; padding: clamp(80px, 9vw, 140px) var(--pad); scroll-margin-top: 40px; }
.cp-appt-pic { margin: 0; aspect-ratio: 5 / 6; overflow: hidden; }
.cp-appt-pic img { width: 100%; height: 100%; object-fit: cover; }
.cp-appt h2 { margin-top: 18px; font-family: var(--serif); font-weight: 400; font-size: clamp(46px, 4.8vw, 80px); line-height: .98; letter-spacing: -.02em; }
.cp-appt-lead { margin-top: 22px; max-width: 420px; font-size: 16px; line-height: 1.65; color: var(--muted); }
.cp-appt-list { list-style: none; margin: 36px 0 0; padding: 0; border-bottom: 1px solid var(--line); }
.cp-appt-list button { width: 100%; display: grid; grid-template-columns: minmax(0, 1fr) auto 28px; align-items: center; gap: 16px; padding: 20px 0; border: 0; border-top: 1px solid var(--line); background: none; color: var(--ink); text-align: left; cursor: pointer; font: inherit; }
.cp-al-t { font-family: var(--serif); font-size: clamp(22px, 2vw, 30px); transition: transform .45s cubic-bezier(.19, 1, .22, 1); }
.cp-al-m { font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); }
.cp-appt-list svg { width: 28px; height: 28px; padding: 7px; border-radius: 50%; background: var(--ink); color: #fff; transform: scale(0); transition: transform .4s cubic-bezier(.19, 1, .22, 1); }
.cp-appt-list button:hover .cp-al-t, .cp-appt-list button:focus-visible .cp-al-t { transform: translateX(10px); }
.cp-appt-list button:hover svg, .cp-appt-list button:focus-visible svg { transform: scale(1); }
.cp-appt-note { margin-top: 16px; font-size: 13px; color: var(--muted); }
.cp-faq { padding: 0 var(--pad) clamp(90px, 10vw, 150px); }
.cp-faq-head { display: flex; align-items: flex-end; gap: 24px; padding-bottom: 28px; border-bottom: 1px solid var(--ink); }
.cp-faq-head h2 { margin-top: 14px; font-family: var(--serif); font-weight: 400; font-size: clamp(36px, 3.4vw, 54px); line-height: 1; }
.cp-faq-head .ulink { margin-left: auto; }
.cp-faq-list { display: grid; grid-template-columns: 1fr 1fr; column-gap: clamp(32px, 5vw, 80px); }
.cp-faq-list a { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 22px 0; border-bottom: 1px solid var(--line); font-family: var(--serif); font-size: clamp(20px, 1.7vw, 25px); transition: padding .35s var(--ease); }
.cp-faq-list a svg { width: 16px; height: 16px; flex: none; opacity: .4; transition: transform .35s var(--ease), opacity .35s; }
.cp-faq-list a:hover { padding-left: 8px; }
.cp-faq-list a:hover svg { opacity: 1; transform: translateX(4px); }
@media (max-width: 900px) {
  .cp-hero-grid, .cp-form-grid, .cp-appt { grid-template-columns: 1fr; }
  .cp-title { font-size: clamp(52px, 15vw, 72px); }
  .cp-banner { height: 300px; }
  .cp-ways { grid-template-columns: 1fr; gap: 44px; padding: 64px 18px; }
  .cp-way { padding: 0; border-left: 0; }
  .cp-way + .cp-way { padding-top: 40px; border-top: 1px solid var(--line); }
  .cp-row { grid-template-columns: 1fr; }
  .cp-faq-list { grid-template-columns: 1fr; }
  .cp-faq-head { flex-wrap: wrap; }
}
@media (prefers-reduced-motion: reduce) { .cp-in, .cp-banner img { opacity: 1 !important; transform: none !important; transition: none !important; } }

/* Contact: ways to reach us as full-width index rows */
.cw { padding: clamp(72px, 8vw, 128px) var(--pad); }
.cw-row { position: relative; display: grid; grid-template-columns: minmax(90px, 1fr) minmax(0, 5fr) minmax(0, 2fr) 44px; align-items: center; gap: 24px; padding: clamp(26px, 3vw, 40px) 0; border-top: 1px solid var(--line); color: var(--ink); overflow: hidden; }
.cw-row:last-child { border-bottom: 1px solid var(--line); }
.cw-row::after { content: ""; position: absolute; left: 0; bottom: -1px; height: 1px; width: 100%; background: var(--ink); transform: scaleX(0); transform-origin: left; transition: transform .7s cubic-bezier(.19, 1, .22, 1); }
.cw-k { font-size: 11px; letter-spacing: .24em; text-transform: uppercase; color: var(--muted); }
.cw-v { font-family: var(--serif); font-size: clamp(34px, 4.6vw, 72px); line-height: 1; letter-spacing: -.015em; white-space: nowrap; transition: transform .6s cubic-bezier(.19, 1, .22, 1); }
.cw-n { font-size: 14px; color: var(--muted); text-align: right; }
.cw-go { width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; background: var(--ink); color: #fff; transform: scale(0); transition: transform .5s cubic-bezier(.19, 1, .22, 1); }
.cw-go svg { width: 16px; height: 16px; }
.cw-row:hover::after, .cw-row:focus-visible::after { transform: scaleX(1); }
.cw-row:hover .cw-v, .cw-row:focus-visible .cw-v { transform: translateX(14px); }
.cw-row:hover .cw-go, .cw-row:focus-visible .cw-go { transform: scale(1); }
@media (max-width: 900px) {
  .cw { padding: 56px 18px; }
  .cw-row { grid-template-columns: minmax(0, 1fr) 36px; gap: 8px 16px; padding: 24px 0; }
  .cw-k { grid-column: 1 / -1; }
  .cw-v { font-size: clamp(28px, 8vw, 40px); white-space: normal; }
  .cw-n { grid-column: 1; text-align: left; }
  .cw-go { grid-column: 2; grid-row: 2; width: 36px; height: 36px; transform: scale(1); }
}

/* Product page: metal switch swaps the packshot */
.pdp-pack { position: relative; }
.pdp-pack .pdp-white { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transition: opacity .6s var(--ease); }
.pdp-imgs.is-white .pdp-white { opacity: 1; }
.pdp-worn { position: relative; }

/* ================= ABOUT PAGE ================= */
.ab em { font-style: italic; }
.ab-in { display: inline-block; opacity: 0; transform: translateY(24px); transition: opacity 1s var(--ease), transform 1.2s cubic-bezier(.19, 1, .22, 1); transition-delay: calc(var(--d, 0) * 120ms + .1s); }
.ab.on .ab-in { opacity: 1; transform: none; }
.ab-hero-top { padding: clamp(56px, 7vw, 110px) var(--pad) clamp(48px, 6vw, 88px); }
.ab-title { margin-top: 22px; font-family: var(--serif); font-weight: 400; font-size: clamp(60px, 9.4vw, 168px); line-height: .9; letter-spacing: -.03em; }
.ab-line { display: block; overflow: hidden; padding-bottom: .06em; }
.ab-line:nth-child(2) { padding-left: clamp(40px, 12vw, 220px); }
.ab-meta { display: flex; gap: clamp(28px, 6vw, 96px); margin: clamp(40px, 5vw, 72px) 0 0; padding-top: 22px; border-top: 1px solid var(--line); }
.ab-meta dt { font-size: 11px; letter-spacing: .22em; text-transform: uppercase; color: var(--muted); }
.ab-meta dd { margin: 8px 0 0; font-family: var(--serif); font-size: clamp(20px, 1.8vw, 26px); }
.ab-wide { height: clamp(420px, 88vh, 860px); }
.ab-wide-in { --p: 0; margin: 0; height: 100%; overflow: hidden; clip-path: inset(0 calc((1 - var(--p)) * var(--pad-x, 12%)) round 0); }
.ab-wide-in { clip-path: inset(0 calc((1 - var(--p)) * 12%)); }
.ab-wide-in img { width: 100%; height: 100%; object-fit: cover; transform: scale(calc(1.12 - var(--p) * .12)); }
.ab-manifesto { padding: clamp(110px, 13vw, 200px) var(--pad); max-width: 1320px; }
.ab-words { margin-top: 26px; font-family: var(--serif); font-size: clamp(32px, 3.9vw, 60px); line-height: 1.12; letter-spacing: -.01em; }
.ab-words span { color: #cfcfcf; transition: color .4s; }
.ab-words span.lit { color: var(--ink); }
.ab-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 0 var(--pad); border-top: 1px solid var(--ink); border-bottom: 1px solid var(--line); }
.ab-stats > div { padding: clamp(32px, 4vw, 56px) clamp(16px, 2vw, 32px) clamp(32px, 4vw, 56px) 0; }
.ab-stats > div + div { padding-left: clamp(16px, 2vw, 32px); border-left: 1px solid var(--line); }
.ab-num, .ab-unit { font-family: var(--serif); font-size: clamp(56px, 6vw, 104px); line-height: 1; letter-spacing: -.02em; font-variant-numeric: lining-nums tabular-nums; }
.ab-stats p { margin-top: 14px; font-size: 13px; color: var(--muted); max-width: 200px; }
.ab-process { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(40px, 7vw, 120px); padding: clamp(110px, 13vw, 200px) var(--pad); }
.ab-proc-media { position: sticky; top: 110px; align-self: start; height: calc(100vh - 150px); max-height: 820px; }
.ab-proc-frame { position: relative; height: calc(100% - 40px); overflow: hidden; background: #f2f2f2; }
.ab-proc-frame img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transform: scale(1.06); transition: opacity .9s var(--ease), transform 1.6s cubic-bezier(.19, 1, .22, 1); }
.ab-proc-frame img.on { opacity: 1; transform: none; }
.ab-proc-count { margin-top: 16px; font-size: 12px; letter-spacing: .2em; color: var(--muted); }
.ab-proc-count span { color: var(--ink); }
.ab-proc-head h2 { margin-top: 18px; font-family: var(--serif); font-weight: 400; font-size: clamp(48px, 5vw, 84px); line-height: .96; letter-spacing: -.02em; }
.ab-proc-head { padding-bottom: 10vh; }
.ab-step { min-height: 62vh; display: flex; flex-direction: column; justify-content: center; border-top: 1px solid var(--line); opacity: .28; transition: opacity .6s var(--ease); }
.ab-step.on { opacity: 1; }
.ab-step-no { font-size: 12px; letter-spacing: .2em; color: var(--muted); }
.ab-step h3 { margin-top: 18px; font-family: var(--serif); font-weight: 400; font-size: clamp(40px, 4vw, 64px); line-height: 1; }
.ab-step p { margin-top: 18px; max-width: 420px; font-size: 16px; line-height: 1.65; color: var(--muted); }
.ab-step-img { display: none; }
.ab-values { background: #000; color: #fff; padding: clamp(110px, 12vw, 180px) var(--pad); display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(40px, 7vw, 120px); }
.ab-values .eyebrow { color: rgba(255, 255, 255, .5); }
.ab-values h2 { margin-top: 18px; font-family: var(--serif); font-weight: 400; font-size: clamp(42px, 4.4vw, 72px); line-height: 1; letter-spacing: -.02em; color: #fff; }
.ab-vlist { list-style: none; margin: 0; padding: 0; border-top: 1px solid rgba(255, 255, 255, .22); }
.ab-vlist li { display: grid; grid-template-columns: 56px minmax(0, 1fr) minmax(0, 1fr); gap: 24px; align-items: baseline; padding: clamp(28px, 3vw, 40px) 0; border-bottom: 1px solid rgba(255, 255, 255, .22); }
.ab-vlist span { font-size: 12px; letter-spacing: .2em; color: rgba(255, 255, 255, .45); }
.ab-vlist h3 { font-family: var(--serif); font-weight: 400; font-size: clamp(26px, 2.4vw, 38px); line-height: 1.1; color: #fff; }
.ab-vlist p { font-size: 15px; line-height: 1.6; color: rgba(255, 255, 255, .62); }
.ab-founder { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(40px, 8vw, 140px); align-items: center; padding: clamp(110px, 12vw, 180px) var(--pad); }
.ab-founder-pic { margin: 0; aspect-ratio: 4 / 5; overflow: hidden; }
.ab-founder-pic img { width: 100%; height: 100%; object-fit: cover; }
.ab-founder blockquote { margin: 26px 0 0; font-family: var(--serif); font-size: clamp(34px, 3.6vw, 58px); line-height: 1.12; letter-spacing: -.01em; }
.ab-sign { margin-top: 30px; font-size: 12px; letter-spacing: .2em; text-transform: uppercase; color: var(--muted); }
.ab-sign a { color: var(--ink); border-bottom: 1px solid currentColor; }
.ab-next { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; padding: 0 0 4px; }
.ab-card { position: relative; display: block; overflow: hidden; color: #fff; }
.ab-card figure { margin: 0; aspect-ratio: 4 / 3; overflow: hidden; }
.ab-card img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 30%; transition: transform 1.4s cubic-bezier(.19, 1, .22, 1); }
.ab-card::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to top, rgba(0, 0, 0, .45), rgba(0, 0, 0, 0) 45%); }
.ab-card-t { position: absolute; left: clamp(20px, 3vw, 44px); bottom: clamp(20px, 3vw, 40px); z-index: 1; display: inline-flex; align-items: center; gap: 14px; font-family: var(--serif); font-size: clamp(28px, 3vw, 46px); }
.ab-card-t svg { width: 22px; height: 22px; transition: transform .5s cubic-bezier(.19, 1, .22, 1); }
.ab-card:hover img { transform: scale(1.05); }
.ab-card:hover .ab-card-t svg { transform: translateX(8px); }
@media (max-width: 900px) {
  .ab-line:nth-child(2) { padding-left: 0; }
  .ab-meta { flex-wrap: wrap; gap: 20px 32px; }
  .ab-wide { height: 60vh; }
  .ab-stats { grid-template-columns: 1fr 1fr; margin: 0 18px; }
  .ab-stats > div:nth-child(3) { padding-left: 0; border-left: 0; }
  .ab-stats > div:nth-child(n+3) { border-top: 1px solid var(--line); }
  .ab-process, .ab-values, .ab-founder { grid-template-columns: 1fr; }
  .ab-proc-media { display: none; }
  .ab-proc-head { padding-bottom: 32px; }
  .ab-step { min-height: 0; padding: 32px 0; opacity: 1; }
  .ab-step-img { display: block; margin-top: 24px; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
  .ab-vlist li { grid-template-columns: 40px minmax(0, 1fr); }
  .ab-vlist p { grid-column: 2; }
  .ab-next { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) { .ab-in { opacity: 1 !important; transform: none !important; transition: none !important; } .ab-wide-in { clip-path: none; } .ab-wide-in img { transform: none; } }

/* About: Works-style chapters gallery (ref: rick-brown.framer.website, Works) */
.ab-works { padding: clamp(110px, 12vw, 180px) var(--pad) clamp(90px, 10vw, 150px); }
.ab-shead { display: grid; grid-template-columns: 1fr 2fr 1fr; gap: 24px; align-items: start; margin-bottom: clamp(72px, 9vw, 130px); }
.ab-slabel { font-size: 12px; letter-spacing: .22em; text-transform: uppercase; color: var(--muted); padding-top: .9em; }
.ab-shead h2 { font-family: var(--serif); font-weight: 400; font-size: clamp(56px, 7vw, 120px); line-height: .9; letter-spacing: -.025em; }
.ab-shead h2 em { font-style: italic; }
.ab-sintro { padding-top: .9em; }
.ab-sintro p { font-size: 15px; line-height: 1.55; max-width: 280px; }
.ab-sintro .ulink { display: inline-block; margin-top: 34px; }
.ab-wgrid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: 24px; row-gap: clamp(64px, 7vw, 110px); align-items: start; }
.ab-wcard { display: block; color: var(--ink); }
.ab-w-a { grid-column: 1 / span 4; grid-row: 1; }
.ab-w-b { grid-column: 6 / span 7; grid-row: 1; margin-top: clamp(60px, 7vw, 104px); }
.ab-w-c { grid-column: 1 / span 6; grid-row: 2; }
.ab-w-d { grid-column: 8 / span 5; grid-row: 2; margin-top: clamp(60px, 7vw, 104px); }
.ab-w-e { grid-column: 1 / span 7; grid-row: 3; margin-top: clamp(60px, 7vw, 104px); }
.ab-w-f { grid-column: 9 / span 4; grid-row: 3; }
.ab-wimg { position: relative; margin: 0; overflow: hidden; background: #f2f2f2; }
.ab-w-a .ab-wimg, .ab-w-f .ab-wimg { aspect-ratio: 7 / 10; }
.ab-w-b .ab-wimg, .ab-w-e .ab-wimg { aspect-ratio: 9 / 10; }
.ab-w-c .ab-wimg { aspect-ratio: 16 / 15; }
.ab-w-d .ab-wimg { aspect-ratio: 5 / 6; }
.ab-wimg img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: opacity .6s var(--ease), transform 1.2s cubic-bezier(.19, 1, .22, 1); }
.ab-wimg .ab-whover { opacity: 0; transform: scale(1.06); }
.ab-wimg::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 4px; background: var(--ink); transform: scaleX(0); transform-origin: left; transition: transform .7s cubic-bezier(.19, 1, .22, 1); z-index: 1; }
.ab-wcard:hover .ab-whover, .ab-wcard:focus-visible .ab-whover { opacity: 1; transform: none; }
.ab-wcard:hover .ab-wimg::after, .ab-wcard:focus-visible .ab-wimg::after { transform: scaleX(1); }
.ab-wcap { display: flex; align-items: center; gap: 10px; margin-top: 14px; font-size: 13px; letter-spacing: .14em; text-transform: uppercase; }
.ab-wsq { width: 10px; height: 10px; background: var(--ink); flex: none; transition: transform .5s cubic-bezier(.19, 1, .22, 1); }
.ab-wcard:hover .ab-wsq { transform: rotate(45deg); }
.ab-wy { margin-left: auto; color: var(--muted); letter-spacing: .1em; }
.ab-wcard.rv { opacity: 1; transform: none; }
.ab-wcard.rv .ab-wimg { clip-path: inset(100% 0 0 0); transition: clip-path 1.3s cubic-bezier(.77, 0, .18, 1); }
.ab-wcard.rv.in .ab-wimg { clip-path: inset(0 0 0 0); }
.ab-wcard.rv .ab-wcap { opacity: 0; transform: translateY(10px); transition: opacity .8s var(--ease) .5s, transform .8s var(--ease) .5s; }
.ab-wcard.rv.in .ab-wcap { opacity: 1; transform: none; }
@media (max-width: 900px) {
  .ab-shead { grid-template-columns: 1fr; gap: 18px; }
  .ab-slabel, .ab-sintro { padding-top: 0; }
  .ab-wgrid { grid-template-columns: 1fr; row-gap: 48px; }
  .ab-wcard { grid-column: 1 !important; grid-row: auto !important; margin-top: 0 !important; }
  .ab-wcard:nth-child(even) { width: 82%; justify-self: end; }
  .ab-wimg { aspect-ratio: 4 / 5 !important; }
}
@media (prefers-reduced-motion: reduce) { .ab-wcard.rv .ab-wimg { clip-path: none; } .ab-wcard.rv .ab-wcap { opacity: 1; transform: none; } }
.pdp-imgs.is-white .pdp-worn { display: none; }
@media (min-width: 901px) { .pdp-imgs.is-white { position: sticky; top: 76px; align-self: start; } }

/* ================= HOME: Contact v2 (header + wide photo + info row) ================= */
.cv2 { padding: clamp(100px, 11vw, 170px) var(--pad) clamp(80px, 9vw, 130px); }
.cv2-head { display: grid; grid-template-columns: 1fr 2fr 1fr; gap: 24px; align-items: start; }
.cv2-label { display: flex; flex-direction: column; gap: 18px; padding-top: .9em; }
.cv2 .eyebrow { color: rgba(255, 255, 255, .5); }
.cv2 .studio-clock { color: rgba(255, 255, 255, .5); flex-wrap: wrap; row-gap: 6px; }
.cv2 .studio-clock [data-sc-status], .cv2 .studio-clock [data-sc-time] { color: #fff; }
.cv2 .sc-dot { background: #fff; animation-name: scPulseW; }
.cv2-title { font-family: var(--serif); font-weight: 400; font-size: clamp(60px, 7.6vw, 132px); line-height: .9; letter-spacing: -.025em; color: #fff; }
.cv2-title em { font-style: italic; }
.cv2-intro { padding-top: .9em; }
.cv2-intro p { font-size: 15px; line-height: 1.6; color: rgba(255, 255, 255, .68); max-width: 290px; }
.cv2-intro .ulink { display: inline-block; margin-top: 30px; color: #fff; }
.cv2-media { position: relative; margin: clamp(64px, 8vw, 120px) 0 0; }
.cv2-photo { height: clamp(360px, 62vh, 640px); overflow: hidden; background: #111; clip-path: inset(18% 8% 18% 8%); transition: clip-path 1.6s cubic-bezier(.77, 0, .18, 1); }
.cv2-photo img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 60%; transform: scale(1.18); transition: transform 2.4s cubic-bezier(.19, 1, .22, 1); }
.cv2.in .cv2-photo { clip-path: inset(0 0 0 0); }
.cv2.in .cv2-photo img { transform: none; }
.cv2-media .cv-badge { position: absolute; right: clamp(24px, 6vw, 96px); top: 0; left: auto; transform: translateY(-50%); width: clamp(120px, 10vw, 156px); z-index: 2; }
.cv2-info { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; margin: clamp(40px, 5vw, 64px) 0 0; }
.cv2-info > div { padding-top: 18px; border-top: 1px solid rgba(255, 255, 255, .22); }
.cv2-info dt { font-size: 11px; letter-spacing: .22em; text-transform: uppercase; color: rgba(255, 255, 255, .5); }
.cv2-info dd { margin: 12px 0 0; font-family: var(--serif); font-size: clamp(19px, 1.6vw, 24px); line-height: 1.3; color: #fff; }
.cv2-info a { display: inline-flex; align-items: center; gap: 10px; }
.cv2-info a svg { width: 13px; height: 13px; opacity: .4; transition: transform .4s var(--ease), opacity .4s; }
.cv2-info a:hover svg { opacity: 1; transform: translate(3px, -3px); }
.cv2 .cv2-head > *, .cv2 .cv2-info > div { opacity: 0; transform: translateY(18px); transition: opacity .9s var(--ease), transform 1s cubic-bezier(.19, 1, .22, 1); }
.cv2.in .cv2-head > *, .cv2.in .cv2-info > div { opacity: 1; transform: none; }
.cv2.in .cv2-head > :nth-child(2) { transition-delay: .1s; } .cv2.in .cv2-head > :nth-child(3) { transition-delay: .2s; }
.cv2.in .cv2-info > :nth-child(1) { transition-delay: .6s; } .cv2.in .cv2-info > :nth-child(2) { transition-delay: .7s; } .cv2.in .cv2-info > :nth-child(3) { transition-delay: .8s; } .cv2.in .cv2-info > :nth-child(4) { transition-delay: .9s; }
@media (max-width: 900px) {
  .cv2 { padding: 72px 18px 64px; }
  .cv2-head { grid-template-columns: 1fr; gap: 20px; }
  .cv2-label, .cv2-intro { padding-top: 0; }
  .cv2-photo { height: 340px; }
  .cv2-media .cv-badge { width: 104px; right: 16px; }
  .cv2-info { grid-template-columns: 1fr 1fr; row-gap: 28px; }
}
@media (prefers-reduced-motion: reduce) { .cv2-photo, .cv2-photo img, .cv2 .cv2-head > *, .cv2 .cv2-info > div { clip-path: none !important; transform: none !important; opacity: 1 !important; transition: none !important; } }
.cv2-media .cv-badge { background: #000; border-radius: 50%; }


/* ===== mare-jewellery-newsletter-popup.css ===== */
/* Maré newsletter popup. Self-contained (falls back if site.css variables are missing). Prefix .nl- */
.nl-root {
  --nl-ink: var(--ink, #000); --nl-muted: var(--muted, #7a7a7a); --nl-line: var(--line, #e7e7e7); --nl-panel: var(--panel, #fff);
  --nl-serif: var(--serif, "Cormorant Garamond", Georgia, serif); --nl-sans: var(--sans, "Outfit", "Helvetica Neue", Arial, sans-serif);
  --nl-ease: var(--ease, cubic-bezier(.22, .61, .36, 1));
  position: fixed; inset: 0; z-index: 300; display: grid; place-items: center; padding: 24px;
  font: 400 16px/1.6 var(--nl-sans); color: var(--nl-ink);
}
.nl-root[hidden] { display: none !important; }
.nl-root *, .nl-root *::before, .nl-root *::after { box-sizing: border-box; }
.nl-back { position: absolute; inset: 0; background: rgba(0, 0, 0, 0.38); opacity: 0; transition: opacity .4s var(--nl-ease); }
.nl-box {
  position: relative; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.08fr); width: min(880px, 100%); max-height: calc(100vh - 48px);
  background: #fff; overflow: hidden; outline: none; opacity: 0; transform: translateY(18px) scale(.985);
  transition: opacity .45s var(--nl-ease), transform .55s var(--nl-ease); box-shadow: 0 30px 80px rgba(0, 0, 0, 0.18);
}
.nl-root.on .nl-back { opacity: 1; }
.nl-root.on .nl-box { opacity: 1; transform: none; }
.nl-pic { position: relative; min-height: 520px; background: var(--nl-panel); overflow: hidden; }
.nl-pic img { position: absolute; inset: 0; display: block; width: 100%; height: 100%; object-fit: cover; object-position: 50% 25%; transform: scale(1.06); transition: transform 1.4s var(--nl-ease); }
.nl-root.on .nl-pic img { transform: none; }
.nl-pic.nl-ph img { opacity: 0; }
.nl-copy { display: flex; flex-direction: column; justify-content: center; padding: 56px clamp(28px, 4vw, 56px) 44px; overflow-y: auto; }
.nl-step { animation: nl-in .6s var(--nl-ease) both; }
@keyframes nl-in { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
.nl-x { position: absolute; top: 12px; right: 12px; z-index: 2; width: 42px; height: 42px; display: grid; place-items: center; border: 0; border-radius: 50%; background: #fff; color: var(--nl-ink); cursor: pointer; transition: background .25s, color .25s; }
.nl-x:hover { background: var(--nl-ink); color: #fff; }
.nl-eye { margin: 0; font-size: 12px; letter-spacing: .28em; text-transform: uppercase; color: var(--nl-muted); }
.nl-title { margin: 16px 0 0; font-family: var(--nl-serif); font-weight: 400; font-size: clamp(38px, 3.6vw, 50px); line-height: 1.02; letter-spacing: -.01em; outline: none; text-wrap: balance; }
.nl-desc { margin: 16px 0 0; color: var(--nl-muted); font-size: 15px; }
.nl-mail { color: var(--nl-ink); word-break: break-all; }
.nl-form { margin-top: 30px; }
.nl-lab { display: block; font-size: 12px; letter-spacing: .2em; text-transform: uppercase; color: var(--nl-muted); }
.nl-in { display: block; width: 100%; margin-top: 10px; padding: 0 0 12px; border: 0; border-bottom: 1px solid #d8d8d8; border-radius: 0; background: transparent; font: inherit; font-size: 17px; color: var(--nl-ink); outline: none; transition: border-color .25s; }
.nl-in::placeholder { color: #afafaf; }
.nl-in:focus { border-bottom-color: var(--nl-ink); }
.nl-in[aria-invalid="true"] { border-bottom-color: #a2412e; }
.nl-err { min-height: 20px; margin: 8px 0 0; font-size: 13px; color: #a2412e; }
.nl-btn { display: flex; align-items: center; justify-content: center; width: 100%; height: 52px; margin-top: 10px; padding: 0 28px; border: 0; background: var(--nl-ink); color: #fff; font: inherit; font-size: 13px; letter-spacing: .16em; text-transform: uppercase; cursor: pointer; transition: background .25s; }
.nl-btn:hover { background: #000; }
.nl-fine { margin: 16px 0 0; font-size: 12px; line-height: 1.55; color: var(--nl-muted); }
.nl-fine a { color: var(--nl-ink); border-bottom: 1px solid currentColor; text-decoration: none; }
.nl-skip { display: inline-block; margin-top: 18px; padding: 0 0 2px; border: 0; border-bottom: 1px solid transparent; background: none; font: inherit; font-size: 12px; letter-spacing: .16em; text-transform: uppercase; color: var(--nl-muted); cursor: pointer; transition: color .25s, border-color .25s; }
.nl-skip:hover { color: var(--nl-ink); border-color: currentColor; }
.nl-code { display: flex; align-items: stretch; margin-top: 28px; border: 1px solid var(--nl-ink); }
.nl-code-v { flex: 1 1 auto; min-width: 0; display: flex; align-items: center; padding: 0 18px; height: 58px; font-family: var(--nl-serif); font-size: 26px; letter-spacing: .1em; font-variant-numeric: lining-nums; white-space: nowrap; user-select: all; }
.nl-copy-btn { flex: none; min-width: 116px; padding: 0 20px; border: 0; border-left: 1px solid var(--nl-ink); background: #fff; color: var(--nl-ink); font: inherit; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; cursor: pointer; transition: background .25s, color .25s; }
.nl-copy-btn:hover, .nl-copy-btn.on { background: var(--nl-ink); color: #fff; }
.nl-status { min-height: 20px; margin: 10px 0 0; font-size: 13px; color: var(--nl-muted); }
.nl-done { margin-top: 18px; }
.nl-root .nl-in:focus-visible { outline: none; }
.nl-root a:focus-visible, .nl-root button:focus-visible { outline: 1.5px solid var(--nl-ink); outline-offset: 3px; }
.nl-x:focus-visible { outline-offset: 0; }

/* Mobile: bottom sheet */
@media (max-width: 640px) {
  .nl-root { place-items: end stretch; padding: 0; }
  .nl-box { grid-template-columns: 1fr; width: 100%; max-height: 92vh; max-height: 92svh; transform: translateY(100%); transition: opacity .3s var(--nl-ease), transform .5s var(--nl-ease); box-shadow: 0 -12px 40px rgba(0, 0, 0, 0.14); overflow-y: auto; }
  .nl-box::before { content: ""; position: absolute; top: 8px; left: 50%; z-index: 2; width: 40px; height: 3px; margin-left: -20px; border-radius: 2px; background: rgba(255, 255, 255, 0.85); }
  .nl-pic { min-height: 0; height: 168px; flex: none; }
  .nl-pic img { object-position: 50% 10%; }
  .nl-copy { padding: 26px 22px calc(22px + env(safe-area-inset-bottom)); overflow: visible; }
  .nl-title { font-size: 36px; margin-top: 12px; }
  .nl-desc { font-size: 14px; margin-top: 12px; }
  .nl-form { margin-top: 22px; }
  .nl-x { top: 10px; right: 10px; width: 38px; height: 38px; }
  .nl-skip { display: block; margin: 14px auto 0; }
  .nl-code-v { font-size: 23px; padding: 0 14px; }
  .nl-copy-btn { min-width: 100px; padding: 0 12px; }
}
@media (max-height: 620px) and (min-width: 641px) {
  .nl-pic { min-height: 0; }
  .nl-copy { padding-top: 40px; padding-bottom: 32px; }
}
@media (prefers-reduced-motion: reduce) {
  .nl-back, .nl-box, .nl-pic img, .nl-step { transition: none !important; animation: none !important; }
  .nl-box { transform: none !important; }
  .nl-pic img { transform: none; }
}

/* ===== mare-jewellery-wp.css ===== */
/* Maré on WordPress - adaptation layer only.
   The design lives in mare-jewellery-site.css (+ page CSS), unchanged from the static source.
   This file only removes what the theme (Nexter) and Elementor add around Composer sections,
   so each section renders edge to edge exactly as it did in the static build. */

/* Nexter content container: no gutter, no max-width, no title area around Composer pages */
.site-content .nxt-container-block-editor:has(.elementor-widget-uichemy-composer),
.site-content .nxt-container:has(.elementor-widget-uichemy-composer) { padding-inline: 0 !important; max-width: none !important; width: 100%; }
.site-content .nxt-container-block-editor:has(.elementor-widget-uichemy-composer) > .nxt-row,
.site-content .nxt-container:has(.elementor-widget-uichemy-composer) > .nxt-row { margin: 0; }
.site-content .nxt-row:has(.elementor-widget-uichemy-composer) > [class*="nxt-col"] { padding: 0; flex: 0 0 100%; max-width: 100%; }
.site-content article:has(.elementor-widget-uichemy-composer) > .entry-content { margin: 0; }
.site-content .elementor:has(.elementor-widget-uichemy-composer) { max-width: none !important; margin-left: 0 !important; margin-right: 0 !important; width: 100%; }
.site-content article:has(.elementor-widget-uichemy-composer) .entry-header,
.site-content article:has(.elementor-widget-uichemy-composer) .nxt-breadcrumbs { display: none; }
#content.site-content:has(.elementor-widget-uichemy-composer) { padding: 0; margin: 0; }

/* Elementor containers that only hold a Composer section: no padding, no gap, full width */
.elementor .e-con:has(> .elementor-widget-uichemy-composer),
.elementor .e-con:has(> .e-con-inner > .elementor-widget-uichemy-composer) {
  --padding-top: 0px; --padding-right: 0px; --padding-bottom: 0px; --padding-left: 0px;
  --padding-block-start: 0px; --padding-block-end: 0px; --padding-inline-start: 0px; --padding-inline-end: 0px;
  --gap: 0px; --row-gap: 0px; --column-gap: 0px; --margin-top: 0px; --margin-bottom: 0px;
  --content-width: 100%; max-width: 100%; padding: 0; gap: 0;
}
.elementor .e-con:has(> .elementor-widget-uichemy-composer) > .e-con-inner { max-width: none; padding: 0; gap: 0; }
.elementor .elementor-widget-uichemy-composer { width: 100%; max-width: 100%; margin: 0; }
.elementor:has(> .e-con > .elementor-widget-uichemy-composer) { gap: 0; }

/* The static site's body was the page canvas; keep Nexter's wrappers out of the way */
.wrapper-main { overflow: visible; }

/* The static source had no smooth scrolling; Nexter adds it. */
html { scroll-behavior: auto; }

/* Source rules that relied on sections being siblings in <main>; each section is now its own widget. */
/* .zm + section { position: relative; z-index: 4; } — the category list after the scroll-zoom on home */
.uichemy-categories-4 > .catlist { position: relative; z-index: 4; }
/* .tl-row + .tl-offers { padding-top: 48px; } — offers grid after the applied-code row */
.uichemy-coupon-tl-offers-3 > .tl-offers { padding-top: 48px; }

/* Elementor zeroes every figure margin inside widgets (.elementor .elementor-widget:not(..):not(..) figure).
   The source's non-zero figure margins, restated with enough specificity to win (values unchanged). */
.elementor .elementor-widget.elementor-element.elementor-widget-uichemy-composer figure.cv2-media { margin: clamp(64px, 8vw, 120px) 0 0; }
.elementor .elementor-widget.elementor-element.elementor-widget-uichemy-composer figure.cp-banner { margin: clamp(48px, 6vw, 88px) 0 0; }
.elementor .elementor-widget.elementor-element.elementor-widget-uichemy-composer figure.bl-fig { margin: 56px -60px; }
@media (max-width: 1080px) { .elementor .elementor-widget.elementor-element.elementor-widget-uichemy-composer figure.bl-fig { margin: 48px 0; } }

/* ===== mare-jewellery-woo.css ===== */
/* Maré: WooCommerce cart, checkout, account and tracking forms styled in the source design language
   (field, button, summary and table treatments copied from site.css / commerce.css / account.css). */

/* ---------- shared form language (.cform / .cm-field) ---------- */
.mare-woo { font-size: 15px; }
.mare-woo .woocommerce-notices-wrapper:empty { display: none; }
.mare-woo .woocommerce-message, .mare-woo .woocommerce-info, .mare-woo .woocommerce-error, .mare-woo .woocommerce-noreviews {
  list-style: none; margin: 0 0 24px; padding: 14px 18px; border: 0; border-left: 2px solid var(--ink); background: #fff; font-size: 14px; color: var(--ink); display: flex; gap: 16px; align-items: center; justify-content: space-between; flex-wrap: wrap; }
.mare-woo .woocommerce-error { border-left-color: #a2412e; color: #a2412e; }
.mare-woo .woocommerce-error li { list-style: none; }
.mare-woo .woocommerce-message::before, .mare-woo .woocommerce-info::before, .mare-woo .woocommerce-error::before { display: none; }
.mare-woo .woocommerce-message .button, .mare-woo .woocommerce-info .button, .mare-woo .woocommerce-info a { order: 2; font-size: 12px; letter-spacing: .14em; text-transform: uppercase; border-bottom: 1px solid currentColor; background: none; padding: 0 0 3px; height: auto; color: var(--ink); }
.mare-woo .form-row { display: block; margin: 0 0 22px; padding: 0; }
.mare-woo .form-row label, .mare-woo .woocommerce-form-row label, .mare-woo .track_order label {
  display: block; font-size: 11px; letter-spacing: .2em; text-transform: uppercase; color: var(--muted); line-height: 1.6; }
.mare-woo .form-row label .required { color: var(--muted); text-decoration: none; border: 0; }
.mare-woo .form-row label .optional { letter-spacing: .1em; }
.mare-woo input.input-text, .mare-woo input[type="text"], .mare-woo input[type="email"], .mare-woo input[type="tel"], .mare-woo input[type="password"], .mare-woo input[type="number"], .mare-woo textarea, .mare-woo select {
  display: block; width: 100%; margin-top: 10px; padding: 0 0 10px; border: 0; border-bottom: 1px solid #d8d8d8; border-radius: 0; background: transparent; font-size: 17px; color: var(--ink); outline: none; box-shadow: none; transition: border-color .25s; resize: none; letter-spacing: 0; text-transform: none; }
.mare-woo input:focus, .mare-woo textarea:focus, .mare-woo select:focus { border-bottom-color: var(--ink); }
.mare-woo input::placeholder, .mare-woo textarea::placeholder { color: #b3b3b3; }
.mare-woo textarea { min-height: 72px; padding-top: 4px; font-family: var(--serif); font-style: italic; font-size: 19px; }
.mare-woo select { height: 36px; padding-bottom: 6px; -webkit-appearance: none; appearance: none; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%231c1c1b' stroke-width='1.6'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") right 2px top 8px no-repeat; }
.mare-woo .woocommerce-invalid input.input-text, .mare-woo .woocommerce-invalid select { border-bottom-color: #a2412e; }
.mare-woo .select2-container .select2-selection--single { height: 36px; margin-top: 10px; border: 0; border-bottom: 1px solid #d8d8d8; border-radius: 0; background: transparent; }
.mare-woo .select2-container .select2-selection__rendered { padding: 0; font-size: 17px; line-height: 30px; color: var(--ink); }
.mare-woo .select2-container .select2-selection__arrow { height: 34px; }
.mare-woo .password-input { position: relative; display: block; }
.mare-woo .show-password-input { position: absolute; right: 0; bottom: 12px; background: none; border: 0; opacity: .5; }
.mare-woo .woocommerce-form__label-for-checkbox { display: flex; align-items: center; gap: 10px; font-size: 14px; letter-spacing: 0; text-transform: none; color: var(--ink); cursor: pointer; }
.mare-woo input[type="checkbox"], .mare-woo input[type="radio"] { width: 15px; height: 15px; margin: 0; accent-color: var(--ink); }

/* buttons: the source .btn (black, uppercase, 52px) and .btn-line */
.mare-woo .button, .mare-woo button.button, .mare-woo a.button, .mare-woo input.button, .mare-woo #place_order, .mare-woo .checkout-button {
  display: inline-flex; align-items: center; justify-content: center; height: 52px; padding: 0 28px; border: 0; border-radius: 0; background: var(--ink); color: #fff; font: inherit; font-size: 13px; letter-spacing: .16em; text-transform: uppercase; line-height: 1; cursor: pointer; transition: background .25s, color .25s; text-decoration: none; }
.mare-woo .button:hover, .mare-woo #place_order:hover { background: #000; color: #fff; }
.mare-woo .button:disabled, .mare-woo .button.disabled, .mare-woo .button[disabled] { opacity: .35; cursor: default; }
.mare-woo button[name="update_cart"], .mare-woo button[name="apply_coupon"], .mare-woo .woocommerce-form-track button { background: transparent; color: var(--ink); border: 1px solid var(--ink); }
.mare-woo button[name="update_cart"]:hover:not(:disabled), .mare-woo button[name="apply_coupon"]:hover { background: var(--ink); color: #fff; }
.mare-woo .woocommerce-button.view, .mare-woo .woocommerce-orders-table .button { height: 40px; padding: 0 18px; font-size: 11px; }

/* ---------- tables (shop_table) ---------- */
.mare-woo table.shop_table { width: 100%; border: 0; border-collapse: collapse; margin: 0; border-radius: 0; }
.mare-woo table.shop_table th, .mare-woo table.shop_table td { padding: 16px 0; border: 0; border-bottom: 1px solid var(--line); text-align: left; vertical-align: middle; background: transparent; }
.mare-woo table.shop_table thead th { font-weight: 400; font-size: 11px; letter-spacing: .2em; text-transform: uppercase; color: var(--muted); padding: 0 0 14px; }
.mare-woo .woocommerce-Price-amount { letter-spacing: .04em; }

/* ---------- Cart: lines + 400px summary, as .cm-cart ---------- */
.mare-woo.cm-cart { display: block; }
.mare-woo .woocommerce:has(> .woocommerce-cart-form) { display: grid; grid-template-columns: minmax(0, 1fr) 400px; gap: clamp(32px, 5vw, 80px); align-items: start; }
.mare-woo .woocommerce:has(> .woocommerce-cart-form) > .woocommerce-notices-wrapper { grid-column: 1 / -1; }
.mare-woo .woocommerce-cart-form__contents .product-remove { width: 28px; }
.mare-woo .woocommerce-cart-form__contents a.remove { display: grid; place-items: center; width: 24px; height: 24px; font-size: 18px; line-height: 1; color: var(--muted) !important; border-radius: 0; background: none !important; }
.mare-woo .woocommerce-cart-form__contents a.remove:hover { color: var(--ink) !important; }
.mare-woo .woocommerce-cart-form__contents .product-thumbnail { width: 132px; padding-right: 20px; }
.mare-woo .woocommerce-cart-form__contents .product-thumbnail img { width: 112px; height: auto; aspect-ratio: 5 / 6; object-fit: cover; background: var(--ph); }
.mare-woo .woocommerce-cart-form__contents .product-name a { font-family: var(--serif); font-size: 26px; line-height: 1.1; }
.mare-woo .woocommerce-cart-form__contents dl.variation { display: flex; flex-wrap: wrap; gap: 4px 12px; margin: 8px 0 0; font-size: 13px; color: var(--muted); }
.mare-woo dl.variation dt, .mare-woo dl.variation dd { margin: 0; font-weight: 400; }
.mare-woo dl.variation dd p { margin: 0; }
.mare-woo .quantity .qty { width: 72px; margin: 0; text-align: center; padding: 8px 0; border: 1px solid var(--line); font-size: 15px; }
.mare-woo td.actions { padding-top: 24px; }
.mare-woo td.actions .coupon { display: inline-flex; gap: 16px; align-items: end; margin-right: 16px; }
.mare-woo td.actions .coupon label { display: none; }
.mare-woo td.actions .coupon .input-text { width: 200px; margin: 0; padding-bottom: 12px; }
.mare-woo .cart-collaterals { position: sticky; top: 100px; }
.mare-woo .cart_totals { border: 1px solid var(--line); padding: clamp(24px, 2.6vw, 36px); background: var(--panel); width: 100% !important; float: none !important; }
.mare-woo .cart_totals h2 { font-size: 32px; margin-bottom: 14px; }
.mare-woo .cart_totals table th { font-weight: 400; color: #545454; width: 45%; font-size: 14px; }
.mare-woo .cart_totals table td { text-align: right; font-size: 14px; }
.mare-woo .order-total th, .mare-woo .order-total td { border-bottom: 0 !important; padding-top: 18px !important; font-size: 15px; letter-spacing: .14em; text-transform: uppercase; color: var(--ink) !important; }
.mare-woo .order-total .woocommerce-Price-amount { font-family: var(--serif); font-size: 28px; letter-spacing: 0; text-transform: none; }
.mare-woo #shipping_method { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.mare-woo #shipping_method li { display: flex; gap: 8px; align-items: center; justify-content: flex-end; }
.mare-woo .woocommerce-shipping-destination, .mare-woo .shipping-calculator-button { font-size: 12px; color: var(--muted); }
.mare-woo .wc-proceed-to-checkout { padding: 18px 0 0; }
.mare-woo .wc-proceed-to-checkout .checkout-button { width: 100%; }
.mare-woo .cart-empty.woocommerce-info { font-family: var(--serif); font-style: italic; font-size: 24px; justify-content: center; border: 0; text-align: center; }
.mare-woo .return-to-shop { text-align: center; }

/* ---------- Checkout: details + 420px summary, as .cm-co ---------- */
.mare-woo-checkout { max-width: 1240px; margin: 0 auto; padding: 0 var(--pad) clamp(80px, 9vw, 120px); }
.mare-woo .woocommerce-form-coupon-toggle .woocommerce-info { justify-content: flex-start; }
.mare-woo form.checkout_coupon { display: flex; gap: 16px; align-items: end; max-width: 520px; margin: 0 0 32px; padding: 0; border: 0; }
.mare-woo form.checkout_coupon .form-row { margin: 0; flex: 1; }
.mare-woo form.checkout_coupon .form-row-last { flex: none; }
.mare-woo form.checkout_coupon .clear { display: none; }
.mare-woo form.woocommerce-checkout { display: grid; grid-template-columns: minmax(0, 1fr) 420px; grid-template-areas: "details heading" "details review"; gap: 0 clamp(32px, 6vw, 100px); align-items: start; }
.mare-woo form.woocommerce-checkout > .woocommerce-NoticeGroup { grid-column: 1 / -1; }
.mare-woo #customer_details { grid-area: details; display: block; width: auto; }
.mare-woo #customer_details .col-1, .mare-woo #customer_details .col-2 { float: none; width: 100%; max-width: none; padding: 0; }
.mare-woo #customer_details h3, .mare-woo #order_review_heading { font-family: var(--serif); font-weight: 400; font-size: 32px; margin: 0 0 22px; }
.mare-woo #customer_details .col-2 { margin-top: 28px; }
.mare-woo .woocommerce-billing-fields__field-wrapper, .mare-woo .shipping_address .woocommerce-shipping-fields__field-wrapper { display: grid; grid-template-columns: 1fr 1fr; gap: 0 28px; }
.mare-woo .woocommerce-billing-fields__field-wrapper .form-row-wide, .mare-woo .woocommerce-shipping-fields__field-wrapper .form-row-wide, .mare-woo #billing_country_field, .mare-woo #billing_address_1_field, .mare-woo #billing_address_2_field, .mare-woo #billing_email_field { grid-column: 1 / -1; }
.mare-woo .form-row-first, .mare-woo .form-row-last { float: none; width: auto; }
.mare-woo #order_review_heading { grid-area: heading; padding: clamp(24px, 2.6vw, 36px) clamp(24px, 2.6vw, 36px) 0; border: 1px solid var(--line); border-bottom: 0; margin: 0; }
.mare-woo #order_review { grid-area: review; border: 1px solid var(--line); border-top: 0; padding: 8px clamp(24px, 2.6vw, 36px) clamp(24px, 2.6vw, 36px); position: sticky; top: 100px; }
.mare-woo .woocommerce-checkout-review-order-table td, .mare-woo .woocommerce-checkout-review-order-table th { font-size: 14px; font-weight: 400; }
.mare-woo .woocommerce-checkout-review-order-table td:last-child, .mare-woo .woocommerce-checkout-review-order-table th:last-child { text-align: right; }
.mare-woo .woocommerce-checkout-review-order-table .product-name { color: var(--ink); }
.mare-woo #payment { background: transparent; border-radius: 0; margin-top: 18px; }
.mare-woo #payment ul.payment_methods { list-style: none; margin: 0; padding: 0 0 16px; border-bottom: 1px solid var(--line); }
.mare-woo #payment ul.payment_methods li { font-size: 14px; }
.mare-woo #payment ul.payment_methods li label { display: inline; text-transform: none; letter-spacing: 0; font-size: 14px; color: var(--ink); }
.mare-woo #payment div.payment_box { margin: 10px 0 0; padding: 12px 14px; background: #f6f6f6; color: #545454; font-size: 13px; border-radius: 0; }
.mare-woo #payment div.payment_box::before { display: none; }
.mare-woo #payment .place-order { padding: 18px 0 0; margin: 0; }
.mare-woo #place_order { width: 100%; float: none; }
.mare-woo .woocommerce-privacy-policy-text { font-size: 12px; color: var(--muted); margin-bottom: 16px; }

/* Order received (thank you) */
.mare-woo .woocommerce-order { max-width: 860px; margin: 0 auto; }
.mare-woo .woocommerce-thankyou-order-received { font-family: var(--serif); font-size: clamp(28px, 3vw, 40px); line-height: 1.15; text-align: center; margin: 0 0 32px; }
.mare-woo ul.order_details { list-style: none; display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 18px; margin: 0 0 40px; padding: 24px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.mare-woo ul.order_details li { border: 0; padding: 0; margin: 0; font-size: 11px; letter-spacing: .2em; text-transform: uppercase; color: var(--muted); float: none; }
.mare-woo ul.order_details li strong { display: block; margin-top: 8px; font-size: 16px; letter-spacing: 0; text-transform: none; color: var(--ink); font-weight: 400; }
.mare-woo .woocommerce-order-details__title, .mare-woo .woocommerce-column__title, .mare-woo .woocommerce-customer-details h2 { font-size: 32px; margin: 0 0 18px; }
.mare-woo .woocommerce-customer-details address { border: 1px solid var(--line); border-radius: 0; padding: 20px; font-style: normal; line-height: 1.7; }

/* ---------- Account: sign-in / register / lost password inside .ac-auth ---------- */
.ac-woo { margin-top: 40px; }
.ac-woo .u-columns { display: block; }
.ac-woo .u-columns > .u-column1, .ac-woo .u-columns > .u-column2 { float: none; width: 100%; padding: 0; }
.ac-woo .u-columns h2 { display: none; }
.ac-woo-login .u-column2, .ac-woo-forgot .u-column2 { display: none; }
.ac-woo-signup .u-column1 { display: none; }
.ac-woo form.woocommerce-form-login, .ac-woo form.woocommerce-form-register, .ac-woo form.woocommerce-ResetPassword { display: grid; gap: 4px; margin: 0; padding: 0; border: 0; border-radius: 0; }
.ac-woo .woocommerce-form-login .form-row:has(.woocommerce-form-login__rememberme) { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 16px; }
.ac-woo .woocommerce-form-login__submit, .ac-woo .woocommerce-form-register__submit, .ac-woo .woocommerce-ResetPassword .button { width: 100%; margin-top: 6px; float: none; }
.ac-woo .lost_password { margin: 12px 0 0; }
.ac-woo .lost_password a { font-size: 13px; color: var(--ink); border-bottom: 1px solid var(--line); padding-bottom: 2px; }
.ac-woo .woocommerce-privacy-policy-text p { font-size: 13px; color: var(--muted); }
.ac-woo .woocommerce-ResetPassword > p:first-child { display: none; }

/* Signed-in dashboard: account nav + content, as the source .ac-dash grid */
.ac-woo-dash { padding: clamp(48px, 6vw, 88px) var(--pad) clamp(80px, 9vw, 120px); }
.ac-woo-dash .woocommerce { display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: clamp(32px, 5vw, 80px); align-items: start; max-width: 1240px; margin: 0 auto; }
.ac-woo-dash .woocommerce-MyAccount-navigation, .ac-woo-dash .woocommerce-MyAccount-content { float: none; width: auto; }
.ac-woo-dash .woocommerce-MyAccount-navigation ul { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--line); }
.ac-woo-dash .woocommerce-MyAccount-navigation li a { display: block; padding: 16px 0; border-bottom: 1px solid var(--line); font-size: 12px; letter-spacing: .2em; text-transform: uppercase; color: var(--muted); transition: color .25s; }
.ac-woo-dash .woocommerce-MyAccount-navigation li.is-active a, .ac-woo-dash .woocommerce-MyAccount-navigation li a:hover { color: var(--ink); }
.ac-woo-dash .woocommerce-MyAccount-content > p:first-child { font-family: var(--serif); font-size: clamp(28px, 3vw, 40px); line-height: 1.15; }
.ac-woo-dash .woocommerce-MyAccount-content a { border-bottom: 1px solid var(--line); }
.ac-woo-dash .woocommerce-Addresses { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; }
.ac-woo-dash .woocommerce-Address { border: 1px solid var(--line); padding: 24px; }
.ac-woo-dash .woocommerce-Address-title h2 { font-size: 26px; }
.ac-woo-dash form.edit-account fieldset { border: 0; padding: 0; margin: 24px 0 0; }
.ac-woo-dash form.edit-account legend { font-family: var(--serif); font-size: 26px; margin-bottom: 14px; }

/* ---------- Order tracking: the source .cm-tform row ---------- */
.cm-track .mare-woo form.track_order { display: grid; grid-template-columns: 1fr 1fr auto; gap: 28px; align-items: end; max-width: 860px; margin: 0 auto; padding: 0; border: 0; }
/* The source puts this intro in the page heading (.cm-sub); WooCommerce repeats it inside the form. */
.cm-track .mare-woo form.track_order > p:first-child { display: none; }
.cm-track .mare-woo form.track_order .form-row { width: auto; float: none; margin: 0; }
.cm-track .mare-woo form.track_order .clear { display: none; }

/* ---------- responsive (source breakpoints) ---------- */
@media (max-width: 1080px) {
  .mare-woo .woocommerce:has(> .woocommerce-cart-form) { grid-template-columns: minmax(0, 1fr) 340px; }
  .mare-woo form.woocommerce-checkout { grid-template-columns: minmax(0, 1fr) 360px; }
}
@media (max-width: 900px) {
  .mare-woo .woocommerce:has(> .woocommerce-cart-form), .mare-woo form.woocommerce-checkout { grid-template-columns: 1fr; grid-template-areas: "heading" "review" "details"; }
  .mare-woo .cart-collaterals, .mare-woo #order_review { position: relative; top: 0; }
  .mare-woo #customer_details { margin-top: 40px; }
  .ac-woo-dash .woocommerce { grid-template-columns: 1fr; }
}
@media (max-width: 768px) {
  .mare-woo table.shop_table_responsive thead { display: none; }
  .mare-woo .woocommerce-cart-form__contents tr.cart_item { display: grid; grid-template-columns: 96px minmax(0, 1fr) auto; grid-template-areas: "thumb name remove" "thumb qty total"; gap: 10px 16px; padding: 22px 0; border-bottom: 1px solid var(--line); }
  .mare-woo .woocommerce-cart-form__contents tr.cart_item td { display: block; padding: 0; border: 0; text-align: left !important; }
  .mare-woo .woocommerce-cart-form__contents tr.cart_item td::before { display: none; }
  .mare-woo .woocommerce-cart-form__contents .product-thumbnail { grid-area: thumb; width: auto; padding: 0; }
  .mare-woo .woocommerce-cart-form__contents .product-thumbnail img { width: 96px; }
  .mare-woo .woocommerce-cart-form__contents .product-name { grid-area: name; }
  .mare-woo .woocommerce-cart-form__contents .product-remove { grid-area: remove; }
  .mare-woo .woocommerce-cart-form__contents .product-price { display: none !important; }
  .mare-woo .woocommerce-cart-form__contents .product-quantity { grid-area: qty; }
  .mare-woo .woocommerce-cart-form__contents .product-subtotal { grid-area: total; text-align: right !important; }
  .mare-woo td.actions .coupon { display: flex; margin: 0 0 14px; }
  .mare-woo td.actions .coupon .input-text { flex: 1; width: auto; }
  .mare-woo td.actions > .button { width: 100%; }
  .mare-woo .woocommerce-billing-fields__field-wrapper, .mare-woo .woocommerce-shipping-fields__field-wrapper { grid-template-columns: 1fr; }
  .ac-woo-dash .woocommerce-Addresses { grid-template-columns: 1fr; }
  .cm-track .mare-woo form.track_order { grid-template-columns: 1fr; gap: 22px; max-width: 520px; }
  .cm-track .mare-woo form.track_order .button { width: 100%; }
}
@media (max-width: 480px) {
  .mare-woo .woocommerce-cart-form__contents .product-name a { font-size: 22px; }
  .mare-woo form.checkout_coupon { flex-direction: column; align-items: stretch; }
}

/* WooCommerce's own cart/coupon rules are more specific than the shared field rule above. */
body .mare-woo table.cart td.actions .coupon .input-text, body .mare-woo form.checkout_coupon .input-text, body .mare-woo .woocommerce-form-track .input-text {
  float: none; width: 200px; height: auto; margin: 0; padding: 0 0 12px; border: 0; border-bottom: 1px solid #d8d8d8; border-radius: 0; background: transparent; font-size: 17px; color: var(--ink); }
body .mare-woo form.checkout_coupon .input-text, body .mare-woo .woocommerce-form-track .input-text { width: 100%; margin-top: 10px; }
body .mare-woo table.cart td.actions .coupon .button, body .mare-woo table.cart td.actions > .button { float: none; width: auto; }
body .mare-woo input.input-text:focus { border-bottom-color: var(--ink); }
@media (max-width: 768px) { body .mare-woo table.cart td.actions .coupon .input-text { flex: 1; width: auto; } }

/* ===== mare-jewellery-blog.css ===== */
/* Maré Journal (blog, blog-post, blog-category, blog-author). All classes prefixed .bl- */

/* ---------- Shared pieces ---------- */
.bl-title { text-align: center; padding: clamp(64px, 8vw, 110px) var(--pad) clamp(40px, 4.5vw, 64px); }
.bl-crumbs { display: flex; justify-content: center; flex-wrap: wrap; gap: 10px; font-size: 12px; letter-spacing: .2em; text-transform: uppercase; color: var(--muted); }
.bl-crumbs a { transition: color .25s; }
.bl-crumbs a:hover { color: var(--ink); }
.bl-title h1 { font-size: clamp(56px, 7vw, 100px); margin-top: 18px; }
.bl-title .bl-lede { font-family: var(--serif); font-style: italic; font-size: clamp(20px, 1.8vw, 24px); color: var(--muted); margin: 12px auto 0; max-width: 640px; line-height: 1.35; }
.bl-count { display: block; margin-top: 18px; font-size: 12px; letter-spacing: .2em; text-transform: uppercase; color: var(--muted); }
.bl-chips { display: flex; justify-content: center; flex-wrap: wrap; gap: 8px; margin-top: 30px; }
.bl-chip { height: 36px; padding: 0 16px; display: inline-flex; align-items: center; gap: 8px; border: 1px solid var(--line); background: #fff; font-size: 12px; letter-spacing: .16em; text-transform: uppercase; transition: border-color .25s, background .25s, color .25s; }
.bl-chip sup { font-size: 9px; letter-spacing: .1em; color: var(--muted); transition: color .25s; }
.bl-chip:hover { border-color: var(--ink); }
.bl-chip.on { background: var(--ink); color: #fff; border-color: var(--ink); }
.bl-chip.on sup { color: rgba(255, 255, 255, 0.7); }

/* Image hover: small black circle with white arrow (home page detail) */
.bl-pill { position: absolute; right: 14px; bottom: 14px; z-index: 2; display: grid; place-items: center; width: 46px; height: 46px; border-radius: 50%; background: var(--ink); color: #fff; opacity: 0; transform: scale(.6); transition: opacity .35s var(--ease), transform .5s cubic-bezier(.19, 1, .22, 1); }
.bl-pill svg { width: 16px; height: 16px; transform: rotate(-45deg); transition: transform .5s cubic-bezier(.19, 1, .22, 1); }
.bl-hov:hover .bl-pill, .bl-hov:focus-visible .bl-pill { opacity: 1; transform: none; }
.bl-hov:hover .bl-pill svg { transform: none; }
.bl-hov:hover .media img { transform: scale(1.035); }

/* Post card */
.bl-grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 56px 32px; padding: 0 var(--pad) clamp(80px, 9vw, 120px); }
.bl-card { display: flex; flex-direction: column; min-width: 0; grid-column: span 2; }
.bl-card.bl-wide { grid-column: span 3; }
.bl-card.bl-wide .media { aspect-ratio: 4 / 3; }
.bl-card.bl-wide h3 { font-size: clamp(30px, 2.6vw, 40px); }
.bl-card .bl-img { display: block; position: relative; }
.bl-card .media { aspect-ratio: 4 / 5; background: var(--panel); }
.bl-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; margin-top: 20px; font-size: 11px; letter-spacing: .2em; text-transform: uppercase; color: var(--muted); }
.bl-meta a { color: var(--ink); border-bottom: 1px solid transparent; transition: border-color .25s; }
.bl-meta a:hover { border-color: currentColor; }
.bl-meta i { width: 3px; height: 3px; border-radius: 50%; background: currentColor; opacity: .6; }
.bl-card h3 { font-size: clamp(26px, 2.1vw, 31px); line-height: 1.12; margin-top: 12px; }
.bl-card h3 a { background: linear-gradient(currentColor, currentColor) 0 100% / 0 1px no-repeat; transition: background-size .5s var(--ease); }
.bl-card h3 a:hover { background-size: 100% 1px; }
.bl-card .bl-ex { margin-top: 12px; color: var(--muted); font-size: 15px; line-height: 1.65; }
.bl-date { margin-top: 14px; font-size: 13px; color: var(--muted); }
.bl-empty { grid-column: 1 / -1; text-align: center; padding: 64px 20px; color: var(--muted); }

/* ---------- Journal index ---------- */
.bl-feat { display: grid; grid-template-columns: 1.35fr 1fr; gap: clamp(32px, 5vw, 80px); align-items: center; padding: 0 var(--pad) clamp(72px, 8vw, 112px); }
.bl-feat .bl-img { display: block; position: relative; }
.bl-feat .media { aspect-ratio: 5 / 4; }
.bl-feat h2 { font-size: clamp(40px, 4.4vw, 66px); margin-top: 18px; line-height: 1.02; }
.bl-feat h2 a:hover { opacity: .7; }
.bl-feat .bl-ex { margin-top: 22px; font-size: 17px; line-height: 1.7; color: var(--muted); max-width: 460px; }
.bl-feat .bl-by { margin-top: 26px; font-size: 14px; }
.bl-feat .bl-by a { border-bottom: 1px solid var(--line); transition: border-color .25s; }
.bl-feat .bl-by a:hover { border-color: var(--ink); }
.bl-feat .ulink { display: inline-block; margin-top: 34px; }
.bl-bar { display: flex; flex-direction: column; align-items: center; padding: 0 var(--pad); border-top: 1px solid var(--line); }
.bl-bar .bl-chips { margin: 40px 0 0; }
.bl-bar .bl-count { margin: 18px 0 48px; }

.bl-news { display: grid; grid-template-columns: 1fr minmax(280px, 440px); gap: 32px 64px; align-items: end; margin: 0 var(--pad); padding: clamp(56px, 6vw, 88px) 0; border-top: 1px solid var(--line); }
.bl-news h2 { font-size: clamp(34px, 3.4vw, 50px); margin-top: 14px; }
.bl-news-form { display: flex; align-items: flex-end; gap: 16px; }
.bl-news-form label { flex: 1; }
.bl-news-form input { display: block; width: 100%; margin-top: 12px; padding: 0 0 12px; border: 0; border-bottom: 1px solid #d8d8d8; background: transparent; font-size: 17px; outline: none; transition: border-color .25s; }
.bl-news-form input:focus { border-bottom-color: var(--ink); }
.bl-news-form input[aria-invalid="true"] { border-bottom-color: #a2412e; }
.bl-news-form .btn { flex: none; }
.bl-news-msg { grid-column: 2; min-height: 22px; margin-top: -16px; font-size: 13px; }
.bl-news-msg.bad { color: #a2412e; }

/* ---------- Single post ---------- */
.bl-progress { position: fixed; top: 0; left: 0; right: 0; height: 2px; z-index: 85; pointer-events: none; }
.bl-progress span { display: block; height: 100%; width: 100%; background: var(--ink); transform: scaleX(0); transform-origin: 0 50%; }
.bl-post-head { text-align: center; padding: clamp(56px, 7vw, 100px) var(--pad) clamp(36px, 4vw, 56px); }
.bl-post-head h1 { font-size: clamp(44px, 5.6vw, 84px); max-width: 1000px; margin: 20px auto 0; line-height: 1.02; }
.bl-post-head .bl-lede { font-family: var(--serif); font-style: italic; font-size: clamp(20px, 1.8vw, 24px); color: var(--muted); max-width: 680px; margin: 20px auto 0; line-height: 1.4; }
.bl-post-meta { display: flex; justify-content: center; flex-wrap: wrap; align-items: center; gap: 8px 16px; margin-top: 28px; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; color: var(--muted); }
.bl-post-meta a { color: var(--ink); border-bottom: 1px solid var(--line); padding-bottom: 2px; transition: border-color .25s; }
.bl-post-meta a:hover { border-color: var(--ink); }
.bl-post-meta i { width: 3px; height: 3px; border-radius: 50%; background: currentColor; opacity: .6; }
.bl-share { display: inline-flex; align-items: center; gap: 8px; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; color: var(--ink); border-bottom: 1px solid var(--line); padding-bottom: 2px; transition: border-color .25s; }
.bl-share:hover { border-color: var(--ink); }
.bl-share svg { width: 13px; height: 13px; }
.bl-cover { margin: 0 var(--pad); }
.bl-cover .media { aspect-ratio: 16 / 8; }
.bl-cover .media img { clip-path: inset(0 0 0 0); }
.bl-cover.bl-clip .media img { animation: bl-clip 1.3s var(--ease) both; }
@keyframes bl-clip { from { clip-path: inset(8% 8% 8% 8%); transform: scale(1.06); } to { clip-path: inset(0 0 0 0); transform: none; } }

.bl-body { max-width: 680px; margin: 0 auto; padding: clamp(56px, 6vw, 88px) 20px 0; }
.bl-body > p { font-size: 18px; line-height: 1.78; color: #2e2e2e; margin-top: 24px; }
.bl-body > p:first-child { margin-top: 0; }
.bl-body > p:first-child::first-letter { float: left; font-family: var(--serif); font-size: 76px; line-height: .82; padding: 6px 8px 0 0; }
.bl-body h2 { font-size: clamp(32px, 3vw, 40px); line-height: 1.1; margin-top: 56px; }
.bl-body h2 + p { margin-top: 18px; }
.bl-body ul, .bl-body ol { margin: 24px 0 0; padding: 0; list-style: none; counter-reset: bl; }
.bl-body li { position: relative; padding: 12px 0 12px 30px; border-top: 1px solid var(--line); font-size: 17px; line-height: 1.65; color: #2e2e2e; }
.bl-body li:last-child { border-bottom: 1px solid var(--line); }
.bl-body ul li::before { content: ""; position: absolute; left: 4px; top: 24px; width: 5px; height: 5px; border-radius: 50%; background: var(--ink); }
.bl-body ol li { counter-increment: bl; }
.bl-body ol li::before { content: counter(bl, decimal-leading-zero); position: absolute; left: 0; top: 14px; font-size: 11px; letter-spacing: .14em; color: var(--muted); }
.bl-quote { margin: 56px 0; padding: 0 0 0 clamp(20px, 3vw, 40px); border-left: 1px solid var(--ink); }
.bl-quote p { font-family: var(--serif); font-style: italic; font-size: clamp(28px, 2.6vw, 36px); line-height: 1.2; }
.bl-quote cite { display: block; margin-top: 16px; font-style: normal; font-size: 12px; letter-spacing: .22em; text-transform: uppercase; color: var(--muted); }
.bl-fig { margin: 56px -60px; }
.bl-fig .media { aspect-ratio: 3 / 2; }
.bl-fig figcaption { margin: 14px 60px 0; font-size: 13px; line-height: 1.55; color: var(--muted); }
.bl-endshare { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-top: 64px; padding: 20px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.bl-endshare .eyebrow a { color: var(--ink); }

.bl-shop { padding: clamp(80px, 9vw, 120px) var(--pad) 0; }
.bl-shop .sec-head { margin-bottom: 36px; }
.bl-prods { --n: 4; display: grid; grid-template-columns: repeat(var(--n), minmax(0, 1fr)); gap: 32px 20px; }
.bl-prods.bl-few { max-width: 760px; }
.bl-prod { min-width: 0; }
.bl-prod > a { display: block; position: relative; }
.bl-prod .media { aspect-ratio: 5 / 6; background: var(--panel); }
.bl-prod .media .alt { position: absolute; inset: 0; opacity: 0; transition: opacity .6s var(--ease); }
.bl-prod > a:hover .media .alt:not(.missing) { opacity: 1; }
.bl-prod-cap { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; margin-top: 16px; }
.bl-prod-cap .n { font-family: var(--serif); font-size: 23px; line-height: 1.1; }
.bl-prod-cap .t { font-size: 12px; color: var(--muted); letter-spacing: .06em; margin-top: 3px; }
.bl-prod-cap .p { font-size: 13px; letter-spacing: .18em; white-space: nowrap; }
.bl-prod .bl-add { margin-top: 14px; font-size: 12px; letter-spacing: .16em; text-transform: uppercase; border-bottom: 1px solid currentColor; padding-bottom: 3px; transition: opacity .25s; }
.bl-prod .bl-add:hover { opacity: .55; }

.bl-authorcard { max-width: 880px; margin: clamp(80px, 9vw, 120px) auto 0; padding: clamp(28px, 4vw, 44px); background: var(--panel); display: grid; grid-template-columns: 120px 1fr; gap: 32px; align-items: center; }
.bl-av { position: relative; width: 120px; aspect-ratio: 1; overflow: hidden; background: #fff; display: grid; place-items: center; }
.bl-av img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transform: scale(var(--z, 1)); transform-origin: var(--o, 50% 30%); }
.bl-av span { font-family: var(--serif); font-size: 40px; letter-spacing: .06em; color: var(--ink); }
.bl-authorcard h3 { font-size: 32px; margin-top: 8px; }
.bl-authorcard p.bl-bio { margin-top: 10px; color: #4a4a4a; font-size: 15px; line-height: 1.65; }
.bl-authorcard .ulink { display: inline-block; margin-top: 18px; }

.bl-pn { display: grid; grid-template-columns: 1fr 1fr; margin: clamp(64px, 7vw, 96px) var(--pad) 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.bl-pn a { display: block; padding: 32px 0; transition: opacity .25s; }
.bl-pn a:hover { opacity: .6; }
.bl-pn a + a, .bl-pn span + a { padding-left: 32px; border-left: 1px solid var(--line); text-align: right; }
.bl-pn .eyebrow { display: inline-flex; align-items: center; gap: 8px; }
.bl-pn strong { display: block; margin-top: 10px; font-family: var(--serif); font-weight: 400; font-size: clamp(22px, 2.2vw, 30px); line-height: 1.15; }
.bl-pn a:first-child { padding-right: 32px; }

.bl-related { padding: clamp(80px, 9vw, 120px) 0 0; }
.bl-related .sec-head { padding: 0 var(--pad); }

.bl-nf { text-align: center; padding: clamp(100px, 12vw, 160px) var(--pad); }
.bl-nf h1 { font-size: clamp(44px, 5vw, 72px); margin-top: 18px; }
.bl-nf p { color: var(--muted); max-width: 460px; margin: 18px auto 0; line-height: 1.7; }
.bl-nf .btn { margin-top: 32px; }
.bl-nf .bl-chips { margin-top: 40px; }

/* ---------- Author page ---------- */
.bl-ahead { display: grid; grid-template-columns: minmax(240px, 420px) 1fr; gap: clamp(32px, 6vw, 96px); align-items: end; padding: clamp(56px, 7vw, 100px) var(--pad) clamp(56px, 6vw, 88px); }
.bl-ahead .bl-port { aspect-ratio: 4 / 5; }
.bl-ahead .bl-port img { transform-origin: var(--o, 50% 30%); transform: scale(var(--z, 1)); }
.bl-ahead .bl-port.bl-ini { display: grid; place-items: center; background: var(--panel); }
.bl-ahead .bl-port.bl-ini span { font-family: var(--serif); font-size: clamp(80px, 9vw, 140px); letter-spacing: .06em; }
.bl-ahead .bl-crumbs { justify-content: flex-start; }
.bl-ahead h1 { font-size: clamp(56px, 6.4vw, 96px); margin-top: 18px; }
.bl-ahead .bl-role { margin-top: 10px; font-family: var(--serif); font-style: italic; font-size: 24px; color: var(--muted); }
.bl-ahead .bl-long { margin-top: 26px; max-width: 560px; font-size: 17px; line-height: 1.75; color: #2e2e2e; }
.bl-ahead .bl-count { margin-top: 28px; }
.bl-list { margin: 0 var(--pad); border-top: 1px solid var(--line); }
.bl-list-head { display: flex; justify-content: space-between; align-items: baseline; padding: 28px 0; }
.bl-list-head h2 { font-size: clamp(32px, 3vw, 44px); }
.bl-row { display: grid; grid-template-columns: 220px 1fr auto; gap: clamp(20px, 3vw, 48px); align-items: center; padding: 28px 0; border-top: 1px solid var(--line); }
.bl-row .bl-img { display: block; position: relative; }
.bl-row .media { aspect-ratio: 4 / 3; }
.bl-row .bl-pill { width: 38px; height: 38px; right: 10px; bottom: 10px; }
.bl-row .bl-meta { margin-top: 0; }
.bl-row h3 { font-size: clamp(26px, 2.4vw, 36px); line-height: 1.1; margin-top: 10px; }
.bl-row h3 a:hover { opacity: .65; }
.bl-row .bl-ex { margin-top: 10px; color: var(--muted); max-width: 620px; line-height: 1.65; }
.bl-row .ulink { white-space: nowrap; }
.bl-others { padding: clamp(72px, 8vw, 110px) var(--pad) clamp(80px, 9vw, 120px); }
.bl-others .eyebrow { margin-bottom: 24px; }
.bl-others-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.bl-other { display: grid; grid-template-columns: 88px 1fr; gap: 20px; align-items: center; padding: 20px; border: 1px solid var(--line); transition: border-color .25s; }
.bl-other:hover { border-color: var(--ink); }
.bl-other .bl-av { width: 88px; }
.bl-other .bl-av span { font-size: 30px; }
.bl-other strong { display: block; font-family: var(--serif); font-weight: 400; font-size: 26px; line-height: 1.1; }
.bl-other small { display: block; margin-top: 4px; font-size: 12px; letter-spacing: .16em; text-transform: uppercase; color: var(--muted); }

/* ---------- Responsive ---------- */
@media (max-width: 1080px) {
  .bl-grid { grid-template-columns: repeat(2, 1fr); gap: 48px 20px; }
  .bl-card, .bl-card.bl-wide { grid-column: auto; }
  .bl-card.bl-wide .media { aspect-ratio: 4 / 5; }
  .bl-card.bl-wide h3 { font-size: clamp(26px, 2.1vw, 31px); }
  .bl-prods { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: none; }
  .bl-fig { margin: 48px 0; }
  .bl-fig figcaption { margin: 12px 0 0; }
}
@media (max-width: 820px) {
  .bl-feat { grid-template-columns: 1fr; gap: 28px; }
  .bl-feat .media { aspect-ratio: 4 / 5; }
  .bl-news { grid-template-columns: 1fr; }
  .bl-news-msg { grid-column: 1; }
  .bl-cover { margin: 0; }
  .bl-cover .media { aspect-ratio: 4 / 5; }
  .bl-authorcard { margin-left: 20px; margin-right: 20px; grid-template-columns: 88px 1fr; gap: 20px; align-items: start; }
  .bl-authorcard .bl-av { width: 88px; }
  .bl-pn { grid-template-columns: 1fr; }
  .bl-pn a + a, .bl-pn span + a { padding-left: 0; border-left: 0; border-top: 1px solid var(--line); text-align: left; }
  .bl-pn a:first-child { padding-right: 0; }
  .bl-ahead { grid-template-columns: 1fr; align-items: start; }
  .bl-ahead .bl-port { max-width: 360px; }
  .bl-ahead .bl-port.bl-ini { max-width: 180px; aspect-ratio: 1; }
  .bl-ahead .bl-port.bl-ini span { font-size: 64px; }
  .bl-row { grid-template-columns: 140px 1fr; align-items: start; }
  .bl-row .ulink { display: none; }
  .bl-others-grid { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
  .bl-grid { grid-template-columns: 1fr; gap: 48px; }
  .bl-chips { gap: 6px; }
  .bl-chip { height: 34px; padding: 0 12px; font-size: 11px; letter-spacing: .12em; }
  .bl-news-form { flex-direction: column; align-items: stretch; }
  .bl-body > p { font-size: 17px; }
  .bl-quote { margin: 44px 0; }
  .bl-prods { gap: 28px 12px; }
  .bl-prod-cap { flex-direction: column; gap: 4px; }
  .bl-prod-cap .n { font-size: 20px; }
  .bl-row { grid-template-columns: 104px 1fr; gap: 16px; padding: 22px 0; }
  .bl-row .bl-ex { display: none; }
  .bl-row h3 { font-size: 22px; }
  .bl-row .bl-pill { display: none; }
  .bl-pill { display: none; }
  .bl-endshare { flex-direction: column; align-items: flex-start; }
}
@media (prefers-reduced-motion: reduce) {
  .bl-cover.bl-clip .media img { animation: none; }
  .bl-hov:hover .media img { transform: none; }
}

/* Black and white theme: outlines replace the old grey panel fills */
.bl-authorcard { border: 1px solid var(--line); }
.bl-ahead .bl-port.bl-ini { background: #000; color: #fff; }

/* ===== mare-jewellery-utility.css ===== */
/* Maré utility pages: 404, coming soon, newsletter demo. Prefix .ut- */

/* =================== 404 =================== */
.ut-nf { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: clamp(32px, 6vw, 110px); align-items: center; padding: clamp(56px, 7vw, 110px) var(--pad) clamp(40px, 5vw, 80px); }
.ut-nf-eyebrow { display: flex; align-items: center; gap: 14px; }
.ut-nf-eyebrow::after { content: ""; width: 48px; height: 1px; background: var(--line); }
.ut-nf-title { font-size: clamp(54px, 7.4vw, 118px); line-height: .95; letter-spacing: -.02em; margin-top: 22px; max-width: 8.6em; }
.ut-nf-title .ut-lm { display: block; overflow: hidden; padding-bottom: .06em; }
.ut-nf-title .ut-ln { display: block; transform: translateY(105%); transition: transform 1.1s var(--ease); transition-delay: calc(var(--i) * .11s + .1s); }
.ut-nf-title.in .ut-ln { transform: none; }
.ut-nf-lead { margin-top: 26px; max-width: 34em; color: var(--muted); font-size: 17px; }

.ut-search { position: relative; max-width: 520px; margin-top: 40px; }
.ut-search input { display: block; width: 100%; height: 56px; padding: 0 52px 0 0; border: 0; border-bottom: 1px solid #d8d8d8; background: transparent; font-size: 18px; outline: none; border-radius: 0; transition: border-color .25s; -webkit-appearance: none; appearance: none; }
.ut-search input::-webkit-search-cancel-button { -webkit-appearance: none; }
.ut-search input::placeholder { color: #a2a2a2; }
.ut-search input:focus { border-bottom-color: var(--ink); }
.ut-search input[aria-invalid="true"] { border-bottom-color: #a2412e; }
.ut-search button { position: absolute; right: 0; top: 4px; width: 48px; height: 48px; display: grid; place-items: center; transition: opacity .2s; }
.ut-search button:hover { opacity: .55; }
.ut-search-msg { min-height: 20px; margin-top: 8px; font-size: 13px; color: #a2412e; }

.ut-quick { margin-top: 18px; max-width: 520px; border-top: 1px solid var(--line); }
.ut-quick a { display: grid; grid-template-columns: 44px 1fr auto; align-items: center; height: 58px; border-bottom: 1px solid var(--line); font-size: 13px; letter-spacing: .16em; text-transform: uppercase; }
.ut-qn { font-size: 11px; color: var(--muted); letter-spacing: .14em; }
.ut-ql { transition: transform .45s var(--ease); }
.ut-qa { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; transition: background .35s var(--ease), color .35s var(--ease); }
.ut-qa svg { transform: rotate(-45deg); transition: transform .45s var(--ease); }
.ut-quick a:hover .ut-ql, .ut-quick a:focus-visible .ut-ql { transform: translateX(8px); }
.ut-quick a:hover .ut-qa, .ut-quick a:focus-visible .ut-qa { background: var(--ink); color: #fff; }
.ut-quick a:hover .ut-qa svg, .ut-quick a:focus-visible .ut-qa svg { transform: none; }

.ut-nf-fig { margin: 0; }
.ut-nf-media { aspect-ratio: 4 / 5; clip-path: inset(12% 12% 12% 12%); transition: clip-path 1.4s var(--ease); }
.ut-nf-media img { transform: scale(1.12); transition: transform 1.6s var(--ease); }
.ut-nf-fig.in .ut-nf-media { clip-path: inset(0 0 0 0); }
.ut-nf-fig.in .ut-nf-media img { transform: scale(1); }
.ut-nf-fig figcaption { margin-top: 16px; font-size: 13px; color: var(--muted); max-width: 30em; opacity: 0; transition: opacity 1s var(--ease) .7s; }
.ut-nf-fig.in figcaption { opacity: 1; }
.ut-nf-eyebrow, .ut-nf-lead, .ut-search, .ut-quick { opacity: 0; transform: translateY(16px); transition: opacity .9s var(--ease), transform .9s var(--ease); }
.ut-nf.in .ut-nf-eyebrow { opacity: 1; transform: none; }
.ut-nf.in .ut-nf-lead { opacity: 1; transform: none; transition-delay: .45s; }
.ut-nf.in .ut-search { opacity: 1; transform: none; transition-delay: .55s; }
.ut-nf.in .ut-quick { opacity: 1; transform: none; transition-delay: .65s; }
.ut-best-sec { padding-top: clamp(48px, 6vw, 90px); border-top: 1px solid var(--line); margin: 0 var(--pad); padding-left: 0; padding-right: 0; }

/* =================== Coming soon (standalone) =================== */
.ut-cs-body { overflow-x: hidden; }
.ut-cs { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); min-height: 100vh; min-height: 100svh; }
.ut-cs-pic { position: relative; overflow: hidden; }
.ut-cs-media { position: absolute; inset: 0; }
.ut-cs-media img { object-position: 50% 30%; transform: scale(1.08); transition: transform 2.4s var(--ease), opacity .6s; }
.ut-cs.in .ut-cs-media img { transform: scale(1); }
.ut-cs-pic::after { content: ""; position: absolute; inset: 0; background: #fff; transform-origin: top; transition: transform 1.3s var(--ease); pointer-events: none; }
.ut-cs.in .ut-cs-pic::after { transform: scaleY(0); }
.ut-cs-tag { position: absolute; left: var(--pad); bottom: 28px; z-index: 2; font-size: 11px; letter-spacing: .26em; text-transform: uppercase; color: var(--ink); }
.ut-cs-panel { display: flex; flex-direction: column; justify-content: space-between; padding: 36px var(--pad) 32px clamp(32px, 6vw, 96px); min-height: 100vh; min-height: 100svh; }
.ut-cs-top { display: flex; justify-content: space-between; align-items: center; }
.ut-cs-mark { font-family: var(--serif); font-size: 30px; letter-spacing: .32em; text-transform: uppercase; line-height: 1; }
.ut-cs-back { font-size: 12px; }
.ut-cs-body-in { padding: 56px 0; max-width: 560px; }
.ut-cs-title { font-size: clamp(88px, 11vw, 168px); line-height: .88; letter-spacing: -.03em; margin-top: 22px; font-style: italic; }
.ut-cs-lead { margin-top: 26px; max-width: 30em; font-size: 17px; color: var(--muted); }
.ut-cs-in { opacity: 0; transform: translateY(18px); transition: opacity 1s var(--ease), transform 1s var(--ease); transition-delay: calc(var(--d) * .12s + .35s); }
.ut-cs.in .ut-cs-in { opacity: 1; transform: none; }

.ut-cd { display: grid; grid-template-columns: repeat(4, 1fr); margin-top: 48px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.ut-cd-cell { padding: 22px 0 18px; text-align: left; }
.ut-cd-cell + .ut-cd-cell { border-left: 1px solid var(--line); padding-left: clamp(14px, 1.8vw, 24px); }
.ut-cd-n { display: block; font-family: var(--serif); font-size: clamp(40px, 4.2vw, 62px); line-height: 1; font-variant-numeric: tabular-nums lining-nums; }
.ut-cd-l { display: block; margin-top: 10px; font-size: 11px; letter-spacing: .24em; text-transform: uppercase; color: var(--muted); }
.ut-cd.done .ut-cd-n { color: var(--muted); }

.ut-notify { margin-top: 40px; }
.ut-notify-h { font-size: 15px; }
.ut-notify-row { display: flex; gap: 14px; align-items: flex-end; margin-top: 16px; }
.ut-notify-row input { flex: 1; min-width: 0; height: 52px; padding: 0; border: 0; border-bottom: 1px solid #d8d8d8; background: transparent; font-size: 17px; outline: none; border-radius: 0; transition: border-color .25s; }
.ut-notify-row input::placeholder { color: #a2a2a2; }
.ut-notify-row input:focus { border-bottom-color: var(--ink); }
.ut-notify-row input[aria-invalid="true"] { border-bottom-color: #a2412e; }
.ut-notify-row .btn { flex: none; }
.ut-notify-err { min-height: 20px; margin-top: 8px; font-size: 13px; color: #a2412e; }
.ut-notify-note { font-size: 12px; color: var(--muted); }
.ut-notify-ok { margin-top: 40px; padding: 28px 0 0; border-top: 1px solid var(--ink); outline: none; animation: ut-rise .8s var(--ease) both; }
.ut-notify-ok-h { margin: 14px 0 18px; font-family: var(--serif); font-size: clamp(26px, 2.4vw, 34px); line-height: 1.15; }
.ut-notify-ok-h span { font-style: italic; word-break: break-all; }
@keyframes ut-rise { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }

.ut-cs-foot { display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; font-size: 12px; letter-spacing: .16em; text-transform: uppercase; color: var(--muted); }
.ut-cs-ig { display: inline-flex; align-items: center; gap: 10px; color: var(--ink); transition: opacity .25s; }
.ut-cs-ig:hover { opacity: .55; }

/* =================== Newsletter demo page =================== */
.ut-nd { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); gap: clamp(32px, 6vw, 110px); align-items: center; padding: clamp(56px, 7vw, 110px) var(--pad); }
.ut-nd h1 { font-size: clamp(54px, 6.4vw, 96px); line-height: .95; letter-spacing: -.02em; margin-top: 20px; }
.ut-nd-lead { margin-top: 24px; max-width: 32em; font-size: 17px; color: var(--muted); }
.ut-nd-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 36px; }
.ut-nd-state { margin-top: 18px; font-size: 13px; color: var(--muted); }
.ut-nd .media { aspect-ratio: 4 / 5; }
.ut-nd-list { display: grid; grid-template-columns: repeat(3, 1fr); gap: 40px; border-top: 1px solid var(--line); padding-top: 48px; }
.ut-nd-list h3 { font-size: 30px; margin: 12px 0 10px; }
.ut-nd-list p:not(.eyebrow) { color: var(--muted); }
.ut-nd-note { margin-top: 56px; max-width: 46em; color: var(--muted); font-size: 15px; }

/* =================== Responsive =================== */
@media (max-width: 1080px) {
  .ut-nf { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 820px) {
  .ut-nf { grid-template-columns: 1fr; gap: 44px; padding-top: 44px; }
  .ut-nf-fig { max-width: 520px; }
  .ut-nf-media { aspect-ratio: 5 / 4; }
  .ut-best-sec { margin: 0; padding-left: var(--pad); padding-right: var(--pad); }
  .ut-cs { grid-template-columns: 1fr; }
  .ut-cs-pic { height: 54vh; height: 54svh; min-height: 340px; }
  .ut-cs-panel { min-height: 0; padding: 28px var(--pad) 28px; }
  .ut-cs-top { position: absolute; top: 22px; left: var(--pad); right: var(--pad); color: #fff; z-index: 3; }
  .ut-cs-top .ulink { color: #fff; }
  .ut-cs-mark { text-shadow: 0 1px 14px rgba(0, 0, 0, 0.2); }
  .ut-cs-body-in { padding: 14px 0 48px; }
  .ut-cs-tag { bottom: 18px; }
  .ut-nd { grid-template-columns: 1fr; }
  .ut-nd-list { grid-template-columns: 1fr; gap: 28px; }
}
@media (max-width: 560px) {
  .ut-nf-title { font-size: clamp(48px, 13vw, 64px); }
  .ut-nf-lead, .ut-cs-lead { font-size: 16px; }
  .ut-cd-cell + .ut-cd-cell { padding-left: 12px; }
  .ut-cd-n { font-size: 38px; }
  .ut-cd-l { font-size: 10px; letter-spacing: .18em; }
  .ut-notify-row { flex-direction: column; align-items: stretch; gap: 16px; }
  .ut-notify-row input { flex: none; width: 100%; }
  .ut-notify-row .btn { width: 100%; }
  .ut-cs-foot { flex-direction: column; gap: 10px; }
}
@media (prefers-reduced-motion: reduce) {
  .ut-nf-title .ut-ln, .ut-nf-media, .ut-nf-media img, .ut-nf-fig figcaption, .ut-nf-eyebrow, .ut-nf-lead, .ut-search, .ut-quick,
  .ut-cs-media img, .ut-cs-pic::after, .ut-cs-in, .ut-notify-ok { transition: none !important; animation: none !important; }
  .ut-nf-title .ut-ln, .ut-nf-eyebrow, .ut-nf-lead, .ut-search, .ut-quick, .ut-cs-in { opacity: 1; transform: none; }
  .ut-nf-media { clip-path: none; } .ut-nf-media img, .ut-cs-media img { transform: none; } .ut-nf-fig figcaption { opacity: 1; }
  .ut-cs-pic::after { display: none; }
}

/* ===== Page speed: LCP-safe entrance states =====
   Entrance animations start at 1% opacity instead of 0 (invisible to the eye) so the browser can
   register the first paint of above-the-fold content before the deferred script reveals it.
   Same selectors as the originals, so the revealed states (.rv.in etc.) still win. */
@media (prefers-reduced-motion: no-preference) {
  .rv { opacity: .01; }
  .gl-hero .gl-bg img, .gl-hero .gl-big, .gl-hero .gl-words span { opacity: .01; }
}
@keyframes glHeroZoom { from { opacity: .01; transform: scale(1.14); } to { opacity: 1; transform: none; } }
@keyframes glHeroRise { from { opacity: .01; translate: 0 45%; } to { opacity: 1; translate: 0 0; } }
@keyframes glHeroWord { from { opacity: .01; translate: 0 14px; } to { opacity: 1; translate: 0 0; } }