/* ═══════════════════════════════════════════════════════════
   ZANEVA MERDEKA SERIES — TEMA: RETRO POSTER '45
   Estetika poster kemerdekaan era 1945: kertas tua, tinta
   sablon merah pudar, tipografi kondensasi tebal, sunburst,
   stempel karet, dan strip tiket.
   ═══════════════════════════════════════════════════════════ */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  --kertas:#EAD9B4;        /* kertas tua */
  --kertas-tua:#DEC896;    /* kertas lebih gelap */
  --krem:#F4E9CE;          /* krem terang */
  --merah:#A6301C;         /* merah sablon pudar */
  --merah-dark:#7E2113;
  --merah-light:#C24A32;
  --tinta:#241B10;         /* tinta hitam kecoklatan */
  --emas:#B8862B;          /* mustard tua */
  --emas-light:#D6A946;
  --abu:#6B5B44;
  --abu-light:#A3906F;
  --putih:#F4E9CE;         /* alias supaya inline style lama tetap jalan */
  --frame:3px solid var(--tinta);
  --shadow-off:6px 6px 0 var(--tinta);
}
html{scroll-behavior:smooth}
body{
  font-family:'Lora',serif;
  background:var(--kertas);
  color:var(--tinta);
  overflow-x:hidden;
  position:relative;
}
/* grain kertas — signature texture di seluruh halaman */
body::after{
  content:'';position:fixed;inset:0;z-index:999;pointer-events:none;
  opacity:0.5;mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3CfeColorMatrix values='0 0 0 0 0.55 0 0 0 0 0.47 0 0 0 0 0.32 0 0 0 0.14 0'/%3E%3C/filter%3E%3Crect width='240' height='240' filter='url(%23n)'/%3E%3C/svg%3E");
}
img{filter:sepia(0.18) saturate(0.92) contrast(1.02)}

h1,h2{font-family:'Anton',sans-serif;font-weight:400;text-transform:uppercase}
h2{font-size:clamp(2rem,3.6vw,3.4rem);line-height:1.02;letter-spacing:0.01em}
h2 em{font-style:normal;color:var(--merah)}
.eyebrow{
  font-family:'Oswald',sans-serif;font-weight:600;
  font-size:0.78rem;letter-spacing:0.3em;text-transform:uppercase;
  color:var(--merah);margin-bottom:0.9rem;
  display:flex;align-items:center;gap:0.7rem;
}
.eyebrow::before{content:'★';font-size:0.9em}

/* ── NAV ── */
nav{
  position:fixed;top:0;left:0;right:0;z-index:200;
  display:flex;align-items:center;justify-content:space-between;
  padding:0.85rem 3rem;
  background:var(--krem);
  border-bottom:3px solid var(--tinta);
}
.nav-logo{
  font-family:'Anton',sans-serif;
  font-size:1.6rem;letter-spacing:0.14em;color:var(--tinta);
  text-decoration:none;
}
.nav-logo b{color:var(--merah);font-weight:400}
.nav-pill{
  display:flex;align-items:center;gap:0.4rem;
  background:var(--merah);color:var(--krem);
  padding:0.55rem 1.3rem;border:2px solid var(--tinta);
  box-shadow:3px 3px 0 var(--tinta);
  font-family:'Oswald',sans-serif;
  font-size:0.78rem;font-weight:600;
  letter-spacing:0.1em;text-transform:uppercase;
  text-decoration:none;transition:transform 0.15s,box-shadow 0.15s;
}
.nav-pill:hover{transform:translate(2px,2px);box-shadow:1px 1px 0 var(--tinta)}

