/*
Theme Name: Nakorn Poolvilla
Theme URI: https://nakornpoolvilla.com
Author: Touchnewmedia Co., Ltd.
Author URI: https://thetnm.com
Description: Custom landing page theme for Nakorn Poolvilla — Enchanted Garden Pool Villa, Bangkok
Version: 1.4.1
License: Private
Text Domain: nakorn-poolvilla

Changelog:
1.4.0 (2026-05-11) — Section Manager. Refactored front-page.php (477 lines → 12)
  into 7 section partials under /template-parts/sections/. Added Section Manager
  admin metabox (drag-drop sortable, enable/disable, add custom sections) on
  every Page edit screen + Front Page. Custom section types: Shortcode (any),
  TNM Gallery (quick pick), HTML, Heading. Storage: post meta _nakorn_sections
  as array of {uid, type, enabled, settings}. Backward compat: empty meta on
  Front Page falls back to default 7-section order. Companion: page.php now
  routes through nakorn_render_sections() with the_content fallback for legacy
  pages that don't use Section Manager.


1.3.4 (2026-05-10) — Hero text readability — root cause was gradient SHAPE,
  not just intensity. v1.3.3 used the legacy v1.0 stops (top 0.30, mid 0.15
  ← LIGHTEST in middle!, bottom 0.55) which made text-region the brightest
  zone of the overlay → text washed out on bright photos like green gardens.
  Touch report: "ยังมองไม่ค่อยเห็น" with subtitle hard to read against trees.
  Fix: reshape gradient (top 0.15 light, mid 0.55 darkest, bottom 0.55) AND
  add text-shadow to .hero-eyebrow / .hero-title / .hero-title .line-accent /
  .hero-subtitle for independent readability (works even at intensity=0).
  Also bump .hero-subtitle opacity from 0.82 → 0.95 (more solid). Middle
  gradient stop moved 40% → 50% to better cover text region. All injected
  via wp_head priority 100 with !important to override main.css.
1.3.3 (2026-05-10) — Hero overlay readability controls. Added 2 new fields
  to Appearance → Nakorn Options → "Hero Overlay" card:
  * nakorn_hero_overlay_color (color picker, default #1c100a warm brown)
  * nakorn_hero_overlay_intensity (slider 0-100, default 30 = current)
  Touch can dial up overlay darkness for better text contrast on bright
  hero photos (e.g. 60 = much darker). PHP injects <style id="nakorn-hero-overlay">
  on wp_head priority 100, !important override of assets/css/main.css rule.
  Linear scale: intensity 30 = original gradient (0.30/0.15/0.55 stops),
  intensity 60 = doubled, intensity 100 = capped at 1.0.
1.3.2 (2026-05-10) — Debug-friendly image picker. v1.3.1 still didn't open
  picker for Touch (wp.media may load async after script init OR be
  blocked elsewhere). Changes:
  * Removed silent return guard at script-load time.
  * Click handler now binds regardless; checks wp.media at click time.
  * console.log on load + on click → visible diagnostics in browser
    console.
  * If wp.media unavailable on click → user-facing alert + console.error.
  * try/catch around wp.media() init to surface init errors.
  * Run page → DevTools Console → expect "[Nakorn v1.3.2] Image picker
    script loaded..." messages confirming script reached + state.
1.3.1 (2026-05-10) — Hotfix: image picker "Select Image" button silent (Touch report).
  Root cause: enqueue check `$_GET['post'] === page_on_front` failed when
  page_on_front was unset OR when block editor used non-classic URL
  pattern → wp.media JS never loaded → JS guard `if(!wp.media) return`
  silently exited on click. Fix: enqueue logic now uses get_current_screen()
  to detect post_type === 'page' (works in Classic + Block + REST refresh).
  Plus defensive wp_enqueue_media() call inside metabox render function as
  fallback. Both are idempotent, safe to call twice.
1.3.0 (2026-05-10) — Image picker per section (Hero + About + 6 Gallery slots).
  * New `image` field type in front-page metabox (stores attachment ID,
    powered by wp.media with thumbnail preview + Remove control).
  * 8 new fields added to nakorn_front_page_field_config():
    - _nk_front_hero_bg          (Hero background)
    - _nk_front_about_img        (About section portrait)
    - _nk_front_gallery_1..6     (Gallery grid — 6 slots)
  * front-page.php now reads those attachment IDs and resolves URLs at
    render time via wp_get_attachment_image_url() — keeps the original
    hardcoded /assets/images/* fallbacks so the page never renders blank.
  * Hero background-image moved out of assets/css/main.css onto an inline
    style attribute (PHP-controlled). The rule in main.css is kept (sizing,
    position) minus the background-image declaration.
  * wp_enqueue_media() is scoped to the front-page edit screen only
    (admin_enqueue_scripts hook + post.php / post-new.php gate + post-id
    matches page_on_front).
  * Alt text comes from the attachment's _wp_attachment_image_alt when set,
    falling back to the hardcoded copy used in v1.0/1.1/1.2.
  * Recommended image sizes documented inline (admin description text).
  * Out of scope: Highlights icons (9 cards) — deferred to v1.4.
1.2.0 (2026-05-09) — Theme Options page + Bangkok address correction.
  * New "Nakorn Options" page (Appearance → Nakorn Options) with editable
    Brand Colours (WP Color Picker) and bilingual Property Address (EN+TH).
  * Brand colours output as :root CSS variables (--nk-* namespace) via
    wp_head injection — themable from wp-admin without touching CSS.
  * Address correction: theme now reflects the actual Bangkok address
    (was incorrectly "Chiang Mai" in v1.0.0/v1.1.0 hardcoded fallbacks).
  * New file: inc/theme-options.php.
1.1.0 (2026-05-09) — Metabox-driven content refactor.
  * Added inc/helpers.php and inc/metabox-front-page.php.
  * front-page.php now reads bilingual EN/TH content from post meta on the
    static front page (with hardcoded fallbacks). Highlights cards and
    gallery images remain hardcoded — planned for v1.2 (deferred to v1.3+).
1.0.0 — Initial release. Single-page bilingual EN/TH theme, hardcoded HTML.
*/

