/* ================================================================
   GREENWOOD GOLF CLUB — CHAMPIONSHIP LIGHT THEME  v3
   วางที่ assets/css/theme-light.css
   ================================================================ */

/* ── ROOT variables override ────────────────────────────────── */
:root {
  --ink   : #1a2e1a !important;
  --pine  : #f0ece2 !important;
  --linen : #1a2e1a !important;
  --gold  : #c8a96e !important;
  --gilt  : #9a7a3a !important;
}

/* ── BODY ── */
body  { background: #f5f0e8 !important; color: #1a2e1a !important; }
.main { background: #f5f0e8 !important; }

/* ════════════════════
   NAV
════════════════════ */
.nav, .nav--transparent {
  background: #ffffff !important;
  backdrop-filter: none !important;
  border-bottom: 1px solid rgba(26,46,26,0.07) !important;
  box-shadow: none !important;
  position: relative;
}
.nav::after {
  content: '';
  position: absolute;
  bottom: 0; left: 0; right: 0; height: 2px;
  background: linear-gradient(90deg,transparent,#c8a96e 30%,#e8d080 50%,#c8a96e 70%,transparent);
  pointer-events: none;
}
.nav.scrolled { background: #ffffff !important; box-shadow: 0 2px 20px rgba(26,46,26,0.06) !important; }
.nav .nav-links a,
.nav .nav-links li a            { color: rgba(26,46,26,0.55) !important; text-shadow: none !important; }
.nav .nav-links a:hover,
.nav .nav-links li a:hover      { color: #1a2e1a !important; text-shadow: none !important; }
.nav .nav-links a.active        { color: #1a2e1a !important; text-shadow: none !important; }
.nav .nav-links a.nav-cta       { background: #1a2e1a !important; color: #f5f0e8 !important; text-shadow: none !important; }
.nav .nav-links a.nav-cta:hover { background: #2a4a2a !important; }
.nav.scrolled .nav-links a,
.nav.scrolled .nav-links li a   { color: rgba(26,46,26,0.55) !important; text-shadow: none !important; }
.nav-logo img  { filter: none !important; }
.nav-ham       { color: #1a2e1a !important; }
.nav-ham:hover { color: #c8a96e !important; }
.overlay { background: rgba(26,46,26,0.38) !important; }
.drawer  { background: #ffffff !important; box-shadow: 4px 0 24px rgba(26,46,26,0.08) !important; }
.drawer ul li a       { color: rgba(26,46,26,0.65) !important; }
.drawer ul li a:hover { color: #c8a96e !important; }
.drawer-close { color: #1a2e1a !important; }

/* ════════════════════
   HERO (index.html)
════════════════════ */
.hero-title    { color: #ffffff !important; text-shadow: 0 2px 4px rgba(0,0,0,0.65), 0 4px 16px rgba(0,0,0,0.5), 0 0 2px rgba(0,0,0,0.8) !important; }
.hero-title em { color: #f5d97a !important; text-shadow: 0 2px 4px rgba(0,0,0,0.7), 0 4px 16px rgba(0,0,0,0.55) !important; }
.hero-sub      { color: rgba(255,255,255,0.9) !important; text-shadow: 0 1px 6px rgba(0,0,0,0.65) !important; }
.eyebrow span  { color: rgba(255,240,180,0.95) !important; text-shadow: 0 1px 6px rgba(0,0,0,0.55) !important; }
.eyebrow-line  { background: rgba(200,169,110,0.55) !important; }
.divider-line  { background: rgba(200,169,110,0.4) !important; }
.divider-gem   { background: #c8a96e !important; }
.scroll-ind span { color: rgba(255,255,255,0.42) !important; }
.scroll-bar      { background: rgba(200,169,110,0.5) !important; }
.orb-1,.orb-2    { opacity: 0.1 !important; }
.hero-ring       { border-color: rgba(200,169,110,0.06) !important; }
.hero::after {
  content: '';
  position: absolute; inset: 0;
  background: linear-gradient(to bottom,rgba(0,0,0,0.08) 0%,rgba(0,0,0,0.05) 30%,rgba(0,0,0,0.32) 60%,rgba(0,0,0,0.58) 100%);
  pointer-events: none; z-index: 1;
}
.hero-content, .hero .hero-content { position: relative !important; z-index: 4 !important; }
.scroll-ind { position: relative !important; z-index: 4 !important; }
.btn-g       { background: #c8a96e !important; color: #1a2e1a !important; font-weight: 600 !important; }
.btn-g:hover { background: #e0be82 !important; }
.btn-o       { border-color: rgba(255,255,255,0.42) !important; color: rgba(255,255,255,0.82) !important; }
.btn-o:hover { border-color: #c8a96e !important; color: #c8a96e !important; }

/* ════════════════════
   PAGE HEADER (inner pages)
════════════════════ */
.page-hd-title     { color: #ffffff !important; text-shadow: 0 2px 16px rgba(0,0,0,0.4) !important; }
.page-hd-title em  { color: #f5d97a !important; }
.page-hd-bc        { color: rgba(255,255,255,0.55) !important; }
.page-hd-gem       { background: #c8a96e !important; }
.page-hd-dl        { background: rgba(200,169,110,0.4) !important; }
.page-hd-orb       { opacity: 0.08 !important; }
.page-hd-fade      { background: linear-gradient(to bottom, transparent 40%, rgba(245,240,232,0.95) 100%) !important; }

/* contact hero */
.contact-hero-title     { color: #ffffff !important; text-shadow: 0 2px 16px rgba(0,0,0,0.4) !important; }
.contact-hero-title em  { color: #f5d97a !important; }
.contact-hero-bc        { color: rgba(255,255,255,0.55) !important; }

/* ════════════════════
   ABOUT
════════════════════ */
.sec.about, .about  { background: #ffffff !important; }
.lbl    { color: #c8a96e !important; }
.disp   { color: #1a2e1a !important; }
.disp em { color: #4a7a30 !important; }
.about p, .about-text p { color: rgba(26,46,26,0.6) !important; }
.img-frame  { border-color: rgba(200,169,110,0.25) !important; }
.img-badge  { background: #c8a96e !important; color: #1a2e1a !important; box-shadow: 0 4px 16px rgba(200,169,110,0.3) !important; }
.img-badge big  { color: #1a2e1a !important; }
.img-badge span { color: rgba(26,46,26,0.55) !important; }
.stats { border-color: rgba(200,169,110,0.12) !important; }
.stat  { border-color: rgba(200,169,110,0.1) !important; }
.stat big   { color: #1a2e1a !important; }
.stat small { color: rgba(26,46,26,0.4) !important; }
.img-placeholder { background: #f5f0e8 !important; border: 2px solid rgba(200,169,110,0.25) !important; display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: center !important; gap: 20px !important; min-height: 360px !important; }
.img-placeholder img { width: 280px !important; height: auto !important; filter: drop-shadow(0 6px 20px rgba(26,46,26,0.25)) !important; opacity: 1 !important; transform: scale(1.1) !important; }
.img-placeholder p   { font-size: 0.75rem !important; font-weight: 600 !important; letter-spacing: 0.35em !important; color: rgba(26,46,26,0.5) !important; text-align: center !important; }

/* ════════════════════
   DESIGNER BAND
════════════════════ */
.designer-band { background: #ffffff; border-top: 3px solid #c8a96e; border-bottom: 1px solid rgba(26,46,26,0.07); padding: 28px 56px; display: flex; align-items: center; gap: 28px; flex-wrap: wrap; }
.db-icon       { width: 52px; height: 52px; background: #1a2e1a; border-radius: 50%; display: flex; align-items: center; justify-content: center; flex-shrink: 0; font-size: 20px; color: #c8a96e; }
.db-overline   { font-size: 8px; letter-spacing: 0.35em; color: #c8a96e; margin-bottom: 4px; font-family: 'Josefin Sans', sans-serif; }
.db-title      { font-family: 'Playfair Display', serif; font-size: 20px; font-weight: 700; color: #1a2e1a; line-height: 1.15; }
.db-title em   { font-style: italic; font-weight: 400; color: #4a7a30; }
.db-sub        { font-size: 9px; letter-spacing: 0.1em; color: rgba(26,46,26,0.38); margin-top: 5px; font-family: 'Josefin Sans', sans-serif; }
.db-divider    { width: 1px; height: 56px; background: rgba(26,46,26,0.1); flex-shrink: 0; }
.db-quote      { flex: 1; min-width: 180px; font-family: 'Playfair Display', serif; font-size: 13px; font-style: italic; color: rgba(26,46,26,0.48); line-height: 1.65; }
.db-quote::before { content: '\201C'; font-size: 22px; color: #c8a96e; line-height: 0; vertical-align: -5px; margin-right: 2px; }
.db-quote::after  { content: '\201D'; font-size: 22px; color: #c8a96e; line-height: 0; vertical-align: -5px; margin-left: 2px; }
.db-crest     { flex-shrink: 0; text-align: center; border: 1px solid rgba(200,169,110,0.28); padding: 14px 18px; background: #f5f0e8; }
.db-crest-top { font-size: 7px; letter-spacing: 0.28em; color: #c8a96e; display: block; font-family: 'Josefin Sans', sans-serif; }
.db-crest-num { font-family: 'Playfair Display', serif; font-size: 30px; font-weight: 700; color: #1a2e1a; line-height: 1; display: block; margin: 2px 0; }
.db-crest-bot { font-size: 7px; letter-spacing: 0.18em; color: rgba(26,46,26,0.4); font-family: 'Josefin Sans', sans-serif; }

/* ════════════════════
   COURSES + AMENITIES (home)
════════════════════ */
.sec.courses, .courses { background: #f5f0e8 !important; }
.courses-lbl    { color: #c8a96e !important; }
.courses-hd .disp { color: #1a2e1a !important; }
.courses-hd p   { color: rgba(26,46,26,0.48) !important; }
.c-card         { background: #ffffff !important; border-color: rgba(26,46,26,0.08) !important; box-shadow: 0 2px 14px rgba(26,46,26,0.05) !important; }
.c-card:hover   { box-shadow: 0 8px 32px rgba(26,46,26,0.1) !important; }
.c-overlay      { background: linear-gradient(180deg,transparent 30%,rgba(26,46,26,0.7) 100%) !important; }
.c-num  { color: rgba(26,46,26,0.05) !important; }
.c-tag  { color: #c8a96e !important; border-color: rgba(200,169,110,0.22) !important; }
.c-title { color: #1a2e1a !important; }
.c-desc  { color: rgba(26,46,26,0.52) !important; }
.c-holes { color: rgba(26,46,26,0.4) !important; border-color: rgba(200,169,110,0.15) !important; }
.sec.amenities, .amenities { background: #ffffff !important; }
.am-lbl  { color: #c8a96e !important; }
.am-item { background: #f5f0e8 !important; border-color: rgba(26,46,26,0.06) !important; }
.am-item:hover { background: #ffffff !important; border-color: rgba(200,169,110,0.25) !important; box-shadow: 0 6px 24px rgba(26,46,26,0.07) !important; }
.am-icon  { color: #c8a96e !important; }
.am-item h3 { color: #1a2e1a !important; }
.am-item p  { color: rgba(26,46,26,0.48) !important; }
.cta   { background: #1a2e1a !important; }
.cta h2 { color: #f5f0e8 !important; }
.cta p  { color: rgba(245,240,232,0.42) !important; }
.btn-d  { background: #c8a96e !important; color: #1a2e1a !important; font-weight: 600 !important; }
.btn-d:hover { background: #e0be82 !important; }

/* ════════════════════
   COURSE PAGE
════════════════════ */
.course-section  { background: #f5f0e8 !important; }
.course-tabs     { border-color: rgba(200,169,110,0.15) !important; background: #ffffff !important; }
.course-tab      { color: rgba(26,46,26,0.42) !important; background: transparent !important; }
.course-tab:hover  { color: #1a2e1a !important; }
.course-tab.active { color: #1a2e1a !important; border-color: #c8a96e !important; }
.overview-card   { background: #ffffff !important; border-color: rgba(26,46,26,0.08) !important; box-shadow: 0 2px 14px rgba(26,46,26,0.05) !important; }
.overview-card:hover { border-color: rgba(200,169,110,0.35) !important; box-shadow: 0 8px 32px rgba(26,46,26,0.09) !important; }
.ov-letter { color: rgba(200,169,110,0.12) !important; }
.ov-tag    { color: #c8a96e !important; }
.ov-title  { color: #1a2e1a !important; }
.ov-desc   { color: rgba(26,46,26,0.52) !important; }
.ov-link   { color: #c8a96e !important; }
.overview-stats { background: #f0ece2 !important; border-color: rgba(200,169,110,0.1) !important; }
.ov-stat   { border-color: rgba(200,169,110,0.1) !important; }
.ov-stat big   { color: #1a2e1a !important; }
.ov-stat small { color: rgba(26,46,26,0.38) !important; }
.course-tag      { color: #c8a96e !important; border-color: rgba(200,169,110,0.25) !important; }
.course-title    { color: #1a2e1a !important; }
.course-title em { color: #4a7a30 !important; }
.course-desc     { color: rgba(26,46,26,0.62) !important; }
.course-num      { color: rgba(200,169,110,0.1) !important; }
.course-img-frame { border-color: rgba(200,169,110,0.25) !important; }
.course-meta-item { background: #ffffff !important; border-color: rgba(26,46,26,0.07) !important; }
.course-meta-item i      { color: #c8a96e !important; }
.course-meta-item strong { color: #1a2e1a !important; }
.course-meta-item span   { color: rgba(26,46,26,0.42) !important; }
.course-img-wrap::after  { background: rgba(245,240,232,0.85) !important; border-color: rgba(26,46,26,0.1) !important; color: rgba(26,46,26,0.55) !important; }
.holes-title     { color: rgba(26,46,26,0.18) !important; border-color: rgba(200,169,110,0.1) !important; }
.hole-card       { background: #ffffff !important; border-color: rgba(26,46,26,0.07) !important; }
.hole-card:hover { box-shadow: 0 8px 24px rgba(26,46,26,0.1) !important; }
.hole-num        { color: #1a2e1a !important; background: rgba(245,240,232,0.92) !important; }
.hole-info       { background: #ffffff !important; border-color: rgba(26,46,26,0.05) !important; }
.hole-badge      { background: #f0ece2 !important; color: rgba(26,46,26,0.52) !important; border-color: rgba(26,46,26,0.06) !important; }
.hole-badge.gold { background: rgba(200,169,110,0.14) !important; color: #9a7a3a !important; border-color: rgba(200,169,110,0.25) !important; }
.hole-badge--hcp { background: rgba(26,46,26,0.05) !important; color: rgba(26,46,26,0.4) !important; }
.hole-card-hint  { background: rgba(245,240,232,0.9) !important; border-color: rgba(200,169,110,0.3) !important; color: #9a7a3a !important; }
#hole-lb         { background: rgba(200,190,170,0.88) !important; }
.hlb-box         { background: #ffffff !important; border-color: rgba(200,169,110,0.18) !important; box-shadow: 0 20px 60px rgba(26,46,26,0.14) !important; }
.hlb-bar         { background: linear-gradient(90deg,#c8a96e,#e8d080,#c8a96e) !important; }
.hlb-header      { border-color: rgba(26,46,26,0.07) !important; }
.hlb-title       { color: #1a2e1a !important; }
.hlb-title span  { color: #c8a96e !important; }
.hlb-close       { color: rgba(26,46,26,0.3) !important; }
.hlb-close:hover { color: #c8a96e !important; }
.hlb-footer      { background: #f5f0e8 !important; }
.hlb-counter     { color: rgba(26,46,26,0.38) !important; }
.hlb-dot         { background: rgba(200,169,110,0.18) !important; }
.hlb-dot.active  { background: #c8a96e !important; }
.hlb-arrow       { background: rgba(245,240,232,0.88) !important; border-color: rgba(26,46,26,0.1) !important; color: rgba(26,46,26,0.62) !important; }
.hlb-arrow:hover { background: rgba(200,169,110,0.14) !important; border-color: #c8a96e !important; }
.hlb-empty       { color: rgba(200,169,110,0.3) !important; }
.hlb-empty p     { color: rgba(26,46,26,0.22) !important; }
#course-zoom-overlay { background: rgba(200,190,170,0.94) !important; }
.cz-close        { background: rgba(245,240,232,0.88) !important; border-color: rgba(26,46,26,0.1) !important; color: rgba(26,46,26,0.62) !important; }
.cz-close:hover  { background: rgba(200,169,110,0.14) !important; border-color: #c8a96e !important; color: #9a7a3a !important; }
.cz-label        { color: rgba(26,46,26,0.38) !important; }

/* ════════════════════
   RESTAURANT PAGE
════════════════════ */
.intro           { background: #ffffff !important; }
.intro-lbl       { color: #c8a96e !important; }
.intro h2        { color: #1a2e1a !important; }
.intro h2 em     { color: #4a7a30 !important; }
.intro p         { color: rgba(26,46,26,0.6) !important; }
.intro-facts     { border-color: rgba(200,169,110,0.12) !important; }
.intro-fact      { border-color: rgba(200,169,110,0.1) !important; }
.intro-fact big  { color: #1a2e1a !important; }
.intro-fact small { color: rgba(26,46,26,0.38) !important; }
.intro-frame     { border-color: rgba(200,169,110,0.22) !important; }
.intro-img-ph    { background: #f0ece2 !important; color: rgba(200,169,110,0.4) !important; }
.gallery-section { background: #f5f0e8 !important; }
.sec-label       { color: #c8a96e !important; }
.sec-title       { color: #1a2e1a !important; }
.sec-title em    { color: #4a7a30 !important; }
.menu-section    { background: #1a2e1a !important; }
.menu-section .sec-label { color: #c8a96e !important; }
.menu-section .sec-title { color: #f5f0e8 !important; }
.menu-section .sec-title em { color: #e8d080 !important; }
.menu-item       { background: rgba(255,255,255,0.06) !important; border-color: rgba(200,169,110,0.15) !important; }
.menu-item:hover { background: rgba(255,255,255,0.1) !important; border-color: rgba(200,169,110,0.35) !important; }
.menu-icon       { color: #c8a96e !important; }
.menu-item h3    { color: #f5f0e8 !important; }
.menu-item p     { color: rgba(245,240,232,0.5) !important; }
.hours-section   { background: #ffffff !important; }
.hours-item      { border-color: rgba(200,169,110,0.1) !important; }
.hours-day       { color: rgba(26,46,26,0.45) !important; }
.hours-time      { color: #1a2e1a !important; }
.lb              { background: rgba(200,190,170,0.92) !important; }
.lb-wrap         { background: #ffffff !important; box-shadow: 0 20px 60px rgba(26,46,26,0.14) !important; }
.lb-close        { color: rgba(26,46,26,0.5) !important; }
.lb-close:hover  { color: #c8a96e !important; }
.lb-arrow        { background: rgba(245,240,232,0.88) !important; color: rgba(26,46,26,0.6) !important; }
.lb-arrow:hover  { background: rgba(200,169,110,0.15) !important; }
.lb-counter      { color: rgba(26,46,26,0.38) !important; }

/* ════════════════════
   GREEN FEE PAGE
════════════════════ */
.info-strip      { background: #ffffff !important; border-color: rgba(200,169,110,0.1) !important; }
.info-card       { background: #f5f0e8 !important; border-color: rgba(26,46,26,0.07) !important; }
.info-card:hover { border-color: rgba(200,169,110,0.3) !important; background: #ffffff !important; }
.info-icon       { color: #c8a96e !important; }
.info-card strong { color: #1a2e1a !important; }
.info-card span  { color: rgba(26,46,26,0.52) !important; }
.info-card p     { color: rgba(26,46,26,0.52) !important; }
.panel           { background: #ffffff !important; border-color: rgba(26,46,26,0.07) !important; box-shadow: 0 2px 16px rgba(26,46,26,0.05) !important; }
.panel-hd        { border-color: rgba(200,169,110,0.12) !important; background: #f5f0e8 !important; }
.panel-hd-title  { color: #1a2e1a !important; }
.panel-hd-title em { color: #4a7a30 !important; }
.up-btn          { background: #1a2e1a !important; color: #f5f0e8 !important; }
.up-btn:hover    { background: #2a4a2a !important; }
.drop            { background: #f5f0e8 !important; border-color: rgba(200,169,110,0.25) !important; }
.drop:hover      { border-color: #c8a96e !important; background: #ffffff !important; }
.drop-icon       { color: rgba(200,169,110,0.4) !important; }
.drop-hint       { color: rgba(26,46,26,0.42) !important; }
.prog            { background: #f5f0e8 !important; border-color: rgba(200,169,110,0.15) !important; }
.prog-bar        { background: rgba(26,46,26,0.08) !important; }
.prog-fill       { background: #c8a96e !important; }
.prog-txt        { color: rgba(26,46,26,0.45) !important; }
.gal-hd          { border-color: rgba(200,169,110,0.12) !important; }
.gal-hd-label    { color: #1a2e1a !important; }
.gal-count       { color: rgba(26,46,26,0.38) !important; }
.clear-btn       { color: rgba(26,46,26,0.4) !important; border-color: rgba(26,46,26,0.12) !important; }
.clear-btn:hover { color: #c8250a !important; border-color: #c8250a !important; }
.gal-item        { border-color: rgba(26,46,26,0.07) !important; background: #ffffff !important; }
.gal-del         { background: rgba(245,240,232,0.88) !important; color: rgba(26,46,26,0.55) !important; }
.gal-del:hover   { background: #c8250a !important; color: #ffffff !important; }
.toast           { background: #1a2e1a !important; color: #f5f0e8 !important; }

/* ════════════════════
   CONTACT PAGE
════════════════════ */
.contact-main        { background: #f5f0e8 !important; }
.contact-intro-lbl   { color: #c8a96e !important; }
.contact-intro-lbl::before { background: #c8a96e !important; }
.contact-intro-title { color: #1a2e1a !important; }
.contact-intro-title em { color: #4a7a30 !important; }
.contact-intro-desc  { color: rgba(26,46,26,0.58) !important; }
.info-cards .info-card { background: #ffffff !important; border-color: rgba(200,169,110,0.12) !important; }
.contact-social a     { color: rgba(26,46,26,0.45) !important; border-color: rgba(200,169,110,0.2) !important; }
.contact-social a:hover { color: #c8a96e !important; border-color: #c8a96e !important; }
.contact-form         { background: #ffffff !important; border-color: rgba(26,46,26,0.07) !important; box-shadow: 0 2px 16px rgba(26,46,26,0.05) !important; }
.contact-form-title   { color: #1a2e1a !important; border-color: rgba(200,169,110,0.12) !important; }
.contact-form label   { color: rgba(26,46,26,0.55) !important; }
.contact-form input, .contact-form textarea, .contact-form select {
  background: #f5f0e8 !important; border-color: rgba(26,46,26,0.12) !important; color: #1a2e1a !important;
}
.contact-form input:focus, .contact-form textarea:focus {
  border-color: #c8a96e !important; box-shadow: 0 0 0 3px rgba(200,169,110,0.12) !important; outline: none !important;
}
.contact-form input::placeholder, .contact-form textarea::placeholder { color: rgba(26,46,26,0.3) !important; }
.contact-form-btn     { background: #1a2e1a !important; color: #f5f0e8 !important; }
.contact-form-btn:hover { background: #2a4a2a !important; }

/* ════════════════════
   REVIEWS + FOOTER
════════════════════ */
#reviews          { background: #f0ece2 !important; }
#reviews h2       { color: #1a2e1a !important; }
#reviews h2 em    { color: #9a7a3a !important; }
footer            { background: #1a2e1a !important; }
.f-col h4         { color: #c8a96e !important; }
.f-brand p, .f-col ul li a, .f-ci span, .f-bot span { color: rgba(245,240,232,0.52) !important; }
.f-col ul li a:hover { color: #c8a96e !important; }
.f-ci i           { color: #c8a96e !important; }
.f-social a       { color: rgba(245,240,232,0.35) !important; }
.f-social a:hover { color: #c8a96e !important; }
.f-bot            { border-color: rgba(200,169,110,0.1) !important; }

/* ════════════════════
   404 PAGE
════════════════════ */
.err-bg       { background: radial-gradient(ellipse at 50% 60%, rgba(240,232,210,0.9) 0%, #f5f0e8 70%) !important; }
.err-num      { -webkit-text-stroke: 1px rgba(200,169,110,0.18) !important; }
.err-icon     { color: #c8a96e !important; }
.err-title    { color: #1a2e1a !important; }
.err-title em { color: #9a7a3a !important; }
.err-desc     { color: rgba(26,46,26,0.48) !important; }
.err-btn--gold { background: #1a2e1a !important; color: #f5f0e8 !important; }
.err-btn--gold:hover { background: #2a4a2a !important; }
.err-btn--ghost { border-color: rgba(26,46,26,0.18) !important; color: rgba(26,46,26,0.52) !important; }
.err-btn--ghost:hover { border-color: #c8a96e !important; color: #9a7a3a !important; }
.err-divider span { background: rgba(200,169,110,0.14) !important; }
.err-divider p    { color: #c8a96e !important; }

/* ════════════════════
   COOKIE / FLOATING / POPUP
════════════════════ */
#cookie-banner   { background: #ffffff !important; border-color: rgba(200,169,110,0.15) !important; box-shadow: 0 -4px 24px rgba(26,46,26,0.06) !important; }
#cookie-banner p { color: rgba(26,46,26,0.55) !important; }
.cookie-accept   { background: #1a2e1a !important; color: #f5f0e8 !important; }
.cookie-decline  { color: rgba(26,46,26,0.42) !important; }
#fc-wrap .fc-btn       { background: #1a2e1a !important; }
#fc-wrap .fc-btn:hover { background: #2a4a2a !important; }
#fc-wrap .fc-dot       { background: #c8a96e !important; }
.popup-box       { background: #ffffff !important; border-color: rgba(200,169,110,0.15) !important; box-shadow: 0 20px 60px rgba(26,46,26,0.1) !important; }
.popup-close     { color: rgba(26,46,26,0.35) !important; }
.popup-close:hover { color: #c8a96e !important; }

/* ════════════════════
   SCROLLBAR
════════════════════ */
::-webkit-scrollbar       { width: 6px; }
::-webkit-scrollbar-track { background: #f0ece2; }
::-webkit-scrollbar-thumb { background: rgba(200,169,110,0.32); border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: #c8a96e; }

/* ════════════════════════════════════════════
   CONTACT PAGE — article.html INLINE CSS PATCH
   (inline styles ใช้ rgba(240,233,214,...) hardcode)
════════════════════════════════════════════ */

/* Info card body text — hardcoded ใน inline style */
.info-card-body h4      { color: #c8a96e !important; }
.info-card-body p,
.info-card-body a       { color: rgba(26,46,26,0.65) !important; }
.info-card-body a:hover { color: #9a7a3a !important; }
.info-card-icon         { background: rgba(200,169,110,0.1) !important; border-color: rgba(200,169,110,0.2) !important; color: #c8a96e !important; }
.info-card              { border-color: rgba(200,169,110,0.1) !important; }

/* Hours table in contact */
.hours-row              { color: rgba(26,46,26,0.58) !important; }
.hours-row .hours-label { color: rgba(26,46,26,0.45) !important; }
.hours-row .hours-val   { color: #1a2e1a !important; }
.hours-open             { color: #4a8a30 !important; }

/* Contact form subject input */
.contact-form input[name="subject"],
.contact-form select    { background: #f5f0e8 !important; border-color: rgba(26,46,26,0.12) !important; color: #1a2e1a !important; }

/* ════════════════════════════════════════════
   GREEN FEE PAGE — greenfee.html INLINE CSS PATCH
   (inline h4 ใช้ var(--gilt), p ใช้ hardcode)
════════════════════════════════════════════ */

/* Info strip on greenfee — h4 TEE TIME / RESERVATION / REMARK */
.info-strip .info-card h4   { color: #9a7a3a !important; font-size: 0.62rem !important; letter-spacing: 0.25em !important; }
.info-strip .info-card p    { color: rgba(26,46,26,0.65) !important; }
.info-strip .info-card div > h4 { color: #9a7a3a !important; }
.info-strip .info-card > div > h4 { color: #9a7a3a !important; }

/* Greenfee gal section labels */
.gal-hd-label           { color: #1a2e1a !important; font-weight: 500 !important; }
.gal-count              { color: rgba(26,46,26,0.4) !important; }

/* Panel title */
.panel-hd-title         { color: #1a2e1a !important; }
.panel-hd-title em      { color: #4a7a30 !important; }


/* ════════════════════════════════════════════
   FORCE OVERRIDE — Nav & Content backgrounds
   (ครอบ main.css ทุกกรณี)
════════════════════════════════════════════ */
html body .nav,
html body nav.nav,
html body .nav--transparent,
html body nav.nav--transparent {
  background     : #ffffff !important;
  background-color: #ffffff !important;
  border-bottom  : 1px solid rgba(26,46,26,0.07) !important;
  box-shadow     : none !important;
}

/* nav links — ชนะ nav-visibility-fix ด้วย specificity สูงกว่า */
html body .nav .nav-links a,
html body .nav .nav-links li a,
html body nav.nav .nav-links a,
html body nav.nav .nav-links li a {
  color      : rgba(26,46,26,0.55) !important;
  text-shadow: none !important;
}
html body .nav .nav-links a:hover,
html body .nav .nav-links li a:hover,
html body .nav .nav-links a.active {
  color      : #1a2e1a !important;
  text-shadow: none !important;
}
html body .nav .nav-links a.nav-cta {
  background : #1a2e1a !important;
  color      : #f5f0e8 !important;
  text-shadow: none !important;
}
html body .nav.scrolled .nav-links a,
html body .nav.scrolled .nav-links li a {
  color      : rgba(26,46,26,0.55) !important;
  text-shadow: none !important;
}

/* Contact page content backgrounds */
html body .contact-main { background: #f5f0e8 !important; }

/* Sections with inline style using var(--pine) */
html body section[style*="var(--pine"],
html body div[style*="var(--pine"] {
  background: #f0ece2 !important;
}

/* contact-intro-title ใช้ var(--linen) = ขาว */
html body .contact-intro-title { color: #1a2e1a !important; }
html body .contact-intro-desc  { color: rgba(26,46,26,0.58) !important; }
html body .info-card-body h4   { color: #9a7a3a !important; }
html body .info-card-body p,
html body .info-card-body a    { color: rgba(26,46,26,0.62) !important; }
html body .info-card-icon      { background: rgba(200,169,110,0.1) !important; border-color: rgba(200,169,110,0.2) !important; color: #c8a96e !important; }
html body .info-card            { border-color: rgba(200,169,110,0.1) !important; }

/* contact form inputs */
html body .cf-field input,
html body .cf-field textarea,
html body .cf-field select {
  background: #f5f0e8 !important;
  border-color: rgba(26,46,26,0.12) !important;
  color: #1a2e1a !important;
}
html body .cf-field label { color: rgba(26,46,26,0.52) !important; }
html body .cf-field input:focus,
html body .cf-field textarea:focus { border-color: #c8a96e !important; }

/* greenfee info-strip */
html body .info-strip { background: #ffffff !important; }
html body .info-strip .info-card { background: #f5f0e8 !important; }
html body .info-strip .info-card strong { color: #1a2e1a !important; }
html body .info-strip .info-card span,
html body .info-strip .info-card p { color: rgba(26,46,26,0.55) !important; }
html body .info-strip .info-icon { color: #c8a96e !important; }

/* panel */
html body .panel { background: #ffffff !important; }
html body .panel-hd { background: #f5f0e8 !important; border-color: rgba(200,169,110,0.12) !important; }
html body .panel-hd-title { color: #1a2e1a !important; }
html body .panel-hd-title em { color: #4a7a30 !important; }

/* reviews inline style override */
html body #reviews { background: #f0ece2 !important; }
html body #reviews h2 { color: #1a2e1a !important; }
html body #reviews h2 em { color: #9a7a3a !important; }
html body #reviews p[style] { color: rgba(26,46,26,0.45) !important; }


/* ════════════════════════════════════════════
   HIGH-SPECIFICITY PATCH
   สำหรับ inline <style> ที่ใช้ rgba(240,233,...) hardcode
════════════════════════════════════════════ */

/* article.html — hours-row spans */
.hours-row span               { color: rgba(26,46,26,0.65) !important; }
.hours-row span:last-child    { color: #1a2e1a !important; font-weight: 500 !important; }

/* greenfee.html — info-card h4/p (ไม่มี info-card-body wrapper) */
.info-strip .info-card h4          { color: #9a7a3a !important; }
.info-strip .info-card > div > h4  { color: #9a7a3a !important; }
.info-strip .info-card p           { color: rgba(26,46,26,0.65) !important; }
.info-strip .info-card > div > p   { color: rgba(26,46,26,0.65) !important; }

/* greenfee.html — ป้ายหัวข้อรูปภาพ */
.gal-hd                       { background: #f5f0e8 !important; }
.gal-hd-label                 { color: #1a2e1a !important; }
.gal-count                    { color: rgba(26,46,26,0.42) !important; }

/* article.html — contact social section */
.contact-social-title         { color: rgba(26,46,26,0.5) !important; }

/* form inputs — ทั้ง article และ pages อื่น */
input, textarea, select {
  background  : #f5f0e8 !important;
  border-color: rgba(26,46,26,0.15) !important;
  color       : #1a2e1a !important;
}
input:focus, textarea:focus, select:focus {
  border-color: #c8a96e !important;
  box-shadow  : 0 0 0 3px rgba(200,169,110,0.12) !important;
  outline     : none !important;
}
input::placeholder, textarea::placeholder {
  color: rgba(26,46,26,0.32) !important;
}

/* Send button */
button[type="submit"],
.contact-form button,
.contact-form-btn {
  background: #1a2e1a !important;
  color     : #f5f0e8 !important;
  border    : none !important;
}
button[type="submit"]:hover,
.contact-form button:hover { background: #2a4a2a !important; }


/* ════════════════════════════════════════════
   FIX v3.1 — ข้อความที่มองไม่เห็นบนพื้นครีม
   แก้ตาม screenshot จริง
════════════════════════════════════════════ */

/* ── Restaurant: hours-day มองไม่เห็น ── */
/* สีเดิมใน restaurant.css = rgba(240,233,214,0.5) ซึ่งจางบนครีม */
.hours-day {
  color       : rgba(26,46,26,0.52) !important;
  font-weight : 500 !important;
  letter-spacing: 0.18em !important;
}
.hours-time {
  color       : #1a2e1a !important;
}
.hours-item {
  background  : #f5f0e8 !important;
  border-color: rgba(200,169,110,0.12) !important;
}
.hours-section {
  background  : #ffffff !important;
}
.hours-grid {
  border-color: rgba(200,169,110,0.1) !important;
}

/* ── Contact (article.html): info-card-body text มองไม่เห็น ── */
/* สีเดิม inline = rgba(240,233,214,0.55) ซึ่งเกือบขาวบนครีม */
.info-card-body h4 {
  color       : #c8a96e !important;
}
.info-card-body p,
.info-card-body a,
.info-card-body span {
  color       : rgba(26,46,26,0.68) !important;
}
.info-card-body a:hover {
  color       : #c8a96e !important;
}
.info-card-icon {
  background  : rgba(200,169,110,0.1) !important;
  border-color: rgba(200,169,110,0.22) !important;
  color       : #c8a96e !important;
}
.info-card-icon i {
  color       : #c8a96e !important;
}
.info-card {
  border-color: rgba(200,169,110,0.1) !important;
}
.info-card:first-child {
  border-top-color: rgba(200,169,110,0.1) !important;
}
.info-cards {
  background  : transparent !important;
}

/* hours mini-table ใน contact page */
.hours-table-row .htd-label {
  color       : rgba(26,46,26,0.45) !important;
}
.hours-table-row .htd-val {
  color       : #1a2e1a !important;
}

/* ── Contact form ── */
.contact-form-wrap,
.contact-right {
  background  : transparent !important;
}
.form-label,
.contact-form label {
  color       : rgba(26,46,26,0.6) !important;
}
.form-input,
.form-textarea,
.form-select,
.contact-form input,
.contact-form textarea,
.contact-form select {
  background  : #ffffff !important;
  border-color: rgba(26,46,26,0.14) !important;
  color       : #1a2e1a !important;
}
.form-input::placeholder,
.form-textarea::placeholder {
  color       : rgba(26,46,26,0.3) !important;
}
.form-input:focus,
.form-textarea:focus,
.form-select:focus {
  border-color: #c8a96e !important;
  box-shadow  : 0 0 0 3px rgba(200,169,110,0.12) !important;
  outline     : none !important;
}
.form-select option {
  background  : #ffffff !important;
  color       : #1a2e1a !important;
}
.send-btn,
.contact-form-btn,
.contact-send-btn {
  background  : #c8a96e !important;
  color       : #1a2e1a !important;
  font-weight : 600 !important;
}
.send-btn:hover,
.contact-form-btn:hover {
  background  : #e0be82 !important;
}
.contact-form-title {
  color       : #1a2e1a !important;
  border-color: rgba(200,169,110,0.15) !important;
}

/* send message section label */
.contact-right > div > span,
.form-section-label {
  color       : #c8a96e !important;
}


/* ================================================================
   RESPONSIVE — Mobile & Tablet
   Breakpoints: 1024px (tablet), 768px (tablet-sm), 480px (mobile)
   ================================================================ */

/* ════════════════════════════════════════════
   NAV — ซ่อน desktop links, แสดง hamburger
════════════════════════════════════════════ */
@media (max-width: 900px) {
  .nav-links       { display: none !important; }
  .nav-ham         { display: flex !important; align-items:center; justify-content:center; width:40px; height:40px; }
  .nav             { padding: 0 1.2rem !important; height: 60px !important; }
  .nav-logo img    { height: 38px !important; }
}

/* ════════════════════════════════════════════
   HERO — index.html
════════════════════════════════════════════ */
@media (max-width: 900px) {
  .hero            { min-height: 85vh !important; }
  .hero-content    { padding: 0 1.8rem 3rem !important; }
  .hero-title      { font-size: clamp(2.4rem, 10vw, 4rem) !important; }
  .hero-sub        { font-size: 0.68rem !important; letter-spacing: 0.18em !important; }
  .hero-btns       { flex-direction: column !important; gap: 0.8rem !important; align-items: flex-start !important; }
  .btn-g, .btn-o   { width: 100% !important; justify-content: center !important; }
}

/* ════════════════════════════════════════════
   ABOUT SECTION
════════════════════════════════════════════ */
@media (max-width: 900px) {
  .about-grid      { grid-template-columns: 1fr !important; gap: 2.5rem !important; }
  .img-wrap        { max-width: 480px !important; margin: 0 auto !important; }
  .stats           { grid-template-columns: repeat(3,1fr) !important; }
}
@media (max-width: 480px) {
  .stats           { grid-template-columns: 1fr !important; }
  .stat            { border-right: none !important; border-bottom: 1px solid rgba(200,169,110,0.1) !important; padding: 1rem !important; }
}

/* ════════════════════════════════════════════
   DESIGNER BAND
════════════════════════════════════════════ */
@media (max-width: 900px) {
  .designer-band   { padding: 24px 1.5rem !important; gap: 16px !important; }
  .db-divider      { display: none !important; }
  .db-quote        { display: none !important; }
  .db-crest        { margin-left: auto !important; }
}
@media (max-width: 480px) {
  .db-crest        { display: none !important; }
  .designer-band   { flex-wrap: wrap !important; }
}

/* ════════════════════════════════════════════
   COURSES SECTION (home)
════════════════════════════════════════════ */
@media (max-width: 900px) {
  .c-grid          { grid-template-columns: 1fr !important; max-width: 480px !important; margin: 0 auto !important; }
}
@media (max-width: 480px) {
  .c-grid          { max-width: 100% !important; }
}

/* ════════════════════════════════════════════
   AMENITIES
════════════════════════════════════════════ */
@media (max-width: 900px) {
  .am-grid         { grid-template-columns: repeat(2, 1fr) !important; }
}
@media (max-width: 480px) {
  .am-grid         { grid-template-columns: 1fr !important; }
}

/* ════════════════════════════════════════════
   CTA BAND
════════════════════════════════════════════ */
@media (max-width: 768px) {
  .cta-inner       { flex-direction: column !important; text-align: center !important; gap: 1.5rem !important; padding: 3rem 1.5rem !important; }
  .btn-d           { width: 100% !important; justify-content: center !important; }
}

/* ════════════════════════════════════════════
   PAGE HEADER (inner pages)
════════════════════════════════════════════ */
@media (max-width: 768px) {
  .page-hd         { min-height: 260px !important; }
  .page-hd-title   { font-size: clamp(2rem, 8vw, 3.5rem) !important; }
}
@media (max-width: 480px) {
  .page-hd         { min-height: 200px !important; }
  .page-hd-title   { font-size: clamp(1.8rem, 7vw, 2.5rem) !important; }
}

/* ════════════════════════════════════════════
   COURSE PAGE — courese.html
════════════════════════════════════════════ */
@media (max-width: 900px) {
  /* Tabs scroll horizontally */
  .course-tabs, [class*="tab-nav"] {
    overflow-x     : auto !important;
    white-space    : nowrap !important;
    -webkit-overflow-scrolling: touch !important;
    scrollbar-width: none !important;
  }
  .course-tabs::-webkit-scrollbar { display: none !important; }
  .tab-btn         { padding: 0.8rem 1rem !important; font-size: 0.65rem !important; white-space: nowrap !important; }

  /* Overview cards — stack */
  .overview-grid   { grid-template-columns: 1fr !important; max-width: 480px !important; margin: 0 auto !important; }

  /* Stats */
  .overview-stats  { flex-wrap: wrap !important; }
  .ov-stat         { flex: 0 0 33.33% !important; }

  /* Course hero — stack */
  .course-hero     { flex-direction: column !important; gap: 2rem !important; }
  .course-hero.reverse { flex-direction: column !important; }
  .course-img-wrap { width: 100% !important; max-height: 280px !important; }
  .course-info     { padding: 0 1.5rem !important; }
  .course-title    { font-size: 2rem !important; }

  /* Holes grid */
  .holes-grid      { grid-template-columns: repeat(2, 1fr) !important; }
}
@media (max-width: 480px) {
  .overview-grid   { max-width: 100% !important; }
  .ov-stat         { flex: 0 0 50% !important; }
  .holes-grid      { grid-template-columns: repeat(2, 1fr) !important; gap: 0.6rem !important; }
  .overview-card   { padding: 1.5rem !important; }
  .ov-title        { font-size: 1.5rem !important; }
}

/* ════════════════════════════════════════════
   RESTAURANT PAGE — restaurant.html
════════════════════════════════════════════ */
@media (max-width: 900px) {
  .intro           { grid-template-columns: 1fr !important; padding: 3rem 1.5rem !important; gap: 2rem !important; }
  .intro-img       { order: -1 !important; max-height: 300px !important; overflow: hidden !important; }
  .intro-facts     { gap: 1.2rem !important; }

  .gallery-section { padding: 3rem 1.5rem !important; }
  .menu-inner      { padding: 3rem 1.5rem !important; }
  .menu-grid       { grid-template-columns: repeat(2, 1fr) !important; }

  .hours-grid      { grid-template-columns: 1fr !important; }
  .hours-item      { display: flex !important; justify-content: space-between !important; align-items: center !important; padding: 1rem 1.2rem !important; }
}
@media (max-width: 480px) {
  .menu-grid       { grid-template-columns: 1fr !important; }
  .intro-facts     { flex-direction: column !important; gap: 0.8rem !important; }
}

/* ════════════════════════════════════════════
   GREEN FEE PAGE — greenfee.html
════════════════════════════════════════════ */
@media (max-width: 900px) {
  .info-strip      { flex-direction: column !important; }
  .info-card       { width: 100% !important; border-right: none !important; border-bottom: 1px solid rgba(200,169,110,0.1) !important; }
  .panel           { margin: 0 1rem !important; }
  .panel-hd        { flex-direction: column !important; align-items: flex-start !important; gap: 1rem !important; }
  .gal-hd          { flex-wrap: wrap !important; gap: 0.8rem !important; }
  .gal-grid        { grid-template-columns: repeat(2, 1fr) !important; }
}
@media (max-width: 480px) {
  .gal-grid        { grid-template-columns: 1fr !important; }
  .panel           { margin: 0 0.5rem !important; }
}

/* ════════════════════════════════════════════
   CONTACT PAGE — article.html
════════════════════════════════════════════ */
@media (max-width: 900px) {
  .contact-grid    { grid-template-columns: 1fr !important; gap: 2.5rem !important; }
  .contact-main    { padding: 3rem 1.5rem 4rem !important; }
  .cf-grid         { grid-template-columns: 1fr !important; }
  .contact-hero    { height: 280px !important; }
  .contact-hero-title { font-size: clamp(2rem, 8vw, 3.5rem) !important; }
}
@media (max-width: 480px) {
  .contact-hero    { height: 220px !important; }
  .info-cards      { gap: 0 !important; }
  .contact-form    { padding: 1.5rem !important; }
}

/* ════════════════════════════════════════════
   FOOTER
════════════════════════════════════════════ */
@media (max-width: 900px) {
  .f-top           { grid-template-columns: 1fr 1fr !important; gap: 2rem !important; }
  .f-brand         { grid-column: 1 / -1 !important; }
}
@media (max-width: 480px) {
  .f-top           { grid-template-columns: 1fr !important; }
  .f-bot           { flex-direction: column !important; text-align: center !important; gap: 0.5rem !important; }
  .f-inner         { padding: 3rem 1.2rem 2rem !important; }
}

/* ════════════════════════════════════════════
   REVIEWS SECTION
════════════════════════════════════════════ */
@media (max-width: 768px) {
  #reviews         { padding: 3rem 0 !important; }
  #reviews > div   { padding: 0 1.2rem !important; }
}

/* ════════════════════════════════════════════
   POPUP ADMIN
════════════════════════════════════════════ */
@media (max-width: 768px) {
  .form-grid       { grid-template-columns: 1fr !important; }
  .btn-row         { flex-direction: column !important; }
  .btn-reset       { margin-left: 0 !important; }
  .section         { padding: 1.5rem 1.2rem !important; }
  .admin-header    { flex-direction: column !important; align-items: flex-start !important; }
}

/* ════════════════════════════════════════════
   404 PAGE
════════════════════════════════════════════ */
@media (max-width: 480px) {
  .err-links       { flex-direction: column !important; align-items: center !important; }
  .err-btn         { width: 100% !important; justify-content: center !important; }
}

/* ════════════════════════════════════════════
   GLOBAL — spacing & readability on mobile
════════════════════════════════════════════ */
@media (max-width: 900px) {
  .sec             { padding: 4rem 0 !important; }
  .inner           { padding: 0 1.5rem !important; }
  .sec-inner       { padding: 0 1.5rem !important; }
  .sec-hd          { margin-bottom: 2.5rem !important; }
}
@media (max-width: 480px) {
  .sec             { padding: 3rem 0 !important; }
  .inner           { padding: 0 1rem !important; }
  .sec-inner       { padding: 0 1rem !important; }
  .disp            { font-size: clamp(1.6rem, 7vw, 2.4rem) !important; }

  /* ป้องกัน text overflow ทุกที่ */
  h1, h2, h3, h4  { overflow-wrap: break-word !important; word-break: break-word !important; }
  p                { overflow-wrap: break-word !important; }

  /* ปุ่มขนาดสัมผัสได้ง่าย */
  .btn-g, .btn-o, .btn-d, .nav-cta {
    min-height: 44px !important;
    font-size : 0.72rem !important;
  }
}