/* ── HERO — poster utama dengan sunburst & stempel ── */
.hero{
  min-height:100vh;
  display:grid;grid-template-columns:1.05fr 0.95fr;
  padding-top:64px;position:relative;overflow:hidden;
  border-bottom:3px solid var(--tinta);
}
.hero-left{
  position:relative;overflow:hidden;
  display:flex;flex-direction:column;justify-content:center;
  padding:5rem 3.5rem 5rem 5rem;
  background:var(--kertas);
}
/* sunburst sablon */
.hero-left::before{
  content:'';position:absolute;z-index:0;
  width:160vmax;height:160vmax;left:50%;top:50%;
  transform:translate(-50%,-50%);
  background:repeating-conic-gradient(
    var(--kertas) 0deg 9deg,
    rgba(166,48,28,0.13) 9deg 18deg
  );
  animation:sunspin 90s linear infinite;
  pointer-events:none;
}
@keyframes sunspin{to{transform:translate(-50%,-50%) rotate(360deg)}}
/* stempel karet MERDEKA */
.hero-left::after{
  content:'MERDEKA! ✦ 17•08 ✦';
  position:absolute;z-index:2;right:2rem;top:6.2rem;
  font-family:'Oswald',sans-serif;font-weight:700;
  font-size:0.95rem;letter-spacing:0.18em;text-transform:uppercase;
  color:var(--merah);
  border:3px double var(--merah);
  padding:0.6rem 1rem;border-radius:6px;
  transform:rotate(-8deg);
  opacity:0.85;mix-blend-mode:multiply;
  pointer-events:none;
}
.hero-left > *{position:relative;z-index:1}
.hero-tag{
  display:inline-flex;align-items:center;gap:0.5rem;
  background:var(--tinta);color:var(--kertas);
  padding:0.42rem 1.1rem;
  font-family:'Oswald',sans-serif;
  font-size:0.72rem;font-weight:600;letter-spacing:0.22em;
  text-transform:uppercase;margin-bottom:1.6rem;
  width:fit-content;
}
.hero-title{
  font-size:clamp(3.2rem,6vw,6.4rem);
  line-height:0.95;color:var(--tinta);margin-bottom:0.7rem;
  text-shadow:4px 4px 0 rgba(166,48,28,0.22);
}
.hero-title em{font-style:normal;color:var(--merah)}
.hero-sub{
  font-family:'Oswald',sans-serif;font-weight:500;
  font-size:clamp(1.1rem,2vw,1.6rem);
  letter-spacing:0.5em;text-transform:uppercase;
  color:var(--merah);margin-bottom:1.4rem;
  display:inline-block;
  border-top:2px solid var(--merah);
  border-bottom:2px solid var(--merah);
  padding:0.35rem 0.2rem 0.35rem 0.4rem;
}
.hero-copy{
  font-size:1.02rem;line-height:1.75;color:var(--abu);
  max-width:32rem;margin-bottom:1.6rem;font-style:italic;
}
.hero-pills{display:flex;flex-wrap:wrap;gap:0.55rem;margin-bottom:2.2rem}
.pill{
  font-family:'Oswald',sans-serif;font-weight:500;
  font-size:0.74rem;letter-spacing:0.08em;text-transform:uppercase;
  color:var(--tinta);
  border:2px solid var(--tinta);
  padding:0.35rem 0.85rem;background:var(--krem);
}
.hero-cta{display:flex;flex-wrap:wrap;gap:1rem}
.btn-primary,.btn-wa{
  font-family:'Oswald',sans-serif;font-weight:600;
  letter-spacing:0.1em;text-transform:uppercase;font-size:0.86rem;
  text-decoration:none;padding:0.95rem 1.8rem;
  border:2px solid var(--tinta);
  transition:transform 0.15s,box-shadow 0.15s;
  display:inline-flex;align-items:center;gap:0.5rem;
}
.btn-primary{background:var(--tinta);color:var(--kertas);box-shadow:var(--shadow-off)}
.btn-wa{background:var(--merah);color:var(--krem);box-shadow:var(--shadow-off)}
.btn-primary:hover,.btn-wa:hover{transform:translate(3px,3px);box-shadow:2px 2px 0 var(--tinta)}

.hero-right{
  display:grid;grid-template-columns:1fr 1fr;grid-auto-rows:1fr;
  gap:1.2rem;padding:2.5rem;background:var(--kertas-tua);
  border-left:3px solid var(--tinta);
  align-content:center;
}
.mosaic-img{
  width:100%;height:100%;object-fit:cover;min-height:180px;
  border:var(--frame);box-shadow:var(--shadow-off);
  background:var(--krem);
}
.mosaic-span2{grid-column:span 2;min-height:300px}

