/* STANDARD GIFTS - Pencil Bag Description - Kawaii pastel stationery - no JS */
*{margin:0;padding:0;box-sizing:border-box}
body{font-family:'Quicksand',Helvetica,Arial,sans-serif;color:#4b3f4a;background:#FFF7F9;line-height:1.7}
img{max-width:100%;display:block}
a{text-decoration:none;color:inherit}
.wrap{max-width:1180px;margin:0 auto;padding:0 24px}
h1,h2,h3{font-family:'Baloo 2',cursive;color:#5a4157}
.sec{padding:68px 0}
.sec-head{text-align:center;max-width:780px;margin:0 auto 40px}
.sec-tag{display:inline-block;font-family:'Baloo 2',cursive;font-weight:800;font-size:13px;letter-spacing:1px;text-transform:uppercase;color:#fff;background:#F48FB1;border-radius:999px;padding:6px 18px;transform:rotate(-2deg);margin-bottom:14px}
.sec-tag.mint{background:#7FD8BE;color:#1f4a3d}.sec-tag.lilac{background:#B39DDB}.sec-tag.butter{background:#FFD98A;color:#5a4157}
.sec-head h2{font-size:34px;margin-bottom:10px}
.sec-head p{color:#8a7386;font-size:15px}
.btn{display:inline-block;font-family:'Baloo 2',cursive;font-weight:800;border-radius:999px;padding:13px 30px;font-size:15px;border:3px solid #5a4157;box-shadow:0 4px 0 #5a4157}
.btn-pink{background:#F48FB1;color:#fff}
.btn-butter{background:#FFD98A}
/* hero */
.hero{background:linear-gradient(160deg,#FFE3EC 0%,#FFF7F9 60%,#E8F8F2 100%);padding:72px 0}
.hero .wrap{display:grid;grid-template-columns:1fr 1.05fr;gap:44px;align-items:center}
.hero h1{font-size:clamp(38px,4.8vw,58px);font-weight:800;line-height:1.1}
.hero h1 .hl{display:inline-block;background:#FFD98A;padding:0 14px;border-radius:14px;transform:rotate(-2deg);box-shadow:4px 4px 0 #F48FB1}
.hero p{font-size:15.5px;color:#8a7386;margin:16px 0 26px;max-width:500px}
.hero-actions{display:flex;gap:14px;flex-wrap:wrap}
.hero-img{border-radius:26px;overflow:hidden;border:3px solid #5a4157;box-shadow:10px 10px 0 #7FD8BE}
.hero-img img{width:100%;height:auto}
/* trust */
.trust{background:#5a4157;color:#fff}
.trust .wrap{display:grid;grid-template-columns:repeat(4,1fr);padding:22px 24px}
.trust-item{text-align:center;padding:4px 10px;border-left:2px dashed rgba(255,255,255,.3)}
.trust-item:first-child{border-left:none}
.trust-item b{display:block;font-family:'Baloo 2',cursive;font-size:24px;color:#FFD98A}
.trust-item span{font-size:11.5px;font-weight:700;letter-spacing:1px;text-transform:uppercase;opacity:.9}
/* faces */
.face-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.face-item{background:#fff;border:3px solid #5a4157;border-radius:22px;overflow:hidden;box-shadow:6px 6px 0 rgba(90,65,87,.15);transform:rotate(-1deg)}
.face-item:nth-child(even){transform:rotate(1deg)}
.face-item img{aspect-ratio:1/1;object-fit:cover}
.face-cap{padding:12px;text-align:center;border-top:3px solid #5a4157}
.face-cap b{font-family:'Baloo 2',cursive;font-size:15px;display:block}
.face-cap span{font-size:11.5px;color:#8a7386;font-weight:600}
.face-item.c1 .face-cap{background:#FFE3EC}.face-item.c2 .face-cap{background:#F5F5F5}.face-item.c3 .face-cap{background:#F6E7D7}.face-item.c4 .face-cap{background:#E8F8F2}
/* craft */
.craft{background:#FFE3EC}
.craft-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;align-items:stretch}
.craft-img{border-radius:24px;overflow:hidden;border:3px solid #5a4157;box-shadow:8px 8px 0 #FFD98A}
.craft-img img{width:100%;height:100%;object-fit:cover}
.craft-cards{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.craft-card{background:#fff;border:3px solid #5a4157;border-radius:20px;padding:20px 18px;box-shadow:5px 5px 0 rgba(90,65,87,.15)}
.craft-card.p{background:#FFE3EC}.craft-card.m{background:#E8F8F2}.craft-card.y{background:#FFF6DC}.craft-card.l{background:#F1ECFA}
.craft-card .ic{font-size:24px;margin-bottom:6px}
.craft-card h3{font-size:15px;margin-bottom:5px}
.craft-card p{font-size:12.5px;color:#8a7386}
/* clear */
.clear-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.clear-item{background:#fff;border:3px solid #5a4157;border-radius:22px;overflow:hidden;box-shadow:6px 6px 0 rgba(90,65,87,.15)}
.clear-item img{aspect-ratio:1/1;object-fit:cover}
.clear-cap{padding:12px;text-align:center}
.clear-cap b{font-family:'Baloo 2',cursive;font-size:14px;display:block}
.clear-cap span{font-size:11.5px;color:#8a7386;font-weight:600}
/* custom */
.cus-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.cus-card{background:#fff;border:3px solid #5a4157;border-radius:20px;padding:20px 18px;box-shadow:5px 5px 0 rgba(90,65,87,.15)}
.cus-card .ic{font-size:24px;margin-bottom:6px}
.cus-card h3{font-size:15px;margin-bottom:5px}
.cus-card p{font-size:12.5px;color:#8a7386}
/* steps */
.steps{background:#E8F8F2}
.step-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.step-card{background:#fff;border:3px solid #5a4157;border-radius:22px;padding:22px 16px;text-align:center;box-shadow:6px 6px 0 rgba(90,65,87,.15)}
.step-no{width:44px;height:44px;border-radius:50%;border:3px solid #5a4157;font-family:'Baloo 2',cursive;font-weight:800;font-size:19px;display:flex;align-items:center;justify-content:center;margin:0 auto 12px}
.n1{background:#F48FB1;color:#fff}.n2{background:#FFD98A}.n3{background:#7FD8BE}.n4{background:#B39DDB;color:#fff}
.step-card h3{font-size:15.5px;margin-bottom:5px}
.step-card p{font-size:12.5px;color:#8a7386}
/* specs & faq */
.spec-table{width:100%;border-collapse:collapse;background:#fff;border:3px solid #5a4157;border-radius:18px;overflow:hidden;font-size:13.5px}
.spec-table td{padding:12px 18px;border-bottom:1px solid #f3e6ee;vertical-align:top}
.spec-table td:first-child{font-weight:700;color:#5a4157;width:220px;background:#FFF7F9}
details{background:#fff;border:3px solid #5a4157;border-radius:18px;margin-bottom:12px;box-shadow:5px 5px 0 rgba(90,65,87,.15)}
summary{cursor:pointer;font-family:'Baloo 2',cursive;font-weight:700;font-size:16px;color:#5a4157;padding:14px 20px;list-style:none;display:flex;justify-content:space-between}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";color:#F48FB1;font-size:20px}
details[open] summary::after{content:"–"}
details p{padding:0 20px 16px;font-size:13.5px;color:#8a7386}
/* cta */
.cta{background:#5a4157;text-align:center;padding:72px 24px}
.cta h2{font-size:38px;color:#fff}
.cta h2 em{font-style:normal;color:#FFD98A}
.cta p{color:#d9c8d6;font-size:15px;margin:14px auto 28px;max-width:620px}
.cta .actions{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
.cta .btn{border-color:#fff;box-shadow:0 4px 0 #fff}
@media(max-width:1024px){
  .hero .wrap{grid-template-columns:1fr}
  .face-grid,.clear-grid{grid-template-columns:1fr 1fr}
  .craft-grid{grid-template-columns:1fr}
  .cus-grid,.step-grid{grid-template-columns:1fr 1fr}
  .trust .wrap{grid-template-columns:repeat(2,1fr);row-gap:14px}
  .trust-item{border-left:none}
}
@media(max-width:640px){
  .face-grid,.clear-grid,.cus-grid,.step-grid,.craft-cards{grid-template-columns:1fr 1fr}
}