/* Thai Webstudio — client-facing pricing catalog. Sits on premium.css tokens (Siam Celadon v3).
   Fixed site palette (bone light sections + ink dark accents), not a viewer theme toggle. */

.pc-surface{ --card:#FBFAF5; }

/* ── hero header ─────────────────────────────────────────── */
.pc-hero{position:relative;background:var(--ink);color:var(--bone);overflow:hidden;padding:clamp(128px,17vw,190px) 0 clamp(48px,7vw,78px)}
.pc-hero .heromesh{position:absolute;inset:0;z-index:0;--mkx-mesh-a:#2f7d5e;--mkx-mesh-b:#3f9b7a;--mkx-mesh-c:#b8904a;--mkx-mesh-opacity:.55;--mkx-ambient-duration:44s}
.pc-hero::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(to top,rgba(5,10,8,.55),transparent 52%)}
.pc-hero .wrap{position:relative;z-index:2}
.pc-hero .kick{display:flex;align-items:center;gap:14px;margin-bottom:20px}
.pc-hero .kick .rule{width:56px;height:1px;background:var(--brass)}
.pc-hero h1{font-family:var(--tserif);font-weight:600;font-size:clamp(34px,5.4vw,64px);line-height:1.12;letter-spacing:-.006em;max-width:16ch}
.pc-hero .h1en{font-family:var(--serif)}
.pc-hero p{font-family:var(--tsans);font-size:clamp(15px,1.7vw,18px);color:#c7bda9;margin-top:20px;max-width:52ch;line-height:1.8}
.pc-hero .trust{display:flex;gap:26px;margin-top:32px;flex-wrap:wrap}
.pc-hero .trust span{font-size:13px;color:#b6ab98;display:flex;align-items:center;gap:8px}
.pc-hero .trust span::before{content:"›";color:var(--brass)}

/* ── section scaffold ────────────────────────────────────── */
.pc-sec{padding:clamp(52px,8vw,88px) 0}
.pc-sec.tint{background:var(--bone-2)}
.pc-sec .head{margin-bottom:clamp(28px,4vw,44px)}
.pc-sec .eyebrow{display:block;margin-bottom:14px}
.pc-sec h2{font-family:var(--tserif);font-weight:600;font-size:clamp(24px,3.4vw,38px);line-height:1.22;letter-spacing:-.004em;max-width:22ch}
.pc-sec.en h2{font-family:var(--serif)}
.pc-sec .head p{font-family:var(--tsans);color:#5f5645;font-size:15.5px;line-height:1.8;max-width:56ch;margin-top:14px}

/* ── line-item table (foundation, reach) ─────────────────── */
.pc-items{border:1px solid var(--line);border-radius:12px;overflow:hidden;background:var(--card)}
.pc-row{display:grid;grid-template-columns:1fr auto;gap:16px 28px;align-items:baseline;padding:17px 22px;border-top:1px solid var(--line)}
.pc-row:first-child{border-top:0}
.pc-row .t{font-family:var(--tserif);font-weight:600;font-size:16px}
.pc-sec.en .pc-row .t{font-family:var(--serif)}
.pc-row .d{font-family:var(--tsans);color:#5f5645;font-size:13.5px;margin-top:4px;line-height:1.6}
.pc-row .p{font-family:var(--serif);font-size:18px;color:var(--brass-deep);white-space:nowrap;text-align:right;font-variant-numeric:tabular-nums}
.pc-row .p small{display:block;font-family:var(--tsans);font-size:11.5px;color:var(--muted);margin-top:3px;letter-spacing:.01em}
.pc-row .p .two{color:var(--clay)}

/* ── membership tiers ────────────────────────────────────── */
.pc-tiers{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.pc-tier{position:relative;border:1px solid var(--line);border-radius:15px;background:var(--card);padding:26px 22px 26px;display:flex;flex-direction:column}
.pc-tier.flag{border:1.5px solid var(--brass);box-shadow:0 24px 50px -28px rgba(176,137,78,.5)}
.pc-tier .chip{position:absolute;top:-12px;left:22px;background:var(--brass);color:#241a06;font:700 11px/1 var(--tsans);letter-spacing:.05em;text-transform:uppercase;padding:5px 13px;border-radius:100px}
.pc-tier .tname{font-family:var(--tserif);font-weight:600;font-size:22px}
.pc-sec.en .pc-tier .tname{font-family:var(--serif)}
.pc-tier .tprice{font-family:var(--serif);font-size:32px;color:var(--brass-deep);margin:10px 0 2px;font-variant-numeric:tabular-nums}
.pc-tier .tprice span{font-size:14px;color:var(--muted)}
.pc-tier .tnote{font-family:var(--tsans);font-size:13px;color:#5f5645;min-height:2.6em;margin-bottom:16px;line-height:1.55}
.pc-tier ul{list-style:none;margin:0;padding:18px 0 0;border-top:1px solid var(--line);display:flex;flex-direction:column;gap:10px;font-family:var(--tsans);font-size:14px}
.pc-tier li{position:relative;padding-left:19px;color:var(--ink);line-height:1.5}
.pc-tier li::before{content:"›";position:absolute;left:0;top:0;color:var(--clay);font-weight:700}
.pc-tier li b{font-variant-numeric:tabular-nums;color:var(--brass-deep)}
.pc-tier li.off{color:var(--muted-lo)}
.pc-tier li.off::before{content:"–";color:var(--muted-lo)}

/* ── duo cards (messaging, reach) ────────────────────────── */
.pc-duo{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.pc-card{border:1px solid var(--line);border-radius:15px;background:var(--card);padding:22px 24px}
.pc-card h3{font-family:var(--tserif);font-weight:600;font-size:18px;margin:0 0 4px;display:flex;align-items:baseline;justify-content:space-between;gap:12px;flex-wrap:wrap}
.pc-sec.en .pc-card h3{font-family:var(--serif)}
.pc-card h3 .hp{font-family:var(--serif);font-size:17px;color:var(--brass-deep);font-variant-numeric:tabular-nums;white-space:nowrap}
.pc-card .hint{font-family:var(--tsans);font-size:12.5px;color:#5f5645;margin:0 0 16px;line-height:1.6}
.pc-prow{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:baseline;padding:11px 0;border-top:1px solid var(--line)}
.pc-prow:first-of-type{border-top:0}
.pc-prow .lab{font-family:var(--tsans);font-size:14px}
.pc-prow .lab small{display:block;color:var(--muted);font-size:12px;margin-top:2px}
.pc-prow .amt{font-family:var(--serif);font-size:16px;color:var(--brass-deep);white-space:nowrap;font-variant-numeric:tabular-nums}
.pc-tag{display:inline-block;font:600 11px/1.4 var(--tsans);padding:3px 9px;border-radius:100px;background:rgba(63,143,111,.14);color:var(--clay);border:1px solid rgba(63,143,111,.3)}

/* ── note callout ────────────────────────────────────────── */
.pc-note{border-left:3px solid var(--clay);background:rgba(63,143,111,.07);border-radius:0 11px 11px 0;padding:15px 20px;font-family:var(--tsans);font-size:13.5px;color:#4b4636;margin-top:18px;line-height:1.7}
.pc-note b{color:var(--clay)}

/* ── add-on chips ────────────────────────────────────────── */
.pc-chips{display:flex;flex-wrap:wrap;gap:11px}
.pc-chips .a{border:1px solid var(--line);border-radius:100px;background:var(--card);padding:10px 16px;font-family:var(--tsans);font-size:13.5px;display:flex;align-items:baseline;gap:9px}
.pc-chips .a b{font-family:var(--serif);color:var(--brass-deep);font-variant-numeric:tabular-nums}

/* ── bundle (dark) ───────────────────────────────────────── */
.pc-bundle-sec{background:var(--ink);color:var(--bone)}
.pc-bundle{display:grid;grid-template-columns:1fr auto;gap:28px;align-items:center}
.pc-bundle .bt{font-family:var(--tserif);font-weight:600;font-size:clamp(22px,3vw,30px)}
.pc-sec.en .pc-bundle .bt{font-family:var(--serif)}
.pc-bundle .bd{font-family:var(--tsans);font-size:15px;color:#c7bda9;margin-top:10px;max-width:52ch;line-height:1.75}
.pc-bundle .bp{text-align:right;white-space:nowrap}
.pc-bundle .bp .big{font-family:var(--serif);font-size:clamp(34px,5vw,46px);color:var(--brass);font-variant-numeric:tabular-nums}
.pc-bundle .bp .big span{font-size:15px;color:var(--muted-lo)}
.pc-bundle .bp .was{font-size:13px;color:var(--muted);text-decoration:line-through;margin-top:3px}

/* ── closing CTA ─────────────────────────────────────────── */
.pc-cta{text-align:center;padding:clamp(56px,8vw,90px) 0}
.pc-cta h2{font-family:var(--tserif);font-weight:600;font-size:clamp(24px,3.4vw,38px);max-width:20ch;margin:0 auto}
.pc-sec.en .pc-cta h2{font-family:var(--serif)}
.pc-cta p{font-family:var(--tsans);color:#5f5645;font-size:15.5px;margin:16px auto 30px;max-width:46ch;line-height:1.8}
.pc-cta .actions{display:flex;gap:20px;justify-content:center;align-items:center;flex-wrap:wrap}

@media (max-width:820px){
  .pc-tiers{grid-template-columns:1fr}
  .pc-duo{grid-template-columns:1fr}
  .pc-bundle{grid-template-columns:1fr}
  .pc-bundle .bp{text-align:left}
}