/* Machungwa (terracotta) — warm, cultural, celebratory: kitenge/ankara-
   adjacent without literally printing fabric. Two signature details carry
   the identity: a repeating triangle "trim" motif (.machungwa-divider,
   used in place of a plain hairline rule under every heading, and again
   as a trim strip atop each Gallery photo) evoking woven-textile edging,
   and an arch-topped hero portrait frame (a straight-sided doorway arch,
   not a circle or a hard rectangle) nodding at Swahili-coast architecture.
   Structurally close to Dhahabu (asymmetric Story/Location splits, a
   numbered Details list, a real Schedule timeline — all genuinely nice,
   theme-agnostic layout ideas) but the hero, the divider motif, and the
   Gallery treatment are Machungwa's own, so it doesn't read as a Dhahabu
   reskin. Gallery is a fixed-ratio trimmed-border grid — no theme repeats
   another's gallery technique (Dhahabu: masonry, Bahari: horizontal-scroll,
   Kijani: polaroid-scatter, Waridi: magazine-collage, Zambarau: its own —
   see zambarau.css). */

body.theme-machungwa {
  --mc-terracotta: #D9713C;
  --mc-terracotta-soft: rgba(217, 113, 60, .18);
  --mc-umber: #3A2418;
  --mc-umber-muted: #7A5C4C;
  --mc-cream: #FBF1E4;
  --mc-white: #FFFFFF;
  --mc-rust: #A34A24;

  --mc-space-xs: 12px;
  --mc-space-sm: 20px;
  --mc-space-md: 36px;
  --mc-space-lg: 64px;
  --mc-space-xl: 100px;

  --mc-h1: clamp(2.8rem, 1.6rem + 4.4vw, 5.2rem);
  --mc-h2: clamp(1.9rem, 1.4rem + 2vw, 3rem);
  --mc-h3: clamp(1.15rem, 1rem + .5vw, 1.35rem);
  --mc-eyebrow: .74rem;

  --mc-radius: 4px;
  --mc-shadow: 0 24px 60px -24px rgba(58, 36, 24, .3);

  position: relative;
  font-family: var(--machungwa-body-font);
  background: var(--mc-cream);
  color: var(--mc-umber);
  line-height: 1.7;
}
/* Curated font-pairing alternates (lib/themes.js's THEMES.machungwa.
   fontPairings) — same mechanism as the other themes' *.css. */
body.theme-machungwa[data-font-pairing="playfair-inter"] {
  --machungwa-header-font: "Playfair Display", Georgia, "Times New Roman", serif;
  --machungwa-body-font: "Inter", "Helvetica Neue", Arial, sans-serif;
}
body.theme-machungwa[data-font-pairing="cormorant-work-sans"] {
  --machungwa-header-font: "Cormorant Garamond", Georgia, "Times New Roman", serif;
  --machungwa-body-font: "Work Sans", "Helvetica Neue", Arial, sans-serif;
}
body.theme-machungwa h1, body.theme-machungwa h2, body.theme-machungwa h3 { font-family: var(--machungwa-header-font); font-weight: 600; letter-spacing: .01em; }
body.theme-machungwa h1 { font-size: var(--mc-h1); line-height: .98; margin: 0; }
body.theme-machungwa h2 { font-size: var(--mc-h2); line-height: 1.1; margin: 0; }
body.theme-machungwa p { line-height: 1.75; }
body.theme-machungwa .wedding-section, body.theme-machungwa .rsvp-section { scroll-margin-top: 84px; }

.machungwa-centered { text-align: center; max-width: 640px; margin: 0 auto; }
.machungwa-eyebrow { display: block; margin-bottom: var(--mc-space-xs); color: var(--mc-terracotta); font-size: var(--mc-eyebrow); font-weight: 700; letter-spacing: .2em; text-transform: uppercase; }

/* ============ SIGNATURE: the triangle "trim" divider — a woven-textile-
   edging motif standing in for a plain hairline rule everywhere a theme
   would normally drop one. Pure CSS (two mirrored linear-gradient
   triangles, tiled), no image request. ============ */
.machungwa-divider {
  width: 70px; height: 14px; margin: var(--mc-space-sm) auto var(--mc-space-md);
  background-image: linear-gradient(45deg, transparent 50%, var(--mc-terracotta) 50%), linear-gradient(-45deg, transparent 50%, var(--mc-terracotta) 50%);
  background-size: 14px 14px; background-repeat: repeat-x; background-position: left center;
}
.machungwa-divider-left { margin-left: 0; }

