@font-face{font-family:"Libre Caslon Display";font-style:normal;font-weight:400;font-display:swap;src:url("fonts/caslon-display-400.woff2") format("woff2")}
@font-face{font-family:"Libre Caslon Text";font-style:normal;font-weight:400;font-display:swap;src:url("fonts/caslon-text-400.woff2") format("woff2")}
@font-face{font-family:"Libre Caslon Text";font-style:italic;font-weight:400;font-display:swap;src:url("fonts/caslon-text-400-italic.woff2") format("woff2")}
:root{--noche:#0B1A13;--marfil:#F2EDE3;--oro:#C6A15E;--oro-2:#D9BC82;--gris-c:#A9B5AC;
  --f-disp:"Libre Caslon Display","Big Caslon",Baskerville,Georgia,serif;--f-text:"Libre Caslon Text",Baskerville,Georgia,serif;
  --ease:cubic-bezier(.16,.84,.24,1);color-scheme:dark}
*,*::before,*::after{box-sizing:border-box}
html,body{height:100%}
body{margin:0;background:radial-gradient(90% 80% at 50% 48%,#18392A 0%,#0F241A 55%,var(--noche) 100%);color:var(--marfil);font:400 17px/1.6 var(--f-text);-webkit-font-smoothing:antialiased;overflow:hidden}
.sprite{position:absolute;width:0;height:0;overflow:hidden}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.grain{position:fixed;inset:-50%;z-index:5;pointer-events:none;opacity:.07;mix-blend-mode:overlay;background-size:220px 220px;display:none}
@media (pointer:fine) and (min-width:900px){.grain{display:block}}
@media (pointer:fine) and (min-width:900px) and (prefers-reduced-motion:no-preference){.grain{animation:grain 1.2s steps(6) infinite}}
@keyframes grain{0%{transform:translate(0,0)}20%{transform:translate(-3%,2%)}40%{transform:translate(2%,-4%)}60%{transform:translate(-4%,-1%)}80%{transform:translate(3%,3%)}100%{transform:translate(0,0)}}
.light{position:fixed;inset:0;background:radial-gradient(34% 36% at 50% 48%,rgba(217,188,130,.14),transparent 70%);pointer-events:none}
@media (prefers-reduced-motion:no-preference){.light{animation:breathe 9s ease-in-out infinite alternate}}
@keyframes breathe{from{opacity:.65}to{opacity:1}}
.rose{position:fixed;left:50%;top:50%;--rs:min(84vmin,800px);width:var(--rs);height:var(--rs);margin:calc(var(--rs) / -2) 0 0 calc(var(--rs) / -2);opacity:.48;pointer-events:none}
@media (max-width:700px){.rose{--rs:min(118vw,560px);opacity:.5}}
@media (prefers-reduced-motion:no-preference){.rose{animation:turn 240s linear infinite}}
@keyframes turn{to{transform:rotate(360deg)}}
main{position:relative;z-index:2;min-height:100%;min-height:100svh;display:grid;place-items:center;text-align:center;padding:calc(env(safe-area-inset-top,0px) + 32px) 24px calc(env(safe-area-inset-bottom,0px) + 32px)}
.card{display:flex;flex-direction:column;align-items:center}
.em{width:clamp(96px,14vmin,136px);height:clamp(96px,14vmin,136px);--em-tree:var(--oro);--em-gold:var(--oro-2)}
h1{margin:clamp(22px,3.4vmin,34px) 0 0;line-height:0}
.wm{display:block;width:clamp(240px,42vmin,440px);height:auto;aspect-ratio:2920/322;fill:#F6F1E6}
.tag{margin:18px 0 0;font-size:clamp(10.5px,1.3vmin,12.5px);letter-spacing:.38em;text-transform:uppercase;color:var(--oro);padding-left:.38em}
.rule{width:56px;height:1px;background:var(--oro);opacity:.55;margin:clamp(30px,5vmin,48px) 0 0}
.soon{margin:clamp(22px,3.4vmin,32px) 0 0;font:italic 400 clamp(28px,4.6vmin,44px)/1 var(--f-text);color:var(--oro-2);letter-spacing:.01em}
.about{position:fixed;z-index:3;right:clamp(20px,3.2vw,48px);bottom:calc(env(safe-area-inset-bottom,0px) + clamp(20px,3.2vw,40px));margin:0;text-align:right;font-size:clamp(11px,1.1vw,13px);line-height:1.7;letter-spacing:.04em;color:var(--gris-c);padding-right:14px;border-right:1px solid rgba(198,161,94,.55)}
.about em{font-style:italic;color:var(--oro-2);font-size:1.12em;letter-spacing:.01em}
@media (max-width:700px){main{padding-bottom:calc(env(safe-area-inset-bottom,0px) + 150px)}.about{font-size:11px;line-height:1.6}}
@media (prefers-reduced-motion:no-preference){
  .em,h1,.tag,.rule,.soon,.about{animation:fade 1.6s var(--ease) both}
  h1{animation-delay:.15s}.tag{animation-delay:.3s}.rule{animation-delay:.5s}.soon{animation-delay:.7s}.about{animation-delay:.85s}
}
@keyframes fade{from{opacity:.001;transform:translateY(12px)}to{opacity:1;transform:none}}
@media (max-width:420px){.tag{letter-spacing:.24em;padding-left:.24em}}