@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;1,400;1,500&family=Noto+Serif+JP:wght@300;400;500&display=swap');

:root { --ivory:#f7f3ea; --paper:#fdfbf6; --ink:#3d4038; --sage:#7c8d78; --sage-dark:#5f705c; --gold:#b89a62; --line:#d8cdb8; }
*{box-sizing:border-box} html{scroll-behavior:smooth} body{margin:0;background:var(--ivory);color:var(--ink);font-family:"Noto Serif JP",YuMincho,"Yu Mincho",serif;font-weight:300} button{font:inherit} img{display:block;width:100%;height:100%;object-fit:cover}.site{opacity:0}.site.visible{opacity:1;animation:softIn 1.2s ease}.gift-screen{position:fixed;inset:0;z-index:1000;display:grid;place-items:center;background:radial-gradient(circle at 50% 42%,#fffdf8 0,#f5efe3 62%,#ece3d4 100%);overflow:hidden}.skip{position:absolute;right:24px;top:24px;border:0;background:none;color:#807b70;font:11px/1 "Cormorant Garamond",serif;letter-spacing:.22em;padding:12px;cursor:pointer}.gift-wrap{text-align:center;position:relative}.envelope{width:min(78vw,400px);height:245px;position:relative;background:#e5d8c3;box-shadow:0 22px 60px #6d604327;border:1px solid #d5c4a8}.envelope:before,.envelope:after{content:"";position:absolute;inset:0;border-style:solid;z-index:3}.envelope:before{border-width:122px 199px;border-color:transparent #e9decc #e9decc transparent}.envelope:after{border-width:122px 199px;border-color:transparent transparent #dfd0b8 #dfd0b8}.flap{position:absolute;inset:0;z-index:5;transform-origin:top;clip-path:polygon(0 0,100% 0,50% 64%);background:#efe5d5}.card{position:absolute;z-index:2;left:8%;right:8%;top:12%;height:82%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;background:#fffdf9;border:1px solid var(--line);box-shadow:0 5px 20px #8f7d5e22}.card:before{content:"";position:absolute;inset:9px;border:1px solid #d9ccb5}.card span{font:italic 28px/1.2 "Cormorant Garamond",serif;color:var(--sage-dark)}.card strong{font-size:12px;font-weight:400;letter-spacing:.15em}.open-button{margin-top:45px;border:0;border-bottom:1px solid var(--gold);background:transparent;color:#5e5d55;font:15px/1.5 "Cormorant Garamond",serif;letter-spacing:.3em;padding:10px 18px 9px;cursor:pointer}.open-button i{font-style:normal;color:var(--gold)}.leaf{position:absolute;width:110px;height:35px;border:1px solid var(--sage);border-color:var(--sage) transparent transparent transparent;border-radius:50%;opacity:.45}.leaf:after{content:"";position:absolute;width:30px;height:13px;border:1px solid var(--sage);border-radius:100% 0;top:-9px;left:28px;transform:rotate(-20deg)}.leaf-a{left:-80px;top:-40px;transform:rotate(35deg)}.leaf-b{right:-70px;bottom:40px;transform:rotate(210deg)}.gift-screen.is-opening .flap{animation:flapOpen .65s forwards}.gift-screen.is-opening .card{animation:cardRise 1.25s .35s both}.gift-screen.is-opening{animation:giftFade .6s 1.05s forwards}.gift-screen.is-opening .open-button{opacity:0}.hero{height:100svh;min-height:620px;position:relative;color:white;overflow:hidden}.hero picture{position:absolute;inset:0}.hero img{object-position:center 42%;animation:heroZoom 12s ease-out both}.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(22,25,19,.54),rgba(22,25,19,.08) 58%,rgba(22,25,19,.16)),linear-gradient(0deg,rgba(16,18,14,.28),transparent 42%)}.hero-copy{position:absolute;left:clamp(30px,9vw,150px);top:50%;transform:translateY(-48%);max-width:560px;text-shadow:0 2px 18px #0004}.hero-copy .script{font:italic clamp(54px,8vw,96px)/.9 "Cormorant Garamond",serif;margin:0 0 24px}.hero-copy h1{font:400 clamp(18px,2.1vw,27px)/1.4 "Cormorant Garamond",serif;letter-spacing:.3em;margin:0}.hero-copy time{display:block;font:13px/1.5 "Cormorant Garamond",serif;letter-spacing:.28em;margin-top:8px}.hero-copy>p:last-child{font:italic 19px/1.5 "Cormorant Garamond",serif;letter-spacing:.06em}.gold-line{width:74px;height:1px;background:#d9c495;margin:28px 0}.scroll-cue{position:absolute;left:50%;bottom:22px;color:white;text-decoration:none;display:flex;flex-direction:column;gap:10px;align-items:center;font:9px/1 "Cormorant Garamond",serif;letter-spacing:.3em}.scroll-cue i{width:1px;height:42px;background:#fff8;position:relative;overflow:hidden}.scroll-cue i:after{content:"";position:absolute;inset:0;background:#fff;animation:scrollLine 2s infinite}.paper-section{background:var(--paper)}section:not(.hero):not(.ending){padding:clamp(85px,12vw,160px) max(24px,7vw)}.section-title{text-align:center;margin-bottom:55px}.section-title>span{display:inline-flex;align-items:center;gap:20px;color:var(--sage-dark);font:500 13px/1.4 "Cormorant Garamond",serif;letter-spacing:.26em}.section-title>span:before,.section-title>span:after{content:"";width:35px;height:1px;background:var(--gold)}.section-title h2{font-size:clamp(20px,2.4vw,30px);font-weight:400;letter-spacing:.16em;margin:20px 0 0}.ornament{text-align:center;color:var(--gold);font-size:28px;margin-bottom:28px}.congrats{text-align:center}.lead-message{font-size:clamp(15px,1.5vw,18px);line-height:2.45;letter-spacing:.08em;max-width:720px;margin:0 auto}.sender{font:italic 20px/1.5 "Cormorant Garamond",serif;margin-top:36px;color:var(--sage-dark)}.story{max-width:1280px;margin:auto}.story-row{display:flex;align-items:center;gap:clamp(42px,9vw,130px);margin:0 0 clamp(110px,14vw,190px)}.story-row.reverse{flex-direction:row-reverse}.reveal-photo{margin:0;width:56%;height:min(70vw,730px);overflow:hidden;box-shadow:0 30px 80px #50583e20}.reveal-photo.wide{height:min(43vw,520px);width:64%}.reveal-photo img{transition:transform 1.2s ease}.reveal-photo:hover img{transform:scale(1.025)}.story-copy{flex:1}.story-copy b{display:block;color:var(--gold);font:italic 36px/1 "Cormorant Garamond",serif;border-bottom:1px solid var(--line);padding-bottom:12px;margin-bottom:28px}.story-copy p{font-size:clamp(17px,2vw,25px);line-height:2;letter-spacing:.08em}.couple-section{background:#e9e6dc}.couple-grid{max-width:1120px;margin:auto;display:grid;grid-template-columns:1.35fr .65fr;gap:24px;align-items:end}.couple-grid figure{margin:0;overflow:hidden}.couple-main{height:620px}.couple-main img{object-position:center 38%}.couple-side{height:520px}.couple-side img{object-position:center 43%}.nameplate{display:flex;justify-content:center;align-items:center;gap:30px;margin:55px auto 0;font:400 clamp(18px,2.2vw,27px)/1 "Cormorant Garamond",serif;letter-spacing:.24em}.nameplate i{font:italic 34px/1 "Cormorant Garamond",serif;color:var(--gold)}.family-section{text-align:center;position:relative;overflow:hidden}.family-section>p{line-height:2;letter-spacing:.08em;margin:-25px 0 50px}.dog-name{font:italic 19px/1.5 "Cormorant Garamond",serif!important;color:var(--sage-dark)}.family-collage{height:740px;max-width:1080px;margin:auto;position:relative}.family-collage figure{position:absolute;margin:0;overflow:hidden;box-shadow:0 24px 60px #4e58401d}.family-a{width:45%;height:83%;left:4%;top:0}.family-b{width:36%;height:54%;right:3%;top:6%}.family-c{width:40%;height:46%;right:13%;bottom:0;border:12px solid var(--ivory)}.family-a img{object-position:50% 58%}.family-b img{object-position:50% 32%}.family-c img{object-position:50% 54%}.gallery-section{background:var(--paper)}.gallery-note{text-align:center;color:#837f74;font-size:12px;letter-spacing:.08em;margin:-30px 0 48px}.gallery-grid{max-width:1180px;margin:auto;display:grid;grid-template-columns:repeat(12,1fr);grid-auto-rows:95px;gap:14px}.gallery-item{border:0;padding:0;background:#ddd;position:relative;overflow:hidden;cursor:zoom-in}.gallery-item img{transition:transform .7s ease,filter .7s ease}.gallery-item:hover img{transform:scale(1.035);filter:brightness(.93)}.gallery-item span{position:absolute;right:10px;bottom:8px;color:white;font:11px/1 "Cormorant Garamond",serif;letter-spacing:.15em;text-shadow:0 1px 8px #000}.item-1{grid-column:1/8;grid-row:1/5}.item-2{grid-column:8/13;grid-row:1/6}.item-3{grid-column:1/6;grid-row:5/8}.item-4{grid-column:6/13;grid-row:6/11}.item-5{grid-column:1/6;grid-row:8/13}.item-6{grid-column:6/13;grid-row:11/14}.item-7{grid-column:1/5;grid-row:13/18}.item-8{grid-column:5/9;grid-row:14/19}.item-9{grid-column:9/13;grid-row:14/19}.item-10{grid-column:1/5;grid-row:18/23}.item-11{grid-column:5/9;grid-row:19/24}.item-12{grid-column:9/13;grid-row:19/24}.letter-section{background:linear-gradient(135deg,#e9e3d6,#f4f0e7)}.letter{position:relative;background:#fffdf9;max-width:780px;margin:auto;padding:clamp(55px,8vw,100px);box-shadow:0 30px 80px #4c493f18;border:1px solid #ded4c2;text-align:center}.letter:before{content:"";position:absolute;inset:13px;border:1px solid #e5dccd;pointer-events:none}.letter-date{font:13px/1.5 "Cormorant Garamond",serif;letter-spacing:.24em;color:#8a8479}.wax{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:#84907d;color:#f5eddd;margin:28px auto;font:italic 21px/1 "Cormorant Garamond",serif;box-shadow:inset 0 0 0 3px #ffffff35}.letter h3{font-size:21px;font-weight:400;letter-spacing:.15em;margin:0 0 35px}.letter p{font-size:15px;line-height:2.45;letter-spacing:.07em;text-align:left}.letter strong{display:block;font-weight:400;letter-spacing:.15em;margin-top:35px}.letter em{display:block;font:italic 20px/1.5 "Cormorant Garamond",serif;color:var(--sage-dark);margin-top:12px}.ending{height:100svh;min-height:680px;position:relative;color:white;overflow:hidden}.ending>img{position:absolute;inset:0;object-position:center 55%}.ending-overlay{position:absolute;inset:0;background:linear-gradient(0deg,#1d241d99,#30372c1a 65%),linear-gradient(90deg,#1c241d33,#1c241d11)}.ending-copy{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;text-shadow:0 2px 16px #0005;padding:30px}.ending-copy p{font:italic clamp(29px,5vw,58px)/1.25 "Cormorant Garamond",serif;margin:0}.ending-copy h2{font-size:clamp(20px,2.5vw,30px);font-weight:400;letter-spacing:.2em;margin:30px 0}.ending-copy span{font:17px/1.4 "Cormorant Garamond",serif;letter-spacing:.25em}.ending-copy small{margin-top:15px;font:italic 16px/1.4 "Cormorant Garamond",serif}.petal{position:absolute;z-index:2;width:10px;height:18px;background:#f6eee2b8;border-radius:100% 0 100% 0;animation:petal 7s linear infinite}.p1{left:18%;top:-20px}.p2{left:65%;top:-40px;animation-delay:2s}.p3{left:82%;top:-30px;animation-delay:4s}footer{padding:70px 25px 38px;background:#343d34;text-align:center;color:#d8d4c8}footer button{border:1px solid #aeb8aa;background:transparent;color:#f5f1e8;padding:14px 24px;margin:6px;min-width:220px;letter-spacing:.08em;cursor:pointer;transition:.3s}footer button:hover{background:#f5f1e8;color:#384038}footer p{font:italic 17px/1.4 "Cormorant Garamond",serif;letter-spacing:.14em;margin:45px 0 0;opacity:.7}.lightbox{position:fixed;inset:0;z-index:1100;background:#171914f2;display:flex;align-items:center;justify-content:center;color:white}.lightbox figure{margin:0;max-width:min(88vw,1100px);height:88vh;display:flex;flex-direction:column;align-items:center}.lightbox img{object-fit:contain;min-height:0}.lightbox figcaption{font:13px/1 "Cormorant Garamond",serif;letter-spacing:.2em;padding-top:13px}.lightbox button{position:absolute;border:0;background:transparent;color:white;cursor:pointer;font-family:Arial,sans-serif}.lb-close{right:20px;top:12px;font-size:38px}.lb-prev,.lb-next{top:50%;font-size:60px;padding:20px}.lb-prev{left:12px}.lb-next{right:12px}.bgm{position:fixed;right:18px;bottom:18px;z-index:50}.bgm button{width:46px;height:46px;border-radius:50%;border:1px solid #fff8;background:#465244d9;color:white;box-shadow:0 4px 20px #0002;cursor:pointer}
@keyframes flapOpen{to{transform:rotateX(180deg);z-index:1}}@keyframes cardRise{0%,45%{z-index:2}50%{z-index:6;transform:translateY(-100px)}100%{z-index:6;transform:translateY(-30px)}}@keyframes giftFade{to{opacity:0;visibility:hidden}}@keyframes softIn{from{opacity:0}to{opacity:1}}@keyframes heroZoom{from{transform:scale(1.03)}to{transform:scale(1.1)}}@keyframes scrollLine{from{transform:translateY(-100%)}to{transform:translateY(100%)}}@keyframes petal{0%{transform:translate(0,-20px) rotate(0)}100%{transform:translate(80px,110vh) rotate(420deg)}}
@media(max-width:700px){.gift-screen{min-height:100svh}.envelope{width:82vw;height:205px}.envelope:before,.envelope:after{border-width:102px 41vw}.card span{font-size:24px}.hero img{object-position:48% 48%;transform:scale(1.16)}.hero-shade{background:linear-gradient(0deg,#20231d99 0,#20231d15 75%)}.hero-copy{left:24px;right:24px;top:auto;bottom:115px;transform:none;text-align:center}.hero-copy .script{font-size:58px}.hero-copy h1{font-size:17px}.gold-line{margin:22px auto}.hero-copy>p:last-child{font-size:17px}.story-row,.story-row.reverse{display:block;margin-bottom:110px}.reveal-photo,.reveal-photo.wide{width:100%;height:125vw;max-height:620px}.reveal-photo.wide{height:74vw}.story-copy{padding:28px 8px 0}.story-copy b{font-size:28px}.couple-grid{grid-template-columns:1fr 1fr;gap:8px}.couple-main{height:92vw}.couple-side{height:72vw}.nameplate{gap:14px;letter-spacing:.12em}.family-collage{height:132vw;max-height:650px}.family-a{width:61%;height:75%;left:0}.family-b{width:50%;height:49%;right:0;top:4%}.family-c{width:54%;height:45%;right:4%;border-width:7px}.gallery-grid{grid-template-columns:repeat(2,1fr);grid-auto-rows:40vw;gap:7px}.gallery-item{grid-column:auto!important;grid-row:auto!important}.gallery-item.landscape{grid-column:span 2!important}.gallery-item.portrait{grid-row:span 2!important}.letter{padding:58px 34px}.letter p{line-height:2.25}.ending>img{object-position:center 55%}.lb-prev,.lb-next{font-size:45px}.lb-prev{left:0}.lb-next{right:0}.lightbox figure{max-width:88vw;height:82vh}footer button{display:block;margin:10px auto}}
.couple-grid.single{display:block;max-width:900px}.couple-grid.single .couple-main{height:auto;aspect-ratio:3/2}.letter .letter-sender{margin:28px 0 0;text-align:right;font-family:"Noto Serif JP",YuMincho,"Yu Mincho",serif;font-size:13px;line-height:1.8;letter-spacing:.08em;white-space:nowrap;color:var(--sage-dark)}
.family-c{width:47%;height:54%;right:8.5%}
@media(max-width:700px){.family-c{width:62%;height:51%;right:2%}}
.gift-screen.is-opening{animation-delay:3.1s}
.card small{position:absolute;z-index:1;right:22px;bottom:17px;color:#756f64;font-family:"Noto Serif JP",YuMincho,"Yu Mincho",serif;font-size:10.5px;font-weight:300;line-height:1.4;letter-spacing:.08em;white-space:nowrap}
@media(max-width:700px){.card small{right:18px;bottom:15px;font-size:9.5px}}
@media(max-width:700px){.envelope{width:min(92vw,440px);height:230px}.envelope:before,.envelope:after{border-width:115px min(46vw,220px)}.card span{font-size:28px}.card strong{font-size:13px}.card small{right:20px;bottom:16px;font-size:10.5px}}
.mobile-break{display:none}
@media(max-width:700px){.mobile-break{display:block}.congrats{padding-left:8px!important;padding-right:8px!important}.lead-message{font-size:clamp(9.4px,3vw,12px);line-height:2.4;letter-spacing:0}.mobile-reveal{opacity:0;transform:translateY(34px);transition:opacity .85s ease,transform .85s cubic-bezier(.22,.61,.36,1)}.mobile-reveal.mobile-visible{opacity:1;transform:translateY(0)}.mobile-photo-reveal img{transform:scale(1);transition:transform 1.15s cubic-bezier(.22,.61,.36,1),filter .7s ease}.mobile-photo-reveal.mobile-visible img{transform:scale(1.045)}.ending.mobile-photo-reveal>img{transform:scale(1.01)}.ending.mobile-photo-reveal.mobile-visible>img{transform:scale(1.065)}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}
.item-13{grid-column:1/5;grid-row:24/29}.item-14{grid-column:5/9;grid-row:24/29}.item-15{grid-column:9/13;grid-row:24/29}.item-16{grid-column:1/5;grid-row:29/34}.item-17{grid-column:5/13;grid-row:29/33}.item-18{grid-column:1/5;grid-row:34/39}.item-19{grid-column:5/9;grid-row:34/39}.item-20{grid-column:9/13;grid-row:34/39}
