/* Dark boutique direction. Original brand and product colors remain intact. */
:root {
  color-scheme:dark;
  color:var(--paper);
  background:var(--ink);
  --dark-surface:#19181b;
  --dark-rule:#3c3941;
  --line:#3c3941;
}
body { background:var(--ink); color:var(--paper); }
::selection { background:var(--royal-purple); color:var(--paper); }
button:focus-visible,a:focus-visible,summary:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible { outline-color:#b692dc; }
.header { height:128px; border-color:var(--dark-rule); }
/* A display window removes only empty proof margins; the supplied PNG is untouched. */
.brand,.footer-wordmark {
  --logo-width:280px;
  position:relative; display:block; width:var(--logo-width); height:calc(var(--logo-width) * .225);
  overflow:hidden; padding:0; border:0; background:transparent; border-radius:0;
}
.brand img,.footer-wordmark img {
  display:block; position:absolute; width:calc(var(--logo-width) * 1.086); height:auto;
  max-width:none; left:-4.1%; top:-35.5%;
}
nav { color:var(--platinum); }
nav a:hover { color:var(--paper); border-color:var(--platinum); }
.menu-toggle span { background:var(--paper); }
.button-dark,.button-lime { background:var(--royal-purple); border-color:#705090; color:var(--paper); }
.button-dark:hover,.button-lime:hover { background:#613295; border-color:var(--lavender); }
.button-outline { border-color:var(--cool-grey); color:var(--paper); }
.button-outline:hover { background:var(--graphite); }
.header-cta { background:transparent; border-color:#817789; }
.hero { padding:66px 0 66px; gap:60px; }
.hero h1 { font-size:clamp(72px,7.6vw,116px); letter-spacing:-.055em; line-height:1.04; margin-bottom:30px; }
.hero .eyebrow { color:var(--platinum); margin-bottom:32px; letter-spacing:1.5px; }
.tiny-cross { color:#b692dc; }
.highlight { color:#b692dc; font-style:italic; }
.highlight:before { display:none; }
.hero-description { color:var(--platinum); font-size:14px; line-height:1.95; margin-bottom:33px; }
.hero-actions { gap:25px; }
.text-link { color:var(--platinum); font-weight:400; }
.text-link:hover { color:var(--paper); }
.hero-note { border-color:var(--dark-rule); color:var(--platinum); margin-top:37px; padding-top:23px; }
.image-wrap { background:#161418; border-color:#39323f; aspect-ratio:1/1.055; }
.image-label { color:var(--platinum); background:#151218e8; border-color:#62566f; letter-spacing:1.1px; }
.label-dot { background:#b692dc; }
.corner-index { color:var(--platinum); background:#111111b8; }
figcaption { color:var(--platinum); }
.ticker { background:#171619; border-color:var(--dark-rule); }
.discipline { padding-block:27px; }
.discipline:not(:first-child) { border-color:var(--dark-rule); }
.discipline b { color:var(--platinum); }
.ticker .discipline span { color:var(--paper); font-weight:400; }
.section { padding-block:100px; }
.eyebrow { color:var(--platinum); }
h2 { font-family:Georgia,"Times New Roman",serif; font-weight:400; letter-spacing:-.04em; }
.section-heading { border-color:var(--dark-rule); padding-bottom:35px; margin-bottom:36px; }
.section-heading>p { color:var(--platinum); }
.product-grid { gap:40px 26px; }
.product-art { border-color:#413c48; }
.sticker-art,.packaging-art,.paper-art { background:radial-gradient(ellipse at 30% 15%,#38333d,#211f24 85%); }
.label-art,.signs-art,.supplies-art { background:radial-gradient(ellipse at 70% 10%,#353039,#1b191e 85%); }
.sticker-coral,.paper-box { color:var(--ink); }
.sticker,.business-card,.label-sheet { box-shadow:5px 13px 22px #00000065; }
.paper-box { background:#dfdde0; border-color:#b9b5be; box-shadow:8px 17px 0 #929099,18px 27px 22px #00000060; }
.business-card.front { border:1px solid #4f4857; }
.window-frame { border-color:#8f9197; background:linear-gradient(118deg,#77717e 0%,#c5c2cb 48%,#d4d1d7 49%,#928e9b 51%,#66616e 100%); box-shadow:8px 10px 20px #00000060; }
.window-frame:before { background:#8f9197; }
.pouch { border-top:1px solid #6a6471; border-left-color:#625b6a; box-shadow:8px 11px 18px #00000075; }
.small-box { border:1px solid #725091; }
.product-meta { border-color:var(--dark-rule); padding-top:20px; }
.product-meta:before { color:var(--platinum); }
.product-meta strong { color:var(--paper); }
.product-meta small { color:var(--platinum); }
.circle-arrow,.product:hover .circle-arrow { color:var(--platinum); }
.product:hover .product-art { border-color:#8a6ba8; }
.section-footnote { color:var(--platinum); }
.idea-section { background:var(--dark-surface); border-color:var(--dark-rule); }
.idea-inner { padding-block:91px; }
.idea-intro h2 { font-weight:400; }
.idea-intro>p:not(.eyebrow),.steps p { color:var(--platinum); }
.giant-asterisk { color:var(--lavender); }
.steps li { border-color:var(--dark-rule); }
.step-number { color:var(--platinum); }
.steps h3 { font-weight:400; }
.faq-intro,.faqs details p { color:var(--platinum); }
.faqs summary { color:var(--paper); }
.faqs summary span { color:var(--platinum); }
.closing { background:linear-gradient(110deg,#21172d,#17131c 75%); border-top:1px solid #44354f; }
.closing-inner { padding-block:91px; }
.closing h2>span { color:#b692dc; }
.site-footer { background:#111111; }
.footer { border-color:#44354f; padding-block:43px; }
.footer-wordmark { --logo-width:245px; }
.footer-email { color:var(--paper); }
.footer-bottom { border-color:var(--dark-rule); }
dialog { background:#1b191f; color:var(--paper); border:1px solid #62566f; box-shadow:0 25px 100px #000000b0; }
dialog::backdrop { background:#09070dd9; }
dialog h2 { font-weight:400; }
.dialog-intro,label span,.form-note { color:var(--platinum); }
.close-button { color:var(--paper); border-color:var(--cool-grey); }
.close-button:hover { background:var(--royal-purple); }
input,select,textarea { color:var(--paper); background:#111014; border-color:var(--cool-grey); color-scheme:dark; }
input::placeholder,textarea::placeholder { color:#b2aeb8; }
.status-message { color:var(--platinum); }
#brief-summary { border-color:#62566f; }
#brief-summary>div { border-color:#62566f; }
dd { color:var(--platinum); }
.skip-link { background:var(--royal-purple); color:var(--paper); }
.hero-description { max-width:470px; }
.section-heading>p { max-width:380px; }
.jar-art { background:radial-gradient(ellipse at 30% 15%,#38333d,#211f24 85%); }
.display-jar { position:absolute; width:136px; height:119px; border-radius:15px 15px 27px 27px; background:linear-gradient(100deg,#66616c88,#c7c9ce77 20%,#37313f99 70%,#8f919766); border:1px solid #939099; box-shadow:9px 15px 23px #0008; }
.jar-back { left:11%; top:42px; transform:rotate(-12deg); }
.jar-front { right:9%; bottom:31px; transform:rotate(9deg); }
.jar-lid { display:block; position:absolute; left:-4px; right:-4px; top:-16px; height:28px; border:1px solid #5e5965; border-radius:9px 9px 4px 4px; background:repeating-linear-gradient(90deg,#252229 0 2px,#39343f 2px 3px); box-shadow:0 4px 5px #0007; }
.jar-label { display:block; position:absolute; left:3px; right:3px; top:25px; height:66px; background:var(--royal-purple); color:var(--paper); padding:10px 12px; font-size:39px; font-weight:700; letter-spacing:-2px; line-height:1; }
.jar-label small { display:inline-block; font-size:6px; letter-spacing:.5px; font-weight:400; line-height:1.45; margin-left:9px; }
.jar-back .jar-label { background:var(--platinum); color:var(--ink); }
.local-section { display:grid; grid-template-columns:1fr 1fr; gap:90px; border-bottom:1px solid var(--dark-rule); }
.local-intro>p:not(.eyebrow) { color:var(--platinum); font-size:13px; line-height:1.9; max-width:380px; margin:25px 0 20px; }
.local-details { display:grid; gap:25px; align-content:start; }
.local-details>div { border-bottom:1px solid var(--dark-rule); padding-bottom:23px; }
.local-details>div:last-child { border-bottom:0; padding-bottom:0; }
.local-details h3 { font-size:20px; font-weight:400; margin:0 0 12px; letter-spacing:-.5px; }
.local-details p { color:var(--platinum); font-size:13px; line-height:1.9; margin:0; }
.footer-phone { display:block; width:max-content; margin:15px 0 0 auto; color:var(--platinum); font-size:16px; }
.footer-phone:hover { color:var(--paper); text-decoration:underline; text-underline-offset:5px; }
@media(max-width:1150px) {
  .brand { --logo-width:240px; }
  .hero { gap:35px; padding-top:54px; }
  .hero h1 { font-size:8.1vw; }
  .hero .eyebrow { letter-spacing:1px; font-size:9px; }
  .hero-description { font-size:13px; }
  .hero-actions { gap:20px; }
}
@media(max-width:800px) {
  .local-section { gap:40px; }
  .header { height:108px; }
  .brand { --logo-width:225px; }
  nav { background:#201c25; border-color:#62566f; }
  .hero { gap:25px; padding:42px 0 49px; }
  .hero h1 { font-size:8.2vw; }
  .hero .eyebrow { font-size:8px; letter-spacing:.65px; }
  .hero-description { font-size:12px; }
  .hero-actions { gap:15px; }
  .image-wrap { aspect-ratio:1/1.3; }
  .section { padding-block:72px; }
  .product-grid { gap:30px 18px; }
  .idea-inner { padding-block:65px; }
  .closing-inner { padding-block:67px; }
  .footer-wordmark { --logo-width:215px; }
}
@media(max-width:580px) {
  .local-section { grid-template-columns:1fr; gap:35px; }
  .footer-phone { margin-left:0; }
  .display-jar { width:92px; height:85px; border-radius:10px 10px 19px 19px; }
  .jar-back { left:10%; top:39px; }
  .jar-front { right:8%; bottom:31px; }
  .jar-lid { top:-12px; height:21px; }
  .jar-label { top:19px; height:46px; padding:8px 6px; font-size:27px; }
  .jar-label small { font-size:4px; letter-spacing:.2px; margin-left:5px; }
  .header { height:105px; }
  .brand { --logo-width:240px; }
  .hero { padding-top:42px; gap:37px; }
  .hero h1 { font-size:clamp(57px,16.8vw,94px); line-height:1.02; letter-spacing:-.055em; margin-bottom:27px; }
  .hero .eyebrow { font-size:9px; letter-spacing:.95px; margin-bottom:27px; }
  .hero-description { font-size:13px; margin-bottom:28px; }
  .hero-actions { gap:21px; }
  .image-wrap { aspect-ratio:1.08; }
  .section-heading { padding-bottom:27px; margin-bottom:27px; }
  .section-heading h2,.idea-intro h2 { font-size:39px; font-weight:400; }
  .product-grid { gap:27px 13px; }
  .product-meta { padding-top:14px; }
  .closing-inner { padding-block:57px; }
  .closing h2 { font-size:44px; }
  .footer { padding-block:33px; }
  .footer-wordmark { --logo-width:240px; }
}
@media(max-width:360px) {
  .brand,.footer-wordmark { --logo-width:214px; }
  .hero h1 { font-size:16.8vw; }
  .hero-actions { gap:18px; }
  .closing h2 { font-size:39px; }
}