:root {
  --mn-ink: #2b1b12;
  --mn-ink-soft: #6c5547;
  --mn-paper: #fbf6ed;
  --mn-paper-deep: #f0e4d0;
  --mn-copper: #a94f2d;
  --mn-copper-dark: #71321f;
  --mn-hop: #536b3a;
  --mn-gold: #c58b36;
  --mn-line: #d8c6ad;
  --mn-shadow: 0 1rem 2.5rem rgba(43, 27, 18, .12);
  --mn-serif: Georgia, "Times New Roman", serif;
  --mn-sans: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --mn-mono: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
  --mn-max: 76rem;
  --mn-gutter: clamp(1rem, 3vw, 3rem);
}

*, *::before, *::after { box-sizing: border-box; }
html { color-scheme: light; scroll-behavior: smooth; }
body { margin: 0; background: var(--mn-paper); color: var(--mn-ink); font: 1rem/1.7 var(--mn-sans); }
img { display: block; max-width: 100%; height: auto; }
a { color: var(--mn-copper-dark); text-underline-offset: .18em; }
a:hover { color: var(--mn-copper); }
a:focus-visible { outline: 3px solid var(--mn-gold); outline-offset: 3px; }
h1, h2, h3 { color: var(--mn-ink); font-family: var(--mn-serif); line-height: 1.12; }
h1 { font-size: clamp(2.25rem, 5vw, 4.75rem); letter-spacing: -.035em; }
h2 { font-size: clamp(1.55rem, 2.8vw, 2.4rem); }
h3 { font-size: 1.3rem; }
p, ul, ol, figure, blockquote { margin: 0 0 1.25rem; }

