:root{
  --bg:#050505;
  --panel: rgba(255,255,255,0.03);
  --text:#fff;
  --gold:#D4AF37;
  --dark-green:#0B3D2E;
  --neon:#0036ac; 
  --glass-border: rgba(212,175,55,0.12);
}
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  background:var(--bg);
  color:var(--text);
  font-family:Inter,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  scroll-behavior:smooth;
}
.container{max-width:1100px;margin:0 auto;padding:2rem}

/* Default link colors (avoid browser blue) */
a{color:var(--text)}
a:visited{color:var(--text)}
a:hover{color:var(--neon)}

/* Header */
.site-header{position:sticky;top:0;z-index:60;background:linear-gradient(180deg,rgba(0,0,0,0.5),transparent);backdrop-filter: blur(6px);border-bottom:1px solid rgba(255,255,255,0.02)}
.header-inner{display:flex;align-items:center;gap:1rem;justify-content:space-between}
.logo{font-family:Orbitron,Inter, sans-serif;font-weight:600;color:var(--gold);letter-spacing:0.6px;text-decoration:none}
.site-header .logo,
.site-header .logo:visited,
.site-header .logo:hover,
.site-header .logo:focus,
.site-header .logo:active{color:var(--gold) !important;text-decoration:none !important}
.nav{display:flex;gap:1rem}
.nav a{color:var(--text);text-decoration:none;padding:0.6rem 0.4rem;border-radius:6px;font-weight:600;opacity:0.95}
.nav a:hover{color:var(--neon);text-shadow:0 0 10px rgba(57,255,20,0.08)}
.header-actions{display:flex;gap:0.5rem;align-items:center}
.call-desktop{display:inline-flex;align-items:center;gap:0.5rem;background:transparent;border:none;color:var(--gold);padding:0.45rem 0.8rem;border-radius:8px;text-decoration:none}
.site-header .call-desktop,
.site-header .call-desktop:visited,
.site-header .call-desktop:hover,
.site-header .call-desktop:focus,
.site-header .call-desktop:active{color:var(--gold) !important;text-decoration:none !important}
.mobile-menu{
  display:none;
  background:transparent;
  border:1px solid rgba(255,255,255,0.2);
  color:var(--text);
  font-size:1.1rem;
  min-width:2.2rem;
  min-height:2.2rem;
  border-radius:8px;
  align-items:center;
  justify-content:center;
  padding:0.15rem;
}
.mobile-menu-glyph{display:block;line-height:1;font-size:1.25rem}
.mobile-nav-overlay{
  display:none;
  position:fixed;
  inset:0;
  background:rgba(0,0,0,0.5);
  opacity:0;
  pointer-events:none;
  transition:opacity .2s ease;
  z-index:55;
}

