:root{
  --red:#C0392B; --red2:#E74C3C; --red3:#FF6B5A;
  --dark:#07070B; --dark2:#0E0E16; --dark3:#151520; --dark4:#1C1C28;
  --light:#F5F1EB; --muted:rgba(245,241,235,.45); --muted2:rgba(245,241,235,.22);
  --glass:rgba(255,255,255,.05); --gborder:rgba(255,255,255,.08);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--dark);color:var(--light);font-family:'Inter',sans-serif;-webkit-font-smoothing:antialiased;overflow-x:hidden}

/* ── TOPBAR ── */
#topbar{
  background:linear-gradient(90deg,var(--red) 0%,#A02520 100%);
  padding:9px 0; font-size:11px; letter-spacing:2px; text-transform:uppercase; font-weight:600;
  position:fixed;top:0;left:0;right:0;z-index:1040;
  transition:transform .4s ease;
}
#topbar.hide{transform:translateY(-100%)}
#topbar a{color:rgba(0,0,0,.5);text-decoration:none;transition:color .2s}
#topbar a:hover{color:rgba(0,0,0,.8)}
.tb-pulse{width:6px;height:6px;background:rgba(0,0,0,.4);border-radius:50%;display:inline-block;animation:tbp 2s ease-in-out infinite}
@keyframes tbp{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.2;transform:scale(.6)}}

/* ── NAVBAR ── */
.navbar{
  position:fixed;top:38px;left:0;right:0;z-index:1030;
  padding:0 0;height:72px;
  transition:all .5s cubic-bezier(.22,1,.36,1);
}
.navbar.scrolled{
  top:0;
  background:rgba(7,7,11,.95) !important;
  backdrop-filter:blur(28px) saturate(1.6);
  -webkit-backdrop-filter:blur(28px) saturate(1.6);
  border-bottom:1px solid rgba(255,255,255,.06);
  box-shadow:0 4px 60px rgba(0,0,0,.5);
}
#topbar.hide ~ .navbar{top:0}

