:root{
  --bg:#071a2f;
  --bg2:#0c2946;
  --gold:#c8a46a;
  --gold2:#e5c88f;
  --text:#152132;
  --muted:#5d6776;
  --soft:#f5f3ee;
  --line:rgba(15,23,42,.08);
  --white:#fff;
  --shadow:0 18px 60px rgba(5,20,40,.12);
  --radius:24px;
  --max:1200px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  color:var(--text);
  background:#fff;
}
a{text-decoration:none;color:inherit}
img{max-width:100%;display:block}
.container{width:min(var(--max), calc(100% - 32px)); margin:0 auto}
.nav{
  position:sticky; top:0; z-index:50;
  background:rgba(7,26,47,.75); backdrop-filter: blur(16px);
  border-bottom:1px solid rgba(255,255,255,.08);
}
.nav-inner{min-height:74px; display:flex; align-items:center; justify-content:space-between; gap:18px}
.brand{display:flex; gap:12px; align-items:center; color:#fff}
.brand-mark{
  width:40px;height:40px;border-radius:12px;display:grid;place-items:center;
  background:linear-gradient(135deg,var(--gold),var(--gold2)); color:#231607; font-weight:800
}
.brand .small{font-size:11px; opacity:.72}
.menu{display:flex; gap:18px; color:rgba(255,255,255,.9); font-size:14px; flex-wrap:wrap}
.menu a:hover{color:#fff}
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  padding:14px 22px; border-radius:999px; font-weight:700; transition:.25s ease;
}
.btn-primary{background:linear-gradient(135deg,var(--gold),var(--gold2)); color:#25180a; box-shadow:var(--shadow)}
.btn-dark{background:#0f2644; color:#fff}
.btn-light{background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.18); color:#fff}
.hero{
  min-height:calc(100vh - 74px); position:relative; color:#fff; display:flex; align-items:end;
  background:#08111d;
}
.hero::before{
  content:""; position:absolute; inset:0;
  background:
  linear-gradient(180deg, rgba(6,14,25,.28), rgba(6,14,25,.48) 45%, rgba(6,14,25,.9)),
  url('assets/hero-aerial.png') center/cover no-repeat;
}
.hero-content{position:relative; z-index:2; padding:84px 0 64px}
.eyebrow{letter-spacing:.18em; text-transform:uppercase; font-size:12px; color:var(--gold); font-weight:800}
h1,h2,h3{margin:0}
.hero h1{font-size:clamp(42px,6vw,88px); line-height:.95; letter-spacing:-.05em; margin:12px 0 18px; max-width:900px}
.lead{font-size:18px; line-height:1.8; max-width:760px}
.hero .lead{color:rgba(255,255,255,.86)}
.hero-grid{display:grid; grid-template-columns:1.15fr .62fr; gap:28px; align-items:end}
.glass{
  background:rgba(255,255,255,.09); border:1px solid rgba(255,255,255,.15);
  border-radius:28px; padding:22px; backdrop-filter:blur(18px);
}
.stats{display:grid; grid-template-columns:1fr 1fr; gap:14px}
.stat{border:1px solid rgba(255,255,255,.12); border-radius:20px; padding:16px; background:rgba(255,255,255,.04)}
.stat strong{display:block; font-size:26px; margin-bottom:6px}
.stat span{font-size:13px; color:rgba(255,255,255,.76); line-height:1.55}
.section{padding:86px 0}
.section-soft{background:var(--soft)}
.section-dark{background:linear-gradient(180deg,var(--bg),var(--bg2)); color:#fff}
.section-title{font-size:clamp(32px,4.4vw,58px); line-height:1.02; letter-spacing:-.04em; margin:12px 0 16px}
.section-sub{font-size:17px; line-height:1.8; color:var(--muted); max-width:760px}
.section-dark .section-sub{color:rgba(255,255,255,.76)}
.grid-2{display:grid; grid-template-columns:1fr 1fr; gap:28px; align-items:center}
.grid-3{display:grid; grid-template-columns:repeat(3,1fr); gap:22px}
.grid-4{display:grid; grid-template-columns:repeat(4,1fr); gap:18px}
.card{
  background:#fff; border:1px solid var(--line); border-radius:22px; padding:24px; box-shadow:0 10px 28px rgba(5,20,40,.06)
}
.section-dark .card{
  background:rgba(255,255,255,.06); border-color:rgba(255,255,255,.12); box-shadow:none
}
.card p{margin:10px 0 0; line-height:1.8; color:var(--muted)}
.section-dark .card p{color:rgba(255,255,255,.76)}
.icon{
  width:44px;height:44px;border-radius:14px; display:grid; place-items:center;
  background:linear-gradient(135deg, rgba(200,164,106,.2), rgba(200,164,106,.34)); color:var(--gold); font-weight:800
}
.media{border-radius:26px; overflow:hidden; box-shadow:var(--shadow)}
.kpis{display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-top:26px}
.kpi{padding:18px; border-radius:18px; border:1px solid rgba(255,255,255,.12); background:rgba(255,255,255,.05)}
.kpi strong{display:block; font-size:28px; margin-bottom:6px}
.kpi span{font-size:13px; color:rgba(255,255,255,.74)}
.banner{
  position:relative; overflow:hidden; border-radius:30px; min-height:420px; box-shadow:var(--shadow); color:#fff
}
.banner::before{
  content:""; position:absolute; inset:0;
  background:
    linear-gradient(90deg, rgba(7,26,47,.9), rgba(7,26,47,.4) 48%, rgba(7,26,47,.1)),
    url('assets/night-facade.png') center/cover no-repeat;
}
.banner-content{position:relative; z-index:2; padding:48px; max-width:640px}
.types .card strong{font-size:28px; color:#0b2340}
.gallery{display:grid; grid-template-columns:repeat(12,1fr); grid-auto-rows:120px; gap:18px; margin-top:28px}
.gallery .item{overflow:hidden; border-radius:22px; box-shadow:var(--shadow)}
.gallery img{width:100%; height:100%; object-fit:cover}
.i1{grid-column:span 7; grid-row:span 3}
.i2{grid-column:span 5; grid-row:span 2}
.i3{grid-column:span 5; grid-row:span 2}
.i4,.i5,.i6{grid-column:span 4; grid-row:span 2}
.contact{
  border-radius:30px; overflow:hidden; background:linear-gradient(135deg,#0a1b33,#163a61); color:#fff; box-shadow:var(--shadow)
}
.contact-grid{display:grid; grid-template-columns:1fr .95fr}
.contact-copy,.contact-form{padding:44px}
.contact-form{background:rgba(255,255,255,.06)}
.form-grid{display:grid; gap:14px; margin-top:22px}
input,select,textarea{
  width:100%; border-radius:14px; padding:14px 16px; font:inherit; color:#fff;
  border:1px solid rgba(255,255,255,.18); background:rgba(255,255,255,.1)
}
input::placeholder, textarea::placeholder{color:rgba(255,255,255,.62)}
textarea{min-height:110px; resize:vertical}
.fine{font-size:12px; line-height:1.7; color:rgba(255,255,255,.64); margin-top:12px}
.page-hero{
  background:linear-gradient(180deg,var(--bg),var(--bg2)); color:#fff; padding:88px 0 52px
}
.page-hero .lead{color:rgba(255,255,255,.8)}
.list{display:grid; gap:14px}
.list .row{padding:18px 20px; border-radius:18px; background:#fff; border:1px solid var(--line); box-shadow:0 10px 24px rgba(5,20,40,.05)}
.list .row strong{display:block; margin-bottom:6px}
footer{padding:28px 0 44px; background:#f7f8fa; color:#617186; border-top:1px solid var(--line)}
.footer-row{display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap}
@media (max-width:1024px){
  .hero-grid,.grid-2,.contact-grid,.grid-3,.grid-4,.kpis{grid-template-columns:1fr 1fr}
}
@media (max-width:780px){
  .menu{display:none}
  .hero-grid,.grid-2,.contact-grid,.grid-3,.grid-4,.kpis{grid-template-columns:1fr}
  .gallery{grid-template-columns:1fr 1fr; grid-auto-rows:140px}
  .gallery .item{grid-column:auto !important; grid-row:span 1 !important}
  .hero-content{padding-top:64px}
  .section,.page-hero{padding:72px 0}
  .contact-copy,.contact-form,.banner-content{padding:28px}
}