/* Koh Chang Domains — unified editorial system
   One serif, one sans, one signature accent. Four surfaces only. */
:root {
  --u-forest: #08271d;
  --u-forest-deep: #031710;
  --u-forest-soft: #123b2e;
  --u-paper: #eee1cb;
  --u-paper-light: #f6ecdc;
  --u-ink: #17372b;
  --u-body: #344a40;
  --u-gold: #c99c47;
  --u-gold-light: #ebc775;
  --u-line-dark: rgba(23, 55, 43, .18);
  --u-line-light: rgba(235, 199, 117, .32);
  --u-paper-texture: var(--u-paper) url("/mockup-cotton-seamless.png") repeat;
}

html { background: var(--u-forest-deep) !important; }
body {
  margin: 0 !important;
  background: var(--u-paper-texture) !important;
  color: var(--u-body) !important;
  font-family: Inter, Arial, sans-serif !important;
  font-size: 16px !important;
  line-height: 1.7 !important;
  -webkit-font-smoothing: antialiased;
}
body *, body *::before, body *::after { box-sizing: border-box; }
h1, h2, h3, h4, h5, h6,
.display-title, .section-head h2, .featured-domain h3,
.domain-card .name, .fbrand {
  font-family: "Fraunces", Georgia, serif !important;
  font-style: normal !important;
  font-weight: 600 !important;
  letter-spacing: -.025em !important;
}
p, li, button, input, textarea, select, label, small, .eyebrow {
  font-family: Inter, Arial, sans-serif !important;
}
.wrap { width: min(1380px, calc(100% - 72px)) !important; max-width: none !important; padding: 0 !important; }
.page { background: var(--u-paper-texture) !important; }
.page.active { animation: pageIn .38s ease both !important; }
section { border: 0 !important; }

