:root{
  /*--ink:#ffffff;*/
  /*--text:#e5e7eb;*/
  --brand:#ff7a00;
  --accent:#ffb84d;
  --bg:#1a1d29;
  --shadow:0 6px 20px rgba(0,0,0,.6);
}
.hyperlinkz-navbar{
  background:rgba(26,29,41,.95);
  backdrop-filter:saturate(180%) blur(10px);
  box-shadow:var(--shadow);
}
.nav-links li a{
 /*color:var(--text); */
}
.nav-links li a:hover{ color:var(--brand); }
.menu-toggle span{ background:#fff; }

.hyperlinkz-navbar .nav-container{
  max-width:1200px;
  margin:0 auto;
  padding:.7rem 1rem;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
}

/* Logo */
.hyperlinkz-navbar .logo img{
  max-height:44px;
  width:auto;
  display:block;
}

/* Nav links (desktop) */
.nav-links{
  list-style:none;
  margin:0; padding:0;
  display:flex;
  align-items:center;
  gap:.4rem;
}
.nav-links li a{
  display:inline-block;
  padding:.55rem .95rem;
  color:var(--ink);
  text-decoration:none;
  font-weight:600;
  border-radius:999px;
  transition:background .2s ease, color .2s ease;
}
.nav-links li a:hover{
  background:rgba(255,122,0,.08);
  color:var(--brand);
}

/* Call button */
.call-btn{
  display:inline-flex;
  align-items:center; justify-content:center;
  padding:.55rem 1rem;
  border-radius:999px;
  background:linear-gradient(135deg, var(--brand), var(--accent));
  color:#fff !important;
  font-weight:700;
  letter-spacing:.2px;
  text-decoration:none;
  box-shadow:0 8px 24px rgba(255,122,0,.35);
  transition:transform .2s ease, box-shadow .2s ease, opacity .2s ease;
}
.call-btn:hover{
  transform:translateY(-1px);
  box-shadow:0 12px 30px rgba(255,122,0,.4);
  opacity:.95;
}

/* Hamburger icon */
.menu-toggle{
  width:42px; height:42px;
  display:none; place-items:center;
  border-radius:8px;
  background:rgba(255,122,0,.12);
  cursor:pointer;
}
.menu-toggle span{
  display:block;
  width:22px; height:2px;
  /*background:var(--ink);*/
  border-radius:2px;
  transition:transform .2s ease, opacity .2s ease;
}
.menu-toggle span + span{ margin-top:5px; }

/* Active (cross) */
.menu-toggle.active span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
.menu-toggle.active span:nth-child(2){ opacity:0; }
.menu-toggle.active span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

/* ========== Mobile / Tablet ========== */
@media (max-width: 991.98px){
  .menu-toggle{ display:grid; }
  .nav-call{ display:none; }

  .nav-links{
    position:absolute;
    top:100%; left:0; right:0;
    background:#333;
    box-shadow:0 18px 40px rgba(0,0,0,.08);
    border-top:2px solid rgba(255,122,0,.15);
    padding:.6rem .5rem;
    display:none;
    flex-direction:column;
    align-items:flex-start;
  }
  .nav-links.open{ display:flex; }

  .nav-links li a{
    display:block;
    width:100%;
    padding:.75rem .9rem;
    border-radius:10px;
  }
  .nav-links li a:hover{
    background:rgba(255,122,0,.08);
    color:var(--brand);
  }
}

/* Small screens */
@media (max-width: 575.98px){
  .hyperlinkz-navbar .logo img{ max-height:40px; }
}
/* ================= HyperLinkz – Banner ================= */
:root{
  --ink:#1a1d29;
  --text:#4b4f5f;
  --brand:#ff7a00;
  --accent:#ffb84d;
  --bg:#ffffff;
}

.hyperlinkz-banner{
  background:
    radial-gradient(900px 420px at 10% -10%, rgba(255,122,0,.10), transparent 60%),
    linear-gradient(180deg, #fff, #fff);
  padding:64px 16px;
}

.banner-container{
  max-width:1200px;
  margin:0 auto;
  display:grid;
  grid-template-columns: 1fr;
  gap:28px;
  align-items:center;
}

/* Image */
.banner-img{
  display:flex;
  justify-content:center;
}
.banner-img img{
  max-width:520px;
  width:100%;
  height:auto;
  display:block;
}

/* Text */
.banner-text h1{
  /*color:var(--ink);*/
  font-weight:800;
  line-height:1.12;
  font-size:clamp(1.8rem, 2.2vw + 1rem, 2.8rem);
  margin:0 0 .5rem;
}
.banner-text p{
  /*color:var(--text);*/
  font-size:clamp(1rem, .6vw + .9rem, 1.125rem);
  line-height:1.6;
  margin:0 0 1rem;
}

/* CTA button */
.banner-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.5rem;
  padding:.75rem 1.15rem;
  border-radius:999px;
  text-decoration:none;
  color:#fff;
  font-weight:700;
  letter-spacing:.2px;
  background:linear-gradient(135deg, var(--brand), var(--accent));
  box-shadow:0 12px 28px rgba(255,122,0,.28);
  transition:transform .2s ease, box-shadow .2s ease, opacity .2s ease;
}
.banner-btn:hover{
  transform:translateY(-2px);
  opacity:.96;
  box-shadow:0 16px 36px rgba(255,122,0,.34);
}

/* ====== Layout: 2 columns on md+ ====== */
@media (min-width: 992px){
  .banner-container{
    grid-template-columns: 1.05fr .95fr; /* image | text */
    gap:36px;
  }
  .banner-text{ padding-left:8px; }
}

/* Compact spacing on small screens */
@media (max-width: 575.98px){
  .hyperlinkz-banner{ padding:48px 16px; }
  .banner-btn{ width:100%; }
}
.who-we-are{
  position:relative;
  padding:64px 16px;
  background:
    radial-gradient(900px 420px at 8% -10%, rgba(255,122,0,.08), transparent 60%),
    radial-gradient(700px 360px at 95% 0%, rgba(255,184,77,.08), transparent 60%),
    #ffffff;
  overflow:hidden;
}

/* subtle dotted texture */
.who-we-are::before{
  content:"";
  position:absolute; inset:0;
  background-image:radial-gradient(rgba(26,29,41,.06) 1px, transparent 1px);
  background-size:18px 18px;
  opacity:.35;
  pointer-events:none;
}

/* container width parity with other sections */
.who-we-are .container{
  max-width:1100px;
  margin:0 auto;
}

/* Heading */
.who-we-are .section-title{
  text-align:center;
  margin-bottom:28px;
}
.who-we-are .section-title h2{
  /*color:var(--ink);*/
  font-weight:800;
  font-size:clamp(1.7rem, 2.2vw + 1rem, 2.4rem);
  letter-spacing:.2px;
  margin:0 0 .35rem;
}
.who-we-are .section-title p{
  /*color:var(--text);*/
  max-width:780px;
  margin:0 auto;
  font-size:clamp(1rem, .6vw + .9rem, 1.1rem);
}

/* Content grid */
.about-content{
  margin-top:26px;
  display:grid;
  grid-template-columns: 1fr;
  gap:18px;
}

/* Unique card style: gradient edge + soft glow on hover */
.about-box{
  position:relative;
  background:#fff;
  border:1px solid var(--border);
  border-radius:18px;
  padding:22px 20px;
  box-shadow:0 10px 24px rgba(0,0,0,.06);
  overflow:hidden;
  transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}

/* angled gradient stripe */
.about-box::before{
  content:"";
  position:absolute;
  inset:-2px auto -2px -2px;
  width:8px;
  background:linear-gradient(180deg, var(--brand), var(--accent));
  border-top-left-radius:18px;
  border-bottom-left-radius:18px;
}

/* soft corner glow */
.about-box::after{
  content:"";
  position:absolute;
  right:-50px; top:-50px;
  width:160px; height:160px; border-radius:50%;
  background:radial-gradient(closest-side, rgba(255,122,0,.12), transparent 70%);
  pointer-events:none;
}

.about-box:hover{
  transform:translateY(-4px);
  box-shadow:0 16px 40px rgba(0,0,0,.1);
  border-color:#e3e8f5;
}

.about-box h3{
  margin:0 0 .35rem;
  /*color:var(--ink);*/
  font-weight:800;
  letter-spacing:.2px;
  font-size:1.25rem;
}
.about-box p{
  margin:0;
  /*color:var(--text);*/
  line-height:1.65;
  font-size:1rem;
}

/* Call now CTA */
.call-now-box{
  margin-top:22px;
  display:flex;
  justify-content:center;
}
.call-now-btn{
  display:inline-flex; align-items:center; justify-content:center;
  padding:.75rem 1.2rem;
  border-radius:999px;
  text-decoration:none;
  color:#fff;
  font-weight:700;
  letter-spacing:.2px;
  background:linear-gradient(135deg, var(--brand), var(--accent));
  box-shadow:0 12px 28px rgba(255,122,0,.28);
  transition:transform .2s ease, box-shadow .2s ease, opacity .2s ease;
}
.call-now-btn:hover{
  transform:translateY(-2px);
  opacity:.96;
  box-shadow:0 16px 36px rgba(255,122,0,.34);
}

/* ====== Responsive ====== */
@media (min-width: 768px){
  .about-content{
    grid-template-columns: 1fr 1fr;
    gap:20px;
  }
  .about-box{ padding:24px; }
}
@media (min-width: 1200px){
  .who-we-are{ padding:72px 16px; }
}
@media (max-width: 575.98px){
  .call-now-btn{ width:100%; }
}
.our-services .container{ max-width:1100px; margin:0 auto; }

.our-services .section-title{
  text-align:center;
  margin-bottom:28px;
}
.our-services .section-title h2{
  /*color:var(--ink);*/
  font-weight:800;
  letter-spacing:.2px;
  font-size:clamp(1.7rem, 2.2vw + 1rem, 2.3rem);
  margin:0 0 .4rem;
}
.our-services .section-title p{
  /*color:var(--text);*/
  max-width:760px;
  margin:0 auto;
  font-size:clamp(1rem, .6vw + .9rem, 1.1rem);
}

/* Grid */
.services-flow{
  display:grid;
  grid-template-columns: 1fr;
  gap:16px;
  margin-top:20px;
}

/* Card style: pill with gradient top hairline + emoji badge */
.service-item{
  position:relative;
  background:var(--card);
  border:1px solid var(--border);
  border-radius:18px;
  padding:22px 18px 18px 18px;
  box-shadow:0 10px 24px rgba(0,0,0,.06);
  transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease;
  overflow:hidden;
}

/* top gradient hairline */
.service-item::before{
  content:"";
  position:absolute; left:0; right:0; top:0; height:4px;
  background:linear-gradient(90deg, var(--brand), var(--accent));
}

/* icon badge */
.service-item .icon{
  width:52px; height:52px;
  border-radius:14px;
  display:grid; place-items:center;
  font-size:1.35rem;
  background:linear-gradient(135deg, var(--brand), var(--accent));
  color:#fff;
  box-shadow:0 10px 24px rgba(255,122,0,.25);
  margin-bottom:.75rem;
}

/* text */
.service-item h4{
  margin:0 0 .25rem;
  /*color:var(--ink);*/
  font-weight:800;
  letter-spacing:.2px;
  font-size:1.1rem;
}
.service-item p{
  margin:0;
  /*color:var(--text);*/
  font-size:.98rem;
  line-height:1.6;
}

/* hover */
.service-item:hover{
  transform:translateY(-4px);
  box-shadow:0 16px 40px rgba(0,0,0,.1);
  border-color:#e3e8f5;
}

/* Masonry-like layout on wider screens */
@media (min-width: 768px){
  .services-flow{
    grid-template-columns: repeat(2, 1fr);
    gap:18px;
  }
}
@media (min-width: 992px){
  .services-flow{
    grid-template-columns: repeat(3, 1fr);
    gap:20px;
  }
}

/* Compact phones */
@media (max-width: 575.98px){
  .service-item{ padding:20px 16px; }
  .service-item .icon{ width:50px; height:50px; }
}
.hyperlinkz-cta{
  position:relative;
  padding:64px 16px;
  background:
    radial-gradient(900px 420px at 12% -10%, rgba(255,122,0,.12), transparent 60%),
    radial-gradient(700px 360px at 88% 0%, rgba(255,184,77,.12), transparent 60%),
    var(--bg);
  overflow:hidden;
}

/* subtle diagonal shine */
.hyperlinkz-cta::after{
  content:"";
  position:absolute; inset:-25% -10% auto -10%;
  height:58%;
  background:linear-gradient(to bottom, rgba(255,255,255,.22), transparent 60%);
  transform:skewY(-7deg);
  pointer-events:none;
}

.hyperlinkz-cta .container{
  max-width:1100px;
  margin:0 auto;
  text-align:center;
}

.hyperlinkz-cta h2{
  /*color:var(--ink);*/
  font-weight:800;
  letter-spacing:.2px;
  font-size:clamp(1.7rem, 2.2vw + 1rem, 2.4rem);
  margin:0 0 .5rem;
}

.hyperlinkz-cta p{
  /*color:var(--text);*/
  font-size:clamp(1rem, .6vw + .9rem, 1.15rem);
  margin:0 0 1.1rem;
}

/* CTA button */
.hyperlinkz-cta .cta-btn{
  display:inline-flex; align-items:center; justify-content:center;
  padding:.8rem 1.25rem;
  border-radius:999px;
  text-decoration:none;
  color:#fff;
  font-weight:700;
  letter-spacing:.2px;
  background:linear-gradient(135deg, var(--brand), var(--accent));
  box-shadow:0 14px 30px rgba(255,122,0,.28);
  transition:transform .2s ease, box-shadow .2s ease, opacity .2s ease;
}
.hyperlinkz-cta .cta-btn:hover{
  transform:translateY(-2px);
  opacity:.96;
  box-shadow:0 18px 38px rgba(255,122,0,.34);
}

/* Mobile spacing */
@media (max-width: 575.98px){
  .hyperlinkz-cta{ padding:52px 16px; }
  .hyperlinkz-cta .cta-btn{ width:100%; }
}
.hl-benefits-section{
  background:
    radial-gradient(900px 420px at 8% -10%, rgba(255,122,0,.08), transparent 60%),
    radial-gradient(700px 360px at 90% -10%, rgba(255,184,77,.08), transparent 60%),
    var(--bg);
  padding:64px 16px;
}

.hl-benefits-section .container{
  max-width:1100px;
  margin:0 auto;
}

.section-title{
  text-align:center;
  /*color:var(--ink);*/
  font-weight:800;
  font-size:clamp(1.7rem, 2.2vw + 1rem, 2.3rem);
  margin-bottom:36px;
  letter-spacing:.2px;
}

/* ====== List Layout ====== */
.benefits-list{
  display:grid;
  grid-template-columns:1fr;
  gap:18px;
  list-style:none;
  margin:0;
  padding:0;
}

.benefits-list li{
  display:flex;
  align-items:flex-start;
  gap:1rem;
  background:#fff;
  border:1px solid var(--border);
  border-radius:16px;
  padding:1.2rem 1.2rem;
  box-shadow:0 10px 24px rgba(0,0,0,.05);
  transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease;
  position:relative;
  overflow:hidden;
}

/* gradient accent stripe */
.benefits-list li::before{
  content:"";
  position:absolute;
  left:0; top:0; bottom:0;
  width:6px;
  background:linear-gradient(180deg, var(--brand), var(--accent));
  border-radius:16px 0 0 16px;
}

.benefits-list li:hover{
  transform:translateY(-3px);
  box-shadow:0 16px 40px rgba(0,0,0,.1);
  border-color:#e3e8f5;
}

/* ====== Icon styling ====== */
.benefits-list i{
  flex:0 0 auto;
  width:52px; height:52px;
  border-radius:12px;
  display:grid; place-items:center;
  font-size:1.3rem;
  color:#fff;
  background:linear-gradient(135deg, var(--brand), var(--accent));
  box-shadow:0 10px 24px rgba(255,122,0,.25);
  transition:transform .2s ease;
}
.benefits-list li:hover i{ transform:scale(1.05); }

/* ====== Text styling ====== */
.benefits-list h3{
  /*color:var(--ink);*/
  font-weight:800;
  letter-spacing:.2px;
  margin:0 0 .2rem;
  font-size:1.1rem;
}
.benefits-list p{
  margin:0;
  /*color:var(--text);*/
  font-size:.96rem;
  line-height:1.6;
}

/* ====== Responsive Grid ====== */
@media (min-width: 768px){
  .benefits-list{ grid-template-columns:1fr 1fr; gap:20px; }
}
@media (min-width: 992px){
  .benefits-list{ grid-template-columns:1fr 1fr 1fr; gap:22px; }
}
@media (max-width: 575.98px){
  .benefits-list li{ padding:1rem; }
  .benefits-list i{ width:48px; height:48px; }
}
.hl-plans-section{
  padding:64px 16px;
  background:
    radial-gradient(900px 420px at 10% -10%, rgba(255,122,0,.08), transparent 60%),
    radial-gradient(700px 360px at 90% 0%, rgba(255,184,77,.08), transparent 60%),
    var(--bg);
}
.hl-plans-section .container{ max-width:1100px; margin:0 auto; }

.section-title{
  text-align:center;
  /*color:var(--ink);*/
  font-weight:800;
  font-size:clamp(1.7rem, 2.2vw + 1rem, 2.3rem);
  margin-bottom:28px;
  letter-spacing:.2px;
}

/* Table shell */
.plan-table{
  display:grid;
  gap:12px;
}

/* Header row */
.plan-header{
  display:grid;
  grid-template-columns: 2fr 1fr 1fr 1fr 1.2fr;
  background:#131a2b;
  /*color:#fff;*/
  border-radius:14px;
  padding:14px 16px;
  font-weight:700;
  letter-spacing:.2px;
}

/* Data rows */
.plan-row{
  display:grid;
  grid-template-columns: 2fr 1fr 1fr 1fr 1.2fr;
  align-items:center;
  gap:0;
  background:var(--card);
  border:1px solid var(--border);
  border-radius:16px;
  padding:16px;
  box-shadow:0 10px 24px rgba(0,0,0,.05);
  transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
  position:relative;
  overflow:hidden;
}

/* top gradient hairline */
.plan-row::before{
  content:"";
  position:absolute; left:0; right:0; top:0; height:4px;
  background:linear-gradient(90deg, var(--brand), var(--accent));
}

/* Hover */
.plan-row:hover{
  transform:translateY(-3px);
  border-color:#e3e8f5;
  box-shadow:0 16px 40px rgba(0,0,0,.1);
}

/* Cells */
.plan-row > div{
  /*color:var(--text);*/
  font-size:1rem;
}
.plan-row > div:first-child{
  /*color:var(--ink);*/
  font-weight:800;
}

/* CTA button */
.plan-btn{
  display:inline-flex; align-items:center; justify-content:center;
  padding:.55rem .9rem;
  border-radius:999px;
  text-decoration:none;
  color:#fff;
  font-weight:700;
  letter-spacing:.2px;
  background:linear-gradient(135deg, var(--brand), var(--accent));
  box-shadow:0 10px 24px rgba(255,122,0,.25);
  transition:transform .2s ease, box-shadow .2s ease, opacity .2s ease;
  white-space:nowrap;
}
.plan-btn:hover{
  transform:translateY(-2px);
  opacity:.96;
  box-shadow:0 14px 30px rgba(255,122,0,.32);
}

/* Highlight the middle plan as “popular” (pure CSS) */
.plan-row:nth-of-type(3){
  outline:2px solid rgba(255,122,0,.18);
  box-shadow:0 20px 46px rgba(255,122,0,.12);
}
.plan-row:nth-of-type(3)::before{
  background:linear-gradient(90deg, var(--accent), var(--brand));
}

/* ========== Mobile: stack to cards ========== */
@media (max-width: 767.98px){
  .plan-header{
    display:none; /* hide table header on small screens */
  }
  .plan-row{
    grid-template-columns: 1fr;
    gap:10px;
    padding:16px 14px 14px;
  }
  .plan-row > div{
    display:flex; justify-content:space-between; align-items:center;
    padding:.15rem 0;
    font-size:.98rem;
  }
  .plan-row > div:first-child{
    justify-content:flex-start;
    font-size:1.05rem;
    margin-bottom:.25rem;
  }
  /* Add labels via data titles (pure CSS) */
  .plan-row > div:nth-child(2)::before{ content:"Speed"; color:#6b7280; margin-right:8px; }
  .plan-row > div:nth-child(3)::before{ content:"Data"; color:#6b7280; margin-right:8px; }
  .plan-row > div:nth-child(4)::before{ content:"Price"; color:#6b7280; margin-right:8px; }
  .plan-row > div:nth-child(5){
    justify-content:flex-start;
    margin-top:.25rem;
  }
  .plan-btn{ width:100%; }
}

/* ========== Tablet: tighter columns ========== */
@media (min-width: 768px) and (max-width: 991.98px){
  .plan-header,
  .plan-row{
    grid-template-columns: 1.7fr 1fr 1fr 1fr 1.2fr;
  }
}
/* ================= HyperLinkz – Disclaimer & Footer ================= */
:root {
  --brand:#ff7a00;
  --accent:#ffb84d;
  --ink:#ffffff;
  --text:#cbd5e1;
  --border:#2a2a2a;
  --dark-bg:#191919;
}

/* ---------- Disclaimer Section ---------- */
.disclaimer-section {
  background-color: var(--dark-bg);
  /*color: var(--ink);*/
  border-bottom: 1px solid rgba(255,255,255,.1);
  padding: 7rem 1rem 40px;
}

.disclaimer-section h2 {
  
  font-size: clamp(1.5rem, 2.2vw + 1rem, 2rem);
  margin-bottom: 0.75rem;
}

.disclaimer-section p {
  /*color: var(--text);*/
  font-size: 1rem;
  line-height: 1.7;
  /*max-width: 900px;*/
  margin: 0 auto;
}

/* ---------- Footer ---------- */
.hyperlinkz-footer {
  background: linear-gradient(180deg, #101010, #000);
  /*color: var(--text);*/
  padding-top: 3rem;
  position: relative;
  overflow: hidden;
}

.footer-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2rem;
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 1rem;
}

/* Brand area */
.footer-brand img {
  max-width: 150px;
  margin-bottom: 0.8rem;
  filter: brightness(0) invert(1);
}
.footer-brand p {
  color: #d1d5db;
  font-size: 0.98rem;
  margin: 0;
  line-height: 1.6;
}

/* Footer links */
.footer-links h4,
.footer-contact h4 {
  color: #fff;
  font-weight: 700;
  font-size: 1.05rem;
  margin-bottom: 0.6rem;
}
.footer-links ul {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: 0.4rem;
}
.footer-links a {
  color: var(--text);
  text-decoration: none;
  transition: color 0.2s ease, transform 0.2s ease;
}
.footer-links a:hover {
  color: var(--brand);
  transform: translateX(2px);
}

/* Contact */
.footer-contact p {
  margin: 0.2rem 0;
  color: #d1d5db;
  font-size: 0.96rem;
}

/* Footer bottom */
.footer-bottom {
  text-align: center;
  padding: 1.2rem 1rem;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  margin-top: 2rem;
  background: #0c0c0c;
}
.footer-bottom p {
  margin: 0;
  color: #9ca3af;
  font-size: 0.95rem;
}

/* ---------- Fixed Call Button ---------- */
.call-now-fixed {
  position: fixed;
  right: 18px;
  bottom: 24px;
  background: linear-gradient(135deg, var(--brand), var(--accent));
  color: #fff;
  font-weight: 700;
  padding: 0.75rem 1.1rem;
  border-radius: 999px;
  box-shadow: 0 12px 28px rgba(255, 122, 0, 0.35);
  text-decoration: none;
  transition: transform 0.2s ease, box-shadow 0.2s ease, opacity 0.2s ease;
  z-index: 1000;
}
.call-now-fixed:hover {
  transform: translateY(-2px);
  opacity: 0.96;
  box-shadow: 0 16px 40px rgba(255, 122, 0, 0.4);
}

/* ---------- Responsive ---------- */
@media (min-width: 768px) {
  .footer-grid {
    grid-template-columns: 2fr 1fr 1fr 1fr;
    gap: 1.5rem;
  }
}
@media (max-width: 767.98px) {
  .call-now-fixed {
    left: 16px;
    right: 16px;
    bottom: 18px;
    width: auto;
    text-align: center;
    justify-content: center;
  }
}
/* ================================
   BREADCRUMB SECTION STYLES
================================ */
.breadcrumb-section {
  background: #191919;
  color: #ffffff;
  padding: 60px 20px;
  text-align: center;
  position: relative;
  font-family: "Poppins", sans-serif;
}

.breadcrumb-section::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 50%;
  width: 80px;
  height: 4px;
  background: #00bcd4; /* aqua underline accent */
  transform: translateX(-50%);
  border-radius: 2px;
}

.breadcrumb-title {
  font-size: 2.4rem;
  font-weight: 700;
  margin-bottom: 12px;
  letter-spacing: 0.5px;
}

.breadcrumb-nav {
  font-size: 1rem;
  color: #e3f7f9;
}

.breadcrumb-nav a {
  color: #00e5ff;
  text-decoration: none;
  font-weight: 500;
  transition: all 0.3s ease;
}

.breadcrumb-nav a:hover {
  color: #80deea;
  text-decoration: underline;
}

.breadcrumb-nav span {
  margin: 0 8px;
  color: #aad7e0;
}

.current-page {
  color: #ffffff;
  font-weight: 600;
}

/* Container */
.breadcrumb-section .container {
  max-width: 1100px;
  margin: 0 auto;
}

/* ================================
   RESPONSIVE DESIGN
================================ */
@media (max-width: 768px) {
  .breadcrumb-title {
    font-size: 1.9rem;
  }
  .breadcrumb-section {
    padding: 45px 15px;
  }
}

@media (max-width: 480px) {
  .breadcrumb-title {
    font-size: 1.6rem;
  }
  .breadcrumb-nav {
    font-size: 0.9rem;
  }
}

/* ===============================
   CONTACT SECTION STYLES
=============================== */
.contact-section {
  color: #000;
  padding: 80px 20px;
  font-family: "Poppins", sans-serif;
}

.contact-section .container {
  max-width: 1100px;
  margin: 0 auto;
}

.contact-header {
  text-align: center;
  margin-bottom: 50px;
}

.contact-header h2 {
  font-size: 2.4rem;
  font-weight: 700;
  color: #000;
  margin-bottom: 10px;
}

.contact-header p {
  font-size: 1.1rem;
  color: #000;
}

/* Grid Layout */
.contact-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px;
  align-items: flex-start;
}

/* Contact Info */
.contact-info h3 {
  font-size: 1.6rem;
  color: #000;
  margin-bottom: 20px;
}

.contact-info ul {
  list-style: none;
  padding: 0;
}

.contact-info li {
  margin-bottom: 15px;
  font-size: 1rem;
  color: #000;
}

.contact-info strong {
  color: #000;
}

.contact-info a {
  color: #000;
  text-decoration: none;
  transition: all 0.3s ease;
}

.contact-info a:hover {
  text-decoration: underline;
}

/* Contact Form */
.contact-form {
  background: #ffffff;
  padding: 35px;
  border-radius: 10px;
  box-shadow: 0 8px 18px rgba(0, 0, 0, 0.1);
}

.contact-form form {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.contact-form input,
.contact-form textarea {
  width: 100%;
  padding: 12px 15px;
  border: 1px solid #c7dbe8;
  border-radius: 6px;
  font-size: 1rem;
  color: #333;
  font-family: "Poppins", sans-serif;
}

.contact-form input:focus,
.contact-form textarea:focus {
  
  outline: none;
  box-shadow: 0 0 5px rgba(0, 168, 213, 0.4);
}

.contact-form button {
     background: linear-gradient(135deg, var(--brand), var(--accent));
  color: #000;
  font-size: 1.1rem;
  font-weight: 600;
  border: none;
  border-radius: 6px;
  padding: 12px;
  cursor: pointer;
  transition: background 0.3s ease, transform 0.2s;
}

.contact-form button:hover {
  background: linear-gradient(135deg, #0072ff 0%, #00c6ff 100%);
  transform: translateY(-2px);
}

/* ===============================
   MAP SECTION
=============================== */
.contact-map {
  margin-top: 60px;
  border-top: 4px solid #00eaff;
}

.contact-map iframe {
  width: 100%;
  height: 450px;
  border: 0;
  display: block;
  filter: brightness(0.9) contrast(1.1);
  border-radius: 0 0 10px 10px;
}

/* ===============================
   RESPONSIVE DESIGN
=============================== */
@media (max-width: 900px) {
  .contact-grid {
    grid-template-columns: 1fr;
  }

  .contact-form {
    margin-top: 30px;
  }
}

@media (max-width: 600px) {
  .contact-header h2 {
    font-size: 2rem;
  }

  .contact-form {
    padding: 25px;
  }

  .contact-map iframe {
    height: 350px;
  }
}
