/* base.css - variables, reset, page zones */

/* ===== VARIABLES ===== */
:root{
  --org:#E87722;--org2:#F59548;
  --org-l:rgba(232,119,34,0.12);--org-ll:#FFF3E0;
  --blu:#1565C0;--blu2:#1E88E5;--blu-l:#E3F2FD;
  --text:#2D1A00;--sub:#5A4A38;--hint:#9A8A78;
  --card:rgba(255,255,255,0.90);--card-hov:rgba(255,255,255,0.98);
  --bdr:rgba(232,119,34,0.15);
  --r:14px;--rl:22px;--rxl:32px;
  --shadow:0 4px 24px rgba(232,119,34,0.10);
  --fs-xs:12px;--fs-sm:14px;--fs-md:14px;--fs-lg:16px;--fs-xl:16px;
  --fs-section:18px;--fs-title:26px;--fs-hero:34px;
  --fw-normal:500;--fw-strong:700;--fw-heavy:800;
  --page-wide:1240px;--page-mid:1100px;--page-narrow:900px;--page-doc:800px;
  --page-pad-x:28px;--page-pad-top:34px;--page-pad-bottom:80px;
}

/* ===== RESET ===== */
*{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{font-family:'Zen Kaku Gothic New',sans-serif;color:var(--text);font-size:var(--fs-md);font-weight:var(--fw-normal);line-height:1.7;min-height:100vh;}
a{text-decoration:none;color:inherit;}
button{font-family:inherit;cursor:pointer;}
input,select,textarea{font-family:inherit;}

/* ===== ZONE BODIES =====
   在 <body> 加 class 來設定背景區域
   Zone 1/3/auth：加 .has-bg，並在頁面 <style> 加 body{background-image:url(...)}
   Zone 3 member：加 .has-bg.z3
   Zone 2 購物流程：加 .z2
   白底法律/帳號頁：加 .z-white
   需要 flex-column 的頁面：加 .z-col（login/register/terms/disclaimer）

   背景圖改由 ::before（position:fixed + cover）繪製。
   不可使用 background-attachment:fixed：iOS Safari 會以整頁高度做 cover，真機看起來像放大裁切。
*/
body.has-bg{
  background-color:#D4E8FF;
  background-repeat:no-repeat;
  background-size:0 0;
  isolation:isolate;
}
body.has-bg::before{
  content:'';
  position:fixed;
  inset:0;
  width:100%;
  height:100%;
  min-height:100dvh;
  z-index:-1;
  pointer-events:none;
  background-color:#D4E8FF;
  background-image:inherit;
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
}
body.z2{background:#F5F6F8;}
body.z-white{background:#F5F7FA;}
body.z-col{display:flex;flex-direction:column;}
