/*
Theme Name: Relle
Theme URI: https://www.relle.com.ng
Author: Relle
Description: Contemporary luxury fashion house theme for Relle — WooCommerce-ready, with editable brand content, collections, and delivery. Clothing you in perfection.
Version: 4.1.0
Requires at least: 6.0
Requires PHP: 7.4
License: GNU General Public License v2 or later
Text Domain: relle
Tags: fashion, ecommerce, woocommerce, custom-colors, custom-menu, custom-logo, featured-images
WC requires at least: 7.0
WC tested up to: 9.0
*/

:root{
    --burgundy:#771011;
    --burgundy-deep:#5e0d0e;
    --bg:#f2efe9;
    --ink:#121010;
    --charcoal:#121010;
    --tan:#b38f6f;
    --tan-soft:#c7ac93;
    --muted-txt:#8a7d72;
    --line:#e0d9cf;
    --card:#f8f5ef;
    --white:#ffffff;
    --display:"Cormorant Garamond",Georgia,serif;
    --body:"Outfit",system-ui,sans-serif;
  }
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--ink);font-family:var(--body);font-weight:300;line-height:1.65;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
.wrap{max-width:1320px;margin:0 auto;padding:0 36px}
.eyebrow{font-size:11px;letter-spacing:.34em;text-transform:uppercase;color:var(--muted-txt)}
/* Announcement */
  .announce{background:var(--burgundy);color:#f2efe9;text-align:center;font-size:11.5px;letter-spacing:.28em;text-transform:uppercase;padding:11px}
/* Header */
  header{position:sticky;top:0;z-index:60;background:rgba(243,240,236,.86);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.nav{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;height:86px}
.menu{display:flex;gap:34px;font-size:12px;letter-spacing:.16em;text-transform:uppercase}
.menu>a,.menu>.has-dd>.dd-trigger{position:relative;padding:6px 0;color:var(--ink);background:none;border:none;font-family:var(--body);font-size:12px;letter-spacing:.16em;text-transform:uppercase;cursor:pointer;display:inline-flex;align-items:center;gap:6px;line-height:1}
.menu>a::after,.menu>.has-dd>.dd-trigger::after{content:"";position:absolute;left:0;bottom:0;width:0;height:1px;background:var(--ink);transition:width .35s}
.menu>a:hover::after,.menu>.has-dd:hover>.dd-trigger::after{width:100%}
.dd-trigger .caret{font-size:8px;transition:transform .3s;border:none;background:none}
.has-dd{position:relative}
.has-dd:hover .caret{transform:rotate(180deg)}
.dd{position:absolute;top:100%;left:50%;transform:translateX(-50%) translateY(8px);min-width:210px;background:var(--card);border:1px solid var(--line);padding:14px 0;opacity:0;visibility:hidden;transition:.28s;box-shadow:0 24px 50px -30px rgba(18,16,16,.45);z-index:70}
.has-dd:hover .dd,.has-dd:focus-within .dd{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0)}
.dd a{display:block;padding:10px 26px;font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink);transition:.25s;white-space:nowrap}
.dd a:hover{background:var(--bg);color:var(--burgundy);padding-left:32px}
.brand{justify-self:center}
.brand img{height:52px;width:auto}
.nav-r{justify-self:end;display:flex;gap:26px;font-size:12px;letter-spacing:.14em;text-transform:uppercase}
.cart{position:relative}
.cart-count{position:absolute;top:-9px;right:-13px;background:var(--ink);color:var(--bg);font-size:9px;width:16px;height:16px;border-radius:50%;display:grid;place-items:center;letter-spacing:0}
.burger{display:none;flex-direction:column;gap:5px;background:none;border:none;cursor:pointer;justify-self:start}
.burger span{width:24px;height:1.5px;background:var(--ink)}
/* Hero */
  .hero{position:relative;min-height:90vh;display:flex;align-items:center;overflow:hidden;background:var(--card)}
