*,
*::before,
*::after { box-sizing: border-box; }

:root{
  --bg:#0f1113;
  --bg-soft:#15181c;
  --panel:#171b20;
  --panel-2:#1c2127;
  --text:#f3f4f6;
  --muted:#b3bac5;
  --line:rgba(255,255,255,.08);
  --red:#e10600;
  --red-soft:#ff3a34;
  --max:1180px;
  --radius:20px;
  --shadow:0 20px 60px rgba(0,0,0,.35);
}

html { scroll-behavior:smooth; }
body{
  margin:0;
  background:var(--bg);
  color:var(--text);
  font-family:"Inter", system-ui, sans-serif;
  line-height:1.6;
}

img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }

.container{
  width:min(calc(100% - 2rem), var(--max));
  margin-inline:auto;
}

.site-header{
  position:sticky;
  top:0;
  z-index:30;
  backdrop-filter: blur(12px);
  background:rgba(10,10,10,.55);
  border-bottom:1px solid var(--line);
}

.nav{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:1rem 0;
  gap:1rem;
}

.nav nav{
  display:flex;
  align-items:center;
  gap:1.2rem;
  flex-wrap:wrap;
}

.nav nav a{
  font-size:.95rem;
  color:var(--muted);
}

.nav nav a:hover{ color:var(--text); }

.brand{
  display:inline-flex;
  align-items:center;
  gap:0;
  font-family:"Orbitron", sans-serif;
  font-weight:800;
  letter-spacing:.03em;
  font-size:2.5rem;
}
.brand-clic{ color:#fff; }
.brand-shot{ color:#fff; }
.brand-o{
  width:1em; height:1em;
  border:.16em solid var(--red);
  border-radius:50%;
  display:inline-block;
  position:relative;
  margin:0 .04em;
}
.brand-o::after{
  content:"";
  width:.28em; height:.28em;
  background:var(--red);
  border-radius:50%;
  position:absolute;
  inset:0; margin:auto;
}
.brand-o.small{ transform:scale(.85); }

.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.5rem;
  background:linear-gradient(180deg, var(--red-soft), var(--red));
  color:white;
  padding:.95rem 1.25rem;
  border-radius:999px;
  font-weight:700;
  border:1px solid rgba(255,255,255,.08);
  box-shadow:0 10px 30px rgba(225,6,0,.25);
}
.btn:hover{ transform:translateY(-1px); }
.btn-secondary{
  background:transparent;
  color:var(--text);
  box-shadow:none;
  border:1px solid var(--line);
}
.btn-sm{
  padding:.65rem .95rem;
  font-size:.92rem;
}
.full{ width:100%; }

.hero{
  position:relative;
  min-height:88svh;
  display:grid;
  align-items:end;
  overflow:hidden;
}
.hero-media,
.hero-media img,
.hero-overlay{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
}
.hero-media img{
  object-fit:cover;
  object-position:center 45%;
  filter:saturate(.9);
}
.hero-overlay{
  background:
    linear-gradient(180deg, rgba(0,0,0,.25), rgba(0,0,0,.65) 50%, rgba(15,17,19,.92) 100%),
    radial-gradient(circle at 70% 10%, rgba(225,6,0,.18), transparent 30%);
}
.hero-content{
  position:relative;
  z-index:2;
  padding:8rem 0 4rem;
  max-width:820px;
}
.eyebrow, .section-kicker{
  color:#ff8a86;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.12em;
  font-size:.78rem;
  margin:0 0 .9rem;
}
.hero h1{
  font-family:"Orbitron", sans-serif;
  font-size:clamp(2.4rem, 7vw, 3rem);
  line-height:1.02;
  margin:.2rem 0 1.2rem;
  max-width:12ch;
}
.hero h1 span{ color:#fff; }
.lead{
  font-size:1.1rem;
  color:#e7e7e7;
  max-width:68ch;
}
.hero-actions{
  display:flex;
  gap:1rem;
  flex-wrap:wrap;
  margin:2rem 0 1.4rem;
}
.hero-points{
  list-style:none;
  display:flex;
  gap:1rem;
  flex-wrap:wrap;
  padding:0;
  margin:1.6rem 0 0;
}
.hero-points li{
  padding:.55rem .9rem;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.04);
  border-radius:999px;
  color:#f5f5f5;
  font-size:.92rem;
}

.section{
  padding:5rem 0;
}
.dark{ background:var(--bg-soft); }
.section-head{
  max-width:760px;
  margin-bottom:2rem;
}
.section-head.narrow{ max-width:560px; }
.section h2{
  font-family:"Orbitron", sans-serif;
  font-size:clamp(1.8rem, 4vw, 3rem);
  line-height:1.1;
  margin:.15rem 0 .8rem;
}

.section a{
  font-size:clamp(1.8rem, 4vw, 1rem);
  color:var(--red-soft);
}
.section-head p:last-child{ color:var(--muted); }

.intro-grid,
.two-col{
  display:grid;
  grid-template-columns:1.05fr .95fr;
  gap:2rem;
}
.cards-2{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:1rem;
}
.card, .step, .benefit, .contact-card{
  background:linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.02));
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:1.35rem;
  box-shadow:var(--shadow);
}
.card h3, .step h3, .benefit h3, .list-block h3{ margin-top:0; }