/* Header: one continuous scenic band */
.site-nav {
  min-height: 108px !important;
  background:
    linear-gradient(90deg, rgba(2,20,14,.95), rgba(3,28,19,.58) 50%, rgba(2,19,13,.92)),
    var(--kc-photo-sunset) center 47% / cover no-repeat !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(201,156,71,.56) !important;
  box-shadow: 0 8px 30px rgba(0,0,0,.15) !important;
  backdrop-filter: none !important;
}
.site-nav .nav-inner {
  width: min(1540px, calc(100% - 44px)) !important;
  max-width: none !important;
  min-height: 108px !important;
  padding: 8px 0 !important;
  gap: 24px !important;
}
.brand { width: auto !important; height: auto !important; flex: 0 0 auto !important; gap: 13px !important; overflow: visible !important; }
.brand .mockup-brand { display: none !important; }
.brand img:not(.mockup-brand) {
  display: block !important;
  width: 70px !important; height: 70px !important;
  border-radius: 50% !important;
  object-fit: cover !important;
  filter: saturate(.85) contrast(1.05) !important;
  box-shadow: 0 0 0 1px var(--u-gold), 0 8px 24px rgba(0,0,0,.18) !important;
}
.brand-text { display: flex !important; }
.brand-text strong { color: #fbf4e7 !important; font-size: 1.15rem !important; font-family: "Fraunces", Georgia, serif !important; font-weight: 600 !important; letter-spacing: .12em !important; text-transform: uppercase !important; }
.brand-text span { color: var(--u-gold-light) !important; font-size: .65rem !important; letter-spacing: .34em !important; }
.nav-right { flex: 1 !important; justify-content: flex-end !important; gap: 18px !important; min-width: 0 !important; }
nav.links { flex: 1 !important; justify-content: center !important; gap: clamp(10px, 1.7vw, 30px) !important; }
nav.links button {
  padding: 13px 0 !important;
  color: rgba(255,248,235,.87) !important;
  font-family: "Fraunces", Georgia, serif !important;
  font-size: clamp(.66rem,.78vw,.80rem) !important;
  font-weight: 500 !important;
  letter-spacing: .025em !important;
  text-transform: uppercase !important;
  border: 0 !important; border-radius: 0 !important; background: transparent !important;
}
nav.links button::after { bottom: 1px !important; }
.nav-hornbill {
  width: 70px !important; height: 70px !important; flex: 0 0 70px !important;
  align-self: center !important; border-radius: 50% !important; overflow: hidden !important;
  border: 1px solid rgba(235,199,117,.55) !important;
  background: var(--u-forest-deep) !important;
}
.nav-hornbill img {
  position: static !important; width: 100% !important; height: 100% !important; max-width: none !important;
  object-fit: cover !important; object-position: 48% center !important;
  mask-image: none !important; -webkit-mask-image: none !important;
  filter: saturate(.88) contrast(1.03) !important;
}
.lang-switch { gap: 7px !important; }
.lang-switch button { color: rgba(255,248,235,.72) !important; }
.lang-switch button.active { color: var(--u-gold-light) !important; }
.nav-domain-cta {
  min-width: 138px !important; padding: 11px 14px !important;
  background: rgba(3,23,16,.30) !important; border: 1px solid var(--u-gold) !important;
  color: var(--u-gold-light) !important; font-family: Inter, Arial, sans-serif !important;
  font-size: .66rem !important; font-weight: 700 !important; letter-spacing: .09em !important;
}

/* Streamlined home: remove three redundant interruptions */
#page-home.active { display: flex !important; flex-direction: column !important; }
#page-home .hero-premium,
#page-home .premium-ledger,
#page-home .home-intro { display: none !important; }
#page-home .manifest-section { order: -10 !important; }
#page-home .categories-premium { order: -9 !important; }
#page-home .featured-section { order: -8 !important; }
#page-home .island-section { order: -7 !important; }
#page-home .giveback-section { order: -6 !important; }
#page-home .process-section { order: -5 !important; }
#page-home .closing-cta { order: -4 !important; }

/* First viewport: one uninterrupted cotton sheet */
.manifest-section {
  min-height: calc(100vh - 108px) !important;
  padding: clamp(54px,7vh,86px) 0 150px !important;
  background: var(--u-paper-texture) !important;
  color: var(--u-ink) !important;
  position: relative !important;
  overflow: hidden !important;
}
.manifest-section::before { display: none !important; }
.manifest-section::after {
  display: block !important; content: "" !important;
  position: absolute !important; inset: auto 0 0 !important; height: 105px !important;
  background:
    linear-gradient(180deg, rgba(238,225,203,0) 0%, rgba(8,39,29,.66) 52%, rgba(3,23,16,.98) 100%),
    var(--kc-photo-klong) center 73% / cover no-repeat !important;
  border: 0 !important;
}
.manifest-grid {
  display: grid !important;
  grid-template-columns: minmax(0, 1.08fr) minmax(390px, .92fr) !important;
  gap: clamp(60px,7.5vw,124px) !important;
  align-items: center !important;
  position: relative !important; z-index: 1 !important;
}
.manifest-statement { min-height: 0 !important; }
.manifest-art {
  display: block !important; width: 100% !important; max-width: 790px !important; height: auto !important;
  mix-blend-mode: normal !important;
  filter: saturate(.88) contrast(1.015) !important;
}
.manifest-copy { max-width: 570px !important; padding: 0 !important; color: var(--u-body) !important; }
.manifest-copy h2 {
  margin: 0 0 30px !important; max-width: 560px !important;
  color: var(--u-forest) !important;
  font-family: "Fraunces", Georgia, serif !important;
  font-size: clamp(2.65rem,3.8vw,4rem) !important; line-height: 1.08 !important;
  font-weight: 600 !important; letter-spacing: -.04em !important;
}
.manifest-lead, .manifest-second {
  margin: 0 0 22px !important; color: var(--u-body) !important;
  font-family: Inter, Arial, sans-serif !important;
  font-size: clamp(.94rem,1.05vw,1.06rem) !important; line-height: 1.8 !important;
}
.manifest-signoff { margin-top: 35px !important; padding: 0 !important; border: 0 !important; }
.manifest-signoff > span {
  font-family: "Segoe Script", "Bradley Hand", cursive !important;
  font-size: clamp(1.65rem,2.7vw,2.5rem) !important; font-weight: 400 !important;
  color: var(--u-forest) !important; letter-spacing: 0 !important;
}
.manifest-stamp {
  width: 128px !important; height: 132px !important; flex: 0 0 128px !important;
  border-radius: 50% !important; overflow: hidden !important; opacity: .78 !important;
  mix-blend-mode: multiply !important;
}
.manifest-stamp img { width: 128px !important; height: 132px !important; object-fit: cover !important; }

/* Four continuous surface types */
.categories-premium,
.island-section,
.closing-cta,
.about-hero,
.contact-section,
.ideas-panel,
footer {
  background:
    linear-gradient(90deg, rgba(3,23,16,.95), rgba(5,36,25,.78), rgba(3,23,16,.94)),
    var(--kc-photo-klong) center / cover no-repeat !important;
  color: #f9f1e4 !important;
}
.featured-section,
.giveback-section,
.process-section,
#page-catalog > section:first-child,
.faq-section,
.about-body,
.np-teaser,
#page-charity > section:first-child,
.donate-section {
  background: var(--u-paper-texture) !important;
  color: var(--u-body) !important;
}
.categories-premium,
.featured-section,
.island-section,
.giveback-section,
.process-section,
.closing-cta,
#page-catalog > section:first-child,
.faq-section,
.about-body,
.np-teaser,
#page-charity > section:first-child,
.donate-section,
.contact-section { padding: 100px 0 !important; }
.featured-section + .island-section,
.process-section + .closing-cta { border: 0 !important; }

/* Headings and copy use the same scale everywhere */
.section-head, .wide-head { margin-bottom: 48px !important; }
.section-head h2, .wide-head h2, .home-section-top h2,
.island-copy h2, .giveback-head h2, .closing-cta h2,
.about-hero h1, .contact-section h2 {
  font-size: clamp(2.5rem,4.2vw,4.2rem) !important;
  line-height: 1.06 !important; letter-spacing: -.035em !important;
}
.featured-section h2, .giveback-section h2, .process-section h2,
#page-catalog h2, .faq-section h2, .about-body h2,
#page-charity h2, .donate-section h2 { color: var(--u-forest) !important; }
.featured-section p, .giveback-section p, .process-section p,
#page-catalog p, .faq-section p, .about-body p,
#page-charity p, .donate-section p { color: var(--u-body) !important; }
.eyebrow {
  color: var(--u-gold) !important; font-size: .66rem !important; font-weight: 700 !important;
  letter-spacing: .19em !important; text-transform: uppercase !important;
}

/* Categories: one calm row, no competing badges */
.categories-premium .cat-grid { gap: 18px !important; }
.categories-premium .cat-card {
  min-height: 370px !important; border-radius: 0 !important;
  border: 1px solid var(--u-line-light) !important;
  box-shadow: 0 18px 46px rgba(0,0,0,.22) !important;
  filter: saturate(.88) contrast(1.03) !important;
}
.categories-premium .cat-card::after { inset: 8px !important; border-color: rgba(255,244,220,.20) !important; }
.categories-premium .cat-card h3 { font-size: 1.22rem !important; color: #fff7e9 !important; }
.categories-premium .cat-card .count { color: var(--u-gold-light) !important; }
.categories-premium .cat-card:hover { transform: translateY(-4px) !important; }

/* Featured and catalog imagery gets one shared grade and frame */
.featured-grid, .domain-grid { gap: 20px !important; }
.featured-domain,
.domain-card {
  border-radius: 0 !important;
  border: 1px solid rgba(30,65,49,.22) !important;
  box-shadow: 0 16px 42px rgba(35,46,37,.14) !important;
  background: var(--u-forest) !important;
}
.featured-domain { min-height: 430px !important; }
.featured-domain::before, .domain-card .domain-visual {
  filter: saturate(.84) contrast(1.05) sepia(.035) !important;
}
.featured-domain::after { background: linear-gradient(180deg, transparent 0%, rgba(4,25,17,.12) 44%, rgba(4,25,17,.95) 66%, rgba(4,25,17,.99)) !important; }
.featured-domain .featured-index { border-radius: 0 !important; background: var(--u-paper-light) !important; color: var(--u-forest) !important; }
.featured-domain h3, .domain-card .name { color: #fff8eb !important; }
.offer-note { color: #53675d !important; }
.domain-card:hover { transform: translateY(-3px) !important; border-color: var(--u-gold) !important; }

/* Giveback and process read as one continuous editorial chapter */
.giveback-section { padding-bottom: 42px !important; }
.process-section { padding-top: 42px !important; }
.giveback-head { border: 0 !important; padding-bottom: 34px !important; }
.giveback-head h2, .community-callout h3 { color: var(--u-forest) !important; }
.giveback-head > p, .impact-types p, .community-callout p { color: var(--u-body) !important; }
.impact-types { border-top: 1px solid var(--u-line-dark) !important; border-bottom: 1px solid var(--u-line-dark) !important; }
.impact-types > div { border-color: var(--u-line-dark) !important; }
.impact-types h3 { color: var(--u-forest) !important; }
.community-callout { background: transparent !important; border: 0 !important; border-top: 1px solid var(--u-line-dark) !important; border-radius: 0 !important; }
.process-grid { border-color: var(--u-line-dark) !important; }
.process-grid > div { border-color: var(--u-line-dark) !important; background: transparent !important; box-shadow: none !important; }
.process-grid h3 { color: var(--u-forest) !important; }
.process-grid p { color: var(--u-body) !important; }

/* Catalog: one paper sheet, one dark index bar, consistent cards */
#page-catalog > section:first-child { padding-top: 80px !important; }
.catalog-toolbar {
  margin: 42px 0 18px !important; padding: 15px !important;
  border-radius: 0 !important; border: 0 !important;
  background: var(--u-forest) !important; box-shadow: none !important;
}
.filter-pill { border-radius: 0 !important; }
.cat-ideal-line { border-radius: 0 !important; background: rgba(8,39,29,.055) !important; color: #715527 !important; border-color: var(--u-line-dark) !important; }
.domain-card { overflow: hidden !important; }
.domain-card .meta, .domain-card .ideal-for, .idea-tag { color: rgba(255,248,235,.78) !important; }
.faq-section { border-top: 1px solid var(--u-line-dark) !important; }
.faq-item {
  border-radius: 0 !important; border: 0 !important; border-top: 1px solid var(--u-line-dark) !important;
  background: transparent !important; box-shadow: none !important;
}
.faq-item:last-child { border-bottom: 1px solid var(--u-line-dark) !important; }
.faq-item summary { color: var(--u-forest) !important; }

/* About, charity, contact: remove isolated boxes */
.about-hero { min-height: 390px !important; display: flex !important; align-items: flex-end !important; padding: 88px 0 !important; }
.about-grid { gap: 72px !important; }
.value-card, .trust-card, .org-item, .invite-box, .charity-block, .trans-step {
  border-radius: 0 !important; border: 1px solid var(--u-line-dark) !important;
  background: rgba(255,255,255,.10) !important; box-shadow: none !important;
}
.np-teaser { border-top: 1px solid var(--u-line-dark) !important; border-bottom: 1px solid var(--u-line-dark) !important; }
.ideas-panel { border-radius: 0 !important; box-shadow: none !important; border: 1px solid var(--u-line-light) !important; }
.support-card {
  border-radius: 0 !important; border: 1px solid var(--u-line-dark) !important;
  background: var(--u-forest) !important; box-shadow: 0 14px 36px rgba(35,46,37,.13) !important;
}
.support-card .s-ic { filter: saturate(.84) contrast(1.04) sepia(.035) !important; }
.contact-section { min-height: calc(100vh - 108px) !important; display: flex !important; align-items: center !important; }
.contact-form, .modal-box {
  border-radius: 0 !important; border: 1px solid var(--u-line-light) !important;
  background: rgba(3,24,16,.90) !important; box-shadow: 0 24px 68px rgba(0,0,0,.28) !important;
}
.field input, .field textarea, .field select { border-radius: 0 !important; }

/* Controls */
.btn, .filter-pill, .marketplace-badges a, .idea-tag { border-radius: 0 !important; }
.btn { font-family: Inter, Arial, sans-serif !important; font-size: .78rem !important; font-weight: 700 !important; letter-spacing: .07em !important; text-transform: uppercase !important; }
.btn-primary, .btn-sand { background: var(--u-gold) !important; color: var(--u-forest-deep) !important; border-color: var(--u-gold-light) !important; box-shadow: none !important; }
.btn-outline { background: transparent !important; border-color: var(--u-gold) !important; color: #fff4e4 !important; }

footer { border-top: 1px solid var(--u-gold) !important; padding: 58px 0 26px !important; }
.image-credits { margin: 18px auto 0 !important; }

@media (max-width: 1280px) {
  .site-nav .nav-inner { width: calc(100% - 32px) !important; gap: 16px !important; }
  .brand-text { display: none !important; }
  nav.links { gap: 14px !important; }
  .nav-hornbill { display: none !important; }
  .manifest-grid { grid-template-columns: 1fr 1fr !important; gap: 54px !important; }
}
@media (max-width: 940px) {
  .wrap { width: min(100% - 36px, 1380px) !important; }
  .site-nav, .site-nav .nav-inner { min-height: 80px !important; }
  .brand img:not(.mockup-brand) { width: 58px !important; height: 58px !important; }
  .brand-text { display: flex !important; }
  .brand-text strong { font-size: .92rem !important; }
  .brand-text span { font-size: .52rem !important; }
  .nav-domain-cta { display: none !important; }
  .nav-toggle { display: block !important; border-color: var(--u-gold) !important; color: var(--u-gold-light) !important; }
  nav.links {
    position: absolute !important; top: 100% !important; left: 0 !important; right: 0 !important;
    display: none !important; flex-direction: column !important; align-items: stretch !important;
    background: var(--u-forest-deep) !important; padding: 14px 24px 24px !important;
    border-bottom: 1px solid var(--u-gold) !important;
  }
  nav.links.open { display: flex !important; }
  nav.links button { text-align: left !important; }
  .manifest-section { min-height: auto !important; padding: 42px 0 125px !important; }
  .manifest-grid { grid-template-columns: 1fr !important; gap: 32px !important; }
  .manifest-art { max-width: 680px !important; margin: auto !important; }
  .manifest-copy { max-width: 680px !important; }
  .categories-premium, .featured-section, .island-section, .giveback-section,
  .process-section, .closing-cta, #page-catalog > section:first-child,
  .faq-section, .about-body, .np-teaser, #page-charity > section:first-child,
  .donate-section, .contact-section { padding: 76px 0 !important; }
}
@media (max-width: 600px) {
  .wrap { width: min(100% - 28px, 1380px) !important; }
  .brand-text { display: none !important; }
  .lang-switch button .code { display: none !important; }
  .manifest-copy h2 { font-size: 2.35rem !important; }
  .manifest-signoff > span { font-size: 1.38rem !important; }
  .manifest-stamp { width: 88px !important; height: 91px !important; flex-basis: 88px !important; }
  .manifest-stamp img { width: 88px !important; height: 91px !important; }
  .categories-premium, .featured-section, .island-section, .giveback-section,
  .process-section, .closing-cta, #page-catalog > section:first-child,
  .faq-section, .about-body, .np-teaser, #page-charity > section:first-child,
  .donate-section, .contact-section { padding: 60px 0 !important; }
}

/* =========================================================
   IMPACT EDITORIAL + TROPICAL JOURNEY
   Softer chapters, larger imagery and a continuous sequence.
   ========================================================= */

/* Gentle page-wide transitions instead of hard color cuts */
.categories-premium,
.island-section {
  padding-top: 150px !important;
  padding-bottom: 150px !important;
  background:
    linear-gradient(180deg,
      var(--u-paper) 0,
      rgba(238,225,203,.74) 32px,
      rgba(8,39,29,0) 118px,
      rgba(8,39,29,0) calc(100% - 118px),
      rgba(238,225,203,.74) calc(100% - 32px),
      var(--u-paper) 100%),
    linear-gradient(90deg,rgba(3,23,16,.94),rgba(5,36,25,.70),rgba(3,23,16,.94)),
    var(--kc-photo-klong) center / cover no-repeat !important;
}
.closing-cta {
  padding-top: 150px !important;
  background:
    linear-gradient(180deg,var(--u-paper) 0,rgba(238,225,203,.58) 34px,rgba(3,23,16,0) 128px),
    linear-gradient(90deg,rgba(3,23,16,.94),rgba(5,36,25,.72),rgba(3,23,16,.94)),
    var(--kc-photo-sunset) center / cover no-repeat !important;
}
.about-hero {
  background:
    linear-gradient(180deg,rgba(3,23,16,0) 55%,rgba(238,225,203,.18) 78%,var(--u-paper) 100%),
    linear-gradient(90deg,rgba(3,23,16,.90),rgba(5,36,25,.55),rgba(3,23,16,.90)),
    var(--kc-photo-sunset) center / cover no-repeat !important;
}

/* Softer object language across the complete site */
.cat-card,
.featured-domain,
.domain-card,
.support-card,
.value-card,
.trust-card,
.contact-form,
.ideas-panel,
.org-item,
.invite-box,
.modal-box,
.transaction-card {
  border-radius: 18px !important;
  overflow: hidden !important;
}
.btn,
.filter-pill,
.marketplace-badges a { border-radius: 999px !important; }
.catalog-toolbar { border-radius: 22px !important; }
.cat-ideal-line { border-radius: 14px !important; }
.field input,.field textarea,.field select { border-radius: 10px !important; }

/* The four giveback areas become image-led editorial stories */
.giveback-section { padding-top: 100px !important; padding-bottom: 70px !important; }
.impact-types {
  display: grid !important;
  grid-template-columns: repeat(2,minmax(0,1fr)) !important;
  gap: 26px !important;
  border: 0 !important;
  margin-top: 46px !important;
}
.impact-types > article {
  min-width: 0 !important;
  background: rgba(255,255,255,.22) !important;
  border: 1px solid rgba(23,55,43,.14) !important;
  border-radius: 22px !important;
  overflow: hidden !important;
  box-shadow: 0 18px 50px rgba(35,46,37,.10) !important;
  transition: transform .28s ease, box-shadow .28s ease !important;
}
.impact-types > article:hover {
  transform: translateY(-5px) !important;
  box-shadow: 0 26px 64px rgba(35,46,37,.16) !important;
}
.impact-types figure {
  height: 280px !important;
  margin: 0 !important;
  overflow: hidden !important;
  background: var(--u-forest) !important;
}
.impact-types figure img {
  width: 100% !important; height: 100% !important;
  object-fit: cover !important; object-position: center !important;
  filter: saturate(.86) contrast(1.04) sepia(.025) !important;
  transition: transform .6s cubic-bezier(.22,.61,.36,1) !important;
}
.impact-types article:hover figure img { transform: scale(1.025) !important; }
.impact-types article > div {
  display: grid !important;
  grid-template-columns: 54px 1fr !important;
  column-gap: 18px !important;
  padding: 26px 30px 30px !important;
}
.impact-types article span {
  grid-row: 1 / span 2 !important;
  display: inline-flex !important;
  align-items: center !important; justify-content: center !important;
  width: 48px !important; height: 48px !important;
  border: 1px solid rgba(201,156,71,.72) !important;
  border-radius: 50% !important;
  color: #7a5925 !important;
  font-family: "Fraunces",Georgia,serif !important;
  font-size: .78rem !important;
}
.impact-types article h3 {
  margin: 0 0 7px !important;
  color: var(--u-forest) !important;
  font-size: 1.45rem !important;
}
.impact-types article p {
  margin: 0 !important;
  color: var(--u-body) !important;
  font-size: .88rem !important;
  line-height: 1.65 !important;
}
.community-callout {
  margin-top: 54px !important;
  padding: 38px 42px !important;
  border: 1px solid rgba(23,55,43,.15) !important;
  border-radius: 24px !important;
  background: rgba(255,255,255,.16) !important;
}

/* From idea to ownership: one landscape, one natural left-to-right flow */
.process-section { padding-top: 72px !important; padding-bottom: 110px !important; }
.process-section .section-head { max-width: 790px !important; margin-bottom: 46px !important; }
.process-journey {
  position: relative !important;
  min-height: 620px !important;
  overflow: hidden !important;
  border-radius: 38px !important;
  background: var(--u-forest) !important;
  box-shadow: 0 28px 80px rgba(22,43,33,.20) !important;
}
.process-landscape {
  position: absolute !important; inset: 0 !important;
  background:
    linear-gradient(180deg,rgba(2,18,12,.12),rgba(2,20,14,.30)),
    url("/process-river.webp") center / cover no-repeat !important;
  filter: saturate(.87) contrast(1.04) !important;
}
.process-journey::after {
  content: "" !important;
  position: absolute !important; inset: 0 !important; pointer-events: none !important;
  background: linear-gradient(90deg,rgba(2,18,12,.30),transparent 18%,transparent 82%,rgba(2,18,12,.28)) !important;
}
.process-grid {
  position: relative !important; z-index: 2 !important;
  display: grid !important;
  grid-template-columns: repeat(4,minmax(0,1fr)) !important;
  gap: 24px !important;
  min-height: 620px !important;
  padding: 44px !important;
  border: 0 !important;
  align-items: center !important;
}
.process-grid > div {
  position: relative !important;
  padding: 28px 24px 25px !important;
  border: 1px solid rgba(255,248,235,.58) !important;
  border-radius: 30px 18px 32px 20px !important;
  background: rgba(246,236,220,.90) !important;
  box-shadow: 0 18px 42px rgba(0,0,0,.18) !important;
  backdrop-filter: blur(8px) !important;
}
.process-grid > div:nth-child(1) { transform: translateY(92px) rotate(-1deg) !important; }
.process-grid > div:nth-child(2) { transform: translateY(-72px) rotate(1deg) !important; }
.process-grid > div:nth-child(3) { transform: translateY(54px) rotate(-.7deg) !important; }
.process-grid > div:nth-child(4) { transform: translateY(-86px) rotate(.8deg) !important; }
.process-grid b {
  display: inline-flex !important;
  width: 38px !important; height: 38px !important;
  align-items: center !important; justify-content: center !important;
  border-radius: 50% !important;
  background: var(--u-gold) !important;
  color: var(--u-forest-deep) !important;
  font-family: "Fraunces",Georgia,serif !important;
  font-size: .72rem !important;
}
.process-grid h3 {
  margin: 15px 0 7px !important;
  color: var(--u-forest) !important;
  font-size: 1.25rem !important;
}
.process-grid p {
  margin: 0 !important;
  color: #354b40 !important;
  font-size: .79rem !important;
  line-height: 1.58 !important;
}

/* Charity contrast: all text stays readable over the jungle image */
.ideas-panel {
  border-radius: 28px !important;
  background:
    linear-gradient(90deg,rgba(2,20,14,.94),rgba(4,31,22,.83)),
    var(--kc-photo-klong) center / cover no-repeat !important;
}
.ideas-panel .eyebrow { color: var(--u-gold-light) !important; }
.ideas-panel h3 { color: #fff7e9 !important; }
.ideas-panel p { color: rgba(255,248,235,.88) !important; }
.ideas-panel .ideas-questions li {
  color: #fff8ec !important;
  background: rgba(255,255,255,.10) !important;
  border-left-color: var(--u-gold) !important;
  border-radius: 0 14px 14px 0 !important;
}

@media (max-width: 920px) {
  .impact-types { grid-template-columns: 1fr !important; }
  .impact-types figure { height: 320px !important; }
  .process-journey,.process-grid { min-height: 820px !important; }
  .process-grid { grid-template-columns: repeat(2,minmax(0,1fr)) !important; padding: 34px !important; }
  .process-grid > div:nth-child(1),.process-grid > div:nth-child(2),
  .process-grid > div:nth-child(3),.process-grid > div:nth-child(4) { transform: none !important; }
}
@media (max-width: 600px) {
  .categories-premium,.island-section { padding-top: 105px !important; padding-bottom: 105px !important; }
  .impact-types figure { height: 230px !important; }
  .impact-types article > div { grid-template-columns: 44px 1fr !important; padding: 22px !important; gap: 14px !important; }
  .impact-types article span { width: 40px !important; height: 40px !important; }
  .community-callout { padding: 28px !important; }
  .process-journey,.process-grid { min-height: auto !important; }
  .process-grid { grid-template-columns: 1fr !important; padding: 22px !important; gap: 16px !important; }
  .process-landscape { background-position: 58% center !important; }
  .process-grid > div { backdrop-filter: blur(10px) !important; }
}

/* Charity narrative: one continuous editorial path instead of stacked boxes */
#page-charity > section:first-child,
#page-charity .donate-section {
  background: var(--u-paper-texture) !important;
}
#page-charity > section:first-child { padding-bottom: 72px !important; }
#page-charity .charity-story {
  position: relative !important;
  max-width: 920px !important;
  margin: 46px 0 62px 38px !important;
  padding: 8px 24px 8px 82px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
#page-charity .charity-story::before {
  position: absolute !important;
  left: 0 !important; top: 4px !important;
  display: grid !important;
  width: 48px !important; height: 48px !important;
  place-items: center !important;
  border: 1px solid rgba(178,132,49,.58) !important;
  border-radius: 50% !important;
  color: var(--u-gold-dark) !important;
  background: rgba(250,243,230,.7) !important;
  font: 600 .72rem/1 "Montserrat",Arial,sans-serif !important;
  letter-spacing: .12em !important;
  box-shadow: 0 8px 24px rgba(14,48,34,.08) !important;
}
#page-charity .charity-story-how::before { content: "01" !important; }
#page-charity .charity-story-transparency::before { content: "02" !important; }
#page-charity .charity-story::after {
  content: "" !important;
  position: absolute !important;
  left: 24px !important; top: 58px !important; bottom: -54px !important;
  width: 1px !important;
  background: linear-gradient(180deg,rgba(178,132,49,.62),rgba(178,132,49,.06)) !important;
}
#page-charity .charity-story-transparency::after { display: none !important; }
#page-charity .charity-story h3 {
  margin: 0 0 12px !important;
  color: var(--u-forest) !important;
  font-size: clamp(1.55rem,2.4vw,2.25rem) !important;
}
#page-charity .charity-story > p {
  max-width: 780px !important;
  margin: 0 !important;
  color: #33493e !important;
  font-size: 1rem !important;
  line-height: 1.78 !important;
}
#page-charity .ideas-panel {
  margin-top: 30px !important;
  margin-bottom: 66px !important;
  border: 0 !important;
  border-radius: 34px 20px 36px 22px !important;
  box-shadow: 0 24px 64px rgba(0,28,19,.16) !important;
  overflow: hidden !important;
}
#page-charity .trans-steps {
  position: relative !important;
  display: grid !important;
  grid-template-columns: repeat(3,minmax(0,1fr)) !important;
  gap: 0 !important;
  margin-top: 32px !important;
}
#page-charity .trans-steps::before {
  content: "" !important;
  position: absolute !important;
  left: 20px !important; right: 20px !important; top: 17px !important;
  height: 1px !important;
  background: linear-gradient(90deg,var(--u-gold),rgba(178,132,49,.28)) !important;
}
#page-charity .trans-step {
  position: relative !important;
  z-index: 1 !important;
  display: grid !important;
  grid-template-columns: 36px 1fr !important;
  gap: 12px !important;
  align-items: start !important;
  padding: 0 24px 0 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
