/* Concept E (C2 edition) · Isan Real Estate
   Palette: orange #CC3300 / #F05623 · gold #DD9933 · maroon #7A1F1F · espresso #140C0A→#2B1D14
   deep maroon #3A1210 / #5A1414 · cream #FCEABC · tan #C68C53. Type: Figtree. */
:root {
  --orange: #F08C28; --orange-hi: #F5A04A; --orange-dk: #C96A10;
  --gold: #DD9933; --tan: #5E6B5F;
  --maroon: #247533; --maroon-dp: #1D6B2C; --maroon-ink: #14500C;
  --esp: #0E2412; --esp-2: #14341A; --esp-3: #1B4222;
  --cream: #FCEABC; --cream-dim: rgba(252,234,188,.72); --cream-faint: rgba(252,234,188,.14);
  --paper: #FFFFFF; --paper-2: #F7FBF8; --line: #E1EBE3;
  --text: #1B2A1E; --muted: #56655A;
  --sans: "Figtree", "Noto Sans Thai", system-ui, -apple-system, "Segoe UI", sans-serif;
  --wrap: 1240px; --r: 14px; --r-sm: 8px;
  --ease: cubic-bezier(.2,.7,.2,1);
  --shadow: 0 1px 2px rgba(20,50,26,.06), 0 10px 30px -12px rgba(20,50,26,.25);
}
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body { margin: 0; font-family: var(--sans); font-size: 17px; line-height: 1.6; color: var(--text); background: var(--esp); -webkit-font-smoothing: antialiased; }
img, video { display: block; max-width: 100%; }
a { color: var(--orange); text-decoration-thickness: 1px; text-underline-offset: 3px; }
h1, h2, h3, h4 { font-weight: 800; letter-spacing: -0.025em; line-height: 1.08; margin: 0 0 .5em; }
h2 { font-size: clamp(2rem, 3.6vw, 3.1rem); }
h3 { font-size: 1.25rem; letter-spacing: -0.01em; }
p { margin: 0 0 1em; }
.wrap { width: min(var(--wrap), 100% - 2.5rem); margin-inline: auto; }
.skip { position: absolute; left: -999px; top: 0; background: var(--cream); color: var(--maroon); padding: .6rem 1rem; z-index: 100; }
.skip:focus { left: 1rem; top: 1rem; }
:focus-visible { outline: 2px solid var(--gold); outline-offset: 3px; }

