:root {
  --forest: #17382a;
  --forest-deep: #0d241b;
  --leaf: #365c46;
  --cream: #f2eddf;
  --paper: #faf8f2;
  --ink: #1c251f;
  --muted: #6f786f;
  --brass: #ba9258;
  --line: rgba(28, 37, 31, 0.15);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--paper); color: var(--ink); font-family: Arial, Helvetica, sans-serif; }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; }
.shell { width: min(1240px, calc(100% - 64px)); margin-inline: auto; }
.section { padding-block: 120px; }
section[id] { scroll-margin-top: 96px; }

.site-header { position: fixed; inset: 0 0 auto; z-index: 30; height: 96px; padding: 0 42px; display: flex; align-items: center; justify-content: space-between; color: white; background: transparent; border-bottom: 1px solid rgba(255,255,255,.1); box-shadow: none; text-shadow: 0 1px 8px rgba(3,16,10,.9); transition: background-color .38s ease, border-color .38s ease, box-shadow .38s ease, backdrop-filter .38s ease; }
.site-header.is-scrolled { background: rgba(13,36,27,.86); border-bottom-color: rgba(255,255,255,.18); box-shadow: 0 8px 28px rgba(5,20,14,.18); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); }
.brand { display: inline-flex; align-items: center; min-width: 205px; }
.brand-copy { display: flex; flex-direction: column; line-height: 1; }
.brand-copy strong { font: 20px/1 Georgia, serif; letter-spacing: .2em; }
.brand-copy small { margin-top: 8px; font-size: 9px; letter-spacing: .26em; }
.desktop-nav { display: flex; gap: 27px; margin-left: 28px; }
.desktop-nav a { position: relative; font-size: 11px; letter-spacing: .13em; text-transform: uppercase; }
.desktop-nav a::after { content: ""; position: absolute; left: 0; right: 100%; bottom: -8px; height: 1px; background: white; transition: right .25s; }
.desktop-nav a:hover::after { right: 0; }
.header-actions { display: flex; align-items: center; gap: 14px; }
.language-switcher { display: inline-flex; align-items: center; padding: 3px; border: 1px solid rgba(255,255,255,.42); background: rgba(7,22,15,.2); }
.language-switcher button { min-width: 31px; height: 28px; border: 0; background: transparent; color: rgba(255,255,255,.68); font-size: 8px; font-weight: 700; letter-spacing: .1em; cursor: pointer; transition: .2s; }
.language-switcher button:hover { color: white; }
.language-switcher button.active { background: var(--cream); color: var(--forest-deep); }
.header-cta { display: flex; gap: 17px; align-items: center; padding: 13px 15px; border: 1px solid rgba(255,255,255,.65); font-size: 9px; letter-spacing: .13em; text-transform: uppercase; white-space: nowrap; transition: .2s; }
.header-cta:hover { background: white; color: var(--forest-deep); }
.mobile-menu { display: none; }

.hero { position: relative; min-height: 780px; height: 100vh; max-height: 980px; overflow: hidden; background: var(--forest-deep); color: white; }
.hero-panels { position: absolute; inset: 0; display: grid; grid-template-columns: repeat(3, 1fr); }
.hero-panel { position: relative; background-size: cover; background-repeat: no-repeat; border-right: 1px solid rgba(255,255,255,.2); transition: filter .35s, transform .65s; filter: saturate(.82) contrast(1.05); }
.hero-panel:hover { filter: saturate(1.07) contrast(1.02); transform: scale(1.012); z-index: 2; }
.hero-panel span { position: absolute; bottom: 36px; left: 36px; font-size: 9px; letter-spacing: .28em; text-transform: uppercase; opacity: .72; }
.sector-agri { background-image: url('/assets/vanilla-plantation-hd.jpg'); background-size: cover; background-position: 24% center; }
.sector-furniture { background-image: url('/assets/luxury-teak-interior-hd.jpg'); background-size: cover; background-position: center; }
.sector-fashion { background-image: url('/assets/indigo-textile-artisan-hd.jpg'); background-size: cover; background-position: 51% center; }
.hero-shade { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(7,22,15,.82), rgba(7,22,15,.47) 48%, rgba(7,22,15,.54)), linear-gradient(0deg, rgba(5,16,11,.65), transparent 45%); }
.hero-content { position: relative; z-index: 3; height: 100%; display: flex; flex-direction: column; justify-content: center; padding-top: 70px; }
.eyebrow { margin: 0 0 23px; color: var(--leaf); font-size: 10px; font-weight: 700; letter-spacing: .25em; text-transform: uppercase; }
.eyebrow.light { color: #d9c6a1; }
.hero h1, h2 { margin: 0; font-family: Georgia, 'Times New Roman', serif; font-weight: 400; letter-spacing: -.04em; }
.hero h1 { max-width: 1050px; font-size: clamp(50px, 6vw, 92px); line-height: .94; text-shadow: 0 4px 32px rgba(0,0,0,.23); text-wrap: balance; }
.hero h1 em, h2 em { color: var(--brass); font-weight: 400; }
.hero-lead { max-width: 680px; margin: 25px 0 0; font: 18px/1.5 Georgia, serif; color: rgba(255,255,255,.84); }
.hero-actions { display: flex; align-items: center; gap: 34px; margin-top: 39px; }
.button { display: inline-flex; align-items: center; justify-content: space-between; gap: 42px; min-height: 54px; padding: 0 20px; border: 1px solid transparent; font-size: 10px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; cursor: pointer; transition: .2s; }
.button span { font-size: 17px; font-weight: 400; }
.button-light { background: var(--cream); color: var(--forest-deep); }
.button-light:hover { background: white; transform: translateY(-2px); }
.button-dark { background: var(--forest); color: white; }
.button-dark:hover { background: var(--forest-deep); }
.text-link { display: inline-flex; align-items: center; gap: 26px; padding-bottom: 7px; border-bottom: 1px solid currentColor; font-size: 10px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; }
.light-link { color: white; }
.hero-foot { position: absolute; z-index: 4; left: 0; width: 100%; max-width: none; bottom: 22px; display: flex; flex-direction: column; align-items: center; justify-content: center; color: rgba(255,255,255,.72); font-size: 9px; letter-spacing: .18em; text-transform: uppercase; }
.hero-foot p { margin: 0; }
.hero-foot > p:first-child { position: static; text-align: center; }
.scroll-button { position: relative; width: 32px; height: 32px; margin-top: 10px; border: 1px solid rgba(255,255,255,.64); border-radius: 50%; transition: border-color .25s, background-color .25s, transform .25s; }
.scroll-button::before { content: ""; position: absolute; left: 50%; top: 46%; width: 7px; height: 7px; border-right: 1px solid white; border-bottom: 1px solid white; transform: translate(-50%,-50%) rotate(45deg); }
.scroll-button:hover { border-color: white; background: rgba(255,255,255,.12); transform: translateY(2px); }
.hero-note { position: absolute; right: max(32px, calc((100vw - 1240px) / 2)); bottom: 0; margin: 0 !important; text-align: right; line-height: 1.7; }

.intro { display: grid; grid-template-columns: 1fr 1fr; gap: 110px; align-items: end; }
h2 { font-size: clamp(46px, 5vw, 75px); line-height: .99; }
.intro-copy { padding-left: 40px; border-left: 1px solid var(--line); }
.intro-copy p { max-width: 530px; margin: 0; color: var(--muted); font-size: 14px; line-height: 1.8; }
.story-heading > p, .intro-copy p { white-space: pre-line; }
.lead-copy { color: var(--ink) !important; font: 22px/1.5 Georgia, serif !important; }
.intro-copy p + p { margin-top: 25px; }

.gateway-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; padding-bottom: 120px; }
.gateway-card { position: relative; min-height: 570px; overflow: hidden; background-repeat: no-repeat; transition: transform .35s; }
.gateway-card.sector-agri { background-image: url('/assets/cured-vanilla-beans-hd.jpg'); background-position: center; }
.gateway-card.sector-furniture { background-image: url('/assets/luxury-teak-interior-hd.jpg'); background-position: center; }
.gateway-card.sector-fashion { background-image: url('/assets/natural-linen-apparel-hd.jpg'); background-position: 68% center; }
.gateway-card:hover { transform: translateY(-8px); }
.gateway-card::before { content: ""; position: absolute; inset: 0; background: inherit; transition: transform .7s; }
.gateway-card:hover::before { transform: scale(1.055); }
.card-overlay { position: absolute; inset: 0; background: linear-gradient(0deg, rgba(6,22,14,.94), rgba(6,22,14,.04) 70%); }
.card-content { position: relative; z-index: 2; height: 100%; min-height: 570px; padding: 27px 28px 31px; display: flex; flex-direction: column; justify-content: space-between; color: white; }
.card-number { margin: 0; font-size: 9px; letter-spacing: .22em; text-transform: uppercase; opacity: .75; }
.card-tagline { margin: 0 0 9px; color: #d9c6a1; font: italic 17px/1.2 Georgia, serif; text-transform: capitalize; }
.gateway-card h3 { max-width: 335px; margin: 0; font: 30px/1.1 Georgia, serif; }
.gateway-card .card-category { margin: 17px 0 7px; color: rgba(255,255,255,.9); font-size: 12px; font-weight: 700; line-height: 1.5; }
.gateway-card .card-audience { min-height: 66px; margin: 0 0 21px; color: rgba(255,255,255,.72); font-size: 12px; line-height: 1.65; }
.gateway-card a { display: flex; justify-content: space-between; padding-top: 16px; border-top: 1px solid rgba(255,255,255,.35); font-size: 9px; font-weight: 700; letter-spacing: .15em; text-transform: uppercase; }

.story { display: grid; grid-template-columns: 1.05fr .95fr; background: var(--cream); }
.story-visual { position: relative; min-height: 780px; background-repeat: no-repeat; }
.story-stamp { position: absolute; right: -76px; top: 76px; width: 152px; height: 152px; display: flex; flex-direction: column; align-items: center; justify-content: center; background: var(--forest); color: white; border-radius: 50%; text-align: center; }
.story-stamp::before { content: ""; position: absolute; inset: 8px; border: 1px solid rgba(255,255,255,.4); border-radius: 50%; }
.story-stamp span, .story-stamp small { position: relative; font-size: 8px; letter-spacing: .14em; text-transform: uppercase; }
.story-stamp strong { position: relative; margin: 6px 0; font: italic 22px/1 Georgia, serif; color: #d9c6a1; }
.story-copy { align-self: center; padding: 80px 8vw 80px 10vw; }
.story-copy h2 { font-size: clamp(48px, 5vw, 72px); }
.story-copy > p:not(.eyebrow) { max-width: 590px; margin: 28px 0 0; color: var(--muted); font-size: 14px; line-height: 1.8; }
.vision-mission { display: grid; grid-template-columns: 1fr 1fr; gap: 34px; margin-top: 48px; padding-top: 28px; border-top: 1px solid var(--line); }
.vision-mission span, .quality-anchor span, .office-list span { font-size: 9px; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; color: var(--leaf); }
.vision-mission p { margin: 11px 0 0; font: 16px/1.5 Georgia, serif; }

.values .section-heading { display: flex; align-items: flex-end; justify-content: space-between; margin-bottom: 58px; }
.value-grid { display: grid; grid-template-columns: repeat(6, 1fr); grid-template-rows: 245px 245px; gap: 14px; }
.value-card { position: relative; overflow: hidden; padding: 25px; display: flex; flex-direction: column; justify-content: space-between; background-size: cover; background-repeat: no-repeat; color: white; }
.value-card::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(8,29,19,.91), rgba(8,29,19,.14)); }
.value-card > * { position: relative; z-index: 2; }
.value-card > span { font-size: 9px; letter-spacing: .15em; }
.value-card h3 { margin: 0; font: 23px/1.1 Georgia, serif; }
.value-card p { margin: 10px 0 0; color: rgba(255,255,255,.72); font-size: 11px; line-height: 1.55; }
.value-1 { grid-column: span 2; background-image: url('/assets/cured-vanilla-beans-hd.jpg'); background-position: center; }
.value-2 { grid-column: span 2; background-image: url('/assets/vanilla-plantation-hd.jpg'); background-position: 26% center; }
.value-3 { grid-column: span 2; background-image: url('/assets/teak-craftsman-hd.jpg'); background-position: 54% center; }
.value-4 { grid-column: span 3; background-image: url('/assets/luxury-teak-interior-hd.jpg'); background-position: center; }
.value-5 { grid-column: span 3; background-image: url('/assets/indigo-textile-artisan-hd.jpg'); background-position: 52% center; }

