/* W03 · Sage Green Botanical: fonts (SIL Open Font License 1.1, self-hosted) */
@font-face { font-family: "Pinyon Script"; font-style: normal; font-weight: 400; font-display: swap; src: url("../fonts/pinyon-script-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: "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: "Cormorant Garamond"; font-style: italic; font-weight: 600; font-display: swap; src: url("../fonts/cormorant-garamond-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: "EB Garamond"; font-style: normal; font-weight: 400; font-display: swap; src: url("../fonts/eb-garamond-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: "EB Garamond"; font-style: normal; font-weight: 500; font-display: swap; src: url("../fonts/eb-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: "EB Garamond"; font-style: italic; font-weight: 400; font-display: swap; src: url("../fonts/eb-garamond-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: "Amiri"; font-style: normal; font-weight: 400; font-display: swap; src: url("../fonts/amiri-bismillah.woff2") format("woff2"); }

/* W03 · Sage Green Botanical: sage, eucalyptus and cream; botanical leaves, a sage wave band. */
:root {
  --bg: #f3efe5; --bg2: #e9e7db; --ink: #3f4a35; --muted: #6c735f; --accent: #6b7a55; --accent2: #a9b393;
  --deep: #6f7e58; --on-deep: #fbfaf5; --line: rgb(63 74 53 / .18);
  --card: rgb(255 255 255 / .5); --card-line: rgb(107 122 85 / .28); --card-shadow: 0 12px 30px rgb(63 74 53 / .06);
  --btn-bg: linear-gradient(90deg, #5c6b45, #6f7f57); --btn-ink: #fff; --btn-shadow: 0 10px 22px rgb(63 74 53 / .25);
  --f-script: "Pinyon Script", cursive; --f-display: "Cormorant Garamond", Georgia, serif; --f-body: "EB Garamond", Georgia, serif;
  --names-font: var(--f-script); --names-size: 3.4rem; --names-color: #3f4f33; --amp-font: var(--f-script); --amp-color: #7c8b62;
  --head-font: var(--f-display); --head-style: italic; --head-weight: 600; --head-size: 2.2rem; --head-color: #3f4f33;
  --couple-font: var(--f-display); --couple-style: italic; --couple-weight: 600; --couple-size: 2.05rem; --couple-color: #3f4f33;
  --photo-radius: 18px; --cover-ar: 1 / 1; --radius: 16px;
  --gate-bg: url(../img/w03-paper.svg), radial-gradient(ellipse at 50% 30%, #f8f5ee 0%, #efeadf 72%);
  --cd-num: #fff; --cd-label: rgb(255 255 255 / .85); --cd-line: rgb(255 255 255 / .35); --cd-title: #fff;
  --side-veil: linear-gradient(180deg, rgb(243 239 229 / 0) 42%, rgb(243 239 229 / .94) 82%); --side-ink: #3f4a35;
  --bank-bg: linear-gradient(135deg, #6f7e58, #59683f);
}
body { background: url(../img/w03-paper.svg), #f3efe5; }
.inv { background: transparent; }
.h-sec__t { display: flex; align-items: center; justify-content: center; gap: 12px; }
.h-sec__t::before, .h-sec__t::after { content: ""; width: 34px; height: 16px; background: url(../img/w03-sprig.svg) center / contain no-repeat; flex: none; }
.h-sec__t::before { transform: scaleX(-1); }
.h-sec .orn--div { display: none; }
.photo--cover, .photo--hero, .photo--side { box-shadow: 0 14px 34px rgb(63 74 53 / .16); }
.salam { color: #3f4f33; }
.couple__amp { width: 54px; height: 54px; border-radius: 50%; background: #e2e5d6; display: grid; place-items: center; margin: 10px auto; font: italic 600 1.6rem/1 var(--f-display); color: #6b7a55; }
/* The countdown on a sage band with wavy edges */
.sec--countdown { background: var(--deep); color: #fff; padding: 62px 24px 68px; }
.sec--countdown::before, .sec--countdown::after { content: ""; position: absolute; left: 0; right: 0; height: 26px; z-index: 3; background-size: 100% 100%; }
.sec--countdown::before { top: -1px; background-image: url(../img/w03-wave-top.svg); }
.sec--countdown::after { bottom: -1px; background-image: url(../img/w03-wave-bot.svg); }
.cd__t { font: italic 600 1.35rem var(--f-display); letter-spacing: 0; text-transform: none; }
.cd__n { font-family: var(--f-body); }
.sec--countdown .link { color: #fff; }
.ev::before, .ev::after { content: ""; position: absolute; bottom: 8px; width: 46px; height: 46px; background: url(../img/w03-corner.svg) center / contain no-repeat; }
.ev::after { right: 8px; }
.ev::before { left: 8px; transform: scaleX(-1); }
.ev__name { font-style: italic; font-size: 1.65rem; }
.wishes__t, .rsvp-done__t, .story__t { font-size: 1.5rem; }
.closing__p { color: #3f4f33; }

/* Watercolour eucalyptus cut from the mockup */
#gate .o1, #side .o1, .sec--hero .o1 { left: 0; top: 0; width: 32vw; max-width: 150px; aspect-ratio: 400 / 760; background-image: url(../img/deco-w03-euca-tl.webp); }
#gate .o2, #side .o2, .sec--hero .o2, .sec--couple .o2 { right: 0; top: 8%; width: 26vw; max-width: 120px; aspect-ratio: 348 / 840; background-image: url(../img/deco-w03-euca-r.webp); }
#gate .o3, #side .o3, .sec--events .o1, .sec--closing .o1 { left: 0; bottom: 0; width: 34vw; max-width: 160px; aspect-ratio: 440 / 480; background-image: url(../img/deco-w03-euca-l.webp); }
#gate .o4, #side .o4, .sec--gallery .o4, .sec--closing .o4 { right: 0; bottom: 0; width: 38vw; max-width: 180px; aspect-ratio: 408 / 330; background-image: url(../img/deco-w03-euca-br.webp); }
.sec--events .o1 { top: 24%; bottom: auto; }
