/* G06 · Sage Green Minimalist: fonts (SIL Open Font License 1.1, self-hosted) */
@font-face { font-family: "Cormorant Garamond"; font-style: normal; font-weight: 600; font-display: swap; src: url("../fonts/cormorant-garamond-latin-600-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: "Cormorant Garamond"; font-style: normal; font-weight: 500; font-display: swap; src: url("../fonts/cormorant-garamond-latin-500-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: normal; font-weight: 400; font-display: swap; src: url("../fonts/lora-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: "Lora"; font-style: normal; font-weight: 600; font-display: swap; src: url("../fonts/lora-latin-600-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; }

/* sticker geometry (mockup pixels) and proportions, made by build.py */
:root { --ar-euca-tr: 240 / 273; --sx-euca-tr: 981.0; --sy-euca-tr: 54.75; --sw-euca-tr: 141.0; --ar-leaves-bl: 200 / 360; --sx-leaves-bl: 0.0; --sy-leaves-bl: 1100.0; --sw-leaves-bl: 125.0; --ar-leaves-br: 220 / 144; --sx-leaves-br: 999.5; --sy-leaves-br: 1255.0; --sw-leaves-br: 122.5; }
.phw { --cx0: 30; --cy0: 50; --cw: 525; --ch: 475; }

/* G06 · Sage Green Minimalist: warm white, sage and a thin gold line; the graduate under a soft arch, a gold laurel and cap,
   the name in an elegant serif with a sage pill, frosted cards, a sage gallery band and footer; eucalyptus and leaves from the mockup. */
:root {
  --bg: #f4f3ed; --bg2: #e7eadf; --ink: #2d3528; --muted: #5f6858; --accent: #5f7355; --accent2: #c2a35a;
  --line: rgb(95 115 85 / .22);
  --card: rgb(255 255 255 / .82); --card-line: #e3e6db; --card-shadow: 0 8px 22px rgb(60 70 50 / .07); --radius: 16px;
  --btn-bg: linear-gradient(180deg, #6d8262, #566a4c); --btn-ink: #f8f7f1; --btn-line: transparent; --btn-shadow: 0 8px 18px rgb(86 106 76 / .28);
  --f-display: "Cormorant Garamond", Georgia, serif; --f-body: "Lora", Georgia, serif; --f-head: "Cormorant Garamond", Georgia, serif; --f-num: "Cormorant Garamond", Georgia, serif;
  --name-size: clamp(1.7rem, 7.6vw, 2.15rem); --name-weight: 600; --name-color: #3e4c36;
  --head-size: 1.85rem; --head-weight: 600; --head-color: #2d3528; --head-ink: #2d3528;
  --photo-radius: 0; --photo-border: 0; --photo-shadow: none;
  --gate-bg: radial-gradient(110% 60% at 50% 0, #fbfaf6, #f4f3ed 60%, #eeede5);
  --guest-bg: rgb(255 255 255 / .85); --guest-line: #e3e6db;
  --cd-title: #3e4c36; --cd-num: #2d3528; --cd-label: #6b7363;
  --cd-tile: rgb(255 255 255 / .85); --cd-tile-border: 1px solid #e3e6db; --cd-tile-radius: 10px; --cd-tile-shadow: none;
  --dt-ic: #5f7355; --dt-ic-bg: transparent; --dt-label: #2d3528; --av-bg: #e1e7d9; --av-ink: #5f7355;
  --map-ink: #3e4c36; --map-line: #d9ddd0;
  --gal-radius: 14px; --gal-shadow: 0 8px 18px rgb(60 70 50 / .12);
}
body { background: #efeee7; }
.inv { background: linear-gradient(180deg, #f7f6f1, #f2f1ea); }

/* The graduate under a soft arch with a thin gold line */
.phw .photo { border-radius: 50% 50% 18px 18px / 26% 26% 18px 18px; }
.phw::before { content: ""; inset: -9px -9px auto; height: 70%; z-index: -1; border: 1px solid #c9b47a; border-bottom: 0; border-radius: 50% 50% 0 0 / 38% 38% 0 0; }
.phw--cover { --pw: min(72vw, 290px); margin: 14px auto 16px; }
.phw--hero { --pw: min(78vw, 310px); margin: 14px auto 18px; }

/* Title */
.ttl .orn--cap svg { width: 66px; margin: 0 auto 2px; color: #c2a35a; }
.ttl__pre span { display: inline-flex; align-items: center; gap: 12px; font: 600 .74rem/1.4 var(--f-body); letter-spacing: .34em; text-transform: uppercase; color: #3e4c36; }
.ttl .ttl__pre span::before, .ttl .ttl__pre span::after { content: ""; width: 28px; height: 1px; background: #c9b47a; }
.ttl .lead { color: #4a5242; font-size: .93rem; max-width: 300px; margin-top: 8px; }
.ttl__name { margin: 8px 0 4px; }
.ttl__sub span { font: 500 .88rem/1.3 var(--f-body); color: #3e4c36; background: #e1e7d9; padding: 5px 18px; border-radius: 999px; }
.ttl__facts { display: flex; flex-wrap: wrap; justify-content: center; gap: 0; color: #4a5242; font-size: .9rem; margin-top: 8px; }
.ttl__facts span + span::before { content: "|"; margin: 0 10px; color: #b7b9ad; }
.ttl .orn--div svg { width: 110px; margin: 8px auto 0; color: #b7a26a; }
.gate__date, .side__date { color: #3e4c36; font-weight: 600; margin-top: 14px; }

/* Headings: serif between thin gold lines */
.h-sec__t { gap: 14px; }
.h-sec__t::before, .h-sec__t::after { content: ""; width: 40px; height: 1px; background: #c9b47a; }
.h-sec__sub { font: 500 1.05rem/1.4 var(--f-head); color: #3e4c36; }

/* Countdown: a frosted card */
.sec--countdown { padding-top: 10px; }
.cd-box { background: rgb(255 255 255 / .6); border: 1px solid #e3e6db; border-radius: 18px; padding: 14px 12px 16px; box-shadow: var(--card-shadow); }
.cd__t { font: 600 1.15rem/1.3 var(--f-head); gap: 12px; }
.cd__t::before, .cd__t::after { content: ""; width: 26px; height: 1px; background: #c9b47a; }
.cd__n { font-weight: 600; font-size: 2.1rem; }
.sec--countdown .link--cal { color: #3e4c36; }

/* Details */
.dts { gap: 0; background: rgb(255 255 255 / .7); border: 1px solid #e3e6db; border-radius: 16px; padding: 4px 16px; box-shadow: var(--card-shadow); }
.dt { background: none; border: 0; box-shadow: none; border-radius: 0; padding: 12px 2px; }
.dt + .dt { border-top: 1px solid #e8eae1; }
.link, .link--map, .link--cal { color: #3e4c36; }

/* The gallery on a sage band */
.sec--gallery { background: #e6ebdd; }

/* Wishes */
.wish { border-color: #e8eae1; }
.wish__av { font-family: var(--f-head); font-weight: 700; }

/* The sage footer */
.sec--closing { background: linear-gradient(180deg, #637759, #556a4b); color: #f4f3ed; padding: 44px 22px 60px; }
.sec--closing::before { content: ""; display: block; width: 64px; height: 28px; margin: 0 auto 4px; background: url(../img/g06-cap.svg) center / contain no-repeat; }
.closing__t span { color: #fbfaf5; }
.sec--closing .orn--div svg { color: #d9c690; }
.closing__p, .made { color: #e9ede1; }
.closing__sign { color: #fbfaf5; font: 600 1.15rem/1.3 var(--f-head); }

/* ---------- Eucalyptus and leaves from the mockup ---------- */
.o { filter: drop-shadow(0 6px 10px rgb(60 70 50 / .14)); }
.gate__in > .deco, .side__in > .deco { z-index: 1; }
.gate__in .o1, .side__in .o1 { right: -22px; top: -26px; width: 34vw; max-width: 136px; aspect-ratio: var(--ar-euca-tr); background-image: url(../img/st-euca-tr.webp); }
.sec--hero .o1 { right: -20px; top: -8px; width: 34vw; max-width: 136px; aspect-ratio: var(--ar-euca-tr); background-image: url(../img/st-euca-tr.webp); }
.sec--wishes { padding-bottom: 110px; }
.sec--wishes .o1 { left: -6px; bottom: 0; width: 26vw; max-width: 104px; aspect-ratio: var(--ar-leaves-bl); background-image: url(../img/st-leaves-bl.webp); }
.sec--wishes .o2 { right: -6px; bottom: 0; width: 32vw; max-width: 128px; aspect-ratio: var(--ar-leaves-br); background-image: url(../img/st-leaves-br.webp); }

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