/* ---------- eyebrow / buttons ---------- */
.eyebrow { display: inline-flex; align-items: center; gap: .6rem; font-size: .76rem; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; color: var(--orange); margin-bottom: 1rem; }
.eyebrow::before { content: ""; width: 28px; height: 2px; background: currentColor; border-radius: 2px; }
.dark .eyebrow, .dark-maroon .eyebrow, .page-hero .eyebrow, .hero .eyebrow, .life-band .eyebrow, .work-band .eyebrow,
.testimonial-band .eyebrow, .cta-band .eyebrow, .motto-band .eyebrow, .detail-hero .eyebrow { color: var(--gold); }
.btn { display: inline-flex; align-items: center; justify-content: center; gap: .5rem; padding: .95rem 1.6rem; border-radius: 999px; font: 700 .95rem/1 var(--sans); letter-spacing: .01em; text-decoration: none; border: 1.5px solid transparent; cursor: pointer; transition: transform .25s var(--ease), background .25s, color .25s, border-color .25s, box-shadow .25s; }
.btn:hover { transform: translateY(-2px); }
.btn-primary { background: var(--orange); color: #fff; box-shadow: 0 10px 24px -10px rgba(240,140,40,.7); }
.btn-primary:hover { background: var(--orange-hi); }
.btn-ghost { color: var(--cream); border-color: rgba(252,234,188,.55); background: rgba(8,28,12,.18); backdrop-filter: blur(6px); }
.btn-ghost:hover { background: var(--cream); color: var(--maroon); border-color: var(--cream); }
.btn-outline { color: var(--maroon); border-color: rgba(36,117,51,.35); background: transparent; }
.btn-outline:hover { border-color: var(--orange); color: var(--orange); }
.btn-outline-light { color: var(--cream); border-color: rgba(252,234,188,.45); }
.btn-outline-light:hover { background: var(--cream); color: var(--maroon); }
.btn-dark { background: var(--esp-3); color: var(--cream); }
.btn-dark:hover { background: var(--maroon); }
.btn-block { width: 100%; }
.link-btn { background: none; border: 0; padding: 0; margin-left: 1rem; color: var(--orange); font: 600 .9rem var(--sans); cursor: pointer; text-decoration: underline; text-underline-offset: 3px; }

/* ---------- header ---------- */
.site-header { position: fixed; inset: 0 0 auto; z-index: 50; transition: background .35s, box-shadow .35s, padding .35s; padding: 1rem 0; }
.site-header.over-media { background: linear-gradient(180deg, rgba(8,28,12,.7), rgba(8,28,12,0)); }
.site-header.is-solid, .site-header.scrolled { background: rgba(8,28,12,.92); backdrop-filter: blur(14px) saturate(1.2); box-shadow: 0 1px 0 rgba(252,234,188,.08); padding: .55rem 0; }
.header-inner { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; }
.brand { display: flex; align-items: center; gap: .85rem; text-decoration: none; }
.brand-plate { display: inline-flex; background: var(--cream); border-radius: 10px; padding: 4px 10px; box-shadow: 0 6px 20px -8px rgba(0,0,0,.5), inset 0 -2px 0 rgba(221,153,51,.35); }
.brand-plate img { height: 46px; width: auto; transition: height .35s; }
.scrolled .brand-plate img, .is-solid .brand-plate img { height: 38px; }
.brand-sub { color: var(--cream-dim); font-size: .68rem; letter-spacing: .16em; text-transform: uppercase; line-height: 1.5; font-weight: 600; }
.brand-sub span { letter-spacing: .02em; text-transform: none; color: var(--tan); font-size: .78rem; }
.nav { display: flex; align-items: center; gap: .2rem; }
.nav a { color: var(--cream); text-decoration: none; font-size: .9rem; font-weight: 600; padding: .5rem .7rem; border-radius: 999px; position: relative; transition: color .2s, background .2s; }
.nav a:hover { background: var(--cream-faint); }
.nav a.active::after { content: ""; position: absolute; left: .7rem; right: .7rem; bottom: .2rem; height: 2px; border-radius: 2px; background: var(--orange-hi); }
.lang-toggle { margin-left: .4rem; font: 600 .82rem var(--sans); color: var(--cream); background: transparent; border: 1px solid rgba(252,234,188,.35); border-radius: 999px; padding: .4rem .75rem; cursor: pointer; }
.lang-toggle:hover { border-color: var(--gold); color: var(--gold); }
.nav a.nav-cta { margin-left: .5rem; background: var(--orange); color: #fff; padding: .6rem 1.1rem; }
.nav a.nav-cta:hover { background: var(--orange-hi); }
.nav-toggle { display: none; width: 44px; height: 44px; border-radius: 12px; border: 1px solid rgba(252,234,188,.3); background: rgba(8,28,12,.35); cursor: pointer; padding: 12px 10px; flex-direction: column; justify-content: space-between; }
.nav-toggle span { display: block; height: 2px; background: var(--cream); border-radius: 2px; transition: transform .3s, opacity .3s; }
.nav-toggle[aria-expanded="true"] span:nth-child(1) { transform: translateY(8px) rotate(45deg); }
.nav-toggle[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.nav-toggle[aria-expanded="true"] span:nth-child(3) { transform: translateY(-8px) rotate(-45deg); }

/* ---------- media backgrounds ---------- */
.bg { position: absolute; inset: 0; overflow: hidden; background: var(--esp-3); }
.bg-video, .bg-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.bg-img.blur { filter: blur(5px) saturate(1.05); transform: scale(1.06); }
.shade { position: absolute; inset: 0; pointer-events: none; }
.shade-hero { background:
  radial-gradient(120% 90% at 0% 100%, rgba(8,28,12,.92) 0%, rgba(8,28,12,.55) 45%, rgba(8,28,12,0) 75%),
  linear-gradient(180deg, rgba(8,28,12,.45) 0%, rgba(8,28,12,.05) 30%, rgba(14,52,22,.25) 60%, rgba(8,28,12,.9) 100%); }
.shade-page { background: linear-gradient(90deg, rgba(8,28,12,.88) 0%, rgba(8,28,12,.6) 45%, rgba(8,28,12,.2) 100%), linear-gradient(0deg, rgba(8,28,12,.85), rgba(8,28,12,0) 55%); }
.shade-tile { background: linear-gradient(180deg, rgba(8,28,12,0) 30%, rgba(8,28,12,.55) 62%, rgba(8,28,12,.92) 100%); }
.shade-left { background: linear-gradient(90deg, rgba(8,28,12,.92) 0%, rgba(8,28,12,.7) 42%, rgba(14,52,22,.25) 100%); }
.shade-work { background: linear-gradient(180deg, rgba(8,28,12,.82) 0%, rgba(14,40,18,.55) 45%, rgba(8,28,12,.95) 100%); }
.shade-maroon { background: radial-gradient(80% 100% at 50% 50%, rgba(14,52,22,.78), rgba(14,52,22,.94)); }
.shade-cta { background: linear-gradient(90deg, rgba(20,80,12,.92), rgba(14,52,22,.7) 55%, rgba(8,28,12,.35)); }
.shade-detail { background: linear-gradient(90deg, rgba(8,28,12,.92) 0%, rgba(8,28,12,.72) 50%, rgba(14,52,22,.45) 100%), linear-gradient(0deg, rgba(8,28,12,.6), rgba(8,28,12,0) 60%); }
.shade-soft { background: linear-gradient(180deg, rgba(8,28,12,0) 50%, rgba(8,28,12,.6)); }
.media-caption { position: absolute; right: 1.25rem; bottom: 1rem; margin: 0; z-index: 3; font-size: .7rem; letter-spacing: .03em; color: rgba(252,234,188,.6); max-width: 60ch; text-align: right; }
.media-caption a { color: inherit; text-decoration: none; border-bottom: 1px dotted rgba(252,234,188,.4); }
.media-caption a:hover { color: var(--cream); }
.media-caption.inline { position: static; text-align: left; margin-top: 1.25rem; }

/* ---------- hero ---------- */
.hero { position: relative; min-height: 100vh; min-height: 100svh; display: flex; align-items: flex-end; color: var(--cream); overflow: hidden; isolation: isolate; }
.hero .bg { z-index: -1; }
.hero-inner { padding: 9rem 0 7.5rem; position: relative; }
.hero-kicker { display: inline-flex; align-items: center; gap: .7rem; font-weight: 700; font-size: .8rem; letter-spacing: .24em; text-transform: uppercase; color: var(--gold); margin-bottom: 1.1rem; }
.hero-kicker::before { content: ""; width: 40px; height: 2px; background: var(--orange-hi); }
.hero-title { font-size: clamp(4rem, 11vw, 9.5rem); font-weight: 900; letter-spacing: -0.05em; line-height: .88; margin: 0 0 1.4rem; color: var(--cream); text-shadow: 0 6px 40px rgba(0,0,0,.35); }
.hero-title em { display: block; font-style: italic; font-weight: 300; font-size: clamp(1.4rem, 2.6vw, 2.3rem); letter-spacing: -0.01em; line-height: 1.2; margin-top: .9rem; color: var(--cream); opacity: .92; }
.hero-sub { font-size: clamp(1.05rem, 1.4vw, 1.25rem); max-width: 40ch; color: var(--cream-dim); margin-bottom: 2rem; }
.hero-actions { display: flex; flex-wrap: wrap; gap: .8rem; }
.hero-pills { list-style: none; padding: 0; margin: 2rem 0 0; display: flex; flex-wrap: wrap; gap: .5rem; }
.hero-pills li { font-size: .78rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; padding: .45rem .85rem; border-radius: 999px; border: 1px solid rgba(221,153,51,.5); color: var(--cream); background: rgba(8,28,12,.35); backdrop-filter: blur(4px); }
.hero-pills li:first-child { background: var(--gold); color: var(--esp); border-color: var(--gold); }
.hero-scenes { position: absolute; right: 2rem; bottom: 4.25rem; z-index: 2; display: grid; justify-items: end; gap: .25rem; min-width: 240px; }
.hero-scenes .scene { grid-area: 1 / 1; font-size: .8rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--cream); opacity: 0; transform: translateY(6px); transition: opacity .6s, transform .6s; }
.hero-scenes .scene.active { opacity: .9; transform: none; }
.scene-bar { grid-area: 2 / 1; width: 100%; height: 2px; background: rgba(252,234,188,.22); border-radius: 2px; overflow: hidden; }
.scene-bar b { display: block; height: 100%; width: 0; background: var(--orange-hi); }
.hero-credit { bottom: 1.4rem; }
.scroll-cue { position: absolute; left: 50%; bottom: 1.4rem; width: 26px; height: 42px; border: 2px solid rgba(252,234,188,.55); border-radius: 14px; transform: translateX(-50%); z-index: 2; }
.scroll-cue span { position: absolute; left: 50%; top: 8px; width: 4px; height: 8px; margin-left: -2px; border-radius: 2px; background: var(--gold); animation: cue 1.8s infinite; }
@keyframes cue { 0% { opacity: 0; transform: translateY(0); } 30% { opacity: 1; } 100% { opacity: 0; transform: translateY(14px); } }

/* ---------- stats ---------- */
.stats-band { background: linear-gradient(90deg, var(--esp) 0%, var(--esp-3) 100%); border-top: 1px solid rgba(221,153,51,.25); border-bottom: 1px solid rgba(221,153,51,.12); }
.stats { display: grid; grid-template-columns: repeat(4, 1fr); }
.stats div { padding: 1.6rem 1rem; text-align: center; border-left: 1px solid rgba(252,234,188,.08); }
.stats div:first-child { border-left: 0; }
.stats strong { display: block; font-size: clamp(1.8rem, 3vw, 2.5rem); font-weight: 800; color: var(--cream); letter-spacing: -0.03em; line-height: 1.1; }
.stats span { font-size: .78rem; text-transform: uppercase; letter-spacing: .14em; color: var(--tan); font-weight: 600; }

/* ---------- sections ---------- */
.section { padding: clamp(4.5rem, 8vw, 7.5rem) 0; position: relative; }
.paper { background: var(--paper); }
.dark { background: radial-gradient(120% 80% at 100% 0%, var(--esp-3) 0%, var(--esp) 60%); color: var(--cream); }
.dark-maroon { background: radial-gradient(100% 120% at 0% 0%, var(--maroon) 0%, var(--maroon-dp) 45%, var(--maroon-ink) 100%); color: var(--cream); overflow: hidden; }
.dark h2, .dark-maroon h2 { color: var(--cream); }
.welcome-pattern { position: absolute; inset: 0; opacity: .07; pointer-events: none;
  background-image: repeating-linear-gradient(45deg, var(--gold) 0 1px, transparent 1px 22px), repeating-linear-gradient(-45deg, var(--gold) 0 1px, transparent 1px 22px);
  mask-image: radial-gradient(60% 80% at 100% 50%, #000, transparent); -webkit-mask-image: radial-gradient(60% 80% at 100% 50%, #000, transparent); }
.section-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 2rem; margin-bottom: 2.75rem; }
.section-head h2 { margin: 0; max-width: 18ch; }
.section-head > p { max-width: 38ch; color: var(--muted); margin: 0; }
.dark .section-head > p, .dark-maroon .section-head > p { color: var(--cream-dim); }
.paper .section-head h2 { color: var(--maroon); }
.center-cta { text-align: center; margin: 3rem 0 0; }

/* welcome */
.welcome-grid { display: grid; grid-template-columns: 1.25fr 1fr; gap: clamp(2rem, 6vw, 6rem); align-items: center; position: relative; }
.big-quote { margin: 0 0 2rem; font-size: clamp(1.7rem, 3vw, 2.6rem); font-weight: 300; font-style: italic; line-height: 1.22; letter-spacing: -0.02em; color: var(--cream); }
.founder-sign { display: flex; align-items: center; gap: 1rem; }
.founder-sign p { margin: 0; color: var(--cream-dim); font-size: .92rem; }
.founder-sign strong { color: var(--cream); }
.founder-faces { display: flex; }
.founder-faces img { width: 64px; height: 64px; border-radius: 50%; object-fit: cover; border: 3px solid var(--maroon-dp); box-shadow: 0 0 0 2px var(--gold); }
.founder-faces img + img { margin-left: -14px; }
.founder-faces.lg img { width: 96px; height: 96px; border-color: var(--paper-2); }
.welcome-copy p { color: var(--cream-dim); font-size: 1.05rem; }

/* paths */
.paths-section { background: var(--esp); color: var(--cream); }
.paths-section .section-head > p { color: var(--cream-dim); }
.paths-section h2 { color: var(--cream); }
.paths { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.1rem; }
.path-tile { position: relative; overflow: hidden; border-radius: var(--r); min-height: 460px; display: flex; align-items: flex-end; text-decoration: none; color: var(--cream); isolation: isolate; }
.path-tile .bg-img, .area-tile .bg-img { z-index: -2; transition: transform 1.2s var(--ease); }
.path-tile .shade, .area-tile .shade { z-index: -1; }
.path-tile:hover .bg-img, .area-tile:hover .bg-img { transform: scale(1.06); }
.path-copy { padding: 1.8rem; }
.path-th { font-size: .95rem; color: var(--gold); font-weight: 600; }
.path-tile h3 { font-size: clamp(2.2rem, 3.4vw, 3rem); font-weight: 900; letter-spacing: -0.04em; margin: .1rem 0 .35rem; }
.path-tile p { color: var(--cream-dim); margin: 0 0 1rem; font-size: .98rem; }
.path-count { display: inline-flex; gap: .4rem; font-weight: 700; font-size: .85rem; letter-spacing: .04em; color: var(--esp); background: var(--cream); padding: .45rem .9rem; border-radius: 999px; transition: background .25s, color .25s; }
.path-tile:hover .path-count { background: var(--orange); color: #fff; }
.path-pictured { position: absolute; top: 1rem; right: 1rem; font-size: .66rem; letter-spacing: .06em; color: rgba(252,234,188,.75); background: rgba(8,28,12,.45); padding: .2rem .5rem; border-radius: 999px; }

/* ---------- cards ---------- */
.listings-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); gap: 1.4rem; }
.editorial-grid { display: grid; grid-template-columns: repeat(4, 1fr); grid-auto-rows: auto; gap: 1.4rem; }
.editorial-grid .card.feature { grid-column: span 2; grid-row: span 2; }
.editorial-grid .card.feature .card-media { aspect-ratio: auto; flex: 1; min-height: 420px; }
.editorial-grid .card.feature .card-title { font-size: 1.45rem; }
.editorial-grid .card.feature .card-body { flex: 0 0 auto; }
.card { display: flex; flex-direction: column; background: var(--paper-2); border-radius: var(--r); overflow: hidden; text-decoration: none; color: var(--text); box-shadow: var(--shadow); transition: transform .35s var(--ease), box-shadow .35s; border: 1px solid rgba(36,117,51,.06); }
.card:hover { transform: translateY(-6px); box-shadow: 0 2px 4px rgba(20,50,26,.06), 0 24px 44px -18px rgba(20,80,12,.45); }
.card-media { position: relative; aspect-ratio: 3 / 2; overflow: hidden; background: var(--esp-3); }
.card-media img { width: 100%; height: 100%; object-fit: cover; transition: transform 1s var(--ease); }
.card:hover .card-media img { transform: scale(1.06); }
.card-media::after { content: ""; position: absolute; inset: auto 0 0; height: 40%; background: linear-gradient(0deg, rgba(8,28,12,.45), transparent); }
.card-badge { position: absolute; left: .8rem; top: .8rem; z-index: 1; font-size: .7rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; background: var(--cream); color: var(--maroon); padding: .32rem .6rem; border-radius: 999px; }
.card-badge.sold { background: var(--maroon); color: var(--cream); }
.card-ref { position: absolute; right: .8rem; bottom: .7rem; z-index: 1; font-size: .7rem; font-weight: 700; letter-spacing: .08em; color: rgba(252,234,188,.85); }
.card-body { padding: 1.1rem 1.2rem 1.25rem; display: flex; flex-direction: column; gap: .35rem; flex: 1; }
.card-meta { font-size: .76rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--tan); }
.card-title { font-size: 1.05rem; font-weight: 700; line-height: 1.32; letter-spacing: -0.01em; margin: 0; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.card-foot { margin-top: auto; padding-top: .55rem; display: flex; align-items: baseline; justify-content: space-between; gap: .5rem; border-top: 1px solid var(--line); }
.card-price { font-weight: 800; color: var(--orange); font-size: 1.05rem; letter-spacing: -0.01em; }
.card-price.muted { color: var(--muted); font-weight: 600; }
.card-facts { font-size: .78rem; color: var(--muted); white-space: nowrap; }
.card-fallback { position: absolute; inset: 0; display: grid; place-content: center; text-align: center; color: var(--cream); background: linear-gradient(135deg, var(--maroon), var(--esp-3)); font-weight: 600; }
.card-fallback span { font-size: 3rem; font-weight: 900; color: var(--gold); }
.hidden-card { display: none !important; }

/* ---------- life band + wai slot ---------- */
.life-band, .work-band, .testimonial-band, .cta-band, .motto-band { position: relative; color: var(--cream); isolation: isolate; overflow: hidden; }
.life-band .bg, .work-band .bg, .testimonial-band .bg, .cta-band .bg, .motto-band .bg { z-index: -1; }
.life-band { padding: clamp(6rem, 11vw, 9.5rem) 0; }
.life-grid { display: grid; grid-template-columns: 1.1fr .9fr; gap: clamp(2rem, 6vw, 5rem); align-items: center; }
.life-copy h2 { font-size: clamp(2.3rem, 4.4vw, 3.8rem); color: var(--cream); }
.life-copy p { color: var(--cream-dim); font-size: 1.1rem; max-width: 46ch; margin-bottom: 2rem; }
.wai-slot { margin: 0; position: relative; border-radius: var(--r); overflow: hidden; background: var(--esp-3); box-shadow: 0 30px 60px -25px rgba(0,0,0,.7); outline: 2px dashed rgba(221,153,51,.85); outline-offset: 6px; }
.wai-slot video { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; }
.wai-slot figcaption { padding: 1rem 1.2rem 1.15rem; background: linear-gradient(180deg, var(--maroon-dp), var(--maroon-ink)); font-size: .95rem; color: var(--cream-dim); }
.wai-slot figcaption strong { color: var(--cream); }
.slot-tag { position: absolute; left: .8rem; top: .8rem; font-size: .68rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; background: var(--gold); color: var(--esp); padding: .35rem .65rem; border-radius: 6px; }
.slot-note { display: block; margin-top: .45rem; font-size: .74rem; color: var(--gold); letter-spacing: .01em; }
.life-band > .media-caption { bottom: .8rem; }

/* places */
.places-grid { display: grid; grid-template-columns: 1.4fr 1fr 1fr; grid-template-rows: 260px 260px; gap: 1.1rem; }
.place-card { position: relative; overflow: hidden; border-radius: var(--r); display: flex; align-items: flex-end; text-decoration: none; color: var(--cream); isolation: isolate; }
.place-card:first-child { grid-row: span 2; }
.place-card:last-child { grid-column: span 2; }
.place-card .bg-video { z-index: -2; transition: transform 1.2s var(--ease); }
.place-card .shade { z-index: -1; }
.place-card:hover .bg-video { transform: scale(1.05); }
.place-label { padding: 1.3rem 1.4rem; }
.place-label strong { display: block; font-size: 1.5rem; font-weight: 800; letter-spacing: -0.02em; }
.place-label span { font-size: .85rem; color: var(--gold); font-weight: 600; letter-spacing: .04em; }

/* work band */
.work-band { padding: clamp(6rem, 10vw, 9rem) 0 clamp(5rem, 8vw, 7rem); }
.work-head { max-width: 760px; margin-bottom: 3.5rem; }
.work-head h2 { color: var(--cream); font-size: clamp(2.3rem, 4.4vw, 3.8rem); }
.work-steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.1rem; }
.step { padding: 1.7rem; border-radius: var(--r); background: rgba(8,28,12,.55); border: 1px solid rgba(252,234,188,.14); backdrop-filter: blur(10px); }
.step h3 { color: var(--cream); margin-top: .9rem; }
.step p { color: var(--cream-dim); margin: 0; font-size: .98rem; }
.step-n { font-size: .8rem; font-weight: 800; letter-spacing: .14em; color: var(--esp); background: var(--gold); padding: .3rem .6rem; border-radius: 6px; }

/* testimonials */
.testimonial-band { padding: clamp(5.5rem, 9vw, 8rem) 0; text-align: center; }
.testimonial-inner .eyebrow { justify-content: center; }
.t-stage { display: grid; }
.t-stage figure { grid-area: 1 / 1; margin: 0 auto; max-width: 860px; transition: opacity .6s; }
.t-stage figure[hidden] { display: block; opacity: 0; visibility: hidden; }
.t-stage blockquote { margin: 0 0 1.4rem; font-size: clamp(1.35rem, 2.4vw, 2rem); font-weight: 300; font-style: italic; line-height: 1.38; color: var(--cream); }
.t-stage blockquote::before { content: "“"; display: block; font-size: 4.5rem; line-height: .6; font-style: normal; font-weight: 800; color: var(--orange-hi); margin-bottom: .6rem; }
.t-stage figcaption { font-weight: 700; letter-spacing: .12em; text-transform: uppercase; font-size: .8rem; color: var(--gold); }
.testimonial-dots { display: flex; justify-content: center; gap: .5rem; margin-top: 2rem; }
.testimonial-dots button { width: 28px; height: 4px; border-radius: 4px; border: 0; background: rgba(252,234,188,.3); cursor: pointer; padding: 0; transition: background .3s, width .3s; }
.testimonial-dots button.active { background: var(--orange-hi); width: 44px; }

/* blog */
.blog-strip { margin-top: 4rem; display: grid; grid-template-columns: 200px repeat(3, 1fr); gap: 1.4rem; align-items: start; border-top: 1px solid var(--line); padding-top: 2rem; }
.blog-head { color: var(--maroon); font-size: 1.1rem; margin: 0; }
.blog-item { text-decoration: none; color: var(--text); display: flex; flex-direction: column; gap: .3rem; font-weight: 600; line-height: 1.35; }
.blog-item time { font-size: .74rem; letter-spacing: .12em; text-transform: uppercase; color: var(--tan); font-weight: 700; }
.blog-item:hover span { color: var(--orange); }

/* cta + motto */
.cta-band { padding: clamp(6rem, 10vw, 8.5rem) 0; }
.cta-inner h2 { color: var(--cream); font-size: clamp(2.4rem, 5vw, 4.2rem); max-width: 16ch; margin-bottom: 2rem; }
.motto-band { padding: clamp(5.5rem, 9vw, 8rem) 0; text-align: center; }
.motto-band .eyebrow { justify-content: center; }
.motto { font-size: clamp(1.6rem, 3.4vw, 3rem); font-weight: 800; letter-spacing: -0.03em; line-height: 1.25; color: var(--cream); margin: 0 auto; max-width: 22ch; }
.motto i, .footer-pols i { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--orange-hi); vertical-align: middle; margin: 0 .5em; }

