/* Moratano website — design tokens (generated from the Moratano design system's tokens.json) */
:root {
  /* Colour */
  --olive-900: #202822;
  --olive-800: #2A382C;
  --olive-700: #344536;
  --olive-100: #E3E6DC;
  --ochre-500: #C3A268;
  --ochre-700: #7A6030;
  --ochre-200: #D9CBA8;
  --ochre-100: #F1E8D6;
  --cream: #F5F5F7;
  --white: #FFFFFF;
  --stone-600: #626268;
  --stone-500: #86868B;
  --stone-300: #D2D2D7;
  --stone-200: #E8E8ED;
  --stone-700: #515154;
  --surface: var(--white);
  --surface-alt: var(--cream);
  --surface-inverse: var(--olive-700);
  --surface-deep: var(--olive-900);
  --ink: #1D1D1F;
  --ink-muted: var(--stone-600);
  --ink-inverse: var(--cream);
  --ink-inverse-muted: #C9D1C3;
  --primary: var(--olive-700);
  --primary-hover: var(--olive-800);
  --primary-pressed: var(--olive-900);
  --on-primary: var(--white);
  --whatsapp: #25D366;
  --whatsapp-hover: #1FBE5C;
  --whatsapp-pressed: #1DA851;
  --on-whatsapp: var(--olive-900);
  --accent: var(--ochre-500);
  --accent-hover: #B08F55;
  --on-accent: var(--olive-900);
  --accent-text: var(--ochre-700);
  --accent-on-dark: var(--ochre-200);
  --line: var(--stone-300);
  --line-control: var(--stone-500);
  --line-inverse: #4A5C4C;
  --focus-ring: var(--olive-900);
  --focus-ring-inverse: var(--ochre-200);
  --placeholder-bg: var(--stone-200);
  --placeholder-ink: var(--stone-700);
  --overlay-hero: rgba(32, 40, 34, 0.66);
  --status-ok-bg: #E2ECE3;
  --status-ok-ink: #3D6B4F;
  --status-watch-bg: #F4E9CC;
  --status-watch-ink: #7A5A10;
  --status-act-bg: #F6E0D8;
  --status-act-ink: #A23B22;
  /* Spacing */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;
  --space-24: 96px;
  /* Radius */
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 16px;
  --radius-pill: 999px;
  /* Shadow */
  --shadow-card: 0 1px 2px rgba(32, 40, 34, 0.06), 0 6px 20px rgba(32, 40, 34, 0.06);
  --shadow-raised: 0 12px 32px rgba(32, 40, 34, 0.18);
  --shadow-sticky: 0 6px 20px rgba(32, 40, 34, 0.28);
  /* Size */
  --size-tap: 48px;
  --size-tap-lg: 56px;
  --size-header: 64px;
  --size-container: 1200px;
  --size-measure: 640px;
  --size-icon: 24px;
  /* Type */
  --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-mono: var(--font-sans);
}


/* Moratano components — every value reads a token from tokens.json.
   Type sizes repeated here (media queries) mirror the type styles of the same name. */

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } * { transition: none !important; } }
body { margin: 0; font-family: var(--font-sans); color: var(--ink); background: var(--surface); font-size: 16px; line-height: 26px; -webkit-font-smoothing: antialiased; }
h1, h2, h3, p { margin: 0; }
a { color: inherit; }
img { max-width: 100%; display: block; }
.mt-ic { width: var(--size-icon); height: var(--size-icon); flex: none; display: inline-block; }
.mt-ic svg { width: 100%; height: 100%; display: block; }
.mt-sr { position: absolute; top: 0; left: 0; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }

/* ---------- Layout ---------- */
.mt-container { width: 100%; max-width: calc(var(--size-container) + 2 * var(--space-8)); margin: 0 auto; padding: 0 var(--space-6); }
.mt-section { padding: var(--space-12) 0; scroll-margin-top: var(--size-header); }
.mt-section--alt { background: var(--surface-alt); }
.mt-section--inverse { background: var(--surface-inverse); color: var(--ink-inverse); }
.mt-section__head { margin-bottom: var(--space-8); }
.mt-section__head > p { max-width: var(--size-measure); }
.mt-section__head > * + * { margin-top: var(--space-3); }
.mt-eyebrow { font-size: 13px; line-height: 16px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--accent-text); }
.mt-on-dark .mt-eyebrow, .mt-section--inverse .mt-eyebrow { color: var(--accent-on-dark); }
.mt-h2 { font-size: 26px; line-height: 32px; font-weight: 700; letter-spacing: -0.01em; }
.mt-h3 { font-size: 20px; line-height: 26px; font-weight: 700; }
.mt-lead { font-size: 18px; line-height: 28px; color: var(--ink-muted); }
.mt-muted { color: var(--ink-muted); }
.mt-section--inverse .mt-lead, .mt-section--inverse .mt-muted { color: var(--ink-inverse-muted); }
@media (min-width: 900px) {
  .mt-container { padding: 0 var(--space-8); }
  .mt-section { padding: var(--space-24) 0; }
  .mt-section__head { margin-bottom: var(--space-12); }
  .mt-h2 { font-size: 40px; line-height: 46px; letter-spacing: -0.015em; }
}

/* ---------- Button ---------- */
.mt-btn { display: inline-flex; align-items: center; justify-content: center; gap: var(--space-2); min-height: var(--size-tap); padding: 0 var(--space-5); border-radius: var(--radius-md); border: 1.5px solid transparent; font: 600 16px/20px var(--font-sans); text-decoration: none; cursor: pointer; transition: background-color .15s, border-color .15s, color .15s; -webkit-tap-highlight-color: transparent; }
.mt-btn .mt-ic { width: 20px; height: 20px; }
.mt-btn:focus-visible { outline: 2px solid var(--focus-ring); outline-offset: 2px; }
.mt-on-dark .mt-btn:focus-visible, .mt-section--inverse .mt-btn:focus-visible { outline-color: var(--focus-ring-inverse); }
.mt-btn--primary { background: var(--primary); color: var(--on-primary); }
.mt-btn--primary:hover { background: var(--primary-hover); }
.mt-btn--primary:active { background: var(--primary-pressed); }
.mt-btn--secondary { background: transparent; color: var(--primary); border-color: var(--primary); }
.mt-btn--secondary:hover { background: var(--olive-100); }
.mt-btn--secondary:active { background: var(--line); }
/* Contact = WhatsApp. Every button that contacts Moratano uses this, nothing else does. */
.mt-btn--wa { background: var(--whatsapp); color: var(--on-whatsapp); }
.mt-btn--wa:hover { background: var(--whatsapp-hover); }
.mt-btn--wa:active { background: var(--whatsapp-pressed); }
.mt-btn--accent { background: var(--accent); color: var(--on-accent); }
.mt-btn--accent:hover { background: var(--accent-hover); }
.mt-btn--accent:active { background: var(--ochre-200); }
.mt-btn--ghost-inverse { background: transparent; color: var(--ink-inverse); border-color: var(--ink-inverse-muted); }
.mt-btn--ghost-inverse:hover { background: rgba(244, 241, 232, 0.12); border-color: var(--ink-inverse); }
.mt-btn--text { min-height: var(--size-tap); padding: 0; color: var(--primary); background: none; border: 0; }
.mt-btn--text:hover { text-decoration: underline; text-underline-offset: 4px; }
.mt-btn--lg { min-height: var(--size-tap-lg); padding: 0 var(--space-8); font-size: 17px; }
.mt-btn--block { width: 100%; }
.mt-btn[disabled], .mt-btn[aria-disabled="true"] { background: var(--placeholder-bg); color: var(--ink-muted); border-color: transparent; cursor: not-allowed; }
.mt-btn-row { display: flex; flex-direction: column; gap: var(--space-3); }
@media (min-width: 600px) { .mt-btn-row { flex-direction: row; flex-wrap: wrap; } }

