/* K06 · Minangkabau Heritage: fonts (SIL Open Font License 1.1, self-hosted) */
@font-face { font-family: "Playfair Display"; font-style: italic; font-weight: 600; font-display: swap; src: url("../fonts/playfair-display-latin-600-italic.woff2") format("woff2"); 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: "Lora"; font-style: normal; font-weight: 700; font-display: swap; src: url("../fonts/lora-latin-700-normal.woff2") format("woff2"); 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: "Lora"; font-style: italic; font-weight: 400; font-display: swap; src: url("../fonts/lora-latin-400-italic.woff2") format("woff2"); 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: "Mulish"; font-style: normal; font-weight: 400; font-display: swap; src: url("../fonts/mulish-latin-400-normal.woff2") format("woff2"); 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: "Mulish"; font-style: normal; font-weight: 700; font-display: swap; src: url("../fonts/mulish-latin-700-normal.woff2") format("woff2"); 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; }

/* sticker geometry (mockup pixels) and proportions, made by build.py */
:root { --ar-curtain-l: 220 / 355; --sx-curtain-l: 0.0; --sy-curtain-l: 67.75; --sw-curtain-l: 82.0; --ar-curtain-r: 150 / 211; --sx-curtain-r: 1028.0; --sy-curtain-r: 0.0; --sw-curtain-r: 94.0; --ar-rg-bl: 300 / 239; --ar-rg-br: 300 / 239; }
.phw { --cx0: 45; --cy0: 50; --cw: 355; --ch: 445; }