/* ---------- page hero ---------- */
.page-hero { position: relative; min-height: 68vh; display: flex; align-items: flex-end; color: var(--cream); isolation: isolate; overflow: hidden; }
.page-hero.compact { min-height: 54vh; }
.page-hero.tall { min-height: 88vh; }
.page-hero .bg { z-index: -1; }
.page-hero-inner { padding: 9rem 0 4.5rem; }
.page-hero h1 { font-size: clamp(2.8rem, 6.4vw, 5.6rem); font-weight: 900; letter-spacing: -0.045em; line-height: .95; color: var(--cream); max-width: 16ch; text-shadow: 0 4px 30px rgba(0,0,0,.3); }
.page-hero .lede { font-size: clamp(1.05rem, 1.5vw, 1.3rem); color: var(--cream-dim); max-width: 48ch; margin: 0; }

/* ---------- listings page ---------- */
.listings-section { padding-top: 0; }
.filter-bar { position: relative; z-index: 5; margin-top: -2.6rem; margin-bottom: 1.6rem; background: var(--paper-2); border-radius: var(--r); box-shadow: 0 20px 50px -24px rgba(20,50,26,.45); padding: 1.1rem 1.2rem; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem; border: 1px solid var(--line); }
.segs { display: inline-flex; background: var(--paper); border-radius: 999px; padding: 4px; gap: 2px; }
.seg { border: 0; background: transparent; font: 700 .9rem var(--sans); color: var(--muted); padding: .55rem 1rem; border-radius: 999px; cursor: pointer; display: inline-flex; gap: .4rem; align-items: baseline; }
.seg small { font-size: .72rem; opacity: .7; font-weight: 600; }
.seg.active { background: var(--maroon); color: var(--cream); }
.filter-selects { display: flex; flex-wrap: wrap; gap: .6rem; }
.filter-selects label { display: flex; flex-direction: column; gap: .15rem; font-size: .66rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: var(--tan); }
select { font: 600 .9rem var(--sans); color: var(--text); padding: .55rem 2rem .55rem .8rem; border-radius: 10px; border: 1px solid var(--line); background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%237A1F1F' stroke-width='1.6' fill='none'/%3E%3C/svg%3E") no-repeat right .75rem center; appearance: none; -webkit-appearance: none; min-width: 150px; }
.results-meta { color: var(--muted); font-weight: 600; margin: 0 0 1.4rem; }
.empty-note { text-align: center; padding: 3rem 0; color: var(--muted); }

/* ---------- detail ---------- */
.detail-hero { position: relative; color: var(--cream); isolation: isolate; overflow: hidden; }
.detail-hero .bg { z-index: -1; }
.detail-hero-inner { padding: 8.5rem 0 3.2rem; }
.crumbs { font-size: .8rem; color: var(--cream-dim); display: flex; gap: .5rem; margin-bottom: 1.4rem; flex-wrap: wrap; }
.crumbs a { color: var(--cream); text-decoration: none; }
.crumbs a:hover { color: var(--gold); }
.detail-hero h1 { font-size: clamp(1.9rem, 3.6vw, 3.1rem); max-width: 26ch; color: var(--cream); letter-spacing: -0.03em; line-height: 1.1; }
.detail-sum { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem 1.5rem; margin-top: 1.4rem; }
.detail-price { font-size: 1.8rem; font-weight: 800; color: var(--orange-hi); letter-spacing: -0.02em; }
.detail-chips { list-style: none; display: flex; flex-wrap: wrap; gap: .5rem; padding: 0; margin: 0; }
.detail-chips li { font-size: .82rem; font-weight: 600; padding: .35rem .75rem; border-radius: 999px; border: 1px solid rgba(252,234,188,.3); color: var(--cream); background: rgba(8,28,12,.3); }
.detail-body { padding-top: 3rem; }
.detail-layout { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 3rem; align-items: start; }
.detail-main h2 { color: var(--maroon); font-size: 1.6rem; margin-top: 2.4rem; }
.detail-desc { font-size: 1.1rem; }
.gallery-carousel { position: relative; border-radius: var(--r); overflow: hidden; background: var(--esp); aspect-ratio: 3 / 2; box-shadow: var(--shadow); }
.g-slides, .g-slide { position: absolute; inset: 0; }
.g-slide { opacity: 0; transition: opacity .5s; }
.g-slide.active { opacity: 1; }
.g-slide img { width: 100%; height: 100%; object-fit: cover; }
.g-nav { position: absolute; top: 50%; transform: translateY(-50%); width: 46px; height: 46px; border-radius: 50%; border: 0; background: rgba(252,234,188,.9); color: var(--maroon); font-size: 1.6rem; line-height: 1; cursor: pointer; z-index: 2; }
.g-nav:hover { background: var(--orange); color: #fff; }
.g-prev { left: 1rem; } .g-next { right: 1rem; }
.g-dots { position: absolute; left: 0; right: 0; bottom: 1rem; display: flex; justify-content: center; gap: .4rem; z-index: 2; }
.g-dot { width: 8px; height: 8px; border-radius: 50%; border: 0; padding: 0; background: rgba(252,234,188,.5); cursor: pointer; }
.g-dot.active { background: var(--orange-hi); }
.g-count { position: absolute; right: 1rem; top: 1rem; z-index: 2; font-size: .78rem; font-weight: 700; background: rgba(8,28,12,.6); color: var(--cream); padding: .25rem .6rem; border-radius: 999px; }
.gallery-thumbs { display: flex; gap: .5rem; margin-top: .7rem; overflow-x: auto; padding-bottom: .3rem; }
.gallery-thumbs button { flex: 0 0 96px; height: 66px; padding: 0; border: 2px solid transparent; border-radius: 8px; overflow: hidden; cursor: pointer; background: none; opacity: .7; }
.gallery-thumbs button.active { border-color: var(--orange); opacity: 1; }
.gallery-thumbs img { width: 100%; height: 100%; object-fit: cover; }
.lead-fallback { aspect-ratio: 3 / 2; border-radius: var(--r); display: grid; place-content: center; text-align: center; background: linear-gradient(135deg, var(--maroon), var(--esp-3)); color: var(--cream); }
.lead-fallback span { font-size: 5rem; font-weight: 900; color: var(--gold); }
.facts-table { width: 100%; border-collapse: collapse; margin: 1.5rem 0; background: var(--paper-2); border-radius: var(--r); overflow: hidden; }
.facts-table th, .facts-table td { text-align: left; padding: .8rem 1rem; border-bottom: 1px solid var(--line); vertical-align: top; font-size: .95rem; }
.facts-table th { width: 34%; color: var(--tan); font-weight: 700; font-size: .78rem; letter-spacing: .1em; text-transform: uppercase; }
.feature-list { list-style: none; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: .5rem 1.2rem; }
.feature-list li { padding-left: 1.6rem; position: relative; }
.feature-list li::before { content: ""; position: absolute; left: 0; top: .55em; width: 10px; height: 10px; border-radius: 3px; background: var(--gold); transform: rotate(45deg); }
.inquiry-card { position: sticky; top: 6rem; background: linear-gradient(170deg, var(--maroon) 0%, var(--maroon-ink) 100%); color: var(--cream); border-radius: var(--r); padding: 1.8rem; box-shadow: 0 30px 60px -30px rgba(14,52,22,.8); }
.inquiry-card .price { font-size: 1.7rem; font-weight: 800; color: var(--cream); letter-spacing: -0.02em; margin-bottom: .2rem; }
.inq-note { font-size: .88rem; color: var(--gold); }
.inq-direct { margin: 1.2rem 0 0; font-size: .88rem; color: var(--cream-dim); }
.inq-direct a { color: var(--cream); }
.inquiry-card label { color: rgba(252,234,188,.88); }
.inquiry-card .eyebrow { color: var(--gold); }
.inquiry-card input, .inquiry-card textarea { background: rgba(252,234,188,.08); border-color: rgba(252,234,188,.22); color: var(--cream); }
.inquiry-card input:focus, .inquiry-card textarea:focus { border-color: var(--gold); }

/* forms */
.form-field { display: flex; flex-direction: column; gap: .3rem; margin-bottom: .9rem; }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 0 1rem; }
.form-field label { font-size: .74rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
input, textarea { font: 500 1rem var(--sans); padding: .8rem .9rem; border-radius: 10px; border: 1px solid var(--line); background: #fff; color: var(--text); outline: none; transition: border-color .2s; }
input:focus, textarea:focus { border-color: var(--orange); }
textarea { min-height: 120px; resize: vertical; }
.form-note { display: none; margin-top: .8rem; padding: .7rem .9rem; border-radius: 10px; background: var(--cream); color: var(--maroon); font-weight: 700; font-size: .9rem; }
.form-note.show { display: block; }

/* ---------- areas ---------- */
.area-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 1.1rem; }
.area-tile { position: relative; min-height: 260px; border-radius: var(--r); overflow: hidden; display: flex; align-items: flex-end; text-decoration: none; color: var(--cream); isolation: isolate; }
.area-tile:first-child { grid-column: span 2; grid-row: span 2; min-height: 540px; }
.area-copy { padding: 1.4rem; }
.area-copy strong { display: block; font-size: 1.6rem; font-weight: 800; letter-spacing: -0.02em; }
.area-tile:first-child .area-copy strong { font-size: 2.6rem; }
.area-copy span { color: var(--gold); font-weight: 700; font-size: .9rem; }
.back-link { margin-bottom: 1.6rem; }
.back-link a { font-weight: 700; text-decoration: none; }

/* ---------- about ---------- */
.about-grid { display: grid; grid-template-columns: 1.5fr 1fr; gap: clamp(2rem, 6vw, 5rem); align-items: start; }
.prose p { font-size: 1.08rem; }
.prose .pull { font-size: clamp(1.5rem, 2.4vw, 2.05rem); font-weight: 300; font-style: italic; line-height: 1.3; color: var(--maroon); border-left: 4px solid var(--orange); padding-left: 1.4rem; margin-bottom: 2rem; letter-spacing: -0.015em; }
.founder-card { background: var(--paper-2); border-radius: var(--r); padding: 2rem; box-shadow: var(--shadow); text-align: center; position: sticky; top: 6rem; }
.founder-card .founder-faces { justify-content: center; margin-bottom: 1rem; }
.policy-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.1rem; position: relative; }
.policy-card { background: rgba(8,28,12,.35); border: 1px solid rgba(252,234,188,.15); border-radius: var(--r); padding: 1.8rem; }
.policy-card h3 { color: var(--cream); font-size: 1.4rem; margin-top: 1rem; }
.policy-card p { color: var(--cream-dim); margin: 0; }
.policy-n { font-size: .8rem; font-weight: 800; letter-spacing: .14em; color: var(--esp); background: var(--gold); padding: .3rem .6rem; border-radius: 6px; }
.policy-card.light { background: var(--paper-2); border-color: var(--line); margin: 1.2rem 0; }
.policy-card.light h3 { color: var(--maroon); margin-top: 0; }
.policy-card.light p { color: var(--text); }

/* ---------- team ---------- */
.team-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1.4rem; }
.team-card { display: grid; grid-template-columns: 220px 1fr; background: linear-gradient(160deg, var(--esp-3), var(--esp-2)); border: 1px solid rgba(252,234,188,.1); border-radius: var(--r); overflow: hidden; }
.team-photo-wrap { background: var(--maroon-dp); }
.team-photo { width: 100%; height: 100%; object-fit: cover; aspect-ratio: 4 / 5; }
.team-initials { height: 100%; display: grid; place-content: center; font-size: 3rem; font-weight: 900; color: var(--gold); }
.team-info { padding: 1.8rem; align-self: center; }
.team-info h3 { color: var(--cream); font-size: 1.7rem; margin-bottom: .2rem; }
.team-role { color: var(--gold); font-weight: 600; margin-bottom: 1.2rem; }
.team-contact { list-style: none; padding: 0; margin: 0; color: var(--cream-dim); font-size: .95rem; display: grid; gap: .3rem; }
.team-contact a { color: var(--cream); text-decoration: none; border-bottom: 1px solid rgba(221,153,51,.4); }
.team-contact a:hover { color: var(--orange-hi); }
.howto-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.4rem; }
.howto-media { position: relative; aspect-ratio: 4 / 3; border-radius: var(--r); overflow: hidden; margin-bottom: 1.2rem; background: var(--esp-3); box-shadow: var(--shadow); }
.howto-media .step-n { position: absolute; left: 1rem; bottom: 1rem; }
.howto h3 { color: var(--maroon); font-size: 1.35rem; }
.howto p { color: var(--muted); margin-bottom: .4rem; }
.howto .mini-cap { font-size: .72rem; color: var(--tan); }
.respect-grid { display: grid; grid-template-columns: .9fr 1.1fr; gap: clamp(2rem, 6vw, 5rem); align-items: center; position: relative; }
.respect-grid p { color: var(--cream-dim); font-size: 1.08rem; margin-bottom: 2rem; }

