:root {
  --color-brand: #0f5848;
  --color-brand-dark: #073f34;
  --color-brand-soft: #e4eee8;
  --color-sage: #b9c9bf;
  --color-bg: #fbfaf6;
  --color-surface: #fffefa;
  --color-cream: #f1eee5;
  --color-text: #171b19;
  --color-text-muted: #5f6763;
  --color-border: #d7d9d3;
  --color-accent: #a56d4b;
  --font-display: "Iowan Old Style", "Palatino Linotype", Palatino, Georgia, serif;
  --font-body: Avenir, "Avenir Next", Aptos, "Segoe UI", Arial, sans-serif;
  --container-wide: 82rem;
  --container: 72rem;
  --reading: 43rem;
  --shadow-soft: 0 14px 38px rgba(7, 63, 52, .07);
}

body { background: var(--color-bg); letter-spacing: -.006em; }
h1, h2, h3, h4 { font-weight: 500; }
.wordmark { font-size: clamp(1.7rem, 2.3vw, 2.15rem); font-weight: 500; letter-spacing: .035em; text-transform: uppercase; }
.eyebrow, .card-label { color: var(--color-brand-dark); font-size: .72rem; letter-spacing: .12em; }
.site-header { background: rgba(251,250,246,.97); backdrop-filter: blur(16px); }
.utility { display: none; }
.header-main { min-height: 5.25rem; }
.primary-nav a { position: relative; font-size: .8rem; font-weight: 520; }
.primary-nav a[aria-current="page"]::after { position: absolute; right: 0; bottom: -.85rem; left: 0; height: 2px; background: var(--color-brand); content: ""; }
.icon-button { border-radius: 0; font-size: 1.35rem; }
.section { padding-block: clamp(3rem, 5vw, 5rem); }
.section + .section { border-top-color: #dedfd9; }
.section-head { margin-bottom: 1.75rem; }
.section-head h2 { margin-bottom: 0; font-size: clamp(1.9rem, 2.8vw, 2.75rem); }
.text-link { color: var(--color-brand-dark); font-size: .75rem; letter-spacing: .09em; text-transform: uppercase; }

/* Editorial image placeholders: intentionally abstract until approved photography arrives. */
.card-media,
.feature-image,
.contributor-hero .avatar,
.hero-scene {
  background-color: #e5e1d7;
  background-image:
    linear-gradient(90deg, transparent 0 58%, rgba(255,255,255,.58) 58% 60%, transparent 60%),
    linear-gradient(180deg, rgba(255,255,255,.18), rgba(48,72,61,.08)),
    radial-gradient(circle at 75% 72%, #809780 0 3%, transparent 3.3%),
    radial-gradient(ellipse at 76% 89%, #c7bba5 0 17%, transparent 17.5%),
    linear-gradient(120deg, var(--media-a, #e9e5dc), var(--media-b, #94a89a));
}
.card-media { aspect-ratio: 4 / 2.55; margin-bottom: .8rem; border-radius: 0; }
.card-media::after { font-size: .62rem; letter-spacing: .12em; }
.card h3 { margin-top: .2rem; font-size: clamp(1.28rem, 1.7vw, 1.72rem); line-height: 1.08; }
.card p { margin-bottom: .75rem; font-size: .86rem; line-height: 1.5; }
.card-meta { font-size: .7rem; }

/* Homepage composition */
.hero { padding: 0; border-bottom: 1px solid var(--color-border); background: var(--color-surface); }
.hero::after { display: none; }
.hero-inner { min-height: 34rem; grid-template-columns: minmax(22rem, .82fr) minmax(30rem, 1.18fr); align-items: stretch; gap: 0; }
.hero-copy-panel { display: flex; flex-direction: column; justify-content: center; padding: clamp(3rem, 6vw, 6rem) clamp(2rem, 5vw, 5rem) clamp(3rem, 6vw, 6rem) 0; }
.hero h1 { max-width: 11ch; margin-bottom: 1rem; color: var(--color-brand-dark); font-size: clamp(3.25rem, 5.6vw, 5.3rem); line-height: .95; }
.hero-copy { max-width: 29rem; font-size: 1.18rem; line-height: 1.5; }
.hero-search { margin-top: 1.25rem; padding: 0; border: 0; background: transparent; box-shadow: none; }
.hero-search h2 { display: none; }
.hero-search .search-form { max-width: 30rem; box-shadow: none; }
.hero-search .search-form .button {
  position: relative;
  width: 3.3rem;
  overflow: hidden;
  color: transparent;
}
.hero-search .search-form .button::before {
  position: absolute;
  top: 50%;
  left: 50%;
  width: .9rem;
  height: .9rem;
  border: 1.75px solid #fff;
  border-radius: 50%;
  content: "";
  transform: translate(-62%, -62%);
}
.hero-search .search-form .button::after {
  position: absolute;
  top: 59%;
  left: 57%;
  width: .48rem;
  height: 1.75px;
  background: #fff;
  content: "";
  transform: rotate(45deg);
  transform-origin: left center;
}
.hero-scene { position: relative; min-height: 34rem; overflow: hidden; }
.hero-scene::before { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(251,250,246,.18), transparent 20%), repeating-linear-gradient(90deg, transparent 0 24%, rgba(255,255,255,.65) 24% 25%); content: ""; }
.hero-scene::after { position: absolute; right: 8%; bottom: 9%; width: 48%; height: 26%; border-radius: 50% 50% 8% 8%; background: rgba(239,233,220,.82); box-shadow: -14rem 2rem 0 -3rem rgba(147,124,98,.5); content: ""; }
.home-trending { padding-block: 1.1rem; }
.home-trending .section-head { margin-bottom: 1rem; }
.home-trending .grid { gap: 0; border-top: 1px solid var(--color-border); border-bottom: 1px solid var(--color-border); }
.trend-card { min-height: 7rem; padding: 1.1rem 1.4rem; border-left: 1px solid var(--color-border); }
.trend-card:first-child { border-left: 0; }
.trend-card h3 { margin: .2rem 0; font-family: var(--font-body); font-size: .95rem; font-weight: 600; letter-spacing: 0; }
.trend-card p { margin: 0; font-size: .76rem; line-height: 1.45; }
.need-section { background: linear-gradient(90deg, #f1f2eb, #e7eee8); }
.need-section .section-head { max-width: 19rem; float: left; width: 22%; margin-right: 3%; }
.need-section .grid { grid-template-columns: repeat(4, 1fr); }
.need-card { min-height: 12.5rem; padding: 1rem 1.3rem; border-top: 0; border-left: 1px solid rgba(7,63,52,.22); background: transparent; }
.need-icon { width: 2.5rem; height: 2.5rem; margin-bottom: 1.1rem; border: 1px solid rgba(7,63,52,.3); border-radius: 50%; background: transparent; font-size: 1rem; }
.need-card h3 { font-family: var(--font-body); font-size: .92rem; font-weight: 650; letter-spacing: 0; }
.need-card p { margin: 0; font-size: .75rem; line-height: 1.45; }
#reviews .grid-4, #guides .grid-4, #living .grid-4 { grid-template-columns: repeat(3, 1fr); }
#reviews .card:nth-child(n+4), #guides .card:nth-child(n+4), #living .card:nth-child(n+4) { display: none; }
#malaysia { color: #f2f6f2; background: var(--color-brand-dark); }
#malaysia .eyebrow, #malaysia h2, #malaysia h3 a { color: #fff; }
#malaysia .section-head p, #malaysia .card p { color: #d2ddd6; }
#malaysia .card-media { border: 1px solid rgba(255,255,255,.3); }
#contributors .profile-card { padding-right: 1rem; border-right: 1px solid var(--color-border); }
#contributors .avatar { border: 1px solid var(--color-border); background: var(--color-cream); }
.brand-grid { border-inline: 0; }

/* Reviews page */
.page-hero { position: relative; overflow: hidden; padding-block: clamp(3.5rem, 7vw, 6.5rem); background: linear-gradient(90deg, #fbfaf6 0 57%, #ece9df 57%); }
.page-hero::after { position: absolute; right: 7%; bottom: -6rem; width: 29rem; height: 23rem; border-radius: 50% 50% 0 0; background: linear-gradient(135deg, transparent 0 20%, rgba(61,92,72,.22) 20% 22%, transparent 22%), radial-gradient(circle at 60% 40%, #839783 0 4%, transparent 4.5%), linear-gradient(135deg,#e8e2d5,#baad98); box-shadow: -14rem 8rem 0 -9rem #ad9f8b; content: ""; }
.page-hero > .container-wide { position: relative; z-index: 1; }
.page-hero h1 { max-width: 14ch; color: var(--color-brand-dark); font-size: clamp(3rem, 5.5vw, 5.2rem); }
.page-hero p { max-width: 36rem; }
.filter-row { position: relative; z-index: 2; margin: clamp(3rem, 8vw, 7rem) 0 -6.5rem; padding-top: 1rem; border-top: 1px solid var(--color-border); }
.filter { flex: 1; border: 0; border-bottom: 2px solid transparent; border-radius: 0; padding: .8rem .4rem; background: transparent; font-size: .76rem; }
.filter[aria-pressed="true"] { border-bottom-color: var(--color-brand); color: var(--color-brand-dark); background: transparent; }
main > .section .grid-3:has([data-category]) { grid-template-columns: repeat(2, 1fr); gap: 0; border-top: 1px solid var(--color-border); }
[data-category] { display: grid; min-width: 0; grid-template-columns: minmax(0, .88fr) minmax(0, 1.12fr); column-gap: 1.2rem; padding: 1.2rem; border-right: 1px solid var(--color-border); border-bottom: 1px solid var(--color-border); }
[data-category] .card-media { grid-row: 1 / span 5; width: 100%; min-width: 0; min-height: 15rem; margin: 0; aspect-ratio: auto; }
[data-category] > *:not(.card-media) { min-width: 0; overflow-wrap: anywhere; }
[data-category]:first-child { grid-column: 1 / -1; grid-template-columns: 1.25fr .75fr; padding: 0 0 1.3rem; border-right: 0; }
[data-category]:first-child .card-media { min-height: 27rem; }
[data-category]:first-child h3 { font-size: clamp(2rem, 3.2vw, 3.2rem); }

/* Long-form article */
.article-header { padding-top: 2.5rem; }
.article-header-inner { max-width: 72rem; padding-right: 17rem; }
.article-header h1 { max-width: 18ch; color: var(--color-brand-dark); font-size: clamp(3rem, 5vw, 5rem); }
.standfirst { font-family: var(--font-body); font-size: 1.08rem; }
.feature-image { min-height: clamp(22rem, 42vw, 38rem); border: 1px solid var(--color-border); }
.feature-image::after { position: absolute; left: 22%; bottom: 9%; width: 18%; height: 45%; border-radius: 1rem; background: linear-gradient(#f2f0e9 0 60%, #d2d0c8 60%); box-shadow: 0 10px 20px rgba(0,0,0,.12); content: ""; }
.article-layout { grid-template-columns: minmax(0, var(--reading)) 12.5rem; align-items: start; }
.article-body { font-size: .98rem; }
.article-body h2 { color: var(--color-brand-dark); font-size: clamp(1.55rem, 2vw, 2rem); }
.article-body h3 { color: var(--color-brand-dark); font-family: var(--font-display); font-weight: 600; }
.toc { padding: 1rem 0 1rem 1rem; border-top: 0; border-left: 2px solid var(--color-brand); }
.callout { border: 1px solid #cbd8d0; border-left: 0; background: linear-gradient(90deg,#edf3ef,#f7f8f4); }
.checklist { border: 1px solid var(--color-border); background: var(--color-surface); }
.author-box { border: 1px solid var(--color-border); padding: 1.25rem; }

/* Contributor template: imagery remains neutral until the real profile is supplied. */
.contributor-hero { grid-template-columns: minmax(20rem, .9fr) minmax(24rem, 1.1fr); max-width: none; gap: 4rem; }
.contributor-hero .avatar { width: 100%; border-radius: 0; font-size: 4rem; min-height: 28rem; }
.contributor-hero h1 { color: var(--color-brand-dark); font-size: clamp(4rem, 7vw, 7rem); }
.contributor-hero > div:last-child { padding-right: clamp(1rem, 8vw, 8rem); }
.topic-list li { border-radius: 0; border: 0; border-right: 1px solid var(--color-border); padding: .5rem 1rem; }

.site-footer { padding-top: 3rem; background: #063f34; }
.site-footer p { max-width: 24rem; color: #d4dfd8; font-size: .82rem; }
.site-footer h2 { color: #fff; }
.footer-grid { grid-template-columns: 1.4fr repeat(3, 1fr); }

@media (max-width: 1024px) {
  .hero-inner { grid-template-columns: 1fr 1fr; }
  .hero-copy-panel { padding-left: 1rem; }
  .need-section .section-head { float: none; width: auto; max-width: none; }
  .need-section .grid { grid-template-columns: repeat(2, 1fr); }
  .page-hero::after { opacity: .6; right: -8rem; }
  .article-header-inner { padding-right: 1rem; }
  [data-category]:first-child .card-media { min-height: 22rem; }
  main > .section .grid-3:has([data-category]) { grid-template-columns: 1fr; }
  [data-category], [data-category]:first-child {
    grid-column: auto;
    grid-template-columns: minmax(16rem, .95fr) minmax(0, 1.05fr);
    border-right: 0;
  }
}

@media (max-width: 760px) {
  .header-main { min-height: 4.4rem; }
  .hero-inner { display: flex; min-height: 0; flex-direction: column; width: 100%; }
  .hero-copy-panel { padding: 3.2rem 1rem 2.5rem; }
  .hero h1 { font-size: clamp(3.15rem, 14vw, 4.2rem); }
  .hero-scene { min-height: 19rem; order: 2; }
  .home-trending .grid, #reviews .grid-4, #guides .grid-4, #living .grid-4 { grid-template-columns: 1fr; }
  .trend-card { border-top: 1px solid var(--color-border); border-left: 0; }
  .need-section .grid { grid-template-columns: 1fr 1fr; }
  .need-card { min-height: 11rem; }
  #reviews .card:nth-child(n+3), #guides .card:nth-child(n+3), #living .card:nth-child(n+3) { display: none; }
  .page-hero { background: var(--color-bg); }
  .page-hero::after { display: none; }
  .filter-row { overflow-x: auto; margin-bottom: -6rem; flex-wrap: nowrap; }
  .filter { min-width: 7rem; }
  main > .section .grid-3:has([data-category]) { grid-template-columns: 1fr; }
  [data-category], [data-category]:first-child { grid-column: auto; grid-template-columns: 1fr; padding: 0 0 1.5rem; border-right: 0; }
  [data-category] .card-media, [data-category]:first-child .card-media { grid-row: auto; min-height: 16rem; margin-bottom: 1rem; }
  .article-layout { display: flex; flex-direction: column; padding-inline: 0; }
  .toc { width: 100%; order: -1; }
  .contributor-hero { display: block; }
  .contributor-hero .avatar { width: 100%; min-height: 20rem; margin-bottom: 2rem; }
  .contributor-hero > div:last-child { padding-right: 0; }
  .contributor-hero h1 { font-size: clamp(3.5rem, 17vw, 5.5rem); }
}

@media (max-width: 520px) {
  .need-section .grid { grid-template-columns: 1fr; }
  .need-card { border-top: 1px solid rgba(7,63,52,.2); border-left: 0; }
  .footer-grid { grid-template-columns: 1fr; }
}