/* Lazy Cat! Handmade — shared site styles (all pages). Page-specific styles live next to the page. */
:root{
  --cream:#FFF9F5;
  --blush:#FAE3E5;
  --rose:#D9788F;
  --rose-deep:#B85874;
  --sage:#9CC3B4;
  --butter:#FBE7C6;
  --plum:#5C4048;
  --plum-soft:#8A6E76;
  --line-green:#06C755;
  --radius:22px;
  --shadow:0 14px 34px rgba(148,106,118,.13);
}

html{scroll-behavior:smooth;scroll-padding-top:78px}
body{
  background:var(--cream);
  color:var(--plum);
  font-family:'Prompt',system-ui,sans-serif;
  font-weight:300;
  font-size:1.0rem;
  line-height:1.85;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4,.font-display{font-family:'Mali',cursive;font-weight:600;line-height:1.45;letter-spacing:.2px}
h1{font-size:clamp(2rem,4.6vw,3.15rem)}
h2{font-size:clamp(1.6rem,3.2vw,2.3rem)}
h3{font-size:1.18rem}
p{max-width:64ch}
a{color:var(--rose-deep);text-underline-offset:3px}
a:hover{color:var(--plum)}
:focus-visible{outline:3px solid var(--rose);outline-offset:3px;border-radius:6px}

.wrap{max-width:1140px}
.band{padding:5.5rem 0}
.band-tint{background:linear-gradient(180deg,#fff 0%,var(--blush) 100%)}
.band-blush{background:var(--blush)}

/* sewn-in fabric tag: used for section labels */
.tag{
  display:inline-flex;align-items:center;gap:.45rem;
  background:#fff;border-radius:999px;
  padding:.3rem 1rem .3rem .85rem;
  font-size:.86rem;font-weight:400;color:var(--plum-soft);
  box-shadow:inset 0 0 0 1px rgba(217,120,143,.35);
}
.tag i{color:var(--rose);font-size:.95rem}

/* dashed running-stitch inside any card */
.stitch{position:relative;background:#fff;border-radius:var(--radius);box-shadow:var(--shadow)}
.stitch::after{
  content:"";position:absolute;inset:9px;border:2px dashed rgba(217,120,143,.30);
  border-radius:calc(var(--radius) - 9px);pointer-events:none;
}
.stitch-body{position:relative;z-index:1;padding:1.9rem 1.7rem}

.btn{border-radius:999px;font-weight:400;padding:.62rem 1.5rem;border-width:2px}
.btn-rose{background:var(--rose);border-color:var(--rose);color:#fff}
.btn-rose:hover,.btn-rose:focus{background:var(--rose-deep);border-color:var(--rose-deep);color:#fff}
.btn-outline-plum{border-color:rgba(92,64,72,.3);color:var(--plum);background:transparent}
.btn-outline-plum:hover{background:var(--plum);border-color:var(--plum);color:#fff}
.btn-line{background:var(--line-green);border-color:var(--line-green);color:#fff}
.btn-line:hover,.btn-line:focus{background:#05a948;border-color:#05a948;color:#fff}

/* nav */
.navbar{background:rgba(255,249,245,.92);backdrop-filter:blur(10px);border-bottom:1px solid rgba(217,120,143,.18)}
.navbar-brand{font-family:'Mali',cursive;font-weight:600;color:var(--plum);font-size:1.25rem}
.navbar .nav-link{color:var(--plum-soft);font-size:.95rem;padding-inline:.85rem}
.navbar .nav-link{white-space:nowrap}
.navbar .nav-link.active{color:var(--rose-deep);font-weight:400}
.navbar .btn{white-space:nowrap}
@media (min-width:1200px){
  .navbar .nav-link{padding-inline:.5rem;font-size:.9rem}
  .navbar .wrap{max-width:1280px}
}
@media (min-width:1200px) and (max-width:1399.98px){
  .navbar .nav-link{padding-inline:.38rem;font-size:.87rem}
  .navbar .nav-item.ms-xl-3{margin-left:.5rem !important}
}
.navbar .nav-link:hover,.navbar .nav-link:focus{color:var(--rose-deep)}
.navbar-toggler{border-color:rgba(217,120,143,.4)}

/* hero */
.hero{padding:4.5rem 0 5rem;background:radial-gradient(1100px 520px at 88% -12%,var(--blush) 0%,transparent 62%)}
.hero-photo{border-radius:28px;width:100%;object-fit:cover;box-shadow:var(--shadow)}
.hero-meta{display:flex;flex-wrap:wrap;gap:1.6rem;margin-top:2.2rem}
.hero-meta .v{font-family:'Mali',cursive;font-size:1.5rem;color:var(--rose-deep);line-height:1.2}
.hero-meta .l{font-size:.85rem;color:var(--plum-soft)}

/* QR card */
.qr-card{max-width:340px}
.qr-frame{background:#fff;border-radius:16px;padding:.6rem;box-shadow:inset 0 0 0 2px rgba(6,199,85,.25)}
.qr-frame img{width:100%;display:block;border-radius:10px}
.qr-id{font-family:'Mali',cursive;font-size:1.35rem;color:var(--plum)}

/* platform cards */
.shop-card{height:100%;transition:transform .18s ease}
.shop-card:hover{transform:translateY(-4px)}
.shop-icon{
  width:54px;height:54px;border-radius:16px;display:grid;place-items:center;
  color:#fff;font-size:1.5rem;overflow:hidden;flex:0 0 auto;
}
.shop-icon img{width:100%;height:100%;object-fit:cover}
.shop-handle{font-size:.88rem;color:var(--plum-soft)}
.shop-card p{font-size:.93rem;margin-bottom:1.1rem}

/* features */
.feat i{font-size:1.5rem;color:var(--rose)}
.feat h3{margin:.7rem 0 .35rem}
.feat p{font-size:.94rem;color:var(--plum-soft);margin:0}

/* benefit lists */
.perks li{display:flex;gap:.75rem;align-items:flex-start;font-size:.94rem;color:var(--plum-soft);margin-bottom:.75rem}
.perks i{color:var(--rose);font-size:1.05rem;line-height:1.75;flex:0 0 auto}
.audience-card h3{font-size:1.28rem;margin-bottom:.5rem}
.audience-card p{font-size:.95rem}

/* gallery */
.filters{display:flex;flex-wrap:wrap;gap:.5rem;justify-content:center}
.filter-btn{
  border:none;background:#fff;color:var(--plum-soft);
  border-radius:999px;padding:.4rem 1.15rem;font-size:.92rem;
  box-shadow:inset 0 0 0 1px rgba(217,120,143,.3);
}
.filter-btn[aria-pressed="true"]{background:var(--rose);color:#fff;box-shadow:none}
.tile{position:relative;border-radius:18px;overflow:hidden;background:#fff;box-shadow:var(--shadow);display:block}
.tile img{width:100%;aspect-ratio:1/1;object-fit:cover;display:block}
.tile figcaption{
  position:absolute;left:0;right:0;bottom:0;
  padding:1.6rem .9rem .7rem;font-size:.86rem;color:#fff;
  background:linear-gradient(180deg,transparent,rgba(92,64,72,.78));
}

/* fabric designs */
.design-tile{position:relative;border-radius:18px;overflow:hidden;background:#fff;box-shadow:var(--shadow);display:block;transition:transform .18s ease}
.design-tile:hover{transform:translateY(-4px)}
.design-tile img{width:100%;aspect-ratio:1/1;object-fit:cover;display:block}
.design-tile figcaption{padding:.55rem .8rem .65rem;font-size:.86rem;color:var(--plum);line-height:1.5;text-align:center}
.designs-more[hidden]{display:none}

/* bulk box */
.bulk-card .stitch-body{padding:1.6rem}
.bulk-img{width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:16px;display:block}

/* "แมวของเรา" teaser on the home page */
.teaser-avatars{display:flex;justify-content:center;padding:.5rem 0 .5rem 18px;text-decoration:none}
.teaser-avatar{
  width:78px;height:78px;border-radius:50%;overflow:hidden;margin-left:-18px;flex:0 0 auto;
  box-shadow:0 0 0 4px #fff,0 6px 16px rgba(148,106,118,.18);
  display:grid;place-items:center;
  color:color-mix(in srgb,var(--g,#D9788F) 55%,#fff);
  background:color-mix(in srgb,var(--g,#D9788F) 12%,#fff);
}
.teaser-avatar img{width:100%;height:100%;object-fit:cover;display:block}
.teaser-avatar svg{width:70%;height:auto}
.teaser-avatars:hover .teaser-avatar{transform:translateY(-3px)}
.teaser-avatar{transition:transform .18s ease}
.teaser-avatar:nth-child(even){margin-top:22px}

/* accordion */
.accordion-item{border:none;background:transparent;margin-bottom:.75rem}
.accordion-button{
  background:#fff;border-radius:16px !important;color:var(--plum);
  font-family:'Mali',cursive;font-size:1.02rem;box-shadow:var(--shadow);padding:1.05rem 1.3rem;
}
.accordion-button:not(.collapsed){background:#fff;color:var(--rose-deep);box-shadow:var(--shadow)}
.accordion-button:focus{box-shadow:var(--shadow);border-color:transparent}
.accordion-button::after{filter:hue-rotate(300deg) saturate(.6)}
.accordion-body{font-size:.95rem;color:var(--plum-soft);padding:1rem 1.35rem 0}

/* line band */
.line-band{background:linear-gradient(135deg,#FDEFF2 0%,#EAF4EF 100%)}

/* footer */
footer{background:#fff;border-top:1px solid rgba(217,120,143,.18);padding:3.2rem 0 1.6rem}
footer h4{font-size:1rem;margin-bottom:.9rem}
footer a{color:var(--plum-soft);text-decoration:none;font-size:.93rem}
footer a:hover{color:var(--rose-deep)}
.footer-note{font-size:.84rem;color:var(--plum-soft)}

@media (max-width:575.98px){
  .band{padding:3.6rem 0}
  .hero{padding:2.5rem 0 3.2rem}
  .stitch-body{padding:1.5rem 1.25rem}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *{transition:none !important;animation:none !important}
}

/* Footer: copyright certificate thumbnail (opens #certModal) */
.cert-thumb{display:inline-flex;align-items:center;gap:.75rem;margin-top:.4rem}
.cert-thumb img{width:90px;height:auto;border-radius:6px;border:1px solid rgba(217,120,143,.3);box-shadow:0 2px 8px rgba(80,40,60,.08);transition:transform .2s,box-shadow .2s}
.cert-thumb:hover img{transform:translateY(-2px);box-shadow:0 6px 16px rgba(80,40,60,.15)}
.cert-thumb span{font-size:.85rem;line-height:1.35}
.cert-thumb small{color:var(--plum-soft);opacity:.8}