/* ── MARQUEE — strip tiket ── */
.marquee{
  background:var(--merah);color:var(--kertas);
  border-top:3px solid var(--tinta);border-bottom:3px solid var(--tinta);
  overflow:hidden;padding:0.75rem 0;position:relative;
}
.marquee::before,.marquee::after{
  content:'';position:absolute;top:50%;width:18px;height:18px;
  border-radius:50%;background:var(--kertas);border:3px solid var(--tinta);
  transform:translateY(-50%);z-index:2;
}
.marquee::before{left:-9px}
.marquee::after{right:-9px}
.marquee-inner{
  display:flex;gap:2.5rem;width:max-content;
  animation:marq 30s linear infinite;
  font-family:'Oswald',sans-serif;font-weight:600;
  font-size:0.82rem;letter-spacing:0.25em;text-transform:uppercase;
  white-space:nowrap;
}
@keyframes marq{to{transform:translateX(-50%)}}

/* ── TRUST BAR ── */
.trust-bar{
  display:grid;grid-template-columns:repeat(4,1fr);
  background:var(--krem);
  border-bottom:3px solid var(--tinta);
}
.trust-item{
  display:flex;align-items:center;gap:0.8rem;justify-content:center;
  padding:1.3rem 1rem;font-size:0.82rem;color:var(--abu);
  border-right:2px dashed var(--abu-light);
}
.trust-item:last-child{border-right:none}
.trust-icon{font-size:1.3rem}
.trust-bold{display:block;font-family:'Oswald',sans-serif;font-weight:600;letter-spacing:0.05em;text-transform:uppercase;color:var(--tinta);font-size:0.8rem}

/* ── WHY SECTION ── */
.why-section{
  display:grid;grid-template-columns:1.1fr 0.9fr;gap:4rem;
  padding:6rem 5rem;align-items:center;
  background:var(--kertas);
}
.why-text h2{margin-bottom:1.2rem}
.why-text > p{color:var(--abu);line-height:1.8;margin-bottom:2rem;font-style:italic}
.pain-list{list-style:none;display:flex;flex-direction:column;gap:1rem}
.pain-list li{
  display:flex;gap:1rem;align-items:flex-start;
  font-size:0.95rem;line-height:1.55;
  padding:0.9rem 1.1rem;background:var(--krem);
  border:2px solid var(--tinta);
}
.pain-list li:last-child{background:var(--merah);color:var(--krem);box-shadow:var(--shadow-off)}
.pain-list li:last-child b{color:var(--emas-light)}
.pain-icon{
  flex-shrink:0;width:26px;height:26px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-size:0.8rem;font-weight:700;border:2px solid currentColor;
}
.pain-icon.bad{color:var(--merah)}
.pain-icon.good{color:var(--krem)}
.why-visual{position:relative}
.why-visual img{
  width:100%;display:block;
  border:var(--frame)!important;border-radius:0!important;
  box-shadow:var(--shadow-off);
}
.why-badge{
  position:absolute;left:-2rem;bottom:2rem;
  background:var(--krem);border:var(--frame);
  box-shadow:var(--shadow-off);
  padding:1rem 1.2rem;max-width:270px;
  display:flex;gap:0.9rem;align-items:center;
  transform:rotate(-2deg);
}
.why-badge-text{font-size:0.78rem;line-height:1.5;color:var(--abu)}
.why-badge-text b{display:block;font-family:'Oswald',sans-serif;font-weight:600;text-transform:uppercase;letter-spacing:0.04em;color:var(--tinta);margin-bottom:0.15rem}
.why-badge-flag{width:34px;flex-shrink:0;border:2px solid var(--tinta)}
.flag-top{height:12px;background:var(--merah)}
.flag-bot{height:12px;background:var(--krem)}