/* Hero */
.hero{position:relative;padding:4rem 0 6rem;overflow:hidden}
.hero-bg{position:absolute;inset:0;background:radial-gradient(600px 400px at 10% 20%, rgba(57,255,20,0.04), transparent 10%), radial-gradient(500px 300px at 90% 80%, rgba(212,175,55,0.04), transparent 12%), linear-gradient(180deg,#000000 0%, #070707 100%);opacity:0.9;z-index:0;animation:moveBg 20s linear infinite}
@keyframes moveBg{0%{background-position:0% 0%,100% 100%}50%{background-position:10% 5%,90% 95%}100%{background-position:0% 0%,100% 100%}}
.hero-content{position:relative;display:grid;grid-template-columns:1fr 360px;gap:2rem;align-items:center;z-index:2}
.hero-text h1{font-family:Orbitron,Inter;font-size:clamp(1.6rem,3vw,2.4rem);margin:0 0 1rem}
.lead{color:rgba(255,255,255,0.85);margin-bottom:1rem}
.hero-cta{display:flex;gap:1rem;align-items:center}
.btn{display:inline-flex;align-items:center;gap:0.6rem;padding:0.7rem 1rem;border-radius:10px;text-decoration:none;font-weight:700}

/* Utility: center contents inside a button (icon + text) */
.btn-center{justify-content:center}

/* Right-flush the label inside a button while keeping the icon at the left */
.btn-label-right{justify-content:space-between;gap:0}
.btn-label-right .btn-label{display:inline-block}

/* Ensure hero CTA button label is flushed to the right edge while icon stays left */
.hero-cta .btn-label-right{justify-content:space-between;gap:0}
.hero-cta .btn-label-right .btn-label{margin-left:auto;padding-right:0.35rem}
.hero-cta .btn-label-right i{margin-right:0}

/* Make the hero CTA text slightly larger without changing the button padding */
.hero-call{font-size:1.08rem}
.hero-call i{margin-right:0.4rem}
.btn-gold{background:linear-gradient(180deg,var(--gold),#b88b2a);color:#050505;box-shadow:0 8px 30px rgba(212,175,55,0.08);border:1px solid rgba(255,255,255,0.03)}
.btn-outline{background:transparent;border:1px solid rgba(255,255,255,0.06);color:var(--text)}
.trust-bullets{display:flex;gap:1.4rem;list-style:none;padding:0;margin:1.2rem 0 0}
.trust-bullets li{display:flex;align-items:center;gap:0.6rem;color:rgba(255,255,255,0.9)}
.trust-bullets .neon{color:var(--neon);text-shadow:0 0 8px rgba(57,255,20,0.18)}
.hero-art .glass-card{background:var(--panel);padding:1.2rem;border-radius:14px;border:1px solid var(--glass-border);backdrop-filter:blur(8px);box-shadow:0 6px 40px rgba(0,0,0,0.6)}

/* Sections */
.section{padding:3.2rem 0}

/* Improve spacing between hero and services */
.services{padding-top:4.8rem}

/* Intro video section */
.intro-video{padding-top:0}
.video-wrap{position:relative;max-width:960px;margin:0 auto;border-radius:16px;overflow:hidden;border:1px solid rgba(255,255,255,0.08);box-shadow:0 12px 40px rgba(0,0,0,0.5);transition:transform .2s ease,box-shadow .2s ease,max-width .2s ease;cursor:pointer}
.video-wrap.is-expanded{max-width:1100px;transform:scale(1.02);box-shadow:0 20px 60px rgba(0,0,0,0.6)}
.brand-video{width:100%;height:auto;display:block;background:#000}
/* Preview toolbar styles */

.section-title{font-family:Orbitron,Inter;margin:0 0 0.3rem;color:var(--gold)}
.section-sub{color:rgba(255,255,255,0.8);margin-bottom:1rem}

.about-page{padding-top:2.4rem}
.about-card{background:var(--panel);padding:1.4rem;border-radius:14px;border:1px solid rgba(255,255,255,0.05);line-height:1.65}
.about-card p{margin:0 0 1rem;color:rgba(255,255,255,0.9)}
.about-card p:last-child{margin-bottom:0}

.blog-page{padding-top:2.4rem}
.blog-hero{margin-bottom:1.3rem}
.blog-section{margin-top:1.1rem}
.blog-heading{font-family:Orbitron,Inter;margin:0 0 0.8rem;color:var(--gold)}
.blog-grid,.video-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:1rem}
.blog-card,.video-card{background:var(--panel);padding:1rem;border-radius:12px;border:1px solid rgba(255,255,255,0.04);display:flex;flex-direction:column;gap:0.7rem}
.blog-card h3,.video-card h3{margin:0;font-size:1.05rem}
.blog-card p,.video-card p{margin:0;color:rgba(255,255,255,0.86);line-height:1.55}
.blog-tag{display:inline-block;width:fit-content;padding:0.2rem 0.55rem;border-radius:999px;background:rgba(212,175,55,0.18);border:1px solid rgba(212,175,55,0.36);color:var(--gold);font-size:0.78rem;font-weight:700}
.video-placeholder{min-height:160px;border-radius:10px;border:1px solid rgba(255,255,255,0.05);background:linear-gradient(180deg,rgba(255,255,255,0.05),rgba(255,255,255,0.02));display:flex;flex-direction:column;justify-content:center;align-items:center;gap:0.55rem;text-align:center;padding:1rem}
.video-placeholder i{font-size:2rem;color:var(--gold)}
.video-placeholder span{font-weight:700;max-width:280px}
.blog-card .btn,.video-card .btn{margin-top:auto;align-self:flex-start}

/* Services grid and cards */
.services-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1.2rem}
.service-card{background:var(--panel);padding:1.4rem;border-radius:12px;border:1px solid rgba(255,255,255,0.04);backdrop-filter:blur(6px);transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;display:flex;flex-direction:column;min-height:220px}
.service-card:hover{transform:translateY(-8px);box-shadow:0 14px 40px rgba(212,175,55,0.06);border-color:var(--gold)}
.service-card .card-icon{font-size:1.8rem;color:var(--neon);margin-bottom:0.6rem;text-shadow:0 0 12px rgba(57,255,20,0.08)}
.service-card h3{margin:0 0 0.35rem}
.service-card .muted{color:rgba(255,255,255,0.75);margin-bottom:0.9rem}
.service-card .btn{margin-top:auto;align-self:center}

/* Highlighted card */
.service-card.highlight{border:1px solid rgba(255,255,255,0.04);box-shadow:0 14px 50px rgba(212,175,55,0.09)}
.service-card.highlight:hover{border-color:var(--gold);box-shadow:0 14px 40px rgba(212,175,55,0.06)}
.service-card .badge{display:inline-block;background:var(--gold);color:#050505;padding:0.12rem 0.5rem;border-radius:999px;font-weight:800;font-size:0.78rem;margin-left:0.6rem}

/* Buttons inside cards */
.service-card .btn{width:auto}
.service-card .btn:focus{outline:3px solid rgba(212,175,55,0.14);outline-offset:3px}
.service-card .btn.btn-gold{background:linear-gradient(180deg,var(--gold),#b88b2a);color:#050505;border:1px solid rgba(255,255,255,0.03);box-shadow:0 6px 20px rgba(212,175,55,0.05)}
.service-card .btn.btn-outline{background:transparent;border:1px solid rgba(255,255,255,0.06);color:var(--text)}
.service-card .btn:hover{box-shadow:0 10px 30px rgba(212,175,55,0.08);transform:translateY(-6px)}

/* Accessibility: focus visible */
.service-card .btn:focus-visible{box-shadow:0 0 0 4px rgba(212,175,55,0.12)}

/* Responsive breakpoints for exact counts */
@media (max-width:1100px){
  .services-grid{grid-template-columns:repeat(3,1fr)}
}
@media (max-width:900px){
  .services-grid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:480px){
  .services-grid{grid-template-columns:1fr}
}

.plans-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1rem}
.plan-card{background:linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.01));padding:1.2rem;border-radius:12px;border:1px solid rgba(212,175,55,0.06);display:flex;flex-direction:column;min-height:260px}
.plan-head{display:flex;flex-direction:column;align-items:flex-start;gap:0.25rem}
.plan-head h3{margin:0}
.price{color:var(--gold);font-weight:800;font-size:0.95rem}
 /* Ensure plan CTA sits at the bottom so cards match height */
 .plan-card .btn{margin-top:auto;align-self:center}

.steps-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:1rem}
.step{background:var(--panel);padding:1rem;border-radius:12px;text-align:center}
.step-icon{font-size:1.6rem;color:var(--neon);margin-bottom:0.6rem}

.area-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.area-card,.hours-card{background:var(--panel);padding:1rem;border-radius:12px}

.faq .accordion{display:grid;gap:0.6rem}
.faq-q{width:100%;text-align:left;padding:0.9rem;border-radius:10px;background:transparent;border:1px solid rgba(255,255,255,0.03);color:var(--text);font-weight:700;display:flex;justify-content:space-between;align-items:center}
.faq-a{display:none;padding:0.9rem;background:rgba(255,255,255,0.02);border-radius:8px;margin-top:0.2rem}
.faq-item.open .faq-a{display:block}

.contact-grid{display:grid;grid-template-columns:1fr 320px;gap:1rem}
.contact-form{background:var(--panel);padding:1.2rem;border-radius:12px;border:1px solid rgba(255,255,255,0.03)}
.contact-form label{display:block;margin-bottom:0.6rem;font-size:0.94rem}
.contact-form input[type=text],.contact-form input[type=tel],.contact-form input[type=email],.contact-form textarea{width:100%;padding:0.6rem;border-radius:8px;border:1px solid rgba(255,255,255,0.04);background:transparent;color:var(--text)}
.field-hidden{display:none !important}
.field-help{display:block;margin-top:0.35rem;color:var(--muted);font-size:0.82rem}
/* Ensure the Service Type select is readable when the native dropdown is white */
.contact-form select{width:100%;padding:0.6rem;border-radius:8px;border:1px solid rgba(255,255,255,0.04);background:#fff;color:#000;appearance:auto}
.contact-form select option{background:#fff;color:#000}
.contact-form select option[value=""]{color:#666}
.selected-service-banner{margin:0 0 0.9rem;padding:0.6rem 0.8rem;border:1px solid rgba(212,175,55,0.2);border-radius:10px;background:rgba(212,175,55,0.08);color:var(--text)}
.selected-service-banner strong{color:var(--gold)}
.service-needs{display:grid;gap:0.8rem;margin:0.3rem 0 1rem}
.service-need{border:1px solid rgba(255,255,255,0.08);border-radius:10px;padding:0.85rem;background:rgba(255,255,255,0.01)}
.service-need-header{display:flex;justify-content:space-between;align-items:center;gap:0.8rem;margin-bottom:0.55rem}
.service-need-title{margin:0;font-size:1rem}
.remove-service-need{margin:0;padding:0.42rem 0.7rem;border-radius:8px;border:1px solid rgba(255,255,255,0.1);background:transparent;color:var(--text);cursor:pointer}
.remove-service-need:hover{border-color:var(--gold);color:var(--gold)}
.add-service-btn{margin:0 0 0.9rem}
.issue-types{border:1px solid rgba(255,255,255,0.08);border-radius:8px;padding:0.7rem;margin:0 0 0.7rem}
.issue-types legend{padding:0 0.35rem;color:var(--muted);font-size:0.9rem}
.issue-type-options{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:0.4rem 0.8rem}
.issue-type-options label{display:flex;align-items:center;gap:0.5rem;margin:0;font-size:0.9rem}
.issue-type-options input[type="checkbox"]{width:auto}
.request-summary-wrap{border:1px solid rgba(255,255,255,0.08);border-radius:10px;padding:0.75rem 0.85rem;background:rgba(255,255,255,0.01);margin-bottom:0.9rem}
.request-summary-wrap h4{margin:0 0 0.45rem;font-size:0.98rem;color:var(--gold)}
.request-summary-list{margin:0;padding-left:1.1rem;color:var(--muted)}
.request-summary-list li{margin-bottom:0.25rem}
.checkbox{display:flex;align-items:center;gap:0.6rem}
.after-hours-note{margin:-0.25rem 0 0.8rem 1.6rem}
.form-actions{display:flex;gap:1rem;align-items:center;margin-top:0.8rem}
.form-message{color:var(--neon);font-weight:700}

.contact-info .info-card{background:var(--panel);padding:1rem;border-radius:12px;border:1px solid rgba(255,255,255,0.03);margin-bottom:1rem}

/* Quick contact buttons above the form */
.contact-actions{display:flex;gap:0.8rem;margin:0.6rem 0 1.2rem}
.contact-actions .btn{padding:0.6rem 0.9rem}
.contact-actions .btn-outline{border-color:rgba(255,255,255,0.06)}

@media (max-width:900px){
  .contact-actions{flex-direction:column;gap:0.6rem}
}

/* Footer */
.site-footer{border-top:1px solid rgba(255,255,255,0.02);padding:1rem 0;margin-top:2rem}
.footer-inner{display:flex;gap:1rem;justify-content:space-between;align-items:center;flex-wrap:wrap}
.footer-inner a{white-space:nowrap}
.footer-brand,.footer-phone,.footer-hours{margin:0}
.footer-hours{line-height:1.4}
.footer-copy{width:100%;margin-top:0.3rem;padding-top:0.5rem;border-top:1px solid rgba(255,255,255,0.06);font-size:0.92rem;color:var(--muted);text-align:center}

/* Floating call button */
.floating-call{position:fixed;right:18px;bottom:18px;background:linear-gradient(180deg,var(--neon),#1fff66);color:#000;padding:0.9rem;border-radius:50%;box-shadow:0 10px 30px rgba(57,255,20,0.14);display:none;z-index:80}

/* Desktop call helper toast */
.call-toast{position:fixed;left:50%;bottom:90px;transform:translateX(-50%) translateY(12px);background:rgba(10,10,10,0.9);color:var(--text);border:1px solid rgba(255,255,255,0.08);padding:0.6rem 0.9rem;border-radius:10px;opacity:0;pointer-events:none;transition:opacity .2s ease,transform .2s ease;z-index:90}
.call-toast.visible{opacity:1;transform:translateX(-50%) translateY(0)}

/* Chatbot */
.chatbot-toggle{
  position:fixed;
  right:18px;
  bottom:84px;
  width:54px;
  height:54px;
  border-radius:50%;
  border:1px solid rgba(255,255,255,0.16);
  background:linear-gradient(180deg,var(--gold),#b88b2a);
  color:#050505;
  font-weight:800;
  font-size:1.15rem;
  box-shadow:0 12px 30px rgba(0,0,0,0.4);
  z-index:95;
  cursor:pointer;
}
.chatbot-panel{
  position:fixed;
  right:18px;
  bottom:148px;
  width:min(360px,calc(100vw - 24px));
  max-height:min(520px,calc(100vh - 120px));
  display:none;
  flex-direction:column;
  background:rgba(7,7,7,0.98);
  border:1px solid rgba(255,255,255,0.12);
  border-radius:14px;
  overflow:hidden;
  box-shadow:0 18px 50px rgba(0,0,0,0.55);
  z-index:95;
}
.chatbot-panel.open{display:flex}
.chatbot-header{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:0.75rem 0.9rem;
  border-bottom:1px solid rgba(255,255,255,0.08);
}
.chatbot-title{font-family:Orbitron,Inter,sans-serif;color:var(--gold);font-size:0.92rem}
.chatbot-close{
  border:0;
  background:transparent;
  color:var(--text);
  font-size:1rem;
  cursor:pointer;
}
.chatbot-messages{
  padding:0.75rem;
  display:flex;
  flex-direction:column;
  gap:0.55rem;
  overflow:auto;
}
.chatbot-options{
  display:none;
  flex-wrap:wrap;
  gap:0.4rem;
  padding:0 0.7rem 0.7rem;
}
.chatbot-option{
  border:1px solid rgba(255,255,255,0.14);
  background:rgba(255,255,255,0.06);
  color:var(--text);
  border-radius:999px;
  padding:0.38rem 0.65rem;
  font-size:0.82rem;
  cursor:pointer;
}
.chatbot-option:hover{
  border-color:rgba(212,175,55,0.6);
  color:var(--gold);
}
.chatbot-msg{
  max-width:90%;
  padding:0.55rem 0.65rem;
  border-radius:10px;
  line-height:1.45;
  font-size:0.92rem;
}
.chatbot-msg.bot{
  background:rgba(255,255,255,0.06);
  border:1px solid rgba(255,255,255,0.08);
  align-self:flex-start;
}
.chatbot-msg.user{
  background:rgba(212,175,55,0.2);
  border:1px solid rgba(212,175,55,0.34);
  align-self:flex-end;
}
.chatbot-form{
  display:flex;
  gap:0.5rem;
  padding:0.7rem;
  border-top:1px solid rgba(255,255,255,0.08);
}
.chatbot-input{
  flex:1;
  min-width:0;
  background:rgba(255,255,255,0.05);
  color:var(--text);
  border:1px solid rgba(255,255,255,0.1);
  border-radius:10px;
  padding:0.58rem 0.65rem;
}
.chatbot-send{
  border:1px solid rgba(255,255,255,0.12);
  background:var(--gold);
  color:#050505;
  border-radius:10px;
  padding:0.58rem 0.75rem;
  font-weight:700;
  cursor:pointer;
}

/* Reveal animations */
.reveal{opacity:0;transform:translateY(18px);transition:opacity .6s ease,transform .6s ease}
.reveal.visible{opacity:1;transform:none}

/* Responsive */
@media (max-width:900px){
  .mobile-nav-overlay{display:block}
  body.mobile-menu-open .mobile-nav-overlay{
    opacity:1;
    pointer-events:auto;
  }
  .header-inner{position:relative}
  .hero-content{grid-template-columns:1fr}
  .contact-grid{grid-template-columns:1fr}
  .container{padding:1.2rem}
  .nav{display:none}
  .nav.mobile-open{
    display:flex;
    flex-direction:column;
    gap:0.2rem;
    position:absolute;
    top:calc(100% + 0.35rem);
    right:1.2rem;
    left:1.2rem;
    padding:0.6rem;
    border-radius:10px;
    background:rgba(0,0,0,0.95);
    border:1px solid rgba(255,255,255,0.08);
    box-shadow:0 10px 30px rgba(0,0,0,0.45);
    z-index:85;
  }
  .nav.mobile-open a{padding:0.7rem 0.6rem}
  .mobile-menu{display:inline-block}
  .call-desktop{display:none}
  .floating-call{display:inline-block}
  .chatbot-toggle{bottom:84px}
  .chatbot-panel{
    right:12px;
    bottom:146px;
    width:calc(100vw - 24px);
  }
  .video-wrap,.video-wrap.is-expanded{max-width:100%;transform:none}
  .footer-inner{flex-direction:column;align-items:flex-start;gap:0.45rem}
  .footer-sep{display:none}
}

@media (max-width:480px){
  .hero{padding:2rem 0 3rem}
  .hero-text h1{font-size:1.4rem}
}

/* small tweaks for hover accents */
.card:hover h3,.plan-card:hover h3{color:var(--gold)}
.request-btn{border:1px solid rgba(255,255,255,0.04)}
.request-btn:hover{box-shadow:0 6px 30px rgba(57,255,20,0.06);border-color:var(--gold)}