/* ---------- legal / contact / credits ---------- */
.legal-grid, .contact-grid { display: grid; grid-template-columns: 1.4fr 1fr; gap: clamp(2rem, 6vw, 5rem); align-items: start; }
.topics-card { background: var(--maroon); color: var(--cream); border-radius: var(--r); padding: 1.8rem; }
.topics-card h2 { color: var(--cream); font-size: 1.5rem; }
.topic-chips { display: flex; flex-wrap: wrap; gap: .5rem; }
.topic-chips span { padding: .5rem .95rem; border-radius: 999px; background: rgba(252,234,188,.12); border: 1px solid rgba(252,234,188,.3); font-weight: 600; }
.contact-panel { background: var(--paper-2); border-radius: var(--r); padding: 2.2rem; box-shadow: var(--shadow); }
.contact-panel h2, .contact-side h2 { color: var(--maroon); font-size: 1.8rem; }
.contact-side h3 { color: var(--maroon); margin-top: 2rem; }
.addr { font-weight: 700; }
.lines, .founder-lines { list-style: none; padding: 0; margin: 0; display: grid; gap: .6rem; }
.lines li { display: grid; grid-template-columns: 130px 1fr; border-bottom: 1px solid var(--line); padding-bottom: .6rem; }
.lines span { font-size: .74rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--tan); padding-top: .2rem; }
.founder-lines li { display: flex; flex-direction: column; }
.founder-lines span { color: var(--muted); font-size: .9rem; }
.table-scroll { overflow-x: auto; margin: 1.5rem 0 3rem; }
.credits-table { width: 100%; border-collapse: collapse; font-size: .9rem; background: var(--paper-2); }
.credits-table th, .credits-table td { text-align: left; padding: .7rem .8rem; border-bottom: 1px solid var(--line); vertical-align: top; }
.credits-table th { background: var(--maroon); color: var(--cream); font-size: .74rem; letter-spacing: .1em; text-transform: uppercase; }
.paper h2 { color: var(--maroon); }
.inline-list { display: flex; flex-wrap: wrap; gap: .5rem 1rem; padding-left: 1.2rem; }

