/* =============================================
   Mary Turner-Grubb — 80 Wonderful Years
   Crimson · Cream · Gold · White · photo-driven
   ============================================= */
:root{
--cream:#F7EFDF; --cream-soft:#FCF7EC; --cream-deep:#EFE4CC; --white:#FFFFFF;
--ink:#43221f; --ink-soft:#5e3a33; --muted:#8d735f;
--crimson:#A4173A; --crimson-deep:#7E0F2B; --crimson-bright:#B51E34;
--gold:#C0A24E; --gold-deep:#9C7E37; --hairline:#E4D6BB;
--card-bg:#FFFFFF; --shadow-soft:0 2px 16px rgba(67,34,31,.07); --shadow-card:0 8px 30px rgba(67,34,31,.13);
}
*{box-sizing:border-box;margin:0;padding:0;}
html,body{font-family:'Inter',system-ui,-apple-system,sans-serif;color:var(--ink);min-height:100vh;-webkit-font-smoothing:antialiased;font-size:16px;line-height:1.6;}
/* faint gold-filigree watermark behind everything (your texture.png) */
body{
background-color:var(--cream);
background-image:linear-gradient(rgba(247,239,223,.93),rgba(247,239,223,.93)),url("images/texture.png");
background-size:auto, 520px auto;
background-attachment:fixed;
}
h1,h2,h3,h4{font-family:'Cormorant Garamond',Georgia,serif;color:var(--crimson);font-weight:600;letter-spacing:.2px;line-height:1.12;}
h1{font-size:2.4em;} h2{font-size:1.9em;margin:18px 0 6px;} h3{font-size:1.25em;margin:28px 0 10px;}
p{margin:6px 0;}
.section-title{text-transform:uppercase;letter-spacing:4px;font-size:.78em;font-family:'Inter',sans-serif;font-weight:700;color:var(--gold-deep);margin:34px 0 14px;}
.page-title{font-family:'Cormorant Garamond',serif;font-size:2.5em;font-weight:600;color:var(--crimson);margin-top:12px;}
.page-sub{color:var(--muted);font-style:italic;font-family:'Cormorant Garamond',serif;font-size:1.18em;margin-bottom:26px;}
.opt{color:var(--muted);font-weight:400;text-transform:none;letter-spacing:0;font-style:italic;}
.screen{min-height:100vh;} .hidden{display:none !important;} .center{text-align:center;}
.muted{color:var(--muted);font-size:.92em;} .hairline{border:none;border-top:1px solid var(--hairline);margin:28px 0;}

