:root{--blue:#062f63;--blue2:#041f45;--gold:#ffc72c;--orange:#ff7a1c;--green:#163f25;--dark:#07100b;--cream:#fff7e5;--text:#18231d;--muted:#5d6a61}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Arial,Helvetica,sans-serif;color:var(--text);background:#f3efe4;line-height:1.55}
a{color:var(--blue);font-weight:800}

.announce,.topbar{
background:linear-gradient(90deg,#041f45,#062f63,#041f45);
color:#fff;
text-align:center;
font-weight:800;
padding:10px 14px;
letter-spacing:.25px
}

.site-header{
position:sticky;
top:0;
z-index:50;
display:flex;
align-items:center;
justify-content:space-between;
gap:18px;
padding:12px clamp(16px,4vw,54px);
background:rgba(4,31,69,.94);
backdrop-filter:blur(8px);
box-shadow:0 6px 20px rgba(0,0,0,.22)
}

.logo{color:#fff;text-decoration:none;font-size:25px;font-weight:900;letter-spacing:-.7px}
.logo span{color:var(--gold)}

nav{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
nav a{color:#fff;text-decoration:none;padding:9px 12px;border-radius:999px;font-size:14px}
.nav-cta{background:var(--gold);color:#121212!important}

/* Main hero */
.hero-2026{
min-height:620px;
position:relative;
color:#fff;
display:flex;
align-items:center;
overflow:hidden;
background:
linear-gradient(180deg,rgba(3,20,48,.22),rgba(3,20,48,.82)),
linear-gradient(135deg,#062f63 0%,#041f45 58%,#021326 100%)
}

.hero-2026:before{
content:"";
position:absolute;
inset:0;
background:
radial-gradient(circle at 70% 20%,rgba(255,255,255,.08),transparent 35%),
linear-gradient(100deg,rgba(0,0,0,.42),rgba(0,0,0,.10))
}

.hero-content{
position:relative;
z-index:2;
width:min(1180px,100%);
margin:0 auto;
padding:60px 22px 110px
}

.hero-content h1{
font-size:clamp(42px,7vw,84px);
line-height:.95;
margin:0 0 18px;
text-shadow:0 6px 18px rgba(0,0,0,.45)
}

.hero-content h1 span{font-size:.58em;color:#fff4c7}

/* Article hero */
.article-hero{
position:relative;
color:#fff;
background:
linear-gradient(135deg,#062f63 0%,#041f45 55%,#021326 100%);
padding:58px 18px 38px;
overflow:hidden;
box-shadow:inset 0 -40px 80px rgba(0,0,0,.18)
}

.article-hero:before{
content:"";
position:absolute;
inset:0;
background:
radial-gradient(circle at 78% 22%,rgba(255,255,255,.08),transparent 32%),
linear-gradient(100deg,rgba(0,0,0,.26),rgba(0,0,0,.06))
}

.article-hero .article-wrap{
position:relative;
z-index:1
}

.article-hero h1{
font-size:clamp(34px,5vw,64px);
line-height:1;
margin:12px 0;
text-shadow:0 5px 14px rgba(0,0,0,.40)
}

.article-hero p{
font-size:19px;
max-width:760px;
color:#eef6ff
}

.breadcrumbs,.breadcrumbs a{
color:#ffe07c;
font-weight:900
}

.article-wrap{max-width:980px;margin:0 auto}

.content{
background:#fff;
margin-top:-14px;
position:relative;
z-index:3;
border-radius:22px 22px 0 0;
padding:24px clamp(18px,4vw,54px) 50px;
box-shadow:0 -10px 28px rgba(0,0,0,.10)
}

.footer,.footer-2026{
background:#041f45;
color:#fff;
padding:26px 18px;
text-align:center
}

.footer a,.footer-2026 a{color:#fff}

@media(max-width:760px){
.site-header{position:relative;display:block}
.hero-content{padding-top:44px;padding-bottom:80px}
.hero-2026{min-height:520px}
.article-hero{padding-top:44px;padding-bottom:28px}
.content{padding:20px 18px 38px}
}