#page-charity .trans-step span {
  display: grid !important;
  width: 36px !important; height: 36px !important;
  place-items: center !important;
  border-radius: 50% !important;
  color: #fff8eb !important;
  background: var(--u-forest) !important;
  box-shadow: 0 0 0 6px rgba(246,236,220,.92) !important;
  font: 600 .64rem/1 "Montserrat",Arial,sans-serif !important;
  letter-spacing: .08em !important;
}
#page-charity .trans-step b {
  padding-top: 5px !important;
  color: #263f33 !important;
  font-size: .84rem !important;
  line-height: 1.55 !important;
}

/* Support map: four readable callouts orbit one Koh Chang silhouette */
#page-charity .donate-section {
  padding-top: 84px !important;
  border-top: 0 !important;
}
#page-charity .support-cats { margin-top: 96px !important; }
#page-charity .support-cats-label {
  margin-bottom: 34px !important;
  color: var(--u-gold-dark) !important;
  text-align: center !important;
  letter-spacing: .2em !important;
}
#page-charity .support-grid {
  position: relative !important;
  display: grid !important;
  grid-template-columns: minmax(220px,1fr) minmax(210px,300px) minmax(220px,1fr) !important;
  grid-template-rows: repeat(2,minmax(180px,auto)) !important;
  grid-template-areas:
    "rescue island education"
    "welfare island environment" !important;
  gap: 34px 48px !important;
  align-items: center !important;
  max-width: 1120px !important;
  margin: 0 auto !important;
  padding: 38px 20px !important;
}
#page-charity .support-card {
  position: relative !important;
  min-width: 0 !important;
  padding: 24px 22px !important;
  border: 0 !important;
  border-radius: 28px 17px 30px 19px !important;
  background: rgba(255,251,242,.42) !important;
  box-shadow: 0 16px 38px rgba(10,46,32,.07) !important;
  text-align: left !important;
  overflow: visible !important;
}
#page-charity .support-rescue { grid-area: rescue !important; }
#page-charity .support-education { grid-area: education !important; }
#page-charity .support-welfare { grid-area: welfare !important; }
#page-charity .support-environment { grid-area: environment !important; }
#page-charity .support-card::after {
  content: "" !important;
  position: absolute !important;
  top: 34px !important;
  width: 54px !important; height: 1px !important;
  background: linear-gradient(90deg,rgba(178,132,49,.28),var(--u-gold)) !important;
}
#page-charity .support-rescue::after,
#page-charity .support-welfare::after { right: -54px !important; }
#page-charity .support-education::after,
#page-charity .support-environment::after {
  left: -54px !important;
  transform: rotate(180deg) !important;
}
#page-charity .support-index {
  display: inline-block !important;
  margin-bottom: 14px !important;
  color: var(--u-gold-dark) !important;
  font: 600 .7rem/1 "Montserrat",Arial,sans-serif !important;
  letter-spacing: .15em !important;
}
#page-charity .support-card h4 {
  margin: 0 0 8px !important;
  color: var(--u-forest) !important;
  font-family: "Fraunces",Georgia,serif !important;
  font-size: clamp(1.25rem,2vw,1.65rem) !important;
  line-height: 1.2 !important;
}
#page-charity .support-card p {
  margin: 0 !important;
  color: #304a3d !important;
  font-size: .88rem !important;
  line-height: 1.66 !important;
}
#page-charity .support-card:hover {
  transform: translateY(-3px) !important;
  box-shadow: 0 20px 44px rgba(10,46,32,.10) !important;
}
#page-charity .support-island {
  grid-area: island !important;
  position: relative !important;
  align-self: stretch !important;
  display: grid !important;
  min-height: 480px !important;
  place-items: center !important;
}
#page-charity .support-island::before {
  content: "" !important;
  position: absolute !important;
  inset: 11% -10% !important;
  border-radius: 50% !important;
  background: radial-gradient(ellipse,rgba(31,112,90,.14),rgba(31,112,90,0) 68%) !important;
  filter: blur(6px) !important;
}
#page-charity .support-island svg {
  position: relative !important;
  z-index: 1 !important;
  width: min(100%,240px) !important;
  height: 100% !important;
  max-height: 500px !important;
  overflow: visible !important;
  filter: drop-shadow(0 24px 24px rgba(2,31,20,.2)) !important;
}
#page-charity .support-island .island-shadow {
  fill: rgba(166,123,44,.22) !important;
  transform: translate(9px,10px) !important;
}
#page-charity .support-island .island-main {
  fill: url(#supportIslandFill) !important;
  stroke: #c89b49 !important;
  stroke-width: 3 !important;
}
#page-charity .support-island .island-ridge {
  fill: none !important;
  stroke: url(#supportIslandShine) !important;
  stroke-width: 2 !important;
  stroke-linecap: round !important;
}
#page-charity .support-island .island-ridge-two { opacity: .64 !important; }
#page-charity .support-island-mark {
  position: absolute !important;
  z-index: 2 !important;
  display: grid !important;
  gap: 4px !important;
  place-items: center !important;
  color: #fff4df !important;
  text-align: center !important;
  text-shadow: 0 2px 8px rgba(0,0,0,.3) !important;
  pointer-events: none !important;
}
#page-charity .support-island-mark span {
  font: 500 1.05rem/1.1 "Fraunces",Georgia,serif !important;
  letter-spacing: .08em !important;
}
#page-charity .support-island-mark b {
  color: var(--u-gold-light) !important;
  font: 600 .55rem/1 "Montserrat",Arial,sans-serif !important;
  letter-spacing: .22em !important;
}