.capabilities { background: var(--forest-deep); color: white; }
.capability-heading { display: grid; grid-template-columns: 1fr .8fr; gap: 100px; align-items: end; margin-bottom: 80px; }
.capability-heading > p { max-width: 480px; margin: 0 0 7px; color: rgba(255,255,255,.65); font-size: 14px; line-height: 1.8; }
.capability-table { border-top: 1px solid rgba(255,255,255,.22); }
.table-head, .capability-row { display: grid; grid-template-columns: 1.05fr 1fr 1fr; gap: 50px; }
.table-head { padding: 20px 0; color: rgba(255,255,255,.4); font-size: 8px; letter-spacing: .2em; text-transform: uppercase; }
.capability-row { align-items: center; padding: 29px 0; border-top: 1px solid rgba(255,255,255,.13); }
.capability-row > div { display: grid; grid-template-columns: 40px 1fr; gap: 20px; align-items: start; }
.capability-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.capability-card { min-height: 300px; padding: 30px; border: 1px solid rgba(255,255,255,.18); background: rgba(255,255,255,.035); }
.capability-card > span { color: var(--gold); font-size: 10px; font-weight: 700; letter-spacing: .18em; }
.capability-card h3 { margin: 38px 0 32px; font: 25px/1.15 Georgia, serif; }
.capability-card > div { display: grid; gap: 18px; }
.capability-card p { margin: 0; color: rgba(255,255,255,.7); font-size: 12px; line-height: 1.65; }
.capability-card strong { display: block; margin-bottom: 6px; color: var(--gold); font-size: 9px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; }
.capability-row span { color: var(--brass); font-size: 10px; letter-spacing: .14em; }
.capability-row h3 { margin: 0; font: 21px/1.2 Georgia, serif; }
.capability-row p { margin: 0; color: rgba(255,255,255,.63); font-size: 12px; line-height: 1.65; }