/* ---------- Badge / status ---------- */
.mt-badge { display: inline-flex; align-items: center; gap: var(--space-1); padding: 2px var(--space-2); border-radius: var(--radius-sm); background: var(--ochre-100); color: var(--accent-text); font-size: 12px; line-height: 16px; font-weight: 600; letter-spacing: 0.02em; text-transform: uppercase; }
.mt-status { display: inline-flex; padding: 2px 10px; border-radius: var(--radius-pill); font-size: 12px; line-height: 18px; font-weight: 600; white-space: nowrap; }
.mt-status--ok { background: var(--status-ok-bg); color: var(--status-ok-ink); }
.mt-status--watch { background: var(--status-watch-bg); color: var(--status-watch-ink); }
.mt-status--act { background: var(--status-act-bg); color: var(--status-act-ink); }

/* ---------- Photo placeholder ---------- */
.mt-photo { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: var(--space-2); padding: var(--space-4); background-color: var(--placeholder-bg); background-image: repeating-linear-gradient(135deg, rgba(95, 91, 77, 0.07) 0 2px, transparent 2px 14px); color: var(--placeholder-ink); border-radius: var(--radius-md); text-align: center; overflow: hidden; }
.mt-photo__label { font-size: 13px; line-height: 18px; font-weight: 600; max-width: 28ch; }
.mt-photo .mt-badge { position: absolute; top: var(--space-3); left: var(--space-3); }
.mt-photo--16x10 { aspect-ratio: 16 / 10; }
.mt-photo--4x3 { aspect-ratio: 4 / 3; }
.mt-photo--1x1 { aspect-ratio: 1 / 1; }

/* ---------- Images (decorative illustrations) ---------- */
.mt-photo--img { display: block; padding: 0; background-image: none; }
.mt-photo--img > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; }
.mt-tile { margin: 0; display: grid; gap: var(--space-2); min-width: 0; }
.mt-tile figcaption { font-size: 14px; line-height: 20px; font-weight: 600; color: var(--ink); }

/* ---------- Header ---------- */
.mt-header { position: sticky; top: 0; z-index: 20; background: var(--surface); border-bottom: 1px solid var(--line); }
.mt-header__bar { display: flex; align-items: center; justify-content: space-between; height: var(--size-header); gap: var(--space-4); }
.mt-logo { display: inline-flex; align-items: center; min-height: var(--size-tap); font-weight: 800; font-size: 19px; letter-spacing: 0.14em; color: var(--primary); text-decoration: none; }
.mt-logo { gap: 10px; }
/* Brand mark: the supplied artwork (white M on green), cropped square */
.mt-logo__mark { display: block; width: 40px; height: 40px; border-radius: var(--radius-md); flex: none; }
.mt-logo__mark--footer { width: 44px; height: 44px; box-shadow: 0 0 0 1px rgba(244, 241, 232, .18); }
.mt-logo--footer { gap: var(--space-3); }
.mt-logo__m { width: 48px; height: auto; flex: none; }
.mt-logo:focus-visible { outline: 2px solid var(--focus-ring); outline-offset: 2px; border-radius: var(--radius-sm); }
.mt-nav { display: none; gap: var(--space-2); }
.mt-nav a { display: inline-flex; align-items: center; min-height: var(--size-tap); padding: 0 var(--space-3); white-space: nowrap; font-weight: 600; font-size: 15px; color: var(--ink); text-decoration: none; border-radius: var(--radius-sm); }
.mt-nav a:hover { color: var(--primary); background: var(--surface-alt); }
.mt-nav a:focus-visible { outline: 2px solid var(--focus-ring); outline-offset: 2px; }
.mt-header__cta { display: none; }
.mt-menu-btn { display: inline-flex; align-items: center; justify-content: center; width: var(--size-tap); height: var(--size-tap); margin-right: calc(-1 * var(--space-2)); border: 0; background: none; color: var(--ink); border-radius: var(--radius-md); cursor: pointer; }
.mt-menu-btn:hover { background: var(--surface-alt); }
.mt-menu-btn:focus-visible { outline: 2px solid var(--focus-ring); }
.mt-menu { display: none; padding: var(--space-2) 0 var(--space-4); border-top: 1px solid var(--line); }
.mt-menu.is-open { display: block; }
.mt-menu a.mt-menu__link { display: flex; align-items: center; min-height: var(--size-tap); padding: 0 var(--space-2); font-weight: 600; font-size: 17px; text-decoration: none; border-bottom: 1px solid var(--line); }
.mt-menu .mt-btn { margin-top: var(--space-4); }
@media (min-width: 900px) {
  .mt-header__cta { display: inline-flex; }
  .mt-header__bar { height: 72px; }
}
/* Full nav needs ~1024px; narrower screens use the menu button */
@media (min-width: 1024px) {
  .mt-nav { display: inline-flex; }
  .mt-menu-btn, .mt-menu { display: none !important; }
}

/* ---------- Shared: compact sections and headings ---------- */
.mt-h4 { font-size: 17px; line-height: 24px; font-weight: 700; }
.mt-photo--16x9 { aspect-ratio: 16 / 9; }
.mt-section--tight { padding: var(--space-10) 0; }
.mt-h2--sm { font-size: 24px; line-height: 30px; margin-bottom: var(--space-5); }
.mt-eyebrow + .mt-h2--sm { margin-top: var(--space-2); }
.mt-btn--sm { min-height: 40px; padding: 0 var(--space-3); font-size: 14px; gap: 6px; }
.mt-btn--sm .mt-ic { width: 18px; height: 18px; }
@media (min-width: 900px) {
  .mt-section--tight { padding: var(--space-16) 0; }
  .mt-h2--sm { font-size: 34px; line-height: 40px; margin-bottom: var(--space-8); }
}