/* ── OUTFIT SECTION ── */
.outfit-section{padding:6rem 5rem;background:var(--kertas-tua);border-top:3px solid var(--tinta)}
.section-head{
  display:flex;align-items:flex-end;justify-content:space-between;
  gap:2rem;margin-bottom:3rem;flex-wrap:wrap;
}
.view-all{
  font-family:'Oswald',sans-serif;font-weight:600;font-size:0.85rem;
  letter-spacing:0.12em;text-transform:uppercase;
  color:var(--krem);background:var(--tinta);
  padding:0.8rem 1.5rem;text-decoration:none;
  border:2px solid var(--tinta);box-shadow:4px 4px 0 var(--merah);
  transition:transform 0.15s,box-shadow 0.15s;
}
.view-all:hover{transform:translate(2px,2px);box-shadow:2px 2px 0 var(--merah)}
.outfit-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:2rem;
}
.outfit-card{
  background:var(--krem);border:var(--frame);
  box-shadow:var(--shadow-off);
  display:flex;flex-direction:column;
  transition:transform 0.2s;
}
.outfit-card:hover{transform:translate(-3px,-3px)}
.outfit-img-wrap{position:relative;overflow:hidden;border-bottom:var(--frame)}
.outfit-img-wrap img{width:100%;height:340px;object-fit:cover;display:block;transition:transform 0.4s}
.outfit-card:hover .outfit-img-wrap img{transform:scale(1.04)}
.outfit-tag{
  position:absolute;top:0.9rem;left:0.9rem;z-index:2;
  background:var(--merah);color:var(--krem);
  font-family:'Oswald',sans-serif;font-weight:600;
  font-size:0.68rem;letter-spacing:0.12em;text-transform:uppercase;
  padding:0.35rem 0.75rem;border:2px solid var(--tinta);
  transform:rotate(-3deg);
}
.outfit-tag.putih{background:var(--krem);color:var(--merah)}
.outfit-overlay{
  position:absolute;inset:0;display:flex;align-items:flex-end;justify-content:center;
  padding:1.2rem;opacity:0;transition:opacity 0.25s;
  background:linear-gradient(transparent 55%,rgba(36,27,16,0.75));
}
.outfit-card:hover .outfit-overlay{opacity:1}
.overlay-btn{
  font-family:'Oswald',sans-serif;font-weight:600;font-size:0.8rem;
  letter-spacing:0.1em;text-transform:uppercase;
  background:var(--kertas);color:var(--tinta);
  border:2px solid var(--tinta);
  padding:0.7rem 1.4rem;text-decoration:none;
}
.outfit-info{padding:1.4rem 1.4rem 1.5rem;display:flex;flex-direction:column;gap:0.6rem;flex:1}
.outfit-pieces{display:flex;flex-wrap:wrap;gap:0.4rem}
.piece-chip{
  font-family:'Oswald',sans-serif;font-size:0.68rem;font-weight:500;
  letter-spacing:0.05em;color:var(--abu);
  border:1.5px dashed var(--abu-light);padding:0.2rem 0.55rem;
}
.outfit-name{
  font-family:'Anton',sans-serif;font-size:1.15rem;
  text-transform:uppercase;letter-spacing:0.02em;color:var(--tinta);
}
.outfit-desc{font-size:0.85rem;line-height:1.65;color:var(--abu);flex:1;font-style:italic}
.outfit-footer{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-top:0.4rem}
.outfit-price{
  font-family:'Anton',sans-serif;font-size:1.25rem;color:var(--merah);
  display:flex;flex-direction:column;line-height:1.15;
}
.price-strike{
  font-family:'Oswald',sans-serif;font-weight:400;font-size:0.75rem;
  color:var(--abu-light);text-decoration:line-through;
}
.btn-order{
  font-family:'Oswald',sans-serif;font-weight:600;font-size:0.75rem;
  letter-spacing:0.08em;text-transform:uppercase;
  background:var(--merah);color:var(--krem);
  border:2px solid var(--tinta);box-shadow:3px 3px 0 var(--tinta);
  padding:0.6rem 1rem;cursor:pointer;
  transition:transform 0.15s,box-shadow 0.15s;
}
.btn-order:hover{transform:translate(2px,2px);box-shadow:1px 1px 0 var(--tinta)}

