/* Marrakech Love · Bodoni Moda © 2020 The Bodoni Moda Project Authors, SIL Open Font License 1.1 (/assets/fonts/OFL-bodoni-moda.txt) */
:root {
  --paper: #f8f5f0;
  --sand: #ece5d8;
  --ink: #211e1a;
  --muted: #62594f;
  --rust: #922e27;
  --rust-dark: #70241f;
  --green: #173e39;
  --on-green-muted: #d4cbbd;
  --line: #cfc6b9;
  --control-border: #857a6d;
  --white: #ffffff;
  --s1: 8px; --s2: 16px; --s3: 24px; --s4: 32px;
  --s5: 48px; --s6: 64px; --s7: 96px; --s8: 128px;
  --t-1: 0.833rem;
  --t0: 1rem;
  --t1: 1.2rem;
  --t2: 1.44rem;
  --t3: 1.728rem;
  --t4: 2.074rem;
  --t5: 2.488rem;
  --t6: 2.986rem;
  --t7: 3.583rem;
  --t8: 4.3rem;
  --t9: 5.16rem;
  --font-display: "Bodoni Moda", Georgia, "Times New Roman", serif;
  --font-text: Georgia, "Iowan Old Style", "Times New Roman", serif;
  --font-ui: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --max-width: 1280px;
  --gutter: 16px;
  --measure: 65ch;
  --header-height: 88px;
  --radius: 0;
  --tap: 44px;
  --duration: 160ms;
}
@media (min-width: 760px) { :root { --gutter: 32px; --header-height: 104px; } }
@media (min-width: 1100px) { :root { --gutter: 48px; } }
@font-face {
  font-family: "Bodoni Moda";
  font-style: normal;
  font-display: swap;
  font-weight: 400 900;
  src: url("../fonts/bodoni-moda-latin-ext-opsz-normal.woff2") format("woff2-variations");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Bodoni Moda";
  font-style: normal;
  font-display: swap;
  font-weight: 400 900;
  src: url("../fonts/bodoni-moda-latin-opsz-normal.woff2") format("woff2-variations");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Bodoni Moda";
  font-style: italic;
  font-display: swap;
  font-weight: 400 900;
  src: url("../fonts/bodoni-moda-latin-ext-opsz-italic.woff2") format("woff2-variations");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Bodoni Moda";
  font-style: italic;
  font-display: swap;
  font-weight: 400 900;
  src: url("../fonts/bodoni-moda-latin-opsz-italic.woff2") format("woff2-variations");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; scroll-padding-top: var(--s3); }
