:root{ --cream:#f6f3ec; --cream-2:#fbfaf6; --sage:#86a36f; --sage-dark:#6e8f5d; --text:#33403b; }
*{box-sizing:border-box}
html,body{height:100%}
body{margin:0; font-family:Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; line-height:1.6; color:var(--text); background:var(--cream);} 
h1,h2,h3{ font-family:"Cormorant Garamond", Georgia, serif; font-weight:500; line-height:1.2; margin:0 0 .6rem 0; color:#6b8457; letter-spacing:.3px; }
h1{font-size:clamp(36px,6vw,72px)} h2{font-size:clamp(28px,4vw,42px)} h3{font-size:clamp(22px,3vw,28px)}
p{margin:.25rem 0 1rem} .muted{opacity:.9}
.hero{background:var(--cream-2); padding:clamp(48px,10vw,120px) 24px; text-align:center; border-bottom:1px solid #e8e3d9}
.hero-inner{max-width:1100px;margin:0 auto}
.tiny-date{letter-spacing:.1em; font-size:.95rem; opacity:.7; margin-bottom:1rem}
.sub{font-family:"Cormorant Garamond", Georgia, serif; color:#7e9367; font-size:1rem; opacity:.9; margin-top:.5rem}
.split{display:grid; grid-template-columns:1fr 1fr 1fr; min-height:clamp(420px,60vw,560px)}
.block{position:relative}
.block.sage{background:var(--sage); color:#fff; display:flex; align-items:center; justify-content:center; padding:40px 28px}
.block.sage h2,.block.sage h3{color:#fff}
.split-inner{max-width:480px; text-align:center}
.img{width:100%; height:100%; background:linear-gradient(135deg,#e8e8e8,#cfcfcf); position:relative; overflow:hidden}
.img::after{content:attr(data-label); position:absolute; inset:auto 0 12px 0; text-align:center; font-family:Inter,sans-serif; font-size:.8rem; letter-spacing:.12em; color:#7a7a7a}
.ph-portrait{background-image:url('assets/1.jpg'); background-size:cover; background-position:center}
.ph-wide{background-image:url('assets/2.jpg'); background-size:cover; background-position:center}
.ph-tall{background-image:url('assets/3.jpg'); background-size:cover; background-position:center}
.photo .img{min-height:480px}
.image-cta{position:relative}
.image-cta .img{aspect-ratio:16/7; display:block}
.cta-card{position:absolute; top:8%; right:8%; width:min(420px,80vw); background:color-mix(in srgb, var(--sage) 85%, transparent); color:#fff; padding:28px 28px 32px; border-radius:8px; box-shadow:0 24px 40px rgba(0,0,0,.18); backdrop-filter:blur(1px)}
.cta-card h2{color:#fff;margin-bottom:.2rem}
.cta-card p{margin:.5rem 0 1rem; opacity:.95}
.btn{display:inline-block; border:1.5px solid #cfe0c0; padding:10px 18px; border-radius:6px; text-decoration:none; color:#eaf4e4; font-weight:500}
.btn.ghost:hover{background:#eaf4e4;color:var(--sage-dark)}
.info{padding:64px 20px 32px; background:var(--cream)}
.center{text-align:center;margin-bottom:32px}
.info-grid{max-width:1100px;margin:0 auto; display:grid; grid-template-columns:repeat(3,1fr); gap:min(6vw,56px)}
.info-item{text-align:center}
.icon{width:52px;height:52px;margin:0 auto 10px; color:var(--sage)}
.icon svg{fill:currentColor;width:100%;height:100%}
.closing-photo{position:relative}
.closing-photo .img{height:clamp(420px,65vh,760px)}
.date-overlay{position:absolute; inset:0; display:grid; place-items:center; font-family:"Cormorant Garamond", Georgia, serif; color:#fff; text-shadow:0 2px 20px rgba(0,0,0,.35); font-size:clamp(32px,6vw,64px); pointer-events:none}
.foot{text-align:center; padding:20px; color:#7a7a7a; background:var(--cream-2); border-top:1px solid #eee6d8}
.hide-on-mobile{display:block}
.content-hidden{display:none}
.password-modal{position:fixed; inset:0; background:color-mix(in srgb, var(--cream) 95%, rgba(0,0,0,.3)); backdrop-filter:blur(4px); display:flex; align-items:center; justify-content:center; z-index:10000; padding:20px}
.password-modal-content{background:var(--cream-2); border:1px solid #e8e3d9; border-radius:12px; padding:48px 40px; max-width:420px; width:100%; text-align:center; box-shadow:0 24px 40px rgba(0,0,0,.15)}
.password-modal-content h2{color:#6b8457; margin-bottom:.5rem}
.password-modal-content .muted{margin-bottom:28px; font-size:.95rem}
.password-modal-content form{display:flex; flex-direction:column; gap:16px}
.password-modal-content input[type="password"]{width:100%; padding:12px 16px; border:1.5px solid #d4d0c4; border-radius:6px; font-family:Inter,sans-serif; font-size:1rem; background:#fff; color:var(--text); transition:border-color .2s}
.password-modal-content input[type="password"]:focus{outline:none; border-color:var(--sage)}
.password-modal-content .btn{background:var(--sage); color:#fff; border:1.5px solid var(--sage); cursor:pointer; transition:background .2s, border-color .2s; font-size:1rem; padding:12px 24px}
.password-modal-content .btn:hover{background:var(--sage-dark); border-color:var(--sage-dark)}
.password-error{color:#c44; font-size:.9rem; margin-top:-8px; min-height:20px}
@media (max-width:980px){ .split{grid-template-columns:1fr 1fr} .hide-on-mobile{display:none} }
@media (max-width:700px){ .photo .img{min-height:360px} .cta-card{top:auto; bottom:6%; right:5%; left:5%; width:auto} .info-grid{grid-template-columns:1fr; gap:36px} .password-modal-content{padding:36px 28px} }