/* ── AGUSTUSAN SECTION ── */
.agus-section{
  display:grid;grid-template-columns:1fr 1fr;gap:4rem;
  padding:6rem 5rem;align-items:center;
  background:var(--merah);
  border-top:3px solid var(--tinta);
  color:var(--krem);position:relative;overflow:hidden;
}
.agus-section::before{
  content:'';position:absolute;inset:0;
  background:repeating-linear-gradient(-45deg,transparent 0 26px,rgba(36,27,16,0.10) 26px 52px);
  pointer-events:none;
}
.agus-section > *{position:relative;z-index:1}
.agus-img-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.2rem}
.agus-img-grid img{
  width:100%;height:230px;object-fit:cover;
  border:var(--frame);box-shadow:5px 5px 0 var(--tinta);
}
.agus-img-grid img:nth-child(even){transform:translateY(1.4rem) rotate(1deg)}
.agus-img-grid img:nth-child(odd){transform:rotate(-1deg)}
.agus-text .eyebrow{color:var(--emas-light)}
.agus-text h2{color:var(--krem)}
.agus-text h2 em{color:var(--emas-light)}
.agus-text > p{line-height:1.8;margin:1.2rem 0 1.8rem;color:rgba(244,233,206,0.85);font-style:italic}
.agus-checklist{list-style:none;display:flex;flex-direction:column;gap:0.85rem;margin-bottom:2.2rem}
.agus-checklist li{display:flex;gap:0.85rem;align-items:flex-start;font-size:0.95rem;line-height:1.5}
.check-badge{
  flex-shrink:0;width:24px;height:24px;
  background:var(--emas-light);color:var(--tinta);
  border:2px solid var(--tinta);
  display:flex;align-items:center;justify-content:center;
  font-size:0.75rem;font-weight:700;
}
.agus-cta-wrap{display:flex;align-items:center;gap:1.6rem;flex-wrap:wrap}
.agus-section .btn-wa{background:var(--kertas);color:var(--tinta);box-shadow:5px 5px 0 var(--tinta)}
.social-proof{display:flex;align-items:center;gap:0.8rem}
.social-proof span{color:rgba(244,233,206,0.8)!important}
.avatar-stack{display:flex}
.avatar-mini{
  width:34px;height:34px;border-radius:50%;
  background:var(--emas);color:var(--tinta);
  border:2px solid var(--tinta);
  display:flex;align-items:center;justify-content:center;
  font-family:'Oswald',sans-serif;font-size:0.68rem;font-weight:600;
  margin-left:-8px;
}
.avatar-mini:first-child{margin-left:0}

/* ── BULK PROMO — karcis diskon ── */
.bulk-section{padding:6rem 5rem;background:var(--kertas);border-top:3px solid var(--tinta)}
.bulk-inner{display:grid;grid-template-columns:0.9fr 1.1fr;gap:4rem;align-items:center}
.bulk-text h2{margin-bottom:1.2rem}
.bulk-text p{color:var(--abu);line-height:1.8;margin-bottom:2rem;font-style:italic}
.bulk-cta{
  display:inline-flex;align-items:center;gap:0.5rem;
  font-family:'Oswald',sans-serif;font-weight:600;font-size:0.86rem;
  letter-spacing:0.1em;text-transform:uppercase;
  background:var(--merah);color:var(--krem);text-decoration:none;
  border:2px solid var(--tinta);box-shadow:var(--shadow-off);
  padding:0.95rem 1.8rem;transition:transform 0.15s,box-shadow 0.15s;
}
.bulk-cta:hover{transform:translate(3px,3px);box-shadow:2px 2px 0 var(--tinta)}
.tier-cards{display:flex;flex-direction:column;gap:0.9rem}
.tier-card{
  display:grid;grid-template-columns:80px 1fr 110px;gap:1.2rem;align-items:center;
  background:var(--krem);border:var(--frame);
  padding:1rem 1.4rem;position:relative;
}
/* lubang karcis */
.tier-card::before,.tier-card::after{
  content:'';position:absolute;top:50%;width:16px;height:16px;border-radius:50%;
  background:var(--kertas);border:3px solid var(--tinta);
  transform:translateY(-50%);
}
.tier-card::before{left:-8px}
.tier-card::after{right:-8px}
.tier-card.featured{
  background:var(--merah);color:var(--krem);
  box-shadow:var(--shadow-off);
}
.tier-card.featured .tier-label{color:var(--krem)}
.tier-card.featured .tier-discount{color:var(--emas-light)}
.tier-qty{
  font-family:'Anton',sans-serif;font-size:1.5rem;line-height:1;
  display:flex;flex-direction:column;
}
.tier-qty small{font-family:'Oswald',sans-serif;font-size:0.65rem;font-weight:500;letter-spacing:0.15em;text-transform:uppercase;opacity:0.7}
.tier-label{font-family:'Oswald',sans-serif;font-weight:500;font-size:0.85rem;letter-spacing:0.04em;color:var(--abu);margin-bottom:0.4rem}
.tier-bar-wrap{height:8px;border:2px solid var(--tinta);background:var(--kertas)}
.tier-card.featured .tier-bar-wrap{background:rgba(244,233,206,0.25)}
.tier-bar{height:100%;background:var(--merah)}
.tier-card.featured .tier-bar{background:var(--emas-light)}
.tier-discount{
  font-family:'Anton',sans-serif;font-size:1.3rem;color:var(--merah);
  text-align:right;display:flex;flex-direction:column;line-height:1.1;
}
.tier-discount small{font-family:'Oswald',sans-serif;font-size:0.62rem;font-weight:500;letter-spacing:0.1em;text-transform:uppercase;opacity:0.7}