/* Buttons */
.machungwa-hero-cta {
  display: inline-flex; align-items: center; gap: 10px; padding: 16px 40px; border-radius: var(--mc-radius);
  background: var(--mc-terracotta); color: var(--mc-white); text-decoration: none; text-transform: uppercase; letter-spacing: .1em;
  font-size: .78rem; font-weight: 700; font-family: var(--machungwa-body-font); transition: background .3s ease, box-shadow .3s ease, transform .25s ease;
}
.machungwa-hero-cta:hover, .machungwa-hero-cta:focus-visible { background: var(--mc-rust); box-shadow: var(--mc-shadow); transform: translateY(-2px); }
.machungwa-hero-cta:focus-visible { outline: 2px solid var(--mc-terracotta); outline-offset: 3px; }

/* ============ SECTION NAV ============ */
body.theme-machungwa .machungwa-nav {
  position: sticky; top: 0; z-index: 40;
  background: rgba(251, 241, 228, .93); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
  border-bottom: 1px solid var(--mc-terracotta-soft);
}
.machungwa-nav-inner { max-width: 1120px; margin: 0 auto; padding: 0 24px; min-height: 64px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.machungwa-nav-brand { flex-shrink: 0; font-family: var(--machungwa-header-font); font-weight: 600; font-size: 1.1rem; color: var(--mc-umber); text-decoration: none; letter-spacing: .02em; }
.machungwa-nav-toggle { color: var(--mc-umber); }
.machungwa-nav-links { display: flex; gap: 28px; overflow-x: auto; scrollbar-width: none; }
.machungwa-nav-links::-webkit-scrollbar { display: none; }
.machungwa-nav-links a {
  position: relative; padding: 22px 0; color: var(--mc-umber-muted); text-decoration: none; white-space: nowrap;
  font-size: .74rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; transition: color .25s ease;
}
.machungwa-nav-links a::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: 16px; height: 2px; background: var(--mc-terracotta);
  transform: scaleX(0); transform-origin: left; transition: transform .25s ease;
}
.machungwa-nav-links a:hover, .machungwa-nav-links a:focus-visible { color: var(--mc-umber); }
.machungwa-nav-links a:hover::after, .machungwa-nav-links a:focus-visible::after { transform: scaleX(1); }
@media (max-width: 640px) {
  .machungwa-nav-brand { display: none; }
  .machungwa-nav-inner { padding: 0 16px; }
  .machungwa-nav-toggle { display: flex; }
  .machungwa-nav-links {
    position: absolute; top: 100%; left: 0; right: 0; flex-direction: column; gap: 0; max-height: 0; overflow: hidden;
    background: var(--mc-cream); border-bottom: 1px solid var(--mc-terracotta-soft); transition: max-height .3s ease;
  }
  .machungwa-nav-links.is-open { max-height: 70vh; overflow-y: auto; }
  .machungwa-nav-links a { padding: 16px 20px; border-top: 1px solid var(--mc-terracotta-soft); }
  .machungwa-nav-links a::after { display: none; }
}

/* ============ HERO — signature: a bold diagonal terracotta "flag" panel
   cutting across a full-bleed photo, not a centred card. Asymmetric on
   purpose — the photo breathes uncovered on one side, the panel carries
   all the type at real scale on the other, so the very first thing a
   guest sees is a graphic shape, not a small framed portrait. ============ */
.machungwa-hero { position: relative; min-height: 92vh; display: flex; align-items: stretch; overflow: hidden; background: var(--mc-umber); }
.machungwa-hero-bg { position: absolute; inset: 0; background-size: cover; background-position: center; }
.machungwa-hero-bg::after { content: ""; position: absolute; inset: 0; background: linear-gradient(100deg, rgba(58, 36, 24, .25) 0%, transparent 45%); }
.machungwa-hero-panel {
  position: relative; z-index: 1; width: min(620px, 64vw); min-height: 92vh; margin-right: -8vw; padding: var(--mc-space-xl) 9vw var(--mc-space-lg) var(--mc-space-lg);
  display: flex; flex-direction: column; justify-content: center; text-align: left;
  background: var(--mc-terracotta); color: var(--mc-white);
  clip-path: polygon(0 0, 100% 0, 78% 100%, 0 100%);
}
/* :not([style]) — these hardcoded whites are the sensible default against
   the terracotta panel, but a colorOverride sets its own inline color on
   the panel (home.ejs); gating on the presence of that inline style (not
   just relying on specificity, which these would otherwise still win)
   lets the children fall back to inheriting the override's chosen color
   instead of fighting it. */