@media (max-width: 900px) {
  #page-charity .support-grid {
    grid-template-columns: 1fr 220px !important;
    grid-template-rows: repeat(4,auto) !important;
    grid-template-areas:
      "rescue island"
      "education island"
      "welfare island"
      "environment island" !important;
  }
  #page-charity .support-card::after { right: -48px !important; left: auto !important; transform: none !important; }
}
@media (max-width: 640px) {
  #page-charity > section:first-child { padding-bottom: 40px !important; }
  #page-charity .charity-story {
    margin: 38px 0 46px !important;
    padding: 62px 0 0 !important;
  }
  #page-charity .charity-story::before { left: 0 !important; }
  #page-charity .charity-story::after { display: none !important; }
  #page-charity .trans-steps { grid-template-columns: 1fr !important; gap: 18px !important; }
  #page-charity .trans-steps::before { left: 17px !important; right: auto !important; top: 18px !important; bottom: 18px !important; width: 1px !important; height: auto !important; }
  #page-charity .support-cats { margin-top: 72px !important; }
  #page-charity .support-grid {
    grid-template-columns: 1fr !important;
    grid-template-rows: auto !important;
    grid-template-areas: "island" "rescue" "education" "welfare" "environment" !important;
    gap: 18px !important;
    padding-inline: 0 !important;
  }
  #page-charity .support-island { min-height: 380px !important; margin-bottom: 8px !important; }
  #page-charity .support-island svg { max-height: 380px !important; }
  #page-charity .support-card { padding: 22px 20px !important; }
  #page-charity .support-card::after { display: none !important; }
}

