:root{
  --paper:#f4ecdc;
  --paper-2:#ebe0c9;
  --ink:#2b1d14;        /* the brown from her current site, deepened */
  --ink-soft:#5a4636;
  --marigold:#e8772e;
  --poppy:#d2412c;
  --tide:#1f6f8b;
  --moss:#5d7a3a;
  --swallow:#f2d16b;
  --radius:4px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;overflow-x:clip}
body{
  margin:0;background:var(--paper);color:var(--ink);overflow-x:clip;
  font:400 17px/1.6 "Work Sans",system-ui,sans-serif;
  /* faint paper grain */
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .17 0 0 0 0 .11 0 0 0 0 .08 0 0 0 .07 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
img{max-width:100%;display:block}
a{color:inherit}
.wrap{max-width:1180px;margin:0 auto;padding:0 20px}
h1,h2,h3{font-family:Fraunces,Georgia,serif;font-variation-settings:"SOFT" 100,"WONK" 1;line-height:1.02;margin:0;font-weight:800}
.hand{font-family:Caveat,cursive;font-weight:700}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
[hidden]{display:none !important}

/* ---------- buttons ---------- */
.btn{
  display:inline-flex;align-items:center;gap:.5em;
  font:600 15px/1 "Work Sans",sans-serif;letter-spacing:.04em;text-transform:uppercase;text-decoration:none;
  padding:15px 22px;border:2px solid var(--ink);border-radius:var(--radius);
  background:var(--ink);color:var(--paper);cursor:pointer;
  box-shadow:4px 4px 0 var(--marigold);transition:transform .15s,box-shadow .15s;
}
.btn:hover{transform:translate(-2px,-2px);box-shadow:6px 6px 0 var(--marigold)}
.btn:active{transform:translate(2px,2px);box-shadow:1px 1px 0 var(--marigold)}
.btn.ghost{background:transparent;color:var(--ink);box-shadow:4px 4px 0 var(--tide)}
.btn.ghost:hover{box-shadow:6px 6px 0 var(--tide)}
.btn.light{color:var(--paper);border-color:var(--paper);box-shadow:4px 4px 0 var(--swallow)}

/* ---------- header ---------- */
header.top{
  position:sticky;top:0;z-index:20;
  background:color-mix(in srgb,var(--paper) 92%,transparent);backdrop-filter:blur(6px);
  border-bottom:2px solid var(--ink);
}
.top .wrap{display:flex;align-items:center;justify-content:space-between;height:68px;gap:16px}
.logo{display:flex;align-items:center;gap:10px;text-decoration:none}
.logo img{width:44px;height:44px;object-fit:cover;border-radius:50%;border:2px solid var(--ink)}
.logo span{font-family:Fraunces,serif;font-weight:800;font-size:21px;letter-spacing:-.01em}
nav.links{display:flex;gap:26px;align-items:center}
nav.links a{text-decoration:none;font-weight:500}
nav.links a:not(.btn):hover,
nav.links a[aria-current="page"]{text-decoration:underline wavy var(--marigold);text-underline-offset:6px}
nav.links .btn{padding:11px 16px;font-size:13px}
.menu-btn{display:none;background:none;border:2px solid var(--ink);border-radius:var(--radius);padding:8px 10px;font:600 14px "Work Sans";cursor:pointer;color:var(--ink)}
@media (max-width:860px){
  .menu-btn{display:block}
  nav.links{display:none;position:absolute;top:68px;left:0;right:0;flex-direction:column;gap:0;background:var(--paper);border-bottom:2px solid var(--ink)}
  nav.links.open{display:flex}
  nav.links a{padding:16px 20px;width:100%;border-top:1px dashed var(--ink-soft)}
  nav.links .btn{margin:14px 20px;width:auto;justify-content:center}
}

/* ---------- hero (home) ---------- */
.hero{padding:32px 0 40px;overflow:hidden}
.hero .wrap{display:grid;grid-template-columns:1.1fr .9fr;gap:48px;align-items:center}
.eyebrow{font-family:Caveat,cursive;font-size:28px;color:var(--poppy);transform:rotate(-2deg);display:inline-block;margin-bottom:2px}
.hero h1{font-size:clamp(46px,7.6vw,104px);letter-spacing:-.02em}
/* misregistered two-color print */
.print{position:relative;display:inline-block;color:var(--ink)}
.print::before{
  content:attr(data-text);position:absolute;left:0;top:0;z-index:-1;
  color:var(--marigold);transform:translate(5px,4px);mix-blend-mode:multiply;
}
.l2{color:var(--tide)} .l2::before{color:var(--swallow)}
.l3{color:var(--poppy)} .l3::before{color:var(--tide);opacity:.55}
.hero p.lede{font-size:20px;max-width:34ch;margin:26px 0 30px;color:var(--ink-soft)}
.ctas{display:flex;flex-wrap:wrap;gap:16px}
.hero-art{position:relative;justify-self:center;width:min(100%,460px)}
.hero-art .frame{
  background:#fff;padding:14px 14px 54px;border:1px solid #d8ccb4;
  box-shadow:0 18px 40px -18px rgba(43,29,20,.55);transform:rotate(2.5deg);
}
.hero-art .frame img{aspect-ratio:4/3;object-fit:cover;width:100%}
.hero-art .frame .hand{position:absolute;bottom:12px;left:22px;font-size:26px;color:var(--ink-soft)}
.tape{position:absolute;width:110px;height:30px;background:rgba(242,209,107,.75);top:-12px;left:50%;transform:translateX(-50%) rotate(-4deg);box-shadow:0 1px 2px rgba(0,0,0,.1)}
.stamp{
  position:absolute;right:-18px;top:-26px;width:118px;height:118px;border-radius:50%;
  background:var(--poppy);color:var(--paper);display:grid;place-items:center;text-align:center;
  font:700 22px/1.05 Caveat,cursive;transform:rotate(12deg);border:3px dashed var(--paper);outline:3px solid var(--poppy);
}
@media (max-width:820px){
  .hero{padding:20px 0 24px}
  .hero .wrap{grid-template-columns:1fr;gap:42px}
  .stamp{right:-4px;width:96px;height:96px;font-size:18px}
}

/* ---------- inner page header ---------- */
.page-head{padding:26px 0 20px}
@media (max-width:820px){.page-head{padding-top:18px}}
.page-head h1{font-size:clamp(48px,8vw,96px);letter-spacing:-.02em}
.page-head p{font-size:20px;max-width:52ch;color:var(--ink-soft);margin:18px 0 0}

/* ---------- marquee ---------- */
.marquee{background:var(--ink);color:var(--paper);border-block:2px solid var(--ink);overflow:hidden;white-space:nowrap;transform:rotate(-1.2deg);margin:36px -2%;width:104%}
.marquee .track{display:inline-block;padding:14px 0;animation:scroll 38s linear infinite;font-family:Fraunces,serif;font-style:italic;font-size:24px}
.marquee .track span{margin:0 18px}
.marquee .track b{color:var(--marigold);font-style:normal}
@keyframes scroll{to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.marquee .track{animation:none}}

/* ---------- sections ---------- */
section{padding:80px 0}
.page-head + section{padding-top:20px}
.sec-head{display:flex;justify-content:space-between;align-items:end;gap:20px;flex-wrap:wrap;margin-bottom:36px}
.sec-head h2{font-size:clamp(38px,5.5vw,64px)}
.sec-head .hand{font-size:26px;color:var(--tide)}
.more{margin-top:40px;display:flex;justify-content:center}

/* about */
.about .wrap{display:grid;grid-template-columns:.85fr 1.15fr;gap:56px;align-items:center}
.about .pic{position:relative}
.about .pic img{border:2px solid var(--ink);border-radius:var(--radius);aspect-ratio:3/4;object-fit:cover;width:100%;transform:rotate(-2deg)}
.about .pic .hand{position:absolute;bottom:-26px;right:-6px;background:var(--swallow);padding:4px 14px;font-size:24px;transform:rotate(-4deg);border:2px solid var(--ink)}
.about p{font-size:19px;max-width:56ch}
.about p.drop::first-letter{font-family:Fraunces,serif;font-weight:900;float:left;font-size:84px;line-height:.8;padding:6px 10px 0 0;color:var(--poppy)}
.sig{font-family:Caveat,cursive;font-size:40px;color:var(--ink);margin-top:10px}
@media (max-width:820px){.about .wrap{grid-template-columns:1fr;gap:48px}.about .pic{max-width:380px}}

/* shop */
.shop{background:var(--paper-2);border-block:2px solid var(--ink)}
.chips{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:28px}
.chip{font:500 15px "Work Sans";padding:8px 16px;border:2px solid var(--ink);border-radius:999px;background:transparent;color:var(--ink);cursor:pointer}
.chip[aria-pressed="true"]{background:var(--ink);color:var(--paper)}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:28px}
.card{background:#fffaf0;border:2px solid var(--ink);border-radius:var(--radius);display:flex;flex-direction:column;transition:transform .2s}
.card:nth-child(3n+1){transform:rotate(-.6deg)}
.card:nth-child(3n+2){transform:rotate(.5deg)}
.card:hover{transform:rotate(0) translateY(-4px)}
.card .img{aspect-ratio:1;overflow:hidden;border-bottom:2px solid var(--ink);background:var(--paper)}
.card .img img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.card:hover .img img{transform:scale(1.05)}
.card .body{padding:16px 18px 18px;display:flex;flex-direction:column;gap:6px;flex:1}
.card .kind{font:700 20px Caveat,cursive;color:var(--moss)}
.card h3{font-size:24px}
.card p{margin:0;color:var(--ink-soft);font-size:15px;flex:1}
.card .row{display:flex;justify-content:space-between;align-items:center;margin-top:12px;gap:10px}
.card .price{font-family:Fraunces,serif;font-weight:700;font-size:22px}
.card .btn{padding:11px 14px;font-size:13px;box-shadow:3px 3px 0 var(--marigold)}
.shop-foot{margin-top:44px;display:flex;flex-wrap:wrap;gap:18px;align-items:center;justify-content:center;text-align:center}
.shop-foot .hand{font-size:26px}
.secure{font-size:14px;color:var(--ink-soft);display:flex;gap:6px;align-items:center}

/* process */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;counter-reset:s}
.step{border:2px dashed var(--ink);border-radius:var(--radius);padding:24px 22px 26px;position:relative;background:var(--paper)}
.step::before{counter-increment:s;content:counter(s);position:absolute;top:-22px;left:18px;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;font:800 22px Fraunces,serif;color:var(--paper);background:var(--c,var(--ink))}
.step h3{font-size:28px;margin:12px 0 6px}
.step p{margin:0;color:var(--ink-soft);font-size:16px}
@media (max-width:900px){.steps{grid-template-columns:1fr 1fr;row-gap:40px}}
@media (max-width:520px){.steps{grid-template-columns:1fr}}

