/* 2020 — "Sunny Brunch". Reference: Provençal tablecloth.
   Lavender/olive/sunflower on cream, tiled motif, Mediterranean warmth. */

:root {
    --cream:    #F3EAD7;
    --sunflower:#E8B547;
    --lavender: #8B7AA8;
    --olive:    #6E8B4E;
    --terracotta:#C46B47;
    --ink:      #3A2E22;
    --soft:     #7A6A56;
    --max:      460px;
    --ease:     cubic-bezier(.2,.7,.2,1);
    --serif:    'Fraunces', serif;
    --sans:     'Inter', sans-serif;
}
* { margin:0; padding:0; box-sizing:border-box; }
html { -webkit-text-size-adjust:100%; }
body { background:var(--cream); color:var(--ink); font-family:var(--sans); font-weight:400; line-height:1.55; font-size:16px; -webkit-font-smoothing:antialiased; overflow-x:hidden; }

/* tiled motif borders — a repeating diamond/olive pattern */
.tile-border-top, .tile-border-bottom {
    height:14px;
    background:
        radial-gradient(circle at 50% 100%, var(--lavender) 3px, transparent 3.5px) 0 0/16px 14px repeat-x,
        radial-gradient(circle at 0 50%, var(--sunflower) 2.5px, transparent 3px) 0 0/16px 14px repeat-x,
        radial-gradient(circle at 100% 50%, var(--sunflower) 2.5px, transparent 3px) 0 0/16px 14px repeat-x;
    opacity:.8;
}
.tile-border-top { margin-bottom:20px; }
.tile-border-bottom { margin-top:20px; }

.cover-wrap { position:fixed; inset:0; z-index:100; display:flex; transition:opacity .6s var(--ease), visibility .6s; }
.cover-wrap.is-hidden { opacity:0; visibility:hidden; pointer-events:none; }
.cover-inner { max-width:var(--max); width:100%; margin:auto; padding:32px 28px; display:flex; flex-direction:column; min-height:100%; background:var(--cream); }
.cover-eyebrow { font-family:var(--sans); font-size:.72rem; letter-spacing:.25em; text-transform:uppercase; color:var(--olive); margin-bottom:14px; }
.cover-title { font-family:var(--serif); font-weight:600; font-size:clamp(3rem,15vw,4.6rem); line-height:.92; letter-spacing:-.02em; color:var(--terracotta); margin-bottom:14px; }
.cover-title em { font-style:italic; color:var(--lavender); }
.cover-deck { font-family:var(--serif); font-style:italic; font-size:1.15rem; color:var(--olive); margin-bottom:auto; }
.cover-recipient { font-family:var(--serif); font-size:1.2rem; color:var(--ink); margin:20px 0; }
.for-label { color:var(--soft); font-family:var(--sans); font-size:.7rem; letter-spacing:.2em; text-transform:uppercase; margin-right:8px; }
#guestName { font-family:var(--serif); font-weight:600; }
.open-btn { background:var(--terracotta); color:var(--cream); border:none; border-radius:999px; font-family:var(--serif); font-weight:600; font-style:italic; font-size:1.1rem; padding:14px 24px; display:flex; justify-content:space-between; align-items:center; cursor:pointer; width:100%; transition:transform .2s var(--ease); -webkit-user-select:none; user-select:none; }
.open-btn:active { transform:scale(.98); }
.open-btn .arrow { transition:transform .2s; }
.open-btn:hover .arrow { transform:translateX(4px); }
.cover-footnote { margin-top:14px; font-family:var(--serif); font-style:italic; font-size:.92rem; color:var(--soft); }

