/* Algonquin Puzzle Company. Clean, light, green used for structure. Bitter + Karla. */
:root{
  --green:#175e3e; --green-2:#1d7049; --deep:#0f4229; --gold:#9a7726; --gold-soft:#c9a55a;
  --page:#f4ecda; --warm:#ebe0c7; --mint:#e3ebdc; --card:#fbf6ea;
  color-scheme: light;
  --ink:#1d261f; --soft:#5a6358; --line:#e0d4bb; --line-2:#cfc1a3; --sold:#a13a2c;
  --serif:"Bitter", Georgia, "Times New Roman", serif;
  --sans:"Karla", system-ui, -apple-system, "Segoe UI", sans-serif;
  --wrap:1120px; --r:3px;
  box-sizing:border-box; padding-top:env(safe-area-inset-top,0px); padding-bottom:env(safe-area-inset-bottom,0px);
}
*,*::before,*::after{box-sizing:inherit}
html{scroll-behavior:smooth;scroll-padding-top:calc(env(safe-area-inset-top,0px) + 80px);-webkit-text-size-adjust:100%}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{animation:none!important;transition:none!important}}
html{font-size:calc(100% * var(--scale,1))}
body{margin:0;background:var(--page);color:var(--ink);font:1.0625rem/1.62 var(--sans);-webkit-font-smoothing:antialiased}
h1,h2,h3,h4{font-family:var(--serif);font-weight:700;line-height:1.14;margin:0;letter-spacing:-.012em}
p{margin:0}
a{color:inherit}
img{max-width:100%;display:block}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 clamp(18px,4vw,32px)}
.narrow{max-width:720px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
[hidden]{display:none!important}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:0 24px;border-radius:var(--r);border:1.5px solid var(--green);background:transparent;color:var(--green);font:700 15px/1 var(--sans);text-decoration:none;white-space:nowrap;transition:background .15s,color .15s}
.btn:hover{background:var(--mint)}
.btn.solid{background:var(--green);color:#fff}
.btn.solid:hover{background:var(--green-2);border-color:var(--green-2)}
.btn.small{min-height:40px;padding:0 16px;font-size:14px}
.btn.block{width:100%}
.btn.light{border-color:#fff;color:#fff}
.btn.light:hover{background:rgba(255,255,255,.1)}
.btn.onlight{background:#fff;border-color:#fff;color:var(--deep)}
.btn:disabled{opacity:.45;cursor:not-allowed}
.link{background:none;border:0;padding:0;color:var(--green);font-weight:700;text-decoration:underline;text-underline-offset:3px}

/* announcement, presale, nav */
.announce{background:var(--green);color:#e6f0ea;font-size:14px;text-align:center;padding:9px 16px}
.presale{background:var(--warm);border-bottom:1px solid var(--line);color:var(--ink);font-size:14.5px;text-align:center;padding:9px 16px}
.presale b{color:var(--gold)}
.nav{position:sticky;top:0;z-index:30;background:color-mix(in srgb,var(--page) 92%,transparent);backdrop-filter:saturate(1.3) blur(10px);-webkit-backdrop-filter:saturate(1.3) blur(10px);border-bottom:1px solid var(--line)}
.nav .wrap{display:flex;align-items:center;gap:28px;height:68px}
.mark{display:flex;flex-direction:column;text-decoration:none;margin-right:auto;line-height:1.1}
.mark b{font:700 18px/1.1 var(--serif);color:var(--green)}
.mark small{font:500 10.5px/1.4 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--gold);margin-top:3px}
.mark img{height:40px;width:auto}
.menu{display:flex;gap:26px}
.menu a{text-decoration:none;font-weight:500;font-size:15.5px}
.menu a:hover,.menu a[aria-current="page"]{color:var(--green)}
.cartbtn{display:inline-flex;align-items:center;gap:8px;border:1.5px solid var(--green);background:var(--green);color:#fff;border-radius:var(--r);height:40px;padding:0 14px;font-weight:700;font-size:14.5px}
.cartbtn .n{background:#fff;color:var(--green);border-radius:99px;min-width:20px;height:20px;display:inline-grid;place-items:center;font-size:12px;padding:0 5px}
.menubtn{display:none;border:0;background:none;width:42px;height:42px;margin-right:-8px}
@media (max-width:860px){
  .menu{display:none;position:absolute;left:0;right:0;top:68px;background:var(--page);border-bottom:1px solid var(--line);flex-direction:column;gap:0;padding:4px clamp(18px,4vw,32px) 12px;box-shadow:0 20px 30px -20px rgba(0,0,0,.2)}
  .menu.open{display:flex}
  .menu a{padding:13px 0;border-bottom:1px solid var(--line);font-size:17px}
  .menubtn{display:grid;place-items:center}
  .nav .wrap{gap:12px}
}

/* hero */
.hero{padding:clamp(48px,8vw,104px) 0 clamp(48px,7vw,84px);border-bottom:1px solid var(--line)}
.hero .wrap{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(28px,5vw,64px);align-items:center}
.hero h1{font-size:clamp(2.5rem,6.2vw,4.3rem);color:var(--ink)}
.hero .lede{margin-top:22px;font-size:clamp(1.05rem,1.8vw,1.22rem);color:var(--soft);max-width:34em}
.tally{margin-top:26px;display:inline-block;border:1.5px solid var(--gold);border-radius:2px;padding:8px 14px;font-size:13.5px;letter-spacing:.05em;color:var(--gold);font-weight:700}
.btns{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}
.hero-art{position:relative}
.hero-art img{width:100%;aspect-ratio:4/3.4;object-fit:cover;border-radius:var(--r)}
.boxes{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.boxes a{display:block;text-decoration:none}
@media (max-width:860px){.hero .wrap{grid-template-columns:1fr}}

/* placeholder "box label" tile, used until a photo exists */
.ph{position:relative;display:flex;flex-direction:column;justify-content:flex-end;aspect-ratio:1;background:var(--mint);border-radius:var(--r);padding:clamp(12px,2vw,20px);overflow:hidden}
.ph::before{content:"";position:absolute;inset:8px;border:1px solid color-mix(in srgb,var(--green) 35%,transparent);border-radius:2px;pointer-events:none}
.ph .k{position:absolute;top:18px;left:20px;font-size:10.5px;letter-spacing:.16em;color:var(--green);font-weight:700}
.ph b{font:700 clamp(1rem,2.2vw,1.45rem)/1.1 var(--serif);color:var(--deep)}
.ph i{font-style:normal;font-size:13px;color:var(--soft);margin-top:4px}
.ph.sm b{font-size:10px;line-height:1.15;overflow-wrap:anywhere;hyphens:auto}.ph.sm .k,.ph.sm i{display:none}.ph.sm{padding:8px}.ph.sm::before{inset:4px}

/* press */
.press{background:var(--warm);border-bottom:1px solid var(--line);padding:22px 0}
.press .wrap{display:flex;align-items:center;gap:clamp(18px,4vw,44px);flex-wrap:wrap;justify-content:center}
.press .lbl{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--soft);font-weight:700}
.press a,.press span.o{font:700 17px var(--serif);color:var(--deep);text-decoration:none;opacity:.8}
.press a:hover{opacity:1}
.press img{height:28px;width:auto;filter:grayscale(1);opacity:.75}

/* sections */
section{padding:clamp(56px,8vw,96px) 0}
.band-warm{background:var(--warm)}
.band-mint{background:var(--mint)}
.band-green{background:var(--green);color:#eef5f0}
.band-green h2{color:#fff}
.band-green .sub{color:#d3e6db}
h2{font-size:clamp(1.9rem,4.6vw,2.7rem)}
.sub{margin-top:14px;max-width:38em;color:var(--soft);font-size:1.06rem}

/* collection */
.artist-group{margin-top:clamp(40px,6vw,64px)}
.artist-group:first-of-type{margin-top:40px}
.artist-head{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding-bottom:12px;border-bottom:1.5px solid var(--green)}
.artist-head a{font:700 1.4rem var(--serif);text-decoration:none;color:var(--ink)}
.artist-head a:hover{color:var(--green)}
.artist-head small{font-size:12px;font-weight:700;letter-spacing:.12em;color:var(--gold)}
.pair{display:grid;grid-template-columns:repeat(var(--cols,2),minmax(0,1fr));gap:clamp(18px,3vw,40px);margin-top:28px}
@media (max-width:900px){.pair{grid-template-columns:repeat(min(var(--cols,2),2),minmax(0,1fr))}}
@media (max-width:560px){.pair{grid-template-columns:1fr}}
.card{display:flex;flex-direction:column}
.card .img{display:block;position:relative;text-decoration:none;border-radius:var(--r);overflow:hidden}
.card .img img{width:100%;aspect-ratio:var(--aspect,1);object-fit:cover;transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.card .img:hover img{transform:scale(1.025)}
.year{display:inline-block;margin-top:16px;font-size:11.5px;letter-spacing:.12em;color:var(--gold);font-weight:700}
.card h3{font-size:1.45rem;margin-top:6px}
.card h3 a{text-decoration:none}
.card h3 a:hover{color:var(--green)}
.meta{font-size:13.5px;color:var(--soft);margin-top:4px}
.card .body{font-size:15.5px;margin-top:10px;color:var(--ink)}
.runbar{margin-top:16px;height:4px;background:var(--line);border-radius:2px;overflow:hidden}
.runbar i{display:block;height:100%;background:var(--gold);transition:width .6s}
.runlabel{font-size:11.5px;letter-spacing:.09em;color:var(--gold);margin-top:7px;font-weight:700}
.runlabel.low{color:var(--sold)}
.price-row{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:16px}
.price{font:700 1.2rem var(--serif)}
.price s{font-weight:400;color:var(--soft);font-size:.9rem;margin-left:6px}
.tag{position:absolute;top:12px;left:12px;background:var(--page);color:var(--ink);font-size:11.5px;font-weight:700;letter-spacing:.06em;padding:4px 10px;border-radius:2px}
.tag.sold{background:var(--sold);color:#fff}
.tag.pre{background:var(--gold);color:#fff}
.notify{display:flex;gap:8px;margin-top:14px}
.notify input{flex:1;min-width:0}

/* complete collection */
.set{border:1.5px solid var(--green);border-radius:var(--r);padding:clamp(24px,4vw,40px);margin-top:clamp(40px,6vw,64px);display:grid;grid-template-columns:1.2fr 1fr;gap:28px;align-items:center;background:var(--card)}
.set h3{font-size:clamp(1.5rem,3.4vw,2rem)}
.set p{margin-top:12px;color:var(--soft)}
.set .p{font:700 2.1rem var(--serif);margin-top:18px}
.set .save{font-size:14px;color:var(--gold);font-weight:700;margin-top:2px}
.set .strip{display:grid;grid-template-columns:repeat(6,1fr);gap:6px}
.set .strip img{aspect-ratio:1;object-fit:cover;border-radius:2px;width:100%}
@media (max-width:760px){.set{grid-template-columns:1fr}.set .strip{order:-1}}

/* reasons */
.reasons{margin-top:36px;display:grid;grid-template-columns:repeat(3,1fr);gap:0 clamp(20px,3vw,36px)}
.reason{padding:24px 0;border-top:1.5px solid var(--green)}
.reason h3{font-size:1.2rem;margin-bottom:8px}
.reason p{font-size:15.5px;color:var(--ink)}
.detail{margin-top:34px;border-radius:var(--r);width:100%;aspect-ratio:21/9;object-fit:cover}
@media (max-width:760px){.reasons{grid-template-columns:1fr}}

/* timeline */
.tl{margin-top:40px;border-left:2px solid var(--line-2);padding-left:28px}
.tl-item{padding-bottom:34px;position:relative}
.tl-item:last-child{padding-bottom:0}
.tl-item::before{content:"";position:absolute;left:-36px;top:6px;width:12px;height:12px;background:var(--page);border:2px solid var(--green);border-radius:50%}
.tl-item.now::before{background:var(--gold);border-color:var(--gold)}
.tl-year{font:700 1.2rem var(--serif);color:var(--green)}
.tl-item.now .tl-year{color:var(--gold)}
.tl-item p{margin-top:6px;max-width:40em}
.stamp{display:inline-block;margin-top:12px;border:2px solid var(--sold);color:var(--sold);font:700 12px/1 var(--sans);letter-spacing:.16em;padding:6px 10px;transform:rotate(-3deg);border-radius:2px;opacity:.9}
.closing{margin-top:32px;font:700 1.15rem/1.4 var(--serif);max-width:32em}

/* next */
.next{margin-top:36px;display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,3vw,36px)}
.next h3{font-size:1.2rem;margin-bottom:8px}
.next p{font-size:15.5px}
@media (max-width:760px){.next{grid-template-columns:1fr}}

/* forms */
.signup{display:flex;flex-wrap:wrap;gap:10px;margin-top:26px;max-width:520px}
.signup input{flex:1 1 220px}
.fine{font-size:13px;margin-top:12px;opacity:.8}
.in,.fld input,.fld select,.fld textarea,.signup input,.notify input{padding:12px 14px;border:1.5px solid var(--line-2);border-radius:var(--r);background:var(--card);font-size:16px;width:100%}
.band-green .signup input{border-color:rgba(255,255,255,.35);background:rgba(255,255,255,.08);color:#fff}
.band-green .signup input::placeholder{color:rgba(255,255,255,.6)}
.in:focus,.fld input:focus,.fld select:focus,.fld textarea:focus,.signup input:focus,.notify input:focus{outline:none;border-color:var(--green);box-shadow:0 0 0 3px color-mix(in srgb,var(--green) 16%,transparent)}
.fld{display:grid;gap:5px;font-size:14px;font-weight:700;margin-top:14px}
.fld input,.fld select,.fld textarea{font-weight:400}
.two{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media (max-width:520px){.two{grid-template-columns:1fr}}
.hp{position:absolute;left:-9999px}
.ok{background:var(--mint);color:var(--deep);border-radius:var(--r);padding:12px 14px;font-weight:700;margin-top:14px}
.band-green .ok{background:rgba(255,255,255,.12);color:#fff}
.err{color:var(--sold);font-weight:700;margin-top:10px}
.note{color:var(--soft);font-size:14px}

/* artists */
.artists{margin-top:36px;display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,3vw,36px)}
@media (max-width:860px){.artists{grid-template-columns:1fr}}
.artist{text-decoration:none;display:block}
.artist .pt{aspect-ratio:4/5;border-radius:var(--r);overflow:hidden;background:var(--mint);display:grid;place-items:center}
.artist .pt img{width:100%;height:100%;object-fit:cover}
.artist .pt span{font:700 3rem var(--serif);color:var(--green);opacity:.5}
.artist h3{font-size:1.35rem;margin-top:14px}
.artist p{color:var(--soft);font-size:15px;margin-top:6px}
.artist .more{color:var(--green);font-weight:700;font-size:14.5px;margin-top:8px;display:inline-block}

/* find */
.find{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,5vw,64px);margin-top:36px}
@media (max-width:760px){.find{grid-template-columns:1fr}}
.find h3{font-size:1.25rem;margin-bottom:8px}
.list{list-style:none;margin:0;padding:0}
.list li{display:grid;grid-template-columns:62px 1fr;gap:16px;padding:14px 0;border-bottom:1px solid var(--line);align-items:center}
.list.plain li{grid-template-columns:1fr auto}
.cal{text-align:center;border:1.5px solid var(--green);border-radius:2px;padding:5px 0;line-height:1.1}
.cal b{display:block;font:700 1.4rem var(--serif);color:var(--green)}
.cal span{font-size:11px;letter-spacing:.1em;font-weight:700;color:var(--soft)}
.list small{display:block;color:var(--soft)}
.empty{color:var(--soft);padding:14px 0}

/* faq */
.faq{margin-top:32px}
details{border-top:1px solid var(--line-2);padding:18px 0}
details:last-of-type{border-bottom:1px solid var(--line-2)}
summary{font:700 1.06rem var(--serif);cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:14px;align-items:center}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";color:var(--gold);font:400 22px/1 var(--sans)}
details[open] summary::after{content:"\2013"}
details p{margin-top:10px;max-width:44em;white-space:pre-line}

/* wholesale pitch */
.ws-list{margin:22px 0 0;padding:0;list-style:none}
.ws-list li{padding:12px 0 12px 22px;border-bottom:1px solid var(--line);position:relative}
.ws-list li::before{content:"";position:absolute;left:0;top:23px;width:10px;height:2px;background:var(--gold)}

/* footer */
footer.foot{background:var(--deep);color:#cfe0d6;padding:52px 0 calc(env(safe-area-inset-bottom,0px) + 44px);font-size:15px}
.foot-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:28px}
.foot-grid a{display:block;text-decoration:none;opacity:.82;padding:3px 0}
.foot-grid a:hover{opacity:1;color:#fff}
.foot-h{font:700 14px var(--serif);color:var(--gold-soft);margin-bottom:8px}
.foot .mark b{color:#fff}.foot .mark small{color:var(--gold-soft)}
.colophon{margin-top:36px;padding-top:20px;border-top:1px solid rgba(255,255,255,.14);font-size:13px;opacity:.7;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}
@media (max-width:760px){.foot-grid{grid-template-columns:1fr 1fr}.foot-grid>div:first-child{grid-column:1/-1}}

/* product page */
.crumbs{font-size:14px;color:var(--soft);padding:20px 0 0}
.crumbs a{text-decoration:none}.crumbs a:hover{color:var(--green)}
.pdp{display:grid;grid-template-columns:1.1fr 1fr;gap:clamp(28px,5vw,64px);padding:24px 0 clamp(48px,7vw,80px);align-items:start}
@media (max-width:860px){.pdp{grid-template-columns:1fr}}
.gallery .main{border-radius:var(--r);overflow:hidden}
.gallery .main img{width:100%;aspect-ratio:1;object-fit:cover}
.thumbs{display:flex;gap:8px;margin-top:10px;overflow-x:auto}
.thumbs button{border:1.5px solid transparent;padding:0;background:none;border-radius:2px;width:76px;flex:none}
.thumbs button[aria-current="true"]{border-color:var(--green)}
.thumbs img{width:100%;aspect-ratio:1;object-fit:cover}
.pdp h1{font-size:clamp(2rem,4.8vw,3rem);margin-top:6px}
.pdp .by{font-size:1.05rem;color:var(--soft);margin-top:8px}
.pdp .by a{color:var(--green);font-weight:700}
.pdp .price{font-size:1.7rem;margin-top:18px}
.qty{display:inline-flex;align-items:center;border:1.5px solid var(--line-2);border-radius:var(--r);height:48px}
.qty button{border:0;background:none;width:44px;height:100%;font-size:20px}
.qty span{min-width:28px;text-align:center;font-weight:700}
.buyrow{display:flex;gap:10px;margin-top:20px}
.buyrow .btn{flex:1}
.specs{margin-top:28px;border-top:1px solid var(--line-2)}
.specs div{display:grid;grid-template-columns:130px 1fr;gap:12px;padding:11px 0;border-bottom:1px solid var(--line)}
.specs dt,.specs b{font-weight:700;font-size:14.5px}
.desc{margin-top:22px;white-space:pre-line}
.inset{background:var(--warm);border-radius:var(--r);padding:14px 16px;margin-top:18px;font-size:15px}
.more-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:24px}
.more-grid a{text-decoration:none}
.more-grid b{display:block;font:700 1.02rem var(--serif);margin-top:10px}
.more-grid small{color:var(--soft)}
@media (max-width:760px){.more-grid{grid-template-columns:repeat(2,1fr)}}

/* artist page */
.ap{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(28px,5vw,64px);padding:24px 0 clamp(40px,6vw,64px);align-items:start}
@media (max-width:760px){.ap{grid-template-columns:1fr}}
.ap h1{font-size:clamp(2.2rem,5vw,3.2rem)}
.ap .bio{margin-top:18px;white-space:pre-line;font-size:1.06rem}

/* sticky mobile bar */
.buybar{position:fixed;left:0;right:0;bottom:0;z-index:25;background:var(--page);border-top:1px solid var(--line-2);padding:10px clamp(14px,4vw,20px) calc(env(safe-area-inset-bottom,0px) + 10px);display:none;align-items:center;gap:12px;box-shadow:0 -10px 30px -18px rgba(0,0,0,.25);transform:translateY(100%);transition:transform .25s}
.buybar.on{transform:none}
.buybar b{font:700 1.05rem var(--serif)}
.buybar small{display:block;color:var(--soft);font-size:12.5px}
.buybar .btn{margin-left:auto}
@media (max-width:860px){.buybar{display:flex}body.has-buybar{padding-bottom:84px}}

/* drawer */
.drawer{position:fixed;inset:0;z-index:90;visibility:hidden}
.drawer.on{visibility:visible}
.drawer .scrim{position:absolute;inset:0;background:rgba(15,34,26,.4);opacity:0;transition:opacity .25s}
.drawer.on .scrim{opacity:1}
.drawer .panel{position:absolute;right:0;top:0;bottom:0;width:min(460px,100%);background:var(--page);display:flex;flex-direction:column;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px);transform:translateX(100%);transition:transform .3s cubic-bezier(.2,.7,.2,1)}
.drawer.on .panel{transform:none}
.drawer header{display:flex;justify-content:space-between;align-items:center;padding:16px 22px;border-bottom:1px solid var(--line)}
.drawer header h2{font-size:1.5rem}
.drawer .body{flex:1;overflow:auto;padding:4px 22px 22px;overscroll-behavior:contain}
.drawer footer{padding:14px 22px;border-top:1px solid var(--line);display:grid;gap:10px;background:var(--page)}
.x{border:0;background:none;width:40px;height:40px;font-size:20px;border-radius:99px;color:var(--soft)}
.x:hover{background:var(--warm)}
.line{display:grid;grid-template-columns:64px 1fr auto;gap:14px;padding:14px 0;border-bottom:1px solid var(--line);align-items:center}
.line img,.line .ph{width:64px;aspect-ratio:1;object-fit:cover;border-radius:2px}
.line b{font:700 15.5px var(--serif)}
.line small{display:block;color:var(--soft);font-size:13px}
.step{display:inline-flex;align-items:center;border:1px solid var(--line-2);border-radius:var(--r);margin-top:6px}
.step button{border:0;background:none;width:32px;height:30px;font-weight:700}
.step span{min-width:22px;text-align:center;font-weight:700;font-size:14px}
.meter{margin:14px 0 4px;font-size:13.5px;color:var(--soft)}
.meter .bar{height:4px;background:var(--line);border-radius:2px;margin-top:6px;overflow:hidden}
.meter .bar i{display:block;height:100%;background:var(--green)}
.kicker{font-size:12px;letter-spacing:.12em;color:var(--gold);margin:22px 0 2px;font-weight:700;text-transform:uppercase}
.opts{display:grid;gap:8px;margin-top:10px}
.opt{display:flex;gap:12px;align-items:center;border:1.5px solid var(--line-2);border-radius:var(--r);padding:12px 14px;background:var(--card);font-size:15px;cursor:pointer}
.opt:has(input:checked){border-color:var(--green);background:var(--mint)}
.opt span{flex:1}
.opt b{white-space:nowrap}
.opt input{accent-color:var(--green)}
.sumrow{display:flex;justify-content:space-between;padding:3px 0;font-size:15px}
.sumrow.big{font:700 1.15rem var(--serif);padding-top:10px;border-top:1px solid var(--line);margin-top:6px}
.codebox{display:flex;gap:8px;margin-top:10px}
.codebox input{flex:1;text-transform:uppercase}

/* pages: track, order, 404 */
.pagebox{padding:clamp(48px,7vw,88px) 0}
.pagebox h1{font-size:clamp(2.1rem,5vw,3rem)}
.status-steps{display:flex;gap:6px;margin-top:22px}
.status-steps span{flex:1;height:5px;border-radius:2px;background:var(--line)}
.status-steps span.on{background:var(--green)}

dialog.sheet{border:0;padding:0;border-radius:6px;width:min(560px,calc(100% - 24px));max-height:calc(100% - 40px);background:var(--page);color:var(--ink);box-shadow:0 40px 80px -20px rgba(0,0,0,.45)}
dialog.sheet.wide{width:min(900px,calc(100% - 24px))}
dialog.sheet::backdrop{background:rgba(15,34,26,.45)}
dialog.sheet header{display:flex;justify-content:space-between;align-items:center;padding:16px 20px;border-bottom:1px solid var(--line)}
dialog.sheet header h2{font-size:1.45rem}
.sheet-body{padding:6px 20px 20px}
dialog.sheet footer{display:flex;justify-content:flex-end;gap:10px;padding:14px 20px;border-top:1px solid var(--line)}
dialog.sheet .err{padding:0 20px}

#toast{position:fixed;left:50%;bottom:calc(env(safe-area-inset-bottom,0px) + 22px);transform:translate(-50%,20px);opacity:0;background:var(--deep);color:#fff;padding:12px 18px;border-radius:4px;font-weight:700;z-index:95;transition:.25s;pointer-events:none;max-width:calc(100% - 32px);text-align:center}
#toast.on{opacity:1;transform:translate(-50%,0)}
body.has-buybar #toast{bottom:calc(env(safe-area-inset-bottom,0px) + 96px)}

/* live-page editing for admins */
body.has-buybar body.editing [data-edit],body.editing [data-pedit]{outline:1.5px dashed var(--gold);outline-offset:4px;cursor:text;border-radius:2px}
body.editing [data-edit]:focus,body.editing [data-pedit]:focus{outline:2px solid var(--gold);background:color-mix(in srgb,var(--gold) 8%,transparent)}
body.editing [data-edit].dirty,body.editing [data-pedit].dirty{outline-color:var(--green)}
.imgswap{position:absolute;right:10px;bottom:10px;z-index:3;background:var(--deep);color:#fff;border:0;border-radius:4px;padding:8px 12px;font-weight:700;font-size:13px;display:none}
body.editing .imgswap{display:block}
body.editing .ph-edit{position:relative}

/* ---------- layout hardening: nothing spills sideways on any screen ---------- */
html,body{overflow-x:clip;max-width:100%}
p,li,dd,summary,.body,.desc,.bio{overflow-wrap:break-word;hyphens:auto}
h1,h2,h3{overflow-wrap:break-word;hyphens:manual;text-wrap:balance}
.sub,.lede,p{text-wrap:pretty}
.hero .wrap>*,.pair>*,.reasons>*,.next>*,.find>*,.artists>*,.foot-grid>*,.pdp>*,.ap>*,.two>*,.set>*,.orderlayout>*,.cols>*,.more-grid>*{min-width:0}
img,svg,video{height:auto}
.card .img img,.gallery .main img,.artist .pt img,.hero-art img,.detail{height:auto}
.artist .pt img{height:100%}
.boxes .ph b{font-size:clamp(.78rem,2.4vw,1.05rem)}
.boxes .ph .k{top:12px;left:14px;font-size:9px}
.boxes .ph i{font-size:11px}
@media (max-width:560px){
  .set .strip{grid-template-columns:repeat(3,1fr)}
  .hero .btns .btn{flex:1 1 100%}
  .price-row{flex-wrap:wrap}
  .buyrow{flex-wrap:wrap}.buyrow .btn{flex:1 1 60%}
  .perks li{grid-template-columns:1fr!important;gap:4px!important}
  .tl{padding-left:22px}.tl-item::before{left:-30px}
  section{padding:48px 0}
}
dialog.sheet{overflow:auto;overscroll-behavior:contain}
dialog.sheet footer{position:sticky;bottom:0;background:var(--page);z-index:2}
dialog.sheet header{position:sticky;top:0;background:var(--page);z-index:2}
.nextbox{margin-top:48px;background:var(--mint);border-radius:var(--r);padding:clamp(20px,4vw,36px)}
.nextbox .nb-h{font-size:1.5rem}
.nextbox .next{margin-top:20px}
.nextbox h4{font:700 1.08rem var(--serif);margin-bottom:6px}
.askrow{display:flex;justify-content:space-between;align-items:center;gap:18px;flex-wrap:wrap;margin-top:28px;padding:18px 20px;background:var(--warm);border-radius:var(--r)}
.askrow b{font:700 1.1rem var(--serif)}
.askrow .note{margin-top:4px;max-width:34em}
.drag{outline:2px dashed var(--gold)!important;outline-offset:4px}

/* ---------- nothing spills out of dialogs, filters or dropdowns ---------- */
.cols{grid-template-columns:repeat(auto-fit,minmax(min(340px,100%),1fr))}
.rowed{grid-template-columns:repeat(auto-fit,minmax(min(120px,100%),1fr))}
.rowed>*,.fld,.opt>span{min-width:0}
select,.fld select,.in{max-width:100%;min-width:0;text-overflow:ellipsis}
.opt{flex-wrap:wrap;row-gap:8px}
.opt .btn{margin-left:auto}
dialog.sheet{overflow-x:hidden}
dialog.sheet .sheet-body{overflow-x:hidden}
dialog.sheet .tw{margin:0;padding:0;max-width:100%}
dialog.sheet header h2{overflow-wrap:anywhere;min-width:0}
dialog.sheet footer{flex-wrap:wrap}
details>summary{min-width:0}
details .tw{max-width:100%}
.consent{position:fixed;left:12px;right:12px;bottom:calc(env(safe-area-inset-bottom,0px) + 12px);z-index:65;max-width:560px;margin:0 auto;background:var(--card);border:1px solid var(--line-2);border-radius:6px;box-shadow:0 18px 40px -20px rgba(0,0,0,.35);padding:14px 16px;display:flex;gap:14px;align-items:center;flex-wrap:wrap;font-size:14.5px}
.consent p{flex:1 1 240px}
.consent div{display:flex;gap:8px}
body.has-buybar .consent{bottom:calc(env(safe-area-inset-bottom,0px) + 92px)}
.btn{max-width:100%}
@media (max-width:400px){.btn{white-space:normal;text-align:center;line-height:1.25;padding-top:10px;padding-bottom:10px}}
/* ---------- design layout ---------- */
.sec{padding:var(--pt,88px) 0 var(--pb,88px);position:relative}
.sec.hero{padding:var(--pt,88px) 0 var(--pb,88px);border-bottom:0}
.sec.press{padding:var(--pt,22px) 0 var(--pb,22px)}
@media (max-width:760px){.sec,.sec.hero,.sec.press{padding-top:calc(var(--pt,88px) * .6);padding-bottom:calc(var(--pb,88px) * .6)}}
.sec>.wrap{max-width:var(--w,1120px)}
.sec.hero>.wrap{grid-template-columns:var(--split,1.05fr .95fr)}
@media (max-width:860px){.sec.hero>.wrap{grid-template-columns:1fr}}
.bg-white{background:#fffdf8}
.band-green.bg-deep{background:#10261c}
.sec.al-center>.wrap>h2,.sec.al-center>.wrap>.sub,.sec.al-center>.wrap>div>h1,.sec.al-center>.wrap>div>.lede,.sec.al-center>.wrap>.fine{text-align:center;margin-left:auto;margin-right:auto}
.sec.al-center .btns,.sec.al-center .signup{justify-content:center;margin-left:auto;margin-right:auto}
.sec.al-center .tally{display:table;margin-left:auto;margin-right:auto}

/* ---------- HQ bar: a slim bar across the top when you're signed in ---------- */
#hq{position:fixed;left:0;right:0;top:0;z-index:80;height:40px;background:#10261c;color:#e8efe9;display:flex;align-items:center;gap:4px;padding:0 10px 0 14px;font:500 13.5px/1 var(--sans);overflow-x:auto;scrollbar-width:none;box-shadow:0 1px 0 rgba(255,255,255,.06)}
#hq::-webkit-scrollbar{display:none}
#hq .hq-brand{font:700 13.5px var(--serif);color:#fff;text-decoration:none;margin-right:8px;white-space:nowrap}
#hq .hq-brand small{color:#d7b86c;font:700 10px var(--sans);letter-spacing:.14em;margin-left:6px}
#hq button,#hq a.hq-link{background:none;border:0;color:#e8efe9;text-decoration:none;padding:7px 10px;border-radius:5px;white-space:nowrap;font:inherit;cursor:pointer;flex:none}
#hq button:hover,#hq a.hq-link:hover{background:rgba(255,255,255,.1)}
#hq button.on{background:#fff;color:#10261c;font-weight:700}
#hq button.go{background:#9a7726;color:#fff;font-weight:700}
#hq .hq-sep{width:1px;height:18px;background:rgba(255,255,255,.2);margin:0 4px;flex:none}
#hq .hq-right{margin-left:auto;display:flex;gap:2px;flex:none}
body.has-hq{padding-top:40px}
body.has-hq .nav{top:40px}
html:has(body.has-hq){scroll-padding-top:130px}

/* ---------- design mode ---------- */
body.designing .sec{outline:1px dashed transparent;outline-offset:-1px;cursor:pointer;transition:outline-color .15s}
body.designing .sec:hover{outline-color:rgba(154,119,38,.6)}
body.designing .sec.sel{outline:2px solid #9a7726;cursor:default;z-index:6}
body.designing #app a,body.designing #app button,body.designing #app summary,body.designing #foot a,body.designing header.nav a{cursor:pointer}
body.designing .sec-hidden{opacity:.35}
body.designing .sec-hidden::before{content:attr(data-hidden-label);position:absolute;left:50%;top:10px;transform:translateX(-50%);background:#10261c;color:#fff;font:600 12px var(--sans);padding:4px 10px;border-radius:4px;z-index:5}
.dh{position:absolute;z-index:20;background:#9a7726;color:#fff;border-radius:4px;display:flex;align-items:center;justify-content:center;font:700 11px var(--sans);touch-action:none;user-select:none;box-shadow:0 2px 8px rgba(0,0,0,.25);pointer-events:auto}
.dh.pad{left:50%;bottom:6px;transform:translateX(-50%);width:104px;height:22px;cursor:ns-resize}
.dh.side{top:50%;width:14px;height:64px;transform:translateY(-50%);cursor:ew-resize}
.dh.split{width:14px;height:90px;cursor:col-resize;transform:translate(-50%,-50%);top:50%}
.dh.cols{width:14px;height:70px;cursor:ew-resize;transform:translate(-50%,-50%)}
.dh-tip{position:fixed;z-index:95;background:#10261c;color:#fff;font:600 12px var(--sans);padding:5px 9px;border-radius:4px;pointer-events:none}
#dpanel{position:fixed;right:0;top:40px;bottom:0;width:340px;z-index:85;background:#fbf7ee;border-left:1px solid #d9ccb0;box-shadow:-12px 0 30px -18px rgba(0,0,0,.35);display:flex;flex-direction:column;font:14px/1.45 var(--sans);color:#1d261f}
#dpanel header{display:flex;align-items:center;gap:8px;padding:12px 14px;border-bottom:1px solid #e0d4bb}
#dpanel header b{font:700 16px var(--serif);margin-right:auto}
#dpanel .tabs2{display:flex;border-bottom:1px solid #e0d4bb}
#dpanel .tabs2 button{flex:1;background:none;border:0;padding:10px 4px;font:600 13px var(--sans);color:#5a6358;border-bottom:2px solid transparent;cursor:pointer}
#dpanel .tabs2 button[aria-selected="true"]{color:#175e3e;border-color:#175e3e}
#dpanel .dbody{flex:1;overflow:auto;padding:12px 14px 30px}
#dpanel .row{display:flex;align-items:center;gap:8px;margin:10px 0}
#dpanel .row label{flex:1;font-weight:600;font-size:13px}
#dpanel input[type=range]{width:100%;accent-color:#175e3e}
#dpanel input[type=color]{width:44px;height:30px;border:1px solid #cfc1a3;border-radius:4px;padding:0;background:none}
#dpanel select{width:100%;padding:8px;border:1px solid #cfc1a3;border-radius:4px;background:#fff;font:inherit}
#dpanel .lbl{font:700 11px var(--sans);letter-spacing:.1em;color:#9a7726;margin:18px 0 6px;text-transform:uppercase}
#dpanel .val{font-variant-numeric:tabular-nums;color:#5a6358;font-size:12.5px;min-width:52px;text-align:right}
#dpanel .swatches{display:flex;gap:6px;flex-wrap:wrap}
#dpanel .swatches button{width:36px;height:30px;border-radius:5px;border:2px solid #cfc1a3;cursor:pointer}
#dpanel .swatches button[aria-pressed="true"]{border-color:#1d261f;box-shadow:0 0 0 2px #fbf7ee inset}
#dpanel .seg{display:flex;border:1px solid #cfc1a3;border-radius:5px;overflow:hidden}
#dpanel .seg button{flex:1;background:#fff;border:0;border-right:1px solid #cfc1a3;padding:7px 4px;font:600 12.5px var(--sans);cursor:pointer}
#dpanel .seg button:last-child{border-right:0}
#dpanel .seg button[aria-pressed="true"]{background:#175e3e;color:#fff}
#dpanel .slist{list-style:none;margin:0;padding:0}
#dpanel .slist li{display:flex;align-items:center;gap:8px;padding:9px 8px;border:1px solid #e0d4bb;border-radius:5px;margin-bottom:6px;background:#fff;cursor:grab}
#dpanel .slist li.sel{border-color:#9a7726;box-shadow:0 0 0 1px #9a7726}
#dpanel .slist li.off{opacity:.5}
#dpanel .slist li.over{border-top:3px solid #175e3e}
#dpanel .slist .nm{flex:1;font-weight:600}
#dpanel .slist button{background:none;border:0;cursor:pointer;padding:2px 6px;font-size:14px}
#dpanel .dbtn{background:#fff;border:1px solid #cfc1a3;border-radius:5px;padding:7px 12px;font:600 13px var(--sans);cursor:pointer;color:#1d261f}
#dpanel .dbtn.solid{background:#175e3e;border-color:#175e3e;color:#fff}
#dpanel .hint{color:#5a6358;font-size:12.5px;margin-top:8px}
body.designing.has-dpanel{padding-right:340px}
@media (max-width:900px){
  #dpanel{top:auto;left:0;width:auto;height:50vh;border-left:0;border-top:1px solid #d9ccb0;box-shadow:0 -12px 30px -18px rgba(0,0,0,.35)}
  body.designing.has-dpanel{padding-right:0;padding-bottom:50vh}
}

/* ---------- any section set to a dark background flips to light text ---------- */
.sec:is(.band-green:not(.on-light),.on-dark){--ink:#f4f1e6;--soft:#cfdccf;--line:rgba(255,255,255,.2);--line-2:rgba(255,255,255,.3);--card:rgba(255,255,255,.06);--mint:rgba(255,255,255,.08);--warm:rgba(255,255,255,.08);color:var(--ink)}
.sec:is(.band-green:not(.on-light),.on-dark) h1,.sec:is(.band-green:not(.on-light),.on-dark) h2,.sec:is(.band-green:not(.on-light),.on-dark) h3,.sec:is(.band-green:not(.on-light),.on-dark) h4{color:#fff}
.sec:is(.band-green:not(.on-light),.on-dark) .lede,.sec:is(.band-green:not(.on-light),.on-dark) .sub,.sec:is(.band-green:not(.on-light),.on-dark) p{color:#e3ece5}
.sec:is(.band-green:not(.on-light),.on-dark) .btn{border-color:rgba(255,255,255,.5);color:#fff;background:transparent}
.sec:is(.band-green:not(.on-light),.on-dark) .btn.solid{background:#c9a55a;border-color:#c9a55a;color:#10261c}
.sec:is(.band-green:not(.on-light),.on-dark) .tally{border-color:rgba(255,255,255,.35);color:#fff}
.sec:is(.band-green:not(.on-light),.on-dark) a:not(.btn){color:#f0dca8}
.sec:is(.band-green:not(.on-light),.on-dark) .card .img,.sec:is(.band-green:not(.on-light),.on-dark) .artist .pt{background:rgba(255,255,255,.06)}
.sec:is(.band-green:not(.on-light),.on-dark) .ph b,.sec:is(.band-green:not(.on-light),.on-dark) .ph i{color:#e3ece5}

/* ---------- photo tools (edit mode) ---------- */
.ph-edit,.hero-art,.pt,.card .img,.gallery .main{position:relative}
.card .img,.gallery .main,.artist .pt,.hero-art{overflow:hidden}
.imgtools{position:absolute;left:8px;bottom:8px;z-index:6;display:flex;gap:4px;flex-wrap:wrap}
.imgtools button{background:rgba(16,38,28,.88);color:#fff;border:0;border-radius:5px;padding:7px 11px;font:600 12.5px var(--sans);cursor:pointer;box-shadow:0 2px 10px rgba(0,0,0,.25)}
.imgtools button:hover{background:#10261c}
.imgtools [data-it="remove"]{background:rgba(161,58,44,.9)}
.imgtools.drag,.ph-edit.drag,.pt.drag,.hero-art.drag,.gal-grid.drag{outline:3px dashed #9a7726;outline-offset:-3px}
.logo-tools,.press-tools{position:relative;display:inline-block;vertical-align:middle;margin-left:8px}
.logo-tools .imgtools,.press-tools .imgtools{position:static}
.press-tools .imgtools button{padding:4px 7px;font-size:11px}
.gal-edit{margin-top:12px;background:var(--warm);border-radius:6px;padding:12px}
.gal-h{font:700 11px var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--gold);margin:0 0 8px}
.gal-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:8px}
.gal-grid figure{margin:0;position:relative;border-radius:5px;overflow:hidden;background:var(--mint);aspect-ratio:1}
.gal-grid figure img{width:100%;height:100%;object-fit:cover;display:block}
.gal-btns{position:absolute;left:3px;right:3px;top:3px;display:flex;justify-content:space-between;gap:2px}
.gal-btns.bot{top:auto;bottom:3px}
.gal-btns button,.gal-main{background:rgba(16,38,28,.85);color:#fff;border:0;border-radius:4px;font:700 11px var(--sans);padding:4px 6px;cursor:pointer}
.gal-main{background:#9a7726}
.gal-add{aspect-ratio:1;border:2px dashed var(--line-2);border-radius:5px;background:transparent;font:700 13px var(--sans);color:var(--green);cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px}
.gal-add small{font-weight:400;color:var(--soft);font-size:11px}
dialog.adj .adj-pic{position:relative;margin:12px 0;border-radius:6px;overflow:hidden;cursor:crosshair;touch-action:none;background:var(--mint)}
dialog.adj .adj-pic img{display:block;width:100%;max-height:52vh;object-fit:contain;user-select:none;-webkit-user-drag:none}
dialog.adj .adj-dot{position:absolute;width:26px;height:26px;margin:-13px 0 0 -13px;border:3px solid #fff;border-radius:50%;box-shadow:0 0 0 2px #10261c,0 2px 8px rgba(0,0,0,.4);pointer-events:none}
dialog.adj .adj-row{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:12px 0;font-weight:600;flex-wrap:wrap}
dialog.adj .adj-row input[type=range]{flex:1;min-width:160px;accent-color:var(--green)}
dialog.adj .seg2{display:flex;border:1px solid var(--line-2);border-radius:5px;overflow:hidden}
dialog.adj .seg2 button{background:var(--card);border:0;padding:8px 12px;font:600 13px var(--sans);cursor:pointer}
dialog.adj .seg2 button[aria-pressed="true"]{background:var(--green);color:#fff}

/* ---------- reviews ---------- */
.stars{--r:5;display:inline-block;font-size:15px;letter-spacing:1px;line-height:1;background:linear-gradient(90deg,var(--gold,#9a7726) calc(var(--r) / 5 * 100%),#d6c9ab 0);-webkit-background-clip:text;background-clip:text;color:transparent;vertical-align:-1px}
.stars.lg{font-size:22px}
.rate{display:inline-flex;align-items:center;gap:6px;font-size:13.5px;color:var(--soft);text-decoration:none;margin:4px 0 2px}
.rate b{color:var(--ink)}
.rate.big{font-size:15px;margin:6px 0 10px}
.rate.big a{color:var(--green)}
.rv-sec{border-top:1px solid var(--line);padding-top:40px}
.rv-head{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap;margin-bottom:20px}
.rv-sum{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:6px 0 18px;color:var(--soft)}
.rv-sum b{color:var(--ink)}
.rv-layout{display:grid;grid-template-columns:220px minmax(0,1fr);gap:32px;align-items:start}
@media (max-width:760px){.rv-layout{grid-template-columns:1fr;gap:18px}}
.rv-bars div{display:grid;grid-template-columns:30px 1fr 24px;gap:8px;align-items:center;font-size:13px;color:var(--soft);margin:5px 0}
.rv-bars i{height:7px;border-radius:4px;background:var(--line);overflow:hidden}
.rv-bars i b{display:block;height:100%;background:var(--gold,#9a7726)}
.rv-list{display:grid;gap:14px}
.rv-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(300px,100%),1fr));gap:16px;margin-top:6px}
.review{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:18px 20px}
.review h4{font:700 1.08rem var(--serif);margin:10px 0 4px}
.review .rv-body{margin:6px 0 0;white-space:pre-line}
.rv-top{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.rv-ver{font:700 11px var(--sans);letter-spacing:.06em;color:var(--green);background:var(--mint);border-radius:20px;padding:3px 8px}
.rv-by{font-size:14px;color:var(--soft);margin:12px 0 0}
.rv-by b{color:var(--ink)}
.rv-by span{white-space:nowrap}
.rv-reply{margin-top:12px;border-left:3px solid var(--green);padding:6px 0 6px 12px;font-size:14.5px}
.rv-reply p{margin:4px 0 0}
.sec:is(.band-green:not(.on-light),.on-dark) .review{background:rgba(255,255,255,.06)}
.starpick{display:flex;flex-direction:row-reverse;justify-content:flex-end;gap:2px;margin-top:6px}
.starpick input{position:absolute;opacity:0;pointer-events:none}
.starpick label{cursor:pointer;font-size:36px;line-height:1;color:#d6c9ab;transition:transform .1s,color .1s}
.starpick label:hover,.starpick label:hover~label,.starpick input:checked~span,.starpick label:has(input:checked),.starpick label:has(input:checked)~label{color:var(--gold,#9a7726)}
.starpick label:active{transform:scale(1.15)}
.starpick input:focus-visible+span{outline:2px solid var(--green);outline-offset:2px;border-radius:4px}
.rv-word{display:block;font-size:13px;color:var(--soft);min-height:1.2em;margin-top:2px}
.rv-items{display:grid;gap:18px;margin-top:22px}
.rv-item{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:18px}
.rv-pz{display:flex;align-items:center;gap:14px}
.rv-pz img,.rv-pz .ph{width:64px;height:64px;object-fit:cover;border-radius:4px;flex:none;font-size:8px}
.rv-pz b{display:block;font:700 1.1rem var(--serif)}
.rv-pz small{color:var(--soft)}
.rv-thanks{text-align:center;padding:10px 0}
.rv-thanks.sm{display:flex;align-items:center;gap:12px;text-align:left;padding:0}
.big-star{font-size:40px;color:var(--gold,#9a7726);line-height:1}
.rv-more{margin-top:20px}

/* ---------- polish ---------- */
.card .img .tag,.more-grid .tag{left:auto;right:12px}
.rv-sum{gap:8px}
.rv-sum span{color:var(--soft)}
.review h4{font-size:1.15rem}
.review .rv-body{font-size:1rem;line-height:1.6}
.more-grid .rate{display:flex;margin:2px 0 0}
.skip{position:absolute;left:12px;top:-60px;z-index:100;background:var(--green);color:#fff;padding:10px 16px;border-radius:4px;font-weight:700;text-decoration:none}
.skip:focus{top:12px}
/* the main photo opens full screen */
.gallery .main img{cursor:zoom-in}
.zoom-btn{position:absolute;right:12px;bottom:12px;z-index:4;width:40px;height:40px;border-radius:50%;border:0;background:rgba(255,253,248,.92);color:var(--ink);font-size:18px;cursor:pointer;box-shadow:0 4px 14px rgba(0,0,0,.18);transition:transform .15s}
.zoom-btn:hover{transform:scale(1.08)}
dialog.lb{position:fixed;inset:0;width:100vw;height:100dvh;max-width:none;max-height:none;margin:0;padding:0;border:0;background:rgba(12,22,16,.96);color:#fff}
dialog.lb::backdrop{background:rgba(12,22,16,.96)}
.lb-stage{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;overflow:hidden;touch-action:none}
.lb-stage img{max-width:94vw;max-height:84dvh;object-fit:contain;transition:transform .2s;user-select:none;-webkit-user-drag:none;cursor:zoom-in}
.lb-stage.zoomed img{cursor:zoom-out}
.lb-x,.lb-prev,.lb-next{position:absolute;z-index:2;border:0;background:rgba(255,255,255,.12);color:#fff;border-radius:50%;width:46px;height:46px;font-size:22px;cursor:pointer}
.lb-x{top:max(14px,env(safe-area-inset-top));right:14px}
.lb-prev{left:14px;top:50%;transform:translateY(-50%)}.lb-next{right:14px;top:50%;transform:translateY(-50%)}
.lb-x:hover,.lb-prev:hover,.lb-next:hover{background:rgba(255,255,255,.22)}
.lb-cap{position:absolute;left:0;right:0;bottom:max(16px,env(safe-area-inset-bottom));text-align:center;font-size:14px;opacity:.85}
/* gentle reveal as sections scroll into view (never while editing or designing) */
@media (prefers-reduced-motion:no-preference){
  .reveal .sec:not(.hero):not([data-anim]){opacity:0;transform:translateY(14px);transition:opacity .6s ease,transform .6s ease}
  .reveal .sec.seen:not(.hero):not([data-anim]){opacity:1;transform:none}
}
/* cart button gives a little bump when something's added */
@keyframes bump{0%{transform:scale(1)}40%{transform:scale(1.14)}100%{transform:scale(1)}}
.bump{animation:bump .45s ease}

/* ---------- live / hidden ---------- */
#hq .hq-pill{font:700 11.5px var(--sans);letter-spacing:.04em;padding:5px 10px;border-radius:20px;text-decoration:none;margin-right:6px;white-space:nowrap;align-self:center}
#hq .hq-pill.hidden{background:#9a7726;color:#fff}
#hq .hq-pill.live{background:#2f8a5c;color:#fff}
.preview-ribbon{position:fixed;right:12px;bottom:calc(env(safe-area-inset-bottom,0px) + 12px);z-index:70;display:flex;align-items:center;gap:8px;background:#10261c;color:#e8efe9;font-size:12.5px;line-height:1.35;padding:7px 8px 7px 14px;border-radius:30px;box-shadow:0 8px 24px rgba(0,0,0,.25);max-width:min(340px,calc(100vw - 24px))}
.preview-ribbon b{color:#d7b86c;letter-spacing:.06em;text-transform:uppercase;font-size:11px}
.preview-ribbon button{flex:none;width:26px;height:26px;border-radius:50%;border:0;background:rgba(255,255,255,.12);color:#fff;cursor:pointer;font-size:13px}
body.has-buybar .preview-ribbon{bottom:calc(env(safe-area-inset-bottom,0px) + 90px)}

/* ---------- sections you add yourself ---------- */
.blk{position:relative;padding:var(--pt,64px) 0 var(--pb,64px)}
.blk>.wrap{max-width:var(--w,1120px)}
.blk-h{margin:0 0 14px}
.blk-p{white-space:pre-line;font-size:1.06rem;line-height:1.7;margin:0;max-width:44em}
.al-center .blk-p{margin:0 auto}
.blk-btns{margin:22px 0 0}
.blk-empty{border:2px dashed var(--line-2);border-radius:var(--r);padding:28px;text-align:center;color:var(--soft);font:600 14px var(--sans)}
.blk-ph{position:relative;overflow:hidden;border-radius:var(--r);background:var(--mint)}
.blk-ph>img{display:block;width:100%;height:100%;object-fit:cover}
.blk-noimg{min-height:220px;display:flex;align-items:center;justify-content:center;border:2px dashed var(--line-2);background:transparent}
.blk-noimg>span{color:var(--soft);font:600 14px var(--sans)}
.blk-fig{margin:0 auto}
.blk-fig.sz-normal{max-width:860px}.blk-fig.sz-small{max-width:480px}.blk-fig.sz-wide{max-width:100%}
.blk-image.sec:has(.sz-full)>.wrap{max-width:none;padding:0}
.blk-fig.sz-full .blk-ph{border-radius:0}
.blk-fig.fixed .blk-ph>img{height:100%}
.blk-fig figcaption{font-size:.92rem;color:var(--soft);margin-top:10px;text-align:center}
.blk-fig a{display:block}
.blk-it{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,5vw,64px);align-items:center}
.blk-it .blk-ph{aspect-ratio:4/3}
.blk-it.side-right>.blk-ph,.blk-it.side-right>div:first-child{order:2}
.blk-gal{display:grid;grid-template-columns:repeat(var(--gc,3),minmax(0,1fr));gap:14px}
.blk-gal figure{margin:0}
.blk-gal .blk-ph{aspect-ratio:var(--ga,1)}
.blk-gal-open{display:block;width:100%;padding:0;border:0;background:none;cursor:zoom-in}
.blk-gal figcaption{font-size:.9rem;color:var(--soft);margin-top:6px}
.blk-gal .gal-add{width:100%;aspect-ratio:1;border:2px dashed var(--line-2);border-radius:var(--r);background:none;font:700 14px var(--sans);color:var(--green);cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px}
.blk-cols{display:grid;grid-template-columns:repeat(var(--gc,3),minmax(0,1fr));gap:clamp(18px,3vw,32px)}
.blk-col .blk-ph{aspect-ratio:4/3;margin-bottom:14px}
.blk-col h3{margin:0 0 6px;font-size:1.2rem}.blk-col p{margin:0;white-space:pre-line;color:var(--soft)}
.blk-col-a{color:inherit;text-decoration:none;display:block}.blk-col-a:hover h3{color:var(--green)}
.blk-q{margin:0 auto;max-width:36em;text-align:center}
.blk-q p{font:600 clamp(1.4rem,3vw,2.1rem)/1.35 var(--serif);margin:0;white-space:pre-line}
.blk-q p::before{content:"";display:block;width:48px;height:3px;background:var(--gold);margin:0 auto 22px}
.blk-q cite{display:block;margin-top:16px;font:600 .95rem var(--sans);font-style:normal;color:var(--soft);letter-spacing:.04em}
.blk-vid{position:relative;aspect-ratio:16/9;border-radius:var(--r);overflow:hidden;background:#10261c}
.blk-vid iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.blk-vid-cover{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:#e3ece5;font:600 15px var(--sans)}
.blk-cap{color:var(--soft);font-size:.92rem;margin-top:10px}
.blk-spacer{padding:0!important;display:flex;align-items:center;justify-content:center}
.blk-spacer i{display:block}.blk-spacer .ln-thin{width:min(1120px,calc(100% - 40px));height:1px;background:var(--line-2)}.blk-spacer .ln-gold{width:56px;height:3px;background:var(--gold)}
body.designing .blk-spacer{outline:1px dashed rgba(154,119,38,.35);outline-offset:-1px;min-height:12px}
.al-center .blk-btns,.al-center .blk-h{text-align:center}
.blk-signup .signup{margin-top:18px}
@media (max-width:760px){
  .blk-it{grid-template-columns:minmax(0,1fr)}.blk-it.side-right>.blk-ph,.blk-it.side-right>div:first-child{order:0}
  .blk-gal{grid-template-columns:repeat(min(var(--gc,3),2),minmax(0,1fr));gap:8px}
  .blk-cols{grid-template-columns:minmax(0,1fr)}
}
.slot-empty{border:2px dashed rgba(154,119,38,.45);border-radius:6px;padding:22px;margin:24px auto;text-align:center;color:#5a6358;font:14px var(--sans)}

/* ---------- removing parts while designing ---------- */
body.designing .el-off{opacity:.3;outline:2px dashed #a13a2c;outline-offset:2px;filter:grayscale(1)}
body.designing .el-sel{outline:2px solid #a13a2c!important;outline-offset:3px;border-radius:2px}
body.designing [data-el]:hover,body.designing .sec.sel [data-edit]:hover{outline:1px dashed rgba(161,58,44,.55);outline-offset:3px}
.eltool{position:absolute;z-index:90;display:flex;gap:4px;align-items:center;background:#10261c;color:#fff;border-radius:6px;padding:4px;box-shadow:0 6px 18px rgba(0,0,0,.3);font:600 12.5px var(--sans)}
.eltool span{padding:0 6px;opacity:.8}
.eltool button{background:#a13a2c;color:#fff;border:0;border-radius:4px;padding:6px 10px;font:inherit;cursor:pointer}
.eltool [data-part=back]{background:#2f8a5c}.eltool [data-part=x]{background:rgba(255,255,255,.14)}

/* ---------- Design panel: builder controls ---------- */
#dpanel .tabs2 button{font-size:12.5px;padding:10px 2px}
#dpanel .dbtn.block{width:100%;padding:10px}
#dpanel .dbtn.danger{color:#a13a2c;border-color:#e3b9b1}
#dpanel .link{background:none;border:0;color:#175e3e;text-decoration:underline;cursor:pointer;font:600 13px var(--sans);padding:0}
#dpanel .dadd{display:grid;grid-template-columns:1fr 1fr;gap:8px}
#dpanel .dadd button{text-align:left;background:#fff;border:1px solid #e0d4bb;border-radius:6px;padding:10px;cursor:pointer;font:inherit;color:inherit}
#dpanel .dadd button:hover{border-color:#175e3e;box-shadow:0 0 0 1px #175e3e}
#dpanel .dadd b{display:block;font-size:13.5px}#dpanel .dadd small{display:block;color:#5a6358;font-size:11.5px;line-height:1.35;margin-top:3px}
#dpanel .dfld{display:block;font-weight:600;font-size:13px;margin:12px 0 0}
#dpanel .dfld input:not([type=checkbox]),#dpanel .dfld textarea,#dpanel .dnav input{display:block;width:100%;margin-top:5px;padding:8px 9px;border:1px solid #cfc1a3;border-radius:4px;background:#fff;font:400 14px var(--sans);color:#1d261f;box-sizing:border-box}
#dpanel .dfld textarea{resize:vertical;line-height:1.45}
#dpanel .dfld .seg{margin-top:5px}
#dpanel .dimg{display:flex;gap:10px;align-items:center;margin-top:6px}
#dpanel .dimg img,#dpanel .dimg>span{width:72px;height:56px;object-fit:cover;border-radius:4px;background:#ebe0c7;flex:none;display:flex;align-items:center;justify-content:center;font:500 11px var(--sans);color:#5a6358;text-align:center}
#dpanel .dimg>div{display:flex;flex-wrap:wrap;gap:6px}
#dpanel .dgal{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:6px 0 8px}
#dpanel .dgal figure{margin:0;background:#fff;border:1px solid #e0d4bb;border-radius:5px;padding:5px}
#dpanel .dgal img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:3px;display:block}
#dpanel .dgal input{width:100%;margin-top:4px;padding:4px 6px;border:1px solid #e0d4bb;border-radius:3px;font:12px var(--sans);box-sizing:border-box}
#dpanel .dgal figure div{display:flex;gap:2px;margin-top:4px}
#dpanel .dgal figure div button{flex:1;background:#f4ecda;border:0;border-radius:3px;padding:3px;cursor:pointer}
#dpanel .dcard{border:1px solid #e0d4bb;border-radius:5px;background:#fff;padding:8px 10px;margin-top:8px}
#dpanel .dcard summary{cursor:pointer;font-weight:700}
#dpanel .dskus{display:flex;flex-direction:column;gap:4px;margin-top:6px;font-weight:400}
#dpanel .dpg{display:flex;align-items:center;gap:8px;background:#fff;border:1px solid #e0d4bb;border-radius:5px;padding:8px 10px;margin-bottom:6px}
#dpanel .dpg b{flex:none}#dpanel .dpg small{flex:1;color:#5a6358;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#dpanel .dpg-d{background:#fff;border:1px solid #e0d4bb;border-radius:5px;padding:8px 10px;margin-bottom:6px}
#dpanel .dpg-d summary{cursor:pointer;display:flex;gap:8px;align-items:baseline}#dpanel .dpg-d summary small{color:#5a6358}
#dpanel .dslug{display:flex;align-items:center;gap:2px;font-weight:400;color:#5a6358}#dpanel .dslug input{margin-top:0!important}
#dpanel .dchk{display:flex;gap:8px;align-items:center;margin:10px 0 0;font-weight:600;font-size:13px}
#dpanel .dnav{display:grid;grid-template-columns:1fr 1.3fr;gap:6px;background:#fff;border:1px solid #e0d4bb;border-radius:5px;padding:8px;margin-bottom:6px}
#dpanel .dnav input{margin-top:0}
#dpanel .dnav div{grid-column:1/-1;display:flex;gap:4px;justify-content:flex-end}
#dpanel .dnav div button{background:#f4ecda;border:0;border-radius:3px;padding:3px 9px;cursor:pointer}
#dpanel .doff{list-style:none;margin:0;padding:0}
#dpanel .doff li{display:flex;align-items:center;gap:8px;padding:6px 0;border-bottom:1px solid #eee3cb;font-size:13px}
#dpanel .doff li span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.al-center .blk-p{text-align:center}
body.designing .sec{scroll-margin-top:110px}

/* ================= site builder: section looks ================= */
.sec>.wrap{position:relative;z-index:2}
.sec:not(.no-clip){overflow:clip}
.sec.sec-full>.wrap{max-width:none}
.sec.al-right>.wrap>h2,.sec.al-right>.wrap>.sub,.sec.al-right .blk-h,.sec.al-right .blk-p,.sec.al-right .blk-btns{text-align:right;margin-left:auto}
.sec.va-center,.sec.va-bottom{display:flex;flex-direction:column}
.sec.va-center>.wrap{margin-top:auto;margin-bottom:auto;width:100%}
.sec.va-bottom>.wrap{margin-top:auto;width:100%}
.sec.on-light{--ink:#1d261f;--soft:#5a6358;--line:#e0d4bb;--line-2:#cfc1a3;--card:#fbf6ea;color:var(--ink)}
.sec.on-light h1,.sec.on-light h2,.sec.on-light h3,.sec.on-light h4{color:var(--ink)}
.sec.on-dark h1,.sec.on-dark h2,.sec.on-dark h3{text-shadow:0 1px 18px rgba(0,0,0,.18)}
.sec-bg{position:absolute;left:0;right:0;top:calc(-1 * var(--pv,0%));bottom:calc(-1 * var(--pv,0%));z-index:0;transform:translate3d(0,var(--py,0px),0);will-change:transform}
.sec-bg img{width:100%;height:100%;object-fit:cover;display:block}
.sec-tint{position:absolute;inset:0;z-index:0;pointer-events:none}
.fx-blur .sec-bg img{filter:blur(6px);transform:scale(1.06)}
.fx-bw .sec-bg img{filter:grayscale(1)}
.fx-zoom .sec-bg img{animation:kb 24s ease-in-out infinite alternate}
@keyframes kb{from{transform:scale(1)}to{transform:scale(1.14)}}
/* section entrance */
.sec[data-anim]:not(.in){opacity:0}
.sec[data-anim]{transition:opacity .9s ease,transform .9s cubic-bezier(.2,.7,.2,1)}
.sec[data-anim=rise]:not(.in){transform:translateY(40px)}
.sec[data-anim=zoom]:not(.in){transform:scale(.94)}
.sec[data-anim=left]:not(.in){transform:translateX(-60px)}
.sec[data-anim=right]:not(.in){transform:translateX(60px)}

/* ================= freely placed pieces ================= */
.el-layer{position:absolute;top:0;bottom:0;left:50%;width:min(var(--w,1120px),calc(100% - 40px));transform:translateX(-50%);container-type:inline-size;pointer-events:none}
.sec-full>.el-layer{width:calc(100% - 40px)}
.el-layer.back{z-index:1}.el-layer.front{z-index:3}
.el{position:absolute;transform:translate3d(0,var(--py,0px),0) rotate(var(--rot,0deg)) scaleX(var(--flip,1));transform-origin:50% 50%;pointer-events:auto}
.el-layer .el:not(.has-link):not(.el-btn){pointer-events:none}
body.designing .el-layer .el{pointer-events:auto!important}
.el-in{width:100%;height:100%;position:relative}
.el-img .el-in,.el-shape .el-in{overflow:hidden}
.el-img img{width:100%;height:100%;display:block}
.el-shp{width:100%;height:100%;box-sizing:border-box}
.el-txt{white-space:pre-line;overflow-wrap:break-word;color:inherit;box-sizing:border-box}
a.el-btn{display:block;width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding:.8em 1.2em;box-sizing:border-box}
.el-a{display:block;width:100%;height:100%;color:inherit;text-decoration:none}
.el-ph{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:repeating-linear-gradient(45deg,rgba(23,94,62,.08) 0 10px,rgba(23,94,62,.14) 10px 20px);color:var(--soft);font:600 13px var(--sans);border:2px dashed var(--line-2)}
.sh-soft .el-in{box-shadow:0 10px 30px -8px rgba(0,0,0,.35)}
.sh-hard .el-in{box-shadow:6px 6px 0 rgba(0,0,0,.85)}
.sh-glow .el-in{box-shadow:0 0 40px rgba(201,165,90,.7)}
.el-txt .sh-soft,.sh-soft .el-txt{box-shadow:none}
.el-in{transition:transform .35s ease,box-shadow .35s ease,filter .35s ease}
.hov-lift:hover .el-in{transform:translateY(-6px)}
.hov-zoom:hover .el-in{transform:scale(1.06)}
.hov-glow:hover .el-in{filter:drop-shadow(0 0 14px rgba(201,165,90,.9))}
.hov-tilt:hover .el-in{transform:rotate(-3deg) scale(1.03)}
/* entrance animations on pieces (the inner box moves, so rotation and parallax stay put) */
.an .el-in{transition:opacity var(--dur,.8s) ease var(--ad,0ms),transform var(--dur,.8s) cubic-bezier(.2,.7,.2,1) var(--ad,0ms)}
.an:not(.in) .el-in{opacity:0}
.an-rise:not(.in) .el-in{transform:translateY(40px)}
.an-drop:not(.in) .el-in{transform:translateY(-40px)}
.an-left:not(.in) .el-in{transform:translateX(-80px)}
.an-right:not(.in) .el-in{transform:translateX(80px)}
.an-zoom:not(.in) .el-in{transform:scale(.7)}
.an-pop:not(.in) .el-in{transform:scale(.4)}
.an-pop.in .el-in{transition-timing-function:ease,cubic-bezier(.3,1.6,.5,1)}
.an-spin:not(.in) .el-in{transform:rotate(-120deg) scale(.5)}
@media (prefers-reduced-motion:reduce){.an .el-in,.sec[data-anim],.mq-track,.fx-zoom .sec-bg img{transition:none!important;animation:none!important;opacity:1!important;transform:none!important}}
@media (max-width:700px){.el.no-ph{display:none}}

/* free canvas */
.cv{position:relative;width:100%;container-type:inline-size}
.blk-canvas.cv-full{padding-left:0;padding-right:0}
.cv-empty{position:absolute;inset:10%;display:flex;align-items:center;justify-content:center}
body.designing .cv{outline:1px dashed rgba(154,119,38,.45);outline-offset:-1px}
@media (max-width:700px){
  .cv.stack{aspect-ratio:auto!important;display:flex;flex-direction:column;gap:14px}
  .cv.stack .el{position:relative;left:auto!important;top:auto!important;width:100%!important;transform:none;z-index:auto!important}
  .cv.stack .el-shape{display:none}
  .cv.stack .el-txt,.cv.stack .el-btn{font-size:max(15px,calc(var(--fs,20) * .55px))!important}
}

/* slideshow */
.ss{position:relative;height:var(--ssh,70vh);min-height:320px;overflow:hidden;border-radius:var(--r);background:#10261c;touch-action:pan-y;user-select:none}
.ss-full .ss{border-radius:0}
.blk-slideshow.ss-full{padding-left:0;padding-right:0}
.ss-track{position:absolute;inset:0}
.ss-slide{position:absolute;inset:0;opacity:0;transition:opacity .9s ease,transform .8s cubic-bezier(.2,.7,.2,1)}
.ss-slide.on{opacity:1;z-index:1}
.fx-slide .ss-track{display:flex;transition:transform .8s cubic-bezier(.2,.7,.2,1);transform:translateX(calc(var(--i,0) * -100%))}
.fx-slide .ss-slide{position:relative;flex:0 0 100%;opacity:1}
.ss-slide>img,.ss-noimg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ss-noimg{background:linear-gradient(135deg,#1d4a34,#10261c)}
.fx-zoom .ss-slide.on>img{animation:kb 9s ease-out forwards}
.ss-slide::after{content:"";position:absolute;inset:0;background:rgba(0,0,0,var(--ov,.35));pointer-events:none}
.ss-words{position:absolute;inset:0;z-index:2;display:flex;align-items:center;padding:0 clamp(24px,7vw,96px);color:#fff}
.tp-center .ss-words{justify-content:center;text-align:center}
.tp-bottom .ss-words{align-items:flex-end;padding-bottom:clamp(48px,8vh,90px)}
.ss-in{max-width:640px}
.ss-words h2{color:#fff;font-size:clamp(2rem,5vw,3.6rem);margin:0 0 12px;text-shadow:0 2px 24px rgba(0,0,0,.25)}
.ss-words p{color:#f1ede1;font-size:clamp(1.05rem,1.8vw,1.3rem);margin:0 0 22px}
.ss-words .btn.solid{background:#c9a55a;border-color:#c9a55a;color:#10261c}
.ss-slide .imgtools{z-index:4}
.ss-prev,.ss-next{position:absolute;top:50%;transform:translateY(-50%);z-index:3;width:46px;height:46px;border-radius:50%;border:0;background:rgba(255,255,255,.18);color:#fff;font-size:26px;cursor:pointer;backdrop-filter:blur(6px)}
.ss-prev{left:14px}.ss-next{right:14px}
.ss-prev:hover,.ss-next:hover{background:rgba(255,255,255,.32)}
.ss-dots{position:absolute;bottom:16px;left:0;right:0;z-index:3;display:flex;justify-content:center;gap:8px}
.ss-dots button{width:9px;height:9px;border-radius:9px;border:0;background:rgba(255,255,255,.5);padding:0;cursor:pointer;transition:width .3s}
.ss-dots button[aria-current=true]{width:26px;background:#fff}

/* scrolling strip */
.blk-marquee{padding-left:0;padding-right:0}
.mq{overflow:hidden;font:600 var(--mqf,28px)/1.2 var(--serif);color:var(--ink);-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.mq-track{display:flex;width:max-content;animation:mq var(--mqs,30s) linear infinite}
.mq-rev .mq-track{animation-direction:reverse}
.mq-pause:hover .mq-track{animation-play-state:paused}
.mq-run{display:flex;align-items:center;flex:none}
.mq-i{white-space:nowrap;padding:0 .6em}
.mq-sep{color:var(--gold);padding:0 .3em}
.mq-img img{height:calc(var(--mqf,28px) * 4);width:auto;display:block;border-radius:var(--r)}
@keyframes mq{from{transform:translateX(0)}to{transform:translateX(-50%)}}
body.designing .mq-track{animation-play-state:paused}

/* swipe row */
.sw{position:relative}
.sw-row{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;padding:4px 2px 14px;scrollbar-width:thin;-webkit-overflow-scrolling:touch}
.sw-card{flex:0 0 min(var(--cw,300px),80vw);scroll-snap-align:start}
.sw-card .blk-ph{aspect-ratio:var(--ga,4/5);margin-bottom:12px}
.sw-card h3{margin:0 0 4px;font-size:1.15rem}.sw-card p{margin:0;color:var(--soft);white-space:pre-line}
.sw-prev,.sw-next{position:absolute;top:calc(var(--cw,300px) * .5);transform:translateY(-50%);width:42px;height:42px;border-radius:50%;border:1px solid var(--line-2);background:var(--card);color:var(--ink);font-size:22px;cursor:pointer;box-shadow:0 4px 14px rgba(0,0,0,.12);z-index:2}
.sw-prev{left:-14px}.sw-next{right:-14px}
@media (max-width:760px){.sw-prev,.sw-next{display:none}}

/* ================= design mode: moving pieces ================= */
body.designing .el{cursor:move}
body.designing .el:hover{outline:1px dashed rgba(23,94,62,.7);outline-offset:2px}
.el.el-on{outline:2px solid #175e3e!important;outline-offset:0}
.el .eh{position:absolute;width:12px;height:12px;background:#fff;border:2px solid #175e3e;border-radius:3px;z-index:5;touch-action:none}
.el .eh[data-h=nw]{left:-7px;top:-7px;cursor:nwse-resize}.el .eh[data-h=ne]{right:-7px;top:-7px;cursor:nesw-resize}
.el .eh[data-h=sw]{left:-7px;bottom:-7px;cursor:nesw-resize}.el .eh[data-h=se]{right:-7px;bottom:-7px;cursor:nwse-resize}
.el .eh[data-h=n]{left:calc(50% - 6px);top:-7px;cursor:ns-resize}.el .eh[data-h=s]{left:calc(50% - 6px);bottom:-7px;cursor:ns-resize}
.el .eh[data-h=w]{top:calc(50% - 6px);left:-7px;cursor:ew-resize}.el .eh[data-h=e]{top:calc(50% - 6px);right:-7px;cursor:ew-resize}
.el .eh[data-h=rot]{left:calc(50% - 8px);top:-34px;width:16px;height:16px;border-radius:50%;cursor:grab;background:#9a7726;border-color:#fff}
.el .eh[data-h=rot]::after{content:"";position:absolute;left:5px;top:14px;width:2px;height:12px;background:#175e3e}
.el-guide{position:absolute;z-index:80;background:#d0417e;pointer-events:none}
.el-guide.v{top:0;bottom:0;width:1px}.el-guide.h{left:0;right:0;height:1px}
.el-tip{position:fixed;z-index:95;background:#10261c;color:#fff;font:600 12px var(--sans);padding:4px 8px;border-radius:4px;pointer-events:none}
.el-txt[contenteditable]{outline:2px dashed #9a7726;cursor:text;min-width:2em}
body.designing .sec.drop-here{box-shadow:inset 0 0 0 3px #9a7726}
.sec-grip{position:absolute;left:10px;top:10px;z-index:30;background:#10261c;color:#fff;border:0;border-radius:5px;padding:6px 10px;font:700 12px var(--sans);cursor:grab;touch-action:none;box-shadow:0 3px 10px rgba(0,0,0,.25)}
.sec-drop-line{position:absolute;left:0;right:0;height:4px;background:#9a7726;z-index:90;pointer-events:none;border-radius:2px}
.dh.padt{left:50%;top:6px;transform:translateX(-50%);width:118px;height:22px;cursor:ns-resize}
#dpanel header{flex-wrap:nowrap}
#dpanel .dbtn.icon{padding:6px 9px;font-size:15px;line-height:1}
#dpanel .dbtn:disabled{opacity:.4;cursor:default}
#dpanel .dadd4{display:grid;grid-template-columns:1fr 1fr;gap:6px}
#dpanel .dpieces{list-style:none;margin:8px 0 0;padding:0;display:flex;flex-direction:column;gap:4px}
#dpanel .dpieces li{display:flex;align-items:center;gap:8px;padding:7px 9px;background:#fff;border:1px solid #e0d4bb;border-radius:5px;cursor:pointer;font-size:13px}
#dpanel .dpieces li:hover{border-color:#175e3e}
#dpanel .dpieces li span:nth-child(2){flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#dpanel .dpieces small{color:#9a7726;font-size:11px}
#dpanel .dp-i{width:14px;height:14px;border-radius:3px;flex:none;background:#cfc1a3}
#dpanel .dp-img{background:linear-gradient(135deg,#4a7d61,#175e3e)}#dpanel .dp-text{background:#1d261f}#dpanel .dp-btn{background:#9a7726}#dpanel .dp-shape{background:#e3ebdc;border:1px solid #9a7726;border-radius:50%}
#dpanel .dmore{border:1px solid #e0d4bb;border-radius:5px;background:#fff;padding:8px 10px;margin-top:10px}
#dpanel .dmore summary{cursor:pointer;font-weight:700;font-size:13px}
#dpanel .dxy{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
#dpanel .dxy label{font-size:11.5px;font-weight:600;color:#5a6358}
#dpanel .dxy input{width:100%;padding:6px;border:1px solid #cfc1a3;border-radius:4px;font:13px var(--sans);box-sizing:border-box;margin-top:3px}
#dpanel .dfld select{margin-top:5px}
#dpanel .row .dchk{margin:0 12px 0 0}
.opts.stale{opacity:.5;pointer-events:none;transition:opacity .15s}.opts{transition:opacity .15s}
/* Cart drawer on phones: one smooth scrolling list, a short pinned pay bar, nothing hidden under Safari's toolbar. */
.drawer .panel{height:100%;height:100dvh;max-height:100dvh}
.drawer .body{-webkit-overflow-scrolling:touch;overscroll-behavior:contain;touch-action:pan-y;min-height:0}
.drawer .scrim{touch-action:none}
.drawer footer{padding:10px 22px calc(10px + env(safe-area-inset-bottom,0px));box-shadow:0 -6px 18px rgba(20,30,20,.06)}
.sumbox{margin-top:18px;padding-top:12px;border-top:1px solid var(--line)}
.paybar{display:flex;align-items:center;gap:14px}
.paytot{display:flex;flex-direction:column;line-height:1.15;min-width:84px}
.paytot small{font-size:12px;opacity:.7}.paytot b{font:700 1.2rem var(--serif)}
.paybar .btn{flex:1;min-height:50px;padding-left:12px;padding-right:12px}
#cartBody input,#cartBody textarea,#cartBody select{font-size:16px}
@media (min-width:700px){.drawer footer{padding-bottom:14px}}
/* sale prices */
.price.on-sale{color:#a3322a}
.price.on-sale s{color:var(--soft)}
.tag.sale{background:#a3322a;color:#fff}
.sale-note{margin:8px 0 0;font:700 .85rem/1.4 var(--sans);color:#a3322a}
.pdp .sale-note{margin-top:6px;font-size:.95rem}