/* ==========================================================================
   Campaign banners (home hero) + Jewellery section
   ========================================================================== */

/* ---------- shared banner frame ---------- */
.slider.camps{background:#140a10;isolation:isolate}
.camp{--fg:#fff;--ac:#f2bfd0;--line:rgba(255,255,255,.22);--bt-bg:#fff;--bt-fg:#1b0d15;
  position:absolute;inset:0;overflow:hidden;color:var(--fg);display:block;min-height:min(86vh,780px)}
.slider .camp.on{position:relative}
.camp:after{display:none}
.c-bg{position:absolute;inset:0;z-index:0;pointer-events:none}
.c-word{position:absolute;left:-.04em;bottom:-.18em;font-family:var(--display);font-style:italic;font-weight:600;
  font-size:clamp(120px,21vw,360px);line-height:1;letter-spacing:-.03em;white-space:nowrap;color:transparent;
  -webkit-text-stroke:1.5px var(--line);opacity:0;transform:translateX(6%);transition:opacity 1.2s ease .2s,transform 8s linear}
.camp.on .c-word{opacity:1;transform:translateX(0)}
.c-in{position:relative;z-index:2;max-width:1280px;margin:0 auto;min-height:inherit;padding:56px 20px 104px;
  display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.08fr);align-items:center;gap:clamp(24px,4vw,64px)}
.c-copy{display:grid;gap:16px;align-content:center;max-width:560px}
.c-copy .eyebrow{color:var(--ac);font-size:12px;letter-spacing:.24em;display:inline-flex;align-items:center;gap:10px}
.c-copy .eyebrow:before{content:"";width:28px;height:1px;background:currentColor}
.c-h{font-family:var(--display);font-weight:500;font-size:clamp(50px,6.6vw,108px);line-height:.92;letter-spacing:-.025em;margin:0;color:var(--fg)}
.c-h.long{font-size:clamp(44px,5.2vw,84px)}
.c-h em{display:block;font-style:italic;font-weight:400;color:var(--ac)}
.c-copy p{margin:0;font-size:clamp(16px,1.25vw,18.5px);line-height:1.55;max-width:40ch;opacity:.9}
.c-copy .slinks{display:flex;flex-wrap:wrap;align-items:center;gap:14px 26px;margin-top:8px}
.c-btn{background:var(--bt-bg);color:var(--bt-fg);border:0;padding:17px 30px;border-radius:999px;font-size:13px;letter-spacing:.14em;
  text-transform:uppercase;font-weight:600;box-shadow:0 14px 34px -12px rgba(0,0,0,.55);transition:transform .25s,box-shadow .25s}
.c-btn:hover{transform:translateY(-2px);box-shadow:0 20px 40px -12px rgba(0,0,0,.6)}
.c-btn span{display:inline-block;transition:transform .25s}.c-btn:hover span{transform:translateX(4px)}
.c-copy .ulink{color:var(--fg);font-size:13px;letter-spacing:.14em;text-transform:uppercase;border-bottom:1px solid currentColor;padding-bottom:3px}
.camp.on .c-copy>*{animation:c-rise .9s cubic-bezier(.2,.7,.2,1) both}
.camp.on .c-copy>*:nth-child(2){animation-delay:.1s}.camp.on .c-copy>*:nth-child(3){animation-delay:.2s}
.camp.on .c-copy>*:nth-child(4){animation-delay:.3s}.camp.on .c-copy>*:nth-child(5){animation-delay:.4s}
@keyframes c-rise{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:none}}

/* ---------- photo collage ---------- */
.c-art{position:relative;height:min(68vh,620px);min-height:440px}
.c-ph{position:absolute;display:block;overflow:hidden;border-radius:18px;background:rgba(255,255,255,.08);
  box-shadow:0 40px 80px -30px rgba(0,0,0,.7),0 0 0 1px rgba(255,255,255,.08);transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.c-ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 20%;transform:scale(1.06);transition:transform 6s ease-out}