body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font: var(--t0)/1.65 var(--font-text);
  overflow-wrap: break-word;
}
img, svg { max-width: 100%; height: auto; display: block; }
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; }
a, button, summary, select, input { touch-action: manipulation; }
h1, h2, h3, h4 {
  font-family: var(--font-display);
  font-weight: 500;
  line-height: 1.08;
  letter-spacing: -0.02em;
  margin: 0 0 var(--s3);
  text-wrap: balance;
}
h1 { font-size: clamp(var(--t6), 5.2vw, var(--t8)); letter-spacing: -0.035em; }
h2 { font-size: clamp(var(--t4), 3.2vw, var(--t5)); }
h3 { font-size: clamp(var(--t2), 2vw, var(--t3)); }
h4 { font-size: var(--t1); font-family: var(--font-ui); font-weight: 600; letter-spacing: 0; }
p, ul, ol, dl, figure, blockquote { margin: 0 0 var(--s3); }
ul, ol { padding-left: 1.25em; }
li + li { margin-top: var(--s1); }
em { font-style: italic; }
strong { font-weight: 700; }
small { font-size: var(--t-1); }
hr { border: 0; border-top: 1px solid var(--line); margin: var(--s5) 0; }
a { color: var(--rust); text-decoration-thickness: 1px; text-underline-offset: 0.2em; }
a:hover { color: var(--rust-dark); text-decoration-thickness: 2px; }
:focus-visible { outline: 3px solid var(--rust); outline-offset: 3px; }
.on-dark :focus-visible, .on-dark:focus-visible { outline-color: var(--paper); }
.skip-link {
  position: absolute; left: var(--s2); top: -200px; z-index: 100;
  background: var(--paper); color: var(--ink);
  padding: var(--s2) var(--s3); font: 600 var(--t0) var(--font-ui);
  border: 2px solid var(--rust);
}
.skip-link:focus { top: var(--s2); }
[hidden] { display: none !important; }
.visually-hidden {
  position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; border: 0;
}
.eyebrow {
  font: 600 var(--t-1)/1.4 var(--font-ui);
  letter-spacing: 0.13em; text-transform: uppercase;
  color: var(--muted); margin-bottom: var(--s2);
}
.eyebrow--accent { color: var(--rust); }
.meta { font: var(--t-1)/1.6 var(--font-ui); color: var(--muted); }
.pending { color: var(--muted); font-style: italic; }
@media (prefers-reduced-motion: no-preference) {
  html { scroll-behavior: smooth; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}
.wrap { width: min(var(--max-width), 100% - 2 * var(--gutter)); margin-inline: auto; }
.grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--s3); row-gap: var(--s4); }
.grid > * { grid-column: 1 / -1; }
@media (min-width: 760px) {
  .grid { column-gap: var(--s4); }
  .span-6 { grid-column: span 6; }
  .span-4 { grid-column: span 4; }
  .span-8 { grid-column: span 8; }
}
.section { padding-block: var(--s6); }
.section + .section { border-top: 1px solid var(--line); }
.section__head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: end; gap: var(--s3); margin-bottom: var(--s4); }
.section__head p { max-width: 50ch; margin: 0; color: var(--muted); }
.page-head { padding-block: var(--s5) var(--s4); max-width: 900px; }
.page-head .lede { font-size: var(--t1); max-width: 60ch; }
.article-layout { display: grid; gap: var(--s4); padding-bottom: var(--s6); }
.prose { max-width: var(--measure); font-size: var(--t0); min-width: 0; }
.article-layout > * { min-width: 0; }
.prose > section { scroll-margin-top: var(--s3); }
.prose h2 { margin-top: var(--s6); }
.prose h2:first-child { margin-top: 0; }
.prose h3 { margin-top: var(--s5); }
@media (min-width: 760px) { .prose { font-size: var(--t1); line-height: 1.6; } }
@media (min-width: 1100px) {
  .article-layout { grid-template-columns: minmax(200px, 1fr) minmax(0, var(--measure)) minmax(0, 0.5fr); gap: var(--s6); }
  .article-layout > .toc { position: sticky; top: var(--s3); align-self: start; }
}
.topline {
  background: var(--green); color: var(--paper);
  font: 500 var(--t-1)/1.5 var(--font-ui); letter-spacing: 0.08em; text-transform: uppercase;
  text-align: center; padding: var(--s1) var(--s2);
}
.brand { display: inline-flex; align-items: center; gap: 12px; color: var(--ink); text-decoration: none; min-height: var(--tap); }
.brand:hover { color: var(--ink); }
.brand__mark {
  flex: none; display: grid; place-items: center; width: 44px; height: 44px;
  border: 1px solid var(--rust); border-radius: 50%; color: var(--rust);
  font: 400 30px/1 var(--font-display); padding-bottom: 4px;
}
.brand__name { font: 700 clamp(20px, 2.2vw, 24px)/1 var(--font-display); letter-spacing: -0.03em; text-transform: lowercase; }
.brand__tagline { display: block; margin-top: 7px; font: 500 10px/1.2 var(--font-ui); letter-spacing: 0.17em; text-transform: uppercase; color: var(--muted); }
.site-header { border-bottom: 1px solid var(--line); }
.site-header__inner { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--s2) var(--s4); min-height: var(--header-height); padding-block: var(--s2); }
.site-nav ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 0 var(--s4); }
.site-nav li + li { margin-top: 0; }
.site-nav a, .site-nav .pending {
  display: inline-flex; align-items: center; min-height: var(--tap);
  font: 500 var(--t0)/1.2 var(--font-ui); color: var(--ink); text-decoration: none;
  border-bottom: 1px solid transparent;
}
.site-nav a:hover { border-bottom-color: var(--rust); color: var(--ink); }
.site-nav a[aria-current="page"] { border-bottom: 2px solid var(--rust); }
.site-nav .pending { color: var(--muted); font-weight: 400; }
.site-header__tools { display: flex; align-items: center; gap: var(--s2); }
.menu-toggle {
  display: none; align-items: center; gap: var(--s1); min-height: var(--tap); padding: 0 var(--s2);
  background: transparent; border: 1px solid var(--control-border);
  font: 600 var(--t-1)/1 var(--font-ui); letter-spacing: 0.08em; text-transform: uppercase;
}
.menu-toggle__icon, .menu-toggle__icon::before, .menu-toggle__icon::after { display: block; width: 16px; height: 2px; background: currentColor; }
.menu-toggle__icon { position: relative; }
.menu-toggle__icon::before, .menu-toggle__icon::after { content: ""; position: absolute; left: 0; }
.menu-toggle__icon::before { top: -5px; }
.menu-toggle__icon::after { top: 5px; }
.menu-toggle[aria-expanded="true"] .menu-toggle__icon { background: transparent; }
.menu-toggle[aria-expanded="true"] .menu-toggle__icon::before { top: 0; transform: rotate(45deg); }
.menu-toggle[aria-expanded="true"] .menu-toggle__icon::after { top: 0; transform: rotate(-45deg); }
@media (max-width: 759px) {
  .site-header__inner { flex-wrap: wrap; gap: var(--s2) 6px; }
  .site-header .brand { flex: 1 1 auto; min-width: 0; gap: 10px; white-space: nowrap; }
  .site-header .brand__mark { width: 40px; height: 40px; font-size: 27px; }
  .site-header .brand__name { font-size: 19px; }
  .site-header__tools { gap: 6px; order: 2; }
  .menu-toggle { order: 3; }
  .lang > summary, .menu-toggle { padding: 0 10px; }
  .topline { font-size: 11px; letter-spacing: 0.05em; }
  .site-nav { order: 4; flex-basis: 100%; }
  .site-nav ul { flex-direction: column; border-top: 1px solid var(--line); }
  .site-nav li { border-bottom: 1px solid var(--line); }
  .site-nav a, .site-nav .pending { width: 100%; min-height: 52px; }
  .js .menu-toggle { display: inline-flex; }
  .js .site-nav:not([data-open]) { display: none; }
}
@media (max-width: 479px) {
  .site-header .brand__tagline { display: none; }
}
@media (max-width: 379px) {
  .menu-toggle { min-width: var(--tap); justify-content: center; }
  .menu-toggle__label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }
}
.lang { position: relative; font: 500 var(--t-1)/1.2 var(--font-ui); }
.lang > summary {
  list-style: none; display: inline-flex; align-items: center; gap: var(--s1);
  min-height: var(--tap); padding: 0 var(--s2); border: 1px solid var(--control-border);
  cursor: pointer; letter-spacing: 0.06em; text-transform: uppercase;
}
.lang > summary::-webkit-details-marker { display: none; }
.lang > summary::after { content: ""; width: 7px; height: 7px; border-right: 1.5px solid; border-bottom: 1.5px solid; transform: translateY(-2px) rotate(45deg); }
.lang[open] > summary::after { transform: translateY(2px) rotate(-135deg); }
.lang__list {
  position: absolute; right: 0; top: calc(100% + 4px); z-index: 20; min-width: 220px;
  list-style: none; margin: 0; padding: var(--s1) 0; background: var(--paper);
  border: 1px solid var(--control-border); box-shadow: 0 8px 24px rgb(33 30 26 / 0.12);
}
.lang__list li + li { margin-top: 0; }
.lang__list a, .lang__list span { display: flex; justify-content: space-between; gap: var(--s2); align-items: center; min-height: var(--tap); padding: 0 var(--s2); color: var(--ink); text-decoration: none; }
.lang__list a:hover { background: var(--sand); }
.lang__list [aria-current="true"] { font-weight: 700; }
.lang__list [aria-current="true"]::after { content: "✓"; color: var(--rust); }
.lang__list .pending { font-style: normal; }
.lang__list small { color: var(--muted); }
.lang--single { display: inline-flex; align-items: center; min-height: var(--tap); letter-spacing: 0.06em; text-transform: uppercase; color: var(--muted); }
.breadcrumbs ol { list-style: none; display: flex; flex-wrap: wrap; margin: 0; padding: 0; font: var(--t-1)/1.5 var(--font-ui); color: var(--muted); }
.breadcrumbs li { display: flex; align-items: center; margin: 0; }
.breadcrumbs li + li::before { content: "/"; margin: 0 var(--s1); color: var(--line); }
.breadcrumbs a { color: var(--ink); padding-block: 12px; }
.breadcrumbs [aria-current="page"] { color: var(--muted); }
.button {
  display: inline-flex; align-items: center; justify-content: center; gap: var(--s2);
  min-height: 52px; padding: var(--s2) var(--s3);
  background: var(--rust); color: var(--white); border: 1px solid var(--rust);
  font: 600 var(--t0)/1.3 var(--font-ui); text-decoration: none; text-align: center;
  transition: background-color var(--duration), color var(--duration);
}
.button:hover { background: var(--rust-dark); border-color: var(--rust-dark); color: var(--white); text-decoration: none; }
.button--secondary { background: transparent; color: var(--ink); border-color: var(--control-border); }
.button--secondary:hover { background: var(--sand); color: var(--ink); border-color: var(--ink); }
.button--on-dark { background: var(--paper); color: var(--green); border-color: var(--paper); }
.button--on-dark:hover { background: var(--white); color: var(--green); }
.button[aria-disabled="true"] { background: transparent; color: var(--muted); border: 1px dashed var(--control-border); cursor: not-allowed; }
.button__ext { font-size: 1.1em; line-height: 1; }
.button-row { display: flex; flex-wrap: wrap; gap: var(--s2); align-items: center; }
.link-arrow {
  display: inline-flex; align-items: center; gap: var(--s2); min-height: var(--tap);
  font: 600 var(--t0)/1.3 var(--font-ui); color: var(--rust); text-decoration: none;
  border-bottom: 1px solid var(--rust);
}
.link-arrow::after { content: "→"; transition: transform var(--duration); }
.link-arrow:hover::after { transform: translateX(4px); }
.hero { display: grid; gap: var(--s4); padding-block: var(--s5); align-items: center; }
.hero__title { font: 500 clamp(var(--t7), 7vw, var(--t9))/1.02 var(--font-display); letter-spacing: -0.035em; margin-bottom: var(--s3); }
.hero__title em { color: var(--rust); }
.hero__lede { font-size: var(--t1); max-width: 39ch; }
.hero__media img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; }
@media (min-width: 900px) { .hero { grid-template-columns: 1fr 1.08fr; gap: var(--s6); padding-block: var(--s6) var(--s5); } .hero__media img { aspect-ratio: 4 / 3.6; } }
.toc { font-family: var(--font-ui); border-top: 1px solid var(--rust); padding-top: var(--s2); }
.toc__title { font: 600 var(--t-1)/1.4 var(--font-ui); letter-spacing: 0.13em; text-transform: uppercase; color: var(--muted); margin: 0 0 var(--s1); }
.toc ol { list-style: none; margin: 0; padding: 0; counter-reset: toc; }
.toc li { counter-increment: toc; margin: 0; border-bottom: 1px solid var(--line); }
.toc a { display: flex; gap: var(--s2); padding: 12px 0; min-height: var(--tap); color: var(--ink); text-decoration: none; font-size: var(--t0); line-height: 1.35; }
.toc a::before { content: counter(toc, decimal-leading-zero); color: var(--rust); font-size: var(--t-1); padding-top: 2px; }
.toc a:hover { color: var(--rust); }
.cards { display: grid; gap: var(--s5) var(--s4); list-style: none; margin: 0; padding: 0; }
.cards > li { margin: 0; }
@media (min-width: 760px) { .cards { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1100px) { .cards--3 { grid-template-columns: repeat(3, 1fr); } }
.card { position: relative; display: flex; flex-direction: column; height: 100%; }
.card__media { margin: 0 0 var(--s2); }
.card__media img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; }
.card__title { font-size: var(--t3); margin-bottom: var(--s2); }
.card__title a { color: var(--ink); text-decoration: none; }
.card__title a::after { content: ""; position: absolute; inset: 0; }
.card__title a:hover { color: var(--rust); }
.card:focus-within { outline: 3px solid var(--rust); outline-offset: 6px; }
.card__title a:focus-visible { outline: none; }
.card__text { color: var(--ink); font-size: var(--t0); }
.card__meta { margin-top: auto; }
.card--pending .card__title { color: var(--muted); }
.card__credit { position: relative; z-index: 1; }
.figure { margin: 0 0 var(--s4); }
.figure img { width: 100%; }
.figure figcaption, .credit { font: var(--t-1)/1.6 var(--font-ui); color: var(--muted); margin-top: var(--s1); }
.credit a { color: var(--muted); }
.credit a:hover { color: var(--ink); }
.credit__note { display: block; }
.credits-list { list-style: none; padding: 0; margin: 0; }
.credits-list li { display: grid; gap: var(--s2); padding: var(--s3) 0; border-top: 1px solid var(--line); margin: 0; }
@media (min-width: 760px) { .credits-list li { grid-template-columns: 160px 1fr; gap: var(--s3); } }
.credits-list img { width: 160px; aspect-ratio: 3 / 2; object-fit: cover; }
.credits-list h3 { font-size: var(--t2); margin-bottom: var(--s1); }
.table-block { margin: var(--s4) 0; }
.table-scroll { overflow-x: auto; border: 1px solid var(--line); background: var(--paper); }
.table-scroll:focus-visible { outline-offset: 2px; }
.compare { border-collapse: collapse; width: 100%; min-width: 900px; font: var(--t-1)/1.55 var(--font-ui); }
.table-title { font: 500 var(--t2)/1.2 var(--font-display); margin-bottom: var(--s2); }
.compare th, .compare td { text-align: left; vertical-align: top; padding: var(--s2); border-bottom: 1px solid var(--line); }
.compare td { min-width: 140px; }
.compare td:last-child { min-width: 200px; }
.compare thead th { white-space: nowrap; background: var(--sand); font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; font-size: 12px; }
.compare tbody th { font: 600 var(--t0)/1.35 var(--font-ui); position: sticky; left: 0; background: var(--paper); box-shadow: 1px 0 0 var(--line); min-width: 160px; }
.compare thead th:first-child { position: sticky; left: 0; z-index: 1; }
.compare ul { margin: 0; padding-left: 1.1em; }
.compare li + li { margin-top: 4px; }
.table-hint { font: var(--t-1)/1.5 var(--font-ui); color: var(--muted); margin-top: var(--s1); }
@media (min-width: 1000px) { .table-hint { display: none; } }
.value-unknown { color: var(--muted); font-style: italic; }
.notice { font: var(--t0)/1.6 var(--font-ui); border-left: 3px solid var(--rust); background: var(--sand); padding: var(--s2) var(--s3); margin: 0 0 var(--s4); }
.notice > :last-child { margin-bottom: 0; }
.notice__title { display: block; font-weight: 700; margin-bottom: 4px; }
.notice--info { border-left-color: var(--green); }
.disclosure { display: flex; gap: var(--s2); align-items: flex-start; font: var(--t-1)/1.6 var(--font-ui); border: 1px solid var(--line); border-left: 3px solid var(--green); padding: var(--s2) var(--s3); margin: 0 0 var(--s4); background: var(--paper); }
.disclosure__label { flex: none; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--green); }
.disclosure p { margin: 0; }
.byline { display: flex; flex-wrap: wrap; gap: var(--s1) var(--s4); font: var(--t-1)/1.6 var(--font-ui); color: var(--muted); border-block: 1px solid var(--line); padding-block: var(--s2); margin-bottom: var(--s4); }
.byline dl { display: contents; }
.byline div { display: flex; gap: 6px; }
.byline dt { font-weight: 600; color: var(--ink); }
.byline dd { margin: 0; }
.faq details { border-bottom: 1px solid var(--line); }
.faq details:first-child { border-top: 1px solid var(--line); }
.faq summary { display: flex; justify-content: space-between; gap: var(--s2); align-items: center; min-height: 56px; padding: var(--s2) 0; cursor: pointer; font: 600 var(--t0)/1.4 var(--font-ui); list-style: none; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; font: 400 24px/1 var(--font-ui); color: var(--rust); }
.faq details[open] summary::after { content: "−"; }
.faq details > :not(summary) { padding-bottom: var(--s2); }
.site-footer { background: var(--sand); margin-top: var(--s6); padding: var(--s6) 0 var(--s4); font-family: var(--font-ui); }
.site-footer__top { display: grid; gap: var(--s4); }
@media (min-width: 760px) { .site-footer__top { grid-template-columns: 1.2fr 1fr; } }
.site-footer__note { font-size: var(--t-1); line-height: 1.8; max-width: 60ch; color: var(--ink); margin-top: var(--s3); }
.site-footer__nav ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 0 var(--s3); }
.site-footer__nav li { margin: 0; }
.site-footer__nav a { display: inline-flex; align-items: center; min-height: var(--tap); color: var(--ink); font-size: var(--t-1); }
.site-footer__fine { border-top: 1px solid var(--line); margin-top: var(--s4); padding-top: var(--s3); font-size: 12px; color: var(--muted); display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--s2); }
.preview-banner { background: var(--rust); color: var(--white); font: 600 12px/1.5 var(--font-ui); text-align: center; padding: var(--s1) var(--s2); letter-spacing: 0.06em; }
.sg-section { padding-block: var(--s5); border-top: 1px solid var(--line); }
.sg-label { font: 600 12px/1.4 var(--font-ui); letter-spacing: 0.1em; text-transform: uppercase; color: var(--green); margin-bottom: var(--s3); }
.sg-swatches { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: var(--s2); list-style: none; padding: 0; }
.sg-swatches li { margin: 0; border: 1px solid var(--line); font: var(--t-1)/1.5 var(--font-ui); }
.sg-swatches span { display: block; height: 72px; }
.sg-swatches p { margin: 0; padding: var(--s1) 12px; }
.sg-scale p { margin: 0 0 var(--s2); font-family: var(--font-display); line-height: 1.1; }
.sg-scale small { font: var(--t-1) var(--font-ui); color: var(--muted); margin-left: var(--s2); }
.sg-demo-dark { background: var(--green); color: var(--paper); padding: var(--s4); }
.root { padding-block: var(--s6); max-width: 760px; }
.root__title { font-size: clamp(var(--t6), 6vw, var(--t8)); text-transform: lowercase; }
.root-list { list-style: none; padding: 0; margin: var(--s4) 0 0; border-top: 1px solid var(--line); }
.root-list li { margin: 0; border-bottom: 1px solid var(--line); }
.root-choice { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: var(--s1) var(--s3); padding: var(--s3) 0; min-height: var(--tap); color: var(--ink); text-decoration: none; }
.root-choice:hover { color: var(--rust); }
.root-choice__name { font: 500 var(--t4)/1.1 var(--font-display); }
.root-choice__tagline { font: italic var(--t1)/1.3 var(--font-text); color: var(--muted); }
.notfound { padding-block: var(--s6); max-width: 760px; }
.internal-links { list-style: none; padding: 0; margin: 0 0 var(--s4); border-top: 1px solid var(--line); font-family: var(--font-ui); }
.internal-links li { margin: 0; border-bottom: 1px solid var(--line); }
.internal-links a, .internal-links .pending { display: flex; align-items: center; min-height: 52px; padding: var(--s1) 0; }
.section__title { font-size: var(--t4); }
.hero--home .hero__title em { display: block; font-style: italic; }
.hero--home .eyebrow { margin-bottom: var(--s2); }
.hero__note { font: var(--t-1)/1.5 var(--font-ui); color: var(--muted); max-width: 52ch; margin-top: var(--s3); }
.paths { list-style: none; margin: var(--s4) 0 0; padding: 0; display: grid; gap: var(--s2); }
@media (min-width: 560px) { .paths { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.path {
  display: grid; grid-template-columns: auto 1fr auto; grid-template-areas: "n title arrow" "n text arrow";
  column-gap: var(--s2); row-gap: 4px; align-items: start; height: 100%;
  min-height: var(--tap); padding: var(--s2) var(--s3) var(--s3) var(--s2);
  border: 1px solid var(--control-border); background: var(--white); color: var(--ink); text-decoration: none;
  transition: border-color var(--duration), background var(--duration);
}
.path:hover { border-color: var(--rust); background: var(--paper); color: var(--ink); text-decoration: none; }
.paths li:first-child .path { background: var(--rust); border-color: var(--rust); color: var(--white); }
.paths li:first-child .path:hover { background: var(--rust-dark); border-color: var(--rust-dark); }
.paths li:first-child .path .path__text, .paths li:first-child .path .path__n { color: var(--white); }
.path__n { grid-area: n; font: 600 var(--t-1)/1.6 var(--font-ui); letter-spacing: .08em; color: var(--rust); }
.path__title { grid-area: title; font: 500 var(--t2)/1.15 var(--font-display); }
.path__text { grid-area: text; font: var(--t-1)/1.45 var(--font-ui); color: var(--muted); }
.path__arrow { grid-area: arrow; font: var(--t2)/1 var(--font-ui); align-self: center; transition: transform var(--duration); }
.path:hover .path__arrow { transform: translateY(3px); }
.home-section .section__head { margin-bottom: var(--s5); }
.home-section .section__title { max-width: 18ch; }
.home-section > * + * { margin-top: var(--s5); }
.cards--2 { grid-template-columns: 1fr; }
@media (min-width: 760px) { .cards--2 { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1100px) { .cards--4 { grid-template-columns: repeat(4, 1fr); } }
.checklist { background: var(--sand); padding: var(--s4) var(--s3); }
@media (min-width: 760px) { .checklist { padding: var(--s4) var(--s5); } }
.checklist__title { font-size: var(--t2); margin-bottom: var(--s2); }
.checks { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--s2); }
@media (min-width: 900px) { .checks { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--s5); } }
.checks li { position: relative; padding-left: var(--s4); max-width: 60ch; }
.checks li::before { content: ""; position: absolute; left: 4px; top: .45em; width: 12px; height: 7px;
  border-left: 2px solid var(--green); border-bottom: 2px solid var(--green); transform: rotate(-45deg); }
.steps { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--s4); counter-reset: none; }
@media (min-width: 760px) { .steps { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1100px) { .steps { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.step { border-top: 2px solid var(--ink); padding-top: var(--s2); }
.step__n { display: block; font: 600 var(--t-1)/1.6 var(--font-ui); letter-spacing: .08em; color: var(--rust); margin-bottom: var(--s1); }
.step__title { font-size: var(--t2); margin-bottom: var(--s1); }
.step p { margin: 0; }
.advisor { background: var(--green); color: var(--paper); padding: var(--s4) var(--s3); }
@media (min-width: 760px) { .advisor { padding: var(--s5); } }
.advisor :focus-visible { outline-color: var(--paper); }
.advisor a { color: var(--paper); }
.advisor .pending { color: var(--on-green-muted); }
.advisor__form { display: grid; gap: var(--s4); }
@media (min-width: 900px) { .advisor__form { grid-template-columns: 1fr 1fr; } .advisor__actions { grid-column: 1 / -1; } }
.advisor__q { border: 0; margin: 0; padding: 0; min-width: 0; }
.advisor__q legend { font: 500 var(--t2)/1.2 var(--font-display); margin-bottom: var(--s2); padding: 0; }
.chips { display: flex; flex-wrap: wrap; gap: var(--s1); }
.chip { display: inline-flex; align-items: center; gap: var(--s1); min-height: var(--tap); padding: 6px var(--s2);
  border: 1px solid var(--on-green-muted); font: var(--t0)/1.3 var(--font-ui); cursor: pointer; }
.chip input { accent-color: var(--rust); width: 18px; height: 18px; margin: 0; }
.chip:hover { border-color: var(--paper); }
.chip:has(input:checked) { background: var(--paper); color: var(--green); border-color: var(--paper); }
.chip:has(input:focus-visible) { outline: 3px solid var(--paper); outline-offset: 3px; }
.chip input:focus-visible { outline: none; }
.advisor__actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s2); }
.advisor .button { background: var(--paper); color: var(--green); border-color: var(--paper); }
.advisor .button:hover { background: var(--white); color: var(--green); }
.advisor__error { margin: 0; font: var(--t0)/1.4 var(--font-ui); color: var(--paper); border-left: 3px solid var(--paper); padding-left: var(--s1); }
.advisor__result { margin-top: var(--s4); padding-top: var(--s4); border-top: 1px solid var(--on-green-muted); }
.advisor__result:focus { outline: none; }
.advisor__result:focus-visible { outline: 3px solid var(--paper); outline-offset: 6px; }
.advisor__result-title { font-size: var(--t3); margin-bottom: var(--s3); }
.advisor__all { margin-top: var(--s4); }
.advisor__all > summary { cursor: pointer; font: 600 var(--t0)/1.4 var(--font-ui); min-height: var(--tap); display: flex; align-items: center; }
.advisor__group { font-size: var(--t2); margin: var(--s4) 0 var(--s2); }
.advice-list { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--s3); }
@media (min-width: 900px) { .advice-list { grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); } }
.advice { border-top: 1px solid var(--on-green-muted); padding-top: var(--s2); }
.advice__title { font: 500 var(--t1)/1.25 var(--font-display); margin-bottom: var(--s1); }
.advice p { margin: 0 0 var(--s1); }
.advice__links { list-style: none; margin: 0; padding: 0; }
.advice__links li { margin: 0; }
.advice__links a, .advice__links .pending { display: inline-flex; align-items: center; min-height: var(--tap); }
.advisor__note { color: var(--on-green-muted); margin: var(--s4) 0 0; }
.checks > li, .steps > li, .advice-list > li, .paths > li { margin: 0; }
.card:not(:has(.card__media)) { border-top: 2px solid var(--ink); padding-top: var(--s2); }
.card--pending:not(:has(.card__media)) { border-top-color: var(--control-border); }
.prose > section + section { margin-top: var(--s6); }
.prose .cards--3 { grid-template-columns: 1fr; gap: var(--s4); }
@media (min-width: 760px) { .prose .cards--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.prose .card__title { font-size: var(--t2); }
.summary { background: var(--sand); border-left: 3px solid var(--green); padding: var(--s3); margin: 0 0 var(--s4); }
.summary__title { font-size: var(--t1); margin: 0 0 var(--s1) !important; font-family: var(--font-ui); font-weight: 700; letter-spacing: .02em; }
.summary ul { margin: 0; padding-left: 1.2em; }
.summary li + li { margin-top: var(--s1); }
.places { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--s4); }
.places > li { margin: 0; }
.place { border-top: 1px solid var(--line); padding-top: var(--s2); scroll-margin-top: var(--s3); }
.place .eyebrow { margin-bottom: 4px; }
.place__name { margin: 0 0 var(--s1) !important; font-size: var(--t2); }
.place p { margin: 0 0 var(--s1); }
.place:target { background: var(--sand); box-shadow: 0 0 0 var(--s1) var(--sand); }
.facts { list-style: none; margin: var(--s1) 0 0; padding: 0; font: var(--t0)/1.5 var(--font-ui); }
.day__summary { font-style: italic; }
.route { list-style: none; margin: var(--s3) 0; padding: 0; border-left: 2px solid var(--ink); }
.route > li { margin: 0; }
.route__step { position: relative; padding: 0 0 var(--s4) var(--s4); }
.route__step::before { content: ""; position: absolute; left: -7px; top: .35em; width: 12px; height: 12px; border-radius: 50%; background: var(--paper); border: 2px solid var(--ink); }
.route__step--optional::before { border-style: dashed; border-color: var(--control-border); }
.route__step:last-child { padding-bottom: 0; }
.route__part { font: 600 var(--t-1)/1.5 var(--font-ui); letter-spacing: .08em; text-transform: uppercase; color: var(--rust); margin: 0 0 4px; }
.route__badge { display: inline-block; margin-left: var(--s1); padding: 0 6px; border: 1px solid var(--control-border); color: var(--muted); letter-spacing: .04em; font-weight: 600; }
.route__title { margin: 0 0 4px !important; font-size: var(--t2); }
.route__step p { margin: 0 0 var(--s1); }
.route__places { font: var(--t0)/1.5 var(--font-ui); color: var(--muted); }
.route__places span { font-weight: 600; }
.day__margin { font: var(--t0)/1.6 var(--font-ui); border-top: 1px solid var(--line); padding-top: var(--s2); }
.alts { margin: var(--s3) 0 0; }
.alts__label { font: 700 var(--t-1)/1.5 var(--font-ui); letter-spacing: .08em; text-transform: uppercase; color: var(--green); margin: var(--s4) 0 var(--s2); }
.alts ul { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--s2); }
.alts li { margin: 0; border-left: 2px solid var(--line); padding-left: var(--s2); }
.alt__title { font-size: var(--t1) !important; margin: 0 0 4px !important; }
.alts li p { margin: 0 0 4px; }
.practical { margin: 0; font: var(--t0)/1.6 var(--font-ui); }
.practical > div { padding: var(--s2) 0; border-bottom: 1px solid var(--line); }
.practical dt { font-weight: 700; }
.practical dd { margin: 0; }
.practical .pending dd { color: var(--muted); }
.notice--warning { border-left-color: var(--rust); background: var(--paper); border: 1px solid var(--line); border-left: 3px solid var(--rust); }
.activities { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--s3); }
.activity { border: 1px solid var(--line); padding: var(--s3); }
.activity__title { margin: 0 0 var(--s1) !important; }
.prose .compare { min-width: 600px; }
.prose .table-hint { display: block; }
@media (min-width: 1100px) { .prose .table-hint { display: none; } }
@media (min-width: 760px) {
  .page--guide > .figure img, .page--itinerary > .figure img { aspect-ratio: 21 / 9; object-fit: cover; }
}
.prose .card__title, .prose .checklist__title, .prose .step__title { margin-top: 0; }
.prose .card .eyebrow { margin-bottom: var(--s1); }
.alt__title { font: 500 var(--t1)/1.3 var(--font-display); }
.route__step--optional::before { border-style: solid; border-color: var(--control-border); }
.prose #dias + * , .prose .table-block { margin-bottom: var(--s4); }
.prose .compare td ul { margin: 0; padding-left: 1.1em; }
.prose .compare#dias { min-width: 0; }
.filters { border: 1px solid var(--line); background: var(--white); padding: var(--s2) var(--s3); margin: 0 0 var(--s3); font-family: var(--font-ui); }
.filters__title { font: 700 var(--t-1)/1.5 var(--font-ui); letter-spacing: .08em; text-transform: uppercase; color: var(--green); margin: 0 0 var(--s1); }
.filters__group { margin: 0 0 var(--s2); }
.filters__label { font: 600 var(--t0)/1.4 var(--font-ui); margin: 0 0 var(--s1); }
.filters__buttons { display: flex; flex-wrap: wrap; gap: var(--s1); }
.filter { min-height: var(--tap); padding: 6px var(--s2); font: var(--t0)/1.2 var(--font-ui); color: var(--ink); background: var(--paper);
  border: 1px solid var(--control-border); cursor: pointer; }
