
/* Example: Changing font for the whole page */
body {
    font-family: "Helvetica", "Arial", sans-serif;
    font-size: 16px;
    font-weight: normal;
}

footer {
      background: #111827;
      color: #d1d5db;
      padding: 32px 24px;
      margin-top: 48px;
      font-size: 14px;
    }

    footer a {
      color: #9ca3af;
      text-decoration: none;
      display: block;
      margin-top: 6px;
    }
   
     * {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  font-family: Arial, sans-serif;
}

.header {
  background: #052b4f;
    position: fixed;
  top: 0;
  width: 100%;
  z-index: 1000; 
  }

  .nav {
  max-width: 1400px;
  margin: auto;
}

.menu {
  list-style: none;
  display: flex;
}

.menu > li {
  position: relative;
}

.menu > li > a {
  display: block;
  padding: 18px 20px;
  color: #fff;
  text-decoration: none;
  font-size: 14px;
}

.menu > li:hover > a {
  background: #0b86e5;
}

/* MEGA MENU */
.mega-menu {
  position: absolute;
  left: 0;
  top: 100%;
  width: fit-content;
  background: #052b4f;
  padding: 30px 50px;
  display: none;
  gap: 5px;
  z-index: 9999;
}
.menu-item {
  display: inline-block;
  text-align: center;
  font-size: 16px;
  position: relative;
}
.menu-item::after {
  content: "▼"; /* down arrow */
  display: block;
  font-size: 12px;
  margin-top: 2px;
}

.has-mega:hover > .mega-menu {
  display: flex;
}

/* COLUMNS */
.mega-column {
  min-width: 260px;
}

.mega-column h4 {
  color: #ffffff;
  font-size: 14px;
  margin-bottom: 10px;
  padding-bottom: 6px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.3);
}

.mega-column a {
  display: block;
  color: #ffffff;
  text-decoration: none;
  font-size: 13.5px;
  padding: 6px 0;
}

.mega-column a:hover {
  color: #1ea7ff;
}
  
body {
	padding: 2rem;
	font-family: -apple-system, BlinkMacSystemFont, "Arial", sans-serif;
  
}


h1 {
	font-size: 16px;
	margin-top: 0;
}

p {
	color: rgb(107, 114, 128);
	font-size: 15px;
	margin-bottom: 10px;
	margin-top: 5px;
}

.card {
	max-width: 620px;
	margin: 0 auto;
	padding: 16px;
	border: 1px solid lightgray;
	border-radius: 16px;
}

.card p:last-child {
	margin-bottom: 0;
}

