/* Pinyon Script (OFL), self-hosted from Google Fonts v24 */
/* vietnamese */
@font-face {
  font-family: 'Pinyon Script';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(assets/fonts/PinyonScript-vietnamese.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Pinyon Script';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(assets/fonts/PinyonScript-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Pinyon Script';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(assets/fonts/PinyonScript-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face{font-family:"IvyPresto Headline";src:url("assets/fonts/IvyPresto-Headline-Light.woff2") format("woff2"),url("assets/fonts/IvyPresto-Headline-Light.otf") format("opentype");font-weight:300;font-style:normal;font-display:swap}
body{margin:0;background:#15120D}
a{color:#F2E5C6}a:hover{color:#ffffff}
/* The static markup toggles these with the hidden attribute, and several have inline display */
[hidden]{display:none!important}
/* <picture> wrappers must not create a box, or the img rules below stop applying */
picture{display:contents}
/* <source> is not display:none by default, so in a flex container with a gap it counts as an empty item */
source{display:none}
/* width/height attributes reserve space, but they must not override the design's aspect-ratio and height:auto rules */
img{height:auto}
.ck-in input{font:inherit}
.ck-in input::placeholder{color:#8a8070}
.ck-in input:focus-visible,.ck-in a:focus-visible,.ck-in button:focus-visible{outline:2px solid #77845B;outline-offset:3px}
/* the pistachio section would hide the default ring */
.ck-in .ck-focus-champagne:focus-visible{outline-color:#F2E5C6}
/* sections take focus after a nav jump. A ring around a whole section is noise, and they are not tab stops */
section[tabindex="-1"]:focus{outline:none}
.ck-nav-links{display:flex;flex-wrap:wrap;gap:8px 24px}
/* phones: the links fit one row under the brand and the music button */
@media (max-width:767px){.ck-nav-links{order:1;width:100%;justify-content:space-between;gap:0 6px;font-size:10px;letter-spacing:.06em}}
.ck-hero-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 60%;z-index:-1;opacity:.34;pointer-events:none}
.ck-photo{display:block;width:100%;height:100%;object-fit:cover}
/* music record */
.ck-vinyl-wrap{position:relative;width:clamp(260px,34vw,380px);aspect-ratio:1.45/1;flex:0 0 auto}
.ck-sleeve{position:absolute;left:0;top:0;bottom:0;aspect-ratio:1/1;z-index:2;background:#F2E5C6;border-radius:3px;box-shadow:0 18px 40px rgba(0,0,0,.35);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;color:#49111B;font-family:'IvyPresto Headline',Georgia,serif;font-size:15px;letter-spacing:.3em}
.ck-sleeve img{width:42%;height:auto}
.ck-vinyl{position:absolute;top:4%;bottom:4%;right:0;aspect-ratio:1/1;z-index:1;border-radius:50%;background:repeating-radial-gradient(circle at 50% 50%,#15120D 0 2px,#221c16 2px 3px),#15120D;box-shadow:0 12px 30px rgba(0,0,0,.4),inset 0 0 0 2px #0c0a07;display:flex;align-items:center;justify-content:center;animation:ck-spin 9s linear infinite}
.ck-vinyl::after{content:"";position:absolute;inset:0;border-radius:50%;background:conic-gradient(from 30deg,transparent 0 12%,rgba(255,255,255,.07) 18%,transparent 26% 62%,rgba(255,255,255,.05) 68%,transparent 76%)}
.ck-vinyl-label{width:36%;aspect-ratio:1/1;border-radius:50%;background:#F2E5C6;display:flex;align-items:center;justify-content:center;box-shadow:inset 0 0 0 3px #49111B}
.ck-vinyl-label img{width:52%;height:auto}
@keyframes ck-spin{to{transform:rotate(360deg)}}
.ck-play{display:inline-flex;align-items:center;gap:14px;min-height:56px;padding:0 28px 0 8px;border-radius:999px;background:#F2E5C6;color:#49111B;text-decoration:none;font-size:12px;letter-spacing:.22em;text-transform:uppercase;font-weight:700;transition:transform .25s,box-shadow .25s}
.ck-play:hover{color:#49111B;transform:translateY(-2px);box-shadow:0 10px 24px rgba(0,0,0,.25)}
.ck-play-dot{width:40px;height:40px;border-radius:50%;background:#49111B;color:#F2E5C6;display:flex;align-items:center;justify-content:center;padding-left:2px;box-sizing:border-box}
/* smooth jumps */
@media (prefers-reduced-motion:no-preference){
html,body{scroll-behavior:smooth}
}
/* gift envelopes */
.ck-env{width:100%;max-width:400px;padding-top:0;transition:padding-top .6s cubic-bezier(.4,.1,.2,1) 0s}
.ck-env.is-open{padding-top:210px;transition:padding-top .7s cubic-bezier(.4,.1,.2,1) .3s}
.ck-env-box{position:relative;width:100%;height:270px;perspective:1200px}
.ck-env-back{position:absolute;inset:0;background:#3A0F18;border-radius:3px}
.ck-env-letter{position:absolute;left:6%;right:6%;top:12px;height:252px;box-sizing:border-box;z-index:1;background:#FBF5E6;color:#15120D;border-radius:2px;padding:24px 22px 64px;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:9px;text-align:center;box-shadow:0 -2px 12px rgba(21,18,13,.16);transform:translateY(0);visibility:hidden;transition:transform .6s cubic-bezier(.4,.1,.2,1) 0s,visibility 0s .6s}
.ck-env.is-open .ck-env-letter{transform:translateY(-210px);visibility:visible;transition:transform .7s cubic-bezier(.4,.1,.2,1) .3s,visibility 0s 0s}
.ck-env-pocket{position:absolute;inset:0;z-index:2;background:#49111B;border-radius:3px;clip-path:polygon(0 0,50% 52%,100% 0,100% 100%,0 100%);pointer-events:none}
.ck-env-pocket::before{content:"";position:absolute;inset:0;background:linear-gradient(to top right,rgba(0,0,0,.18),transparent 55%),linear-gradient(to top left,rgba(0,0,0,.12),transparent 55%)}
.ck-env-flap{position:absolute;left:0;right:0;top:0;height:58%;z-index:3;background:#5A1A28;clip-path:polygon(0 0,100% 0,50% 100%);transform-origin:top center;transform:rotateX(0deg);pointer-events:none;transition:transform .5s cubic-bezier(.4,.1,.2,1) .55s,z-index 0s .8s,background .5s .55s}
.ck-env.is-open .ck-env-flap{transform:rotateX(180deg);z-index:0;background:#3F121D;transition:transform .5s cubic-bezier(.4,.1,.2,1) 0s,z-index 0s .25s,background .5s 0s}
.ck-env-seal{position:absolute;left:50%;top:58%;z-index:4;width:62px;height:62px;margin:-31px 0 0 -31px;border-radius:50%;background:#2D111B;box-shadow:0 2px 6px rgba(0,0,0,.35),inset 0 0 0 3px rgba(242,229,198,.18);display:flex;align-items:center;justify-content:center;pointer-events:none;transition:opacity .3s 1s,transform .4s 1s}
.ck-env-seal img{width:30px;height:auto}
.ck-env.is-open .ck-env-seal{opacity:0;transform:scale(.6);transition:opacity .25s 0s,transform .25s 0s}
.ck-env-hit{position:absolute;inset:0;z-index:5;border:0;background:transparent;cursor:pointer;border-radius:3px}
.ck-env.is-open .ck-env-hit{top:45%}
.ck-env-box:hover .ck-env-seal{transform:scale(1.06)}
.ck-env.is-open .ck-env-box:hover .ck-env-seal{transform:scale(.6)}
/* gallery carousel */
/* position:relative makes the track the offsetParent, so figure offsetLeft is measured from the track */
.ck-track{position:relative;scrollbar-width:none;scroll-behavior:smooth}
.ck-track::-webkit-scrollbar{display:none}
.ck-track:focus-visible{outline:2px solid #77845B;outline-offset:6px}
.ck-fig{margin:0;flex:0 0 auto;scroll-snap-align:center;transition:opacity .5s ease,transform .5s ease;opacity:0.45;transform:scale(0.94)}
.ck-fig.is-current{opacity:1;transform:scale(1)}
.ck-dot{display:block;height:6px;border-radius:999px;transition:width .3s,background .3s;width:6px;background:rgba(242,229,198,0.4)}
.ck-dotbtn[aria-current="true"] .ck-dot{width:22px;background:#F2E5C6}
.ck-arrow{width:52px;height:52px;border-radius:50%;border:1px solid rgba(242,229,198,.55);background:transparent;color:#F2E5C6;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background .25s,color .25s}
.ck-arrow:hover{background:#F2E5C6;color:#15120D}
/* paper texture */
.ck-in>header,.ck-in>section,.ck-in>footer{position:relative;isolation:isolate;overflow:hidden;background-color:#F2E5C6}
.ck-in>header::after,.ck-in>section::after,.ck-in>footer::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background-image:url("assets/papel.png");background-size:512px 512px;mix-blend-mode:overlay;opacity:.38}
/* scalloped top edge, like a die-cut card */
.ck-scallop{-webkit-mask:radial-gradient(circle at 14px 0,#0000 13px,#000 14px) top left/28px 100% repeat-x;mask:radial-gradient(circle at 14px 0,#0000 13px,#000 14px) top left/28px 100% repeat-x}
/* blind-embossed monogram */
.ck-emboss{position:absolute;z-index:-1;pointer-events:none;height:auto;filter:drop-shadow(-1.5px -1.5px 0 rgba(0,0,0,.5)) drop-shadow(1.5px 1.5px 0 rgba(255,255,255,.13))}
/* blind emboss on light paper: same-colour mark, only its relief shows */
.ck-blind{display:block;height:auto;pointer-events:none;filter:drop-shadow(-1.5px -1.5px 0 rgba(255,255,255,.85)) drop-shadow(2px 2px 1px rgba(45,17,27,.32))}
/* illustration animation */
.ck-illo{position:relative;flex:1 1 360px;min-width:0;max-width:520px;width:100%}
.ck-illo img{display:block;width:100%;height:auto}
.ck-illo svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.ck-steam{fill:none;stroke:#2D111B;stroke-width:2.6;stroke-linecap:round;opacity:0;transform-box:fill-box;transform-origin:50% 100%;animation:ck-steam 3.4s ease-in-out 0s infinite}
.ck-steam.s2{animation-delay:1.1s}.ck-steam.s3{animation-delay:2s}.ck-steam.s4{animation-delay:.5s}.ck-steam.s5{animation-delay:1.6s}
@keyframes ck-steam{0%{opacity:0;transform:translateY(10px) scaleY(.7)}30%{opacity:.75}100%{opacity:0;transform:translateY(-34px) scaleY(1.15)}}
.ck-drop{fill:#2D111B;opacity:0;animation:ck-drop 1.2s ease-in 0s infinite}
.ck-drop.d2{animation-delay:.4s}.ck-drop.d3{animation-delay:.8s}
@keyframes ck-drop{0%{opacity:0;transform:translate(0,0)}15%{opacity:1}85%{opacity:1}100%{opacity:0;transform:translate(-6px,40px)}}
/* RSVP: the pill style moved here from an inline style that depended on state */
.ck-pill{min-height:52px;border-radius:4px;font:inherit;font-size:14px;cursor:pointer;border:1px solid #F2E5C6;background:transparent;color:#F2E5C6}
.ck-pill[aria-pressed="true"]{background:#F2E5C6;color:#15120D;font-weight:700}
.ck-submit:disabled{opacity:.7}
/* every animation and transition off under reduce. Needs to come last. */
@media (prefers-reduced-motion:reduce){
.ck-vinyl{animation:none}
.ck-steam,.ck-drop{display:none}
.ck-env,.ck-env.is-open,.ck-env-letter,.ck-env.is-open .ck-env-letter,.ck-env-flap,.ck-env.is-open .ck-env-flap,.ck-env-seal,.ck-env.is-open .ck-env-seal{transition:none}
.ck-track{scroll-behavior:auto}
.ck-fig,.ck-dot,.ck-arrow,.ck-play{transition:none}
}