@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Playfair+Display:ital,wght@0,500;0,600;0,700;1,500;1,600&display=swap');
:root{--blue:#285a79;--deep:#183e59;--gold:#bd9045;--cream:#fffdf6;--sage:#667b68;--serif:'Playfair Display',Georgia,serif;--sans:'DM Sans',Arial,sans-serif}*{box-sizing:border-box}body{margin:0;color:var(--blue);font-family:var(--sans);overflow-x:hidden}button,input{font:inherit}.intro{min-height:100svh;display:grid;place-items:center;align-content:center;gap:13px;position:relative;isolation:isolate;overflow:hidden;padding:28px 18px;background:#f8f2e7 url('assets/fondo-floral-comunion.png') center/cover no-repeat}.intro:before{content:'';position:absolute;z-index:-1;inset:0;background:linear-gradient(#fffdf724,#fffdf724)}.eyebrow{margin:0;text-transform:uppercase;letter-spacing:.18em;font-size:10px;font-weight:700;color:#95702d;text-shadow:0 1px #fff}.envelope{position:relative;width:min(87vw,560px);border:0;background:transparent;cursor:pointer;padding:0;filter:drop-shadow(0 20px 16px #54422a58);transition:transform .55s ease}.envelope:focus-visible{outline:3px solid #946b25;outline-offset:8px}.envelope-photo{display:block;overflow:hidden;border-radius:4px}.envelope-photo img{display:block;width:100%;height:auto;transition:transform .72s cubic-bezier(.2,.8,.2,1),opacity .48s}.photo-seal{position:absolute;display:grid;place-items:center;left:50%;top:58%;transform:translate(-50%,-50%);width:43px;height:43px;border-radius:50%;color:#fff6de;font-size:19px;background:#a98251;border:2px solid #f8e6b6;box-shadow:0 2px 8px #46321e77;transition:opacity .2s}.envelope.open{transform:translateY(-30px) scale(.92)}.envelope.open .envelope-photo img{transform:rotateX(22deg) scale(1.04);opacity:.18}.envelope.open .photo-seal{opacity:0}.intro-name{margin:3px 0 0;font:600 29px var(--serif);color:var(--deep);text-shadow:0 1px #fff}.hint{margin:0;font-size:12px;color:#526d60;font-weight:600}.hint:before{content:'↟';margin-right:8px;color:var(--gold)}.sky-dot{display:none}.invitation{display:none;position:fixed;inset:0;z-index:10;overflow-y:auto;padding:42px 18px 0;text-align:center;background:#fcf7ed url('assets/fondo-floral-comunion.png') center top/cover fixed}.invitation:before{content:'';position:fixed;inset:0;z-index:-1;background:#fffdf4b5}.invitation.show{display:block;animation:arrival .72s cubic-bezier(.16,.8,.2,1) both}@keyframes arrival{from{opacity:0;transform:translateY(100%)}to{opacity:1;transform:none}}.paper-grain{display:none}.hero,.content-card,.date-block,.closing,.actions,footer{position:relative;max-width:530px;margin-left:auto;margin-right:auto}.cross-line{display:flex;align-items:center;justify-content:center;gap:12px;color:var(--gold);font-size:22px}.cross-line span{width:55px;height:1px;background:#c7aa75}.hero .eyebrow{margin-top:15px}.hero h1{margin:8px 0 10px;color:var(--deep);font:600 clamp(41px,12vw,62px)/.94 var(--serif);letter-spacing:-.045em;text-shadow:0 1px #fff}.hero h1 em{color:#b0853e;font-weight:600}.name{margin:0;font:600 20px/1.35 var(--serif);color:#537b81}.communion-illustration{max-width:255px;margin:8px auto 2px}.communion-illustration svg{width:100%;height:auto}.ray{stroke:#c9a34d;stroke-width:4;stroke-linecap:round}.host{fill:#fff7d8;stroke:#c7a04b;stroke-width:3}.cross{stroke:#9f7533;stroke-width:4;stroke-linecap:round}.chalice{fill:#78989b;stroke:#4d6f74;stroke-width:3;stroke-linejoin:round}.wheat-svg{fill:none;stroke:#b99341;stroke-width:4;stroke-linecap:round}.content-card{padding:24px 22px 20px;background:#fffefcf0;border:1px solid #d8c39a;border-radius:20px;box-shadow:0 12px 35px #6552351c}.message{margin:0;font-size:14px;line-height:1.7;color:#526b71}.wheat{font:30px var(--serif);color:#b99341;margin:12px 0}.family p{font-size:10px;text-transform:uppercase;letter-spacing:.13em;color:#9b7945;margin:10px 0 3px}.family strong{font:600 17px var(--serif);color:var(--deep)}.date-block{margin-top:26px;display:flex;justify-content:center;align-items:center;gap:20px;color:var(--deep)}.date-block>div{display:grid;gap:3px}.date-block i{height:67px;border-left:1px solid #c9ad73}.date-day,.date-block span{font-size:11px;text-transform:uppercase;letter-spacing:.12em;font-weight:700}.date-block b{font:600 50px/.9 var(--serif);color:#b0853e}.time strong{font:600 21px var(--serif)}.closing{margin-top:26px;font:italic 19px/1.45 var(--serif);color:#54747a;max-width:370px}.actions{display:grid;gap:12px;margin-top:27px;text-align:left}.action{min-height:76px;border:1px solid #cbb178;border-radius:15px;padding:11px 15px;display:flex;align-items:center;gap:13px;text-align:left;cursor:pointer;background:#fffdf9e8;color:var(--deep);transition:.2s}.action:hover{transform:translateY(-2px);box-shadow:0 8px 18px #49677e1c}.place-logo,.action-rsvp>span:first-child{display:grid;place-items:center;flex:0 0 39px;height:39px;border-radius:50%;color:#fff;background:#b6904a;font-size:22px}.action b,.action small{display:block}.action b{font-size:13px}.action small{font-size:10px;margin-top:3px;color:#718184}.place-tags{display:flex;gap:4px;margin-top:7px}.place-tags i{display:grid;place-items:center;width:19px;height:19px;border-radius:50%;font-style:normal;font-size:11px;color:#836227;background:#f8eac5}.action-rsvp{background:linear-gradient(130deg,#4d777d,#244c67);border-color:#244c67;color:#fff}.action-rsvp>span:first-child{background:#c29c55;color:#fff6d7}.action-rsvp small{color:#d9e8e6}.rsvp-panel{position:relative;max-width:530px;margin:20px auto 0;padding:27px 20px 20px;border-radius:20px;background:#fffefc;border:1px solid #d8c39a;box-shadow:0 18px 35px #4d617525;text-align:left}.rsvp-panel .eyebrow{text-align:center}.rsvp-panel h2{text-align:center;margin:7px 0 19px;font:600 26px var(--serif)}.close{position:absolute;right:11px;top:8px;border:0;background:transparent;color:var(--deep);font-size:28px;cursor:pointer}.rsvp-panel label{display:grid;gap:6px;font-size:12px;font-weight:600;color:#4a646b}.rsvp-panel input{width:100%;padding:10px;border:1px solid #d8cdb7;background:#fffcf6;border-radius:8px;color:var(--deep);outline-color:#b99858}.number-row{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:13px}.total{text-align:center;font-size:13px;color:#527078}.form-error{min-height:18px;margin:6px 0;color:#a63f3f;text-align:center;font-size:12px}.whatsapp{width:100%;border:0;border-radius:9px;padding:13px;background:#2d725f;color:#fff;font-weight:600;cursor:pointer}.form-note{text-align:center;font-size:10px;color:#728495;margin:10px 0 0}.sound-control{position:fixed;z-index:15;right:15px;top:14px;border:1px solid #d4c28f;background:#fffcf5e8;border-radius:99px;padding:7px 10px;color:#866b37;font-size:11px;cursor:pointer}.sound-control span:first-child{margin-right:5px;font-size:15px}footer{padding:38px 0 23px;font-size:10px;letter-spacing:.09em;text-transform:uppercase;color:#8d7a5a}footer span{color:#b99341}@media(min-width:600px){.invitation{padding-top:60px}.content-card{padding:29px 42px}.message{font-size:15px}.actions{grid-template-columns:1fr 1fr}.rsvp-panel{padding:30px 35px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}