/* Charity support portfolio — image-led editorial grid (supersedes island concept) */
#page-charity .support-cats {
  position: relative !important;
  max-width: 1180px !important;
  margin: 104px auto 0 !important;
  padding-top: 34px !important;
  border-top: 1px solid rgba(171,127,48,.24) !important;
}
#page-charity .support-cats::before {
  content: "" !important;
  position: absolute !important;
  left: 50% !important; top: -4px !important;
  width: 8px !important; height: 8px !important;
  border-radius: 50% !important;
  background: var(--u-gold) !important;
  transform: translateX(-50%) !important;
  box-shadow: 0 0 0 7px rgba(246,236,220,.94) !important;
}
#page-charity .support-cats-label {
  max-width: 760px !important;
  margin: 0 auto 38px !important;
  color: var(--u-gold-dark) !important;
  text-align: center !important;
  font-size: .68rem !important;
  letter-spacing: .22em !important;
}
#page-charity .support-grid {
  display: grid !important;
  grid-template-columns: repeat(2,minmax(0,1fr)) !important;
  grid-template-rows: none !important;
  grid-template-areas: none !important;
  gap: 34px !important;
  max-width: 1180px !important;
  margin: 0 auto !important;
  padding: 0 !important;
  align-items: stretch !important;
}
#page-charity .support-card,
#page-charity .support-rescue,
#page-charity .support-education,
#page-charity .support-welfare,
#page-charity .support-environment {
  grid-area: auto !important;
  position: relative !important;
  display: flex !important;
  min-width: 0 !important;
  min-height: 500px !important;
  flex-direction: column !important;
  padding: 0 !important;
  border: 1px solid rgba(177,132,48,.28) !important;
  border-radius: 28px 18px 30px 20px !important;
  background: rgba(255,250,240,.58) !important;
  box-shadow: 0 20px 52px rgba(9,44,31,.10) !important;
  color: var(--u-forest) !important;
  overflow: hidden !important;
  transform: none !important;
}
#page-charity .support-card:nth-child(2),
#page-charity .support-card:nth-child(3) {
  border-radius: 18px 30px 20px 28px !important;
}
#page-charity .support-card::after { display: none !important; }
#page-charity .support-card .s-ic {
  position: relative !important;
  display: block !important;
  width: 100% !important;
  height: 320px !important;
  min-height: 320px !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background-image: var(--charity-photo) !important;
  background-size: cover !important;
  filter: saturate(.88) contrast(1.04) !important;
  overflow: hidden !important;
}
#page-charity .support-card .s-ic::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  background:
    linear-gradient(180deg,rgba(3,25,17,.04) 45%,rgba(3,25,17,.34) 100%),
    linear-gradient(90deg,rgba(201,155,73,.08),transparent 42%) !important;
  pointer-events: none !important;
}
#page-charity .support-rescue { --charity-photo: var(--charity-rescue-final) !important; }
#page-charity .support-education { --charity-photo: var(--charity-education-final) !important; }
#page-charity .support-welfare { --charity-photo: var(--charity-animal-final) !important; }
#page-charity .support-environment { --charity-photo: var(--charity-environment-final) !important; }
#page-charity .support-rescue .s-ic { background-position: center 43% !important; }
#page-charity .support-education .s-ic { background-position: center 40% !important; }
#page-charity .support-welfare .s-ic { background-position: center 42% !important; }
#page-charity .support-environment .s-ic { background-position: center 42% !important; }
#page-charity .support-card-copy {
  position: relative !important;
  display: grid !important;
  grid-template-columns: 54px minmax(0,1fr) !important;
  grid-template-rows: auto auto !important;
  column-gap: 18px !important;
  flex: 1 !important;
  padding: 27px 30px 30px !important;
  background:
    linear-gradient(rgba(255,250,240,.72),rgba(255,250,240,.72)),
    var(--u-paper-texture) !important;
}
#page-charity .support-card-copy::before {
  content: "" !important;
  position: absolute !important;
  left: 30px !important; top: 0 !important;
  width: 64px !important; height: 2px !important;
  background: var(--u-gold) !important;
}
#page-charity .support-index {
  grid-row: 1 / span 2 !important;
  display: grid !important;
  width: 46px !important; height: 46px !important;
  margin: 1px 0 0 !important;
  place-items: center !important;
  border: 1px solid rgba(171,127,48,.48) !important;
  border-radius: 50% !important;
  color: var(--u-gold-dark) !important;
  background: rgba(255,255,255,.34) !important;
  font: 600 .66rem/1 "Montserrat",Arial,sans-serif !important;
  letter-spacing: .12em !important;
}
#page-charity .support-card h4 {
  margin: 0 0 8px !important;
  color: var(--u-forest) !important;
  font-family: "Fraunces",Georgia,serif !important;
  font-size: clamp(1.35rem,2.1vw,1.8rem) !important;
  line-height: 1.15 !important;
}
#page-charity .support-card p {
  margin: 0 !important;
  color: #314a3d !important;
  font-size: .9rem !important;
  line-height: 1.65 !important;
}
#page-charity .support-card:hover {
  transform: translateY(-5px) !important;
  border-color: rgba(177,132,48,.5) !important;
  box-shadow: 0 28px 68px rgba(9,44,31,.14) !important;
}
#page-charity .support-card:hover .s-ic {
  filter: saturate(.96) contrast(1.05) !important;
}

