:root{color-scheme:dark;--gold:#ddc28a;--white:#fafbf7;--muted:#d2dcdb;--line:rgba(221,236,234,.29)}
*{box-sizing:border-box}
html{min-width:280px;background:#0c242a}
body{margin:0;color:var(--white);font-family:Arial,Helvetica,sans-serif;background:#0c242a;min-height:100svh;position:relative}
body::before{content:"";position:absolute;inset:0;z-index:0;background:linear-gradient(90deg,rgba(3,24,29,.91),rgba(8,30,35,.53) 65%,rgba(9,31,37,.24)),linear-gradient(0deg,rgba(2,23,28,.88),transparent 70%),url('assets/ocean.png') center 52%/cover no-repeat;pointer-events:none}
.page{position:relative;max-width:1340px;margin:auto;padding:0 64px 36px;min-height:100svh}
.header{display:flex;align-items:center;justify-content:space-between;min-height:210px;gap:28px}
.brand{width:145px;height:215px;flex:none;display:flex;align-items:center;justify-content:center;padding-top:12px}
.brand img{display:block;width:100%;height:100%;object-fit:contain}
.tagline{margin:0;border:1px solid var(--line);border-radius:99px;padding:14px 23px;font-size:12px;letter-spacing:.24em;text-transform:uppercase;white-space:nowrap;color:#f0f1ed}
main{padding-top:36px;max-width:790px}
.eyebrow{margin:0 0 31px;color:var(--gold);font-size:14px;font-weight:600;line-height:1.6;letter-spacing:.31em;text-transform:uppercase}
.desktop-break{display:none}
h1{font-family:Georgia,'Times New Roman',serif;font-weight:400;font-size:112px;line-height:.98;letter-spacing:-.055em;margin:0 0 35px}
h1 span{color:var(--gold)}
.description{max-width:650px;font-size:20px;line-height:1.8;color:#e0e7e4;margin:0 0 46px;font-weight:400}
.launch{max-width:600px}
.countdown{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px}
.unit{border:1px solid var(--line);background:rgba(201,224,224,.035);display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:125px;gap:15px}
.number{font-size:45px;font-weight:600;font-variant-numeric:tabular-nums;line-height:1}
.label{color:var(--gold);text-transform:uppercase;letter-spacing:.2em;font-size:11px}
.launch-date{font-size:16px;color:var(--muted);margin:26px 0 0;line-height:1.5}
.notice{line-height:1.6;color:var(--gold)}
@media(min-width:1400px){.page{padding-top:16px}main{padding-top:50px}.description{margin-bottom:50px}}
@media(max-width:767px){
 .page{padding:0 25px 30px}
 .header{min-height:229px;align-items:flex-start;gap:14px}
 .brand{width:112px;height:196px}
 .tagline{font-size:9px;letter-spacing:.18em;padding:12px 10px;margin-top:62px;white-space:normal;text-align:center;line-height:1.4}
 main{padding-top:26px}
 .eyebrow{font-size:12px;letter-spacing:.26em;line-height:1.65;margin-bottom:28px;max-width:370px}
 h1{font-size:clamp(65px,16.8vw,123px);line-height:1;letter-spacing:-.055em;margin-bottom:33px}
 .description{font-size:16px;line-height:1.8;margin-bottom:48px;max-width:540px}
 .countdown{gap:8px}
 .unit{min-height:96px;gap:15px}
 .number{font-size:32px}
 .label{font-size:8px;letter-spacing:.14em}
 .launch-date{font-size:14px;margin-top:25px}
 body::before{background-position:center,center,58% center}
}
@media(max-width:359px){.page{padding-inline:18px}.tagline{font-size:8px;padding:10px 8px;letter-spacing:.13em}.header{gap:8px}.unit{min-height:85px}.number{font-size:29px}.label{font-size:7px}.description{font-size:15px}}