/* gallery: even grid, two big featured tiles */
.gallery .cols{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-flow:dense;gap:22px}
.gallery figure{margin:0;display:flex;flex-direction:column;background:#fff;padding:10px 10px 6px;border:1px solid #d8ccb4;box-shadow:0 8px 20px -14px rgba(43,29,20,.6)}
.gallery figure.big{grid-column:span 2;grid-row:span 2}
.gallery figure:nth-child(odd){transform:rotate(-.6deg)}
.gallery figure:nth-child(even){transform:rotate(.6deg)}
.gallery button{all:unset;cursor:zoom-in;display:block;position:relative;aspect-ratio:1;overflow:hidden}
.gallery figure.big button{flex:1;aspect-ratio:auto;min-height:0}
.gallery img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.gallery figure.big img{position:absolute;inset:0}
.gallery button:hover img{transform:scale(1.04)}
.gallery figcaption{font:700 21px Caveat,cursive;color:var(--ink-soft);padding-top:6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media (max-width:900px){
  .gallery .cols{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
  .gallery figure.big{grid-row:auto}
  .gallery figure.big button{flex:none;aspect-ratio:4/3}
}
@media (max-width:420px){.gallery .cols{gap:12px}.gallery figure{padding:6px 6px 2px}.gallery figcaption{font-size:18px}}

/* panels (in person + list) */
.duo .wrap{display:grid;grid-template-columns:1fr 1fr;gap:28px}
.panel{border:2px solid var(--ink);border-radius:var(--radius);padding:36px 32px;position:relative;overflow:hidden}
.panel h2{font-size:clamp(32px,4vw,44px);margin-bottom:12px}
.panel.sea{background:var(--tide);color:var(--paper)}
.panel.sea .hand{color:var(--swallow);font-size:26px}
.panel.sun{background:var(--marigold)}
.panel.sun .hand{font-size:26px}
.panel .wave{position:absolute;right:-30px;bottom:-30px;width:200px;opacity:.18}
form.list{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}
form.list input{flex:1 1 220px;padding:14px;border:2px solid var(--ink);border-radius:var(--radius);font:16px "Work Sans";background:var(--paper)}
form.list .btn{box-shadow:4px 4px 0 var(--paper)}
@media (max-width:820px){.duo .wrap{grid-template-columns:1fr}}

/* contact */
.contact .wrap:first-child{display:grid;grid-template-columns:1.25fr .75fr;gap:40px;align-items:stretch}
.contact .band{margin-top:48px;display:grid;grid-template-columns:1fr 1fr;gap:16px 48px;align-items:center;padding:40px 44px}
.contact .band p{margin:0}
.contact .band form.list{margin-top:0}
.side .panel:last-child{flex:1;display:flex;flex-direction:column}
/* form stretches to the side column's height; the extra goes to the message box */
.contact .wrap:first-child > div{display:flex}
.contact form.note{flex:1;grid-template-rows:auto auto 1fr auto auto}
.contact form.note label:has(textarea){grid-template-rows:auto auto 1fr}
.contact form.note label:has(textarea) textarea{height:100%;align-self:stretch}
.side .doodle{margin-top:auto;padding-top:18px;font-size:26px;color:var(--poppy);transform:rotate(-3deg);align-self:flex-end}
@media (max-width:860px){.contact .band{grid-template-columns:1fr;padding:28px 24px}}
form.note{
  background:#fffaf0;border:2px solid var(--ink);border-radius:var(--radius);padding:32px;
  box-shadow:8px 8px 0 var(--tide);display:grid;gap:18px;min-width:0;
}
form.note .two{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:18px}
form.note label{display:grid;gap:6px;font-weight:600;font-size:15px}
form.note label span.hand{font-weight:700;font-size:20px;color:var(--ink-soft)}
form.note input,form.note select,form.note textarea{
  font:16px "Work Sans";color:var(--ink);background:var(--paper);
  border:2px solid var(--ink);border-radius:var(--radius);padding:13px 14px;width:100%;
}
form.note textarea{min-height:170px;resize:vertical;
  background-image:repeating-linear-gradient(transparent 0 31px,rgba(31,111,139,.18) 31px 32px);line-height:32px;padding-top:6px}
form.note .btn{justify-self:start}
form.note .fine{font-size:14px;color:var(--ink-soft);margin:0}
.sent{display:none;font:700 28px Caveat,cursive;color:var(--moss)}
.sent.show{display:block}
.side{display:flex;flex-direction:column;gap:24px}
.side .panel{padding:28px 26px}
.side .panel h2{font-size:32px}
.side ul{list-style:none;padding:0;margin:0;display:grid;gap:12px}
.side li{display:flex;gap:12px;align-items:baseline}
.side li b{font:700 22px Caveat,cursive;min-width:74px}
@media (max-width:860px){.contact .wrap:first-child{grid-template-columns:minmax(0,1fr)}form.note .two{grid-template-columns:minmax(0,1fr)}form.note{padding:22px}}

/* footer */
footer{background:var(--ink);color:var(--paper);padding:56px 0 34px;margin-top:0}
/* last block before the footer gets a shorter bottom */
main > section:last-child,main > .checkout{padding-bottom:56px}
@media (max-width:820px){main > section:last-child,main > .checkout{padding-bottom:40px}}
footer .wrap{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:32px}
footer h3{font-size:34px;margin-bottom:10px}
footer a{text-decoration:none}
footer a:hover{color:var(--swallow)}
footer ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
footer .fine{grid-column:1/-1;border-top:1px solid rgba(244,236,220,.25);padding-top:20px;font-size:14px;color:rgba(244,236,220,.75);display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:10px 24px}
.built-by{display:flex;align-items:center;gap:10px;font-size:13px;letter-spacing:.12em;text-transform:uppercase;white-space:nowrap}
.built-by a{display:block;background:#f7f7f7;border-radius:6px;padding:4px 8px;transition:transform .2s,box-shadow .2s}
.built-by a:hover{transform:translateY(-2px);box-shadow:0 8px 20px rgba(0,0,0,.4)}
.built-by img{height:28px;width:80px;max-width:none}
@media (max-width:820px){footer .wrap{grid-template-columns:1fr}}

/* lightbox */
dialog{border:none;padding:0;background:transparent;max-width:92vw}
dialog::backdrop{background:rgba(43,29,20,.85)}
dialog img{max-height:84vh;width:auto;border:10px solid #fff}
dialog p{color:var(--paper);font:700 26px Caveat,cursive;text-align:center;margin:10px 0 0}
dialog .x{position:fixed;top:16px;right:20px;background:var(--paper);border:2px solid var(--ink);border-radius:50%;width:44px;height:44px;font-size:22px;cursor:pointer}

:focus-visible{outline:3px solid var(--tide);outline-offset:3px}

/* ---------- cart button + drawer ---------- */
.cart-btn{position:relative}
.cart-btn .count{display:inline-grid;place-items:center;min-width:22px;height:22px;padding:0 6px;border-radius:999px;background:var(--marigold);color:var(--ink);font-size:12px;letter-spacing:0}
.cart-btn .count[hidden]{display:none}
.top .cart-mobile{display:none}
@media (max-width:860px){.top .cart-mobile{display:inline-flex;margin-left:auto;padding:9px 12px;font-size:13px}}
.btn.added{background:var(--moss);border-color:var(--moss)}
.drawer-scrim{position:fixed;inset:0;background:rgba(43,29,20,.55);z-index:40}
.drawer{
  position:fixed;top:0;right:0;bottom:0;width:min(420px,100%);z-index:41;
  background:var(--paper);border-left:2px solid var(--ink);display:flex;flex-direction:column;
  transform:translateX(105%);transition:transform .3s ease;visibility:hidden;
}
.drawer.open{transform:none;visibility:visible}
.drawer-head{display:flex;justify-content:space-between;align-items:center;padding:20px 22px;border-bottom:2px solid var(--ink)}
.drawer-head h2{font-size:32px}
.drawer .x{background:var(--paper);border:2px solid var(--ink);border-radius:50%;width:40px;height:40px;font-size:20px;cursor:pointer;color:var(--ink)}
.drawer-body{flex:1;overflow:auto;padding:8px 22px}
.line{display:grid;grid-template-columns:64px 1fr auto;gap:14px;align-items:center;padding:14px 0;border-bottom:1px dashed var(--ink-soft)}
.line img{width:64px;height:64px;object-fit:cover;border:2px solid var(--ink);border-radius:var(--radius)}
.line b{font-family:Fraunces,serif;font-size:18px}
.line .amt{font-family:Fraunces,serif;font-weight:700;font-size:18px}
.qty{display:inline-flex;align-items:center;gap:10px;margin-top:6px;border:2px solid var(--ink);border-radius:999px;padding:2px}
.qty button{width:28px;height:28px;border:none;border-radius:50%;background:transparent;font-size:18px;cursor:pointer;color:var(--ink)}
.qty button:hover{background:var(--paper-2)}
.qty span{min-width:16px;text-align:center;font-weight:600}
.empty{font-size:26px;text-align:center;color:var(--ink-soft);margin:40px 0 20px}
.drawer-foot{padding:18px 22px 24px;border-top:2px solid var(--ink);background:var(--paper-2)}
.drawer-foot:empty{display:none}
.sum{display:flex;justify-content:space-between;font-size:18px}
.sum b{font-family:Fraunces,serif;font-size:22px}
.drawer-foot .note{font-size:14px;color:var(--ink-soft);margin:6px 0 16px}
.checkout-btn{width:100%;justify-content:center}

/* ---------- checkout ---------- */
.checkout .wrap{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:40px;align-items:start}
.checkout fieldset{border:2px solid var(--ink);border-radius:var(--radius);background:#fffaf0;padding:24px 26px 26px;margin:0 0 24px;display:grid;gap:16px;min-width:0}
.checkout legend{font-family:Fraunces,serif;font-weight:800;font-size:26px;padding:0 10px;margin-left:-10px}
.checkout label{display:grid;gap:6px;font-weight:600;font-size:15px}
.checkout input:not([type=radio]),.checkout select{font:16px "Work Sans";color:var(--ink);background:var(--paper);border:2px solid var(--ink);border-radius:var(--radius);padding:12px 14px;width:100%}
.checkout .two{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px}
.checkout .three{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr) minmax(0,1fr);gap:16px}
.ship-opts{display:grid;gap:10px}
.ship-opts label{display:flex;gap:12px;align-items:center;font-weight:500;border:2px solid var(--ink);border-radius:var(--radius);padding:14px;background:var(--paper);cursor:pointer}
.ship-opts label:has(input:checked){background:var(--swallow)}
.ship-opts input{accent-color:var(--ink);width:18px;height:18px}
.ship-opts .p{margin-left:auto;font-family:Fraunces,serif;font-weight:700}
#card-container{min-height:90px}
.pay-btn{width:100%;justify-content:center;font-size:17px;padding:18px}
.pay-btn[disabled]{opacity:.55;cursor:wait;transform:none}
.pay-msg{font-size:15px;margin:0}
.pay-msg.err{color:var(--poppy);font-weight:600}
.secure-note{font-size:14px;color:var(--ink-soft);display:flex;gap:8px;align-items:center;margin:0}
.summary{position:sticky;top:92px;border:2px solid var(--ink);border-radius:var(--radius);background:var(--paper-2);padding:24px;box-shadow:8px 8px 0 var(--marigold)}
.summary h2{font-size:28px;margin-bottom:6px}
.summary .sum{margin-top:10px;font-size:16px}
.summary .sum.total{border-top:2px solid var(--ink);padding-top:12px;font-size:20px}
.summary .edit{font-size:14px}
.thanks{text-align:center;padding:40px 0 20px}
.thanks h2{font-size:clamp(40px,6vw,68px)}
.thanks p{font-size:19px;color:var(--ink-soft);max-width:48ch;margin:16px auto}
.notice{border:2px dashed var(--poppy);border-radius:var(--radius);padding:14px 16px;background:#fff3ea;font-size:15px}
@media (max-width:860px){.checkout .wrap{grid-template-columns:minmax(0,1fr)}.summary{position:static;order:-1}.checkout .three{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.checkout .three label:first-child{grid-column:1/-1}.checkout .two{grid-template-columns:minmax(0,1fr)}}
@media (max-width:860px){
  .top .wrap{gap:10px;padding:0 16px}
  .logo span{white-space:nowrap}
  .top .cart-mobile{gap:6px;padding:8px 10px}
}
@media (max-width:420px){
  .logo img{width:38px;height:38px}
  .logo{gap:8px}
  .logo span{font-size:min(17px,3.8vw)}
}

/* ---------- markets calendar ---------- */
.events{display:grid;gap:18px;max-width:860px}
.events .month{font-family:Caveat,cursive;font-weight:700;font-size:34px;color:var(--tide);margin:18px 0 -4px}
.events .month:first-child{margin-top:0}
.events-loading{font-size:26px;color:var(--ink-soft)}
.event{display:grid;grid-template-columns:96px minmax(0,1fr);gap:24px;align-items:start;background:#fffaf0;border:2px solid var(--ink);border-radius:var(--radius);padding:20px 24px;box-shadow:6px 6px 0 var(--marigold)}
.event:nth-of-type(even){box-shadow:6px 6px 0 var(--tide)}
.stamp-date{display:grid;justify-items:center;background:var(--poppy);color:var(--paper);border-radius:var(--radius);padding:8px 0 10px;transform:rotate(-3deg);text-transform:uppercase;letter-spacing:.08em;font-size:13px;font-weight:600}
.stamp-date b{font:900 44px/1 Fraunces,serif;letter-spacing:0;margin:2px 0}
.event h3{font-size:28px;margin-bottom:6px}
.event p{margin:4px 0 0}
.event .meta{font-weight:500}
.event .meta a{color:var(--ink);text-decoration-color:var(--marigold);text-underline-offset:4px}
.event .desc{color:var(--ink-soft);margin-top:10px}
.events-empty{max-width:640px}
.events-empty .hand{font-size:32px;color:var(--ink-soft);margin:0 0 6px}
.markets-band{margin-top:48px;display:grid;grid-template-columns:1fr 1fr;gap:16px 48px;align-items:center;padding:40px 44px}
.markets-band p{margin:0}
.markets-band form.list{margin-top:0}
.next-event{background:rgba(244,236,220,.14);border:1px dashed var(--paper);border-radius:var(--radius);padding:10px 14px;margin:14px 0 0}
@media (max-width:620px){
  .event{grid-template-columns:70px minmax(0,1fr);gap:16px;padding:16px}
  .stamp-date b{font-size:32px}
  .event h3{font-size:23px}
  .markets-band{grid-template-columns:1fr;padding:28px 24px}
}

/* ---------- month calendar ---------- */
.markets-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:40px;align-items:start}
.coming{font-size:clamp(30px,3.6vw,40px);margin-bottom:14px}
.cal{position:sticky;top:92px;background:#fffaf0;border:2px solid var(--ink);border-radius:var(--radius);padding:20px 20px 16px;box-shadow:8px 8px 0 var(--tide)}
.cal-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:14px}
.cal-head h2{font-size:30px;text-align:center}
.cal-head h2 span{font-family:Caveat,cursive;font-weight:700;color:var(--poppy);font-size:28px}
.cal-nav{width:42px;height:42px;border:2px solid var(--ink);border-radius:50%;background:var(--paper);color:var(--ink);font-size:24px;line-height:1;cursor:pointer;transition:background .15s}
.cal-nav:hover:not([disabled]){background:var(--swallow)}
.cal-nav[disabled]{opacity:.3;cursor:default}
.cal-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px}
.dow{text-align:center;font-size:12px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft);padding-bottom:6px}
.day{min-height:64px;border:1px solid #e1d5bd;border-radius:3px;padding:4px 5px;display:flex;flex-direction:column;gap:2px;background:var(--paper);font:inherit;color:inherit;text-align:left;overflow:hidden}
.day.blank{background:transparent;border-color:transparent}
.day .n{font-weight:600;font-size:14px}
.day.past{opacity:.45}
.day.today{border:2px solid var(--ink)}
.day.today .n{background:var(--ink);color:var(--paper);border-radius:999px;width:24px;height:24px;display:grid;place-items:center;font-size:12px}
.day.has{background:var(--poppy);border-color:var(--poppy);color:var(--paper);cursor:pointer;transition:transform .15s}
.day.has:hover{transform:rotate(-2deg) scale(1.04)}
.day .lbl{font-size:11px;line-height:1.2;font-weight:600;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.cal-key{display:flex;align-items:center;gap:8px;font-size:14px;color:var(--ink-soft);margin:12px 0 0}
.cal-key .swatch{width:14px;height:14px;border-radius:3px;background:var(--poppy)}
.event.flash{animation:flash 1.2s ease}
@keyframes flash{0%,40%{background:var(--swallow)}100%{background:#fffaf0}}
@media (max-width:900px){
  .markets-grid{grid-template-columns:minmax(0,1fr)}
  .cal{position:static}
}
@media (max-width:520px){
  .cal{padding:14px 10px 12px}
  .cal-head h2{font-size:24px}
  .dow span{display:none}
  .day{min-height:44px;align-items:center;justify-content:center;padding:2px}
  .day .lbl{display:none}
  .day.has::after{content:"";width:6px;height:6px;border-radius:50%;background:var(--swallow)}
}

/* ---------- "pulling the print" ----------
   Polaroid-style photos (gallery + home hero) start lifted & tilted, then
   press flat as they scroll in (site.js adds .press, then .in). Uses the separate
   translate/scale/rotate properties so it stacks with existing tilts. */
.press{
  opacity:0;translate:0 -18px;scale:1.05;rotate:var(--lift,-2.5deg);
  filter:drop-shadow(0 22px 16px rgba(43,29,20,.28));
  transition:
    opacity .45s var(--d,0ms) ease-out,
    translate .7s var(--d,0ms) cubic-bezier(.2,.9,.25,1),
    scale .7s var(--d,0ms) cubic-bezier(.2,.9,.25,1),
    rotate .7s var(--d,0ms) cubic-bezier(.2,.9,.25,1),
    filter .7s var(--d,0ms) ease-out,
    transform .2s;
}
.press:nth-child(even){--lift:2deg}
.press.in{opacity:1;translate:0 0;scale:1;rotate:0deg;filter:drop-shadow(0 0 0 rgba(43,29,20,0))}
@media (prefers-reduced-motion:reduce){.press{opacity:1;translate:none;scale:none;rotate:none;filter:none;transition:none}}
@media print{.press{opacity:1 !important;translate:none !important;scale:none !important;rotate:none !important;filter:none !important}}

/* ---------- sold-out pieces ---------- */
.card .img{position:relative}
.card.sold .img img{filter:saturate(.55) brightness(.92)}
.sold-stamp{
  position:absolute;top:50%;left:50%;translate:-50% -50%;rotate:-12deg;
  font:800 26px/1 Fraunces,serif;letter-spacing:.08em;text-transform:uppercase;
  color:var(--poppy);background:rgba(255,250,240,.88);border:3px solid var(--poppy);border-radius:4px;
  padding:10px 16px;box-shadow:0 0 0 3px rgba(255,250,240,.88),0 6px 14px rgba(43,29,20,.35);pointer-events:none;white-space:nowrap;
}
.card.sold .row{justify-content:flex-end}
.card.sold .btn{padding:11px 12px;font-size:12px}
.side li > :last-child{min-width:0;overflow-wrap:anywhere}