/* ---------- Hero: full-bleed rotating photos, copy stays put ---------- */
.mt-hero { position: relative; display: flex; flex-direction: column; justify-content: center; min-height: 560px; background: var(--surface-deep); color: var(--ink-inverse); overflow: hidden; }
.mt-hero__slides, .mt-hero__track { position: absolute; inset: 0; }
.mt-hero__track { margin: 0; }
.mt-slide { position: absolute; inset: 0; margin: 0; opacity: 0; visibility: hidden; transition: opacity .8s ease, visibility 0s linear .8s; }
.mt-slide.is-active { opacity: 1; visibility: visible; transition: opacity .8s ease; }
.mt-slide img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 70% 50%; }
.mt-slide::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(32, 40, 34, .42) 0%, rgba(32, 40, 34, .62) 45%, rgba(32, 40, 34, .9) 100%); }
.mt-hero__inner { position: relative; z-index: 2; padding-top: var(--space-12); padding-bottom: var(--space-12); }
.mt-hero__inner > * + * { margin-top: var(--space-4); }
.mt-hero h1 { font-size: 26px; line-height: 32px; font-weight: 700; letter-spacing: -0.015em; }
.mt-hero h1 > span { display: block; }
.mt-hero h1, .mt-hero__text { text-shadow: 0 1px 12px rgba(32, 40, 34, .45); }
@media (max-width: 359px) { .mt-hero h1 { font-size: 22px; line-height: 28px; } }
@media (min-width: 400px) { .mt-hero h1 { font-size: 28px; line-height: 34px; } }
.mt-hero__text { font-size: 17px; line-height: 27px; color: var(--ink-inverse); max-width: 46ch; opacity: .92; }
.mt-hero .mt-btn-row { margin-top: var(--space-6); }
.mt-hero__controls { display: flex; align-items: center; gap: var(--space-2); margin-top: var(--space-8) !important; }
.mt-hero__btn { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: var(--radius-pill); border: 1.5px solid rgba(244, 241, 232, .55); background: rgba(32, 40, 34, .35); color: var(--ink-inverse); cursor: pointer; }
.mt-hero__btn .mt-ic { width: 20px; height: 20px; }
.mt-hero__btn:hover { background: rgba(244, 241, 232, .14); border-color: var(--ink-inverse); }
.mt-hero__btn:focus-visible, .mt-hero__dots button:focus-visible { outline: 2px solid var(--focus-ring-inverse); outline-offset: 2px; }
.mt-hero__dots { display: flex; gap: 2px; margin-left: var(--space-2); }
.mt-hero__dots button { position: relative; width: 32px; height: 44px; padding: 0; border: 0; background: none; cursor: pointer; }
.mt-hero__dots button::before { content: ""; position: absolute; left: 4px; right: 4px; top: 20px; height: 4px; border-radius: 2px; background: rgba(244, 241, 232, .4); }
.mt-hero__dots button[aria-current="true"]::before { background: var(--accent-on-dark); }
@media (min-width: 900px) {
  .mt-hero { min-height: min(760px, 86vh); }
  .mt-slide::after { background: linear-gradient(90deg, rgba(32, 40, 34, .9) 0%, rgba(32, 40, 34, .72) 38%, rgba(32, 40, 34, .18) 70%, rgba(32, 40, 34, .08) 100%); }
  .mt-slide img { object-position: 60% 50%; }
    .mt-hero__inner { padding-top: var(--space-16); padding-bottom: var(--space-16); }
  .mt-hero h1 { font-size: 54px; line-height: 60px; letter-spacing: -0.02em; }
  .mt-hero__text { font-size: 19px; line-height: 30px; }
  .mt-hero__inner > * + * { margin-top: var(--space-6); }
}
@media (prefers-reduced-motion: reduce) { .mt-slide, .mt-slide.is-active { transition: none; } }

/* ---------- Field challenges: image, title, impact line ---------- */
.mt-issues { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--space-3); }
.mt-issue { display: grid; grid-template-columns: 112px 1fr; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-lg); overflow: hidden; }
.mt-issue__img { aspect-ratio: 4 / 3; background: var(--olive-100); }
.mt-issue__img img { width: 100%; height: 100%; object-fit: cover; }
.mt-issue__body { display: flex; flex-direction: column; justify-content: center; gap: 2px; padding: var(--space-2) var(--space-3); }
.mt-issue h3 { font-size: 15px; line-height: 20px; font-weight: 700; }
.mt-issue p { font-size: 13px; line-height: 18px; color: var(--ink-muted); }
@media (min-width: 600px) { .mt-issue { grid-template-columns: 160px 1fr; } .mt-issue h3 { font-size: 17px; line-height: 23px; } .mt-issue p { font-size: 15px; line-height: 21px; } }
@media (min-width: 900px) {
  .mt-issues { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-6); }
  .mt-issue { grid-template-columns: 1fr; grid-template-rows: auto 1fr; }
  .mt-issue__body { justify-content: flex-start; padding: var(--space-4) var(--space-5) var(--space-5); gap: var(--space-1); }
  .mt-issue h3 { font-size: 19px; line-height: 25px; }
}

/* ---------- Contact button: one treatment everywhere ---------- */
.mt-btn--wa, .mt-btn--wa.mt-btn--lg { min-height: 48px; padding: 0 var(--space-5); font-size: 16px; line-height: 20px; }
.mt-btn--wa .mt-ic { width: 20px; height: 20px; }
.mt-btn--contact { width: 100%; margin-top: auto; }
.mt-btn--wa { white-space: nowrap; }
.mt-hero .mt-btn--lg { min-height: 48px; font-size: 16px; } /* hero pair matches the contact button height */

/* ---------- Services: one numbered card per row ---------- */
.mt-svc-grid { list-style:none; margin:0; padding:0; display:grid; grid-template-columns:minmax(0,1fr); gap:32px; }
.mt-svc { display:flex; flex-direction:column; background:var(--surface); border:1px solid var(--line); border-radius:var(--radius-lg); box-shadow:var(--shadow-card); overflow:hidden; min-width:0; }
.mt-svc__img { position:relative; aspect-ratio:16/9; background:var(--olive-100); }
.mt-svc__img img { position:absolute; inset:0; display:block; width:100%; height:100%; object-fit:cover; }
.mt-svc__body { display:flex; flex-direction:column; gap:20px; padding:24px; flex:1; }
.mt-svc__title { font-size:22px; line-height:30px; font-weight:700; }
.mt-svc__number { display:block; margin-bottom:8px; font:500 14px/20px var(--font-mono); color:var(--primary); }
.mt-svc__list { list-style:none; margin:0; padding:0; display:grid; gap:10px; }
.mt-svc__list li { display:grid; grid-template-columns:18px 1fr; gap:8px; font-size:15px; line-height:23px; color:var(--ink); }
.mt-svc__list .mt-ic { width:18px; height:18px; margin-top:2px; color:var(--status-ok-ink); }
.mt-svc .mt-btn--contact { min-height:48px; padding:0 20px; }
@media (min-width:900px) {
 .mt-svc-grid { gap:32px; }
 .mt-svc { flex-direction:row; }
 .mt-svc__img { flex:0 0 44%; aspect-ratio:auto; min-height:300px; }
 .mt-svc__body { padding:36px; gap:24px; }
 .mt-svc__title { font-size:26px; line-height:34px; }
 .mt-svc .mt-btn--contact { width:auto; align-self:flex-start; }
}

