@import url("../marca-lula/tokens.css");

@font-face{font-family:"Montserrat";font-style:normal;font-weight:500 700;font-display:swap;src:url("../assets/fonts/montserrat.woff2") format("woff2")}
@font-face{font-family:"Montserrat";font-style:italic;font-weight:400;font-display:swap;src:url("../assets/fonts/montserrat-italic.woff2") format("woff2")}
@font-face{font-family:"Cardo";font-style:normal;font-weight:400;font-display:swap;src:url("../assets/fonts/cardo.woff2") format("woff2")}
@font-face{font-family:"Noto Sans";font-style:normal;font-weight:400;font-display:swap;src:url("../assets/fonts/noto-sans.woff2") format("woff2")}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--surface);color:var(--ink);font-family:var(--font-sans);font-weight:500;font-size:17px;line-height:1.7}
a{color:var(--ink)}
a:focus-visible,.btn:focus-visible{outline:3px solid var(--ink);outline-offset:3px}

.page{min-height:100vh;min-height:100svh;display:flex;flex-direction:column;align-items:center;text-align:center;padding:var(--space-3) var(--space-2)}
.page>main{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;max-width:640px;gap:var(--space-3);padding-top:var(--space-3)}

.logo{display:block;width:min(78vw,380px);height:auto;margin:var(--space-3) auto 0}
.titular{font-style:italic;font-weight:400;font-size:clamp(24px,6.4vw,32px);line-height:1.3;margin:0}
.eyebrow{font-family:var(--font-serif);font-size:clamp(22px,6vw,28px);line-height:1.2;margin:0}

.countdown{display:flex;justify-content:center;gap:var(--space-2);margin:0 0 var(--space-2);padding:0;list-style:none}
.countdown li{min-width:72px}
.countdown .num{display:block;font-size:clamp(34px,11vw,56px);font-weight:500;line-height:1.1;font-variant-numeric:tabular-nums}
.countdown .lbl{display:block;font-family:var(--font-serif);font-size:18px;line-height:1.4}
.launched{font-style:italic;font-weight:400;font-size:clamp(34px,9vw,48px);line-height:1.2;margin:0}

.lema{font-style:italic;font-weight:400;font-size:clamp(22px,5.6vw,28px);line-height:1.3;margin:var(--space-3) 0 0}
.sub{margin:0;max-width:30em}

.btn{display:inline-block;background:var(--accent);color:var(--blanco);font:700 19px/1.2 var(--font-sans);text-decoration:none;padding:18px 32px;border-radius:var(--radius-sm)}
.btn:hover{background:var(--brand-burdeos)}

.foot{padding:var(--space-3) 0 var(--space-1);font-size:14px;line-height:1.6;font-weight:500;display:flex;gap:var(--space-3);flex-wrap:wrap;justify-content:center}

/* Páginas de texto */
.doc{max-width:42rem;margin:0 auto;padding:var(--space-3) var(--space-2) var(--space-4);text-align:left}
.doc .logo{width:min(60vw,260px);margin:var(--space-3) auto var(--space-4)}
.doc h1{font-style:italic;font-weight:400;font-size:clamp(28px,7vw,36px);line-height:1.3;margin:0 0 var(--space-3)}
.doc h2{font-style:italic;font-weight:400;font-size:24px;line-height:1.3;margin:var(--space-4) 0 var(--space-2)}
.doc p,.doc ul{margin:0 0 var(--space-2)}
.doc li{margin-bottom:var(--space-1)}
.doc .back{display:inline-block;margin-top:var(--space-3)}
.doc a{text-underline-offset:3px;overflow-wrap:anywhere}