/* Tokkopitok public shop theme v3.3.0 — scoped to public shop only */
body.shop-public{
  --bg:#18130f;
  --card:#251e18;
  --ink:#f4eadc;
  --muted:#cbb9a6;
  --coffee:#a87543;
  --coffee2:#d3a06a;
  --line:rgba(255,255,255,.12);
  --ok:#153b29;
  --danger:#4a2020;
  --shadow:0 18px 50px rgba(0,0,0,.28);
  background:
    linear-gradient(rgba(20,15,11,.90),rgba(20,15,11,.93)),
    url('../../gallery/1.jfif') center top/cover fixed no-repeat;
  color:var(--ink);
}
body.shop-public .site-header{
  background:rgba(13,10,8,.93);
  border-bottom:1px solid rgba(255,255,255,.10);
  backdrop-filter:blur(14px);
}
body.shop-public .site-header .nav{gap:18px}
body.shop-public .site-header .brand{color:var(--cream,#f4eadc)}
body.shop-public .site-header .brand-mark{
  width:44px;height:44px;border-radius:50%;background:#efe2cd;
  display:grid;place-items:center;overflow:hidden;border:1px solid rgba(255,255,255,.2)
}
body.shop-public .site-header .brand-mark img{width:38px;height:38px;object-fit:contain}
body.shop-public .site-header nav a{color:#e8dccd}
body.shop-public .site-header nav a:hover{color:#fff}
body.shop-public .cart-link b{background:#a87543;color:#fff}

body.shop-public .hero{
  position:relative;
  overflow:hidden;
  background:
    linear-gradient(90deg,rgba(16,11,8,.86),rgba(16,11,8,.48),rgba(16,11,8,.72)),
    url('../../gallery/15.jfif') center 44%/cover no-repeat;
  padding:92px 0;
  border-bottom:1px solid rgba(255,255,255,.09)
}
body.shop-public .hero:after{content:"";position:absolute;inset:auto 0 0;height:100px;background:linear-gradient(transparent,#18130f)}
body.shop-public .hero .container{position:relative;z-index:1}
body.shop-public .hero h1{font-family:Georgia,'Times New Roman',serif;color:#fff8ec;text-shadow:0 3px 20px rgba(0,0,0,.38)}
body.shop-public .hero p{color:#e8d9c7}
body.shop-public .hero .eyebrow{color:#e3ad72}
body.shop-public .hero-art{filter:none;color:#f2d7b3;opacity:.92}

body.shop-public .section{background:rgba(24,19,15,.82);border-radius:28px;padding:44px 30px;margin-top:34px;margin-bottom:34px;box-shadow:0 18px 55px rgba(0,0,0,.15)}
body.shop-public .section h1,body.shop-public .section h2,body.shop-public .section h3{color:#fff8ed}
body.shop-public .section-head .eyebrow,body.shop-public .eyebrow{color:#d5a06b}
body.shop-public .product-card{
  background:rgba(38,30,24,.96);border:1px solid rgba(255,255,255,.12);
  box-shadow:0 10px 30px rgba(0,0,0,.16);color:#f6ebdc
}
body.shop-public .product-card:hover{border-color:rgba(211,160,106,.52);box-shadow:0 18px 42px rgba(0,0,0,.30)}
body.shop-public .product-image{background:#211a15}
body.shop-public .product-body p,body.shop-public .mini-meta{color:#cbb9a6}
body.shop-public .stock{color:#b7d7bd}
body.shop-public .stock.low{color:#f1a36e}
body.shop-public .price{color:#e6b47d}
body.shop-public .btn{border-color:#b77c45;background:transparent;color:#f1d1ad}
body.shop-public .btn:hover{background:rgba(183,124,69,.12)}
body.shop-public .btn.primary{background:#a87543;border-color:#a87543;color:#fff}
body.shop-public .panel,body.shop-public .auth-card{
  background:rgba(39,31,25,.97);border-color:rgba(255,255,255,.12);color:#f3e7d8
}
body.shop-public input,body.shop-public textarea,body.shop-public select{
  background:#1f1914;border-color:#5a4738;color:#f5eadc
}
body.shop-public input::placeholder,body.shop-public textarea::placeholder{color:#8f7f70}
body.shop-public .cart-row,body.shop-public .spec,body.shop-public .line.total{border-color:rgba(255,255,255,.10)}
body.shop-public .cart-row small,body.shop-public .order-row small{color:#bba998}
body.shop-public .empty{background:rgba(255,255,255,.03);border-color:rgba(255,255,255,.12)}
body.shop-public .status-badge{background:#3a2d23;color:#f3deca}
body.shop-public .shipping-cost-box,body.shop-public .customer-detail>div,body.shop-public .settings-block{background:#211a15;border-color:rgba(255,255,255,.11)}
body.shop-public footer{background:#0b0907;border-top:1px solid rgba(255,255,255,.08)}
body.shop-public .copyright{border-color:#392d25;color:#9f8b78}

body.shop-public .floating-cart-wrap .mobile-cart-bar{
  background:linear-gradient(135deg,#c96a0a,#e98b13 50%,#f2a529);
  color:#fff;border:1px solid rgba(255,255,255,.38);
  box-shadow:0 16px 44px rgba(202,106,10,.34),0 4px 12px rgba(0,0,0,.2)
}

@media(max-width:900px){
  body.shop-public{background-attachment:scroll}
  body.shop-public .hero{padding:64px 0;background-position:center}
  body.shop-public .section{border-radius:20px;padding:34px 20px;margin-top:22px;margin-bottom:22px}
  body.shop-public .site-header .nav{min-height:64px}
  body.shop-public .site-header nav{gap:13px;font-size:.88rem}
}
@media(max-width:620px){
  body.shop-public .site-header .brand span:last-child{font-size:.92rem}
  body.shop-public .site-header .brand-mark{width:38px;height:38px}
  body.shop-public .site-header .brand-mark img{width:32px;height:32px}
  body.shop-public .site-header nav{gap:9px;font-size:.78rem}
  body.shop-public .hero{padding:48px 0}
  body.shop-public .hero h1{font-size:2.65rem}
  body.shop-public .hero p{font-size:1rem}
  body.shop-public .section{padding:28px 13px;border-radius:16px}
  body.shop-public .product-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  body.shop-public .product-card{border-radius:15px}
  body.shop-public .product-body{padding:12px}
  body.shop-public .product-body h3{font-size:.96rem;line-height:1.25}
  body.shop-public .product-foot{gap:8px}
  body.shop-public .qty-inline{gap:.35rem}
  body.shop-public .qty-inline button{width:30px;height:30px}
  body.shop-public .panel{padding:18px}
  body.shop-public .checkout-grid,body.shop-public .order-grid,body.shop-public .product-detail{gap:22px}
}
@media(max-width:390px){
  body.shop-public .site-header nav a:first-child{display:none}
  body.shop-public .product-grid{grid-template-columns:1fr}
}

/* v3.6 shop hero — aligned with main Tokkopitok visual language */
body.shop-public .hero{
  min-height:620px;
  display:flex;
  align-items:center;
  background:
    linear-gradient(90deg,rgba(14,9,6,.88) 0%,rgba(14,9,6,.70) 43%,rgba(14,9,6,.38) 70%,rgba(14,9,6,.55) 100%),
    linear-gradient(0deg,rgba(24,19,15,.90),transparent 40%),
    url('../../gallery/15.jfif') center 44%/cover no-repeat;
}
body.shop-public .hero-inner{
  grid-template-columns:minmax(0,1.28fr) minmax(260px,.72fr);
  gap:54px;
  align-items:center;
}
body.shop-public .shop-journey{
  display:flex;
  align-items:center;
  gap:7px;
  flex-wrap:wrap;
  margin-bottom:18px;
}
body.shop-public .shop-journey span{
  display:inline-flex;
  align-items:center;
  gap:7px;
  color:#f1d4b4;
  font-size:.72rem;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
}
body.shop-public .shop-journey span:not(:last-child)::after{
  content:'→';
  color:#d8a06a;
  font-size:.88rem;
}
body.shop-public .hero-copy-card{
  max-width:760px;
}
body.shop-public .hero-copy-card h1{
  margin:.12em 0 .22em;
  max-width:760px;
  font-size:clamp(3.1rem,6vw,6rem);
  line-height:.96;
  letter-spacing:-.045em;
}
body.shop-public .hero-message{
  max-width:690px;
  color:#eddfce;
  font-size:1.08rem;
  line-height:1.75;
}
body.shop-public .hero-signoff{
  display:block;
  margin-top:13px;
  color:#fff3e3;
  font-family:Georgia,'Times New Roman',serif;
  font-size:1.08rem;
  font-style:italic;
}
body.shop-public .hero-logo-card{
  justify-self:end;
  width:min(330px,100%);
  aspect-ratio:1/1;
  border-radius:28px;
  background:rgba(247,239,225,.93);
  border:1px solid rgba(255,255,255,.3);
  box-shadow:0 28px 70px rgba(0,0,0,.34);
  padding:28px;
  display:grid;
  place-items:center;
  backdrop-filter:blur(8px);
}
body.shop-public .hero-logo-card img{
  width:100%;
  height:100%;
  object-fit:contain;
}
body.shop-public .hero-actions-shop{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  margin-top:25px;
}
body.shop-public .hero-actions-shop .btn{
  min-width:145px;
}
@media(max-width:900px){
  body.shop-public .hero{min-height:auto;padding:72px 0;background-position:center 44%}
  body.shop-public .hero-inner{grid-template-columns:1fr;gap:28px}
  body.shop-public .hero-logo-card{justify-self:start;width:min(260px,70vw);padding:22px}
  body.shop-public .hero-copy-card h1{font-size:clamp(2.8rem,8vw,4.7rem)}
}
@media(max-width:620px){
  body.shop-public .hero{padding:54px 0 50px}
  body.shop-public .hero-inner{gap:22px}
  body.shop-public .shop-journey{gap:4px 6px}
  body.shop-public .shop-journey span{font-size:.58rem;letter-spacing:.045em}
  body.shop-public .hero-copy-card h1{font-size:2.75rem}
  body.shop-public .hero-message{font-size:.96rem;line-height:1.65}
  body.shop-public .hero-logo-card{width:min(210px,60vw);padding:17px;border-radius:20px}
  body.shop-public .hero-actions-shop .btn{width:100%}
}


/* =========================================================
   v4.0 FINAL CONSISTENCY OVERRIDES
   Parent + Shop use ../images/logo.png in top navigation.
   Hero seal keeps a 90% circular cream backing.
   ========================================================= */
body.shop-public .site-header{
  background:rgba(13,10,8,.88)!important;
  backdrop-filter:blur(14px);
  border-bottom:1px solid rgba(255,255,255,.10);
}
body.shop-public .site-header .shop-parent-brand{
  display:flex;
  align-items:center;
  padding:4px 0;
  background:transparent!important;
}
body.shop-public .site-header .shop-header-logo{
  display:block;
  width:auto;
  height:46px;
  max-width:235px;
  object-fit:contain;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
}

/* catalogue area blends into the page background */
body.shop-public #produk.section,
body.shop-public .section{
  background:transparent!important;
  box-shadow:none!important;
  border-radius:0!important;
}

/* gentle copy: same visual weight as paragraph text */
body.shop-public .hero-intro,
body.shop-public .hero-message{
  max-width:690px;
  color:#eddfce!important;
  font-family:inherit!important;
  font-size:1.08rem!important;
  font-weight:400!important;
  line-height:1.75!important;
  letter-spacing:0!important;
  text-transform:none!important;
}
body.shop-public .hero-signoff{
  display:block;
  margin-top:14px;
  color:#fff3e3;
  font-family:Georgia,'Times New Roman',serif;
  font-size:1.06rem;
  font-weight:400;
  font-style:italic;
}

/* hero master seal: transparent outer area + 90% cream circle */
body.shop-public .hero-logo-card{
  justify-self:end!important;
  width:min(330px,100%)!important;
  aspect-ratio:1/1;
  position:relative!important;
  display:grid!important;
  place-items:center!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  backdrop-filter:none!important;
}
body.shop-public .hero-logo-card::before{
  content:'';
  position:absolute;
  width:90%;
  height:90%;
  border-radius:50%;
  background:rgba(247,239,225,.96);
  box-shadow:0 24px 60px rgba(0,0,0,.28);
  z-index:0;
}
body.shop-public .hero-logo-card img{
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
  position:relative;
  z-index:1;
}

@media(max-width:900px){
  body.shop-public .site-header .shop-header-logo{height:42px;max-width:210px}
  body.shop-public .hero-logo-card{justify-self:start!important;width:min(260px,70vw)!important}
}
@media(max-width:620px){
  body.shop-public .site-header .shop-header-logo{height:36px;max-width:175px}
  body.shop-public .site-header .nav{gap:10px}
  body.shop-public .site-header nav{gap:9px;font-size:.78rem}
  body.shop-public .hero-logo-card{width:min(210px,60vw)!important}
  body.shop-public .hero-intro,
  body.shop-public .hero-message{font-size:.96rem!important;line-height:1.65!important}
}


/* v4.1 gentle hero copy + 90% seal backing */
body.shop-public .hero-copy-card h1{display:none!important;}
body.shop-public .hero-message{margin:10px 0 0!important;}
body.shop-public .hero-message-secondary{margin-top:8px!important;}
body.shop-public .hero-signoff{margin-top:16px!important;}
body.shop-public .hero-logo-card::before{width:90%!important;height:90%!important;}