/* ---------- Work process: four illustrated cards ---------- */
.mt-flow2 { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-3); }
.mt-flow2__step { display: flex; flex-direction: column; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-lg); overflow: hidden; min-width: 0; }
.mt-flow2__img { aspect-ratio: 4 / 3; background:var(--surface-alt); }
.mt-flow2__img img { width: 100%; height: 100%; object-fit: cover; }
.mt-flow2__body { position: relative; padding: var(--space-5) var(--space-3) var(--space-3); }
.mt-flow2__n { position: absolute; top: -16px; left: var(--space-3); display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px; border-radius: var(--radius-pill); background: var(--primary); color: var(--on-primary); font-weight: 700; font-size: 14px; border: 2px solid var(--surface); }
.mt-flow2 h3 { font-size: 15px; line-height: 20px; font-weight: 700; }
.mt-flow2 p { margin-top: 2px; font-size: 13px; line-height: 18px; color: var(--ink-muted); }
@media (min-width: 600px) { .mt-flow2 h3 { font-size: 17px; } .mt-flow2 p { font-size: 14px; line-height: 20px; } }
@media (min-width: 900px) {
  .mt-flow2 { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--space-6); }
  .mt-flow2__body { padding: var(--space-6) var(--space-5) var(--space-5); }
  .mt-flow2__n { width: 34px; height: 34px; top: -18px; left: var(--space-5); }
}

/* ---------- Industry adoption: slider, max two cards visible ---------- */
.mt-rail { position: relative; list-style: none; display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - var(--space-3)) / 2); gap: var(--space-3); overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; margin: 0; padding: 2px 2px var(--space-3); scrollbar-width: none; }
.mt-rail::-webkit-scrollbar { display: none; }
.mt-rail:focus-visible { outline: 2px solid var(--focus-ring); outline-offset: 2px; border-radius: var(--radius-md); }
.mt-rail > * { position: relative; scroll-snap-align: start; min-width: 0; }
.mt-rail-bar[hidden] { display: none; }
.mt-rail-bar { display: flex; align-items: center; justify-content: center; gap: var(--space-4); margin-top: var(--space-2); }
.mt-rail-btn { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border: 1.5px solid var(--primary); border-radius: var(--radius-pill); background: var(--surface); color: var(--primary); cursor: pointer; }
.mt-rail-btn:hover { background: var(--olive-100); }
.mt-rail-btn:focus-visible { outline: 2px solid var(--focus-ring); outline-offset: 2px; }
.mt-rail-btn[aria-disabled="true"] { opacity: .35; cursor: default; }
.mt-rail-status { min-width: 7ch; text-align: center; font: 500 14px/20px var(--font-mono); color: var(--ink-muted); }
.mt-news__card { display: flex; flex-direction: column; height: 100%; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-lg); overflow: hidden; }
.mt-news__brand { display: flex; align-items: center; gap: var(--space-2); height: 48px; overflow: hidden; padding: 6px var(--space-3); background: #fff; border-bottom: 1px solid var(--line); font-size: 12px; line-height: 15px; font-weight: 700; color: var(--ink); }
.mt-news__brand img { height: 24px; width: auto; max-width: 64px; object-fit: contain; flex: none; }
.mt-news__card > .mt-photo { border-radius: 0; }
.mt-news__body { display: flex; flex-direction: column; gap: 4px; padding: var(--space-3); flex: 1; }
.mt-news__title { font-size: 14px; line-height: 19px; font-weight: 700; }
.mt-news__meta { font: 500 11px/16px var(--font-mono); color: var(--ink-muted); }
.mt-news__link { display: inline-flex; align-items: center; gap: 4px; align-self: flex-start; min-height: 40px; margin-top: auto; font-weight: 600; font-size: 14px; color: var(--primary); text-decoration: underline; text-underline-offset: 3px; }
.mt-news__link:focus-visible { outline: 2px solid var(--focus-ring); outline-offset: 2px; border-radius: var(--radius-sm); }
.mt-news__link .mt-ic { width: 16px; height: 16px; }
.mt-news__src { margin-top: auto; padding-top: var(--space-2); font-size: 12px; line-height: 16px; color: var(--ink-muted); }
.mt-credits { margin-top: var(--space-3); font-size: 12px; line-height: 18px; color: var(--ink-muted); }
.mt-credits summary { cursor: pointer; min-height: 32px; display: inline-flex; align-items: center; font-weight: 600; }
.mt-credits ul { margin: var(--space-1) 0; padding-left: var(--space-4); }
.mt-credits a { color: inherit; }
@media (max-width: 359px) {
  .mt-news__brand { padding: 6px var(--space-2); font-size: 11px; line-height: 14px; gap: 6px; }
  .mt-news__brand img { height: 20px; max-width: 48px; }
  .mt-news__body { padding: var(--space-2); }
  .mt-news__title { font-size: 13px; line-height: 18px; }
  .mt-news__meta { font-size: 10px; line-height: 14px; }
}
@media (min-width: 900px) {
  .mt-rail { gap: var(--space-5); grid-auto-columns: calc((100% - var(--space-5)) / 2); }
  .mt-news__brand { height: 56px; padding: 8px var(--space-4); font-size: 14px; }
  .mt-news__brand img { height: 30px; max-width: 110px; }
  .mt-news__body { padding: var(--space-4); }
  .mt-news__title { font-size: 17px; line-height: 23px; }
  .mt-news__meta { font-size: 12px; }
  .mt-rail-bar { justify-content: flex-end; }
}
@media (min-width: 1024px) { .mt-rail { grid-auto-columns: calc((100% - 2 * var(--space-5)) / 3); } }
}

