 /* ----- custom prefix .tm- ----- */
    :root {
      --tm-primary: #198754;
      --tm-primary-dark: #0f5c3a;
      --tm-white: #ffffff;
      --tm-light: #f8f9fa;
      --tm-shadow: 0 20px 40px -12px rgba(0, 0, 0, 0.15);
      --tm-shadow-hover: 0 32px 56px -16px rgba(0, 0, 0, 0.25);
    }
    * { margin: 0; padding: 0; box-sizing: border-box; }
    body { font-family: 'Inter', sans-serif; background: #fff; color: #1e1e1e; scroll-behavior: smooth; }
    img, svg { display: block; max-width: 100%; }
    a { text-decoration: none; color: inherit; }

    /* glassmorphism accents */
    .tm-glass {
      background: rgba(255, 255, 255, 0.12);
      backdrop-filter: blur(4px);
      -webkit-backdrop-filter: blur(4px);
      border: 1px solid rgba(255, 255, 255, 0.15);
      border-radius: 16px;
    }

    /* sticky nav */
    .tm-navbar {
      background: rgba(255, 255, 255, 0.92);
      backdrop-filter: blur(12px);
      -webkit-backdrop-filter: blur(12px);
      box-shadow: 0 4px 20px rgba(0, 0, 0, 0.03);
      transition: all 0.25s ease;
    }
    .tm-navbar.scrolled {
      background: rgba(255, 255, 255, 0.98);
      box-shadow: 0 8px 28px rgba(0, 0, 0, 0.06);
      padding-top: 0.3rem !important;
      padding-bottom: 0.3rem !important;
    }
    .tm-navbar .navbar-brand img { height: 40px; transition: height 0.2s; }
    .tm-navbar.scrolled .navbar-brand img { height: 32px; }
    .tm-nav-link { font-weight: 500; color: #1e2a3a; padding: 0.5rem 1rem; border-radius: 40px; transition: 0.2s; }
    .tm-nav-link:hover { background: rgba(25, 135, 84, 0.08); color: var(--tm-primary); }
    .tm-btn-primary { background: var(--tm-primary); border: none; color: #fff; padding: 0.6rem 1.8rem; border-radius: 60px; font-weight: 600; transition: 0.2s; box-shadow: 0 8px 18px -6px rgba(25, 135, 84, 0.3); }
    .tm-btn-primary:hover { background: #157347; transform: translateY(-2px); box-shadow: 0 12px 24px -8px rgba(25, 135, 84, 0.4); color: #fff; }
    .tm-btn-outline { background: transparent; border: 1.5px solid var(--tm-primary); color: var(--tm-primary); padding: 0.6rem 1.8rem; border-radius: 60px; font-weight: 600; transition: 0.2s; }
    .tm-btn-outline:hover { background: var(--tm-primary); color: #fff; transform: translateY(-2px); box-shadow: 0 12px 24px -8px rgba(25, 135, 84, 0.2); }

    /* hero carousel */
    .tm-hero-carousel .carousel-item { height: 100vh; background-size: cover; background-position: center; }
    .tm-hero-carousel .carousel-item::after { content: ''; position: absolute; inset: 0; background: rgba(0, 0, 0, 0.45); z-index: 1; }
    .tm-hero-carousel .carousel-item>* { z-index: 2; position: relative; }
    .tm-hero-carousel .carousel-caption {  top: 30%; bottom: 20%; left: 6%; right: 6%; text-align: left; }
    .tm-hero-carousel .carousel-indicators { bottom: 30px; }
    .tm-hero-carousel .carousel-indicators button { width: 12px; height: 12px; border-radius: 20px; border: 0; background: rgba(255, 255, 255, 0.4); margin: 0 6px; transition: 0.3s; }
    .tm-hero-carousel .carousel-indicators button.active { background: var(--tm-primary); width: 32px; }
    .tm-hero-badge { background: rgba(25, 135, 84, 0.2); backdrop-filter: blur(4px); padding: 0.3rem 1.2rem; border-radius: 60px; font-size: 0.8rem; font-weight: 600; color: #d4edda; display: inline-block; letter-spacing: 0.5px; border: 1px solid rgba(255,255,255,0.1); }
    .tm-hero-title { font-weight: 700; font-size: clamp(2.2rem, 6vw, 4.8rem); line-height: 1.1; letter-spacing: -0.02em; }
    .tm-hero-desc { font-size: clamp(1rem, 1.4vw, 1.3rem); opacity: 0.9; max-width: 580px; }
    .tm-scroll-indicator { position: absolute; bottom: 24px; left: 50%; transform: translateX(-50%); z-index: 5; color: rgba(255,255,255,0.5); animation: bounceDown 2s infinite; font-size: 1.8rem; }
    @keyframes bounceDown { 0%,100%{ transform: translateX(-50%) translateY(0); } 50%{ transform: translateX(-50%) translateY(10px); } }

    /* floating mockups */
    .tm-float-item { animation: floatY 5s ease-in-out infinite; border-radius: 20px; background: rgba(255,255,255,0.08); backdrop-filter: blur(6px); padding: 0.6rem 1.2rem; border: 1px solid rgba(255,255,255,0.12); color: #fff; font-weight: 500; }
    .tm-float-item:nth-child(2) { animation-delay: 0.8s; }
    .tm-float-item:nth-child(3) { animation-delay: 1.6s; }
    .tm-float-item:nth-child(4) { animation-delay: 2.4s; }
    @keyframes floatY { 0%,100%{ transform: translateY(0); } 50%{ transform: translateY(-12px); } }

    /* product carousel cards */
    .tm-product-card {
      background: #fff; border-radius: 24px; overflow: hidden; box-shadow: var(--tm-shadow); transition: all 0.3s cubic-bezier(0.2, 0, 0, 1); height: 100%; display: flex; flex-direction: column; border: 1px solid rgba(0,0,0,0.02);
    }
    .tm-product-card:hover { transform: translateY(-10px) scale(1.01); box-shadow: var(--tm-shadow-hover); border-color: rgba(25, 135, 84, 0.15); }
    .tm-product-img { overflow: hidden; border-radius: 24px 24px 0 0; background: #f0f3f5; position: relative; }
    .tm-product-img img { transition: transform 0.5s ease; width: 100%; height: 200px; object-fit: cover; }
    .tm-product-card:hover .tm-product-img img { transform: scale(1.05); }
    .tm-product-badge { position: absolute; top: 16px; left: 16px; background: var(--tm-primary); color: #fff; padding: 0.2rem 1rem; border-radius: 60px; font-size: 0.7rem; font-weight: 600; letter-spacing: 0.3px; }
    .tm-product-body { padding: 1.2rem 1.2rem 0.8rem; flex: 1; display: flex; flex-direction: column; }
    .tm-product-title { font-weight: 700; font-size: 1.2rem; margin-bottom: 0.3rem; }
    .tm-product-desc { font-size: 0.85rem; color: #4a5a6a; margin-bottom: 0.8rem; flex: 1; }
    .tm-spec-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0.2rem 1rem; font-size: 0.75rem; color: #2d3a4a; background: var(--tm-light); padding: 0.6rem 0.8rem; border-radius: 16px; margin: 0.4rem 0; }
    .tm-spec-grid span { display: flex; align-items: center; gap: 4px; }
    .tm-spec-grid i { color: var(--tm-primary); font-size: 0.7rem; }
    .tm-app-chips { display: flex; flex-wrap: wrap; gap: 4px; margin: 0.6rem 0; }
    .tm-app-chips span { background: #eef3f0; padding: 0.15rem 0.7rem; border-radius: 40px; font-size: 0.65rem; font-weight: 500; color: #1e3a2a; }
    .tm-quality { display: flex; flex-wrap: wrap; gap: 0.2rem 0.6rem; font-size: 0.7rem; color: #1e3a2a; margin: 0.2rem 0 0.4rem; }
    .tm-quality i { color: var(--tm-primary); margin-right: 2px; }
    .tm-product-footer { padding: 0.8rem 1.2rem 1.2rem; display: flex; gap: 0.5rem; border-top: 1px solid #f0f3f5; }
    .tm-product-footer .btn { border-radius: 60px; font-size: 0.75rem; font-weight: 600; padding: 0.3rem 1.2rem; }

    /* why choose us */
    .tm-why-card { background: #fff; border-radius: 24px; padding: 1.8rem 1.2rem; box-shadow: var(--tm-shadow); transition: 0.25s; height: 100%; border: 1px solid rgba(0,0,0,0.02); text-align: center; }
    .tm-why-card:hover { transform: translateY(-8px); box-shadow: var(--tm-shadow-hover); border-color: rgba(25,135,84,0.2); }
    .tm-why-card i { font-size: 2.6rem; color: var(--tm-primary); margin-bottom: 0.8rem; display: inline-block; }

    /* timeline */
    .tm-timeline-step { background: #fff; border-radius: 40px; padding: 1.2rem 1rem; box-shadow: 0 8px 24px rgba(0,0,0,0.02); border-left: 4px solid var(--tm-primary); transition: 0.2s; }
    .tm-timeline-step:hover { background: var(--tm-light); transform: translateX(4px); }

    /* testimonials */
    .tm-testimonial-card { background: rgba(255,255,255,0.05); backdrop-filter: blur(4px); border-radius: 32px; padding: 2rem; border: 1px solid rgba(255,255,255,0.08); color: #fff; }
    .tm-testimonial-card img { width: 56px; height: 56px; border-radius: 60px; object-fit: cover; border: 2px solid rgba(255,255,255,0.2); }

    /* final cta */
    .tm-cta-section { background: linear-gradient(135deg, #0f3d2a 0%, #1a6e46 100%); border-radius: 48px; padding: 4rem 2rem; position: relative; overflow: hidden; }
    .tm-cta-section::before { content: ''; position: absolute; inset: 0; background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 200 200" opacity="0.06"><path d="M60 20 L80 40 L60 60 L40 40 Z M140 80 L160 100 L140 120 L120 100 Z M30 140 L50 160 L30 180 L10 160 Z" fill="white"/></svg>') repeat; background-size: 120px; }


    /* footer */
    .tm-footer {
      background: #0b2c1a;
      color: rgba(255,255,255,0.75);
      border-top: 1px solid rgba(255,255,255,0.03);
    }
    .tm-footer a {
      color: rgba(255,255,255,0.7);
      text-decoration: none;
      transition: 0.15s;
    }
    .tm-footer a:hover {
      color: #fff;
    }
    .tm-footer .tm-logo-footer {
      font-weight: 700;
      font-size: 1.8rem;
      color: #fff;
      letter-spacing: -0.02em;
    }
    .tm-footer .tm-social-icon {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 38px;
      height: 38px;
      background: rgba(255,255,255,0.05);
      border-radius: 60px;
      transition: 0.15s;
      color: #fff;
      font-size: 1.2rem;
    }
    .tm-footer .tm-social-icon:hover {
      background: #138A36;
      color: #fff;
    }
    .tm-footer .tm-newsletter-input {
      background: rgba(255,255,255,0.06);
      border: 1px solid rgba(255,255,255,0.1);
      border-radius: 60px;
      padding: 0.6rem 1.2rem;
      color: #fff;
      width: 100%;
    }
    .tm-footer .tm-newsletter-input:focus {
      outline: none;
      border-color: #138A36;
      background: rgba(255,255,255,0.08);
    }
    .tm-footer .tm-newsletter-btn {
      background: #138A36;
      border: none;
      border-radius: 60px;
      padding: 0.6rem 1.8rem;
      font-weight: 600;
    }

   


/* About */

 /* hero */
    .tm-hero-about { position: relative; background: linear-gradient(135deg, #0f3d2a 0%, #1a6e46 100%); min-height: 80vh; display: flex; align-items: center; overflow: hidden; }
    .tm-hero-about::after { content: ''; position: absolute; inset: 0; background: rgba(0,0,0,0.35); z-index: 1; }
    .tm-hero-content { position: relative; z-index: 3; }
    .tm-hero-badge { background: rgba(255,255,255,0.12); backdrop-filter: blur(4px); padding: 0.3rem 1.4rem; border-radius: 60px; font-weight: 600; font-size: 0.8rem; color: #d4edda; border: 1px solid rgba(255,255,255,0.08); display: inline-block; }
    .tm-hero-title { font-size: clamp(2.2rem, 5.5vw, 4.2rem); font-weight: 700; line-height: 1.1; letter-spacing: -0.02em; }
    .tm-float-item { background: rgba(255,255,255,0.08); backdrop-filter: blur(6px); border: 1px solid rgba(255,255,255,0.12); border-radius: 60px; padding: 0.4rem 1.2rem; color: #fff; font-weight: 500; display: inline-block; animation: floatY 5s ease-in-out infinite; }
    .tm-float-item:nth-child(2) { animation-delay: 0.6s; }
    .tm-float-item:nth-child(3) { animation-delay: 1.2s; }
    .tm-float-item:nth-child(4) { animation-delay: 1.8s; }
    .tm-float-item:nth-child(5) { animation-delay: 2.4s; }
    @keyframes floatY { 0%,100%{ transform: translateY(0); } 50%{ transform: translateY(-12px); } }

    /* statistic cards */
    .tm-stat-card { background: rgba(255,255,255,0.06); backdrop-filter: blur(4px); border-radius: 24px; padding: 1.8rem 1rem; border: 1px solid rgba(255,255,255,0.06); transition: 0.2s; height: 100%; text-align: center; }
    .tm-stat-card:hover { background: rgba(255,255,255,0.10); transform: translateY(-4px); }
    .tm-stat-number { font-size: 2.8rem; font-weight: 700; color: #fff; }
    .tm-stat-label { color: rgba(255,255,255,0.7); font-weight: 500; }

    /* timeline */
    .tm-timeline-line { position: relative; }
    .tm-timeline-line::before { content: ''; position: absolute; top: 20px; left: 0; right: 0; height: 3px; background: var(--tm-primary); opacity: 0.2; }
    .tm-timeline-item { text-align: center; position: relative; }
    .tm-timeline-dot { width: 40px; height: 40px; background: var(--tm-primary); border-radius: 60px; margin: 0 auto 0.5rem; display: flex; align-items: center; justify-content: center; color: #fff; font-weight: 700; font-size: 0.9rem; box-shadow: 0 8px 18px rgba(25,135,84,0.2); }
    .tm-timeline-year { font-weight: 700; color: var(--tm-primary); }

    /* value cards */
    .tm-value-card { background: #fff; border-radius: 24px; padding: 1.8rem 1.2rem; box-shadow: var(--tm-shadow); transition: 0.25s; border: 1px solid rgba(0,0,0,0.02); height: 100%; text-align: center; }
    .tm-value-card:hover { transform: translateY(-10px); box-shadow: var(--tm-shadow-hover); border-color: var(--tm-primary); }
    .tm-value-card i { font-size: 2.6rem; color: var(--tm-primary); margin-bottom: 0.8rem; }

    /* excellence feature list */
    .tm-feature-list { list-style: none; padding-left: 0; }
    .tm-feature-list li { margin-bottom: 0.6rem; display: flex; align-items: center; gap: 0.6rem; }

    /* quality cards */
    .tm-quality-card { background: #fff; border-radius: 24px; padding: 1.6rem 1rem; box-shadow: var(--tm-shadow); transition: 0.2s; height: 100%; text-align: center; border: 1px solid rgba(0,0,0,0.02); }
    .tm-quality-card:hover { transform: translateY(-5px); box-shadow: var(--tm-shadow-hover); }
    .tm-quality-card i { font-size: 2.4rem; color: var(--tm-primary); }

    /* certification badges */
    .tm-cert-badge { background: #fff; border-radius: 60px; padding: 0.4rem 1.2rem; box-shadow: var(--tm-shadow); font-weight: 600; font-size: 0.85rem; color: #1e2a3a; display: inline-flex; align-items: center; gap: 0.4rem; border: 1px solid #eef3f0; }

    /* leadership card */
    .tm-leader-card { background: #fff; border-radius: 32px; padding: 1.6rem 1.2rem; box-shadow: var(--tm-shadow); transition: 0.25s; height: 100%; text-align: center; border: 1px solid rgba(0,0,0,0.02); }
    .tm-leader-card:hover { transform: translateY(-6px); box-shadow: var(--tm-shadow-hover); }
    .tm-leader-card img { width: 100px; height: 100px; border-radius: 60px; object-fit: cover; margin: 0 auto 0.8rem; border: 4px solid var(--tm-primary); }

    /* testimonial */
    .tm-testimonial-card { background: rgba(255,255,255,0.06); backdrop-filter: blur(4px); border-radius: 32px; padding: 2rem; border: 1px solid rgba(255,255,255,0.08); color: #fff; }
    .tm-testimonial-card img { width: 60px; height: 60px; border-radius: 60px; object-fit: cover; border: 2px solid rgba(255,255,255,0.2); }




/* Contact Us */

/* hero */
    .tm-hero-contact { position:relative; background:linear-gradient(135deg, #0f3d2a 0%, #1a6e46 100%); min-height:45vh; display:flex; align-items:center; overflow:hidden; }
    .tm-hero-contact::after { content:''; position:absolute; inset:0; background:rgba(0,0,0,0.30); z-index:1; }
    .tm-hero-contact .container { position:relative; z-index:3; }

    /* contact cards */
    .tm-contact-card { background:#fff; border-radius:28px; padding:1.8rem 1.2rem; box-shadow:var(--tm-shadow); transition:0.25s; height:100%; border:1px solid rgba(0,0,0,0.02); text-align:center; }
    .tm-contact-card:hover { transform:translateY(-6px); box-shadow:var(--tm-shadow-hover); border-color:var(--tm-primary); }
    .tm-contact-card i { font-size:2.4rem; color:var(--tm-primary); margin-bottom:0.5rem; }
    .tm-contact-card a { color:var(--tm-primary); font-weight:500; }

    /* form */
    .tm-form-card { background:#fff; border-radius:32px; padding:2rem; box-shadow:var(--tm-shadow); border:1px solid rgba(0,0,0,0.02); }
    .tm-form-card .form-control, .tm-form-card .form-select { border-radius:16px; border:1px solid #e0e7ed; padding:0.7rem 1.2rem; }
    .tm-form-card .form-control:focus, .tm-form-card .form-select:focus { border-color:var(--tm-primary); box-shadow:0 0 0 3px rgba(25,135,84,0.15); }

    /* why panel */
    .tm-why-panel { background:var(--tm-light); border-radius:32px; padding:2rem; height:100%; }
    .tm-why-item { display:flex; align-items:center; gap:0.8rem; margin-bottom:0.8rem; }

    /* timeline */
    .tm-timeline-step { background:#fff; border-radius:40px; padding:1rem 0.3rem; box-shadow:0 8px 24px rgba(0,0,0,0.02); border-left:4px solid var(--tm-primary); text-align:center; }

    /* offices */
    .tm-office-card { background:#fff; border-radius:28px; padding:1.5rem; box-shadow:var(--tm-shadow); transition:0.2s; height:100%; border:1px solid rgba(0,0,0,0.02); }
    .tm-office-card:hover { transform:translateY(-5px); box-shadow:var(--tm-shadow-hover); }

    /* testimonial */
    .tm-testimonial-card { background:rgba(255,255,255,0.06); backdrop-filter:blur(4px); border-radius:32px; padding:2rem; border:1px solid rgba(255,255,255,0.08); color:#fff; }
    .tm-testimonial-card img { width:60px; height:60px; border-radius:60px; object-fit:cover; border:2px solid rgba(255,255,255,0.2); }





    /* floating buttons */
    .tm-float-wa { position:fixed; bottom:30px; right:30px; z-index:999; background:#25D366; color:#fff; width:60px; height:60px; border-radius:60px; display:flex; align-items:center; justify-content:center; box-shadow:0 8px 28px rgba(37,211,102,0.4); transition:0.2s; font-size:2rem; }
    .tm-float-wa:hover { transform:scale(1.08); color:#fff; }
    .tm-float-top { position:fixed; bottom:110px; right:30px; z-index:999; background:var(--tm-primary); color:#fff; width:50px; height:50px; border-radius:60px; display:flex; align-items:center; justify-content:center; box-shadow:0 6px 20px rgba(0,0,0,0.15); transition:0.2s; font-size:1.6rem; opacity:0; visibility:hidden; }
    .tm-float-top.visible { opacity:1; visibility:visible; }
    .tm-float-top:hover { transform:translateY(-4px); color:#fff; }

    @media (max-width:768px) {
      .tm-hero-contact { min-height:50vh; }
      .tm-float-wa { width:50px; height:50px; font-size:1.6rem; bottom:20px; right:20px; }
      .tm-float-top { bottom:90px; right:20px; width:44px; height:44px; font-size:1.4rem; }
    }


/* products */

/* hero */
    .tm-hero-products { position: relative; background: linear-gradient(135deg, #0f3d2a 0%, #1a6e46 100%); min-height: 50vh; display: flex; align-items: center; overflow: hidden; }
    .tm-hero-products::after { content: ''; position: absolute; inset: 0; background: rgba(0,0,0,0.30); z-index: 1; }
    .tm-hero-products .container { position: relative; z-index: 3; }

    /* product card */
    .tm-product-card-full { background: #fff; border-radius: 32px; box-shadow: var(--tm-shadow); transition: 0.3s; margin-bottom: 60px; overflow: hidden; border: 1px solid rgba(0,0,0,0.02); }
    .tm-product-card-full:hover { transform: translateY(-8px); box-shadow: var(--tm-shadow-hover); }
    .tm-product-gallery { padding: 1.5rem; background: var(--tm-light); border-radius: 32px 0 0 32px; }
    .tm-product-gallery img { border-radius: 20px; width: 100%; height: auto; object-fit: cover; transition: transform 0.4s; }
    .tm-product-gallery img:hover { transform: scale(1.03); }
    .tm-thumb-grid { display: flex; gap: 8px; margin-top: 12px; flex-wrap: wrap; }
    .tm-thumb-grid img { width: 60px; height: 60px; border-radius: 12px; object-fit: cover; border: 2px solid transparent; transition: 0.2s; cursor: pointer; }
    .tm-thumb-grid img:hover { border-color: var(--tm-primary); }
    .tm-product-badge { background: var(--tm-primary); color: #fff; padding: 0.2rem 1.2rem; border-radius: 60px; font-size: 0.7rem; font-weight: 600; display: inline-block; }
    .tm-product-code { font-family: monospace; background: var(--tm-light); padding: 0.1rem 0.8rem; border-radius: 40px; font-size: 0.8rem; }
    .tm-feature-chip { background: var(--tm-light); padding: 0.2rem 1rem; border-radius: 60px; font-size: 0.75rem; font-weight: 500; display: inline-flex; align-items: center; gap: 4px; }
    .tm-spec-table { width: 100%; font-size: 0.85rem; }
    .tm-spec-table td { padding: 0.3rem 0.5rem; border-bottom: 1px solid #f0f3f5; }
    .tm-spec-table tr:last-child td { border-bottom: 0; }
    .tm-custom-icon { background: var(--tm-light); border-radius: 16px; padding: 0.8rem 0.5rem; text-align: center; transition: 0.2s; height: 100%; }
    .tm-custom-icon:hover { background: #e8f3ee; transform: translateY(-4px); }
    .tm-advantage-check { list-style: none; padding-left: 0; }
    .tm-advantage-check li { margin-bottom: 0.4rem; display: flex; align-items: center; gap: 0.5rem; }

    /* filter bar */
    .tm-filter-bar { background: rgba(255,255,255,0.92); backdrop-filter: blur(8px); border-radius: 60px; padding: 0.5rem 1rem; box-shadow: 0 8px 28px rgba(0,0,0,0.04); border: 1px solid rgba(0,0,0,0.02); }
    .tm-filter-bar select, .tm-filter-bar input { border-radius: 60px; border: 1px solid #e0e7ed; padding: 0.3rem 1rem; font-size: 0.85rem; background: #fff; }

    /* categories icon cards */
    .tm-cat-card { background: #fff; border-radius: 24px; padding: 1.2rem 0.5rem; box-shadow: var(--tm-shadow); transition: 0.2s; text-align: center; height: 100%; border: 1px solid rgba(0,0,0,0.02); }
    .tm-cat-card:hover { transform: translateY(-6px); box-shadow: var(--tm-shadow-hover); border-color: var(--tm-primary); }
    .tm-cat-card i { font-size: 2rem; color: var(--tm-primary); }

    /* timeline */
    .tm-timeline-step { background: #fff; border-radius: 40px; padding: 1rem 0.5rem; box-shadow: 0 8px 24px rgba(0,0,0,0.02); border-left: 4px solid var(--tm-primary); text-align: center; }

    /* faq */
    .tm-faq .accordion-item { border: 0; border-radius: 16px !important; margin-bottom: 8px; box-shadow: var(--tm-shadow); }
    .tm-faq .accordion-button { border-radius: 16px !important; font-weight: 600; }
    .tm-faq .accordion-button:not(.collapsed) { background: var(--tm-light); color: var(--tm-primary); }

    /* final cta */
    .tm-cta-section { background: linear-gradient(135deg, #0f3d2a 0%, #1a6e46 100%); border-radius: 48px; padding: 4rem 2rem; position: relative; overflow: hidden; }
    .tm-cta-section::before { content: ''; position: absolute; inset: 0; background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 200 200" opacity="0.04"><path d="M60 20 L80 40 L60 60 L40 40 Z M140 80 L160 100 L140 120 L120 100 Z M30 140 L50 160 L30 180 L10 160 Z" fill="white"/></svg>') repeat; background-size: 120px; }

    

    @media (max-width: 768px) {
      .tm-product-gallery { border-radius: 32px 32px 0 0; }
      .tm-filter-bar { border-radius: 24px; flex-wrap: wrap; gap: 8px; }
    }



/* Quote */
    /* hero */
    .tm-hero-quote { background: linear-gradient(135deg, rgba(0,40,20,0.85) 0%, rgba(0,20,10,0.75) 100%), url('https://images.unsplash.com/photo-1581091226033-d5c48150dbaa?w=1400&q=80') center/cover no-repeat; padding: 5rem 0 4rem; }
    .tm-badge { background: rgba(25,135,84,0.2); backdrop-filter: blur(2px); color: #fff; padding: 0.3rem 1.2rem; border-radius: 40px; font-weight: 600; font-size: 0.85rem; border: 1px solid rgba(255,255,255,0.15); display: inline-block; }
    .tm-hero-quote h1 { font-weight: 800; font-size: 3.6rem; letter-spacing: -0.02em; }
    .tm-breadcrumb { background: transparent; padding: 0; }
    .tm-breadcrumb .breadcrumb-item a { color: #b3d9c4; text-decoration: none; }
    .tm-breadcrumb .breadcrumb-item.active { color: #fff; }

 /* timeline */
    .tm-timeline-step { background: #fff; border-radius: 20px; padding: 1rem 0.5rem; box-shadow: 0 8px 24px rgba(0,0,0,0.02); border: 1px solid rgba(0,0,0,0.02); transition: all 0.2s; height: 100%; text-align: center; }
    .tm-timeline-step i { font-size: 2.2rem; color: #198754; }
    .tm-timeline-step .connector { display: block; height: 2px; background: #198754; width: 100%; margin: 0.5rem 0; }
    /* form wizard */
    .tm-step-indicator .step { width: 40px; height: 40px; border-radius: 50%; background: #e9ecef; display: inline-flex; align-items: center; justify-content: center; font-weight: 700; color: #6c757d; transition: 0.25s; }
    .tm-step-indicator .step.active { background: #198754; color: #fff; }
    .tm-step-indicator .step.completed { background: #198754; color: #fff; }
    .tm-step-line { flex: 1; height: 3px; background: #e9ecef; margin: 0 0.5rem; }
    .tm-step-line.active { background: #198754; }
    .tm-form-card { background: #fff; border-radius: 24px; box-shadow: 0 8px 40px rgba(0,0,0,0.03); padding: 2rem; border: 1px solid rgba(0,0,0,0.02); }
    .tm-product-select-card { border-radius: 16px; border: 2px solid #e9ecef; padding: 0.8rem; transition: all 0.2s; cursor: pointer; height: 100%; }
    .tm-product-select-card:hover { border-color: #198754; transform: translateY(-4px); box-shadow: 0 12px 28px rgba(0,0,0,0.04); }
    .tm-product-select-card.selected { border-color: #198754; background: rgba(25,135,84,0.04); }
    .tm-product-select-card img { width: 100%; height: 120px; object-fit: cover; border-radius: 12px; }
    .tm-sticky-summary { position: sticky; top: 100px; }
    .tm-bg-light-gray { background: #f8fafc; }
    .tm-stat { font-weight: 800; font-size: 2.4rem; color: #198754; }
    .tm-whatsapp-section { background: #198754; color: #fff; }
    .tm-whatsapp-btn { background: #25D366; border: none; border-radius: 60px; padding: 1rem 2.5rem; font-weight: 700; color: #fff; transition: 0.2s; }
    .tm-whatsapp-btn:hover { background: #1da851; transform: scale(1.02); color: #fff; }
    .tm-footer { background: #0d2c1f; color: #d4e6db; }
    .tm-footer h5 { color: #fff; font-weight: 700; }
    .tm-footer a { color: #b3d9c4; text-decoration: none; }
    .tm-footer a:hover { color: #fff; text-decoration: underline; }
    .tm-footer .tm-social a { display: inline-block; background: rgba(255,255,255,0.06); width: 40px; height: 40px; line-height: 40px; text-align: center; border-radius: 50%; color: #b3d9c4; margin-right: 8px; transition: 0.2s; }
    .tm-footer .tm-social a:hover { background: #198754; color: #fff; }
    .tm-bottom-footer { border-top: 1px solid rgba(255,255,255,0.06); background: #0a2418; }
    .tm-testimonial { background: #198754; color: #fff; }
    .tm-testimonial img { width: 70px; height: 70px; object-fit: cover; border-radius: 50%; border: 3px solid rgba(255,255,255,0.3); }
    .tm-faq .accordion-button:not(.collapsed) { background: rgba(25,135,84,0.04); color: #198754; }
    .tm-faq .accordion-button:focus { box-shadow: none; border-color: rgba(25,135,84,0.2); }
    .tm-upload-zone { border: 2px dashed #ced4da; border-radius: 20px; padding: 2rem 1rem; transition: 0.2s; background: #fafcff; }
    .tm-upload-zone.dragover { border-color: #198754; background: rgba(25,135,84,0.03); }
    .tm-upload-list .file-item { background: #f1f3f5; border-radius: 40px; padding: 0.2rem 1rem; display: inline-flex; align-items: center; gap: 8px; margin: 4px; }
    .tm-upload-list .file-item .progress-bar { width: 60px; height: 4px; background: #e9ecef; border-radius: 4px; overflow: hidden; }
    .tm-upload-list .file-item .progress-bar span { display: block; height: 100%; background: #198754; width: 0%; }
    @media (max-width: 992px) { .tm-hero-quote h1 { font-size: 2.6rem; } .tm-sticky-summary { position: relative; top: 0; } }
    @media (max-width: 576px) { .tm-hero-quote h1 { font-size: 2rem; } .tm-form-card { padding: 1.25rem; } }
    .tm-fade-up { opacity: 0; transform: translateY(20px); animation: tmFadeUp 0.6s forwards; }
    @keyframes tmFadeUp { to { opacity: 1; transform: translateY(0); } }
    .tm-delay-1 { animation-delay: 0.1s; } .tm-delay-2 { animation-delay: 0.2s; } .tm-delay-3 { animation-delay: 0.3s; }
  </style>