.machungwa-hero-panel:not([style]) h1 { color: var(--mc-white); }
.machungwa-hero-panel:not([style]) .machungwa-tagline { color: var(--mc-white); opacity: .92; }
.machungwa-hero-panel > p:not(.machungwa-tagline) { margin: var(--mc-space-sm) 0 var(--mc-space-lg); letter-spacing: .06em; font-size: .92rem; }
.machungwa-hero-panel:not([style]) > p:not(.machungwa-tagline) { color: rgba(255, 255, 255, .78); }
.machungwa-hero-panel:not([style]) .wedding-hero-hashtag { color: rgba(255, 255, 255, .78); }
.machungwa-hero-panel .machungwa-hero-cta { background: var(--mc-umber); align-self: flex-start; }
.machungwa-hero-panel .machungwa-hero-cta:hover { background: var(--mc-white); color: var(--mc-umber); }

/* ============ OUR STORY — asymmetric split, image left. ============ */
.machungwa-story { background: var(--mc-white); }
.machungwa-story-inner { display: grid; grid-template-columns: .95fr 1.05fr; gap: var(--mc-space-xl); align-items: center; max-width: 1120px; }
.machungwa-story-image { margin: 0; border-radius: var(--mc-radius); overflow: hidden; }
.machungwa-story-image img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; display: block; }
.machungwa-story-text { text-align: left; }
.machungwa-story-text .machungwa-divider { margin-left: 0; }
.machungwa-story p { color: var(--section-muted, var(--mc-umber-muted)); font-size: 1.08rem; text-align: left; }
.machungwa-story-text:only-child { grid-column: 1 / -1; max-width: 640px; margin: 0 auto; text-align: center; }
.machungwa-story-text:only-child .machungwa-divider { margin: var(--mc-space-sm) auto var(--mc-space-md); }
.machungwa-story-text:only-child p { text-align: center; }

/* ============ EVENT DETAILS — editorial numbered list. ============ */
.machungwa-details { background: var(--mc-cream); }
.machungwa-details .wedding-container { max-width: 760px; }
.machungwa-details-head { margin-bottom: var(--mc-space-lg); text-align: left; }
.machungwa-details-head .machungwa-divider { margin-left: 0; }
.machungwa-details-list { border-top: 1px solid var(--mc-terracotta-soft); }
.machungwa-details-row { display: grid; grid-template-columns: auto 1fr; gap: var(--mc-space-lg); align-items: baseline; padding: var(--mc-space-lg) 0; border-bottom: 1px solid var(--mc-terracotta-soft); text-align: left; }
.machungwa-details-num { font-family: var(--machungwa-header-font); font-weight: 700; font-size: 2.4rem; line-height: 1; color: var(--mc-terracotta); }
.machungwa-details-row h3 { margin: 0 0 10px; font-size: 1.5rem; }
.machungwa-details-row p { margin: 3px 0; color: var(--mc-umber-muted); font-size: .95rem; }
.machungwa-details-row p:first-of-type { color: var(--mc-umber); font-weight: 600; }

/* ============ SCHEDULE — vertical timeline, terracotta spine + diamond
   markers (a small rotated square, echoing the divider's triangles). ============ */
