/* Fridge Bait: the fresco edition */
:root{
  --paper:#F3EEE5; --paper-2:#ECE5D8; --card:#FBF8F2;
  --ink:#1F1A16; --ink-soft:#6B6156; --line:#BFA987; --rule:rgba(31,26,22,.14);
  --tomato:#B5372D; --butter:#F1DF97; --sage:#B4C58A; --powder:#BCD3EA; --blush:#F2C9C0; --navy:#4A2C20;
  --serif:"Minval Flare",system-ui,-apple-system,sans-serif;
  --sans:"Minval Flare",system-ui,-apple-system,sans-serif;
  --hand:"Pandemonium","Affigue",sans-serif;
  --text:"Rainvolt",Georgia,serif;
  --pad:clamp(20px,5vw,72px); --max:1240px;
  --shadow:0 1px 1px rgba(31,26,22,.06),0 14px 30px -14px rgba(31,26,22,.35);
}
*,*::before,*::after{box-sizing:border-box}
html{overflow-x:clip;scroll-behavior:smooth;-webkit-text-size-adjust:100%;font-synthesis:none}
body{margin:0;font:400 17px/1.65 var(--sans);color:var(--ink);background-color:var(--paper);
  background-image:repeating-linear-gradient(45deg,rgba(120,100,70,.035) 0 1px,transparent 1px 4px),repeating-linear-gradient(-45deg,rgba(120,100,70,.03) 0 1px,transparent 1px 5px)}
img{display:block;max-width:100%;height:auto}
a{color:inherit}
h1,h2,h3{font-family:var(--serif);font-weight:400;line-height:1;margin:0;text-wrap:balance}
h1,h2{text-transform:uppercase;letter-spacing:.03em;font-weight:500}
h1{line-height:1.02}
h3{font-weight:500}
h2{font-size:clamp(34px,4.4vw,56px)}
h3{font-size:22px}
p{margin:0 0 1em}
.skip{position:absolute;left:-9999px}.skip:focus{left:12px;top:12px;z-index:99;background:var(--card);padding:8px 14px}
:focus-visible{outline:1.5px solid var(--ink);outline-offset:3px}
section{padding:clamp(80px,11vw,150px) var(--pad)}
section>*{max-width:var(--max);margin-left:auto;margin-right:auto}
.kicker{font:500 12px/1.4 var(--sans);letter-spacing:.24em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:18px}
.head{text-align:center;max-width:760px;margin-bottom:clamp(48px,6vw,80px)}
.head p:not(.kicker){color:var(--ink-soft);font:400 18px/1.65 var(--sans);margin:22px auto 0;max-width:34em}
.lede{font:400 clamp(17px,1.4vw,19px)/1.65 var(--sans);color:var(--ink-soft)}
.head h2::after{content:"";display:block;width:56px;height:1px;background:var(--line);margin:28px auto 0}

/* buttons: thin, quiet */
.btn{display:inline-flex;align-items:center;justify-content:center;font:500 13px/1 var(--sans);letter-spacing:.16em;text-transform:uppercase;
  padding:17px 28px;border:1px solid var(--ink);border-radius:0;cursor:pointer;text-decoration:none;background:transparent;color:var(--ink);transition:background .2s,color .2s;white-space:nowrap}
.btn--sm{padding:12px 18px;font-size:12px}
.btn--full{width:100%}
.btn--ink{background:var(--ink);color:var(--paper)}
.btn--ink:hover{background:transparent;color:var(--ink)}
.btn--line:hover{background:var(--ink);color:var(--paper)}
.btn--paper{border-color:var(--paper);color:var(--paper)}
.btn--paper:hover{background:var(--paper);color:var(--ink)}

/* header: logo centred, like a masthead */
.hdr{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:20px;max-width:calc(var(--max) + 2*var(--pad));margin:0 auto;padding:26px var(--pad)}
.hdr__side{display:flex;gap:28px;align-items:center}
.hdr__side--r{justify-content:flex-end}
.hdr__side a{font:500 12px/1 var(--sans);letter-spacing:.2em;text-transform:uppercase;text-decoration:none}
.hdr__side a:hover{color:var(--ink-soft)}
.wordmark{font:400 44px/1 var(--hand);text-decoration:none;white-space:nowrap;color:var(--ink)}

