:root {
  --orange: #E8500A;
  --orange-dark: #B83D06;
  --orange-light: #FF6B2B;
  --charcoal: #1C1C1C;
  --dark: #111111;
  --mid: #2E2E2E;
  --gray: #5A5A5A;
  --white: #FFFFFF;
  --border: rgba(255,255,255,0.1);
  --transition: 0.3s cubic-bezier(0.4,0,0.2,1);
}
* { 
    margin:0;
    padding:0;
    box-sizing:border-box;
  }




html { 
        scroll-behavior: smooth; 
    }


body {
  font-family: 'Barlow', sans-serif;
  background: var(--dark);
  color: var(--white);
  overflow-x: hidden;
}

/* ── NAV ── */
nav {
  position: fixed;
  top:0;
  left:0;
  right:0;
  z-index:100;
  display:flex; 
  align-items:center; 
  justify-content:space-between;
  padding:0 5%; 
  height:clamp(60px, 5vw, 80px);
  background:rgba(17,17,17,0.95);
  backdrop-filter:blur(12px);
  border-bottom:1px solid var(--border);
}
.nav-logo { display:flex; align-items:center; gap:0.75rem; text-decoration:none; }
.nav-logo img { height:clamp(32px, 4vw, 56px); }
.nav-logo-text {
  font-family:'Barlow Condensed',sans-serif;
  font-size:1.6rem; font-weight:800;
  color:var(--white); letter-spacing:0.04em;
}
.nav-right { display:flex; align-items:center; gap:1.5rem; }
.nav-back {
  display:flex; align-items:center; gap:0.5rem;
  color:rgba(255,255,255,0.6);
  text-decoration:none; font-size:0.85rem; font-weight:500;
  transition:color var(--transition);
}
.nav-back:hover { color:var(--orange-light); }
.nav-back svg { transition:transform var(--transition); }
.nav-back:hover svg { transform:translateX(-3px); }
.nav-cta {
  background:var(--orange); color:var(--white);
  text-decoration:none; font-size:0.85rem; font-weight:600;
  padding:0.5rem 1.25rem; border-radius:3px;
  letter-spacing:0.04em; text-transform:uppercase;
  transition:background var(--transition);
}
.nav-cta:hover { background:var(--orange-light); }

/* ── BREADCRUMB ── */
.breadcrumb {
  padding:clamp(80px, 8vw, 110px) 7% 0;
  display:flex; align-items:center; gap:0.6rem;
  font-size:0.8rem; color:rgba(255,255,255,0.35);
}
.breadcrumb a { color:rgba(255,255,255,0.35); text-decoration:none; }
.breadcrumb a:hover { color:var(--orange-light); }
.breadcrumb span { color:rgba(255,255,255,0.6); }

/* ── PAGE HERO ── */
.page-hero {
  padding:2.5rem 7% 5rem;
  display:grid; grid-template-columns:1fr 1fr; gap:4rem; align-items:center;
}

.page-tag {
  display:inline-flex; align-items:center; gap:0.5rem;
  color:var(--orange); font-size:0.75rem; font-weight:600;
  letter-spacing:0.12em; text-transform:uppercase; margin-bottom:1rem;
}
.page-tag::before {
  content:''; width:24px; height:2px; background:var(--orange);
}

.page-hero-left{
  margin-left:15%;

}




.page-hero h1 {
  font-family:'Barlow Condensed',sans-serif;
  font-size:clamp(3rem,5.5vw,5rem);
  font-weight:800; line-height:0.95;
  text-transform:uppercase; letter-spacing:-0.01em;
  margin-bottom:1.5rem;
}
.page-hero h1 span { color:var(--orange); display:block; }
.page-hero-desc {
  font-size:1.05rem; font-weight:300;
  color:rgba(255,255,255,0.65); line-height:1.75;
  max-width:520px; margin-bottom:2rem;
}
.hero-actions { display:flex; gap:1rem; flex-wrap:wrap; }
.btn-primary {
  display:inline-flex; align-items:center; gap:0.6rem;
  background:var(--orange); color:var(--white);
  text-decoration:none; font-weight:600; font-size:0.875rem;
  letter-spacing:0.05em; text-transform:uppercase;
  padding:0.9rem 2rem; border-radius:3px;
  transition:all var(--transition);
}
.btn-primary:hover { background:var(--orange-light); transform:translateY(-2px); }
.btn-outline {
  display:inline-flex; align-items:center; gap:0.6rem;
  background:transparent; color:var(--white);
  text-decoration:none; font-weight:500; font-size:0.875rem;
  letter-spacing:0.04em; text-transform:uppercase;
  padding:0.9rem 2rem; border-radius:3px;
  border:1px solid rgba(255,255,255,0.22);
  transition:all var(--transition);
}
.btn-outline:hover { border-color:rgba(255,255,255,0.55); background:rgba(255,255,255,0.05); }

