@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;1,400;1,500&family=Great+Vibes&family=Montserrat:wght@400;500&display=swap');
:root{--cream:#f7f3ec;--ink:#51463c;--gold:#aa8954;--wine:#70273c}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--cream);color:var(--ink);font-family:'Cormorant Garamond',Georgia,serif}body:has(.gate:not(.opened)){overflow:hidden}button,a{-webkit-tap-highlight-color:transparent}a{color:inherit}button{cursor:pointer}button:focus-visible,a:focus-visible{outline:3px solid #ba975a;outline-offset:6px}header{position:absolute;z-index:2;top:0;left:0;width:100%;display:flex;justify-content:space-between;align-items:center;padding:24px 5%;color:#fff}header>a:last-child{font-family:Montserrat,sans-serif;font-size:10px;letter-spacing:2px;text-transform:uppercase;text-decoration:none}.monogram{font-size:40px;text-decoration:none}.hero{min-height:800px;height:100svh;position:relative;display:grid;place-items:center;color:#fff;text-align:center}.hero>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 45%}.hero:after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(27,20,15,.30),rgba(27,20,15,.15) 35%,rgba(27,20,15,.64))}.hero-copy{z-index:1;position:relative;padding:30px;width:100%;align-self:end;margin-bottom:125px}.eyebrow{font-family:Montserrat,sans-serif;font-size:10px;letter-spacing:3px;line-height:1.9;font-weight:500}h1{font-family:'Great Vibes',cursive;font-weight:400;font-size:clamp(74px,10vw,145px);margin:22px 0 15px}h2{font-size:clamp(34px,4vw,53px);font-weight:400;line-height:1.15;margin:15px 0 30px}h3{font-size:44px;font-weight:400;margin:15px 0}.gold-line{display:block;width:65px;height:1px;background:#dac28d;margin:30px auto}.date{font-size:23px;letter-spacing:7px}.hero-location{font-size:20px;font-style:italic}.scroll{position:absolute;bottom:35px;z-index:1;font-size:32px;text-decoration:none}.section{padding:100px 24px;text-align:center}.welcome{max-width:800px;margin:auto}.ornament{font-size:45px;color:var(--gold);display:block;margin-bottom:30px}.prose{max-width:530px;margin:20px auto;font-size:23px;line-height:1.65;color:#786b5e}.signature{font-family:'Great Vibes',cursive;font-size:37px;display:block;color:var(--gold);margin-top:38px}.guest{font-size:29px;color:var(--wine);font-style:italic;overflow-wrap:anywhere}.memories{background:#eee8dd}.gallery{max-width:1050px;margin:50px auto 30px;display:grid;grid-template-columns:1fr 1fr 1fr;gap:25px;align-items:center}.gallery button{border:0;background:none;padding:0;overflow:hidden}.gallery img{width:100%;height:440px;object-fit:cover;display:block;transition:transform .5s}.gallery button:nth-child(2){transform:translateY(-12px)}.gallery button:nth-child(2) img{height:490px}.gallery button:hover img{transform:scale(1.04)}.caption{font-size:23px;font-style:italic;color:#82735f}.weekday{letter-spacing:3px;font:11px Montserrat,sans-serif}.venue{border:1px solid #c9b58e;max-width:530px;margin:45px auto 30px;padding:45px 25px}.venue svg{width:42px;stroke:var(--gold);stroke-width:1.2;margin-bottom:15px}.venue>p:not(.eyebrow){font-size:22px;line-height:1.5}.button{display:inline-flex;align-items:center;gap:35px;padding:17px 25px;margin-top:20px;border:1px solid var(--gold);text-decoration:none;font:10px Montserrat,sans-serif;letter-spacing:2px}.button:hover{background:var(--gold);color:white}.calendar{font:10px Montserrat,sans-serif;letter-spacing:2px;text-underline-offset:7px}.count-section{background:#e9e1d3}.countdown{display:flex;justify-content:center;align-items:start;gap:25px;margin:45px auto}.countdown div{min-width:70px}.countdown b{font-size:64px;font-weight:400;line-height:1}.countdown span{display:block;font:9px Montserrat,sans-serif;letter-spacing:2px;margin-top:16px}.countdown i{font-size:35px;font-style:normal;color:var(--gold)}.count-section>p:last-child{font-size:22px;font-style:italic}footer{text-align:center;padding:60px 20px}footer .ornament{margin:0}footer p{font-family:'Great Vibes',cursive;font-size:48px;margin:15px}footer small{letter-spacing:5px;font-size:12px}.gate{position:fixed;inset:0;z-index:10;display:grid;place-items:center;padding:25px;background:linear-gradient(#50463699,#50463699),url('assets/foto-1.jpg') center/cover;backdrop-filter:blur(6px);transition:opacity 1s,visibility 1s}.envelope{position:relative;width:min(600px,100%);height:380px;background:repeating-linear-gradient(0deg,#f5efdf,#f5efdf 2px,#eee7d8 3px);border:2px solid #b89a5d;border-radius:8px;box-shadow:0 20px 50px #0005;text-align:center}.flap{position:absolute;inset:0;background:linear-gradient(155deg,#fdf9ed,#eae0cc);clip-path:polygon(0 0,100% 0,50% 62%);filter:drop-shadow(0 4px 2px #aa8954);transform-origin:top;transition:transform .7s}.envelope p{position:relative;font-size:24px;font-style:italic;margin:38px 10px;color:#877555}.envelope button{position:absolute;left:calc(50% - 42px);top:54%;width:84px;height:84px;border-radius:48% 42% 46% 40%;border:5px double #9b5c62;background:var(--wine);box-shadow:2px 5px 8px #0005;color:#ddbd78;font:52px Georgia;transition:transform .4s}.envelope small{position:absolute;bottom:30px;left:0;right:0;font:8px Montserrat,sans-serif;letter-spacing:3px;color:#8e7d5c}.gate.opened{opacity:0;visibility:hidden}.opened .flap{transform:rotateX(180deg)}.opened button{transform:translateY(40px);opacity:0}dialog{border:0;padding:0;background:transparent;max-width:95vw;max-height:95svh}dialog::backdrop{background:#201a17ed}dialog img{display:block;max-width:90vw;max-height:88svh;object-fit:contain}.close{position:fixed;right:20px;top:10px;color:white;background:transparent;border:0;font-size:45px}@media(max-width:600px){.hero{min-height:650px}.hero>img{object-position:51% center}.hero-copy{margin-bottom:110px;padding:20px 12px}.hero .eyebrow{font-size:8px;letter-spacing:2px}h1{font-size:80px}.section{padding:75px 22px}.eyebrow{font-size:8px;letter-spacing:2px}.prose{font-size:21px}.gallery{gap:10px;margin-top:35px}.gallery img{height:230px}.gallery button:nth-child(2) img{height:270px}.caption{font-size:20px}.countdown{gap:10px}.countdown div{min-width:52px}.countdown b{font-size:43px}.countdown i{font-size:25px}.countdown span{font-size:7px;letter-spacing:1px}.envelope{height:280px}.envelope p{font-size:20px;margin-top:28px}.envelope button{width:70px;height:70px;left:calc(50% - 35px);font-size:42px}.envelope small{font-size:7px;bottom:23px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important}}
