/** Shopify CDN: Minification failed

Line 552:0 Unexpected "}"

**/
/* Ladybugg's Cottage — styles.css
   Palette tokens are defined in :root below. */
/* ============ TOKENS ============ */
:root{
  --cream:#F7F0DE; --linen:#FBF6EA; --parchment:#F0E5CB; --card:#FDF9F0;
  --berry:#9E1F1F; --berry-dark:#7A1414; --berry-soft:#B54A3F;
  --sage:#7C8A57; --moss:#5E6B3C; --leaf:#414E2B;
  --walnut:#7A5230; --bark:#54381F; --wood-hi:#96693F;
  --spruce:#141B24; --blush:#E2A4B1; --blush-deep:#C97F91; --daisy:#E3AF35;
  --ink:#3B3126; --ink-soft:#6D6152; --line:#DCCFAF;
  --shadow-soft:0 10px 30px -12px rgba(84,56,31,.28);
  --shadow-lift:0 18px 40px -14px rgba(84,56,31,.38);
  --r-lg:22px; --r-md:14px; --r-sm:10px;
  --font-display:"Fraunces",Georgia,serif;
  --font-script:"Kaushan Script",cursive;
  --font-body:"Alegreya Sans",system-ui,sans-serif;
  --wrap:1180px;
}
*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}
body{
  margin:0; font-family:var(--font-body); color:var(--ink); background:var(--cream);
  background-image:
    radial-gradient(1200px 500px at 50% -100px, rgba(227,175,53,.10), transparent 70%),
    repeating-linear-gradient(0deg, rgba(84,56,31,.020) 0 1px, transparent 1px 3px),
    repeating-linear-gradient(90deg, rgba(84,56,31,.016) 0 1px, transparent 1px 3px);
  font-size:17px; line-height:1.6;
  overflow-x:hidden;
}
body.cursor-on, body.cursor-on *{cursor:none!important}
img{max-width:100%;display:block}
a{color:var(--berry)}
h1,h2,h3,h4{font-family:var(--font-display);font-weight:600;line-height:1.15;color:var(--leaf);margin:0 0 .5em}
p{margin:0 0 1em}
button{font-family:var(--font-body)}
:focus-visible{outline:3px solid var(--daisy);outline-offset:3px;border-radius:4px}
.skip-link{position:absolute;left:-9999px;top:0;background:var(--berry);color:#fff;padding:10px 18px;z-index:300;border-radius:0 0 10px 0}
.skip-link:focus{left:0}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 22px}
.script{font-family:var(--font-script);font-weight:400}
.eyebrow{font-family:var(--font-script);color:var(--berry);font-size:1.35rem;display:block;margin-bottom:6px;transform:rotate(-1.5deg)}
.section{padding:74px 0}
.section-head{text-align:center;max-width:640px;margin:0 auto 42px}
.section-head h2{font-size:clamp(1.8rem,3.6vw,2.6rem)}
.section-head p{color:var(--ink-soft)}