@media (max-width: 860px) {
  #page-charity .support-grid {
    grid-template-columns: 1fr !important;
    max-width: 680px !important;
  }
  #page-charity .support-card { min-height: 0 !important; }
  #page-charity .support-card .s-ic { height: 340px !important; min-height: 340px !important; }
}
@media (max-width: 560px) {
  #page-charity .support-cats { margin-top: 76px !important; }
  #page-charity .support-grid { gap: 22px !important; }
  #page-charity .support-card,
  #page-charity .support-card:nth-child(2),
  #page-charity .support-card:nth-child(3) { border-radius: 22px 14px 24px 16px !important; }
  #page-charity .support-card .s-ic { height: 245px !important; min-height: 245px !important; }
  #page-charity .support-card-copy {
    grid-template-columns: 42px minmax(0,1fr) !important;
    gap: 13px !important;
    padding: 24px 20px 25px !important;
  }
  #page-charity .support-card-copy::before { left: 20px !important; }
  #page-charity .support-index { width: 38px !important; height: 38px !important; }
}

/* Charity refinement: unnumbered accordions, compact imagery and stronger contrast */
#page-charity .charity-story {
  max-width: 960px !important;
  margin: 34px 0 42px !important;
  padding: 0 !important;
  border: 0 !important;
  border-top: 1px solid rgba(165,119,41,.32) !important;
  border-bottom: 1px solid rgba(165,119,41,.22) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
#page-charity .charity-story::before,
#page-charity .charity-story::after { display: none !important; content: none !important; }
#page-charity .charity-story > summary {
  position: relative !important;
  display: flex !important;
  min-height: 72px !important;
  align-items: center !important;
  padding: 18px 56px 18px 0 !important;
  color: var(--u-forest) !important;
  cursor: pointer !important;
  list-style: none !important;
}
#page-charity .charity-story > summary::-webkit-details-marker { display: none !important; }
#page-charity .charity-story > summary::after {
  content: "+" !important;
  position: absolute !important;
  right: 8px !important; top: 50% !important;
  display: grid !important;
  width: 34px !important; height: 34px !important;
  place-items: center !important;
  border: 1px solid rgba(165,119,41,.45) !important;
  border-radius: 50% !important;
  color: var(--u-gold-dark) !important;
  font: 400 1.3rem/1 "Montserrat",Arial,sans-serif !important;
  transform: translateY(-50%) !important;
  transition: transform .25s ease,background .25s ease !important;
}
#page-charity .charity-story[open] > summary::after {
  content: "−" !important;
  background: rgba(201,155,73,.12) !important;
}
#page-charity .charity-story > summary span {
  font-family: "Fraunces",Georgia,serif !important;
  font-size: clamp(1.35rem,2.2vw,1.85rem) !important;
  font-weight: 550 !important;
  line-height: 1.25 !important;
}
#page-charity .charity-story-answer {
  max-width: 840px !important;
  padding: 0 56px 26px 0 !important;
}
#page-charity .charity-story-answer p {
  margin: 0 !important;
  color: #263f33 !important;
  font-size: .98rem !important;
  line-height: 1.78 !important;
}
#page-charity .trans-questions {
  display: grid !important;
  grid-template-columns: repeat(3,minmax(0,1fr)) !important;
  gap: 14px !important;
  margin: 24px 0 0 !important;
  padding: 0 !important;
  list-style: none !important;
}
#page-charity .trans-questions li {
  position: relative !important;
  padding: 15px 16px 15px 28px !important;
  border-left: 1px solid var(--u-gold) !important;
  color: #294236 !important;
  background: rgba(255,251,242,.38) !important;
  font-size: .82rem !important;
  font-weight: 600 !important;
  line-height: 1.5 !important;
}
#page-charity .trans-questions li::before {
  content: "" !important;
  position: absolute !important;
  left: 12px !important; top: 21px !important;
  width: 5px !important; height: 5px !important;
  border-radius: 50% !important;
  background: var(--u-gold) !important;
}

#page-charity .support-grid { gap: 24px !important; }
#page-charity .support-card,
#page-charity .support-rescue,
#page-charity .support-education,
#page-charity .support-welfare,
#page-charity .support-environment {
  display: block !important;
  min-height: 0 !important;
  border-color: rgba(156,112,37,.34) !important;
  background: rgba(255,251,244,.76) !important;
  box-shadow: 0 14px 38px rgba(8,42,29,.085) !important;
}
#page-charity .support-card-summary {
  display: block !important;
  padding: 0 !important;
  color: var(--u-forest) !important;
  cursor: pointer !important;
  list-style: none !important;
}
#page-charity .support-card-summary::-webkit-details-marker { display: none !important; }
#page-charity .support-card .s-ic {
  height: 235px !important;
  min-height: 235px !important;
}
#page-charity .support-card-copy {
  position: relative !important;
  display: flex !important;
  min-height: 72px !important;
  align-items: center !important;
  justify-content: space-between !important;
  width: 100% !important;
  flex: none !important;
  gap: 18px !important;
  padding: 18px 22px !important;
  background:
    linear-gradient(rgba(255,251,244,.86),rgba(255,251,244,.86)),
    var(--u-paper-texture) !important;
}
#page-charity .support-card-copy::before {
  left: 22px !important;
  width: 48px !important;
}
#page-charity .support-card h4,
#page-charity .support-card-title {
  display: block !important;
  margin: 0 !important;
  color: #0b3425 !important;
  font-family: "Fraunces",Georgia,serif !important;
  font-size: clamp(1.18rem,1.8vw,1.5rem) !important;
  font-weight: 550 !important;
  line-height: 1.2 !important;
}
#page-charity .support-toggle {
  position: relative !important;
  display: block !important;
  width: 30px !important; height: 30px !important;
  flex: 0 0 30px !important;
  border: 1px solid rgba(165,119,41,.45) !important;
  border-radius: 50% !important;
}
#page-charity .support-toggle::before,
#page-charity .support-toggle::after {
  content: "" !important;
  position: absolute !important;
  left: 50% !important; top: 50% !important;
  width: 10px !important; height: 1px !important;
  background: var(--u-gold-dark) !important;
  transform: translate(-50%,-50%) !important;
  transition: transform .25s ease !important;
}
#page-charity .support-toggle::after { transform: translate(-50%,-50%) rotate(90deg) !important; }
#page-charity .support-card[open] .support-toggle::after { transform: translate(-50%,-50%) rotate(0deg) !important; }
#page-charity .support-card-detail {
  padding: 17px 22px 21px !important;
  border-top: 1px solid rgba(165,119,41,.18) !important;
  background: rgba(255,251,244,.68) !important;
}
#page-charity .support-card-detail p {
  margin: 0 !important;
  color: #253e32 !important;
  font-size: .88rem !important;
  line-height: 1.62 !important;
}
#page-charity .support-hover {
  position: absolute !important;
  inset: 0 !important;
  z-index: 2 !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-end !important;
  padding: 24px !important;
  color: #fff9ed !important;
  background: linear-gradient(180deg,rgba(2,22,15,.12),rgba(2,27,18,.94)) !important;
  opacity: 0 !important;
  transform: translateY(10px) !important;
  transition: opacity .3s ease,transform .3s ease !important;
  pointer-events: none !important;
}
#page-charity .support-hover b {
  margin-bottom: 7px !important;
  color: #f1d28f !important;
  font-family: "Fraunces",Georgia,serif !important;
  font-size: 1.2rem !important;
  line-height: 1.2 !important;
}
#page-charity .support-hover p,
#page-charity .support-hover-copy {
  display: block !important;
  margin: 0 !important;
  color: rgba(255,249,237,.94) !important;
  font-size: .78rem !important;
  line-height: 1.55 !important;
}
#page-charity .support-rescue:hover .support-hover,
#page-charity .support-welfare:hover .support-hover,
#page-charity .support-rescue:focus-within .support-hover,
#page-charity .support-welfare:focus-within .support-hover,
#page-charity .support-rescue[open] .support-hover,
#page-charity .support-welfare[open] .support-hover {
  opacity: 1 !important;
  transform: translateY(0) !important;
}