.hero-grid{position:relative;z-index:2;width:100%;display:grid;grid-template-columns:1fr 1fr;gap:0;align-items:center}
.hero-copy{padding:0 60px}
.hero-copy .eyebrow{margin-bottom:26px}
.hero h1{font-family:var(--display);font-weight:300;font-size:clamp(48px,6.4vw,92px);line-height:.98;letter-spacing:-.01em}
.hero h1 em{font-style:italic;color:var(--tan)}
.hero-copy p{max-width:38ch;color:var(--muted-txt);font-size:16px;margin:28px 0 38px}
.hero-img{position:relative;height:90vh;min-height:560px}
.hero-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero-mark{position:absolute;left:60px;bottom:44px;z-index:3;font-family:var(--display);font-style:italic;font-size:19px;color:var(--muted-txt)}
.btn{display:inline-flex;align-items:center;gap:12px;font-size:12px;letter-spacing:.2em;text-transform:uppercase;padding:17px 40px;border:1px solid var(--ink);border-radius:0;transition:.35s;cursor:pointer;background:none;color:var(--ink);font-family:var(--body)}
.btn:hover{background:var(--ink);color:var(--bg)}
.btn.light{border-color:#efeae1;color:#efeae1}
.btn.light:hover{background:#efeae1;color:var(--ink)}
.btn.filled{background:var(--burgundy);color:#f2efe9;border-color:var(--burgundy)}
.btn.filled:hover{background:var(--burgundy-deep);border-color:var(--burgundy-deep);color:#fff}
.link-u{font-size:12px;letter-spacing:.18em;text-transform:uppercase;border-bottom:1px solid currentColor;padding-bottom:3px}
/* Marquee */
  .strip{border-top:1px solid var(--line);border-bottom:1px solid var(--line);overflow:hidden;white-space:nowrap;padding:22px 0;background:var(--bg)}
.strip-track{display:inline-flex;animation:scroll 30s linear infinite;font-family:var(--display);font-style:italic;font-size:24px;color:var(--ink)}
.strip-track span{display:inline-flex;align-items:center}
.strip-track span::after{content:"◆";font-style:normal;font-size:9px;color:var(--tan);margin:0 46px}
@keyframes scroll{to{transform:translateX(-50%)}}
.sec{padding:110px 0}
.sec-head{display:flex;align-items:flex-end;justify-content:space-between;gap:30px;margin-bottom:56px;flex-wrap:wrap}
.sec-head h2{font-family:var(--display);font-weight:300;font-size:clamp(34px,4.6vw,58px);line-height:1.02;letter-spacing:-.01em}
.sec-head h2 em{font-style:italic;color:var(--tan)}
.sec-head .eyebrow{margin-bottom:18px}
/* Carousel */
  .track{display:flex;gap:30px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:8px;scrollbar-width:none}
.track::-webkit-scrollbar{display:none}
.card{flex:0 0 clamp(270px,29vw,380px);scroll-snap-align:start}
.card .frame{position:relative;aspect-ratio:3/4;overflow:hidden;background:var(--card)}
.card .frame img{width:100%;height:100%;object-fit:cover;object-position:top center;transition:transform 1.1s cubic-bezier(.19,1,.22,1)}
.card:hover .frame img{transform:scale(1.05)}
.tag{position:absolute;top:15px;left:15px;background:rgba(251,249,245,.92);font-size:10px;letter-spacing:.16em;text-transform:uppercase;padding:7px 13px;color:var(--ink)}
.wish{position:absolute;top:13px;right:13px;width:34px;height:34px;border-radius:50%;background:rgba(251,249,245,.9);display:grid;place-items:center;font-size:15px;color:var(--ink);cursor:pointer;transition:.3s}
.wish:hover{background:var(--ink);color:var(--bg)}
.quick{position:absolute;inset:auto 0 0;transform:translateY(100%);transition:.4s;background:var(--burgundy);color:#f2efe9;text-align:center;padding:15px;font-size:11px;letter-spacing:.2em;text-transform:uppercase}
.card:hover .quick{transform:none}
.card .meta{padding-top:18px}
.card .name{font-family:var(--display);font-size:23px;font-weight:400}
.card .row{display:flex;justify-content:space-between;align-items:baseline;margin-top:4px}
.card .cat{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted-txt)}
.card .price{font-size:15px;letter-spacing:.02em}
.car-ctrl{display:flex;gap:12px;margin-top:44px}
.car-ctrl button{width:54px;height:54px;border:1px solid var(--line);background:none;cursor:pointer;font-size:16px;transition:.3s}
.car-ctrl button:hover{background:var(--ink);color:var(--bg);border-color:var(--ink)}
/* Editorial split */
  .edit{display:grid;grid-template-columns:1fr 1fr;align-items:stretch;background:var(--burgundy);color:#f2efe9;overflow:hidden}
.edit .img{min-height:560px}
.edit .img img{width:100%;height:100%;object-fit:cover}
.edit .body{padding:clamp(44px,6vw,92px);display:flex;flex-direction:column;justify-content:center}
.edit .eyebrow{color:var(--tan-soft)}
.edit h2{font-family:var(--display);font-weight:300;font-size:clamp(32px,4vw,52px);line-height:1.06;margin:22px 0 24px}
.edit h2 em{font-style:italic}
.edit p{color:#e4d9d0;max-width:46ch;margin-bottom:36px}
/* Category tiles */
  .cats{display:grid;grid-template-columns:repeat(5,1fr);gap:20px}
.tile{position:relative;aspect-ratio:4/5;overflow:hidden}
.tile img{width:100%;height:100%;object-fit:cover;object-position:top center;transition:transform 1.2s cubic-bezier(.19,1,.22,1)}
.tile:hover img{transform:scale(1.06)}
.tile::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(30,28,24,.55),transparent 55%)}
.tile .lbl{position:absolute;left:20px;bottom:20px;z-index:2;color:#f6f2ea}
.tile .lbl h3{font-family:var(--display);font-weight:400;font-size:25px;line-height:1}
.tile .lbl span{font-size:11px;letter-spacing:.18em;text-transform:uppercase;opacity:.85}
/* Values row */
  .values{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;background:var(--line);border:1px solid var(--line)}
.val{background:var(--bg);padding:48px 40px;text-align:center}
.val .n{font-family:var(--display);font-style:italic;font-size:34px;color:var(--tan)}
.val h4{font-size:12px;letter-spacing:.2em;text-transform:uppercase;margin:16px 0 10px}
.val p{font-size:14px;color:var(--muted-txt);max-width:32ch;margin:0 auto}
/* Story */
  .story-grid{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center}
.story-copy h2{font-family:var(--display);font-weight:300;font-size:clamp(32px,4.2vw,54px);line-height:1.04;margin:20px 0 26px}
.story-copy h2 em{font-style:italic;color:var(--tan)}
.story-copy p{color:var(--muted-txt);max-width:48ch;margin-bottom:20px}
.story-img{aspect-ratio:4/5;overflow:hidden}
.story-img img{width:100%;height:100%;object-fit:cover;object-position:top center}
/* Designer */
  .designer{display:grid;grid-template-columns:.9fr 1.1fr;gap:70px;align-items:center}
.designer-img{aspect-ratio:3/4;overflow:hidden}
.designer-img img{width:100%;height:100%;object-fit:cover;object-position:top center}
.designer-copy h2{font-family:var(--display);font-weight:300;font-size:clamp(34px,4.6vw,58px);line-height:1;margin:18px 0 6px}
.designer-copy h2 em{font-style:italic;color:var(--tan)}
.designer-copy .lede{font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--muted-txt);margin-bottom:26px}
.designer-copy p{color:var(--muted-txt);max-width:50ch;margin-bottom:20px}
/* Collections feature */
  .collab{display:grid;grid-template-columns:1fr 1fr;gap:26px}
.collab-card{display:block;background:var(--card);border:1px solid var(--line);overflow:hidden;transition:box-shadow .4s}
.collab-card:hover{box-shadow:0 20px 50px -30px rgba(18,16,16,.4)}
.collab-img{aspect-ratio:16/11;overflow:hidden}
.collab-img img{width:100%;height:100%;object-fit:cover;object-position:top center;transition:transform 1.1s cubic-bezier(.19,1,.22,1)}
.collab-card:hover .collab-img img{transform:scale(1.05)}
.collab-body{padding:38px}
.collab-no{font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--tan)}
.collab-body h3{font-family:var(--display);font-weight:300;font-size:clamp(30px,3.4vw,44px);line-height:1;margin:12px 0 16px}
.collab-body p{color:var(--muted-txt);margin-bottom:22px;max-width:44ch}
/* New In band */
  .newin{background:var(--burgundy);color:#f2efe9;padding:96px 0}
.newin-inner{display:grid;grid-template-columns:.85fr 1.15fr;gap:60px;align-items:center}
.newin-copy .eyebrow{color:var(--tan-soft)}
.newin-copy h2{font-family:var(--display);font-weight:300;font-size:clamp(34px,4.4vw,56px);line-height:1.02;margin:18px 0 22px}
.newin-copy h2 em{font-style:italic}
.newin-copy p{color:#e4d9d0;max-width:38ch;margin-bottom:32px}
.newin-copy .btn.filled{background:#f2efe9;color:var(--burgundy);border-color:#f2efe9}
.newin-copy .btn.filled:hover{background:transparent;color:#f2efe9}
.newin-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.newin-item{cursor:pointer}
.newin-item .fr{aspect-ratio:3/4;overflow:hidden;background:rgba(255,255,255,.06)}
.newin-item img{width:100%;height:100%;object-fit:cover;object-position:top center;transition:transform 1s cubic-bezier(.19,1,.22,1)}
.newin-item:hover img{transform:scale(1.05)}
.newin-item .nm{font-family:var(--display);font-size:16px;margin-top:10px;line-height:1.15}
.newin-item .pr{font-size:12px;color:#d9cbc4;margin-top:2px}
/* Journal */
  .journal-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:30px}
.jcard{cursor:pointer;display:flex;flex-direction:column}
.jcard .jimg{aspect-ratio:3/2;overflow:hidden;background:var(--card);margin-bottom:22px}
.jcard .jimg img{width:100%;height:100%;object-fit:cover;object-position:top center;transition:transform 1.1s cubic-bezier(.19,1,.22,1)}
.jcard:hover .jimg img{transform:scale(1.05)}
.jcard .jno{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--tan)}
.jcard h3{font-family:var(--display);font-weight:400;font-size:26px;line-height:1.12;margin:12px 0 12px}
.jcard p{color:var(--muted-txt);font-size:14px;line-height:1.65;margin-bottom:16px}
.jcard .link-u{align-self:flex-start;margin-top:auto}
/* Quote */
  .quote{text-align:center;padding:130px 0;background:var(--card)}
.quote blockquote{font-family:var(--display);font-weight:300;font-style:italic;font-size:clamp(28px,3.6vw,46px);line-height:1.3;max-width:22ch;margin:28px auto 0}
.quote .mark{height:64px;width:auto;margin:0 auto;opacity:.9}
/* Newsletter */
  .news{padding:clamp(52px,7vw,100px);text-align:center;border:1px solid var(--line);background:var(--card)}
.news h2{font-family:var(--display);font-weight:300;font-size:clamp(32px,4.2vw,54px)}
.news p{color:var(--muted-txt);margin:18px auto 36px;max-width:40ch}
.field{display:flex;max-width:480px;margin:0 auto;border-bottom:1px solid var(--ink)}
.field input{flex:1;background:none;border:none;font-family:var(--body);font-size:15px;padding:15px 4px;outline:none;color:var(--ink)}
.field input::placeholder{color:var(--muted-txt)}
.field button{background:none;border:none;font-size:12px;letter-spacing:.2em;text-transform:uppercase;cursor:pointer;padding:0 10px}
/* Footer */
  footer{background:var(--burgundy-deep);color:#e4d9d0;padding:90px 0 40px}
.foot{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:44px}
.foot .logo img{height:56px;width:auto;margin-bottom:22px}
.foot .about{color:#c9b3ac;font-size:14px;max-width:32ch}
.foot-social{display:flex;flex-direction:column;gap:9px;margin-top:22px}
.foot-social a{font-size:13px;letter-spacing:.03em;color:var(--tan-soft);transition:color .3s}
.foot-social a:hover{color:#ffffff}
.foot h4{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--tan-soft);margin-bottom:22px}
.foot ul{list-style:none;display:flex;flex-direction:column;gap:13px;font-size:14px}
.foot a:hover{color:#ffffff}
.foot-contact{font-style:normal;font-size:13px;line-height:1.7;color:#c9b3ac;margin-top:22px}
.foot-contact a{color:var(--tan-soft)}
.foot-contact a:hover{color:#ffffff}
.foot-bot{display:flex;justify-content:space-between;margin-top:70px;padding-top:28px;border-top:1px solid rgba(242,239,233,.18);font-size:12.5px;color:#b89a94;letter-spacing:.04em;flex-wrap:wrap;gap:12px}
.foot-bot .socials a:hover{color:#ffffff}
.reveal{opacity:0;transform:translateY(26px);transition:opacity 1s ease,transform 1s ease}
.reveal.in{opacity:1;transform:none}
@media(max-width:1200px){
    .cats{grid-template-columns:repeat(3,1fr)}
  }
/* Mobile drawer */
  .m-overlay{position:fixed;inset:0;background:rgba(18,16,16,.4);opacity:0;visibility:hidden;transition:.35s;z-index:90}
.m-overlay.open{opacity:1;visibility:visible}
.m-drawer{position:fixed;top:0;left:0;height:100%;width:min(340px,86vw);background:var(--bg);z-index:100;transform:translateX(-100%);transition:transform .4s cubic-bezier(.4,0,.2,1);display:flex;flex-direction:column;overflow-y:auto}
.m-drawer.open{transform:none}
.m-drawer-head{display:flex;align-items:center;justify-content:space-between;padding:24px 26px;border-bottom:1px solid var(--line)}
.m-drawer-head img{height:40px}
.m-close{background:none;border:none;font-size:24px;cursor:pointer;color:var(--ink);line-height:1}
.m-nav{padding:14px 0;flex:1}
.m-nav>a,.m-sec>.m-sec-t{display:flex;justify-content:space-between;align-items:center;width:100%;padding:16px 26px;font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink);background:none;border:none;font-family:var(--body);cursor:pointer;text-align:left}
.m-sec-panel{max-height:0;overflow:hidden;transition:max-height .35s ease;background:var(--card)}
.m-sec.open .m-sec-panel{max-height:400px}
.m-sec.open .m-sec-t .caret{transform:rotate(180deg)}
.m-sec-panel a{display:block;padding:12px 26px 12px 40px;font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted-txt)}
.m-sec-panel a:hover{color:var(--burgundy)}
.m-drawer-foot{padding:22px 26px;border-top:1px solid var(--line);display:flex;flex-direction:column;gap:14px;font-size:12px;letter-spacing:.12em;text-transform:uppercase}
.m-drawer-foot a{color:var(--ink)}
@media(max-width:960px){
    .nav{grid-template-columns:1fr auto 1fr}
    .menu,.nav-r .search,.nav-r a[aria-label="Wishlist"]{display:none}
    .burger{display:flex}
    .hero-grid{grid-template-columns:1fr}
    .hero-img{display:none}
    .hero-copy{padding:70px 0}
    .edit{grid-template-columns:1fr}
    .edit .img{min-height:360px}
    .cats{grid-template-columns:repeat(2,1fr)}
    .values{grid-template-columns:1fr}
    .story-grid,.designer{grid-template-columns:1fr;gap:36px}
    .designer .designer-img{order:-1}
    .collab{grid-template-columns:1fr}
    .newin-inner{grid-template-columns:1fr;gap:40px}
    .newin-grid{grid-template-columns:repeat(4,1fr)}
    .journal-grid{grid-template-columns:1fr}
    .foot{grid-template-columns:1fr 1fr}
  }
@media(max-width:560px){
    .wrap{padding:0 22px}
    .newin-grid{grid-template-columns:repeat(2,1fr)}
    .foot{grid-template-columns:1fr}
  }
@media(prefers-reduced-motion:reduce){
    *{animation:none!important;transition:none!important}
    .reveal{opacity:1;transform:none}
  }
.designer-img{aspect-ratio:4/5;overflow:hidden}
@media(max-width:960px){
    .nav{grid-template-columns:1fr auto 1fr}
    .menu,.nav-r .search,.nav-r a[aria-label="Wishlist"]{display:none}
    .burger{display:flex}
    .hero-grid{grid-template-columns:1fr}
    .hero-img{display:none}
    .hero-copy{padding:70px 0}
    .edit{grid-template-columns:1fr}
    .edit .img{min-height:360px}
    .cats{grid-template-columns:repeat(2,1fr)}
    .values{grid-template-columns:1fr}
    .story-grid,.designer{grid-template-columns:1fr;gap:36px}
    .designer .designer-img{order:-1}
    .foot{grid-template-columns:1fr 1fr}
  }
@media(max-width:560px){
    .wrap{padding:0 22px}
    .foot{grid-template-columns:1fr}
  }
/* ---- Category page ---- */
  .cat-hero{background:var(--card);border-bottom:1px solid var(--line);padding:56px 0 48px;text-align:center}
.breadcrumb{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--muted-txt);margin-bottom:22px}
.breadcrumb a:hover{color:var(--ink)}
.cat-hero h1{font-family:var(--display);font-weight:300;font-size:clamp(40px,6vw,74px);line-height:1;letter-spacing:-.01em}
.cat-hero p{color:var(--muted-txt);max-width:52ch;margin:20px auto 0;font-size:15px}
.toolbar{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:26px 0;border-bottom:1px solid var(--line);position:sticky;top:86px;background:rgba(242,239,233,.9);backdrop-filter:blur(10px);z-index:40;flex-wrap:wrap}
.filters{display:flex;gap:10px;flex-wrap:wrap}
.chip{font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;padding:10px 20px;border:1px solid var(--line);background:none;cursor:pointer;transition:.3s;color:var(--ink);font-family:var(--body)}
.chip:hover{border-color:var(--ink)}
.chip.active{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.toolbar-r{display:flex;align-items:center;gap:18px}
.count{font-size:12px;letter-spacing:.1em;color:var(--muted-txt);text-transform:uppercase}
.sort{position:relative}
.sort select{appearance:none;background:none;border:1px solid var(--line);font-family:var(--body);font-size:12px;letter-spacing:.12em;text-transform:uppercase;padding:11px 38px 11px 18px;cursor:pointer;color:var(--ink);outline:none}
.sort::after{content:"▾";position:absolute;right:16px;top:50%;transform:translateY(-50%);pointer-events:none;color:var(--muted-txt)}
.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:30px 26px;padding:52px 0 90px}
.p-card{cursor:pointer}
.p-card .frame{position:relative;aspect-ratio:3/4;overflow:hidden;background:var(--card)}
.p-card .frame img{width:100%;height:100%;object-fit:cover;object-position:top center;transition:opacity .5s ease,transform 1.1s cubic-bezier(.19,1,.22,1)}
.p-card .frame img.alt{position:absolute;inset:0;opacity:0}
.p-card:hover .frame img.main{opacity:0}
.p-card:hover .frame img.alt{opacity:1;transform:scale(1.04)}
.p-tag{position:absolute;top:14px;left:14px;background:rgba(248,245,239,.92);font-size:10px;letter-spacing:.16em;text-transform:uppercase;padding:6px 12px;color:var(--ink);z-index:2}
.p-tag.sold{background:var(--ink);color:var(--bg)}
.p-wish{position:absolute;top:12px;right:12px;width:34px;height:34px;border-radius:50%;background:rgba(248,245,239,.9);display:grid;place-items:center;font-size:15px;cursor:pointer;transition:.3s;z-index:2}
.p-wish:hover{background:var(--burgundy);color:#fff}
.p-quick{position:absolute;inset:auto 0 0;transform:translateY(100%);transition:.4s;background:var(--burgundy);color:#f2efe9;text-align:center;padding:14px;font-size:11px;letter-spacing:.2em;text-transform:uppercase}
.p-card:hover .p-quick{transform:none}
.p-meta{padding-top:15px}
.p-name{font-family:var(--display);font-size:21px;font-weight:400;line-height:1.1}
.p-row{display:flex;justify-content:space-between;align-items:baseline;margin-top:4px}
.p-cat{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted-txt)}
.p-price{font-size:14px}
.swatches{display:flex;gap:6px;margin-top:10px}
.swatch{width:13px;height:13px;border-radius:50%;border:1px solid var(--line)}
.loadmore{display:flex;justify-content:center;padding-bottom:100px}
@media(max-width:1100px){.grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:760px){
    .grid{grid-template-columns:repeat(2,1fr);gap:24px 16px}
    .toolbar{position:static}
    .filters{width:100%;overflow-x:auto;flex-wrap:nowrap;-webkit-overflow-scrolling:touch}
    .filters::-webkit-scrollbar{display:none}
  }
/* ---- Product page ---- */
  .pdp-breadcrumb{padding:26px 0 6px;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--muted-txt)}
.pdp-breadcrumb a:hover{color:var(--ink)}
.pdp{display:grid;grid-template-columns:1.15fr .85fr;gap:64px;padding:22px 0 100px;align-items:start}
/* Gallery */
  .gallery{display:grid;grid-template-columns:76px 1fr;gap:18px;position:sticky;top:110px}
.thumbs{display:flex;flex-direction:column;gap:12px}
.thumb{aspect-ratio:3/4;overflow:hidden;cursor:pointer;border:1px solid transparent;transition:border-color .3s}
.thumb img{width:100%;height:100%;object-fit:cover;object-position:top center}
.thumb.active{border-color:var(--ink)}
.stage{aspect-ratio:3/4;overflow:hidden;background:var(--card)}
.stage img{width:100%;height:100%;object-fit:cover;object-position:top center}
/* Info */
  .info{padding-top:6px}
.info .cat{font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--tan);margin-bottom:14px}
.info h1{font-family:var(--display);font-weight:300;font-size:clamp(34px,4.4vw,52px);line-height:1.02}
.info .price{font-size:20px;margin:18px 0 4px;letter-spacing:.02em}
.info .tax{font-size:12px;color:var(--muted-txt);letter-spacing:.04em}
.info .desc{color:var(--muted-txt);margin:26px 0 30px;max-width:46ch;line-height:1.7}
.opt-label{font-size:11px;letter-spacing:.18em;text-transform:uppercase;margin-bottom:12px;display:flex;justify-content:space-between;align-items:center}
.opt-label a{color:var(--tan);border-bottom:1px solid currentColor;padding-bottom:1px}
.colors{display:flex;gap:11px;margin-bottom:30px}
.c-swatch{width:30px;height:30px;border-radius:50%;cursor:pointer;border:1px solid var(--line);position:relative;transition:.25s}
.c-swatch.active{box-shadow:0 0 0 1px var(--bg),0 0 0 2px var(--ink)}
.sizes{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:30px}
.size{min-width:54px;padding:14px 8px;text-align:center;border:1px solid var(--line);font-size:13px;letter-spacing:.06em;cursor:pointer;transition:.25s;background:none;font-family:var(--body);color:var(--ink)}
.size:hover{border-color:var(--ink)}
.size.active{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.size.disabled{opacity:.35;cursor:not-allowed;text-decoration:line-through}
.buy{display:flex;gap:14px;align-items:stretch;margin-bottom:16px}
.qty{display:flex;align-items:center;border:1px solid var(--ink)}
.qty button{width:46px;height:100%;background:none;border:none;font-size:17px;cursor:pointer;color:var(--ink)}
.qty span{min-width:34px;text-align:center;font-size:14px}
.add{flex:1;background:var(--burgundy);color:#f2efe9;border:1px solid var(--burgundy);font-family:var(--body);font-size:12px;letter-spacing:.2em;text-transform:uppercase;padding:18px;cursor:pointer;transition:.3s}
.add:hover{background:var(--burgundy-deep);border-color:var(--burgundy-deep)}
.wishbtn{width:100%;background:none;border:1px solid var(--ink);font-family:var(--body);font-size:12px;letter-spacing:.2em;text-transform:uppercase;padding:16px;cursor:pointer;transition:.3s;color:var(--ink);margin-bottom:30px}
.wishbtn:hover{background:var(--ink);color:var(--bg)}
.assurances{display:flex;flex-direction:column;gap:12px;padding:24px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin-bottom:8px}
.assure{display:flex;gap:12px;align-items:center;font-size:13px;color:var(--muted-txt)}
.assure b{color:var(--ink);font-weight:400}
.assure .dot{width:6px;height:6px;border-radius:50%;background:var(--tan);flex:none}
.acc{border-bottom:1px solid var(--line)}
.acc summary{list-style:none;cursor:pointer;padding:22px 0;font-size:12px;letter-spacing:.16em;text-transform:uppercase;display:flex;justify-content:space-between;align-items:center}
.acc summary::-webkit-details-marker{display:none}
.acc summary::after{content:"+";font-size:18px;color:var(--muted-txt)}
.acc[open] summary::after{content:"–"}
.acc .acc-body{padding:0 0 22px;color:var(--muted-txt);font-size:14px;line-height:1.7;max-width:48ch}
.acc .acc-body ul{margin:8px 0 0 18px;display:flex;flex-direction:column;gap:6px}
/* Related */
  .related{padding:0 0 110px}
.related h2{font-family:var(--display);font-weight:300;font-size:clamp(28px,3.6vw,44px);margin-bottom:40px}
.related h2 em{font-style:italic;color:var(--tan)}
.rel-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:26px}
@media(max-width:900px){
    .pdp{grid-template-columns:1fr;gap:36px}
    .gallery{position:static;grid-template-columns:1fr}
    .thumbs{flex-direction:row;order:2}
    .thumb{width:70px;flex:none}
    .rel-grid{grid-template-columns:repeat(2,1fr)}
  }
@media(max-width:560px){.buy{flex-wrap:wrap}}
.blog-hero{background:var(--card);border-bottom:1px solid var(--line);padding:64px 0 56px;text-align:center}
.blog-hero .eyebrow{margin-bottom:20px}
.blog-hero h1{font-family:var(--display);font-weight:300;font-size:clamp(42px,6vw,78px);line-height:1}
.blog-hero p{color:var(--muted-txt);max-width:52ch;margin:20px auto 0}
.posts{max-width:760px;margin:0 auto;padding:90px 36px 40px}
.post{padding-bottom:70px;margin-bottom:70px;border-bottom:1px solid var(--line)}
.post:last-child{border-bottom:none}
.post .pno{font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--tan)}
.post-meta{display:flex;flex-wrap:wrap;gap:10px 18px;align-items:center;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted-txt);margin-top:14px}
.post-meta .cat-pill{color:var(--burgundy);border:1px solid var(--line);padding:5px 12px}
.post-meta .tags{color:var(--muted-txt)}
.post h2{font-family:var(--display);font-weight:300;font-size:clamp(30px,4.4vw,50px);line-height:1.06;margin:14px 0 10px}
.post .lead{font-family:var(--display);font-style:italic;font-size:20px;color:var(--muted-txt);margin-bottom:30px}
.post .figure{aspect-ratio:16/10;overflow:hidden;background:var(--card);margin:0 0 34px}
.post .figure img{width:100%;height:100%;object-fit:cover;object-position:top center}
.post p{margin-bottom:22px;color:#3a3631;line-height:1.85;font-size:16.5px}
.post p.drop::first-letter{font-family:var(--display);font-size:64px;line-height:.8;float:left;margin:6px 12px 0 0;color:var(--burgundy)}
.post .close{font-family:var(--display);font-style:italic;font-size:21px;color:var(--ink);border-left:2px solid var(--tan);padding-left:20px;margin-top:8px}
.backtop{text-align:center;padding:0 0 100px}
@media(max-width:560px){.posts{padding:60px 22px 30px}}
.page-hero{background:var(--card);border-bottom:1px solid var(--line);padding:56px 0 48px;text-align:center}
.page-hero .eyebrow{margin-bottom:18px}
.page-hero h1{font-family:var(--display);font-weight:300;font-size:clamp(40px,6vw,72px);line-height:1}
.cart-wrap{padding:70px 0 100px}
.cart-layout{display:grid;grid-template-columns:1.6fr .9fr;gap:56px;align-items:start}
.cart-empty{text-align:center;padding:80px 0}
.cart-empty p{color:var(--muted-txt);font-size:17px;margin-bottom:28px}
.cart-line{display:grid;grid-template-columns:96px 1fr auto;gap:22px;padding:26px 0;border-bottom:1px solid var(--line);align-items:center}
.cart-line .thumb{width:96px;aspect-ratio:3/4;overflow:hidden;background:var(--card)}
.cart-line .thumb img{width:100%;height:100%;object-fit:cover;object-position:top center}
.cart-line .info h3{font-family:var(--display);font-size:22px;font-weight:400;line-height:1.1}
.cart-line .info .m{font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted-txt);margin-top:5px}
.cart-line .info .rm{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted-txt);border:none;background:none;cursor:pointer;padding:0;margin-top:12px;border-bottom:1px solid var(--line)}
.cart-line .info .rm:hover{color:var(--burgundy);border-color:var(--burgundy)}
.cart-line .right{text-align:right;display:flex;flex-direction:column;align-items:flex-end;gap:14px}
.cart-line .price{font-size:15px}
.qbox{display:flex;align-items:center;border:1px solid var(--line)}
.qbox button{width:36px;height:36px;background:none;border:none;font-size:15px;cursor:pointer;color:var(--ink)}
.qbox span{min-width:30px;text-align:center;font-size:13px}
.summary{background:var(--card);border:1px solid var(--line);padding:36px;position:sticky;top:110px}
.summary h2{font-family:var(--display);font-weight:300;font-size:30px;margin-bottom:26px}
.fulfil{display:flex;flex-direction:column;gap:10px;margin-bottom:26px}
.fulfil-opt{text-align:left;background:var(--bg);border:1px solid var(--line);padding:15px 16px;cursor:pointer;font-family:var(--body);display:flex;flex-direction:column;gap:4px;transition:.25s}
.fulfil-opt:hover{border-color:var(--muted-txt)}
.fulfil-opt.active{border-color:var(--ink);background:var(--card)}
.fulfil-opt .fo-t{font-size:13px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink);display:flex;align-items:center;gap:8px}
.fulfil-opt .fo-s{font-size:12.5px;color:var(--muted-txt)}
.fo-free{font-size:10px;letter-spacing:.14em;background:var(--tan);color:var(--ink);padding:3px 8px;border-radius:2px}
.srow{display:flex;justify-content:space-between;font-size:14px;padding:11px 0;color:var(--muted-txt)}
.srow.total{border-top:1px solid var(--line);margin-top:12px;padding-top:20px;color:var(--ink);font-size:17px}
.srow.total b{font-weight:500}
.summary .btn{width:100%;justify-content:center;margin-top:26px}
.summary .note{font-size:12px;color:var(--muted-txt);text-align:center;margin-top:16px;line-height:1.6}
.ship-hint{font-size:12.5px;color:var(--tan);letter-spacing:.04em;margin-top:8px;text-align:center}
@media(max-width:860px){.cart-layout{grid-template-columns:1fr;gap:36px}.summary{position:static}}
.acct-wrap{padding:70px 0 100px}
.acct-grid{display:grid;grid-template-columns:1fr 1fr;gap:56px;max-width:900px;margin:0 auto}
.acct-card{border:1px solid var(--line);padding:44px;background:var(--card)}
.acct-card h2{font-family:var(--display);font-weight:300;font-size:32px;margin-bottom:10px}
.acct-card p.sub{color:var(--muted-txt);font-size:14px;margin-bottom:28px}
.field-row{margin-bottom:20px}
.field-row label{display:block;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted-txt);margin-bottom:8px}
.field-row input{width:100%;background:var(--bg);border:1px solid var(--line);padding:14px 16px;font-family:var(--body);font-size:15px;color:var(--ink);outline:none;transition:border-color .3s}
.field-row input:focus{border-color:var(--ink)}
.acct-card .btn{width:100%;justify-content:center;margin-top:8px}
.acct-card .minor{font-size:12.5px;color:var(--muted-txt);margin-top:18px;text-align:center}
.acct-card .minor a{color:var(--tan);border-bottom:1px solid currentColor}
.acct-note{max-width:900px;margin:40px auto 0;text-align:center;color:var(--muted-txt);font-size:13px;line-height:1.7}
@media(max-width:800px){.acct-grid{grid-template-columns:1fr;gap:32px}}
.info-wrap{max-width:760px;margin:0 auto;padding:80px 36px 100px}
.info-block{margin-bottom:52px}
.info-block h2{font-family:var(--display);font-weight:300;font-size:clamp(26px,3.4vw,38px);line-height:1.1;margin-bottom:18px}
.info-block h2 .n{font-size:12px;letter-spacing:.24em;text-transform:uppercase;color:var(--tan);display:block;margin-bottom:12px}
.info-block p{color:#3a3631;line-height:1.85;font-size:16px;margin-bottom:16px}
.info-block ul{margin:8px 0 16px 20px;display:flex;flex-direction:column;gap:10px;color:#3a3631;font-size:16px;line-height:1.6}
.info-table{width:100%;border-collapse:collapse;margin:10px 0 8px}
.info-table th,.info-table td{text-align:left;padding:14px 16px;border-bottom:1px solid var(--line);font-size:14.5px}
.info-table th{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted-txt);font-weight:400}
.info-cta{border-top:1px solid var(--line);padding-top:40px;text-align:center}
.info-cta p{color:var(--muted-txt);margin-bottom:20px}
.page-hero p{color:var(--muted-txt);max-width:56ch;margin:20px auto 0;font-size:15px}
.del-wrap{max-width:840px;margin:0 auto;padding:56px 36px 100px}
.del-search{position:sticky;top:86px;background:var(--bg);padding:22px 0;z-index:30;border-bottom:1px solid var(--line);margin-bottom:8px}
.del-search input{width:100%;background:var(--card);border:1px solid var(--line);padding:16px 20px;font-family:var(--body);font-size:16px;color:var(--ink);outline:none;transition:border-color .3s}
.del-search input:focus{border-color:var(--ink)}
.pickup{display:flex;gap:24px;align-items:flex-start;background:var(--charcoal);color:#f2efe9;padding:34px 36px;margin-bottom:8px}
.pickup-tag{flex:none;font-size:11px;letter-spacing:.16em;text-transform:uppercase;background:var(--tan);color:var(--ink);padding:7px 14px;border-radius:2px;margin-top:4px}
.pickup-body h2{font-family:var(--display);font-weight:300;font-size:clamp(24px,3vw,32px);margin-bottom:12px;color:#fff}
.pickup-body p{color:#d8d2c6;font-size:15px;line-height:1.7;margin-bottom:16px;max-width:60ch}
.pickup-body p b{color:#fff;font-weight:500}
.pickup-addr{font-style:normal;font-size:13.5px;color:var(--tan-soft);line-height:1.7}
.pickup-addr a{color:var(--tan-soft);border-bottom:1px solid currentColor}
.pickup-addr a:hover{color:#fff}
@media(max-width:560px){.pickup{flex-direction:column;gap:16px;padding:26px 22px}}
.del-hint{font-size:12.5px;color:var(--muted-txt);margin-top:10px;text-align:center}
.zone{margin-top:44px}
.zone h2{font-family:var(--display);font-weight:300;font-size:clamp(26px,3.2vw,36px);margin-bottom:6px}
.zone .zc{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--tan);margin-bottom:18px}
.rate{display:flex;justify-content:space-between;align-items:center;padding:13px 4px;border-bottom:1px solid var(--line);font-size:15px}
.rate .area{color:var(--ink)}
.rate .fee{font-variant-numeric:tabular-nums;color:var(--ink);letter-spacing:.02em}
.rate.hidden{display:none}
.zone.empty{display:none}
.quote-zone .quote-row{display:flex;align-items:center;justify-content:space-between;gap:28px;background:var(--card);border:1px solid var(--line);padding:28px 30px;flex-wrap:wrap}
.quote-zone .quote-row p{color:var(--muted-txt);font-size:15px;line-height:1.7;max-width:52ch;margin:0}
.quote-zone .quote-row .btn{flex:none}
.flat-rate{padding:16px 4px}
.flat-rate .fee{font-weight:500}
.intl-picker{margin:6px 0 20px}
.intl-picker label{display:block;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted-txt);margin-bottom:10px}
.intl-picker select{width:100%;max-width:420px;appearance:none;background:var(--card);border:1px solid var(--line);font-family:var(--body);font-size:15px;padding:15px 44px 15px 18px;cursor:pointer;color:var(--ink);outline:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%238a7d72' fill='none' stroke-width='1.5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 18px center}
.intl-picker select:focus{border-color:var(--ink)}
.intl-table .box-row{display:grid;grid-template-columns:auto 1fr auto;gap:16px;align-items:baseline;padding:15px 4px;border-bottom:1px solid var(--line)}
.intl-table .box-no{font-family:var(--display);font-style:italic;font-size:22px;color:var(--tan);min-width:26px}
.intl-table .box-info .bi-dim{font-size:14px;color:var(--ink)}
.intl-table .box-info .bi-eg{font-size:12.5px;color:var(--muted-txt);margin-top:2px}
.intl-table .box-fee{font-size:15px;font-variant-numeric:tabular-nums;white-space:nowrap}
.intl-table .box-row.pick{background:var(--card)}
.intl-table .box-row.pick .bi-eg::after{content:" · typical garment";color:var(--tan)}
.intl-note{font-size:13px;color:var(--muted-txt);line-height:1.7;margin-top:20px;max-width:60ch}
.intl-note a{color:var(--tan);border-bottom:1px solid currentColor}
.noresult{text-align:center;color:var(--muted-txt);padding:50px 0;font-size:15px;display:none}
.del-note{background:var(--card);border:1px solid var(--line);padding:24px 26px;margin-top:44px;font-size:14px;color:var(--muted-txt);line-height:1.7}
.del-note b{color:var(--ink);font-weight:500}
.del-cta{text-align:center;padding:44px 0 0;border-top:1px solid var(--line);margin-top:44px}
.del-cta p{color:var(--muted-txt);margin-bottom:20px}

/* ================================================================
   RELLE WOOCOMMERCE OVERRIDES
   Override WooCommerce default styles to match Relle design.
   ================================================================ */

/* --- Grid layout: products in grid, not list --- */
.woocommerce ul.products,
ul.products {
	display: grid !important;
	grid-template-columns: repeat(4, 1fr) !important;
	gap: 32px !important;
	list-style: none !important;
	padding: 0 !important;
	margin: 0 !important;
}
@media (max-width: 1024px) {
	.woocommerce ul.products, ul.products { grid-template-columns: repeat(3, 1fr) !important; }
}
@media (max-width: 700px) {
	.woocommerce ul.products, ul.products { grid-template-columns: repeat(2, 1fr) !important; }
}

/* --- Product card base --- */
.woocommerce ul.products li.product,
.woocommerce ul.products li.product a {
	width: 100% !important;
	float: none !important;
	margin: 0 !important;
	padding: 0 !important;
}
.woocommerce ul.products li.product {
	display: flex;
	flex-direction: column;
}

/* --- Product images: portrait crop, no distortion --- */
.woocommerce ul.products li.product img,
.woocommerce .woocommerce-product-gallery img {
	width: 100% !important;
	height: auto !important;
	object-fit: cover !important;
	object-position: top center !important;
	aspect-ratio: 3/4 !important;
	display: block !important;
}

/* --- Remove WooCommerce default star ratings from grid --- */
.woocommerce ul.products .star-rating { display: none; }

/* --- Price: Relle style --- */
.woocommerce ul.products li.product .price,
.woocommerce div.product p.price,
.woocommerce div.product span.price {
	color: var(--ink) !important;
	font-family: var(--body) !important;
	font-size: 14px !important;
	font-weight: 400 !important;
}
.woocommerce ul.products li.product .price del {
	color: var(--muted-txt) !important;
	font-size: 12px !important;
}

/* --- Product title --- */
.woocommerce ul.products li.product .woocommerce-loop-product__title {
	font-family: var(--display) !important;
	font-size: 18px !important;
	font-weight: 400 !important;
	color: var(--ink) !important;
	padding: 12px 0 4px !important;
	line-height: 1.2 !important;
}

/* --- Add to cart button: Relle burgundy, not WooCommerce purple --- */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce #respond input#submit.alt {
	background: var(--ink) !important;
	color: var(--bg) !important;
	font-family: var(--body) !important;
	font-size: 11px !important;
	letter-spacing: .2em !important;
	text-transform: uppercase !important;
	border-radius: 0 !important;
	border: none !important;
	padding: 14px 24px !important;
	cursor: pointer !important;
	transition: background .3s !important;
}
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover {
	background: var(--burgundy) !important;
	color: #fff !important;
}

/* Single product layout is handled by .pdp-grid in the Relle PDP template. */

/* Single product title */
.woocommerce div.product .product_title {
	font-family: var(--display) !important;
	font-size: clamp(28px, 4vw, 48px) !important;
	font-weight: 300 !important;
	color: var(--ink) !important;
	margin-bottom: 16px !important;
	line-height: 1.1 !important;
}

/* Single product price */
.woocommerce div.product p.price,
.woocommerce div.product span.price {
	font-size: 20px !important;
	color: var(--burgundy) !important;
	font-family: var(--body) !important;
	margin-bottom: 20px !important;
}

/* Short description */
.woocommerce div.product .woocommerce-product-details__short-description {
	font-size: 15px !important;
	line-height: 1.7 !important;
	color: var(--muted-txt) !important;
	margin-bottom: 24px !important;
}

/* Relle size buttons */
.relle-sizes { margin: 20px 0; }
.relle-sizes-label {
	display: block;
	font-size: 11px;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: var(--muted-txt);
	margin-bottom: 10px;
}
.relle-size-btns { display: flex; flex-wrap: wrap; gap: 8px; }
.relle-size {
	padding: 10px 18px;
	background: var(--card);
	border: 1px solid var(--line);
	font-family: var(--body);
	font-size: 13px;
	cursor: pointer;
	color: var(--ink);
	transition: .25s;
	border-radius: 0;
}
.relle-size:hover { border-color: var(--ink); }
.relle-size.active { background: var(--ink); color: var(--bg); border-color: var(--ink); }

/* Production model line */
.relle-model {
	font-size: 12px;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--tan);
	margin-bottom: 8px;
}

/* Quantity + add to cart row */
.woocommerce div.product form.cart {
	display: flex !important;
	align-items: center !important;
	gap: 16px !important;
	margin-top: 24px !important;
}
.woocommerce div.product form.cart .quantity input {
	width: 64px !important;
	height: 48px !important;
	text-align: center !important;
	border: 1px solid var(--line) !important;
	border-radius: 0 !important;
	font-family: var(--body) !important;
	font-size: 15px !important;
	color: var(--ink) !important;
	background: var(--bg) !important;
}

/* Product tabs */
.woocommerce div.product .woocommerce-tabs ul.tabs {
	border-bottom: 1px solid var(--line) !important;
	padding: 0 !important;
	margin: 40px 0 0 !important;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li {
	border: none !important;
	background: none !important;
	border-radius: 0 !important;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li a {
	font-family: var(--body) !important;
	font-size: 11px !important;
	letter-spacing: .16em !important;
	text-transform: uppercase !important;
	color: var(--muted-txt) !important;
	padding: 14px 20px !important;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a {
	color: var(--ink) !important;
	border-bottom: 2px solid var(--ink) !important;
}
.woocommerce div.product .woocommerce-tabs .panel {
	padding: 24px 0 !important;
	font-size: 15px !important;
	line-height: 1.7 !important;
	color: var(--muted-txt) !important;
}

/* Product meta (categories, tags) */
.woocommerce div.product .product_meta {
	margin-top: 24px !important;
	font-size: 12px !important;
	color: var(--muted-txt) !important;
	letter-spacing: .04em !important;
}
.woocommerce div.product .product_meta a { color: var(--tan) !important; }

/* Related products */
.woocommerce .related h2,
.woocommerce .upsells h2 {
	font-family: var(--display) !important;
	font-weight: 300 !important;
	font-size: clamp(26px, 3vw, 36px) !important;
	margin-bottom: 32px !important;
}

/* Cart page */
.woocommerce table.cart td,
.woocommerce table.cart th {
	font-family: var(--body) !important;
	font-size: 14px !important;
}
.woocommerce #page-body .cart-collaterals,
.woocommerce .cart-collaterals .cart_totals {
	background: var(--card) !important;
	border: 1px solid var(--line) !important;
	padding: 32px !important;
}
.woocommerce .cart_totals h2 {
	font-family: var(--display) !important;
	font-weight: 300 !important;
	font-size: 28px !important;
	margin-bottom: 20px !important;
}

/* Checkout */
.woocommerce form .form-row label {
	font-size: 11px !important;
	letter-spacing: .14em !important;
	text-transform: uppercase !important;
	color: var(--muted-txt) !important;
}
.woocommerce form .form-row input,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select {
	border: 1px solid var(--line) !important;
	border-radius: 0 !important;
	font-family: var(--body) !important;
	font-size: 15px !important;
	background: var(--bg) !important;
	color: var(--ink) !important;
	padding: 12px 14px !important;
}
.woocommerce form .form-row input:focus,
.woocommerce form .form-row textarea:focus {
	border-color: var(--ink) !important;
	outline: none !important;
}

/* Notices */
.woocommerce-message,
.woocommerce-info {
	background: var(--card) !important;
	border-top-color: var(--burgundy) !important;
	color: var(--ink) !important;
	font-family: var(--body) !important;
}
.woocommerce-error {
	background: #fff5f5 !important;
	border-top-color: #c0392b !important;
}

/* Breadcrumb */
.woocommerce .woocommerce-breadcrumb {
	font-size: 12px !important;
	color: var(--muted-txt) !important;
	letter-spacing: .06em !important;
	margin-bottom: 32px !important;
}
.woocommerce .woocommerce-breadcrumb a { color: var(--tan) !important; }

/* Pagination */
.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span {
	border: 1px solid var(--line) !important;
	color: var(--ink) !important;
	font-family: var(--body) !important;
	border-radius: 0 !important;
}
.woocommerce nav.woocommerce-pagination ul li span.current {
	background: var(--ink) !important;
	color: var(--bg) !important;
}

/* Remove WooCommerce default star colour */
.star-rating span::before { color: var(--tan) !important; }

/* Order by / sorting select */
.woocommerce-ordering select {
	border: 1px solid var(--line) !important;
	border-radius: 0 !important;
	font-family: var(--body) !important;
	font-size: 13px !important;
	padding: 8px 12px !important;
	color: var(--ink) !important;
	background: var(--bg) !important;
}

/* Account page */
.woocommerce-account .woocommerce-MyAccount-navigation ul {
	list-style: none !important;
	padding: 0 !important;
}
.woocommerce-account .woocommerce-MyAccount-navigation li a {
	display: block !important;
	padding: 12px 0 !important;
	border-bottom: 1px solid var(--line) !important;
	font-size: 13px !important;
	letter-spacing: .08em !important;
	text-transform: uppercase !important;
	color: var(--muted-txt) !important;
}
.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a,
.woocommerce-account .woocommerce-MyAccount-navigation li a:hover {
	color: var(--ink) !important;
}


/* ================================================================
   RELLE PRODUCT PAGE (PDP)
   ================================================================ */
.relle-pdp { padding: 40px 0 90px; }
.pdp-breadcrumb { font-size: 12px; letter-spacing: .06em; color: var(--muted-txt); margin-bottom: 32px; }
.pdp-breadcrumb a { color: var(--muted-txt); }
.pdp-breadcrumb a:hover { color: var(--ink); }

.pdp-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: start; }
@media (max-width: 900px) { .pdp-grid { grid-template-columns: 1fr; gap: 36px; } }

/* Gallery */
.pdp-gallery { position: sticky; top: 110px; }
@media (max-width: 900px) { .pdp-gallery { position: static; } }
.pdp-stage { background: var(--card); overflow: hidden; aspect-ratio: 3/4; }
.pdp-stage img { width: 100%; height: 100%; object-fit: cover; object-position: top center; display: block; }
.pdp-thumbs { display: flex; gap: 10px; margin-top: 12px; flex-wrap: wrap; }
.pdp-thumb { width: 72px; aspect-ratio: 3/4; padding: 0; border: 1px solid var(--line); background: var(--card); cursor: pointer; overflow: hidden; }
.pdp-thumb img { width: 100%; height: 100%; object-fit: cover; object-position: top center; display: block; }
.pdp-thumb.active { border-color: var(--ink); }

/* Info column */
.pdp-cat { font-size: 11px; letter-spacing: .2em; text-transform: uppercase; color: var(--tan); margin-bottom: 14px; }
.pdp-title { font-family: var(--display); font-weight: 300; font-size: clamp(30px, 4vw, 50px); line-height: 1.05; color: var(--ink); margin: 0 0 14px; }
.pdp-price { font-size: 20px; color: var(--ink); margin-bottom: 22px; letter-spacing: .02em; }
.pdp-price del { color: var(--muted-txt); font-size: 15px; margin-right: 8px; }
.pdp-price ins { text-decoration: none; color: var(--burgundy); }
.pdp-short { font-size: 15px; line-height: 1.8; color: #3a3631; margin-bottom: 20px; }
.pdp-short p { margin: 0 0 10px; }

.pdp-model { display: flex; align-items: center; gap: 9px; font-size: 12px; letter-spacing: .1em; text-transform: uppercase; color: var(--muted-txt); margin-bottom: 26px; }
.pdp-model .dot { width: 6px; height: 6px; border-radius: 50%; background: var(--tan); display: inline-block; }

/* Sizes */
.pdp-sizes { margin-bottom: 22px; }
.pdp-opt-label { font-size: 11px; letter-spacing: .16em; text-transform: uppercase; color: var(--muted-txt); margin-bottom: 11px; }
.pdp-size-btns { display: flex; flex-wrap: wrap; gap: 8px; }
.relle-size { min-width: 52px; padding: 12px 14px; background: var(--bg); border: 1px solid var(--line); font-family: var(--body); font-size: 13px; color: var(--ink); cursor: pointer; transition: .25s; border-radius: 0; line-height: 1; }
.relle-size.wide { min-width: auto; padding-left: 18px; padding-right: 18px; }
.relle-size:hover { border-color: var(--ink); }
.relle-size.active { background: var(--ink); color: var(--bg); border-color: var(--ink); }

/* Buy row */
.pdp-buy { display: flex; gap: 12px; align-items: stretch; margin-bottom: 24px; }
.pdp-buy .quantity input,
.relle-pdp .quantity input.qty { width: 68px; height: 52px; text-align: center; border: 1px solid var(--line); background: var(--bg); font-family: var(--body); font-size: 15px; color: var(--ink); border-radius: 0; }
.pdp-add { flex: 1; background: var(--ink); color: var(--bg); border: none; border-radius: 0; font-family: var(--body); font-size: 11px; letter-spacing: .22em; text-transform: uppercase; padding: 0 28px; height: 52px; cursor: pointer; transition: background .3s; }
.pdp-add:hover { background: var(--burgundy); color: #fff; }
.pdp-soldout { font-size: 13px; letter-spacing: .12em; text-transform: uppercase; color: var(--muted-txt); padding: 16px 0 24px; }

/* Assurances */
.pdp-assure { display: flex; flex-direction: column; gap: 7px; padding: 18px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); margin-bottom: 6px; }
.pdp-assure span { font-size: 12.5px; color: var(--muted-txt); }

/* Accordions */
.pdp-acc { margin-top: 8px; }
.pdp-acc details { border-bottom: 1px solid var(--line); }
.pdp-acc summary { list-style: none; cursor: pointer; padding: 16px 0; font-size: 11px; letter-spacing: .16em; text-transform: uppercase; color: var(--ink); position: relative; }
.pdp-acc summary::-webkit-details-marker { display: none; }
.pdp-acc summary::after { content: '+'; position: absolute; right: 2px; top: 50%; transform: translateY(-50%); font-size: 15px; color: var(--muted-txt); }
.pdp-acc details[open] summary::after { content: '−'; }
.pdp-acc-body { padding: 0 0 18px; font-size: 14.5px; line-height: 1.8; color: #3a3631; }
.pdp-acc-body p { margin: 0 0 10px; }
.pdp-acc-body a { color: var(--tan); border-bottom: 1px solid currentColor; }

.pdp-meta { margin-top: 22px; font-size: 12px; color: var(--muted-txt); letter-spacing: .04em; }
.pdp-meta a { color: var(--tan); }

/* Related products */
.related.products { margin-top: 80px; padding-top: 50px; border-top: 1px solid var(--line); }
.related.products > h2 { font-family: var(--display); font-weight: 300; font-size: clamp(26px, 3vw, 36px); margin-bottom: 30px; color: var(--ink); }

/* ================================================================
   SHOP / ARCHIVE IMAGE DISPLAY FIX
   Consistent portrait crop everywhere, no stretching or letterboxing.
   ================================================================ */
.woocommerce ul.products li.product a img,
.woocommerce-page ul.products li.product a img,
ul.products li.product img,
.p-card .frame img,
.card .frame img,
.grid .p-card img {
	width: 100% !important;
	height: auto !important;
	aspect-ratio: 3 / 4 !important;
	object-fit: cover !important;
	object-position: top center !important;
	display: block !important;
	margin: 0 !important;
	box-shadow: none !important;
	border-radius: 0 !important;
	background: var(--card);
}

/* Frame wrapper keeps the crop tidy */
.p-card .frame,
.card .frame,
.woocommerce ul.products li.product .frame {
	position: relative;
	overflow: hidden;
	background: var(--card);
	aspect-ratio: 3 / 4;
}

/* Placeholder when a product has no image yet */
.woocommerce ul.products li.product img[src*="woocommerce-placeholder"],
img[src*="woocommerce-placeholder"] {
	object-fit: contain !important;
	background: var(--card);
	padding: 18%;
	opacity: .35;
}

/* Category tiles */
.cats .tile img,
.tile img {
	width: 100% !important;
	height: 100% !important;
	object-fit: cover !important;
	object-position: top center !important;
}

/* Collection cards */
.collab-img img {
	width: 100% !important;
	height: 100% !important;
	object-fit: cover !important;
	object-position: top center !important;
}

/* Hero / editorial / designer section images */
.hero-img img,
.edit .img img,
.story-img img,
.designer-img img {
	width: 100% !important;
	height: 100% !important;
	object-fit: cover !important;
	object-position: top center !important;
	display: block;
}

/* Checkout area picker */
.relle-area-field { margin: 26px 0 10px; }
.relle-area-field h3 {
	font-family: var(--display);
	font-weight: 300;
	font-size: 24px;
	margin-bottom: 12px;
	color: var(--ink);
}
.relle-area-field select {
	width: 100%;
	border: 1px solid var(--line) !important;
	border-radius: 0 !important;
	background: var(--bg) !important;
	font-family: var(--body) !important;
	font-size: 15px !important;
	padding: 13px 14px !important;
	color: var(--ink) !important;
}
.relle-area-note {
	display: block;
	font-size: 12.5px;
	color: var(--muted-txt);
	margin-top: 8px;
	line-height: 1.6;
}

/* ================================================================
   PDP LAYOUT — authoritative rules (override any WooCommerce default)
   ================================================================ */
.woocommerce div.product.relle-pdp,
div.product.relle-pdp,
.relle-pdp {
	display: block !important;
	max-width: 1320px;
	margin: 0 auto;
	padding: 40px 36px 90px !important;
	grid-template-columns: none !important;
}

.relle-pdp .pdp-grid {
	display: grid !important;
	grid-template-columns: 1fr 1fr !important;
	gap: 60px !important;
	align-items: start !important;
	max-width: none !important;
}
@media (max-width: 900px) {
	.relle-pdp .pdp-grid { grid-template-columns: 1fr !important; gap: 32px !important; }
}

/* Gallery must not exceed its column */
.relle-pdp .pdp-gallery { width: 100%; max-width: 100%; min-width: 0; }
.relle-pdp .pdp-stage {
	width: 100% !important;
	max-width: 100% !important;
	aspect-ratio: 3 / 4 !important;
	overflow: hidden !important;
	background: var(--card);
}
.relle-pdp .pdp-stage img {
	width: 100% !important;
	height: 100% !important;
	max-width: 100% !important;
	object-fit: cover !important;
	object-position: top center !important;
	display: block !important;
}
.relle-pdp .pdp-info { min-width: 0; }

/* Related products grid inside PDP */
.relle-pdp .related.products ul.products,
.relle-pdp ul.products {
	display: grid !important;
	grid-template-columns: repeat(4, 1fr) !important;
	gap: 28px !important;
	list-style: none !important;
	padding: 0 !important;
	margin: 0 !important;
}
@media (max-width: 900px) {
	.relle-pdp .related.products ul.products { grid-template-columns: repeat(2, 1fr) !important; }
}
.relle-pdp .related.products li.product { width: 100% !important; margin: 0 !important; float: none !important; }
.relle-pdp .related.products li.product img { aspect-ratio: 3/4 !important; object-fit: cover !important; object-position: top center !important; }

/* Related product add-to-cart buttons */
.relle-pdp .related.products .button,
.woocommerce ul.products li.product .button {
	display: inline-block !important;
	margin-top: 10px !important;
	background: transparent !important;
	color: var(--ink) !important;
	border: 1px solid var(--line) !important;
	padding: 10px 18px !important;
	font-size: 10px !important;
	letter-spacing: .18em !important;
}
.relle-pdp .related.products .button:hover,
.woocommerce ul.products li.product .button:hover {
	background: var(--ink) !important;
	color: var(--bg) !important;
	border-color: var(--ink) !important;
}


/* ================================================================
   RELATED PRODUCTS — section must be a block, only the UL is a grid
   ================================================================ */
.woocommerce .related.products,
.woocommerce section.related,
section.related.products,
.up-sells.products,
.cross-sells.products {
	display: block !important;
	grid-template-columns: none !important;
	width: 100%;
	clear: both;
}
.woocommerce .related.products > h2,
section.related.products > h2 {
	display: block !important;
	width: 100%;
	font-family: var(--display) !important;
	font-weight: 300 !important;
	font-size: clamp(26px, 3vw, 36px) !important;
	margin: 0 0 30px !important;
}
.woocommerce .related.products ul.products,
section.related.products ul.products {
	display: grid !important;
	grid-template-columns: repeat(4, 1fr) !important;
	gap: 28px !important;
}
@media (max-width: 900px) {
	.woocommerce .related.products ul.products,
	section.related.products ul.products { grid-template-columns: repeat(2, 1fr) !important; }
}
.woocommerce .related.products li.product,
section.related.products li.product {
	width: 100% !important;
	max-width: none !important;
	margin: 0 !important;
	float: none !important;
	display: flex !important;
	flex-direction: column !important;
}
.woocommerce .related.products li.product .woocommerce-loop-product__title {
	font-size: 16px !important;
	padding: 10px 0 4px !important;
}

/* Hide product descriptions in checkout/cart summaries */
.wc-block-components-order-summary-item__description,
.wc-block-components-order-summary-item__description p,
.woocommerce-checkout-review-order-table .product-name p,
.woocommerce-checkout-review-order-table .product-name .description,
.wc-block-components-order-summary-item__individual-price + .wc-block-components-order-summary-item__description {
	display: none !important;
}
/* Keep the size line visible */
.wc-block-components-product-details,
.wc-block-components-product-details__relle-size,
.woocommerce-checkout-review-order-table .variation {
	display: block !important;
	font-size: 12px !important;
	color: var(--muted-txt) !important;
}

/* ================================================================
   HERO SLIDER
   ================================================================ */
.hero-slider { position: relative; overflow: hidden; }
.hero-slide {
	position: absolute; inset: 0;
	opacity: 0; transition: opacity 1.1s ease;
	pointer-events: none;
}
.hero-slide.active { opacity: 1; pointer-events: auto; }
.hero-slide img {
	width: 100% !important; height: 100% !important;
	object-fit: cover !important; object-position: top center !important;
	display: block;
}
/* first slide holds layout height */
.hero-slider .hero-slide:first-child { position: relative; }
.hero-dots {
	position: absolute; bottom: 22px; left: 0; right: 0;
	display: flex; justify-content: center; gap: 9px; z-index: 3;
}
.hero-dot {
	width: 8px; height: 8px; border-radius: 50%;
	border: 1px solid rgba(255,255,255,.85); background: transparent;
	padding: 0; cursor: pointer; transition: .3s;
}
.hero-dot.active { background: #fff; transform: scale(1.25); }

/* ================================================================
   WHATSAPP FLOATING BUTTON
   ================================================================ */
.relle-wa {
	position: fixed; right: 20px; bottom: 20px; z-index: 900;
	width: 54px; height: 54px; border-radius: 50%;
	display: flex; align-items: center; justify-content: center;
	background: #25D366; color: #fff;
	box-shadow: 0 6px 20px rgba(0,0,0,.22);
	transition: transform .25s, box-shadow .25s;
}
.relle-wa:hover { transform: translateY(-3px) scale(1.05); box-shadow: 0 10px 26px rgba(0,0,0,.3); color: #fff; }
@media (max-width: 600px) { .relle-wa { right: 14px; bottom: 14px; width: 50px; height: 50px; } }

/* ================================================================
   CONTACT PAGE
   ================================================================ */
.contact-wrap { padding: 70px 36px 100px; }
.contact-grid { display: grid; grid-template-columns: 1fr 1.15fr; gap: 56px; align-items: start; }
@media (max-width: 860px) { .contact-grid { grid-template-columns: 1fr; gap: 36px; } }
.contact-cards { display: flex; flex-direction: column; gap: 14px; }
.contact-card {
	display: block; background: var(--card); border: 1px solid var(--line);
	padding: 24px 26px; transition: .25s;
}
a.contact-card:hover { border-color: var(--ink); transform: translateY(-2px); }
.contact-card .cc-label {
	display: block; font-size: 11px; letter-spacing: .18em; text-transform: uppercase;
	color: var(--tan); margin-bottom: 8px;
}
.contact-card .cc-value { display: block; font-size: 16px; color: var(--ink); line-height: 1.6; }
.contact-card .cc-note { display: block; font-size: 12.5px; color: var(--muted-txt); margin-top: 8px; }
.contact-card.wa { background: #f2fbf5; border-color: #cdeed9; }
.contact-card.wa .cc-label { color: #128C7E; }
.cc-socials { display: flex; flex-wrap: wrap; gap: 14px; }
.cc-socials a { font-size: 14px; color: var(--ink); border-bottom: 1px solid var(--line); }
.cc-socials a:hover { border-color: var(--ink); }

.contact-form-col h2 {
	font-family: var(--display); font-weight: 300;
	font-size: clamp(26px,3.2vw,36px); margin-bottom: 24px;
}
.cf-row { margin-bottom: 18px; }
.cf-row label {
	display: block; font-size: 11px; letter-spacing: .16em;
	text-transform: uppercase; color: var(--muted-txt); margin-bottom: 8px;
}
.cf-row input, .cf-row textarea {
	width: 100%; background: var(--bg); border: 1px solid var(--line);
	padding: 13px 15px; font-family: var(--body); font-size: 15px;
	color: var(--ink); outline: none; transition: border-color .3s; border-radius: 0;
}
.cf-row input:focus, .cf-row textarea:focus { border-color: var(--ink); }
.cf-note { font-size: 12.5px; color: var(--muted-txt); margin-top: 14px; }

/* Journal images always present */
.jcard .jimg img, .post .figure img {
	width: 100%; height: 100%;
	object-fit: cover; object-position: center;
	display: block;
}

/* ================================================================
   HERO — SPLIT LAYOUT
   Copy on a cream panel left, image on a burgundy panel right.
   Overrides the earlier full-bleed hero rules.
   ================================================================ */
.hero.hero-split {
	display: grid !important;
	grid-template-columns: 1fr 1fr;
	align-items: stretch;
	min-height: 88vh;
	background: var(--bg);
	overflow: hidden;
	padding: 0;
}

/* Left — copy */
.hero-split .hero-copy-col {
	display: flex;
	align-items: center;
	padding: 80px clamp(28px, 5vw, 84px);
}
.hero-split .hero-copy {
	padding: 0 !important;
	max-width: 560px;
	margin-left: auto;
	margin-right: 0;
}
.hero-split .hero-copy p { max-width: 42ch; }

/* Right — burgundy panel holding the image */
.hero-split .hero-img {
	background: var(--burgundy);
	display: grid !important;
	grid-template-columns: 1fr;
	place-items: stretch;
	padding: clamp(26px, 4.5vw, 66px);
	height: auto !important;
	min-height: 0 !important;
	position: relative;
}

/* Slides stack in one grid cell so the panel padding is respected */
.hero-split .hero-slide {
	grid-area: 1 / 1;
	position: relative !important;
	inset: auto !important;
	overflow: hidden;
	opacity: 0;
	transition: opacity 1.1s ease;
	pointer-events: none;
	background: var(--burgundy-deep);
}
.hero-split .hero-slide.active { opacity: 1; pointer-events: auto; }
.hero-split .hero-slide img {
	position: relative !important;
	inset: auto !important;
	width: 100% !important;
	height: 100% !important;
	object-fit: cover !important;
	object-position: top center !important;
	display: block;
}

/* Dots sit inside the burgundy panel */
.hero-split .hero-dots { bottom: clamp(14px, 2vw, 28px); }
.hero-split .hero-dot { border-color: rgba(255,255,255,.9); }

/* Mobile — stack, keep the image visible */
@media (max-width: 960px) {
	.hero.hero-split { grid-template-columns: 1fr; min-height: 0; }
	.hero-split .hero-copy-col { padding: 60px 24px 34px; }
	.hero-split .hero-copy { margin: 0; max-width: none; }
	.hero-split .hero-img {
		display: grid !important;
		aspect-ratio: 4 / 5;
		padding: 22px;
	}
}
@media (max-width: 560px) {
	.hero-split .hero-img { aspect-ratio: 3 / 4; padding: 16px; }
}

/* ================================================================
   HERO — bounded height, cream space above and below the panel
   (overrides the full-height split rules above)
   ================================================================ */
.hero.hero-split {
	min-height: 0 !important;
	align-items: center;
	padding: clamp(30px, 5vw, 76px) 0;
}

.hero-split .hero-copy-col {
	padding-top: 0;
	padding-bottom: 0;
}

/* The burgundy panel is a fixed slice of the viewport, not the whole page */
.hero-split .hero-img {
	height: var(--panel-h, 62vh) !important;
	min-height: 380px !important;
	max-height: 720px;
	align-self: center;
}

@media (max-width: 960px) {
	.hero.hero-split { padding: 34px 0 42px; }
	.hero-split .hero-img {
		height: auto !important;
		min-height: 0 !important;
		aspect-ratio: 4 / 5;
		max-height: none;
		margin: 0 20px;
	}
	.hero-split .hero-copy-col { padding: 0 24px 30px; }
}
@media (max-width: 560px) {
	.hero-split .hero-img { aspect-ratio: 3 / 4; margin: 0 16px; }
}

/* ================================================================
   HERO SLIDER — show the WHOLE image, never crop it
   The photo is contained inside the burgundy panel; the panel colour
   frames whatever space the image doesn't fill.
   ================================================================ */
.hero-split .hero-img {
	padding: clamp(18px, 2.6vw, 40px);
}

.hero-split .hero-slide {
	background: transparent;
	display: flex;
	align-items: center;
	justify-content: center;
}

.hero-split .hero-slide img {
	width: 100% !important;
	height: 100% !important;
	object-fit: contain !important;      /* full garment always visible */
	object-position: center center !important;
}

/* Slightly shorter panel so the contained image still reads large */
.hero-split .hero-img {
	height: var(--panel-h, 62vh) !important;
	min-height: 340px !important;
}

@media (max-width: 960px) {
	.hero-split .hero-img {
		aspect-ratio: 3 / 4;          /* closer to the photo ratio on mobile */
		padding: 14px;
		min-height: 0 !important;
	}
}

/* ================================================================
   HERO — burgundy hugs the image as a frame (not a half-page block)
   Authoritative: overrides all earlier hero panel rules.
   ================================================================ */
.hero.hero-split {
	grid-template-columns: 1fr auto !important;
	align-items: center;
	column-gap: clamp(20px, 3vw, 56px);
	padding: clamp(28px, 4.5vw, 70px) clamp(20px, 4vw, 64px);
}

/* Burgundy shrink-wraps the photo with an even margin all round */
.hero-split .hero-img {
	background: var(--burgundy);
	padding: clamp(16px, 1.8vw, 30px) !important;
	width: -moz-fit-content;
	width: fit-content;
	height: -moz-fit-content !important;
	height: auto !important;
	min-height: 0 !important;
	max-height: none !important;
	justify-self: center;
	align-self: center;
	display: grid !important;
	place-items: center;
}

/* The photo itself — sized by height, natural 4:5 proportion, shown whole */
.hero-split .hero-slide {
	grid-area: 1 / 1;
	position: relative !important;
	inset: auto !important;
	height: min(var(--panel-h, 62vh), 640px);
	aspect-ratio: 4 / 5;
	width: auto;
	max-width: 100%;
	background: transparent;
	display: block;
	overflow: hidden;
}
.hero-split .hero-slide img {
	width: 100% !important;
	height: 100% !important;
	object-fit: contain !important;
	object-position: center center !important;
	display: block;
}

/* Dots sit just below the framed image, inside the burgundy */
.hero-split .hero-dots {
	position: absolute;
	bottom: clamp(10px, 1.2vw, 18px);
	left: 0; right: 0;
}

@media (max-width: 960px) {
	.hero.hero-split {
		grid-template-columns: 1fr !important;
		padding: 30px 20px 44px;
		row-gap: 26px;
	}
	.hero-split .hero-copy-col { padding: 0 4px; }
	.hero-split .hero-img {
		justify-self: center;
		padding: 14px !important;
		aspect-ratio: auto;
	}
	.hero-split .hero-slide {
		height: auto;
		width: min(78vw, 420px);
		aspect-ratio: 4 / 5;
	}
}

/* ================================================================
   HERO — FINAL
   · Left copy sits exactly where it always did (left-aligned, half width)
   · Burgundy hugs the photo at its own natural proportions (no letterbox)
   ================================================================ */
.hero.hero-split {
	grid-template-columns: 1fr auto !important;
	align-items: center;
	column-gap: clamp(24px, 4vw, 70px);
	padding: clamp(30px, 4.5vw, 72px) clamp(24px, 5vw, 70px);
}

/* Left column — restore original placement */
.hero-split .hero-copy-col {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	padding: 0 !important;
}
.hero-split .hero-copy {
	margin-left: 0 !important;
	margin-right: auto !important;
	max-width: 620px;
	text-align: left;
}
.hero-split .hero-copy p { max-width: 44ch; }

/* Burgundy frame sizes itself to the photo */
.hero-split .hero-img {
	background: var(--burgundy);
	padding: clamp(14px, 1.6vw, 26px) !important;
	width: -moz-fit-content !important;
	width: fit-content !important;
	height: auto !important;
	min-height: 0 !important;
	max-height: none !important;
	aspect-ratio: auto !important;
	display: grid !important;
	place-items: center;
	justify-self: end;
	align-self: center;
	position: relative;
}

/* Slides keep each photo's OWN ratio — nothing cropped, nothing letterboxed */
.hero-split .hero-slide {
	grid-area: 1 / 1;
	position: relative !important;
	inset: auto !important;
	height: auto !important;
	width: auto !important;
	aspect-ratio: auto !important;
	max-width: 100%;
	background: transparent;
	overflow: visible;
	display: block;
	line-height: 0;
}
.hero-split .hero-slide img {
	display: block;
	width: auto !important;
	height: auto !important;
	max-height: min(var(--panel-h, 62vh), 660px) !important;
	max-width: min(42vw, 520px) !important;
	object-fit: contain !important;
	object-position: center !important;
}

.hero-split .hero-dots { position: absolute; bottom: 10px; left: 0; right: 0; }

@media (max-width: 960px) {
	.hero.hero-split {
		grid-template-columns: 1fr !important;
		padding: 28px 22px 42px;
		row-gap: 26px;
	}
	.hero-split .hero-copy { max-width: none; }
	.hero-split .hero-img { justify-self: center; padding: 12px !important; }
	.hero-split .hero-slide img {
		max-height: 62vh !important;
		max-width: min(80vw, 420px) !important;
	}
}

/* ================================================================
   BAG BADGE — visible count when items are in the cart
   ================================================================ */
.nav-r .cart { position: relative; }
.cart-count {
	position: absolute;
	top: -9px; right: -14px;
	min-width: 18px; height: 18px;
	padding: 0 5px;
	background: transparent;
	color: transparent;
	border-radius: 999px;
	display: grid; place-items: center;
	font-size: 10px; font-weight: 500; letter-spacing: 0;
	line-height: 1;
	transition: background .25s, color .25s, transform .25s;
}
.cart-count.has-items {
	background: var(--burgundy);
	color: #fff;
	box-shadow: 0 0 0 2px var(--bg);
	animation: relle-bag-pop .45s ease;
}
@keyframes relle-bag-pop {
	0%   { transform: scale(.4); }
	60%  { transform: scale(1.25); }
	100% { transform: scale(1); }
}

/* ================================================================
   SIZE AVAILABILITY — sold-out sizes shown but disabled
   ================================================================ */
.relle-size.is-soldout {
	color: var(--muted-txt);
	border-color: var(--line);
	background: transparent;
	cursor: not-allowed;
	position: relative;
	opacity: .55;
}
.relle-size.is-soldout::after {
	content: '';
	position: absolute;
	left: 14%; right: 14%; top: 50%;
	height: 1px;
	background: currentColor;
	transform: rotate(-14deg);
	opacity: .7;
}
.relle-size.is-soldout:hover { border-color: var(--line); }
.pdp-size-note {
	flex-basis: 100%;
	margin: 10px 0 0;
	font-size: 12px;
	color: var(--muted-txt);
	line-height: 1.6;
}

/* ================================================================
   LOGO — larger and prominent
   ================================================================ */
.nav .brand { display: flex; align-items: center; }
.nav .brand img { display: block; }

/* ================================================================
   POLICY / INFO PAGES — readable long-form copy
   ================================================================ */
.page-body h2 {
	font-family: var(--display);
	font-weight: 300;
	font-size: clamp(24px, 3vw, 34px);
	line-height: 1.15;
	margin: 42px 0 14px;
	color: var(--ink);
}
.page-body h2:first-child { margin-top: 0; }
.page-body h3 {
	font-family: var(--display);
	font-weight: 400;
	font-size: clamp(19px, 2.2vw, 24px);
	margin: 30px 0 10px;
	color: var(--ink);
}
.page-body p,
.page-body li {
	font-size: 15.5px;
	line-height: 1.85;
	color: #3a3631;
}
.page-body p { margin: 0 0 14px; }
.page-body ul, .page-body ol { margin: 0 0 18px 22px; display: flex; flex-direction: column; gap: 9px; }
.page-body a { color: var(--tan); border-bottom: 1px solid currentColor; }
.page-body strong { color: var(--ink); font-weight: 500; }
.page-body em { font-style: italic; }

/* ================================================================
   HERO SLIDER — rounded corners
   ================================================================ */
.hero-split .hero-img {
	border-radius: 10px;
	overflow: hidden;
}
.hero-split .hero-slide,
.hero-split .hero-slide img {
	border-radius: 10px;
}

/* ================================================================
   RELATED PRODUCTS — final alignment fix
   The heading must never sit in a grid cell beside the products,
   and the product list must always start at column 1.
   ================================================================ */
.related.products,
section.related,
.woocommerce .related.products,
.relle-pdp .related.products {
	display: block !important;
	grid-template-columns: none !important;
	width: 100%;
	clear: both;
}

/* Heading always spans the full width, on its own line */
.related.products > h2,
.woocommerce .related.products > h2,
.relle-pdp .related.products > h2 {
	display: block !important;
	grid-column: 1 / -1 !important;
	width: 100% !important;
	float: none !important;
	margin: 0 0 30px !important;
}

/* The list is the only grid, and it spans full width */
.related.products ul.products,
.woocommerce .related.products ul.products,
.relle-pdp .related.products ul.products {
	display: grid !important;
	grid-column: 1 / -1 !important;
	grid-template-columns: repeat(4, 1fr) !important;
	grid-auto-flow: row !important;
	gap: 28px !important;
	width: 100% !important;
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
	float: none !important;
}

/* Every card starts in its own cell, equal height, aligned tops */
.related.products ul.products > li.product,
.woocommerce .related.products ul.products > li.product,
.relle-pdp .related.products ul.products > li.product {
	grid-column: auto !important;
	width: 100% !important;
	max-width: none !important;
	min-width: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
	float: none !important;
	clear: none !important;
	display: flex !important;
	flex-direction: column !important;
	align-self: start;
}

/* Consistent image crop so the row lines up */
.related.products ul.products > li.product img {
	width: 100% !important;
	aspect-ratio: 3 / 4 !important;
	object-fit: cover !important;
	object-position: top center !important;
	margin: 0 0 12px !important;
}

/* Push the button to the bottom so buttons align across the row */
.related.products ul.products > li.product .button {
	margin-top: auto !important;
	align-self: stretch;
	text-align: center;
}
.related.products ul.products > li.product .woocommerce-loop-product__title {
	min-height: 2.6em;
}

@media (max-width: 1024px) {
	.related.products ul.products,
	.relle-pdp .related.products ul.products { grid-template-columns: repeat(3, 1fr) !important; }
}
@media (max-width: 700px) {
	.related.products ul.products,
	.relle-pdp .related.products ul.products { grid-template-columns: repeat(2, 1fr) !important; gap: 18px !important; }
}

/* ================================================================
   RELATED PRODUCTS — heading fix (works wherever the h2 sits)
   Earlier rules used "> h2" (direct child only). If WooCommerce or a
   plugin renders the heading inside the product list, it became the
   first grid cell and pushed the products across. Descendant selector
   plus a full-row span fixes it either way.
   ================================================================ */
.related.products h2,
.woocommerce .related.products h2,
.relle-pdp .related.products h2,
section.related h2,
.up-sells h2,
.cross-sells h2 {
	grid-column: 1 / -1 !important;
	grid-row: auto !important;
	display: block !important;
	width: 100% !important;
	float: none !important;
	clear: both !important;
	margin: 0 0 30px !important;
	font-family: var(--display) !important;
	font-weight: 300 !important;
	font-size: clamp(26px, 3vw, 36px) !important;
	color: var(--ink) !important;
}

/* Products always begin in column 1 */
.related.products ul.products > li.product:first-of-type,
.woocommerce .related.products ul.products > li.product:first-of-type {
	grid-column-start: 1 !important;
}

/* Belt and braces: if the list ever collapses, keep it a real grid */
.related.products ul.products,
.woocommerce .related.products ul.products {
	display: grid !important;
	grid-auto-flow: row dense !important;
}

/* ================================================================
   PRODUCT GRIDS — kill WooCommerce's clearfix pseudo-elements.
   WooCommerce adds ul.products::before / ::after for float clearing.
   In a CSS grid those pseudo-elements become REAL GRID ITEMS, taking
   the first cell and pushing every product one place along. This is
   the cause of the empty first cell under "Related products".
   ================================================================ */
ul.products::before,
ul.products::after,
.woocommerce ul.products::before,
.woocommerce ul.products::after,
.related.products ul.products::before,
.related.products ul.products::after,
.woocommerce .related.products ul.products::before,
.woocommerce .related.products ul.products::after,
.relle-pdp ul.products::before,
.relle-pdp ul.products::after,
.woocommerce-page ul.products::before,
.woocommerce-page ul.products::after,
.up-sells ul.products::before,
.up-sells ul.products::after,
.cross-sells ul.products::before,
.cross-sells ul.products::after {
	content: none !important;
	display: none !important;
}

/* Same problem on the shop/category archive grid */
.woocommerce .products::before,
.woocommerce .products::after,
.woocommerce-page .products::before,
.woocommerce-page .products::after {
	content: none !important;
	display: none !important;
}

/* Now that no phantom cell exists, products fill from column 1 naturally */
.related.products ul.products > li.product,
.woocommerce .related.products ul.products > li.product {
	grid-column: auto !important;
}

/* ================================================================
   WHATSAPP BUTTONS
   ================================================================ */
.relle-wa-btn {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	margin-top: 14px;
	padding: 13px 22px;
	background: #25D366;
	color: #fff !important;
	border: none;
	border-radius: 0;
	font-family: var(--body);
	font-size: 11px;
	letter-spacing: .18em;
	text-transform: uppercase;
	transition: background .25s, transform .25s;
}
.relle-wa-btn:hover { background: #1da851; color: #fff !important; transform: translateY(-1px); }
.relle-wa-btn svg { flex: none; }
.relle-wa-order { margin: 22px 0; }

/* ================================================================
   MY ACCOUNT — wishlist tab
   ================================================================ */
.relle-acc-title {
	font-family: var(--display);
	font-weight: 300;
	font-size: clamp(24px, 3vw, 32px);
	margin: 0 0 8px;
	color: var(--ink);
}
.relle-acc-note { font-size: 13.5px; color: var(--muted-txt); margin-bottom: 26px; }
.relle-acc-empty { color: var(--muted-txt); margin-bottom: 18px; }

.relle-wish-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px;
}
@media (max-width: 900px) { .relle-wish-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 520px) { .relle-wish-grid { grid-template-columns: 1fr; } }

.relle-wish-card { display: flex; flex-direction: column; }
.relle-wish-card .rw-img {
	display: block;
	background: var(--card);
	aspect-ratio: 3 / 4;
	overflow: hidden;
}
.relle-wish-card .rw-img img {
	width: 100%; height: 100%;
	object-fit: cover; object-position: top center;
	display: block;
}
.relle-wish-card .rw-meta { padding: 12px 0 0; display: flex; flex-direction: column; gap: 5px; }
.relle-wish-card .rw-name {
	font-family: var(--display);
	font-size: 17px;
	color: var(--ink);
	line-height: 1.2;
}
.relle-wish-card .rw-price { font-size: 13.5px; color: var(--muted-txt); }
.relle-wish-card .rw-remove {
	align-self: flex-start;
	margin-top: 4px;
	background: none;
	border: none;
	padding: 0;
	font-family: var(--body);
	font-size: 11px;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--muted-txt);
	border-bottom: 1px solid var(--line);
	cursor: pointer;
}
.relle-wish-card .rw-remove:hover { color: var(--burgundy); border-color: var(--burgundy); }

/* ================================================================
   MADE TO MEASURE PANEL
   ================================================================ */
.mtm-panel {
	margin: 4px 0 22px;
	padding: 22px 24px;
	background: var(--card);
	border: 1px solid var(--line);
	border-left: 3px solid var(--tan);
}


.mtm-note { margin-bottom: 20px; }
.mtm-note-title {
	font-size: 11px;
	letter-spacing: .18em;
	text-transform: uppercase;
	color: var(--tan);
	margin: 0 0 8px;
}
.mtm-note p {
	font-size: 14px;
	line-height: 1.7;
	color: #3a3631;
	margin: 0 0 8px;
}
.mtm-note a { color: var(--tan); border-bottom: 1px solid currentColor; }

.mtm-fields {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 14px 16px;
}
@media (max-width: 620px) { .mtm-fields { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 400px) { .mtm-fields { grid-template-columns: 1fr; } }

.mtm-field { display: flex; flex-direction: column; }
.mtm-field-wide { margin-top: 14px; }
.mtm-field label {
	font-size: 11px;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--muted-txt);
	margin-bottom: 6px;
}
.mtm-req { color: var(--burgundy); margin-left: 2px; }
.mtm-field input,
.mtm-field textarea {
	width: 100%;
	background: var(--bg);
	border: 1px solid var(--line);
	border-radius: 0;
	padding: 11px 12px;
	font-family: var(--body);
	font-size: 14.5px;
	color: var(--ink);
	outline: none;
	transition: border-color .25s;
}
.mtm-field input:focus,
.mtm-field textarea:focus { border-color: var(--ink); }
.mtm-field input.mtm-error { border-color: var(--burgundy); background: #fff6f6; }
.mtm-hint {
	font-size: 11.5px;
	color: var(--muted-txt);
	margin-top: 5px;
	line-height: 1.4;
}
.mtm-foot {
	margin: 18px 0 0;
	padding-top: 14px;
	border-top: 1px solid var(--line);
	font-size: 12.5px;
	color: var(--muted-txt);
	line-height: 1.6;
}
.mtm-warning {
	margin: 12px 0 0;
	padding: 10px 12px;
	background: #fff4f4;
	border-left: 3px solid var(--burgundy);
	font-size: 13px;
	color: var(--burgundy);
}

/* Measurements shown in cart / order summaries */
.woocommerce-cart .variation dt,
.woocommerce-checkout .variation dt { font-weight: 500; }


/* ================================================================
   MADE TO MEASURE — visibility (no longer JS-dependent)
   Hidden by default, revealed when .open is present. Products that are
   made-to-measure only carry .open from PHP, so the fields show even if
   JavaScript fails entirely.
   ================================================================ */
.mtm-panel { display: none; }
.mtm-panel.open { display: block; }

/* Safety net: if JS never runs, show the panel on any product that offers
   a made-to-measure button, so the customer is never left without fields. */
.no-js .mtm-panel { display: block; }

/* Size chart link beside the size label */
.pdp-opt-label {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 14px;
}
.pdp-size-link {
	font-size: 11px;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--tan);
	border-bottom: 1px solid currentColor;
	white-space: nowrap;
	flex: none;
}
.pdp-size-link:hover { color: var(--ink); }

/* Size chart table */
.page-body table {
	width: 100%;
	border-collapse: collapse;
	margin: 18px 0 22px;
	font-size: 15px;
}
.page-body table th {
	text-align: left;
	background: var(--card);
	border-bottom: 1px solid var(--line);
	padding: 12px 14px;
	font-size: 11px;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--muted-txt);
	font-weight: 400;
}
.page-body table td {
	padding: 11px 14px;
	border-bottom: 1px solid var(--line);
	font-variant-numeric: tabular-nums;
}
.page-body table tr:hover td { background: var(--card); }

/* ================================================================
   COLOUR SWATCHES
   ================================================================ */
.relle-swatches {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin: 4px 0 6px;
}
.relle-swatch {
	background: none;
	border: none;
	padding: 0;
	cursor: pointer;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 5px;
	width: 46px;
}
.relle-swatch span {
	width: 34px;
	height: 34px;
	border-radius: 50%;
	border: 1px solid var(--line);
	display: block;
	background-size: cover;
	background-position: center;
	transition: box-shadow .2s, transform .2s;
}
.relle-swatch:hover span { transform: scale(1.06); }
.relle-swatch.active span {
	box-shadow: 0 0 0 2px var(--bg), 0 0 0 3px var(--ink);
}
.relle-swatch em {
	font-style: normal;
	font-size: 10.5px;
	letter-spacing: .04em;
	color: var(--muted-txt);
	text-align: center;
	line-height: 1.2;
}
.relle-swatch.active em { color: var(--ink); }
.relle-swatch[disabled],
.relle-swatch.disabled { opacity: .35; cursor: not-allowed; }

/* Hide WooCommerce's own select, but keep it in the DOM */
.relle-swatch-select { position: absolute; left: -9999px; height: 0; overflow: hidden; }

/* WooCommerce variation form inside the Relle PDP */
.relle-pdp .variations { margin: 0 0 8px; width: 100%; }
.relle-pdp .variations th,
.relle-pdp .variations td { padding: 0 0 4px; border: none; display: block; text-align: left; }
.relle-pdp .variations th label {
	font-size: 11px;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: var(--muted-txt);
	margin: 0;
}
.relle-pdp .reset_variations {
	font-size: 11px;
	letter-spacing: .08em;
	color: var(--muted-txt);
	border-bottom: 1px solid var(--line);
}
.relle-pdp .woocommerce-variation-price { margin: 10px 0; }
.relle-pdp .woocommerce-variation-price .price { font-size: 19px; color: var(--ink); }
.relle-pdp .woocommerce-variation-add-to-cart {
	display: flex;
	gap: 12px;
	align-items: stretch;
	margin-top: 16px;
}
.relle-pdp .woocommerce-variation-add-to-cart .quantity input {
	width: 68px; height: 52px; text-align: center;
	border: 1px solid var(--line); background: var(--bg);
	font-family: var(--body); font-size: 15px; color: var(--ink); border-radius: 0;
}
.relle-pdp .woocommerce-variation-add-to-cart .single_add_to_cart_button {
	flex: 1; height: 52px; background: var(--ink) !important; color: var(--bg) !important;
	border: none !important; border-radius: 0 !important;
	font-size: 11px !important; letter-spacing: .22em !important; text-transform: uppercase !important;
}
.relle-pdp .woocommerce-variation-add-to-cart .single_add_to_cart_button:hover {
	background: var(--burgundy) !important; color: #fff !important;
}
.relle-pdp .stock { font-size: 12px; color: var(--muted-txt); letter-spacing: .06em; }

/* Two-tone swatches keep a crisp diagonal split */
.relle-swatch span { background-repeat: no-repeat; }

/* ================================================================
   SEARCH OVERLAY
   ================================================================ */
button.search {
	background: none;
	border: none;
	padding: 0;
	cursor: pointer;
	font-family: var(--body);
	font-size: 11px;
	letter-spacing: .18em;
	text-transform: uppercase;
	color: var(--ink);
}
button.search:hover { color: var(--burgundy); }

.relle-search {
	position: fixed;
	inset: 0;
	z-index: 1200;
	background: var(--bg);
	display: flex;
	align-items: center;
	justify-content: center;
	opacity: 0;
	visibility: hidden;
	transition: opacity .3s ease, visibility .3s;
}
.relle-search.open { opacity: 1; visibility: visible; }

.relle-search-close {
	position: absolute;
	top: 26px;
	right: 30px;
	background: none;
	border: none;
	font-size: 34px;
	line-height: 1;
	color: var(--ink);
	cursor: pointer;
	padding: 0;
}
.relle-search-close:hover { color: var(--burgundy); }

.relle-search-inner {
	width: 100%;
	max-width: 720px;
	padding: 0 28px;
}
.relle-search-label {
	display: block;
	font-family: var(--display);
	font-weight: 300;
	font-size: clamp(26px, 4vw, 40px);
	color: var(--ink);
	margin-bottom: 24px;
	text-align: center;
}
.relle-search-row {
	display: flex;
	border-bottom: 1px solid var(--ink);
}
.relle-search-row input[type="search"] {
	flex: 1;
	background: none;
	border: none;
	outline: none;
	padding: 14px 4px;
	font-family: var(--body);
	font-size: 18px;
	color: var(--ink);
	-webkit-appearance: none;
}
.relle-search-row input::placeholder { color: var(--muted-txt); }
.relle-search-row button {
	background: none;
	border: none;
	cursor: pointer;
	font-family: var(--body);
	font-size: 11px;
	letter-spacing: .2em;
	text-transform: uppercase;
	color: var(--ink);
	padding: 0 6px 0 18px;
}
.relle-search-row button:hover { color: var(--burgundy); }

.relle-search-suggest {
	display: flex;
	flex-wrap: wrap;
	gap: 10px 16px;
	align-items: center;
	margin-top: 26px;
	justify-content: center;
}
.relle-search-suggest span {
	font-size: 11px;
	letter-spacing: .18em;
	text-transform: uppercase;
	color: var(--muted-txt);
}
.relle-search-suggest a {
	font-size: 13.5px;
	color: var(--ink);
	border-bottom: 1px solid var(--line);
	padding-bottom: 2px;
}
.relle-search-suggest a:hover { border-color: var(--ink); }

/* Colour row inside the variation table */
.relle-pdp .variations td { padding-bottom: 10px; }
.relle-pdp .variations .relle-swatches { margin-top: 2px; }

/* Search fallback when JavaScript is unavailable */
.nav-search-fallback input[type="search"] {
	border: none;
	border-bottom: 1px solid var(--line);
	background: none;
	font-family: var(--body);
	font-size: 12px;
	padding: 4px 2px;
	width: 120px;
	outline: none;
	color: var(--ink);
}
.nav-search-fallback input:focus { border-color: var(--ink); }

/* Variation image thumbnail marker */
.pdp-thumb.is-variation { border-color: var(--tan); }
.pdp-stage img { transition: opacity .25s ease; }

/* ================================================================
   ONE SIZE CONTROL — hide WooCommerce's size row on variable products
   Colour stays as the visible variation; the Relle size buttons remain
   the single place to choose a size.
   ================================================================ */
.relle-pdp .variations tr:has(select[name="pa_size"]),
.relle-pdp .variations tr:has(select[name="pa_sizes"]),
.relle-pdp .variations tr:has(select[name="size"]),
.relle-pdp .variations tr:has(select[name="sizes"]) {
	display: none !important;
}
.relle-pdp .variations select.relle-hide-attr,
.relle-pdp .variations .relle-hide-attr {
	display: none !important;
}

/* Tidy the remaining colour row */
.relle-pdp .variations { margin-bottom: 10px; }
.relle-pdp .variations tr { display: block; }
.relle-pdp .variations th {
	display: block;
	padding: 0 0 8px;
	font-size: 11px;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: var(--muted-txt);
}
.relle-pdp .variations td { display: block; padding: 0 0 6px; }

/* ================================================================
   PAGE HERO — smaller title
   ================================================================ */
.page-hero h1 {
	font-size: clamp(30px, 4.2vw, 52px) !important;
	letter-spacing: .01em;
}

/* ================================================================
   PAGE BODY — headings match the body text, no heavy sans-serif
   ================================================================ */
.page-body h1 {
	font-family: var(--display) !important;
	font-weight: 300 !important;
	font-size: clamp(26px, 3.4vw, 38px) !important;
	line-height: 1.15;
	margin: 0 0 16px;
	color: var(--ink);
}
.page-body h2 {
	font-family: var(--display) !important;
	font-weight: 300 !important;
}
.page-body h3 {
	font-family: var(--display) !important;
	font-weight: 400 !important;
}

/* ================================================================
   SIZE TABLES — wide, scrollable on small screens
   ================================================================ */
.size-table-wrap {
	overflow-x: auto;
	margin: 16px 0 28px;
	-webkit-overflow-scrolling: touch;
}
.size-table {
	width: 100%;
	min-width: 680px;
	border-collapse: collapse;
	font-size: 14px;
	font-variant-numeric: tabular-nums;
}
.size-table th {
	background: var(--card);
	border-bottom: 1px solid var(--line);
	padding: 12px 10px;
	text-align: left;
	font-size: 10.5px;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--muted-txt);
	font-weight: 400;
	white-space: nowrap;
}
.size-table td {
	padding: 10px;
	border-bottom: 1px solid var(--line);
	white-space: nowrap;
}
.size-table tbody tr:hover td { background: var(--card); }
.size-table td strong { color: var(--ink); font-weight: 500; }
.size-table th:first-child,
.size-table td:first-child,
.size-table th:nth-child(2),
.size-table td:nth-child(2) {
	position: sticky;
	background: var(--bg);
	z-index: 1;
}
.size-table th:first-child, .size-table td:first-child { left: 0; }
.size-table th:nth-child(2), .size-table td:nth-child(2) { left: 52px; }
.size-table th:first-child, .size-table th:nth-child(2) { background: var(--card); }

@media (max-width: 700px) {
	.size-table { font-size: 13px; }
	.size-table th, .size-table td { padding: 9px 8px; }
}

/* ================================================================
   PAGE WIDTH
   Prose stays comfortably readable; wide content such as the size
   tables is allowed to use the full column.
   ================================================================ */
.page-wrap {
	padding: 70px 36px 100px;
	max-width: 1180px;
}
.page-inner { width: 100%; }

/* Readable measure for body copy */
.page-body > p,
.page-body > ul,
.page-body > ol,
.page-body > h2,
.page-body > h3 {
	max-width: 76ch;
}

/* Tables and anything wide use the whole width */
.page-body .size-table-wrap,
.page-body > table,
.page-body .info-table {
	max-width: none;
	width: 100%;
}

.size-table { min-width: 760px; }

@media (max-width: 900px) {
	.page-wrap { padding: 48px 22px 70px; }
}

/* ================================================================
   PAGE WIDTH
   Prose stays at a comfortable reading measure, but wide content —
   size tables especially — is allowed to use the full page width so
   no horizontal scrolling is needed on desktop.
   ================================================================ */
.page-wrap {
	max-width: 1240px !important;
	padding: 70px 36px 100px;
	margin: 0 auto;
}
.page-inner { width: 100%; }

/* Keep paragraphs readable rather than stretching them across 1240px */
.page-body > p,
.page-body > ul,
.page-body > ol,
.page-body > h2,
.page-body > h3,
.page-body > h4 {
	max-width: 860px;
}

/* Tables use everything available */
.page-body .size-table-wrap {
	max-width: none;
	width: 100%;
}
.size-table {
	min-width: 0;            /* no forced overflow on desktop */
	width: 100%;
	table-layout: auto;
}
.size-table th,
.size-table td {
	padding: 11px 9px;
	font-size: 13.5px;
}

/* Only allow sideways scrolling where the table genuinely cannot fit */
@media (max-width: 900px) {
	.size-table { min-width: 720px; }
}
@media (max-width: 700px) {
	.page-wrap { padding: 48px 20px 70px; }
	.size-table th, .size-table td { padding: 9px 7px; font-size: 12.5px; }
}