.machungwa-schedule { background: var(--mc-white); }
.machungwa-schedule .wedding-container { max-width: 720px; }
.machungwa-schedule-head { text-align: left; margin-bottom: var(--mc-space-xl); }
.machungwa-schedule-head .machungwa-divider { margin-left: 0; }
.machungwa-timeline { list-style: none; margin: 0; padding: 0; }
.machungwa-timeline li { position: relative; display: grid; grid-template-columns: 92px 28px 1fr; column-gap: var(--mc-space-sm); padding: var(--mc-space-md) 0; text-align: left; }
.machungwa-timeline li::before { content: ""; position: absolute; left: 105px; top: 0; bottom: 0; width: 1px; background: var(--mc-terracotta-soft); }
.machungwa-timeline li:first-child::before { top: 50%; }
.machungwa-timeline li:last-child::before { bottom: 50%; }
.machungwa-timeline-dot { grid-column: 2; justify-self: center; width: 9px; height: 9px; margin-top: 8px; background: var(--mc-terracotta); transform: rotate(45deg); position: relative; z-index: 1; }
.machungwa-timeline-time { grid-column: 1; padding-top: 4px; color: var(--mc-terracotta); letter-spacing: .1em; text-transform: uppercase; font-size: var(--mc-eyebrow); font-weight: 700; text-align: right; }
.machungwa-timeline-content { grid-column: 3; }
.machungwa-timeline-content b { font-family: var(--machungwa-header-font); font-weight: 600; font-size: 1.3rem; }
.machungwa-timeline-content p { margin: 6px 0 0; color: var(--section-muted, var(--mc-umber-muted)); }

/* ============ LOCATION — mirrors Story: image right this time. ============ */
.machungwa-location { background: var(--mc-cream); }
.machungwa-location-inner { display: grid; grid-template-columns: 1fr .95fr; gap: var(--mc-space-xl); align-items: center; max-width: 1120px; }
.machungwa-location-text { order: 1; text-align: left; }
.machungwa-location-image { order: 2; margin: 0; border-radius: var(--mc-radius); overflow: hidden; }
.machungwa-location-image img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; display: block; }
.machungwa-location-venue { font-family: var(--machungwa-header-font); font-weight: 600; font-size: 1.8rem; margin: 0 0 var(--mc-space-xs); }
.machungwa-location-text p { text-align: left; }
.machungwa-location-text .machungwa-divider { margin-left: 0; }
.machungwa-location-text .machungwa-hero-cta { margin-top: var(--mc-space-sm); }
.machungwa-location-text:only-child { grid-column: 1 / -1; max-width: 560px; margin: 0 auto; text-align: center; }
.machungwa-location-text:only-child .machungwa-eyebrow, .machungwa-location-text:only-child .machungwa-divider { text-align: center; margin-left: auto; margin-right: auto; }
.machungwa-location-text:only-child p { text-align: center; }

/* ============ REGISTRY ============ */
.machungwa-registry { background: var(--mc-white); }
.machungwa-registry .machungwa-centered { max-width: 1040px; }
.machungwa-registry-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--mc-space-lg); margin-top: var(--mc-space-xl); text-align: left; }
.machungwa-registry-card { background: var(--mc-white); }
.machungwa-registry-card img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; display: block; margin-bottom: var(--mc-space-sm); border-radius: var(--mc-radius); transition: transform .5s ease; }
.machungwa-registry-card:hover img { transform: scale(1.03); }
.machungwa-registry-category { font-size: .66rem; font-weight: 700; text-transform: uppercase; letter-spacing: .14em; color: var(--mc-terracotta); }
.machungwa-registry-card h3 { margin: 8px 0; font-size: 1.15rem; }
.machungwa-registry-price { margin: 0 0 var(--mc-space-xs); color: var(--mc-umber-muted); }
.machungwa-registry-card .machungwa-hero-cta { padding: 9px 20px; font-size: .66rem; }

/* ============ RSVP ============ */
.machungwa-rsvp { background: radial-gradient(ellipse at 50% 0%, var(--mc-terracotta-soft), transparent 60%), var(--mc-cream); }
.machungwa-rsvp .wedding-container > h2 { text-align: center; }
.machungwa-rsvp .rsvp-card { background: var(--mc-white); border: 1px solid var(--mc-terracotta-soft); border-radius: var(--mc-radius); box-shadow: var(--mc-shadow); padding: var(--mc-space-lg) var(--mc-space-md); }
.machungwa-rsvp .rsvp-intro { color: var(--section-muted, var(--mc-umber-muted)); max-width: 480px; margin: 0 auto var(--mc-space-lg); text-align: center; }
.machungwa-rsvp .field label { letter-spacing: .04em; text-transform: uppercase; font-size: .7rem; color: var(--mc-umber-muted); }
.machungwa-rsvp .field input, .machungwa-rsvp .field select, .machungwa-rsvp .field textarea, .machungwa-rsvp input#rsvpNameSearch {
  border: 1px solid var(--mc-terracotta-soft); border-radius: var(--mc-radius); background: var(--mc-cream);
}
.machungwa-rsvp .field input:focus, .machungwa-rsvp .field select:focus, .machungwa-rsvp .field textarea:focus, .machungwa-rsvp input#rsvpNameSearch:focus {
  outline: none; border-color: var(--mc-terracotta); box-shadow: 0 0 0 3px var(--mc-terracotta-soft); background: var(--mc-white);
}
.machungwa-rsvp .btn-rsvp-submit {
  display: block; width: 100%; margin-top: var(--mc-space-sm); padding: 17px; border: none; border-radius: var(--mc-radius);
  background: var(--mc-terracotta); color: var(--mc-white); font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
  font-size: .78rem; cursor: pointer; transition: background .3s ease, box-shadow .3s ease;
}
.machungwa-rsvp .btn-rsvp-submit:hover { background: var(--mc-rust); box-shadow: var(--mc-shadow); }
.machungwa-rsvp .btn-rsvp-submit:focus-visible { outline: 2px solid var(--mc-terracotta); outline-offset: 3px; }
.machungwa-rsvp .rsvp-message { text-align: center; padding: var(--mc-space-md) 0; font-family: var(--machungwa-header-font); font-size: 1.15rem; }

