
.brandbook-theme{background:radial-gradient(circle at 85% 18%,rgba(189,103,69,.18),transparent 34%),linear-gradient(135deg,#111412 0%,#1c201d 58%,#0e1010 100%);color:#fff}.brandbook-theme h1,.brandbook-theme p{color:inherit}.brandbook-mark{display:flex;gap:16px;align-items:center;margin:22px 0}.brandbook-mark>span{width:58px;height:58px;border-radius:18px;display:grid;place-items:center;background:linear-gradient(135deg,#bd6745,#ece5dc);color:#171917;font-weight:900;font-size:23px;box-shadow:0 12px 30px rgba(189,103,69,.22)}.brandbook-mark strong{display:block;font-size:22px}.brandbook-mark small{display:block;color:#c8cbc8;margin-top:3px}.brandbook-shot .product-shot-frame{background:#0d1110;border-color:rgba(255,255,255,.14);padding:0;overflow:hidden}.brandbook-shot img{display:block;width:100%;height:auto}.brandbook-points span::before{background:#bd6745}.brandbook-callout{border-left-color:#bd6745}.brandbook-buy .brandbook-price{color:#a75235}.brandbook-proof{background:#f6f5f2}.brandbook-topic-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:28px}.brandbook-topic-grid span{background:#fff;border:1px solid #e0ddd8;border-radius:14px;padding:16px 18px;font-weight:700;color:#282c2a}.brandbook-price{font-size:42px;font-weight:900;line-height:1;margin:18px 0 6px}@media(max-width:860px){.brandbook-topic-grid{grid-template-columns:1fr 1fr}.brandbook-mark strong{font-size:19px}}@media(max-width:560px){.brandbook-topic-grid{grid-template-columns:1fr}}

/* HERO LAYOUT FIX 2026-09-17 */
.brandbook-theme .theme-grid{
  align-items:center;
  column-gap:56px;
}
.brandbook-shot{
  position:relative;
  display:grid;
  gap:16px;
  align-self:center;
  min-width:0;
}
.brandbook-shot .product-shot-frame{
  position:relative;
  border:1px solid rgba(255,255,255,.14);
  border-radius:28px;
  background:#101522;
  padding:0;
  overflow:hidden;
  box-shadow:0 24px 70px rgba(0,0,0,.30);
}
.brandbook-shot .product-shot-frame img{
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:16/9;
  object-fit:cover;
}
.brandbook-shot .product-shot-badge{
  position:static !important;
  inset:auto !important;
  left:auto !important;
  right:auto !important;
  top:auto !important;
  bottom:auto !important;
  transform:none !important;
  width:100% !important;
  max-width:none !important;
  box-sizing:border-box;
  margin:0 !important;
  padding:17px 20px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:18px;
  background:rgba(255,255,255,.07);
  color:#fff;
  box-shadow:none;
  backdrop-filter:blur(10px);
}
.brandbook-shot .product-shot-badge strong{
  display:block;
  color:#fff;
  font-size:18px;
  line-height:1.2;
  margin-bottom:5px;
}
.brandbook-shot .product-shot-badge span{
  display:block;
  color:#c9ced7;
  font-size:13px;
  line-height:1.45;
}
.brandbook-theme .hero-cta{
  position:relative;
  z-index:3;
  margin-top:26px;
}
.brandbook-theme .digital-delivery-note{
  position:relative;
  z-index:3;
  margin-top:14px;
}
@media(max-width:980px){
  .brandbook-theme .theme-grid{column-gap:32px}
}
@media(max-width:860px){
  .brandbook-theme .theme-grid{display:grid;grid-template-columns:1fr;row-gap:34px}
  .brandbook-shot{max-width:720px;width:100%;margin:0 auto}
}


/* CTA BUTTON FIX 2026-09-17 */
.brandbook-theme .hero-cta{
  display:flex;
  flex-wrap:wrap;
  gap:14px;
  align-items:center;
}
.brandbook-theme .hero-cta .btn{
  min-height:54px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  box-sizing:border-box;
  text-decoration:none;
  font-weight:800;
}
.brandbook-theme .hero-cta .btn-secondary{
  background:#ffffff !important;
  border:1px solid rgba(255,255,255,.92) !important;
  color:#24283a !important;
  -webkit-text-fill-color:#24283a !important;
  opacity:1 !important;
  box-shadow:0 10px 24px rgba(0,0,0,.16);
}
.brandbook-theme .hero-cta .btn-secondary:visited,
.brandbook-theme .hero-cta .btn-secondary:focus,
.brandbook-theme .hero-cta .btn-secondary:hover{
  color:#24283a !important;
  -webkit-text-fill-color:#24283a !important;
}
.brandbook-theme .hero-cta .btn-secondary:hover{
  background:#f5f4f1 !important;
  transform:translateY(-1px);
}
@media(max-width:560px){
  .brandbook-theme .hero-cta .btn{width:100%;}
}


/* CTA BUTTON FIX V2 2026-09-17 — independent of global .btn/.btn-secondary rules */
.brandbook-theme .hero-cta .brandbook-content-btn{
  appearance:none !important;
  -webkit-appearance:none !important;
  position:relative !important;
  z-index:10 !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-width:205px !important;
  min-height:54px !important;
  padding:0 28px !important;
  margin:0 !important;
  box-sizing:border-box !important;
  border:1px solid #ffffff !important;
  border-radius:12px !important;
  background:#ffffff !important;
  background-image:none !important;
  color:#24283a !important;
  -webkit-text-fill-color:#24283a !important;
  -webkit-background-clip:border-box !important;
  background-clip:border-box !important;
  font-family:inherit !important;
  font-size:16px !important;
  font-weight:800 !important;
  font-style:normal !important;
  line-height:1.2 !important;
  letter-spacing:0 !important;
  text-align:center !important;
  text-decoration:none !important;
  text-indent:0 !important;
  text-transform:none !important;
  text-shadow:none !important;
  white-space:nowrap !important;
  opacity:1 !important;
  visibility:visible !important;
  filter:none !important;
  mix-blend-mode:normal !important;
  overflow:visible !important;
  cursor:pointer !important;
  box-shadow:0 10px 24px rgba(0,0,0,.16) !important;
}
.brandbook-theme .hero-cta .brandbook-content-btn::before,
.brandbook-theme .hero-cta .brandbook-content-btn::after{
  content:none !important;
  display:none !important;
}
.brandbook-theme .hero-cta .brandbook-content-btn:hover,
.brandbook-theme .hero-cta .brandbook-content-btn:focus{
  background:#f5f4f1 !important;
  background-image:none !important;
  color:#24283a !important;
  -webkit-text-fill-color:#24283a !important;
  outline:2px solid rgba(255,255,255,.35) !important;
  outline-offset:2px !important;
  transform:translateY(-1px) !important;
}
@media(max-width:560px){
  .brandbook-theme .hero-cta .brandbook-content-btn{width:100% !important;}
}