/* Spend page contrast audit */
#page-charity .section-head h2,
#page-charity .donate-grid h2 { color: #082f21 !important; }
#page-charity .section-head > p,
#page-charity .donate-grid > div > p { color: #2c4538 !important; }
#page-charity .why-quote b,
#page-charity .org-item b { color: #0b3425 !important; }
#page-charity .why-quote p,
#page-charity .org-item p,
#page-charity .invite-box p { color: #30493c !important; }
#page-charity .org-item,
#page-charity .invite-box {
  border-color: rgba(156,112,37,.28) !important;
  background: rgba(255,251,244,.58) !important;
}
#page-charity .tagline-banner span { color: #fff8e9 !important; }
#page-charity .tagline-banner strong { color: #f0cf85 !important; }

@media (max-width: 700px) {
  #page-charity .trans-questions { grid-template-columns: 1fr !important; }
  #page-charity .charity-story-answer { padding-right: 0 !important; }
  #page-charity .support-card .s-ic { height: 210px !important; min-height: 210px !important; }
  #page-charity .support-hover { padding: 18px !important; }
  #page-charity .support-hover p,
  #page-charity .support-hover-copy { font-size: .72rem !important; }
}
@media (prefers-reduced-motion: reduce) {
  #page-charity .support-hover,
  #page-charity .support-toggle::after { transition: none !important; }
}

/* =========================================================
   MOBILE POLISH — compact editorial rhythm and clear actions
   ========================================================= */
@media (max-width: 700px) {
  .site-nav .nav-inner {
    min-height: 72px !important;
    padding: 5px 14px !important;
    gap: 9px !important;
  }
  .brand { width: 132px !important; height: 58px !important; flex-basis: 132px !important; }
  .brand .mockup-brand { width: 132px !important; height: 58px !important; }
  .nav-right { gap: 8px !important; }
  .lang-switch { gap: 5px !important; }
  .lang-switch button { min-width: 28px !important; padding-inline: 3px !important; }
  .lang-switch button .flag { width: 21px !important; height: 14px !important; }
  .nav-toggle { width: 46px !important; height: 46px !important; padding: 0 !important; }
  nav.links { top: 72px !important; padding: 10px 18px 18px !important; }

  .island-section { padding: 68px 0 !important; min-height: 0 !important; }
  .island-layout { display: grid !important; grid-template-columns: 1fr !important; gap: 34px !important; }
  .island-copy { max-width: none !important; }
  .island-copy h2 {
    max-width: 11ch !important;
    margin: 12px 0 20px !important;
    font-size: clamp(2.65rem, 12vw, 3.55rem) !important;
    line-height: .98 !important;
    letter-spacing: -.04em !important;
    overflow-wrap: normal !important;
  }
  .island-copy p { font-size: .98rem !important; line-height: 1.68 !important; }
  .island-editorial { width: 100% !important; min-height: 360px !important; aspect-ratio: 4 / 5 !important; }
  .island-beach-rail {
    left: 14px !important;
    top: 14px !important;
    bottom: 14px !important;
    width: min(280px,72%) !important;
    padding: 20px 18px !important;
  }

  .closing-cta { padding: 68px 0 40px !important; min-height: 0 !important; }
  .closing-cta h2 {
    font-size: clamp(2.45rem, 12vw, 3.35rem) !important;
    line-height: .98 !important;
    letter-spacing: -.04em !important;
    overflow-wrap: normal !important;
  }
  .closing-cta p { font-size: 1rem !important; line-height: 1.6 !important; margin-bottom: 24px !important; }
  .closing-cta .cta-row { display: grid !important; grid-template-columns: 1fr !important; gap: 10px !important; max-width: 360px !important; margin-inline: auto !important; }
  .closing-cta .btn { width: 100% !important; min-height: 50px !important; display: grid !important; place-items: center !important; }
  .footer-island-line { margin-top: 54px !important; padding-top: 18px !important; letter-spacing: .18em !important; line-height: 1.6 !important; }

  footer { padding: 34px 0 22px !important; }
  footer .wrap { display: grid !important; grid-template-columns: 1fr !important; gap: 24px !important; align-items: start !important; }
  footer .fbrand { font-size: 1.05rem !important; }
  footer .fbrand img { width: 34px !important; height: 34px !important; }
  footer small { display: block !important; font-size: .76rem !important; line-height: 1.6 !important; max-width: 42rem !important; }
  footer small + small { margin-top: 8px !important; }
  footer .flinks { display: grid !important; grid-template-columns: repeat(2,minmax(0,1fr)) !important; gap: 0 !important; border-top: 1px solid rgba(239,199,111,.18) !important; }
  footer .flinks a { min-height: 44px !important; display: flex !important; align-items: center !important; font-size: .8rem !important; border-bottom: 1px solid rgba(239,199,111,.12) !important; }
  .image-credits { width: calc(100% - 28px) !important; margin-top: 16px !important; font-size: .7rem !important; }
}

@media (max-width: 390px) {
  .brand { width: 116px !important; flex-basis: 116px !important; }
  .brand .mockup-brand { width: 116px !important; }
  .lang-switch button .flag { width: 19px !important; }
  .island-copy h2 { font-size: 2.55rem !important; }
  .island-editorial { min-height: 340px !important; }
  .island-beach-rail { width: calc(100% - 28px) !important; }
}

@media (max-height: 520px) and (orientation: landscape) {
  .site-nav .nav-inner { min-height: 64px !important; }
  nav.links { top: 64px !important; max-height: calc(100dvh - 64px) !important; }
  .hero-premium { min-height: 560px !important; }
  .closing-cta { min-height: 0 !important; }
}

/* Mobile usability, touch targets and resilient narrow-screen layout */
.skip-link {
  position: fixed;
  left: 16px;
  top: 12px;
  z-index: 10000;
  padding: 11px 16px;
  color: #fff8e9;
  background: #08271d;
  border: 1px solid #d9b66d;
  transform: translateY(-160%);
  transition: transform .2s ease;
}
.skip-link:focus { transform: translateY(0); }
.noscript-domain-list {
  grid-column: 1 / -1;
  padding: clamp(24px,4vw,48px);
  color: #173328;
  background: rgba(255,250,241,.82);
  border: 1px solid rgba(156,112,37,.28);
}
.noscript-domain-list h3 { margin-bottom: 10px; }
.noscript-domain-list ul {
  display: grid;
  grid-template-columns: repeat(auto-fit,minmax(170px,1fr));
  gap: 8px 20px;
  margin: 22px 0;
  padding-left: 20px;
}