.card nav {
	max-width: 620px;
	margin: 0 auto;
	padding: 16px;
	border: 1px solid lightgray;
	border-radius: 16px;
}
.header {
  background: linear-gradient(90deg, #061E29 100%, #061E29 100%);
  color: rgb(255, 255, 255);
  padding: 10px 20px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  box-shadow: 0 20px 15px rgba(0,0,0,5.5);
  
}
.logo {
  height: 50px;
  width: auto;
}
.nav {
  display: flex;
  align-items: center;
  gap: 20px;
}
.nav a {
  color: #a0d0f5;
  text-decoration: none;
  padding: 8px 16px;
  border-radius: 4px;
  font-weight: 800;
  transition: 0.3s;
        }

.nav b {
  color: #f9fafa;
  text-decoration: none;
  padding: 8px 16px;
  border-radius: 4px;
  font-weight: 600;
  transition: 0.3s;
        }

  .nav a:hover { background: rgba(255,255,255,0.2); }
  .nav a.active { background: rgba(255,255,255,0.3); }
.search-box {
  padding: 8px 16px;
  border: none;
  border-radius: 20px;
  width: 200px;
  background: rgba(255,255,255,0.9);
}

@media (max-width: 768px) {
  .header { flex-direction: column; gap: 10px; }
  .nav { flex-wrap: wrap; justify-content: center; }
  .search-box { width: 100%; }
}

    :root{
      --blueTop: #1c8bd5;
      --navBg: #042f4f;
      --dropBg: #042b47;
      --dropLine: rgba(255,255,255,.10);
      --hoverBg: #0a3a5f;
      --activeBg: #1486d1;
      --text: #ffffff;
    }

    *{box-sizing:border-box}
    body{margin:0;font-family: Arial, Helvetica, sans-serif}

    /* ===== TOP BAR ===== */
    .top-bar{
      position: relative;
      background: var(--blueTop);
      color: #fff;
      height: 44px;
      display:flex;
      align-items:center;
      justify-content:space-between;
      padding: 0 48px;
      font-size: 14px;
    }

    .top-bar::before,
    .top-bar::after{
      content:"";
      position:absolute;
      top:0; bottom:0;
      width: 106px;
      background: #2b2b2b;
      clip-path: polygon(0 0, 100% 0, 70% 100%, 0 100%);
      opacity:.9;
    }
    .top-bar::before{left:0}
    .top-bar::after{
      right:0;
      clip-path: polygon(30% 0, 100% 0, 100% 100%, 0 100%);
    }

    .top-left, .top-right{
      display:flex;
      align-items:center;
      gap:16px;
      z-index: 1;
    }

    .sep{
      width:1px;height:18px;background:rgba(255,255,255,.35);
    }

    .top-item{
      display:flex;align-items:center;gap:8px;
      white-space:nowrap;
    }

    .ico{
      width:14px;height:14px;display:inline-block;position:relative;
    }
    .ico.phone{
      border:2px solid #fff;border-radius:50%;
    }
    .ico.phone::after{
      content:"";
      position:absolute;left:3px;top:3px;
      width:6px;height:6px;border:2px solid #fff;border-top:none;border-left:none;
      transform:rotate(45deg);
      opacity:.9;
    }
    .ico.mail{
      border:2px solid #ffffff;border-radius:2px;
    }
    .ico.mail::after{
      content:"";
      position:absolute;left:1px;top:2px;
      width:8px;height:8px;border-left:2px solid transparent;border-right:2px solid transparent;
      border-top:2px solid #fff;
    }

    .social{
      display:flex;align-items:center;gap:8px;
    }
    .social a{
      color:#fff;text-decoration:none;
      width:18px;height:18px;display:flex;align-items:center;justify-content:center;
      font-size:13px;font-weight:700;
    }
    .social a:hover{opacity:.85}

    /* ===== HEADER MAIN ===== */
    .header-main{
      display:flex;
      justify-content:space-between;
      align-items:center;
      padding: 14px 48px;
      background:#fff;
    }
    .logo{
      display:flex;align-items:center;gap:12px;
    }
    .logo-badge{
      width:66px;height:52px;border:1px solid #cfd8e3;border-radius:8px;
      display:flex;align-items:center;justify-content:center;
      font-weight:700;color:#0f5c8b;background:#f7fbff;
    }
    .logo-text h1{margin:0;font-size:30px;letter-spacing:.5px}
    .logo-text h1 .and{color:#41a948}
    .logo-text p{margin:2px 0 0;font-size:13px;letter-spacing:2px;color:#41a948;font-weight:700}

    .header-contacts{
      display:flex;gap:40px;align-items:center;
      color:#222;font-size:14px;
    }
    .hblock{display:flex;align-items:center;gap:10px}
    .hicon{
      width:42px;height:42px;border:2px solid #1c8bd5;border-radius:8px;
      display:flex;align-items:center;justify-content:center;
      color:#1c8bd5;font-weight:800;
    }
    .hlabel{color:#444}
    .hvalue{font-weight:700;color:#111}

    /* ===== NAV ===== */
    .main-nav{background: var(--navBg);}
    .main-nav ul{
      list-style:none;
      margin:0;
      padding:0 48px;
      display:flex;
      align-items:stretch;
      gap:0;
    }
    .main-nav li{position:relative}
    .main-nav > ul > li > a{
      color:var(--text);
      text-decoration:none;
      display:flex;
      align-items:center;
      gap:10px;
      padding: 16px 18px;
      font-size:16px;
      line-height:1;
      position:relative;
    }

    .caret{
      width:6px;
      height:6px;
      border-right:2px solid rgba(255,255,255,.85);
      border-bottom:2px solid rgba(255,255,255,.85);
      transform: rotate(45deg);
      margin-top:-2px;
    }

    .main-nav > ul > li.active > a{
      background: var(--activeBg);
    }
    .main-nav > ul > li.active > a::after{
      content:"";
      position:absolute;
      left:50%;
      bottom:-8px;
      transform: translateX(-50%);
      width:0;height:0;
      border-left:10px solid transparent;
      border-right:10px solid transparent;
      border-top:10px solid var(--activeBg);
    }

    .main-nav > ul > li:hover > a{background:#063a60}

    .main-nav ul li.active a {
      color: #ffffff;   /* Orange text for active page */
      font-weight: bold;
    }

    .main-nav ul li.active a i {
      color: #ffffff;   /* Icon color also changes */
    }



    @media (max-width: 768px) {
  .main-nav ul {
    flex-direction: column;
    padding: 0;
  }

  .main-nav > ul > li > a {
    padding: 14px 16px;
    border-bottom: 1px solid rgba(255,255,255,0.15);
  }
    .main-nav {
        display: none !important;
  }
    }

/* FORCE MOBILE HEADER FIX */
    @media screen and (max-width: 768px) {

      body {
        overflow-x: hidden;
      }

      .top-bar {
        display: block !important;
        text-align: center !important;
      }

      .top-left,
      .top-right {
        justify-content: center !important;
        flex-wrap: wrap !important;
      }

      .header-main {
        display: block !important;
        text-align: center !important;
        padding: 60px 0px !important;
      }

      .logo {
        display: block !important;
      }

      .logo img {
        display: block;
        margin: 0 auto 1px;
        max-width: 100px;
        height: auto;
      }

      .site-title {
        font-size: 50px !important;
        line-height: 1.3 !important;
      }

      .logo-text p {
        font-size: 12px !important;
        letter-spacing: 10px;
      }

      .header-contacts {
        display: none !important;
      }
      .main-nav{
        display: none !important;
      }
      .main-nav ul {
        display: flex !important;
        flex-direction: column !important;
      }

      .main-nav li a {
        justify-content: center !important;
        padding: 12px !important;
      }
    }
    @media (max-width: 768px) {


    /* Screen Reader Only - Hidden checkbox */
    .sr-only {
      position: absolute;
      width: 10px;
      height: 10px;
      padding: 0;
      margin: 5px;
      overflow: auto;
      clip: rect(5, 0, 0, 0);
      white-space: nowrap;
      border: 2;
    }
    


    /* ===== .social-icons (auto-hide on blur/scroll) ===== */

      @media (max-width: 1100px){
        .mega-inner{grid-template-columns: repeat(2, minmax(180px, 1fr));}
        .top-bar,.header-main,.main-nav ul{padding-left:16px;padding-right:16px}
      }


      .social-icons {
      background-color: #000;
      padding: 12px 20px;
      display: flex;
      gap: 18px;
      }

      .social-icons a {
          color: #fff;
          font-size: 20px;
          transition: 0.3s;
      }

      .social-icons a:hover {
          color: #1abc5c;
      }

    }      
  .page-banner {
  background-size: cover;
  background-position: center;
  height: 200px;
  position: relative;
  color: #040404;
}

.page-banner::before {
  content: "";
  position: absolute;
  inset: 0;
}

.banner-content {
  position: relative;
  z-index: 1;
  height: 100%;
  padding: 10px 60px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start; /* change to flex-end if you want text on right */
}

.banner-content h1 {
  font-size: 42px;
  font-weight: 600;
  margin: 0 0 10px;
}

.banner-content p {
  font-size: 18px;
  margin-bottom: 20px;
}

.cta-btn {
  display: inline-block;
  padding: 12px 24px;
  background: #ff9800;
  color: #fff;
  font-weight: bold;
  text-decoration: none;
  border-radius: 20px;
  transition: 0.3s ease;
}

.cta-btn:hover {
  background: #e68900;
}


    body {
      margin: 0;
      font-family: "Segoe UI", Arial, sans-serif;
      background: #f6f7fb;
      color: #333;
    }

    .container {
      max-width: 1200px;
      margin: auto;
      padding: 50px 20px;
    }

    h2.section-title {
      text-align: center;
      font-size: 34px;
      margin-bottom: 40px;
      font-weight: 600;
    }

    h2.section-title span {
      color: #12adfa;
    }

    /* Services Section */
    .services-grid {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
      gap: 30px;
    }

    .service-card {
      background: #fff;
      border-radius: 14px;
      padding: 30px;
      box-shadow: 0 10px 25px rgba(0,0,0,0.06);
    }

    .icon-box {
      width: 55px;
      height: 55px;
      border-radius: 12px;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 24px;
      margin-bottom: 20px;
      color: #fff;
    }

    .blue { background: #e8f4ff; color: #2196f3; }
    .purple { background: #f1edff; color: #4caeff; }
    .sky { background: #e6f7fb; color: #00acc1; }

    .service-card h3 {
      font-size: 22px;
      margin-bottom: 15px;
    }

    .service-card p {
      line-height: 1.7;
      color: #555;
    }

    /* Tax Solutions */
    .tax-grid {
      margin-top: 60px;
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
      gap: 25px;
    }

    .tax-card {
      background: #ededed;
      border-radius: 14px;
      padding: 25px 28px;
    }

    .tax-card h4 {
      font-size: 20px;
      margin-bottom: 15px;
    }

    .tax-card ul {
      padding-left: 0;
      list-style: none;
      margin: 0;
    }

    .tax-card ul li {
      margin-bottom: 10px;
      color: #292929;
      line-height: 1.6;
    }

    .tax-card ul li i {
      color: #24ade4;
      margin-right: 10px;
    }

    @media (max-width: 768px) {
      h2.section-title {
        font-size: 28px;
      }
    }
    .site-footer {
  background: #000;
  color: #fff;
  font-family: Arial, sans-serif;
}

.footer-container {
  max-width: 1200px;
  margin: auto;
  padding: 10px 10px;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 40px;
}

.footer-col h3,
.footer-col h4 {
  color: #f4b400;
  margin-bottom: 15px;
}

.footer-col p {
  font-size: 14px;
  line-height: 1.7;
  opacity: 0.9;
}

.footer-col ul {
  list-style: none;
  padding: 0;
}

.footer-col ul li {
  margin-bottom: 10px;
}

.footer-col ul li a {
  color: #fff;
  text-decoration: none;
  font-size: 14px;
}

.footer-col ul li a:hover {
  color: #f4b400;
}

.social-icons a {
  display: inline-block;
  margin-right: 10px;
  font-size: 18px;
  color: #f4b400;
  text-decoration: none;
}

.footer-bottom {
  border-top: 1px solid #e9d712;
  text-align: center;
  padding: 5px;
  font-size: 13px;
  opacity: 0.8;
}

@media (max-width: 900px) {
  .footer-container {
    grid-template-columns: 1fr;
  }
}
  table {
            width: 100%;
            border-collapse: collapse;
            margin-top: 10px;
        }
        table, th, td {
            border: 1px solid #ccc;
        }
        th, td {
            padding: 5px;
            text-align: left;
          
        }
        .inline-image {
            float: right;
            width: 500px;
            margin-left: 20px;
            margin-bottom: 20px;
            border-radius: 5px;
        }
        .gst-highlight {
          background-color: none;
          color: #3564e8 !important;  /* Changed to navy blue text */
          font-weight: bold;
          padding: 2px 4px;
          border-radius: 3px;
          text-decoration: none;
        }
        .faq-item { margin-bottom: 15px; border: 1px solid #ddd; border-radius: 8px; overflow: hidden; }
        .faq-question { background: #f8f9fa; padding: 15px; cursor: pointer; font-weight: bold; display: flex; justify-content: space-between; align-items: center; }
        .faq-question:hover { background: #e9ecef; }
        .faq-answer { padding: 0 15px; max-height: 0; overflow: hidden; transition: max-height 0.3s ease; background: white; }
        .faq-answer.open { max-height: 500px; padding: 15px; }
        .hyperlink { color: #007bff; text-decoration: none; }
        .hyperlink:hover { text-decoration: underline; }

        
    /* banner for cantact */
        body {
      font-family: 'Roboto', sans-serif; /* changed font-family */
      margin: 0;
      padding: 0;
      background: #f9f9f9;
    }

    .banner {
      display: flex;
      justify-content: space-between;
      align-items: center;
      background: #ffffff;
      border: 1px solid #e0efe1;
      border-radius: 20px;
      padding: 30px;
      margin: 40px auto;
      max-width: 1000px;
      box-shadow: 0 4px 16px rgba(0,0,0,0.1);
    }

    .banner-text {
      flex: 4;
    }

    .banner-text h1 {
      color: #84c487;
      margin-bottom: 0px;
      font-size: 1.5rem;
      font-weight: 800; /* bold Roboto */
    }

    .banner-button {
      flex: 1;
      text-align: right;
    }

    .banner-button a {
      display: inline-block;
      background: #1a6cab;
      color: #fff;
      padding: 12px 25px;
      border-radius: 10px;
      text-decoration: none;
      font-weight: 1000;
      font-size: 1rem;
      transition: background 0.3s ease;
    }

    .banner-button a:hover {
      background: #060000;
    }
        /* banner for cantact */

        /* our services banner */


    .services-section {
      max-width: auto;
      margin: 50px auto;
      padding: 50px;
      border-radius: 0px;
      box-shadow: 0 4px 8px rgba(0,0,0,0.1);
    }

    .services-section h2 {
      text-align: center;
      color: #2e7d32;
      font-size: 3rem;
      margin-bottom: 25px;
      line-height: 1.0;
    }

    .service-category {
      margin-bottom: 5px;
    }

    .service-category h3 {
      color: #2e7d32;
      font-size: 1.0rem;
      margin-bottom: 10px;
    }

    .service-category p {
      font-size: 1rem;
      line-height: 2.0;
      color: #444;
      gap: 1.0;
    }

    .service-category p span {
      margin: 0 5px;
      color: #888;
    }
        /* our services banner */

        #topBtn {
  display: none;
  position: fixed;
  bottom: 70px;
  right: 30px;
  z-index: 99;
  font-size: 40px;
  border: none;
  outline: none;
  color: none;
  cursor: pointer;
  padding: 0px 8px;
}

#topBtn:hover {
  background-color: #0099ff;  /* Same hover blue as nav */
}
    
.rightbar{
width:260px;
background:white;
padding:20px;
border-radius:6px;
box-shadow:0 2px 6px rgba(0,0,0,0.08);
}

.rightbar h3{
margin-top:0;
}

.rightbar ul{
list-style:none;
padding:0;
}

.rightbar li{
padding:8px 0;
border-bottom:1px solid #eee;
cursor:pointer;
}

.rightbar li:hover{
color:#1a73e8;
}

@media(max-width:1000px){
.container{
flex-direction:column;
width:95%;
}
.sidebar,.rightbar{
width:100%;
}
}



        /* MEGA MENU LOGIC */
        .has-mega { position: static !important; }
        
        .mega-menu {
            visibility: hidden;
            opacity: 0;
            position: absolute;
            left: 0;
            right: 0;
            width: 100%;
            background: rgb(230, 230, 230);
            border-top: 1px solid #f1f5f9;
            box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.15);
            z-index: 999;
            display: grid;
            grid-template-columns: repeat(4, 1fr);
            gap: 2rem;
            padding: 2.5rem 10%;
            transition: all 0.3s ease-in-out;
            transform: translateY(10px);
            pointer-events: none; /* Prevents flickering */
        }

        .has-mega:hover .mega-menu {
            visibility: visible;
            opacity: 1;
            transform: translateY(0);
            pointer-events: auto;
        }

        .mega-column h4 {
            font-weight: 800;
            color: #003366;
            text-transform: uppercase;
            font-size: 0.8rem;
            margin-bottom: 1rem;
            border-bottom: 2px solid #0ea5e9;
            padding-bottom: 0.5rem;
        }

        .mega-column a {
            display: block;
            color: #4b5563;
            font-size: 0.85rem;
            padding: 0.35rem 0;
            transition: all 0.2s;
        }

        .mega-column a:hover {
            color: #0284c7;
            padding-left: 5px;
        }
        
         /* --- ROOT VARIABLES --- */
:root {
    --primary: #0ea5e9;
    --navy: #031e5e;
    --success: #10b981;
    --slate-light: #f8fafc;
}

/* --- CORE LAYOUT --- */
body {
    background-color: var(--slate-light);
    overflow-x: hidden;
}

/* --- LEGACY TYPOGRAPHY --- */
.heading-legacy {
    font-weight: 900;
    letter-spacing: -0.05em;
    line-height: 0.9;
    text-transform: uppercase;
}

.gradient-text {
    background: linear-gradient(90deg, #0ea5e9, #10b981);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

/* --- INTERACTIVE ELEMENTS --- */
.spotlight {
    position: fixed;
    top: 0; left: 0; width: 100vw; height: 100vh;
    pointer-events: none;
    background: radial-gradient(circle at var(--x) var(--y), rgba(14, 165, 233, 0.15) 0%, transparent 20%);
    z-index: 999;
}

.timeline-bar {
    position: fixed;
    top: 0; left: 0; height: 5px;
    background: var(--primary);
    z-index: 1000;
    width: 0%;
}

/* --- SECTION DIVIDERS --- */
.custom-shape-divider-bottom {
    position: absolute;
    bottom: 0; left: 0; width: 100%;
    line-height: 0;
    transform: rotate(180deg);
}

.custom-shape-divider-bottom svg {
    position: relative;
    display: block;
    width: calc(100% + 1.3px);
    height: 96px;
    fill: var(--slate-light);
}

/* --- CARDS & ANIMATIONS --- */
.card-legacy {
    background: white;
    border-radius: 2rem;
    box-shadow: 0 25px 50px -12px rgba(3, 30, 94, 0.08);
    transition: all 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
    border: 1px solid #f0f9ff;
}

.hover-lift { 
    transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1); 
}

.hover-lift:hover { 
    transform: translateY(-12px) scale(1.02); 
}

.reveal-text {
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);
    transition: transform 1.2s cubic-bezier(0.77, 0, 0.175, 1);
}

/* --- SIDEBAR STYLING --- */
.index-link {
    transition: all 0.3s ease;
}

.index-link:hover {
    color: var(--primary);
    padding-left: 8px;
}

/* --- PHOTO STYLING --- */
.hero-bg-tint {
    filter: grayscale(100%);
    opacity: 0.25;
    mix-blend-mode: overlay;
}

@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;600;700&display=swap');
        
        body { 
            font-family: 'Plus Jakarta Sans', sans-serif; 
            background-color: #fcfdfe;
            color: #1e293b;
        }

        /* Matches the light blue table borders in your image */
        .tax-table-border { border: 1px solid #93c5fd; }
        .tax-table-row { border-bottom: 1px solid #93c5fd; }
        
        /* Matches the specific soft blue background in the image index */
        .index-bg { background-color: #f1f7ff; }

        /* The "Maximize your refund" banner style */
        .promo-banner {
            background-color: #dbeafe; /* Light blue tint */
            border: 1px solid #bfdbfe;
            border-radius: 8px;
        }

        /* Sidebar link hover effect */
        .topic-link {
            transition: color 0.2s;
            color: #334155;
            display: block;
            padding: 4px 0;
        }
        .topic-link:hover { color: #2563eb; }

                /* BANNER IMAGE */
        .banner-img {
          max-width: 100%;
          max-height: 420px;
          object-fit: contain;
        }
