/* Start custom CSS for html, class: .elementor-element-b60b178 *//* =========================================================
   NEW VISION COMMERCIAL — CONTACT PAGE
   COMPLETE UPDATED CSS
   ========================================================= */

/* =========================
   ROOT VARIABLES
   ========================= */
:root{
  --ink:#0a0a0b;
  --charcoal:#151517;
  --panel:#1c1c1f;
  --panel-2:#232326;

  --line:#2a2a2e;
  --line-soft:#232327;

  --volt:#c6ff3d;
  --volt-dim:#9fd92e;
  --volt-soft:rgba(198,255,61,.1);

  --paper:#f5f5f2;
  --grey:#9a9a9f;
  --grey-dim:#6b6b70;

  --radius:2px;
  --ease:cubic-bezier(.2,.7,.2,1);
}


/* =========================
   GLOBAL RESET
   ========================= */
*,
*::before,
*::after{
  box-sizing:border-box;
}

html{
  margin:0 !important;
  padding:0 !important;
  width:100%;
  min-height:100%;
  scroll-behavior:smooth;
}

body{
  margin:0 !important;
  padding:0 !important;
  width:100%;
  min-height:100%;
  background:var(--ink);
  color:var(--paper);
  font-family:'Archivo',sans-serif;
  overflow-x:hidden;
}

/* WordPress theme wrappers */
#page,
.site,
.site-content,
.site-main,
main,
.wp-site-blocks,
.entry-content{
  margin-top:0 !important;
}

/*
  Avoid unwanted top spacing from common WordPress wrappers.
*/
#page,
.site,
.site-content,
.site-main,
.wp-site-blocks{
  padding-top:0 !important;
}

::selection{
  background:var(--volt);
  color:var(--ink);
}

a{
  color:inherit;
  text-decoration:none;
}

img{
  max-width:100%;
}

button,
input,
textarea,
select{
  font:inherit;
}


/* =========================
   TYPOGRAPHY
   ========================= */
.display{
  font-family:'Anton',sans-serif;
  font-weight:400;
  text-transform:uppercase;
  letter-spacing:.01em;
  line-height:.95;
}

.text-grey{
  color:var(--grey);
}

.text-grey-dim{
  color:var(--grey-dim);
}

.text-paper{
  color:var(--paper);
}

.mono{
  font-family:'JetBrains Mono',monospace;
}


/* =========================================================
   NAVBAR
   ========================================================= */

.nvc-nav{
  position:fixed !important;
  top:0 !important;
  left:0 !important;
  right:0 !important;

  width:100% !important;
  min-height:84px;

  margin:0 !important;
  padding:0 !important;

  z-index:10000;

  display:flex;
  align-items:center;

  background:#0a0a0b;
  border-bottom:1px solid var(--line);

  transition:
    min-height .35s ease,
    box-shadow .35s ease;
}


/* Scrolled navbar */
.nvc-nav.scrolled{
  min-height:68px;
  box-shadow:0 8px 24px rgba(0,0,0,.35);
}


/* Bootstrap / WordPress container inside navbar */
.nvc-nav .container-xl{
  width:100%;
  display:flex;
  align-items:center;
  min-height:inherit;

  padding-top:14px;
  padding-bottom:14px;

  margin-left:auto;
  margin-right:auto;
}


/* =========================
   LOGO
   ========================= */
.nvc-nav .brand-mark{
  display:flex;
  align-items:center;

  min-height:36px;

  flex-shrink:0;

  transition:
    transform .3s ease,
    filter .3s ease;
}

.nvc-nav .brand-mark img{
  height:clamp(26px,2.6vw,34px);
  width:auto;
  max-width:200px;

  display:block;
  object-fit:contain;

  transition:
    height .35s ease;
}

.nvc-nav .brand-mark:hover{
  transform:translateY(-1px);
}


/* =========================
   NAV LINKS
   ========================= */
.nvc-nav .navbar-nav{
  display:flex;
  align-items:center;
}