/* ── COUNTDOWN — stempel besar ── */
.countdown-section{
  padding:6rem 5rem;text-align:center;
  background:var(--tinta);color:var(--kertas);
  border-top:3px solid var(--tinta);
  position:relative;overflow:hidden;
}
.countdown-section::before{
  content:'';position:absolute;z-index:0;
  width:160vmax;height:160vmax;left:50%;top:50%;
  transform:translate(-50%,-50%);
  background:repeating-conic-gradient(transparent 0deg 9deg,rgba(244,233,206,0.035) 9deg 18deg);
  pointer-events:none;
}
.countdown-section > *{position:relative;z-index:1}
.countdown-section .eyebrow{justify-content:center;color:var(--emas-light)}
.countdown-section h2{color:var(--kertas);margin-bottom:1.6rem}
.countdown-section h2 em{color:var(--merah-light)}
.urgency-bar{
  display:inline-block;
  font-family:'Oswald',sans-serif;font-weight:600;font-size:0.82rem;
  letter-spacing:0.12em;text-transform:uppercase;
  color:var(--tinta);background:var(--emas-light);
  border:2px solid var(--kertas);
  padding:0.6rem 1.4rem;margin-bottom:2.6rem;
  transform:rotate(-1deg);
}
.countdown-units{display:flex;justify-content:center;gap:1.4rem;flex-wrap:wrap;margin-bottom:2.8rem}
.cd-unit{
  width:110px;padding:1.2rem 0.5rem 1rem;
  background:var(--kertas);color:var(--tinta);
  border:3px double var(--merah);
  transform:rotate(-1.5deg);
}
.cd-unit:nth-child(even){transform:rotate(1.5deg)}
.cd-num{font-family:'Anton',sans-serif;font-size:2.6rem;line-height:1;display:block;color:var(--merah)}
.cd-label{font-family:'Oswald',sans-serif;font-size:0.68rem;font-weight:600;letter-spacing:0.25em;text-transform:uppercase;color:var(--abu)}
.countdown-cta{
  display:inline-flex;align-items:center;gap:0.5rem;
  font-family:'Oswald',sans-serif;font-weight:600;font-size:0.9rem;
  letter-spacing:0.1em;text-transform:uppercase;
  background:var(--merah);color:var(--krem);text-decoration:none;
  border:2px solid var(--kertas);box-shadow:6px 6px 0 rgba(244,233,206,0.25);
  padding:1rem 2.2rem;transition:transform 0.15s,box-shadow 0.15s;
}
.countdown-cta:hover{transform:translate(3px,3px);box-shadow:2px 2px 0 rgba(244,233,206,0.25)}