/* K06 · Minangkabau Heritage: deep maroon and gold songket, the rumah gadang roof, a gold swash italic and cream cartouches; the gold curtains and the rumah gadang line art come from the mockup. */
:root {
  --bg: #6e0f1f; --bg2: #5a0c18; --ink: #f8ecd6; --muted: #ead7b5; --accent: #d9b15f; --accent2: #f0d48b;
  --line: rgb(217 177 95 / .4);
  --card: linear-gradient(180deg, #7d1426, #5a0c18); --card-line: #d9b15f; --card-shadow: 0 0 0 4px rgb(90 12 24 / .7), 0 0 0 5px rgb(217 177 95 / .3), 0 14px 28px rgb(0 0 0 / .3); --radius: 16px;
  --btn-bg: linear-gradient(180deg, #f3d68c, #c99a46); --btn-ink: #4a0812; --btn-border: 1px solid #fff0c4; --btn-shadow: 0 8px 20px rgb(0 0 0 / .3);
  --f-display: "Playfair Display", Georgia, serif; --f-body: "Mulish", system-ui, sans-serif; --f-head: "Lora", Georgia, serif; --f-num: "Lora", Georgia, serif;
  --name-font: "Lora", Georgia, serif; --name-size: 1.3rem; --name-weight: 700; --name-color: #6e0f1f;
  --head-size: 1.6rem; --head-weight: 700; --head-color: #f0d48b; --head-ink: #f0d48b;
  --kicker-color: #f0d48b;
  --photo-radius: 16px; --photo-shadow: 0 0 0 2px #d9b15f, 0 0 0 6px #5a0c18, 0 0 0 7px rgb(217 177 95 / .6), 0 18px 34px rgb(0 0 0 / .4);
  --gate-bg: url(../img/k06-pattern.svg), radial-gradient(ellipse at 50% 30%, #8a1a2e, #6e0f1f 55%, #4a0812);
  --gate-ink: #f8ecd6; --guest-bg: rgb(74 8 18 / .5); --guest-line: rgb(217 177 95 / .55);
  --cd-title: #f8ecd6; --cd-num: #fbefd8; --cd-label: #ead7b5;
  --cd-tile: linear-gradient(180deg, #7d1426, #4a0812); --cd-tile-border: 1.5px solid #d9b15f; --cd-tile-radius: 12px; --cd-tile-shadow: 0 6px 14px rgb(0 0 0 / .3);
  --dt-ic: #f0d48b; --dt-ic-bg: transparent; --dt-label: #f0d48b; --av-bg: #6e0f1f; --av-ink: #f0d48b;
  --field-bg: #fffaf0; --field-ink: #3a0a12; --field-line: #e3c98f;
  color-scheme: dark;
}
body { background: url(../img/k06-pattern.svg), linear-gradient(180deg, #6e0f1f, #5a0c18); }
.inv { background: transparent; }

/* Title: the rumah gadang roof, gold swash italic, the name on a cream cartouche */
.phw--cover { --pw: min(56vw, 220px); margin: 10px auto 14px; }
.phw--hero { --pw: min(70vw, 280px); margin: 8px auto 18px; }
.orn--rumah svg { width: 84px; margin: 0 auto 2px; color: #e0bb6a; filter: drop-shadow(0 2px 4px rgb(0 0 0 / .4)); }
.ttl__kicker b { display: block; font: italic 600 2.4rem/1.02 var(--f-display); background: linear-gradient(180deg, #fff1c6 0, #f0d48b 40%, #c99a46 75%, #f3d68c 100%);
  -webkit-background-clip: text; background-clip: text; color: transparent; filter: drop-shadow(0 3px 3px rgb(0 0 0 / .45)); padding: 0 .08em; }
.ttl__kicker b:last-child { font-size: 3.2rem; line-height: 1.04; }
.ttl .lead { font: italic 400 .98rem/1.55 "Lora", Georgia, serif; color: #f6e6c8; max-width: 320px; }
.ttl__name { margin: 14px 0 4px; }
.ttl__name span { padding: 9px 26px 10px; background: linear-gradient(180deg, #fffaf0, #f3e2bf); border: 2px solid #d9b15f; border-radius: 14px; font-size: clamp(1.1rem, 5vw, 1.35rem);
  box-shadow: inset 0 0 0 3px #fffaf0, inset 0 0 0 4px rgb(201 154 70 / .55), 0 10px 22px rgb(0 0 0 / .35); text-wrap: balance; }
.par { margin-top: 6px; }
.par__l { color: #ead7b5; font-size: .8rem; }
.par__n { font: 700 .9rem/1.45 var(--f-body); color: #fbefd8; }
.par__b { display: inline; }
.ttl .orn--div svg { width: 150px; color: #d9b15f; }
.gate__date, .side__date { color: #f0d48b; letter-spacing: .03em; }
.guest { color: #f8ecd6; }

/* Headings: gold serif between gold ornaments, with an icon */
.h-sec__t::before, .h-sec__t::after { content: ""; width: 34px; height: 12px; flex: none;
  background: radial-gradient(circle, #d9b15f 0 3px, transparent 3.5px) right center / 12px 12px no-repeat, linear-gradient(#d9b15f, #d9b15f) left center / 24px 1px no-repeat; }
.h-sec__t::after { transform: scaleX(-1); }
.h-sec__ic { color: #f0d48b; }
.h-sec__sub, .lead, .hint, .wishes__n { color: #ead7b5; }

/* Countdown in a gold-edged box */
.sec--countdown { padding-top: 8px; }
.cd-box { border: 1.5px solid #d9b15f; border-radius: 18px; padding: 14px 12px 18px; background: rgb(74 8 18 / .45); box-shadow: inset 0 0 0 4px rgb(74 8 18 / .5), inset 0 0 0 5px rgb(217 177 95 / .3); }
.cd__t { font: 600 1.1rem/1.2 var(--f-body); gap: 10px; }
.cd__t::before, .cd__t::after { content: ""; width: 30px; height: 1px; background: #d9b15f; }
.cd__ic { color: #f0d48b; }
.cd__n { font-weight: 700; }
.link--cal, .link--map, .link { color: #f0d48b; }

/* Details: a maroon card with gold edges */
.dts { gap: 0; background: var(--card); border: 1.5px solid #d9b15f; border-radius: 18px; padding: 6px 16px; box-shadow: var(--card-shadow); }
.dt { background: none; border: 0; box-shadow: none; border-radius: 0; padding: 12px 2px; flex-direction: column; text-align: center; gap: 4px; }
.dt + .dt { border-top: 1px solid rgb(217 177 95 / .35); }
.dt__ic { width: 34px; height: 34px; }
.dt__l { font: 600 1rem/1.3 "Lora", Georgia, serif; }
.dt__v { color: #fbefd8; }
.dt__v small { color: #ead7b5; }
.btn--map { --map-bg: #5a0c18; --map-ink: #fbefd8; --map-line: #d9b15f; }
.btn--cta { --btn-bg: linear-gradient(180deg, #f3d68c, #c99a46); }

/* RSVP on a cream card with a gold border */
.sec--rsvp .sec__in { background: linear-gradient(180deg, #fffaf0, #f6e8cc); border: 2px solid #d9b15f; border-radius: 20px; padding: 24px 16px 18px; color: #3a0a12;
  box-shadow: inset 0 0 0 4px #fffaf0, inset 0 0 0 5px rgb(201 154 70 / .5), 0 14px 30px rgb(0 0 0 / .35); }
.sec--rsvp .h-sec__t { color: #6e0f1f; font-size: 1.4rem; }
.sec--rsvp .h-sec__t::before, .sec--rsvp .h-sec__t::after { display: none; }
.sec--rsvp .h-sec__ic { color: #6e0f1f; }
.sec--rsvp .lead--rsvp, .sec--rsvp .h-sec__sub { color: #6b3a3a; }
.sec--rsvp .form, .sec--rsvp .rsvp-done { background: none; border: 0; box-shadow: none; padding: 0; color: #3a0a12; }
.sec--rsvp .btn--primary { --btn-bg: linear-gradient(180deg, #8a1a2e, #5a0c18); --btn-ink: #fbefd8; --btn-border: 1px solid #d9b15f; }
.sec--rsvp .field em, .sec--rsvp .field small { color: #7a5a4a; }
.sec--rsvp .link { color: #6e0f1f; }

/* The prayer, gallery, wishes */
.prayer { font: italic 400 1.08rem/1.65 "Lora", Georgia, serif; color: #fbefd8; }
.sec--prayer .orn--div svg { color: #d9b15f; }
.gallery__item { border: 2px solid #d9b15f; border-radius: 12px; box-shadow: 0 10px 22px rgb(0 0 0 / .35); }
.wcomp { background: #fffaf0; border: 2px solid #d9b15f; }
.wish { background: linear-gradient(180deg, #fffaf0, #f6e8cc); border: 1.5px solid #d9b15f; color: #3a0a12; }
.wish__ago { color: #7a5a4a; }
.wish__av b { display: none; }
.wish__av .ic { display: block; }
.btn--send { --btn-bg: linear-gradient(180deg, #8a1a2e, #5a0c18); --btn-ink: #fbefd8; --btn-border: 1px solid #d9b15f; }

/* Closing with rumah gadang line art and a songket band */
.sec--closing { padding-bottom: 170px; }
.sec--closing::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 30px; background: url(../img/k06-songket.svg) 0 0 / 40px 30px repeat-x; z-index: 2; }
.closing__t span { font: italic 600 2.2rem/1.2 var(--f-display); color: #f0d48b; }
.closing__p, .closing__sign, .made { color: #f6e6c8; }

/* ---------- Gold curtains and the rumah gadang from the mockup ---------- */
.o { filter: drop-shadow(0 6px 10px rgb(0 0 0 / .35)); }
#gate .o1, #side .o1 { left: -22px; top: -28px; width: 30vw; max-width: 120px; aspect-ratio: var(--ar-curtain-l); background-image: url(../img/st-curtain-l.webp); }
#gate .o2, #side .o2 { right: -22px; top: -28px; width: 22vw; max-width: 86px; aspect-ratio: var(--ar-curtain-r); background-image: url(../img/st-curtain-r.webp); }
.sec--hero .deco { z-index: 3; }
.sec--hero .o1 { left: 0; top: 0; width: 26vw; max-width: 104px; aspect-ratio: var(--ar-curtain-l); background-image: url(../img/st-curtain-l.webp); }
.sec--hero .o2 { right: 0; top: 0; width: 19vw; max-width: 74px; aspect-ratio: var(--ar-curtain-r); background-image: url(../img/st-curtain-r.webp); }
.sec--closing .o1 { left: 0; bottom: 30px; width: 40vw; max-width: 160px; aspect-ratio: var(--ar-rg-bl); background-image: url(../img/rg-bl.webp); filter: none; }
.sec--closing .o2 { right: 0; bottom: 30px; width: 40vw; max-width: 160px; aspect-ratio: var(--ar-rg-br); background-image: url(../img/rg-br.webp); filter: none; }

@media (min-width: 1024px) { .phw--side { --pw: min(18vw, 230px); } }