/* hero fresco */
.hero{padding-top:clamp(8px,2vw,24px);text-align:center}
.fresco{position:relative;aspect-ratio:1.62;max-width:1240px;margin:0 auto}
.fresco__art{position:absolute;inset:0;overflow:hidden;
  -webkit-mask-image:radial-gradient(ellipse 50% 50% at 50% 50%,#000 78%,rgba(0,0,0,.6) 88%,transparent 100%);
          mask-image:radial-gradient(ellipse 50% 50% at 50% 50%,#000 78%,rgba(0,0,0,.6) 88%,transparent 100%)}
.fresco__art::after{content:"";position:absolute;inset:0;z-index:2;background:radial-gradient(ellipse 30% 22% at 50% 50%,rgba(243,238,229,.82),rgba(243,238,229,0) 100%)}
.f{position:absolute;margin:0;filter:saturate(.62) sepia(.2) contrast(.94) brightness(1.06);animation:fade 1.4s ease both;animation-delay:calc(var(--d,0) * 1s)}
.f--letter,.f--porch,.f--house,.f--mailbox,.f--cards,.f--seal{
  -webkit-mask-image:radial-gradient(ellipse 50% 50% at 50% 50%,#000 66%,transparent 100%);mask-image:radial-gradient(ellipse 50% 50% at 50% 50%,#000 66%,transparent 100%)}
.f--letter{left:20%;top:-8%;width:52%;--d:.1}
.f--porch{left:-4%;top:4%;width:56%;--d:0}
.f--house{right:0;top:-14%;width:34%;--d:.2}
.f--mailbox{left:0;top:44%;width:46%;--d:.3}
.f--cards{left:26%;top:40%;width:52%;--d:.25}
.f--seal{right:-6%;top:30%;width:48%;--d:.35}
.f--frame{left:36%;top:12%;width:8%;rotate:-7deg;filter:none;--d:.5}
.f--frame2{right:31%;top:6%;width:7%;rotate:8deg;filter:none;--d:.55}
.f--sheet{left:16%;top:56%;width:12%;z-index:1;aspect-ratio:.72;background:#FBF3E4;padding:1.2%;display:grid;grid-template-columns:repeat(3,1fr);align-content:space-around;gap:4%;rotate:-4deg;
  box-shadow:0 10px 20px -8px rgba(0,0,0,.4);filter:none;--d:.6}
.f--sheet svg{width:100%;height:auto;display:block}
.f--fish{left:66%;top:62%;width:14%;z-index:1;rotate:-10deg;filter:drop-shadow(0 8px 10px rgba(0,0,0,.3));--d:.7}
.f--fish svg{width:100%;height:auto;display:block}
.f--stars{left:14%;top:4%;width:20%;filter:sepia(.6) saturate(1.8) brightness(1.35);--d:.8}
.f--stars2{right:20%;top:52%;width:8%;filter:sepia(.6) saturate(1.8) brightness(1.35);--d:.85}
.fresco__mark{position:absolute;left:50%;top:50%;translate:-50% -50%;margin:0;z-index:3;white-space:nowrap;
  font:400 clamp(56px,10.5vw,156px)/1 var(--hand);color:var(--ink);text-shadow:0 0 24px rgba(243,238,229,.9)}
@keyframes fade{from{opacity:0;scale:1.03}to{opacity:1;scale:1}}
.spot{position:absolute;left:var(--x);top:var(--y);z-index:4;width:26px;height:26px;translate:-50% -50%;border-radius:50%;border:1px solid #fff;
  background:rgba(31,26,22,.35);backdrop-filter:blur(2px);cursor:pointer;padding:0}
.spot::before{content:"+";color:#fff;font:400 18px/24px var(--sans);display:block}
.spot::after{content:"";position:absolute;inset:-7px;border-radius:50%;border:1px solid rgba(255,255,255,.7);animation:pulse 2.4s ease-out infinite}
.spot span{position:absolute;left:50%;bottom:calc(100% + 12px);translate:-50% 6px;width:220px;background:var(--card);color:var(--ink);
  font:400 14px/1.45 var(--sans);text-align:left;padding:12px 14px;box-shadow:var(--shadow);opacity:0;pointer-events:none;transition:opacity .2s,translate .2s}
.spot--r span{left:auto;right:-12px;translate:0 6px}
.spot--l span{left:-12px;translate:0 6px}
.spot--r:hover span,.spot--r:focus-visible span,.spot--r.open span,.spot--l:hover span,.spot--l:focus-visible span,.spot--l.open span{translate:0 0}
.spot:hover span,.spot:focus-visible span,.spot.open span{opacity:1;translate:-50% 0}
@keyframes pulse{from{opacity:.9;scale:.8}to{opacity:0;scale:1.6}}
@media (prefers-reduced-motion:reduce){.f,.spot::after{animation:none}}
.hero__copy{max-width:760px;margin:clamp(24px,4vw,48px) auto 0}
.hero h1{font-size:clamp(40px,5.6vw,80px);line-height:1.02;margin-bottom:28px}
.hero__sub{font-size:clamp(17px,1.5vw,20px);color:var(--ink-soft);max-width:36em;margin:0 auto}
.hero__ctas{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin:36px 0 22px}
.hero__facts{font-size:14px;color:var(--ink-soft)}

/* envelope: an exhibition table */
.table{border-top:1px solid var(--rule)}
.flatlay{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:clamp(36px,4vw,56px) clamp(20px,3vw,40px);align-items:start}
.obj{min-width:0}
.obj h3{font-size:22px;margin:26px 0 6px;text-transform:uppercase;letter-spacing:.02em}
.obj>p{font:400 15px/1.6 var(--sans);color:var(--ink-soft);margin:0;max-width:24em}
.obj--letter{grid-column:1/6;grid-row:1/3}
.obj--postcard{grid-column:6/10}
.obj--sticker{grid-column:10/13}
.obj--list{grid-column:6/9}
.obj--biz{grid-column:9/13}
.paper{position:relative;background:#FFFEFA url(/img/kit/paper-lined.webp) center/cover;padding:48px 40px 40px;font:400 15.5px/1.7 "Courier Prime",monospace;color:#2f2a26;box-shadow:var(--shadow)}
.paper p{margin:0 0 .9em}
.tape{position:absolute;z-index:2;pointer-events:none;opacity:.9}
.tape--letter{top:-16px;left:50%;width:150px;translate:-50% 0;rotate:-3deg}
.tape--card{top:-20px;right:-6px;width:110px;rotate:28deg}
.postcard{position:relative;background:var(--card);padding:12px;box-shadow:var(--shadow)}
.postcard__img{aspect-ratio:7/5;object-fit:cover;width:100%;filter:saturate(.85)}
.diecut{width:min(220px,100%);margin:24px 0 10px;rotate:-6deg;filter:drop-shadow(0 2px 2px rgba(31,26,22,.12)) drop-shadow(0 12px 16px rgba(31,26,22,.25))}
.diecut svg{width:100%;height:auto;display:block}
.listcard{background:var(--card) url(/img/kit/paper-cream.webp) center/cover;padding:28px 26px;box-shadow:var(--shadow)}
.listcard__h{font:400 17px/1.2 var(--serif);margin:0 0 8px;text-transform:uppercase;letter-spacing:.03em}
.listcard ul{margin:0 0 18px;padding:0;list-style:none;font-size:14.5px}
.listcard ul:last-child{margin-bottom:0}
.listcard li{padding-left:22px;position:relative;margin:4px 0}
.listcard li::before{content:"";position:absolute;left:0;top:.4em;width:11px;height:11px;border:1px solid var(--ink)}
.biz{background:var(--ink);color:var(--paper);padding:28px;aspect-ratio:3.5/2;display:flex;flex-direction:column;justify-content:center;box-shadow:var(--shadow);font-size:14px}
.biz p{margin:0}
.biz__name{font:400 26px/1.1 var(--serif);text-transform:uppercase;margin-bottom:6px!important}
.biz__line{margin-top:14px!important;color:var(--butter)}

/* why */
.why{background:var(--card)}
.why__grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0}
.why__item{padding:8px clamp(18px,2.2vw,32px);border-left:1px solid var(--line);text-align:center}
.why__item:first-child{border-left:0}
.why__item h3{font-size:22px;margin-bottom:14px;text-transform:uppercase;letter-spacing:.02em}
.why__item p{font:400 15px/1.65 var(--sans);color:var(--ink-soft);margin:0}

/* year */
.gallery{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:clamp(14px,2vw,28px);max-width:1000px}
.mo{position:relative;border:0;padding:0;background:none;cursor:pointer;text-align:center;transition:transform .3s}
.mo__art{display:block;background:#fff;padding:7%;box-shadow:0 1px 1px rgba(31,26,22,.06),0 10px 22px -12px rgba(31,26,22,.35);transition:box-shadow .3s}
.mo__art img{width:100%;aspect-ratio:3/4;object-fit:cover}
.mo__name{display:block;margin-top:12px;font:500 11px/1 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--ink-soft)}
.mo:hover,.mo[aria-selected="true"]{transform:translateY(-6px)}
.mo[aria-selected="true"] .mo__name{color:var(--ink)}
.mo[aria-selected="true"] .mo__art{box-shadow:0 0 0 1px var(--ink),0 16px 28px -12px rgba(31,26,22,.45)}
.month-wrap{max-width:820px;margin-top:clamp(40px,5vw,64px)}
.month{text-align:center;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:clamp(32px,4vw,48px) 0}
.month__no{font:500 12px/1 var(--sans);letter-spacing:.24em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:14px}
.month h3{font-size:clamp(34px,4vw,52px);text-transform:uppercase;letter-spacing:.06em;margin-bottom:8px}
.month__theme{font:400 18px/1.4 var(--sans);color:var(--ink-soft);margin-bottom:26px}
.month__card{font:400 20px/1.35 var(--sans);margin-bottom:28px}
.month__card span,.month dt{display:block;font:500 11px/1 var(--sans);letter-spacing:.22em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:10px}
.month dl{margin:0;display:grid;grid-template-columns:1fr 1fr;gap:28px;text-align:left}
.month dd{margin:0;font-size:15px}

/* calendar: a quiet timeline */
.cal{background:var(--card)}
.cal__strip{list-style:none;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:clamp(16px,2vw,28px);position:relative}
.cal__strip::before{content:"";position:absolute;left:0;right:0;top:34px;height:1px;background:var(--line)}
.cal__strip li{position:relative;text-align:center;min-width:0}
.cal__d{display:inline-block;font:400 30px/68px var(--sans);width:68px;height:68px;border-radius:50%;background:var(--card);border:1px solid var(--line);margin-bottom:22px;position:relative}
.cal__strip h3{font-size:19px;text-transform:uppercase;letter-spacing:.03em;margin-bottom:10px}
.cal__strip p{font-size:14.5px;color:var(--ink-soft);margin:0}

/* plans: three columns and two rules */
.seg{display:inline-flex;border:1px solid var(--ink);padding:3px;margin-top:30px}
.seg button{border:0;background:none;font:500 12px/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;padding:12px 16px;cursor:pointer;color:var(--ink)}
.seg button em{font-style:normal;color:var(--tomato);margin-left:4px}
.seg button[aria-checked="true"]{background:var(--ink);color:var(--paper)}
.seg button[aria-checked="true"] em{color:var(--butter)}
.tiers{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.tier{padding:clamp(36px,4vw,56px) clamp(22px,3vw,44px);display:flex;flex-direction:column;align-items:center;text-align:center;border-left:1px solid var(--line);min-width:0;position:relative}
.tier:first-child{border-left:0}
.tier--pick{background:var(--card)}
.tier__tab{font:500 11px/1 var(--sans);letter-spacing:.24em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:20px}
.tier h3{font-size:clamp(30px,3vw,40px);text-transform:uppercase;letter-spacing:.06em;margin-bottom:26px}
.tier__price{margin:0;font-family:var(--serif);display:flex;align-items:baseline;gap:8px}
.amt{font-size:clamp(48px,5vw,68px);line-height:1;font-weight:400;letter-spacing:-.02em}
.per{font:500 12px/1 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--ink-soft)}
.tier__bill{font-size:14px;color:var(--ink-soft);margin:14px 0 4px}
.tier__bill::after{content:"Postage included";display:block;font:500 11px/1 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--tomato);margin-top:10px}
.tier__desc{font:400 15px/1.6 var(--sans);flex:1;margin:22px 0 28px;max-width:20em}
.tier .btn{align-self:stretch}
.extras{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(20px,3vw,44px);margin-top:clamp(36px,4vw,56px);text-align:center}
.extras p{font-size:14.5px;color:var(--ink-soft);margin:0}
.extras strong{display:block;color:var(--ink);font:400 20px/1.2 var(--serif);text-transform:uppercase;letter-spacing:.03em;margin-bottom:8px}

/* founding */
.founding{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(40px,7vw,110px);align-items:center;border-top:1px solid var(--rule)}
.founding>*{margin:0;max-width:none}
.founding__frame{position:relative;max-width:320px;justify-self:center;width:100%;rotate:-2deg;margin-top:80px!important;filter:drop-shadow(0 20px 26px rgba(31,26,22,.3))}
.founding__card{width:100%;position:relative}
.founding__bow{position:absolute;left:50%;top:-36%;width:22%;translate:-50% 0;rotate:-3deg}
.founding__set{position:absolute;inset:22% 20%;display:grid;grid-template-columns:repeat(3,1fr);gap:7%;align-content:center}
.founding__set span{aspect-ratio:1;background:var(--bg);color:#fff;display:grid;place-items:center}
.founding__set svg{width:70%}
.founding h2{margin-bottom:24px;max-width:12em}
.founding__in p:not(.kicker){font:400 18px/1.65 var(--sans);color:var(--ink-soft);max-width:30em;margin-bottom:34px}

/* faq */
.faq{max-width:860px;margin:0 auto}
.faq h2{text-align:center;margin-bottom:clamp(40px,5vw,64px)}
.faq h2::after{content:"";display:block;width:56px;height:1px;background:var(--line);margin:28px auto 0}
.faq__list details{border-top:1px solid var(--line)}
.faq__list details:last-child{border-bottom:1px solid var(--line)}
.faq summary{cursor:pointer;list-style:none;padding:24px 44px 24px 0;font:500 17px/1.3 var(--serif);text-transform:none;letter-spacing:0;position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:6px;top:50%;translate:0 -50%;font:300 26px/1 var(--sans);transition:rotate .2s}
.faq details[open] summary::after{rotate:45deg}
.faq details p{color:var(--ink-soft);font:400 16px/1.65 var(--sans);padding:0 44px 24px 0;margin:0}

/* footer */
.ftr{background:var(--ink);color:var(--paper);padding:clamp(80px,9vw,120px) var(--pad) 40px;text-align:center}
.ftr>*{max-width:var(--max);margin-left:auto;margin-right:auto}
.ftr__mark{font:400 clamp(40px,6vw,72px)/1 var(--hand);margin-bottom:18px}
.ftr__big{font:500 clamp(24px,3.4vw,40px)/1 var(--serif);text-transform:uppercase;letter-spacing:.06em;margin-bottom:36px}
.ftr__cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;font-size:14px;opacity:.7;margin-top:clamp(56px,7vw,96px);padding-top:28px;border-top:1px solid rgba(243,238,229,.2)}
.ftr__cols p{margin:0}

/* dialog */
.dlg{border:0;padding:0;width:min(560px,calc(100% - 24px));max-height:calc(100dvh - 24px);background:var(--card);color:var(--ink);
  box-shadow:0 30px 80px -20px rgba(59,36,24,.6);border-top:10px solid var(--tomato)}
.dlg::backdrop{background:rgba(59,36,24,.55)}
.dlg__form{padding:clamp(28px,4vw,44px);position:relative}
.dlg h2{font-size:38px;margin-bottom:8px}
.dlg__sub{color:var(--ink-soft);margin-bottom:24px}
.dlg__x{position:absolute;top:12px;right:14px;border:0;background:none;font-size:30px;line-height:1;cursor:pointer;color:var(--ink);padding:6px}
.field{margin-bottom:14px;min-width:0}
.field label{display:block;font-size:14px;font-weight:600;margin-bottom:6px}
.field input,.field select,.field textarea{width:100%;font:400 16px/1.4 var(--sans);padding:12px 14px;border:1.5px solid var(--rule);
  border-radius:8px;background:#fff;color:var(--ink)}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--ink)}
.field.bad input{border-color:var(--tomato)}
.field-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px}
.hp{position:absolute;left:-9999px}
.dlg__err{color:var(--tomato);font-size:15px;min-height:1px;margin:4px 0 12px}
.dlg__fine{font-size:13px;color:var(--ink-soft);margin:14px 0 0;text-align:center}
.dlg{border-radius:0;border-top:0;background:var(--card)}
.dlg h2{text-transform:uppercase;font-size:34px}
.field input,.field select,.field textarea{border:0;border-bottom:1px solid var(--line);border-radius:0;background:transparent;padding:10px 0}
.field label{font:500 11px/1 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--ink-soft)}

/* responsive */
@media (max-width:1020px){
  .hdr{grid-template-columns:auto 1fr}
  .hdr__side:first-child{display:none}
  .wordmark{font-size:36px}
  .flatlay{grid-template-columns:repeat(2,minmax(0,1fr))}
  .obj--letter{grid-column:1/-1;grid-row:auto}
  .obj--postcard,.obj--sticker,.obj--list,.obj--biz{grid-column:auto}
  .why__grid{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:40px}
  .why__item:nth-child(3){border-left:0}
  .gallery{grid-template-columns:repeat(4,minmax(0,1fr))}
  .cal__strip{grid-template-columns:repeat(3,minmax(0,1fr));row-gap:40px}
  .cal__strip::before{display:none}
  .founding{grid-template-columns:minmax(0,1fr)}
  .tiers{grid-template-columns:minmax(0,1fr)}
  .tier{border-left:0;border-top:1px solid var(--line)}
  .tier:first-child{border-top:0}
}
@media (max-width:720px){
  .hdr__side--r a{display:none}
  .wordmark{font-size:30px}
  .fresco{aspect-ratio:1/1.05}
  .fresco__art{-webkit-mask-image:radial-gradient(ellipse 50% 50% at 50% 50%,#000 72%,transparent 100%);mask-image:radial-gradient(ellipse 50% 50% at 50% 50%,#000 72%,transparent 100%)}
  .f--porch{left:-6%;top:14%;width:62%}.f--house{right:-2%;top:2%;width:38%}.f--letter{left:18%;top:-2%;width:60%}
  .f--mailbox{left:0;top:62%;width:48%}.f--cards{left:30%;top:56%;width:58%}.f--seal{right:-10%;top:40%;width:50%}
  .f--sheet{left:10%;top:62%;width:20%}.f--fish{left:58%;top:30%;width:26%}.f--frame{left:44%;top:20%;width:14%}.f--frame2{display:none}
  .f--stars{left:2%;top:6%;width:36%}.f--stars2{right:14%;width:14%}
  .fresco__mark{font-size:64px}
  .spot span{width:180px}
  .flatlay{grid-template-columns:minmax(0,1fr)}
  .paper{padding:40px 24px 30px;font-size:14.5px}
  .why__grid{grid-template-columns:minmax(0,1fr)}
  .why__item{border-left:0;border-top:1px solid var(--line);padding-top:32px}
  .why__item:first-child{border-top:0}
  .gallery{grid-template-columns:repeat(3,minmax(0,1fr))}
  .month dl{grid-template-columns:1fr}
  .cal__strip{grid-template-columns:minmax(0,1fr)}
  .extras,.ftr__cols{grid-template-columns:minmax(0,1fr)}
  .seg{display:flex;width:100%}.seg button{flex:1;padding:11px 6px;font-size:11px}
  .seg button em{display:block;margin:4px 0 0}
  .field-row{grid-template-columns:minmax(0,1fr)}
}

/* neutral hero */
.hero{padding-top:clamp(24px,5vw,72px)}
.hero__copy{max-width:820px;margin:0 auto}
.hero .lede{max-width:34em;margin:0 auto}
.trio{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(18px,3vw,44px);max-width:1180px;margin:clamp(56px,7vw,96px) auto 0;align-items:end}
.oval{display:block;text-decoration:none;color:var(--ink);text-align:center}
.oval__art{display:block;position:relative;aspect-ratio:4/5;border-radius:50%/50%;overflow:hidden;isolation:isolate;transition:transform .5s cubic-bezier(.2,.8,.2,1);
  box-shadow:0 30px 50px -30px rgba(31,26,22,.45)}
.oval--mid .oval__art{aspect-ratio:4/5.4}
.oval:hover .oval__art{transform:translateY(-8px)}
.oval__art .comp{position:absolute;inset:0;width:100%;aspect-ratio:auto;box-shadow:none}
.oval__name{display:block;font:500 clamp(20px,2vw,26px)/1 var(--serif);text-transform:uppercase;letter-spacing:.12em;margin-top:26px}
.oval__desc{display:block;font:400 15px/1.4 var(--sans);letter-spacing:.02em;color:var(--ink-soft);margin-top:6px}
.hero__facts{margin-top:44px;font-size:13px;letter-spacing:.04em}

/* styles */
.styles{border-top:1px solid var(--rule)}
.style{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(36px,6vw,96px);align-items:center;margin-bottom:clamp(80px,10vw,140px)}
.style:last-child{margin-bottom:0}
.style--flip .comp{order:2}
.style__copy h3{font-size:clamp(40px,4.4vw,60px);text-transform:uppercase;letter-spacing:.04em;margin-bottom:18px}
.style__copy .lede{margin-bottom:30px;max-width:26em}
.style__copy dl{margin:0;border-top:1px solid var(--line)}
.style__copy dl div{display:grid;grid-template-columns:130px 1fr;gap:16px;padding:14px 0;border-bottom:1px solid var(--line)}
.style__copy dt{font:500 11px/1.8 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--ink-soft)}
.style__copy dd{margin:0;font:400 15px/1.6 var(--sans)}
.swatches{list-style:none;display:flex;gap:10px;padding:0;margin:26px 0 0}
.swatches li{width:30px;height:30px;border-radius:50%;background:var(--c);box-shadow:inset 0 0 0 1px rgba(31,26,22,.15)}

/* compositions */
.comp{position:relative;display:block;aspect-ratio:4/4.6;overflow:hidden;box-shadow:var(--shadow);container-type:inline-size}
.comp>*{position:absolute;margin:0}
.comp p{margin:0 0 .8em}
.comp__bg{inset:0;width:100%;height:100%;object-fit:cover;filter:saturate(.9)}
/* whimsy */
.w-env{left:7%;top:6%;width:58%;aspect-ratio:1.55;background:#FBF8F2;box-shadow:0 12px 24px -10px rgba(0,0,0,.5);padding:0 7%;display:flex;align-items:center;
  font:400 2.6cqw/1.5 "Courier Prime",monospace;color:#3a3a3a}
.w-stamp{position:absolute;right:6%;top:9%;width:13%;aspect-ratio:.82;background:url(/img/craft/m02.webp) center/cover;outline:2px dashed #fff;outline-offset:-4px}
.w-letter{left:24%;top:30%;width:50%;aspect-ratio:.74;background:#fff;padding:5%;font:400 2.1cqw/1.55 "Courier Prime",monospace;color:#2b2b2b;box-shadow:0 12px 24px -10px rgba(0,0,0,.5)}
.w-sheet{left:5%;top:46%;width:36%;aspect-ratio:.72;background:#FBF3E4;padding:4%;display:grid;grid-template-columns:repeat(3,1fr);gap:3% 8%;align-content:space-around;rotate:-3deg;box-shadow:0 12px 24px -10px rgba(0,0,0,.5)}
.w-sheet svg,.w-stk svg{width:100%;height:auto;display:block}
.w-card{right:5%;top:20%;width:40%;aspect-ratio:.74;background:#fff;padding:3.5%;rotate:4deg;box-shadow:0 12px 24px -10px rgba(0,0,0,.5)}
.w-card img{width:100%;height:100%;object-fit:cover}
.w-stk{filter:drop-shadow(0 6px 8px rgba(0,0,0,.3))}
.w-stk--fish{left:44%;bottom:7%;width:36%;rotate:-8deg}
.w-stk--corn{right:5%;bottom:6%;width:16%;rotate:10deg}
/* salon */
.comp--salon{background:#1E1B18;background-image:repeating-linear-gradient(45deg,rgba(255,255,255,.025) 0 1px,transparent 1px 4px)}
.s-env{left:6%;top:6%;width:56%;filter:drop-shadow(0 16px 20px rgba(0,0,0,.6))}
.s-print{right:6%;top:16%;width:44%;background:#F7F2E8;padding:4.5% 4.5% 9%;box-shadow:0 20px 30px -12px rgba(0,0,0,.7)}
.s-print img{width:100%;aspect-ratio:.72;object-fit:cover;filter:saturate(.85) contrast(1.02)}
.s-print figcaption{position:absolute;left:0;right:0;bottom:2.6%;text-align:center;font:400 italic 2.4cqw/1 var(--text);color:#5b5146;letter-spacing:.06em}
.s-letter{left:9%;top:45%;width:44%;aspect-ratio:.72;background:#F4EEE2;padding:6% 6%;font:300 2.6cqw/1.6 var(--text);color:#2a241f;box-shadow:0 20px 30px -12px rgba(0,0,0,.7);rotate:-2deg}
.s-sig{font-style:italic;font-size:3.4cqw}
.s-card{right:12%;bottom:8%;width:34%;aspect-ratio:1.75;background:#14110F;border:1px solid #3a332c;color:#C9A66B;display:flex;flex-direction:column;align-items:center;justify-content:center;
  box-shadow:0 20px 30px -12px rgba(0,0,0,.8);rotate:3deg}
.s-card p{font:400 3.4cqw/1 var(--serif);text-transform:uppercase;letter-spacing:.08em;margin:0 0 6px}
.s-card span{font:300 italic 2.2cqw/1 var(--text);color:#a8916a}
.s-stars{right:-2%;top:-6%;width:16%;filter:sepia(.5) saturate(1.6) brightness(1.3);opacity:.9}
/* linen */
.comp--linen{background:#E7E3DC}
.l-env{left:8%;top:7%;width:56%;aspect-ratio:1.55;background:#fff;box-shadow:0 10px 24px -14px rgba(0,0,0,.35);display:flex;align-items:center;padding:0 8%;
  font:500 1.9cqw/1.8 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:#2b2b2b}
.l-stamp{position:absolute;right:7%;top:10%;width:11%;aspect-ratio:.82;border:1px solid #2b2b2b}
.l-print{right:7%;top:24%;width:42%;background:#fff;padding:5% 5% 12%;box-shadow:0 10px 24px -14px rgba(0,0,0,.35)}
.l-print img{width:100%;aspect-ratio:.8;object-fit:cover;filter:grayscale(1) contrast(1.05) brightness(1.03)}
.l-icon{left:10%;top:44%;width:30%;aspect-ratio:.72;background:#FBFAF7;display:grid;place-items:center;color:#2b2b2b;box-shadow:0 10px 24px -14px rgba(0,0,0,.35)}
.l-icon svg{width:62%}
.l-letter{left:34%;top:56%;width:34%;aspect-ratio:.76;background:#fff;padding:5%;font:400 1.9cqw/1.65 var(--sans);color:#333;box-shadow:0 10px 24px -14px rgba(0,0,0,.35)}
.l-dot{right:8%;bottom:9%;width:19%;aspect-ratio:1;border-radius:50%;background:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#2b2b2b;
  box-shadow:0 10px 24px -14px rgba(0,0,0,.35)}
.l-dot svg{width:44%}
.l-dot b{font:500 1.5cqw/1 var(--sans);letter-spacing:.2em;text-transform:uppercase;margin-top:4%}
@media (max-width:1020px){
  .style{grid-template-columns:minmax(0,1fr)}
  .style--flip .comp{order:0}
}
@media (max-width:720px){
  .trio{grid-template-columns:minmax(0,1fr);gap:48px;max-width:340px}
  .oval--mid .oval__art{aspect-ratio:4/5}
  .style__copy dl div{grid-template-columns:1fr;gap:4px}
}

/* founding: the framed set */
.founding__frame{rotate:0deg;margin-top:0!important;max-width:420px!important;filter:none}
.frame12{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;background:#fff;padding:9%;border:10px solid #1f1a16;box-shadow:0 30px 50px -25px rgba(31,26,22,.55)}
.frame12 img{width:100%;aspect-ratio:3/4;object-fit:cover}
/* whimsy pieces */
.w-sheet{font:400 2.1cqw/1.5 "Courier Prime",monospace;color:#2f2a26;display:block!important;padding:6% 7%!important;align-content:initial}
.w-sheet__h{font-weight:700;margin:0 0 .4em!important;text-transform:uppercase;letter-spacing:.04em}
.w-sheet ul{list-style:none;margin:0 0 1em;padding:0}
.w-sheet li{padding-left:1.4em;position:relative;margin:.2em 0}
.w-sheet li::before{content:"";position:absolute;left:0;top:.35em;width:.75em;height:.75em;border:1px solid #2f2a26}
.w-stamp{background-image:url(/img/art/stamp-whimsy.webp)!important}
.w-stk{height:auto}
.w-stk--fox{left:42%;bottom:3%;width:24%;rotate:-6deg}
.w-stk--bird{right:3%;bottom:8%;width:22%;rotate:8deg}
/* salon pieces */
.s-print2{left:44%;top:3%;width:36%;box-shadow:0 18px 26px -12px rgba(0,0,0,.7);border:6px solid #F7F2E8;rotate:-3deg}
.s-print figcaption{font:400 1.7cqw/1 var(--text)!important;font-style:italic!important}
/* linen pieces */
.l-icon{padding:6%!important}
.l-icon img{width:100%;height:100%;object-fit:cover}
.l-dot{overflow:hidden;padding:0!important;border:5px solid #fff}
.l-dot img{width:100%;height:100%;object-fit:cover;border-radius:50%}
.diecut{width:min(200px,90%)!important;height:auto}
.ftr__credit{font-size:12px;opacity:.55;max-width:760px!important;margin-top:24px!important;line-height:1.6}

/* ---------- photographic realism: light, paper and shadow ---------- */
.comp{--sh:0 1px 1px rgba(0,0,0,.22),0 2px 4px rgba(0,0,0,.16),0 10px 16px -6px rgba(0,0,0,.35),0 26px 40px -14px rgba(0,0,0,.45)}
.comp::after{content:"";position:absolute;inset:0;z-index:20;pointer-events:none;
  background:radial-gradient(120% 90% at 30% 15%,rgba(255,250,235,.16),rgba(255,250,235,0) 45%),radial-gradient(140% 120% at 50% 50%,rgba(0,0,0,0) 55%,rgba(0,0,0,.28) 100%)}
.comp__bg{filter:saturate(.85) brightness(.82) blur(1.2px);transform:scale(1.03)}
.w-env,.w-letter,.w-sheet,.w-card,.s-print,.s-letter,.s-card,.l-env,.l-print,.l-icon,.l-letter{box-shadow:var(--sh)!important;overflow:hidden}
.w-env::after,.w-letter::after,.w-sheet::after,.w-card::after,.s-print::after,.s-letter::after,.l-env::after,.l-print::after,.l-icon::after,.l-letter::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(125deg,rgba(255,255,255,.35) 0%,rgba(255,255,255,0) 38%,rgba(0,0,0,0) 70%,rgba(0,0,0,.07) 100%),url(/img/kit/paper-white.webp) center/cover;
  mix-blend-mode:multiply;opacity:.55}
.w-card img,.s-print img,.l-print img{box-shadow:inset 0 0 0 1px rgba(0,0,0,.06)}
.s-print2{box-shadow:var(--sh)!important}
.w-stk,.diecut{filter:drop-shadow(0 1px 1px rgba(0,0,0,.35)) drop-shadow(0 4px 5px rgba(0,0,0,.22)) drop-shadow(0 14px 18px rgba(0,0,0,.3))!important}
.l-dot{box-shadow:var(--sh)!important}
.s-env{filter:drop-shadow(0 2px 2px rgba(0,0,0,.4)) drop-shadow(0 18px 24px rgba(0,0,0,.55))!important}
/* bigger, Dino-scale pieces */
.comp{aspect-ratio:4/4.4}
.w-env{left:4%;top:3%;width:64%}
.w-letter{left:20%;top:26%;width:56%;rotate:.6deg}
.w-sheet{left:3%;top:40%;width:38%;rotate:-2.5deg}
.w-card{right:3%;top:14%;width:44%;rotate:2.5deg;padding:3%!important}
.w-stk--fox{left:40%;bottom:2%;width:28%}
.w-stk--bird{right:2%;bottom:5%;width:26%}
/* salon: black velvet under a spotlight */
.comp--salon{background:#141210 radial-gradient(70% 60% at 55% 35%,#2c2723,#141210 75%)}
.comp--salon::before{content:"";position:absolute;inset:0;background:url(/img/kit/paper-speckle.webp) center/600px;mix-blend-mode:overlay;opacity:.18}
.s-env{left:3%;top:3%;width:60%}
.s-print{right:4%;top:12%;width:46%}
.s-print2{left:42%;top:2%;width:34%}
.s-letter{left:7%;top:42%;width:46%}
/* linen: stone paper, soft daylight */
.comp--linen{background:#E4DFD6 url(/img/kit/paper-white.webp) center/cover}
.comp--linen::before{content:"";position:absolute;inset:0;background:linear-gradient(160deg,rgba(255,255,255,.35),rgba(0,0,0,.06));}
.comp--linen{--sh:0 1px 1px rgba(0,0,0,.12),0 3px 6px rgba(0,0,0,.08),0 14px 24px -10px rgba(0,0,0,.28),0 30px 44px -20px rgba(0,0,0,.3)}
.l-env{left:5%;top:4%;width:60%}
.l-print{right:4%;top:20%;width:46%}
.l-icon{left:6%;top:42%;width:32%}
.l-letter{left:32%;top:54%;width:36%}
.l-dot{right:6%;bottom:6%;width:21%}
.w-env{left:6%;top:6%;width:56%}
.w-letter{left:22%;top:27%;width:48%}
.w-sheet{left:5%;top:45%;width:32%}
.w-card{right:6%;top:17%;width:38%}
.w-stk--fox{left:38%;bottom:5%;width:23%}
.w-stk--bird{right:7%;bottom:9%;width:19%}
.s-print2{left:44%;top:4%;width:32%}
.w-sheet{font-size:1.75cqw!important}

/* ---------- brand refinement: warm, artful, editorial ---------- */
:root{--paper:#F7F2EA;--paper-2:#F0E7DA;--card:#FCF9F4;--ink:#2B2420;--ink-soft:#6E6158;--line:#C9AE8E;
  --terra:#B4552D;--olive:#6B6A3A;--mustard:#C89B3C;--plum:#5A2E3A;--blush:#E9CDBE;
  --serif:"Rainvolt",Georgia,serif}
body{background-image:none;background-color:var(--paper)}
h1,h2{font-family:var(--serif);font-weight:300;text-transform:none;letter-spacing:-.012em;line-height:1.04}
h1 em,h2 em{font-style:italic;color:var(--terra);font-weight:300}
h3{font-family:var(--serif);font-weight:400;letter-spacing:0}
.hero h1{font-size:clamp(48px,6.4vw,92px)}
h2{font-size:clamp(38px,4.6vw,62px)}
.kicker{font:italic 400 18px/1.4 var(--serif);letter-spacing:0;text-transform:none;color:var(--terra);margin-bottom:14px}
.head h2::after{background:var(--terra);width:40px}
/* wordmark: spaced classic capitals */
.wordmark,.ftr__mark{font-family:var(--serif)!important;font-weight:400;text-transform:uppercase;letter-spacing:.26em;display:inline-flex;flex-direction:column;align-items:center;line-height:1}
.wordmark{font-size:27px;padding-left:.26em}
.wordmark small,.ftr__mark small{font:500 9px/1 var(--sans);letter-spacing:.42em;margin-top:8px;color:var(--ink-soft);padding-left:.42em}
.ftr__mark{font-size:clamp(34px,4.4vw,52px);margin-bottom:22px!important;padding-left:.26em}
.ftr__mark small{color:rgba(247,242,234,.6);font-size:11px}
/* nav in title case */
.hdr{border-bottom:1px solid rgba(43,36,32,.08)}
.hdr__side a{font:500 14px/1 var(--sans);letter-spacing:.02em;text-transform:none}
.btn{letter-spacing:.12em;font-size:12px}
.btn--ink{background:var(--ink);border-color:var(--ink)}
.btn--ink:hover{background:var(--terra);border-color:var(--terra);color:#fff}
/* arches */
.oval__art{border-radius:999px 999px 6px 6px/ 46% 46% 6px 6px}
.oval__name{font:400 italic 26px/1 var(--serif);text-transform:none;letter-spacing:0;margin-top:22px}
.oval__desc{font-size:13px;letter-spacing:.14em;text-transform:uppercase;margin-top:8px}
.style__copy h3{font:300 clamp(46px,5vw,72px)/1 var(--serif);text-transform:none;letter-spacing:-.01em}
.style__copy dt{color:var(--terra)}
.swatches li{border-radius:2px;width:36px;height:24px}
.why{background:var(--paper-2)}
.why__item h3,.obj h3,.cal__strip h3{font:400 23px/1.2 var(--serif);text-transform:none;letter-spacing:0}
.tier h3{font:300 clamp(34px,3.4vw,46px)/1 var(--serif);text-transform:none;letter-spacing:0}
.tier__tab{color:var(--terra)}
.tier__bill::after{color:var(--olive)}
.amt{font-family:var(--serif);font-weight:300}
.tier--pick{background:var(--card)}
.extras strong{font:400 italic 22px/1.2 var(--serif);text-transform:none;letter-spacing:0}
.month h3{font:300 clamp(40px,4.6vw,60px)/1 var(--serif);text-transform:none;letter-spacing:0}
.month__card{font-family:var(--serif)}
.cal__d{font:300 34px/68px var(--serif);border-color:var(--terra);color:var(--terra)}
.cal__strip::before{background:var(--line)}
.cal{background:var(--paper-2)}
.faq summary{font:400 21px/1.3 var(--serif)}
.ftr{background:var(--plum)}
.ftr__big{font:300 italic clamp(28px,3.6vw,44px)/1.1 var(--serif);text-transform:none;letter-spacing:0}
.btn--paper:hover{color:var(--plum)}
.mo[aria-selected="true"] .mo__art{box-shadow:0 0 0 1px var(--terra),0 16px 28px -12px rgba(43,36,32,.45)}
.frame12{border-color:#3a2a22}
.dlg h2{font:300 38px/1 var(--serif);text-transform:none}
@media (max-width:720px){
  .wordmark{font-size:19px;letter-spacing:.2em}
  .wordmark small{font-size:8px;letter-spacing:.32em}
  .hdr{gap:10px;padding:18px 16px}
  .hdr__side--r .btn--sm{padding:10px 12px;font-size:10px;letter-spacing:.08em}
}
/* custom type: Zodiak (display) + Switzer (text), Fontshare free commercial licence */
:root{--serif:"Zodiak",Georgia,serif;--sans:"Switzer",system-ui,sans-serif;--text:"Zodiak",Georgia,serif}
body{font-family:var(--sans)}
.wordmark{font-weight:400;letter-spacing:.24em}
h1,h2{font-weight:300;letter-spacing:-.02em}
/* logo: Gambarino wordmark */
.wordmark,.ftr__mark{font-family:"Gambarino",var(--serif)!important;text-transform:none;letter-spacing:.005em;padding-left:0}
.wordmark{font-size:38px}
.ftr__mark{font-size:clamp(48px,6vw,72px)}
.wordmark small,.ftr__mark small{margin-top:6px;padding-left:.42em}
@media (max-width:720px){.wordmark{font-size:28px;letter-spacing:0}}
.wordmark small,.ftr__mark small{text-transform:uppercase}

/* ---------- Little Vintage Shop: logo and headlines ---------- */
:root{--hand:"Little Vintage Shop","Zodiak",Georgia,serif}
.wordmark,.ftr__mark{font-family:var(--hand)!important;font-weight:400;letter-spacing:0;line-height:.9}
.wordmark{font-size:44px}
.ftr__mark{font-size:clamp(56px,7vw,88px)}
h1,h2{font-family:var(--hand);font-weight:400;letter-spacing:0;line-height:1.02}
.hero h1{font-size:clamp(54px,7.4vw,110px)}
h2{font-size:clamp(42px,5.2vw,72px)}
h1 em,h2 em{font-style:normal}
.oval__name,.style__copy h3,.tier h3,.month h3{font-family:var(--hand);font-style:normal;font-weight:400}
.oval__name{font-size:34px}
.style__copy h3{font-size:clamp(56px,6vw,84px)}
.tier h3{font-size:clamp(40px,4vw,54px)}
.month h3{font-size:clamp(48px,5vw,68px)}
.ftr__big,.dlg h2{font-family:var(--hand);font-style:normal}
@media (max-width:720px){.wordmark{font-size:34px}}

/* ---------- kit mockups v2: real paper goods, one aligned grid ---------- */
.kc{position:relative;display:block;aspect-ratio:4/4.4;overflow:hidden;container-type:inline-size;box-shadow:0 30px 50px -30px rgba(43,36,32,.5)}
.kc>*{position:absolute;margin:0}
.kc__bg{inset:0;width:100%;height:100%;object-fit:cover}
.kc--whimsy .kc__bg{filter:blur(2.5px) brightness(.8) saturate(.9);transform:scale(1.06)}
.kc--salon .kc__bg{filter:brightness(.55) contrast(1.1)}
.kc--linen .kc__bg{filter:brightness(1.04) saturate(.7)}
.kc{--sh:drop-shadow(0 1px 1px rgba(0,0,0,.28)) drop-shadow(0 4px 6px rgba(0,0,0,.18)) drop-shadow(0 16px 20px rgba(0,0,0,.32))}
.kc--linen{--sh:drop-shadow(0 1px 1px rgba(0,0,0,.14)) drop-shadow(0 4px 6px rgba(0,0,0,.08)) drop-shadow(0 16px 20px rgba(0,0,0,.18))}
.k{filter:var(--sh)}
.k img{display:block;width:100%;height:auto}
/* slot 1: envelope, top left */
.k-env{left:5%;top:4%;width:60%;rotate:-1.5deg;z-index:3}
.k-env__logo{position:absolute;left:0;right:0;top:34%;text-align:center;font:400 9cqw/1 var(--hand);color:#4F69B5}
.k-env__sub{position:absolute;left:0;right:0;top:58%;text-align:center;font:500 1.7cqw/1 var(--sans);letter-spacing:.4em;text-transform:uppercase;color:#4F69B5}
/* slot 2: postcard, top right */
.k-card{right:5%;top:10%;width:38%;background:#fff;padding:2.6%;rotate:2.5deg;z-index:4}
.k-card>img:first-child{aspect-ratio:.74;object-fit:cover}
.k-tape{position:absolute;top:-4%;left:50%;width:46%!important;translate:-50% 0;rotate:-6deg;opacity:.9}
.k-card--gallery{background:#F6F0E4;padding:3% 3% 9%;rotate:0deg}
.k-card--gallery figcaption{position:absolute;left:0;right:0;bottom:3%;text-align:center;font:italic 300 1.7cqw/1 var(--serif);color:#5b5146}
.k-binder{position:absolute;top:-9%;left:50%;width:18%!important;translate:-50% 0}
.k-card--mat{padding:4% 4% 10%;rotate:0deg}
.k-bclip{position:absolute;top:-6%;left:50%;width:34%!important;translate:-50% 0}
/* slot 3: letter, centre */
.k-letter{left:20%;top:33%;width:47%;aspect-ratio:.74;padding:6% 6.5%;overflow:hidden;z-index:2;rotate:.5deg;font-size:2.15cqw;line-height:1.6}
.k-letter p{margin:0 0 .85em}
.k-letter--lined{background:#fff url(/img/kit2/p-lined.webp) center/cover;font-family:"Courier Prime",monospace;color:#2b2b2b;padding-top:8%}
.k-letter--aged{background:#EFE6D4 url(/img/kit2/p-aged.webp) center/cover;font-family:var(--serif);font-weight:300;color:#2a241f;font-size:2.6cqw;rotate:-1.5deg}
.k-sig{font-family:var(--hand);font-size:4.4cqw}
.k-letter--white{background:#fff url(/img/kit2/p-white.webp) center/cover;font-family:var(--sans);color:#333;font-size:2cqw;padding:8%}
/* slot 4: small card, lower left */
.k-list{left:4%;top:55%;width:30%;z-index:5;rotate:-3deg}
.k-list--cream{background:#FBF4E6 url(/img/kit2/p-cream.webp) center/cover;padding:6% 7%;font:400 1.75cqw/1.45 "Courier Prime",monospace;color:#2f2a26}
.k-list__h{font-weight:700;text-transform:uppercase;letter-spacing:.04em;margin:0 0 .4em!important}
.k-list ul{list-style:none;margin:0 0 .9em;padding:0}
.k-list li{padding-left:1.4em;position:relative;margin:.15em 0}
.k-list li::before{content:"";position:absolute;left:0;top:.3em;width:.75em;height:.75em;border:1px solid #2f2a26}
.k-clip{position:absolute;top:-9%;left:50%;width:46%!important;translate:-50% 0}
.k-list--print{background:#F6F0E4;padding:4%;top:60%;width:34%;rotate:-4deg}
.k-list--mat{background:#fff;padding:5% 5% 12%;top:52%;width:28%;rotate:-2deg}
.k-tack{position:absolute;top:-5%;left:50%;width:15%!important;translate:-50% 0}
/* slot 5: accent, lower right */
.k-stk{z-index:6;height:auto}
.k-stk--a{right:24%;bottom:5%;width:22%;rotate:-6deg}
.k-stk--b{right:4%;bottom:10%;width:19%;rotate:9deg}
.k-biz{right:7%;bottom:9%;width:32%;aspect-ratio:1.75;background:#14110F;border:1px solid #3a332c;color:#C9A66B;display:flex;flex-direction:column;align-items:center;justify-content:center;rotate:3deg;z-index:6}
.k-biz p{font:400 3.4cqw/1 var(--hand);margin:0 0 6px}
.k-biz span{font:300 italic 2cqw/1 var(--serif);color:#a8916a}
.k-dot{right:8%;bottom:9%;width:20%;aspect-ratio:1;border-radius:50%;background:#fff;padding:2.2%;z-index:6}
.k-dot img{border-radius:50%;aspect-ratio:1;object-fit:cover}
/* caption, like a Dino post */
.k-cap{left:0;right:0;bottom:2.4%;text-align:center;z-index:7;font:400 4.6cqw/1 var(--hand);color:#fff;text-shadow:0 1px 6px rgba(0,0,0,.35)}
.kc--linen .k-cap{color:#3b332c;text-shadow:none}
.kc--linen .k-dot{bottom:12%}
.k-env{width:55%}
.k-letter{left:17%;top:28%;width:43%;padding-top:15%}
.k-letter--white{padding-top:16%}
.k-card{width:36%;right:4%}
.k-list--cream{width:27%;top:54%;font-size:1.6cqw;padding:7% 6% 5%}
.k-list--mat{width:26%;top:58%}
.k-list--print{width:32%;top:63%}
.kc--salon .k-letter{left:9%}
.kc--linen .k-env{width:47%}
.k-list--cream{font-size:1.45cqw;top:52%}
.wordmark small,.ftr__mark small{margin-top:12px}
.ftr__mark small{margin-top:16px}
/* five things: same real paper goods */
.paper{background:#fff url(/img/kit2/p-lined.webp) center/cover!important;filter:drop-shadow(0 1px 1px rgba(0,0,0,.2)) drop-shadow(0 14px 18px rgba(43,36,32,.28));box-shadow:none!important}
.tape--letter{width:120px!important;top:-26px!important}
.listcard{position:relative;background:#FBF4E6 url(/img/kit2/p-cream.webp) center/cover!important;padding-top:40px!important}
.lc-clip{position:absolute;top:-22px;left:50%;width:110px;translate:-50% 0;filter:drop-shadow(0 4px 4px rgba(0,0,0,.25))}
.biz{background:#14110F url(/img/kit2/bg-dark.webp) center/cover!important;color:#E9D3A8!important}
.biz__name{font-family:var(--hand)!important;text-transform:none!important;font-size:34px!important}
.postcard,.listcard,.biz{box-shadow:0 1px 1px rgba(0,0,0,.2),0 4px 8px rgba(0,0,0,.1),0 18px 26px -10px rgba(43,36,32,.35)!important}
.wordmark small{margin-top:20px}
.listcard{padding-top:52px!important}
.biz__name{margin-bottom:14px!important;line-height:1!important}
.kc{text-align:left}.kc .k-env__logo,.kc .k-env__sub,.kc .k-cap,.kc figcaption,.kc .k-biz{text-align:center}

/* purchased art packs */
.k-biz{gap:0}
.k-biz__mark{width:30%!important;height:auto;margin:0 0 4%;opacity:.95}
.kc--whimsy .k-stk--a{width:15%;right:27%;bottom:6%}
.kc--whimsy .k-stk--b{width:24%;right:3%;bottom:12%}
.kc--linen .k-dot{padding:1.6%}
.kc--linen .k-dot img{object-fit:contain;background:#F7F5F0}
.biz__mark{width:64px;height:auto;display:block;margin:0 0 10px;opacity:.9}