/* wooden banner titles (echo of the logo's Cottage plank) */
.plank{
  display:inline-block;position:relative;padding:10px 34px;border-radius:12px;
  background:linear-gradient(180deg,var(--wood-hi),var(--walnut) 55%,var(--bark));
  background-image:repeating-linear-gradient(92deg,rgba(255,255,255,.05) 0 2px,transparent 2px 9px),linear-gradient(180deg,var(--wood-hi),var(--walnut) 55%,var(--bark));
  color:#F9EFD8;font-family:var(--font-display);font-weight:600;
  box-shadow:inset 0 2px 3px rgba(255,255,255,.25),inset 0 -4px 6px rgba(0,0,0,.35),var(--shadow-soft);
  text-shadow:0 2px 3px rgba(0,0,0,.4);
  transform:rotate(-.6deg);
}
.plank::before,.plank::after{content:"";position:absolute;top:50%;width:9px;height:9px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#c8a06a,#3d2915);transform:translateY(-50%);box-shadow:inset 0 1px 2px rgba(0,0,0,.6)}
.plank::before{left:11px}.plank::after{right:11px}

/* stitched dividers */
.stitch{border:0;border-top:2px dashed rgba(158,31,31,.45);margin:0;position:relative}

/* ============ BUTTONS ============ */
.btn{
  display:inline-flex;align-items:center;gap:9px;justify-content:center;
  font-weight:700;font-size:1.02rem;letter-spacing:.01em;text-decoration:none;
  padding:13px 26px;border-radius:14px;border:0;transition:transform .18s ease, box-shadow .18s ease, background .18s ease;
  will-change:transform;
}
.btn:active{transform:translateY(2px) scale(.98)}
.btn-berry{background:linear-gradient(180deg,#B02A24,var(--berry) 55%,var(--berry-dark));color:#FFF6E6;box-shadow:0 4px 0 var(--berry-dark),var(--shadow-soft)}
.btn-berry:hover{transform:translateY(-2px);box-shadow:0 6px 0 var(--berry-dark),var(--shadow-lift)}
.btn-sage{background:linear-gradient(180deg,#8B9A64,var(--sage) 55%,var(--moss));color:#FDF9EC;box-shadow:0 4px 0 var(--leaf),var(--shadow-soft)}
.btn-sage:hover{transform:translateY(-2px);box-shadow:0 6px 0 var(--leaf),var(--shadow-lift)}
.btn-ghost{background:transparent;color:var(--leaf);border:2px solid var(--sage);box-shadow:none}
.btn-ghost:hover{background:rgba(124,138,87,.12);transform:translateY(-2px)}
.btn-small{padding:9px 16px;font-size:.92rem;border-radius:11px}

/* ============ HEADER ============ */
.announce{background:var(--spruce);color:#EBDFC4;text-align:center;font-size:.9rem;padding:7px 14px;letter-spacing:.03em}
.announce .script{color:var(--blush);font-size:1.02rem;margin-right:6px}
header.site{
  position:sticky;top:0;z-index:120;background:rgba(251,246,234,.92);backdrop-filter:blur(8px);
  border-bottom:2px dashed rgba(122,82,48,.35);
}
.nav-bar{display:flex;align-items:center;gap:18px;padding:10px 22px;max-width:var(--wrap);margin:0 auto}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;flex-shrink:0}
.brand img{height:58px;width:auto;transition:transform .3s ease}
.brand:hover img{transform:rotate(-3deg) scale(1.05)}
.brand-name{display:flex;flex-direction:column;line-height:1}
.brand-name .script{color:var(--berry);font-size:1.5rem}
.brand-name small{font-family:var(--font-display);color:var(--walnut);letter-spacing:.24em;text-transform:uppercase;font-size:.62rem;margin-top:3px}
nav.main{display:flex;gap:4px;margin:0 auto;flex-wrap:wrap;justify-content:center}
nav.main a{
  text-decoration:none;color:var(--ink);font-weight:700;font-size:.95rem;padding:9px 11px;border-radius:12px;
  transition:background .16s ease,color .16s ease;position:relative;
}
nav.main a:hover,nav.main a.active{background:rgba(158,31,31,.09);color:var(--berry)}
.header-icons{display:flex;gap:6px;align-items:center;flex-shrink:0}
.icon-btn{
  position:relative;background:transparent;border:0;padding:10px;border-radius:50%;color:var(--leaf);
  display:inline-flex;transition:background .16s ease,transform .16s ease;
}
.icon-btn:hover{background:rgba(124,138,87,.16);transform:translateY(-2px)}
.icon-btn svg{width:23px;height:23px}
.badge-count{
  position:absolute;top:2px;right:0;background:var(--berry);color:#fff;font-size:.68rem;font-weight:800;
  min-width:18px;height:18px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  border:2px solid var(--linen);transform:scale(0);transition:transform .25s cubic-bezier(.34,1.6,.64,1);
}
.badge-count.show{transform:scale(1)}
.hamburger{display:none}
@media (max-width:920px){
  nav.main{display:none;position:absolute;top:100%;left:0;right:0;background:var(--linen);flex-direction:column;padding:12px 20px 18px;border-bottom:2px dashed rgba(122,82,48,.35);box-shadow:var(--shadow-soft)}
  nav.main.open{display:flex}
  nav.main a{padding:12px 14px;font-size:1.05rem}
  .hamburger{display:inline-flex}
  .brand img{height:48px}
  .brand-name .script{font-size:1.3rem}
}
@media (max-width:560px){
  .nav-bar{padding:10px 12px;gap:8px}
  .brand-name{display:none}
  .brand{margin-right:auto}
  .icon-btn{padding:8px}
}
/* ============ HERO ============ */
.hero{position:relative;padding:64px 0 86px;overflow:hidden;text-align:center;
  background-image:
    linear-gradient(180deg, rgba(247,240,222,.42) 0%, rgba(247,240,222,.60) 45%, rgba(247,240,222,.92) 82%, var(--cream) 100%),
    url("https://d8j0ntlcm91z4.cloudfront.net/user_3GKLUFxvFEJD5S0xF3QTv1Tq7qp/hf_20260803_185552_6607715b-e8d2-44f0-bdb6-58fe8a8e830c.png");
  background-size:cover;background-position:center 30%;background-repeat:no-repeat}
.hero::before{content:"";position:absolute;inset:0;background:radial-gradient(900px 420px at 50% 0,rgba(227,175,53,.16),transparent 65%);pointer-events:none}
.hero-sign{position:relative;display:inline-block;margin-top:34px}
.hero-sign .ropes{position:absolute;left:0;right:0;top:-120px;height:130px;pointer-events:none}
.hero-sign .ropes::before,.hero-sign .ropes::after{content:"";position:absolute;top:0;bottom:0;width:3px;background:repeating-linear-gradient(180deg,#8a6a43 0 6px,#6d5233 6px 12px);border-radius:2px}
.hero-sign .ropes::before{left:26%;transform:rotate(4deg)}
.hero-sign .ropes::after{right:26%;transform:rotate(-4deg)}
.swing{animation:swing 7s ease-in-out infinite;transform-origin:50% -120px}
@keyframes swing{0%,100%{transform:rotate(1.1deg)}50%{transform:rotate(-1.1deg)}}
.hero-logo{width:min(430px,78vw);height:auto;filter:drop-shadow(0 20px 26px rgba(84,56,31,.30))}
.hero h1.hero-slogan{margin:28px 0 16px;font-family:var(--font-script);font-weight:400;color:var(--berry);font-size:clamp(2.2rem,5.2vw,3.6rem);transform:rotate(-1.2deg);line-height:1.15}
.hero .slogan{font-family:var(--font-script);font-size:clamp(1.5rem,3.4vw,2.2rem);color:var(--berry);display:block;margin:6px 0 14px;transform:rotate(-1.2deg)}
.hero p.lede{max-width:560px;margin:0 auto 28px;color:var(--ink-soft);font-size:1.12rem}
.hero-ctas{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
.sparkle{position:absolute;width:8px;height:8px;pointer-events:none;color:var(--daisy);animation:twinkle 3.4s ease-in-out infinite}
@keyframes twinkle{0%,100%{opacity:0;transform:scale(.4) rotate(0)}50%{opacity:.95;transform:scale(1.15) rotate(45deg)}}

/* ambient falling petals */
#ambient{position:fixed;inset:0;pointer-events:none;z-index:90;overflow:hidden}
.petal{position:absolute;top:-40px;animation:fall linear forwards}
.petal-inner{animation:sway 3.4s ease-in-out infinite alternate;display:block}
@keyframes fall{to{transform:translateY(112vh) rotate(var(--spin,220deg))}}
@keyframes sway{from{transform:translateX(calc(var(--sway,26px) * -1)) rotate(-14deg)}to{transform:translateX(var(--sway,26px)) rotate(14deg)}}
.butterfly{position:absolute;pointer-events:none;z-index:2;animation:flyA var(--dur,26s) ease-in-out infinite}
.butterfly svg{width:34px;height:30px;animation:flap .5s ease-in-out infinite alternate;transform-origin:center}
@keyframes flap{from{transform:scaleX(1)}to{transform:scaleX(.55)}}
@keyframes flyA{0%{transform:translate(-6vw,64%) rotate(8deg)}25%{transform:translate(26vw,22%) rotate(-6deg)}50%{transform:translate(58vw,52%) rotate(10deg)}75%{transform:translate(82vw,18%) rotate(-8deg)}100%{transform:translate(108vw,44%) rotate(6deg)}}

/* scroll reveal */
.reveal{opacity:0;transform:translateY(26px);transition:opacity .7s ease,transform .7s ease}
.reveal.revealed{opacity:1;transform:none}

/* ============ CATEGORY SHELF ============ */
.shelf-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:22px;align-items:end}
.shelf-item{position:relative;text-decoration:none;text-align:center;padding:20px 12px 26px;border-radius:var(--r-md);transition:transform .22s ease}
.shelf-item:hover{transform:translateY(-7px)}
.shelf-item .cat-art{
  width:104px;height:104px;margin:0 auto 12px;border-radius:50%;
  background:radial-gradient(circle at 32% 28%,#FFFDF4,var(--card) 55%,var(--parchment));
  border:3px solid rgba(124,138,87,.5);display:flex;align-items:center;justify-content:center;
  box-shadow:var(--shadow-soft);transition:transform .25s ease, box-shadow .25s ease;
}
.shelf-item:hover .cat-art{transform:rotate(-4deg) scale(1.06);box-shadow:var(--shadow-lift)}
.cat-art svg{width:56px;height:56px}
.shelf-item strong{font-family:var(--font-display);color:var(--leaf);font-size:1.06rem;display:block}
.shelf-item span{color:var(--ink-soft);font-size:.86rem}
.shelf-board{height:16px;margin-top:-8px;border-radius:8px;background:linear-gradient(180deg,var(--wood-hi),var(--walnut) 60%,var(--bark));box-shadow:inset 0 2px 2px rgba(255,255,255,.25),0 10px 18px -8px rgba(84,56,31,.5)}

/* ============ PRODUCT CARDS ============ */
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:26px}
.card{
  background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;
  box-shadow:var(--shadow-soft);transition:transform .24s ease,box-shadow .24s ease;position:relative;
  display:flex;flex-direction:column;
}
.card:hover{transform:translateY(-8px) rotate(-.4deg);box-shadow:var(--shadow-lift)}
.p-art{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:1;border-radius:inherit}
.art-ill{background:linear-gradient(180deg,#FBF5E6,#F5EBD2)}
.card-media .p-art{border-radius:18px 18px 0 0}
.main-frame{position:relative;overflow:hidden}
.main-frame .p-art{border-radius:20px}
.cart-thumb{position:relative;overflow:hidden}
.flag{z-index:2}.heart-btn{z-index:3}
.card-media{position:relative;aspect-ratio:1/.86;background:
  radial-gradient(circle at 70% 25%,rgba(226,164,177,.28),transparent 55%),
  radial-gradient(circle at 25% 75%,rgba(124,138,87,.22),transparent 55%),
  linear-gradient(160deg,#FBF4E2,#F2E7CC)}
.card-media .ph{position:absolute;inset:12px;border:2px dashed rgba(122,82,48,.35);border-radius:14px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;color:var(--walnut)}
.ph svg{width:44px;height:44px;opacity:.7}
.ph em{font-family:var(--font-script);font-style:normal;font-size:1.05rem;color:var(--berry-soft)}
.ph small{font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft)}
.flag{position:absolute;top:14px;left:-8px;background:linear-gradient(180deg,#B02A24,var(--berry));color:#FFF3DC;font-size:.72rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;padding:5px 12px 5px 14px;border-radius:0 8px 8px 0;box-shadow:var(--shadow-soft);z-index:2}
.flag.green{background:linear-gradient(180deg,#8B9A64,var(--moss))}
.flag.gold{background:linear-gradient(180deg,#EEC155,#C9992B);color:#4E3620}
.heart-btn{position:absolute;top:10px;right:10px;z-index:2;background:rgba(253,249,240,.9);border:1px solid var(--line);width:38px;height:38px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--berry-soft);transition:transform .18s ease,background .18s ease}
.heart-btn:hover{transform:scale(1.14)}
.heart-btn.loved{background:var(--berry);color:#fff;border-color:var(--berry);animation:heartpop .35s cubic-bezier(.34,1.6,.64,1)}
@keyframes heartpop{0%{transform:scale(.7)}60%{transform:scale(1.25)}100%{transform:scale(1)}}
.heart-btn svg{width:19px;height:19px}
.card-body{padding:16px 18px 18px;display:flex;flex-direction:column;gap:5px;flex:1}
.card-body .cat{font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--sage);font-weight:800}
.card-body h3{font-size:1.14rem;margin:0;color:var(--leaf)}
.card-body h3 a{color:inherit;text-decoration:none}
.card-body h3 a:hover{color:var(--berry)}
.card-body .scents-note{color:var(--ink-soft);font-size:.86rem}
.deal-line{align-self:flex-start;background:rgba(227,175,53,.22);border:1px dashed var(--daisy);color:#7a5a10;font-size:.74rem;font-weight:800;padding:2px 9px;border-radius:99px;margin-top:2px}
.card-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:auto;padding-top:10px}
.card-foot .btn{flex:none;white-space:nowrap}
.card-foot .price{flex:none}
.price{font-family:var(--font-display);font-weight:700;color:var(--berry);font-size:1.2rem}
.price small{display:block;font-family:var(--font-body);font-weight:700;color:var(--moss);font-size:.75rem}
.deal-pill{display:inline-block;background:rgba(227,175,53,.22);border:1px dashed var(--daisy);color:#7a5a10;font-size:.74rem;font-weight:800;padding:2px 9px;border-radius:99px;margin-top:4px}

/* ============ SHOP TOOLBAR ============ */
.toolbar{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-bottom:26px;background:var(--card);border:1px solid var(--line);border-radius:var(--r-md);padding:14px 16px;box-shadow:var(--shadow-soft)}
.toolbar .search-field{flex:1;min-width:200px;position:relative}
.toolbar input[type=search],.field input,.field textarea,.field select,select.sort{
  width:100%;padding:11px 14px;border-radius:12px;border:2px solid var(--line);background:#FFFDF6;color:var(--ink);
  font-family:var(--font-body);font-size:1rem;transition:border-color .16s ease;
}
.toolbar input[type=search]:focus,.field input:focus,.field textarea:focus,select.sort:focus{border-color:var(--sage);outline:none}
select.sort{width:auto;font-weight:700;color:var(--leaf)}
.chips{display:flex;gap:8px;flex-wrap:wrap}
.chip{border:2px solid var(--line);background:#FFFDF6;color:var(--ink-soft);font-weight:700;font-size:.88rem;padding:8px 15px;border-radius:99px;transition:all .16s ease}
.chip:hover{border-color:var(--sage);color:var(--leaf);transform:translateY(-2px)}
.chip.on{background:var(--sage);border-color:var(--moss);color:#FDF9EC}
.results-note{color:var(--ink-soft);font-size:.92rem;margin:0 0 16px}
.pagination{display:flex;gap:8px;justify-content:center;margin-top:40px;flex-wrap:wrap}
.page-btn{min-width:44px;height:44px;border-radius:12px;border:2px solid var(--line);background:var(--card);font-weight:800;color:var(--leaf);transition:all .16s ease}
.page-btn:hover:not(:disabled){border-color:var(--sage);transform:translateY(-2px)}
.page-btn.on{background:var(--berry);border-color:var(--berry-dark);color:#fff}
.page-btn:disabled{opacity:.4}
/* ============ PRODUCT DETAIL ============ */
.crumbs{font-size:.9rem;color:var(--ink-soft);margin-bottom:22px}
.crumbs a{color:var(--sage);text-decoration:none;font-weight:700}
.crumbs a:hover{color:var(--berry)}
.pd{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:44px;align-items:start}
@media (max-width:860px){.pd{grid-template-columns:1fr}}
.pd-gallery .main-frame{position:relative;aspect-ratio:1/1;border-radius:var(--r-lg);overflow:hidden;background:
  radial-gradient(circle at 72% 22%,rgba(226,164,177,.3),transparent 55%),
  radial-gradient(circle at 22% 78%,rgba(124,138,87,.24),transparent 55%),
  linear-gradient(160deg,#FBF4E2,#EFE3C6);border:1px solid var(--line);box-shadow:var(--shadow-soft)}
.pd-thumbs{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:12px}
.pd-thumbs .thumb{aspect-ratio:1/1;border-radius:12px;border:2px dashed rgba(122,82,48,.3);background:linear-gradient(150deg,#FBF4E2,#F2E7CC);display:flex;align-items:center;justify-content:center;color:var(--walnut);font-size:.66rem;letter-spacing:.1em;text-transform:uppercase}
.pd-info .cat{font-size:.76rem;letter-spacing:.18em;text-transform:uppercase;color:var(--sage);font-weight:800}
.pd-info h1{font-size:clamp(1.7rem,3.4vw,2.4rem);margin:.2em 0 .3em}
.pd-price{font-family:var(--font-display);font-size:1.7rem;color:var(--berry);font-weight:700;margin-bottom:6px}
.pd-price .deal-pill{font-size:.82rem;vertical-align:middle;margin-left:10px}
.pd-desc{color:var(--ink-soft);font-size:1.05rem}
.opt-block{margin:20px 0}
.opt-block>label,.opt-label{display:block;font-weight:800;color:var(--leaf);margin-bottom:9px;font-size:.98rem}
.opt-label .picked{color:var(--berry);font-weight:700}
.pills{display:flex;flex-wrap:wrap;gap:9px}
.pill{border:2px solid var(--line);background:#FFFDF6;border-radius:99px;padding:9px 17px;font-weight:700;font-size:.92rem;color:var(--ink-soft);transition:all .15s ease}
.pill:hover{border-color:var(--sage);transform:translateY(-2px)}
.pill.on{background:var(--berry);border-color:var(--berry-dark);color:#fff}
.scent-picker{position:relative}
.scent-toggle{width:100%;text-align:left;display:flex;justify-content:space-between;align-items:center;gap:10px;padding:12px 16px;border-radius:12px;border:2px solid var(--line);background:#FFFDF6;font-size:1rem;font-weight:700;color:var(--ink)}
.scent-toggle:hover{border-color:var(--sage)}
.scent-toggle .arrow{transition:transform .2s ease;color:var(--sage)}
.scent-toggle[aria-expanded=true] .arrow{transform:rotate(180deg)}
.scent-panel{position:absolute;z-index:40;left:0;right:0;top:calc(100% + 8px);background:var(--card);border:2px solid var(--line);border-radius:var(--r-md);box-shadow:var(--shadow-lift);padding:12px;display:none}
.scent-panel.open{display:block}
.scent-panel input{width:100%;padding:9px 13px;border-radius:10px;border:2px solid var(--line);background:#FFFDF6;margin-bottom:10px;font-family:var(--font-body);font-size:.95rem}
.scent-list{max-height:250px;overflow:auto;display:flex;flex-direction:column;gap:2px}
.scent-list button{text-align:left;background:transparent;border:0;padding:9px 12px;border-radius:9px;font-size:.95rem;color:var(--ink);transition:background .12s ease}
.scent-list button:hover{background:rgba(124,138,87,.14)}
.scent-list button.on{background:rgba(158,31,31,.12);color:var(--berry);font-weight:800}
.checkline{display:flex;align-items:flex-start;gap:10px;background:rgba(227,175,53,.12);border:1px dashed var(--daisy);padding:12px 14px;border-radius:12px;font-size:.94rem}
.checkline input{width:19px;height:19px;accent-color:var(--berry);margin-top:2px}
.qty-row{display:flex;gap:14px;align-items:center;margin:24px 0 14px;flex-wrap:wrap}
.mini-disclaimer{margin:6px 0 20px;padding:14px 18px;background:rgba(124,138,87,.08);border:1.5px dashed rgba(122,82,48,.35);border-radius:14px;font-size:.88rem;color:var(--ink-soft)}
.mini-disclaimer strong{display:block;color:var(--leaf);font-size:.92rem;margin-bottom:6px}
.mini-disclaimer ul{list-style:none;margin:0 0 8px;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:3px 14px}
.mini-disclaimer li::before{content:"✔ ";color:var(--sage)}
.mini-disclaimer p{margin:0 0 6px;font-size:.84rem}
.mini-disclaimer a{color:var(--berry);font-weight:700;text-decoration:none}
.mini-disclaimer a:hover{text-decoration:underline}
@media (max-width:560px){.mini-disclaimer ul{grid-template-columns:1fr}}
.agree-line{display:flex;gap:10px;align-items:flex-start;margin:0 0 12px;padding:10px 12px;border:1.5px dashed rgba(122,82,48,.3);border-radius:12px;background:rgba(247,240,222,.6);transition:border-color .2s ease, box-shadow .2s ease}
.agree-line input{width:18px;height:18px;margin-top:2px;accent-color:var(--berry);flex:none;cursor:pointer}
.agree-line label{font-size:.86rem;line-height:1.45;color:var(--ink);cursor:pointer}
.agree-line a{color:var(--berry);font-weight:700;text-decoration:none}
.agree-line a:hover{text-decoration:underline}
.agree-line.attention{border-color:var(--berry);box-shadow:0 0 0 3px rgba(158,31,31,.18)}
.email-cta{align-self:start}
.email-btn{display:inline-flex;align-items:center;max-width:100%;overflow-wrap:anywhere;text-align:left;line-height:1.3}
.qty input{width:52px;border:none;background:transparent;text-align:center;font-weight:800;font-size:1.05rem;color:var(--ink);font-family:inherit;-moz-appearance:textfield;appearance:textfield}
.qty input::-webkit-outer-spin-button,.qty input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.qty input:focus{outline:2px solid var(--gold);outline-offset:-2px;border-radius:8px}
.qty{display:inline-flex;align-items:center;border:2px solid var(--line);border-radius:12px;background:#FFFDF6}
.qty button{width:42px;height:46px;border:0;background:transparent;font-size:1.25rem;font-weight:800;color:var(--leaf);transition:background .14s}
.qty button:hover{background:rgba(124,138,87,.14)}
.qty span{min-width:40px;text-align:center;font-weight:800;font-size:1.05rem}
.pd-actions{display:flex;gap:12px;flex-wrap:wrap;align-items:center}
.accordion{margin-top:30px;border-top:1px solid var(--line)}
.accordion details{border-bottom:1px solid var(--line)}
.accordion summary{padding:15px 4px;font-weight:800;color:var(--leaf);list-style:none;display:flex;justify-content:space-between;align-items:center}
.accordion summary::-webkit-details-marker{display:none}
.accordion summary::after{content:"+";font-size:1.3rem;color:var(--sage);transition:transform .2s}
.accordion details[open] summary::after{transform:rotate(45deg)}
.accordion .acc-body{padding:0 4px 16px;color:var(--ink-soft);font-size:.98rem}

/* ============ FEATURES / TESTIMONIALS ============ */
.features{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:26px}
.feature{background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg);padding:30px 26px;text-align:center;box-shadow:var(--shadow-soft);transition:transform .22s ease}
.feature:hover{transform:translateY(-6px) rotate(.4deg)}
.feature .f-icon{width:76px;height:76px;margin:0 auto 16px;border-radius:50%;background:radial-gradient(circle at 32% 30%,#fff,var(--parchment));border:3px solid rgba(226,164,177,.6);display:flex;align-items:center;justify-content:center}
.feature .f-icon svg{width:38px;height:38px}
.feature h3{font-size:1.2rem}
.feature p{color:var(--ink-soft);font-size:.96rem;margin:0}
.letters{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:28px}
.letter{background:#FFFCF2;border:1px solid var(--line);border-radius:6px;padding:30px 26px 24px;box-shadow:var(--shadow-soft);position:relative;transform:rotate(-.8deg);transition:transform .22s ease}
.letter:nth-child(2){transform:rotate(.9deg)}
.letter:nth-child(3){transform:rotate(-.4deg)}
.letter:hover{transform:rotate(0) translateY(-5px)}
.letter::before{content:"";position:absolute;top:-12px;left:50%;transform:translateX(-50%) rotate(-2deg);width:96px;height:26px;background:rgba(226,164,177,.4);border-left:1px dashed rgba(0,0,0,.08);border-right:1px dashed rgba(0,0,0,.08)}
.letter p{font-family:var(--font-script);font-size:1.18rem;color:var(--ink);line-height:1.7}
.letter cite{display:block;font-style:normal;font-weight:800;color:var(--berry);margin-top:6px}
.letter .stars{color:var(--daisy);letter-spacing:3px;font-size:1.05rem}
.letter small.sample{display:block;margin-top:10px;color:var(--ink-soft);font-size:.72rem;letter-spacing:.06em;text-transform:uppercase}

/* slogan band */
.band{background:linear-gradient(180deg,rgba(124,138,87,.16),rgba(124,138,87,.08));border-top:2px dashed rgba(122,82,48,.3);border-bottom:2px dashed rgba(122,82,48,.3);text-align:center;padding:64px 22px}
.band .script{font-size:clamp(1.7rem,4vw,2.6rem);color:var(--berry);display:block;margin-bottom:10px}
.band p{color:var(--ink-soft);max-width:520px;margin:0 auto 22px}
/* ============ CART DRAWER ============ */
.overlay{position:fixed;inset:0;background:rgba(59,49,38,.45);backdrop-filter:blur(2px);z-index:180;opacity:0;pointer-events:none;transition:opacity .3s ease}
.overlay.show{opacity:1;pointer-events:auto}
.drawer{position:fixed;top:0;right:0;bottom:0;width:min(430px,100vw);background:var(--linen);z-index:200;transform:translateX(102%);transition:transform .38s cubic-bezier(.32,.72,.28,1);display:flex;flex-direction:column;box-shadow:-16px 0 44px rgba(59,49,38,.3)}
.drawer.open{transform:translateX(0)}
.drawer-head{display:flex;align-items:center;justify-content:space-between;padding:20px 22px;border-bottom:2px dashed rgba(122,82,48,.3)}
.drawer-head h2{margin:0;font-size:1.35rem}
.drawer-head .script{color:var(--berry);font-size:1rem;display:block}
.drawer-items{flex:1;overflow-y:auto;padding:18px 22px;display:flex;flex-direction:column;gap:16px}
.cart-line{display:flex;gap:14px;background:var(--card);border:1px solid var(--line);border-radius:var(--r-md);padding:12px;box-shadow:var(--shadow-soft)}
.cart-thumb{width:70px;height:70px;flex-shrink:0;border-radius:11px;background:linear-gradient(150deg,#FBF4E2,#F0E5CB);border:2px dashed rgba(122,82,48,.3);display:flex;align-items:center;justify-content:center;color:var(--walnut)}
.cart-thumb svg{width:30px;height:30px;opacity:.7}
.cart-line .cl-body{flex:1;min-width:0}
.cart-line h4{margin:0 0 2px;font-size:1rem}
.cart-line .cl-opts{color:var(--ink-soft);font-size:.82rem;line-height:1.45}
.cl-row{display:flex;align-items:center;justify-content:space-between;margin-top:8px}
.qty.mini button{width:30px;height:32px;font-size:1rem}
.qty.mini span{min-width:28px;font-size:.95rem}
.cl-price{font-weight:800;color:var(--berry)}
.link-btn{background:none;border:0;color:var(--berry-soft);font-size:.8rem;font-weight:700;text-decoration:underline;padding:2px}
.link-btn:hover{color:var(--berry)}
.drawer-foot{padding:18px 22px 24px;border-top:2px dashed rgba(122,82,48,.3);background:var(--card)}
.sub-row{display:flex;justify-content:space-between;font-weight:700;margin-bottom:6px;color:var(--ink)}
.sub-row.savings{color:var(--moss)}
.sub-row.total{font-family:var(--font-display);font-size:1.25rem;color:var(--berry);margin:8px 0 4px}
.ship-note{color:var(--ink-soft);font-size:.85rem;margin-bottom:14px}
.drawer-foot .btn{width:100%}
.empty-nest{text-align:center;padding:44px 18px;color:var(--ink-soft)}
.empty-nest .big{font-size:2.6rem;display:block;margin-bottom:10px}
.empty-nest .script{color:var(--berry);font-size:1.3rem;display:block;margin-bottom:6px}

/* ============ SEARCH OVERLAY ============ */
.search-veil{position:fixed;inset:0;background:rgba(247,240,222,.97);z-index:220;display:none;padding:70px 22px 40px;overflow-y:auto}
.search-veil.open{display:block}
.search-inner{max-width:680px;margin:0 auto}
.search-inner .close-x{position:absolute;top:22px;right:26px}
.big-search{width:100%;font-size:1.35rem;padding:16px 22px;border-radius:16px;border:3px solid var(--sage);background:#FFFDF6;font-family:var(--font-body)}
.big-search:focus{outline:none;border-color:var(--berry)}
.search-hint{color:var(--ink-soft);font-size:.92rem;margin:10px 4px 22px}
.search-results{display:flex;flex-direction:column;gap:12px}
.sr-item{display:flex;gap:14px;align-items:center;background:var(--card);border:1px solid var(--line);border-radius:var(--r-md);padding:12px 16px;text-decoration:none;color:var(--ink);transition:transform .16s ease,box-shadow .16s ease}
.sr-item:hover{transform:translateX(6px);box-shadow:var(--shadow-soft)}
.sr-item .cart-thumb{width:54px;height:54px}
.sr-item strong{color:var(--leaf)}
.sr-item .match{display:block;font-size:.82rem;color:var(--ink-soft)}
.sr-item .price{margin-left:auto;font-size:1.05rem}

/* ============ FORMS / CONTACT / ABOUT ============ */
.two-col{display:grid;grid-template-columns:1.1fr .9fr;gap:44px;align-items:start}
@media (max-width:860px){.two-col{grid-template-columns:1fr}}
.paper{background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg);padding:32px;box-shadow:var(--shadow-soft)}
.field{margin-bottom:16px}
.field label{display:block;font-weight:800;color:var(--leaf);margin-bottom:6px;font-size:.95rem}
.field textarea{min-height:130px;resize:vertical}
.info-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:14px}
.info-list li{display:flex;gap:13px;align-items:flex-start}
.info-list .i-dot{width:42px;height:42px;flex-shrink:0;border-radius:50%;background:rgba(124,138,87,.18);display:flex;align-items:center;justify-content:center;color:var(--moss)}
.info-list .i-dot svg{width:21px;height:21px}
.info-list strong{display:block;color:var(--leaf)}
.info-list span{color:var(--ink-soft);font-size:.95rem}
.socials{display:flex;gap:10px;margin-top:6px}
.socials a{width:42px;height:42px;border-radius:50%;background:var(--card);border:2px solid var(--line);display:flex;align-items:center;justify-content:center;color:var(--walnut);transition:all .16s ease}
.socials a:hover{border-color:var(--berry);color:var(--berry);transform:translateY(-3px)}
.socials svg{width:19px;height:19px}
.story p{font-size:1.08rem;color:var(--ink-soft)}
.story .edit-me{background:rgba(227,175,53,.14);border:1px dashed var(--daisy);border-radius:12px;padding:16px 18px;font-size:.98rem;color:#7a5a10;margin:14px 0}
.story .edit-me strong{color:#5c430a}

/* ============ FOOTER ============ */
footer.site{background:var(--spruce);color:#D8CCAF;margin-top:80px;position:relative}
footer.site::before{content:"";position:absolute;top:-2px;left:0;right:0;border-top:2px dashed rgba(226,164,177,.4)}
.foot-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr 1.2fr;gap:36px;padding:60px 22px 40px;max-width:var(--wrap);margin:0 auto}
@media (max-width:860px){.foot-grid{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.foot-grid{grid-template-columns:1fr}}
.foot-brand img{width:190px;margin-bottom:14px}
.foot-brand .script{color:var(--blush);font-size:1.25rem;display:block;margin-bottom:8px}
.foot-brand p{font-size:.92rem;color:#B4A88B}
footer.site h4{color:#F2E7C8;font-size:1.02rem;margin-bottom:14px}
.foot-links{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:9px}
.foot-links a{color:#C6BA9C;text-decoration:none;font-size:.95rem;transition:color .15s ease,padding-left .15s ease}
.foot-links a:hover{color:var(--blush);padding-left:5px}
.foot-bottom{border-top:1px solid rgba(216,204,175,.18);text-align:center;padding:18px 22px;font-size:.85rem;color:#9A8F74}
.foot-bottom .script{color:var(--blush)}

/* toast + modal */
.toast{position:fixed;left:50%;bottom:26px;transform:translate(-50%,80px);background:var(--leaf);color:#F5EFDC;padding:14px 24px;border-radius:14px;box-shadow:var(--shadow-lift);z-index:260;opacity:0;transition:all .35s cubic-bezier(.34,1.4,.64,1);font-weight:700;display:flex;gap:10px;align-items:center;max-width:92vw}
.toast.show{transform:translate(-50%,0);opacity:1}
.modal-veil{position:fixed;inset:0;background:rgba(59,49,38,.5);z-index:240;display:none;align-items:center;justify-content:center;padding:22px}
.modal-veil.show{display:flex}
.modal{background:var(--linen);border-radius:var(--r-lg);max-width:520px;width:100%;padding:38px 34px;text-align:center;box-shadow:var(--shadow-lift);border:1px solid var(--line);position:relative;max-height:88vh;overflow-y:auto}
.modal .script{font-size:1.9rem;color:var(--berry);display:block;margin-bottom:8px}
.modal p{color:var(--ink-soft)}
.close-x{background:transparent;border:0;color:var(--walnut);width:42px;height:42px;border-radius:50%;font-size:1.5rem;line-height:1;transition:background .15s ease}
.close-x:hover{background:rgba(122,82,48,.12)}
.modal .close-x{position:absolute;top:10px;right:10px}
/* Page-enter animation: the original SPA faded each view in via .view.active.
   Shopify serves real pages, so the same keyframe is applied to <main>. */
main#main{animation:viewin .45s ease}
@media (prefers-reduced-motion: reduce){main#main{animation:none}}
@keyframes viewin{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.mini-strip h3{font-size:1.15rem;margin-bottom:14px}
.hscroll{display:flex;gap:16px;overflow-x:auto;padding-bottom:10px}
.hscroll .card{min-width:220px;max-width:220px}

/* ============ LADYBUG CURSOR ============ */
#bug-cursor{position:fixed;top:0;left:0;z-index:400;pointer-events:none;width:34px;height:34px;margin:-17px 0 0 -17px;transition:opacity .2s ease;opacity:0}
#bug-cursor.on{opacity:1}
#bug-cursor svg{width:100%;height:100%;filter:drop-shadow(0 3px 4px rgba(0,0,0,.3));transition:transform .18s cubic-bezier(.34,1.5,.64,1)}
#bug-cursor.hovering svg{transform:scale(1.35) rotate(-8deg)}
#bug-cursor.pressing svg{transform:scale(.8)}
#bug-cursor .bug-wing{transform-origin:17px 15px;transition:transform .2s ease}
#bug-cursor.hovering .wL{transform:rotate(-24deg)}
#bug-cursor.hovering .wR{transform:rotate(24deg)}
@media (max-width:920px){.section{padding:52px 0}}

/* ============================================================
   SHOPIFY ADDITIONS
   Styles for markup that only exists in the Shopify build
   (real pages instead of SPA views, native forms, account pages).
   ============================================================ */
.skip-link{position:absolute;left:-9999px;top:0;z-index:200;background:var(--berry);color:#FFF3DC;padding:10px 16px;border-radius:0 0 10px 0}
.skip-link:focus{left:0}
.visually-hidden{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.veil{position:fixed;inset:0;background:rgba(20,27,36,.45);opacity:0;pointer-events:none;transition:opacity .25s ease;z-index:60}
.veil.show{opacity:1;pointer-events:auto}
main{display:block}

/* real <img> product art sits in the same frame as the SVG illustration */
.pd-thumbs .thumb.has-img{padding:0;overflow:hidden;border-style:solid;cursor:pointer;background:none}
.pd-thumbs .thumb.has-img img{width:100%;height:100%;object-fit:cover;border-radius:10px}

/* native form controls inside cottage paper cards */
.paper label{display:block;font-weight:800;color:var(--leaf);margin:14px 0 6px;font-size:.92rem}
.paper input[type=text],.paper input[type=email],.paper input[type=password],.paper input[type=search]{
  width:100%;padding:12px 14px;border-radius:12px;border:1.5px solid rgba(122,82,48,.35);
  background:#FFFDF6;font-family:inherit;font-size:1rem;color:var(--ink)}
.paper input:focus{outline:2px solid var(--daisy);outline-offset:1px}
.acct-table{width:100%;border-collapse:collapse;margin-top:12px}
.acct-table th,.acct-table td{text-align:left;padding:10px 8px;border-bottom:1px dashed rgba(122,82,48,.28);font-size:.92rem}
.acct-table th{color:var(--leaf);font-family:var(--font-display)}
.addr{padding:12px 0;border-bottom:1px dashed rgba(122,82,48,.28);color:var(--ink-soft)}
.errors,.form-message{color:var(--berry);font-weight:700;margin:10px 0}

/* search + collection page forms */
.search-page-form{display:flex;gap:10px;max-width:640px;margin:0 auto 26px}
.search-page-form input{flex:1;padding:12px 16px;border-radius:14px;border:1.5px solid rgba(122,82,48,.35);background:#FFFDF6;font-family:inherit;font-size:1rem}
.chips{display:flex;flex-wrap:wrap;gap:10px;margin:16px 0 6px}
a.chip{text-decoration:none}

/* cart page (non-drawer) */
.cart-page{padding:20px}
.cart-foot-page{margin-top:18px;padding-top:16px;border-top:2px dashed rgba(122,82,48,.3)}
.cart-foot-page .btn{width:100%;margin-top:12px}
.cart-thumb img{width:100%;height:100%;object-fit:cover;border-radius:10px}
.qty.mini a{display:inline-flex;align-items:center;justify-content:center;text-decoration:none}

/* contact page grid */

.email-cta .cat{color:var(--sage);letter-spacing:.14em;text-transform:uppercase;font-size:.78rem;font-weight:800}
.email-cta h3{font-family:var(--font-display);color:var(--leaf);margin:8px 0 12px;font-size:1.5rem}
.email-btn{display:inline-flex;align-items:center;gap:8px;max-width:100%;overflow-wrap:anywhere;text-align:left;line-height:1.3}
.email-btn svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2}
.small-note{font-size:.85rem;color:var(--ink-soft);margin:14px 0 0}
.coming{color:var(--berry);font-size:1.05rem}

/* card used for non-product search results */
.card-page .card-body{padding:20px}
.card-page p{color:var(--ink-soft);font-size:.92rem}

/* button loading state while adding to cart */
.btn.loading{opacity:.7;pointer-events:none}


/* High-variant option picker: unavailable values + refresh state */
.pill.soldout,.scent-list button.soldout{opacity:.45;text-decoration:line-through}
.optionValueSelectors.loading{opacity:.6;pointer-events:none;transition:opacity .15s ease}

/* Footer: social network not configured yet — same look as the original's "coming soon" */
.foot-links .soon{color:inherit;opacity:.72}

/* ============================================================
   HEADER: category navigation row beneath the top bar.
   Desktop/tablet-wide only. Below 900px the original CSS turns
   nav.main into the hamburger dropdown (display:none until .open),
   so these rules are scoped above that breakpoint — otherwise their
   higher specificity would keep the nav visible and overlay content.
   ============================================================ */
@media (min-width:901px){
  .site .cat-bar{
    border-top:1px solid rgba(122,82,48,.16);
    background:linear-gradient(180deg,rgba(247,240,222,.55),rgba(241,231,206,.75));
  }
  .site .cat-bar nav.main{
    display:flex;flex-wrap:wrap;justify-content:center;align-items:center;
    gap:2px;max-width:1180px;margin:0 auto;padding:6px 22px;
  }
  .site .nav-bar{flex-wrap:nowrap}
  .site .nav-bar .brand{margin-right:auto}
}
@media (max-width:900px){
  /* Let the nav behave exactly as it did originally: a dropdown from the
     hamburger. display:contents removes the wrapper from layout entirely. */
  .site .cat-bar{display:contents}
}
}

/* ============================================================
   Off-canvas panels: hidden from layout AND from the tab order
   while closed. Without this the parked drawer's contents stay
   focusable and can nudge the document's scroll width on narrow
   screens. Visibility is delayed until the slide-out finishes so
   the animation is unchanged.
   ============================================================ */
.drawer{visibility:hidden;transition:transform .38s cubic-bezier(.22,.9,.3,1), visibility 0s linear .38s}
.drawer.open{visibility:visible;transition:transform .38s cubic-bezier(.22,.9,.3,1), visibility 0s linear 0s}
.search-veil{visibility:hidden;transition:opacity .28s ease, visibility 0s linear .28s}
.search-veil.open{visibility:visible;transition:opacity .28s ease, visibility 0s linear 0s}




/* Pagination: the original styled <button> elements, which centre their own text.
   These are <a>/<span>, so give them the same flex centring and equal footprint —
   numbers line up and the row stays centred regardless of how many pages exist. */
.pagination{align-items:center}
a.page-btn,span.page-btn{display:inline-flex;align-items:center;justify-content:center;
  padding:0 12px;text-decoration:none;box-sizing:border-box;line-height:1}

/* Availability line. The original applied these inline on the product page
   (color:var(--moss); font-weight:700; margin:0 0 10px); as a class here it was
   inheriting default paragraph styling — wrong colour, weight and spacing. */
.pd-info .stock{color:var(--moss);font-weight:700;margin:0 0 10px}