/* ==========================================================================
   LOKA BUMI - Design tokens
   ========================================================================== */
@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,300;9..144,400;9..144,500;9..144,600;9..144,700&family=Manrope:wght@400;500;600;700;800&display=swap');

:root{
  --forest-950:#122019;
  --forest-900:#173026;
  --forest-800:#1f4636;
  --forest-700:#2a5c45;
  --sage-500:#7c9a5c;
  --sage-300:#a9c084;
  --gold-600:#b6863a;
  --gold-500:#c79a45;
  --gold-300:#e3c37a;
  --earth-700:#6b4a2f;
  --cream-100:#fbf7ee;
  --cream-200:#f3ecdc;
  --ink:#182420;
  --paper:#fffdf8;

  --display: 'Fraunces', serif;
  --body: 'Manrope', sans-serif;

  --maxw: 1180px;
  --edge: clamp(20px, 5vw, 64px);
  --radius: 18px;
}

*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  *{animation-duration:0.001ms !important; animation-iteration-count:1 !important; transition-duration:0.001ms !important;}
}

body{
  margin:0;
  font-family:var(--body);
  color:var(--ink);
  background:var(--cream-100);
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}

img{max-width:100%; display:block;}
a{color:inherit;}
h1,h2,h3,h4{font-family:var(--display); margin:0; font-weight:600; line-height:1.05;}
p{margin:0;}
ul{margin:0; padding:0; list-style:none;}
button{font-family:inherit;}

.wrap{max-width:var(--maxw); margin:0 auto; padding:0 var(--edge);}

.eyebrow{
  font-family:var(--body);
  font-weight:700;
  font-size:.72rem;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:var(--gold-600);
  display:inline-flex;
  align-items:center;
  gap:.5em;
}
.eyebrow::before{
  content:"";
  width:5px; height:5px;
  border-radius:50%;
  background:var(--gold-500);
  display:inline-block;
}

:focus-visible{
  outline:2.5px solid var(--gold-500);
  outline-offset:3px;
  border-radius:4px;
}

/* ==========================================================================
   Growth vine - signature scroll element
   ========================================================================== */
.vine-rail{
  position:fixed;
  left:18px;
  top:0;
  bottom:0;
  width:34px;
  z-index:40;
  display:none;
  pointer-events:none;
}
@media (min-width:1080px){ .vine-rail{display:block;} }
.vine-rail svg{height:100%; width:100%;}
.vine-track{
  fill:none;
  stroke:rgba(31,70,54,.18);
  stroke-width:2;
  stroke-linecap:round;
}
.vine-fill{
  fill:none;
  stroke:var(--sage-500);
  stroke-width:2;
  stroke-linecap:round;
  stroke-dasharray:2400;
  stroke-dashoffset:2400;
  transition:stroke-dashoffset .08s linear;
}
.vine-leaf{
  fill:var(--gold-500);
  opacity:0;
  transform-origin:center;
  transition:opacity .4s ease, transform .4s ease;
}
.vine-leaf.lit{ opacity:1; transform:scale(1);}

/* ==========================================================================
   Launch countdown banner
   ========================================================================== */
.launch-banner{
  position:sticky; top:78px; z-index:45;
  background:linear-gradient(90deg, var(--forest-950), var(--forest-800));
  border-bottom:1px solid rgba(199,154,69,.3);
  box-shadow:0 8px 18px -12px rgba(23,48,38,.5);
}
.launch-inner{
  display:flex; flex-wrap:wrap; align-items:center; justify-content:center;
  gap:.8rem 1.6rem;
  padding:.7rem var(--edge);
}
.launch-label{
  color:var(--cream-100); font-size:.82rem; font-weight:700;
  letter-spacing:.02em;
}
.countdown{display:flex; align-items:center; gap:.5rem;}
.cd-unit{
  display:flex; flex-direction:column; align-items:center;
  background:rgba(251,247,238,.08);
  border:1px solid rgba(199,154,69,.35);
  border-radius:8px;
  min-width:44px;
  padding:.3rem .4rem;
}
.cd-unit span{
  font-family:var(--display); font-weight:600; font-size:1rem; color:var(--gold-300); line-height:1;
}
.cd-unit small{
  margin-top:.15rem; font-size:.58rem; letter-spacing:.05em; text-transform:uppercase; color:var(--cream-200); opacity:.7;
}

/* ==========================================================================
   Header
   ========================================================================== */
.site-header{
  position:sticky; top:0; z-index:50;
  background:rgba(251,247,238,.86);
  backdrop-filter:blur(10px);
  border-bottom:1px solid rgba(31,70,54,.1);
}
.site-header .wrap{
  display:flex; align-items:center; justify-content:space-between;
  height:78px;
}
.brand{display:flex; align-items:center; gap:.65rem; text-decoration:none;}
.brand img{height:44px; width:auto;}
.brand-text{font-family:var(--display); font-weight:600; font-size:1.18rem; color:var(--forest-900); letter-spacing:.01em;}
.brand-text small{display:block; font-family:var(--body); font-weight:700; font-size:.58rem; letter-spacing:.07em; color:var(--gold-600); text-transform:uppercase;}

.nav-links{display:none; align-items:center; gap:2rem;}
@media (min-width:940px){ .nav-links{display:flex;} }
.nav-links a{
  text-decoration:none; font-size:.88rem; font-weight:600; color:var(--forest-900);
  position:relative; padding:.3rem 0;
}
.nav-links a::after{
  content:""; position:absolute; left:0; right:0; bottom:-2px; height:2px;
  background:var(--gold-500); transform:scaleX(0); transform-origin:right;
  transition:transform .3s ease;
}
.nav-links a:hover::after{transform:scaleX(1); transform-origin:left;}

.nav-cta{
  display:none;
  align-items:center; gap:.5rem;
  background:var(--forest-900); color:var(--cream-100);
  padding:.68rem 1.25rem; border-radius:999px;
  text-decoration:none; font-weight:700; font-size:.84rem;
  transition:background .25s ease, transform .25s ease;
}
@media (min-width:600px){ .nav-cta{display:inline-flex;} }
.nav-cta:hover{background:var(--forest-800); transform:translateY(-1px);}

.nav-toggle{
  display:inline-flex; flex-direction:column; align-items:center; justify-content:center; gap:4px;
  background:none; border:1.5px solid var(--forest-900);
  border-radius:10px; padding:.6rem .65rem; cursor:pointer;
}
@media (min-width:940px){ .nav-toggle{display:none;} }
.nav-toggle span{display:block; width:19px; height:2px; border-radius:1px; background:var(--forest-900);}

.mobile-menu{
  display:none; flex-direction:column; gap:0; background:var(--paper);
  border-bottom:1px solid rgba(31,70,54,.1);
}
.mobile-menu.open{display:flex;}
.mobile-menu a{
  padding:1rem var(--edge); text-decoration:none; color:var(--forest-900);
  font-weight:600; border-top:1px solid rgba(31,70,54,.08);
}

/* ==========================================================================
   Hero
   ========================================================================== */
.hero{
  position:relative;
  padding:clamp(56px,9vw,110px) 0 clamp(64px,8vw,96px);
  overflow:hidden;
  background:
    radial-gradient(ellipse 700px 500px at 82% -6%, rgba(124,154,92,.22), transparent 60%),
    linear-gradient(180deg, var(--cream-100), var(--cream-200));
}
.hero .wrap{
  display:grid; grid-template-columns:1fr; gap:3rem; align-items:center;
}
@media (min-width:960px){ .hero .wrap{grid-template-columns:1.15fr .85fr;} }

.hero-copy .eyebrow{margin-bottom:1.4rem;}
.hero h1{
  font-size:clamp(2.4rem, 5.6vw, 4.1rem);
  color:var(--forest-950);
  letter-spacing:-.01em;
}
.hero h1 em{
  font-style:italic; color:var(--sage-500);
  background:linear-gradient(180deg, transparent 62%, var(--gold-300) 62%);
}
.hero .lede{
  margin-top:1.6rem; max-width:52ch;
  font-size:1.08rem; line-height:1.7; color:var(--forest-900); opacity:.86;
}
.hero .origin{
  margin-top:1.1rem; max-width:54ch;
  font-size:.94rem; line-height:1.7; color:var(--earth-700);
}
.cta-row{display:flex; flex-wrap:wrap; gap:.9rem; margin-top:2.2rem;}
.btn{
  display:inline-flex; align-items:center; gap:.55rem;
  padding:.95rem 1.55rem; border-radius:999px;
  font-weight:700; font-size:.92rem; text-decoration:none;
  border:1.5px solid transparent; cursor:pointer;
  transition:transform .25s ease, box-shadow .25s ease, background .25s ease, color .25s ease;
}
.btn-primary{background:var(--forest-900); color:var(--cream-100); box-shadow:0 10px 24px -12px rgba(23,48,38,.55);}
.btn-primary:hover{transform:translateY(-2px); box-shadow:0 16px 30px -12px rgba(23,48,38,.6);}
.btn-gold{background:var(--gold-500); color:var(--forest-950);}
.btn-gold:hover{transform:translateY(-2px); background:var(--gold-300);}
.btn-ghost{background:transparent; border-color:var(--forest-800); color:var(--forest-900);}
.btn-ghost:hover{background:var(--forest-900); color:var(--cream-100);}

.hero-mark{
  position:relative; display:flex; align-items:center; justify-content:center;
}
.hero-mark .ring{
  position:relative; width:min(340px,80vw); aspect-ratio:1;
  border-radius:50%;
  background:var(--paper);
  border:1px solid rgba(31,70,54,.14);
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 40px 70px -35px rgba(23,48,38,.4);
}
.hero-mark .ring::before{
  content:""; position:absolute; inset:-14px; border-radius:50%;
  border:1px dashed rgba(199,154,69,.55);
  animation:spin 46s linear infinite;
}
@media (prefers-reduced-motion: reduce){ .hero-mark .ring::before{animation:none;} }
.hero-mark img{width:86%; max-width:92%; height:auto;}
@keyframes spin{to{transform:rotate(360deg);}}
.hero-tag{
  position:absolute; bottom:-14px; left:50%; transform:translateX(-50%);
  background:var(--forest-900); color:var(--cream-100);
  padding:.6rem 1.2rem; border-radius:999px; font-size:.78rem; font-weight:700;
  white-space:nowrap; letter-spacing:.03em;
  box-shadow:0 12px 24px -12px rgba(23,48,38,.6);
}

.trust-strip{border-top:1px solid rgba(31,70,54,.12); margin-top:clamp(48px,6vw,72px); padding-top:1.8rem;}
.trust-strip ul{
  display:flex; flex-wrap:wrap; gap:.6rem 1rem;
}
.trust-strip li{
  font-size:.82rem; font-weight:700; color:var(--forest-800);
  background:rgba(124,154,92,.14); padding:.5rem 1rem; border-radius:999px;
}

/* ==========================================================================
   Section shell
   ========================================================================== */
section{padding:clamp(64px,8vw,108px) 0;}
.section-head{max-width:640px; margin-bottom:clamp(36px,5vw,56px);}
.section-head h2{
  font-size:clamp(1.9rem, 3.4vw, 2.7rem);
  color:var(--forest-950); margin-top:.9rem;
}
.section-head p{margin-top:1.1rem; font-size:1.02rem; line-height:1.7; color:var(--forest-900); opacity:.82;}

.band-dark{background:var(--forest-950); color:var(--cream-100);}
.band-dark .section-head h2{color:var(--cream-100);}
.band-dark .section-head p{color:var(--cream-200); opacity:.75;}
.band-dark .eyebrow{color:var(--gold-300);}

/* ==========================================================================
   Why different - feature grid
   ========================================================================== */
.feature-grid{
  display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:1.4rem;
}
.feature-card{
  background:var(--paper); border:1px solid rgba(31,70,54,.1);
  border-radius:var(--radius); padding:1.9rem 1.7rem;
  transition:transform .3s ease, box-shadow .3s ease, border-color .3s ease;
}
.feature-card:hover{transform:translateY(-4px); box-shadow:0 24px 40px -28px rgba(23,48,38,.35); border-color:rgba(124,154,92,.4);}
.feature-icon{
  width:48px; height:48px; border-radius:12px; background:var(--cream-200);
  display:flex; align-items:center; justify-content:center; font-size:1.35rem; margin-bottom:1.1rem;
}
.feature-card h3{font-size:1.12rem; color:var(--forest-950); font-weight:600;}
.feature-card p{margin-top:.6rem; font-size:.92rem; line-height:1.6; color:var(--forest-900); opacity:.78;}

/* ==========================================================================
   Story section - editorial storytelling, sits right after the hero
   ========================================================================== */
.story-section .story-lead{
  max-width:640px; margin:0 auto 2.6rem; text-align:center;
}
.story-section .story-lead .eyebrow{justify-content:center; color:var(--gold-300);}
.story-section .story-lead h2{
  margin-top:1rem; color:var(--cream-100);
  font-size:clamp(2rem,4vw,2.9rem);
}
.story-body{
  max-width:700px; margin:0 auto;
}
.story-body p{
  font-size:1.05rem; line-height:1.85; color:var(--cream-200); opacity:.88;
}
.story-body p + p{margin-top:1.25rem;}
.story-body strong{color:var(--cream-100); font-weight:700;}
.story-body p.drop::first-letter{
  font-family:var(--display); font-weight:600; font-size:3.6rem; line-height:.75;
  float:left; padding:.08em .12em 0 0; color:var(--gold-300);
}
.pull-quote{
  margin:2.2rem 0; padding:1.6rem 0 1.6rem 1.7rem;
  border-left:2px solid var(--gold-500);
  font-family:var(--display); font-style:italic; font-weight:500;
  font-size:clamp(1.25rem,2.6vw,1.55rem); line-height:1.5; color:var(--cream-100);
}

/* ==========================================================================
   Pillars
   ========================================================================== */
.pillar-grid{
  display:grid; grid-template-columns:1fr; gap:1.2rem;
}
@media (min-width:720px){ .pillar-grid{grid-template-columns:repeat(2,1fr);} }
@media (min-width:1080px){ .pillar-grid{grid-template-columns:repeat(3,1fr);} }

.pillar-card{
  position:relative;
  border-radius:var(--radius);
  padding:2rem 1.8rem 1.9rem;
  background:var(--paper);
  border:1px solid rgba(31,70,54,.1);
  border-top:3px solid var(--pillar-color, var(--sage-500));
  transition:transform .3s ease, box-shadow .3s ease;
}
.pillar-card:hover{transform:translateY(-5px); box-shadow:0 26px 44px -30px rgba(23,48,38,.4);}
.pillar-mark{font-size:1.7rem;}
.pillar-card h3{margin-top:.9rem; font-size:1.28rem; color:var(--forest-950);}
.pillar-card .tagline{display:block; margin-top:.25rem; font-size:.82rem; font-weight:700; color:var(--pillar-color, var(--sage-500));}
.pillar-card ul{margin-top:1.1rem; display:flex; flex-wrap:wrap; gap:.4rem;}
.pillar-card li{
  font-size:.78rem; font-weight:600; color:var(--forest-900);
  background:var(--cream-200); padding:.35rem .7rem; border-radius:999px;
}

/* ==========================================================================
   Featured products
   ========================================================================== */
.product-grid{
  display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:1.3rem;
}
.product-card{
  border-radius:var(--radius); overflow:hidden;
  background:var(--paper); border:1px solid rgba(31,70,54,.1);
  transition:transform .3s ease, box-shadow .3s ease;
}
.product-card:hover{transform:translateY(-5px); box-shadow:0 24px 40px -28px rgba(23,48,38,.35);}
.product-photo{
  aspect-ratio:4/3;
  background:
    repeating-linear-gradient(135deg, rgba(124,154,92,.16) 0 14px, rgba(199,154,69,.12) 14px 28px);
  display:flex; align-items:center; justify-content:center;
  color:var(--forest-800); font-size:1.7rem;
  border-bottom:1px solid rgba(31,70,54,.1);
}
.product-body{padding:1.15rem 1.25rem 1.35rem;}
.product-body .star{color:var(--gold-500); font-size:.78rem; letter-spacing:.1em;}
.product-body h3{margin-top:.4rem; font-size:1.02rem; color:var(--forest-950);}
.product-body p{margin-top:.35rem; font-size:.82rem; color:var(--forest-900); opacity:.7;}
.product-body .product-brand{margin-top:.2rem; font-size:.72rem; font-weight:800; color:var(--forest-800); opacity:.85;}
.product-link{
  margin-top:.9rem; display:inline-flex; align-items:center; gap:.4rem;
  font-size:.8rem; font-weight:700; color:var(--forest-800); text-decoration:none;
}
.product-link:hover{color:var(--gold-600);}

.photo-note{
  margin-top:1.6rem; font-size:.82rem; color:var(--forest-900); opacity:.6; font-style:italic;
}

/* ==========================================================================
   Shop ways
   ========================================================================== */
.shop-grid{
  display:grid; grid-template-columns:1fr; gap:1.3rem;
}
@media (min-width:860px){ .shop-grid{grid-template-columns:repeat(3,1fr);} }
.shop-card{
  border-radius:var(--radius); padding:2rem 1.8rem;
  background:var(--paper); border:1px solid rgba(31,70,54,.1);
  display:flex; flex-direction:column; height:100%;
}
.shop-icon{font-size:1.8rem;}
.shop-card h3{margin-top:1rem; font-size:1.2rem; color:var(--forest-950);}
.shop-card p{margin-top:.5rem; font-size:.9rem; line-height:1.6; color:var(--forest-900); opacity:.78;}
.shop-card ul{margin-top:1rem; display:flex; flex-direction:column; gap:.45rem;}
.shop-card li{font-size:.84rem; color:var(--forest-900); opacity:.85; padding-left:1.1rem; position:relative;}
.shop-card li::before{content:"-"; position:absolute; left:0; color:var(--sage-500);}
.shop-links{margin-top:1.4rem; display:flex; flex-wrap:wrap; gap:.6rem;}
.chip-link{
  display:inline-flex; align-items:center; gap:.4rem;
  padding:.55rem 1rem; border-radius:999px; font-size:.8rem; font-weight:700;
  text-decoration:none; border:1.5px solid var(--forest-800); color:var(--forest-900);
  transition:background .25s ease, color .25s ease;
}
.chip-link:hover{background:var(--forest-900); color:var(--cream-100);}
.chip-link.wa{border-color:var(--sage-500); color:var(--forest-800);}
.chip-link.wa:hover{background:var(--sage-500); color:var(--forest-950);}
.shop-card.reseller{background:linear-gradient(165deg, var(--forest-900), var(--forest-950)); color:var(--cream-100); border-color:transparent;}
.shop-card.reseller h3{color:var(--cream-100);}
.shop-card.reseller p{color:var(--cream-200); opacity:.8;}
.shop-card.reseller li{color:var(--cream-200); opacity:.9;}
.shop-card.reseller li::before{color:var(--gold-300);}

/* ==========================================================================
   Programs
   ========================================================================== */
.program-list{
  display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:1rem;
}
.program-item{
  border:1px solid rgba(251,247,238,.18); border-radius:14px;
  padding:1.3rem 1.2rem; font-weight:600; font-size:.94rem;
  display:flex; align-items:center; gap:.7rem;
}
.program-item::before{content:"◆"; color:var(--gold-300); font-size:.7rem;}

/* ==========================================================================
   PLN support banner
   ========================================================================== */
.pln-banner{
  border-radius:24px; padding:clamp(2rem,4vw,3.2rem);
  background:linear-gradient(120deg, var(--cream-200), var(--cream-100));
  border:1px solid rgba(199,154,69,.35);
  display:grid; grid-template-columns:1fr; gap:1.6rem; align-items:center;
}
@media (min-width:860px){ .pln-banner{grid-template-columns:auto 1fr;} }
 .pln-logo-wrap{
  width:clamp(150px, 18vw, 190px);
  min-height:112px;
  padding:1rem 1.15rem;
  border-radius:20px;
  background:#fff;
  border:1px solid rgba(31,70,54,.12);
  box-shadow:0 10px 26px rgba(31,70,54,.08);
  display:flex;
  align-items:center;
  justify-content:center;
}
.pln-logo{
  display:block;
  width:100%;
  height:auto;
  max-height:92px;
  object-fit:contain;
}
.pln-banner p{font-size:.98rem; line-height:1.75; color:var(--forest-900); opacity:.85;}

/* ==========================================================================
   Gallery
   ========================================================================== */
.gallery-grid{
  display:grid; grid-template-columns:repeat(2,1fr); gap:.9rem;
}
@media (min-width:700px){ .gallery-grid{grid-template-columns:repeat(4,1fr);} }
.gallery-tile{
  aspect-ratio:1; border-radius:14px;
  background:
    repeating-linear-gradient(45deg, rgba(124,154,92,.14) 0 10px, rgba(199,154,69,.1) 10px 20px);
  border:1px dashed rgba(31,70,54,.25);
  display:flex; align-items:center; justify-content:center;
  text-align:center; padding:1rem;
  font-size:.76rem; font-weight:700; color:var(--forest-800); opacity:.75;
}

/* ==========================================================================
   Story / closing statement
   ========================================================================== */
.closing{
  text-align:center; max-width:760px; margin:0 auto;
}
.closing h2{font-size:clamp(1.8rem,3.6vw,2.5rem); color:var(--cream-100);}
.closing p{margin-top:1.4rem; font-size:1.06rem; line-height:1.85; color:var(--cream-200); opacity:.85;}
.closing strong{color:var(--cream-100);}

/* ==========================================================================
   Contact
   ========================================================================== */
.contact-grid{
  display:grid; grid-template-columns:1fr; gap:2.5rem;
}
@media (min-width:900px){ .contact-grid{grid-template-columns:1fr 1fr;} }
.contact-card{
  background:var(--paper); border:1px solid rgba(31,70,54,.1); border-radius:var(--radius);
  padding:2.2rem;
}
.contact-card h3{font-size:1.15rem; color:var(--forest-950);}
.wa-block{
  margin-top:1.3rem; display:flex; align-items:center; gap:1rem;
  padding:1.1rem 1.3rem; border-radius:14px; background:var(--cream-200);
}
.wa-block .wa-ico{
  width:44px; height:44px; border-radius:50%; background:var(--sage-500);
  display:flex; align-items:center; justify-content:center; color:var(--forest-950); font-size:1.2rem; flex:none;
}
.wa-block a{font-weight:800; text-decoration:none; color:var(--forest-950); font-size:1.02rem;}
.wa-block span{display:block; font-size:.76rem; color:var(--forest-900); opacity:.65; margin-top:.15rem;}

.social-list{margin-top:1.3rem; display:flex; flex-wrap:wrap; gap:.6rem;}
.social-list a{
  padding:.6rem 1.05rem; border-radius:999px; border:1.5px solid rgba(31,70,54,.2);
  text-decoration:none; font-size:.84rem; font-weight:700; color:var(--forest-900);
  transition:border-color .25s ease, color .25s ease;
}
.social-list a:hover{border-color:var(--gold-500); color:var(--gold-600);}