/* ============================================================
   CSS CUSTOM PROPERTIES
   ============================================================ */
:root {
  /* ── Brand colours (v1.0/1.1 palette — used by existing CSS rules) ── */
  --color-crimson:     #7A1F1F;
  --color-crimson-deep:#5C1616;
  --color-crimson-soft:#9B3030;
  --color-forest:      #2A5C1A;
  --color-forest-deep: #1C3D10;
  --color-teal:        #5ABFB0;
  --color-teal-light:  #8ED8D0;
  --color-teal-mist:   rgba(90,191,176,0.18);
  --color-cream:       #F6EDD8;
  --color-cream-dark:  #EDE0C4;
  --color-gold:        #C9A84C;
  --color-gold-light:  #E2C97A;
  --color-charcoal:    #2C2420;
  --color-text:        #3D2E28;
  --color-text-light:  #7A6860;
  --color-white:       #FFFFFF;
  --color-overlay:     rgba(28, 16, 10, 0.52);

  /* ── Theme Options aliases (v1.2.0+) ───────────────────────────────
     These mirror the brand palette and are also output via wp_head from
     inc/theme-options.php — admin can override each value from
     Appearance → Nakorn Options. The wp_head <style> block appears AFTER
     this file so admin values win over the defaults below.
     Use these in new rules: color: var(--nk-primary).
     ------------------------------------------------------------------ */
  --nk-primary:    #7A1F1F;
  --nk-accent:     #C9A84C;
  --nk-secondary:  #5ABFB0;
  --nk-bg-dark:    #2C2420;
  --nk-bg-light:   #F6EDD8;
  --nk-text:       #3D2E28;
  --nk-text-muted: #7A6860;

  /* Typography */
  --font-display:  'Cormorant Garamond', 'Palatino Linotype', Georgia, serif;
  --font-body-en:  'DM Sans', 'Helvetica Neue', Arial, sans-serif;
  --font-body-th:  'IBM Plex Sans Thai', 'Noto Sans Thai', sans-serif;

  /* Spacing */
  --section-pad:   clamp(60px, 8vw, 110px);
  --container:     1200px;
  --gutter:        clamp(20px, 5vw, 60px);

  /* Transitions */
  --ease:          cubic-bezier(0.25, 0.46, 0.45, 0.94);
  --ease-bounce:   cubic-bezier(0.34, 1.56, 0.64, 1);
  --duration:      0.5s;
}

/* ============================================================
   RESET & BASE
   ============================================================ */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html { scroll-behavior: smooth; font-size: 16px; }

body {
  font-family: var(--font-body-en);
  color: var(--color-text);
  background: var(--color-cream);
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
}

body.lang-th {
  font-family: var(--font-body-th);
}

img { max-width: 100%; height: auto; display: block; }
a { text-decoration: none; color: inherit; }
ul { list-style: none; }

/* ============================================================
   TYPOGRAPHY
   ============================================================ */
h1, h2, h3, h4 {
  font-family: var(--font-display);
  font-weight: 400;
  line-height: 1.15;
  letter-spacing: 0.01em;
}

.lang-th h1,
.lang-th h2,
.lang-th h3 {
  font-family: var(--font-body-th);
  font-weight: 600;
  letter-spacing: 0;
}

p { line-height: 1.75; }

/* ============================================================
   CONTAINER
   ============================================================ */
.container {
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 var(--gutter);
}

/* ============================================================
   SCROLL REVEAL
   ============================================================ */
.reveal {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.7s var(--ease), transform 0.7s var(--ease);
}
.reveal.revealed {
  opacity: 1;
  transform: none;
}
.reveal-delay-1 { transition-delay: 0.1s; }
.reveal-delay-2 { transition-delay: 0.2s; }
.reveal-delay-3 { transition-delay: 0.3s; }
.reveal-delay-4 { transition-delay: 0.4s; }
.reveal-delay-5 { transition-delay: 0.5s; }