/* ---------- footer ---------- */
.site-footer { position: relative; background: var(--esp); color: var(--cream-dim); padding: 5rem 0 2rem; overflow: hidden; border-top: 3px solid; border-image: linear-gradient(90deg, var(--orange-hi) 0 70%, var(--gold) 70% 100%) 1; }
.footer-glow { position: absolute; width: 700px; height: 700px; right: -200px; top: -400px; background: radial-gradient(closest-side, rgba(36,117,51,.55), transparent); pointer-events: none; }
.footer-grid { display: grid; grid-template-columns: 1.6fr 1fr 1fr 1fr; gap: 2.5rem; position: relative; }
.footer-brand .brand-plate { margin-bottom: 1.2rem; }
.footer-brand .brand-plate img { height: 52px; }
.footer-th { color: var(--tan); }
.site-footer a { color: var(--cream); text-decoration: none; }
.site-footer a:hover { color: var(--orange-hi); }
.site-footer h4 { color: var(--gold); font-size: .78rem; letter-spacing: .18em; text-transform: uppercase; margin-bottom: 1rem; }
.site-footer ul { list-style: none; padding: 0; margin: 0; display: grid; gap: .45rem; }
.site-footer p { font-size: .95rem; }
.footer-motto { margin-top: 1.4rem; font-size: .82rem !important; color: var(--tan); font-style: italic; }
.footer-bottom { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 1rem; margin-top: 3.5rem; padding-top: 1.4rem; border-top: 1px solid rgba(252,234,188,.1); font-size: .8rem; position: relative; }
.footer-pols i { width: 5px; height: 5px; }

/* preview marker */
.concept-badge { position: fixed; left: 1rem; bottom: 1rem; z-index: 60; display: inline-flex; align-items: center; gap: .5rem; font: 700 .7rem/1 var(--sans); letter-spacing: .12em; text-transform: uppercase; color: var(--esp); background: var(--gold); padding: .5rem .8rem; border-radius: 999px; box-shadow: 0 8px 24px -8px rgba(0,0,0,.6); pointer-events: none; }
.concept-badge b { width: 7px; height: 7px; border-radius: 50%; background: var(--maroon); box-shadow: 0 0 0 3px rgba(36,117,51,.25); }

/* reveal */
.js .reveal { opacity: 0; transform: translateY(26px); transition: opacity .9s var(--ease), transform .9s var(--ease); }
.js .reveal.in { opacity: 1; transform: none; }