.nvc-nav .nav-link{
  font-family:'JetBrains Mono',monospace;

  font-size:.72rem;
  letter-spacing:.12em;

  text-transform:uppercase;

  color:var(--grey);

  margin:0 12px;

  position:relative;

  padding:8px 0 !important;

  line-height:1.2;

  white-space:nowrap;

  transition:color .2s ease;
}


/* Link underline */
.nvc-nav .nav-link::after{
  content:"";

  position:absolute;

  left:0;
  bottom:2px;

  height:1px;
  width:0;

  background:var(--volt);

  transition:width .25s ease;
}


/* Hover / active */
.nvc-nav .nav-link:hover,
.nvc-nav .nav-link.active{
  color:var(--paper);
}

.nvc-nav .nav-link:hover::after,
.nvc-nav .nav-link.active::after{
  width:100%;
}

.nvc-nav .nav-link.active{
  color:var(--volt);
}


/* =========================
   DROPDOWN
   ========================= */
.nvc-nav .nav-item.dropdown{
  position:relative;
}

.nvc-nav .dropdown-toggle::after{
  display:none;
}

.nvc-nav .dropdown-toggle .fa-chevron-down{
  font-size:.62rem;

  margin-left:6px;

  position:relative;
  top:-1px;

  transition:transform .25s ease;
}

.nvc-nav .dropdown-toggle[aria-expanded="true"]
.fa-chevron-down{
  transform:rotate(180deg);
  color:var(--volt);
}

.nvc-nav .dropdown-menu{
  background:var(--charcoal);

  border:1px solid var(--line);

  border-radius:var(--radius);

  padding:8px;

  margin-top:14px;

  min-width:220px;

  box-shadow:0 16px 40px rgba(0,0,0,.45);
}

.nvc-nav .dropdown-menu .dropdown-item{
  font-family:'JetBrains Mono',monospace;

  font-size:.72rem;
  letter-spacing:.08em;

  text-transform:uppercase;

  color:var(--grey);

  padding:11px 14px;

  border-radius:var(--radius);

  transition:
    background .2s ease,
    color .2s ease;
}

.nvc-nav .dropdown-menu .dropdown-item:hover,
.nvc-nav .dropdown-menu .dropdown-item:focus{
  background:var(--volt-soft);
  color:var(--volt);
}


/* =========================================================
   HAMBURGER BUTTON
   ========================================================= */

.nvc-nav .navbar-toggler{
  border:none !important;

  padding:4px 6px !important;

  margin-left:auto;

  flex-shrink:0;

  background:transparent !important;

  outline:none !important;

  box-shadow:none !important;
}

.nvc-nav .navbar-toggler:focus,
.nvc-nav .navbar-toggler:active{
  outline:none !important;
  box-shadow:none !important;
}


/* Hamburger bars */
.nvc-nav .navbar-toggler .bar{
  display:block;

  width:26px;
  height:2px;

  background:var(--paper);

  margin:5px 0;

  transition:
    transform .3s ease,
    opacity .3s ease,
    background .3s ease;
}


/* Hover */
.nvc-nav .navbar-toggler:hover .bar{
  background:var(--volt);
}


/* Hamburger → X */
.nvc-nav .navbar-toggler[aria-expanded="true"]
.bar:nth-child(1){
  transform:translateY(7px) rotate(45deg);
}

.nvc-nav .navbar-toggler[aria-expanded="true"]
.bar:nth-child(2){
  opacity:0;
}

.nvc-nav .navbar-toggler[aria-expanded="true"]
.bar:nth-child(3){
  transform:translateY(-7px) rotate(-45deg);
}


/* =========================================================
   MOBILE NAVIGATION
   ========================================================= */

