/* Lớp "chiều sâu" dùng chung cho MỌI trang công khai của sang5m.com (trang tĩnh, blog, trang bán hàng).
   Nạp SAU token design system để ghi đè bo góc/bóng: nền ngà ấm + quầng vàng mờ, thẻ trắng bo 16px
   có bóng nhiều lớp pha nâu vàng (hợp tông vàng thương hiệu). Giao diện SÁNG, không nền đen. */

:root{
  --nen-nga:#FAF7F0;                 /* nền trang: ngà ấm, không trắng bệch */
  --nen-nga-dam:#F3EDE1;             /* dải xen kẽ */
  --vien-mo:rgba(17,17,17,.07);      /* viền thẻ trên nền ngà */
  --bong-1:0 1px 2px rgba(74,52,10,.05),0 4px 14px rgba(74,52,10,.06);
  --bong-2:0 2px 4px rgba(74,52,10,.05),0 14px 36px rgba(74,52,10,.10);
  --bong-3:0 4px 10px rgba(74,52,10,.07),0 24px 56px rgba(74,52,10,.14);
  --bong-vang:0 6px 18px rgba(184,140,38,.32);
  --bo-the:16px;
  --bo-nut:10px;
  --luoi-mo:linear-gradient(rgba(17,17,17,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(17,17,17,.045) 1px,transparent 1px);
  --chuyen:220ms cubic-bezier(.2,.7,.2,1);
  /* Ghi đè token design system: trang nào dùng token (kể cả style viết thẳng trong HTML) cũng đồng bộ. */
  --radius-sm:8px;
  --radius-md:12px;
  --radius-lg:16px;
  --radius-card:16px;
  --radius-button:10px;
  --radius-input:10px;
  --radius-media:14px;
  --shadow-sm:var(--bong-1);
  --shadow-md:var(--bong-2);
  --shadow-lg:var(--bong-3);
  --bg-page:transparent;
  --page-cream:transparent;          /* trang webinar 5M Studio: nền khối để lộ nền ngà + quầng sáng */
}

html{background:var(--nen-nga)}
body{background:transparent}
/* Quầng sáng vàng cố định phía sau mọi trang (không cuộn theo, không chặn bấm). */
body::before{content:'';position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:radial-gradient(900px 520px at 8% -6%,rgba(235,206,134,.38),transparent 62%),radial-gradient(760px 480px at 100% 4%,rgba(247,239,217,.9),transparent 60%),radial-gradient(900px 600px at 50% 110%,rgba(235,206,134,.18),transparent 60%)}

/* ---- Trang bán hàng (/5m-studio/mua, /5m-studio/thi-dua): bộ class .s5-* riêng ---- */
.s5-hero{background:transparent}
.s5-sec--alt{background:var(--nen-nga-dam)}
.s5-card,.s5-faq,.s5-board{border-radius:var(--bo-the);border-color:var(--vien-mo);box-shadow:var(--bong-1)}
.s5-card--gold{border-color:rgba(212,166,58,.35)}
.s5-signup{border-radius:20px}
.s5-prize,.s5-pod{border-radius:var(--bo-the)}
.s5-btn,.s5-copy,.s5-choice label{border-radius:var(--bo-nut)}
.s5-field input,.s5-field select,.s5-field textarea{border-radius:var(--bo-nut)}
.s5-status,.s5-tabs,.s5-qr img{border-radius:12px}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{transition-duration:.01ms!important}
}