@import url("https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700;800&display=swap");

:root{
--bg:#07142a;
--bg-soft:#0b1b36;
--panel:rgba(255,255,255,0.035);
--panel-border:rgba(255,255,255,0.08);
--text:rgba(255,255,255,0.96);
--text-soft:rgba(255,255,255,0.78);
--gold:#ffd000;
--gold-soft:rgba(255,208,0,0.12);
}

*{
box-sizing:border-box;
}

html{
scroll-behavior:smooth;
}

body{
margin:0;
font-family:"Montserrat",sans-serif;
background:linear-gradient(180deg,#08162f 0%,#07142a 50%,#061022 100%);
color:var(--text);
position:relative;
min-height:100vh;
overflow-x:hidden;
}

button{
font-family:"Montserrat",sans-serif;
}

#site-bg{
position:fixed;
inset:0;
width:100%;
height:100%;
z-index:0;
pointer-events:none;
}

header, main, section, footer{
position:relative;
z-index:1;
}

.header{
position:fixed;
top:0;
left:0;
width:100%;
display:flex;
justify-content:space-between;
align-items:center;
padding:20px 60px;
background:rgba(5,15,35,0.72);
backdrop-filter:blur(12px);
border-bottom:1px solid rgba(255,255,255,0.05);
z-index:1000;
}

.logo-container{
display:flex;
align-items:center;
gap:12px;
}

.logo{
width:70px;
transition:filter 0.3s ease, transform 0.3s ease;
}

.logo:hover{
filter:drop-shadow(0 0 20px rgba(255,208,0,0.45));
transform:translateY(-1px);
}

.nav{
display:flex;
align-items:center;
}

.nav a{
margin-left:30px;
color:white;
text-decoration:none;
position:relative;
font-weight:600;
}

.nav a::after{
content:"";
position:absolute;
left:0;
bottom:-6px;
width:0;
height:2px;
background:var(--gold);
transition:width 0.25s ease;
}

.nav a:hover::after{
width:100%;
}

.hero,
.page-hero{
display:flex;
align-items:center;
justify-content:center;
text-align:center;
padding:140px 20px 48px;
}

.hero{
min-height:100vh;
}

.page-hero{
min-height:48vh;
}

.hero-content{
max-width:760px;
}

.hero-content.compact{
max-width:900px;
}

.hero h1,
.page-hero h1{
margin:0 0 16px;
font-size:72px;
line-height:1.02;
font-weight:800;
color:var(--gold);
}

.hero p,
.page-hero p{
margin:0 auto;
max-width:820px;
font-size:22px;
line-height:1.7;
color:var(--text-soft);
}

.hero-actions{
display:flex;
justify-content:center;
flex-wrap:wrap;
gap:14px;
margin-top:28px;
}

.btn{
padding:15px 40px;
border:none;
border-radius:999px;
background:var(--gold);
color:#07142a;
text-decoration:none;
cursor:pointer;
font:inherit;
font-weight:700;
box-shadow:0 14px 36px rgba(0,0,0,0.26);
transition:transform 0.2s ease, box-shadow 0.2s ease;
}

.btn:hover{
transform:translateY(-2px);
box-shadow:0 18px 42px rgba(0,0,0,0.34);
}

.ghost-btn{
padding:13px 24px;
border:1px solid rgba(255,208,0,0.65);
border-radius:14px;
background:rgba(255,208,0,0.08);
color:var(--gold);
text-decoration:none;
cursor:pointer;
font-weight:600;
transition:background 0.2s ease,color 0.2s ease,border-color 0.2s ease;
}

.ghost-btn:hover{
background:rgba(255,208,0,0.18);
color:white;
border-color:rgba(255,208,0,0.9);
}

.page-shell{
max-width:1280px;
margin:0 auto;
padding:0 20px 88px;
}

.content-section{
padding:22px 0;
}

.section-intro{
max-width:880px;
margin-bottom:20px;
}

.eyebrow{
margin:0 0 10px;
font-size:12px;
letter-spacing:0.18em;
text-transform:uppercase;
color:rgba(255,208,0,0.8);
}

