:root {
      --orange: #f7931e;
      --dark-blue: #071b3a;
      --dark-blue-2: #0b2a57;
      --white: #ffffff;
  }

  :root {
      --tg-dark-blue: #061a3a;
      --tg-dark-blue-2: #0a254f;
      --tg-orange: #f7931e;
      --tg-white: #ffffff;
  }

  :root {
      --tg-dark-blue: #061a3a;
      --tg-dark-blue-2: #081f45;
      --tg-panel-blue: #3f5474;
      --tg-orange: #ff8c1a;
      --tg-white: #ffffff;
  }

  :root {
      --glassfix-orange: #f08c28;
      --glassfix-dark: #000000;
      --glassfix-gray: #f6f9fc;
      --glassfix-border: #dbe3ec;
  }

  /* CSS Variables for exact color matching */
  :root {
      --tgs-navy: #051630;
      /* Dark blue background */
      --tgs-orange: #f28b30;
      /* Trident/Button orange */
      --tgs-text-dark: #333333;
      /* Logo text color */
      --tgs-white: #ffffff;
  }

  /* Header Container */
  .tgs-navbar-container {
      display: flex;
      align-items: stretch;
      background-color: var(--tgs-white);
      padding: 0;
      box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  }

  /* Logo Section */
  .tgs-logo-section {
      padding: 15px 40px;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      background-color: white;
  }

  .tgs-main-logo {
      font-family: 'Playfair Display', serif;
      font-size: 2.2rem;
      color: var(--tgs-text-dark);
      line-height: 1;
      letter-spacing: 2px;
      position: relative;
      margin: 0;
  }

  /* The Orange Trident symbol replacement in text */
  .tgs-trident-symbol {
      color: var(--tgs-orange);
      font-size: 1.8rem;
      margin: 0 -2px;
  }

  .tgs-sub-logo {
      font-family: 'Roboto', sans-serif;
      font-size: 0.85rem;
      letter-spacing: 4px;
      color: var(--tgs-text-dark);
      margin-top: 5px;
      text-transform: uppercase;
      font-weight: 500;
  }

  /* Navigation Section (Navy Background) */
  .tgs-nav-section {
      background-color: var(--tgs-navy);
      flex-grow: 1;
      display: flex;
      align-items: center;
      padding: 0 30px;
  }

  .tgs-nav-link {
      color: var(--tgs-white) !important;
      font-family: 'Roboto', sans-serif;
      font-size: 1rem;
      margin: 0 12px;
      transition: color 0.3s;
      text-decoration: none;
  }

  .tgs-nav-link:hover {
      color: var(--tgs-orange) !important;
  }

  /* Get a Quote Button */
  .tgs-btn-quote {
      background-color: var(--tgs-orange);
      color: white !important;
      border-radius: 50px;
      padding: 10px 25px;
      font-weight: 500;
      border: none;
      margin-left: auto;
      white-space: nowrap;
      transition: transform 0.2s, background-color 0.2s;
  }

  .tgs-btn-quote:hover {
      background-color: #e07a20;
      transform: scale(1.05);
  }

  /* Dropdown Icon Adjustment */
  .tgs-dropdown-toggle::after {
      vertical-align: middle;
      margin-left: 5px;
  }

  /* Responsive adjustments */
  @media (max-width: 992px) {
      .tgs-navbar-container {
          flex-direction: column;
      }

      .tgs-nav-section {
          padding: 20px;
          flex-wrap: wrap;
          justify-content: center;
      }

      .tgs-btn-quote {
          margin: 15px auto;
      }
  }

  /* footer-section */
  .footer-section {
      background: #ffffff;
      border-top: 1px solid #eee;
      font-size: 15px;
      color: #555;
  }

  .footer-logo {
      max-width: 220px;
  }

  .footer-about {
      display: flex;
      gap: 15px;
  }

  .about-line {
      width: 4px;
      background: #ff8c2b;
  }

  .footer-title {
      color: #ff8c2b;
      font-weight: 600;
      margin-bottom: 20px;
  }

  .footer-list,
  .footer-links {
      list-style: none;
      padding: 0;
  }

  .footer-list li {
      margin-bottom: 14px;
  }

  .footer-list a {
      color: #0d6efd;
      text-decoration: none;
  }

  .footer-list a:hover {
      text-decoration: underline;
  }

  .time {
      color: #ff8c2b;
  }

  /* Other Info */
  .footer-links li {
      display: flex;
      align-items: center;
      gap: 10px;
      margin-bottom: 12px;
  }

  .footer-links span {
      width: 10px;
      height: 10px;
      background: #ff8c2b;
      border-radius: 50%;
  }

  /* Newsletter */
  .newsletter-box {
      background: #ff8c2b;
      padding: 20px;
      border-radius: 16px;
      color: #fff;
      text-align: center;
  }

  .newsletter-box h6 {
      font-weight: 700;
      margin-bottom: 15px;
  }

  .newsletter-form {
      display: flex;
  }

  .newsletter-form input {
      border: none;
      padding: 10px;
      flex: 1;
      border-radius: 6px 0 0 6px;
  }

  .newsletter-form button {
      border: none;
      background: #e5e5e5;
      padding: 10px 15px;
      border-radius: 0 6px 6px 0;
      font-weight: 600;
  }

  /* Bottom Bar */
  .footer-bottom {
      background: #f6f6f6;
      padding: 15px 0;
      font-size: 14px;
  }

  .social-icons a {
      margin-left: 10px;
      color: #000;
      font-size: 18px;
  }

  .social-icons a:hover {
      color: #ff8c2b;
  }

  /* Responsive */
  @media (max-width: 992px) {
      .newsletter-box {
          margin-top: 20px;
      }
  }


  .footer-top-bar {
      background: #ffffff;
      padding: 30px 0;
      border-bottom: 1px solid #eee;
  }

  .footer-brand-logo {
      max-width: 230px;
  }

  .footer-description {
      display: flex;
      align-items: flex-start;
      gap: 20px;
  }

  .footer-accent-line {
      width: 4px;
      min-height: 70px;
      background: #ff8c2b;
  }

  .footer-description p {
      margin: 0;
      color: #777;
      font-size: 18px;
      line-height: 1.6;
  }

  /* Responsive */
  @media (max-width: 768px) {
      .footer-description {
          flex-direction: column;
      }

      .footer-accent-line {
          width: 60px;
          height: 4px;
      }
  }



  /* Section 2 with -2 classes (same content, different styling) */
  .section-2 {
      width: 100%;
      height: 900px;
      position: relative;
      overflow: hidden;


  }

  .background-2 {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background-image: url('../images/Banner1600X883.jpg');
      background-size: cover;
      background-position: center;
      z-index: 1;
  }

  .overlay-2 {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background: linear-gradient(90deg, rgba(13, 71, 161, 0.9) 0%, rgba(13, 71, 161, 0.6) 50%, rgba(13, 71, 161, 0.3) 100%);
      z-index: 2;
  }

  .content-2 {
      position: relative;
      z-index: 3;
      color: white;
      padding: 80px;
      max-width: 700px;
      height: 75%;
      display: flex;
      flex-direction: column;
      justify-content: center;
  }

  .heading-2 {
      font-size: 52px;
      font-weight: 800;
      line-height: 1.1;
      margin-bottom: 30px;
      text-transform: uppercase;
  }



  .cta-2 {

background-color: #FFFFFF;
    font-family: "Roboto", Poppins;
    font-size: 18px;
    font-weight: 700;
    text-transform: uppercase;
    text-shadow: 0px 0px 10px rgba(0, 0, 0, 0.3);
    fill: #041737;
    color: #041737;
    border-radius: 5px 5px 5px 5px;
    padding: 15px 15px 15px 15px;





    
    
      
   
    
  }

  .phone-2 {
      font-size: 32px;
      font-weight: 800;
      color: #fff;
      background-color: #ff3d00;
      padding: 15px 25px;
      border-radius: 8px;
      display: inline-block;
      margin-top: 10px;
      box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
      text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3);
  }

  /* Info box to explain the different classes */
  .info-box {
      background-color: white;
      padding: 30px;
      border-radius: 10px;
      margin-top: 50px;
      box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
      border-left: 5px solid #0066cc;
  }

  .info-box h3 {
      color: #333;
      margin-bottom: 15px;
      font-size: 24px;
  }

  .info-box p {
      color: #666;
      line-height: 1.6;
      margin-bottom: 10px;
  }

  .info-box .highlight {
      background-color: #f0f8ff;
      padding: 5px 10px;
      border-radius: 4px;
      font-weight: bold;
      color: #0066cc;
  }

  /* Responsive styles */
  @media (max-width: 992px) {

      .content-1,
      .content-2 {
          padding: 50px;
          max-width: 600px;
      }

      .heading-1,
      .heading-2 {
          font-size: 42px;
      }

      .cta-1,
      .cta-2 {
          font-size: 24px;
      }

      .phone-1,
      .phone-2 {
          font-size: 28px;
          padding: 12px 20px;
      }
  }

  @media (max-width: 768px) {

      .section-1,
      .section-2 {
          height: 500px;
      }

      .content-1,
      .content-2 {
          padding: 30px;
          max-width: 100%;
          background-color: rgba(0, 0, 0, 0.6);
      }

      .heading-1,
      .heading-2 {
          font-size: 36px;
      }

      .cta-1,
      .cta-2 {
          font-size: 22px;
      }

      .phone-1,
      .phone-2 {
          font-size: 24px;
          padding: 10px 18px;
      }
  }

  @media (max-width: 576px) {

      .section-1,
      .section-2 {
          height: 450px;
      }

      .content-1,
      .content-2 {
          padding: 20px;
      }

      .heading-1,
      .heading-2 {
          font-size: 32px;
      }

      .cta-1,
      .cta-2 {
          font-size: 20px;
      }

      .phone-1,
      .phone-2 {
          font-size: 22px;
          padding: 10px 15px;
      }
  }

  /* Animation for phone number */
  @keyframes pulse {
      0% {
          transform: scale(1);
      }

      50% {
          transform: scale(1.05);
      }

      100% {
          transform: scale(1);
      }
  }

  .phone-1,
  .phone-2 {
      animation: pulse 2s infinite;
  }



  /* ---------- FAQ SECTION ---------- */
  .faq-title {
      color: var(--orange);
      font-weight: 700;
      margin-bottom: 25px;
  }

  .faq-item {
      border: 1px solid #000;
      margin-bottom: 12px;
      border-radius: 4px;
      overflow: hidden;
  }

  .faq-header {
      padding: 14px 16px;
      cursor: pointer;
      font-weight: 600;
      display: flex;
      justify-content: space-between;
      align-items: center;
      background: #fff;
  }

  .faq-header i {
      background: var(--orange);
      color: #fff;
      width: 26px;
      height: 26px;
      display: flex;
      align-items: center;
      justify-content: center;
      border-radius: 50%;
      font-size: 14px;
  }

  .faq-body {
      padding: 15px 18px;
      display: none;
      font-size: 14px;
      line-height: 1.6;
      color: #333;
  }

  .faq-item.active .faq-body {
      display: block;
  }

  .faq-item.active .faq-header i {
      transform: rotate(180deg);
  }

  /* ---------- CONTACT BUBBLE ---------- */
  .contact-wrapper {
      background: linear-gradient(135deg, var(--dark-blue), var(--dark-blue-2));
      border-radius: 60px;
      padding: 60px 50px;
      position: relative;
      color: #fff;
  }

  .contact-wrapper::after {
      content: "";
      position: absolute;
      bottom: -40px;
      left: 80px;
      width: 0;
      height: 0;
      border-left: 40px solid transparent;
      border-right: 40px solid transparent;
      border-top: 40px solid var(--dark-blue);
  }

  .contact-title {
      color: var(--orange);
      font-weight: 700;
      text-align: center;
      margin-bottom: 30px;
  }

  .contact-wrapper label {
      color: var(--orange);
      font-weight: 600;
      margin-bottom: 6px;
  }

  .contact-wrapper input {
      border-radius: 25px;
      padding: 12px 18px;
      border: none;
  }

  .btn-submit {
      background: var(--orange);
      color: #fff;
      border-radius: 25px;
      padding: 10px 30px;
      border: none;
      font-weight: 600;
  }

  .btn-submit:hover {
      background: #e67e00;
  }

  @media (max-width: 991px) {
      .contact-wrapper {
          margin-top: 40px;
      }
  }



  /* ===============================
   SECTION WRAPPER
================================ */
  .tg-locations-section {
      background: linear-gradient(180deg, var(--tg-dark-blue), var(--tg-dark-blue-2));
      padding: 70px 0;
      color: var(--tg-white);
      text-align: center;
  }

  /* ===============================
   HEADINGS
================================ */
  .tg-locations-title {
      color: var(--tg-orange);
      font-weight: 800;
      letter-spacing: 1px;
  }

  .tg-locations-subtitle {
      font-size: 28px;
      font-weight: 700;
      margin: 10px 0;
  }

  .tg-locations-city {
      color: var(--tg-orange);
      font-size: 22px;
      font-weight: 700;
      margin-top: 15px;
  }

  .tg-locations-desc {
      max-width: 800px;
      margin: 15px auto 40px;
      font-size: 14px;
      opacity: .9;
  }

  /* ===============================
   MAP CONTAINER
================================ */
  .tg-map-wrapper {
      background: #fff;
      display: flex;
      border-radius: 4px;
      overflow: hidden;
  }

  /* LEFT ORANGE PANEL */
  .tg-map-info {
      background: var(--tg-orange);
      color: #fff;
      padding: 25px;
      width: 260px;
      text-align: left;
  }

  .tg-map-info h4 {
      font-weight: 700;
      margin-bottom: 10px;
  }

  .tg-map-info p {
      font-size: 13px;
      line-height: 1.5;
  }

  /* MAPS */
  .tg-map-area {
      flex: 1;
      display: flex;
  }

  .tg-map-box {
      width: 50%;
      border-left: 4px solid var(--tg-orange);
  }

  .tg-map-box iframe {
      width: 100%;
      height: 380px;
      border: 0;
  }

  /* CITY LABEL */
  .tg-map-label {
      position: absolute;
      bottom: 15px;
      left: 50%;
      transform: translateX(-50%);
      font-size: 26px;
      font-weight: 700;
      color: #000;
  }

  /* MAP POSITION */
  .tg-map-relative {
      position: relative;
  }

  /* ===============================
   BUTTON
================================ */
  .tg-quote-btn {
      background: var(--tg-orange);
      color: #fff;
      border: none;
      padding: 10px 28px;
      border-radius: 4px;
      font-weight: 600;
      margin-top: 30px;
  }

  .tg-quote-btn:hover {
      background: #e67e00;
  }

  /* ===============================
   RESPONSIVE
================================ */
  @media(max-width:992px) {
      .tg-map-wrapper {
          flex-direction: column;
      }

      .tg-map-info {
          width: 100%;
      }

      .tg-map-area {
          flex-direction: column;
      }

      .tg-map-box {
          width: 100%;
          border-left: none;
          border-top: 4px solid var(--tg-orange);
      }
  }



  /* =========================
   SECTION BACKGROUND
========================= */
  .tg-about-section {
      background: linear-gradient(180deg, var(--tg-dark-blue), var(--tg-dark-blue-2));
        padding-top: 320px;
    padding-bottom: 20px;
      color: var(--tg-white);
  }

  /* =========================
   TITLE
========================= */
  .tg-about-title {
      text-align: center;
      font-weight: 800;
      font-size: 36px;
      margin-bottom: 40px;
  }

  .tg-about-title span {
      color: var(--tg-orange);
  }

  /* =========================
   CONTENT PANEL
========================= */
  .tg-about-panel {
      background: var(--tg-panel-blue);
      padding: 10px;
      border-radius: 0;
  }

  /* =========================
   IMAGE BOX
========================= */
  .tg-about-image-wrap {
      position: relative;
      border-radius: 30px;
      overflow: hidden;
  }

  .tg-about-image-wrap::before {
         content: "";
    position: absolute;
    top: -61px;
    left: -25px;
    width: 80px;
    height: 179px;
    background: var(--tg-panel-blue);
    transform: rotate(45deg);
    z-index: 2;

  }

  .tg-about-image {
      width: 100%;
      height: 100%;
      object-fit: cover;
      border-radius: 40px 20px 20px 20px;
 
  }

  /* =========================
   TEXT CONTENT
========================= */
  .tg-about-heading {
      font-size: 32px;
      font-weight: 400;
      margin-bottom: 15px;
  }

  .tg-about-text {
      font-size: 16px;
      line-height: 1.8;
      opacity: .95;
  }

  /* =========================
   BUTTON
========================= */
  .tg-about-btn {
      display: inline-flex;
      align-items: center;
      gap: 10px;
      margin-top: 25px;
      background: var(--tg-orange);
      color: #fff;
      font-weight: 700;
      padding: 12px 22px;
      /* border-radius: 4px; */
      text-decoration: none;
  }

  .tg-about-btn span {
      background: #fff;
      color: var(--tg-orange);
      width: 22px;
      height: 22px;
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 14px;
  }

  /* =========================
   RESPONSIVE
========================= */
  @media(max-width:991px) {
      .tg-about-heading {
          font-size: 26px;
      }

      .tg-about-panel {
          padding: 25px;
      }
  }

  /* Main Wrapper */
  .glassfix-wrapper {
      min-height: 80vh;
      display: flex;
      align-items: stretch;
      overflow: hidden;
      position: absolute;
      top: 700px;
      left: 50%;
      transform: translateX(-50%);
      background-color: #fff;
      z-index: 99;
      width: 70%;

  }

  /* LEFT SECTION */
  .glassfix-left {
      background: var(--glassfix-orange);
      color: #ffffff;
      width: 50%;
      padding: 25px 60px;
      clip-path: polygon(0 0, 85% 0, 100% 100%, 0 100%);
  }

  .glassfix-left h1 {
      font-size: 22px;
      font-weight: 700;
      line-height: 1.3;
  }

  .glassfix-left p {
      font-size: 20px;
      margin-top: 25px;
  }

  .glassfix-left .glassfix-highlight {
      font-weight: 700;
  }

  .glassfix-phone {
      display: flex;
      align-items: center;
      margin-top: 40px;
      font-size: 22px;
      font-weight: 600;
  }

  .glassfix-phone i {
      font-size: 26px;
      margin-right: 15px;
      background: #ffffff;
      color: var(--glassfix-orange);
      border-radius: 50%;
      padding: 12px;
  }

  /* RIGHT SECTION */
  .glassfix-right {
      width: 50%;
      padding: 25px 80px
  }

  .glassfix-form-title {
      font-size: 26px;
      font-weight: 700;
      margin-bottom: 10px;
  }

  .glassfix-form-line {
      width: 50px;
      height: 4px;
      background: var(--glassfix-orange);
      margin-bottom: 40px;
  }

  .glassfix-label {
      font-weight: 600;
      color: var(--glassfix-orange);
      margin-bottom: 0px;
  }

  .glassfix-input {
      background: var(--glassfix-gray);
      border: 1px solid var(--glassfix-border);
      border-radius: 9px;
      padding: 3px 9px;
      margin-bottom: 10px;
  }

  .glassfix-input:focus {
      outline: none;
      border-color: var(--glassfix-orange);
      box-shadow: none;
  }

  .glassfix-submit {
      background: var(--glassfix-orange);
      color: #ffffff;
      border: none;
      border-radius: 30px;
      padding: 12px 40px;
      font-weight: 600;
      margin-top: 15px;
  }

  .glassfix-submit:hover {
      background: #e57f1d;
  }

  .glassfix-logo {
      margin-top: 60px;
      text-align: right;
  }

  .glassfix-logo img {
      max-width: 200px;
  }

  /* RESPONSIVE */
  @media (max-width: 991px) {
      .glassfix-wrapper {
          flex-direction: column;
      }

      .glassfix-left,
      .glassfix-right {
          width: 100%;
          clip-path: none;
      }

      .glassfix-right {
          padding: 50px 30px;
      }
  }

  :root {
      --tg-navy: #0b1d4d;
      --tg-orange: #f68b2c;
      --tg-dark: #0a1a33;
  }

  /* SECTION */
  .tg-choose-section {
      padding: 90px 0;
      background-color: #ffffff;
  }

  /* HEADINGS */
  .tg-choose-subtitle {
      font-weight: 800;
      font-size: 22px;
      letter-spacing: 1px;
      text-align: center;
  }

  .tg-choose-subtitle span {
      color: var(--tg-orange);
  }

  .tg-choose-title {
      text-align: center;
      font-weight: 800;
      font-size: 34px;
      margin-top: 15px;
      color: var(--tg-dark);
  }

  .tg-choose-desc {
      max-width: 900px;
      margin: 20px auto 70px;
      text-align: center;
      font-size: 17px;
      color: #2a3558;
      line-height: 1.7;
  }

  /* LEFT IMAGE */
  .tg-choose-image-wrapper {
      position: relative;
      width: 420px;
      height: 420px;
      border-radius: 50%;
      background: var(--tg-navy);
      display: flex;
      align-items: center;
      justify-content: center;
      margin: auto;
  }

  .tg-choose-image-wrapper img {
      width: 85%;
      border-radius: 50%;
  }

  .tg-circle-orange {
      position: absolute;
      width: 40px;
      height: 40px;
      background: var(--tg-orange);
      border-radius: 50%;
      top: 60px;
      right: 40px;
  }

  /* FEATURE BOXES */
  .tg-feature-box {
     position: relative;
    padding: 10px 20px 10px 20px;
    border-radius: 12px;
    margin-bottom: 35px;
    color: #ffffff;
    width: 80%;
  }

  .tg-feature-box.navy {
      background: var(--tg-navy);
  }

  .tg-feature-box.orange {
      background: var(--tg-orange);
  }

  .tg-feature-title {
      font-size: 20px;
      font-weight: 700;
      margin-bottom: 10px;
  }

  .tg-feature-text {
      font-size: 15px;
      line-height: 1.7;
  }

  /* DOT */
  .tg-feature-dot {
      position: absolute;
      width: 26px;
      height: 26px;
      border-radius: 50%;
      left: -13px;
      top: 50%;
      transform: translateY(-50%);
  }

  .tg-feature-dot.orange {
      background: var(--tg-orange);
  }

  .tg-feature-dot.navy {
      background: var(--tg-navy);
  }

  /* RESPONSIVE */
  @media (max-width: 991px) {
      .tg-choose-image-wrapper {
          width: 300px;
          height: 300px;
          margin-bottom: 50px;
      }
  }


  :root {
      --tg-blue: #0b1d4d;
      --tg-orange: #f68b2c;
      --tg-dark: #0a1a33;
      --tg-bg: #f6f7f9;
  }



  /* SECTION */
  .tg-services-section {
      padding: 90px 0;
  }

  /* HEADERS */
  .tg-services-subtitle {
color: #001736;
    font-size: 40px;
    margin-bottom: 10px;

      text-align: center;
      
   
  }

  .tg-services-subtitle span {
      color: var(--tg-orange);
  }

  .tg-services-title {

        color: #001736;
    font-size: 38px;

      text-align: center;

      margin-top: 10px;
    
      margin-bottom: 60px;
  }

  /* SERVICE BUTTONS */
  .tg-service-btn {
      border: 1.8px solid var(--tg-orange);
      background: #fff;
      border-radius: 8px;
      padding: 14px 16px;
      display: flex;
      align-items: center;
      gap: 12px;
      cursor: pointer;
      font-weight: 600;
      color: var(--tg-dark);
      transition: 0.3s;
      height: 100%;
  }

  .tg-service-btn:hover {
      background: rgba(246, 139, 44, 0.08);
  }

  .tg-service-btn.active {
      background: var(--tg-blue);
      color: #fff;
      border-color: var(--tg-blue);
  }

  .tg-service-icon {
      width: 38px;
      height: 38px;
      background: var(--tg-orange);
      color: #000;
      display: flex;
      align-items: center;
      justify-content: center;
      border-radius: 4px;
      font-size: 18px;
      font-weight: 800;
  }

  /* RIGHT CONTENT */
  .tg-service-image {
      border-radius: 30px 0px 30px 0px;
      overflow: hidden;
  }

  .tg-service-image img {
      width: 100%;
      height: 100%;
      object-fit: cover;
  }

  .tg-service-heading {
      font-size: 26px;
      font-weight: 400;
      margin-top: 20px;
      color: var(--tg-dark);
  }

  .tg-service-text {
      margin-top: 10px;
      font-size: 16px;
      line-height: 1.7;
  }

  .tg-service-cta {
      margin-top: 25px;
      background: var(--tg-orange);
      color: #fff;
      border: none;
      padding: 12px 30px;
      border-radius: 6px;
      font-weight: 700;
  }

  /* RESPONSIVE */
  @media(max-width:991px) {
      .tg-services-title {
          font-size: 28px;
      }
  }


  /* ===== GlassFix Logo Section ===== */
  .glassfix-logo-section {
      background-color: #ffffff;
      padding: 60px 0;
      position: relative;
      z-index: 10;
  }

  /* Row spacing */
  .glassfix-logo-row {
      row-gap: 30px;
  }

  /* Logo item */
  .glassfix-logo-item {
      display: flex;
      justify-content: center;
      align-items: center;
  }

  /* Logo images */
  .glassfix-logo-img {
      max-width: 100%;
      height: auto;
      max-height: 190px;
      object-fit: contain;
      filter: none;
      transition: transform 0.3s ease;
  }

  /* Hover effect (optional) */
  .glassfix-logo-img:hover {
      transform: scale(1.05);
  }

  /* Responsive tuning */
  @media (max-width: 768px) {
      .glassfix-logo-img {
          max-height: 70px;
      }
  }


  :root {
      --tgs-dark-navy: #000f24;
      --tgs-orange: #f28b30;
      --tgs-white: #ffffff;
      --tgs-text-gray: #333333;
  }

  body {
         font-family: "Segoe UI", Arial, sans-serif;
      background-color: #f8f9fa;
  }

  /* Main Section Container */
  .tgs-hero-section {
      background-color: var(--tgs-dark-navy);
      padding: 80px 0;
      color: var(--tgs-white);
      font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  }

  /* Left Content Card */
  .tgs-info-card {
      background: var(--tgs-white);
      border-radius: 12px;
      padding: 40px;
      color: var(--tgs-text-gray);
      min-height: 420px;
      box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
      position: relative;
  }

  .tgs-info-card h2 {
      font-weight: 700;
      font-size: 1.75rem;
      margin-bottom: 25px;
      color: #000;
  }

  .tgs-info-card p {
      line-height: 1.6;
      font-size: 0.95rem;
  }

  /* Decorative Bar in Card */
  .tgs-decor-bar {
      height: 8px;
      width: 120px;
      background: linear-gradient(to right, var(--tgs-dark-navy) 60%, var(--tgs-orange) 40%);
      margin-top: 30px;
  }

  /* Center Slider Controls */
  .tgs-slider-controls {
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 15px;
  }

  .tgs-arrow {
      color: var(--tgs-white);
      font-size: 1.5rem;
      cursor: pointer;
      transition: 0.3s;
  }

  .tgs-arrow:hover {
      color: var(--tgs-orange);
  }

  .tgs-dot {
      width: 22px;
      height: 22px;
      background-color: var(--tgs-white);
      border-radius: 50%;
      cursor: pointer;
      transition: background-color 0.3s;
  }

  .tgs-dot.active {
      background-color: var(--tgs-orange);
  }

  /* Right Content Area */
  .tgs-right-content {
      padding-left: 20px;
  }

  .tgs-right-content h3 {
      color: var(--tgs-orange);
      text-transform: uppercase;
      font-weight: 600;
      font-size: 1.4rem;
      margin-bottom: 20px;
  }

  .tgs-right-content p {
      font-size: 0.9rem;
      line-height: 1.7;
      opacity: 0.9;
  }

  .tgs-highlight {
      color: var(--tgs-orange);
      text-decoration: none;
  }

  /* Bottom Button */
  .tgs-btn-book {
      background-color: var(--tgs-orange);
      color: white;
      border: none;
      padding: 12px 40px;
      font-weight: 600;
      border-radius: 4px;
      margin-top: 40px;
      transition: transform 0.2s;
  }

  .tgs-btn-book:hover {
      background-color: #e07a20;
      color: white;
      transform: translateY(-2px);
  }

  /* Content Switcher Animation */
  .tgs-fade {
      animation: fadeIn 0.5s ease-in;
  }

  @keyframes fadeIn {
      from {
          opacity: 0;
          transform: translateY(10px);
      }

      to {
          opacity: 1;
          transform: translateY(0);
      }
  }

    /* --- SECTION 2: RECENT PROJECTS --- */
        .tgs-projects-section {
            padding: 60px 0;
            background-color:#fff;
        }

        .tgs-pj-title {
            text-align: center;
            font-weight: 800;
            font-size: 2.5rem;
            margin-bottom: 40px;
            text-transform: uppercase;
        }

        .tgs-pj-title span { color: var(--tgs-orange); }
        .tgs-pj-title b { color: var(--tgs-navy); }

        /* Infinite Scroll Logic */
        .tgs-marquee-container {
            overflow: hidden;
            user-select: none;
            display: flex;
            gap: 20px;
               margin-bottom: 40px;
               padding-bottom: 10px;;
        }

        .tgs-marquee-content {
            display: flex;
            gap: 20px;
            flex-shrink: 0;
            min-width: 100%;
        }

        /* Row 1: Left to Right */
        .tgs-scroll-ltr {
            animation: scroll-ltr 30s linear infinite;
        }

        /* Row 2: Right to Left */
        .tgs-scroll-rtl {
            animation: scroll-rtl 30s linear infinite;
        }

        @keyframes scroll-ltr {
            from { transform: translateX(-50%); }
            to { transform: translateX(0); }
        }

        @keyframes scroll-rtl {
            from { transform: translateX(0); }
            to { transform: translateX(-50%); }
        }

        /* Image Styling */
        .tgs-pj-img {
            width: 350px;
            height: 220px;
            object-fit: cover;
            border-radius: 5px 5px 5px 5px; /* Matches the clipped look */
       border: 0px solid #f28b30;
    box-shadow: 5px 5px 0px #f28b30;
        }

        /* Hover to pause */
        .tgs-marquee-container:hover .tgs-marquee-content {
            animation-play-state: paused;
        }


        /* //edit */

        .tg-feature-box-one{

    left: 100px;

        }

        .tg-service-icon.active{

background: #fff !important;

        }