.page-hero-visual {
  background:var(--charcoal);
  border-radius:6px; overflow:hidden;
  aspect-ratio:4/3;
  display:flex; align-items:center; justify-content:center;
  position:relative;
}

/* ── STATS STRIP ── */
.stats-strip {
  display:grid; grid-template-columns:repeat(3,1fr);
  border-top:1px solid rgba(255,255,255,0.08);
  border-bottom:1px solid rgba(255,255,255,0.08);
  margin:0 0 5rem;
}
.stat-item {
  padding:2.5rem 7%;
  border-right:1px solid rgba(255,255,255,0.08);
  text-align:center;
}
.stat-item:last-child { border-right:none; }
.stat-num {
  font-family:'Barlow Condensed',sans-serif;
  font-size:3rem; font-weight:800;
  color:var(--orange); line-height:1;
}
.stat-label {
  font-size:0.8rem; color:rgba(255,255,255,0.45);
  text-transform:uppercase; letter-spacing:0.06em; margin-top:0.4rem;
}

/* ── SECTIONS ── */
.section { padding:5rem 7%; }
.section-alt { background:var(--charcoal); }
.section-tag {
  display:inline-flex; align-items:center; gap:0.5rem;
  color:var(--orange); font-size:0.75rem; font-weight:600;
  letter-spacing:0.12em; text-transform:uppercase; margin-bottom:0.75rem;
}
.section-tag::before { content:''; width:24px; height:2px; background:var(--orange); }
.section-title {
  font-family:'Barlow Condensed',sans-serif;
  font-size:clamp(2rem,3.5vw,2.8rem);
  font-weight:700; text-transform:uppercase; line-height:1.05;
}
.section-title span { color:var(--orange); }
.section-sub {
  color:rgba(255,255,255,0.55); font-size:0.95rem;
  line-height:1.75; margin-top:0.75rem; max-width:600px;
}

/* ── SERVICES GRID ── */
.services-grid {
  display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
  gap:1.5px; margin-top:3rem;
  background:rgba(255,255,255,0.06); border-radius:6px; overflow:hidden;
}
.srv-card {
  background:var(--dark); padding:2.25rem;
  transition:background var(--transition);
}
.section-alt .srv-card { background:var(--charcoal); }
.srv-card:hover { background:var(--mid); }
.srv-icon { font-size:2rem; margin-bottom:1rem; display:block; }
.srv-title { font-weight:600; font-size:1rem; margin-bottom:0.5rem; }
.srv-text { font-size:0.875rem; color:rgba(255,255,255,0.5); line-height:1.65; }
.srv-list { list-style:none; margin-top:0.75rem; }
.srv-list li {
  font-size:0.825rem; color:rgba(255,255,255,0.5);
  padding:0.3rem 0;
  border-bottom:1px solid rgba(255,255,255,0.05);
  display:flex; align-items:center; gap:0.5rem;
}
.srv-list li:last-child { border-bottom:none; }
.srv-list li::before {
  content:''; width:5px; height:5px;
  background:var(--orange); border-radius:50%; flex-shrink:0;
}