/* ===== Cover / gate — full photo + scrim, light text ===== */
.login-screen{position:relative;display:flex;align-items:center;justify-content:center;padding:48px 26px;overflow:hidden;min-height:100vh;background:#2A1014;}
.login-hero{position:absolute;inset:0;background:url("images/hero.png") center/cover no-repeat;z-index:1;}
.login-overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(36,10,16,.42) 0%,rgba(36,10,16,.58) 55%,rgba(36,10,16,.78) 100%);z-index:2;}
.login-inner{position:relative;z-index:3;width:100%;max-width:520px;text-align:center;color:var(--cream-soft);}
.brand-eyebrow{font-size:1.02em;letter-spacing:5px;text-transform:uppercase;font-weight:700;color:#E7CE84;margin-bottom:16px;text-shadow:0 2px 12px rgba(0,0,0,.6);}
.brand-title{font-family:'Cormorant Garamond',serif;font-size:4em;font-weight:600;color:#fff;line-height:1.02;margin-bottom:12px;text-shadow:0 2px 24px rgba(0,0,0,.45);}
.brand-divider{width:64px;height:2px;background:var(--gold);margin:20px auto;}
.brand-sub{font-family:'Cormorant Garamond',serif;font-style:italic;color:var(--cream-soft);font-size:1.5em;letter-spacing:1px;line-height:1.3;text-wrap:balance;padding:0 8px;text-shadow:0 1px 14px rgba(0,0,0,.4);}
.login-prompt{margin-top:36px;font-size:.74em;letter-spacing:6px;text-transform:uppercase;color:var(--gold);}
.login-buttons{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:20px;}
.login-buttons button{background:rgba(255,255,255,.08);color:#fff;border:1px solid var(--gold);padding:18px 12px;border-radius:3px;font-family:'Cormorant Garamond',serif;font-size:1.4em;font-weight:600;cursor:pointer;transition:all .2s;}
.login-buttons button:hover{background:var(--gold);color:var(--crimson-deep);}
.code-form{margin:22px auto 0;max-width:330px;background:transparent !important;border:none !important;box-shadow:none !important;padding:0 !important;}
.code-form input{width:100%;background:rgba(255,255,255,.14);border:1px solid var(--gold);border-radius:3px;padding:15px 12px;font-family:'Cormorant Garamond',serif;font-size:1.5em;text-align:center;letter-spacing:8px;color:#fff;margin-bottom:14px;backdrop-filter:blur(2px);}
.code-form input:focus{outline:none;border-color:#fff;background:rgba(255,255,255,.22);}
.code-form input::placeholder{color:rgba(255,255,255,.55);letter-spacing:6px;}
.code-form button[type="submit"]{width:100%;background:var(--crimson) !important;color:#fff !important;border:1px solid var(--gold);padding:15px !important;border-radius:3px;font-family:'Inter',sans-serif !important;font-size:.8em !important;font-weight:700;letter-spacing:6px !important;text-transform:uppercase;cursor:pointer;transition:background .2s;margin-top:0 !important;}
.code-form button[type="submit"]:hover{background:var(--crimson-deep) !important;}
.code-error{margin-top:12px;color:#ffd0c4;font-size:.85em;letter-spacing:.5px;min-height:1em;}
.brand-footer{margin-top:38px;font-family:'Cormorant Garamond',serif;font-style:italic;color:var(--cream);opacity:.85;font-size:1.05em;}

/* ===== Top bar ===== */
.top-bar{display:flex;justify-content:space-between;align-items:center;padding:calc(16px + env(safe-area-inset-top)) 24px 13px;background:var(--white);border-bottom:2px solid var(--crimson);position:sticky;top:0;z-index:10;}
.top-mark{font-family:'Cormorant Garamond',serif;font-size:1.4em;color:var(--crimson);font-weight:600;line-height:1;}
.top-sub{font-size:.62em;letter-spacing:3px;text-transform:uppercase;color:var(--gold-deep);margin-top:4px;}
.user-area{display:flex;align-items:center;gap:12px;}
.user-name{font-family:'Cormorant Garamond',serif;font-style:italic;color:var(--ink);}
.ghost-btn{background:transparent;color:var(--crimson);border:1px solid var(--gold);padding:6px 14px;border-radius:3px;font-size:.7em;letter-spacing:2px;text-transform:uppercase;cursor:pointer;font-family:'Inter',sans-serif;transition:all .2s;}
.ghost-btn:hover{background:var(--crimson);color:var(--cream-soft);}

/* ===== Tabs ===== */
.tab-bar{display:flex;overflow-x:auto;background:var(--white);border-bottom:1px solid var(--hairline);padding:0 14px;position:sticky;top:calc(71px + env(safe-area-inset-top));z-index:9;scrollbar-width:none;}
.tab-bar::-webkit-scrollbar{display:none;}
.tab-btn{background:transparent;border:none;padding:14px 16px 12px;font-size:.72em;letter-spacing:3px;text-transform:uppercase;color:var(--muted);cursor:pointer;white-space:nowrap;border-bottom:2px solid transparent;font-family:'Inter',sans-serif;font-weight:600;transition:color .2s,border-color .2s;}
.tab-btn.active{color:var(--crimson);border-bottom-color:var(--crimson);}
.tab-btn:hover{color:var(--ink);}

/* ===== Main ===== */
main{max-width:760px;margin:0 auto;padding:22px;}
.tab-panel{display:none;animation:fade-in .35s ease;}
.tab-panel.active{display:block;}
@keyframes fade-in{from{opacity:0;transform:translateY(4px);}to{opacity:1;transform:none;}}

/* ===== Photo heroes ===== */
.home-hero{width:calc(100% + 44px);margin:-22px -22px 0 -22px;height:230px;background:url("images/banner.png") center/cover no-repeat;position:relative;}
.home-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(247,239,223,0) 55%,var(--cream) 100%);}
.page-hero{width:calc(100% + 44px);margin:-22px -22px 22px -22px;height:200px;background-size:cover;background-position:center;position:relative;}
.page-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(247,239,223,0) 58%,var(--cream) 100%);}
.page-hero-rsvp{background-image:url("images/rsvp.png");}
@media (max-width:480px){.home-hero{height:180px;} .page-hero{width:calc(100% + 36px);margin:-18px -18px 18px -18px;height:150px;}}

/* ===== Countdown ===== */
.countdown{text-align:center;padding:30px 0 12px;}
.countdown-eyebrow{font-size:.7em;letter-spacing:5px;text-transform:uppercase;color:var(--gold-deep);margin-bottom:6px;}
.countdown-big{font-family:'Cormorant Garamond',serif;font-size:6em;font-weight:600;color:var(--crimson);line-height:1;}
.countdown-label{font-size:.7em;letter-spacing:6px;text-transform:uppercase;color:var(--ink);margin-top:8px;}

/* ===== Crimson banner ===== */
.line-banner{background:var(--crimson);color:var(--cream-soft);padding:22px 24px;border-radius:4px;text-align:center;margin:22px 0;position:relative;box-shadow:var(--shadow-soft);}
.line-banner::before,.line-banner::after{content:"";position:absolute;left:14px;right:14px;height:1px;background:var(--gold);}
.line-banner::before{top:8px;} .line-banner::after{bottom:8px;}
.line-banner-eyebrow{font-size:.65em;letter-spacing:5px;text-transform:uppercase;color:var(--gold);margin-bottom:4px;}
.line-banner-name{font-family:'Cormorant Garamond',serif;font-size:2.1em;font-weight:600;font-style:italic;color:#fff;}

.pill-row{text-align:center;margin:14px 0;}
.traveler-pill{display:inline-block;padding:8px 18px;margin:4px;background:var(--white);color:var(--ink);border:1px solid var(--gold);border-radius:30px;font-family:'Cormorant Garamond',serif;font-size:1.05em;}
.hotel-line{text-align:center;font-style:italic;font-family:'Cormorant Garamond',serif;font-size:1.2em;margin-top:10px;color:var(--ink-soft);}

/* ===== Cards ===== */
.day-card{background:var(--card-bg);border:1px solid var(--hairline);border-top:3px solid var(--crimson);padding:18px 24px;margin:12px 0;border-radius:5px;box-shadow:var(--shadow-soft);transition:box-shadow .25s,transform .25s;}
.day-card:hover{box-shadow:var(--shadow-card);transform:translateY(-1px);}
.day-card-eyebrow{font-size:.7em;letter-spacing:4px;text-transform:uppercase;color:var(--gold-deep);}
.day-card-notes{margin-top:8px;color:var(--ink);font-size:1.08em;}
.checkin-card{background:var(--card-bg);border-left:3px solid var(--crimson);padding:18px 22px;margin:12px 0;border-radius:5px;box-shadow:var(--shadow-soft);}
.checkin-card .who{font-family:'Cormorant Garamond',serif;font-size:1.2em;font-weight:600;color:var(--crimson);}
.checkin-card .mood-tag{display:inline-block;margin-left:10px;font-size:.7em;letter-spacing:3px;text-transform:uppercase;color:var(--gold-deep);}
.checkin-card .status{margin-top:6px;color:var(--ink);}
.checkin-card .meta{margin-top:8px;color:var(--muted);font-size:.78em;letter-spacing:1.5px;}

/* ===== Forms ===== */
.card-form,form{background:var(--card-bg);border:1px solid var(--hairline);padding:22px;border-radius:5px;margin:14px 0;box-shadow:var(--shadow-soft);}
form label{display:block;margin:14px 0;font-size:.7em;letter-spacing:3px;text-transform:uppercase;color:var(--gold-deep);font-weight:700;}
form input,form textarea,form select{width:100%;padding:12px 14px;margin-top:8px;border:1px solid var(--hairline);border-radius:3px;font-family:'Inter',sans-serif;font-size:1em;background:var(--cream-soft);color:var(--ink);transition:border-color .2s;}
form input:focus,form textarea:focus,form select:focus{outline:none;border-color:var(--crimson);}
form button[type="submit"]{background:var(--crimson);color:#fff;border:none;padding:15px 32px;border-radius:3px;font-family:'Inter',sans-serif;font-size:.8em;font-weight:700;letter-spacing:4px;text-transform:uppercase;cursor:pointer;margin-top:16px;width:100%;transition:background .2s;}
form button[type="submit"]:hover{background:var(--crimson-deep);}
form button[disabled]{opacity:.6;cursor:default;}

.hotel-name{font-family:'Cormorant Garamond',serif;font-size:1.35em;font-weight:600;color:var(--crimson);margin:2px 0 4px;}
.hotel-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px;}
.hotel-btn{display:inline-block;padding:8px 14px;border:1px solid var(--gold);border-radius:3px;color:var(--crimson);text-decoration:none;font-family:'Inter',sans-serif;font-size:.68em;letter-spacing:1.5px;text-transform:uppercase;font-weight:700;transition:all .2s;}
.hotel-btn:hover{background:var(--gold);color:#fff;}
.hotel-btn.primary{background:var(--crimson);color:#fff;border-color:var(--crimson);}
.hotel-btn.primary:hover{background:var(--crimson-deep);}
.album-btn{display:block;background:var(--crimson);color:#fff;text-align:center;padding:18px 28px;border-radius:3px;font-family:'Inter',sans-serif;font-size:.8em;font-weight:700;letter-spacing:4px;text-transform:uppercase;text-decoration:none;margin:18px 0;transition:background .2s;}
.album-btn:hover{background:var(--crimson-deep);}

/* ===== Host dashboard ===== */
.stat-row{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:6px 0 20px;}
.stat{background:var(--card-bg);border:1px solid var(--hairline);border-top:3px solid var(--gold);border-radius:5px;padding:16px 8px;text-align:center;box-shadow:var(--shadow-soft);}
.stat-num{display:block;font-family:'Cormorant Garamond',serif;font-size:2.2em;color:var(--crimson);line-height:1;}
.stat-lbl{display:block;margin-top:6px;font-size:.6em;letter-spacing:2px;text-transform:uppercase;color:var(--gold-deep);}
.organizer-actions{display:flex;gap:10px;flex-wrap:wrap;margin:8px 0 4px;}
@media (max-width:480px){.stat-num{font-size:1.7em;}.stat-lbl{font-size:.55em;}}

.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);background:var(--crimson);color:#fff;padding:14px 24px;border-radius:3px;font-size:.78em;letter-spacing:2px;text-transform:uppercase;box-shadow:0 4px 18px rgba(0,0,0,.2);z-index:100;max-width:90%;text-align:center;}

@media (max-width:480px){
.brand-title{font-size:2.8em;} .brand-sub{font-size:1.2em;letter-spacing:.5px;}
.brand-eyebrow{font-size:.9em;letter-spacing:3.5px;}
.countdown-big{font-size:4.6em;} .page-title{font-size:2em;}
main{padding:18px;} .top-bar{padding:calc(14px + env(safe-area-inset-top)) 18px 10px;} .tab-btn{padding:13px 14px 10px;font-size:.68em;}
}
@media (max-width:360px){
.brand-title{font-size:2.4em;} .brand-sub{font-size:1.08em;}
}

.rsvp-by-note{ text-align:center; color:#A4173A; font-weight:600; letter-spacing:.02em; font-size:1.02rem; margin:4px 0 20px; }