.contact-note{font-size:.86rem; line-height:1.7; color:var(--forest-900); opacity:.75;}
.contact-note + .contact-note{margin-top:.9rem;}

/* ==========================================================================
   Footer
   ========================================================================== */
footer{
  background:var(--forest-950); color:var(--cream-200);
  padding:clamp(48px,6vw,72px) 0 28px;
}
.footer-top{
  display:flex; flex-wrap:wrap; justify-content:space-between; gap:2rem;
  padding-bottom:2.2rem; border-bottom:1px solid rgba(251,247,238,.14);
}
.footer-brand{max-width:360px;}
.footer-brand .brand-text{color:var(--cream-100);}
.footer-brand p{margin-top:1rem; font-size:.9rem; line-height:1.7; opacity:.72;}
.footer-support{
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:.55rem; min-width:210px; text-align:center;
}
.footer-support-label{
  font-size:.72rem; letter-spacing:.14em; text-transform:uppercase;
  color:var(--cream-200); opacity:.72;
}
.footer-pln-logo{
  width:190px; max-width:100%; padding:.7rem 1rem;
  background:#fff; border-radius:14px;
  border:1px solid rgba(251,247,238,.28);
  box-shadow:0 10px 24px rgba(0,0,0,.18);
  display:flex; align-items:center; justify-content:center;
}
.footer-pln-logo img{display:block; width:100%; height:auto; max-height:92px; object-fit:contain;}
.footer-support-note{font-size:.72rem; color:var(--cream-200); opacity:.58;}
.footer-quote{font-family:var(--display); font-style:italic; font-size:1.05rem; opacity:.85; max-width:300px;}
@media (max-width:760px){
  .footer-top{align-items:center; text-align:center;}
  .footer-brand{max-width:420px; width:100%;}
  .footer-support{width:100%; order:2; margin:.2rem 0;}
  .footer-quote{order:3; max-width:360px;}
}

.footer-bottom{
  padding-top:1.6rem; display:flex; flex-wrap:wrap; gap:1rem; justify-content:space-between;
  font-size:.78rem; opacity:.55;
}

/* whatsapp floating button */
.wa-float{
  position:fixed; right:20px; bottom:20px; z-index:60;
  width:58px; height:58px; border-radius:50%;
  background:var(--sage-500); color:var(--forest-950);
  display:flex; align-items:center; justify-content:center;
  text-decoration:none; font-size:1.5rem;
  box-shadow:0 14px 28px -12px rgba(23,48,38,.55);
  transition:transform .25s ease;
}
.wa-float:hover{transform:scale(1.08);}

.reveal{opacity:0; transform:translateY(18px); transition:opacity .7s ease, transform .7s ease;}
.reveal.in{opacity:1; transform:translateY(0);}

/* ==========================================================================
   Dedicated 28-photo gallery
   ========================================================================== */
.gallery-intro{
  display:flex; flex-wrap:wrap; gap:.75rem; margin:1.7rem 0 1.2rem;
}
.gallery-intro>div{
  min-width:145px; flex:1; padding:1rem 1.1rem; border:1px solid rgba(31,70,54,.11);
  border-radius:14px; background:rgba(255,255,255,.65);
}
.gallery-intro strong{display:block; font-family:var(--display); color:var(--forest-950); font-size:1.25rem;}
.gallery-intro span{display:block; margin-top:.18rem; color:var(--muted); font-size:.65rem; letter-spacing:.03em;}

.gallery-grid{
  display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.85rem;
}
.gallery-item{
  position:relative; display:block; width:100%; padding:0; border:0; border-radius:16px;
  overflow:hidden; background:#dfe6dc; cursor:zoom-in; aspect-ratio:1/1;
  box-shadow:0 7px 24px rgba(23,48,38,.08);
}
.gallery-item:nth-child(3n+1){aspect-ratio:4/5;}
.gallery-item:nth-child(5n){aspect-ratio:5/4;}
.gallery-item img{
  width:100%; height:100%; display:block; object-fit:cover;
  transition:transform .55s cubic-bezier(.2,.7,.2,1), filter .35s ease;
}
.gallery-item:hover img,.gallery-item:focus-visible img{transform:scale(1.045); filter:saturate(1.06);}
.gallery-overlay{
  position:absolute; inset:auto .55rem .55rem .55rem; padding:.65rem .72rem;
  border-radius:11px; color:#fff; text-align:left;
  background:linear-gradient(180deg,transparent,rgba(13,30,22,.78));
  padding-top:2.2rem; pointer-events:none;
}
.gallery-overlay strong{display:block; font-size:.65rem; letter-spacing:.09em;}
.gallery-overlay small{display:block; margin-top:.12rem; font-size:.57rem; opacity:.82;}
.gallery-item:focus-visible{outline:3px solid var(--gold-300); outline-offset:3px;}

.gallery-lightbox{
  position:fixed; inset:0; z-index:100; display:none; align-items:center; justify-content:center;
  padding:4.5rem 4rem; background:rgba(8,18,13,.94); backdrop-filter:blur(8px);
}
.gallery-lightbox.open{display:flex;}
.gallery-lightbox figure{max-width:min(1100px,92vw); max-height:88vh; margin:0; text-align:center;}
.gallery-lightbox figure img{
  max-width:100%; max-height:78vh; width:auto; height:auto; object-fit:contain;
  border-radius:14px; box-shadow:0 20px 70px rgba(0,0,0,.35);
}
.gallery-lightbox figcaption{margin-top:.8rem; color:rgba(255,255,255,.75); font-size:.7rem;}
.gallery-close,.gallery-prev,.gallery-next{
  position:absolute; z-index:2; border:1px solid rgba(255,255,255,.2); background:rgba(255,255,255,.08);
  color:#fff; cursor:pointer; width:46px; height:46px; border-radius:50%; font-size:1.8rem;
  display:flex; align-items:center; justify-content:center; transition:.2s ease;
}
.gallery-close:hover,.gallery-prev:hover,.gallery-next:hover{background:rgba(255,255,255,.18);}
.gallery-close{top:1.25rem; right:1.25rem;}
.gallery-prev{left:1.25rem; top:50%; transform:translateY(-50%);}
.gallery-next{right:1.25rem; top:50%; transform:translateY(-50%);}

@media (min-width:700px){
  .gallery-grid{grid-template-columns:repeat(4,minmax(0,1fr)); gap:1rem;}
}
@media (max-width:600px){
  .gallery-lightbox{padding:4rem 1rem 2rem;}
  .gallery-prev{left:.5rem;}.gallery-next{right:.5rem;}
  .gallery-close{top:.65rem;right:.65rem;}
  .gallery-overlay{opacity:1;}
}