@media (max-width:991.98px){

  .nvc-nav{
    min-height:72px;
  }

  .nvc-nav .container-xl{
    min-height:72px;

    padding-top:12px;
    padding-bottom:12px;

    flex-wrap:wrap;
  }

  /*
    Bootstrap collapse menu
  */
  .nvc-nav #navCollapse{
    width:100%;

    margin-top:12px;

    padding:14px 6px 20px;

    background:var(--ink);

    border-top:1px solid var(--line);
  }

  .nvc-nav #navCollapse .navbar-nav{
    width:100%;

    display:flex;
    flex-direction:column;
    align-items:stretch;
  }

  .nvc-nav .nav-item{
    width:100%;
  }

  .nvc-nav .nav-link{
    width:100%;

    margin:0;

    padding:13px 0 !important;

    border-bottom:1px solid var(--line);

    font-size:.72rem;
  }

  .nvc-nav .nav-link::after{
    bottom:0;
  }


  /* Mobile dropdown */
  .nvc-nav .dropdown-menu{
    position:static !important;

    width:100%;

    margin:0;

    padding:6px 0;

    border:none;

    border-bottom:1px solid var(--line);

    box-shadow:none;

    background:#111113;
  }

  .nvc-nav .dropdown-menu .dropdown-item{
    padding:12px 10px;

    font-size:.68rem;
  }
}


/* =========================================================
   BUTTON
   ========================================================= */

.btn-volt{
  background:var(--volt);

  color:var(--ink) !important;

  font-family:'JetBrains Mono',monospace;

  font-size:.74rem;

  letter-spacing:.12em;

  text-transform:uppercase;

  padding:13px 26px;

  border-radius:var(--radius);

  border:1px solid var(--volt);

  line-height:1;

  transition:
    background .2s ease,
    color .2s ease,
    transform .2s ease;

  display:inline-flex;
  align-items:center;

  gap:.5rem;

  white-space:nowrap;
}

.btn-volt:hover{
  background:transparent;

  color:var(--volt) !important;

  transform:translateY(-2px);
}


/* =========================================================
   CONTACT SECTION
   ========================================================= */

.contact-section{
  /*
    Extra top padding prevents fixed navbar
    from covering the heading.
  */
  padding:120px 0 100px;

  background-color:#0a0a0b;

  background-image:
    radial-gradient(
      rgba(255,255,255,0.06) 1.5px,
      transparent 1.5px
    );

  background-size:24px 24px;

  position:relative;

  min-height:90vh;

  border-bottom:1px solid var(--line);
}


/* =========================
   CONTACT HEADER
   ========================= */
.contact-header-wrap{
  position:relative;

  margin-bottom:38px;
}

.ghost-heading{
  position:absolute;

  top:-28px;
  left:-2px;

  font-size:clamp(2.8rem,6.5vw,5rem);

  color:rgba(255,255,255,0.04);

  pointer-events:none;

  z-index:1;

  white-space:nowrap;

  user-select:none;
}

.main-heading{
  position:relative;

  z-index:2;

  font-size:clamp(2.4rem,5vw,3.8rem);

  color:var(--volt);

  margin-bottom:14px;

  letter-spacing:.02em;
}

.volt-line{
  width:56px;

  height:3px;

  background:var(--volt);

  margin-bottom:20px;
}


/* =========================================================
   CONTACT FORM
   ========================================================= */

.contact-label{
  display:block;

  font-family:'Archivo',sans-serif;

  font-size:.95rem;

  font-weight:700;

  color:#ffffff;

  margin-bottom:6px;
}

.contact-input{
  width:100%;

  background:transparent;

  border:none;

  border-bottom:1px solid rgba(198,255,61,.5);

  color:#ffffff;

  font-family:'Archivo',sans-serif;

  font-size:1.02rem;

  padding:6px 0 10px;

  margin-bottom:28px;

  outline:none;

  border-radius:0;

  transition:
    border-color .25s ease,
    box-shadow .25s ease;
}

.contact-input:focus{
  border-bottom-color:var(--volt);

  box-shadow:0 1px 0 var(--volt);

  background:transparent;

  color:#ffffff;
}

.contact-input::placeholder{
  color:rgba(255,255,255,.25);
}