/* FAQ */
.machungwa-faq { background: var(--mc-white); }
.machungwa-faq-list { text-align: left; border-top: 1px solid var(--mc-terracotta-soft); }
.machungwa-faq-list details { border-bottom: 1px solid var(--mc-terracotta-soft); padding: var(--mc-space-md) 0; }
.machungwa-faq-list summary { cursor: pointer; list-style: none; display: flex; align-items: center; justify-content: space-between; gap: 16px; font-family: var(--machungwa-header-font); font-weight: 600; font-size: 1.2rem; }
.machungwa-faq-list summary::-webkit-details-marker { display: none; }
.machungwa-faq-list summary::after {
  content: "+"; flex-shrink: 0; width: 26px; height: 26px; display: flex; align-items: center; justify-content: center;
  border: 1px solid var(--mc-terracotta); border-radius: 50%; font-size: 1rem; color: var(--mc-terracotta); transition: transform .25s ease;
}
.machungwa-faq-list details[open] summary::after { content: "\2013"; }
.machungwa-faq-list p { margin: var(--mc-space-sm) 0 0; color: var(--section-muted, var(--mc-umber-muted)); }

/* ============ GALLERY — signature: a fixed grid where every photo gets a
   terracotta border and its own woven trim strip along the top edge (same
   triangle motif as .machungwa-divider, tiled wider). Distinct from every
   other theme's gallery pattern (see file header). ============ */
.machungwa-gallery { background: var(--mc-cream); }
.machungwa-gallery-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--mc-space-md); }
.machungwa-gallery-grid figure { margin: 0; border: 2px solid var(--mc-terracotta); border-radius: var(--mc-radius); overflow: hidden; cursor: zoom-in; }
.machungwa-gallery-grid figure::before {
  content: ""; display: block; height: 10px;
  background-image: linear-gradient(45deg, transparent 50%, var(--mc-terracotta) 50%), linear-gradient(-45deg, transparent 50%, var(--mc-terracotta) 50%);
  background-size: 10px 10px; background-repeat: repeat-x;
}
.machungwa-gallery-grid img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; display: block; transition: transform .5s ease; }
.machungwa-gallery-grid figure:hover img { transform: scale(1.05); }
.machungwa-gallery-grid figcaption { padding: 10px 12px; font-size: .78rem; color: var(--section-muted, var(--mc-umber-muted)); }

@media (max-width: 900px) {
  .machungwa-gallery-grid { grid-template-columns: repeat(2, 1fr); }
  .machungwa-story-inner, .machungwa-location-inner { grid-template-columns: 1fr; }
  .machungwa-location-text { order: 2; }
  .machungwa-location-image { order: 1; }
}
@media (max-width: 768px) {
  .machungwa-hero { padding: 80px 20px; }
  .machungwa-hero-portrait { width: 220px; height: 280px; border-radius: 110px 110px 8px 8px; }
  .machungwa-details-row { grid-template-columns: 1fr; gap: var(--mc-space-xs); }
  .machungwa-timeline li { grid-template-columns: 68px 22px 1fr; }
  .machungwa-timeline li::before { left: 79px; }
  .machungwa-registry-grid { grid-template-columns: 1fr; }
  .machungwa-gallery-grid { grid-template-columns: 1fr; }
}