.future-cta { position: relative; min-height: 730px; color: white; overflow: hidden; }
.future-image { position: absolute; inset: 0; background-repeat: no-repeat; background-position: center; background-size: cover; transform: scale(1.05); filter: saturate(.65); }
.future-overlay { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(11,35,24,.91) 0%, rgba(11,35,24,.68) 55%, rgba(11,35,24,.32)); }
.future-content { position: relative; z-index: 2; padding-top: 120px; }
.future-content h2 { font-size: clamp(58px, 7vw, 94px); }
.cares { max-width: 760px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 30px; margin: 52px 0 42px; }
.cares div { padding-top: 15px; border-top: 1px solid rgba(255,255,255,.33); }
.cares strong { display: block; font: italic 20px/1 Georgia, serif; color: #d9c6a1; }
.cares span { display: block; margin-top: 9px; color: rgba(255,255,255,.66); font-size: 10px; line-height: 1.55; }

.split-heading { display: grid; grid-template-columns: 1fr .65fr; gap: 110px; align-items: end; margin-bottom: 70px; }
.split-heading > p { margin: 0 0 7px; color: var(--muted); font-size: 14px; line-height: 1.8; }
.hub-list { border-top: 1px solid var(--line); }
.hub-row { display: grid; grid-template-columns: 1.03fr .97fr; gap: 75px; padding: 65px 0; border-bottom: 1px solid var(--line); }
.hub-image { position: relative; min-height: 430px; background-repeat: no-repeat; background-size: cover; }
.hub-image.sector-agri { background-position: 28% center; }
.hub-image.sector-furniture { background-position: center; }
.hub-image.sector-fashion { background-position: 52% center; }
.hub-image span { position: absolute; top: 20px; left: 20px; display: grid; place-items: center; width: 52px; height: 52px; background: var(--paper); font: italic 20px/1 Georgia, serif; }
.hub-copy { align-self: center; }
.hub-copy h3 { max-width: 500px; margin: 0; font: 39px/1.09 Georgia, serif; }
.hub-copy > p:not(.card-tagline) { max-width: 520px; margin: 22px 0; color: var(--muted); font-size: 14px; line-height: 1.8; }
.quality-anchor { margin: 28px 0 28px; padding: 20px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.quality-anchor p { margin: 9px 0 0; font: 15px/1.55 Georgia, serif; }

.compliance { background: #1c2b23; color: white; }
.compliance-heading { display: grid; grid-template-columns: 1fr 1fr; column-gap: 80px; align-items: end; }
.compliance-heading .eyebrow { grid-column: 1 / -1; }
.compliance-heading > p:last-child { max-width: 470px; margin: 0 0 7px; color: rgba(255,255,255,.62); line-height: 1.8; }
.compliance-grid { display: grid; grid-template-columns: repeat(3, 1fr); margin-top: 70px; border-top: 1px solid rgba(255,255,255,.2); border-bottom: 1px solid rgba(255,255,255,.2); }
.compliance-grid article { padding: 28px 32px 34px 0; min-height: 340px; border-right: 1px solid rgba(255,255,255,.15); }
.compliance-grid article + article { padding-left: 32px; }
.compliance-grid article:last-child { border-right: 0; }
.compliance-grid article > span { color: var(--brass); font: italic 22px/1 Georgia, serif; }
.compliance-grid .status { margin: 55px 0 9px; color: #d9c6a1; font-size: 8px; letter-spacing: .18em; text-transform: uppercase; }
.compliance-grid h3 { margin: 0; font: 28px/1.15 Georgia, serif; }
.compliance-grid article > p:not(.status) { min-height: 67px; color: rgba(255,255,255,.61); font-size: 12px; line-height: 1.65; }
.compliance-grid a { display: inline-block; margin-top: 17px; padding-bottom: 6px; border-bottom: 1px solid rgba(255,255,255,.5); font-size: 9px; letter-spacing: .14em; text-transform: uppercase; }

.contact { display: grid; grid-template-columns: .82fr 1.18fr; gap: 120px; }
.contact-intro { position: sticky; top: 40px; align-self: start; }
.contact-intro h2 { font-size: clamp(58px, 6vw, 85px); }
.contact-intro > p:not(.eyebrow) { max-width: 480px; margin: 29px 0 0; }
.contact-actions { align-self: start; }
.office-list { margin-top: 60px; border-top: 1px solid var(--line); }
.office-list div { padding: 17px 0; border-bottom: 1px solid var(--line); }
.office-list p { margin: 7px 0 0; font: 16px/1.4 Georgia, serif; }
.enquiry-form { padding: 42px; background: var(--cream); }
.enquiry-form label:not(.check-field) { display: block; margin-bottom: 25px; }
.enquiry-form label > span { display: block; margin-bottom: 9px; color: var(--leaf); font-size: 9px; font-weight: 700; letter-spacing: .15em; text-transform: uppercase; }
.enquiry-form input:not([type="checkbox"]), .enquiry-form select, .enquiry-form textarea { width: 100%; border: 0; border-bottom: 1px solid rgba(28,37,31,.35); border-radius: 0; padding: 10px 0 13px; background: transparent; color: var(--ink); outline: none; }
.enquiry-form input:focus, .enquiry-form select:focus, .enquiry-form textarea:focus { border-bottom-color: var(--forest); }
.enquiry-form input::placeholder, .enquiry-form textarea::placeholder { color: #8a8d87; }
.form-pair { display: grid; grid-template-columns: 1fr 1fr; gap: 26px; }
.check-field { display: grid; grid-template-columns: 17px 1fr; gap: 12px; align-items: start; margin: 24px 0; }
.check-field input { margin: 0; width: 16px; height: 16px; accent-color: var(--forest); }
.check-field span { margin: 0 !important; color: var(--muted) !important; font-size: 10px !important; line-height: 1.5; letter-spacing: 0 !important; text-transform: none !important; }
.enquiry-form .button { width: 100%; }
.privacy-note { text-align: center; color: var(--muted); font-size: 9px; }

@media (max-width: 1000px) {
  .shell { width: min(100% - 40px, 900px); }
  .site-header { padding: 0 24px; }
  .desktop-nav, .header-cta { display: none; }
  .header-actions { margin-left: auto; }
  .mobile-menu { display: block; position: relative; margin-left: 12px; }
  .mobile-menu summary { list-style: none; width: 38px; height: 38px; display: grid; place-content: center; gap: 6px; cursor: pointer; border: 1px solid rgba(255,255,255,.4); }
  .mobile-menu summary::-webkit-details-marker { display: none; }
  .mobile-menu summary span { width: 16px; height: 1px; background: white; }
  .mobile-menu nav { position: absolute; top: 46px; right: 0; width: 240px; display: flex; flex-direction: column; padding: 18px; background: var(--forest-deep); box-shadow: 0 14px 40px rgba(0,0,0,.28); }
  .mobile-menu nav a { padding: 12px; border-bottom: 1px solid rgba(255,255,255,.12); font-size: 10px; text-transform: uppercase; letter-spacing: .13em; }
  .hero { height: 850px; max-height: none; }
  .hero-panels { grid-template-columns: 1fr 1fr; }
  .hero-panel:last-child { display: none; }
  .gateway-grid { grid-template-columns: 1fr 1fr; }
  .gateway-card:last-child { grid-column: 1 / -1; min-height: 500px; }
  .story { grid-template-columns: 1fr; }
  .story-visual { min-height: 560px; }
  .story-stamp { right: 35px; top: auto; bottom: -76px; }
  .story-copy { padding: 120px 7vw 80px; }
  .value-grid { grid-template-columns: repeat(2, 1fr); grid-template-rows: repeat(3, 250px); }
  .value-card { grid-column: span 1; }
  .value-5 { grid-column: 1 / -1; }
  .contact { grid-template-columns: 1fr; gap: 60px; }
  .contact-intro { position: static; }
}

@media (max-width: 720px) {
  .shell { width: calc(100% - 32px); }
  .section { padding-block: 78px; }
  section[id] { scroll-margin-top: 78px; }
  .site-header { height: 78px; padding-inline: 16px; }
  .brand { min-width: 0; }
  .brand-copy strong { font-size: 15px; }
  .brand-copy small { margin-top: 6px; font-size: 7px; letter-spacing: .2em; }
  .language-switcher button { min-width: 28px; height: 26px; }
  .mobile-menu { margin-left: 8px; }
  .hero { min-height: 760px; height: 100svh; }
  .hero-panels { display: block; }
  .hero-panel { height: 100%; border: 0; }
  .hero-panel:not(:first-child) { display: none; }
  .hero h1 { font-size: clamp(48px, 14vw, 70px); }
  .hero-lead { font-size: 17px; }
  .hero-actions { align-items: stretch; flex-direction: column; gap: 23px; }
  .button { width: 100%; }
  .hero-foot .hero-note { display: none; }
  .intro, .capability-heading, .split-heading, .compliance-heading { grid-template-columns: 1fr; gap: 35px; }
  .intro-copy { padding: 25px 0 0; border-left: 0; border-top: 1px solid var(--line); }
  .gateway-grid { grid-template-columns: 1fr; padding-bottom: 78px; }
  .gateway-card:last-child { grid-column: auto; }
  .gateway-card, .card-content { min-height: 500px; }
  .story-visual { min-height: 480px; }
  .story-copy { padding: 110px 22px 70px; }
  .vision-mission { grid-template-columns: 1fr; }
  .value-grid { display: block; }
  .value-card { min-height: 245px; margin-bottom: 12px; }
  .table-head { display: none; }
  .capability-row { grid-template-columns: 1fr; gap: 17px; }
  .capability-row p { padding-left: 60px; }
  .capability-grid { grid-template-columns: 1fr; }
  .capability-card { min-height: 0; }
  .future-cta { min-height: 780px; }
  .cares { grid-template-columns: 1fr; gap: 16px; }
  .hub-row { grid-template-columns: 1fr; gap: 30px; }
  .hub-image { min-height: 340px; }
  .compliance-grid { grid-template-columns: 1fr; }
  .compliance-grid article, .compliance-grid article + article { padding: 28px 0; border-right: 0; border-bottom: 1px solid rgba(255,255,255,.15); }
  .compliance-grid article:last-child { border-bottom: 0; }
  .compliance-grid article > p:not(.status) { min-height: 0; }
  .contact { gap: 40px; }
  .enquiry-form { padding: 28px 20px; }
  .form-pair { grid-template-columns: 1fr; gap: 0; }
}

/* Hero readability pass: separate the masthead, context, message and action. */
.hero-content { justify-content: flex-start; padding-top: 145px; }
.hero-logo { top: 44px; }
.hero-context { margin-top: 10px; }
.hero-tagline { margin: 0 0 9px; color: rgba(255,255,255,.78); font-size: 10px; font-weight: 700; letter-spacing: .28em; text-transform: uppercase; }
.hero-context .eyebrow { margin: 0; }
.hero h1 { margin-top: 27px; }
.hero-context { transform: translateY(-28px); }
.hero-lower { width: min(100%, 720px); margin-top: 30px; transform: translateY(8px); }
.hero-lower .hero-support, .hero-lower .hero-cepa { max-width: 100%; }
.hero-lower .hero-primary { margin-top: 24px; }

@media (max-width: 720px) {
  .hero-content { padding-top: 126px; }
  .hero-logo { top: 34px; }
  .hero-tagline { font-size: 8px; letter-spacing: .22em; }
  .hero h1 { margin-top: 22px; }
  .hero-lead { margin-top: 22px; font-size: 16px; }
  .hero-cepa { max-width: 330px; font-size: 9px; }
  .hero-context { transform: translateY(-18px); }
  .hero-lower { margin-top: 24px; transform: translateY(6px); }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before { transition: none !important; }
}

/* Redesign: an uninterrupted first impression, followed by a story-led journey. */
.site-header {
  opacity: 0;
  transform: translateY(-18px);
  pointer-events: none;
  border-bottom-color: transparent;
  transition: opacity .32s ease, transform .32s ease, background-color .38s ease, border-color .38s ease, box-shadow .38s ease, backdrop-filter .38s ease;
}
.site-header.is-scrolled {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}

.hero-film { position: absolute; inset: -4%; overflow: hidden; background: var(--forest-deep); }
.hero-film-video { width: 100%; height: 100%; object-fit: cover; object-position: center; filter: saturate(.78) contrast(1.04); }
.hero-frame { position: absolute; inset: 0; background-repeat: no-repeat; background-size: cover; filter: saturate(.72) contrast(1.08); transform: scale(1.06); animation: heroDrift 18s ease-in-out infinite alternate; }
.frame-botanicals { background-image: url('/assets/vanilla-plantation-hd.jpg'); background-position: 20% center; clip-path: polygon(0 0, 55% 0, 42% 100%, 0 100%); }
.frame-craft { background-image: url('/assets/luxury-teak-interior-hd.jpg'); background-position: center; clip-path: polygon(43% 0, 100% 0, 100% 68%, 58% 100%, 36% 100%); animation-delay: -7s; }
.frame-textiles { background-image: url('/assets/indigo-textile-artisan-hd.jpg'); background-position: 54% center; opacity: .64; clip-path: polygon(71% 0, 100% 0, 100% 100%, 53% 100%); animation-delay: -13s; }
.hero-shade { background: linear-gradient(90deg, rgba(7,22,15,.85) 0%, rgba(7,22,15,.49) 51%, rgba(7,22,15,.68)), linear-gradient(0deg, rgba(5,16,11,.76), transparent 48%); }
@keyframes heroDrift { from { transform: scale(1.06) translate3d(-.5%, 0, 0); } to { transform: scale(1.14) translate3d(1.3%, -1%, 0); } }

.story-reframe { background: var(--cream); color: white; }
.story-heading { display: grid; grid-template-columns: 1.18fr .82fr; column-gap: 10%; align-items: center; margin-bottom: 48px; color: var(--ink); }
.story-heading .eyebrow { grid-column: 1 / -1; }
.story-heading > p:last-child { width: 100%; max-width: none; margin: 0; color: var(--muted); font-size: 14px; line-height: 1.8; column-count: 1; }
.story-cards { display: grid; grid-template-columns: repeat(3, 1fr); min-height: 490px; }
.story-card { position: relative; isolation: isolate; min-height: 490px; padding: 31px; display: flex; flex-direction: column; justify-content: space-between; overflow: hidden; background-size: cover; background-position: center; }
.story-card::before { content: ''; position: absolute; z-index: 0; inset: 0; background: linear-gradient(180deg, rgba(8,28,19,.28), rgba(8,28,19,.93)); transition: background-color .35s ease; }
.story-card:hover::before { background-color: rgba(8,28,19,.14); }
.story-card > * { position: relative; z-index: 1; }
.who-we-are { background-image: url('/assets/vanilla-plantation-hd.jpg'); }
.what-we-have { background-image: url('/assets/teak-craftsman-hd.jpg'); background-position: 55% center; }
.what-we-do { background-image: url('/assets/indigo-textile-artisan-hd.jpg'); background-position: 54% center; }
.story-number { margin: 0 0 74px; color: #d9c6a1; font-size: 9px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; }
.story-card h3 { margin: 0; max-width: 330px; font: 34px/1.05 Georgia, serif; letter-spacing: -.03em; }
.story-card h3 em { color: #d9c6a1; font-weight: 400; }
.story-card > p:not(.story-number) { max-width: 330px; margin: auto 0 28px; color: rgba(255,255,255,.78); font-size: 13px; line-height: 1.75; }
.story-card .text-link { align-self: flex-start; gap: 16px; font-size: 8px; }
.story-principles { display: grid; grid-template-columns: 1fr 1fr; gap: 70px; padding: 35px 4%; color: var(--ink); background: var(--paper); }
.story-principles div { display: grid; grid-template-columns: 92px 1fr; gap: 24px; align-items: start; }
.story-principles span { padding-top: 4px; color: var(--leaf); font-size: 9px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; }
.story-principles p { margin: 0; font: 17px/1.5 Georgia, serif; }

.enquiry-form .privacy-note { margin: 18px 0 0; line-height: 1.55; }
.form-status { margin: 18px 0 0; padding: 13px 15px; background: rgba(54,92,70,.12); color: var(--forest); font-size: 11px; line-height: 1.55; }

@media (max-width: 1000px) {
  .story-heading { grid-template-columns: 1fr; gap: 28px; }
  .story-heading > p:last-child { column-count: 1; }
  .story-cards { min-height: 0; }
  .story-card { min-height: 460px; }
  .story-principles { gap: 32px; padding-inline: 5%; }
}

@media (max-width: 720px) {
  .hero-film { inset: -2%; }
  .frame-botanicals { clip-path: none; }
  .frame-craft { clip-path: polygon(40% 0, 100% 0, 100% 100%, 68% 100%); opacity: .72; }
  .frame-textiles { clip-path: polygon(70% 0, 100% 0, 100% 100%, 50% 100%); opacity: .42; }
  .story-cards { grid-template-columns: 1fr; }
  .story-card { min-height: 440px; }
  .story-principles { grid-template-columns: 1fr; padding: 30px 24px; }
  .story-principles div { grid-template-columns: 78px 1fr; gap: 14px; }
}

@media (prefers-reduced-motion: reduce) { .hero-frame { animation: none; } .hero-film { background: var(--forest-deep) url('/assets/elemia-three-hub-montage-poster.jpg') center / cover no-repeat; } .hero-film-video { display: none; } }

/* Final requested section order and top-centered hero mark. */
.gateway-section { background: var(--paper); }
.hero-content { align-items: center; padding-top: 0; text-align: center; }
.hero-logo { position: absolute; top: 54px; left: 50%; display: flex; flex-direction: column; align-items: center; margin-bottom: 0; color: white; text-shadow: 0 2px 18px rgba(0,0,0,.35); transform: translateX(-50%); }
.hero-logo strong { font: 34px/1 Georgia, serif; letter-spacing: .28em; }
.hero-logo small { margin-top: 10px; font-size: 10px; letter-spacing: .34em; }
.hero-content .eyebrow { margin-bottom: 22px; }
.hero-content .hero-lead { text-align: center; }
.hero-foot .hero-note { display: none; }

@media (max-width: 720px) {
  .hero-logo { top: 34px; }
  .hero-logo strong { font-size: 28px; }
  .hero-logo small { font-size: 8px; }
}

/* Header masthead, lower hero composition, and corporate footer. */
.site-header { opacity: 1; transform: translateY(0); pointer-events: auto; }
.header-masthead { position: absolute; left: 50%; top: 13px; min-width: 0; align-items: center; text-align: center; transform: translateX(-50%); }
.header-masthead .brand-copy { align-items: center; }
.header-masthead .brand-copy strong { font-size: 30px; letter-spacing: .28em; }
.header-masthead .brand-copy small { margin-top: 8px; font-size: 9px; letter-spacing: .34em; }
.brand-region { margin-top: 10px; color: #d9c6a1; font-size: 8px; font-weight: 700; letter-spacing: .24em; white-space: nowrap; }
.desktop-nav { margin-left: 0; }
.hero-content { padding-top: 96px; }
.site-footer { padding: 34px 0; background: var(--forest-deep); color: rgba(255,255,255,.72); }
.site-footer-inner { display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.site-footer-inner > div:first-child { flex: 0 0 205px; text-align: center; }
.footer-brand { display: inline-flex; flex-direction: column; color: white; }
.footer-brand strong { font: 22px/1 Georgia, serif; letter-spacing: .28em; }
.footer-brand small { margin-top: 8px; font-size: 8px; letter-spacing: .3em; }
.site-footer p { margin: 0; font-size: 10px; letter-spacing: .08em; }

@media (max-width: 1000px) {
  .header-masthead .brand-copy strong { font-size: 26px; }
  .brand-region { font-size: 7px; }
}

@media (max-width: 720px) {
  .site-header { height: 84px; }
  .header-masthead { top: 10px; }
  .header-masthead .brand-copy strong { font-size: 22px; }
  .header-masthead .brand-copy small { margin-top: 6px; font-size: 7px; }
  .brand-region { margin-top: 7px; font-size: 6px; letter-spacing: .16em; }
  .hero-content { padding-top: 78px; }
  .site-footer-inner { align-items: flex-start; flex-direction: column; gap: 20px; }
  .site-footer p { line-height: 1.6; }
}

/* Buyer-focused messaging and enquiry integration hooks. */
.hero-support { max-width: 720px; margin: 12px 0 0; color: rgba(255,255,255,.7); font: 13px/1.5 Georgia, serif; text-align: center; white-space: pre-line; }
.who-we-serve { background-image: url('/assets/rattan-dining-reference.webp'); background-position: center; }
.buyer-benefits { display: grid; grid-template-columns: .78fr 1.22fr; gap: 70px; padding: 58px 4%; color: var(--ink); background: var(--paper); }
.buyer-benefits-heading { align-self: start; }
.buyer-benefits-heading .eyebrow { margin-bottom: 18px; }
.buyer-benefits-heading h3 { margin: 0; font: 34px/1.05 Georgia, serif; letter-spacing: -.03em; }
.buyer-benefits-heading h3 em { color: var(--leaf); font-weight: 400; }
.buyer-benefits-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 28px 24px; }
.buyer-benefits-grid article { padding-top: 14px; border-top: 1px solid rgba(28,55,39,.22); }
.buyer-benefits-grid span { color: var(--leaf); font-size: 9px; font-weight: 700; letter-spacing: .18em; }
.buyer-benefits-grid h4 { margin: 23px 0 12px; font-size: 15px; line-height: 1.25; }
.buyer-benefits-grid p { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.7; }
.enquiry-form .privacy-note { max-width: 560px; }
.form-status.is-error { background: rgba(155,58,45,.1); color: #8b3024; }

@media (max-width: 1000px) {
  .buyer-benefits { grid-template-columns: 1fr; gap: 30px; }
}

@media (max-width: 720px) {
  .hero-support { font-size: 13px; }
  .buyer-benefits { gap: 34px; padding: 42px 24px; }
  .buyer-benefits-grid { grid-template-columns: 1fr; gap: 26px; }
}

/* Final adjustment: keep the masthead in the Hero and keep the footer transparent. */
.site-header { opacity: 0; transform: translateY(-18px); pointer-events: none; }
.site-header.is-scrolled { opacity: 1; transform: translateY(0); pointer-events: auto; }
.site-footer { background: transparent; color: var(--muted); }
.footer-brand { color: var(--ink); }
.hero-content { padding-top: 145px; }
.site-footer-inner { justify-content: space-between; text-align: center; }

@media (max-width: 720px) {
.hero-content { padding-top: 0; }
  .site-footer-inner { align-items: flex-start; }
}

.admin-shell { min-height: 100vh; padding: 72px 5vw; background: var(--paper); color: var(--ink); }
.admin-header, .admin-toolbar { display: flex; justify-content: space-between; align-items: flex-end; gap: 24px; }
.admin-header { max-width: 1100px; margin: 0 auto 42px; }
.admin-header h1 { font-family: var(--serif); font-size: clamp(3rem, 7vw, 6.5rem); font-weight: 400; line-height: .95; margin: 8px 0 18px; }
.admin-header p:not(.eyebrow) { max-width: 560px; color: var(--muted); }
.admin-card { max-width: 1100px; margin: 0 auto 28px; padding: clamp(24px, 4vw, 48px); background: #fff; border: 1px solid rgba(24,24,21,.12); }
.admin-toolbar { align-items: center; margin-bottom: 28px; }
.admin-toolbar h2 { font-family: var(--serif); font-size: 2.1rem; font-weight: 400; margin: 6px 0 0; }
.admin-field { display: grid; gap: 8px; margin: 18px 0; }
.admin-field span { font-size: .72rem; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); }
.admin-field textarea, .admin-field input, .admin-toolbar select, .inquiry-item select { width: 100%; padding: 12px; border: 1px solid rgba(24,24,21,.2); background: var(--paper); font: inherit; }
.admin-toolbar select, .inquiry-item select { width: auto; min-width: 150px; }
.admin-message { min-height: 1.4em; color: var(--muted); }
.inquiry-list { display: grid; gap: 12px; }
.inquiry-item { display: flex; justify-content: space-between; align-items: flex-start; gap: 20px; padding: 18px 0; border-top: 1px solid rgba(24,24,21,.12); }
.inquiry-item strong, .inquiry-item span { display: block; }
.inquiry-item span { margin-top: 5px; color: var(--muted); font-size: .88rem; }
.inquiry-item p { max-width: 720px; margin: 12px 0 0; color: var(--muted); }
.button-outline { border: 1px solid var(--ink); background: transparent; color: var(--ink); }
@media (max-width: 700px) { .admin-shell { padding: 36px 20px; } .admin-header, .admin-toolbar, .inquiry-item { display: block; } .admin-header .button, .admin-toolbar select, .inquiry-item select { margin-top: 18px; } }

.cms-video { width: 100%; height: 100%; object-fit: cover; }
.gateway-card.has-video::before { display: none; }
.gateway-card > .cms-video { position: absolute; inset: 0; z-index: 0; }
.footer-social { display: flex; flex: 0 0 auto; flex-wrap: nowrap; justify-content: center; gap: 10px; white-space: nowrap; }
.footer-social-icons > a, .footer-social-icons > span { display: grid; width: 32px; height: 32px; place-items: center; border: 1px solid rgba(54,92,70,.34); border-radius: 50%; color: var(--leaf); }
.footer-social-icons > a:hover { border-color: var(--forest); background: var(--forest); color: white; }
.footer-social-icons svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.7; }

.hero-cepa { max-width: 640px; margin: 16px 0 0; color: rgba(255,255,255,.62); font-size: 11px; line-height: 1.65; text-align: center; }
.hero-primary { margin-top: 26px; }
.values-inline { padding: 64px 4% 0; color: var(--ink); background: var(--cream); }
.values-inline .value-grid { display: grid; grid-template-columns: repeat(4, 1fr); grid-template-rows: 1fr; gap: 14px; }
.values-inline .value-card { min-height: 255px; background: var(--forest); }
.values-inline .value-card::after { background: linear-gradient(0deg, rgba(8,29,19,.78), rgba(8,29,19,.16)); }
.values-inline .value-card h3 { font-size: 20px; }
.values-inline .value-card p { font-size: 11px; }
.sustainability { background: var(--paper); }
.sustainability .section-heading { max-width: 850px; }
.sustainability .section-heading > p:last-child { max-width: 650px; margin: 28px 0 0; color: var(--muted); line-height: 1.8; }
.sustainability-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin-top: 58px; }
.sustainability-grid article { min-height: 280px; padding: 28px; border-top: 1px solid var(--line); background: var(--cream); }
.sustainability-grid article > span { color: var(--leaf); font-size: 9px; letter-spacing: .15em; }
.sustainability-grid h3 { margin: 54px 0 12px; font: 25px/1.1 Georgia, serif; }
.sustainability-grid p { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.7; }
.certification-note { display: grid; grid-template-columns: 180px 1fr; gap: 28px; margin-top: 16px; padding: 20px 28px; border: 1px dashed rgba(54,92,70,.35); color: var(--muted); }
.certification-note strong { color: var(--leaf); font-size: 10px; letter-spacing: .15em; text-transform: uppercase; }
.certification-note p { margin: 0; font-size: 12px; line-height: 1.6; }
.contact-intro h2 em { color: var(--leaf); }
.office-list small { display: block; margin-top: 6px; color: var(--muted); font: 10px/1.4 Arial, Helvetica, sans-serif; }
.next-steps { margin-top: 50px; padding-top: 28px; border-top: 1px solid var(--line); text-align: center; }
.next-steps > strong { display: block; color: var(--leaf); font-size: clamp(13px, 1vw, 16px); letter-spacing: .16em; text-transform: uppercase; }
.next-steps p { display: grid; grid-template-columns: 38px minmax(0, 1fr); gap: 14px; max-width: 720px; margin: 24px auto 0; color: var(--muted); font-size: clamp(16px, 1.25vw, 19px); line-height: 1.55; text-align: left; }
.next-steps p span:first-child { color: var(--leaf); font-weight: 700; }

@media (max-width: 720px) {
  .next-steps { margin-top: 36px; padding-top: 24px; }
  .next-steps > strong { font-size: 13px; }
  .next-steps p { grid-template-columns: 32px minmax(0, 1fr); gap: 10px; margin-top: 18px; font-size: 16px; }
}
.footer-links { display: flex; flex: 1 1 auto; min-width: 0; flex-wrap: nowrap; justify-content: center; gap: 10px clamp(6px, .75vw, 12px); white-space: nowrap; }
.footer-links a { color: var(--muted); font-size: clamp(7px, .55vw, 9px); letter-spacing: .08em; text-transform: uppercase; }
.footer-links a:hover { color: var(--forest); }
.hub-page, .legal-page { min-height: 100vh; background: var(--paper); }
.hub-page .site-header, .legal-page .site-header { opacity: 1; transform: none; pointer-events: auto; }
.hub-hero, .legal-hero { min-height: 470px; padding-top: 190px; background: var(--forest-deep); color: white; }
.hub-hero h1, .legal-hero h1 { max-width: 900px; margin: 0; font: clamp(55px, 8vw, 104px)/.92 Georgia, serif; letter-spacing: -.04em; }
.hub-tagline { margin: 28px 0 0; color: #d9c6a1; font: italic 24px/1.25 Georgia, serif; }
.hub-hero .detail-hero__intro { margin: 16px 0 0; color: rgba(255,255,255,.7); font-size: 14px; }
.hub-content { max-width: 1060px; }
.hub-lead { display: grid; grid-template-columns: .75fr 1.25fr; gap: 70px; align-items: end; padding-bottom: 68px; border-bottom: 1px solid var(--line); }
.hub-lead h2 { font-size: clamp(42px, 5vw, 70px); }
.hub-lead > p:last-child { margin: 0; color: var(--muted); font-size: 15px; line-height: 1.85; }
.hub-detail-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin: 68px 0 46px; }
.hub-detail-grid article { min-height: 220px; padding: 24px; border-top: 1px solid var(--line); background: var(--cream); }
.hub-detail-grid article > span { color: var(--leaf); font-size: 9px; font-weight: 700; letter-spacing: .15em; text-transform: uppercase; }
.hub-detail-grid h3 { margin: 42px 0 12px; font: 24px/1.1 Georgia, serif; }
.hub-detail-grid p { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.7; }
.legal-hero { min-height: 390px; padding-top: 175px; }
.legal-hero h1 { font-size: clamp(52px, 7vw, 88px); }
.legal-hero > .shell > p:last-child { max-width: 620px; margin: 28px 0 0; color: rgba(255,255,255,.7); font-size: 15px; line-height: 1.7; }
.legal-content { max-width: 900px; }
.legal-content article { padding: 28px 0; border-top: 1px solid var(--line); }
.legal-content h2 { font-size: 32px; }
.legal-content article p { max-width: 700px; margin: 14px 0 0; color: var(--muted); font-size: 14px; line-height: 1.8; }
.proof-points { display: grid; grid-template-columns: .7fr 1.3fr; gap: 55px; padding: 58px 4% 0; color: var(--ink); }
.proof-points h3 { margin: 0; font: 31px/1.1 Georgia, serif; }
.proof-points-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.proof-points-grid article { padding-top: 15px; border-top: 1px solid var(--line); }
.proof-points-grid span { display: block; color: var(--leaf); font-size: 9px; font-weight: 700; letter-spacing: .15em; text-transform: uppercase; }
.proof-points-grid strong { display: block; margin-top: 26px; font: 16px/1.35 Georgia, serif; font-weight: 400; }
.certification-badges { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 16px; }
.certification-badges span { padding: 10px 14px; border: 1px solid rgba(54,92,70,.28); color: var(--leaf); font-size: 9px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.footer-social-placeholder { color: var(--muted); font-size: 9px !important; letter-spacing: .08em !important; }

@media (max-width: 1000px) {
  .site-footer-inner { flex-wrap: wrap; justify-content: center; }
  .footer-links { order: 2; flex-basis: 100%; flex-wrap: wrap; white-space: normal; }
  .footer-social { order: 1; }
  .values-inline .value-grid { grid-template-columns: repeat(2, 1fr); }
  .sustainability-grid, .hub-detail-grid { grid-template-columns: 1fr 1fr; }
  .hub-lead { grid-template-columns: 1fr; gap: 28px; }
}

@media (max-width: 720px) {
  .hero-cepa { font-size: 10px; }
  .values-inline { padding-inline: 0; }
  .values-inline .value-grid, .sustainability-grid, .hub-detail-grid { grid-template-columns: 1fr; }
  .certification-note { grid-template-columns: 1fr; gap: 10px; }
  .footer-links { order: initial; justify-content: flex-start; }
  .footer-social { order: initial; }
  .hub-hero, .legal-hero { padding-top: 135px; }
  .hub-hero { min-height: 390px; }
  .hub-lead { padding-bottom: 42px; }
  .hub-detail-grid { margin: 42px 0 34px; }
  .proof-points { grid-template-columns: 1fr; gap: 28px; padding-inline: 0; }
  .proof-points-grid { grid-template-columns: 1fr; gap: 22px; }
}

.admin-shell { padding: 0; background: #f4f1e8; }
.admin-layout { min-height: 100vh; display: grid; grid-template-columns: 286px minmax(0, 1fr); }
.admin-sidebar { position: sticky; top: 0; height: 100vh; padding: 30px 22px; display: flex; flex-direction: column; background: var(--forest-deep); color: white; }
.admin-brand { display: grid; gap: 8px; padding: 0 12px 28px; border-bottom: 1px solid rgba(255,255,255,.14); }
.admin-brand strong { font: 24px/1 Georgia, serif; letter-spacing: .26em; }
.admin-brand span { color: rgba(255,255,255,.56); font-size: 10px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; }
.admin-sidebar nav { display: grid; gap: 8px; margin-top: 28px; }
.admin-sidebar button { padding: 14px 13px; border: 1px solid transparent; background: transparent; color: rgba(255,255,255,.7); text-align: left; cursor: pointer; }
.admin-sidebar button span { display: block; margin-bottom: 5px; color: rgba(217,198,161,.8); font-size: 8px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; }
.admin-sidebar button.is-active, .admin-sidebar button:hover { border-color: rgba(255,255,255,.18); background: rgba(255,255,255,.08); color: white; }
.admin-view-site { margin-top: auto; padding: 14px 12px; border: 1px solid rgba(255,255,255,.22); color: white; font-size: 10px; font-weight: 700; letter-spacing: .14em; text-align: center; text-transform: uppercase; }
.admin-main { min-width: 0; padding: 44px min(5vw, 58px) 70px; }
.admin-topbar { max-width: 1180px; margin: 0 auto 30px; display: flex; align-items: flex-end; justify-content: space-between; gap: 28px; }
.admin-topbar h1 { margin: 4px 0 0; font-family: Georgia, 'Times New Roman', serif; font-size: clamp(42px, 6vw, 76px); font-weight: 400; line-height: .95; }
.admin-topbar > p { max-width: 420px; margin: 0 0 8px; color: var(--muted); font-size: 13px; line-height: 1.65; }
.admin-card { max-width: 1180px; border-radius: 0; box-shadow: 0 22px 70px rgba(28,37,31,.07); }
.admin-toolbar select, .admin-field select { width: 100%; min-width: 150px; padding: 12px; border: 1px solid rgba(24,24,21,.2); background: var(--paper); }
.admin-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.admin-mini-card { min-width: 0; padding: 18px; border: 1px solid rgba(24,24,21,.12); background: #fff; }
.admin-mini-card h3 { margin: 18px 0 8px; font: 22px/1.15 Georgia, serif; }
.admin-mini-card p { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.65; }
.media-preview { height: 180px; display: grid; place-items: center; overflow: hidden; background: var(--cream); color: var(--muted); font-size: 11px; letter-spacing: .12em; text-align: center; text-transform: uppercase; }
.media-preview img, .media-preview video { width: 100%; height: 100%; object-fit: cover; }
.admin-actions { display: flex; flex-wrap: wrap; gap: 10px; justify-content: flex-end; }
.admin-list-editor { display: grid; gap: 12px; }
.admin-row-editor { display: grid; grid-template-columns: 118px minmax(160px, .7fr) minmax(180px, 1fr) 40px; gap: 10px; align-items: center; padding: 12px; border: 1px solid rgba(24,24,21,.12); background: #fff; }
.admin-row-editor label { color: var(--muted); font-size: 12px; }
.admin-row-editor input:not([type="checkbox"]) { width: 100%; padding: 12px; border: 1px solid rgba(24,24,21,.18); background: var(--paper); }
.admin-icon-button { width: 40px; height: 40px; border: 1px solid rgba(24,24,21,.18); background: transparent; cursor: pointer; }

@media (max-width: 980px) {
  .admin-layout { grid-template-columns: 1fr; }
  .admin-sidebar { position: static; height: auto; }
  .admin-sidebar nav { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .admin-view-site { margin-top: 24px; }
  .admin-topbar, .admin-toolbar { display: block; }
  .admin-topbar > p, .admin-toolbar select, .admin-actions { margin-top: 18px; }
  .admin-grid { grid-template-columns: 1fr; }
  .admin-row-editor { grid-template-columns: 1fr; }
}

/* Final hero readability overrides. */
.hero-content { justify-content: flex-start; padding-top: 145px; }
.hero-logo { top: 44px; }
.hero-context { margin-top: 10px; }
.hero-tagline { margin: 0 0 9px; color: rgba(255,255,255,.78); font-size: 10px; font-weight: 700; letter-spacing: .28em; text-transform: uppercase; }
.hero-context .eyebrow { margin: 0; }
.hero h1 { margin-top: 27px; }
.hero-primary { margin-top: 25px; }

@media (max-width: 720px) {
  .hero-content { padding-top: 126px; }
  .hero-logo { top: 34px; }
  .hero-tagline { font-size: 8px; letter-spacing: .22em; }
  .hero h1 { margin-top: 22px; }
  .hero-lead { margin-top: 22px; font-size: 16px; }
  .hero-cepa { max-width: 330px; font-size: 9px; }
}

/* Cinematic photo treatment inspired by editorial sourcing imagery. */
.hero-film-video {
  transform: scale(1.015);
  animation: elemia-film-breathe 24s ease-in-out infinite alternate;
  will-change: transform;
}

.story-card {
  background-image: none;
}

.story-card-media {
  position: absolute;
  z-index: 0;
  inset: -5%;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  filter: saturate(.82) contrast(1.03);
  animation: elemia-photo-drift 18s ease-in-out infinite alternate;
  will-change: transform;
}

.who-we-are .story-card-media { background-image: url('/assets/green-vanilla-pods-reference.webp'); }
.who-we-serve .story-card-media { background-image: url('/assets/rattan-dining-reference.webp'); }
.what-we-do .story-card-media { background-image: url('/assets/textile-weaving-indonesia-pexels.webp'); background-position: 54% center; }
.story-card:nth-child(2) .story-card-media { animation-delay: -6s; animation-direction: alternate-reverse; }
.story-card:nth-child(3) .story-card-media { animation-delay: -12s; }
.story-card::before { z-index: 1; }
.story-card > *:not(.story-card-media) { z-index: 2; }

.gateway-card::before {
  animation: elemia-photo-drift 20s ease-in-out infinite alternate;
  will-change: transform;
}

.gateway-card:nth-child(2)::before { animation-delay: -7s; animation-direction: alternate-reverse; }
.gateway-card:nth-child(3)::before { animation-delay: -14s; }
.gateway-card:hover::before { animation-play-state: paused; }

.hub-hero {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background: var(--forest-deep);
}

.hub-hero::after {
  content: '';
  position: absolute;
  z-index: 1;
  inset: 0;
  background: linear-gradient(90deg, rgba(7, 22, 15, .92) 0%, rgba(7, 22, 15, .72) 48%, rgba(7, 22, 15, .42) 100%), linear-gradient(0deg, rgba(5, 16, 11, .58), transparent 64%);
}

.hub-hero-media {
  position: absolute;
  z-index: 0;
  inset: -5%;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  filter: saturate(.72) contrast(1.06);
  animation: elemia-hub-drift 22s ease-in-out infinite alternate;
  will-change: transform;
}

.hub-hero--botanica .hub-hero-media { background-image: url('/assets/green-vanilla-pods-reference.webp'); background-position: 38% center; }
.hub-hero--living .hub-hero-media { background-image: url('/assets/rattan-interior-pexels.webp'); }
.hub-hero--atelier .hub-hero-media { background-image: url('/assets/textile-weaving-indonesia-pexels.webp'); background-position: center; }
.hub-hero > .shell { position: relative; z-index: 2; }

@keyframes elemia-film-breathe {
  from { transform: scale(1.015) translate3d(-.25%, 0, 0); }
  to { transform: scale(1.065) translate3d(.4%, -.35%, 0); }
}

@keyframes elemia-photo-drift {
  from { transform: scale(1.015) translate3d(-1%, .2%, 0); }
  to { transform: scale(1.09) translate3d(1%, -.8%, 0); }
}

@keyframes elemia-hub-drift {
  from { transform: scale(1.02) translate3d(-.8%, 0, 0); }
  to { transform: scale(1.1) translate3d(1.1%, -.65%, 0); }
}

@media (max-width: 720px) {
  .story-card-media, .hub-hero-media { inset: -3%; }
  .hub-hero::after { background: linear-gradient(90deg, rgba(7, 22, 15, .9), rgba(7, 22, 15, .58)), linear-gradient(0deg, rgba(5, 16, 11, .62), transparent 70%); }
}

@media (prefers-reduced-motion: reduce) {
  .hero-film-video, .story-card-media, .gateway-card::before, .hub-hero-media {
    animation: none !important;
    transform: none !important;
    will-change: auto;
  }
  .gateway-card > .cms-video { display: none; }
  .gateway-card.has-video::before { display: block; }
}

/* Brighter hero treatment: retain contrast without the previously sombre cast. */
.hero-film-video {
  filter: brightness(1.2) saturate(.9) contrast(.93);
}

.hero-shade {
  background:
    linear-gradient(90deg, rgba(7, 22, 15, .6) 0%, rgba(7, 22, 15, .27) 51%, rgba(7, 22, 15, .4)),
    linear-gradient(0deg, rgba(5, 16, 11, .4), transparent 52%);
}

@media (max-width: 720px) {
  .hero-shade {
    background:
      linear-gradient(90deg, rgba(7, 22, 15, .65), rgba(7, 22, 15, .34)),
      linear-gradient(0deg, rgba(5, 16, 11, .42), transparent 58%);
  }
}

/* Simplified hero and relocated IEU-CEPA context. */
.hero-message { width: 100%; display: flex; flex-direction: column; align-items: center; transform: translateY(48px); }
.hero-message .hero-context { transform: translateY(-94px); }
.hero-lower { margin-top: 22px; }
.hero-primary { margin-top: 28px; }
.hero-film-video { animation-duration: 44s; }
.trade-context { display: grid; grid-template-columns: 210px 1fr; gap: 34px; margin-top: -72px; margin-bottom: 92px; padding: 24px 28px; border: 1px solid var(--line); background: var(--cream); }
.trade-context span { color: var(--leaf); font-size: 9px; font-weight: 700; letter-spacing: .17em; text-transform: uppercase; }
.trade-context p { max-width: 850px; margin: 0; color: var(--muted); font-size: 12px; line-height: 1.7; }

@media (max-width: 720px) {
  .hero { height: 820px; min-height: 820px; }
  .hero-content { padding-top: 118px; padding-bottom: 120px; }
  .hero-message { transform: translateY(32px); }
  .hero-message .hero-context { transform: translateY(-68px); }
  .hero-lower { margin-top: 18px; }
  .trade-context { grid-template-columns: 1fr; gap: 10px; margin-top: -42px; margin-bottom: 64px; padding: 22px; }
}

/* Editorial image bank: the three hubs shown through material, place and process. */
.image-bank-section { background: #102b20; color: white; }
.image-bank-heading { display: grid; grid-template-columns: 1fr .78fr; gap: 90px; align-items: end; margin-bottom: 56px; }
.image-bank-heading .eyebrow { color: #d9c6a1; }
.image-bank-heading h2 em { color: var(--brass); }
.image-bank-heading > p { max-width: 540px; margin: 0 0 6px; color: rgba(255,255,255,.7) !important; }
.image-bank-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); grid-auto-rows: 240px; grid-auto-flow: dense; gap: 12px; }
.image-bank-grid figure { position: relative; min-width: 0; margin: 0; overflow: hidden; background: var(--forest-deep); }
.image-bank-grid .image-bank-feature { grid-row: span 2; }
.image-bank-grid .image-bank-wide { grid-column: span 2; }
.image-bank-grid img { width: 100%; height: 100%; display: block; object-fit: cover; filter: saturate(.82) contrast(1.03); transition: transform .7s ease, filter .35s ease; }
.image-bank-grid figure:hover img { transform: scale(1.045); filter: saturate(1) contrast(1.01); }
.image-bank-grid figcaption { position: absolute; inset: auto 0 0; display: grid; gap: 5px; padding: 54px 18px 17px; background: linear-gradient(transparent, rgba(4,18,12,.9)); }
.image-bank-grid figcaption span { color: #d9c6a1; font-size: 9px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; }
.image-bank-grid figcaption strong { font: 18px/1.25 Georgia, serif; font-weight: 400; }
.image-bank-grid figcaption a { width: fit-content; color: rgba(255,255,255,.62); font-size: 9px; line-height: 1.4; text-decoration: underline; text-underline-offset: 3px; }

@media (max-width: 1000px) {
  .image-bank-heading { grid-template-columns: 1fr; gap: 28px; }
  .image-bank-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: 260px; }
}

@media (max-width: 720px) {
  .image-bank-heading { margin-bottom: 36px; }
  .image-bank-grid { grid-template-columns: 1fr; grid-auto-rows: 360px; }
  .image-bank-grid .image-bank-feature, .image-bank-grid .image-bank-wide { grid-column: auto; grid-row: auto; }
  .hero { height: 1040px; min-height: 1040px; max-height: none; }
  .hero-content { height: 100%; padding-top: 118px; padding-bottom: 150px; }
  .hero h1 { font-size: clamp(43px, 13vw, 58px); }
  .hero-support { font-size: 12px; line-height: 1.55; }
  .hero-cepa { font-size: 9px; line-height: 1.5; }
}

/* Wednesday review: clearer hierarchy, unnumbered cards and more visual context. */
.brand-copy small { white-space: nowrap; font-size: 8px; letter-spacing: .16em; }
.hero-lead { position: relative; padding-bottom: 16px; }
.hero-lead::after { content: ""; position: absolute; left: 50%; bottom: 0; width: 84px; height: 1px; background: rgba(255,255,255,.72); transform: translateX(-50%); }

.story-heading { grid-template-columns: .72fr 1.28fr; align-items: start; column-gap: 8%; }
.story-narrative { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 30px; }
.story-narrative p { margin: 0; padding-top: 15px; border-top: 1px solid rgba(28,55,39,.24); color: var(--muted); font-size: 15px; line-height: 1.75; }
.story-number { margin-bottom: 58px; font-size: 14px; line-height: 1.2; letter-spacing: .14em; }
.buyer-benefits-grid h4 { margin-top: 0; }
.values-inline .value-card { justify-content: flex-end; }
.card-content { justify-content: flex-end; }

.capability-card { position: relative; isolation: isolate; min-height: 390px; display: flex; flex-direction: column; justify-content: flex-end; overflow: hidden; background-position: center; background-size: cover; }
.capability-card::before { content: ""; position: absolute; z-index: -1; inset: 0; background: linear-gradient(180deg, rgba(7,22,15,.2), rgba(7,22,15,.96) 78%); }
.capability-card-1 { background-image: url('/assets/vanilla-plantation-hd.jpg'); }
.capability-card-2 { background-image: url('/assets/textile-design-reference.webp'); }
.capability-card-3 { background-image: url('/assets/rattan-dining-reference.webp'); }
.capability-card-4 { background-image: url('/assets/teak-craftsman-hd.jpg'); }
.capability-card h3 { margin: 0 0 28px; font-size: 29px; }
.capability-card p { color: rgba(255,255,255,.82); }

.sustainability-grid h3 { margin-top: 20px; }

.cares { max-width: none; gap: 10px; }
.cares div { position: relative; isolation: isolate; min-height: 180px; padding: 20px; display: flex; flex-direction: column; justify-content: flex-end; overflow: hidden; border: 0; background-position: center; background-size: cover; color: white; }
.cares div::before { content: ""; position: absolute; z-index: -1; inset: 0; background: linear-gradient(180deg, rgba(7,22,15,.08), rgba(7,22,15,.9)); }
.cares div:nth-child(1) { background-image: url('/assets/tropical-forest-detail-reference.webp'); }
.cares div:nth-child(2) { background-image: url('/assets/textile-weaving-indonesia-pexels.webp'); }
.cares div:nth-child(3) { background-image: url('/assets/coffee-harvest-unsplash.webp'); }
.cares strong { color: #fff; font-size: 25px; text-shadow: 0 2px 14px rgba(0,0,0,.35); }
.cares span { color: rgba(255,255,255,.82); font-size: 12px; }
.next-steps p { display: block; padding-top: 17px; border-top: 1px solid var(--line); text-align: left; }

@media (max-width: 1000px) {
  .story-heading { grid-template-columns: 1fr; gap: 30px; }
}

@media (max-width: 720px) {
  .brand-copy small { font-size: 7px; letter-spacing: .11em; }
  .story-narrative { grid-template-columns: 1fr; gap: 20px; }
  .story-narrative p { font-size: 15px; }
  .capability-card { min-height: 430px; }
  .cares { grid-template-columns: 1fr; }
  .cares div { min-height: 220px; }
}

/* Tighter section rhythm and a fully packed At the Source gallery. */
.section { padding-block: 84px; }
.story-heading { margin-bottom: 36px; }
.buyer-benefits { padding-block: 46px; }
.values-inline { padding-top: 46px; }
.capability-heading { margin-bottom: 54px; }
.gateway-grid { padding-bottom: 84px; }
.trade-context { margin-bottom: 52px; }
.sustainability-grid { margin-top: 42px; }
.office-list { margin-top: 42px; }

.image-bank-heading { margin-bottom: 38px; }
.image-bank-grid { grid-auto-rows: 220px; }
.image-bank-grid .image-bank-wide { grid-column: auto; }

@media (max-width: 1000px) {
  .section { padding-block: 72px; }
  .image-bank-grid { grid-auto-rows: 230px; }
}

@media (max-width: 720px) {
  .section { padding-block: 58px; }
  .gateway-grid { padding-bottom: 62px; }
  .trade-context { margin-bottom: 38px; }
  .image-bank-heading { margin-bottom: 28px; }
  .image-bank-grid { grid-auto-rows: 280px; }
}

/* Compact next steps and a cleaner two-line footer signature. */
.next-steps > strong { font-size: 14px; }
.next-steps > strong { color: var(--forest-deep); font-weight: 800; letter-spacing: .18em; }
.next-steps p { margin-top: 16px; color: #536158; font-size: 14px; font-weight: 600; line-height: 1.5; }
.site-footer-inner > div:first-child { flex-basis: 300px; }
.site-footer-inner > div:first-child > p { max-width: 300px; font-size: 9px; line-height: 1.55; }

@media (max-width: 720px) {
  .next-steps > strong { font-size: 13px; }
  .next-steps p { margin-top: 14px; font-size: 14px; }
  .site-footer-inner > div:first-child { flex-basis: auto; width: min(100%, 300px); }
}

/* Client presentation pages. */
.presentation-page { min-height: 100vh; background: var(--paper); color: var(--ink); }
.presentation-hero { position: relative; min-height: 720px; display: flex; align-items: flex-end; overflow: hidden; color: white; }
.presentation-hero-media,.presentation-hero-overlay { position: absolute; inset: 0; }
.presentation-hero-media { background-position: center; background-size: cover; }
.presentation-hero-overlay { background: linear-gradient(90deg,rgba(5,20,13,.9),rgba(5,20,13,.38)),linear-gradient(0deg,rgba(5,20,13,.78),transparent 65%); }
.presentation-hero-content { position: relative; z-index: 1; padding-bottom: 90px; }
.presentation-hero h1,.presentation-title h1 { max-width: 980px; margin: 18px 0 0; font: clamp(58px,8vw,112px)/.92 Georgia,serif; letter-spacing: -.045em; }
.presentation-hero h1 em,.presentation-title h1 em { color: var(--brass); font-weight: 400; }
.presentation-hero-content>p:last-child,.presentation-title .shell>p:last-child { max-width: 720px; margin: 30px 0 0; font-size: 17px; line-height: 1.75; }
.presentation-title { padding-top: 180px; }
.presentation-title-dark { background: var(--forest-deep); color: white; }
.presentation-facts { display: grid; grid-template-columns: repeat(3,1fr); gap: 14px; }
.presentation-facts article { min-height: 280px; padding: 28px; border-top: 2px solid var(--leaf); background: var(--cream); }
.presentation-facts span { color: var(--leaf); font-size: 11px; letter-spacing: .16em; }
.presentation-facts h2 { margin: 46px 0 18px; font-size: 28px; }
.presentation-facts p,.values-detail p,.capabilities-detail p { color: var(--muted); font-size: 14px; line-height: 1.75; }
.presentation-actions { display: flex; align-items: center; gap: 32px; margin-top: 50px; }
.values-detail,.capabilities-detail,.source-groups { padding-block: 80px; }
.values-detail article,.capabilities-detail article { display: grid; grid-template-columns: 1fr 1fr; min-height: 440px; border-bottom: 1px solid var(--line); }
.values-detail article:nth-child(even),.capabilities-detail article:nth-child(even){direction:rtl}.values-detail article>* ,.capabilities-detail article>*{direction:ltr}
.values-detail-media,.capabilities-detail-media { min-height: 440px; background-position:center; background-size:cover; }
.values-detail article>div:last-child,.capabilities-detail article>div:last-child { align-self:center; padding:55px; }
.values-detail h2,.capabilities-detail h2 { margin: 14px 0 22px; font-size: clamp(38px,4vw,58px); }
.capabilities-detail strong { display:block; margin-bottom:7px; color:var(--leaf); font-size:10px; letter-spacing:.15em; text-transform:uppercase; }
.source-page { background:var(--forest-deep); color:white; }.source-groups>section{padding:60px 0;border-top:1px solid rgba(255,255,255,.18)}
.source-group-heading{display:flex;justify-content:space-between;align-items:end;margin-bottom:30px}.source-group-heading p{color:var(--brass);font:italic 18px Georgia,serif}.source-group-heading h2{margin:8px 0 0;font-size:42px}
.source-group-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.source-group-grid figure{position:relative;height:420px;margin:0;overflow:hidden}.source-group-grid img{width:100%;height:100%;object-fit:cover}.source-group-grid figcaption{position:absolute;inset:auto 0 0;padding:60px 22px 22px;background:linear-gradient(transparent,rgba(5,20,13,.9));font:24px Georgia,serif}
.presentation-footer{background:var(--paper)}
.section-page-link,.values-page-link { margin-top: 22px; }
.values-page-link { color: var(--leaf); }
.capability-heading > div:last-child > p { max-width: 480px; margin: 0 0 7px; color: rgba(255,255,255,.65); font-size: 14px; line-height: 1.8; }
.image-bank-heading > div:last-child > p { max-width: 540px; margin: 0 0 6px; color: rgba(255,255,255,.7); }
@media(max-width:720px){.presentation-hero{min-height:620px}.presentation-hero-content{padding-bottom:60px}.presentation-title{padding-top:140px}.presentation-facts,.source-group-grid{grid-template-columns:1fr}.values-detail article,.capabilities-detail article{grid-template-columns:1fr}.values-detail article:nth-child(even),.capabilities-detail article:nth-child(even){direction:ltr}.values-detail article>div:last-child,.capabilities-detail article>div:last-child{padding:38px 22px}.source-group-heading{align-items:flex-start;flex-direction:column;gap:18px}.source-group-grid figure{height:340px}}