:root{
  --maroon:#6B1F26; --maroon-dark:#3A1418; --olive:#8E8A33; --pink:#E9A7C4;
  --orange:#E0662E; --tomato:#D64A2C; --linen:#F3ECDF; --line:#EFE6DA;
  --body:#5A3A36; --muted:#7A5E57; --ink:#3A1418;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:#FFFFFF;color:var(--ink);font-family:"Instrument Sans",Helvetica,Arial,sans-serif;font-size:16px;line-height:1.5;min-height:100vh;display:flex;flex-direction:column}
main{flex-grow:1}
img{max-width:100%;display:block}
a{color:var(--maroon)}
a:hover{color:var(--maroon-dark)}
:focus-visible{outline:2px solid var(--olive);outline-offset:2px}
.disp{font-family:"Rammetto One","Arial Black",sans-serif;text-transform:uppercase;font-weight:400}
.scr{font-family:"Pinyon Script","Snell Roundhand",cursive;font-weight:400;text-transform:none}
.wrap{max-width:1080px;margin:0 auto;padding-left:20px;padding-right:20px}
.skip{position:absolute;left:-999px}
.skip:focus{left:12px;top:12px;background:#fff;padding:8px 12px;z-index:50}

/* header */
.site-header{position:sticky;top:0;z-index:20;background:#FFFFFF;border-bottom:1px solid var(--line)}
.site-header .wrap{min-height:60px;display:flex;align-items:center;justify-content:space-between;gap:8px;padding-top:8px;padding-bottom:8px}
.logo{display:inline-flex;align-items:baseline;gap:3px;text-decoration:none}
.logo .scr{font-size:26px;line-height:1;color:var(--pink)}
.logo .disp{font-size:18px;line-height:1;color:var(--maroon)}
.site-nav{display:flex}
.site-nav a{color:var(--maroon);text-decoration:none;font-weight:600;font-size:14px;padding:12px 6px}
.site-nav a[aria-current="page"]{color:var(--olive);text-decoration:underline;text-underline-offset:6px}

/* hero */
.hero{padding-top:44px;padding-bottom:16px;display:flex;flex-direction:column;align-items:center;text-align:center;gap:16px}
.big-logo{margin:0;position:relative;display:flex;flex-direction:column;align-items:center;line-height:.92;color:var(--maroon);font-weight:400}
.big-logo .disp{font-size:80px}
.big-logo .scr{position:absolute;left:50%;top:50%;transform:translate(-50%,-54%) rotate(-8deg);font-size:64px;line-height:1;color:var(--pink);white-space:nowrap}
.tagline{margin:0;font-size:17px;line-height:1.4;font-weight:600;color:var(--tomato)}
.intro{margin:-8px 0 0;font-size:13.5px;color:var(--body);display:flex;flex-direction:column;align-items:center}

/* section titles */
.eyebrow{font-size:11px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--maroon)}
.section-title{margin:0;font-size:30px;line-height:1;color:var(--olive)}
.section-title .scr{font-size:40px;color:var(--pink);margin-right:6px}

/* catalog */
.goods{padding-top:32px;padding-bottom:56px;display:flex;flex-direction:column;gap:14px}
.goods-head{display:flex;flex-direction:column;gap:10px}
.grid{display:grid;grid-template-columns:1fr;gap:40px;margin-top:6px}
.card{display:flex;flex-direction:column;gap:12px}
.thumb{position:relative;display:block;width:100%;aspect-ratio:4/5;padding:0;border:0;border-radius:18px;overflow:hidden;background:var(--linen);cursor:pointer}
.thumb img{width:100%;height:100%;object-fit:cover;transition:transform .3s ease}
.thumb:hover img{transform:scale(1.03)}
.count{position:absolute;right:12px;bottom:12px;background:rgba(58,20,24,.7);color:#FFFFFF;font-size:12px;font-weight:600;padding:4px 9px;border-radius:999px}
.sold-tag{position:absolute;left:12px;top:12px;background:var(--tomato);color:#FFFFFF;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:6px 10px;border-radius:999px}
.name-row{display:flex;justify-content:space-between;align-items:baseline;gap:12px}
.name-row h3,.name-row h2{margin:0;font-size:18px;line-height:1.25;font-weight:700;color:var(--maroon)}
.name-row h3 button{all:unset;cursor:pointer}
.name-row h3 button:focus-visible{outline:2px solid var(--olive);outline-offset:2px}
.price{font-size:16px;color:var(--orange);white-space:nowrap}
.short{margin:0;color:var(--body);font-size:14px}
.note{margin:0;font-size:13px;color:var(--muted)}
.note b{color:var(--ink)}
.buy{display:flex;align-items:center;justify-content:center;min-height:50px;border-radius:999px;background:var(--olive);color:#FFFFFF;font-weight:700;font-size:16px;text-decoration:none;margin-top:auto}
.buy:hover{background:#77731F;color:#FFFFFF}
.buy[aria-disabled="true"]{background:var(--linen);color:var(--muted);pointer-events:none}

/* popup */
dialog.item{padding:0;border:0;width:100%;max-width:100%;height:100%;max-height:100%;margin:0;background:#FFFFFF;color:var(--ink)}
dialog.item::backdrop{background:rgba(58,20,24,.55)}
.item-inner{position:relative;height:100%;overflow-y:auto;display:flex;flex-direction:column}
.gallery{position:relative;flex-shrink:0;background:var(--linen)}
.slides{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;aspect-ratio:4/5}
.slides::-webkit-scrollbar{display:none}
.slide{flex:0 0 100%;scroll-snap-align:start}
.slide img{width:100%;height:100%;object-fit:cover}
.round{position:absolute;width:44px;height:44px;border-radius:999px;border:0;background:#FFFFFF;box-shadow:0 1px 4px rgba(58,20,24,.2);color:var(--maroon);font-size:22px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center}
.close{top:12px;right:12px}
.prev{left:12px;top:50%;transform:translateY(-50%)}
.next{right:12px;top:50%;transform:translateY(-50%)}
.dots{display:flex;justify-content:center;gap:2px;padding-top:8px}
.dots button{width:24px;height:24px;border:0;background:none;padding:0;cursor:pointer;display:flex;align-items:center;justify-content:center}
.dots button::before{content:"";width:9px;height:9px;border-radius:999px;background:var(--pink)}
.dots button[aria-current="true"]::before{background:var(--maroon)}
.item-info{padding:12px 24px 32px;display:flex;flex-direction:column;gap:10px}
.item-info .name-row h2{font-size:22px;line-height:1.2}
.item-info .price{font-size:18px}
.item-info .short{font-size:15px}
.more-btn{align-self:flex-start;background:none;border:0;padding:2px 0;color:var(--maroon);font:inherit;font-size:15px;font-weight:700;text-decoration:underline;text-underline-offset:4px;cursor:pointer}
.fine{margin:0;font-size:13px;color:var(--muted);text-align:center}

/* about */
.page{padding-top:36px;padding-bottom:48px;display:flex;flex-direction:column;gap:14px;max-width:640px}
.page p{margin:0;font-size:15px;color:var(--body)}
.portrait{width:100%;height:auto;border-radius:18px;background:var(--linen);aspect-ratio:1126/1200;object-fit:cover}

/* contact */
.contact-links{margin:0;font-size:15px}
form.contact{display:flex;flex-direction:column;gap:14px;margin-top:6px}
form.contact label{display:flex;flex-direction:column;gap:6px;font-weight:600;font-size:14px}
form.contact input,form.contact textarea{font:inherit;font-weight:400;padding:12px 14px;border:1.5px solid #E2D8CC;border-radius:12px;background:#FFFFFF;color:var(--ink)}
form.contact textarea{min-height:140px;resize:vertical}
form.contact input:focus,form.contact textarea:focus{outline:2px solid var(--olive);outline-offset:1px;border-color:var(--olive)}
.send{min-height:50px;border-radius:999px;border:0;background:var(--maroon);color:var(--linen);font:inherit;font-weight:700;cursor:pointer}
.hidden-field{position:absolute;left:-9999px}
.fine-print h2{margin:10px 0 0;font-size:17px}

/* footer */
.site-footer{background:var(--maroon);color:var(--linen)}
.site-footer .wrap{padding-top:22px;padding-bottom:26px;display:flex;justify-content:space-between;align-items:center;gap:12px}
.foot-logo{display:inline-flex;align-items:baseline;gap:3px}
.foot-logo .scr{font-size:26px;line-height:1;color:var(--linen)}
.foot-logo .disp{font-size:18px;line-height:1;color:var(--pink)}
.foot-right{display:flex;flex-direction:column;align-items:flex-end}
.socials{display:flex;gap:2px;margin-right:-10px}
.socials a{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:999px;color:var(--pink)}
.socials a:hover{color:#FFFFFF}
.made{color:#E6D3CC;font-size:12px}

@media (min-width:700px){
  .wrap{padding-left:28px;padding-right:28px}
  .site-nav a{font-size:15px;padding:12px 10px}
  .logo .scr{font-size:32px}
  .logo .disp{font-size:22px}
  .hero{padding-top:56px;gap:18px}
  .big-logo .disp{font-size:120px}
  .big-logo .scr{font-size:96px}
  .tagline{font-size:20px}
  .intro{font-size:16px}
  .goods{padding-top:48px;padding-bottom:64px;gap:24px}
  .grid{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:40px 28px}
  dialog.item{width:min(1000px,calc(100% - 48px));height:auto;max-height:calc(100% - 48px);margin:auto;border-radius:20px;overflow:hidden}
  .item-inner{flex-direction:row;height:auto;max-height:calc(100vh - 48px)}
  .gallery-col{flex:0 0 52%;display:flex;flex-direction:column;padding-bottom:12px}
  .item-info{flex:1;padding:56px 32px 32px;overflow-y:auto}
}
@media (min-width:1000px){
  .grid{grid-template-columns:repeat(3,1fr)}
}
@media (prefers-reduced-motion:reduce){
  *{scroll-behavior:auto!important;transition:none!important}
}
.item-info .buy{margin-top:8px}
@media (min-width:700px){
  dialog.item{height:fit-content}
  .item-inner{height:auto}
}
@media (min-width:700px){
  .portrait{height:auto;aspect-ratio:3/2;object-position:50% 30%}
}