.navbar-brand{display:flex;align-items:center;gap:12px;text-decoration:none}
.brand-gem{
  width:42px;height:42px;flex-shrink:0;
  background:linear-gradient(140deg,var(--red2),#8B1A1A);
  clip-path:polygon(50% 0%,100% 25%,100% 75%,50% 100%,0% 75%,0% 25%);
  display:flex;align-items:center;justify-content:center;
  font-family:'Bebas Neue',sans-serif;font-size:20px;color:#fff;
  box-shadow:0 0 22px rgba(192,57,43,.4);
  transition:transform .5s cubic-bezier(.34,1.56,.64,1),box-shadow .3s;
}
.navbar-brand:hover .brand-gem{transform:rotate(30deg);box-shadow:0 0 44px rgba(231,76,60,.6)}
.brand-text{display:flex;flex-direction:column;line-height:1}
.brand-name{font-family:'Bebas Neue',sans-serif;font-size:22px;letter-spacing:4px;color:var(--light)}
.brand-name span{color:var(--red2)}
.brand-sub{font-size:8.5px;letter-spacing:2.5px;text-transform:uppercase;color:rgba(245,241,235,.3);margin-top:3px}

.navbar-nav .nav-link{
  color:rgba(245,241,235,.4) !important;
  font-size:11.5px;letter-spacing:1.8px;text-transform:uppercase;font-weight:500;
  padding:8px 14px !important;position:relative;transition:color .25s !important;
}
.navbar-nav .nav-link::after{
  content:'';position:absolute;bottom:0;left:14px;right:14px;height:1px;
  background:linear-gradient(90deg,var(--red),var(--red2));
  transform:scaleX(0);transition:transform .35s cubic-bezier(.22,1,.36,1);
}
.navbar-nav .nav-link:hover{color:rgba(245,241,235,.88) !important}
.navbar-nav .nav-link:hover::after{transform:scaleX(1)}

.nav-phone{display:flex;flex-direction:column;align-items:flex-end}
.nav-phone-lbl{font-size:8px;letter-spacing:2px;text-transform:uppercase;color:rgba(245,241,235,.25)}
.nav-phone-num{font-size:15px;font-weight:600;color:var(--light);letter-spacing:.3px}

.btn-nav{
  background:linear-gradient(135deg,var(--red),#9B2219);
  color:#fff !important;border:none !important;
  padding:11px 26px !important;font-size:11px !important;font-weight:600 !important;
  letter-spacing:2px !important;text-transform:uppercase !important;
  clip-path:polygon(0 0,calc(100% - 8px) 0,100% 8px,100% 100%,8px 100%,0 calc(100% - 8px));
  transition:all .3s !important;box-shadow:0 6px 24px rgba(192,57,43,.35) !important;
}
.btn-nav:hover{background:linear-gradient(135deg,var(--red2),var(--red)) !important;transform:translateY(-1px) !important;box-shadow:0 10px 36px rgba(192,57,43,.55) !important}

/* Custom hamburger */
.navbar-toggler{
  border:1px solid rgba(192,57,43,.4) !important;
  padding:8px 12px !important;background:rgba(192,57,43,.08) !important;
  transition:all .3s;
}
.navbar-toggler:focus{box-shadow:none !important;outline:none !important}
.navbar-toggler-icon{
  background-image:none !important;
  width:22px;height:16px;
  display:flex;flex-direction:column;justify-content:space-between;
}
.tog-line{width:100%;height:1.5px;background:var(--light);border-radius:2px;transition:all .3s;display:block}

/* Mobile offcanvas */
.offcanvas{background:var(--dark2) !important;border-left:1px solid rgba(192,57,43,.15) !important}
.offcanvas-header{border-bottom:1px solid rgba(255,255,255,.05) !important;padding:20px 24px !important}
.offcanvas-body{padding:24px !important}
.mob-nav-link{
  display:block;font-family:'Bebas Neue',sans-serif;font-size:40px;
  letter-spacing:3px;color:rgba(245,241,235,.35);text-decoration:none;
  padding:14px 0;border-bottom:1px solid rgba(255,255,255,.05);
  transition:color .25s,padding-left .25s;
}
.mob-nav-link:hover{color:var(--red2);padding-left:12px}
.mob-cta{width:100%;background:var(--red);color:#fff;border:none;padding:18px;font-size:14px;font-weight:600;letter-spacing:3px;text-transform:uppercase;margin-top:28px;cursor:pointer;font-family:'Inter',sans-serif;transition:background .25s}
.mob-cta:hover{background:var(--red2)}
.mob-contact{padding-top:24px;margin-top:auto}
.mob-contact p{font-size:11px;color:var(--muted);letter-spacing:.5px;margin-bottom:4px}
.mob-contact strong{color:var(--red2);font-size:16px}

/* ── HERO ── */
.hero-section{
  min-height:100vh;position:relative;overflow:hidden;
  display:flex;align-items:center;
  padding-top:110px;
}
.hero-bg{
  position:absolute;inset:0;
  background:url('https://images.unsplash.com/photo-1558618666-fcd25c85cd64?w=1920&q=85') center/cover no-repeat;
  filter:brightness(.22) saturate(.5);
  animation:kzoom 14s ease forwards;
}
@keyframes kzoom{from{transform:scale(1.1)}to{transform:scale(1)}}
.hero-ov1{position:absolute;inset:0;background:linear-gradient(115deg,rgba(7,7,11,.98) 0%,rgba(7,7,11,.72) 42%,rgba(192,57,43,.16) 70%,rgba(7,7,11,.58) 100%)}
.hero-ov2{position:absolute;inset:0;background:radial-gradient(ellipse 55% 65% at 90% 48%,rgba(192,57,43,.2) 0%,transparent 58%)}
.hero-grid{
  position:absolute;inset:0;
  background-image:linear-gradient(rgba(192,57,43,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(192,57,43,.04) 1px,transparent 1px);
  background-size:88px 88px;
  mask-image:radial-gradient(ellipse 85% 85% at 50% 50%,#000 15%,transparent 72%);
  animation:gdrift 32s linear infinite;
}
@keyframes gdrift{0%{background-position:0 0}100%{background-position:88px 88px}}
.hero-vgn{position:absolute;inset:0;background:radial-gradient(ellipse 130% 130% at 50% 50%,transparent 22%,rgba(7,7,11,.85) 100%)}
.hero-orb{position:absolute;right:3%;top:50%;transform:translateY(-50%);width:min(50vw,580px);height:min(50vw,580px);background:radial-gradient(circle,rgba(192,57,43,.14) 0%,transparent 66%);border-radius:50%;animation:orbr 7s ease-in-out infinite alternate;pointer-events:none}
@keyframes orbr{0%{transform:translateY(-50%) scale(.93);opacity:.7}100%{transform:translateY(-52%) scale(1.06);opacity:1}}
.hero-ghost{position:absolute;bottom:-80px;right:-40px;font-family:'Bebas Neue',sans-serif;font-size:clamp(160px,26vw,460px);color:rgba(192,57,43,.03);line-height:1;pointer-events:none;user-select:none;letter-spacing:4px}

.hero-badge{
  display:inline-flex;align-items:center;gap:10px;
  border:1px solid rgba(192,57,43,.3);background:rgba(192,57,43,.08);
  backdrop-filter:blur(10px);padding:8px 18px 8px 12px;
  margin-bottom:32px;animation:slideUp .7s .1s both;
}
.badge-dot{width:7px;height:7px;background:var(--red2);border-radius:50%;animation:tbp 2s ease-in-out infinite}
.hero-badge span{font-size:10.5px;letter-spacing:2.5px;text-transform:uppercase;color:rgba(245,241,235,.55);font-weight:500}

.hero-h1{font-family:'Bebas Neue',sans-serif;font-size:clamp(72px,10vw,148px);line-height:.83;letter-spacing:.5px}
.h1-line1{display:block;color:var(--light);animation:slideUp .8s .28s both}
.h1-line2{display:block;position:relative;overflow:hidden;animation:slideUp .8s .44s both}
.h1-ghost{color:transparent;-webkit-text-stroke:2px rgba(192,57,43,.3)}
.h1-fill{
  position:absolute;left:0;top:0;width:0%;overflow:hidden;white-space:nowrap;
  background:linear-gradient(90deg,var(--red2),var(--red3),var(--red2));background-size:200%;
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
  animation:tfill 1.1s .95s cubic-bezier(.22,1,.36,1) forwards,shimmer 3s 2.1s linear infinite;
}
@keyframes tfill{to{width:100%}}
@keyframes shimmer{0%{background-position:0%}100%{background-position:200%}}
.h1-line3{display:block;color:var(--light);animation:slideUp .8s .56s both}

.hero-desc{font-size:16px;line-height:1.88;color:var(--muted);font-weight:300;border-left:2px solid rgba(192,57,43,.55);padding-left:18px;animation:slideUp .8s .66s both}
.hero-loc{display:flex;align-items:center;gap:9px;font-size:11px;letter-spacing:2px;text-transform:uppercase;color:var(--muted2);animation:slideUp .8s .72s both}
.loc-dot{width:5px;height:5px;background:var(--red2);border-radius:50%;flex-shrink:0}

.btn-primary-custom{
  display:inline-flex;align-items:center;gap:10px;
  background:linear-gradient(135deg,var(--red),#9B2219);color:#fff;
  border:none;padding:17px 42px;font-size:12px;font-weight:600;
  letter-spacing:2.5px;text-transform:uppercase;cursor:pointer;font-family:'Inter',sans-serif;
  clip-path:polygon(0 0,calc(100% - 10px) 0,100% 10px,100% 100%,10px 100%,0 calc(100% - 10px));
  transition:all .35s;box-shadow:0 8px 32px rgba(192,57,43,.38);
  position:relative;overflow:hidden;
}
.btn-primary-custom::before{content:'';position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.12),transparent);transform:translateX(-100%);transition:transform .6s}
.btn-primary-custom:hover{background:linear-gradient(135deg,var(--red2),var(--red));box-shadow:0 16px 56px rgba(192,57,43,.55);transform:translateY(-2px)}
.btn-primary-custom:hover::before{transform:translateX(100%)}

.btn-outline-custom{
  display:inline-flex;align-items:center;gap:10px;
  background:rgba(255,255,255,.06);backdrop-filter:blur(14px);
  color:rgba(245,241,235,.65);border:1px solid rgba(255,255,255,.13);
  padding:17px 42px;font-size:12px;font-weight:500;letter-spacing:2px;text-transform:uppercase;
  cursor:pointer;font-family:'Inter',sans-serif;transition:all .3s;
}
.btn-outline-custom:hover{background:rgba(255,255,255,.1);border-color:rgba(192,57,43,.45);color:var(--red2)}

.hero-stats-row{border-top:1px solid rgba(255,255,255,.06);animation:slideUp .8s .96s both}
.stat-item{padding:20px 0 4px;border-right:1px solid rgba(255,255,255,.04)}
.stat-item:last-child{border-right:none}
.stat-num{font-family:'Bebas Neue',sans-serif;font-size:40px;line-height:1;background:linear-gradient(135deg,var(--red2),var(--red3));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.stat-num.plain{background:none;-webkit-text-fill-color:var(--light);color:var(--light)}
.stat-label{font-size:9.5px;letter-spacing:2px;text-transform:uppercase;color:var(--muted2);margin-top:4px}

/* Hero right card */
.hero-card{border:1px solid rgba(255,255,255,.08);overflow:hidden;background:var(--dark3)}
.hero-card-img{height:290px;background:url('images/epoxy-floor-1.png') center/cover;filter:brightness(.6) saturate(.7);transition:transform .7s ease,filter .5s}
.hero-card:hover .hero-card-img{transform:scale(1.05);filter:brightness(.8) saturate(1)}
.hero-card-body{background:var(--dark3);padding:20px 22px}
.live-badge{display:inline-flex;align-items:center;gap:7px;background:var(--red);padding:5px 13px;font-size:9px;font-weight:700;letter-spacing:2px;text-transform:uppercase;margin-bottom:10px}
.live-dot{width:5px;height:5px;background:#fff;border-radius:50%;animation:tbp 1.5s infinite}
.card-title-big{font-family:'Bebas Neue',sans-serif;font-size:24px;letter-spacing:1.5px;color:var(--light)}
.card-meta{font-size:11px;color:var(--muted);margin-top:4px;letter-spacing:.5px}

.mini-card{background:rgba(12,12,18,.96);backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.06);padding:16px;transition:all .3s}
.mini-card:hover{background:rgba(22,22,32,.98);border-color:rgba(192,57,43,.25)}
.mini-card h6{font-family:'Bebas Neue',sans-serif;font-size:15px;letter-spacing:1px;color:var(--light);margin-bottom:3px}
.mini-card p{font-size:10.5px;color:var(--muted);margin:0;font-weight:300}

.scroll-indicator{position:absolute;bottom:28px;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:8px;z-index:5;animation:slideUp .8s 1.6s both}
.scroll-text{font-size:9px;letter-spacing:3px;text-transform:uppercase;color:rgba(245,241,235,.28)}
.scroll-line{width:1px;height:44px;background:linear-gradient(var(--red2),transparent);animation:la 2.5s ease-in-out infinite}
@keyframes la{0%{transform:scaleY(0);transform-origin:top}50%{transform:scaleY(1);transform-origin:top}51%{transform:scaleY(1);transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}

/* ── MARQUEE ── */
.marquee-band{background:linear-gradient(90deg,var(--red),#A02520);padding:13px 0;overflow:hidden}
.marquee-track{display:flex;white-space:nowrap;animation:mqa 22s linear infinite}
.marquee-track span{font-family:'Bebas Neue',sans-serif;font-size:13.5px;letter-spacing:4px;color:rgba(0,0,0,.48);padding:0 26px}
.marquee-track .sep{color:rgba(0,0,0,.24)}
@keyframes mqa{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}

/* ── SECTIONS ── */
.section-tag{display:inline-flex;align-items:center;gap:11px;margin-bottom:12px}
.section-tag::before{content:'';width:22px;height:1px;background:linear-gradient(90deg,var(--red),var(--red2))}
.section-tag span{font-size:10px;letter-spacing:3.5px;text-transform:uppercase;color:var(--red2);font-weight:600}
.section-title{font-family:'Bebas Neue',sans-serif;font-size:clamp(44px,5.8vw,78px);line-height:.88;letter-spacing:1.5px;margin-bottom:60px}
.section-title em{font-style:normal;-webkit-text-stroke:1.5px rgba(192,57,43,.38);color:transparent}

/* ── SERVICE CARDS ── */
.svc-card{background:var(--dark2);border:1px solid rgba(255,255,255,.04);transition:all .4s cubic-bezier(.22,1,.36,1);cursor:default;position:relative;overflow:hidden}
.svc-card::before{content:'';position:absolute;left:0;top:0;bottom:0;width:2px;background:linear-gradient(180deg,var(--red2),var(--red));transform:scaleY(0);transform-origin:bottom;transition:transform .5s cubic-bezier(.22,1,.36,1)}
.svc-card::after{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 70% 60% at 50% 110%,rgba(192,57,43,.08) 0%,transparent 65%);opacity:0;transition:opacity .4s}
.svc-card:hover{background:rgba(192,57,43,.03);border-color:rgba(192,57,43,.15)}
.svc-card:hover::before{transform:scaleY(1)}
.svc-card:hover::after{opacity:1}
.svc-num{position:absolute;right:-6px;top:-18px;font-family:'Bebas Neue',sans-serif;font-size:130px;color:rgba(192,57,43,.04);line-height:1;pointer-events:none;user-select:none}
.svc-img{width:100%;height:242px;overflow:hidden;border-bottom:1px solid rgba(255,255,255,.04)}
.svc-img img{width:100%;height:100%;object-fit:cover;filter:brightness(.6) saturate(.65);transition:transform .65s ease,filter .45s}
.svc-card:hover .svc-img img{transform:scale(1.08);filter:brightness(.82) saturate(1)}
.svc-body{padding:28px}
.svc-body h3{font-family:'Bebas Neue',sans-serif;font-size:22px;letter-spacing:1px;margin-bottom:8px;color:var(--light);position:relative;z-index:1}
.svc-body p{font-size:13px;line-height:1.85;color:var(--muted);font-weight:300;position:relative;z-index:1;margin:0}
.svc-arrow{display:inline-flex;align-items:center;gap:6px;margin-top:14px;font-size:10px;font-weight:600;letter-spacing:2px;text-transform:uppercase;color:var(--red2);position:relative;z-index:1;transition:gap .3s}
.svc-card:hover .svc-arrow{gap:14px}

/* ── PROCESS CARDS (Glassmorphism + Neumorphism) ── */
.process-card{
  background:rgba(255,255,255,.045);
  backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px);
  border:1px solid rgba(255,255,255,.09);
  padding:40px 32px;position:relative;overflow:hidden;height:100%;
  transition:all .45s cubic-bezier(.22,1,.36,1);cursor:default;
}
.process-card::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 80% 80% at 50% 115%,rgba(192,57,43,.1) 0%,transparent 60%);opacity:0;transition:opacity .4s}
.process-card:hover{background:rgba(255,255,255,.075);border-color:rgba(192,57,43,.3);transform:translateY(-8px);box-shadow:0 28px 70px rgba(0,0,0,.45),0 0 0 1px rgba(192,57,43,.2),inset 0 1px 0 rgba(255,255,255,.1)}
.process-card:hover::before{opacity:1}
.process-num{
  width:64px;height:64px;border-radius:50%;
  background:linear-gradient(145deg,rgba(255,255,255,.07),rgba(0,0,0,.25));
  box-shadow:7px 7px 18px rgba(0,0,0,.45),-4px -4px 12px rgba(255,255,255,.04),inset 0 1px 0 rgba(255,255,255,.07);
  display:flex;align-items:center;justify-content:center;
  font-family:'Bebas Neue',sans-serif;font-size:26px;color:var(--red2);
  margin-bottom:20px;transition:all .45s;
}
.process-card:hover .process-num{background:linear-gradient(145deg,rgba(192,57,43,.22),rgba(192,57,43,.08));box-shadow:7px 7px 22px rgba(0,0,0,.55),-4px -4px 14px rgba(255,255,255,.03),inset 0 1px 0 rgba(255,255,255,.09),0 0 0 1px rgba(192,57,43,.35);color:#fff}
.process-icon{font-size:22px;margin-bottom:8px}
.process-card h4{font-family:'Bebas Neue',sans-serif;font-size:22px;letter-spacing:1px;color:var(--light);margin-bottom:0}
.process-line{width:28px;height:1.5px;background:linear-gradient(90deg,var(--red),var(--red2));margin:14px 0;transition:width .35s}
.process-card:hover .process-line{width:48px}
.process-card p{font-size:13px;line-height:1.85;color:var(--muted);font-weight:300;margin:0}

/* ── WHY FEATURES ── */
.feat-item{display:flex;gap:16px;padding:18px 0;border-bottom:1px solid rgba(255,255,255,.05);transition:all .3s;cursor:default}
.feat-item:first-child{border-top:1px solid rgba(255,255,255,.05)}
.feat-item:hover{padding-left:8px}
.feat-icon{width:40px;height:40px;flex-shrink:0;background:linear-gradient(135deg,rgba(192,57,43,.15),rgba(192,57,43,.05));border:1px solid rgba(192,57,43,.2);display:flex;align-items:center;justify-content:center;font-size:16px;margin-top:2px;transition:all .35s}
.feat-item:hover .feat-icon{background:linear-gradient(135deg,rgba(192,57,43,.28),rgba(192,57,43,.1));border-color:rgba(192,57,43,.44);box-shadow:0 4px 16px rgba(192,57,43,.22)}
.feat-text h5{font-size:13.5px;font-weight:600;margin-bottom:4px;color:var(--light)}
.feat-text p{font-size:12.5px;color:var(--muted);line-height:1.75;font-weight:300;margin:0}

/* ── STATS BAND ── */
.stats-band{
  background:linear-gradient(135deg,#0e0608,#1a0508,var(--red),#8B1A1A,#0e0608);
  background-size:300% 300%;animation:gshift 10s ease infinite;
  position:relative;overflow:hidden;
}
@keyframes gshift{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}
.stats-band::before{content:'';position:absolute;inset:0;background:repeating-linear-gradient(90deg,rgba(0,0,0,.05) 0,rgba(0,0,0,0) 1px,rgba(0,0,0,0) 90px)}
.stat-band-item{padding:52px 20px;border-right:1px solid rgba(0,0,0,.12);text-align:center;transition:background .25s}
.stat-band-item:last-child{border-right:none}
.stat-band-item:hover{background:rgba(0,0,0,.08)}
.stat-big{font-family:'Bebas Neue',sans-serif;font-size:72px;color:rgba(0,0,0,.65);line-height:1;letter-spacing:2px}
.stat-lbl{font-size:10px;letter-spacing:3px;text-transform:uppercase;color:rgba(0,0,0,.42);font-weight:700;margin-top:6px}

/* ── PORTFOLIO ── */
.port-item{position:relative;overflow:hidden;cursor:pointer;border:1px solid rgba(255,255,255,.04)}
.port-img{width:100%;height:100%;transition:transform .7s cubic-bezier(.22,1,.36,1);filter:brightness(.68) saturate(.75)}
.port-item:hover .port-img{transform:scale(1.07);filter:brightness(.9) saturate(1.1)}
.port-overlay{position:absolute;inset:0;background:linear-gradient(transparent 28%,rgba(7,7,11,.94));display:flex;flex-direction:column;justify-content:flex-end;padding:22px;opacity:0;transition:opacity .4s}
.port-item:hover .port-overlay{opacity:1}
.port-tag{display:inline-block;background:var(--red);color:#fff;font-size:9px;font-weight:700;letter-spacing:2.5px;text-transform:uppercase;padding:4px 11px;margin-bottom:8px}
.port-overlay h5{font-family:'Bebas Neue',sans-serif;font-size:20px;letter-spacing:1.5px;color:var(--light);margin-bottom:3px}
.port-overlay p{font-size:10px;color:var(--muted);letter-spacing:1.5px;text-transform:uppercase;margin:0}
.pf1{background:url('images/luxury-garage.jpg') center/cover;background-color:#3a0a02}
.pf2{background:url('images/flake-epoxy.jpg') center/cover;background-color:#2a2a2a}
.pf3{background:url('images/industrial-epoxy-brampton.jpg') center/cover;background-color:#1c1c24}
.pf4{background:url('images/concrete-coating-canada.png') center/cover;background-color:#1d2c2e}
.pf5{background:url('https://images.unsplash.com/photo-1571902943202-507ec2618e8f?w=600&q=80') center/cover;background-color:#23201e}

/* ── TESTIMONIALS ── */
.testi-card{background:rgba(255,255,255,.04);backdrop-filter:blur(14px);border:1px solid rgba(255,255,255,.07);padding:36px 30px;transition:all .38s;cursor:default;height:100%}
.testi-card:hover{background:rgba(255,255,255,.07);border-color:rgba(192,57,43,.22);transform:translateY(-5px);box-shadow:0 20px 54px rgba(0,0,0,.32)}
.testi-stars{color:var(--red2);font-size:14px;letter-spacing:3px;margin-bottom:16px}
.testi-card blockquote{font-size:13.5px;line-height:1.9;color:rgba(245,241,235,.58);font-weight:300;font-style:italic;margin-bottom:20px;border-left:2px solid rgba(192,57,43,.3);padding-left:14px}
.testi-card strong{font-size:13.5px;font-weight:600;display:block;margin-bottom:2px;color:var(--light)}
.testi-card span{font-size:10.5px;color:var(--red2);letter-spacing:1px;text-transform:uppercase}
.google-badge{display:inline-flex;align-items:center;gap:7px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.07);padding:7px 12px;font-size:11.5px;color:var(--muted);margin-top:14px}
.google-badge b{color:var(--light)}

/* ── AREAS ── */
.city-item{display:flex;align-items:center;gap:9px;padding:12px 0;border-bottom:1px solid rgba(255,255,255,.04);font-size:13.5px;color:var(--muted);transition:all .22s;cursor:default}
.city-item:hover{color:var(--light);padding-left:7px}
.city-item::before{content:'';width:4px;height:4px;background:var(--red);border-radius:50%;flex-shrink:0;transition:background .2s}
.city-item:hover::before{background:var(--red2)}

/* ── FAQ ── */
.faq-item{border-bottom:1px solid rgba(255,255,255,.06)}
.faq-btn{display:flex;justify-content:space-between;align-items:center;padding:18px 0;cursor:pointer;background:none;border:none;width:100%;text-align:left;transition:color .25s}
.faq-btn h6{font-size:13.5px;font-weight:600;color:var(--light);margin:0;transition:color .25s;padding-right:20px}
.faq-btn:hover h6{color:var(--red2)}
.faq-icon{color:var(--red2);font-size:20px;flex-shrink:0;transition:transform .38s cubic-bezier(.22,1,.36,1);line-height:1}
.faq-item.active .faq-icon{transform:rotate(45deg)}
.faq-body{font-size:13px;line-height:1.9;color:var(--muted);font-weight:300;max-height:0;overflow:hidden;transition:max-height .45s ease,padding .35s;padding-bottom:0}
.faq-item.active .faq-body{max-height:200px;padding-bottom:16px}

/* ── CTA ── */
.cta-section{position:relative;overflow:hidden;padding:150px 0;text-align:center}
.cta-bg-img{position:absolute;inset:0;background:url('https://images.unsplash.com/photo-1558618666-fcd25c85cd64?w=1800&q=80') center/cover;filter:brightness(.16) saturate(.45);transform:scale(1.06)}
.cta-overlay{position:absolute;inset:0;background:radial-gradient(ellipse 70% 80% at 50% 50%,rgba(192,57,43,.14) 0%,rgba(7,7,11,.72) 65%);animation:ctagl 7s ease-in-out infinite alternate}
@keyframes ctagl{0%{opacity:.6;transform:scale(.95)}100%{opacity:1;transform:scale(1.06)}}
.cta-line{position:absolute;bottom:0;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,var(--red),var(--red2),transparent);opacity:.55}
.cta-content{position:relative;z-index:2}
.cta-title{font-family:'Bebas Neue',sans-serif;font-size:clamp(58px,9vw,112px);line-height:.88;letter-spacing:2.5px;margin-bottom:18px}
.cta-title em{font-style:normal;color:var(--red2)}
.cta-sub{font-size:15px;color:var(--muted);margin-bottom:48px;letter-spacing:.5px}
.cta-perk{font-size:10.5px;letter-spacing:1.8px;text-transform:uppercase;color:var(--muted2);display:flex;align-items:center;gap:8px}
.cta-perk::before{content:'✓';color:var(--red2);font-weight:700;font-size:12px}

/* ── FOOTER ── */
.site-footer{background:#040408;padding:72px 0 28px;border-top:1px solid rgba(255,255,255,.05)}
.footer-brand-name{font-family:'Bebas Neue',sans-serif;font-size:22px;letter-spacing:4px;color:var(--light)}
.footer-brand-name span{color:var(--red2)}
.footer-desc{font-size:12.5px;line-height:1.9;color:var(--muted2);font-weight:300}
.footer-addr{font-size:11.5px;color:var(--muted2);line-height:1.9}
.footer-addr b{color:var(--red2);font-size:9.5px;letter-spacing:2px;text-transform:uppercase;display:block;margin-bottom:3px}
.footer-col-title{font-size:9.5px;letter-spacing:3px;text-transform:uppercase;color:var(--red2);margin-bottom:16px;font-weight:600}
.footer-links{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:9px}
.footer-links a{font-size:12.5px;color:rgba(245,241,235,.26);text-decoration:none;transition:color .22s}
.footer-links a:hover{color:var(--light)}
.footer-bottom{border-top:1px solid rgba(255,255,255,.05);padding-top:22px;margin-top:52px}
.footer-bottom p{font-size:11.5px;color:rgba(245,241,235,.16);margin:0;letter-spacing:.4px}

/* ── BG COLORS ── */
.bg-dark1{background:var(--dark)}
.bg-dark2{background:var(--dark2)}
.bg-dark3{background:var(--dark3)}

/* ── REVEAL ANIMATIONS ── */
@keyframes slideUp{from{opacity:0;transform:translateY(36px)}to{opacity:1;transform:translateY(0)}}
.reveal{opacity:.001;transform:translateY(18px);transition:opacity .5s ease-out,transform .5s ease-out}
.reveal.show{opacity:1;transform:translateY(0)}
.delay-1{transition-delay:.06s}.delay-2{transition-delay:.12s}.delay-3{transition-delay:.18s}
/* Safety net: if JS hasn't run yet (slow network) content still readable, never fully invisible */
@media(prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}}

/* ── BEFORE / AFTER SLIDER (CSS-built, no flicker) ── */
.transform-section{background:var(--dark);padding:100px 0;position:relative;overflow:hidden}
.transform-section::before{content:'';position:absolute;width:700px;height:400px;background:radial-gradient(ellipse,rgba(192,57,43,.07) 0%,transparent 65%);left:50%;top:30%;transform:translateX(-50%);pointer-events:none}
.ba{position:relative;border-radius:22px;overflow:hidden;height:clamp(320px,52vw,560px);cursor:ew-resize;user-select:none;-webkit-user-select:none;touch-action:none;border:1px solid rgba(255,255,255,.1);box-shadow:0 40px 100px rgba(0,0,0,.5)}
.ba-before{position:absolute;inset:0;
  background:
    radial-gradient(ellipse 28% 18% at 22% 32%,rgba(0,0,0,.28) 0%,transparent 70%),
    radial-gradient(ellipse 22% 14% at 74% 62%,rgba(0,0,0,.24) 0%,transparent 70%),
    radial-gradient(ellipse 34% 24% at 50% 86%,rgba(0,0,0,.2) 0%,transparent 70%),
    repeating-linear-gradient(92deg,rgba(0,0,0,.06) 0 2px,transparent 2px 58px),
    linear-gradient(135deg,#928d86 0%,#6f6b65 38%,#7e7973 62%,#5e5a55 100%);
	
	background-image: url("images/before.png");
	    background-position: center;
    background-size: cover;
	}
.ba-before::after{content:'';position:absolute;inset:0;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.62' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.17'/%3E%3C/svg%3E")}
.crack{position:absolute;background:rgba(22,20,18,.55);transform-origin:left;z-index:1}
.ck1{width:33%;height:2px;top:37%;left:9%;transform:rotate(13deg)}
.ck2{width:21%;height:1.5px;top:45%;left:32%;transform:rotate(-8deg)}
.ck3{width:27%;height:2px;top:67%;left:53%;transform:rotate(7deg)}
.ck4{width:15%;height:1.5px;top:26%;left:61%;transform:rotate(-17deg)}
.ba-after{position:absolute;inset:0;clip-path:inset(0 0 0 50%);z-index:2;
  background:
    radial-gradient(ellipse 50% 36% at 66% 22%,rgba(255,255,255,.3) 0%,transparent 60%),
    radial-gradient(ellipse 70% 50% at 32% 80%,rgba(255,140,90,.36) 0%,transparent 65%),
    conic-gradient(from 230deg at 60% 50%,#3a0a02,#a82408,#ff6a3c,#7e1602,#2a0701,#c23410,#3a0a02);
	
	background-image: url("images/after.png");
	    background-position: center;
    background-size: cover;
	}
.ba-after::before{content:'';position:absolute;inset:0;mix-blend-mode:screen;
  background:radial-gradient(ellipse 26% 14% at 45% 35%,rgba(255,255,255,.32) 0%,transparent 70%),radial-gradient(ellipse 18% 10% at 80% 65%,rgba(255,220,180,.3) 0%,transparent 70%)}
.ba-after::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(255,255,255,.14) 0%,transparent 28%,transparent 72%,rgba(255,255,255,.07) 100%)}
.ba-handle{position:absolute;top:0;bottom:0;left:50%;width:3px;background:#fff;z-index:5;pointer-events:none;box-shadow:0 0 30px rgba(255,255,255,.6)}
.ba-knob{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:54px;height:54px;border-radius:50%;background:#fff;display:flex;align-items:center;justify-content:center;gap:2px;pointer-events:none;box-shadow:0 10px 36px rgba(0,0,0,.45);color:#101010;font-size:14px}
.ba-tag{position:absolute;top:18px;padding:9px 18px;border-radius:100px;font-size:10px;font-weight:800;letter-spacing:2.5px;text-transform:uppercase;z-index:4;backdrop-filter:blur(10px)}
.ba-tag.bt{left:18px;background:rgba(0,0,0,.55);color:rgba(255,255,255,.85)}
.ba-tag.at{right:18px;background:var(--red);color:#fff}
.ba-hint{text-align:center;margin-top:18px;font-size:12px;letter-spacing:2px;text-transform:uppercase;color:var(--muted2);font-weight:700}
.ba-hint i{color:var(--red2);font-style:normal}

/* ── PROCESS TIMELINE (vertical, with day badges) ── */
.timeline{position:relative;max-width:840px;margin:60px auto 0}
.timeline::before{content:'';position:absolute;left:27px;top:0;bottom:0;width:2px;background:linear-gradient(180deg,var(--red2),rgba(192,57,43,.08))}
.tl-item{position:relative;padding:0 0 42px 80px}
.tl-item:last-child{padding-bottom:0}
.tl-dot{position:absolute;left:0;top:0;width:56px;height:56px;border-radius:50%;background:rgba(255,255,255,.05);border:1.5px solid rgba(192,57,43,.4);backdrop-filter:blur(10px);display:flex;align-items:center;justify-content:center;font-family:'Bebas Neue',sans-serif;font-size:20px;color:var(--red2);transition:all .4s}
.tl-item:hover .tl-dot{background:var(--red);color:#fff;border-color:var(--red);box-shadow:0 0 40px rgba(192,57,43,.55);transform:scale(1.07)}
.tl-badge{display:inline-block;font-size:9.5px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--red3);margin-bottom:7px}
.tl-item h4{font-family:'Bebas Neue',sans-serif;font-size:21px;letter-spacing:.5px;margin-bottom:7px;color:var(--light)}
.tl-item p{font-size:13.5px;line-height:1.8;color:var(--muted);font-weight:300;max-width:560px;margin:0}
@media(max-width:600px){
  .timeline::before{left:21px}
  .tl-item{padding-left:66px;padding-bottom:36px}
  .tl-dot{width:44px;height:44px;font-size:16px}
  .ba-knob{width:46px;height:46px}
  .transform-section{padding:64px 0}
}