/* ---------- About + plantation distribution map ---------- */
.mt-about { display: grid; gap: var(--space-5); }
.mt-about__copy p:not(.mt-eyebrow):not(.mt-stat) { color: var(--ink-muted); }
.mt-stat { display: flex; align-items: center; gap: var(--space-3); margin-top: var(--space-4); }
.mt-stat strong { font-size: 48px; line-height: 1; font-weight: 800; letter-spacing: -0.02em; color: var(--primary); }
.mt-stat span { font-size: 16px; line-height: 21px; font-weight: 700; color: var(--ink); }
.mt-stat small { display: block; margin-top: 2px; font-size: 12px; line-height: 16px; font-weight: 500; color: var(--ink-muted); }
.mt-ph-text { color: var(--placeholder-ink); background: var(--placeholder-bg); border-radius: var(--radius-sm); padding: 0 6px; }
.mt-map { margin: 0; }
.mt-map__frame { padding: var(--space-3); background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-lg); }
.mt-map__frame img { width: 100%; height: auto; }
.mt-map figcaption { margin-top: var(--space-2); font-size: 11px; line-height: 16px; color: var(--ink-muted); }
.mt-map figcaption a { color: inherit; }
@media (min-width: 900px) { .mt-about { grid-template-columns: 4fr 7fr; gap: var(--space-12); align-items: center; } .mt-stat strong { font-size: 64px; } }

/* ---------- Partnerships: eight light cards, each with an outlined contact button ---------- */
.mt-partners2 { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-3); }
.mt-partner2 { display: flex; flex-direction: column; gap: 4px; padding: var(--space-4) var(--space-3) var(--space-3); background: var(--surface); border: 1px solid var(--stone-200); border-radius: var(--radius-md); min-width: 0; }
.mt-partner2__ic.mt-ic { width: 24px; height: 24px; margin-bottom: var(--space-1); color: var(--olive-900); }
.mt-partner2__ic svg { stroke-width: 1.5; }
.mt-partner2 h3 { font-size: 15px; line-height: 20px; font-weight: 700; }
.mt-partner2 p { font-size: 13px; line-height: 18px; color: var(--ink-muted); margin-bottom: var(--space-3); }
/* Quieter outlined variant: buyer CTAs elsewhere stay solid green */
.mt-btn--outline { margin-top: auto; width: 100%; min-height: 48px; padding: 0 6px; gap: 6px; background: var(--surface); color: var(--olive-900); border: 1.5px solid var(--olive-700); font-size: 15px; white-space: nowrap; }
.mt-btn--outline .mt-ic { width: 18px; height: 18px; color: #1DA851; }
.mt-btn--outline:hover { background: var(--olive-100); }
.mt-btn--outline:active { background: var(--stone-200); }
@media (min-width: 900px) {
  .mt-partners2 { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--space-5); }
  .mt-partner2 { padding: var(--space-5); }
  .mt-partner2 h3 { font-size: 17px; line-height: 23px; }
  .mt-partner2 p { font-size: 14px; line-height: 20px; }
  .mt-btn--outline { font-size: 16px; }
}

/* ---------- Footer ---------- */
.mt-footer li a.mt-footer__social { justify-content: center; width: 44px; height: 44px; min-height: 44px; margin-left: -10px; border-radius: var(--radius-pill); }
.mt-footer li a.mt-footer__social .mt-ic { width: 24px; height: 24px; }
.mt-footer li a.mt-footer__social:hover { background: rgba(244, 241, 232, .1); text-decoration: none; }
.mt-footer { background: var(--surface-deep); color: var(--ink-inverse); padding: var(--space-10) 0 var(--space-24); font-size: 14px; line-height: 22px; }
.mt-footer .mt-logo { color: var(--ink-inverse); }
.mt-footer__grid { display: grid; gap: var(--space-6); }
.mt-footer__grid > div:nth-child(2) ul { display: grid; grid-template-columns: 1fr 1fr; column-gap: var(--space-4); }
@media (min-width: 900px) { .mt-footer__grid > div:nth-child(2) ul { display: block; } }
.mt-footer h3 { font-size: 13px; line-height: 16px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--accent-on-dark); margin-bottom: var(--space-3); }
.mt-footer ul { list-style: none; margin: 0; padding: 0; }
.mt-footer li a, .mt-footer li span { display: inline-flex; align-items: center; min-height: 40px; gap: var(--space-2); color: var(--ink-inverse-muted); text-decoration: none; }
.mt-footer li a:hover { color: var(--ink-inverse); text-decoration: underline; }
.mt-footer a:focus-visible { outline: 2px solid var(--focus-ring-inverse); outline-offset: 2px; }
.mt-footer__legal { margin-top: var(--space-8); padding-top: var(--space-6); border-top: 1px solid var(--line-inverse); color: var(--ink-inverse-muted); display: flex; flex-direction: column; gap: var(--space-2); }
.mt-footer .mt-ph-text { background: var(--line-inverse); color: var(--ink-inverse); }
@media (min-width: 900px) { .mt-footer { padding-bottom: var(--space-12); } .mt-footer__grid { grid-template-columns: 2fr 1fr 1.4fr; } .mt-footer__legal { flex-direction: row; justify-content: space-between; } }

/* ---------- Sticky WhatsApp (mobile) ---------- */
.mt-sticky-wa { position: fixed; right: var(--space-6); bottom: calc(var(--space-4) + env(safe-area-inset-bottom, 0px)); z-index: 30; display: inline-flex; align-items: center; gap: var(--space-2); min-height: var(--size-tap-lg); padding: 0 var(--space-5) 0 var(--space-4); border: 0; border-radius: var(--radius-pill); background: var(--whatsapp); color: var(--on-whatsapp); font: 600 16px/20px var(--font-sans); box-shadow: var(--shadow-sticky); cursor: pointer; text-decoration: none; transform: translateY(0); opacity: 1; transition: transform .2s, opacity .2s; }
.mt-sticky-wa:hover { background: var(--whatsapp-hover); }
.mt-sticky-wa:active { background: var(--whatsapp-pressed); }
.mt-sticky-wa:focus-visible { outline: 2px solid var(--focus-ring); outline-offset: 3px; }
.mt-sticky-wa.is-hidden { transform: translateY(calc(100% + 24px)); opacity: 0; pointer-events: none; }
.mt-sticky-wa--static { position: static; }
@media (min-width: 900px) { .mt-sticky-wa:not(.mt-sticky-wa--static) { display: none; } }

/* ---------- Notice (WhatsApp not configured / message preview) ---------- */
.mt-notice { position: fixed; left: var(--space-4); right: var(--space-4); bottom: calc(var(--space-4) + 64px); z-index: 60; max-width: 440px; margin: 0 auto; padding: var(--space-4); background: var(--olive-900); color: var(--ink-inverse); border-radius: var(--radius-lg); box-shadow: var(--shadow-raised); font-size: 14px; line-height: 21px; }
.mt-notice strong { display: block; margin-bottom: var(--space-1); color: var(--accent-on-dark); }
.mt-notice q { display: block; margin-top: var(--space-2); padding: var(--space-2) var(--space-3); background: var(--olive-800); border-radius: var(--radius-md); quotes: none; color: var(--ink-inverse-muted); }