.filter:hover { border-color: var(--ink); }
.filter[aria-pressed="true"] { background: var(--green); border-color: var(--green); color: var(--white); }
.filter[aria-pressed="true"]::before { content: "✓ "; }
.filters__count { margin: 0; font: 600 var(--t0)/1.4 var(--font-ui); color: var(--muted); }
.filters__empty { border: 1px dashed var(--control-border); padding: var(--s3); margin: 0 0 var(--s3); font-family: var(--font-ui); }
.filters__empty p { margin: 0 0 var(--s2); }
.formats__note { margin: 0 0 var(--s3); }
.formats__list, .offers__list { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--s4); }
.formats__list > li, .offers__list > li { margin: 0; }
.format, .offer { border-top: 2px solid var(--ink); padding-top: var(--s2); scroll-margin-top: var(--s3); }
.format__n { font: 600 var(--t-1)/1.5 var(--font-ui); letter-spacing: .08em; text-transform: uppercase; color: var(--rust); margin: 0 0 4px; }
.format__title, .offer__title { margin: 0 0 var(--s1) !important; font-size: var(--t2); }
.format p, .offer p { margin: 0 0 var(--s1); }
.format__checks-title { font: 700 var(--t0)/1.4 var(--font-ui); margin-top: var(--s2) !important; }
.format__checks { margin: 0 0 var(--s2); padding-left: 1.2em; font: var(--t0)/1.55 var(--font-ui); }
.format__checks li + li { margin-top: 4px; }
.format__media { margin: 0 0 var(--s2); }
.explore { display: flex; flex-direction: column; gap: 4px; }
.explore__note { font: var(--t-1)/1.5 var(--font-ui); color: var(--muted); }
.offer { border: 1px solid var(--line); border-top: 3px solid var(--green); padding: var(--s3); background: var(--white); }
.offer__facts { margin: var(--s2) 0; font: var(--t0)/1.5 var(--font-ui); display: grid; gap: var(--s1); }
.offer__facts > div { display: grid; gap: 2px; }
@media (min-width: 560px) { .offer__facts > div { grid-template-columns: 11em 1fr; gap: var(--s2); } }
.offer__facts dt { font-weight: 700; }
.offer__facts dd { margin: 0; }
.offer__facts ul { margin: 0; padding-left: 1.1em; }
.offers__order { margin: 0 0 var(--s3); }
.criteria { border-left: 3px solid var(--green); background: var(--sand); padding: var(--s3); margin: 0 0 var(--s4); font-family: var(--font-ui); font-size: var(--t0); }
.criteria__title { font: 700 var(--t1)/1.3 var(--font-ui); margin: 0 0 var(--s1) !important; }
.criteria ul { margin: 0 0 var(--s1); padding-left: 1.2em; }
.criteria p { margin: 0; }
.prose .format__title, .prose .offer__title, .prose .criteria__title { margin-top: 0; }
.format__media img { aspect-ratio: 16 / 9; object-fit: cover; }