.section-intro h2{
margin:0 0 14px;
font-size:48px;
line-height:1.08;
}

.section-intro p,
.panel p{
color:var(--text-soft);
line-height:1.7;
}

.grid-two{
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:20px;
}

.grid-three{
display:grid;
grid-template-columns:repeat(3,minmax(0,1fr));
gap:20px;
}

.panel{
background:var(--panel);
border:1px solid var(--panel-border);
border-radius:22px;
padding:24px;
box-shadow:0 24px 56px rgba(0,0,0,0.26);
backdrop-filter:blur(6px);
}

.panel.wide{
width:100%;
}

.mini-panel{
min-height:204px;
}

.panel-header{
display:flex;
justify-content:space-between;
align-items:center;
gap:14px;
margin-bottom:14px;
}

.panel-title{
margin:0;
font-weight:700;
letter-spacing:0.02em;
}

.panel-tag{
padding:5px 11px;
border-radius:999px;
background:var(--gold-soft);
color:var(--gold);
font-size:12px;
border:1px solid rgba(255,208,0,0.5);
white-space:nowrap;
}

.panel h3{
margin:0 0 12px;
font-size:24px;
line-height:1.25;
}

.bullet-list{
margin:0;
padding-left:20px;
display:grid;
gap:10px;
line-height:1.65;
color:var(--text-soft);
}

.contact-layout{
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:20px;
align-items:start;
}

.contact-card{
height:100%;
}

input, textarea{
width:100%;
padding:14px 16px;
margin:10px 0;
border:1px solid rgba(255,255,255,0.16);
border-radius:14px;
background:rgba(255,255,255,0.05);
color:white;
font:inherit;
}

textarea{
min-height:170px;
resize:vertical;
}

input::placeholder,
textarea::placeholder{
color:rgba(255,255,255,0.48);
}

footer{
padding:18px 20px 34px;
text-align:center;
color:rgba(255,255,255,0.7);
}

.site-footer{
padding:18px 20px 40px;
}

.footer-inner{
max-width:1280px;
margin:0 auto;
padding:28px 24px;
border:1px solid rgba(255,255,255,0.08);
border-radius:22px;
background:rgba(255,255,255,0.03);
box-shadow:0 24px 56px rgba(0,0,0,0.22);
}

.footer-company{
margin:0 0 10px;
font-size:24px;
font-weight:700;
color:white;
}

.footer-address{
margin:0 0 12px;
color:rgba(255,255,255,0.78);
line-height:1.7;
}

.footer-meta{
display:flex;
justify-content:center;
flex-wrap:wrap;
gap:18px;
margin-bottom:12px;
}

.footer-meta a{
color:var(--gold);
text-decoration:none;
font-weight:600;
}

.footer-note{
margin:0 auto 18px;
max-width:860px;
color:rgba(255,255,255,0.72);
line-height:1.7;
}

.footer-actions{
display:flex;
justify-content:center;
flex-wrap:wrap;
gap:12px;
}

.footer-action{
display:inline-flex;
align-items:center;
justify-content:center;
}

.map iframe{
display:block;
width:100%;
border:0;
border-radius:18px;
}

@media(max-width:1100px){
.hero h1,
.page-hero h1{
font-size:54px;
}
}

@media(max-width:900px){
.header{
padding:16px 20px;
flex-direction:column;
gap:16px;
}

.nav{
display:flex;
flex-wrap:wrap;
justify-content:center;
gap:14px;
}

.nav a{
margin-left:0;
}

.hero,
.page-hero{
padding:160px 20px 32px;
}

.hero h1,
.page-hero h1,
.section-intro h2{
font-size:36px;
}

.hero p,
.page-hero p{
font-size:18px;
}

.page-shell{
padding:0 20px 64px;
}

.grid-two,
.grid-three,
.contact-layout{
grid-template-columns:1fr;
}

.panel{
padding:20px;
}

.footer-company{
font-size:20px;
}
}