:root{
  --bg:#0c201a;--bg-2:#0f2d25;--text:#eaf0ec;--muted:#b8c3ba;
  --gold:#d4af37;--border:rgba(255,255,255,.08);--shadow:0 10px 30px rgba(0,0,0,.35);
  --maxw:1120px;
}
*{box-sizing:border-box}html,body{margin:0;padding:0;background:var(--bg);color:var(--text);
font-family:Inter,system-ui,Segoe UI,Roboto,Helvetica,Arial,sans-serif;line-height:1.6}
a{color:var(--text);text-decoration:none}a:hover{color:var(--gold)}
h1,h2,h3{font-family:Cinzel,serif;letter-spacing:.3px}
h1{font-size:clamp(28px,4.4vw,56px);line-height:1.15;margin:0 0 .6rem}
h2{font-size:clamp(24px,3.2vw,34px);margin:0 0 .8rem}
h3{font-size:clamp(18px,2.2vw,22px);margin:.2rem 0 .4rem}
.container{width:min(100% - 2rem, var(--maxw));margin-inline:auto}
.skip{position:absolute;left:-9999px;top:auto}.skip:focus{left:1rem;top:1rem;background:#000;color:#fff;padding:.5rem 1rem;border-radius:.4rem;z-index:1000}
.header{position:sticky;top:0;z-index:50;background:rgba(11,31,26,.7);backdrop-filter:saturate(150%) blur(6px);border-bottom:1px solid var(--border)}
.nav{display:flex;align-items:center;justify-content:space-between;padding:.7rem 0}
.brand{display:flex;align-items:center;gap:.6rem}.logo{height:40px;aspect-ratio:3/1;object-fit:contain;filter:drop-shadow(0 2px 8px rgba(0,0,0,.5))}
.brand-text{font-family:Cinzel,serif;font-weight:700;letter-spacing:.5px}
.menu{display:flex;gap:1.2rem;align-items:center}.menu a{padding:.4rem .2rem;border-bottom:2px solid transparent}.menu a:hover{border-color:var(--gold)}
.btn-small{padding:.4rem .8rem;border-radius:999px;border:1px solid var(--gold)}
.burger{display:none;background:none;border:none;font-size:1.6rem;color:var(--text)}
.hero{min-height:72vh;background:linear-gradient(180deg, rgba(4,12,9,.65), rgba(11,31,26,.95)),
radial-gradient(1200px 600px at 80% -10%, rgba(212,175,55,.15), transparent),
url('../img/hero.jpg');background-size:cover;background-position:center;color:var(--text)}
.hero-inner{padding:clamp(3rem,8vw,6rem) 0}
.lead{font-size:clamp(16px,2.1vw,20px);opacity:.95;max-width:60ch}
.cta{display:flex;gap:.8rem;flex-wrap:wrap;margin:1rem 0}
.btn{display:inline-flex;align-items:center;justify-content:center;padding:.8rem 1.2rem;border-radius:999px;border:1px solid var(--gold);cursor:pointer;transition:.2s all ease;font-weight:600;letter-spacing:.2px}
.btn-outline{background:transparent;color:var(--text)}.btn-primary{background:var(--gold);border-color:var(--gold);color:#0d0d0d;box-shadow:0 8px 30px rgba(212,175,55,.25)}
.btn-primary:hover{filter:brightness(1.05)}.btn-outline:hover{background:rgba(212,175,55,.08)}
.badges{display:flex;gap:.8rem;flex-wrap:wrap;margin-top:1rem;padding:0;list-style:none}
.badges li{padding:.4rem .8rem;border:1px solid var(--border);border-radius:999px;background:rgba(255,255,255,.03)}
.section{padding:clamp(2.8rem,7vw,4.2rem) 0;background:linear-gradient(180deg, rgba(255,255,255,.015), transparent)}
.grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
.card{background:rgba(255,255,255,.02);border:1px solid var(--border);border-radius:16px;padding:1.2rem;box-shadow:var(--shadow)}
.services .usp{display:grid;grid-template-columns:repeat(3,1fr);gap:.8rem;margin-top:1rem}
.usp-item{border:1px dashed var(--border);border-radius:12px;padding:.8rem;text-align:center;background:rgba(255,255,255,.02)}
.process .steps{list-style:none;padding:0;margin:0;display:grid;gap:.6rem}
.steps li{display:flex;align-items:center;gap:.8rem;background:rgba(255,255,255,.02);border:1px solid var(--border);border-radius:12px;padding:.8rem}
.steps li span{display:inline-flex;width:32px;height:32px;border-radius:50%;align-items:center;justify-content:center;background:rgba(212,175,55,.2);border:1px solid var(--gold);font-weight:700}
.portfolio .tiles{margin-top:1rem}
.portfolio .tile{display:flex;align-items:end;min-height:160px;border-radius:16px;padding:1rem;border:1px solid var(--border);font-weight:700;letter-spacing:.3px;box-shadow:var(--shadow);
background:linear-gradient(180deg, rgba(0,0,0,.35), rgba(0,0,0,.6))}
.tile.bg-a{background-image:linear-gradient(180deg, rgba(0,0,0,.35), rgba(0,0,0,.6)), url('../img/ref1.jpg');background-size:cover;background-position:center}
.tile.bg-b{background-image:linear-gradient(180deg, rgba(0,0,0,.35), rgba(0,0,0,.6)), url('../img/ref2.jpg');background-size:cover;background-position:center}
.tile.bg-c{background-image:linear-gradient(180deg, rgba(0,0,0,.35), rgba(0,0,0,.6)), url('../img/ref3.jpg');background-size:cover;background-position:center}
.pricing .price{background:linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.01));border:1px solid var(--border);border-radius:18px;padding:1.2rem;display:flex;flex-direction:column;gap:1rem;box-shadow:var(--shadow)}
.pricing .price ul{margin:0;padding-left:1.1rem}
.pricing .price.featured{border-color:rgba(212,175,55,.45);box-shadow:0 20px 60px rgba(212,175,55,.15)}
.pricing .price h3{color:var(--gold)}.pricing .from{font-weight:800;color:var(--gold)}
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.form{display:grid;gap:.8rem;background:rgba(255,255,255,.02);border:1px solid var(--border);border-radius:16px;padding:1rem}
.form label{display:grid;gap:.4rem}.form input,.form textarea{background:#0d1c18;border:1px solid var(--border);border-radius:12px;color:var(--text);padding:.7rem .8rem}
.form button{justify-self:start}.hidden{display:none}
.footer{border-top:1px solid var(--border);background:#0a1815}
.footer .container{display:flex;gap:1rem;justify-content:space-between;align-items:center;padding:1.2rem 0}
.footer .legal{display:flex;gap:.8rem}
@media (max-width: 900px){
  .menu{position:fixed;inset:60px 0 auto 0;background:#0a1815;border-bottom:1px solid var(--border);padding:1rem;display:none;flex-direction:column;gap:.8rem}
  .burger{display:block}
  .grid-2{grid-template-columns:1fr}
  .grid-3{grid-template-columns:1fr}
  .services .usp{grid-template-columns:1fr}
  .contact-grid{grid-template-columns:1fr}
}