
:root{--background:#f8f7f0;--surface:#e8ecdf;--accent:#344e41;--text:#263b31;--muted:#60685e;--border:#d4dacd}*{box-sizing:border-box}body{margin:0;background:var(--background);color:var(--text);font-family:Arial,Helvetica,sans-serif}a{color:inherit}.page{width:min(1120px,calc(100% - 48px));margin:auto}header{padding:30px 0;border-bottom:1px solid var(--border)}.brand{font:28px Georgia,serif;letter-spacing:-.8px}main{padding:76px 0 64px}.hero{max-width:790px;margin:auto;text-align:center}.badge{display:inline-flex;align-items:center;gap:9px;padding:10px 16px;border:1px solid var(--border);border-radius:100px;font-size:11px;font-weight:700;letter-spacing:2px;text-transform:uppercase}.badge:before{content:"";width:6px;height:6px;border-radius:50%;background:var(--accent)}h1{margin:28px 0 22px;font:400 clamp(46px,7.8vw,88px)/1.06 Georgia,serif;letter-spacing:-.045em}h1 em{color:var(--accent);font-weight:400}.tagline{margin:0 0 18px;font-size:19px;font-weight:600;line-height:1.6}.intro{max-width:560px;margin:auto;color:var(--muted);font-size:16px;line-height:1.85}.categories{display:flex;flex-wrap:wrap;justify-content:center;gap:12px 24px;padding:0;margin:28px 0 36px;list-style:none;color:var(--muted);font-size:11px;letter-spacing:2px;text-transform:uppercase}.actions{display:flex;flex-wrap:wrap;justify-content:center;gap:12px}.button{display:inline-flex;align-items:center;justify-content:center;gap:14px;min-height:54px;padding:15px 25px;border:1px solid var(--accent);border-radius:6px;background:var(--accent);color:white;font-size:14px;font-weight:600;line-height:1.4;text-decoration:none}.secondary{background:transparent;color:var(--accent)}.button:hover{box-shadow:0 5px 14px #00000020}a:focus-visible{outline:3px solid var(--accent);outline-offset:5px}.follow-note{margin:18px 0 0;color:var(--muted);font-size:13px;line-height:1.7}.launch{margin:54px auto 0;padding:32px 24px;max-width:680px;border:1px solid var(--border);border-radius:18px;background:var(--surface);text-align:center}.launch h2{margin:0 0 12px;font-size:11px;letter-spacing:2.5px;text-transform:uppercase}.launch-status{margin:0;font:27px/1.4 Georgia,serif}.countdown{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;max-width:460px;margin:24px auto 0}[hidden]{display:none!important}.time-unit{padding:18px 6px;border:1px solid var(--border);border-radius:10px;background:var(--background)}.time-unit strong{display:block;font-size:32px;font-weight:400;font-variant-numeric:tabular-nums}.time-unit span{display:block;margin-top:8px;font-size:9px;letter-spacing:1.2px;text-transform:uppercase}.launch-note{margin:16px 0 0;color:var(--muted);font-size:12px;line-height:1.7}footer{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;padding:24px 0;border-top:1px solid var(--border);color:var(--muted);font-size:12px;line-height:1.7}footer p{margin:0}@media(max-width:560px){.page{width:calc(100% - 36px)}header{padding:24px 0;text-align:center}.brand{font-size:23px}main{padding:48px 0 40px}.intro{font-size:15px}.actions{flex-direction:column}.button{width:100%}.launch{padding:26px 14px;margin-top:38px}.countdown{gap:7px}footer{justify-content:center;text-align:center}}
/* More colour: blush, sage and champagne, with dark readable text. */
body{background:radial-gradient(ellipse at 3% 22%,#f3d5d9 0,transparent 48%),radial-gradient(ellipse at 98% 48%,#dce7cc 0,transparent 46%),linear-gradient(150deg,#fffaf2,#faf4ec 65%,#f4e4dc)}
header{border-bottom-color:#d9c5ab}.brand{color:#744557}
.badge{background:#f2dce0;border-color:#d9b1bc;color:#753b50}.badge:before{background:#a25c73}
h1 em{color:#8c4c64}.tagline{color:#496046}
.categories{gap:10px;margin-top:25px}.categories li{padding:10px 16px;border-radius:100px;letter-spacing:1.5px}
.categories li:nth-child(1){background:#dde8d4;color:#36503c}.categories li:nth-child(2){background:#f1dce1;color:#753d53}.categories li:nth-child(3){background:#f2e4c8;color:#725426}.categories li:nth-child(4){background:#e7dfef;color:#614e74}
.button{background:#3f624d;border-color:#3f624d;box-shadow:0 5px 16px #3f624d15}
.button.secondary{background:#f3dce3;border-color:#b5798d;color:#733b50}
.button:hover{background:#304e3c}.button.secondary:hover{background:#ebc9d5}
.launch{background:linear-gradient(115deg,#e2ead8 0%,#f5ebd6 53%,#f2dce2 100%);border-color:#c8b48f;box-shadow:0 12px 35px #8566430c;position:relative;overflow:hidden}
.launch:before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,#829b72,#d3ac68,#c7869c)}
.launch h2{color:#70572d}.launch-status{color:#633f50}.time-unit{background:#fffaf2;border-color:#d4c3ab}
footer{border-top-color:#d9c5ab}

/* Compact first-screen layout. Scrolling remains available for zoom/accessibility. */
html{min-height:100%}body{min-height:100svh}.page{min-height:100svh;display:flex;flex-direction:column;width:min(1060px,calc(100% - 48px))}
header{padding:18px 0;text-align:center}.brand{font-size:25px}
main{flex:1;display:flex;flex-direction:column;justify-content:center;padding:22px 0;gap:22px}
.hero{width:100%;margin:0 auto}.badge{padding:7px 13px;font-size:10px}
h1{font-size:clamp(42px,7vh,68px);line-height:1.03;margin:17px 0 14px}
.tagline{font-size:17px;margin-bottom:10px}.intro{font-size:14px;line-height:1.65;max-width:600px}
.categories{margin:17px 0 20px;gap:8px}.categories li{padding:7px 13px;font-size:10px}
.follow-note{margin-top:11px;font-size:12px}.launch{width:min(680px,100%);margin:0 auto;padding:15px 22px;border-radius:14px}
.launch h2{font-size:9px;letter-spacing:2px;margin-bottom:6px}.launch-status{font-size:22px}.launch-note{margin-top:6px;font-size:11px}
.countdown{margin-top:12px}.time-unit{padding:8px 5px}.time-unit strong{font-size:24px}
footer{padding:14px 0;font-size:11px}
@media(min-width:561px) and (max-height:760px){header{padding:12px 0}.brand{font-size:23px}main{padding:14px 0;gap:15px}h1{font-size:46px;margin:12px 0}.intro{font-size:13px;line-height:1.55}.categories{margin:12px 0 14px}.launch{padding:10px 20px}.launch-note{display:none}footer{padding:10px 0}}
@media(max-width:560px){.page{width:calc(100% - 32px)}header{padding:13px 0}.brand{font-size:22px}main{padding:16px 0;gap:16px}h1{font-size:clamp(35px,5.7svh,46px);margin:14px 0 12px}.tagline{font-size:15px;margin-bottom:8px}.intro{font-size:13px;line-height:1.55}.categories{gap:6px;margin:13px 0 15px}.categories li{font-size:8px;letter-spacing:1px;padding:6px 9px}.follow-note{font-size:10px;margin-top:10px}.launch{padding:12px 14px}.launch-status{font-size:20px}.launch-note{font-size:10px}footer{padding:10px 0;gap:2px;flex-direction:column;align-items:center;font-size:10px}}
/* Keep the entire desktop composition inside the visible browser height. */
@media(min-width:561px){
html,body{margin:0;min-height:100%;scroll-padding-top:0}
.page{min-height:100svh;min-height:100dvh;display:grid;grid-template-rows:auto 1fr auto}
header{padding:14px 0 12px;line-height:1.2}.brand{display:inline-block;font-size:23px}
main{min-height:0;padding:14px 0;gap:14px;justify-content:center}
h1{font-size:clamp(36px,6.8dvh,58px);margin:12px 0 10px;line-height:1.02}
.badge{padding:6px 12px;font-size:9px}.tagline{font-size:15px;margin:0 0 8px}
.intro{font-size:13px;line-height:1.5;max-width:640px}
.categories{margin:12px 0 14px}.categories li{padding:6px 12px;font-size:9px}
.follow-note{margin-top:9px;font-size:11px}
.launch{padding:10px 20px}.launch h2{margin-bottom:4px}.launch-status{font-size:21px}.launch-note{display:none}
footer{padding:10px 0;font-size:10px;line-height:1.3}
}
@media(min-width:561px) and (max-height:580px){
header{padding:8px 0}.brand{font-size:20px}main{padding:8px 0;gap:9px}
h1{font-size:34px;margin:8px 0}.tagline{font-size:14px;margin-bottom:5px}
.intro{font-size:12px;line-height:1.4;max-width:720px}.categories{margin:8px 0}
.categories li{padding:4px 10px}.launch{padding:7px 16px}.launch-status{font-size:18px}
footer{padding:7px 0}
}
/* Colorful social marks, soft cards and consistent spacing. */
.actions{gap:12px}.button.social-button{flex:1 1 220px;gap:11px;padding:14px 15px;min-height:70px;border-radius:14px;font-size:13px;box-shadow:0 6px 20px #35433209;text-align:left}
.social-icon{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;flex:0 0 36px;border-radius:11px;color:#fff;box-shadow:0 3px 8px #00000012}.social-icon svg{width:22px;height:22px}.social-arrow{margin-left:auto;opacity:.65;font-size:17px}
.button.whatsapp{background:#edf7ed;border-color:#b6d5bc;color:#245537}.whatsapp .social-icon{background:#168844}
.button.instagram{background:#fcf0f3;border-color:#e3bdcc;color:#803952}.instagram .social-icon{background:radial-gradient(circle at 25% 100%,#ffd36b 0%,#ef8044 25%,#d93583 53%,#834ac2 82%)}
.button.facebook{background:#edf3ff;border-color:#bed0ee;color:#254d8a}.facebook .social-icon{background:#1877f2}
.button.whatsapp:hover{background:#dfefdf}.button.instagram:hover{background:#f7e1e9}.button.facebook:hover{background:#dfebff}
.button.social-button{min-height:58px;padding:10px 13px}
@media(max-width:560px){.actions{flex-direction:row;flex-wrap:nowrap;gap:7px}.button.social-button{flex:1 1 0;min-width:0;width:auto;min-height:76px;flex-direction:column;justify-content:center;text-align:center;gap:6px;padding:9px 4px;font-size:10px;line-height:1.35;border-radius:12px}.social-icon{width:29px;height:29px;flex-basis:29px;border-radius:9px}.social-icon svg{width:19px;height:19px}.social-arrow{display:none}}