/* ── TESTIMONIAL ── */
.testi-section{padding:6rem 5rem;background:var(--kertas)}
.testi-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem}
.testi-card{
  background:var(--krem);border:var(--frame);box-shadow:var(--shadow-off);
  padding:1.8rem;position:relative;display:flex;flex-direction:column;gap:0.9rem;
}
.testi-card:nth-child(1){transform:rotate(-0.6deg)}
.testi-card:nth-child(2){transform:rotate(0.5deg)}
.testi-card:nth-child(3){transform:rotate(-0.4deg)}
.testi-stars{color:var(--emas);font-size:0.95rem;letter-spacing:0.15em}
.testi-quote{
  position:absolute;top:0.6rem;right:1.2rem;
  font-family:'Anton',sans-serif;font-size:4rem;line-height:1;
  color:var(--merah);opacity:0.2;
}
.testi-text{font-size:0.9rem;line-height:1.75;color:var(--abu);font-style:italic;flex:1}
.testi-footer{display:flex;align-items:center;gap:0.9rem;border-top:2px dashed var(--abu-light);padding-top:1rem}
.testi-av{
  width:42px;height:42px;border-radius:50%;flex-shrink:0;
  background:var(--merah);color:var(--krem);
  border:2px solid var(--tinta);
  display:flex;align-items:center;justify-content:center;
  font-family:'Oswald',sans-serif;font-weight:600;font-size:0.8rem;
}
.testi-name{font-family:'Oswald',sans-serif;font-weight:600;font-size:0.9rem;letter-spacing:0.03em;text-transform:uppercase;color:var(--tinta)}
.testi-meta{font-size:0.76rem;color:var(--abu-light);font-style:italic}

/* ── FINAL CTA — poster penutup ── */
.final-cta{
  padding:7rem 5rem;text-align:center;
  background:var(--merah);color:var(--krem);
  border-top:3px solid var(--tinta);
  position:relative;overflow:hidden;
}
.final-cta::before{
  content:'';position:absolute;z-index:0;
  width:160vmax;height:160vmax;left:50%;top:50%;
  transform:translate(-50%,-50%);
  background:repeating-conic-gradient(transparent 0deg 9deg,rgba(36,27,16,0.12) 9deg 18deg);
  animation:sunspin 120s linear infinite;
  pointer-events:none;
}
.final-cta > *{position:relative;z-index:1}
.final-cta .eyebrow{justify-content:center;color:var(--emas-light)}
.final-cta h2{color:var(--krem);font-size:clamp(2.6rem,5vw,4.6rem)}
.final-cta h2 em{color:var(--emas-light)}
.final-cta p{max-width:34rem;margin:1.4rem auto 2.4rem;line-height:1.8;color:rgba(244,233,206,0.85);font-style:italic}
.final-btn-group{display:flex;justify-content:center;gap:1.2rem;flex-wrap:wrap}
.btn-white-large,.btn-ghost-large{
  font-family:'Oswald',sans-serif;font-weight:600;font-size:0.9rem;
  letter-spacing:0.1em;text-transform:uppercase;text-decoration:none;
  padding:1.05rem 2.2rem;border:2px solid var(--tinta);
  transition:transform 0.15s,box-shadow 0.15s;
}
.btn-white-large{background:var(--kertas);color:var(--tinta);box-shadow:var(--shadow-off)}
.btn-white-large:hover{transform:translate(3px,3px);box-shadow:2px 2px 0 var(--tinta)}
.btn-ghost-large{background:transparent;color:var(--krem);border-color:var(--krem)}
.btn-ghost-large:hover{background:rgba(244,233,206,0.12)}

/* ── FOOTER ── */
footer{background:var(--tinta);color:var(--kertas);border-top:3px solid var(--tinta)}
.footer-inner{
  display:flex;flex-direction:column;align-items:center;gap:1.2rem;
  padding:3.5rem 2rem 2rem;
}
.footer-logo{font-family:'Anton',sans-serif;font-size:2rem;letter-spacing:0.15em}
.footer-logo b{color:var(--merah-light);font-weight:400}
.footer-socials{display:flex;gap:0.8rem}
.soc-btn{
  width:42px;height:42px;display:flex;align-items:center;justify-content:center;
  font-family:'Oswald',sans-serif;font-weight:600;font-size:0.75rem;
  color:var(--kertas);text-decoration:none;
  border:2px solid rgba(244,233,206,0.4);
  transition:border-color 0.2s,background 0.2s;
}
.soc-btn:hover{border-color:var(--emas-light);background:rgba(214,169,70,0.15)}
.footer-bottom{
  display:flex;align-items:center;justify-content:space-between;gap:1rem;
  padding:1.2rem 3rem;border-top:2px dashed rgba(244,233,206,0.25);
  font-size:0.78rem;color:rgba(244,233,206,0.55);flex-wrap:wrap;
}
.made-in{display:flex;align-items:center;gap:0.6rem}
.mini-flag{width:22px;border:1.5px solid rgba(244,233,206,0.5)}
.mf-r{height:6px;background:var(--merah-light)}
.mf-w{height:6px;background:var(--kertas)}