/* ---------- Site-only ---------- */
.mt-skip { position: absolute; left: var(--space-4); top: -100px; z-index: 100; padding: var(--space-3) var(--space-4); background: var(--olive-900); color: var(--ink-inverse); border-radius: var(--radius-md); font-weight: 600; text-decoration: none; }
.mt-skip:focus { top: var(--space-4); }
.mt-problems-reset { list-style: none; margin: 0; padding: 0; }

/* ---------- Phone overrides (kept last so they win over section defaults) ---------- */
/* Phones: one compact size for every contact button so the label stays on one line in half-width cards */
@media (max-width: 599px) {
  .mt-btn--wa, .mt-btn--wa.mt-btn--lg, .mt-hero .mt-btn--lg { font-size: 15px; gap: 6px; }
  .mt-btn--contact, .mt-svc .mt-btn--contact { padding: 0 6px; }
}
@media (max-width: 359px) { .mt-partners2 { grid-template-columns: 1fr; } }

/* Field challenges: four groups of three; mobile retains readable stacked cards. */
.mt-issues-group[hidden], .mt-issues-controls[hidden] { display: none; }
.mt-issues-viewport { min-width: 0; }
.mt-issues-group { animation: mt-issues-enter .35s ease-out; }
.mt-issues-controls { display:flex; align-items:center; justify-content:center; gap:12px; margin-top:24px; }
.mt-issues-controls .mt-rail-btn svg { width:20px; height:20px; }
.mt-issues-dots { display:flex; align-items:center; gap:2px; }
.mt-issues-dots button { display:grid; place-items:center; width:32px; height:44px; padding:0; border:0; background:transparent; cursor:pointer; }
.mt-issues-dots button::after { content:""; width:8px; height:8px; border-radius:99px; background:var(--line); transition:width .2s,background .2s; }
.mt-issues-dots button[aria-current="true"]::after { width:22px; background:var(--primary); }
.mt-issues-dots button:focus-visible { outline:2px solid var(--focus-ring); border-radius:12px; }
.mt-issues-count { text-align:center; margin-top:8px; font-size:12px; color:var(--ink-muted); }
.mt-issues-group .mt-issue { min-width:0; }
.mt-issues-group .mt-issue__body { min-height:92px; }
@media (min-width:1024px) { .mt-issues-group .mt-issue__body { min-height:120px; } }
@keyframes mt-issues-enter { from { opacity:.3; transform:translateY(5px); } to { opacity:1; transform:translateY(0); } }
@media (prefers-reduced-motion:reduce) { .mt-issues-group { animation:none; } .mt-issues-dots button::after { transition:none; } }

/* Fill the entire mobile challenge image cell, including taller text rows. */
@media (max-width:1023px) {
 .mt-issue { border:0; }
 .mt-issue__img { position:relative; aspect-ratio:auto; align-self:stretch; }
 .mt-issue__img img { position:absolute; inset:0; display:block; width:100%; height:100%; }
}
@media (max-width:899px) {
 .mt-hero__inner { padding-top:56px; padding-bottom:48px; }
 .mt-hero h1 { font-size:26px; line-height:34px; }
 .mt-hero__text { font-size:17px; line-height:27px; }
 .mt-hero__controls { margin-top:28px !important; }
 .mt-slide::after { background:linear-gradient(180deg,rgba(20,30,23,.55),rgba(20,30,23,.72)); }
}
@media (max-width:359px) {
 .mt-hero h1 { font-size:26px; line-height:34px; }
 .mt-svc__body { padding:20px; }
 .mt-svc__title { font-size:21px; line-height:29px; }
}

/* Compact service list in the hero. */
.mt-hero__services { padding-left:22px; margin-bottom:0; display:grid; gap:10px; font-size:17px; line-height:25px; color:var(--ink-inverse); text-shadow:0 1px 12px rgba(32,40,34,.45); }
.mt-hero__services li::marker { color:var(--accent-on-dark); }
.mt-hero__controls { margin-top:20px !important; }
.mt-hero__dots { margin-left:0; }
@media (min-width:900px) { .mt-hero__services { font-size:19px; line-height:28px; gap:10px; } }
@media (max-width:899px) {
 .mt-partners2 { grid-template-columns:minmax(0,1fr); gap:12px; }
 .mt-partner2 { display:grid; grid-template-columns:24px minmax(0,1fr) 44px; align-items:center; column-gap:12px; padding:14px 16px; }
 .mt-partner2__ic.mt-ic { margin:0; }
 .mt-partner2 h3 { font-size:16px; line-height:22px; white-space:nowrap; }
 .mt-partner2 p, .mt-partner2__contact-label { display:none; }
 .mt-partner2 .mt-btn { width:44px; min-height:44px; padding:0; margin:0; }
}
@media (max-width:359px) { .mt-partner2 { padding:12px; column-gap:10px; } .mt-partner2 h3 { font-size:15px; } .mt-hero__services { font-size:16px; } }

/* One compact challenge, moving horizontally, keeps services close by. */
#tantangan { padding-top:32px; padding-bottom:28px; }
#tantangan .mt-h2 { margin-bottom:20px; }
.mt-issues-viewport { overflow:hidden; border-radius:var(--radius-lg); touch-action:pan-y; }
.mt-issues-track { display:flex; list-style:none; margin:0; padding:0; transition:transform .4s ease; }
.mt-issues-track .mt-issue { flex:0 0 100%; width:100%; min-width:0; height:184px; display:grid; grid-template-columns:42% minmax(0,1fr); grid-template-rows:1fr; border:0; border-radius:0; }
.mt-issues-track .mt-issue__img { position:relative; aspect-ratio:auto; height:100%; }
.mt-issues-track .mt-issue__img img { position:absolute; inset:0; display:block; width:100%; height:100%; object-fit:cover; }
.mt-issues-track .mt-issue__body { min-height:0; padding:16px; justify-content:center; gap:8px; }
.mt-issues-track .mt-issue h3 { font-size:18px; line-height:24px; }
.mt-issues-track .mt-issue p { font-size:14px; line-height:21px; }
#tantangan .mt-issues-controls { margin-top:12px; gap:12px; }
#tantangan .mt-issues-count { margin:0; min-width:70px; }
@media (max-width:359px) { .mt-issues-track .mt-issue { height:196px; grid-template-columns:38% minmax(0,1fr); } .mt-issues-track .mt-issue__body { padding:12px; } .mt-issues-track .mt-issue h3 { font-size:17px; line-height:22px; } }
@media (min-width:900px) {
 #tantangan { padding-top:40px; padding-bottom:32px; }
 .mt-issues-viewport { max-width:900px; margin:0 auto; }
 .mt-issues-track .mt-issue { height:240px; grid-template-columns:42% minmax(0,1fr); }
 .mt-issues-track .mt-issue__body { padding:32px; }
 .mt-issues-track .mt-issue h3 { font-size:26px; line-height:34px; }
 .mt-issues-track .mt-issue p { font-size:17px; line-height:26px; }
}
@media (prefers-reduced-motion:reduce) { .mt-issues-track { transition:none; } }