/* ── TWO-COL FEATURE ── */
.feature-2col {
  display:grid; grid-template-columns:1fr 1fr;
  gap:5rem; align-items:center; margin-top:3rem;
}
.feature-text p {
  color:rgba(255,255,255,0.6); font-size:0.95rem; line-height:1.8; margin-bottom:1.25rem;
}
.feature-highlight {
  background:rgba(232,80,10,0.1);
  border-left:3px solid var(--orange);
  padding:1rem 1.5rem; border-radius:0 4px 4px 0;
  margin:1.5rem 0;
  font-weight:500; font-size:0.95rem; line-height:1.6;
  color:rgba(255,255,255,0.85);
}
.feature-visual {
  background:var(--mid); border-radius:6px;
  overflow:hidden; position:relative;
}
.feature-visual svg { width:100%; display:block; }

/* ── PROCESS ── */
.process-list { margin-top:3rem; counter-reset:step; }
.process-item {
  display:flex; gap:2rem; align-items:flex-start;
  padding:2rem 0; border-bottom:1px solid rgba(255,255,255,0.07);
  counter-increment:step;
}
.process-item:last-child { border-bottom:none; }
.process-num {
  font-family:'Barlow Condensed',sans-serif;
  font-size:3.5rem; font-weight:800;
  color:rgba(232,80,10,0.25); line-height:1;
  min-width:70px; flex-shrink:0;
  content:counter(step);
}

.process-item-title { font-weight:600; font-size:1.05rem; margin-bottom:0.4rem; }
.process-item-text { font-size:0.875rem; color:rgba(255,255,255,0.5); line-height:1.65; }

/* ── TYPES ACCORDION ── */
.types-grid {
  display:grid; grid-template-columns:1fr 1fr; gap:1.5px;
  margin-top:3rem; background:rgba(255,255,255,0.06);
  border-radius:6px; overflow:hidden;
}
.type-card {
  background:var(--dark); padding:2.25rem;
  transition:background var(--transition); cursor:default;
}
.type-card:hover { background:var(--mid); }
.type-card-top { display:flex; align-items:center; gap:1rem; margin-bottom:1rem; }
.type-badge {
  background:rgba(232,80,10,0.15);
  border:1px solid rgba(232,80,10,0.35);
  color:var(--orange-light);
  font-size:0.75rem; font-weight:600;
  text-transform:uppercase; letter-spacing:0.06em;
  padding:0.3rem 0.75rem; border-radius:2px;
  white-space:nowrap;
}
.type-title { font-weight:600; font-size:1rem; }
.type-text { font-size:0.875rem; color:rgba(255,255,255,0.5); line-height:1.65; }

/* ── FAQ ── */
.faq-list { margin-top:3rem; }
.faq-item {
  border-bottom:1px solid rgba(255,255,255,0.08);
  overflow:hidden;
}
.faq-q {
  display:flex; justify-content:space-between; align-items:center;
  padding:1.5rem 0; cursor:pointer;
  font-weight:500; font-size:0.95rem;
  user-select:none;
  transition:color var(--transition);
}
.faq-q:hover { color:var(--orange-light); }
.faq-q .faq-icon {
  width:24px; height:24px; flex-shrink:0;
  display:flex; align-items:center; justify-content:center;
  background:rgba(255,255,255,0.06); border-radius:50%;
  font-size:1rem; transition:transform var(--transition);
}
.faq-item.open .faq-icon { transform:rotate(45deg); }
.faq-a {
  max-height:0; overflow:hidden;
  transition:max-height 0.4s ease, padding 0.3s ease;
  font-size:0.875rem; color:rgba(255,255,255,0.55); line-height:1.75;
}
.faq-item.open .faq-a { max-height:300px; padding-bottom:1.5rem; }

/* ── CTA MINI ── */
.cta-mini {
  background:var(--orange); border-radius:6px;
  padding:3.5rem 4rem; margin:5rem 7%;
  display:grid; grid-template-columns:1fr auto; gap:2rem; align-items:center;
}
.cta-mini-title {
  font-family:'Barlow Condensed',sans-serif;
  font-size:clamp(1.6rem,3vw,2.4rem);
  font-weight:700; text-transform:uppercase; line-height:1.1;
}
.cta-mini-sub { opacity:0.85; font-size:0.95rem; margin-top:0.5rem; }
.btn-white {
  display:inline-flex; align-items:center; gap:0.6rem;
  background:var(--white); color:var(--orange-dark);
  text-decoration:none; font-weight:700; font-size:0.875rem;
  letter-spacing:0.05em; text-transform:uppercase;
  padding:1rem 2.25rem; border-radius:3px; white-space:nowrap;
  transition:all var(--transition);
}
.btn-white:hover { background:var(--charcoal); color:var(--white); }