.camp.on .c-ph img{transform:scale(1)}
.c-ph:hover{z-index:5}
.c-art .p1{width:50%;height:92%;left:25%;top:4%;z-index:3;transform:rotate(-2deg)}
.c-art .p2{width:36%;height:64%;left:0;top:24%;z-index:2;transform:rotate(-7deg)}
.c-art .p3{width:36%;height:62%;right:0;top:8%;z-index:2;transform:rotate(6deg)}
.c-art.n2 .p1{width:54%;left:6%;transform:rotate(-3deg)}
.c-art.n2 .p2{width:44%;height:72%;left:auto;right:2%;top:16%;transform:rotate(5deg)}
.c-art .p1:hover{transform:rotate(-2deg) translateY(-8px)}
.c-art .p2:hover{transform:rotate(-4deg) translateY(-8px)}
.c-art .p3:hover{transform:rotate(3deg) translateY(-8px)}
.camp.on .c-ph{animation:c-drop 1s cubic-bezier(.2,.7,.2,1) both}
.camp.on .c-ph.p2{animation-delay:.15s}.camp.on .c-ph.p3{animation-delay:.28s}
@keyframes c-drop{from{opacity:0;translate:0 40px;scale:.94}to{opacity:1;translate:0 0;scale:1}}

/* rotating sticker */
.c-stk{position:absolute;z-index:6;left:calc(25% - 58px);bottom:2%;width:132px;height:132px;border-radius:50%;
  display:grid;place-items:center;background:var(--stk-bg,#ffe066);color:var(--stk-fg,#1b0d15);box-shadow:0 18px 40px -14px rgba(0,0,0,.55)}
.c-art.n2 .c-stk{left:auto;right:calc(46% - 66px);bottom:-2%}
.c-stk svg{position:absolute;inset:6px;width:calc(100% - 12px);height:calc(100% - 12px);animation:c-spin 16s linear infinite;overflow:visible}
.c-stk text{font-family:var(--mono);font-size:10.6px;letter-spacing:.1em;fill:currentColor;font-weight:500}
.c-stk b{font-family:var(--display);font-style:italic;font-size:30px;line-height:1;font-weight:600}
@keyframes c-spin{to{transform:rotate(360deg)}}

/* sparkles */
.spk{position:absolute;font-style:normal;color:var(--ac);opacity:.85;animation:c-twinkle 3.2s ease-in-out infinite;text-shadow:0 0 18px currentColor}
.spk.s1{top:14%;left:46%;font-size:26px}.spk.s2{top:70%;left:8%;font-size:18px;animation-delay:.8s}
.spk.s3{top:22%;right:6%;font-size:34px;animation-delay:1.4s}.spk.s4{bottom:16%;right:40%;font-size:14px;animation-delay:2s}
@keyframes c-twinkle{0%,100%{opacity:.2;transform:scale(.7) rotate(0)}50%{opacity:1;transform:scale(1.15) rotate(20deg)}}

/* arrows + dots on campaign hero */
.camps .sarrow{position:absolute;z-index:8;bottom:26px;width:46px;height:46px;border-radius:50%;border:1px solid rgba(255,255,255,.4);
  background:rgba(0,0,0,.18);color:#fff;font-size:18px;display:grid;place-items:center;backdrop-filter:blur(6px);transition:background .25s}
.camps .sarrow:hover{background:rgba(255,255,255,.2)}
.camps .sarrow.prev{left:max(20px,calc((100vw - 1280px)/2 + 20px))}
.camps .sarrow.next{left:calc(max(20px,calc((100vw - 1280px)/2 + 20px)) + 56px)}
.camps .sdots{bottom:46px}.camps .scount{bottom:62px}
.camps:has(.c-pink.on) .sarrow,.camps:has(.c-pink.on) .scount{color:#4a1030;border-color:rgba(74,16,48,.35)}
.camps:has(.c-pink.on) .sdots button{background:rgba(74,16,48,.25)}.camps:has(.c-pink.on) .sdots button[aria-selected="true"]{background:#4a1030}
.camps:has(.c-pink.on) .scount b{color:#4a1030}

/* ---------- 1. SALE — hot pink + sunshine ---------- */
.c-sale{--ac:#ffe066;--line:rgba(255,255,255,.3);--bt-bg:#ffe066;--bt-fg:#3a0820;--stk-bg:#fff;--stk-fg:#c2185b;
  background:radial-gradient(120% 90% at 80% 10%,#ff5c9a 0%,transparent 55%),radial-gradient(90% 80% at 0% 100%,#7a0b3d 0%,transparent 60%),linear-gradient(135deg,#e0115f,#a3093f)}
.c-sale .c-h{text-shadow:0 6px 40px rgba(90,0,30,.35)}
.c-sale .c-h em{color:#ffe066}
.c-sale .cd-boxes span{background:rgba(255,255,255,.16);border-color:rgba(255,255,255,.35)}
.c-sale .c-ph{border:6px solid #fff;border-radius:16px}

/* ---------- 2. AFTER DARK — spotlight ---------- */
.c-night{--ac:#a9c8ff;--line:rgba(169,200,255,.2);--stk-bg:#a9c8ff;--stk-fg:#0b1020;
  background:radial-gradient(46% 70% at 68% 44%,rgba(120,160,255,.34) 0%,rgba(40,60,120,.14) 45%,transparent 70%),radial-gradient(60% 60% at 10% 100%,rgba(120,40,120,.25),transparent 70%),#070a14}
.c-night .c-bg:before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(100deg,transparent 0 80px,rgba(255,255,255,.025) 80px 82px)}
.c-night .c-h em{color:#a9c8ff;text-shadow:0 0 30px rgba(140,180,255,.6)}
.c-night .c-ph{box-shadow:0 40px 90px -30px #000,0 0 0 1px rgba(169,200,255,.25),0 0 60px -10px rgba(120,160,255,.35)}

/* ---------- 3. DENIM — indigo + gold stitching ---------- */
.c-denim{--ac:#ffcf6b;--line:rgba(255,255,255,.18);--bt-bg:#ffcf6b;--bt-fg:#13264a;--stk-bg:#ffcf6b;--stk-fg:#13264a;
  background:repeating-linear-gradient(135deg,rgba(255,255,255,.035) 0 2px,transparent 2px 7px),repeating-linear-gradient(45deg,rgba(0,0,0,.06) 0 2px,transparent 2px 7px),
  radial-gradient(80% 90% at 75% 30%,#3d68b0 0%,#1f3d73 55%,#132849 100%)}
.c-denim .c-bg:after{content:"";position:absolute;inset:16px;border:2px dashed rgba(255,207,107,.55);border-radius:22px}
.c-denim .c-ph{border:5px solid #f4ecdd;border-radius:14px}

/* ---------- 4. JEWELLERY — plum + gold ---------- */
.c-jewel{--ac:#f3d28a;--line:rgba(243,210,138,.22);--bt-bg:linear-gradient(90deg,#f7e0a3,#c9973f,#f3d28a);--bt-fg:#2a0a1c;--stk-bg:#f3d28a;--stk-fg:#2a0a1c;
  background:radial-gradient(60% 70% at 72% 40%,#6b1d4a 0%,transparent 70%),radial-gradient(50% 60% at 0% 0%,#4a1236,transparent 70%),#1d0714}
.c-jewel .c-btn{background:linear-gradient(90deg,#f7e0a3,#c9973f 50%,#f3d28a);background-size:200% 100%;animation:shine 6s linear infinite}
.c-jewel .c-h em{background:linear-gradient(90deg,#f7e0a3,#c9973f,#fff1c9,#f3d28a);background-size:200% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:shine 6s linear infinite}
.c-jewel .c-ph{border:1px solid rgba(243,210,138,.7);padding:8px;background:#2a0a1c;border-radius:200px 200px 18px 18px}
.c-jewel .c-ph img{inset:8px;width:calc(100% - 16px);height:calc(100% - 16px);border-radius:192px 192px 12px 12px}
.c-jewel .jw-ico{position:absolute;width:120px;height:120px;opacity:.9;filter:drop-shadow(0 0 18px rgba(243,210,138,.35));animation:c-float 7s ease-in-out infinite}
.c-jewel .f1{right:3%;top:8%;width:170px;height:170px}
.c-jewel .f2{left:44%;bottom:7%;width:110px;height:110px;animation-delay:1.5s}
.c-jewel .f3{right:40%;top:6%;width:84px;height:84px;animation-delay:3s;opacity:.6}
.c-jewel .f4{left:4%;top:12%;width:40px;height:40px;animation:c-twinkle 3s infinite}
.c-jewel .f5{right:8%;bottom:20%;width:28px;height:28px;animation:c-twinkle 3s 1.2s infinite}
@keyframes c-float{0%,100%{transform:translateY(0) rotate(-4deg)}50%{transform:translateY(-16px) rotate(4deg)}}

/* ---------- 5. PINK CHECK — gingham ---------- */
.c-pink{--fg:#4a1030;--ac:#c2185b;--line:rgba(194,24,91,.22);--bt-bg:#4a1030;--bt-fg:#fff;--stk-bg:#c2185b;--stk-fg:#fff;
  background:linear-gradient(90deg,rgba(255,255,255,.42) 50%,transparent 0) 0 0/56px 56px,linear-gradient(rgba(255,255,255,.42) 50%,transparent 0) 0 0/56px 56px,#f6bfd1}
.c-pink .c-copy{background:rgba(255,246,249,.84);backdrop-filter:blur(4px);padding:clamp(24px,3vw,40px);border-radius:24px;box-shadow:0 30px 60px -30px rgba(120,20,60,.45)}
.c-pink .c-ph{border:10px solid #fff;border-bottom-width:44px;border-radius:6px;box-shadow:0 30px 60px -24px rgba(120,20,60,.55)}
.c-pink .c-ph:after{content:"oh my my ♡";position:absolute;left:0;right:0;bottom:-34px;text-align:center;font-family:var(--display);font-style:italic;font-size:17px;color:#c2185b}
.c-pink .c-ph{overflow:visible}.c-pink .c-ph img{border-radius:2px}

/* ---------- 6. CO-ORDS — teal + peach ---------- */
.c-coord{--ac:#ffc9a3;--line:rgba(255,201,163,.2);--bt-bg:#ffc9a3;--bt-fg:#0b3a40;--stk-bg:#ffc9a3;--stk-fg:#0b3a40;
  background:radial-gradient(circle at 78% 46%,#13707a 0 22%,transparent 22.2%),radial-gradient(circle at 78% 46%,transparent 0 30%,rgba(255,201,163,.14) 30.2% 30.6%,transparent 30.8%),
  radial-gradient(70% 80% at 80% 30%,#0f5a63,#0a3c43 70%)}
.c-coord .c-ph{border-radius:999px 999px 18px 18px}

/* ---------- mobile ---------- */
@media (max-width:860px){
  .camp{min-height:0}
  .c-in{grid-template-columns:1fr;padding:22px 16px 92px;gap:8px;min-height:0}
  .c-art{order:-1;height:min(64vw,400px);min-height:300px;margin:0 2px 4px}
  .c-copy{gap:12px}
  .c-h,.c-h.long{font-size:clamp(40px,11vw,58px)}
  .c-copy p{font-size:15.5px}
  .c-btn{padding:15px 24px}
  .c-stk{width:96px;height:96px;left:auto;right:-4px;bottom:-10px}
  .c-stk b{font-size:22px}.c-stk text{font-size:11.6px}
  .c-art.n2 .c-stk{right:-4px}
  .c-word{font-size:34vw;bottom:auto;top:28%}
  .c-pink .c-copy{padding:20px}
  .c-pink .c-ph{border-width:6px;border-bottom-width:30px}.c-pink .c-ph:after{bottom:-25px;font-size:13px}
  .c-jewel .f1{width:96px;height:96px;top:auto;bottom:34%}.c-jewel .f2,.c-jewel .f3{display:none}
  .c-denim .c-bg:after{inset:8px}
  .camps .sarrow{display:none}
  .spk.s2,.spk.s4{display:none}.spk.s1{top:6%;left:6%}.spk.s3{top:4%;right:4%}
  .camps .sdots{left:16px;bottom:34px}.camps .scount{left:auto;right:16px;bottom:30px}
}
@media (prefers-reduced-motion:reduce){
  .c-stk svg,.spk,.c-jewel .jw-ico,.c-jewel .c-btn,.c-jewel .c-h em{animation:none}
  .camp.on .c-copy>*,.camp.on .c-ph{animation:none}.c-word{transition:none;opacity:1;transform:none}
}

/* ==========================================================================
   Jewellery — home section
   ========================================================================== */
.jw{padding:clamp(40px,6vw,80px) 0}
.jw-in{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:18px}
.jw-hero{position:relative;overflow:hidden;border-radius:28px;min-height:460px;display:flex;align-items:flex-end;color:#fff;
  background:radial-gradient(70% 80% at 80% 20%,#6b1d4a,transparent 70%),#1d0714;isolation:isolate}
.jw-glow{position:absolute;width:420px;height:420px;right:-80px;top:-80px;border-radius:50%;background:radial-gradient(circle,rgba(243,210,138,.35),transparent 65%);z-index:-1}
.jw-photo{position:absolute;right:6%;top:9%;width:38%;height:82%;object-fit:cover;object-position:center 20%;border-radius:200px 200px 16px 16px;border:1px solid rgba(243,210,138,.7);padding:6px;z-index:-1;transition:transform .6s}
.jw-hero:hover .jw-photo{transform:translateY(-6px) rotate(1deg)}
.jw-hero .jw-ico{position:absolute;filter:drop-shadow(0 0 14px rgba(243,210,138,.4))}
.jw-hero .jh1{width:150px;height:150px;left:46%;top:6%;animation:c-float 7s ease-in-out infinite}
.jw-hero .jh2{width:34px;height:34px;left:auto;right:4%;top:auto;bottom:8%;animation:c-twinkle 3s infinite}
.jw-hero .jh3{width:22px;height:22px;left:40%;top:46%;animation:c-twinkle 3s 1.3s infinite}
.jw-copy{display:grid;gap:12px;padding:clamp(24px,3.4vw,44px);max-width:56%}
.jw-copy .eyebrow{color:#f3d28a}
.jw-copy h2{font-size:clamp(38px,4.4vw,64px);line-height:.95;letter-spacing:-.02em;color:#fff}
.jw-copy h2 em{display:block;font-style:italic;background:linear-gradient(90deg,#f7e0a3,#c9973f,#fff1c9,#f3d28a);background-size:200% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:shine 6s linear infinite}
.jw-p{font-size:15.5px;opacity:.86;max-width:36ch}
.jw-btn{justify-self:start;background:linear-gradient(90deg,#f7e0a3,#c9973f 50%,#f3d28a);color:#2a0a1c;border:0;font-weight:600;margin-top:6px}
.jw-cats{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.jw-cat{position:relative;display:grid;align-content:end;gap:4px;padding:22px;border-radius:24px;min-height:220px;overflow:hidden;
  background:linear-gradient(160deg,#fff 0%,#f8eef0 100%);border:1px solid var(--line);transition:transform .3s,box-shadow .3s}
.jw-cat:hover{transform:translateY(-4px);box-shadow:0 24px 48px -26px rgba(42,22,34,.45)}
.jw-cat .jw-ico{position:absolute;top:18px;right:16px;width:96px;height:96px;transition:transform .5s}
.jw-cat:hover .jw-ico{transform:rotate(-8deg) scale(1.08)}
.jw-cat b{font-family:var(--display);font-size:28px;font-weight:500;line-height:1}
.jw-cat small{color:var(--muted);font-size:13.5px}
.jw-n{justify-self:start;margin-top:8px;font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;padding:5px 10px;border-radius:999px;background:var(--ink);color:#f3d28a}
.jw-cat:nth-child(2){background:linear-gradient(160deg,#fff7e8,#f6e7c8)}
.jw-cat:nth-child(3){background:linear-gradient(160deg,#fdeef3,#f6d3df)}
.jw-cat:nth-child(4){background:linear-gradient(160deg,#f1eefb,#e2dcf3)}

/* Jewellery bubble in "Shop by category" */
.cat-ico{position:relative;display:grid;place-items:center;width:100%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 50% 35%,#6b1d4a,#1d0714 75%);transition:transform .3s}
.cat-ico .jw-ico{width:58%;height:58%}
.cat-ico i{position:absolute;top:4%;right:4%;font-style:normal;font-family:var(--mono);font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;background:#f3d28a;color:#2a0a1c;padding:4px 8px;border-radius:999px}
.cat-jw:hover .cat-ico{transform:scale(1.04)}

/* Jewellery collection pages */
.jw-band{position:relative;overflow:hidden;color:#fff;background:radial-gradient(60% 90% at 85% 10%,#6b1d4a,transparent 70%),#1d0714}
.jw-band-in{position:relative;padding:54px 20px 40px;display:grid;gap:12px;justify-items:start}
.jw-band .eyebrow{color:#f3d28a}
.jw-band h1{font-size:clamp(46px,6vw,88px);line-height:.95;color:#fff}
.jw-band h1 em{font-style:italic;background:linear-gradient(90deg,#f7e0a3,#c9973f,#fff1c9,#f3d28a);background-size:200% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:shine 6s linear infinite}
.jw-band p{margin:0;max-width:52ch;opacity:.86}
.jw-band .jb1{position:absolute;right:16%;top:22%;width:44px;height:44px;animation:c-twinkle 3s infinite}
.jw-band .jb2{position:absolute;right:30%;bottom:22%;width:24px;height:24px;animation:c-twinkle 3s 1s infinite}
.jw-band .jb3{position:absolute;right:4%;top:14%;width:150px;height:150px;animation:c-float 7s ease-in-out infinite;opacity:.9}
.jw-tabs{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.jw-tabs a{display:inline-flex;align-items:center;gap:8px;padding:9px 16px;border-radius:999px;border:1px solid rgba(243,210,138,.45);font-size:13px;letter-spacing:.06em}
.jw-tabs a .jw-ico{width:22px;height:22px}
.jw-tabs a[aria-current="page"],.jw-tabs a:hover{background:#f3d28a;color:#2a0a1c;border-color:#f3d28a}
.jw-head h1,.jw-head .coll-desc{display:none}
.jw-empty{display:grid;justify-items:center;text-align:center;gap:12px;padding:56px 20px;border-radius:24px;background:linear-gradient(160deg,#fff7e8,#fdeef3);border:1px solid var(--line)}
.jw-empty .jw-ico{width:56px;height:56px;animation:c-twinkle 3s infinite}
.jw-empty h2{font-size:clamp(28px,3vw,40px)}
.jw-empty p{margin:0;color:var(--muted);max-width:44ch}

@media (max-width:860px){
  .jw-in{grid-template-columns:1fr}
  .jw-hero{min-height:0;flex-direction:column;align-items:stretch}
  .jw-photo{position:relative;right:auto;top:auto;width:56%;height:270px;margin:28px auto 0;z-index:0}
  .jw-hero .jh1{left:8%;top:8%;width:110px;height:110px}
  .jw-copy{max-width:100%;padding:24px}
  .jw-cats{gap:12px}
  .jw-cat{min-height:170px;padding:16px;border-radius:20px}
  .jw-cat .jw-ico{width:66px;height:66px;top:12px;right:10px}
  .jw-cat b{font-size:22px}.jw-cat small{font-size:12.5px}
  .jw-band .jb3{width:90px;height:90px;top:auto;bottom:10px;opacity:.5}
}

/* Shop by category: fit 7 bubbles in one row; swipe row on phones */
.cats{grid-template-columns:repeat(auto-fit,minmax(110px,1fr))}
@media (max-width:860px){
  .cats{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:12px;padding-bottom:6px;scrollbar-width:none;margin:0 -16px;padding-left:16px;padding-right:16px}
  .cats::-webkit-scrollbar{display:none}
  .cats .cat{flex:0 0 27%;scroll-snap-align:start}
}