/* =========================
   SEND BUTTON
   ========================= */
.btn-send{
  background:#1a1a1c;

  color:#ffffff;

  font-family:'JetBrains Mono',monospace;

  font-size:.78rem;

  letter-spacing:.12em;

  text-transform:uppercase;

  padding:14px 34px;

  border:1px solid #333338;

  border-radius:var(--radius);

  cursor:pointer;

  transition:all .25s ease;

  display:inline-flex;

  align-items:center;

  gap:.6rem;

  line-height:1;
}

.btn-send:hover{
  background:var(--volt);

  color:#0a0a0b;

  border-color:var(--volt);

  transform:translateY(-2px);

  box-shadow:0 8px 24px rgba(198,255,61,.2);
}


/* =========================================================
   MAP
   ========================================================= */

.map-wrap{
  border-radius:4px;

  overflow:hidden;

  border:1px solid var(--line);

  box-shadow:0 20px 48px rgba(0,0,0,.55);

  height:100%;

  min-height:520px;

  position:relative;

  background:#151517;
}

.map-frame{
  width:100%;

  height:100%;

  min-height:520px;

  border:0;

  display:block;

  filter:
    invert(90%)
    hue-rotate(180deg)
    contrast(95%);
}


/* =========================================================
   OFFICE / ASSETS SHOWCASE
   ========================================================= */

.offices-showcase{
  padding:100px 0;

  background:var(--charcoal);

  border-bottom:1px solid var(--line);
}

.office-card{
  background:var(--panel);

  border:1px solid var(--line);

  border-radius:var(--radius);

  overflow:hidden;

  transition:
    transform .3s ease,
    border-color .3s ease;

  height:100%;
}

.office-card:hover{
  transform:translateY(-6px);

  border-color:var(--volt);
}

.office-card-img{
  width:100%;

  aspect-ratio:16/10;

  object-fit:cover;

  display:block;
}

.office-card-body{
  padding:26px;
}


/* =========================================================
   NEWSLETTER
   ========================================================= */

.newsletter-section-light{
  background:#ededef;

  color:#151517;

  padding:105px 0;

  text-align:center;

  border-bottom:1px solid #dcdce0;
}

.newsletter-section-light h2{
  font-size:clamp(2.2rem,4vw,3.2rem);

  color:#151517;
}

.newsletter-section-light p{
  color:#55555c;

  max-width:62ch;

  margin:0 auto;

  font-size:1.02rem;

  line-height:1.75;
}

.newsletter-input-light{
  background:#ffffff;

  border:1px solid #c5c5ca;

  color:#151517;

  font-family:'JetBrains Mono',monospace;

  font-size:.84rem;

  letter-spacing:.06em;

  padding:15px 22px;

  border-radius:var(--radius);

  width:100%;

  text-transform:uppercase;

  transition:border-color .2s ease;
}

.newsletter-input-light:focus{
  outline:none;

  border-color:#151517;
}


/* =========================================================
   ACCESSIBILITY BUTTON
   ========================================================= */

.a11y-btn{
  position:fixed;

  right:22px;
  bottom:22px;

  z-index:12000;

  width:52px;
  height:52px;

  border-radius:50%;

  background:var(--volt);

  border:none;

  display:flex;

  align-items:center;
  justify-content:center;

  box-shadow:0 8px 24px rgba(0,0,0,.4);

  cursor:pointer;

  transition:transform .25s ease;
}

.a11y-btn:hover{
  transform:scale(1.08);
}

.a11y-btn img{
  width:24px;
  height:24px;
}

.a11y-btn img.spin{
  animation:spin 6s linear infinite;
}

@keyframes spin{
  to{
    transform:rotate(360deg);
  }
}


/* =========================================================
   ACCESSIBILITY PANEL
   ========================================================= */

.a11y-panel{
  position:fixed;

  right:22px;
  bottom:86px;

  z-index:12000;

  width:240px;

  background:var(--charcoal);

  border:1px solid var(--line);

  padding:18px;

  transform:
    translateY(12px)
    scale(.96);

  opacity:0;

  visibility:hidden;

  pointer-events:none;

  transition:.25s ease;
}