@media (max-width: 700px) {
  html { scroll-padding-top: 86px; }
  body { overflow-x: clip; }
  .nav-toggle,
  .lang-switch button,
  .btn,
  .filter-pill,
  .faq-item summary,
  .support-toggle { min-height: 44px !important; }
  .nav-toggle { min-width: 44px !important; }
  input,
  select,
  textarea { font-size: 16px !important; }
  .manifest-copy h2,
  .section-head h2,
  .closing-cta h2,
  .about-hero h1 { overflow-wrap: anywhere; }
  .filter-bar {
    overflow-x: auto;
    flex-wrap: nowrap !important;
    padding-bottom: 8px;
    scrollbar-width: thin;
    -webkit-overflow-scrolling: touch;
  }
  .filter-pill { flex: 0 0 auto; }
  .domain-card .actions { gap: 10px !important; }
  .domain-card .actions .btn { padding-inline: 12px !important; }
}

@media (max-width: 420px) {
  .domain-card .actions { flex-direction: column !important; }
  .domain-card .actions .btn { width: 100% !important; }
  .manifest-art { width: 100% !important; height: auto !important; }
}

/* Readability: warm ivory copy below “Where is help needed?” */
#page-charity .ideas-panel .ideas-panel-grid > div:first-child > p {
  color: #f8eedc !important;
  font-weight: 450 !important;
  line-height: 1.72 !important;
}

/* =========================================================
   EDITORIAL MOTION SYSTEM
   Subtle depth, sunlight and tactile image interactions.
   ========================================================= */
:root {
  --fx-header-shift: 0px;
  --fx-local-shift: 0px;
  --fx-ambient-x: 0px;
  --fx-ambient-y: 0px;
  --fx-ease: cubic-bezier(.22,.72,.24,1);
}

.ambient-light {
  position: fixed;
  inset: -8vh -8vw;
  z-index: 90;
  pointer-events: none;
  opacity: 0;
  transform: translate3d(var(--fx-ambient-x),var(--fx-ambient-y),0) scale(1.035);
  background:
    radial-gradient(circle at 72% 8%,rgba(244,190,91,.17),transparent 25%),
    radial-gradient(circle at 18% 62%,rgba(40,172,161,.07),transparent 31%);
  mix-blend-mode: soft-light;
  transition: opacity .8s ease;
  will-change: transform;
}
.fx-ready .ambient-light { opacity: .7; }

.site-nav {
  isolation: isolate;
  overflow: clip;
  background-position: center center,center calc(47% + var(--fx-header-shift)) !important;
  background-size: auto,cover !important;
}
.site-nav::before {
  content: "";
  position: absolute;
  inset: -30% -8%;
  z-index: 0;
  pointer-events: none;
  background:
    radial-gradient(circle at 69% 18%,rgba(244,194,105,.23),transparent 22%),
    linear-gradient(105deg,transparent 40%,rgba(255,217,142,.055) 55%,transparent 69%);
  opacity: .72;
  transform: translate3d(calc(var(--fx-header-shift) * .32),calc(var(--fx-header-shift) * -.18),0);
}
.site-nav .nav-inner { position: relative !important; z-index: 2 !important; }
.nav-hornbill img {
  transform-origin: 47% 87%;
  animation: fx-hornbill-breathe 8.5s ease-in-out infinite;
}
@keyframes fx-hornbill-breathe {
  0%,100% { transform: rotate(-.35deg) translateY(0); }
  50% { transform: rotate(.45deg) translateY(-2px); }
}

.manifest-section::before {
  display: block !important;
  content: "";
  position: absolute;
  inset: 0 !important;
  z-index: 0 !important;
  height: auto !important;
  pointer-events: none;
  background:
    radial-gradient(circle at 78% 12%,rgba(224,171,73,.14),transparent 29%),
    linear-gradient(110deg,transparent 50%,rgba(255,255,255,.16) 62%,transparent 74%) !important;
  opacity: .75;
  transform: translate3d(0,calc(var(--fx-local-shift) * .3),0);
}
.manifest-section::after {
  background-position: center center,center calc(73% + var(--fx-local-shift)) !important;
}
.manifest-section > .wrap { position: relative; z-index: 1; }

.closing-cta {
  background-position: center top,center center,center calc(50% + var(--fx-local-shift)) !important;
}
.about-hero {
  background-position: center center,center center,center calc(50% + var(--fx-local-shift)) !important;
}
.ideas-panel {
  background-position: center center,center calc(50% + var(--fx-local-shift)) !important;
}

/* Soft light seams keep adjacent sections from reading as stacked boxes. */
#page-home > section:not(.manifest-section),
#page-about > section,
#page-charity > section,
#page-contact > section,
#page-catalog > section {
  position: relative;
}
#page-home > section:not(.manifest-section)::selection,
#page-about > section::selection,
#page-charity > section::selection { background: rgba(201,155,67,.28); }
.categories-premium::after,
.featured-section::after,
.giveback-section::after,
.process-section::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -1px;
  z-index: 3;
  height: clamp(28px,4vw,58px);
  pointer-events: none;
  background: linear-gradient(180deg,transparent,rgba(237,225,205,.12));
  opacity: .72;
}
.giveback-section::after {
  background: linear-gradient(180deg,transparent,rgba(4,28,19,.22));
}

/* Premium image response: warmer colour, restrained scale, no abrupt lift. */
.featured-domain::before,
.domain-card .domain-visual,
.impact-types figure img,
#page-charity .support-card .s-ic,
.cat-card::before {
  transition: transform .75s var(--fx-ease),filter .75s var(--fx-ease),opacity .5s ease !important;
}
.featured-domain,
.domain-card,
.impact-types article,
#page-charity .support-card,
.cat-card {
  transition: transform .55s var(--fx-ease),box-shadow .55s var(--fx-ease),border-color .4s ease !important;
}

@media (hover:hover) and (pointer:fine) {
  .featured-domain:hover::before { transform: scale(1.045) !important; filter: saturate(1.1) contrast(1.035) brightness(1.025) !important; }
  .domain-card:hover .domain-visual { transform: scale(1.025); filter: saturate(1.09) contrast(1.025) brightness(1.02) !important; }
  .impact-types article:hover figure img { transform: scale(1.045) !important; filter: saturate(1.08) contrast(1.025) brightness(1.025) !important; }
  #page-charity .support-card:hover .s-ic { transform: scale(1.025); filter: saturate(1.08) contrast(1.025) brightness(1.02) !important; }
  .cat-card:hover::before { transform: scale(1.035); filter: saturate(1.08) contrast(1.025) brightness(1.02) !important; }
}

@media (max-width: 767px), (pointer: coarse) {
  .ambient-light { opacity: .28 !important; will-change: auto; }
  .site-nav { background-position: center center,center 47% !important; }
  .site-nav::before { transform: none; opacity: .55; }
  .nav-hornbill img { animation-duration: 11s; }
}

/* Mobile navigation must escape the animated scenic header. */
@media (max-width: 940px) {
  .site-nav,
  .site-nav .nav-inner {
    overflow: visible !important;
  }
  .site-nav .nav-inner {
    position: relative !important;
  }
  .nav-toggle {
    position: relative !important;
    z-index: 1002 !important;
    pointer-events: auto !important;
    touch-action: manipulation;
    cursor: pointer;
  }
  nav.links {
    z-index: 1001 !important;
    max-height: calc(100dvh - 80px);
    overflow-y: auto;
    overscroll-behavior: contain;
    pointer-events: auto !important;
    box-shadow: 0 18px 34px rgba(0,0,0,.28);
  }
  nav.links button {
    min-height: 48px !important;
    touch-action: manipulation;
    cursor: pointer;
  }
}

@media (prefers-reduced-motion: reduce) {
  .ambient-light { display: none !important; }
  .site-nav,
  .manifest-section::after,
  .closing-cta,
  .about-hero,
  .ideas-panel { background-position: center !important; }
  .site-nav::before,
  .manifest-section::before { transform: none !important; }
  .nav-hornbill img { animation: none !important; }
  .featured-domain::before,
  .domain-card .domain-visual,
  .impact-types figure img,
  #page-charity .support-card .s-ic,
  .cat-card::before,
  .featured-domain,
  .domain-card,
  .impact-types article,
  #page-charity .support-card,
  .cat-card { transition: none !important; }
}