/* Match the challenge banner to the service cards on desktop. */
@media (min-width:900px) {
 .mt-issues-viewport { max-width:none; width:100%; margin:0; }
 .mt-issues-track .mt-issue { height:300px; grid-template-columns:44% minmax(0,1fr); }
 .mt-issues-track .mt-issue__body { padding:36px; }
}
/* Continuous right-to-left company logos, clipped to the card rail width. */
.mt-logo-strip { overflow:hidden; max-width:calc(100% - 4px); margin:0 2px 24px; padding:18px 0; border:0; -webkit-mask-image:linear-gradient(to right,transparent,#000 9%,#000 91%,transparent); mask-image:linear-gradient(to right,transparent,#000 9%,#000 91%,transparent); }
.mt-logo-strip__track { display:flex; width:max-content; animation:mt-logo-travel 56s linear infinite; }
.mt-logo-strip__group { display:flex; flex:none; gap:32px; list-style:none; margin:0; padding:0 32px 0 0; align-items:center; }
.mt-logo-strip__group li { width:144px; height:56px; display:flex; align-items:center; justify-content:center; flex:none; }
.mt-logo-strip__group img { display:block; width:auto; height:auto; max-width:144px; max-height:48px; object-fit:contain; }
.mt-logo-strip:focus-visible .mt-logo-strip__track { animation-play-state:paused; }
.mt-logo-strip:hover .mt-logo-strip__track { animation-play-state:running; }
.mt-logo-strip:focus-visible { outline:2px solid var(--focus-ring); outline-offset:3px; }
.mt-footer li a.mt-footer__social { justify-content:flex-start; width:auto; gap:10px; margin-left:0; padding:0 10px 0 0; }
@keyframes mt-logo-travel { to { transform:translateX(-50%); } }
@media (max-width:599px) { .mt-logo-strip__group { gap:24px; padding-right:24px; } .mt-logo-strip__group li { width:112px; } .mt-logo-strip__group img { max-width:112px; max-height:40px; } }
@media (prefers-reduced-motion:reduce) { .mt-logo-strip { overflow-x:auto; } .mt-logo-strip__track { animation:none; } .mt-logo-strip__group[aria-hidden="true"] { display:none; } }
/* Feather and lightly soften the logos as they enter and leave. */
.mt-logo-strip { position:relative; }
.mt-logo-strip::before, .mt-logo-strip::after { content:""; position:absolute; z-index:1; top:0; bottom:0; width:9%; pointer-events:none; -webkit-backdrop-filter:blur(2px); backdrop-filter:blur(2px); }
.mt-logo-strip::before { left:0; -webkit-mask-image:linear-gradient(to right,#000,transparent); mask-image:linear-gradient(to right,#000,transparent); }
.mt-logo-strip::after { right:0; -webkit-mask-image:linear-gradient(to left,#000,transparent); mask-image:linear-gradient(to left,#000,transparent); }

/* Explain the partnership invitation and each partner's role on phones. */
.mt-partner-intro { max-width:64ch; margin:-8px 0 24px; color:var(--ink-muted); font-size:16px; line-height:26px; }
@media (max-width:899px) {
 .mt-partner2 { grid-template-areas:"icon title contact" "icon description contact"; row-gap:4px; }
 .mt-partner2__ic { grid-area:icon; }
 .mt-partner2 h3 { grid-area:title; }
 .mt-partner2 p { grid-area:description; display:block; margin:0; font-size:13px; line-height:19px; }
 .mt-partner2 .mt-btn { grid-area:contact; }
}

/* Continuous right-to-left challenges: pictures and titles only. */
.mt-challenge-slider { overflow:hidden; width:100%; }
.mt-challenge-slider__track { display:flex; width:max-content; animation:mt-challenges-travel 150s linear infinite; }
.mt-challenge-slider__group { display:flex; flex:none; gap:16px; list-style:none; margin:0; padding:0 16px 0 0; }
.mt-challenge { display:grid; grid-template-columns:minmax(0,1fr); grid-template-rows:168px 68px; width:280px; height:236px; flex:none; overflow:hidden; border-radius:var(--radius-lg); background:var(--surface); }
.mt-challenge__img { position:relative; height:100%; }
.mt-challenge__img img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block; }
.mt-challenge__body { display:flex; align-items:center; padding:12px 16px; }
.mt-challenge h3 { font-size:18px; line-height:25px; font-weight:700; }
.mt-challenge-slider:focus-within .mt-challenge-slider__track { animation-play-state:paused; }
.mt-challenge-slider:focus-visible { outline:2px solid var(--focus-ring); outline-offset:4px; }
@keyframes mt-challenges-travel { to { transform:translateX(-50%); } }
@media (min-width:900px) {
 .mt-challenge-slider__group { gap:24px; padding-right:24px; }
 .mt-challenge { width:384px; height:292px; grid-template-columns:minmax(0,1fr); grid-template-rows:216px 76px; }
 .mt-challenge__body { padding:14px 20px; }
 .mt-challenge h3 { font-size:21px; line-height:29px; }
}
@media (prefers-reduced-motion:reduce) {
 .mt-challenge-slider { overflow-x:auto; }
 .mt-challenge-slider__track { animation:none; }
 .mt-challenge-slider__group[aria-hidden="true"] { display:none; }
}

/* Let the challenges blend into the white services section. */
#tantangan { background:linear-gradient(180deg,var(--surface-alt) 0%,var(--surface-alt) 48%,var(--surface) 100%); padding-bottom:24px; }
#layanan { padding-top:24px; }

/* Defined card edges and a softly shaded title panel. */
.mt-challenge-slider { padding-top:6px; padding-bottom:20px; }
.mt-challenge { height:250px; grid-template-rows:168px minmax(0,1fr); border:1px solid var(--line); box-shadow:0 5px 14px rgba(29,29,31,.12); }
.mt-challenge__body { background:var(--surface); border-top:1px solid var(--line); }
@media (min-width:900px) { .mt-challenge { height:302px; grid-template-rows:216px minmax(0,1fr); } }

/* Plain card panels with one clear consequence for the plantation. */
.mt-challenge { height:320px; }
.mt-challenge__body { flex-direction:column; justify-content:center; align-items:flex-start; gap:8px; }
.mt-challenge p { margin:0; font-size:13px; line-height:19px; color:var(--ink-muted); }
@media (min-width:900px) { .mt-challenge { height:362px; } .mt-challenge p { font-size:15px; line-height:22px; } }

/* Gently feather cards and their shadows at both slider edges. */
.mt-challenge-slider { --challenge-edge:10px; -webkit-mask-image:linear-gradient(to right,transparent 0,#000 var(--challenge-edge),#000 calc(100% - var(--challenge-edge)),transparent 100%); mask-image:linear-gradient(to right,transparent 0,#000 var(--challenge-edge),#000 calc(100% - var(--challenge-edge)),transparent 100%); }
@media (min-width:900px) { .mt-challenge-slider { --challenge-edge:20px; } }
@media (prefers-reduced-motion:reduce) { .mt-challenge-slider { -webkit-mask-image:none; mask-image:none; } }

/* Light gray and white surfaces with the original gold and green accents. */
.mt-logo { color:var(--olive-700); }
.mt-btn--secondary:hover, .mt-rail-btn:hover { background:var(--olive-100); }
.mt-footer { background:var(--surface-alt); color:var(--ink); border-top:1px solid var(--line); }
.mt-footer .mt-logo { color:var(--olive-700); }
.mt-footer .mt-logo__m { padding:8px; background:var(--olive-700); border-radius:12px; }
.mt-footer h3 { color:var(--ink); }
.mt-footer li a, .mt-footer li span, .mt-footer__legal { color:var(--ink-muted); }
.mt-footer li a:hover, .mt-footer li a:hover span { color:var(--primary); }
.mt-footer__legal { border-top-color:var(--line); }
.mt-footer a:focus-visible { outline-color:var(--focus-ring); }
.mt-footer li a.mt-footer__social:hover { background:#E8E8ED; }

/* Transparent navigation over the hero; solid white once scrolling. */
.mt-header { position:fixed; left:0; right:0; width:100%; background:var(--surface); box-shadow:0 2px 12px rgba(29,29,31,.05); transition:background-color .2s ease,border-color .2s ease,box-shadow .2s ease; }
.mt-header.is-top:not(.is-menu-open) { background:transparent; border-bottom-color:transparent; box-shadow:none; }
.mt-header.is-top:not(.is-menu-open) .mt-logo, .mt-header.is-top:not(.is-menu-open) .mt-nav a, .mt-header.is-top:not(.is-menu-open) .mt-menu-btn { color:#fff; }
.mt-header.is-top:not(.is-menu-open) .mt-nav a:hover, .mt-header.is-top:not(.is-menu-open) .mt-menu-btn:hover { background:rgba(255,255,255,.12); }
.mt-header.is-top:not(.is-menu-open) a:focus-visible, .mt-header.is-top:not(.is-menu-open) button:focus-visible { outline-color:#fff; }
.mt-hero { padding-top:64px; }
.mt-hero::before { content:""; position:absolute; inset:0 0 auto; height:130px; z-index:1; pointer-events:none; background:linear-gradient(to bottom,rgba(15,25,20,.4),transparent); }
@media (min-width:900px) {
 :root { --size-header:72px; }
 .mt-hero { min-height:100vh; min-height:100svh; padding-top:72px; }
}

/* Olive footer matches the Moratano brand palette. */
.mt-footer { background:var(--olive-700); color:var(--ink-inverse); border-top:1px solid var(--olive-800); }
.mt-footer .mt-logo { color:var(--ink-inverse); }
.mt-footer h3 { color:var(--accent-on-dark); }
.mt-footer li a,.mt-footer li span,.mt-footer__legal { color:var(--ink-inverse-muted); }
.mt-footer li a:hover,.mt-footer li a:hover span { color:var(--white); }
.mt-footer__legal { border-top-color:#607460; }
.mt-footer a:focus-visible { outline-color:var(--focus-ring-inverse); }
.mt-footer li a.mt-footer__social:hover { background:rgba(255,255,255,.1); }

.mt-news__photo-credit { margin:0; padding:7px 12px; font-size:11px; line-height:1.5; color:var(--ink-muted); border-bottom:1px solid var(--line); }
.mt-news__photo-credit a { color:inherit; text-decoration:underline; text-underline-offset:2px; }
.mt-news__photo-credit a:focus-visible { outline:2px solid var(--focus-ring); outline-offset:2px; }

/* Fill every article image frame without portrait sidebars. */
.mt-news__card > .mt-photo img { width:100%; height:100%; object-fit:cover; }

/* Company marks retain their own visual identities. */
.mt-news__brand .mt-news__nt-logo { width:80px; max-width:80px; height:32px; object-fit:contain; object-position:center; }
.mt-logo-strip .mt-logo-strip__nt-logo { object-fit:contain; object-position:center; }
@media(max-width:560px) { .mt-news__brand .mt-news__nt-logo { width:48px; max-width:48px; height:24px; } }

.mt-news__summary { margin:3px 0 7px; font-size:13px; line-height:1.55; color:var(--ink-muted); }

/* Give every industry example the same image, summary and source layout. */
#industri .mt-partner-intro { max-width:76ch; margin:0 0 8px; }
#industri .mt-logo-strip { margin:0 2px 14px; padding:6px 0; }
#industri .mt-news__brand { height:56px; min-height:56px; gap:10px; }
#industri .mt-news__brand img { width:84px; height:32px; max-width:84px; object-fit:contain; }
#industri .mt-news__brand span { min-width:0; }
#industri .mt-news__photo-credit { display:flex; align-items:center; min-height:46px; padding:7px 14px; box-sizing:border-box; }
#industri .mt-news__body { gap:8px; }
#industri .mt-news__summary { margin:0; font-size:13px; line-height:1.6; }
#industri .mt-news__meta { margin:0; }
#industri .mt-news__link { padding-top:8px; }
@media (max-width:599px) {
 #industri .mt-rail--news { grid-auto-columns:calc(100% - 24px); gap:16px; }
 #industri .mt-news__brand { padding:8px 14px; font-size:13px; }
 #industri .mt-news__body { padding:16px; }
 #industri .mt-news__title { font-size:17px; line-height:1.4; }
 #industri .mt-news__summary { font-size:13px; }
 #industri .mt-logo-strip { margin-bottom:12px; padding:4px 0; }
 #industri .mt-partner-intro { font-size:14px; line-height:1.65; margin-bottom:4px; }
}

#industri .mt-news__title { min-height:2lh; }
#industri .mt-news__summary { min-height:4.8em; }

/* Blend the plantation hero into a soft sage canvas for the field challenges. */
.mt-hero::after {
 content:""; position:absolute; inset:auto 0 0; height:80px; z-index:1;
 pointer-events:none;
 background:linear-gradient(180deg,rgba(238,243,233,0) 0%,rgba(238,243,233,.12) 32%,rgba(238,243,233,.58) 72%,#eef3e9 100%);
}
#tantangan {
 background:linear-gradient(180deg,#eef3e9 0%,#f6f8f2 54%,#fff 100%);
}
#alur-kerja {
 background:linear-gradient(180deg,#fff 0%,#f4f7ef 40%,#f4f7ef 64%,#fff 100%);
}
@media (max-width:599px) {
 .mt-hero::after { height:56px; }
}