/* ---------- responsive ---------- */
@media (max-width: 1100px) {
  .nav a { padding: .5rem .5rem; font-size: .85rem; }
  .brand-sub { display: none; }
  .editorial-grid { grid-template-columns: repeat(2, 1fr); }
  .blog-strip { grid-template-columns: 1fr 1fr; }
  .blog-head { grid-column: 1 / -1; }
}
@media (max-width: 960px) {
  .nav-toggle { display: flex; }
  .nav { position: fixed; inset: 0 0 0 auto; width: min(340px, 86vw); flex-direction: column; align-items: stretch; gap: .2rem; padding: 6rem 1.5rem 2rem; background: var(--esp); box-shadow: -20px 0 60px rgba(0,0,0,.5); transform: translateX(100%); transition: transform .4s var(--ease); }
  .nav.open { transform: none; }
  .nav a { font-size: 1.1rem; padding: .8rem 1rem; }
  .nav a.active::after { display: none; }
  .nav a.active { background: var(--cream-faint); }
  .lang-toggle, .nav a.nav-cta { margin: .8rem 0 0; text-align: center; }
  .nav-toggle { position: relative; z-index: 2; }
  .welcome-grid, .life-grid, .about-grid, .legal-grid, .contact-grid, .respect-grid { grid-template-columns: 1fr; }
  .paths { grid-template-columns: 1fr; }
  .path-tile { min-height: 340px; }
  .places-grid { grid-template-columns: 1fr 1fr; grid-template-rows: 300px 220px 220px; }
  .place-card:first-child { grid-column: span 2; grid-row: auto; }
  .place-card:last-child { grid-column: span 2; }
  .work-steps, .policy-cards, .howto-grid { grid-template-columns: 1fr; }
  .detail-layout { grid-template-columns: 1fr; }
  .inquiry-card, .founder-card { position: static; }
  .team-grid { grid-template-columns: 1fr; }
  .footer-grid { grid-template-columns: 1fr 1fr; }
  .hero-scenes { display: none; }
}
@media (max-width: 640px) {
  body { font-size: 16px; }
  .wrap { width: min(var(--wrap), 100% - 2.5rem); }
  .site-header { padding: .7rem 0; }
  .brand-plate img { height: 38px; }
  .hero-inner { padding: 7rem 0 6rem; }
  .hero-title { font-size: clamp(3.6rem, 18vw, 5rem); }
  .hero-actions .btn { flex: 1 1 auto; }
  .stats { grid-template-columns: 1fr 1fr; }
  .stats div:nth-child(3) { border-left: 0; }
  .stats div { border-top: 1px solid rgba(252,234,188,.08); }
  .section-head { flex-direction: column; align-items: flex-start; gap: .8rem; }
  .editorial-grid { grid-template-columns: 1fr; }
  .editorial-grid .card.feature { grid-column: auto; grid-row: auto; }
  .editorial-grid .card.feature .card-media { min-height: 260px; }
  .places-grid { grid-template-columns: 1fr; grid-template-rows: none; grid-auto-rows: 220px; }
  .place-card:first-child, .place-card:last-child { grid-column: auto; }
  .blog-strip { grid-template-columns: 1fr; }
  .team-card { grid-template-columns: 1fr; }
  .team-photo { aspect-ratio: 4 / 3; }
  .area-tile:first-child { grid-column: auto; grid-row: auto; min-height: 320px; }
  .footer-grid { grid-template-columns: 1fr; }
  .form-row { grid-template-columns: 1fr; }
  .filter-bar { margin-top: -1.8rem; }
  .segs { width: 100%; justify-content: space-between; }
  .seg { padding: .55rem .7rem; }
  .filter-selects label { flex: 1 1 45%; }
  select { min-width: 0; width: 100%; }
  .media-caption { left: 1.25rem; right: 1.25rem; text-align: left; font-size: .64rem; }
  .hero-credit { bottom: 4.6rem; }
  .shade-hero { background: linear-gradient(180deg, rgba(8,28,12,.5) 0%, rgba(8,28,12,.1) 25%, rgba(8,28,12,.55) 50%, rgba(8,28,12,.92) 78%, rgba(8,28,12,.96) 100%); }
  .scroll-cue { display: none; }
  .concept-badge { left: auto; right: .75rem; bottom: .75rem; font-size: .62rem; }
  .lines li { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
  .js .reveal { opacity: 1; transform: none; }
}

/* ===== Light palette (Oct 2026): white + mint/cream, forest/emerald/orange accents, no burgundy ===== */
body{background:#FFFFFF;color:var(--text)}
a{color:#1D6B2C}
.btn-primary,.nav a.nav-cta{background:#F08C28;color:#1B2A1E;box-shadow:0 10px 24px -12px rgba(240,140,40,.6)}
.btn-primary:hover,.nav a.nav-cta:hover{background:#F5A04A;color:#1B2A1E}
.eyebrow{color:#1D6B2C}
/* light sections: flip cream-on-dark tokens to ink-on-light */
.dark,.dark-maroon,.paths-section,.stats-band,.site-footer,.team-card,.topics-card,.inquiry-card,.policy-card,.site-header.is-solid,.site-header.scrolled,.nav-light-scope{
  --cream:#1B2A1E;--cream-dim:#3A4B3E;--cream-faint:rgba(36,117,51,.08);--gold:#1D6B2C;--tan:#56655A;--orange-hi:#E07B14}
.dark{background:#F2F9F4;color:var(--text)}
.dark-maroon{background:#EEF7F0;color:var(--text)}
.paths-section{background:#FFF9EC;color:var(--text)}
.stats-band{background:#F7FBF8;border-top:1px solid #E1EBE3;border-bottom:1px solid #E1EBE3}
.stats strong{color:#247533}
.site-footer{background:#F7FBF8;color:#3A4B3E;border-image:linear-gradient(90deg,#F08C28 0 70%,#27AE60 70% 100%) 1}
.site-footer a{color:#1D6B2C}
.footer-glow{background:radial-gradient(closest-side,rgba(39,174,96,.12),transparent)}
.team-card{background:#F7FBF8;border-color:#E1EBE3}
.team-photo-wrap{background:#DCEFE1}
.topics-card{background:#EEF7F0}
.inquiry-card{background:#EEF7F0;border:1px solid #DCEFE1;box-shadow:0 20px 50px -30px rgba(20,80,12,.35)}
.inquiry-card input,.inquiry-card textarea{background:#fff;border-color:#C9DDCF;color:#1B2A1E}
.inquiry-card .price{color:#247533}
.policy-card{background:#fff;border-color:#E1EBE3}
.policy-n{background:#DCEFE1;color:#14500C}
.lead-fallback{background:linear-gradient(135deg,#DCEFE1,#EEF7F0);color:#1B2A1E}
.lead-fallback span{color:#247533}
.credits-table th{background:#247533;color:#fff}
.form-note{background:#EEF7F0;color:#14500C}
.skip{background:#fff;color:#14500C}
.btn-outline{color:#247533;border-color:rgba(36,117,51,.35)}
.btn-dark{background:#247533;color:#fff}.btn-dark:hover{background:#1D6B2C}
.g-nav{background:rgba(255,255,255,.92);color:#247533}
.detail-main h2,.paper h2,.paper .section-head h2,.howto h3,.contact-panel h2,.contact-side h2,.contact-side h3,.policy-card.light h3{color:#247533}
.prose .pull{color:#247533;border-left-color:#F08C28}
.concept-badge b{background:#27AE60;box-shadow:0 0 0 3px rgba(39,174,96,.25)}
/* media panels keep light text over video/photo */
.hero,.path-tile,.area-tile,.detail-hero,.places-grid a,.cta-band,.motto-band,.testimonial-band{--cream:#FCEABC;--cream-dim:rgba(252,234,188,.85);--gold:#DD9933;--tan:#E9C79A}
/* header: white frosted bar, logo top-right, larger, no plate */
.site-header,.site-header.over-media,.site-header.is-solid,.site-header.scrolled{background:rgba(255,255,255,.9);backdrop-filter:blur(14px) saturate(1.2);-webkit-backdrop-filter:blur(14px);box-shadow:0 1px 0 #E1EBE3,0 8px 24px -18px rgba(20,80,12,.35);
  --cream:#14500C;--cream-dim:#3A4B3E;--cream-faint:rgba(36,117,51,.08);--gold:#1D6B2C;--tan:#56655A;--orange-hi:#F08C28}
.header-inner{flex-direction:row-reverse}
.brand{flex-direction:row-reverse;text-align:right}
.brand-plate{background:none;box-shadow:none;padding:0;border-radius:0}
.brand-plate img{height:64px}
.scrolled .brand-plate img,.is-solid .brand-plate img{height:56px}
.nav a{color:#14500C}
.lang-toggle{color:#14500C;border-color:#BFD9C6}
.nav-toggle{background:#fff;border-color:#C9DDCF}
.nav-toggle span{background:#14500C}
@media (max-width:960px){
  .nav{inset:0 auto 0 0;background:#fff;box-shadow:20px 0 60px rgba(20,80,12,.18);transform:translateX(-100%);--cream:#14500C;--cream-faint:rgba(36,117,51,.08)}
  .nav.open{transform:none}
  .brand-plate img,.scrolled .brand-plate img,.is-solid .brand-plate img{height:52px}
}

/* AI agents section (team.html) */
.ai-card .team-photo-wrap{position:relative}
.ai-card .team-photo{aspect-ratio:1/1;object-position:center top}
.ai-badge{position:absolute;top:.7rem;left:.7rem;background:#247533;color:#fff;font:800 .72rem/1 var(--sans);letter-spacing:.1em;padding:.35rem .55rem;border-radius:6px;box-shadow:0 4px 12px -4px rgba(20,80,12,.5)}
.ai-tag{display:inline-block;vertical-align:middle;margin-left:.4rem;font-size:.7rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#14500C;background:#DCEFE1;border:1px solid #BFE3CA;padding:.2rem .5rem;border-radius:999px}
.ai-card .team-role{color:#1D6B2C}
.ai-desc{margin:0;color:#3A4B3E;font-size:.95rem}
.ai-note{margin:1.6rem 0 0;font-size:.82rem;color:#56655A}
@media (max-width:640px){.ai-card .team-photo{aspect-ratio:1/1}}
.ai-grid{grid-template-columns:repeat(4,1fr)}
.ai-card{grid-template-columns:1fr}
.ai-card .team-info{padding:1.2rem 1.2rem 1.4rem}
.ai-card h3{font-size:1.35rem}
@media (max-width:1100px){.ai-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){.ai-grid{grid-template-columns:repeat(2,1fr);gap:.8rem}.ai-card .team-info{padding:.8rem}.ai-card h3{font-size:1.05rem}.ai-tag{display:none}.ai-desc{font-size:.82rem}.ai-card .team-role{font-size:.85rem;margin-bottom:.4rem}}
.ai-card{align-content:start}.ai-card .team-photo-wrap{aspect-ratio:1/1;overflow:hidden}.ai-card .team-photo{height:100%;aspect-ratio:1/1}

/* ===== Site-wide light photo/video grading (Tim 2026-10-07, matches team header): brightness 1.3, saturate .88, pale mint wash ===== */
.bg-video,.bg-img:not(.blur),.card-media img{filter:brightness(1.3) saturate(.88)}
.bg-img.blur{filter:blur(5px) brightness(1.3) saturate(.88)}
.bg{background:#EEF7F0}
.card-media{background:#EEF7F0}
.card-media::after{background:linear-gradient(0deg,rgba(238,247,240,.35),transparent)}
.shade-hero,.shade-page,.shade-detail,.shade-left{background:linear-gradient(90deg,rgba(255,255,255,.72) 0%,rgba(238,247,240,.5) 40%,rgba(238,247,240,.18) 75%,rgba(238,247,240,.08) 100%),linear-gradient(0deg,rgba(238,247,240,.55),rgba(238,247,240,0) 45%)!important}
.shade-tile,.shade-soft{background:linear-gradient(180deg,rgba(255,255,255,0) 35%,rgba(255,255,255,.62) 66%,rgba(247,251,248,.92) 100%)!important}
.shade-work,.shade-maroon,.shade-cta{background:radial-gradient(90% 100% at 50% 50%,rgba(255,255,255,.58),rgba(238,247,240,.78))!important}
@media (max-width:640px){.shade-hero,.shade-page,.shade-detail,.shade-left{background:linear-gradient(180deg,rgba(255,255,255,.45) 0%,rgba(238,247,240,.2) 30%,rgba(238,247,240,.6) 58%,rgba(247,251,248,.88) 100%)!important}}
/* text over graded media: dark forest */
.hero,.page-hero,.detail-hero,.path-tile,.area-tile,.place-card,.cta-band,.motto-band,.testimonial-band,.life-band,.work-band{
  --cream:#14500C;--cream-dim:#1B2A1E;--cream-faint:rgba(36,117,51,.08);--gold:#1D6B2C;--tan:#3A4B3E;--orange-hi:#F08C28;color:#1B2A1E}
.hero-title,.page-hero h1,.detail-hero h1{text-shadow:0 1px 14px rgba(255,255,255,.75)!important}
.hero-sub,.page-hero .lede,.detail-hero p,.path-tile p,.area-tile p,.place-card p{text-shadow:0 1px 10px rgba(255,255,255,.85);font-weight:500}
.btn-ghost{background:rgba(255,255,255,.7);border-color:rgba(20,80,12,.35);color:#14500C}
.btn-ghost:hover{background:#fff;color:#14500C;border-color:#247533}
.btn-outline-light{color:#14500C;border-color:rgba(20,80,12,.35)}
.hero-pills li{background:rgba(255,255,255,.75);color:#14500C;border-color:rgba(36,117,51,.35)}
.hero-pills li:first-child{background:#F08C28;color:#1B2A1E;border-color:#F08C28}
.media-caption,.media-caption a{color:#3A4B3E}
.detail-chips li{background:rgba(255,255,255,.75);color:#14500C;border-color:rgba(36,117,51,.3)}
.detail-price{color:#C96A10}
.step{background:rgba(255,255,255,.78);border-color:#DCEFE1}
.g-count{background:rgba(255,255,255,.85);color:#14500C}
.scroll-cue{border-color:#247533}
.shade-work,.shade-maroon,.shade-cta{background:radial-gradient(70% 90% at 50% 50%,rgba(255,255,255,.84),rgba(238,247,240,.7))!important}
.testimonial-band .big-quote,.testimonial-band blockquote p{color:#14500C;font-weight:400;text-shadow:0 1px 10px rgba(255,255,255,.9)}
/* Tim's property-style photos: faded section backgrounds */
.has-fade{position:relative;isolation:isolate}
.has-fade>.fade-photo{position:absolute;inset:0;z-index:-1;overflow:hidden;pointer-events:none}
.has-fade>.fade-photo img{width:100%;height:100%;object-fit:cover;opacity:.22;filter:brightness(1.3) saturate(.88)}
.has-fade>.fade-photo::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(255,255,255,.55) 0%,rgba(238,247,240,.35) 45%,rgba(255,255,255,.75) 100%)}
.fade-credit{position:absolute;right:.8rem;bottom:.5rem;font-size:.68rem;color:#5b6b5e;opacity:.8}
.cta-band .bg-img,.motto-band .bg-img{object-position:center 60%}
/* Homepage hero only (Tim 2026-10-08): bring back a little green/colour after the light grading; rest of site unchanged */
.home .hero .bg-video{filter:brightness(1.08) saturate(1.28)}
.home .hero .shade-hero{background:linear-gradient(90deg,rgba(255,255,255,.6) 0%,rgba(214,239,221,.42) 40%,rgba(176,220,190,.22) 75%,rgba(168,216,182,.2) 100%),linear-gradient(0deg,rgba(200,232,209,.5),rgba(200,232,209,0) 45%)!important}
@media (max-width:640px){.home .hero .shade-hero{background:linear-gradient(180deg,rgba(255,255,255,.38) 0%,rgba(186,224,197,.22) 30%,rgba(214,239,221,.58) 58%,rgba(244,250,246,.88) 100%)!important}}

/* Ernie's area photos (Tim 2026-10-08): fully visible photo + text features, light treatment; banners keep the photo clear behind a frosted text panel */
.pf-section{padding:clamp(3.5rem,6vw,5.5rem) 0;background:#F2F9F4}
.pf-section.white{background:#fff}
.photo-feature{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:clamp(1.8rem,4vw,3.5rem);align-items:center}
.photo-feature.reverse .pf-media{order:2}
.pf-media{margin:0;position:relative;border-radius:18px;overflow:hidden;aspect-ratio:3/2;background:#EEF7F0;box-shadow:0 24px 60px -28px rgba(20,80,12,.45)}
.pf-media img{width:100%;height:100%;object-fit:cover;filter:brightness(1.06) saturate(1.05)}
.pf-media figcaption{position:absolute;left:.8rem;bottom:.7rem;font-size:.72rem;font-weight:600;color:#14500C;background:rgba(255,255,255,.88);padding:.25rem .65rem;border-radius:999px}
.pf-text .eyebrow{color:#C96A10}
.pf-text h2{color:#247533;font-size:clamp(1.9rem,3.2vw,2.8rem)}
.pf-text p{color:#3A4B3E;font-size:1.08rem;max-width:42ch;margin-bottom:1.6rem}
@media (max-width:860px){.photo-feature{grid-template-columns:1fr}.photo-feature.reverse .pf-media{order:0}}
.photo-banner .shade-cta{background:linear-gradient(0deg,rgba(255,255,255,.1),rgba(255,255,255,.1))!important}
.photo-banner .bg-img{filter:brightness(1.12) saturate(1.05)}
.cta-band.photo-banner .cta-inner{width:min(640px,100% - 2.5rem);margin-left:max(1.25rem,calc((100% - 1240px)/2));background:rgba(255,255,255,.8);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:20px;padding:clamp(1.6rem,3vw,2.4rem);box-shadow:0 20px 50px -24px rgba(20,80,12,.4)}
.cta-band.photo-banner .cta-inner h2{margin-bottom:1.4rem}
.motto-band.photo-banner>.wrap{width:min(900px,100% - 2.5rem);background:rgba(255,255,255,.8);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:20px;padding:clamp(1.6rem,3vw,2.4rem);box-shadow:0 20px 50px -24px rgba(20,80,12,.4)}
.photo-banner .media-caption{background:rgba(255,255,255,.85);padding:.2rem .6rem;border-radius:999px}
.listings-hero-img{object-position:center 45%}
/* Hero trust line (Tim 2026-10-08): plain informational text, not buttons */
.hero-pills.hero-trust{margin:1.6rem 0 0;gap:.4rem 1.5rem}
.hero-pills.hero-trust li,.hero-pills.hero-trust li:first-child{display:inline-flex;align-items:center;gap:.45rem;padding:0;border:0;border-radius:0;background:none;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none;text-transform:none;letter-spacing:0;font-size:.95rem;font-weight:600;color:#2F4434;cursor:default;text-shadow:0 1px 8px rgba(255,255,255,.9)}
.hero-pills.hero-trust li::before{content:"";flex:none;width:16px;height:16px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Ccircle cx='8' cy='8' r='8' fill='%23247533'/%3E%3Cpath d='M4.6 8.3l2.2 2.2 4.6-4.8' fill='none' stroke='%23fff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat}
.hero-pills.hero-trust li:hover{background:none;color:#2F4434}
@media (max-width:640px){.hero-pills.hero-trust{gap:.35rem 1.1rem}.hero-pills.hero-trust li{font-size:.88rem}}
/* Live / invest / build tiles: white text on the green pill (hover stays orange) */
.path-count{color:#fff}
.path-tile:hover .path-count{background:var(--orange);color:#fff}
/* Wai video: no placeholder outline; team page brand lockup in the green caption */
.wai-slot{outline:none}
.wai-brand{display:flex;align-items:center;justify-content:center;gap:1.1rem;padding:1.5rem 1.2rem 1.6rem!important;text-align:left}
.wb-plate{flex:none;display:inline-flex;background:#fff;border-radius:12px;padding:6px 12px;box-shadow:0 8px 20px -10px rgba(0,0,0,.45)}
.wb-plate img{height:62px;width:auto}
.wb-text{display:flex;flex-direction:column;min-width:0}
.wb-name{font-size:clamp(1.6rem,3vw,2.3rem);font-weight:900;letter-spacing:-.03em;line-height:1.05;color:#fff}
.wb-th{margin-top:.3rem;font-size:.92rem;color:rgba(255,255,255,.88)}
@media (max-width:480px){.wai-brand{flex-direction:column;text-align:center;gap:.8rem}.wb-plate img{height:52px}}
/* Thai language mode */
html[lang="th"] body{font-family:"Noto Sans Thai","Figtree",system-ui,sans-serif}
html[lang="th"] h1,html[lang="th"] h2,html[lang="th"] h3,html[lang="th"] .hero-title{line-height:1.25;letter-spacing:-.01em;word-break:normal;overflow-wrap:anywhere}
html[lang="th"] .eyebrow{letter-spacing:.06em}
html[lang="th"] .nav a{font-size:.95em}
html[lang="th"] p,html[lang="th"] li{line-height:1.75}
.detail-desc-th p{margin:0 0 1em}

/* Thai mode polish (2026-10-08): Thai script reads badly with tracking; no "64" count chip */
html[lang="th"] body *:not(.wb-name){letter-spacing:normal !important}
html[lang="th"] .seg[data-filter-group="all"] small{display:none}
/* Home "How it works" step numbers sit on green (--gold is re-mapped to green on home): white text, same fix as .path-count */
.home .step-n{color:#fff}

/* LINE contact link (Duean Draper, 2026-10-08) */
.line-id{display:inline-flex;align-items:center;gap:.4rem;font-weight:600;align-self:flex-start}
.line-id .line-ico{flex:none;color:#06C755}
.team-contact a.line-id{border-bottom:0}
.team-contact .line-id span:not(.sr-only){border-bottom:1px solid rgba(221,153,51,.4)}
.founder-lines .line-id{color:inherit;margin-top:.15rem}
.line-id .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* Jeff fixes 2026-10-12: mobile header logo LEFT, menu button RIGHT; opaque drop-down menu */
@media (max-width:960px){
  .header-inner{flex-direction:row}
  .brand{flex-direction:row;text-align:left}
  /* backdrop-filter on the header traps the fixed menu inside the header bar and lets the page show through: drop it on mobile */
  .site-header,.site-header.over-media,.site-header.is-solid,.site-header.scrolled{background:#fff;backdrop-filter:none;-webkit-backdrop-filter:none}
  .nav{position:fixed;inset:0 0 0 auto;width:min(340px,86vw);height:100vh;height:100dvh;overflow-y:auto;background:#fff!important;opacity:1;backdrop-filter:none;-webkit-backdrop-filter:none;box-shadow:-20px 0 60px rgba(20,80,12,.25);transform:translateX(100%);z-index:1}
  .nav.open{transform:none}
  .nav a{color:#14500C}
}
/* quiet build stamp */
.build-stamp{display:block;width:100%;margin-top:.6rem;font-size:.68rem;opacity:.55;letter-spacing:.02em}
/* Jeff 2026-10-12: preview badge off the footer date; readable wai caption on the light palette */
.concept-badge{left:auto;right:1rem}
.site-footer{padding-bottom:4.5rem}
.wai-slot figcaption{color:rgba(255,255,255,.92)}
.wai-slot figcaption strong{color:#fff}
/* wai photo (Pexels 32686187, Tue Simon) with slow Ken Burns zoom */
.wai-slot .wai-photo{display:block;width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;object-position:50% 40%;transform-origin:50% 35%;animation:wai-kb 24s ease-in-out infinite alternate}
@keyframes wai-kb{from{transform:scale(1)}to{transform:scale(1.06)}}
@media (prefers-reduced-motion: reduce){.wai-slot .wai-photo{animation:none}}
/* Lead form: consent checkbox + states (QA pass 2026-10-17) */
.form-consent{display:flex;gap:.6rem;align-items:flex-start;margin:.2rem 0 1rem;font-size:.92rem;line-height:1.45;color:var(--text)}
.form-consent input{flex:0 0 auto;width:1.15rem;height:1.15rem;margin-top:.15rem;accent-color:var(--maroon)}
.form-consent a{color:var(--maroon);text-decoration:underline;text-underline-offset:2px}
.form-note.is-ok{background:#EEF7F0;color:#14500C}
.form-note.is-error{background:#FDECEC;color:#8A1C1C}
.hp{position:absolute!important;left:-9999px!important}
/* Bilingual static pages (privacy): show the block that matches the active language */
html.lang-th [data-lang-block="en"]{display:none}
html:not(.lang-th) [data-lang-block="th"]{display:none}
.review-note{font-size:.85rem;padding:.6rem .8rem;border-radius:8px;background:var(--cream);color:var(--maroon)}
.prose h2{margin-top:2rem}.prose li{margin-bottom:.35rem}

/* Listen banner (homepage hero) */
.listen-banner{display:flex;align-items:center;gap:.7rem;padding:.4rem .9rem .4rem .4rem;border-radius:999px;background:rgba(255,255,255,.92);color:#2a1a10;box-shadow:0 4px 14px rgba(0,0,0,.18)}
.listen-banner img{width:64px;height:64px;border-radius:50%;object-fit:cover;flex:none}
.listen-copy{display:flex;flex-direction:column;gap:.25rem;font-size:.85rem;line-height:1.2}
.listen-btn{display:inline-flex;align-items:center;gap:.35rem;border:0;border-radius:999px;padding:.45rem .95rem;background:#e8731a;color:#fff;font:inherit;font-weight:700;cursor:pointer;touch-action:manipulation;min-height:40px}
.listen-btn.playing{background:#2a1a10}
.listen-btn:focus-visible{outline:3px solid #fff;outline-offset:2px}
@media (max-width:600px){.hero-actions .listen-banner{flex:1 1 100%;border-radius:18px}}

/* ===== Ernie call 2026-10-19 (2/2): homepage photos crisper, lighter filters; text kept readable with
   overlays only where the text sits (+ a soft white halo), instead of washing the whole photo ===== */
.home .bg-video,.home .bg-img:not(.blur),.home .card-media img{filter:contrast(1.04) saturate(1.06)}
.home .bg-img.blur{filter:none;transform:none}
.home .hero .bg-video{filter:contrast(1.05) saturate(1.1)}
.home .card-media::after{background:none}
.home .hero .shade-hero{background:linear-gradient(90deg,rgba(255,255,255,.86) 0%,rgba(255,255,255,.76) 34%,rgba(255,255,255,.42) 48%,rgba(255,255,255,0) 64%)!important}
.home .shade-left{background:linear-gradient(90deg,rgba(255,255,255,.86) 0%,rgba(255,255,255,.7) 34%,rgba(255,255,255,0) 58%)!important}
.home .shade-tile{background:linear-gradient(180deg,rgba(255,255,255,0) 42%,rgba(255,255,255,.7) 70%,rgba(255,255,255,.9) 100%)!important}
.home .shade-work{background:linear-gradient(180deg,rgba(255,255,255,.82) 0%,rgba(255,255,255,.55) 34%,rgba(255,255,255,.12) 62%,rgba(255,255,255,.2) 100%)!important}
.home .shade-maroon{background:rgba(255,255,255,.08)!important}
/* testimonial: photo stays clear, quote sits on a frosted panel (same pattern as the photo banners) */
.home .testimonial-inner{width:min(940px,100% - 2.5rem);background:rgba(255,255,255,.84);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-radius:20px;padding:clamp(1.6rem,3vw,2.6rem);box-shadow:0 20px 50px -24px rgba(20,80,12,.45)}
.home .testimonial-band blockquote,.home .testimonial-band blockquote p{text-shadow:none}
.home .place-label strong{text-shadow:0 0 10px rgba(255,255,255,.95),0 0 2px #fff}
.home .place-label span{display:inline-block;width:auto;align-self:flex-start;color:#A84E05!important;background:rgba(255,255,255,.88);padding:.1rem .5rem;border-radius:999px;text-shadow:none}
.home .media-caption,.home .media-caption a{color:#2F4434}
@media (min-width:641px){.home .hero .media-caption,.home .life-band .media-caption,.home .work-band .media-caption,.home .testimonial-band .media-caption{background:rgba(255,255,255,.85);padding:.2rem .6rem;border-radius:999px}}
@media (max-width:640px){.home .hero .media-caption a{text-shadow:0 0 6px #fff,0 0 2px #fff}}
.home .hero-title,.home .hero-kicker{text-shadow:0 0 18px rgba(255,255,255,.95),0 1px 3px rgba(255,255,255,.9)!important}
.home .hero-sub,.home .hero-title em,.home .path-tile p,.home .place-card p,.home .place-card h3,.home .path-tile h3{text-shadow:0 0 10px rgba(255,255,255,.95),0 0 2px #fff}
.home .hero-sub{color:#1B2A1E;font-weight:600}
@media (max-width:640px){
  .home .hero .shade-hero{background:linear-gradient(180deg,rgba(255,255,255,.3) 0%,rgba(255,255,255,.56) 22%,rgba(255,255,255,.6) 60%,rgba(255,255,255,.68) 100%)!important}
  .home .shade-left{background:linear-gradient(180deg,rgba(255,255,255,.8),rgba(255,255,255,.62))!important}
  .home .shade-work{background:linear-gradient(180deg,rgba(255,255,255,.8),rgba(255,255,255,.55) 50%,rgba(255,255,255,.35))!important}
}
.home .hero-scenes .scene{text-shadow:0 0 8px #fff,0 0 2px #fff}

/* ===== Ernie call 2026-10-19 (v3, Tim's live-call feedback): LIGHT, bright, crisp heroes. Photo/video at full colour with a
   slight exposure lift + clarity/contrast; NO full-image overlay of any colour (white or dark). Readability comes only from a
   compact frosted-light panel sized to the text block (.hero-panel), dark site text. Home, page and listing heroes. ===== */
.hero .bg-video,.hero .bg-img,.page-hero .bg-video,.page-hero .bg-img,.detail-hero .bg-img,
.home .hero .bg-video,.home .hero .bg-img,.page-hero .bg-img.blur,.detail-hero .bg-img.blur{filter:brightness(1.06) contrast(1.1) saturate(1.16)!important;transform:none!important}
.hero .shade,.page-hero .shade,.detail-hero .shade,.home .hero .shade-hero{display:none!important}
.hero .bg,.page-hero .bg,.detail-hero .bg{background:#EEF7F0}
.hero-panel{width:fit-content;max-width:min(40rem,100%);background:rgba(255,255,255,.78);-webkit-backdrop-filter:blur(12px) saturate(1.3);backdrop-filter:blur(12px) saturate(1.3);
  border-radius:20px;padding:clamp(1rem,2.2vw,1.6rem) clamp(1.1rem,2.6vw,2rem);box-shadow:0 18px 44px -26px rgba(20,80,12,.45);border:1px solid rgba(255,255,255,.7)}
.hero .hero-panel{margin-bottom:1.6rem}.hero .hero-panel .hero-sub{margin-bottom:0}
.page-hero .hero-panel h1,.detail-hero .hero-panel h1{margin-bottom:.5rem}
.hero,.page-hero,.detail-hero{--cream:#14500C;--cream-dim:#1B2A1E;--gold:#1D6B2C;--tan:#3A4B3E;color:#1B2A1E}
.hero .hero-title,.home .hero .hero-title,.page-hero h1,.detail-hero h1{color:#14500C!important;text-shadow:none!important}
.hero .hero-title em,.hero .hero-sub,.home .hero .hero-sub,.page-hero .lede,.detail-hero p,.detail-hero .crumbs,.detail-hero .crumbs a{color:#1B2A1E!important;text-shadow:none!important}
.hero .hero-kicker,.home .hero .hero-kicker,.page-hero .eyebrow,.detail-hero .eyebrow{color:#1D6B2C!important;text-shadow:none!important}
.home .hero .hero-sub{font-weight:500}
.detail-hero .detail-price{color:#C96A10;text-shadow:none}
.detail-hero .detail-chips li{background:rgba(255,255,255,.9)}
.hero .hero-pills.hero-trust{width:fit-content;max-width:100%;background:rgba(255,255,255,.78);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-radius:16px;padding:.55rem 1rem}
.hero .hero-pills.hero-trust li,.hero .hero-pills.hero-trust li:hover{color:#1B2A1E;text-shadow:none}
.hero-scenes .scene,.home .hero-scenes .scene{color:#14500C!important;text-shadow:none!important;background:rgba(255,255,255,.8);padding:.25rem .7rem;border-radius:999px}
.hero .media-caption,.page-hero .media-caption{background:rgba(255,255,255,.8)!important;padding:.2rem .6rem;border-radius:999px;text-shadow:none!important}
.hero .media-caption,.hero .media-caption a,.page-hero .media-caption,.page-hero .media-caption a{color:#2F4434!important;text-shadow:none!important}
@media (max-width:640px){
  .hero-panel{padding:.85rem 1rem;border-radius:16px}
  .hero .hero-inner{padding-top:5.5rem}
  .hero .hero-title{font-size:clamp(3rem,15vw,4.2rem)}
  .hero .hero-title em{margin-top:.5rem}
  .hero .hero-sub{font-size:1rem}
  .hero .hero-pills.hero-trust{padding:.45rem .8rem}
  .hero .media-caption,.page-hero .media-caption{border-radius:10px}
  .home .hero .hero-inner{padding-bottom:4.4rem}
  .home .hero .hero-credit{bottom:.7rem;left:1.25rem;right:auto;max-width:calc(100% - 12.5rem);font-size:.68rem}
  .home .hero .bg-video{filter:brightness(1.12) contrast(1.08) saturate(1.16)!important}
  .hero .hero-actions{gap:.55rem}
  .hero .hero-pills.hero-trust{margin-top:.9rem}
}

/* ===== Ernie item 3 (2026-10-20): small Wai clip, Pattaya/Rayong slider. The ~30% smaller home hero rules were removed 2026-10-23 at Tim's request (hero back to heroes-v3 size). ===== */
.home .hero .hero-panel{max-width:min(48rem,100%)} /* room for the full-size Sawasdee headline at desktop widths */
.wai-hello{padding:2.2rem 0 1rem;background:#F7FBF6}
.wai-hello-inner{display:flex;align-items:center;gap:1.4rem;justify-content:center}
.wai-hello-video{width:min(240px,42vw);aspect-ratio:1/1;object-fit:cover;border-radius:18px;box-shadow:0 14px 34px -22px rgba(20,80,12,.55);background:#EEF7F0}
.wai-hello-copy{max-width:22rem;color:#1B2A1E}.wai-hello-copy .eyebrow{color:#1D6B2C;font-weight:700;margin:0 0 .3rem}.wai-hello-copy p{margin:0}
.seaboard{padding:2.4rem 0 2.6rem;background:#F7FBF6}
.seaboard h2{margin:.2rem 0 1rem;color:#14500C}.seaboard .eyebrow{color:#1D6B2C}
.sb-frame{position:relative}
.sb-track{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;list-style:none;margin:0;padding:0 0 .4rem;scrollbar-width:none}
.sb-track::-webkit-scrollbar{display:none}
.sb-slide{flex:0 0 calc(50% - 8px);scroll-snap-align:start;position:relative;border-radius:16px;overflow:hidden;aspect-ratio:3/2;background:#e6efe4}
.sb-slide img{width:100%;height:100%;object-fit:cover;display:block}
.sb-cap{position:absolute;left:.7rem;bottom:.7rem;background:rgba(255,255,255,.88);color:#14500C;font-weight:600;font-size:.85rem;padding:.25rem .7rem;border-radius:999px}
.sb-nav{position:absolute;top:50%;transform:translateY(-50%);z-index:2;width:44px;height:44px;border-radius:50%;border:0;background:rgba(255,255,255,.92);color:#14500C;font-size:1.8rem;line-height:1;cursor:pointer;box-shadow:0 6px 18px -8px rgba(0,0,0,.4)}
.sb-prev{left:.5rem}.sb-next{right:.5rem}
.sb-credit{position:static;margin:.6rem 0 0;font-size:.75rem}.sb-credit a{color:#2F4434}
@media (max-width:640px){
  .wai-hello-inner{gap:1rem}.wai-hello-video{width:38vw;border-radius:14px}
  .sb-slide{flex-basis:86%}
  .sb-nav{width:38px;height:38px;font-size:1.5rem}
}
/* Listing listen player (same look as the homepage .listen-banner); js/listen-listing.js, tools/listing-audio/listen.py */
.listen-listing{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem;margin:.9rem 0 .2rem;padding:.35rem .9rem .35rem .35rem;border-radius:22px;background:rgba(255,255,255,.92);color:#2a1a10;box-shadow:0 4px 14px rgba(0,0,0,.18);max-width:34rem}
.listen-listing{border-radius:20px;padding:.6rem .9rem}
.listen-listing .ll-row{display:flex;align-items:center;gap:.75rem;flex:1 1 100%}
.listen-listing .ll-hit{display:flex;align-items:center;gap:.7rem;cursor:pointer;flex:1 1 auto;min-width:0}
.listen-listing .ll-ear{width:60px;height:60px;border-radius:50%;object-fit:cover;flex:none;border:3px solid #e8731a;background:#fff;box-shadow:0 2px 8px rgba(0,0,0,.25)}
.listen-listing .ll-title{font-size:1.15rem;line-height:1.2;color:#2a1a10}
.listen-listing .ll-hit:hover .ll-ear{transform:scale(1.05)}.listen-listing.is-playing .ll-ear{animation:llpulse 1.2s ease-in-out infinite}
@keyframes llpulse{50%{box-shadow:0 0 0 8px rgba(232,115,26,.25)}}
@media (prefers-reduced-motion:reduce){.listen-listing.is-playing .ll-ear{animation:none}}
.listen-listing .ll-btn{flex:none;min-height:48px;padding:.55rem 1.1rem;font-size:1.05rem;display:inline-flex;align-items:center;gap:.35rem}
.listen-listing .ll-copy{display:flex;align-items:center;flex-wrap:wrap;gap:.3rem .7rem;font-size:.9rem;line-height:1.2;flex:1 1 100%}
@media (max-width:480px){.listen-listing .ll-ear{width:52px;height:52px}.listen-listing .ll-title{font-size:1rem}.listen-listing .ll-btn{padding:.5rem .8rem}}
.listen-listing .ll-ico{display:inline-flex}.listen-listing .ll-pause{display:none}
.listen-listing.is-playing .ll-play{display:none}.listen-listing.is-playing .ll-pause{display:inline}
.listen-listing .ll-details{flex:1 1 100%;font-size:.85rem;padding:0 .4rem .3rem}
.listen-listing .ll-details summary{cursor:pointer;color:#7a4a1a;text-decoration:underline;min-height:24px}
.listen-listing .ll-details summary:focus-visible,.listen-listing .ll-btn:focus-visible{outline:3px solid #e8731a;outline-offset:2px}
.listen-listing .ll-details p{margin:.4rem 0 0;line-height:1.5}
.listen-listing .i18n-th{display:none}
html.lang-th .listen-listing .i18n-th{display:inline}html.lang-th .listen-listing p.i18n-th{display:block}
html.lang-th .listen-listing .i18n-en{display:none}
.visually-hidden{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.listen-listing .ll-note{flex:1 1 100%;font-size:.8rem;color:#5a3a1a}
.listen-listing .ll-note::before{content:"";}

/* Hero rotation (montage <-> Mekong clip), Tim 23 Oct */
.bg-video.hero-rot{opacity:0;transition:opacity .9s ease}
.bg-video.hero-rot.on{opacity:1}
.hero-scenes{transition:opacity .6s}
.hero-scenes.off{opacity:0}
@media (prefers-reduced-motion: reduce){.bg-video.hero-rot{display:none}}