.mn-cadre { width: min(100% - 2 * var(--mn-gutter), var(--mn-max)); margin-inline: auto; }
.mn-bandeau__rangee > * { min-width: 0; }
.mn-parcours { min-width: 0; }
.mn-bandeau { background: var(--mn-ink); color: var(--mn-paper); border-bottom: .35rem solid var(--mn-copper); }
.mn-bandeau__rangee { display: flex; align-items: center; justify-content: space-between; gap: 1.25rem 2rem; padding-block: 1.1rem; }
.mn-marque { display: inline-flex; flex-direction: column; color: var(--mn-paper); font: 700 1.35rem/1.05 var(--mn-serif); text-decoration: none; white-space: nowrap; }
.mn-marque span { margin-top: .35rem; color: #e6caa8; font: 500 .67rem/1.2 var(--mn-mono); letter-spacing: .08em; text-transform: uppercase; }
.mn-parcours ul { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: .55rem 1.1rem; margin: 0; padding: 0; list-style: none; }
.mn-parcours a { color: #f5e6ce; font-size: .9rem; text-decoration: none; }
.mn-parcours a:hover, .mn-parcours a[aria-current="page"] { color: #fff; text-decoration: underline; }

.mn-konten { min-height: 60vh; }
.mn-hero { position: relative; isolation: isolate; overflow: hidden; min-height: clamp(17rem, 24vw, 22rem); background: var(--mn-ink); }
.mn-hero::after { position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(43, 27, 18, .86), rgba(43, 27, 18, .4) 62%, rgba(43, 27, 18, .18)); content: ""; }
.mn-hero > img { position: absolute; z-index: -2; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.mn-hero > .mn-cadre { display: flex; align-items: flex-end; min-height: clamp(17rem, 24vw, 22rem); padding-block: clamp(2rem, 4vw, 3.25rem); }
.mn-hero__panel { max-width: 40rem; color: #fff9ee; }
.mn-hero__panel h1 { margin: .6rem 0 1rem; color: #fff9ee; }
.mn-hero__panel p { max-width: 34rem; font-size: clamp(1.05rem, 1.5vw, 1.35rem); }
.mn-encart__cle { display: inline-block; color: var(--mn-copper); font: 700 .73rem/1 var(--mn-mono); letter-spacing: .12em; text-transform: uppercase; }
.mn-hero .mn-encart__cle { color: #f0c36a; }

.mn-programme { padding-block: clamp(2.7rem, 6vw, 5.2rem); }
.mn-konten > .mn-cadre > .mn-programme:first-child { padding-top: clamp(2rem, 3.5vw, 3.6rem); }
.mn-programme + .mn-programme { border-top: 1px solid var(--mn-line); }
.mn-programme__titre { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; margin-bottom: 1.8rem; border-bottom: 2px solid var(--mn-ink); }
.mn-programme__titre h2 { margin: .35rem 0 .7rem; }
.mn-programme__resume { color: var(--mn-ink-soft); font: .78rem var(--mn-mono); }
.mn-entree { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; margin: 0; padding: 0; list-style: none; }
.mn-entree__kartu { display: flex; min-width: 0; flex-direction: column; border: 1px solid var(--mn-line); background: #fffdf8; box-shadow: var(--mn-shadow); }
.mn-entree__kartu img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; }
.mn-entree__kartu h2 { margin: 1rem 1rem .55rem; font-size: clamp(1.15rem, 1.7vw, 1.55rem); }
.mn-entree__kartu h2 a { color: var(--mn-ink); text-decoration-thickness: 1px; }
.mn-entree__kartu p { flex: 1; margin-inline: 1rem; color: var(--mn-ink-soft); font-size: .92rem; line-height: 1.55; }
.mn-entree__kartu small { display: block; margin: .8rem 1rem 1rem; color: var(--mn-hop); font: .72rem var(--mn-mono); letter-spacing: .04em; text-transform: uppercase; }
.mn-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; }
.mn-kategori { display: block; overflow: hidden; border: 1px solid var(--mn-line); color: var(--mn-paper); background: var(--mn-ink); text-decoration: none; }
.mn-kategori img { width: 100%; aspect-ratio: 7 / 5; object-fit: cover; opacity: .9; transition: transform .25s ease, opacity .25s ease; }
.mn-kategori:hover img { opacity: 1; transform: scale(1.03); }
.mn-kategori strong, .mn-kategori span { display: block; padding-inline: 1rem; }
.mn-kategori strong { padding-top: .85rem; font: 700 1.25rem var(--mn-serif); }
.mn-kategori span { padding-bottom: 1rem; color: #e6caa8; font: .72rem var(--mn-mono); }

.mn-fil { padding-block: 1.1rem; color: var(--mn-ink-soft); font-size: .8rem; }
.mn-fil__liste { display: flex; flex-wrap: wrap; gap: .35rem .7rem; margin: 0; padding: 0; list-style: none; }
.mn-fil__jalon + .mn-fil__jalon::before { margin-right: .7rem; color: var(--mn-gold); content: "/"; }
.mn-fil a { color: var(--mn-ink-soft); }
.mn-pupitre { max-width: 54rem; padding-block: clamp(2.5rem, 7vw, 5.5rem) 2rem; }
.mn-pupitre h1 { max-width: 18ch; margin: .65rem 0 1rem; font-size: clamp(2.35rem, 5vw, 4.45rem); }
.mn-chapeau { max-width: 45rem; color: var(--mn-ink-soft); font-size: clamp(1.05rem, 1.6vw, 1.3rem); }
.mn-programme__reperes { display: flex; flex-wrap: wrap; gap: .45rem 1rem; margin: 1.3rem 0 0; padding: 0; list-style: none; color: var(--mn-hop); font: .75rem var(--mn-mono); }
.mn-lecon { margin: 0 auto 2.2rem; max-width: 60rem; }
.mn-lecon > img, .mn-lecon > div > img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; }
.mn-lecon figcaption { margin-top: .65rem; color: var(--mn-ink-soft); font-size: .8rem; }
.mn-corps { max-width: 43rem; margin-inline: auto; font-size: 1.06rem; }
.mn-corps h2 { margin-top: 2.3rem; }
.mn-corps ol, .mn-corps ul { padding-left: 1.25rem; }
.mn-corps li + li { margin-top: .55rem; }
.mn-lecon--pasangan { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; max-width: 60rem; }
.mn-lecon--pasangan > div { min-width: 0; }
.mn-lecon--pasangan img { aspect-ratio: 1; }
.mn-retenir, .mn-encart { margin-block: 2rem; padding: 1.3rem 1.5rem; border-left: .35rem solid var(--mn-copper); background: var(--mn-paper-deep); }
.mn-retenir h2, .mn-encart h2 { margin-top: 0; font-size: 1.55rem; }
.mn-marge { margin: 2rem 0; padding: 1rem 1.2rem; border-block: 1px solid var(--mn-line); color: var(--mn-copper-dark); font: italic 1.3rem/1.4 var(--mn-serif); }
.mn-passerelle { margin-top: 3rem; padding-top: 1.5rem; border-top: 2px solid var(--mn-ink); }
.mn-passerelle h2 { margin-top: 0; font-size: 1.6rem; }
.mn-liens { margin-bottom: 1rem; padding-left: 1.1rem; }
.mn-tautan { display: inline-block; padding: .55rem .8rem; border: 1px solid var(--mn-copper); font-weight: 700; text-decoration: none; }

.mn-socle.mn-cadre { width: 100%; max-width: none; margin-inline: 0; padding-block: 3rem 1.5rem; background: var(--mn-ink); }
.mn-socle > .mn-bandeau__rangee, .mn-socle > .mn-mention { width: min(100% - 2 * var(--mn-gutter), var(--mn-max)); margin-inline: auto; }
.mn-socle > .mn-bandeau__rangee { display: grid; grid-template-columns: minmax(0, 1.45fr) repeat(2, minmax(0, 1fr)); align-items: start; gap: 2rem clamp(1.5rem, 4vw, 4rem); padding-block: 0 2rem; }
.mn-socle h2 { margin-top: 0; color: var(--mn-paper); font-size: 1.25rem; }
.mn-socle p, .mn-socle li { color: #e6caa8; font-size: .9rem; }
.mn-socle ul { margin: 0; padding: 0; list-style: none; }
.mn-socle a { color: #f0c36a; }
.mn-mention { margin: 0; padding-top: 1rem; border-top: 1px solid rgba(230, 202, 168, .35); color: #cbb18f; font: .72rem var(--mn-mono); }

@media (max-width: 64rem) {
  .mn-entree, .mn-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .mn-bandeau__rangee { align-items: flex-start; flex-direction: column; }
  .mn-parcours ul { justify-content: flex-start; }
  .mn-socle > .mn-bandeau__rangee { grid-template-columns: minmax(0, 1.35fr) minmax(0, .9fr); }
  .mn-socle > .mn-bandeau__rangee > div:first-child { grid-column: 1 / -1; }
  .mn-hero, .mn-hero > .mn-cadre { min-height: 20rem; }
}
@media (max-width: 46rem) {
  .mn-bandeau__rangee, .mn-socle .mn-bandeau__rangee { align-items: flex-start; flex-direction: column; }
  .mn-socle > .mn-bandeau__rangee { grid-template-columns: 1fr; }
  .mn-socle > .mn-bandeau__rangee > div:first-child { grid-column: auto; }
  .mn-parcours ul { justify-content: flex-start; }
  .mn-entree, .mn-grid, .mn-lecon--pasangan { grid-template-columns: 1fr; }
  .mn-hero, .mn-hero > .mn-cadre { min-height: 20rem; }
  .mn-hero::after { background: linear-gradient(180deg, rgba(43, 27, 18, .45), rgba(43, 27, 18, .88)); }
  .mn-programme__titre { align-items: flex-start; flex-direction: column; gap: 0; }
  .mn-pupitre h1 { font-size: clamp(2.25rem, 12vw, 3.6rem); }
  .mn-corps { font-size: 1rem; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition: none !important; }
}