/* ── FOOTER ── */
footer {
  background:#0A0A0A; padding:3rem 7%;
  display:flex; align-items:center; justify-content:space-between;
  border-top:1px solid rgba(255,255,255,0.06); flex-wrap:wrap; gap:1.5rem;
}
.footer-logo-text {
  font-family:'Barlow Condensed',sans-serif;
  font-size:1.3rem; font-weight:800; color:rgba(255,255,255,0.35);
}
.footer-info { font-size:0.8rem; color:rgba(255,255,255,0.3); line-height:1.7; text-align:center; }
.footer-links { display:flex; gap:1.5rem; }
.footer-links a {
  font-size:0.8rem; color:rgba(255,255,255,0.3);
  text-decoration:none; transition:color var(--transition);
}
.footer-links a:hover { color:var(--orange-light); }

/* ── PAGE SWITCHER (sidebar nav) ── */
.sidenav {
  position:fixed; right:0; top:50%; transform:translateY(-50%);
  z-index:90; display:flex; flex-direction:column; gap:4px;
  padding:1rem 0;
}
.sidenav-dot {
  width:8px; height:8px; border-radius:50%;
  background:rgba(255,255,255,0.2);
  cursor:pointer; transition:all var(--transition);
  margin:0 1rem 0 auto;
  display:block;
}
.sidenav-dot.active { background:var(--orange); width:8px; height:24px; border-radius:4px; }
.sidenav-dot:hover { background:rgba(255,255,255,0.5); }

/* ── SERVICE CARDS OVERVIEW ── */
.overview-grid {
  display:grid; grid-template-columns:repeat(3,1fr);
  gap:1.25rem; margin-top:3rem;
}
.ov-card {
  background:var(--charcoal); border:1px solid rgba(255,255,255,0.06);
  border-radius:6px; padding:2rem;
  display:flex; flex-direction:column; gap:0.75rem;
  cursor:pointer; transition:all var(--transition);
  text-decoration:none; color:var(--white);
  position:relative; overflow:hidden;
}
.ov-card::after {
  content:''; position:absolute; top:0; left:0; right:0; height:3px;
  background:var(--orange); transform:scaleX(0); transform-origin:left;
  transition:transform var(--transition);
}
.ov-card:hover::after { transform:scaleX(1); }
.ov-card:hover { background:var(--mid); transform:translateY(-3px); }
.ov-icon { font-size:2.25rem; }
.ov-title { font-weight:600; font-size:1rem; }
.ov-text { font-size:0.8rem; color:rgba(255,255,255,0.5); line-height:1.55; }
.ov-arrow {
  margin-top:auto; color:var(--orange);
  font-size:1.25rem; transition:transform var(--transition);
}
.ov-card:hover .ov-arrow { transform:translateX(4px); }

/* ── RESPONSIVE ── */
@media(max-width:900px) {
  .page-hero { grid-template-columns:1fr; }
  .page-hero-left { margin-left: 0; }
  .page-hero-visual { display:none; }
  .feature-2col, .types-grid { grid-template-columns:1fr; }
  .overview-grid { grid-template-columns:1fr 1fr; }
  .cta-mini { grid-template-columns:1fr; }
  .stats-strip { grid-template-columns:1fr; }
  .stat-item { border-right:none; border-bottom:1px solid rgba(255,255,255,0.08); }
}
@media(max-width:600px) {
  .overview-grid { grid-template-columns:1fr; }
  .page-hero { padding:2rem 5% 3rem; }
  .section { padding:3.5rem 5%; }
  .cta-mini { padding:2.5rem; margin:3rem 5%; }
}

/* page visibility */
.page { display:none; }
.page.active { display:block; }