.steps{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:1rem;
  margin-top:1.5rem;
}
.step-num{
  display:inline-block;
  color:var(--red-soft);
  font-family:"Orbitron", sans-serif;
  margin-bottom:1rem;
  font-size:1rem;
}

.benefits{
  display:grid;
  grid-template-columns:repeat(2, 1fr);
  gap:1rem;
}
.benefit p, .card p, .step p, .list-block p, .small-note, .contact-card p, .faq p{
  color:var(--muted);
}

.media-stack img{
  width:100%;
}
.rounded{
  border-radius:28px;
  border:1px solid var(--line);
}
.shadow{ box-shadow:var(--shadow); }

.list-block{
  margin-bottom:1.3rem;
}
.clean-list{
  margin:0;
  padding-left:1rem;
  color:var(--muted);
}
.small-note{
  font-size:.96rem;
}

.gallery-grid{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:1rem;
  margin-top:1.4rem;
}
.gallery-grid img{
  width:100%;
  height:100%;
  object-fit:cover;
  aspect-ratio: 1 / 1;
  border-radius:20px;
  border:1px solid var(--line);
  box-shadow:var(--shadow);
}

.align-center{ align-items:center; }

.stats{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:1rem;
  margin-top:1.5rem;
}
.stat{
  padding:1rem;
  border:1px solid var(--line);
  border-radius:18px;
  background:rgba(255,255,255,.03);
}
.stat strong{
  display:block;
  font-size:1.4rem;
  font-family:"Orbitron", sans-serif;
}
.stat span{
  display:block;
  color:var(--muted);
  font-size:.92rem;
  margin-top:.35rem;
}

.faq-list{
  display:grid;
  gap:1rem;
}
details{
  border:1px solid var(--line);
  border-radius:18px;
  background:rgba(255,255,255,.03);
  padding:1rem 1.1rem;
}
summary{
  cursor:pointer;
  font-weight:700;
  list-style:none;
}
summary::-webkit-details-marker{ display:none; }
details p{ margin:.75rem 0 0; }

.contact-section .two-col{
  align-items:start;
}
.contact-form{
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:28px;
  padding:1.35rem;
  box-shadow:var(--shadow);
}
.field-row{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:1rem;
}
.field{
  display:flex;
  flex-direction:column;
  gap:.4rem;
  margin-bottom:1rem;
}
label{
  font-size:.92rem;
  color:#d8dbe1;
  font-weight:600;
}
input, select, textarea{
  width:100%;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.08);
  background:var(--panel-2);
  color:var(--text);
  padding:.95rem 1rem;
  font:inherit;
}
input::placeholder, textarea::placeholder{ color:#8d96a3; }

.site-footer{
  border-top:1px solid var(--line);
  background:#0c0d10;
}
.footer-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  padding:1.4rem 0 2rem;
  color:var(--muted);
  flex-wrap:wrap;
}

@media (max-width: 980px){
  .intro-grid, .two-col, .steps, .benefits, .gallery-grid, .stats, .cards-2, .field-row{
    grid-template-columns:1fr;
  }
  .hero{
    min-height:92svh;
  }
  .hero h1{
    max-width:15ch;
  }
  .nav{
    align-items:flex-start;
    flex-direction:column;
  }
}

@media (max-width: 640px){
  .section{ padding:4rem 0; }
  .hero-content{ padding:7rem 0 3rem; }
  .brand{ font-size:1.35rem; }
  .lead{ font-size:1rem; }
  .hero-points li{
    width:100%;
    justify-content:center;
    text-align:center;
  }
}