/* ============ REFERRAL UMKM ============ */
.referral-section{
  background:
    radial-gradient(circle at 10% 10%, rgba(211,166,54,.10), transparent 32%),
    linear-gradient(180deg, #f7f3e8 0%, #fffdf7 100%);
  padding: 6.5rem 0;
}
.referral-grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0,1fr));
  gap:1.25rem;
  margin-top:2rem;
}
.referral-card{
  position:relative;
  background:rgba(255,255,255,.88);
  border:1px solid rgba(31,70,54,.12);
  border-radius:24px;
  padding:2rem;
  box-shadow:0 16px 45px rgba(31,70,54,.07);
}
.referral-number{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:42px;
  height:42px;
  border-radius:50%;
  background:#1f4636;
  color:#fff;
  font-weight:800;
  letter-spacing:.06em;
  margin-bottom:1rem;
}
.referral-card h3{margin:.1rem 0 .65rem;color:#173a2c;}
.referral-card p{color:#5d685f;line-height:1.75;}
.referral-form{margin-top:1.35rem;}
.referral-form label{display:block;font-weight:700;color:#244838;margin-bottom:.5rem;}
.referral-input-row{display:flex;gap:.6rem;}
.referral-input-row input,
.referral-link-box input{
  min-width:0;
  width:100%;
  border:1px solid rgba(31,70,54,.18);
  border-radius:13px;
  padding:.85rem .95rem;
  background:#fff;
  color:#173a2c;
  outline:none;
}
.referral-input-row input:focus,
.referral-link-box input:focus{border-color:#b99432;box-shadow:0 0 0 3px rgba(185,148,50,.12);}
.referral-form small{display:block;margin-top:.5rem;color:#7a817b;}
.referral-result[hidden]{display:none;}
.referral-link-box{display:flex;gap:.55rem;margin-top:1rem;}
.referral-actions{display:flex;flex-wrap:wrap;gap:.55rem;margin-top:.8rem;}
.referral-status{min-height:1.4em;margin:.7rem 0 0!important;color:#1f4636!important;font-weight:700;}
.referral-pill{
  display:inline-flex;
  margin-top:1rem;
  padding:.6rem .8rem;
  border-radius:999px;
  background:#edf5ef;
  color:#1f4636;
  font-size:.86rem;
  font-weight:700;
}
.referral-note{
  margin-top:1.4rem;
  padding:1rem 1.15rem;
  border-left:4px solid #c6a33b;
  border-radius:12px;
  background:rgba(255,255,255,.72);
  color:#5d685f;
  line-height:1.7;
}
.referral-note code{
  padding:.15rem .35rem;
  border-radius:5px;
  background:#edf1eb;
  color:#1f4636;
}
@media (max-width:900px){
  .referral-grid{grid-template-columns:1fr;}
}
@media (max-width:560px){
  .referral-input-row,
  .referral-link-box{flex-direction:column;}
  .referral-card{padding:1.4rem;}
}


/* V5 referral presentation polish - screenshot-inspired, mobile-first */
.referral-section .section-head{max-width:900px;}
.referral-section .section-head h2{max-width:760px;}
.referral-section .section-head p{max-width:820px;}
.referral-grid{
  grid-template-columns:1fr;
  max-width:920px;
  margin-left:auto;
  margin-right:auto;
  gap:1.35rem;
}
.referral-card{
  padding:2.15rem;
  border-radius:28px;
  background:rgba(255,255,255,.94);
  box-shadow:0 18px 48px rgba(31,70,54,.065);
}
.referral-card h3{
  font-size:clamp(1.55rem,3vw,2.05rem);
  line-height:1.15;
}
.referral-card p{
  font-size:1rem;
  line-height:1.8;
}
.referral-number{
  width:50px;
  height:50px;
  margin-bottom:1.35rem;
  font-size:.92rem;
}
.referral-input-row input,
.referral-link-box input{
  min-height:52px;
  font-size:.98rem;
}
.referral-input-row .btn,
.referral-link-box .btn{
  min-height:52px;
  white-space:nowrap;
}
.referral-actions .chip-link{
  min-height:46px;
}
.referral-pill{
  display:flex;
  align-items:center;
  width:fit-content;
  max-width:100%;
  line-height:1.35;
}
.referral-note{
  max-width:920px;
  margin-left:auto;
  margin-right:auto;
  padding:1.25rem 1.35rem;
  font-size:.98rem;
}
@media (min-width:800px){
  .referral-card{padding:2.5rem;}
}
@media (max-width:560px){
  .referral-section{padding:5.2rem 0;}
  .referral-card{padding:1.55rem;border-radius:24px;}
  .referral-card h3{font-size:1.55rem;}
  .referral-card p{font-size:.96rem;line-height:1.75;}
  .referral-note{font-size:.92rem;}
}


/* ==========================================================================
   Brand marks & accessible branded links
   ========================================================================== */
.brand-link, .social-brand{gap:.72rem;}
.brand-link .brand-mark, .social-brand .brand-mark{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;}
.brand-svg{width:1.42rem;height:1.42rem;display:block;}
.brand-instagram{color:#d62976;}
.brand-tiktok{color:#111;}
.brand-shopee{color:#ee4d2d;}
.brand-tokopedia{color:#03ac0e;}
.brand-maps{color:#4285f4;}
.brand-whatsapp{color:#25d366;}
.social-list .social-brand{
  display:flex; align-items:center; width:100%; min-height:58px;
  padding:.75rem 1rem; border:1px solid rgba(31,70,54,.14);
  border-radius:16px; background:rgba(255,255,255,.72);
  color:var(--forest-900); font-weight:700; text-decoration:none;
  transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.social-list .social-brand:hover{
  transform:translateY(-2px);
  border-color:rgba(31,70,54,.28);
  box-shadow:0 10px 24px rgba(31,70,54,.08);
}
.shop-links .brand-link{background:rgba(255,255,255,.04);}
.shop-links .brand-link .brand-mark{width:1.5rem;height:1.5rem;}
.shop-links .brand-link .brand-svg{width:1.5rem;height:1.5rem;}
.shop-card.reseller .reseller-cta{
  border:1.5px solid var(--gold-300);
  background:var(--gold-300);
  color:#173a2c;
  font-weight:800;
  box-shadow:0 8px 22px rgba(196,158,59,.18);
}
.shop-card.reseller .reseller-cta:hover{
  background:#e1bc55; color:#122d21; transform:translateY(-1px);
}
.reseller-cta .cta-icon{font-size:1.05rem;line-height:1;}
.pln-badge-enhanced{
  display:flex !important; align-items:center; gap:.5rem; min-width:112px;
  padding:.75rem .9rem !important;
}
.pln-mark{
  display:inline-flex; align-items:center; justify-content:center; gap:.12rem;
  color:#fff; font-weight:900; font-size:.72rem; letter-spacing:.02em;
  background:#00529b; border-radius:7px; padding:.34rem .42rem;
}
.pln-mark b{color:#ffd400;font-size:.7rem;line-height:1;}
.pln-badge-enhanced>span{font-weight:800;white-space:nowrap;}
@media (max-width:560px){
  .social-list .social-brand{min-height:54px;padding:.7rem .9rem;}
  .social-list .brand-svg{width:1.3rem;height:1.3rem;}
}


/* ==========================================================================
   Bank Sampah & Daur Ulang documentary gallery
   ========================================================================== */
.bank-sampah-section{
  background:
    radial-gradient(circle at 90% 12%, rgba(124,154,92,.12), transparent 30%),
    linear-gradient(180deg, #fbf8ef 0%, #f2ecdd 100%);
}
.bank-story-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:1rem;
  margin:2rem 0 3.5rem;
}
@media (min-width:760px){
  .bank-story-grid{grid-template-columns:repeat(3,1fr);}
}
.bank-story-card{
  background:rgba(255,255,255,.78);
  border:1px solid rgba(31,70,54,.10);
  border-radius:20px;
  padding:1.5rem;
  box-shadow:0 10px 30px rgba(31,70,54,.06);
}
.bank-number{
  display:inline-flex;
  width:46px;
  height:46px;
  border-radius:50%;
  align-items:center;
  justify-content:center;
  background:var(--forest-900);
  color:#fff;
  font-size:1.2rem;
  margin-bottom:1rem;
}
.bank-story-card h3{color:var(--forest-950); margin:0 0 .55rem;}
.bank-story-card p{color:var(--forest-800); opacity:.78; line-height:1.7; margin:0;}
.media-section-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:1rem;
  margin-bottom:1.15rem;
}
.media-section-head h3{
  margin:.35rem 0 0;
  color:var(--forest-950);
  font-size:clamp(1.3rem,2.8vw,1.8rem);
}
.media-count{
  flex:0 0 auto;
  padding:.55rem .8rem;
  border:1px solid rgba(199,154,69,.35);
  border-radius:999px;
  color:var(--forest-900);
  background:rgba(255,255,255,.7);
  font-size:.72rem;
  font-weight:800;
}
.program-link{
  color:inherit;
  text-decoration:none;
  transition:transform .2s ease, box-shadow .2s ease;
}
.program-link:hover{transform:translateY(-2px); box-shadow:0 8px 18px rgba(31,70,54,.08);}
.program-link span{margin-left:auto; color:var(--gold-500);}
.documentary-video{
  max-width:920px;
  margin:0 auto;
  border-radius:24px;
  overflow:hidden;
  background:#102c21;
  box-shadow:0 18px 50px rgba(23,48,38,.15);
  border:1px solid rgba(31,70,54,.12);
}
.video-frame{
  background:#07160f;
}
.video-frame video{
  display:block;
  width:100%;
  max-height:720px;
  object-fit:contain;
  background:#07160f;
}
.video-caption{
  display:flex;
  gap:1rem;
  align-items:flex-start;
  padding:1.2rem 1.35rem;
  color:#fff;
}
.video-caption > span{font-size:1.5rem;}
.video-caption strong{display:block; color:#fff;}
.video-caption p{margin:.3rem 0 0; color:rgba(255,255,255,.72); line-height:1.6; font-size:.9rem;}
@media (max-width:600px){
  .media-section-head{align-items:flex-start; flex-direction:column;}
  .media-count{font-size:.66rem;}
}

/* Hero primary logo polish: the supplied logo artwork has been tightly cropped for a stronger, more proportional mobile presentation. */
@media (max-width:600px){ .hero-mark .ring{width:min(390px,86vw);} .hero-mark img{width:86%;} }

/* ==========================================================================
   Paid / final-scope brand center modules
   ========================================================================== */
.catalog-note{
  margin:1.2rem 0 1.4rem;
  padding:1rem 1.15rem;
  border:1px solid rgba(31,70,54,.12);
  border-radius:14px;
  background:#fff;
  color:var(--muted);
  display:flex;gap:.7rem;flex-wrap:wrap;align-items:center;
}
.catalog-note strong{color:var(--forest-900);}
.catalog-note span{font-size:.75rem;}
.catalog-grid .product-photo{min-height:230px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:.35rem;background:linear-gradient(135deg,#edf1e7,#f8f4e9);color:#7a857c;}
.catalog-grid .product-photo span{font-size:2rem;}
.catalog-grid .product-photo small{font-size:.62rem;}
.catalog-cta{display:flex;gap:.75rem;justify-content:center;flex-wrap:wrap;margin-top:1.5rem;}
.product-modal{position:fixed;inset:0;z-index:120;display:none;align-items:center;justify-content:center;padding:1rem;}
.product-modal.open{display:flex;}
.product-modal-backdrop{position:absolute;inset:0;background:rgba(8,18,13,.78);backdrop-filter:blur(8px);}
.product-modal-card{position:relative;z-index:1;width:min(760px,94vw);max-height:90vh;overflow:auto;background:#fffdf8;border-radius:24px;padding:2rem;box-shadow:0 30px 90px rgba(0,0,0,.3);}
.product-modal-close{position:absolute;right:1rem;top:1rem;border:0;background:#edf0e9;width:38px;height:38px;border-radius:50%;font-size:1.4rem;color:var(--forest-900);cursor:pointer;}
.product-modal-intro{color:var(--muted);max-width:650px;}
.product-detail-template{display:grid;grid-template-columns:repeat(2,1fr);gap:.75rem;margin:1.3rem 0 1.5rem;}
.product-detail-template>div{padding:1rem;border:1px solid rgba(31,70,54,.1);border-radius:13px;background:#fff;}
.product-detail-template strong{display:block;color:var(--forest-900);font-size:.75rem;}
.product-detail-template span{display:block;margin-top:.3rem;color:var(--muted);font-size:.67rem;}
.product-modal-wa{display:inline-flex;}
.impact-section{background:var(--cream-100);padding:5.5rem 0;}
.impact-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;margin-top:2rem;}
.impact-card{padding:1.5rem;border-radius:20px;background:#fff;border:1px solid rgba(31,70,54,.1);text-align:center;}
.impact-card strong{display:block;font-family:var(--display);font-size:2.8rem;color:var(--forest-800);}
.impact-card span{display:block;margin-top:.3rem;font-weight:800;color:var(--forest-900);}
.impact-card small{display:block;margin-top:.25rem;color:var(--muted);font-size:.62rem;}
.pln-impact-section{padding:5.5rem 0;background:var(--forest-950);}
.pln-impact-card{display:grid;grid-template-columns:260px 1fr;gap:3rem;align-items:center;padding:2.5rem;border:1px solid rgba(255,255,255,.12);border-radius:28px;background:linear-gradient(135deg,rgba(255,255,255,.06),rgba(255,255,255,.025));}
.pln-impact-logo{background:#fff;border-radius:20px;padding:1.2rem;display:flex;align-items:center;justify-content:center;}
.pln-impact-logo img{width:100%;max-width:210px;height:auto;display:block;}
.pln-impact-copy h2{font-size:clamp(2rem,4vw,3.4rem);color:#fff;margin:.7rem 0 1rem;}
.pln-impact-copy p{color:rgba(255,255,255,.7);line-height:1.8;max-width:780px;}
.pln-impact-copy .eyebrow{color:var(--gold-300);}
.pln-impact-quote{margin-top:1.3rem;padding-left:1rem;border-left:3px solid var(--gold-500);color:#fff;font-family:var(--display);font-size:1.15rem;}
.legalitas-section,.testimonials-section,.faq-section{padding:5.5rem 0;}
.legalitas-section{background:#f7f4eb;}
.legal-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;margin-top:2rem;}
.legal-card{background:#fff;border:1px solid rgba(31,70,54,.1);border-radius:18px;padding:1.4rem;}
.legal-card span{color:var(--gold-600);font-size:.65rem;font-weight:800;}
.legal-card strong{display:block;margin:.7rem 0 .3rem;color:var(--forest-900);}
.legal-card small{color:var(--muted);line-height:1.5;}
.testimonial-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-top:2rem;}
.testimonial-card{background:#fff;border:1px solid rgba(31,70,54,.1);border-radius:20px;padding:1.6rem;}
.testimonial-card>span{font-family:var(--display);font-size:3rem;color:var(--gold-500);line-height:.7;}
.testimonial-card p{color:var(--muted);line-height:1.7;min-height:65px;}
.testimonial-card strong{font-size:.7rem;color:var(--forest-900);}
.faq-section{background:#fbf7ee;}
.faq-list{max-width:900px;margin:2rem auto 0;}
.faq-item{background:#fff;border:1px solid rgba(31,70,54,.1);border-radius:14px;margin-bottom:.7rem;padding:0 1.2rem;}
.faq-item summary{cursor:pointer;padding:1.1rem 0;font-weight:800;color:var(--forest-900);list-style:none;}
.faq-item summary::-webkit-details-marker{display:none;}
.faq-item p{color:var(--muted);line-height:1.7;padding:0 0 1.1rem;margin:0;}
.mitra-section{padding:5.5rem 0;background:linear-gradient(135deg,#1f4636,#122019);color:#fff;}
.mitra-card{display:grid;grid-template-columns:1.4fr .8fr;gap:2rem;align-items:center;}
.mitra-card h2{font-size:clamp(2.2rem,4vw,3.7rem);margin:.7rem 0;}
.mitra-card p{color:rgba(255,255,255,.7);line-height:1.75;}
.mitra-card .eyebrow{color:var(--gold-300);}
.mitra-benefits{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1rem;}
.mitra-benefits span{border:1px solid rgba(255,255,255,.15);padding:.55rem .75rem;border-radius:999px;font-size:.65rem;color:rgba(255,255,255,.82);}
.mitra-action{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);border-radius:20px;padding:1.5rem;}
.mitra-action p{margin-top:0;}
.btn-mitra{color:#173026!important;background:var(--gold-300)!important;border-color:var(--gold-300)!important;}
@media(max-width:900px){
  .impact-grid,.legal-grid{grid-template-columns:repeat(2,1fr);}
  .pln-impact-card,.mitra-card{grid-template-columns:1fr;}
  .pln-impact-logo{max-width:280px;}
  .testimonial-grid{grid-template-columns:1fr;}
}
@media(max-width:600px){
  .impact-grid,.legal-grid,.product-detail-template{grid-template-columns:1fr;}
  .product-modal-card{padding:1.4rem;}
  .catalog-cta .btn{width:100%;}
}

/* Latest UX polish */
.hero-main{display:flex;flex-direction:column;align-items:center;}
.hero-main .hero-copy{width:100%;order:1;}
.hero-main .hero-mark{order:2;margin-top:1.2rem;}
.hero .hero-mark .ring{margin-left:auto;margin-right:auto;}
.catalog-grid{grid-template-columns:repeat(3,minmax(0,1fr));}
.shopping-infographic{display:grid;grid-template-columns:1fr auto 1fr auto 1fr auto 1fr;align-items:stretch;gap:.55rem;margin:2rem 0 1rem;padding:1rem;border:1px solid rgba(255,255,255,.12);border-radius:24px;background:rgba(255,255,255,.045);}
.shop-step{position:relative;min-height:180px;padding:1.2rem;border-radius:18px;background:#fffdf8;color:var(--forest-900);text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center;}
.shop-step-number{position:absolute;left:.7rem;top:.7rem;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:var(--gold-500);color:#fff;font-weight:900;font-size:.72rem;}
.shop-step-icon{font-size:2rem;margin-bottom:.45rem;}.shop-step strong{font-size:.86rem;}.shop-step span{font-size:.65rem;line-height:1.55;color:#657169;margin-top:.3rem;}
.shop-step-arrow{align-self:center;color:var(--gold-300);font-size:1.6rem;font-weight:900;}
.shop-infographic-note{display:flex;align-items:center;gap:.7rem;max-width:900px;margin:0 auto 2rem;padding:.85rem 1rem;border-radius:14px;background:rgba(227,195,122,.1);border:1px solid rgba(227,195,122,.18);color:rgba(255,255,255,.78);}
.shop-infographic-note span{font-size:1.25rem;}.shop-infographic-note p{margin:0;font-size:.7rem;line-height:1.6;}.shop-infographic-note b{color:var(--gold-300);}
@media(max-width:900px){.catalog-grid{grid-template-columns:repeat(2,minmax(0,1fr));}.shopping-infographic{grid-template-columns:1fr 1fr;gap:.7rem;}.shop-step-arrow{display:none;}}
@media(max-width:600px){.hero-main .hero-mark{width:100%;margin-top:1rem;}.catalog-grid{grid-template-columns:1fr;}.shopping-infographic{grid-template-columns:1fr;gap:.7rem;padding:.7rem;}.shop-step{min-height:145px;}}


/* Mitra registration + moderation UX */
.mitra-section{padding:5.8rem 0;background:linear-gradient(135deg,#173c2d,#0d2017);color:#fff;}
.mitra-intro{max-width:900px;margin-bottom:2rem;}
.mitra-intro h2{font-size:clamp(2.4rem,5vw,4.2rem);margin:.65rem 0 1rem;color:#fff;}
.mitra-intro p{color:rgba(255,255,255,.72);line-height:1.8;font-size:1rem;max-width:800px;}
.mitra-intro .eyebrow{color:var(--gold-300);}
.mitra-infographic{display:grid;grid-template-columns:1fr auto 1fr auto 1fr auto 1fr;gap:.7rem;align-items:stretch;margin:2rem 0 1.4rem;padding:1rem;border:1px solid rgba(255,255,255,.1);border-radius:24px;background:rgba(255,255,255,.045);}
.mitra-step{position:relative;background:#fffdf8;color:var(--forest-900);border-radius:18px;padding:1.25rem;min-height:180px;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;}
.mitra-step>b{position:absolute;left:.7rem;top:.7rem;width:28px;height:28px;border-radius:50%;background:var(--gold-500);color:#fff;display:grid;place-items:center;font-size:.7rem;}
.mitra-step-icon{font-size:2rem;margin-bottom:.45rem;}
.mitra-step strong{font-size:.9rem;}
.mitra-step small{margin-top:.35rem;color:#68736d;line-height:1.5;font-size:.68rem;}
.mitra-infographic>i{align-self:center;color:var(--gold-300);font-style:normal;font-size:1.5rem;font-weight:900;}
.mitra-benefits{display:flex;flex-wrap:wrap;gap:.6rem;margin:1rem 0 2rem;}
.mitra-benefits span{border:1px solid rgba(255,255,255,.16);padding:.6rem .85rem;border-radius:999px;font-size:.72rem;color:rgba(255,255,255,.84);}
.mitra-form-card{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);border-radius:28px;padding:2rem;}
.form-heading h3{font-family:var(--display);font-size:2rem;margin:.5rem 0;}
.form-heading p{max-width:820px;color:rgba(255,255,255,.7);line-height:1.7;}
.form-heading .eyebrow{color:var(--gold-300);}
.mitra-form{margin-top:1.5rem;}
.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;}
.form-grid label{display:flex;flex-direction:column;gap:.42rem;}
.form-grid label.full{grid-column:1/-1;}
.form-grid label>span{font-size:.72rem;font-weight:800;color:rgba(255,255,255,.9);}
.form-grid label b{color:#f2c76c;}
.form-grid label em{font-style:normal;font-weight:500;color:rgba(255,255,255,.55);}
.mitra-form input,.mitra-form textarea,.mitra-form select{width:100%;border:1px solid rgba(255,255,255,.14);border-radius:12px;background:#fffdf8;color:#193629;padding:.85rem .9rem;font:inherit;outline:none;}
.mitra-form textarea{resize:vertical;min-height:95px;}
.mitra-form input:focus,.mitra-form textarea:focus,.mitra-form select:focus{border-color:var(--gold-400);box-shadow:0 0 0 3px rgba(227,195,122,.14);}
.form-consent{margin:1rem 0;color:rgba(255,255,255,.72);font-size:.7rem;line-height:1.55;}
.form-consent label{display:flex;gap:.55rem;align-items:flex-start;}
.form-consent input{margin-top:.15rem;accent-color:var(--gold-500);}
.form-actions{display:flex;flex-wrap:wrap;gap:.7rem;align-items:center;}
.form-status{min-height:1.4em;margin:.8rem 0 0;color:var(--gold-300);font-size:.75rem;}
.mitra-section .btn-ghost{color:#fff!important;border-color:rgba(255,255,255,.25)!important;background:transparent!important;}
.hero .btn-ghost{color:var(--forest-900)!important;border-color:rgba(31,70,54,.28)!important;background:rgba(255,255,255,.42)!important;box-shadow:0 8px 22px rgba(31,70,54,.06);}
.hero .btn-ghost:hover{color:var(--cream-100)!important;background:var(--forest-900)!important;border-color:var(--forest-900)!important;}
.hidden-field{display:none!important;}

/* Admin moderation */
.moderation-body{background:#f7f4eb;color:#173c2d;}
.admin-shell{min-height:100vh;}
.admin-top{background:#10261b;color:#fff;padding:1.2rem 0;position:sticky;top:0;z-index:20;box-shadow:0 8px 30px rgba(0,0,0,.12);}
.admin-top-inner{display:flex;align-items:center;justify-content:space-between;gap:1rem;}
.admin-brand{display:flex;align-items:center;gap:.8rem;}
.admin-brand img{width:48px;height:48px;object-fit:contain;background:#fff;border-radius:12px;padding:.3rem;}
.admin-brand strong{display:block;font-family:var(--display);font-size:1.2rem;}
.admin-brand span{display:block;font-size:.65rem;color:rgba(255,255,255,.65);}
.admin-content{padding:2rem 0 5rem;}
.admin-toolbar{display:flex;justify-content:space-between;gap:1rem;align-items:end;margin-bottom:1.2rem;flex-wrap:wrap;}
.admin-toolbar h1{font-family:var(--display);margin:.2rem 0;font-size:clamp(2rem,4vw,3rem);}
.admin-toolbar p{color:#68736d;margin:0;line-height:1.6;}
.admin-actions{display:flex;gap:.5rem;flex-wrap:wrap;}
.admin-stat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:.8rem;margin:1rem 0 1.2rem;}
.admin-stat{background:#fff;border:1px solid rgba(31,70,54,.1);border-radius:18px;padding:1rem;}
.admin-stat b{display:block;font-size:1.8rem;font-family:var(--display);color:#173c2d;}
.admin-stat span{font-size:.7rem;color:#68736d;}
.admin-filter{display:flex;gap:.7rem;flex-wrap:wrap;margin-bottom:1rem;}
.admin-filter input,.admin-filter select{border:1px solid rgba(31,70,54,.14);border-radius:12px;background:#fff;padding:.75rem .85rem;color:#173c2d;}
.moderation-list{display:grid;gap:1rem;}
.moderation-card{background:#fff;border:1px solid rgba(31,70,54,.1);border-radius:22px;padding:1.2rem;box-shadow:0 12px 35px rgba(21,52,38,.05);}
.moderation-card-head{display:flex;justify-content:space-between;gap:1rem;align-items:flex-start;}
.moderation-card h3{margin:0;color:#173c2d;}
.moderation-meta{font-size:.68rem;color:#7a847e;margin-top:.25rem;}
.status-badge{display:inline-flex;padding:.4rem .65rem;border-radius:999px;font-size:.65rem;font-weight:900;}
.status-pending{background:#fff3cf;color:#87621a;}.status-approved{background:#dff4e6;color:#1b6b3b;}.status-rejected{background:#fde1e1;color:#9b3030;}
.moderation-details{display:grid;grid-template-columns:repeat(2,1fr);gap:.65rem;margin:1rem 0;}
.moderation-details div{padding:.75rem;background:#f8f7f1;border-radius:12px;}
.moderation-details strong{display:block;font-size:.62rem;color:#8a938d;text-transform:uppercase;letter-spacing:.04em;}
.moderation-details span{display:block;margin-top:.25rem;color:#173c2d;font-size:.78rem;white-space:pre-wrap;word-break:break-word;}
.moderation-actions{display:flex;gap:.55rem;flex-wrap:wrap;border-top:1px solid #eee9dc;padding-top:.9rem;}
.btn-approve{background:#1e8a4a;color:#fff;border:0;}.btn-reject{background:#b94343;color:#fff;border:0;}.btn-view{background:#edf3ed;color:#173c2d;border:1px solid #d7e0d8;}
.empty-state{background:#fff;border:1px dashed #cfd8d0;border-radius:20px;padding:2rem;text-align:center;color:#68736d;}
@media(max-width:900px){.mitra-infographic{grid-template-columns:1fr 1fr;}.mitra-infographic>i{display:none;}.admin-stat-grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:600px){.form-grid,.moderation-details{grid-template-columns:1fr;}.form-grid label.full{grid-column:auto;}.mitra-form-card{padding:1.2rem;}.mitra-infographic{grid-template-columns:1fr;}.mitra-step{min-height:135px;}.form-actions .btn{width:100%;justify-content:center;}.admin-top-inner{align-items:flex-start;}.admin-stat-grid{grid-template-columns:1fr 1fr;}.moderation-card-head{flex-direction:column;}}

.form-status-link{
  display:inline-flex;
  align-items:center;
  margin-left:.35rem;
  color:var(--gold-300);
  font-weight:800;
  text-decoration:underline;
  text-underline-offset:3px;
}
.form-status-link:hover{color:#fff;}

/* V6 final polish: PLN Peduli feature card logo */
.feature-icon-pln{
  width:92px;
  height:72px;
  padding:.35rem .5rem;
  background:#fff;
  border:1px solid rgba(31,70,54,.10);
  border-radius:16px;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
}
.feature-icon-pln img{
  width:100%;
  max-width:82px;
  height:auto;
  object-fit:contain;
  display:block;
}

/* V7 mobile/launch-page category pills: five clean vertical rows, compact backgrounds */
.trust-strip ul{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:.65rem;
}
.trust-strip li{
  width:max-content;
  max-width:100%;
  box-sizing:border-box;
  white-space:nowrap;
  font-size:.82rem;
  font-weight:700;
  color:var(--forest-800);
  background:rgba(124,154,92,.14);
  padding:.5rem 1rem;
  border-radius:999px;
}
.trust-strip li.trust-recycle{
  background:rgba(92,138,111,.20);
  border:1px solid rgba(92,138,111,.18);
}
@media(max-width:600px){
  .trust-strip{padding-top:1.5rem;}
  .trust-strip ul{gap:.62rem;}
  .trust-strip li{font-size:.9rem; padding:.62rem 1rem;}
}

/* V6 final polish: make the hero 'Jadi Mitra' CTA readable on cream backgrounds */
.hero .cta-row .btn.btn-ghost{
  color:var(--forest-900)!important;
  background:rgba(255,255,255,.92)!important;
  border-color:var(--forest-800)!important;
  text-shadow:none!important;
  opacity:1!important;
}
.hero .cta-row .btn.btn-ghost:hover{
  color:var(--cream-100)!important;
  background:var(--forest-900)!important;
  border-color:var(--forest-900)!important;
}

/* V8 UI/UX polish from mobile review
   1) All five category pills use one consistent tone.
   2) Hero 'Jadi Mitra' uses a warm cream surface so it does not merge with the white logo panel.
   3) Hero logo asset has a proportionally reduced wordmark/tagline for cleaner mobile balance.
*/
.trust-strip li.trust-recycle{
  background:rgba(124,154,92,.14);
  border:0;
}
.hero .cta-row .btn.btn-ghost{
  background:var(--cream-200)!important;
  color:var(--forest-900)!important;
  border-color:rgba(31,70,54,.28)!important;
  box-shadow:0 8px 20px rgba(31,70,54,.05);
}
.hero .cta-row .btn.btn-ghost:hover{
  background:var(--forest-900)!important;
  color:var(--cream-100)!important;
  border-color:var(--forest-900)!important;
}
.hero-mark img{
  width:86%;
  max-width:92%;
  height:auto;
}
@media(max-width:600px){
  .hero .cta-row .btn.btn-ghost{background:var(--cream-200)!important;}
}

/* V9 media architecture: separate Bank Sampah, Daur Ulang, and general documentation. */
.documentary-video-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:1.25rem;
  max-width:1180px;
  margin:0 auto;
}
@media(min-width:760px){
  .documentary-video-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
  .documentation-video-grid{grid-template-columns:repeat(3,minmax(0,1fr));}
}
.documentary-video-grid .documentary-video{max-width:none; margin:0;}
.documentation-video-grid .video-caption{padding:1rem 1.1rem;}
.documentation-video-grid .video-caption p{font-size:.82rem;}
.bank-story-grid-two{grid-template-columns:1fr;}
@media(min-width:760px){.bank-story-grid-two{grid-template-columns:repeat(2,minmax(0,1fr));}}
.daur-ulang-section{border-top:1px solid rgba(31,70,54,.08);}
.daur-gallery-grid{margin-bottom:.25rem;}

/* Gallery hierarchy in the mobile three-line menu */
.mobile-menu-group{border-top:1px solid rgba(31,70,54,.08);}
.mobile-menu-group>.mobile-menu-main{border-top:0;display:block;}
.mobile-menu-sub{display:flex;flex-direction:column;background:rgba(242,236,221,.55);padding:.15rem 0 .35rem 1.25rem;border-top:1px solid rgba(31,70,54,.06);}
.mobile-menu-sub a{padding:.72rem var(--edge) .72rem .9rem;font-size:.92rem;font-weight:600;color:var(--forest-900);border-top:0;position:relative;}
.mobile-menu-sub a::before{content:'↳';display:inline-block;margin-right:.45rem;color:var(--gold-500);font-weight:800;}


/* Main documentation gallery: keep mobile compact, reveal the remaining 20 on demand. */
.main-gallery-grid .gallery-item-extra.gallery-item-hidden { display:none; }

.gallery-more-wrap{
  display:flex;
  justify-content:center;
  margin:1.35rem 0 0;
}
.gallery-more-btn{
  appearance:none;
  border:1px solid rgba(31,79,61,.24);
  background:#f4f1e4;
  color:#164b39;
  border-radius:999px;
  padding:.82rem 1.2rem;
  min-height:48px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.55rem;
  font:700 .9rem/1.1 inherit;
  cursor:pointer;
  box-shadow:0 8px 22px rgba(22,75,57,.07);
  transition:transform .2s ease, background .2s ease, box-shadow .2s ease;
}
.gallery-more-btn:hover{transform:translateY(-1px);background:#ebe8d9;box-shadow:0 10px 28px rgba(22,75,57,.11);}
.gallery-more-btn:focus-visible{outline:3px solid rgba(193,154,67,.5);outline-offset:3px;}
.gallery-more-icon{font-size:1.15rem;line-height:1;}
.gallery-more-label{letter-spacing:.01em;}

.gallery-lightbox-close{
  position:absolute;top:1rem;right:1rem;z-index:3;
  width:48px;height:48px;border:1px solid rgba(255,255,255,.18);
  border-radius:50%;background:rgba(255,255,255,.10);color:#fff;
  font-size:2rem;line-height:1;cursor:pointer;
  display:grid;place-items:center;
}
.gallery-lightbox-nav{
  position:absolute;top:50%;transform:translateY(-50%);z-index:3;
  width:48px;height:64px;border:1px solid rgba(255,255,255,.16);
  border-radius:16px;background:rgba(255,255,255,.10);color:#fff;
  font-size:2.5rem;line-height:1;cursor:pointer;
  display:grid;place-items:center;
}
.gallery-lightbox-prev{left:1rem;}
.gallery-lightbox-next{right:1rem;}
.gallery-lightbox-close:hover,.gallery-lightbox-nav:hover{background:rgba(255,255,255,.18);}
.gallery-lightbox-close:focus-visible,.gallery-lightbox-nav:focus-visible{outline:3px solid rgba(211,176,89,.75);outline-offset:3px;}
.gallery-lightbox figure{position:relative;}
.gallery-lightbox figure img{display:block;max-height:82vh;max-width:88vw;object-fit:contain;user-select:none;-webkit-user-drag:none;}
.gallery-lightbox figcaption{font-weight:600;letter-spacing:.02em;}

@media (max-width:700px){
  .gallery-more-wrap{margin:.9rem 0 0;}
  .gallery-more-btn{width:min(100%,340px);font-size:.84rem;padding:.8rem 1rem;}
  .gallery-lightbox{padding:4.5rem .55rem 2rem;}
  .gallery-lightbox figure{max-width:100%;width:100%;}
  .gallery-lightbox figure img{max-width:calc(100vw - 1.2rem);max-height:78vh;border-radius:10px;}
  .gallery-lightbox-close{top:.65rem;right:.65rem;width:44px;height:44px;}
  .gallery-lightbox-nav{width:42px;height:54px;border-radius:13px;font-size:2.1rem;}
  .gallery-lightbox-prev{left:.35rem;}
  .gallery-lightbox-next{right:.35rem;}
}

/* V11 hero refinement - cleaner brand presentation and more editorial gallery heading. */
.hero-mark{
  padding:1rem 0 1.4rem;
}
.hero-mark .ring{
  width:min(370px,82vw);
  background:
    radial-gradient(circle at 50% 38%, rgba(255,255,255,.96), rgba(255,253,248,.92) 58%, rgba(239,235,220,.9) 100%);
  border:1px solid rgba(31,70,54,.12);
  box-shadow:
    0 34px 70px -38px rgba(23,48,38,.42),
    inset 0 0 0 10px rgba(255,255,255,.18);
  isolation:isolate;
}
.hero-mark .ring::after{
  content:"";
  position:absolute;
  inset:7px;
  border-radius:50%;
  border:1px solid rgba(199,154,69,.16);
  pointer-events:none;
}
.hero-mark img{
  position:relative;
  z-index:1;
  display:block;
  width:78%;
  max-width:78%;
  height:auto;
  filter:drop-shadow(0 8px 14px rgba(23,48,38,.08));
}
.brand-seal-label{
  position:absolute;
  z-index:2;
  top:1.05rem;
  left:50%;
  transform:translateX(-50%);
  padding:.36rem .72rem;
  border:1px solid rgba(31,70,54,.11);
  border-radius:999px;
  background:rgba(246,242,229,.82);
  color:rgba(31,70,54,.62);
  font:800 .55rem/1 var(--body);
  letter-spacing:.13em;
  white-space:nowrap;
  backdrop-filter:blur(5px);
}
@media(max-width:600px){
  .hero-mark{padding:.45rem 0 1rem;}
  .hero-mark .ring{
    width:min(335px,84vw);
    box-shadow:
      0 28px 58px -34px rgba(23,48,38,.4),
      inset 0 0 0 8px rgba(255,255,255,.18);
  }
  .hero-mark img{width:76%;max-width:76%;}
  .brand-seal-label{top:.82rem;font-size:.49rem;padding:.32rem .62rem;}
  .section-head h2{
    font-size:clamp(1.72rem,7.2vw,2.45rem);
    line-height:1.18;
    letter-spacing:-.025em;
  }
  .section-head p{font-size:.98rem;line-height:1.7;}
}

/* Final editorial polish: cleaner, more proportional hero logo presentation. */
.hero-mark .ring{
  width:min(360px,80vw);
  background:radial-gradient(circle at 50% 42%, rgba(255,255,255,.98), rgba(255,253,248,.94) 62%, rgba(239,235,220,.88) 100%);
}
.hero-mark img{
  width:70%;
  max-width:70%;
  filter:drop-shadow(0 7px 14px rgba(23,48,38,.07));
}
@media(max-width:600px){
  .hero-mark .ring{width:min(330px,82vw);}
  .hero-mark img{width:70%;max-width:70%;}
}

/* V14 responsive desktop + mobile polish */
.site-header .wrap{
  min-width:0;
}
.brand{
  flex:0 0 auto;
  min-width:0;
}
.brand-text{
  white-space:nowrap;
}
.nav-links{
  flex:1 1 auto;
  justify-content:center;
  gap:clamp(.8rem,1.35vw,1.45rem);
  min-width:0;
  margin:0 1rem;
}
.nav-links a{
  white-space:nowrap;
  font-size:clamp(.72rem,.74vw,.82rem);
}
.nav-cta{
  flex:0 0 auto;
  white-space:nowrap;
}
@media (min-width:1200px){
  .nav-links{display:flex;}
  .nav-toggle{display:none;}
}
@media (min-width:940px) and (max-width:1199px){
  .nav-links{display:none;}
  .nav-toggle{display:inline-flex;}
}
@media (max-width:939px){
  .nav-links{display:none;}
  .nav-cta{display:none;}
  .nav-toggle{display:inline-flex;}
}

/* The previous hero markup was nested incorrectly. This layer restores a true two-column hero. */
.hero-main{
  display:grid !important;
  grid-template-columns:1fr !important;
  align-items:center;
  gap:clamp(2rem,5vw,5rem) !important;
}
@media (min-width:960px){
  .hero-main{
    grid-template-columns:minmax(0,1.06fr) minmax(380px,.94fr) !important;
    gap:clamp(2.5rem,5vw,5.5rem) !important;
  }
}
.hero-copy{min-width:0;}
.hero-copy h1{max-width:12ch;}
.hero .lede,.hero .origin{max-width:58ch;}

/* Elevated brand seal: transparent logo, layered rings, soft depth and a quiet editorial badge. */
.hero-mark{
  position:relative;
  min-height:clamp(390px,38vw,520px);
  padding:1.5rem 0 3.5rem;
  display:flex;
  align-items:center;
  justify-content:center;
}
.hero-mark .ring{
  position:relative;
  width:min(440px,38vw);
  min-width:320px;
  aspect-ratio:1;
  overflow:visible;
  background:
    radial-gradient(circle at 50% 32%, rgba(255,255,255,.98) 0 35%, rgba(255,253,248,.94) 58%, rgba(239,235,220,.72) 100%);
  border:1px solid rgba(31,70,54,.13);
  box-shadow:
    0 34px 80px -34px rgba(23,48,38,.42),
    inset 0 0 0 10px rgba(255,255,255,.46),
    inset 0 0 0 11px rgba(199,154,69,.08);
}
.hero-mark .ring::before{
  inset:-20px;
  border:1px solid rgba(199,154,69,.34);
  animation:none;
}
.hero-mark .ring::after{
  inset:9px;
  border:1px solid rgba(31,70,54,.09);
}
.seal-core{
  position:absolute;
  inset:8%;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  background:rgba(255,255,255,.42);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.55);
}
.hero-mark img{
  position:relative;
  z-index:3;
  width:82%;
  max-width:82%;
  height:auto;
  filter:drop-shadow(0 12px 18px rgba(23,48,38,.10));
}
.seal-orbit{
  position:absolute;
  z-index:0;
  border-radius:50%;
  pointer-events:none;
}
.seal-orbit-one{
  inset:-8px;
  border:1px solid rgba(199,154,69,.18);
}
.seal-orbit-two{
  inset:-34px;
  border:1px dashed rgba(124,154,92,.25);
}
.brand-seal-label{
  position:absolute;
  z-index:5;
  top:0;
  left:50%;
  transform:translateX(-50%);
  padding:.48rem .9rem;
  border:1px solid rgba(199,154,69,.28);
  border-radius:999px;
  background:rgba(251,247,238,.88);
  color:var(--forest-800);
  font:800 .58rem/1 var(--body);
  letter-spacing:.16em;
  white-space:nowrap;
  box-shadow:0 10px 26px -18px rgba(23,48,38,.45);
  backdrop-filter:blur(8px);
}
.brand-seal-caption{
  position:absolute;
  z-index:5;
  bottom:.2rem;
  left:50%;
  transform:translateX(-50%);
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:.25rem;
  text-align:center;
  white-space:nowrap;
}
.brand-seal-caption span{
  font-family:var(--display);
  font-size:1rem;
  font-weight:600;
  letter-spacing:.08em;
  color:var(--forest-900);
}
.brand-seal-caption small{
  font-size:.56rem;
  font-weight:800;
  letter-spacing:.18em;
  color:var(--gold-600);
}

@media (max-width:959px){
  .hero-main{grid-template-columns:1fr !important;}
  .hero-copy h1{max-width:15ch;}
  .hero-mark{min-height:360px; margin-top:.5rem;}
  .hero-mark .ring{width:min(390px,82vw); min-width:0;}
}
@media (max-width:600px){
  .site-header .wrap{height:72px;}
  .brand img{height:40px;}
  .brand-text{font-size:1.05rem;}
  .brand-text small{font-size:.52rem;}
  .hero{padding-top:48px;}
  .hero h1{font-size:clamp(2.35rem,10.5vw,3.25rem); max-width:none;}
  .hero .lede{font-size:1rem;}
  .hero .origin{font-size:.88rem;}
  .hero-mark{min-height:325px; padding:1.3rem 0 3.1rem;}
  .hero-mark .ring{width:min(330px,80vw);}
  .hero-mark img{width:80%;max-width:80%;}
  .brand-seal-label{font-size:.49rem;padding:.4rem .7rem;}
  .brand-seal-caption span{font-size:.9rem;}
  .brand-seal-caption small{font-size:.5rem;letter-spacing:.14em;}
  .seal-orbit-two{inset:-22px;}
}
.hero > .trust-strip{display:block;}


/* V15: clean hero identity. The logo artwork itself remains unchanged;
   auxiliary labels above/below the logo are intentionally removed. */
.hero-mark{
  overflow:visible;
}
.hero-mark .ring{
  margin-inline:auto;
}
@media (max-width:600px){
  .hero-mark{
    min-height:325px;
    padding-bottom:2.2rem;
  }
}


/* ==========================================================================
   Scalable product detail system
   ========================================================================== */
.catalog-flex-note{
  margin:0 0 1.5rem;
  padding:1rem 1.15rem;
  display:flex;
  gap:.85rem;
  align-items:flex-start;
  border:1px solid rgba(182,134,58,.22);
  border-radius:16px;
  background:linear-gradient(135deg,rgba(255,255,255,.92),rgba(243,236,220,.72));
}
.catalog-flex-icon{
  width:34px;
  height:34px;
  flex:0 0 34px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:var(--forest-900);
  color:var(--gold-300);
  font-size:.9rem;
}
.catalog-flex-note strong{
  display:block;
  color:var(--forest-900);
  font-size:.82rem;
}
.catalog-flex-note p{
  margin-top:.3rem;
  color:var(--muted);
  font-size:.73rem;
  line-height:1.6;
}
.catalog-grid .product-photo img{
  width:100%;
  height:100%;
  object-fit:cover;
}
.catalog-placeholder .product-link{
  background:transparent;
  border:0;
  padding:0;
  cursor:pointer;
}
.product-modal-open{overflow:hidden;}
.product-detail-card{
  width:min(980px,94vw);
  padding:clamp(1.2rem,3vw,2.25rem);
}
.product-detail-hero{
  display:grid;
  grid-template-columns:minmax(220px,320px) 1fr;
  gap:clamp(1.2rem,3vw,2.2rem);
  align-items:center;
  padding-right:2rem;
}
.product-detail-main-photo{
  aspect-ratio:1/1;
  border-radius:22px;
  overflow:hidden;
  background:linear-gradient(135deg,#edf1e7,#f8f4e9);
  border:1px solid rgba(31,70,54,.1);
  display:flex;
  align-items:center;
  justify-content:center;
  flex-direction:column;
  color:#7a857c;
}
.product-detail-main-photo img{
  width:100%;
  height:100%;
  object-fit:cover;
}
.product-detail-main-photo span{font-size:2.5rem;}
.product-detail-main-photo small{font-size:.7rem;margin-top:.35rem;}
.product-detail-heading h2{
  margin-top:.4rem;
  color:var(--forest-950);
  font-size:clamp(2rem,4vw,3.2rem);
}
.product-detail-brand{
  margin-top:.55rem;
  color:var(--gold-600);
  font-weight:800;
  font-size:.8rem;
}
.product-modal-intro{
  margin-top:.8rem;
  color:var(--muted);
  line-height:1.7;
  max-width:680px;
}
.product-detail-status{margin-top:.85rem;}
.availability-badge{
  display:inline-flex;
  padding:.42rem .75rem;
  border-radius:999px;
  background:var(--cream-200);
  color:var(--forest-900);
  font-size:.68rem;
  font-weight:800;
}
.product-detail-gallery{
  display:flex;
  gap:.65rem;
  flex-wrap:wrap;
  margin-top:1.2rem;
}
.product-detail-gallery:empty{display:none;}
.product-detail-gallery a{
  width:76px;
  height:76px;
  overflow:hidden;
  border-radius:12px;
  border:1px solid rgba(31,70,54,.12);
  background:#fff;
}
.product-detail-gallery img{
  width:100%;
  height:100%;
  object-fit:cover;
}
.product-detail-sections{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:.85rem;
  margin-top:1.45rem;
}
.product-info-block{
  padding:1rem 1.05rem;
  border:1px solid rgba(31,70,54,.1);
  border-radius:15px;
  background:#fff;
}
.product-info-block h3{
  font-family:var(--body);
  font-size:.72rem;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:var(--gold-600);
  margin:0;
}
.product-info-content{
  margin-top:.45rem;
  color:var(--forest-900);
  font-size:.78rem;
  line-height:1.7;
}
.product-info-content ul{
  list-style:disc;
  padding-left:1.1rem;
}
.product-info-content li + li{margin-top:.2rem;}
.product-detail-actions{
  display:flex;
  flex-wrap:wrap;
  gap:.65rem;
  align-items:center;
  margin-top:1.4rem;
}
.product-action-placeholder{
  color:var(--muted);
  font-size:.72rem;
  padding:.7rem .85rem;
  border-radius:12px;
  background:var(--cream-200);
}

@media (max-width:760px){
  .catalog-flex-note{padding:.9rem;}
  .product-detail-card{
    width:min(96vw,680px);
    max-height:92vh;
    border-radius:20px;
    padding:1rem;
  }
  .product-detail-hero{
    grid-template-columns:1fr;
    gap:1rem;
    padding-right:0;
  }
  .product-detail-main-photo{
    width:min(100%,300px);
    margin:0 auto;
  }
  .product-detail-heading h2{font-size:2rem;}
  .product-detail-sections{grid-template-columns:1fr;}
  .product-detail-actions .btn{width:100%;justify-content:center;}
}

/* Referral foundation */
.referral-flow-note{
  margin-top:.85rem;
  padding:.85rem 1rem;
  border:1px solid rgba(31,70,54,.12);
  border-radius:14px;
  background:rgba(255,255,255,.68);
  display:flex;
  flex-direction:column;
  gap:.22rem;
}
.referral-flow-note strong{
  color:var(--forest-900);
  font-size:.76rem;
}
.referral-flow-note span{
  color:var(--muted);
  font-size:.7rem;
  line-height:1.55;
}

/* ==========================================================================
   V18 HERO LOGO REFRESH
   The supplied Teh Dwi logo is the source of truth for the main hero mark.
   No additional orbit, seal, or duplicated wording is added around it.
   ========================================================================== */
.hero-mark{
  min-width:0;
  width:100%;
  display:flex;
  align-items:center;
  justify-content:center;
}
.hero-logo-stage{
  position:relative;
  width:min(520px, 100%);
  display:flex;
  align-items:center;
  justify-content:center;
  padding:0;
}
.hero-logo-stage::before{
  content:"";
  position:absolute;
  width:72%;
  aspect-ratio:1;
  border-radius:50%;
  background:radial-gradient(circle, rgba(255,255,255,.82) 0%, rgba(255,255,255,.42) 52%, rgba(255,255,255,0) 72%);
  filter:blur(4px);
  z-index:0;
}
.hero-logo-stage img{
  position:relative;
  z-index:1;
  display:block;
  width:100%;
  height:auto;
  max-width:none;
  object-fit:contain;
  filter:drop-shadow(0 24px 28px rgba(23,48,38,.12));
}
@media (max-width:959px){
  .hero{
    padding-top:clamp(38px,8vw,58px);
  }
  .hero .wrap{
    gap:2.2rem;
  }
  .hero-mark{
    order:2;
    margin-top:.2rem;
  }
  .hero-logo-stage{
    width:min(390px, 94vw);
  }
}
@media (max-width:560px){
  .hero-logo-stage{
    width:min(355px, 94vw);
  }
  .hero-logo-stage::before{
    width:76%;
  }
}

/* V20 referral contact cards */
.referral-contact-panel{grid-column:1/-1;background:rgba(255,255,255,.92);border:1px solid rgba(36,72,56,.12);border-radius:24px;padding:1.5rem;box-shadow:0 12px 30px rgba(23,58,44,.06);}
.referral-contact-head h3{margin:.35rem 0 .45rem;color:#173a2c;}
.referral-contact-head p{margin:0;color:#647069;}
.referral-contact-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.8rem;margin-top:1rem;}
.referral-wa-card{display:flex;align-items:center;gap:.8rem;padding:1rem 1.1rem;border-radius:18px;text-decoration:none;border:1px solid rgba(36,72,56,.12);transition:transform .2s ease,box-shadow .2s ease;}
.referral-wa-card:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(23,58,44,.08);}
.referral-wa-reseller{background:#f1f8f3;color:#173a2c;}
.referral-wa-main{background:#fff8e8;color:#4b3912;}
.referral-wa-icon{font-size:1.45rem;}
.referral-wa-card b,.referral-wa-card small{display:block;}
.referral-wa-card small{margin-top:.18rem;opacity:.72;line-height:1.45;}
@media(max-width:760px){.referral-contact-grid{grid-template-columns:1fr;}}

/* V23 catalog reliability: product cards remain visible even if reveal animation JS is delayed. */
#productCatalog .product-card{visibility:visible;opacity:1;transform:none;}
#productCatalog .product-photo img{display:block;width:100%;height:auto;max-height:340px;object-fit:contain;}

.catalog-empty{grid-column:1/-1;text-align:center;padding:2rem;border:1px solid rgba(23,48,38,.12);border-radius:20px;color:var(--muted);background:rgba(255,255,255,.7)}

/* Simple admin login */
.admin-login-screen{min-height:100vh;display:grid;place-items:center;padding:1.5rem;background:linear-gradient(145deg,#f8f5eb,#eef2e8);}
.admin-login-card{width:min(100%,430px);background:#fff;border:1px solid rgba(31,70,54,.12);border-radius:24px;padding:2rem;box-shadow:0 24px 70px rgba(16,38,27,.12);}
.admin-login-card>img{display:block;width:76px;height:76px;object-fit:contain;border-radius:18px;margin:0 auto 1rem;}
.admin-login-card .eyebrow{display:block;text-align:center;color:#a78642;font-weight:700;letter-spacing:.08em;font-size:.72rem;}
.admin-login-card h1{text-align:center;margin:.35rem 0 .5rem;font-family:var(--display);color:#173c2d;}
.admin-login-card>p{text-align:center;color:#68736d;line-height:1.55;margin:0 0 1.3rem;}
.admin-login-card form{display:grid;gap:.9rem;}
.admin-login-card label{display:grid;gap:.35rem;color:#173c2d;font-weight:700;font-size:.9rem;}
.admin-login-card input{width:100%;box-sizing:border-box;border:1px solid rgba(31,70,54,.16);border-radius:12px;padding:.8rem .9rem;font:inherit;background:#fff;color:#173c2d;}
.admin-login-card input:focus{outline:2px solid rgba(167,134,66,.25);border-color:#a78642;}
.admin-login-card .btn{width:100%;justify-content:center;margin-top:.2rem;}
.admin-login-error{padding:.7rem .8rem;border-radius:10px;background:#fff0f0;color:#9a2929;font-size:.82rem;text-align:center;}
.admin-login-back{display:block;text-align:center;margin-top:1.1rem;color:#315b49;text-decoration:none;font-weight:700;font-size:.85rem;}
.admin-login-back:hover{text-decoration:underline;}

/* =========================================================
   LOKA BUMI V24 · ADMIN REDESIGN
   Responsive mobile + desktop moderation experience
   ========================================================= */
.moderation-body{min-height:100vh;background:#f4f1e8;color:#173c2d;overflow-x:hidden;}
.admin-login-screen{min-height:100svh;box-sizing:border-box;display:grid;place-items:center;padding:clamp(1rem,4vw,3rem);background:radial-gradient(circle at 15% 15%,rgba(167,134,66,.12),transparent 30%),linear-gradient(135deg,#eef3ec 0%,#f8f5eb 48%,#e9efe9 100%);}
.admin-login-card{width:min(100%,470px);box-sizing:border-box;background:rgba(255,255,255,.96);border:1px solid rgba(31,70,54,.13);border-radius:30px;padding:clamp(1.35rem,4vw,2.7rem);box-shadow:0 28px 80px rgba(16,38,27,.13);}
.admin-login-brand{display:flex;align-items:center;justify-content:center;gap:.75rem;margin-bottom:1.2rem;color:#173c2d;font-family:var(--display);font-size:1.05rem;font-weight:800;letter-spacing:.02em;}
.admin-login-brand img{width:58px;height:58px;object-fit:contain;background:#fff;border-radius:17px;padding:.28rem;border:1px solid #e4e8df;box-shadow:0 8px 22px rgba(16,38,27,.08);}
.admin-login-card .eyebrow{display:block;text-align:center;color:#a78642;font-weight:800;letter-spacing:.12em;font-size:.68rem;}
.admin-login-card h1{text-align:center;margin:.35rem 0 .55rem;font-family:var(--display);font-size:clamp(2rem,6vw,3rem);line-height:1.02;color:#173c2d;}
.admin-login-card>p{text-align:center;color:#68736d;line-height:1.65;margin:0 auto 1.5rem;max-width:36rem;font-size:.92rem;}
.admin-login-card form{display:grid;gap:1rem;}
.admin-login-card label{display:grid;gap:.42rem;color:#173c2d;font-weight:800;font-size:.82rem;}
.admin-login-card input{width:100%;min-height:48px;box-sizing:border-box;border:1px solid #d7dfd7;border-radius:14px;padding:.78rem .9rem;font:inherit;background:#fbfcfa;color:#173c2d;}
.admin-login-card input:focus{outline:3px solid rgba(167,134,66,.18);border-color:#a78642;background:#fff;}
.admin-login-card .btn{width:100%;min-height:50px;justify-content:center;border-radius:14px;font-weight:900;margin-top:.15rem;}
.admin-login-error{padding:.75rem .85rem;border-radius:12px;background:#fff0f0;color:#9a2929;font-size:.8rem;text-align:center;border:1px solid #f0caca;}
.admin-login-back{display:block;text-align:center;margin-top:1.2rem;color:#315b49;text-decoration:none;font-weight:800;font-size:.82rem;}
.admin-login-back:hover{text-decoration:underline;}

.admin-shell{min-height:100svh;background:#f4f1e8;}
.admin-top{background:#0d2a1d;color:#fff;padding:.8rem 0;position:sticky;top:0;z-index:20;box-shadow:0 8px 30px rgba(16,38,27,.16);border-bottom:1px solid rgba(255,255,255,.08);}
.admin-top-inner{min-height:60px;display:flex;align-items:center;justify-content:space-between;gap:1rem;}
.admin-brand{display:flex;align-items:center;gap:.72rem;text-decoration:none;color:#fff;min-width:0;}
.admin-brand img{width:46px;height:46px;flex:0 0 46px;object-fit:contain;background:#fff;border-radius:13px;padding:.25rem;}
.admin-brand strong{display:block;font-family:var(--display);font-size:1rem;line-height:1.1;}
.admin-brand small{display:block;font-size:.67rem;color:rgba(255,255,255,.62);margin-top:.18rem;}
.admin-top .admin-actions{align-items:center;justify-content:flex-end;}
.admin-top .btn{min-height:40px;border-radius:12px;font-size:.76rem;white-space:nowrap;}
.admin-top .btn-ghost{color:#fff;border-color:rgba(255,255,255,.16);background:rgba(255,255,255,.05);}
.admin-content{padding:clamp(1.1rem,3vw,2.6rem) 0 5rem;}
.admin-hero{display:flex;align-items:flex-end;justify-content:space-between;gap:1.5rem;padding:clamp(1.25rem,3vw,2rem);background:linear-gradient(135deg,#fffdf8,#f1f6f0);border:1px solid rgba(31,70,54,.1);border-radius:24px;margin-bottom:1rem;box-shadow:0 10px 35px rgba(21,52,38,.045);}
.admin-hero h1{font-family:var(--display);font-size:clamp(2rem,5vw,3.35rem);line-height:1.02;margin:.3rem 0 .6rem;color:#173c2d;}
.admin-hero h1 em{font-style:normal;color:#a78642;}
.admin-hero p{margin:0;max-width:780px;color:#68736d;line-height:1.65;font-size:.9rem;}
.admin-hero-status{display:inline-flex;align-items:center;gap:.45rem;flex:0 0 auto;padding:.55rem .8rem;border-radius:999px;background:#e7f4ea;color:#21683d;font-weight:800;font-size:.72rem;border:1px solid #cfe7d5;}
.admin-live-dot{width:8px;height:8px;border-radius:50%;background:#27984f;box-shadow:0 0 0 5px rgba(39,152,79,.12);}
.admin-notice{margin:0 0 1rem;padding:.8rem 1rem;border-radius:14px;background:#e8f5eb;color:#1e663a;border:1px solid #cce5d3;font-size:.8rem;font-weight:700;}
.admin-notice.error{background:#fff0f0;color:#9a2929;border-color:#efcaca;}
.admin-stat-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.8rem;margin:1rem 0;}
.admin-stat{position:relative;overflow:hidden;background:#fff;border:1px solid rgba(31,70,54,.1);border-radius:18px;padding:1rem 1.1rem;min-height:108px;box-sizing:border-box;}
.admin-stat:after{content:"";position:absolute;right:-24px;bottom:-30px;width:85px;height:85px;border-radius:50%;background:rgba(31,70,54,.045);}
.admin-stat span,.admin-stat small{display:block;color:#718078;font-size:.7rem;font-weight:800;}
.admin-stat b{display:block;font-size:2rem;line-height:1.05;font-family:var(--display);color:#173c2d;margin:.35rem 0 .25rem;}
.admin-stat-pending b{color:#8c671c}.admin-stat-approved b{color:#1f7743}.admin-stat-rejected b{color:#a53a3a}
.admin-tools{display:grid;grid-template-columns:minmax(240px,1fr) 180px auto;align-items:center;gap:.65rem;margin:0 0 1rem;padding:.75rem;background:#fff;border:1px solid rgba(31,70,54,.1);border-radius:18px;}
.admin-search-wrap{display:flex;align-items:center;gap:.45rem;border:1px solid #d9e1d9;background:#fafbf9;border-radius:12px;padding:0 .75rem;min-height:44px;box-sizing:border-box;}
.admin-search-wrap span{font-size:1.15rem;color:#8b978f}.admin-search-wrap input{border:0;outline:0;background:transparent;width:100%;min-width:0;color:#173c2d;font:inherit;font-size:.82rem;}
.admin-tools select{min-height:44px;border:1px solid #d9e1d9;border-radius:12px;background:#fafbf9;color:#173c2d;padding:0 .75rem;font:inherit;font-size:.8rem;}
.admin-tool-actions{display:flex;gap:.45rem;justify-content:flex-end;flex-wrap:wrap;}
.admin-tool-actions .btn{min-height:44px;border-radius:12px;font-size:.72rem;}
.moderation-list{display:grid;gap:.9rem;}
.moderation-card{background:#fff;border:1px solid rgba(31,70,54,.1);border-radius:22px;padding:clamp(1rem,2vw,1.35rem);box-shadow:0 12px 35px rgba(21,52,38,.05);}
.moderation-card.status-card-pending{border-left:4px solid #b98b2d}.moderation-card.status-card-approved{border-left:4px solid #2b8b4e}.moderation-card.status-card-rejected{border-left:4px solid #b94a4a}
.moderation-card-head{display:flex;justify-content:space-between;gap:1rem;align-items:flex-start;}
.moderation-person{display:flex;align-items:center;gap:.75rem;min-width:0;}.moderation-avatar{width:48px;height:48px;flex:0 0 48px;display:grid;place-items:center;border-radius:15px;background:#edf4ed;color:#1e6341;font-family:var(--display);font-size:1.25rem;font-weight:900;}
.moderation-meta-top{font-size:.62rem;color:#8a948e;margin-bottom:.2rem;}.moderation-card h3{margin:0;color:#173c2d;font-family:var(--display);font-size:1.45rem;line-height:1.05;}.moderation-card-head p{margin:.22rem 0 0;color:#718078;font-size:.73rem;}
.status-badge{display:inline-flex;align-items:center;padding:.45rem .68rem;border-radius:999px;font-size:.66rem;font-weight:900;white-space:nowrap;}
.status-pending{background:#fff3cf;color:#87621a}.status-approved{background:#dff4e6;color:#1b6b3b}.status-rejected{background:#fde1e1;color:#9b3030}
.moderation-details{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.6rem;margin:1rem 0;}.moderation-details div{padding:.75rem .8rem;background:#f7f8f4;border-radius:12px;min-width:0;}.moderation-details .detail-wide{grid-column:1/-1;}.moderation-details strong{display:block;font-size:.59rem;color:#8a938d;text-transform:uppercase;letter-spacing:.06em;}.moderation-details span{display:block;margin-top:.25rem;color:#173c2d;font-size:.76rem;line-height:1.45;white-space:pre-wrap;word-break:break-word;}.moderation-details a{color:#236d48;font-weight:800;word-break:break-all;}.moderation-details em{color:#8b948e;font-style:normal;}
.referral-detail span{display:flex!important;align-items:center;gap:.55rem;flex-wrap:wrap;}.copy-ref{border:1px solid #cbd8ce;background:#fff;color:#215b40;border-radius:8px;padding:.28rem .5rem;font:inherit;font-size:.65rem;font-weight:800;cursor:pointer;}
.moderation-actions{display:flex;gap:.5rem;flex-wrap:wrap;border-top:1px solid #eee9dc;padding-top:.9rem;}.moderation-actions .btn{min-height:42px;border-radius:11px;font-size:.72rem;}.btn-approve{background:#1e8a4a;color:#fff;border:0}.btn-reject{background:#b94343;color:#fff;border:0}.btn-view{background:#edf3ed;color:#173c2d;border:1px solid #d7e0d8}.moderation-actions .btn:disabled{opacity:.55;cursor:wait;}
.empty-state{background:#fff;border:1px dashed #cfd8d0;border-radius:20px;padding:2rem;text-align:center;color:#68736d;display:grid;gap:.3rem;}.admin-loading{min-height:150px;place-items:center;}.admin-spinner{width:22px;height:22px;border:3px solid #dce6de;border-top-color:#2b8b4e;border-radius:50%;animation:adminspin .8s linear infinite;}@keyframes adminspin{to{transform:rotate(360deg)}}

@media(max-width:900px){
  .admin-stat-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
  .admin-tools{grid-template-columns:1fr 170px;}.admin-tool-actions{grid-column:1/-1;justify-content:flex-start;}
}
@media(max-width:640px){
  .admin-login-screen{padding:1rem;align-items:center;}
  .admin-login-card{border-radius:23px;padding:1.2rem;}
  .admin-login-brand img{width:52px;height:52px;}.admin-login-card h1{font-size:2rem;}.admin-login-card>p{font-size:.82rem;}
  .admin-top{padding:.65rem 0;}.admin-top-inner{min-height:52px;align-items:center;}.admin-brand img{width:40px;height:40px;flex-basis:40px;border-radius:11px;}.admin-brand strong{font-size:.86rem}.admin-brand small{font-size:.58rem}.admin-back-btn{display:none!important;}.admin-top .admin-actions{margin-left:auto}.admin-top .btn{min-height:38px;padding:.5rem .7rem;font-size:.68rem;}
  .admin-content{padding-top:.8rem;}.admin-hero{display:block;border-radius:19px;padding:1rem;}.admin-hero h1{font-size:2.1rem}.admin-hero p{font-size:.78rem;line-height:1.55}.admin-hero-status{margin-top:.8rem;font-size:.65rem;}
  .admin-stat-grid{gap:.55rem}.admin-stat{min-height:94px;padding:.75rem .8rem;border-radius:15px}.admin-stat b{font-size:1.55rem}.admin-stat span,.admin-stat small{font-size:.6rem}
  .admin-tools{grid-template-columns:1fr;gap:.55rem;padding:.6rem;border-radius:15px}.admin-tool-actions{grid-column:auto;display:grid;grid-template-columns:1fr 1fr 1fr;width:100%;}.admin-tool-actions .btn{padding:.45rem .35rem;font-size:.62rem;min-width:0;}
  .moderation-card{border-radius:18px;padding:.9rem;border-left-width:3px}.moderation-card-head{display:block}.moderation-person{align-items:flex-start}.moderation-avatar{width:42px;height:42px;flex-basis:42px;border-radius:13px}.moderation-card h3{font-size:1.25rem}.status-badge{margin:.7rem 0 0 0;font-size:.61rem}.moderation-details{grid-template-columns:1fr;gap:.5rem;margin:.8rem 0}.moderation-details .detail-wide{grid-column:auto}.moderation-details div{padding:.65rem .7rem}.moderation-details span{font-size:.72rem}.moderation-actions{display:grid;grid-template-columns:1fr;gap:.45rem}.moderation-actions .btn{width:100%;justify-content:center;}
}
@media(max-width:380px){.admin-tool-actions{grid-template-columns:1fr;}.admin-stat-grid{grid-template-columns:1fr 1fr}.admin-login-card{padding:1rem}.admin-login-card h1{font-size:1.8rem;}}


/* V24.1 · Signature placement for herbal image 3 */
.herbal-showcase{padding:clamp(2.6rem,6vw,5.4rem) 0;background:linear-gradient(180deg,#f8f6ef 0%,#eef3eb 100%);overflow:hidden;}
.herbal-showcase-card{display:grid;grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);align-items:stretch;background:#fff;border:1px solid rgba(31,70,54,.11);border-radius:32px;overflow:hidden;box-shadow:0 28px 70px rgba(23,58,44,.10);}
.herbal-showcase-copy{padding:clamp(1.6rem,4vw,4rem);display:flex;flex-direction:column;justify-content:center;align-items:flex-start;}
.herbal-showcase-copy .eyebrow{color:#a78642;font-weight:800;letter-spacing:.09em;}
.herbal-showcase-copy h2{font-family:var(--display);font-size:clamp(2rem,4.1vw,3.45rem);line-height:1.04;color:#173c2d;margin:.55rem 0 .9rem;}
.herbal-showcase-copy h2 em{font-style:normal;color:#a78642;}
.herbal-showcase-copy p{max-width:36rem;color:#68736d;line-height:1.72;margin:0 0 1.15rem;font-size:.96rem;}
.herbal-showcase-pills{display:flex;flex-wrap:wrap;gap:.42rem;margin:0 0 1.35rem;}
.herbal-showcase-pills span{padding:.48rem .68rem;border-radius:999px;background:#f0f5ee;border:1px solid #dbe6dc;color:#2c6148;font-size:.7rem;font-weight:800;}
.herbal-showcase-media{position:relative;min-height:100%;background:#e8e1d4;}
.herbal-showcase-media img{display:block;width:100%;height:100%;min-height:430px;object-fit:cover;object-position:center;}
.herbal-showcase-media:after{content:"";position:absolute;inset:auto 0 0;height:34%;background:linear-gradient(180deg,transparent,rgba(17,39,29,.48));pointer-events:none;}
.herbal-showcase-caption{position:absolute;left:1.25rem;bottom:1.1rem;z-index:2;color:#fff;display:flex;align-items:baseline;gap:.55rem;text-shadow:0 2px 14px rgba(0,0,0,.3);}
.herbal-showcase-caption strong{font-family:var(--display);font-size:1.1rem;letter-spacing:.03em;}.herbal-showcase-caption span{font-size:.7rem;opacity:.86;letter-spacing:.08em;text-transform:uppercase;}
@media(max-width:850px){.herbal-showcase-card{grid-template-columns:1fr;border-radius:24px;}.herbal-showcase-media{order:-1;}.herbal-showcase-media img{min-height:280px;max-height:58vw;object-position:center;}.herbal-showcase-copy{padding:1.45rem 1.15rem 1.6rem;}.herbal-showcase-copy h2{font-size:2rem;}.herbal-showcase-copy p{font-size:.88rem;}.herbal-showcase-copy .btn{width:100%;justify-content:center;}.herbal-showcase-caption{left:.9rem;bottom:.8rem;}}
@media(max-width:480px){.herbal-showcase{padding:2.2rem 0;}.herbal-showcase-card{border-radius:20px;}.herbal-showcase-media img{min-height:220px;max-height:none;height:58vw;}.herbal-showcase-copy h2{font-size:1.78rem;}.herbal-showcase-pills span{font-size:.63rem;padding:.42rem .55rem;}.herbal-showcase-caption strong{font-size:.9rem;}.herbal-showcase-caption span{font-size:.58rem;}}

/* V24.1 · Final admin polish: prevent cramped controls and improve mobile rhythm */
.admin-login-card{position:relative;overflow:hidden;}
.admin-login-card:before{content:"";position:absolute;inset:0 0 auto;height:5px;background:linear-gradient(90deg,#1e6341,#a78642,#1e6341);}
.admin-login-card form{margin-top:.25rem;}
.admin-login-card label span{display:block;line-height:1.2;}
.admin-login-card input{font-size:16px;}
.admin-login-card .btn{font-size:.86rem;}
.admin-top-inner{width:min(1180px,calc(100% - 2rem));}
.admin-content>.wrap{width:min(1180px,calc(100% - 2rem));}
@media(max-width:640px){.admin-top-inner,.admin-content>.wrap{width:calc(100% - 1.05rem);}.admin-login-card{width:min(100%,440px);}.admin-login-brand{margin-top:.2rem;}.admin-hero h1{max-width:10ch;}.admin-hero p{max-width:52ch;}.admin-stat-grid{grid-template-columns:repeat(2,minmax(0,1fr));}.admin-tools select{width:100%;}.admin-tool-actions{grid-template-columns:1fr 1fr;}.admin-tool-actions #clearRejected{grid-column:1/-1;}.moderation-card-head{display:block;}.moderation-actions .btn{min-height:44px;}}

/* ==========================================================================
   V24.2 PRODUCT HERO + DESKTOP RESPONSIVE POLISH
   ========================================================================== */
.herbal-showcase{
  padding:clamp(2.4rem,5vw,5.2rem) 0 clamp(3.2rem,6vw,6.2rem);
  background:linear-gradient(180deg,#f8f6ef 0%,#eef3eb 100%);
  overflow:hidden;
}
.herbal-showcase-card{
  display:grid;
  grid-template-columns:minmax(0,1.02fr) minmax(0,1.38fr);
  min-height:clamp(420px,42vw,600px);
  align-items:stretch;
  background:#fff;
  border:1px solid rgba(31,70,54,.11);
  border-radius:32px;
  overflow:hidden;
  box-shadow:0 30px 80px rgba(23,58,44,.12);
}
.herbal-showcase-copy{
  padding:clamp(2rem,4vw,4.4rem);
  display:flex; flex-direction:column; justify-content:center; align-items:flex-start;
}
.herbal-showcase-copy h2{
  max-width:10.5ch;
  font-size:clamp(2.15rem,4vw,3.7rem);
  line-height:1.02;
}
.herbal-showcase-copy p{max-width:38rem; font-size:clamp(.9rem,1.2vw,1rem); line-height:1.75;}
.herbal-showcase-media{position:relative; min-width:0; min-height:0; overflow:hidden; background:#e8e1d4;}
.herbal-showcase-media img{
  width:100%; height:100%; min-height:0; max-width:none; display:block;
  object-fit:cover; object-position:center center;
}
.herbal-showcase-media:after{
  content:""; position:absolute; inset:auto 0 0; height:38%;
  background:linear-gradient(180deg,transparent,rgba(17,39,29,.55)); pointer-events:none;
}
.herbal-showcase-caption{left:clamp(1rem,2vw,1.5rem); bottom:clamp(.85rem,1.8vw,1.3rem);}

/* Keep the brand hero clean and contained on wide screens. */
@media (min-width:960px){
  .hero{padding-top:clamp(64px,7vw,92px);padding-bottom:clamp(58px,7vw,84px);}
  .hero-main{grid-template-columns:minmax(0,1fr) minmax(360px,.9fr)!important;gap:clamp(2.5rem,5vw,6rem)!important;}
  .hero-copy{max-width:650px;}
  .hero-mark{min-width:0;min-height:440px;}
  .hero-mark .ring{width:min(430px,100%);min-width:0;}
}

/* Desktop product catalog: stable columns and cards that never overflow their grid. */
@media (min-width:901px){
  #featured .wrap{min-width:0;}
  .catalog-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:1.25rem;}
  .catalog-grid .product-card{min-width:0;overflow:hidden;}
  .catalog-grid .product-photo{min-height:260px;max-height:340px;overflow:hidden;}
  .catalog-grid .product-photo img{width:100%;height:100%;object-fit:cover;}
  .catalog-grid .product-body{min-width:0;}
}

/* Tablet / mobile: preserve the good stacked composition. */
@media (max-width:850px){
  .herbal-showcase-card{grid-template-columns:1fr;min-height:0;border-radius:24px;}
  .herbal-showcase-media{order:-1;height:auto;}
  .herbal-showcase-media img{height:auto;min-height:0;aspect-ratio:16/10;object-fit:cover;object-position:center;}
  .herbal-showcase-copy{padding:1.55rem 1.2rem 1.7rem;}
  .herbal-showcase-copy h2{max-width:none;font-size:clamp(1.9rem,7vw,2.6rem);}
}
@media (max-width:600px){
  .herbal-showcase{padding:2.15rem 0 2.8rem;}
  .herbal-showcase-card{border-radius:20px;}
  .herbal-showcase-media img{aspect-ratio:16/10;}
  .herbal-showcase-copy p{font-size:.88rem;line-height:1.7;}
  .herbal-showcase-copy .btn{width:100%;justify-content:center;}
}


/* ==========================================================================
   V24.3 FINAL · Desktop hero image integrity + herbal product anchors
   Mobile composition is preserved; desktop media never crops source artwork.
   ========================================================================== */
@media (min-width: 960px){
  .hero-main{
    display:grid !important;
    grid-template-columns:minmax(0,1.06fr) minmax(360px,.94fr) !important;
    align-items:center !important;
    gap:clamp(2.5rem,5vw,5.5rem) !important;
  }
  .hero-main .hero-copy{order:1;width:auto;max-width:650px;min-width:0;}
  .hero-main .hero-mark{order:2;width:100%;min-width:0;min-height:0;margin-top:0;padding:0;overflow:visible;}
  .hero-logo-stage{
    width:min(560px,100%);
    max-height:520px;
    margin-inline:auto;
    overflow:visible;
  }
  .hero-logo-stage img{
    width:100%;
    max-width:100%;
    max-height:520px;
    height:auto;
    object-fit:contain;
  }
}

/* The supplied 1400×788 herbal artwork must remain fully visible on desktop. */
@media (min-width: 851px){
  .herbal-showcase-card{
    grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);
  }
  .herbal-showcase-media{
    display:flex;
    align-items:center;
    justify-content:center;
    min-height:0;
    overflow:hidden;
    background:#e8e1d4;
  }
  .herbal-showcase-media img{
    width:100%;
    height:auto;
    min-height:0;
    max-height:none;
    object-fit:contain;
    object-position:center;
  }
}

/* Product pills are real navigation targets on both desktop and mobile. */
.herbal-showcase-pills a{
  display:inline-flex;
  align-items:center;
  text-decoration:none;
  padding:.48rem .68rem;
  border-radius:999px;
  background:#f0f5ee;
  border:1px solid #dbe6dc;
  color:#2c6148;
  font-size:.7rem;
  font-weight:800;
  transition:transform .2s ease, background .2s ease, box-shadow .2s ease;
}
.herbal-showcase-pills a:hover,
.herbal-showcase-pills a:focus-visible{
  background:#e5efe5;
  transform:translateY(-1px);
  box-shadow:0 8px 18px rgba(31,70,54,.10);
  outline:none;
}
[id^="product-"]{scroll-margin-top:110px;}
@media(max-width:480px){
  .herbal-showcase-pills a{font-size:.63rem;padding:.42rem .55rem;}
}

/* Referral quick access */
.mitra-referral-quick{
  display:flex;align-items:center;justify-content:space-between;gap:1.25rem;
  margin:1.25rem 0 1.5rem;padding:1.15rem 1.25rem;
  border:1px solid rgba(31,70,54,.12);border-radius:20px;
  background:rgba(255,255,255,.78);box-shadow:0 12px 30px rgba(31,70,54,.05);
}
.mitra-referral-quick strong,.mitra-referral-quick small{display:block;color:#173a2c;}
.mitra-referral-quick strong{margin:.18rem 0 .25rem;font-size:1.05rem;}
.mitra-referral-quick small{color:#68736c;line-height:1.5;}
.mitra-referral-quick .eyebrow{font-size:.68rem;}
@media(max-width:650px){
  .mitra-referral-quick{align-items:flex-start;flex-direction:column;}
  .mitra-referral-quick .btn{width:100%;justify-content:center;}
}

/* ==========================================================================
   V24.6 - Brand-first storytelling refresh
   ========================================================================== */
.hero-brand{padding-top:clamp(42px,7vw,82px);}
.hero-brand .hero-main{display:grid;grid-template-columns:1fr;gap:1.7rem;align-items:start;}
.hero-brand .hero-products{order:0;}
.hero-brand .hero-copy{order:1;max-width:980px;margin:0 auto;text-align:center;}
.hero-brand .hero-understand,.hero-brand .cta-row{justify-content:center;}
.hero-understand{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1.25rem;}
.hero-understand span{font-size:.76rem;font-weight:800;color:var(--forest-900);background:rgba(124,154,92,.13);border:1px solid rgba(124,154,92,.2);padding:.5rem .72rem;border-radius:999px;}
.hero-products{position:relative;padding:1.1rem;border-radius:30px;background:rgba(255,255,255,.72);border:1px solid rgba(31,70,54,.12);box-shadow:0 30px 70px -42px rgba(23,48,38,.55);backdrop-filter:blur(7px);}
.hero-products-head{display:flex;justify-content:space-between;align-items:flex-end;gap:1rem;padding:.35rem .35rem .95rem;}
.hero-products-head span{font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;font-weight:900;color:var(--gold-600);}
.hero-products-head strong{font-family:var(--display);font-size:1.15rem;color:var(--forest-950);text-align:right;}
.hero-product-row{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:.55rem;align-items:end;}
.hero-product{display:block;position:relative;min-width:0;border-radius:18px;overflow:hidden;background:var(--cream-200);box-shadow:0 14px 28px -20px rgba(23,48,38,.65);transform:translateY(5px);transition:transform .25s ease,box-shadow .25s ease;}
.hero-product:hover{transform:translateY(-5px);box-shadow:0 22px 36px -20px rgba(23,48,38,.6);}
.hero-product img{display:block;width:100%;aspect-ratio:4/5;object-fit:cover;}
.hero-product-tall img{aspect-ratio:3.6/5;}
.hero-product-wide img{aspect-ratio:4/5;}
.hero-product span{position:absolute;left:.35rem;right:.35rem;bottom:.35rem;padding:.38rem .42rem;border-radius:10px;background:rgba(23,48,38,.88);color:#fff;font-size:.58rem;line-height:1.2;font-weight:800;text-align:center;}
.hero-products-note{margin:.8rem .25rem .15rem;color:var(--muted);font-size:.7rem;line-height:1.5;text-align:center;}

.pillar-detailed-grid{gap:1.15rem;}
.pillar-detailed{padding:1.55rem 1.5rem 1.45rem;}
.pillar-top{display:flex;align-items:center;justify-content:space-between;}
.pillar-code{font-size:.66rem;font-weight:900;letter-spacing:.12em;color:var(--pillar-color,var(--sage-500));opacity:.8;}
.pillar-detail{margin-top:1rem;padding-top:.85rem;border-top:1px solid rgba(31,70,54,.09);}
.pillar-detail strong{display:block;font-size:.67rem;text-transform:uppercase;letter-spacing:.1em;color:var(--pillar-color,var(--sage-500));}
.pillar-detail p{margin-top:.28rem;font-size:.78rem;line-height:1.55;color:var(--forest-900);opacity:.78;}

.catalog-group{margin-top:2.6rem;}
.catalog-group:first-child{margin-top:0;}
.catalog-group-head{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:1rem;padding-bottom:.7rem;border-bottom:1px solid rgba(31,70,54,.12);}
.catalog-group-head span{font-family:var(--display);font-size:1.35rem;font-weight:600;color:var(--forest-950);}
.catalog-group-head small{font-size:.68rem;font-weight:800;color:var(--muted);}
.product-loka-badge{display:inline-flex;align-items:center;width:max-content;max-width:100%;padding:.35rem .58rem;border-radius:999px;background:rgba(124,154,92,.13);color:var(--forest-800);font-size:.63rem;font-weight:900;line-height:1.2;}
.catalog-group .product-grid{grid-template-columns:repeat(auto-fit,minmax(210px,1fr));}
.catalog-group .product-photo img{width:100%;height:100%;object-fit:cover;}
.catalog-group .product-photo{overflow:hidden;}
.catalog-group .product-body p{line-height:1.55;}

@media(max-width:1050px){
  .hero-product-row{grid-template-columns:repeat(4,minmax(0,1fr));}
  .hero-products{max-width:1100px;width:100%;margin:0 auto;}
}
@media(max-width:680px){
  .hero-products{padding:.75rem;border-radius:22px;}
  .hero-products-head{display:block;}
  .hero-products-head strong{display:block;margin-top:.25rem;text-align:left;font-size:1rem;}
  .hero-product-row{grid-template-columns:repeat(3,minmax(0,1fr));gap:.5rem;}
  .hero-product:nth-child(n+7){display:none;}
  .hero-product img,.hero-product-tall img{aspect-ratio:4/5;}
  .hero-product span{font-size:.55rem;}
  .pillar-detail p{font-size:.76rem;}
}

.story-process-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:.85rem;margin-top:2.2rem;}
.story-process-card{padding:1.2rem;border:1px solid rgba(255,255,255,.1);border-radius:18px;background:rgba(255,255,255,.045);}
.story-process-card>span{display:inline-flex;width:30px;height:30px;border-radius:50%;align-items:center;justify-content:center;background:var(--gold-500);color:var(--forest-950);font-size:.63rem;font-weight:900;}
.story-process-card strong{display:block;margin-top:.8rem;color:#fff;font-size:.92rem;}
.story-process-card p{margin-top:.45rem;color:rgba(255,255,255,.68);font-size:.74rem;line-height:1.6;}
.story-ecosystem .pull-quote{max-width:820px;margin:2.4rem auto 0;}
@media(max-width:900px){.story-process-grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:600px){.story-process-grid{grid-template-columns:1fr;}}


/* ==========================================================================
   V24.8 - TEH DWI PRODUCT VISIBILITY FIX
   ========================================================================== */
.hero-products{padding:0;background:transparent;border:0;box-shadow:none;backdrop-filter:none;}
.hero-product-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem;align-items:start;}
.hero-product{display:flex;flex-direction:column;position:relative;min-width:0;overflow:hidden;border-radius:22px;background:#fff;border:1px solid rgba(31,70,54,.11);box-shadow:0 18px 34px -24px rgba(23,48,38,.42);transform:none;}
.hero-product:hover{transform:translateY(-4px);box-shadow:0 24px 40px -22px rgba(23,48,38,.45);}
.hero-product img{display:block;width:100%;height:270px;aspect-ratio:auto;object-fit:contain;background:#f8f5eb;padding:.55rem;}
.hero-product span{position:static;display:flex;align-items:center;justify-content:center;min-height:54px;padding:.7rem .65rem;background:#fff;color:var(--forest-950);font-size:.72rem;line-height:1.3;font-weight:800;text-align:center;border-top:1px solid rgba(31,70,54,.08);}
.hero-products-note{margin:1rem 0 0;color:var(--muted);font-size:.78rem;line-height:1.55;text-align:center;}
.hero-brand .hero-copy{padding-top:.2rem;}
.hero-brand .hero-copy h1{max-width:980px;margin-left:auto;margin-right:auto;}
.product-photo{background:#f8f5eb;}
#productCatalog .product-photo img,.catalog-grid .product-photo img,.catalog-group .product-photo img{display:block;width:100%;height:100%;max-height:none;object-fit:contain;object-position:center;padding:.55rem;}
.catalog-grid .product-photo,.catalog-group .product-photo{background:#f8f5eb;}
.pillar-detail strong{letter-spacing:.08em;}
@media(max-width:1050px){
  .hero-product-row{grid-template-columns:repeat(3,minmax(0,1fr));}
  .hero-product img{height:250px;}
}
@media(max-width:680px){
  .hero-products{padding:0;}
  .hero-product-row{grid-template-columns:repeat(2,minmax(0,1fr));gap:.7rem;}
  .hero-product:nth-child(n+7){display:flex;}
  .hero-product img{height:205px;padding:.45rem;}
  .hero-product span{font-size:.65rem;min-height:48px;padding:.55rem .45rem;}
  .hero-products-note{font-size:.7rem;}
  .catalog-grid .product-photo,.catalog-group .product-photo{min-height:260px;max-height:none;height:280px;}
  .catalog-grid .product-photo img,.catalog-group .product-photo img{height:100%;object-fit:contain;}
}
@media(max-width:390px){
  .hero-product img{height:185px;}
  .hero-product span{font-size:.61rem;}
}


/* V24.9 final mobile-first hero cleanup after Teh Dwi review */
.hero-brand{padding-top:clamp(28px,5vw,58px);padding-bottom:2.5rem;}
.hero-brand .hero-main{display:flex!important;flex-direction:column!important;gap:1.9rem!important;align-items:stretch!important;}
.hero-brand .hero-products{order:1!important;width:100%;max-width:1180px;margin:0 auto;}
.hero-brand .hero-copy{order:2!important;width:100%;max-width:920px;margin:0 auto;text-align:center;padding-top:.25rem;}
.hero-brand .hero-copy h1{max-width:820px;margin:.55rem auto 1rem;font-size:clamp(2.2rem,5vw,4.25rem);line-height:1.02;}
.hero-brand .hero-copy .lede{max-width:760px;margin-left:auto;margin-right:auto;}
.hero-brand .hero-understand,.hero-brand .cta-row{justify-content:center;}
.hero-products{padding:.9rem!important;border-radius:28px!important;background:rgba(255,255,255,.58)!important;border:1px solid rgba(31,70,54,.10)!important;box-shadow:0 22px 55px -35px rgba(23,48,38,.38)!important;backdrop-filter:blur(5px)!important;}
.hero-product-row{grid-template-columns:repeat(6,minmax(0,1fr))!important;gap:.75rem!important;align-items:stretch!important;}
.hero-product{min-width:0;border-radius:18px!important;background:#fff!important;box-shadow:0 12px 28px -22px rgba(23,48,38,.48)!important;text-decoration:none!important;}
.hero-product img{width:100%!important;height:250px!important;aspect-ratio:1/1.12!important;object-fit:contain!important;object-position:center!important;background:#f8f5eb!important;padding:.55rem!important;}
.hero-product span{position:static!important;display:flex!important;align-items:center!important;justify-content:center!important;min-height:52px!important;padding:.62rem .5rem!important;background:#fff!important;color:var(--forest-950)!important;border-top:1px solid rgba(31,70,54,.08)!important;font-size:.68rem!important;line-height:1.25!important;font-weight:800!important;text-align:center!important;text-decoration:none!important;}
.hero-products-note{margin:.75rem .2rem .05rem!important;font-size:.7rem!important;color:var(--muted)!important;text-align:center!important;}
@media(max-width:1050px){.hero-product-row{grid-template-columns:repeat(3,minmax(0,1fr))!important;}.hero-product img{height:235px!important;}}
@media(max-width:680px){
  .hero-brand{padding-top:20px;}
  .hero-brand .hero-main{gap:1.35rem!important;}
  .hero-products{padding:.55rem!important;border-radius:22px!important;}
  .hero-product-row{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:.65rem!important;}
  .hero-product img{height:185px!important;aspect-ratio:1/1.08!important;padding:.45rem!important;}
  .hero-product span{min-height:48px!important;font-size:.63rem!important;padding:.5rem .4rem!important;}
  .hero-products-note{font-size:.65rem!important;line-height:1.45!important;}
  .hero-brand .hero-copy h1{font-size:clamp(2.05rem,9vw,3rem);line-height:1.04;}
  .hero-brand .hero-copy .lede{font-size:.96rem;line-height:1.65;}
}
@media(max-width:390px){.hero-product img{height:165px!important;}.hero-product span{font-size:.59rem!important;}}

/* Remove long dash characters from visible brand storytelling copy */


/* ========================================================================
   V24.10 - WAJAH LOKA BUMI / PREMIUM PRODUCT INTRO
   ======================================================================== */
.hero-brand .hero-main{gap:1.35rem!important;}
.hero-brand .hero-products{
  order:1!important;
  width:100%;
  max-width:1180px;
  margin:0 auto;
  padding:clamp(1rem,2.2vw,1.55rem)!important;
  border-radius:32px!important;
  background:rgba(255,253,246,.94)!important;
  border:1px solid rgba(31,70,54,.10)!important;
  box-shadow:0 28px 70px -42px rgba(23,48,38,.48), inset 0 1px 0 rgba(255,255,255,.9)!important;
  backdrop-filter:none!important;
}
.hero-products-heading{
  text-align:left;
  padding:.15rem .2rem 1rem;
}
.hero-products-heading .eyebrow{
  display:inline-block;
  margin-bottom:.35rem;
  color:#a67d2f;
  font-size:.67rem;
  font-weight:900;
  letter-spacing:.16em;
}
.hero-products-heading h2{
  margin:0;
  color:var(--forest-950);
  font-family:var(--display);
  font-size:clamp(1.55rem,3vw,2.35rem);
  line-height:1.08;
  letter-spacing:-.02em;
}
.hero-products-heading p{
  margin:.45rem 0 0;
  max-width:720px;
  color:var(--muted);
  font-size:.82rem;
  line-height:1.55;
}
.hero-product-row{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:1rem!important;
  align-items:stretch!important;
}
.hero-product{
  display:flex!important;
  flex-direction:column!important;
  min-width:0!important;
  overflow:hidden!important;
  border-radius:22px!important;
  background:#fff!important;
  border:1px solid rgba(31,70,54,.10)!important;
  box-shadow:0 18px 38px -28px rgba(23,48,38,.52)!important;
  text-decoration:none!important;
}
.hero-product:hover{transform:translateY(-4px)!important;}
.hero-product img{
  display:block!important;
  width:100%!important;
  height:245px!important;
  aspect-ratio:auto!important;
  object-fit:contain!important;
  object-position:center!important;
  background:#f7f4ea!important;
  padding:.7rem!important;
}
.hero-product span{
  position:static!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:58px!important;
  padding:.72rem .7rem!important;
  background:#fff!important;
  color:var(--forest-950)!important;
  border-top:1px solid rgba(31,70,54,.08)!important;
  font-size:.72rem!important;
  line-height:1.3!important;
  font-weight:850!important;
  text-align:center!important;
}
@media(max-width:1050px){
  .hero-product-row{grid-template-columns:repeat(3,minmax(0,1fr))!important;}
  .hero-product img{height:225px!important;}
}
@media(max-width:680px){
  .hero-brand{padding-top:18px!important;}
  .hero-brand .hero-products{padding:.8rem!important;border-radius:25px!important;}
  .hero-products-heading{padding:.05rem .15rem .8rem;}
  .hero-products-heading h2{font-size:1.55rem;}
  .hero-products-heading p{font-size:.73rem;line-height:1.5;}
  .hero-product-row{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:.65rem!important;}
  .hero-product{border-radius:18px!important;}
  .hero-product img{height:185px!important;padding:.5rem!important;}
  .hero-product span{min-height:50px!important;font-size:.63rem!important;padding:.55rem .42rem!important;}
}
@media(max-width:390px){
  .hero-product img{height:168px!important;}
  .hero-product span{font-size:.59rem!important;}
}

/* Brand story headline polish */
#pillars .section-head h2{
  max-width:900px;
  margin-left:auto;
  margin-right:auto;
  letter-spacing:-.025em;
  line-height:1.06;
}

/* ========================================================================
   V24.14 - MASTER FROM V24.11 + PRODUCT CATALOG + SEO + RESPONSIVE UX
   ======================================================================== */
.site-header .brand{display:flex;align-items:center;min-width:0;text-decoration:none;}
.site-header .brand>img{display:block;width:190px;height:58px;object-fit:contain;object-position:left center;}
.site-header .brand-text{display:none;}
@media(max-width:680px){.site-header .brand>img{width:158px;height:56px;}}

.loka-entry{position:fixed;inset:0;z-index:9999;display:grid;place-items:center;padding:24px;background:
  radial-gradient(circle at 50% 18%,rgba(190,155,75,.18),transparent 28%),
  linear-gradient(135deg,#102d23 0%,#163f2f 48%,#0b241c 100%);transition:opacity .5s ease,visibility .5s ease;}
.loka-entry[hidden]{display:none;}
.loka-entry.is-leaving{opacity:0;visibility:hidden;}
.loka-entry-card{width:min(560px,92vw);padding:clamp(28px,6vw,52px) clamp(24px,6vw,54px);text-align:center;border:1px solid rgba(218,185,91,.3);border-radius:34px;background:rgba(255,253,246,.97);box-shadow:0 36px 100px rgba(0,0,0,.35);}
.loka-entry-logo{display:flex;justify-content:center;margin:0 auto 8px;}
.loka-entry-logo img{display:block;width:min(290px,70vw);height:auto;max-height:180px;object-fit:contain;}
.loka-entry-kicker{display:inline-block;color:#a67d2f;font-size:.68rem;font-weight:900;letter-spacing:.22em;}
.loka-entry-card h1{margin:.7rem 0 .55rem;color:#173026;font-family:var(--display);font-size:clamp(1.7rem,5vw,2.7rem);line-height:1.04;}
.loka-entry-card p{margin:0 auto;max-width:420px;color:#5f6b62;font-size:.94rem;line-height:1.65;}
.loka-entry-actions{display:grid;grid-template-columns:1fr 1fr;gap:.7rem;margin:1.35rem auto .8rem;max-width:460px;}
.loka-entry-btn{min-height:50px;display:inline-flex;align-items:center;justify-content:center;gap:.35rem;padding:.85rem 1rem;border:0;border-radius:999px;text-decoration:none;font:800 .78rem/1.1 system-ui,sans-serif;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease,background .2s ease;}
.loka-entry-btn-primary{background:#173f2f;color:#fffdf6;box-shadow:0 14px 30px rgba(23,63,47,.24);}
.loka-entry-btn-launch{background:#f7f0df;color:#173f2f;border:1px solid rgba(177,139,61,.28);box-shadow:0 10px 24px rgba(177,139,61,.1);}
.loka-entry-btn:hover{transform:translateY(-2px);box-shadow:0 18px 34px rgba(23,63,47,.2);}
.loka-entry-card small{display:block;color:#7b857d;font-size:.66rem;line-height:1.45;}
body.entry-open{overflow:hidden;}

/* Make the Wajah LOKA BUMI section read as the homepage's premium face. */
.hero-products-heading{position:relative;padding-left:.4rem;padding-right:.4rem;}
.hero-products-heading:after{content:"";display:block;width:74px;height:2px;margin-top:.8rem;background:linear-gradient(90deg,#b18b3d,rgba(177,139,61,0));}
.hero-products-heading h2{text-transform:none;}
.hero-product img{background:linear-gradient(180deg,#fbf9f1,#f4f0e3)!important;}
.hero-product span{font-family:system-ui,sans-serif;}

@media(max-width:680px){
  
  .loka-entry-card{border-radius:28px;padding:28px 20px;}
  .loka-entry-logo img{width:min(240px,68vw);max-height:145px;}
  .loka-entry-actions{grid-template-columns:1fr;max-width:360px;}
}


/* V24.16 catalog UX, cart, checkout, and responsive polish */
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important;}
.catalog-toolbar{display:grid;grid-template-columns:minmax(220px,1fr) auto;gap:1rem;align-items:center;margin:1.5rem 0 2rem;padding:1rem;border:1px solid rgba(31,70,54,.1);border-radius:20px;background:rgba(255,255,255,.78);box-shadow:0 12px 32px -28px rgba(23,48,38,.35);}
.catalog-search-wrap{min-width:0;}
.catalog-search{width:100%;min-height:48px;border:1px solid rgba(31,70,54,.16);border-radius:14px;background:#fff;padding:.75rem 1rem;color:var(--forest-900);font:inherit;font-size:.86rem;outline:none;transition:border-color .2s,box-shadow .2s;}
.catalog-search::placeholder{color:#87928b;}
.catalog-search:focus{border-color:var(--gold-500);box-shadow:0 0 0 4px rgba(199,154,69,.14);}
.catalog-filters{display:flex;gap:.45rem;flex-wrap:wrap;justify-content:flex-end;}
.catalog-filter{border:1px solid rgba(31,70,54,.12);background:#fff;color:var(--forest-900);border-radius:999px;padding:.62rem .75rem;cursor:pointer;font:inherit;font-size:.67rem;font-weight:800;white-space:nowrap;transition:all .2s ease;}
.catalog-filter span{display:inline-grid;place-items:center;min-width:20px;height:20px;margin-left:.25rem;border-radius:999px;background:#eef1eb;color:#526057;font-size:.58rem;}
.catalog-filter:hover{transform:translateY(-1px);border-color:rgba(31,70,54,.25);}
.catalog-filter.is-active{background:var(--forest-900);color:#fff;border-color:var(--forest-900);box-shadow:0 8px 18px -14px rgba(23,48,38,.8);}
.catalog-filter.is-active span{background:rgba(255,255,255,.14);color:#fff;}
.catalog-group{margin-top:2.5rem;scroll-margin-top:6rem;}
.catalog-group:first-child{margin-top:0;}
.catalog-group-head{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.9rem 0 .7rem;border-bottom:1px solid rgba(31,70,54,.11);}
.catalog-group-head>div{display:flex;align-items:center;gap:.75rem;min-width:0;}
.catalog-group-icon{width:42px;height:42px;display:grid;place-items:center;border-radius:13px;background:var(--cream-200);font-size:1.25rem;flex:0 0 42px;}
.catalog-group-head strong{display:block;color:var(--forest-950);font-family:var(--display);font-size:1.25rem;}
.catalog-group-head small{display:block;margin-top:.12rem;color:var(--muted);font-size:.66rem;}
.catalog-group-count{flex:0 0 auto;padding:.45rem .7rem;border-radius:999px;background:#f0f3ed;color:var(--forest-800);font-size:.62rem;font-weight:900;}
.catalog-group-description{max-width:780px;margin:.75rem 0 1rem;color:var(--muted);font-size:.76rem;line-height:1.7;}
.catalog-grid .product-grid{align-items:stretch;}
.catalog-grid .product-card{overflow:hidden;min-width:0;}
.catalog-grid .product-photo{position:relative;aspect-ratio:4/3;min-height:0;overflow:hidden;background:#f1f3ed;}
.catalog-grid .product-photo img{display:block;width:100%;height:100%;object-fit:contain;object-position:center;padding:.45rem;transition:transform .5s ease;}
.catalog-grid .product-card:hover .product-photo img{transform:scale(1.02);}
.product-photo-label{position:absolute;left:.75rem;bottom:.75rem;padding:.38rem .55rem;border-radius:999px;background:rgba(16,35,27,.78);backdrop-filter:blur(8px);color:#fff;font-size:.58rem;font-weight:800;letter-spacing:.04em;}
.catalog-grid .product-body{display:flex;flex-direction:column;height:calc(100% - 0px);}
.catalog-grid .product-body p{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;min-height:3.8em;}
.catalog-grid .product-link{margin-top:auto;padding-top:.8rem;display:inline-flex;align-items:center;gap:.3rem;}
.catalog-empty-state{display:grid;justify-items:center;text-align:center;gap:.55rem;padding:3rem 1rem;border:1px dashed rgba(31,70,54,.18);border-radius:20px;background:#fbfaf5;color:var(--muted);}
.catalog-empty-state strong{color:var(--forest-900);font-size:1rem;}
.catalog-empty-state .btn{margin-top:.6rem;}
.catalog-noscript{padding:1.2rem;border:1px solid rgba(31,70,54,.1);border-radius:16px;background:#fff;}
.catalog-noscript h3{color:var(--forest-900);margin:0 0 .45rem;}
.catalog-noscript p,.catalog-noscript li{font-size:.8rem;color:var(--muted);line-height:1.7;}
.catalog-noscript ul{padding-left:1.2rem;margin-top:.7rem;}
@media(max-width:1100px){.catalog-toolbar{grid-template-columns:1fr;}.catalog-filters{justify-content:flex-start;}}
@media(max-width:900px){.catalog-grid .product-grid{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media(max-width:620px){.catalog-toolbar{padding:.75rem;border-radius:16px;margin-bottom:1.3rem;}.catalog-filters{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.4rem;}.catalog-filter{width:100%;}.catalog-group-head{align-items:flex-start;}.catalog-group-count{font-size:.56rem;}.catalog-grid .product-grid{grid-template-columns:1fr;gap:.85rem;}.catalog-grid .product-photo{aspect-ratio:4/3;}.catalog-group{margin-top:2rem;}.catalog-group-head strong{font-size:1.08rem;}.catalog-group-description{font-size:.72rem;}.product-modal-close{position:sticky;top:0;z-index:4;}}
@media(prefers-reduced-motion:reduce){.catalog-grid .product-photo img{transition:none}.catalog-filter{transition:none}}


/* V24.16 floating controls: WhatsApp right, cart above WhatsApp */
.wa-float{right:20px;left:auto;bottom:20px;}
.cart-float{position:fixed;right:20px;bottom:90px;z-index:5001;width:52px;height:52px;border:0;border-radius:50%;background:var(--forest-900);color:#fff;display:grid;place-items:center;font-size:1.15rem;box-shadow:0 14px 30px -12px rgba(23,48,38,.55);cursor:pointer;}
.cart-float span{position:absolute;right:-3px;top:-3px;min-width:20px;height:20px;padding:0 5px;border-radius:999px;background:#c79a45;color:#fff;font:800 11px/20px system-ui;text-align:center;box-sizing:border-box;}
.cart-float span[hidden]{display:none;}
.cart-drawer{position:fixed;inset:0;z-index:6000;pointer-events:none;visibility:hidden;}
.cart-drawer.open{pointer-events:auto;visibility:visible;}
.cart-drawer-backdrop{position:absolute;inset:0;background:rgba(8,18,13,.62);opacity:0;transition:opacity .25s ease;backdrop-filter:blur(5px);}
.cart-drawer.open .cart-drawer-backdrop{opacity:1;}
.cart-panel{position:absolute;right:0;top:0;height:100%;width:min(500px,94vw);background:#fffdf8;box-shadow:-24px 0 70px rgba(0,0,0,.2);transform:translateX(102%);transition:transform .3s ease;overflow:auto;padding:1.25rem;box-sizing:border-box;}
.cart-drawer.open .cart-panel{transform:translateX(0);}
.cart-head{display:flex;justify-content:space-between;gap:1rem;align-items:flex-start;padding-bottom:1rem;border-bottom:1px solid rgba(31,70,54,.1);}
.cart-head h2{margin:.25rem 0 0;font-family:var(--display);color:var(--forest-950);font-size:1.5rem;}
.cart-close{width:40px;height:40px;border:0;border-radius:50%;background:#eef1eb;color:var(--forest-900);font-size:1.4rem;cursor:pointer;}
.cart-items{display:grid;gap:.7rem;padding:1rem 0;}
.cart-item{display:grid;grid-template-columns:68px 1fr 28px;gap:.75rem;align-items:center;padding:.7rem;border:1px solid rgba(31,70,54,.1);border-radius:16px;background:#fff;}
.cart-item img{width:68px;height:68px;object-fit:contain;background:#f6f4eb;border-radius:12px;}
.cart-item-main{min-width:0;}
.cart-item-main strong{display:block;color:var(--forest-950);font-size:.82rem;}
.cart-item-main small{display:block;color:var(--muted);font-size:.62rem;margin-top:.18rem;}
.cart-item-bottom{display:flex;align-items:center;justify-content:space-between;gap:.5rem;margin-top:.5rem;font-size:.68rem;font-weight:800;color:var(--forest-900);}
.cart-qty{display:flex;align-items:center;gap:.3rem;border:1px solid rgba(31,70,54,.12);border-radius:999px;padding:.16rem;}
.cart-qty button{border:0;background:#eef1eb;color:var(--forest-900);width:25px;height:25px;border-radius:50%;cursor:pointer;font-weight:900;}
.cart-qty span{min-width:20px;text-align:center;}
.cart-remove{border:0;background:transparent;color:#8c4a3b;font-size:1.25rem;cursor:pointer;}
.cart-empty{display:grid;justify-items:center;text-align:center;gap:.35rem;padding:3rem 1rem;color:var(--muted);}
.cart-empty div{font-size:2rem;}
.cart-empty strong{color:var(--forest-900);}
.cart-empty span{font-size:.72rem;}
.cart-summary{border-top:1px solid rgba(31,70,54,.1);border-bottom:1px solid rgba(31,70,54,.1);padding:.85rem 0;display:grid;gap:.45rem;}
.cart-summary>div{display:flex;justify-content:space-between;gap:1rem;color:var(--muted);font-size:.72rem;}
.cart-summary strong{color:var(--forest-900);}
.cart-summary .cart-total{padding-top:.45rem;margin-top:.25rem;border-top:1px dashed rgba(31,70,54,.12);font-size:.9rem;color:var(--forest-950);}
.checkout-form{display:grid;gap:.75rem;padding-top:1rem;}
.checkout-form label{display:grid;gap:.35rem;}
.checkout-form label>span{font-size:.68rem;font-weight:800;color:var(--forest-900);}
.checkout-form input,.checkout-form textarea{width:100%;box-sizing:border-box;border:1px solid rgba(31,70,54,.14);border-radius:12px;background:#fff;padding:.75rem .8rem;font:inherit;font-size:.78rem;color:var(--forest-950);outline:none;}
.checkout-form input:focus,.checkout-form textarea:focus{border-color:#c79a45;box-shadow:0 0 0 3px rgba(199,154,69,.12);}
.checkout-note{display:grid;gap:.2rem;padding:.8rem;border-radius:14px;background:#f5f2e8;color:var(--muted);font-size:.68rem;line-height:1.5;}
.checkout-note strong{color:var(--forest-900);font-size:.75rem;}
.payment-placeholder{display:flex;gap:.65rem;align-items:flex-start;padding:.75rem;border:1px dashed rgba(31,70,54,.18);border-radius:14px;background:#fbfaf5;}
.payment-placeholder>span{font-size:1.2rem;}
.payment-placeholder div{display:grid;gap:.15rem;}
.payment-placeholder strong{font-size:.7rem;color:var(--forest-900);}
.payment-placeholder small{font-size:.62rem;color:var(--muted);line-height:1.5;}
.checkout-submit{width:100%;justify-content:center;text-align:center;}
.product-buy-box{display:grid;gap:.75rem;padding:1rem;border-radius:18px;background:#f5f2e8;border:1px solid rgba(31,70,54,.1);}
.product-price-line,.product-qty-row{display:flex;align-items:center;justify-content:space-between;gap:1rem;}
.product-price-line span,.product-qty-row>label{font-size:.72rem;color:var(--muted);font-weight:700;}
.product-price-line strong{font-size:1rem;color:var(--forest-900);}
.qty-control{display:flex;align-items:center;gap:.3rem;border:1px solid rgba(31,70,54,.14);border-radius:999px;background:#fff;padding:.18rem;}
.qty-control button{width:30px;height:30px;border:0;border-radius:50%;background:#edf1ea;color:var(--forest-900);font-weight:900;font-size:1rem;cursor:pointer;}
.qty-control input{width:45px;border:0;text-align:center;background:transparent;font-weight:800;color:var(--forest-900);font:inherit;outline:none;}
.product-add-cart{justify-content:center;}
@media(max-width:680px){
  .wa-float{right:14px;left:auto;bottom:14px;width:54px;height:54px;}
  .cart-float{right:14px;bottom:76px;width:48px;height:48px;}
  .cart-panel{width:100%;padding:.95rem;}
}
.btn-soft{display:inline-flex;align-items:center;justify-content:center;gap:.4rem;border:1px solid rgba(31,70,54,.14);background:#eef1eb;color:var(--forest-900);text-decoration:none;border-radius:999px;padding:.72rem 1rem;font:800 .72rem/1 system-ui,sans-serif;}
.btn-soft:hover{transform:translateY(-1px);background:#e5eae1;}

/* V24.16 payment presentation: BNI + QRIS, copy-friendly and mobile safe */
.payment-box{display:grid;gap:.8rem;margin-top:.8rem;padding:1rem;border:1px solid rgba(31,70,54,.12);border-radius:18px;background:linear-gradient(145deg,#fffdf7,#f7f4e9);box-shadow:0 10px 30px rgba(23,48,38,.06);}
.payment-box-head{display:flex;gap:.7rem;align-items:flex-start;}
.payment-icon{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;background:#eef4ed;font-size:1.05rem;flex:none;}
.payment-box-head strong{display:block;color:var(--forest-950);font-size:.82rem;}
.payment-box-head small,.payment-bank-card small,.payment-qris-card small{display:block;color:var(--muted);font-size:.64rem;line-height:1.45;margin-top:.18rem;}
.payment-bank-card{display:flex;justify-content:space-between;align-items:center;gap:.8rem;padding:.85rem;border-radius:14px;background:#fff;border:1px solid rgba(31,70,54,.1);}
.payment-label{display:block;font-size:.58rem;font-weight:900;letter-spacing:.09em;color:#8a6a2c;margin-bottom:.2rem;}
.payment-bank-card strong{display:block;font-size:1.1rem;letter-spacing:.05em;color:var(--forest-950);user-select:text;}
.copy-account-btn{border:1px solid rgba(31,70,54,.14);background:#eef4ed;color:var(--forest-900);font-weight:900;border-radius:999px;padding:.55rem .75rem;cursor:pointer;white-space:nowrap;}
.copy-account-btn:hover{transform:translateY(-1px);}
.payment-divider{display:flex;align-items:center;gap:.6rem;color:var(--muted);font-size:.62rem;font-weight:800;}
.payment-divider:before,.payment-divider:after{content:"";height:1px;background:rgba(31,70,54,.1);flex:1;}
.payment-qris-card{display:grid;grid-template-columns:1fr 150px;gap:.8rem;align-items:center;padding:.85rem;border-radius:14px;background:#fff;border:1px solid rgba(31,70,54,.1);}
.payment-qris-card strong{display:block;color:var(--forest-950);font-size:.76rem;}
.payment-qris-link{display:block;border-radius:12px;overflow:hidden;background:#fff;border:1px solid rgba(31,70,54,.1);}
.payment-qris-link img{display:block;width:100%;height:auto;aspect-ratio:auto;object-fit:contain;}
.payment-demo-note{color:#8a6a2c;font-size:.6rem;line-height:1.45;}
@media(max-width:560px){.payment-bank-card{align-items:flex-start;}.payment-bank-card strong{font-size:1rem;}.payment-qris-card{grid-template-columns:1fr 120px;}.copy-account-btn{padding:.5rem .65rem;font-size:.68rem;}}

/* V24.24 presentation refinements: featured-six, variant checkout, visible footer brand */
.catalog-more-wrap{display:flex;justify-content:center;margin-top:1.15rem;padding-top:.15rem;}
.catalog-more-btn{min-width:220px;justify-content:center;font-weight:800;}
.catalog-more-btn span{font-size:1rem;line-height:1;transition:transform .2s ease;}
.catalog-more-btn:hover span{transform:translateY(2px);}
.product-variant-row{display:grid;gap:.38rem;margin:.85rem 0 .65rem;}
.product-variant-row label{font-size:.7rem;font-weight:850;color:var(--forest-900);}
.product-variant-select{width:100%;min-height:46px;border:1px solid rgba(31,70,54,.14);border-radius:13px;background:#fff;padding:.7rem .8rem;color:var(--forest-950);font:700 .78rem/1.2 system-ui,sans-serif;outline:none;}
.product-variant-select:focus{border-color:rgba(31,70,54,.42);box-shadow:0 0 0 3px rgba(31,70,54,.08);}
.cart-item-main small b{font-weight:850;color:var(--forest-900);}
.footer-brand{display:grid;justify-items:center;text-align:center;}
.footer-logo{display:block;width:min(250px,72vw);height:auto;max-height:120px;object-fit:contain;filter:drop-shadow(0 8px 18px rgba(0,0,0,.08));}
.footer-brand p{text-align:center;max-width:380px;}
@media(max-width:620px){
  .catalog-more-btn{width:100%;min-width:0;}
  .footer-logo{width:min(220px,74vw);max-height:105px;}
  .footer-brand p{font-size:.82rem;}
}


/* V24.25 footer + music removal refinements */
footer .wrap{width:min(1180px,calc(100% - 32px));margin-inline:auto;}
.footer-top{flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:1.6rem;}
.footer-brand{width:100%;max-width:520px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;}
.footer-logo{display:block;width:min(255px,78vw);height:auto;max-height:150px;object-fit:contain;padding:14px 18px;background:var(--cream-100);border:1px solid rgba(177,145,63,.22);border-radius:22px;box-shadow:0 14px 34px rgba(0,0,0,.20);}
.footer-brand p{margin-top:.9rem;text-align:center;max-width:520px;}
.footer-support{width:100%;max-width:520px;align-items:center;text-align:center;}
.footer-support-label,.footer-support-note{text-align:center;}
.footer-quote{max-width:520px;text-align:center;margin:0 auto;}
.footer-bottom{flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:.4rem;padding-top:1.45rem;}
@media(max-width:620px){
  footer .wrap{width:min(100% - 24px,520px);}
  .footer-top{gap:1.35rem;padding-bottom:1.8rem;}
  .footer-logo{width:min(225px,82vw);max-height:128px;padding:12px 14px;border-radius:18px;}
  .footer-brand p{font-size:.82rem;line-height:1.6;}
  .footer-support-label{font-size:.66rem;line-height:1.5;}
  .footer-support-note{font-size:.68rem;line-height:1.5;}
  .footer-quote{font-size:.95rem;line-height:1.5;}
  .footer-bottom{font-size:.72rem;line-height:1.45;}
}

/* V24.26 · Offline launching journal: 26 August 2026 */
.launch-journal-section{padding:5.5rem 0;background:linear-gradient(180deg,#fffaf0 0%,#f5f0e3 100%);position:relative;overflow:hidden;}
.launch-journal-section::before{content:"";position:absolute;inset:auto -8% -35% auto;width:38rem;height:38rem;border-radius:50%;background:radial-gradient(circle,rgba(190,160,86,.12),transparent 68%);pointer-events:none;}
.launch-journal-head{max-width:820px;margin-inline:auto;text-align:center;}
.launch-journal-head .eyebrow{justify-content:center;}
.launch-journal-feature{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(300px,.88fr);gap:2.2rem;align-items:center;margin-top:2.5rem;padding:1rem;border:1px solid rgba(31,70,54,.11);border-radius:30px;background:rgba(255,255,255,.72);box-shadow:0 22px 60px rgba(30,57,43,.08);}
.launch-journal-photo-wrap{position:relative;overflow:hidden;border-radius:22px;background:#e7e0d1;aspect-ratio:865/1536;max-height:650px;}
.launch-journal-photo{display:block;width:100%;height:100%;object-fit:cover;object-position:center 45%;}
.launch-journal-photo-badge{position:absolute;left:1rem;bottom:1rem;padding:.55rem .8rem;border-radius:999px;background:rgba(20,62,46,.9);color:#fffaf0;font:700 .68rem/1.1 inherit;letter-spacing:.09em;box-shadow:0 10px 24px rgba(0,0,0,.16);}
.launch-journal-copy{padding:1.2rem 1.2rem 1.2rem .5rem;}
.launch-journal-copy h3{margin:.7rem 0 1rem;font-family:var(--display);font-size:clamp(1.55rem,3vw,2.35rem);line-height:1.05;color:var(--forest-950);}
.launch-journal-copy p{color:var(--muted);line-height:1.8;}
.launch-journal-timeline{display:grid;gap:.7rem;margin-top:1.5rem;}
.launch-journal-timeline div{display:grid;grid-template-columns:105px 1fr;gap:.8rem;align-items:center;padding:.8rem .9rem;border-radius:15px;background:var(--cream-200);border:1px solid rgba(31,70,54,.08);}
.launch-journal-timeline strong{font-size:.75rem;color:var(--forest-900);letter-spacing:.04em;}
.launch-journal-timeline span{font-size:.72rem;color:var(--muted);}
.launch-journal-video-head{display:flex;justify-content:space-between;align-items:end;gap:1rem;margin-top:3.3rem;}
.launch-journal-video-head h3{margin:.35rem 0 0;color:var(--forest-950);font-family:var(--display);font-size:1.35rem;}
.launch-journal-video-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;margin-top:1.1rem;}
.launch-video-card{padding:0;text-align:left;border:1px solid rgba(31,70,54,.11);border-radius:22px;overflow:hidden;background:#fffdf8;cursor:pointer;box-shadow:0 12px 32px rgba(30,57,43,.06);transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease;}
.launch-video-card:hover{transform:translateY(-3px);box-shadow:0 18px 40px rgba(30,57,43,.12);border-color:rgba(31,70,54,.22);}
.launch-video-card:focus-visible{outline:3px solid rgba(193,154,67,.55);outline-offset:3px;}
.launch-video-media{position:relative;display:block;aspect-ratio:9/16;background:#17291f;overflow:hidden;}
.launch-video-media img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .3s ease;}
.launch-video-card:hover .launch-video-media img{transform:scale(1.035);}
.launch-video-play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:54px;height:54px;border-radius:50%;display:grid;place-items:center;background:rgba(255,250,240,.94);color:var(--forest-900);font-size:1rem;padding-left:3px;box-shadow:0 12px 28px rgba(0,0,0,.2);}
.launch-video-copy{display:block;padding:1rem 1rem 1.05rem;}
.launch-video-copy strong{display:block;color:var(--forest-950);font-size:.9rem;}
.launch-video-copy small{display:block;margin-top:.35rem;color:var(--muted);line-height:1.55;font-size:.7rem;}
.launch-video-lightbox{position:fixed;inset:0;z-index:140;display:none;align-items:center;justify-content:center;padding:1.2rem;background:rgba(8,18,13,.84);backdrop-filter:blur(10px);}
.launch-video-lightbox.open{display:flex;}
.launch-video-lightbox-card{width:min(900px,94vw);max-height:94vh;overflow:auto;background:#fffdf8;border-radius:26px;box-shadow:0 30px 90px rgba(0,0,0,.38);}
.launch-video-player-wrap{display:flex;justify-content:center;background:#0b1711;min-height:220px;}
.launch-video-player-wrap video{display:block;width:auto;max-width:100%;height:min(72vh,720px);background:#0b1711;object-fit:contain;}
.launch-video-modal-copy{padding:1.2rem 1.4rem 1.5rem;}
.launch-video-modal-copy h2{margin:.4rem 0 .45rem;color:var(--forest-950);font-family:var(--display);}
.launch-video-modal-copy p{margin:0;color:var(--muted);line-height:1.65;font-size:.82rem;}
.launch-video-lightbox-close{position:absolute;right:1rem;top:1rem;width:46px;height:46px;border:1px solid rgba(255,255,255,.22);border-radius:50%;background:rgba(255,255,255,.1);color:#fff;font-size:1.8rem;line-height:1;cursor:pointer;z-index:2;display:grid;place-items:center;}
.launch-video-lightbox-close:hover{background:rgba(255,255,255,.18);}
.launch-video-lightbox-close:focus-visible{outline:3px solid rgba(211,176,89,.8);outline-offset:3px;}
@media(max-width:820px){
  .launch-journal-section{padding:4.4rem 0;}
  .launch-journal-feature{grid-template-columns:1fr;gap:1rem;border-radius:24px;padding:.75rem;}
  .launch-journal-photo-wrap{aspect-ratio:865/1200;max-height:none;}
  .launch-journal-copy{padding:.8rem .65rem 1rem;}
  .launch-journal-video-grid{grid-template-columns:repeat(3,minmax(145px,1fr));overflow-x:auto;padding:.2rem .1rem .7rem;scroll-snap-type:x mandatory;}
  .launch-video-card{min-width:145px;scroll-snap-align:start;}
  .launch-journal-video-head{align-items:flex-start;flex-direction:column;}
}
@media(max-width:560px){
  .launch-journal-timeline div{grid-template-columns:1fr;gap:.15rem;}
  .launch-video-lightbox{padding:.55rem;}
  .launch-video-lightbox-card{width:100%;border-radius:20px;}
  .launch-video-player-wrap video{height:min(72vh,650px);width:100%;}
  .launch-video-lightbox-close{top:.5rem;right:.5rem;width:42px;height:42px;}
}

/* V24.27 · Launching polish + partnership */
.launch-main-video-card{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(300px,.92fr);gap:0;margin-top:2.5rem;border:1px solid rgba(31,70,54,.12);border-radius:30px;overflow:hidden;background:#fffdf8;box-shadow:0 24px 65px rgba(30,57,43,.1)}
.launch-main-video-media{background:#0b1711;min-height:520px;display:flex;align-items:center;justify-content:center}
.launch-main-video-media video{display:block;width:100%;height:100%;max-height:700px;object-fit:contain;background:#0b1711}
.launch-main-video-copy{padding:clamp(1.5rem,4vw,3rem);display:flex;flex-direction:column;justify-content:center;background:linear-gradient(145deg,#fffdf8,#f4eee1)}
.launch-main-video-copy h3{margin:.75rem 0 1rem;color:var(--forest-950);font-family:var(--display);font-size:clamp(1.8rem,3.4vw,2.8rem);line-height:1.02}
.launch-main-video-copy p{color:var(--muted);line-height:1.8;margin:0}
.launch-main-video-meta{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1.4rem}
.launch-main-video-meta span{padding:.55rem .75rem;border-radius:999px;background:#fff;border:1px solid rgba(31,70,54,.1);color:var(--forest-900);font-size:.67rem;font-weight:800}
.launch-photo-head{display:flex;justify-content:space-between;align-items:end;gap:1rem;margin-top:3.3rem}
.launch-photo-head h3{margin:.35rem 0 0;color:var(--forest-950);font-family:var(--display);font-size:1.35rem}
.launch-photo-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;margin-top:1.1rem}
.launch-photo-item{margin:0;aspect-ratio:4/3;border-radius:22px;overflow:hidden;background:#e9e2d5;border:1px solid rgba(31,70,54,.09);box-shadow:0 12px 32px rgba(30,57,43,.06)}
.launch-photo-item img{width:100%;height:100%;display:block;object-fit:cover;transition:transform .35s ease}
.launch-photo-item:hover img{transform:scale(1.035)}
.launch-moment-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
.partnership-section{padding:5rem 0;background:linear-gradient(180deg,#f5f0e4 0%,#fffdf8 100%);position:relative;overflow:hidden}
.partnership-head{max-width:860px;margin-inline:auto;text-align:center}
.partnership-head .eyebrow{justify-content:center}
.partnership-card{margin-top:2rem;border:1px solid rgba(31,70,54,.12);border-radius:30px;background:rgba(255,255,255,.76);box-shadow:0 24px 70px rgba(30,57,43,.08);overflow:hidden}
.partnership-logo-wrap{padding:1.2rem;background:#fbf6eb;border-bottom:1px solid rgba(31,70,54,.09)}
.partnership-logo-wrap img{display:block;width:100%;height:auto;max-height:300px;object-fit:contain}
.partnership-points{display:grid;grid-template-columns:repeat(3,1fr);gap:0}
.partnership-points>div{padding:1.35rem 1.5rem 1.5rem;border-right:1px solid rgba(31,70,54,.09)}
.partnership-points>div:last-child{border-right:0}
.partnership-points span{display:inline-grid;place-items:center;width:32px;height:32px;border-radius:50%;background:var(--forest);color:#fff;font-size:.65rem;font-weight:800}
.partnership-points strong{display:block;margin-top:.8rem;color:var(--forest-950);font-family:var(--display);font-size:1.15rem}
.partnership-points p{margin:.45rem 0 0;color:var(--muted);line-height:1.7;font-size:.78rem}
@media(max-width:850px){
  .launch-main-video-card{grid-template-columns:1fr;border-radius:24px}
  .launch-main-video-media{min-height:0}
  .launch-main-video-media video{max-height:78vh}
  .launch-photo-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .launch-moment-grid{grid-template-columns:repeat(3,minmax(145px,1fr))}
  .partnership-points{grid-template-columns:1fr}
  .partnership-points>div{border-right:0;border-bottom:1px solid rgba(31,70,54,.09)}
  .partnership-points>div:last-child{border-bottom:0}
}
@media(max-width:560px){
  .launch-photo-grid{grid-template-columns:1fr}
  .launch-photo-head{align-items:flex-start;flex-direction:column}
  .partnership-section{padding:4rem 0}
  .partnership-card{border-radius:22px}
  .partnership-logo-wrap{padding:.55rem}
}


/* Media coverage */
.media-coverage-section{padding:clamp(3.2rem,6vw,6rem) 0;background:linear-gradient(180deg,#f7f6ef 0%,#fff 100%);}
.media-coverage-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.15rem;margin-top:2rem;}
.media-coverage-card{background:rgba(255,255,255,.92);border:1px solid rgba(31,70,54,.12);border-radius:24px;padding:1.5rem;box-shadow:0 18px 50px rgba(23,58,44,.07);display:flex;flex-direction:column;align-items:flex-start;}
.media-coverage-source{font-size:.7rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--forest-700);margin-bottom:.75rem;}
.media-coverage-card h3{font-size:1.05rem;line-height:1.35;margin:.15rem 0 .75rem;color:var(--forest-950);}
.media-coverage-card p{font-size:.82rem;line-height:1.7;color:#59645d;margin:0 0 1.2rem;}
.media-coverage-card .btn{margin-top:auto;text-decoration:none;}
.gallery-item{cursor:zoom-in;touch-action:manipulation;}
.gallery-item img{pointer-events:none;}
@media(max-width:900px){.media-coverage-grid{grid-template-columns:1fr;}}


/* V24.32 · Public media story, clickable launching gallery, four-pillar videos */
body.gallery-open{overflow:hidden}
.launch-journal-photo-wrap.launch-photo-trigger{border:0;padding:0;width:100%;cursor:zoom-in;text-align:left;display:block}
.launch-journal-photo-wrap.launch-photo-trigger:focus-visible{outline:3px solid rgba(193,154,67,.65);outline-offset:3px}
.launch-journal-photo-wrap.launch-photo-trigger .launch-journal-photo{transition:transform .45s ease,filter .35s ease}
.launch-journal-photo-wrap.launch-photo-trigger:hover .launch-journal-photo{transform:scale(1.025);filter:saturate(1.04)}
.launch-highlight-quote{margin-top:1.4rem;padding:1.15rem 1.25rem;border-left:4px solid var(--gold-300);border-radius:0 16px 16px 0;background:linear-gradient(135deg,#f5efe0,#fffdf8);color:var(--forest-950);font-family:var(--display);font-size:clamp(1.15rem,2.2vw,1.55rem);line-height:1.35;box-shadow:0 12px 32px rgba(30,57,43,.06)}
.launch-story-copy{max-width:920px;margin:2rem auto 0;color:var(--muted);line-height:1.85;font-size:.92rem}
.launch-story-copy p{margin:0 0 1rem}
.launch-signature{text-align:center;margin-top:1.8rem;padding:1.35rem;border-radius:20px;background:var(--forest);color:#fffaf0;line-height:1.8;box-shadow:0 16px 38px rgba(23,60,45,.16)}
.launch-signature strong{color:#e4c873;letter-spacing:.04em}
.story-video-head{display:flex;justify-content:space-between;align-items:end;gap:1rem;margin-top:3.5rem}
.story-video-head h3{margin:.35rem 0 0;color:var(--forest-950);font-family:var(--display);font-size:clamp(1.35rem,2.5vw,1.8rem)}
.story-video-feature{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(280px,.95fr);margin-top:1.1rem;border:1px solid rgba(31,70,54,.11);border-radius:26px;overflow:hidden;background:#fffdf8;box-shadow:0 18px 50px rgba(30,57,43,.08)}
.story-video-player{background:#0b1711;display:flex;align-items:center;justify-content:center;min-height:420px}
.story-video-player video{display:block;width:100%;height:100%;max-height:680px;object-fit:contain;background:#0b1711}
.story-video-copy{padding:clamp(1.35rem,3vw,2.5rem);display:flex;flex-direction:column;justify-content:center;background:linear-gradient(145deg,#fffdf8,#f4eee1)}
.story-video-copy h3{margin:.7rem 0 .8rem;color:var(--forest-950);font-family:var(--display);font-size:clamp(1.55rem,3vw,2.3rem);line-height:1.05}
.story-video-copy p{margin:0;color:var(--muted);line-height:1.8}
.story-video-meta{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1.25rem}
.story-video-meta span{padding:.5rem .7rem;border-radius:999px;background:#fff;border:1px solid rgba(31,70,54,.1);font-size:.65rem;font-weight:800;color:var(--forest-900)}
.four-pillars-video-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem;margin-top:1.1rem}
.story-video-card{border:1px solid rgba(31,70,54,.11);border-radius:22px;overflow:hidden;background:#fffdf8;box-shadow:0 14px 34px rgba(30,57,43,.06)}
.story-video-card-media{background:#0b1711;aspect-ratio:9/16}
.story-video-card-media video{width:100%;height:100%;display:block;object-fit:cover;background:#0b1711}
.story-video-card-copy{padding:1rem 1rem 1.15rem}
.story-video-card-copy>span{font-size:.68rem;font-weight:900;letter-spacing:.05em;color:var(--forest-700)}
.story-video-card-copy h4{margin:.5rem 0 .4rem;color:var(--forest-950);font-size:1rem;line-height:1.3}
.story-video-card-copy p{margin:0;color:var(--muted);font-size:.74rem;line-height:1.65}
.launch-photo-grid .launch-photo-item{padding:0;border:1px solid rgba(31,70,54,.09);cursor:zoom-in}
.launch-photo-grid .launch-photo-item .gallery-overlay{display:block}
.media-coverage-grid-six{grid-template-columns:repeat(3,minmax(0,1fr))}
.media-coverage-note{max-width:760px;margin:1.6rem auto 0;text-align:center;color:var(--muted);font-size:.78rem;line-height:1.7}
.pillar-story-card{margin:2rem auto 0;max-width:900px;padding:2rem;border:1px solid rgba(31,70,54,.11);border-radius:26px;background:linear-gradient(145deg,#fffdf8,#f3eee2);box-shadow:0 18px 50px rgba(30,57,43,.07)}
.pillar-story-card h3{margin:.65rem 0 1rem;font-family:var(--display);font-size:clamp(1.55rem,3vw,2.2rem);line-height:1.08;color:var(--forest-950)}
.pillar-story-card p{margin:.65rem 0;color:var(--muted);line-height:1.75}
.pillar-story-card p strong{color:var(--forest-950)}
.pillar-story-signature{margin-top:1.25rem;padding-top:1rem;border-top:1px solid rgba(31,70,54,.1);font-weight:800;color:var(--forest-900)}
.gallery-lightbox{z-index:220;overscroll-behavior:contain}
.gallery-lightbox figure{max-width:min(1200px,92vw);max-height:88vh}
.gallery-lightbox figure img{max-width:88vw;max-height:80vh}
.gallery-lightbox button[hidden]{display:none!important}
@media(max-width:1000px){
  .four-pillars-video-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .media-coverage-grid-six{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:760px){
  .story-video-feature{grid-template-columns:1fr}
  .story-video-player{min-height:0}
  .story-video-player video{max-height:75vh}
  .four-pillars-video-grid{grid-template-columns:1fr 1fr}
  .media-coverage-grid-six{grid-template-columns:1fr}
}
@media(max-width:560px){
  .four-pillars-video-grid{grid-template-columns:1fr}
  .launch-highlight-quote{font-size:1.05rem}
}


/* V24.38 responsive desktop/mobile refinement */
.lb-video-frame, .video-frame, .media-video, .video-card video {
  max-width: 420px;
  width: min(100%, 420px);
  margin-inline: auto;
  display: block;
  aspect-ratio: 9 / 16;
  object-fit: contain;
  border-radius: 20px;
}
.video-card, .lb-video-card { display:flex; flex-direction:column; align-items:center; }
@media (min-width: 900px) {
  .video-grid, .media-video-grid { grid-template-columns: repeat(3, minmax(260px, 1fr)); align-items:start; }
  .video-card, .lb-video-card { min-height: 100%; }
}
@media (max-width: 899px) {
  .video-grid, .media-video-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
}
@media (max-width: 560px) {
  .video-grid, .media-video-grid { grid-template-columns: 1fr; }
  .lb-video-frame, .video-frame, .media-video, .video-card video { width:100%; max-width:100%; }
}

/* V24.39 price list, payment, new story media */
.product-card-price{margin-top:.7rem;font-weight:800;font-size:1rem;letter-spacing:.01em;}
.price-list-panel{margin:2.2rem 0 0;padding:1.35rem;border:1px solid rgba(70,91,64,.15);border-radius:24px;background:linear-gradient(135deg,rgba(247,245,235,.96),rgba(255,255,255,.98));}
.price-list-head{display:flex;align-items:flex-end;justify-content:space-between;gap:1rem;margin-bottom:1rem}.price-list-head h3{margin:.2rem 0 .35rem}.price-list-head p{margin:0;max-width:760px;color:var(--muted,#667064)}
.price-list-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem}.price-list-grid>div{padding:1rem;border-radius:18px;background:#fff;border:1px solid rgba(70,91,64,.1)}.price-list-grid strong{display:block;margin-bottom:.65rem}.price-list-grid ul{list-style:none;margin:0;padding:0;display:grid;gap:.45rem}.price-list-grid li{display:flex;justify-content:space-between;gap:.75rem;font-size:.9rem;line-height:1.35}.price-list-grid li b{white-space:nowrap}.price-list-grid small{display:block;margin-top:.7rem;color:var(--muted,#667064)}
.payment-box-head{display:flex;gap:.8rem;align-items:center}.bsi-logo-mark{width:64px;height:42px;border-radius:10px;display:grid;place-items:center;background:#087c68;color:#fff;font-weight:900;font-size:.95rem;position:relative}.bsi-logo-mark:before{content:'★';position:absolute;right:6px;top:2px;color:#f47b20;font-size:.65rem}.payment-instruction{margin-top:.8rem;padding:.8rem 1rem;border-radius:12px;background:rgba(8,124,104,.07);display:grid;gap:.15rem}.proof-upload{display:grid;gap:.45rem;margin-top:.8rem}.proof-upload input{width:100%}.proof-upload small{font-weight:400}.story-video-new-block{margin-top:2.8rem}.story-video-new-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.story-video-new-grid .story-video-card-media video{width:100%;height:100%;object-fit:cover;display:block}.story-video-new-grid .story-video-card-media{aspect-ratio:9/16;overflow:hidden;border-radius:18px}
@media(max-width:1050px){.price-list-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.story-video-new-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:650px){.price-list-head{align-items:flex-start;flex-direction:column}.price-list-grid{grid-template-columns:1fr}.price-list-grid li{font-size:.88rem}.story-video-new-grid{grid-template-columns:1fr}.story-video-new-grid .story-video-card-media{max-width:340px;margin:auto}}


/* V24.41 performance + reseller moderation polish */
video[data-lazy-video] { background:#0f1713; }
.mitra-form .btn[disabled] { opacity:.7; cursor:wait; }
.form-status.loading { opacity:.75; }
.form-status.success { font-weight:700; }
.form-status.error { font-weight:700; }
@media (prefers-reduced-motion: reduce) { video[data-lazy-video] { scroll-behavior:auto; } }

/* V24.43: preserve native landscape orientation for the Lemon video */
.story-video-new-grid .story-video-card-landscape .story-video-card-media{
  aspect-ratio:16/9;
}
.story-video-new-grid .story-video-card-landscape .story-video-card-media video{
  width:100%;
  height:100%;
  object-fit:contain;
}
@media(max-width:650px){
  .story-video-new-grid .story-video-card-landscape .story-video-card-media{
    max-width:100%;
  }
}


/* V24.44: purchase actions made obvious on desktop and mobile */
.wa-float{right:20px;left:auto;bottom:20px;width:auto;min-width:174px;height:54px;padding:0 18px;border-radius:999px;gap:8px;font-size:.82rem;font-weight:850;letter-spacing:.01em;z-index:5002;box-shadow:0 14px 30px -12px rgba(23,48,38,.55);white-space:nowrap;}
.wa-float .float-icon,.cart-float .float-icon{font-size:1.25rem;line-height:1;}
.cart-float{right:20px;bottom:86px;width:auto;min-width:154px;height:54px;padding:0 18px;border-radius:999px;display:flex;align-items:center;justify-content:center;gap:8px;font-size:.82rem;font-weight:850;z-index:5002;white-space:nowrap;}
.cart-float .float-label{position:static;right:auto;top:auto;min-width:0;height:auto;padding:0;background:transparent;color:inherit;font:inherit;text-align:left;box-sizing:border-box;}
.cart-float .float-icon{position:static;right:auto;top:auto;min-width:0;height:auto;padding:0;background:transparent;color:inherit;}
.cart-float #cartCount{position:static;right:auto;top:auto;min-width:22px;height:22px;padding:0 6px;border-radius:999px;background:#c79a45;color:#fff;font:800 10px/22px system-ui;text-align:center;box-sizing:border-box;display:inline-grid;place-items:center;}
.cart-float #cartCount[hidden]{display:none;}
@media(max-width:680px){
  .wa-float{right:12px;left:auto;bottom:12px;width:calc(50% - 18px);min-width:0;height:52px;justify-content:center;}
  .cart-float{right:auto;left:12px;bottom:12px;width:calc(50% - 18px);min-width:0;height:52px;}
}
@media(min-width:681px){.wa-float:hover,.cart-float:hover{transform:translateY(-2px);}}
/* V24.47: fix main cart label/count positioning and keep the control visually balanced */
.cart-float .float-label{white-space:nowrap;}
@media(max-width:680px){
  .cart-float{padding:0 14px;gap:7px;}
  .cart-float .float-icon{font-size:1.15rem;}
  .cart-float .float-label{font-size:.78rem;}
  .cart-float #cartCount{min-width:21px;height:21px;line-height:21px;}
}

/* V24.46 purchase journey + order notifications */
.checkout-grid-2{display:grid;grid-template-columns:1fr 1fr;gap:.7rem;}
.shipping-box{display:grid;gap:.7rem;padding:1rem;border:1px solid rgba(31,70,54,.12);border-radius:18px;background:#f6f5ed;}
.shipping-box-head{display:flex;gap:.65rem;align-items:flex-start}.shipping-icon{font-size:1.25rem}.shipping-box-head strong{display:block;color:var(--forest-950);font-size:.78rem}.shipping-box-head small{display:block;color:var(--muted);font-size:.63rem;line-height:1.45;margin-top:.15rem}.shipping-check-btn{justify-content:center}.shipping-result{padding:.65rem .75rem;border-radius:12px;background:#fff;border:1px dashed rgba(31,70,54,.14);font-size:.66rem;line-height:1.5;color:var(--muted)}.shipping-result strong{color:var(--forest-900)}.checkout-status{padding:.85rem 1rem;border-radius:14px;background:#edf7ef;color:#1e5c35;font-size:.72rem;line-height:1.5}.checkout-status.error{background:#fff0ed;color:#8b4033}.checkout-status strong{display:block;font-size:.8rem;margin-bottom:.2rem}.order-success-card{display:grid;gap:.5rem;padding:1rem;border-radius:18px;background:#edf7ef;border:1px solid rgba(31,70,54,.12)}.order-success-card strong{color:var(--forest-950);font-size:1rem}.order-success-card span{color:var(--muted);font-size:.72rem;line-height:1.5}.order-success-card a{justify-content:center}.
@media(max-width:560px){.checkout-grid-2{grid-template-columns:1fr}.shipping-box{padding:.85rem}.checkout-form input,.checkout-form textarea{font-size:.82rem;min-height:46px}.checkout-form textarea{min-height:84px}.checkout-submit{min-height:52px;font-size:.78rem;font-weight:900}}

/* V24.46 admin order desk */
.admin-orders-section{margin-top:2rem;padding-top:1.5rem;border-top:1px solid rgba(31,70,54,.1)}.admin-section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:1rem;margin-bottom:1rem}.admin-section-head h2{margin:.25rem 0;color:var(--forest-950)}.admin-section-head p{margin:0;color:var(--muted);font-size:.72rem}.orders-list{display:grid;gap:.85rem}.order-admin-card{background:#fff;border:1px solid rgba(31,70,54,.10);border-radius:18px;padding:1rem;box-shadow:0 10px 30px rgba(23,48,38,.05)}.order-admin-head{display:flex;justify-content:space-between;gap:1rem;align-items:center;margin-bottom:.85rem}.order-number{display:block;font-weight:900;color:var(--forest-950)}.order-admin-head small{display:block;color:var(--muted);font-size:.64rem;margin-top:.18rem}.order-admin-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.7rem}.order-admin-grid>div{display:grid;gap:.18rem;padding:.65rem;border-radius:12px;background:#f7f6ef}.order-admin-grid strong{font-size:.61rem;color:var(--forest-900)}.order-admin-grid span{font-size:.68rem;color:var(--muted);line-height:1.45}.order-admin-actions{display:flex;justify-content:flex-end;gap:.6rem;margin-top:.8rem}.order-admin-actions select{min-height:42px;border:1px solid rgba(31,70,54,.14);border-radius:12px;padding:.55rem .7rem;background:#fff;color:var(--forest-950);font:700 .7rem system-ui}.order-admin-actions .btn{min-height:42px}.status-received{background:#eef5ef;color:#245a3a}.status-awaiting_payment{background:#fff5db;color:#765314}.status-paid{background:#e9f6ed;color:#1e6a39}.status-processing{background:#edf2fb;color:#31547b}.status-shipped{background:#eaf5f5;color:#256b6b}.status-completed{background:#e8f6ee;color:#1f6c3d}.status-cancelled{background:#f9ece9;color:#8b4033}
@media(max-width:650px){.admin-section-head{align-items:flex-start;flex-direction:column}.order-admin-grid{grid-template-columns:1fr}.order-admin-actions{flex-direction:column}.order-admin-actions select,.order-admin-actions .btn{width:100%}}


/* Real customer testimonials: proof + concise conversion copy */
.testimonials-section{
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at 8% 12%, rgba(227,195,122,.10), transparent 26rem),
    linear-gradient(180deg,#fffdf8 0%,#f7f4eb 100%);
}
.testimonial-grid-real{
  align-items:stretch;
  gap:1.25rem;
}
.testimonial-card-real{
  padding:0;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  border-radius:24px;
  border:1px solid rgba(31,70,54,.12);
  box-shadow:0 18px 45px rgba(31,70,54,.08);
  background:rgba(255,255,255,.92);
}
.testimonial-proof{
  position:relative;
  aspect-ratio:16/10;
  overflow:hidden;
  background:#eef1ed;
  border-bottom:1px solid rgba(31,70,54,.08);
}
.testimonial-proof::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,transparent 50%,rgba(11,30,22,.18));
  pointer-events:none;
}
.testimonial-proof img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:50% 18%;
  display:block;
  transition:transform .45s ease;
}
.testimonial-card-real:hover .testimonial-proof img{transform:scale(1.035);}
.testimonial-proof-label{
  position:absolute;
  left:1rem;
  bottom:.85rem;
  z-index:1;
  padding:.42rem .72rem;
  border-radius:999px;
  background:rgba(16,49,36,.92);
  color:#fff;
  font-size:.62rem;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
  box-shadow:0 8px 20px rgba(0,0,0,.14);
}
.testimonial-content{
  position:relative;
  padding:1.35rem 1.35rem 1.45rem;
  display:flex;
  flex-direction:column;
  flex:1;
}
.testimonial-quote-mark{
  font-family:var(--display);
  color:var(--gold-500);
  font-size:4rem;
  line-height:.55;
  height:1.8rem;
}
.testimonial-card-real p{
  margin:.4rem 0 1.25rem;
  min-height:auto;
  color:#435047;
  font-size:.88rem;
  line-height:1.75;
}
.testimonial-meta{
  margin-top:auto;
  padding-top:.9rem;
  border-top:1px solid rgba(31,70,54,.09);
}
.testimonial-meta strong{
  display:block;
  color:var(--forest-900);
  font-size:.7rem;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.testimonial-meta small{
  display:block;
  margin-top:.25rem;
  color:#8a8170;
  font-size:.66rem;
}
.testimonial-trust{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:.65rem;
  max-width:760px;
  margin:2rem auto 0;
  padding:1rem 1.2rem;
  border-radius:18px;
  border:1px solid rgba(178,135,54,.18);
  background:rgba(255,255,255,.62);
  color:#59645c;
  text-align:center;
}
.testimonial-trust span{color:var(--gold-500);font-size:1rem;}
.testimonial-trust p{margin:0;font-size:.74rem;line-height:1.6;}
.testimonial-trust strong{color:var(--forest-900);}
@media(max-width:900px){
  .testimonial-grid-real{grid-template-columns:1fr;}
  .testimonial-card-real{display:grid;grid-template-columns:minmax(180px,.8fr) 1.2fr;}
  .testimonial-proof{aspect-ratio:auto;min-height:100%;}
  .testimonial-proof img{object-position:50% 15%;}
}
@media(max-width:600px){
  .testimonial-card-real{display:block;}
  .testimonial-proof{aspect-ratio:4/3;}
  .testimonial-proof img{object-position:50% 17%;}
  .testimonial-content{padding:1.2rem;}
  .testimonial-card-real p{font-size:.86rem;}
  .testimonial-trust{align-items:flex-start;text-align:left;}
}

/* V24.49 · Official PDF catalog access */
.catalog-pdf-panel{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:1.5rem;align-items:center;margin:1.5rem 0 1.2rem;padding:1.35rem 1.45rem;border:1px solid rgba(31,70,54,.14);border-radius:24px;background:linear-gradient(135deg,rgba(248,245,235,.98),rgba(255,255,255,.92));box-shadow:0 18px 42px -34px rgba(23,48,38,.6);}
.catalog-pdf-kicker{display:inline-block;margin-bottom:.45rem;color:var(--gold-700,#9b762d);font-size:.66rem;font-weight:900;letter-spacing:.12em;}
.catalog-pdf-panel h3{margin:0 0 .45rem;color:var(--forest-950);font-family:var(--display);font-size:1.35rem;line-height:1.2;}
.catalog-pdf-panel p{margin:0;max-width:760px;color:var(--muted);font-size:.88rem;line-height:1.65;}
.catalog-pdf-actions{display:flex;gap:.65rem;flex-wrap:wrap;justify-content:flex-end;}
.catalog-pdf-actions .btn{white-space:nowrap;}
@media(max-width:760px){.catalog-pdf-panel{grid-template-columns:1fr;padding:1.15rem;border-radius:20px;}.catalog-pdf-actions{justify-content:flex-start;}.catalog-pdf-actions .btn{width:100%;justify-content:center;}}


/* V24.50 Conversion testimonial + simple training program */
.testimonial-card-real{overflow:hidden;}
.testimonial-content{display:flex;flex-direction:column;align-items:flex-start;}
.testimonial-cta{display:inline-flex;align-items:center;gap:.55rem;margin-top:1.1rem;color:var(--forest-900);font-size:.76rem;font-weight:800;text-decoration:none;letter-spacing:.03em;border-bottom:1px solid rgba(31,70,54,.22);padding-bottom:.28rem;}
.testimonial-cta span{font-size:1rem;transition:transform .2s ease;}
.testimonial-cta:hover span{transform:translateX(4px);}
.testimonial-shop-btn{margin-left:auto;white-space:nowrap;}
.testimonial-trust{gap:1rem;flex-wrap:wrap;}
.training-section{padding:2.5rem 0 5.5rem;background:linear-gradient(180deg,rgba(245,241,232,.45),rgba(255,255,255,0));}
.training-wrap{display:grid;grid-template-columns:1.25fr .75fr;gap:2rem;align-items:center;padding:2rem 2.2rem;border:1px solid rgba(31,70,54,.12);border-radius:24px;background:#fff;box-shadow:0 18px 45px rgba(21,60,43,.05);}
.training-wrap h2{margin:.35rem 0 .7rem;font-size:clamp(1.65rem,3vw,2.5rem);}
.training-wrap p{margin:0;max-width:720px;color:var(--muted);line-height:1.75;}
.training-action{padding:1.3rem 1.4rem;border-radius:18px;background:var(--cream-200);border:1px solid rgba(31,70,54,.08);display:flex;flex-direction:column;align-items:flex-start;gap:.55rem;}
.training-action strong{color:var(--forest-900);font-size:1rem;line-height:1.45;}
.training-action small{color:var(--muted);line-height:1.55;}
.training-action .btn{margin-top:.4rem;}
@media(max-width:800px){.training-wrap{grid-template-columns:1fr;padding:1.5rem;}.testimonial-shop-btn{margin-left:0;width:100%;justify-content:center;}.testimonial-trust{align-items:stretch;}}