.a11y-panel.open{
  transform:
    translateY(0)
    scale(1);

  opacity:1;

  visibility:visible;

  pointer-events:auto;
}

.a11y-panel h5{
  font-family:'JetBrains Mono',monospace;

  font-size:.7rem;

  letter-spacing:.1em;

  text-transform:uppercase;

  color:var(--volt);

  margin-bottom:14px;
}

.a11y-row{
  display:flex;

  align-items:center;

  justify-content:space-between;

  padding:8px 0;

  border-bottom:1px solid var(--line);

  font-size:.84rem;

  color:var(--grey);
}

.a11y-row:last-child{
  border-bottom:none;
}


/* Accessibility toggle */
.a11y-toggle{
  width:36px;
  height:20px;

  background:var(--line);

  border-radius:20px;

  position:relative;

  cursor:pointer;

  border:none;

  flex-shrink:0;
}

.a11y-toggle::after{
  content:"";

  position:absolute;

  top:2px;
  left:2px;

  width:16px;
  height:16px;

  border-radius:50%;

  background:var(--paper);

  transition:.2s ease;
}

.a11y-toggle.on{
  background:var(--volt);
}

.a11y-toggle.on::after{
  transform:translateX(16px);

  background:var(--ink);
}


/* =========================================================
   HIGH CONTRAST MODE
   ========================================================= */

body.high-contrast{
  background:#000;
}

body.high-contrast .display,
body.high-contrast p,
body.high-contrast span,
body.high-contrast a{
  color:#fff !important;
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width:1200px){

  .nvc-nav .nav-link{
    margin:0 9px;

    font-size:.68rem;
  }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width:991.98px){

  .nvc-nav{
    min-height:72px;
  }

  .nvc-nav .container-xl{
    min-height:72px;

    padding-top:12px;
    padding-bottom:12px;
  }

  .contact-section{
    padding:105px 0 70px;
  }

  .map-wrap{
    min-height:380px;

    margin-top:20px;
  }

  .map-frame{
    min-height:380px;
  }

  .a11y-btn{
    right:16px;
    bottom:16px;

    width:48px;
    height:48px;
  }

  .a11y-panel{
    right:16px;
    bottom:76px;

    width:230px;
  }

}


/* =========================================================
   SMALL MOBILE
   ========================================================= */

@media (max-width:575.98px){

  .nvc-nav .brand-mark img{
    height:27px;

    max-width:165px;
  }

  .nvc-nav .navbar-toggler .bar{
    width:24px;
  }

  .contact-section{
    padding:100px 0 60px;
  }

  .ghost-heading{
    font-size:2.4rem;

    top:-20px;
  }

  .main-heading{
    font-size:2.35rem;
  }

  .map-wrap{
    min-height:320px;
  }

  .map-frame{
    min-height:320px;
  }

  .newsletter-section-light{
    padding:75px 20px;
  }

  .office-card-body{
    padding:20px;
  }

  .btn-send{
    width:100%;

    justify-content:center;
  }

}


/* =========================================================
   EXTRA SAFETY FOR BOOTSTRAP
   ========================================================= */

/*
  Bootstrap's default navbar styles can sometimes override
  custom navbar spacing. These rules keep your navbar clean.
*/

.nvc-nav.navbar{
  padding-top:0 !important;
  padding-bottom:0 !important;
}

.nvc-nav .navbar-toggler-icon{
  display:none !important;
}


/*
  Prevent Bootstrap from adding unwanted button borders.
*/
.nvc-nav button{
  outline:none;
}


/*
  Make collapsed mobile menu visible correctly.
*/
@media (max-width:991.98px){

  .nvc-nav .navbar-collapse{
    width:100%;
    flex-basis:100%;
  }

}


/* =========================================================
   END
   ========================================================= *//* End custom CSS */