.invite-body { display:none; }
.invite-body.is-open { display:block; }
.section { max-width:var(--max); margin:0 auto; padding:48px 28px 8px; }
.section-eyebrow { font-family:var(--sans); font-size:.7rem; letter-spacing:.25em; text-transform:uppercase; color:var(--terracotta); margin-bottom:16px; display:flex; align-items:center; gap:12px; }
.section-eyebrow::after { content:''; flex:1; height:1px; background:var(--olive); opacity:.3; }
.welcome-message { font-family:var(--serif); font-size:1.25rem; line-height:1.5; }
.welcome-host { margin-top:14px; font-family:var(--serif); font-style:italic; font-size:1rem; color:var(--soft); }
.savedate-name { font-family:var(--serif); font-weight:600; font-size:clamp(2rem,9vw,2.8rem); line-height:1; color:var(--terracotta); margin-bottom:6px; }
.savedate-date { font-family:var(--serif); font-style:italic; font-size:1.1rem; color:var(--olive); margin-bottom:24px; }
.savedate-date sup { font-size:.6em; }
.countdown { display:grid; grid-template-columns:repeat(4,1fr); border:1.5px solid var(--olive); border-radius:14px; overflow:hidden; }
.cd-unit { padding:14px 6px; text-align:center; border-right:1px dashed rgba(110,139,78,.35); }
.cd-unit:last-child { border-right:none; }
.cd-num { display:block; font-family:var(--serif); font-weight:600; font-size:1.9rem; line-height:1; color:var(--terracotta); font-variant-numeric:tabular-nums; }
.cd-label { font-family:var(--sans); font-size:.6rem; letter-spacing:.1em; text-transform:lowercase; color:var(--soft); font-style:italic; }
.schedule-list { display:flex; flex-direction:column; gap:16px; }
.schedule-item { background:rgba(255,255,255,.45); border:1.5px solid var(--olive); border-radius:14px; padding:18px; display:grid; gap:6px; }
.schedule-name { font-family:var(--serif); font-weight:600; font-size:1.4rem; color:var(--terracotta); margin-bottom:6px; }
.schedule-item p { font-size:.92rem; color:var(--ink); display:flex; align-items:center; gap:8px; }
.schedule-item p i { color:var(--olive); }
.schedule-map-link { margin-top:8px; align-self:flex-start; font-size:.72rem; font-weight:500; letter-spacing:.12em; text-transform:uppercase; text-decoration:none; color:var(--terracotta); border-bottom:1px solid var(--terracotta); padding-bottom:2px; display:inline-flex; align-items:center; gap:6px; }
.menu-list { display:flex; flex-direction:column; margin-bottom:22px; }
.menu-item { display:flex; align-items:baseline; gap:12px; padding:12px 0; border-bottom:1px dashed var(--olive); }
.menu-bullet { color:var(--lavender); font-size:1.3rem; }
.menu-info { flex:1; }
.menu-name { font-family:var(--serif); font-weight:600; font-size:1.25rem; color:var(--ink); display:inline; }
.menu-note { font-family:var(--serif); font-style:italic; font-size:.95rem; color:var(--soft); display:inline; margin-left:8px; }
.seating-card { border:1.5px solid var(--lavender); border-radius:14px; padding:16px; background:rgba(139,122,168,.06); }
.seating-label { font-family:var(--sans); font-size:.68rem; letter-spacing:.2em; text-transform:uppercase; color:var(--lavender); margin-bottom:6px; }
.seating-note { font-family:var(--serif); font-size:1.05rem; line-height:1.45; }
.rsvp-body { min-height:40px; }
.invite-footer { max-width:var(--max); margin:0 auto; padding:48px 28px 56px; text-align:center; }
.footer-thanks { font-family:var(--serif); font-style:italic; font-size:1.8rem; color:var(--terracotta); margin-bottom:6px; }
.footer-credit { font-family:var(--sans); font-size:.7rem; letter-spacing:.15em; text-transform:uppercase; color:var(--soft); }
[data-reveal] { opacity:0; transform:translateY(14px); transition:opacity .8s var(--ease), transform .8s var(--ease); }
[data-reveal].is-visible { opacity:1; transform:translateY(0); }
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { transition:none!important; animation:none!important; } [data-reveal] { opacity:1; transform:none; } }

/* RSVP form — platform injects js/rsvp_user.js which binds these IDs.
   Error spans (.error), .loading and .thank-you-message are part of the
   contract: rsvp_user.js writes into them, so they must look at home here. */
#rsvp-form { display:flex; flex-direction:column; gap:16px; margin-top:4px; }
.form-group { display:flex; flex-direction:column; gap:6px; }
.form-group label { font-family:var(--sans); font-size:.68rem; letter-spacing:.18em; text-transform:uppercase; color:var(--soft); }
.form-control { background:#fff; border:1.5px solid var(--olive); border-radius:10px; padding:12px 14px; font-family:var(--serif); font-size:1rem; color:var(--ink); width:100%; }
.form-control::placeholder { color:var(--soft); opacity:.55; font-style:italic; }
.form-control:focus { outline:none; border-color:var(--terracotta); box-shadow:0 0 0 3px rgba(196,107,71,.15); }
textarea.form-control { resize:vertical; min-height:80px; }
.error { display:block; color:#A63D26; font-family:var(--sans); font-size:.8em; }
.rsvp-submit { background:var(--terracotta); color:var(--cream); border:none; border-radius:999px; font-family:var(--serif); font-weight:600; font-style:italic; font-size:1.05rem; padding:14px 24px; display:flex; justify-content:space-between; align-items:center; cursor:pointer; width:100%; margin-top:6px; transition:transform .2s var(--ease); -webkit-user-select:none; user-select:none; }
.rsvp-submit:active { transform:scale(.98); }
.rsvp-submit:disabled { opacity:.6; cursor:default; }
.rsvp-submit .arrow { transition:transform .2s; }
.rsvp-submit:hover .arrow { transform:translateX(4px); }
.loading { display:none; text-align:center; font-family:var(--serif); font-style:italic; color:var(--soft); }
#rsvp-form .thank-you-message h3 { font-family:var(--serif); font-weight:600; color:var(--terracotta); font-size:1.6rem; margin-bottom:6px; }
#rsvp-form .thank-you-message p { font-family:var(--serif); color:var(--ink); }
#rsvp-form .thank-you-message small { font-family:var(--sans); color:var(--soft); }