/* ── STICKY WA ── */
.wa-sticky{
  position:fixed;right:1.5rem;bottom:1.5rem;z-index:300;
  display:flex;flex-direction:column;align-items:flex-end;gap:0.4rem;
}
.wa-sticky-badge{
  font-family:'Oswald',sans-serif;font-weight:600;font-size:0.62rem;
  letter-spacing:0.14em;text-transform:uppercase;
  background:var(--emas-light);color:var(--tinta);
  border:2px solid var(--tinta);
  padding:0.25rem 0.65rem;transform:rotate(-2deg);
  animation:wiggle 2.4s ease-in-out infinite;
}
@keyframes wiggle{0%,100%{transform:rotate(-2deg)}50%{transform:rotate(2deg)}}
.wa-sticky-btn{
  display:flex;align-items:center;gap:0.55rem;
  font-family:'Oswald',sans-serif;font-weight:600;font-size:0.82rem;
  letter-spacing:0.06em;text-transform:uppercase;
  background:var(--merah);color:var(--krem);text-decoration:none;
  border:2px solid var(--tinta);box-shadow:4px 4px 0 var(--tinta);
  padding:0.8rem 1.3rem;
  transition:transform 0.15s,box-shadow 0.15s;
}
.wa-sticky-btn:hover{transform:translate(2px,2px);box-shadow:2px 2px 0 var(--tinta)}

/* ── ANIMASI FADE-UP ── */
.fade-up{opacity:0;transform:translateY(24px);animation:fadeUp 0.7s ease forwards}
.d1{animation-delay:0.12s}.d2{animation-delay:0.24s}.d3{animation-delay:0.36s}.d4{animation-delay:0.48s}
@keyframes fadeUp{to{opacity:1;transform:translateY(0)}}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
  .fade-up{opacity:1;transform:none}
}

/* ── RESPONSIVE ── */
@media (max-width:1024px){
  .hero{grid-template-columns:1fr}
  .hero-right{border-left:none;border-top:3px solid var(--tinta);grid-auto-rows:auto}
  .mosaic-img{min-height:220px;height:260px}
  .mosaic-span2{min-height:260px}
  .why-section,.agus-section,.bulk-inner{grid-template-columns:1fr}
  .outfit-grid,.testi-grid{grid-template-columns:repeat(2,1fr)}
  .why-section,.outfit-section,.bulk-section,.countdown-section,.testi-section,.final-cta,.agus-section{padding:4.5rem 2.5rem}
  .why-badge{left:0}
}
@media (max-width:640px){
  nav{padding:0.75rem 1.2rem}
  .nav-pill{font-size:0.68rem;padding:0.45rem 0.9rem}
  .hero-left{padding:3.5rem 1.5rem}
  .hero-left::after{right:1rem;top:5rem;font-size:0.75rem;padding:0.45rem 0.7rem}
  .hero-right{padding:1.5rem;gap:0.9rem}
  .trust-bar{grid-template-columns:1fr 1fr}
  .trust-item:nth-child(2n){border-right:none}
  .trust-item{border-bottom:2px dashed var(--abu-light)}
  .outfit-grid,.testi-grid{grid-template-columns:1fr}
  .why-section,.outfit-section,.bulk-section,.countdown-section,.testi-section,.final-cta,.agus-section{padding:3.5rem 1.2rem}
  .agus-img-grid img{height:170px}
  .tier-card{grid-template-columns:60px 1fr 90px;gap:0.8rem;padding:0.9rem 1rem}
  .tier-qty{font-size:1.2rem}
  .tier-discount{font-size:1.05rem}
  .cd-unit{width:76px;padding:0.9rem 0.3rem 0.7rem}
  .cd-num{font-size:1.8rem}
  .wa-sticky{right:1rem;bottom:1rem}
  .why-badge{position:static;transform:none;margin-top:1rem;max-width:none}
  .section-head{flex-direction:column;align-items:flex-start}
}